@charset "utf-8";
/* CSS Document */

body {
	font-family: 'Lato',"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	font-size:1em;
	color: #FFF;
	background-color: #1D1D1D;
	margin: 0px;
	padding:0px;
}

h1,h2,h4,h5,h6 {
	font-weight:300;
}

a {
	font-family: 'Lato',"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	color: #FFFFFF;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #FFFFFF;
}
a:hover {
	text-decoration: none;
	color: #FFFFFF;
}
a:active {
	text-decoration: none;
	color: #FFFFFF;
}

img.bg, img.bg2, img.bg3, img.bg4, img.pbg4 {
	display:none;
}

/* intro items ========================================================================================*/

.video-container {
	position: absolute;
	display:block;
	overflow: hidden;
	top: 0;
	left: -5px;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.video-container iframe,  
.video-container object,  
.video-container embed {
	position: fixed;
	top: 2%;
	left: 5%;
	width: 90%;
	height: 90%;
	overflow: hidden;
}

.mobile {
	position: absolute;
	display:inline-block;
	top: 30%;
	width: 100%;
	color:rgba(192,76,15,1);
	text-align: center;
}

.hd {
	position: absolute;
	display:block;
	bottom:3%;
	right:5%;
	z-index:6;	
}

.hd-warning {
	position: absolute;
	display:none;
}

.skipper {
	position: fixed;
	bottom: 0px;
	width: 100%;
	height:6%;
	text-align:center;
	padding-bottom:5px;
	margin: 0 0 0 0;
	z-index:5;
}


/* fixed items ========================================================================================*/
.menu {
	position: fixed;
	top: -30px;
	width: 100%;
	margin: 0px;
	left: 0px;
	font-size:0.7em;
	z-index: 1000;
}

.sink {
	display: inline-block;
	-webkit-transition-duration:none;
	transition-duration: 0;
	-webkit-transition-property: none;
	transition-property: none;
	-webkit-transform: none;
	transform: none;
	box-shadow: 0 2px 0 rgba(192,76,15,1);/* green 107,143,0,1 orange 192,76,15,1*/
	width:25%;
	height:60px;
	padding: 0px;
	border:0px;
	margin:0px;
	float:right;
	background-color:#1D1D1D;
	text-align: center;
}

.sink:hover, .sink:active {
	-webkit-transform: none;
	transform: none;
	box-shadow: 0 2px 0 rgba(107,143,0,1);
}

.footer {
	position: fixed;
	bottom: 0px;
	width: 100%;
	background-color: #1D1D1D;
	font-size:0.7em;
	margin: 0 0 0 0;
	z-index:1001;
}

.phone, .email, .address {
	position: relative;
	padding: 5px;
	white-space:nowrap;
}

.phone {
	float:left;
	width: 31%;
	text-align: left;
}

.email {
	float: inherit;
	width: 67%;
	text-align: center;
}

.address {
	float: right;
	width: 31%;
	text-align: right;
}

/* Page 1 HOME index=100 ==============================================================================*/

.anchor1 {
	position:absolute;
	top:0px;
}

img.tbg {
  /* Set rules to fill background */
  z-index:100;
  min-height: 100%;
  min-width: 100%;
	
  /* Set up proportionate scaling */
  width: 100%;
  height: 100%;
	
  /* Set up positioning */
  position: absolute;
  bottom: 0;
  left: 0;
  top: 0;
}

@media screen and (max-width: 980px) { /* Specific to this particular image */
	img.bg {
    left: 50%;
    margin-left: -50%;   /* 50% */
  }
}

.logo {
	position:absolute;
	top:30%;
	left: 0px;
	width: 100%;
	text-align: center;
	z-index: 101;
}



/* Page 2 VIDEOS index=200* ========================================================================*/

.anchor2 {
	position:absolute;
	top:100%;
}

img.tbg2 {
  z-index:200;
  min-height: 100%;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 100%;
  left: 0px;
}

@media screen and (max-width: 980px) {
  img.tbg2 {
    left: 50%;
    margin-left: -50%;
  }
}

.videos {
	position: absolute;
	top: 100%;
	left: 0px;
	height: 100%;
	z-index:201;
}

.disclaimer {
	position:relative;
	left:0%;
	text-align:center;
	font-size:0.9em;
	top:10%;
	z-index:202;
}

.sections {
	position:relative;
	height:65%;
	top:15%;
	padding:0;
	text-align:center;
	overflow:auto;
	z-index:203;
}

img.parts {
	position:relative;
	float:none;
	width:80%;
	height:auto;
	max-width: 780px;
	margin-bottom:2%;
	padding:0;	
	z-index:204;
}

.parts:hover {
	background-color:none;
	box-shadow:none;
}

	

/* Page 3 BLACK CARD index=300 =========================================================================*/

.anchor3 {
	position:absolute;
	top:200%;
}

img.tbg3 {
  z-index:300;
  min-height: 100%;
  min-width: 100%;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 200%;
  left: 0px;
}

@media screen and (max-width: 980px) {
  img.tbg3 {
    left: 50%;
    margin-left: -50%;
  }
}

.blackcard {
	position:absolute; 
	top:200%; 
	left:0px; 
	width:100%;  
	height: 100%;
	z-index:301;
	font-variant:small-caps;
}
.header {
	position:relative;
	top:100px;
	padding: 12px 0 10px 0;
	background-color:rgba(255,255,255,0.1);
	text-align:center;
	z-index:302;
}

img.lifestyle {
	position:relative;
	width:100%;
	height:auto;
}

.card-container {
	position:relative;
	display:block;
	height:auto;
	top:13%;
	left:0px;
	float:none;
	text-align:center;
	z-index:303;
}
	
.card {
	position:relative;
	display:block;
	width: 70%;
	height:auto;
	left: 15%;
	max-width: 870px;
	z-index: 304;
}

.square {
	list-style-type:none;
}

.desc {
	position: relative;
	top: 15%;
	float: none;
	letter-spacing: 1px;
	text-align: center;
	font-size: 1em;
	z-index: 304;
}




/* Page 4 TESTIMONIALS index=400* ========================================================================*/

.anchor4 {
	position:absolute;
	top:200%;
}

img.tbg4 {
  z-index:400;
  display:block;
  min-height: 100%;
  min-width: 100%;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 200%;
  left: 0px;
}

@media screen and (max-width: 980px) { 
  img.tbg4 {
    left: 0%;
  }
}

.testimonials {
	display:none;
}

.testimonials-m {
	position: absolute;
	display:block;
	height: 100%;
	top: 200%;
	left: 0px;
	width: 100%;
	z-index: 401;
}

.scroll {
	position:relative;
	z-index:402;
	display:block;
	top: 10%;
	height:75%;
	overflow: auto;
}

.testimonial-list span {
	display: block;
	position:relative;
	z-index:403;
	width: 60%;
	left: 5%;
	height: 100%;
	overflow:auto;
	background-color:rgba(255,255,255,0.9);
  	border: 1px solid rgba(192,76,15,1);
  	margin-top: 50px;
  	padding: 5%;
	font-size:medium;
	color: #1D1D1D;
}

.experience {
	position:absolute;
	bottom:3%;
	width:90%;
	background-color:rgba(192,76,15,1);
	color:rgba(29,29,29,1);
	text-align:center;
	padding:5px 5% 0px 5%;
}