/*
Dark Green		#529C1E
Medium Green	#64D300
Light Green		#C8F69E
Dark Blue		#002368
Medium Blue		#4C9FEE
Red				#DE2516
*/

/* ! ####     320px +     #### */
html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }
.clearfix:before, .clearfix:after, .cf:before, .cf:after { content: " "; display: table; }
.clearfix:after, .cf:after { clear: both; }

body {
    font-family: 'ff-dax-web-pro', 'Trebuchet MS', 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Tahoma; 
    background: white url("/img/bg-clouds.jpg") repeat-x;
    letter-spacing: -0.02em;
    font-size: 100%;
	line-height: 1.4em;
    color: #565656;
/*     -moz-osx-font-smoothing: grayscale; */
/*
    background-color: rgba(255, 0, 0, .5);
	background-blend-mode: overlay;
*/
}

html,button,input,select,textarea { color: #565656; }
audio, canvas, iframe, img, svg, video { vertical-align: middle; }

img { width:100%; height:auto;}

.dev { position: fixed;bottom: 20px;left: -65px; background-color: rgba(222, 35, 22, 0.75);color: white;padding: 0.1em 1em;font-weight: bold;z-index: 100000;font-size: 0.688em;font-family: Monaco;pointer-events: none;transform: rotate(45deg);text-align: center;line-height: 1.2em;width: 200px;}

.browserupgrade { width:100%; background-color: #DE2516; color:white; text-align: center; padding: 0.5em;z-index:10000;}
.browserupgrade a { color:white; font-weight: bold; text-decoration: underline;}
.browserupgrade a:hover { color:black;}

.cc-window { color: white; background-color: #002368; font-size: 1em; font-family: inherit;}
.cc-link { font-weight: bold; color: #4C9FEE; }
.cc-link:hover { color:white; }
.cc-btn { background-color: #4C9FEE; color:white; border-width:0; outline: none;}
.cc-btn:hover { background-color: #64D300; color:white; }

.wrapper { width: 100%; }

h1 { font-size: 1.500em; line-height: 1.1em; clear:left; }
h2 { font-size: 1.250em; clear:left; margin-top: 0; }
h3 { clear:left; }
p { margin-top: 0; }
p.small, span.small { font-size: 0.813em; line-height: 1.3em; }
ul { padding: 0 0 0 2em; margin: 0 0 0.5em 0; }
li { list-style-image: url("/img/bullet.png"); padding-bottom: 0.5em; line-height: 1.2em;}
.red { color: #DE2516; }
.med-blue { color: #4C9FEE; }
.med-green { color: #64D300; } 
.alignright, .ar { text-align: right; }
.alignright table.share, .ar table.share { float:right;}
.alignleft, .al { text-align: left; }
.floatleft, .fl { float:left; }
.floatright, .fr { float:right; }

input, textarea, select {
	border: 1px solid silver;
	border-radius: 4px;
	padding: 4px 8px;
	font-size: 1em;
	width:100%;
	font-family: inherit;
}

::-webkit-input-placeholder {
	line-height:1.5em;

}
input { height:29px; }
input[type="checkbox"],input[type=radio] { width: auto; height: auto; }
input:focus, textarea:focus, select:focus { outline:0; border-color: #64D300; box-shadow: 0 0 6px #64D300 }

select { 
	background: url('/img/select-arrows.png') no-repeat right center;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: white;
	padding-right: 20px;
	height: 29px;
}
select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #565656; }
select::-ms-expand { display: none; }
optgroup { font-style: normal; color: #000; }
option { color: #565656; }

input[type="submit"] { width:auto; font-weight: bold; }
input[type="button"] {
	background-color: #999;
	color: white;
	width:auto;
	font-weight: bold;
	cursor: pointer;
}

input[type="button"]:hover {
	background-color: #DDD;
/* 	border-color: #DDD; */
	color: #666;
}
input[type="button"].blue { background-color: #4C9FEE; border-color: #4C9FEE; }
input[type="button"].blue:hover { background-color: #64D300; color:white; border-color: #64D300; }
input[type="submit"] { font-weight: bold; color: white; background-color: #4C9FEE; border-color: #4C9FEE; }
input[type="submit"]:hover { background-color: #64D300; border-color: #64D300; }

.autowidth { width:auto; }
.nowrap { white-space: nowrap; }

.autocomplete-suggestions {
    text-align: left; cursor: default; border: 1px solid silver; border-top: 0; background: #fff; box-shadow: -1px 1px 3px rgba(0,0,0,.1); border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; 

    /* core styles should not be changed */
    position: absolute; display: none; z-index: 9999; max-height: 254px; overflow: hidden; overflow-y: auto; box-sizing: border-box;
}
.autocomplete-suggestion { position: relative; padding: 0 .6em; line-height: 23px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 1.02em; color: #333; }
.autocomplete-suggestion b { font-weight: normal; color: #4C9FEE; }
.autocomplete-suggestion.selected { background: #f0f0f0; }

/*  !####     COLUMNS     #### */

.col { display: block; float:left;margin: 0; }
.col:first-child { margin-left: 0; }
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both; }

.span_1_of_1, 
.span_1_of_2,
.span_2_of_2,
.span_1_of_3,
.span_2_of_3,
.span_3_of_3,
.span_1_of_4,
.span_2_of_4,
.span_3_of_4,
.span_4_of_4, 
.span_5_of_5, 
.span_1_of_5,
.span_2_of_5,
.span_3_of_5,
.span_4_of_5,
.span_5_of_5 { width: 100%; }

.pricing-selector { margin-bottom: 0.5em;}
.pricing-selector .span_1_of_3 { width: 32.2%; }
.pricing-selector .col { margin: 1% 0 1% 1.6%; }
.pricing-selector .col:first-child { margin-left: 0; }

.info .col { margin: 1% 0 1% 1.6%; /* border:1px dashed red; */ }
.info .col:first-child { margin-left: 0; }
.info .span_1_of_4 { width: 47.2%;} 

/* !####     STATIC PAGE NAV      #### */
.page-nav {
	position: relative;
	width: 100%;
	margin-top: 1em;
	margin-bottom: 1em;
	font-weight: bold;
	line-height: 1.2em;
	font-size: 0.938em;
}
.nav-next { width: 45%; float: right; text-align: right; }
.nav-prev { width: 45%; float: left; }

/* ! ####     PROD TIPS     #### */ 
.prod-tips { width: 100%; float: none; margin: 0 auto; }
.prod-tips .plug {
	position: relative;
	float: left;
	height: auto;
	display: block;
	width: 30%;
}

.prod-tips .triangle {
	position: absolute;
	z-index: 10;
	height: 20px;
	width: 20px;
	left: -20px;
	top: 10px;
}

.prod-tips .box {
	position: relative;
	border-color: #D6D6D6;
	border-style: solid;
	border-width: 1px;
	background-color: white;
	height: auto;
	width: auto;
	margin-left: 35%;
	padding: 0.7em;
	font-size: 0.938em;
}

.prod-tips p {
	margin-bottom: 0.5em;
	font-size: 0.938em;
	line-height: 1.3em;
}

.prod-tips a { font-weight: bold; }

.prod-tips h3 {
	font-size: 1em;
	line-height: 1.2em;
	margin-top: 0;
	clear: none;
}



.mscroller {
    display: block;
    background-color: white;
    padding: 0 0;
    border: 1px solid white;
    margin-bottom: 1em;
    width:100%;
}
.mscroller h3 { margin: 0.5em; line-height: 1em; font-size: 1em; }
.mscroller p { text-align: center; font-size: 0.688em; font-weight: bold; margin-bottom: 0.1em;}
.mscroll-wrapper {
	width: 100%;
	white-space: nowrap;
	overflow-y: hidden;
	overflow-x: scroll;
	-webkit-overflow-scrolling: touch;
	height:64px;
	
}
.mscroll-wrapper img {
	width:64px; height:64px;
}
.mbox { display: inline-block; margin-right: 0.5em;}

/* !####     LINKS, BUTTONS & ARROWS     #### */
a { color: #4C9FEE; text-decoration: none; }
a:hover { color: #565656; text-decoration: none; }

a.btn {
	text-decoration: none;
	font-weight: bold;
	color: white;
	line-height: 2em;
	padding: 0.4em;
	text-align: left;
	transition: 0.2s;
}

a.btn.dkblue {
	margin-top: 1em;
	background-color: #002368;
	white-space: nowrap;
}

a.btn:hover {
	background-color: #4C9FEE;
}

a.arrow {
	display: table-cell;
	vertical-align: middle;
	background: url("../img/arrows.png") no-repeat;
	background-position: right center;
	height: 55px;
	text-decoration: none;
	font-weight: bold;
	color: white;
	line-height: 1em;
	padding-left: 0.625em;
	padding-right: 1.25em;
	text-align: left;
	font-size: 1em;
}

a.arrow:hover { background-position: right top; }
a.arrow.sml { height: 21px; font-size: 0.688em; line-height: 0.6em; }
a.arrow.med { height: 31px; font-size: 0.875em; }
a.arrow.lrg { height: 41px; font-size: 0.938em; }
a.arrow.hge { height: 55px; font-size: 1.063em; }
.ml { font-size: 0.875em; }

a.arrow.br, a.arrow.bg, a.arrow.rb:hover, a.arrow.gb:hover {
	background-position: right center; /* blue */
}

a.arrow.br:hover, a.arrow.rb, a.arrow.rg, a.arrow.gr:hover {
	background-position: right top; /* red */
}

a.arrow.bg:hover, a.arrow.rg:hover, a.arrow.gb, a.arrow.gr {
	background-position: right bottom; /* green */
}

a.arrow.br.sml, a.arrow.bg.sml, a.arrow.rb.sml:hover, a.arrow.gb.sml:hover {
	background-position: right -71px; /* blue */
}

a.arrow.br.sml:hover, a.arrow.rb.sml, a.arrow.rg.sml, a.arrow.gr.sml:hover {
	background-position: right -16px; /* red */
}

a.arrow.bg.sml:hover, a.arrow.rg.sml:hover, a.arrow.gb.sml, a.arrow.gr.sml {
	background-position: right -126px; /* green */
}

a.arrow.br.med, a.arrow.bg.med, a.arrow.rb.med:hover, a.arrow.gb.med:hover {
	background-position: right center; /* blue */
}

a.arrow.br.med:hover, a.arrow.rb.med, a.arrow.rg.med, a.arrow.gr.med:hover {
	background-position: right -12px; /* red */
}

a.arrow.bg.med:hover, a.arrow.rg.med:hover, a.arrow.gb.med, a.arrow.gr.med {
	background-position: right -122px; /* green */
}

a.arrow.br.lrg, a.arrow.bg.med, a.arrow.rb.lrg:hover, a.arrow.gb.lrg:hover {
	background-position: right center; /* blue */
}

a.arrow.br.lrg:hover, a.arrow.rb.lrg, a.arrow.rg.lrg, a.arrow.gr.lrg:hover {
	background-position: right -7px; /* red */
}

a.arrow.bg.lrg:hover, a.arrow.rg.lrg:hover, a.arrow.gb.lrg, a.arrow.gr.lrg {
	background-position: right -117px; /* green */
}



/* ! ####     ADVERTS     #### */

.ad-switch { width:100%; height:auto; position:relative; margin-top:1em;}
.ad-switch img { width:100%;}
.ad-switch-btn { position: absolute; top:45%;width:100%;}
.ad-switch a.arrow.hge { padding-left: 20%; font-size: 2.3em; line-height: 1.5em; width: 80%; display: block; padding-right: 0; }
.ad-switch .ad-text { position: absolute; top: 65%; }
aside.desktop .compare { font-size: 1.313em; color: #666; text-align: center; margin-bottom: 0; line-height: 1.1em;}
aside.desktop .compare span { text-decoration: underline;}
aside.desktop .click { font-size: 1.5em; color:#666; text-align: center; margin-bottom: 0; margin-top: 0.3em;}
aside.desktop .times { font-size: 1em; line-height: 120%; color: #666; padding: 0 5%; text-align: center; margin-top: 0.5em; }
aside.desktop .disc { font-size: 0.938em; color: #666; line-height: 120%; padding: 0 5%; text-align: center; }

/* ! ####     TABLES     #### */
table { border-collapse: collapse; }
table.share { float: left; margin-bottom: 1em; }
table.share td { font-weight: bold; padding-right: 0.5em; }
table.share td:last-child { padding-right: 0; }
table.share td img { width: 32px; height: 32px;}

table.data { width: 100%; margin-bottom: 1em;}
table.data tbody tr td { min-height: 2.5em;}
table.data thead { background-color: #64D300; color:white; }
table.data thead th { text-align: right; padding: 0.3em 0.5em 0.3em 0.5em; line-height: 1.2em;}
table.data thead th a { color: white;}
table.data thead th a:hover {color: black; }
table.data thead th:first-child { text-align: left; }
table.data thead th.al { text-align: left; }
table.data tbody th { background-color: #D6D6D6; text-align: left; padding: 0.45em 0.5em 0.45em 0.5em; border-bottom: 1px solid #BBB; line-height: 1.2em;}
table.data tbody td { background-color: white; text-align: right; padding: 0.45em 0.5em 0.45em 0.5em; border-bottom: 1px solid #DDD; line-height: 1.2em; }
table.data tbody tr:first-child th { border-top: 1px solid #BBB; }
table.data tbody tr:first-child td { border-top: 1px solid #DDD; }

table.data tbody tr:hover td { background-color: #F0F0F0; }
table.data tbody tr:hover th { background-color: #C9C9C9; }

table.data tbody .w35 { width:35%;}
table.data tbody .al { text-align: left;}
table.data tbody td input:not([type='radio']) { width:100%;}
table.data .unit { width: 20%;}
table.data .ht { height: 48px;}

table.data.immersion tbody th { width: 40%;}
table.data.immersion tbody td { width: 30%;}

table.calc {
	margin: 0 auto;
	background-color: #e3e3e3;
	border:8px solid #e3e3e3;
	font-size: 90%;
}

table.calc td {
	text-align:center;
	line-height: 1.2em;	
	vertical-align:middle;
}

table.calc td.pad {
	padding: 0 0.5em 0 0.5em;
}

table.calc td.top {
	padding-top: 0.2em;
}

table.calc td.bdr {
	border-bottom:1px solid #888;
}

table.select {
	table-layout: fixed;
	width: 100%;
	margin-bottom: 1em;
}

table.select td {
	height: 48px;
	vertical-align: middle;
	font-weight: bold;
	font-size: 0.938em;
	background-color: #D6D6D6;
	color: #565656;
	padding: 0 0.5em 0 0.5em;
}

table.select td:first-child {
	width: 25%;
	line-height: 1em;
}

table.select td:nth-child(3) {
	width: 10.5em;
}

table.select select {
	width: 100%;
	font-weight: normal;
}

table.select.product td, table.select.vehicle td {
	background-color: #4C9FEE;
	color: white;
}
td.hide, th.hide { display:none; }
span.desc { display: none; }

.results table { width: 100%; table-layout:fixed; border-spacing: 0; border-collapse: separate; font-size: 0.875em; line-height: 1.250em; }
.results table thead tr,
.results table tfoot tr { background-color: #64D300; color:white; height: 48px; font-weight: bold; }

.results table thead td.title { padding-left: 0.5em; white-space: nowrap;}
.title { overflow: hidden; text-overflow: ellipsis; }
.results table tbody tr { height: 70px; }
.results table:not(.info):not(.prices) tbody tr:hover td { background-color: #EEE; }

.results table:not(.info):not(.prices) tbody td { border-top: 6px solid #EEE; }
.results table:not(.info):not(.prices) tbody td { background-color: white; }

.results table thead td a, .results table tfoot td a { color: white; }
.results table thead td a:hover, .results table tfoot td a:hover { color: black; }
.results table tfoot td { padding: 0 0.5em; }
.results table tfoot td:first-child, .results table tfoot td:nth-child(2) { text-align: left; width: 17.5%; }
.results table tfoot td:last-child, .results table tfoot td:nth-child(4) { text-align: right; width: 17.5%; }

/* .results table td.rank { padding: 0 0.2em; text-align: center; font-weight: bold; background-color: #D6D6D6; width: 40px; font-size: 2em; letter-spacing: -1px; } */
/*
.results table td.rank.s2 { font-size: 2em; }
.results table td.rank.s3 { font-size: 1.313em; }
.results table td.rank.s4 { font-size: 1.125em; }
.results table td.rank.s5 { font-size: 1.063em; }
.results table td.rank.s6 { font-size: 1em; }
*/
.results table td.prices { width: 4.5em; }
.results table td.photo { width: 13%; padding: 1%; position: relative;}
.results table td.info { padding: 0 0.25em; }
.results table td.usage { width: 14%; text-align: right; }
.results table td.use-stand { width: 13%; text-align: right; }
.results table td.tco { width: 15%; text-align: right; padding-right: 0.5em; }
.results table td.printer-usage	{ width: 14%; }
.results table td.compare		{ width: 16.875%; }
.results table td.capacity		{ width: 16.875%; text-align: right; white-space: nowrap; padding-right: 0.8em;}
td.hide, th.hide { display: none; }
.results table td.cost { width: 20%; text-align: right; padding-right: 0.5em; min-width: 5em; }
.results table td.sorted { font-weight: bold; }

.results table td.co2 { display: none; }
.results table td.tax { display:none; }
.results table td.cost.year { display: none;}
.results table td.more-info { min-width: 55px; width: 3.9em; }

.score { width:10%; vertical-align: middle; background-size: contain; background-position:center center; background-repeat: no-repeat; font-weight: bold; font-size: 0.9em; line-height: 0.9em; text-align: center; }

.results table td.score .rad { border: 0px dotted red; position:relative;}
a.rad { display: block; transition: all .2s ease-in-out; z-index: 10; }
a.rad:hover { opacity:0.7; }

.score .rad img { max-width: 108px; }
.score .leaf { position: absolute; top:19%; width:100%; display:none; border: 0px solid green; padding-right: 5%; margin: 0 auto; }

.score .leaf img { width: 45%; max-width: 50px;}
.score .pct { position: absolute; top: 37%; width:100%;}
.score .pct span { font-size: 80%;}

.results table tbody td.top { background-color: #4C9FEE; color: white; }

.results table td.info { background-color: white; }
.results table.info td { padding: 0; }
.results table.prices { margin-bottom: 0.5em;}
.results table.prices tr { background-color: #F4F4F4; height: 48px;}
.results table.prices tr:hover { background-color: #FFFFFF; }
.results table.prices td { border-top: 6px solid white; }

.results table.prices td.logo { padding: 0 0.5em; width:40%; }
.results table.prices td.logo img { max-width: 160px; }
.results table.prices td.reviews { width: auto; min-width: 78px; display: none;}
.results table.prices td.delivery { width: auto; display: none; } 
.results table.prices td.avail { width: 14%; display: none; }
.results table.prices td.price { width: auto; padding-right: 1em; text-align: right; }
.results table.prices td.go {width:12%; text-align: right; }

.results table.nav td { text-align: center;}
.results table.nav td:nth-child(3) { color: white; width:30%;}
.results table.nav td:first-child, .results table.nav td:nth-child(2) {
	text-align: left;
	padding-left: 1em;
	width: 17.5%;
}
.results table.nav td:last-child, .results table.nav td:nth-child(4) {
	text-align: right;
	padding-right: 1em;
	width: 17.5%;
}
.results table.suppliers td.logo { position: relative; }
.results table.suppliers .co2		{ width: 12%; padding-right: 1%; }
.results table.suppliers .ren		{ width: 12%; padding-right: 1%; }
.results table.suppliers .nuk		{ width: 12%; padding-right: 1%; }
.results table.suppliers .switch	{ width: 20%; }
.results table.suppliers td.logo img { max-width: 130px; padding: 2.6em 0.5em 2.6em 0.5em;}
.results table.suppliers td.logo a { display: inline-block;}

table.offers td.logo img { max-width: 160px; }


input.offer { width:auto; }
.no-prods { text-align: center; margin:1em;}
/* ! ####     MORE INFO     #### */
.green-plug, .offers-box, .nrg-rating, .man-logo { margin-top: 0.5em; }
.more-info-logos { text-align: right; }
.green-plug img { max-width: 115px;}
.nrg-rating img { max-width: 125px;}
.more-info-logos img { max-width: 160px;}
.vehicles img { max-width: 150px; float:right;}
.vehicles .col { margin: 1% 0 1% 0; }

table.modal { table-layout: fixed; width: 100%; margin-bottom: 1em;}
table.modal thead td, table.modal thead th { color: white; background-color: #64D300; padding: 0.4em; text-align: left; } 

table.modal tbody tr:first-child td, table.modal tbody tr:first-child th { border-top: 1px solid silver; }

table.modal tbody th {
	background-color: #DDD;
	border-bottom: 1px solid silver;
	font-size: 0.813em;
	text-align: left;
	padding: 0.8em 0.9em 0.4em 0.4em;
	vertical-align: top;
/* 	width: 21%; */
	line-height: 1.5em;
}

table.modal tbody td {
	color: #666;
	background-color: #DDD;
	border-bottom: 1px solid silver;
	font-size: 0.813em;
	text-align: left;
	padding: 0.4em;
	vertical-align: middle;
	line-height: 1.2em;
}

.span_1_of_4.bulb { width: 23.8%; }
.span_3_of_4.bulb { width: 74.6%;}

.bulb img { width: auto;}
.bulb img.dim { width:100%; }

/* ! ####     HEADER-CONTAINER     #### */
.header-container {
	display: none;
	height: 169px;
	position: relative;
}
.header-container .logo {
	width: 74px;
	height: 92px;
	position: absolute;
	top: 10px;
}

.header-container .sust-it {
	width: 202px;
	height: 62px;
	position: absolute;
	left: 78px;
	top: 25px;
}

.header-container .simply {
	width: 314px;
	height: 33px;
	position: absolute;
	top: 46px;
	left: 294px;
	color: white;
	font-size: 2em;
	font-weight: 400;
	display: none;
}

.header-container a.sust-it-btn {
	cursor: pointer;
	width: 202px;
	height: 62px; 
	background-image: url("/img/header-sust-it.png"); 
	display: block;
	background-position: 0 0;
}

.header-container a.sust-it-btn:hover {
	background-position: 0 62px;
}

.header-container .search {
	right:0;
	position: absolute;
	top: 44px; /* was 0 */
	width: 33%;
	height: 35px;

}

/* !####     SEARCH OVERRIDES    #### */
div.gsc-control-cse {
	background-color: transparent;
	border: 0;
	padding: 0;
	-moz-box-sizing:content-box;
	-webkit-box-sizing:content-box;
	box-sizing:content-box;
}
input#gsc-i-id2::-webkit-input-placeholder { color:white; border-radius: 0; box-shadow: none; }
input#gsc-i-id2:focus { box-shadow: none; }
.gsib_a { padding: 0 0 0 4px !important; }
.gsc-input-box { top: -3px; position: relative !important; }
.cse input.gsc-search-button, input.gsc-search-button { border-radius:0 !important; }
	
/* !####    MAIN-CONTAINER    ####*/
.main-container { padding-top: 44px; }
.ad-tips aside { overflow: hidden; text-align: center; width: 100%; margin-bottom: 1em; }
.main.wrapper { background-color: #F4F4F4; }
aside { float: left; width: 31.25%; min-height: 1px; background-color: white; }
aside.content { display: none; position: relative; padding: 10px; }
section.hide, span.hide { display: none; }
aside.desktop { display: none; position: relative; }
aside.mobile { display: block; width: 100%; position: relative;}
article { padding: 0 0.5em; width: 100%; float: left;}

div.banner { position: relative; }

.speech-bubble {
	background-image: url("/img/speech-bubble-bg.png");
	background-repeat: no-repeat;
	background-position: center top;
	padding: 0 10%;
	position: absolute;
}

.desktop .speech-bubble { 
	background-size: 80%;
	top: 65%;
	width: 100%;
	
}

.mobile .speech-bubble {
	background-size: 66%;
	bottom: 10%;
	right: 0;
	width: 60%;
}

aside.desktop .grad {
	position: absolute;
	bottom: 0;
	width: 100%;
	border: 0 solid red;
}

/* !####    BOTTOM SECTION    #### */
.main.bottom {
	padding: 1em 0.5em 0 0.5em;
	background: white;
	background: rgba(244,244,244,1); 
	background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(244,244,244,1)), color-stop(50%, rgba(255,255,255,1)), color-stop(100%, rgba(255,255,255,1)));
	background: -webkit-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);
	background: -o-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);
	background: -ms-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);
	background: linear-gradient(to bottom, rgba(244,244,244,1) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);
}

.circles { margin-top: 0.5em;}
.circles .col { position: relative; }
.circles a.arrow { position: absolute; top: 20%; width: 65%; right: 0; font-size: 120%; z-index: 10; line-height: 55px; }
.circles div.circle > img { border-radius: 50%; padding: 0; width: 30%; }
.circles div.circle { transition: all 0.3s ease; padding: 0; position: relative; }

.circles img.flash {
	display: none;
	width: 80%;
	position: absolute;
	right:0;
	top:0;
	opacity:0;
	transition: all 0.3s ease;
}

.circles a.arrow:hover ~ img.flash { opacity:1; }
.circles a.arrow:hover ~ div.circle { padding:0; }

.main.bottom ul.links {
	clear: both;
    padding: 0;
    margin: 0;
	list-style: none;
	text-align: center;
}

ul.links {
	clear: both;
	padding: 0;
	margin: 1em 0;
	list-style: none;
	text-align: center;
}
ul.links li { display: inline-block; font-size: 1em; color: silver;  white-space: nowrap; }
ul.links a { font-weight: bold; padding: 0.5em; }
ul.links a:hover { color: #DE2516; }

.circles .col { margin: 1% 0 1% 0; }
.circles .col:first-child { margin-left:0; }
.circles .span_1_of_3 { width: 100%; }

/* !####    POLICIES    #### */
.policies {
	padding: 10px 0.3em;
	text-align: center;
	width: 100%;
	font-size: 0.8em;
}

.policies a {
	color: #7C7C7C;
	text-decoration: none;
}

.policies a:hover {
	text-decoration: underline; color: #565656;
}

/* ! ####    FOOTER-CONTAINER    ####*/
.footer-container footer {
	color: #A9A9A9;
	padding: 0 2%;
	font-size: 0.813em;
	background-color: white;
}

.footer-container .credit_div {
	float: left;
	width: 100%;
	text-align: center;
	font-size: 0.938em;
}

.footer-container .credit_div a {
	color: #A9A9A9;
}

.footer-container .credit_div a:hover {
	color: black;	
}

.footer-container .social_div {
	float: none;
	width: auto;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	clear: both;
	padding: 0.6em 0 0.6em 0;
}

.footer-container a.share {
	display: inline-block;
	background: url("/img/share-all.png") no-repeat;
	width: 42px;
	height: 42px;
	margin-right: 0.5em;
	background-size: 210px;
}

.footer-container a.share:last-child { margin-right: 0; }
.footer-container .social_div span { display: none; font-size: 1em; line-height: 2.5em; vertical-align: top;}
.footer-container a.share.fb { background-position:0 -42px; }
.footer-container a.share.tw { background-position:-42px -42px; }
.footer-container a.share.yt { background-position:-84px -42px; }
.footer-container a.share.gp { background-position:-168px -42px; }
.footer-container a.share.fb:hover { background-position:0 0; }
.footer-container a.share.tw:hover { background-position:-42px 0; }
.footer-container a.share.yt:hover { background-position:-84px 0; }
.footer-container a.share.gp:hover { background-position:-168px 0; }
.footer-container .address_div { font-size: 0.813em; clear: both; text-align: center; line-height: 1.4em; }

/* !####    MODAL WINDOWS    #### */
.jqmOverlay { background-color: white; }
.jqmWindow { 
	margin-left: -50%; 
	width: 100%;
	top: 0;
	max-height:100%;
	display: none;
	position: fixed;
	left: 50%;
	background-color: #F4F4F4;
	overflow-y: auto;
	-webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5);
	-ms-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5);
	-o-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5);
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5);
	padding: 16px;
}

.jqmWindow h1 {
	font-size: 1.2em;
	margin-top: 0;
	margin-bottom: 1em;
	background-color: #002368;
	color: #fff;
	padding: 0.3em 0.4em 0.2em 0.4em;
}

.jqmWindow .close_btn {
	position: relative;
	top: 3px;
	width: 24px;
	height: 24px;
	float: right;
	padding: 0 1.5em;
}
.jqmWindow .close_btn img {
	border: 0;
	margin-top: 0.1em;
	width: 15px;
	height: 15px;
}

.jqmWindow select:not(.autowidth) { width: 100%; } 
.jqmWindow p:last-child { margin-bottom: 0; }

.videowrapper {
	float: none;
	clear: both;
	width: 100%;
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	margin-bottom: 1em;
}

.jqmWindow .videowrapper { margin-bottom: 0; } 

.videowrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

img.dim {
	opacity: 1;
}

.filters {
	width:100%;
	background-color: #C8F69E; 
	color: #529C1E;
	display: block;
	font-size: 0.875em;
}

.filter {
	float: left;
	padding: 0.5em;
}
.feat { float: left; padding-right: 0.6em;}
a.show-filters {
	display: none;
	width: 100%;
	background-color: #C8F69E;
	clear: both;
	text-align: center;
	height: 44px;
	line-height: 44px;
	color: #529C1E;
	font-weight: bold;
}

a.show-filters:hover { text-decoration: none; }
.filter-label { font-weight: bold; float:left; padding-right: 0.4em; white-space: nowrap; width: auto; line-height: 200%; }
.filter-input { float: right;line-height: 200%;}
.filter-input option { font-size: 1.1em;}

span.desc { color: #999; }

#modal .score {
	width: 100%;
	border: 0px dashed blue;
}
#modal .score .col {
	margin: 1% 0 1% 1.6%;
}
#modal .score .col:first-child {
	margin-left: 0;
}
#modal .score .span_1_of_3 {
	text-align: center;
	font-size: 160%;
	position:relative;
	border: 0px dashed red;
	width: 32.2%;
}
#modal .rad h3 {
	margin-bottom: 1em;
	font-size: 0.8em;
	line-height: 0.8em;
	font-weight: normal;
}
#modal p.score { text-align: center; font-weight: normal; font-size: 1.2em; line-height: 1.2em;}
#modal .leaf { display: block; top:10%; }
#modal .pct { font-size: 0.9em;}


/* !####    CONTACT FORM    #### */
.contact-form p { margin:0 0 0 0; }
.contact-form input:not([type='checkbox']), .contact-form textarea { margin:0 0 1em 0; }
.contact-form .captcha-code { width: 100px; margin-right: 1em; }
.contact-form span { clear: left;}
.contact-form #captcha { width:auto; }
.contact-form .rotate { width: auto; margin-left: 1em; transition: transform .8s ease-in-out; }
.contact-form .rotate:hover { transform: rotate(360deg); }

/* ! ####    SWITCH MODAL    #### */
.switch-modal .switchClose, .switch-modal .jqmClose { padding:0.2em 0.4em; }
.switch-modal .control { text-align:center; font-size:170%; font-weight:bold; padding:0.2em; margin:0; line-height: 1.1em; }
.switch-modal .udrln { text-decoration: underline; }
.switch-modal .compare { text-align:center; font-size: 150%; color: #999; margin-bottom: 0.5em; line-height: 1.1em;}
.switch-modal .subline { text-align:center; font-size: 110%; color: #999; padding-top: 1em; }
.switch-modal .no-btn { text-align:center; margin-bottom: 0; }
.switch-modal div.close_btn { position: absolute; top: 20px; right: 20px; }

.switch .span_1_of_3 div.icon { width: 20%; min-width: 48px; padding: 0 0 1em 0; float: left;}
.switch .span_1_of_3 div.arrow { position: relative; width: 75%; display: table; float: left; padding-left: 1em; padding-top: 3%;}
.switch .span_1_of_3 div.arrow a.arrow.lrg { width: 100%; font-size: 1.2em;}

@keyframes blink {
    0% { opacity:1; }
    50% { opacity:0.05; }
    100% { opacity:1; }
}

.pulse { animation: blink 4s ease-in-out infinite; }

/* ! ####    RESULTS PAGE    #### */

div.results { padding-bottom: 1em; }

.top-product {
	height: 280px;
	position: relative;
}

.top-pic {
	width: 180px;
	height: 180px;
	position: relative;
	top: 30px;
}

.top-info {
	position: absolute;
	width: 180px;
	height: 120px;
	top: 70px;
	right: 0;
	text-align: left;
}

.top-price { width: 100%; float: right; }
.top-price a.arrow { width: 180px; }

.top-saving {
	position: absolute;
	bottom: 0;
	background-color: #DE2516;
	color: white;
	width: 100%;
	font-size: 0.9em;
	line-height: 1.4em;
	text-align: center;
	border: 1px solid #DE2516;
	padding: 0.4em;
	transition: 0.2s;
	float: right;
}

.top-saving:hover {
	cursor: pointer;
	background-color: white;
	color: #DE2516;
}

.top-saving span.top {
	font-size: 22px;
	font-weight: bold;
}
.top-logo {
	width: 150px;
	height: 50px;
	position: absolute;
	bottom: 10px;
	right:16px;
}

.mobile .top-saving {
	position: relative;
	margin-bottom: 1em;
	display: block;
}
.filters { display: none; }

a.show-filters {
	display: block;
	width: 100%;
	background-color: #C8F69E;
	clear: both;
	text-align: center;
	height: 44px;
	line-height: 44px;
	color: #529C1E;
	font-weight: bold;
}

.fhide { display:none;} 

.boxout { background-color: white; padding: 0.4em; margin-bottom: 1em; }
.boxout:last-child { margin-bottom: 0; }

table.save {
	margin-left: auto;
	margin-right: auto;
	border-collapse: separate;
	table-layout: fixed;
	width: 80%;
}

table.save td {
	font-weight: bold;
	text-align: center;
	line-height: 1em;
}

table.save .top {
	background-color: #64D300;
	padding: 0.5em;
	color: white;
}

table.save .bot {
	background-color: #DE2516;
	padding: 0.5em;
	color: white;
}

/* !####    PAGINATION    #### */
.pagination {
	font-weight: bold;
	padding: 0.85em 1em;
	color: white;
	background-color: #64D300;
	text-align: center;
}

.pagination a { color: white; }
.pagination a:hover		{ color: #327D04; }
.pagination .rank2		{ color: #C3FDB3; }
.pagination .prev		{ width: 15%; float:left; text-align: left;}
.pagination .next		{ width: 15%; float:right; text-align: right;}

span.desktop { display: none; }
span.mobile { display: inline-block;}
.sub { font-size: 70%; position: relative; bottom: -0.3em;}

.charge-map { width: 100%; height: 580px; margin-bottom: 1em; }

table.select.fuel td:first-child, table.select.vehicle td:first-child { width:13%; }
table.select.fuel td:nth-child(2), table.select.vehicle td:nth-child(2) { width: 24%; }
table.select.fuel td:last-child, table.select.vehicle td:last-child { width:auto; }

/* !changes march 2017 */
/* .results table td.rank { display: none; } */
.results table td.photo { width: 24%;  padding: 0 0.5% 0 0;}
.results table td.photo img { padding: 0.8em;}
.rank { z-index:300; position: absolute; background-color: #eee; color: #565656; padding: 0.3em 0.5em; font-weight: bold; font-size: 100%; top: 0; left: 0; }
.rank.top { background-color: #002368; color:white; }
.results table.top:not(.info):not(.prices) tbody td { border-top-color: #002368; }

/* ! ####    MOBILE FIRST MEDIA QUERIES    #### */

@media only screen and (min-width: 375px) {
	.main.bottom ul.links { font-size: 1.125em; }
	.results table td.prices { width: 18%; }
	.switch-modal p.subline { font-size: 92%;}
	
	.rank { font-size: 130%; padding-top: 0.4em;}
}

@media only screen and (min-width: 414px) {
	.main.bottom ul.links { font-size: 1.313em; }
	.results table td.rank { width: 50px; }
	.rank { font-size: 140%; padding-top: 0.4em;}
	.results table td.score { width: 12%; font-size: 1.0em; }
	.results table td.score .leaf { display: block; }
	.results table td.score .pct { top: 60%; }
	.results table td.score .pct span { font-size: 100%;}
	#modal .leaf { top: 12%; }
	#modal .pct { font-size: 1.2em; top: 42%;}
}

@media only screen and (min-width: 507px) {
	.results table.vehicle td.cost { width: 12%; }
	.results table.vehicle td.cost.year { display: table-cell; }
	.switch { width:80%; margin: 0 auto;}
	.switch .col { margin: 1% 0 1% 1.6%; }
	.switch .span_1_of_3 { width: 31.2%; }
	.switch .span_1_of_3 div.arrow { padding-top: 4%;}
	.switch .span_1_of_3 div.icon { width:100%; padding: 0 0 0.3em 0;}
	.switch .span_1_of_3 div.arrow { width:100%; padding-left: 0; }
	.circles .col { margin: 1% 0 1% 3.2%; }
	.circles .col:first-of-type { margin-left:0; }
	.circles .span_1_of_3 { width: 31.2%; }
}

@media only screen and (min-width: 568px) {
	.circles { margin-top: 0;}
	.circles div.circle { padding: 5%; width: 100%; }
	.circles div.circle > img { width: 100%; }
	.circles a.arrow { top: 60%; width: auto; right: auto; font-size: 100%;} 
	.circles img.flash { display: block; }
	.results table.vehicle td.co2 { display: table-cell; width: 12%; text-align: right; padding-right: 0.5em; }
	.switch { width:70%; }
}

@media only screen and (min-width: 667px) { /* !sidebar appears */
	.wrapper { max-width: 1200px; width: 95%; margin: 0 auto; position: relative;}
	.mob-header { display: none; }
	.header-container { display: block; }
	.main-container { padding-top: 0; }
	.filters { display: block; }
	h1 { font-size: 1.750em; }
	h2 { font-size: 1.313em; } 
	
	.col { display: block; float:left; margin: 1% 0 1% 1.6%; }
	.span_1_of_2 { width: 49.2%; }
	.span_2_of_3 { width: 66.1%; }
	.span_1_of_3 { width: 32.2%; }
	.span_3_of_4 { width: 74.6%; }
	.span_2_of_4 { width: 49.2%; }
	.span_1_of_4 { width: 23.8%; }
	.span_4_of_5 { width: 79.68%; }
	.span_3_of_5 { width: 59.36%; }
	.span_2_of_5 { width: 39.04%; }
	.span_1_of_5 { width: 18.72%; }
	
	.info .col:first-child { margin-left: 0; }
	.info .span_1_of_4 { width: 23.8%; }
	
	.footer-container .credit_div { float:left; text-align: left; width: auto; font-size: 0.875em;}
	.footer-container .address_div { clear: left; float:left; text-align: left; }
	.footer-container .social_div { float:right; clear:right; padding: 0;}
	.footer-container .social_div span { display: inline-block; }
	
	aside.desktop, aside.content { display: block;}
	aside.mobile, section.mobile { display: none; }
	span.desktop, span.hide { display: inline-block; }
	span.mobile { display: none;}
	.ad-tips aside { width: 31.25%; margin-bottom: 0; }
	section.hide { display: block; }
	.main article { width: 65.625%; padding-left: 3.125%; }
	.no-bg { background-color: transparent; }
	.third-bg { background-image: url("/img/bg-thirdwhite.png"); background-size: 100%; }
	td.hide, th.hide { display: table-cell; }
	.results table td.photo { width:16%; }
	.results table td.cost { width: 10%;}
	.results table.prices td.logo { width: 25%; display: table-cell;}
	.results table.prices td.reviews { width:auto; display: table-cell;} 
	.results table.prices td.delivery { width:auto; display: table-cell;}
	.results table.prices td.avail { width:14%; display: table-cell;}
	
	.boxout { padding: 1em; }

	.prod-tips .triangle { position: absolute; z-index: 10;width: 40px;left: -40px; top: 20px; }
	.mscroller { display: none; }
	a.show-filters { display: none; }
	span.desc { display: block; }
	
	.vehicles .span_1_of_2 { width: 49.2%; }
	.vehicles .col { margin: 1% 0 1% 1.6%; }
	.vehicles .col:first-child { margin-left:0; }
	
	table.select.fuel td:first-child, table.select.vehicle td:first-child { width:16%; }
	table.select.fuel td:nth-child(2), table.select.vehicle td:nth-child(2) { width: 29%; }
	
	.mscroller.calcs { display:block; border:0; background-color: inherit; }
	.mscroller.calcs h3 { margin-left:0; font-size: 1.313em; }
	.mscroller.calcs p { display: none; }
	.mscroller.calcs .mscroll-wrapper { overflow-x: visible; overflow-y: visible; }
	.mscroller.calcs:before, .mscroller.calcs:after { content: " "; display: table; }
	.mscroller.calcs:after { clear: both; }
	.mscroller.calcs .mscroll-wrapper img { width:100%; height:auto; transition: 0.5s;}
	.mscroller.calcs .mscroll-wrapper img:hover { opacity: 0.5;}
	.mscroller.calcs .mbox { margin-right: 0.5em; width: 18.5%; float: left; margin-bottom: 0.5em; padding: 0.5em;
	background-color: white; }

}

@media only screen and (min-width: 736px) { 
	.main.bottom ul.links { font-size: 1em; }
	.results table.vehicle td.tax { display: table-cell; width: 12%; text-align: right; padding-right: 0.5em; }
	.jqmWindow { width: 720px; margin-left: -360px;}
	.switch-modal p.subline { font-size: 105%; margin-bottom: 0; }
	.results table td.score { width: 12%; font-size: 1.4em; }
}

@media only screen and (min-width: 768px) {
	.main.bottom ul.links { font-size: 1.125em; }
	.jqmWindow { top: 10%;	max-height: 77%; }
}

@media only screen and (min-width: 840px) {
	.main.bottom ul.links { font-size: 1em; }
	table.select.fuel td:nth-child(2), table.select.vehicle td:nth-child(2) { width: 39%; }
	.rank { font-size: 160%; }
	#modal .pct { font-size: 1.1em; }
}

@media only screen and (min-width: 980px) {
	.main.bottom ul.links { font-size: 1.213em; }
	.header-container .simply { display: block; }
}

@media only screen and (min-width: 1024px) {
	body { font-size: 1.125em; }
	select { height: 32px; }
	input { height:32px; }
	.main.bottom ul.links { font-size: 1.438em; }
	.results table td.photo { width: 14%; /* padding: 0 0.5% 0 0; */ }
	.rank { font-size: 190%; }
	.results table td.prices { width: 11%; }
	table.select.fuel td:first-child, table.select.vehicle td:first-child { width:20%; }
	table.select.fuel td:nth-child(2), table.select.vehicle td:nth-child(2) { width:43%; }
	.results table td.score { font-size: 1.5em; }
}

@media only screen and (min-width: 1100px) {
	.main.bottom ul.links { font-size: 1.500em; }
}