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


body   
{
   	background: url(../images/background.png)repeat left top;
	text-shadow: none;
	font-family: 'Quando', serif !important;
	color: #000000;
	font-size: 12px;
	line-height: 1.5em;
	padding:0px !important;
}
.main-wrapper
{
	width:100%;
	height:100%;
	background: #dcebf3;
	box-shadow: 0 0 5px #666;
}
.main
{
	margin:0 30px;
}
.center
{
    text-align:center;
}
.page-title
{
	background: url(../images/page-title.png)no-repeat 0 0;
	height: 244px;
	background-size: 100%;
	line-height: 170px;
	margin-left: -137px;
	margin-right: -136px;
	margin-bottom: 0;
	color: #fff;
	font-weight: 900;
	font-family: 'Quando', serif;
}

.arrow
{
    
    color:#d61f26;
}
.arrow h2
{
    background: url("../images/subtitle-background.png");
	background-size: 100%;
	background-repeat: no-repeat;
	height: 90px;
	margin-left: -167px;
	margin-right: -166px;
	padding: 0px 22px;
	padding-left: 195px;
	line-height: 70px !important;
	background-position: left center;
	color: #162a43;
	text-shadow: 1px 0px 0px #162a43;
	font-size:23px;
	font-family: 'Quando', serif;
}
h2
{
	font-family: 'Quando', serif !important;
	font-size:26px !important;
	line-height: 35px !important;
}
h2.productHeader{
	margin-top:45px;	
}
.content
{
    padding:0px 22px;
    width:100%;
}

.textbox
{
    width:100%;
    height:45px;
    background: rgba(128,197,237,0.8);
    box-shadow: inset 0 0 3px #222;
    margin:20px 0px;
	border: none;
	line-height: 10px;
	font-size: 20px;
	padding: 0 5px;
}
.textboxmid
{
    width:100%;
    height:150px;
    background: rgba(128,197,237,0.8);
    box-shadow: inset 0 0 3px #222;
    margin:20px 0px;
	border: none;
	font-size: 20px;
	padding: 0 5px;
}
.textbox2
{
    width:100%;
    height:300px;
    background: rgba(128,197,237,0.8);
    box-shadow: inset 0 0 3px #222;
    margin:20px 0px;
	border: none;
	font-size: 20px;
	padding: 0 5px;
}
.textbox3
{
    width:100%;
    height:550px;
    background: rgba(128,197,237,0.8);
    box-shadow: inset 0 0 3px #222;
    margin:20px 0px;
	border: none;
	font-size: 20px;
	padding: 0 5px;
}
.radiotxt
{
    color: inherit;
    font-weight: 300;
    line-height: 1.1;
    font-size:20px;
    line-height:45px;
	font-family: 'Quando', serif;
    }
 input[type="radio"], input[type="checkbox"]
 {
     height:22px;
     width:30px;
 }
 
 .chkboxtxt
 {
     color: inherit;
    font-weight: 300;
    line-height: 1.1;
    font-size:20px;
    line-height:84px;
	font-family: 'Quando', serif;
 }
 label
 {
     font-weight:normal !important;
 }
 .stockimages 
 {
     border:3px solid #cdcdcd;
     float:left;
     margin:3px;
     cursor:pointer;
     width:203px;
 }
 .productimages 
 {
     border:3px solid #cdcdcd;
     margin:0px 3px 6px 3px;
     cursor:pointer;
     width:203px;
 }
 .selected 
 {
     border:3px solid #162a43 !important;
     opacity:0.8;
     
 }
 div.left 
 {
     float:left;
 }
 .productholder
 {
	 position:relative;
	 margin-bottom: 35px;
 }
 .productholder span
 {
     display:block;
     background-color:#162a43;
	 color:#fff;
     width:203px;
     margin:0px 3px;
     text-align:center;
     padding:3px 0px;
	 font-family: 'Quando', serif;
	 position: absolute;
	 bottom: -23px;
 }
  .cp-full1, .cp-full2, .cp-full3, .cp-full4
 {
	 width: 79%;
     float: left;
 }
 .cp-full1-txtbox, .cp-full2-txtbox, .cp-full3-txtbox, .cp-full4-txtbox
 {
	 width: 20%;
	 float: left;
	 height: 45px;
	 margin: 20px 0;
 }
 #colorholderdiv1, #colorholderdiv3 {
 	 padding: 0px 1% 0px 0px;
 }
 #colorholderdiv1, #colorholderdiv2, #colorholderdiv3, #colorholderdiv4
 {
	 width: 49%;
	 float: left;
	 min-width: 520px;
 }
 #Submitbtn {
	 font-size: 20px;
	 font-family: 'Quando', serif;
 }
 @media (max-width: 767px) {
  .container
  {
	max-width: 80%;
  }
  .page-title
  {
	color:#162a43;
	background:none;
	line-height: 40px;
	font-size: 22px;
	margin:0;  
  }
  .arrow h2
  {
	background:none;
	margin:0;
	padding-left: 20px;
	font-size: 20px;
	border-bottom: 1px solid #222;
	line-height: 24px;
	height: auto;
  }
  h2
  {
	  font-size: 20px !important;
  }
 }
 @media (min-width: 768px) {
  .arrow h2
  {
	margin-left: -115px;
	margin-right: -115px;
  }
  .page-title
  {
	margin-left: -85px;
	margin-right: -85px;
	line-height: 120px;
  }
 }
@media (min-width: 992px) {
  .arrow h2
  {
	margin-left: -138px;
	margin-right: -137px;  
  }
  .page-title
  {
	margin-left: -107px;
	margin-right: -107px;
	line-height: 140px;
  }
  .container
  {
	width: 940px !important;
  }
 }
 @media (min-width: 1200px) {
  .arrow h2
  {
	margin-left: -167px;
	margin-right: -166px;
  }
  .page-title
  {
	margin-left: -137px;
	margin-right: -136px;
	line-height: 170px;
  }
  .container
  {
	width: 1180px !important;
  }
 }
 .framework-container
 {
	 display:inline-block;
 }
 .framework-container.alt {
	 margin-top:35px; 
 }