@import url('https://fonts.googleapis.com/css2?family=Just+Another+Hand&family=Montserrat:wght@400;600&family=Open+Sans:wght@400;600&display=swap');

html, 
body {
    overflow-x: hidden;
}

body {
    font-family: 'Montserrat', sans-serif;
    color: #7c7c7c;
    font-size: 18px;
}

/*Main Colours*/
.darkgreen. {color: #3c6c4a;}
.lightgreen {color: #f3fbf6;}
.darkgrey {color: #252525}


.main-top {
    margin-top: 50px;
}

.main-bottom {
    margin-bottom: 80px;
}

.site-branding, 
#content, 
.site-info {
	width: 1386px;
	margin: 0 auto;
	padding: 0 20px;
	position: relative;
}
header#masthead {
    padding: 20px 0px 1px;
    position: absolute;
    z-index: 10;
    width: 100%;
}

.custom-logo {
    width: 250px;
}

.site-navigation {
    padding-right: 0px;
}

#contact-info {
    position: absolute;
    top: 0;
    right: 20px;
    font-size: 16px;
    font-weight: bold;
}
#contact-info a {
    color: #fff;
    text-decoration: none;
}
#contact-info img {
    height: 14px;
    position: relative;
    top: 1px;
    margin-right: 6px;
}
#contact-info img:last-child {
    margin-left: 20px;
}
/* Main Navigation Styles */
.main-navigation {
    float: right;
    margin-top: 50px;
}
.main-navigation a {
	color: #fff;
    font-size: 15px;
    border-bottom: 1px solid transparent;
    -webkit-transition:  all 0.3s ease;
    -moz-transition:  all 0.3s ease;
    -o-transition:  all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all 0.3s ease; 
}
.main-navigation a:hover {
    border-bottom: 1px solid #fff;
}

.main-navigation li.current-menu-item a {
    border-bottom: 1px solid #fff;
}
.main-navigation li {
    font-weight: bold;
    margin: 17px 20px 16px 0;
}
.main-navigation li:last-child {
    margin-right: 0;
}
.quote-btn {
    margin: 0 !important;
}
.quote-btn a {
    font-size: 15px;
    border: 2px solid #fff !important;
    padding: 14px 26px;
    border-radius: 30px;
    text-transform: uppercase;
    cursor: pointer;
    transition: 0.3s ease-in-out;
}
.quote-btn a:hover {
    background: white;
    color: #3c6c4a;
}

h1,
h2, 
h3, 
h4, 
h5, 
h6 {
	font-family: 'Just Another Hand', cursive;
    color: #3c6c4a;
    font-weight: 400;
}

h1 {
    /*font-size: 70px !important;*/
    font-size: 80px !important;
    margin-bottom: 10px !important;
}

h2 {
    font-size: 36px;
}

/* MAIN CONTENT STYLES */
#page .entry-title {
    display: none;
}

