@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,600,700,400,800);

html, body{ height: 100%; box-sizing: border-box; font-family: 'Open Sans'; }
*, *:before, *:after { box-sizing: inherit;}

.text-left{ text-align: left; }
.text-right{ text-align: right; }
.text-center{ text-align: center; }

.rounded-5{ border-radius: 5px; }

input[type=checkbox].opener{ display: none; }

div.container-fluid, div.container-fluid > div.row, div.container-fluid > div.row > .col-md-6{
  min-height: 100vh;
}

div.row > .left{
  background: rgb(222,223,224);
  background: linear-gradient(#fff, rgb(222,223,224) );
  
  padding-top: 2.34%;
  padding-left: 3.91% !important;
}

div.row > .left *:last-child{ margin-bottom: 0; }
.col-md-6.left .section.main .text-center.quote.up {
	background-image: inherit;

}


div.row > .left .logo{ width: 38%; padding-bottom: 4.21%; min-width: 200px; min-height: 90px; }
div.row > .left .logo img{ width: 100%;}

div.row > .right{ position: fixed; right: 0; }

.menu{
  margin-bottom: 2.34% !important;
  display: block;
}

.device-small{ display: none; }

.menu ol{
  list-style: none; 
  padding: 0; margin: 0;
}

.menu ol li{
  display: inline-block;
  padding-right: 20px;
}

.menu ol li a{
  font-size: 14px; 
  font-weight: bold;
  color: #7C7E81;  
  font-family: 'Open Sans';
}

.menu ol li a:hover{
  text-decoration: none;
  color: black;
}

.section{
  width: 90%;
  padding: 5%;
  background: white;
  margin-bottom: 2.5%;
  
  position: relative;
}

.section.main{
  padding-top: 0;
}

.section h1,
.section h2{
  color: white;
  font-family: 'Open Sans';
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 30px;  
  
  padding-left: 5%;
  padding-right: 5%;
}

.section h1{ height: 50px; line-height: 25px; font-size: 25px; padding-top:12px; position:relative; }
.section h2{ height: 36px; line-height: 18px; font-size: 18px; padding-top:8px; }
.section h2 a{ color: white; }

.section .overlay{ margin-left: -10%; margin-right:-10%; }

.section .green{
  background: rgb(153,204,0);
  background: linear-gradient(90deg, rgb(153,204,0) 40%, rgb(193,250,0) );  
}

.section h1:before,
.section h1:after{
  content: '';
  display: block;
  position: absolute;
  top: 50px;
  height: 0;
  width: 0;
  border-left: 1.5vw solid transparent;
  border-right: 1.5vw solid transparent;
}

.section .green:before,
.section .green:after{
  border-top: 1.5vw solid #89b535;
}

.section .blue:before,
.section .blue:after{
  border-top: 1.5vw solid #3972a1;
}

.section h1:before{ left: 0;clip: rect(0px 1.5vw 1.5vw 0px);}
.section h1:after{ right: 0;clip: rect(0px 3vw 1.5vw 1.5vw);}

.section .blue{
  background: rgb(5,156,255);
  background: linear-gradient(90deg, rgb(5,156,255), rgb(101, 204, 255) );
}

.section .orange{
  background: rgb(255, 153, 0);
  background: linear-gradient(90deg, rgb(255, 153, 0), rgb(255,204,0) );
}

.section .red{
  background: rgb(255, 0, 5);
  background: linear-gradient(90deg, rgb(255, 0, 5), rgb(255,100,100) );  
}

.section a.red,
.section .red a{ color: white; }

.section a.red{
  padding: 5px 10px;
  font-size:1.2em;
}


/*.section .quote a:not(.instantquote){
  display: inline-block;
  margin: 5px 20px; 
}

.section .quote .instantquote{
  color: black !important; 
  font-size: 1.2em;
}

.section .quote .instantquote:hover{
  color: #666 !important; 
}

.section .quote .instantquote-arrow{
  content: '';
  display: inline-block; 
  
  height: 0;
  width: 0;
  
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-right: 10px solid #333;
  
  position:relative;
  
  margin-left: -13px; 
  margin-right: 8px;
}

.section .quote .instantquote-small{ display: none; }
*/

.section .quote .name{
  display: block;
  font-size: 0.9em;
  padding: 5px; 
}
.section .quote .on-sale{
  display: block;
  font-size: 12px;
  padding: 5px;
  color:red;
}


.section .quote img{ height: 50px; width: 50px;margin: 0 auto;display: block;}

.section .quote img[class^="new"] {
	height:auto;
	width: 70px;
}

.section .quote a{
	display: inline-block;
	color: #666;
	font-weight: bold;
	text-align: center;
	min-width: 14%;
	vertical-align: top;
	background: no-repeat;
}

.section .up a{ width: 48%; }
/*
.section .up a #pet{width: 25%; }
.section .up a #travel{width: 24%; }
.section .up a #earthquake{width: 23%; }
*/

.section .quote a:hover{ text-decoration: none; } 
.section .quote a:hover .name{ color: #333; }

div.section input.postalcode{ 
  background-color: #e3e2e1; 
  padding: 8px; 
  border:none; 
  font-size:10pt;
  width: 200px; 
  height:32px; 
  line-height: 16px;
  vertical-align: top; 
}

div.section input.postalcode::-webkit-input-placeholder,
div.section input.postalcode::-webkit-input-placeholder,
div.section input.postalcode::-webkit-input-placeholder,
div.section input.postalcode::-webkit-input-placeholder{ color: #999; }
        
div.section button.postalcode{ 
  border:none;
  background-color:#e3e2e1;
  padding:6px;
  height:32px;
  font-size:12pt;
  font-weight:bold;
  cursor:pointer; 
}

div.section button.location{
  border: none;
  color: white;
  padding: 10px;
  font-size: 1.2em;
  font-weight: bold;
  text-transform: uppercase;
  border-radius: 5px;
  background-color: #19398A;
}

div.section button.location span{
  display: inline-block;
  width: 75%;
  vertical-align: middle;
  text-align: right;
}

div.section button.location img{
  height: 40px;
  display: inline-block;
  vertical-align: middle;
  padding-left: 13px;
}

.section.compressed{
  padding: 1% 3%;
}
        
.section > ol.footer{
  list-style:none;
  margin: 0; padding: 0;
}

.section > ol.footer li{
  display: inline-block;
  padding-right: 14px;
  font-size: 10px;
  line-height: 40px;
  
  position:relative;
}

.section > ol.footer li a,
.section > ol.footer li label{ 
  color: rgb(124,126,129); 
  text-decoration: none; 
  font-family: 'Open Sans'; 
  cursor: pointer;
  font-weight: normal;
}


.col-md-6.left .section.main .text-center.quote.down1{
  padding-top:  50px;
  background: url(../../images/Buy_Now.jpg) no-repeat left top;
  background-size: 85px auto;
}

.col-md-6.left .section.main .text-center.quote.down{
  padding-top:  63px;
  background: url(../../images/Request_Quote.jpg) no-repeat left top;
  background-size: 125px auto;
}
.col-md-6.left .section.main .text-center .quote #new{
	background: url(../../images/New.jpg) no-repeat top;
	
}

.section > ol.footer li a:hover,
.section > ol.footer li label:hover{ color: black; }

.section > ol.footer input[type=checkbox]{ display: none; }
.section > ol.footer input[type=checkbox] ~ ol{
  display: none;
  position:absolute;
  bottom: 40px;
  left: -15px;
  
  background-color: white;
  padding: 5px;
  border: 2px solid #e3e2e1;
}

.section > ol.footer input[type=checkbox]:checked ~ ol{
  display: block;
}

.section > ol.footer input[type=checkbox] ~ ol li{
  white-space: nowrap;
  width:100%;
  padding: 0;
}

.section > ol.footer input[type=checkbox] ~ ol li a{
  display: block;
  white-space: nowrap;
  padding:0 10px;
  width: 100%;
}

.section > ol.footer input[type=checkbox] ~ ol li a:hover{
  background-color: #333;
  color: white;
}

button.closeForm{
  height: 25px;
  width: 25px;
  color: white;
  background-color: #999;
  border-radius: 5px;
  display: block;
  text-align: center;
  position: absolute;
  right: 5%;
  top: 2.5%;
  z-index: 6;
  outline: 0;
  border: 0;
  padding: 0;
}

button.closeForm:hover{ background-color: #666; }

div.social{
  position:absolute;
  right: 10px;
  bottom: 10px;
}

@media all and (max-width: 1440px){
  div.social{
    position:absolute;
    right: 0;
    bottom: 0;
    transform: translateY(130%);
  }
  
  .section ~ p{
    padding-bottom: 30px;
  }
  .section .down a {
		width: 15%;
  }
}

@media all and (max-width: 990px){
  div.section.main{ margin: 2.5%; width: 95%; padding-bottom:30px; }
  div.section.compressed{ margin: 2.5%; width: 95%; }
  
  div.section.main p.text-center{ text-align: center; max-width: inherit; }
  div.section.main p.text-center a{ display: inline-block;  }
/*  div.section.main p.text-center span.instantquote-arrow{ display: inline-block; }
  div.section.main p.text-center a.instantquote{ position:relative; display: inline-block; top:0;}
  div.section.main p.text-center a.instantquote-small{ display: none; } 
  div.section.main p.up a{ display: inline-block; width: 28%; }*/
  
  div.section.main h1:before,
  div.section.main h1:after{
    border-left-width: 3.1vw;
    border-right-width: 3.1vw;
    border-top-width: 3.1vw;
  }
  
  div.section.main h1:before{ clip: rect(0 3.1vw 3.1vw 0); }
  div.section.main h1:after{ clip: rect(0 6.1vw 3.1vw 3.1vw); }
  
  .section > ol.footer{
    padding: 10px 0;
  }
  
  .section > ol.footer li{
    line-height: 20px;
  }
  
  div.row > .right,
  div.row > .right .form{
    top: 0; left: 0; right: 0;
  }
  
  div.row > .right{
    min-height: 100vh;
    background-color: rgba(0,0,0,0.7);
  }
  
  div.row > .right .form{
    margin: 0;
    
    position: absolute;
    top: 10px;
    bottom: 10px;
    overflow: auto;
  }
  
  div.row > .right .form:before,
  div.row > .right .form:after{
    display:none;
  }
  
  div.row > .right .form .inner{ 
    max-height: inherit; 
  }
  
  div.slideshow, div.slideshow-header{
    display: none; 
  }
  
}

/* @media all and (max-width: 732px){
  div.section.main p.text-center{ text-align: left; }
  div.section.main p.text-center a{ display: block; width: 100%; }
  div.section.main p.text-center span.instantquote-arrow{ display: none; }
  div.section.main p.text-center a.instantquote{ position:absolute; top:4px; }
  
  div.section.main p.text-center{ max-width: 400px; margin: 0 auto; }
}*/

@media all and (max-width: 532px){
  .device-small{ display: initial; }
  .device-large{ display: none; }
  
  .menu .device-small{
    font-weight: bold;
    font-family: 'Open Sans';
    
    display: block;
    width: 95%; 
    margin: 2.5%;
    
    padding: 2%; 
   
    background-color: white; 
    border: 2px solid #e2e1e0;
    
    cursor: pointer;
  }
    
  .menu input.opener ~ ol{ display: none; }
  .menu input.opener:checked ~ ol{ display: block; }
  
  .menu ol{
    width: 95%;
    margin: 2.5%;
    
    border: 2px solid #e2e1e0;
    background-color: white; 
  }
  
  .menu ol li{ 
    display: block; 
    padding-right: 0;
  }
  
  .menu ol li a{ display: block; width: 100%; padding: 2%; }
  
  .menu ol li a:hover{
    background-color: #333;
    color: white;
  }
  
  .section h1 {
    font-size: 16px;
    padding-top: 8px;
  }
  .section .quote a{

	min-width: 25%;
 }
}



@media all and (max-width: 490px){
/*  div.section.main p.text-center a.instantquote{ display: none; }
  div.section.main p.text-center a.instantquote-small{ display: block; }
  
  div.section.main h2.orange{ font-size: 15px; }
  div.section.main h2.orange span.remove-small{ display: none; }*/
}