@charset "UTF-8";
@charset "UTF-8";
/* CSS Document */
.detailBox {
	float: left; 
	width: 100%; 	
	padding: 0 0; 
}
.detailBox h1 {
	font-size: 1.2em;
	font-weight: 300;
	
}

.detailBox a:link, .detailBox a:visited {
	text-decoration: none;
	text-transform: capitalize;
	color: #666;
	margin: 0;
	padding: 0;
}

.detailBox a:hover, .detailBox a:active, .detailBox a:focus {
	text-decoration: none;
	color: #000;	
}

.detailProductBox h2 {
	font: 1.2em/1.2; 
	text-align: left;
	padding-left: 2.5em;
	padding-top: 1em;
	font-weight: 300;
}

.mirrorDetailBox {
	width: 100%;
	padding-top: 0;
}






.boxLeft {
	float:left;
	clear: left;
	width: 100%;
	text-align: left;
	
	padding-bottom: 0;	
}

.photoBoxLeft {
width: 35%;
float:left;
padding: 1em 0; 
}

.detailMoveLeft {
	margin-left: 0;
width:100%;
background: transparent;
text-align: left;


}

.detailMoveLeftFloatRight {
	margin-left: 0;
width: 54%;
background: transparent;
text-align: left;
float: right;


}




/*Let's try organizing rows and columns*/
.rowOne {
	width: 100%;
	float: left;
}

@media only screen
and (min-width: 719px)
{	
	


.detailBox {
float: left; 
	width: 23%; 

	padding-top: 1%;
	padding-right: 2%;
	padding-left: 0;
	padding-bottom: 0;	
}

.photoBoxLeft {
width: 100%;
padding-left: 1em;
float:left;
clear: left;
padding-bottom: 1em;
}

.detailMoveLeftFloatRight {
	margin-left: 0;
width: 94%;
margin-left: 6%;

float: left;


}


.detailMoveLeft h1 {
	text-align: center;
	padding: 0;

}
.detailMoveLeft p {
	text-align: center;
	padding: 0;

}

.detailProductBox h2 {
	text-align: left;
	padding-left: 2.5em;
}

.mirrorDetailBox {
	width: 100%;
	padding-top: 9em;
}


}


#productBox {
	background: transparent;
	margin-left: 0;
	padding-top: 1.3em;
}

#productBox h2 {
	color: #000;
	font-size: 1.2em;
	font-weight: 300;
	padding-left: 2em;
	margin-top: -.4em;
}

.detailProductBox {
	
	background: transparent;
	margin-left: 0;
	margin-top: 0;
	
}

.detailProductBox h2 {
	color: #000;
	font-size: 1.4em;
	font-weight: 300;
	padding-left: 2em;
	margin-top: -2em;
	text-align: left;
	
	
}



/*Little picture and text boxes*/
.moveLeft {
margin-left: 0;
width: 100%;
background: transparent;
padding-top: 1em;  

}

.moveLeft h1 {
	color: #E03E67;
	font-size: 2em;
	
}

.moveLeft a:link {
	color: #5C95D1;
	
}

.detailMoveLeft {
	margin-left: 0;
width:100%;
background: transparent;
text-align: left;


}




/* --- Little divs inside sidebar1 */
.boxLeft {
	float:left;
	clear: left;
	width: 100%;
	background: #FFF;
	text-align: left;
	border-top: 1px solid #666;
	padding-bottom: 0;	
}


.boxLeft h1 {
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	font-size: 1.2em;
	font-weight: 300;
	margin-bottom: 0;
	padding-top: 0;
	padding-left: .9em;
	}
	.boxLeft h2 {
	font-family: Arial, Helvetica, sans-serif;
	color: #734f37;
	font-size: .9em;
	font-weight: 700;
	margin-bottom: -.8em;
	padding-top: .3em;
	padding-left: .9em;
	margin-top: -.8em;

}

.boxLeft a:link, .boxLeft a:visited {
	color: #000;
	text-decoration: none;
	font-size: .9em;
	
}

.boxLeft a:hover, boxLeft a:active, boxLeft a:focus {
	color: #000;
	
}