/*SERVICES Home*/
.services-container {
    width: 100%;
    margin: 0 auto;
    position: relative;
    padding: 40px 0px;
 }

 .service-container {
    width: 90%;
    margin: 0 auto !important;
    padding-bottom: 20px;
    font-size: 16px;
}
.service-blocks {
    padding: 0 40px !important;
    transition: 0.3s ease-in-out;
}
.service-blocks:hover {
    box-shadow: 0px 8px 8px rgb(60 108 74 / 0.2);
    border-radius: 20px;
}
.small-home-img img {
    height: 115px !important;
    margin-top: 20px;
}
.service-blocks h2 {
    text-transform: uppercase;
    margin-top: 50px;
    min-height: 85px;
    line-height: 38px;
}
.service-blocks:first-child h2 {
    position: relative;
    top: 15px;
}
.service-blocks p:first-of-type {
    min-height: 120px;
}
.service-blocks a {
    display: block;
    font-weight: 700;
    border-bottom: 1px solid #3c6c4a;
    width: 90px;
    margin: 38px auto 45px !important;
    text-decoration: none;
    line-height: 16px;
    opacity: 0;
    transition: 0.3s ease-in-out;
}
.service-blocks:hover a {
    opacity: 1;
}
.energy-container, .benefits-container, .light-dark-gradient {
    background: rgb(64,153,150);
    background: -moz-linear-gradient(90deg, rgba(64,153,150,1) 0%, rgba(62,89,133,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(64,153,150,1) 0%, rgba(62,89,133,1) 100%);
    background: linear-gradient(90deg, rgba(64,153,150,1) 0%, rgba(62,89,133,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#409996",endColorstr="#3e5985",GradientType=1);
}
.who-we-work-with-container, .dark-light-gradient {
    background: rgb(62,89,133);
    background: -moz-linear-gradient(90deg, rgba(62,89,133,1) 0%, rgba(64,153,150,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(62,89,133,1) 0%, rgba(64,153,150,1) 100%);
    background: linear-gradient(90deg, rgba(62,89,133,1) 0%, rgba(64,153,150,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3e5985",endColorstr="#409996",GradientType=1);
}
.energy-container {
    padding-top: 45px;
    padding-bottom: 45px;
}
.energy-container h1,
.energy-container p,
.energy-container a,
.who-we-work-with-container h2 {
    color: #ffffff;
}
.wht-txt, .wht-txt h2 {
    color: #ffffff !important;
}
.energy-container h2 {
    font-size: 90px;
    margin: 20px 0 25px;
    line-height: 100px;
}
.energy-container p, 
.affordable-container p {
    font-size: 16px;
}
.testimonials-container h2,
.affordable-container h2,
.blue-txt, .blue-txt h2 {
    color: #409996 !important;
}
.light-dark-gradient,
.dark-light-gradient,
.no-gradient-row {
    padding: 30px 0 15px;
}
.light-dark-gradient p,
.light-dark-gradient h2,
.light-dark-gradient h3,
.light-dark-gradient h4,
.light-dark-gradient ul,
.dark-light-gradient p,
.dark-light-gradient h2,
.dark-light-gradient h3,
.dark-light-gradient h4,
.dark-light-gradient ul {
    color: #ffffff !important;
}
.no-gradient-row h2,
.no-gradient-row h3,
.no-gradient-row h4 {
    color: #409996 !important;
}
.light-dark-gradient h2,
.dark-light-gradient h2,
.no-gradient-row h2 {
    margin: 0;
}
.light-dark-gradient h3,
.dark-light-gradient h3,
.no-gradient-row h3 {
    font-size: 60px;
    margin: 0;
}
.light-dark-gradient h4,
.dark-light-gradient h4,
.no-gradient-row h4 {
    font-size: 40px;
    margin: 0;
}
.wpb_single_image.wpb_content_element.vc_align_center.margin-bot-10 {
    margin-bottom: 10px !important;
}
.hover-box h2 {
    font-size: 40px !important;
    margin: 0 0 20px !important;
}
.hover-box p {
    font-size: 16px !important;
}

/* Home page The Energy Box section button originally used */
.gb-btn {
    background: #3c6c4a;
    color: #fff !important;
    border: 2px solid #3c6c4a;
    padding: 13px 60px;
    border-radius: 40px;
    transition: 0.3s ease-in-out;
    text-decoration: none;
    font-weight: 600;
    display: block;
    width: fit-content;
    text-transform: uppercase;
    margin-top: 35px;
    box-shadow: 0px 3px 10px rgb(58 58 58 / 42%);
    font-size: 16px;
}
.gb-btn:hover {
    background: #fff;
    color: #3c6c4a !important;
}
/* ----------------------------------------- */
.lightblue-btn {
    background: #409996;
    color: #fff !important;
    border: 2px solid #409996;
    padding: 13px 60px;
    border-radius: 40px;
    transition: 0.3s ease-in-out;
    text-decoration: none;
    font-weight: 600;
    display: block;
    width: fit-content;
    text-transform: uppercase;
    margin-top: 35px;
    box-shadow: 0px 3px 10px rgb(58 58 58 / 42%);
    font-size: 16px;
}
.lightblue-btn:hover {
    background: #fff;
    color: #409996 !important;
}

.affordable-container {
    padding: 50px 0 80px;
}
.affordable-container h2 {
    font-size: 90px;
    margin: 60px 0 25px;
    line-height: 100px;
}


.benefits-container {
    /*background: url(/wp-content/uploads/2022/03/Lightbulb-with-light.png) no-repeat;
    background-position: 95%;
    background-size: 450px;
    padding-bottom: 20px;*/
    color: #fff;
}
.benefits-container h2 {
    font-size: 90px;
    color: #fff;
    margin: 0 0 10px;
}

.inside-header {
    padding: 40px 0;
}

.benefit-list ul {
    line-height: 50px;
    list-style: none;
    position: relative;
    padding-left: 0;
}
.benefit-list ul li {
    color: #fff;
    font-size: 18px;
    font-weight: normal;
    position: relative;
    padding-left: 55px;
    line-height: 23px;
    padding-bottom: 22px;
}
.benefit-list ul li::before {
    content: "";
    position: absolute;
    background: url(/wp-content/uploads/2022/03/power-benefits.svg) no-repeat;
    width: 20px;
    height: 20px;
    left: 0;
    top: 0;
}
.gallery-container {
    padding: 70px 0;
}

.brighter-future {
    position: relative;
    padding: 50px 0px 60px;
    color: #fff;
}
 .brighter-future::before {
    content: "";
    background-color: rgb(0 0 0 / 0.5);
    position: absolute;
    display: block !important;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.brighter-future .vc_column-inner {
    padding-top: 0 !important;
}
 .brighter-future h2 {
    font-size: 120px;
    margin: 0;
    color: #fff;
    line-height: 160px;
}
.wm-btn {
    background: #fff;
    color: #3c6c4a !important;
    border: 2px solid #fff;
    padding: 13px 60px;
    border-radius: 40px;
    transition: 0.3s ease-in-out;
    text-decoration: none;
    font-weight: 600;
    display: block;
    width: fit-content;
    text-transform: uppercase;
    margin: 45px auto 0;
    box-shadow: 0px 3px 10px rgb(58 58 58 / 42%);
    font-size: 16px;
}
.wm-btn:hover {
    background: transparent;
    color: #fff !important;
}
.wm2-btn {
    background: #fff;
    color: #3c6c4a !important;
    border: 2px solid #fff;
    padding: 13px 60px;
    border-radius: 40px;
    transition: 0.3s ease-in-out;
    text-decoration: none;
    font-weight: 600;
    /*width: fit-content;*/
    text-transform: uppercase;
    margin: 45px auto 0;
    box-shadow: 0px 3px 10px rgb(58 58 58 / 42%);
    font-size: 16px;
}
.wm2-btn:hover {
    background: transparent;
    color: #fff !important;
}


/* HOME CONTACT FORM STYLES */
.wpb_gmaps_widget .wpb_wrapper {
    padding: 0 !important;
}

.home-contact-frm {
    background: url(/wp-content/uploads/2022/03/Car-Image.png);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    color: #fff;
    padding: 60px 0 100px;
}
.home-contact-frm h2 {
    font-size: 80px;
    line-height: 140px;
    margin: 0 0 50px;
    color: #409996;
}

.question-form {
    width: 90%;
    float: right;
}

.wpcf7-form-control {
    font-weight: bold;
}

.q-left, 
.q-right {
    width: 100%;
}
.q-left input,
.q-right input {
    width: 100%;
    padding: 18px 40px;
    border-radius: 40px;
    margin-bottom: 35px;
    /*border: 2px solid #3c6c4a;*/
	border: 2px solid #409996;
}
.q-right textarea {
    height: 177px;
    padding: 18px 40px;
    border-radius: 30px;
    margin-bottom: 20px;
    /*border: 2px solid #3c6c4a;*/
	border: 2px solid #409996;
}
.question-submit {
    height: 50px;
}
.question-submit input {
    /*background: #3c6c4a;*/
    background: #409996;
    color: #fff !important;
    /*border: 2px solid #3c6c4a !important;*/
    border: 2px solid #409996 !important;
    padding: 16px 80px;
    border-radius: 40px;
    transition: 0.3s ease-in-out;
    text-decoration: none;
    font-weight: 600;
    display: block;
    width: fit-content;
    text-transform: uppercase;
    float: right;
    margin-top: 20px;
    box-shadow: 0px 3px 10px rgb(58 58 58 / 42%);
    cursor: pointer;
}
.question-submit input:hover {
    background: #fff;
    color: #3c6c4a !important;
}

.quote-form {
    margin-top: 20px;
    margin-bottom: 80px;
}
.eb-btn a {
    background: #409996 !important;
    color: #fff !important;
    border-radius: 40px !important;
    font-weight: 600;
    padding: 15px 50px !important;
    font-size: 16px !important;
	text-decoration: none !important;
    border: 2px solid #409996 !important;
    transition: 0.3s ease-in-out;
}
.eb-btn a:hover {
    background: #fff !important;
    color: #409996 !important;
}


/* Contact Page */
.contact-email, 
.contact-phone, 
.contact-instagram, 
.contact-facebook {
	font-family: 'Montserrat' sans-serif;
	color: #3c6c4a;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 0 !important;
	position: relative;
}
.contact-email::after {
	content: 'hello@theenergybox.net';
	position: absolute;
	top: 33px;
}
.contact-phone::after {
	content: '07395846847';
	position: absolute;
	top: 33px;
}

.contact-instagram::after {
	content: 'the_energy_box';
	position: absolute;
    top: 33px;
}
	
.contact-facebook::after {
	content: 'The Energy Box';
	position: absolute;
	top: 33px;
}

.contact-frm h2 {
    margin: 0;
    padding-bottom: 20px;
}

.contact-frm .question-form {
    width: 100%;
    float: none;
}

.solar-row {
    background-color: #3c6c4a;
    color: white
}

.solar-row h2 {
    color: white;
}

/* Quote Form Styles */
#wpcf7-f220-p66-o1 [type="submit"] {
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	text-decoration: none;
	box-shadow: 0 3px 10px 0;
	background-color: #3c6c4a;
	padding: 10px 40px 10px 40px;
	margin-bottom: 50px;
	border-radius: 30px;
	float: right;
	cursor: pointer;
}

#wpcf7-f220-p66-o1 [type="submit"]:hover {
    background-color: transparent !important;
  cursor: pointer;
  border: 1px solid #3c6c4a;
  color: #3c6c4a !important;
  -webkit-transition:  border 0.3s ease;
  -moz-transition:  border 0.3s ease;
  -o-transition:  border 0.3s ease;
  -ms-transition: border 0.3s ease;
  transition: border 0.3s ease;
}

/* MAIN FOOTER STYLES */

footer#colophon {
    background: #252525;
    color: #fff;
    display: flex;
    padding: 50px 0 30px;
    font-size: 16px;
}
.fwidgets {
    width: 25%;
    float: left;
}

ul, ol {margin: 0 0;}

#f1 ul {
    padding: 0px;
}
#f1 ul li {
    list-style: none;
    line-height: 26px;
}
footer#colophon a {
	color: inherit;
	text-decoration: none;
}
footer#colophon h2 {
    margin-top: 0;
    font-family: 'Open Sans', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #fff;
}
.footer-tel, 
.footer-email, 
.footer-address {
    position: relative;
    padding-left: 40px;
    margin-bottom: 30px;
    line-height: 22px;
}
.footer-tel:before {
    content: "";
    position: absolute;
    background: url(/wp-content/uploads/2022/03/noun-phone-2232835.svg);
    width: 20px;
    height: 20px;
    left: 0;
    top: -1px;
}
.footer-email:before {
    content: "";
    position: absolute;
    background: url(/wp-content/uploads/2022/03/noun-email-1740173-new.svg);
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    left: 0;
    top: 3px;
}
.footer-address:before {
    content: "";
    position: absolute;
    background: url(/wp-content/uploads/2022/03/noun-location-1041848.svg);
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    left: 0;
    top: 2px;
}
.footer-social-icons {
    height:auto;
    width:60px;
    margin: 0 7px;
}
section#media_image-2 img {
    margin-top: 20px;
    width: 200px;
}
section#media_image-3 img {
    width: 200px;
    margin-top: 10px;
}

