/*   
Theme Name: Key Renewables
Theme URI: https://www.keyrenewables.co.uk/
Description: 2025 Custom theme for Key Renewables
Author: Phil Hambley
Author URI: https://www.scribbletribe.com
Version: 1.0.1
Tags: ECO
*/

/* CSS Resets */

* {margin: 0;padding: 0;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;border: 0;outline: 0;vertical-align: baseline;background: transparent;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
a img {border: none;}

/* Global Styling */

html * {-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
html {scroll-behavior: smooth;}
body {background: #777;font-family: 'Montserrat', sans-serif;-webkit-font-smoothing: antialiased;font-size: 1.0em;color: #222;max-width: 1600px;margin: 0 auto;}
.main {background: #fff;}
.align-center {text-align: center;}
.align-left {text-align: left;}
.align-right {text-align: right;}
img.responsive {width: 100%;}
.vertical-align {display: flex;align-items: center;}
.clear {clear: both;}

/* Text Styles */

a {color: #777; text-decoration: none;transition: color 0.5s linear;}
a:hover {color: #546f1b;}
h1, h2, h3, h4, h5 {text-rendering: optimizeLegibility;font-family: 'Montserrat', sans-serif;color: #222;font-weight: 400;}
h2 {font-size: 3.6em;}
h3 {font-size: 1.6em;margin-bottom: 20px;}
h3.home {font-size: 1.6em;margin-bottom: 20px; margin-top: 60px;}
h4 {font-size: 1.2em;margin-bottom: 20px;}
h4.home {font-size: 1.2em;margin-bottom: 0;}
p {font-size: 1em; font-weight: 300;line-height: 1.4;margin-bottom: 20px;}
p.white {color: #fff;}

h2.lead {font-size: 1.8em; padding: 0 0 20px 0; color: #fff;}
h2.lead.black {color: #222;}
h2.lead.nopad {padding: 0;}
h3.lead {color: #fff;}

.keyline {width: 40px;height: 2px;background: #fff;margin: 20px auto;}
.keyline.left {width: 40px;height: 2px;background: #fff;margin: 20px 0;}
.keyline.green {background: #7ED957;}

blockquote {padding: 0 20px 0 20px;border-left: 4px solid #7ED957;margin: 40px 0 40px 4px; font-style: italic;} 
blockquote p:first-child:before {color: #ccc;font-size: 1.2em;content: "\f10d";font-family: FontAwesome;display: block;}

/* Gradients */

.bg-organic-swirling, .bg-organic-swirling-blob {position: relative; overflow: hidden; background: radial-gradient(circle at 25% 30%, #7ED957, transparent 60%), radial-gradient(circle at 75% 70%, #3A8D5A, transparent 60%), #1C2E28; background-size: 200% 200%; background-blend-mode: overlay;animation: swirlBackground 30s ease-in-out infinite alternate;}

@keyframes swirlBackground {
  0% {background-position: 0% 0%, 100% 100%;}
  50% {background-position: 100% 0%, 0% 100%;}
  100% {background-position: 0% 0%, 100% 100%;}
}

.bg-organic-swirling-blob::after {content: ""; position: absolute; top: -20%; left: -20%; width: 140%; height: 140%; background: radial-gradient(circle, rgba(255,255,255,0.25) 0%, transparent 70%), radial-gradient(circle, rgba(255,255,255,0.25) 0%, transparent 50%); background-size: 50% 50%; mix-blend-mode: overlay; animation: blobMove 60s ease-in-out infinite alternate; pointer-events: none; z-index: 1;}

@keyframes blobMove {
  0% {transform: translate(0, 0) rotate(0deg);}
  50% {transform: translate(10%, -10%) rotate(180deg);}
  100% {transform: translate(0, 0) rotate(360deg);}
}

/* Header */

h1.header {padding: 0;margin: 0;font-size: 0;}
header {position: fixed;z-index: 9999;width: 100%;max-width: 1600px; margin: 0 auto;}
.nav-bar {background: rgb(255,255,255,0); transition: all 0.5s ease-in-out;}
.nav-bar.change {background: #000; transition: all 0.5s ease-in-out;}
.desktoplogo {margin: 0 !important; padding: 15px 0 !important; float: left;}
.bonus-bar {display: none; padding: 15px 0; box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, .5);}

section.hero, section.no-hero {padding: 80px 0; background: #000000;}
section.no-hero {padding: 48px 0;}

/* Main Navigation */

.staticcolor {background: #000000;}

.small-logo {float: left; margin: 0 30px 0 30px;}
.small-logo img {height: 70px;}
.mobile-logo {float: left; margin: 10px 0 0 20px; display: none;}
.mobile-logo img {height: 30px;}

.menu-main-menu-container {text-align: right; margin-top: 33px;}

nav {overflow:hidden;position: relative;}
nav ul {text-align:right;}
nav ul li {display:inline-block;}
nav ul li a {color:#fff;display:inline-block;padding: 0 0 0 20px;text-decoration:none;transition-property:all .25s linear 0s;-moz-transition:all .25s linear 0s;-webkit-transition:all .25s linear 0s;-o-transition:all .25s linear 0s;font-size: 1.2em;font-weight: 400;}
nav ul li a:hover {color: #7ED957;}
nav ul li a span {color: #7ED957;}

ul.bonus-contact li {float: left;margin: 6px 20px 0 0; font-size: 1.2em;}
ul.bonus-contact li a {color: #fff;}
ul.bonus-contact li a:hover {color: #7ED957;}
ul.bonus-contact li i {font-size: 1.3em; margin-right: 10px;vertical-align: middle; color: #ccc;}

#menu-main-menu .current_page_item a, #menu-main-menu .current_page_parent a {color: #7ED957;}
#menu-main-menu .current_page_item a:hover, #menu-main-menu .current_page_parent a:hover {color: #7ED957; cursor: default;}

.menu-button {position:absolute;right: 20px;top: 23px;z-index: 999;font-size: 1.2em;display: none;}
.menu-button a {text-decoration:none;}
.btn-open:after {color:#fff;content:"\f0c9";font-family:"FontAwesome";transition: color 0.25s linear;}
.btn-open:hover:after {color:#7ED957;}
.btn-close:after {color:#fff;content:"\f00d";font-family:"FontAwesome";transition: color 0.25s linear;}
.btn-close:hover:after {color: #7ED957;}

.menu-button span {margin: 4px 10px 0 0;color: #fff;font-size: 0.7em;vertical-align: top;display: inline-block;}

.overlay {display:none;position:fixed;top:0;height:100%;width:100%;max-width: 1920px;overflow:auto;z-index:99;}
.overlay-wrap {color:#fff;text-align:center;margin:0 auto;padding: 48px 0 28px 0;line-height: 1;}

.wsfbiglink {font-size: 1em;margin: 0px;padding: 0;list-style: none;}
.wsfbiglink li {position: relative;}
.wsfbiglink li a {display: block;text-align: center;padding: 22px 0px;text-transform: uppercase;color: #fff;letter-spacing: 1px;font-weight: 500;}
.wsfbiglink li a:hover {color: #F4DF17;}
.wsfbiglink li a:after {content: '';position: absolute;bottom: 0px;left: 50%;width: 5%;transform: translateX(-50%);height: 2px;background: #FFF;transition: .25s;}
.wsfbiglink li a:hover:after,
.wsfbiglink li a:focus:after,
.wsfbiglink li a:active:after {width: 10%;background: #ffd700;}
.wsfbiglink li:first-child a {padding-top: 0;}

.logo-mobile {margin: 40px 0;display: inline-block;}
.logo-mobile img {width: 120px;}

h2.off-screen-title {font-size: 1.1em;letter-spacing: 1px;}
h3.strapline {text-transform: none; font-weight: 300; line-height: 1.2em; font-size: 0.8em;margin-bottom: 30px;padding: 0 80px;}
ul.contact-mobile li {margin-bottom: 16px;line-height: 1em;}
ul.contact-mobile li a {color: #fff;}
ul.contact-mobile li a:hover {color: #ffd700;}
ul.contact-mobile li i {font-size: 1.4em; margin-right: 10px;vertical-align: text-bottom;}

/* Buttons */

a.button-link {display: inline-block;font-family: 'Montserrat', sans-serif;font-size: 0.8em;text-transform: uppercase;padding: 8px 24px;text-decoration: none;letter-spacing: 1px;margin: 0;min-width: 120px;transition: all 0.5s ease-in-out;-webkit-appearance: none;}
a.button-link.white {border: 2px solid #fff;color: #fff;}
a.button-link.black {border: 2px solid #777;color: #777; background: #fff;}
a.button-link.white:hover {border: 2px solid #7ED957; color: #7ED957;}
a.button-link.black:hover {border: 2px solid #546f1b; color: #546f1b;}

/* Parallax */

section.parallax {background-position: center center; min-width: 100%;min-height: 100%;background-repeat: no-repeat;background-attachment: fixed;-webkit-background-size: auto;-moz-background-size: auto;-o-background-size: auto;background-size: auto;}
section.parallax-home {padding: 240px 0; background: url("images/heros/keyrenewables-home.jpg") center center;height: 720px;}
section.parallax-install {padding: 240px 0; background: url("images/heros/keyrenewables-install.jpg") center center;height: 720px;}
section.parallax-contact {padding: 240px 0; background: url("images/heros/keyrenewables-contact.jpg") center center;height: 720px;}

/* Background-size:cover fix on iOS devices - AKA 'Apple suck balls' */

  @media only screen and (orientation: portrait) and (device-width: 320px), (device-width: 768px) {
    section.parallax {background-attachment: scroll;}
  }
  @media only screen and (orientation: landscape) and (device-width: 320px), (device-width: 768px) {
    section.parallax {background-attachment: scroll;}
  }

/* Default page */

.standard {padding: 80px 0 60px 0; overflow: auto;}

/* Homepage */

h2.home {font-size: 1.3em; padding: 0 0 10px 0; color: #fff;}
h2.home i {margin-right: 10px; color: #7ED957;}
h2.home a {color: #fff;}
h2.home a:hover {color: #7ED957;}
.welcome {padding: 80px 0 60px 0; overflow: auto;}
.apply {padding: 120px 0;}

img.house-small {width: 100%;}
.apply-now {text-transform: uppercase;font-size: 1.2em;float: right;}
.apply-now a {color: #fff;}

.steps-wrapper {padding: 0 40px 20px 40px;}
ul.steps {padding: 40px 0 0 0; text-align: center; color: #fff; margin-bottom: 20px;}
ul.steps li {margin-bottom: 12px;}
ul.steps li span {display: block; color: #ffd700; font-size: 1.2em; margin-bottom: 6px;}


.faqs {padding: 80px 0;}

.accordion-wrap {overflow: auto; border: 1px solid #ccc;padding: 0 20px;}
.accordion-container {width: 100%;clear: both;border-bottom: 1px solid #ccc;}
.accordion-container-last {width: 100%;clear: both;}
.accordion-toggle {padding: 20px 0;position: relative;display: block;padding-left: 20px;font-size: 1em;}
.accordion-toggle.open {color: #7ed957;}
.accordion-toggle span.toggle-icon {position: absolute;top: 20px;left: 0;font-size: 18px;}
.accordion-content {display: none;overflow: auto;background: #f2f2f2;padding: 20px 20px 0 20px;border: 1px solid #ccc;border-bottom: none;}

/* What We Install */

.install {padding: 80px 0;}
h3.typical {text-align: center; color: #fff;margin-top: 20px;font-size: 1em;}
.install ul {margin: 0 0 40px 40px;}
.install ul li, ul.install li {list-style: circle outside none; margin-bottom:10px;}
p.small {font-size: 0.8em; text-align: right;}

/* Testimonials */

.testimonials {padding: 80px 0 40px 0;}
p.disclaimer {font-size: 0.7em; margin-bottom: 40px;}
.testimonial-box {padding: 40px 40px 20px 40px;border: 1px solid #ccc; margin-bottom: 40px;}
ul.block {padding: 10px 20px;margin-bottom: 0; font-weight: 300;}
ul.block li {margin-bottom: 10px;list-style: disc outside none;display: list-item;margin-left: 1em;}
span.block-name {text-transform: uppercase; font-style: normal;}

/* Contact Form 7 */

h2.contact {font-size: 1.6em; padding: 0 0 10px 0; color: #fff;}
h2.contact i {margin-right: 10px; color: #7ed957;}
h2.contact a {color: #fff;}
h2.contact a:hover {color: #7ed957;}

.apply-wrap {background: rgba(0,0,0,0.2); padding: 20px 20px 20px 10px; overflow: auto; margin-bottom: 40px;}
h4.apply-form {font-size: 1.4em; padding: 0 0 20px 0; color: #fff;}
h5.apply-form {font-size: 1em; padding: 0 0 20px 0; color: #fff;text-align: right;}
span.required {color: red; font-size: 1.2em;}
p.form {margin-bottom: 6px;}
p.submit {margin: 16px 0 0 0;}
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 select {font-family: 'Montserrat', sans-serif; margin: 0;/*-webkit-appearance: none*/;border-radius: 0;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;background: none;font-size: 1.4em;width: 100%;padding: 10px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border: 2px solid #ccc; color:#fff;}
.wpcf7 input[type="text"]:hover, 
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:hover, 
.wpcf7 input[type="email"]:focus,
.wpcf7 select:hover,
.wpcf7 select:focus {background: #000;border: 2px solid #7ED957;} 
 .wpcf7 select:hover {cursor: pointer;}
.wpcf7-response-output {color: #7ED957;font-size: 1.0em;font-weight: 400;padding: 0 0 10px 0;text-align: center;} 
.wpcf7-mail-sent-ok {color: green;border-top: 1px solid #8fae1b;font-size: 1em;margin-top: 90px;padding: 10px 0;text-align: left;} 
span.wpcf7-list-item-label {margin-left: 5px; font-size: 1em;}
.wpcf7 .wpcf7-spinner {visibility: hidden;}
.wpcf7 form.submitting .wpcf7-spinner {visibility: visible;}
.wpcf7 input[type=submit] {float: left;background: none;border: 2px solid #ccc;display: inline-block;font-family: 'Montserrat', sans-serif;font-size: 1em;text-transform: uppercase;padding: 8px 24px;text-decoration: none;letter-spacing: 2px;margin: 0;min-width: 120px;transition: all 0.5s ease-in-out;-webkit-appearance: none;color: #fff;}
.wpcf7 input[type=submit]:hover {cursor: pointer;border: 2px solid #7ED957; color: #7ED957;}
.wpcf7 textarea {height: 220px;}
.screen-reader-response {display: none!important;}
.wpcf7-not-valid-tip {display: block;color: #7ED957;font-size: 0.8em!important; padding: 10px 0!important;}

.wpcf7 label {text-transform: uppercase;color: #fff;font-size: 0.8em;font-weight: 400;}

.wpcf7-list-item {margin-bottom: 30px;display: block;}
.wpcf7-form .wpcf7-radio label {position: relative;cursor: pointer;}
.wpcf7-form .wpcf7-radio input[type=radio] {position: relative; visibility: hidden;}
.wpcf7-form .wpcf7-radio input[type=radio] + span {color: #fff;border: 2px solid #fff;padding: 10px;font-size: 0.9em;margin: 20px 0 30px 20px;-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.wpcf7-form .wpcf7-radio input[type=radio] + span:hover {color: #ffd700; border: 2px solid #ffd700;}
.wpcf7-form .wpcf7-radio input[type=radio] + span:before {display: block;position: absolute;content: '';border-radius: 100%;height: 22px;width: 22px;top: 0px;border: 2px solid #ccc;}
.wpcf7-form .wpcf7-radio input[type=radio] + span:after {display: block;position: absolute;content: '';border-radius: 100%;height: 10px;width: 10px;top: 6px;left: 6px;visibility: hidden;}
.wpcf7-form .wpcf7-radio input[type=radio]:checked + span:before {background: transparent;border-color: #ffd700;}
.wpcf7-form .wpcf7-radio input[type=radio]:checked + span:after {background: #ffd700;visibility: visible;}

ul.benefits-list {padding: 0 20px; margin-bottom: 40px;}
ul.benefits-list li {color: #fff;margin-bottom: 4px;list-style: disc;padding: 0 20px;}
ul.benefits-list.left {width: 50%; float: left;}
ul.benefits-list.right {width: 50%; float: right;}

/* Blog */

.casestudies {padding: 80px 0 40px 0;}

h3.blog {font-size: 1.4em; margin-top: 20px;}

.post-wrap {margin-bottom: 60px;}
.post-hover {padding: 20px;border: 1px solid #ccc;}
.post-hover img {width: 100%; height: auto;vertical-align: top;}
.post-content {}
.post-content h3 {font-size: 1.2em;}

h4.share {text-align: center; text-transform: uppercase; font-size: 0.8em;}
.other-articles {margin-top: 60px;}
#nextprevtitle {height: 26px;font-size: 0.8em;text-transform: uppercase;border-bottom: 1px solid #ccc;} 
#nextprevlink {font-size: 1em;}  
#nextprevlink .left img, #nextprevlink .right img {max-width: 120px;height: auto;display: block;margin: 10px 0;border: 1px solid #ccc;padding: 5px;}   
#nextprevtitle p.left, #nextprevlink p.left {float: left;width: 45%;text-align: left;}  
#nextprevtitle p.right, #nextprevlink p.right {float: right;width: 45%;}

.post-featured-image {background: #fff;padding: 10px;width: 80%;float: right;}
.post-featured-image img {width: 100%; height: auto;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: -5px;}
.post-date {margin: 0;color: #fff;font-weight: 400;position: absolute;padding: 10px;text-transform: uppercase;background: #5F9EA0;}
.post-date span {font-size: 0.8em;}

/* Social Media */

ul.social-media-footer {overflow: auto; margin: 20px auto 0 auto; /* width: 241px; */ width: 181px;}
ul.social-media-footer li {float: left;}
ul.social-media-footer li a {display: inline-block;color: #ccc; border: 1px solid #6b8e23; border-radius: 50%; margin: 0 5px;transition: all 0.5s ease-in-out;}
ul.social-media-footer li a:hover {color: #7ed957;border: 1px solid #7ed957;}
ul.social-media-footer li a i {font-size: 1.4em;display: block;width: 48px;height: 48px;line-height: 48px;text-align: center;}

ul.social-media-share {list-style: none !important;}
ul.social-media-share li {margin-bottom: 5px; text-align: center;}
ul.social-media-share li a {display: inline-block;color: #ccc; border: 1px solid #ccc; border-radius: 50%; margin: 0 5px;transition: all 0.5s ease-in-out;}
ul.social-media-share li a:hover {color: #546f1b;border: 1px solid #546f1b;}
ul.social-media-share li a i {font-size: 1.4em;display: block;width: 48px;height: 48px;line-height: 48px;text-align: center;}

ul.social-media-contact {list-style: none !important;}
ul.social-media-contact li {float: left;}
ul.social-media-contact li a {display: inline-block;color: #222; border: 1px solid #ccc; border-radius: 50%; margin: 0 5px;transition: all 0.5s ease-in-out;}
ul.social-media-contact li a:hover {color: #e69a15;border: 1px solid #e69a15;}
ul.social-media-contact li a i {font-size: 1.4em;display: block;width: 48px;height: 48px;line-height: 48px;text-align: center;}

/* Cookies */

#cookie-law-info-again {left: 0 !important;box-shadow: none !important;}

/* Footer */

footer {background: #546f1b; color: #fff; padding: 40px 0 20px 0;}
footer a {color: #fff; font-weight: 300;}
footer a:hover {color: #7ed957;}
.footer-logo img {margin-bottom: 16px;}

h4.footer-ident {font-size: 0.9em; color: #fff;}

.footer-nav-wrapper {text-align: center;padding: 20px 40px 0 40px;}
.footer-nav-wrapper nav {display: inline-block;}
.footer-nav-wrapper ul {text-align: center; width: 100%;}
.footer-nav-wrapper li {display: inline-block;/* float: left */; border-right: 1px solid #6b8e23;padding: 0 10px;}
.footer-nav-wrapper a {font-size: 0.9em; padding: 0 10px;}
.footer-nav-wrapper li:last-child {border-right: none;}

ul.credits {font-size: 0.8em; display: inline-block; margin-top: 10px;}
ul.credits li, ul.credits li a {padding: 0 6px;}
ul.credits li:first-child {padding-right: 10px;}

.instagram-feed {pmargin: 20px 0;}
#sb_instagram .sbi_photo {border: 2px solid #fff !important;}
#sb_instagram .sbi_photo img {height: 100% !important;}

/* Back to the top */

#back-top {margin: 10px 0;}
#back-top i {font-size: 2.1em;width: 48px;height: 48px;line-height: 48px;transition: all 0.5s ease-in-out;}
#back-top i:hover {color: #ffd700;}

/* Responsive */
/* ---------- */
  
/* 1600px and above */

@media handheld, only screen and (min-width: 1600px) {
  	section.parallax {max-width: 1600px;}
}

/* 992px and below */
@media handheld, only screen and (max-width: 992px) {
  	.vertical-align {display: block;}
  	.menu-main-menu-container, .bonus-bar {display: none !important;}
  	.menu-button {display: block;}
  	.desktoplogo img {width: 120px;}
  	h2.lead, h2.contact {font-size: 1.4em;}
    h2.contact i {margin-right: 10px;}
    h3 {font-size: 1.4em;}
    h4.apply-form {font-size: 1.2em;}
  	.footer-nav-wrapper nav {display: none;}
  	ul.credits {display: block;}
  	ul.credits li, ul.credits li a {padding: 6px 0;}
	 blockquote {margin: 40px 0 40px 20px;}
	 .footer-nav-wrapper li {display: block;float: none; border-right: none;padding: 6px 10px;}
	 .footer-nav-wrapper a {font-size: 0.9em; text-align: center;} 
  	ul.social-media-share li {float: left;}
  	h4.share {text-align: left;margin-top: 20px;}
  	br.remove-mobile, .remove-mobile {display: none !important;}
  	.other-articles {margin-top: 20px;}
  	section.no-hero {padding: 34px 0;}
    img.house-small {max-width: 100px; margin-bottom: 30px;}
}

/* 767px and below */
@media handheld, only screen and (max-width: 767px) {
  	.top-section {margin-top: 0;}
  	section.parallax {-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;background-attachment: scroll;}
  	section.parallax-home {padding: 80px 0 0 0; height: 580px;}
  	section.parallax-contact {padding: 80px 0 0 0; height: 480px;}
  	.post-content {padding: 0 !important; box-shadow: none;}
  	.testimonial-box {padding: 40px 10px 20px 10px;}
  	.testimonial-box h3 {padding-left: 20px;}
  	.post-featured-image {width: 100%;float: none;}
    .post-wrap {margin-bottom: 40px;}
    .welcome, .apply {padding: 40px 0 20px 0;}
    .faqs {padding: 40px 0;}
    .testimonials {padding: 40px 0 0 0;}
    .casestudies {padding: 40px 0 0 0;}
    section.hero {padding: 80px 0 40px 0;}

/* 640px and below */
@media handheld, only screen and (max-width: 640px) {
  	#nextprevtitle p.left span, #nextprevtitle p.right span {display: none;}
  	#sb_instagram #sbi_images .sbi_item{ display: none; }
  	#sb_instagram #sbi_images .sbi_item:nth-child(-n+4){ display: inline-block; }
}

/* 520px and below */
@media handheld, only screen and (max-width: 640px) {
    ul.benefits-list li {padding: 0;}
    ul.benefits-list.left {width: 100%; float: none; margin-bottom: 0 !important;}
    ul.benefits-list.right {width: 100%; float: none; margin-bottom: 40px !important;}
    h2.lead {font-size: 1.2em;}
}