html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}
body {
  -webkit-font-smoothing: antialiased;
  background: #FFF;
}
hr { 
    height: 5px;
    visibility: hidden;
    color: #FFF;
}

/* Font Smoothing
----------------------------------- */

h1, p, { 
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/*  Flex Positioning
----------------------------------- */

.flex-box-center { 
	display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    box-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    box-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
    -ms-flex-pack: center;
}

/*  Section_** Logo-area **
----------------------------------- */

.logo { 
    position: absolute;
    left: 0;
    top: 40px;
    width: 100%;
    text-align: center;
    z-index: 9999999;
}
.logo svg { 
    max-width: 380px;
}

/*  Splash
----------------------------------- */

.main-container { 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}
.splash { 
    width: 100%;
    height: 100%;
    background: #FFF;
    position: absolute; 
    top: 0;
    left: 0;
    float: none;
    cursor:s-resize;
    z-index: 999999999999999;
	-webkit-transition-duration: 400ms;
    transition-duration: 400ms;
    transform: translateY(0);
    -webkit-transform: translateY(0); 
	padding: 0 30px;
	box-sizing: border-box;
}
.splash-img { 
	max-width: 100%;
	box-sizing: border-box;
} 
.move { 
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%); 	
}
#title {
   position: absolute;
   bottom: 40px;
   left: 0;
   width: 100%;
   text-align: center;
   z-index: 9999;
}
#title h3 { 
   font-size: 18px;
   font-family: "Times New Roman", Times, serif;
   letter-spacing: 0;
   color: #000;
}
.main-page {
    width: 100%;
    position: relative;
    float: none;
    top: 0;
    left: 0;
	-webkit-transition-duration: 400ms;
    transition-duration: 400ms;
	 transform: translateY(100%) !important;
    -webkit-transform: translateY(100%) !important; 	
}
.movey { 
	 transform: translateY(0) !important; 
    -webkit-transform: translateY(0) !important; 	
}



/*  Section_** Containers **
-------------------------------------------- */

.right { 
	position: absolute;
	top: 0;
	right: 0;
	width: 50vw;
	height: 100%;
	padding: 60px;
	background: none;
    box-sizing: border-box;
}
.left { 
	position: absolute;
	top: 0;
	left: 0;
	width: 50vw;
	height: 100%;
    background: none;
    padding: 60px;
    box-sizing: border-box;
}
.fullscreen { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100%;
    background: none;
    box-sizing: border-box;
}
.mob {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: none;
	box-sizing: border-box;
	padding: 80px 30px;
}
.mob-img { 
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
    background: none;
    box-sizing: border-box;	
}
.mob-logo svg { 
	max-width: 100%;
}
ul.mobile-nav {
    position: fixed;
    list-style: none;
    width: 100%;
	left: 0;
    bottom: 0;
    background: #FFF;
    z-index: 999999;
    text-align: center;
	padding: 20px;
	box-sizing: border-box;
}
ul.mobile-nav li { 
    display: inline-block;
    padding: 5px 10px;
}
ul.mobile-nav li a { 
    font-size: 15px;
}
#reddy { 
    position: absolute;
    top: 700px;
    left: 0;
    z-index: 99999999999999;
    width: 200px;
    height: 100px;
    background: red;
}

/*  Section_** Title **
-------------------------------------------- */