#f3 img {
    position: relative;
    top: 0px;
    left: 0;
    
}

#f4 {
    text-align: center;
}
#f4 .textwidget {
    font-size: 14px	
}

.social-icons {
    display: inline-block;
    margin-right: 50px;
    text-align: center;
    margin: 0 auto;
}
.social-icons img {
    width: 20px;
    height: 20px;
}

img.facebook-icon {
    margin-right: 20px;
}

#bottombar {
    display: flex;
    justify-content: center;
    height: 48px;
    background-color: #0e3f1c;
    color: #fff;
    font-size: 14px;
    padding: 15px 10px;
    position: absolute;
    width: 100%;
}

#bottombar a {
    color: #fff;
}

/* #f1, #f2, #f3 {padding-right: 5%;} */
footer#colophon h2 {
    margin-top: 0;
    font-family: 'Open Sans', sans-serif;
    font-size: 24px;
}
footer#colophon a {
	color: inherit;
	text-decoration: none;
}
#f4 {
    text-align: center;
}
#wpcf7-f220-p16-o1 .q-left input, 
#wpcf7-f220-p16-o1 .q-right input {
    margin-bottom: 20px;
}
.q-right select {
    width: 100%;
    padding: 18px 40px;
    border-radius: 40px;
    margin-bottom: 20px;
    border: 2px solid #3c6c4a;
    color: #757575;
}


