html {font-family: 'Helvetica Neue', 'Roboto', Helvetica, Arial, 'Lucida Grande', sans-serif; overflow-x:hidden; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; font-weight:400; font-size:15px; line-height:1.4; color:#898989; background:#f2f2f2;}
html.ie-lt9 {overflow:auto;}

body {overflow-x:hidden;}
.ie-lt9 body {min-width:1024px;}

a {color:#00a9e0; outline:none;}
a:hover, a:active {color:#51d4ff;}
/*  j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color:#00a9e0;} 

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background:#00a9e0; color:#fff; text-shadow:none;}
::selection {background:#00a9e0; color:#fff; text-shadow:none;} 

ins {background-color:#00a9e0; color:#898989; text-decoration:none;}
mark {background-color:#00a9e0; color:#898989; font-style:italic; font-weight:700;}


h1, h2, h3, h4, h5, h6 {font-weight:300; line-height:1.2; color:#5a585d; word-wrap:break-word;}
h1 {font-size:36px; margin-bottom:20px;}
h2 {font-size:32px; margin-bottom:18px;}
h3 {font-size:25px; margin-bottom:16px;}
h4 {font-size:22px; margin-bottom:16px;}
strong, b {font-weight:700;}
em, i {font-style:italic;}

/*Background Classes*/
.background-cover {-webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.background-contain {-webkit-background-size:contain; -moz-background-size:contain; -o-background-size:contain; background-size:contain; background-position:center center; background-repeat:no-repeat;}

/*Force Hardware Acceleration on Webkit*/
.webkitForceHardwareAcceleration() {-webkit-transform:translate3d(0, 0, 0); -webkit-backface-visibility:hidden; -webkit-perspective:1000;}


#page-wrapper {max-width:1500px; margin:0 auto;}


/*Header*/
#header {position:fixed; width:100%; max-width:1500px; margin:0 auto; background:#fff; min-height:100px; z-index:100;}
#header-inner {max-width:1000px; margin:0 auto; position:relative; padding:15px 40px;}
#logo {display:block; width:155px; float:left;}
#logo img {display:block;}
#main-nav {float:right; width:60%; display:block;}
#main-nav ul {display:table; width:100%; height:70px;}
#main-nav li {display:table-cell; text-align:center; vertical-align:middle;}
#main-nav a {font-size:14px; line-height:1; text-transform:uppercase; color:#898989; font-weight:400; text-decoration:none; display:block;}
#main-nav a:hover, #main-nav a:active {color:#5a585d;}

/*Mobile Nav*/
#mobile-menu-trigger {display:block; width:40px; float:right; padding-top:7px; display:none;}
#mobile-menu-trigger img {display:block;}
#mobile-nav {display:none;}
#mobile-nav li {border-bottom:1px solid #ddd; text-align:center; padding:40px 20px;}
#mobile-nav a {text-decoration:none; display:block; font-weight:400; color:#898989; text-transform:uppercase; line-height:1; font-size:15px;}



/*General Section Rules*/
.page-section {padding:140px 40px; position:relative;}
.section-header {margin:0 auto; max-width:800px; text-align:center;}
.section-header.light-text, .section-header.light-text h1, .section-header.light-text h2, .section-header.light-text h3 {color:#fff;}
.section-header.dark-text h1 {color:#5a585d;}
.section-header p {padding-bottom:20px;}

.section-link-wrapper {width:300px; height:50px; position:absolute; bottom:-25px; left:50%; margin-left:-150px; z-index:99;}
.section-link-inner {position:relative; height:100%; text-align:center;}
.section-link {display:table; border-radius:50px; overflow:hidden; height:100%; margin:0 auto; width:auto; text-decoration:none; line-height:1; font-size:14px; color:#5a585d; background:#f2f2f2;}
.section-link:hover, .section-link:active {color:#5a585d;}
.section-link img {width:36px; min-width:36px; margin:7px 8px; display:block;}
.section-link span {display:table-cell; text-transform:uppercase; margin:7px 8px; vertical-align:middle; padding:0 30px 0 10px;}
.section-link:hover span, .section-link:active span, .section-link:hover img, .section-link:active img {opacity:.8;}

.content {color:#5a585d;}
.content p {padding-bottom:20px;}
.content ul {list-style:disc outside; margin-left:20px; padding-bottom:20px;}
.content p+ul {margin-top:-15px; padding-bottom:20px;}
.content ol {margin-left:20px; padding-bottom:20px;}
.content p+ol {margin-top:-15px; padding-bottom:20px;}
.content li {padding-bottom:3px;}
.content a {text-decoration:underline; font-weight:700px; color:#000;}



/*Heros*/
.hero {padding:300px 40px 200px 40px;}
.hero h1 {font-size:42px;}
.hero p {font-size:17px;}
#home-hero {background-image:url('../img/hero_bg.jpg');}



/*Why Protective*/
#why-protective {background-color:#f2f2f2; padding-bottom:20px;}

/*SVG Car Illustration*/
svg {pointer-events:none;}
.car-illustration {position:relative; max-width:1000px; margin:0 auto;}
/*We'll let the image size be the base and determining factor for resizing of the svg
This should provide the most flexible method for scaling and already has a built-in fallback for IE8 (no opacity)*/
.car {position:relative; height:auto; max-width:100%; opacity:0;}
.car.show, .line-drawing.show {opacity:1;}
.car.hide, .line-drawing.hide {opacity:0;}
.line-drawing {position:absolute; top:0; left:0; max-height:100%;}
.line-drawing, .car {-webkit-transition:opacity 1s; -moz-transition:opacity 1s; -o-transition:opacity 1s; transition:opacity 1s;}
.line-drawing path {fill:none; stroke:#898989; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; stroke-miterlimit:10;}

.car-plus {display:block; position:absolute; zoom:1; opacity:0; -webkit-transition:all .7s; -moz-transition:all .7s; -o-transition:all .7s; transition:all .7s; -ms-transform:translate(0, 80px); -webkit-transform:translate(0, 80px); transform:translate(0, 80px);}
.car-plus.show {opacity:1; -ms-transform:translate(0, 0); -webkit-transform:translate(0, 0); transform:translate(0, 0);}
.car-plus img {display:block; width:100%;}
.car-plus#engine-front {width:10%; right:25%; bottom:40%;} 
.car-plus#engine-back {width:6%; right:35%; bottom:60%;} 
.car-plus#car-back {width:8%; left:15%; bottom:60%;} 
.car-plus:hover, .car-plus:active {-webkit-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2);}

/*Overlay*/
#overlay {position:fixed; top:0; bottom:0; right:0; left:0; background:url('../img/overlay_bg.png') repeat top left; background:rgba(90,88,93,.8); visibility:hidden; z-index:101; padding:40px; overflow:auto; opacity:0; -webkit-transition:all .7s; -moz-transition:all .7s; -o-transition:all .7s; transition:all .7s;}
#overlay.show {visibility:visible; opacity:1;}
#modal {max-width:1000px; margin:0 auto; background:#5a585d; opacity:0; margin-top:-120px; -webkit-transition:all .7s; -moz-transition:all .7s; -o-transition:all .7s; transition:all .7s;}
#modal.show {opacity:1; margin-top:0;}
#modal-header {position:relative; border-bottom:1px solid #4d4d51; padding:40px 60px 40px 40px;}
#modal-header h2, #modal-header span {color:#fff;}
#modal-header h2 {margin-bottom:5px;}
#modal-close {width:30px; display:block; position:absolute; right:20px; top:20px;}

/*Flexslider*/
.flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline:none;}
.slides, .flex-control-nav, .flex-direction-nav {margin:0; padding:0; list-style:none;}
.flexslider {margin:0; padding:0;}
.flexslider .slides > li {display:none; -webkit-backface-visibility:hidden;}
.flexslider .slides img {width:100%; display:block;}
.flex-pauseplay span {text-transform:capitalize;}
.slides:after {content:"."; display:block; clear:both; visibility:hidden; line-height:0; height:0;}
html[xmlns] .slides {display:block;}
* html .slides {height:1%;}
.no-js .slides > li:first-child {display:block;}
.flexslider {background:#5a585d; position:relative; zoom:1; padding-bottom:60px;}
.flex-viewport {max-height:2000px;}
.loading .flex-viewport {max-height:300px;}
.flexslider .slides {zoom:1;}
.carousel li {margin-right:5px;}

#flexslider-navigation-control-wrapper {height:60px; border-top:1px solid #4d4d51; position:absolute; bottom:0; left:0; width:100%;}
#flexslider-navigation-control-wrapper a  {display:block; position:absolute; top:15px; width:30px; height:30px; position:absolute; z-index:10; overflow:hidden; cursor:pointer;}
#flexslider-navigation-controls {position:relative; height:100%;}
#flexslider-navigation-controls .previous {left:20px;}
#flexslider-navigation-controls .next {right:20px;}

.flexslider .slides li .slide-inner {display:block; padding:30px 40px; font-size:24px; color:#fff; font-weight:200; line-height:1.1;}
.flexslider .slides li .slide-inner li {padding-bottom:10px;}

.flexslider #slide_one {background:url('../img/slide_1.png') no-repeat right center; -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover;}
.flexslider #slide_two {background:url('../img/slide_2.png') no-repeat right center; -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover;}
.flexslider #slide_three {background:url('../img/slide_3.png') no-repeat right center; -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover;}



/*Full Width Quotes*/
.full-width-quote {background:#5a585d; padding:75px 40px; position:relative;}
.full-width-quote-inner {max-width:1000px; margin:0 auto; color:#fff; text-align:center;}
.full-width-quote-inner h2 {color:#fff;}
.full-width-quote-inner p {font-weight:300; font-size:19px;}
.full-width-quote .section-link {color:#fff; background:#5a585d;}
.full-width-quote .section-link:hover, .full-width-quote .section-link:active {color:#fff;}



/*Coverage Options*/
#coverage-options {background-color:#f2f2f2;}
#coverage-options-inner {max-width:820px; margin:0 auto;}
#coverage-options .section-link {background:#fff;}
#coverage-options-table {display:table; width:100%; margin-top:60px; padding:0 10px;}
.coverage-options-table-row {display:table-row;}
.coverage-options-table-column {display:table-cell; vertical-align:top; text-align:center; color:#fff;}
.coverage-options-table-column h3 {color:#fff; font-size:22px;}

.coverage-options-table-left-column {width:200px;}
.coverage-options-table-row-one .coverage-options-table-left-column {background:url('../img/coverage_table_one.png') no-repeat center left;}
.coverage-options-table-row-two .coverage-options-table-left-column {background:url('../img/coverage_table_two.png') no-repeat center left;}
.coverage-options-table-row-three .coverage-options-table-left-column {background:url('../img/coverage_table_two.png') no-repeat center left;}
.coverage-options-table-row-four .coverage-options-table-left-column {background:url('../img/coverage_table_three.png') no-repeat center left;}

.coverage-options-table-right-column {padding-bottom:10px;}
.coverage-options-table-right-column-inner {background-color:#5a585d; position:relative;}
.coverage-options-table-row-one .coverage-options-table-right-column-inner {background-color:#00a9e0;}
.coverage-options-table-right-column h3 {border-bottom:1px solid #4d4d51; padding:35px; margin-bottom:0;}
.coverage-options-table-row-one .coverage-options-table-right-column h3 {border-bottom:1px solid #0599ca; font-size:25px;}
.coverage-options-table-right-column p {text-align:left; padding:35px 60px 70px;}
.coverage-options-table-right-column-inner .coverage-options-table-right-column-checks {width:80px; position:absolute; bottom:20px; left:20px; display:block;}

#coverage-options-additional-content {display:table; width:100%; table-layout:fixed; border-collapse:separate; border-spacing:10px; margin-top:40px;}
.coverage-options-additional-content-column {display:table-cell; vertical-align:top; background:#fff; font-size:13px; padding:35px;}



/*Additional Benefits*/
#additional-benefits {background:#fff url('../img/benefits_bg.jpg') no-repeat bottom center;}
#additional-benefits #benefits-table {max-width:1020px; margin:0 auto; margin-top:60px;}
#additional-benefits #benefits-table-inner {display:table; width:100%; table-layout:fixed; border-collapse:separate; border-spacing:10px;}
#additional-benefits #benefits-table .benefits-column {display:table-cell; vertical-align:top; background:#fff; border:1px solid #ddd; padding:35px;}

#additional-benefits #benefits-table img {display:block; margin:0 auto; width:120px; margin-bottom:10px;}
#additional-benefits #benefits-table .content {font-size:13px;}



/*Limitations/Exclusions*/
#limitations-exclusions {background-color:#f2f2f2;}
#limitations-exclusions .two-column-text {max-width:1000px; margin:0 auto;}
#limitations-exclusions .two-column-text p {text-align:left; width:50%; float:left;}
#limitations-exclusions .two-column-text p.paragraph-column-one {padding-right:20px;}
#limitations-exclusions .two-column-text p.paragraph-column-two {padding-left:20px;}



/*Contact*/
#contact {background-image:url('../img/contact_bg.jpg');}
#contact .section-header h1 {margin-bottom:0;}



/*Footer*/
#footer {background-color:#5a585d; padding:50px 40px 40px;}
#footer-links {margin:0 auto; max-width:1000px;}
#footer li {display:inline-block; text-transform:uppercase; font-size:14px; margin-right:40px; line-height:1.2; margin-bottom:10px; text-align:center;}
#footer a {color:#fff; text-decoration:none;}
#footer a:hover, #footer a:active {color:#fff; opacity:.7;}



/*Transitions*/
/*iOS has issues with this (JS won't fire while scrolling), so we'll just turn off all of these transitions for all touch devices (sorry everyone else)
We could 'fix' this with something like skrollr.js, but at the cost of laggy scrolling*/
.no-touch.csstransitions .transition-in-from-bottom {opacity:0; -ms-transform:translate(0, 130px); -webkit-transform:translate(0, 130px); transform:translate(0, 130px); -webkit-transition:all .7s; -moz-transition:all .7s; -o-transition:all .7s; transition:all .7s;}
.no-touch.csstransitions .transition-in-from-bottom.show {opacity:1; -ms-transform:translate(0, 0); -webkit-transform:translate(0, 0); transform:translate(0, 0);}
.no-touch.csstransitions .transition-in-from-top {opacity:0; -ms-transform:translate(0, -100px); -webkit-transform:translate(0, -100px); transform:translate(0, -100px); -webkit-transition:all .7s; -moz-transition:all .7s; -o-transition:all .7s; transition:all .7s;}
.no-touch.csstransitions .transition-in-from-top.show {opacity:1; -ms-transform:translate(0, 0); -webkit-transform:translate(0, 0); transform:translate(0, 0);}
.no-touch.csstransitions .transition-in-from-left {opacity:0; -ms-transform:translate(-150px, 0); -webkit-transform:translate(-150px, 0); transform:translate(-150px, 0); -webkit-transition:all .7s; -moz-transition:all .7s; -o-transition:all .7s; transition:all .7s;}
.no-touch.csstransitions .transition-in-from-left.show {opacity:1; -ms-transform:translate(0, 0); -webkit-transform:translate(0, 0); transform:translate(0, 0);}
.no-touch.csstransitions .transition-in-from-right {opacity:0; -ms-transform:translate(150px, 0); -webkit-transform:translate(150px, 0); transform:translate(150px, 0); -webkit-transition:all .7s; -moz-transition:all .7s; -o-transition:all .7s; transition:all .7s;}
.no-touch.csstransitions .transition-in-from-right.show {opacity:1; -ms-transform:translate(0, 0); -webkit-transform:translate(0, 0); transform:translate(0, 0);}





/*Media Queries*/
@media screen and (max-device-width:1024px){
    /*Allow zooming for safari on desktop, but deny for iPad/iPhone*/
	body {-webkit-text-size-adjust:none;}
}

@media screen and (max-width: 1023px) {

}

@media all and (max-width: 899px) {
	#additional-benefits #benefits-table-inner, #additional-benefits #benefits-table .benefits-column {display:block;}
	#additional-benefits #benefits-table .benefits-column {margin-bottom:10px;}
}

@media all and (max-width: 767px) {
	#header {position:relative; min-height:0;}
	#logo {width:125px;}
	#main-nav {display:none;}
	#mobile-menu-trigger {display:block;}
	.hero {padding:180px 40px;}

	#coverage-options-table {display:block; padding:0;}
	.coverage-options-table-row, .coverage-options-table-column {display:block;}
	.coverage-options-table-left-column {display:none;}
	.coverage-options-table-right-column p {padding:35px 35px 70px;}
	#coverage-options-additional-content, .coverage-options-additional-content-column {display:block; margin-bottom:10px;}
	#coverage-options-additional-content {margin-top:0;}


}

@media all and (max-width: 479px) {
	#header-inner {padding:15px 20px;}
	.page-section, .hero {padding:100px 20px;}
	.full-width-quote {padding:75px 20px;}

	#overlay {padding:0;}
	#modal-header {padding:35px 50px 35px 20px;}
	.flexslider .slides li .slide-inner {padding:30px 20px;}

	#limitations-exclusions .two-column-text p {width:100%; float:none; text-align:center;}
	#limitations-exclusions .two-column-text p.paragraph-column-one {padding-bottom:20px;}
	#limitations-exclusions .two-column-text p.paragraph-column-one, #limitations-exclusions .two-column-text p.paragraph-column-two {padding-left:0; padding-right:0;}

	#footer {padding:50px 20px;}
	#footer li {display:block; margin-right:0;}
}