.text-area { 
	max-width: 550px;
}
.title { 
    margin: 0 0 20px 0;
	text-align: center;
}
.title h1 { 
    font-family: "Times New Roman", Times, serif;
    font-size: 18px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    margin-bottom: 5px;
    color: #000;    
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (   min--moz-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (     -o-min-device-pixel-ratio: 2/1) and ( max-width: 2000px),
only screen and (        min-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (                min-resolution: 192dpi) and ( max-width: 2000px),
only screen and (                min-resolution: 2dppx) and ( max-width: 2000px) { 
	.title h1 { 
		font-size: 16px;  
	}
}
.title h3 { 
    font-family: "Times New Roman", Times, serif;
    font-size: 16px;
    letter-spacing: 0;
    font-style: italic;
    color: #000;
}
.mob p { 
	font-family: "Times New Roman", Times, serif;
	font-weight: normal;
    color: #000;
    text-align: center;
    font-size: 16px;
    line-height: 25px;
}
p {
	font-family: "Times New Roman", Times, serif;
	font-weight: normal;
    color: #000;
    text-align: center;
    font-size: 16px;
    line-height: 24px;
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (   min--moz-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (     -o-min-device-pixel-ratio: 2/1) and ( max-width: 2000px),
only screen and (        min-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (                min-resolution: 192dpi) and ( max-width: 2000px),
only screen and (                min-resolution: 2dppx) and ( max-width: 2000px) { 
	p { 
	font-size: 16px;
    line-height: 25px;
	}
}
a {
    font-family: "Times New Roman", Times, serif;
    color: #000;
    text-align: center;
    font-size: 18px;
    line-height: 24px;
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (   min--moz-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (     -o-min-device-pixel-ratio: 2/1) and ( max-width: 2000px),
only screen and (        min-device-pixel-ratio: 2) and ( max-width: 2000px),
only screen and (                min-resolution: 192dpi) and ( max-width: 2000px),
only screen and (                min-resolution: 2dppx) and ( max-width: 2000px) { 
    a {
        font-size: 16px;
        line-height: 16px;
    }
}
a:hover {
    color: #666;
}
p.pricing { 
	max-width: 240px;
}

/*  Pages **
-------------------------------------------- */

#section0 .right { 
	background: url(images/one.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
#section1 .left { 
	background: url(images/two.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
#section2 .right { 
	background: url(images/three.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
#section3 .right { 
	background: url(images/four.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
#section4 .left { 
	background: url(images/five.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
#section5 .fullscreen { 
	background: url(images/fullscreen.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
#section6 .left { 
	background: url(images/seven.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
#section7 .right { 
	background: url(images/six.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
#section8 .left { 
	background: url(images/eight.jpg) no-repeat center center;
		  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}

@media only screen and (-Webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {
    #section0 .right { 
        background: url(images/one-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;		
    }
    #section1 .left { 
        background: url(images/two-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;		
    }
    #section2 .right { 
        background: url(images/three-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;		
    }
    #section3 .right { 
        background: url(images/four-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;		
    }
    #section4 .left { 
        background: url(images/five-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;		
    }
    #section5 .fullscreen { 
        background: url(images/fullscreen-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;		
    }
    #section6 .left { 
        background: url(images/seven-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;		
    }
    #section7 .right { 
        background: url(images/six-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
    }
    #section8 .left { 
        background: url(images/eight-high-res.jpg) no-repeat center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;		
    }    
}


/*  Pages - Mobile **
-------------------------------------------- */

#one .mob-img { 
	  background: url(images/one.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}
#two .mob-img { 
	  background: url(images/two.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}
#three .mob-img { 
	  background: url(images/three.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}
#four .mob-img { 
	  background: url(images/four.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}
#five .mob-img { 
	  background: url(images/five.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}
#six .mob-img { 
	  background: url(images/six.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}
#seven .mob-img { 
	  background: url(images/seven.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}
#fullscreen .mob-img { 
	  background: url(images/fullscreen.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}
#eight .mob-img { 
	  background: url(images/eight.jpg) no-repeat center center;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;	
}

@media only screen and (-Webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {
	#one .mob-img { 
		  background: url(images/one-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	}
	#two .mob-img { 
		  background: url(images/two-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	}
	#three .mob-img { 
		  background: url(images/three-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	}
	#four .mob-img { 
		  background: url(images/four-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	}
	#five .mob-img { 
		  background: url(images/five-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	}
	#six .mob-img { 
		  background: url(images/six-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	}
	#fullscreen .mob-img { 
		  background: url(images/fullscreen-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	}
	#seven .mob-img { 
		  background: url(images/seven-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	}
	#eight .mob-img { 
		  background: url(images/eight-high-res.jpg) no-repeat center center;
	      -webkit-background-size: cover;
	      -moz-background-size: cover;
	      -o-background-size: cover;
	      background-size: cover;	
	} 
}

/*  Devices **
-------------------------------------------- */

#handcraft { 
    position: absolute;
    top: 700px;
    left: 0;
    width: 10px;
    height: 10px;
    background: red;
    z-index: 999999999999;
}

.desktop { 
	display: block;
}
.mobile { 
	display: none;
}
.header-mob {
	display: none;
}
.logo-mob svg {
	width: 100%;
	max-width: 320px;
}
.splash-img { 
    display: block;
}
.splash-mob { 
    display: none;
}
@media (max-width: 900px) { 
	.splash { 
		display: none;
	}
    .splash-img { 
        display: none;
    }
    .splash-mob { 
        display: block;
        max-width: 100%;
    }
    .main-page { 
		display: none !important;
		z-index: -1;
		pointer-events: none;
	}
	.desktop { 
		display: none;
	}
	.mobile { 
		display: block;
        z-index: 9999999;
		/* -webkit-transition-duration: 400ms;
	    transition-duration: 400ms;
		 transform: translateY(100%) !important;
	    -webkit-transform: translateY(100%) !important;
	}
	.move-mob { 
		 transform: translateY(0) !important; 
	    -webkit-transform: translateY(0) !important;*/ 	
	}
	#title {
	   bottom: 40px;
	}
	#fp-nav { 
		display: none;
	}
	.logo { 
		display: none;
	}
	.splash { 
		z-index: 99999999;
	}
	.header-mob {
		display: block;
		position: fixed;
		padding: 20px;
		background: #FFF;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 99999998;
		box-sizing: border-box;
	}
}

/*  Nav **
-------------------------------------------- */

ul#site-menu li a { 
    font-size: 14px;
}

ul#site-menu li.active a { 
    color: #555 !important;
}

#site-menu {
    position: fixed;
    list-style: none;
    width:50%;

    left:50%;
    margin-left: -25%;

    bottom:40px;
    z-index:999999;

    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;

    -webkit-justify-content: space-around;
    -moz-justify-content: space-around;
    -ms-justify-content: space-around;
    -o-justify-content: space-around;
    justify-content: space-around;
    -ms-flex-pack: space-around;

    display: flex;
    justify-content: space-around;
}

@media screen and (max-width: 900px) {
    #site-menu {
        display: none;
    }
}
@media screen and (min-width: 900px) { 
    ul.mobile-nav {
        display: none;
    }
}