.sub-menu {
    display: block !important;
    background: rgba(0,0,0,0.5);
    padding: 0 20px !important;
}
.sub-menu li {
    margin-right: 0;
}
.main-navigation ul ul a {
    width: 212px;
}
.main-navigation .sub-menu li.current-menu-item a, 
.main-navigation .sub-menu li a:hover {
    border-bottom: 1px solid transparent !important;
}
.givenergy-battery-logo img {
    margin-bottom: -32px
}
.givenergy-battery-text-right {
    margin-top: -30px;
    font-size: 14px;
}
.page-id-18 h1{
    margin-top: 0;
}
.vc_custom_heading.vc_gitem-post-data.vc_gitem-post-data-source-post_title h4 {
    font-size: 35px;
    margin: 10px 0 0;
}
a.vc_general.vc_btn3.vc_btn3-size-md.vc_btn3-shape-rounded.vc_btn3-style-flat.vc_btn3-color-juicy-pink {
    background: #3c6c4a;
    color: #fff !important;
    border: 2px solid #3c6c4a;
    padding: 13px 60px;
    border-radius: 40px;
    transition: 0.3s ease-in-out;
    text-decoration: none;
    font-weight: 600;
}


.footer-social-block {
    width: 306px;
    display: block;
    margin: auto;
    max-width: 306px;
}