.boxLeft p 
{
padding-left: 1em;
padding-right: 1.8em;
color: #666;
font-size: .9em;
}

.photoBoxLeft {
width: 35%;
float:left;
padding: 1em 1em; 
}



.smartPhoneBox {
	float: left; 
	width: 100%; /* since this element is floated, a width must be given */
	background: #FFF; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 0 0; /* top and bottom padding create visual space within this div  */
}







.backToProducts {
	width:90%;
	background: #1f0907;
	text-align: center;
	border: 2px solid #52150d;
	display: block;
	margin-right:5%;
	margin-left: 5%;
	margin-top: 1em;
	-webkit-border-radius: 1em 1em 1em 1em;
-moz-border-radius: 1em 1em 1em 1em;
border-radius: 1em 1em 1em 1em;
font-size: .9em;
}

.backToProducts a:link, a:visited {
	text-decoration: none;
	color:#FC0;
	padding: .5em 0;
	display: block;
}

.backToProducts a:hover, a:active, a:focus {
	color: #FFF;
		padding: .5em 0;

}

.rowOne {
	width: 100%;
	max-width: 1800px;
	margin: 0 auto;
	/*background: #FC0;*/
	
	
}
.centerBox {
	width: 100%;
	max-width: 2000px;
	margin: 0 auto;
	background: #F00;
	
}










@media only screen
and (min-width: 840px)
{




/*.smartPhoneBox {
	float: left; 
	width: 22%; 
	background: transparent;
	padding-top: 1%;
	padding-right: 3%;
	padding-left: 0;
	padding-bottom: 0;
}*/

.smartPhoneBox {
	float: left; 
	width: 25%; 
	background: transparent;
	padding-top: 1%;
	padding-right: 3%;
	padding-left: 0;
	padding-bottom: 0;
	padding: 0;
}




#productBox {
	background: transparent;
	margin-left: 23%;
	margin-top: 0;
}



.boxLeft {
	float:left;
	clear: left;
	width: 100%;
	background: transparent;
	text-align: left;
	border-top: 0px solid #666;
	padding-top: 0;
	padding-bottom: 0;	
}

.photoBoxLeft {
width: 100%;
padding-left: 1em;
float:left;
clear: left;
padding-bottom: 1em;
}

.moveLeft {
	width: 100%;
	padding-top: 3em;
}

.detailProductBox h2 {
	
	margin-top: 0;
	
	
}














}

.little1145Wrap {
	width: 100%;
	max-width: 1145px;
	margin: 0 auto;
	
	
	
}

.crispCopyBlock  {
	width: 100%;
	background: #FFF;
	float: left;
	padding-top: 1em;
}

.crispCopyBlock p {
	padding: 0 1.5em;
}

@media only screen
and (min-width: 840px)
{

.crispCopyBlock  {
	width: 50%;
	background: #FFF;
	float: left;
	margin: 0;
	padding: 1em 1em;
	background: transparent;
	
}

.crispCopyBlock p {
	padding: 0 1.5em 0 0;
}
}

.signUpFormLine {
	width: 100%;
	float: right;
	
}


.signUpFormAttribute {
	width: 35%;
	text-align: right;
}

.signUpFormField {
	width: 55%;
	
}
.signUpFormLine {
	width: 100%;
	float: right;
	text-align: center;
	
}

.signUpFormAttribute {
	width: 100%;
	float: left;
	text-align: left;
	padding: .5em 0 0 .5em;
	background-color: #DDDDDD;
	line-height: 1.3em;
	color: #777777;
	font-size: .8em;
	text-align: center;
}
.signUpFormField {
	width: 100%;
	float: left;
	padding: .5em 0 0 .5em;
	background-color: #EEEEEE;
	font-size: .8em;
}


.iframe-container {
  overflow: hidden;
  padding-top: 56.25%;
  position: relative;
}

.iframe-container iframe {
   border: 0;
   height: 100%;
   left: 0;
   position: absolute;
   top: 0;
   width: 100%;
}

/* 4x3 Aspect Ratio */
.iframe-container-4x3 {
  padding-top: 75%;
}