/* About page 2023 update */
/*.about-job-title p:before {
    content: "";
    position: absolute;
    bottom: 44px;
    left: 31px;
    background: url(/wp-content/uploads/2023/05/linkedin-about-icon.png);
    width: 41px;
    height: 41px;
    background-repeat: no-repeat;
}*/

.about-job-title p {
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    min-width: 170px;
    color: #252525;
}

.about-job-title p strong img {
    margin-right: 15px;
    margin-top: 5px;
}

/* --- Google Reviews Widget (Homepage) --- */
.grwp_header-inner {
    display: none !important;
}
#g-review .swiper {
    padding-bottom: 20px !important;
}
#g-review .swiper .slider-prev-next-wrapper .grwp-swiper-button-next, 
#g-review .swiper .slider-prev-next-wrapper .grwp-swiper-button-prev {
    display: none;
}


/* ---------------------- */

@media screen and (min-width: 768px) {
    .vc_custominfiniteloop .vc_images_carousel .vc_carousel-control .icon-prev {
        left: -15px;
    }

    .vc_custominfiniteloop .vc_images_carousel .vc_carousel-control .icon-next {
        left: 70px;
    }

    .vc_custominfiniteloop .vc_images_carousel .vc_carousel-control .icon-next, .vc_custominfiniteloop .vc_images_carousel .vc_carousel-control .icon-prev {
        margin-top: -35px;
        font-size: 45px;
        color: white;
        border: none;
        text-shadow: none;
    }

    .vc_custominfiniteloop img {
        display: block;
        margin: auto;
    }
}








@media screen and (max-width: 1386px) {
	.site-branding, 
	#content, 
	.site-info {
		width: 100%;
	}
}

@media screen and (max-width: 1270px) {
    .footer-social-icons {
        width: 70px;
    }

    .footer-social-block {
        width: 261px;
    }
}

@media screen and (max-width: 1200px) {
    .custom-logo {
        width: 200px;
    }
    .main-navigation li {
        margin: 17px 25px 16px 0;
    }
    .service-container {
        width: 100%;
    }
    .brighter-future p br {
        display: none;
    }
}

@media screen and (max-width: 1124px) {
    .main-navigation {
        display: none;
        float: none;
        width: 100%;
        text-align: right;
    }

    #contact-info {
        display: none;
    }
}

@media screen and (max-width: 1000px) {
    .main-navigation {
        display: none;
        float: none;
        width: 100%;
        text-align: right;
    }
    #contact-info {
        display: none;
    }
/*    .benefits-container {
        background-image: none;
    }*/
    .services-container {
        width: 100%;
        left: 0;
    }
    .eb-services {
        padding: 50px 30px !important;
    }
    .fwidgets {
        width: 50%;
    }
    #f3 {
        clear: left;
    }
    .quote-btn a {
        border: 0 !important;
        text-transform: none;
        border-radius: 0;
    }
    .footer-social-icons {
        width: 85px;
    }

    .footer-social-block {
        width: 306px;
    }
}

@media screen and (max-width: 980px) {
     .custom-logo {
        width: 70%;
    }
    #contact-info {
        position: absolute;
        margin: auto;
        width: 100%;
        text-align: center
    }
    .energy-container .vc_custom_heading, 
    .affordable-container .vc_custom_heading {
        font-size: 78px;
        line-height: 6rem;
    }
    #f3 img {
        padding: 10px;
    }
}

@media screen and (max-width: 767px) {
    .custom-logo-link {
        display: block;
        text-align: center;
    }
    .custom-logo {
        width: 30%;
        position: relative;
    }
    #contact-info {
        position: relative;
        top: 0;
        right: 0;
        text-align: center;
        margin-top: 15px;
    }
/*    .benefits-container {
        background-image: none;
    }*/
    .eb-services {
        min-height: auto !important;
    }
    .brighter-p {
        padding: 0px;
    }
    .home-contact-frm  {
        background-position: 0px 90px;
    }
    .question-form {
        width: 100%;
    }
    .site-info {
        display: block;
    }
    footer#colophon {
        height: 100%;
        text-align: center;
    }
    .footer-tel, 
    .footer-email, 
    .footer-address {
        padding-left: 0;
    }
    .footer-tel:before, 
    .footer-email:before, 
    .footer-address:before {
        position: relative;
        top: 0;
        display: block;
        margin: 0 auto 10px;
    }
    .ot-txt {
        width: auto;
    }
    .service-blocks {
        box-shadow: 0px 8px 8px rgb(60 108 74 / 20%);
        border-radius: 20px;
        margin-bottom: 40px;
    }
    .service-blocks h2 {
        min-height: auto;
    }
    .service-blocks:first-child h2 {
        top: 0;
    }
    .service-blocks a {
        opacity: 1;
    }
    .service-blocks p:first-of-type {
        min-height: auto;
    }
    .benefit-list ul {
        padding-inline-start: 0;
    }
    .benefit-list ul li {
        padding-left: 40px;
    }
    .brighter-future {
        padding: 70px 0 60px;
    }
    .brighter-future h2 {
        line-height: initial;
    }
    .home-contact-frm {
        background: none;
    }
    .home-contact-frm h2 {
        text-align: center !important;
        font-size: 80px;
        line-height: 100px;
    }
    .home-contact-frm .gb-btn {
        margin: 35px auto 0;
    }
}

@media screen and (max-width: 668px) {
    #f3 .footer-social-icons {
        width: 70px;
        padding: 4px;
        margin: 0 2px;
    }

    .footer-social-block {
        width: 231px;

    }
}

@media screen and (max-width: 500px) {
    .custom-logo {
        width: 150px;
    }
    footer#colophon {
        padding: 80px 0 60px;
    }
    .fwidgets {
        width: 100%;
        text-align: center;
    }
    #f3 img {
        top: 0;
    }
}