/********************************* [ GLOBAL STYLES ] *********************************/ .clear { clear: both; } .clear:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .post, .page { margin: 0 !important; } div, span, ul, li, img, header, nav, footer, main, article, aside, section { position: relative; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } body { position: relative; font-size: 1.1rem; line-height: 1.6rem; font-weight: 400; font-family: 'Ubuntu Sans', sans-serif; color: #555; } /***************************/ /* GLOBAL COLOUR - #293468 */ /***************************/ a, a:visited { text-decoration: none; color: #293468; } a:active, a:hover { text-decoration: underline; color: #293468; } h1, h2, h3, h4, h5, h6 { margin: 0 0 40px; color: #293468; letter-spacing: 0px; line-height: 1em; font-weight: 700; font-family: 'Raleway', sans-serif; text-shadow: none; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #293468; } h1 { font-size: 3.2rem; line-height: 3.4rem; } h2 { font-size: 2rem; line-height: 2.4rem; } .entry-content h2 { margin-bottom: 10px; } h3 { font-size: 2.5rem; line-height: 3rem; } h4 { font-size: 2.2rem; line-height: 2.8rem; } h5 { font-size: 1.8rem; line-height: 2.2rem; } h6 { font-size: 1.5rem; line-height: 1.8rem; } strong { font-weight: 700; } p { margin: 0 0 2rem; } ::-webkit-input-placeholder { color: #222; } ::-moz-placeholder { color: #222; } :-ms-input-placeholder { color: #222; } :-moz-placeholder { color: #222; } input:focus, input:active, input[type="checkbox"], select, textarea { outline: none; } input[type=text], input[type=email], input[type=tel], input[type=password], input[type=number], input.text, input.title, textarea, select { background-color: #fff; color: #222 !important; border: 1px solid #cecece; padding: 12px !important; color: #222; font-weight: 400; font-size: inherit; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } input[type=text]:focus, input[type=email]:focus, input[type=tel]:focus, input[type=password]:focus, input[type=number]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus { border-color: #cecece; color: #222; box-shadow: 0 0 10px rgba(4,79,134,0.2); } textarea { resize: vertical !important; } .gfield_checkbox input[type="checkbox"] { opacity: 0; } .gfield_checkbox label::before{ content: ""; display: inline-block; height: 20px; width: 20px; left: 0; border: 2px solid; border-radius: 6px; } .gfield_checkbox label::after { content: ""; display: inline-block; height: 8px; width: 12px; border-left: 2px solid; border-bottom: 2px solid; transform: rotate(-45deg); } .gfield_checkbox label { position: relative; padding-left: 26px !important; } .gfield_checkbox label::before, .gfield_checkbox label::after { position: absolute; } .gfield_checkbox label::before { top: 2px; } .gfield_checkbox label::after { left: 4px; top: 6px; color: #6ea502; } /*Hide the checkmark by default*/ .gfield_checkbox input[type="checkbox"] + label::after { content: none; } /*Unhide the checkmark on the checked state*/ .gfield_checkbox input[type="checkbox"]:checked + label::after { content: ""; } /*Adding focus styles on the outer-box of the fake checkbox*/ .gfield_checkbox input[type="checkbox"]:focus + label::before { outline: rgb(59, 153, 252) auto 5px; } input[type=button], input[type=submit], button, .button, a.read-more, .reply-container a, #commentform input#submit, .shortcode-button a { -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; /* For Mobiles */ border-radius: 0px; -webkit-border-radius: 0px; position: relative; background: #293468; border: 0px none; display: inline-block; cursor: pointer; color: #fff !important; font-size: 0.9rem; font-weight: 700; font-family: 'Ubuntu Sans', sans-serif; text-decoration: none !important; text-transform: uppercase; letter-spacing: 2px; line-height: 2rem; padding: 22px 50px 20px; } input[type=button] i, input[type=submit] i, button i, .button i, a.read-more i, .reply-container a i, #commentform input#submit i, a i, .shortcode-button a i { margin-right: 10px; } input[type=button]:hover, input[type=submit]:hover, button:hover, .button:hover, a.read-more:hover, .reply-container a:hover, #commentform input#submit:hover, .shortcode-button a:hover { background: #78ABE2 !important; text-decoration: none !important; color: #fff !important; } /* Change this class to whatever ID or class you wish to animate */ input, select, textarea, article, section, input[type=button], input[type=submit], button, .button, a.read-more, .shortcode-button a, ul.site-info li .footer-socials a { -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .site-header, .site-branding, .site-branding img, .main-navigation, .main-navigation li a, .main-navigation li a::after, .main-navigation ul ul, #home-latest-news ul li, ul#projects-loop li { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /******************************* [ END GLOBAL STYLES ] *******************************/ .container { margin: 0 auto; width: 1560px; } #primary { float: left; width: 70%; text-align: left; padding: 150px 0px; } .fullwidth #primary { float: none; width: auto; } #secondary { float: right; width: 30%; text-align: left; padding: 150px 0px; } /********************************* [ HEADER STYLES ] *********************************/ .site-header { position: fixed; z-index: 11; top: 0; width: 100%; display: flex; flex-flow: row nowrap; background: rgba(255,255,255,1); box-shadow: 0px 0px 30px rgba(0,0,0,0.1); -webkit-box-shadow: 0px 0px 30px rgba(0,0,0,0.1); padding: 20px; } .site-branding { width: 20%; position: relative; } .site-branding img { display: block; max-width: 230px; } .site-header.scroll-fixed { background: rgba(255,255,255,1); padding: 10px 20px; } .site-header.scroll-fixed .site-branding img { max-width: 110px; } /******************************* [ END HEADER STYLES ] *******************************/ /********************************* [ NAVIGATION STYLES ] *********************************/ .header-mobmenu { display: none !important; width: 100px; text-align: center; } .main-navigation { width: 80%; display: flex; flex-flow: row nowrap; justify-content: flex-end; align-items: center; } .main-navigation li { } .main-navigation li a { position: relative; display: inline-block; margin: 0px 35px; padding: 10px 0px; line-height: 1rem; font-size: 1.3rem; font-family: 'Ubuntu Sans', sans-serif; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; color: #293468; } .main-navigation li a:hover { text-decoration: none; color: #293468; } .main-navigation li a::after { position: absolute; bottom: 0px; left: 50%; z-index: 1; content: ''; width: 0; height: 2px; background: rgba(41,52,104,0); } .main-navigation li.current_page_item a::after, .main-navigation li a:hover::after { left: 0; width: 100%; background: rgba(41,52,104,1); } .main-navigation li:last-child ul { margin-left: -150px; text-align: right; } .menu-item-has-children::before { position: absolute; z-index: 11; right: 7px; top: 50%; margin-top: -3px; content: ''; background: url(images/menu-dropdown.png) no-repeat 0 0; width: 11px; height: 6px; } .main-navigation ul ul { display: block; width: 300px; background: #293468; border-top: 3px solid rgba(27,96,18,1); margin-top: -3px; padding: 10px 0 15px; } .main-navigation ul ul a { width: 90%; font-size: 1.2rem; line-height: 1.8rem; padding: 12px 10px 7px; } .main-navigation ul ul a::after { display: none; } #mysticky-nav.wrapfixed { z-index: 999 !important; } #mysticky-nav.wrapfixed .site-branding { padding: 15px; } #mysticky-nav.wrapfixed .site-branding img { max-width: 150px; } #mysticky-nav.wrapfixed .main-navigation { margin-top: 20px; margin-right: 2%; } #mysticky-nav.wrapfixed .main-navigation a { color: #fff; } #mysticky-nav.wrapfixed .main-navigation a::after { display: none; } /******************************* [ END NAVIGATION STYLES ] *******************************/ /********************** [ BODY STYLES ] **********************/ #homepage-slider { } /* Padding Sections */ #home-intro, #home-services, #home-quote { padding: 120px 0px 100px; } #home-intro { padding-bottom: 140px; } #home-intro section { text-align: center; } #home-intro section h1 { position: relative; } #home-intro .button { font-size: 1.8rem; padding: 35px 0px; position: absolute; z-index: 2; bottom: -80px; left: 50%; margin-left: -275px; width: 550px; text-align: center; border-radius: 10px; -webkit-border-radius: 10px; background: #78ABE2 !important; } #home-intro .button:hover { transform: translateY(-10px); } #home-intro .button i { display: block; margin: 10px auto 0; font-size: 48px; } #home-services { background: url(images/bg-home-section-2.webp) no-repeat 50% 50% fixed; background-size: cover; -webkit-background-size: cover; font-weight: 700; font-family: 'Raleway', sans-serif; color: #fff; font-size: 1.4rem; padding-top: 180px; } #home-services article { z-index: 2; display: block; } #home-services article section { width: 100%; text-align: center; } #home-services article section h2 { position: relative; color: #fff; padding-bottom: 20px; } #home-services article section h2::after { position: absolute; z-index: 1; content: ''; bottom: 0px; left: 50%; margin-left: -25px; width: 50px; height: 2px; background: #78ABE2; } #home-services article section ul { list-style: none outside none; padding: 0 0; margin: 0 0; font-size: 1.6rem; } #home-services article section ul li { display: inline-block; padding: 35px 1% 35px 5%; } #home-services article section ul li::before { position: relative; top: -2px; content: '\f14a'; font: var(--fa-font-solid); -webkit-font-smoothing: antialiased; color: #78ABE2; margin-right: 12px; font-size: 35px; vertical-align: middle; } #home-quote { } #home-quote article { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; } #home-quote article section { } #home-quote article section.quote1 { width: 60%; padding-right: 6%; } #home-quote article section form { } #home-quote article section.quote2 { width: 40%; background: url(images/home-quote-removalist.webp) no-repeat 100% 200px; } #quote-pic-cover { position: relative; top: 0px; left: 0px; width: 100%; background: #78ABE2; padding: 8%; color: #fff; font-weight: 700; } #quote-pic-cover p:last-of-type { margin-bottom: 0; } #quote-pic-cover .quote-button { position: relative; display: block; background: #293468; color: #fff; padding: 30px; margin-left: -70px; margin-bottom: 40px; font-size: 120%; text-align: right; letter-spacing: 2px; } #quote-pic-cover .quote-button::before { position: absolute; content: ''; z-index: 1; left: -40px; top: 0px; width: 40px; height: 100%; background: url(images/bg-quote-button.png) no-repeat 0 0; background-size: 100% 100%; } #quote-pic-cover a { position: relative; text-decoration: none; color: #fff; } #quote-pic-cover a::after { position: absolute; content: ''; bottom: -3px; left: 0px; width: 100%; height: 2px; border-bottom: 2px dotted #293468; } /******************** [ END BODY STYLES ] ********************/ #page-header { position: relative; top: 0; left: 0; width: 100%; background: #293468; padding: 230px 0 85px; text-align: center; } #page-header h1.entry-title { color: #fff; margin-bottom: 0 !important; } .page-content, .entry-content, .entry-summary { margin: 30px 10% 0 0; } .fullwidth .page-content, .fullwidth .entry-content, .fullwidth .entry-summary { margin: 30px 0 0; } .site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation { display: none; } h1, h2, h3, h4, h5, h6 { clear: none !important; } .post.type-post { border: 1px solid #cecece; padding: 4%; margin-right: 40px !important; margin-bottom: 20px !important; } .post.type-post h1 { margin-bottom: 10px; } .post.type-post #post-social-share { display: flex; flex-wrap: nowrap; justify-content: flex-start; align-content: flex-start; } .post.type-post #post-social-share div { max-width: 170px; } .post .post-thumbnail { max-width: 40%; float: right; margin: 0 0 50px 50px; border: 10px solid #eee; } .post .post-thumbnail img { display: block; } iframe { width: 100% !important; } .entry-content ul, .quote1 ul { list-style: disc outside; margin: 0 0 30px 30px; padding: 0 0; } .entry-content ul li, .quote1 ul li { margin: 0 0; padding: 0 0 5px 10px; } /********************************* [ SIDEBAR STYLES ] *********************************/ #secondary { font-size: 90%; } .widget { padding: 50px; color: #fff; } .widget { background: #293468; } .widget h2 { font-size: 1.8rem; color: #fff; margin-bottom: 10px; } .widget a { color: #fff; } .wp-block-search .wp-block-search__input { border: 0 none; padding: 14px; } .wp-block-search .wp-block-search__button { border: 0 none; border-radius: 3px; -webkit-border-radius: 3px; } .wp-block-search .wp-block-search__button:hover { color: #293468 !important; } /******************************* [ END SIDEBAR STYLES ] *******************************/ /********************************* [ FOOTER STYLES ] *********************************/ .site-footer { width: 100%; float: left; position: relative; background: #293468; padding: 100px 0 50px; color: #fff; } ul.site-info { display: flex; flex-wrap: nowrap; justify-content: flex-start; align-content: flex-start; margin: 0 auto; padding: 0 0; list-style: none outside none; } ul.site-info li { text-align: center; width: 33.333%; } ul.site-info a { color: #fff; } ul.site-info p { margin-bottom: 10px; } ul.site-info li h1, ul.site-info li h2, ul.site-info li h3, ul.site-info li h4, ul.site-info li h5, ul.site-info li h6 { margin-bottom: 20px; font-size: 1.6rem; color: #78ABE2; text-align: center; } /* First Column */ ul.site-info li #footer-logo { margin-bottom: 30px; max-width: 330px; } ul.site-info li .footer-socials a { position: relative; display: inline-block; top: 0; margin: 0 10px; font-size: 1.4rem; color: rgba(255,255,255,0.7); } ul.site-info li .footer-socials a:hover { top: -5px; color: rgba(255,255,255,0.9); } /* Second Column */ ul.site-info li #footer-100-satisfaction { display: inline-block; width: auto; margin-bottom: 20px; padding: 50px 25px; border: 1px solid #fff; color: #fff; text-transform: uppercase; font-size: 130%; line-height: 2.2rem; letter-spacing: 2px; } ul.site-info li #footer-100-satisfaction strong { color: #78ABE2; } ul.site-info li:nth-child(3) strong { color: #78ABE2; } /* Third Column */ ul.site-info li ul { list-style: none; margin: 0 0; padding: 0 0; width: 100%; color: #fff; } ul.site-info li ul li { width: 100%; margin-bottom: 12px; } ul.site-info li ul li:nth-child(2), ul.site-info li ul li:nth-child(3) { text-align: center; } .site-info-copy { font-size: 85%; color: rgba(255,255,255,0.5); border-top: 1px solid rgba(255,255,255,0.1); margin-top: 40px; padding-top: 30px; } #copyright a, #developed a { color: rgba(255,255,255,0.5); } #copyright a:hover, #developed a:hover { color: rgba(255,255,255,0.9); text-decoration: none; } #copyright { float: left; } #developed { float: right; } #back-top { padding: 0; bottom: 40px; position: fixed; z-index: 3; right: 20px; } #back-top a { display: block; width: auto; color: #FFF; text-align: center; text-decoration: none; text-transform: uppercase; } #back-top span { background: #68c3e8 url(images/up-arrow.png) no-repeat 50% 50%; display: block; width: 56px; height: 56px; margin-bottom: 0; background-size: 40% auto; -webkit-background-size: 40% auto; border-radius: 5px; -webkit-border-radius: 5px; } #footer-toggle-menu { display: none; flex-direction: row; flex-wrap: wrap; align-items: stretch; justify-content: space-evenly; position: fixed; bottom: 0px; left: 0px; right: 0px; z-index: 99999; background: #111; color: #fff; width: 100%; margin: 0 0; padding: 0 0; } #footer-toggle-menu li { display: block; width: 25%; vertical-align: middle; text-align: center; } #footer-toggle-menu li a { display: block; min-height: 62px; padding: 11px 0px 7px; color: #fff; font-size: 0.7rem; line-height: 1rem; font-family: 'Blinker', Arial, sans-serif; } #footer-toggle-menu li a i { display: block; margin: 0 auto; font-size: 1.4rem; min-height: 24px; } #footer-toggle-menu li a:hover{ opacity: 1.0; background: #111; text-decoration: none; } .shiftnav-toggle-button { background: #111; } .shiftnav-toggle * { line-height: 1.3rem !important; } .shiftnav .fa, .shiftnav-toggle .fa { font-family: "Font Awesome 5 Free" !important; font-weight: 900 !important; } .shiftnav-nav .menu-item-has-children::before { top: 1.6rem !important; right: 11px !important; } .shiftnav.shiftnav-nojs.shiftnav-skin-standard-dark ul.shiftnav-menu li.menu-item > .shiftnav-target:hover, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu li.menu-item.shiftnav-active > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu li.menu-item.shiftnav-in-transition > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu li.menu-item.current-menu-item > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu > li.shiftnav-sub-accordion.current-menu-ancestor > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu > li.shiftnav-sub-shift.current-menu-ancestor > .shiftnav-target, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu.shiftnav-active-highlight li.menu-item > .shiftnav-target:active, .shiftnav.shiftnav-skin-standard-dark ul.shiftnav-menu.shiftnav-active-on-hover li.menu-item > .shiftnav-target:hover { background: transparent !important; } /******************************* [ END FOOTER STYLES ] *******************************/ /********************** [ GRAVITY FORMS STYLES ] **********************/ .gform_wrapper { margin: 0 0 !important; } .gform_wrapper li { margin-top: 0 !important; } .gform_wrapper div.ginput_container input, .gform_wrapper div.ginput_container textarea { font-size: 1rem !important; padding: 12px !important; border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px; } .gform_wrapper.gravity-theme .gfield_label { margin-bottom: 0px !important; } .gform_wrapper.gravity-theme .ginput_complex label { padding-top: 0 !important; } .gform_wrapper.gravity-theme .ginput_container_time { flex-basis: min-content; max-width: 80px !important; min-width: 70px !important; } .gform_required_legend { display: none; } body.page-template-page-contact-details .gform_wrapper, .enquiryform { background: #fbfbfb; border: 1px solid #dbdbdb; padding: 6%; border-radius: 20px; -webkit-border-radius: 20px; } .enquiryform h3 { font-size: 1.4rem; line-height: 2rem; margin-bottom: 0; } .enquiryform h4 { font-size: 1.2rem; line-height: 1.5rem; margin-bottom: 0; } /******************** [ END GRAVITY FORMS STYLES ] ********************/ /********************************* [ SHORTCODES STYLES ] *********************************/ .shortcode-pdf { position: relative; padding: 15px 15px 15px 55px; margin-bottom: 24px; border: 2px dashed #e40000; line-height: 30px; } .shortcode-pdf::before { position: absolute; left: 20px; z-index: 1; font-weight: 900; font-family: "Font Awesome 5 Free"; content: '\f1c1'; font-size: 30px; line-height: 30px; color: #e40000; } .shortcode-pdf a { color: #222; } .shortcode-hr { position: relative; margin: 30px 0px; border-top: 2px solid #93acc7; } .shortcode-address, .shortcode-phone, .shortcode-email { position: relative; vertical-align: middle; margin-bottom: 24px; border: 2px dashed #ccc; padding: 18px; padding-right: 0px; line-height: 2.2rem; } .shortcode-address i, .shortcode-phone i, .shortcode-email i { font-size: 36px; margin: -2px 20px 0px 0px; vertical-align: middle; } .shortcode-address p, .shortcode-phone p, .shortcode-email p { padding-bottom: 0px; } .shortcode-cta { position: relative; display: block; border: 1px solid #ccc; background: #fff; font-size: 1.4rem; line-height: 2.7rem; color: #666; margin-bottom: 30px; text-align: center; padding: 30px 20%; } .shortcode-cta a { color: #666; font-size: inherit; text-decoration: underline; } .shortcode-cta a:hover { color: #048bcc; font-size: inherit; text-decoration: underline; } .shortcode-urllink { position: relative; padding-left: 30px; font-weight: bold; color: #048bcc; } .shortcode-urllink a { color: #048bcc; text-decoration: underline; } .shortcode-urllink a:hover { color: #048bcc; } .shortcode-urllink::before { position: absolute; left: 0px; z-index: 1; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0c1"; } .shortcode-button { display: inline-block; } .shortcode-menu { display: inline-block; width: 31%; margin-right: 2%; } .shortcode-menu a { display: block; background: #111; color: #fff; padding: 30px 5%; color: #fff; text-align: center; } .shortcode-menu a:hover { background: #333; color: #fff; cursor: pointer; text-decoration: none; } .shortcode-menu a::before { font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f2e7"; padding-right: 5px; } .shortcode-columns { columns: 2; column-gap: 10%; margin-bottom: 3rem; } .shortcode-columns p:first-of-type { margin: 0 0; } .shortcode-testimonial { font-style: italic; background: #ececec; padding: 50px; border-radius: 10px; -webkit-border-radius: 10px; font-size: 1.3rem; line-height: 2rem; } .shortcode-testimonial p:last-of-type { margin-bottom: 0px; } .shortcode-testimonial strong { font-style: normal; font-size: 1rem; } .shortcode-ticks { } .shortcode-ticks p:first-of-type { margin: 0 0; } .shortcode-ticks ul { margin: 0 0; padding: 0 0; list-style: none outside; background: none; display: flex; flex-flow: row wrap; justify-content: space-between; } .shortcode-ticks ul li { display: flex; flex-flow: row nowrap; width: 48%; margin-bottom: 40px; } .shortcode-ticks ul li::before { position: relative; top: -2px; font: var(--fa-font-solid); -webkit-font-smoothing: antialiased; content: "\f00c"; margin-right: 22px; font-size: 2rem; color: #78ABE2; } .shortcode-ticks ul li.in-viewport { bottom: -50px; } .shortcode-ticks ul li.not-in-viewport { bottom: 0px; } /******************************* [ END SHORTCODES STYLES ] *******************************/ /********************************* [ RESPONSIVE STYLES ] *********************************/ .post img, #logo { max-width: 100%; height: auto; width: auto; } embed, iframe, object, video { max-width: 100%; } @media only screen and ( max-width: 1600px ) { .container { width: 1160px; } #primary { width: 60%; } #secondary { width: 40%; } #page-header { padding: 190px 0 85px; } .site-branding img { max-width: 180px; } .main-navigation li a { font-size: 1.1rem; } #home-services article section ul { } #home-services article section ul li { padding: 25px 1% 25px 3%; } #quote-pic-cover .quote-button { margin-left: -50px; } h1 { font-size: 2.5rem; } h2 { font-size: 2.5rem; line-height: 2.5rem; } h3, h4 { font-size: 1.4rem; line-height: 1.8rem; } ul.site-info > li:first-child { text-align: left; } ul.site-info > li #footer-logo { max-width: 260px; } ul.site-info li #footer-100-satisfaction { padding: 30px 25px; font-size: 110%; letter-spacing: 0px; } ul.site-info li ul { font-size: 90%; } ul.site-info li ul li { margin-bottom: 6px; } } @media only screen and ( max-width: 1260px ) { .container { width: 960px; } #primary { padding: 100px 0px; } #page-header { padding: 160px 0 55px; } div#n2-ss-2 .n2-font-d6158769dac43f32e8bbea551f52126a-hover { font-size: 1.8rem !important; } #home-intro .button { font-size: 1.5rem; } #home-intro .button i { font-size: 40px; } #home-services article section ul { font-size: 1.3rem; } #home-services article section ul li { padding: 15px 1% 15px 3%; } h1 { font-size: 2rem; line-height: 2rem; } h2 { font-size: 1.7rem; line-height: 2rem; } .alignright { max-width: 40%; } .shortcode-testimonial { font-size: 1rem; } ul.site-info > li #footer-logo { max-width: 220px; } ul.site-info li #footer-100-satisfaction { padding: 20px 15px; font-size: 100%; letter-spacing: 0px; } } @media only screen and ( max-width: 980px ) { body { font-size: 1rem; } .container { width: 750px; } #page-header { padding: 120px 0 50px; } .site-header { padding: 10px 20px; } .site-branding img { max-width: 150px; } .menu-main-menu-container { display: none; } .header-mobmenu { display: block !important; } div#n2-ss-2 .n2-font-d6158769dac43f32e8bbea551f52126a-hover { font-size: 1.4rem !important; } #home-intro { padding: 80px 0px 100px; } #home-services { font-size: inherit; } #home-services article section ul { font-size: 1rem; } #home-services article section ul li { padding: 10px 1% 10px 3%; } #home-services article section h2 { padding-bottom: 10px; } #home-quote article { display: block; } #home-quote article > section:first-of-type, #home-quote article > section:last-of-type { width: 100%; padding-right: 0; min-height: 300px; text-align: center; } #home-quote article section.quote2 { margin-top: 50px; } #home-quote h3 { text-align: center; } #quote-pic-cover .quote-button { margin-left: 0px; text-align: center; } #quote-pic-cover .quote-button::before { display: none; } .shortcode-columns { text-align: left; columns: 3; column-gap: 0; } h1 { font-size: 1.6rem; line-height: 2rem; } h2 { font-size: 1.3rem; line-height: 1.6rem; margin-bottom: 20px; } h3, h4 { font-size: 1.3rem; line-height: 1.6rem; } .enquiryform h3 { font-size: 1.2rem; line-height: 1.4rem; margin-bottom: 0; margin-top: 20px; } .enquiryform h4 { font-size: 1rem; line-height: 1.2rem; margin-bottom: 0; margin-top: 20px; } #footer-toggle-menu { display: flex; } .site-footer { padding: 100px 0 100px; } ul.site-info li h1, ul.site-info li h2, ul.site-info li h3, ul.site-info li h4, ul.site-info li h5, ul.site-info li h6 { margin-bottom: 5px; font-size: 1.3rem; } ul.site-info { display: block; float: left; } ul.site-info li { float: left; width: 50%; margin-bottom: 20px; } ul.site-info li:last-child { float: left; width: 100%; } ul.site-info li #footer-100-satisfaction { padding: 15px 20px; line-height: 1.2rem; } ul.site-info li ul { display: flex; flex-flow: row wrap; } ul.site-info li ul li, ul.site-info li ul li:last-child { width: 32% !important; } } @media only screen and ( max-width: 768px ) { .container { width: auto; padding: 0px 20px; } #primary { width: auto; float: none; } #secondary { width: auto; float: none; } #page-header { padding: 100px 0 50px; } #home-intro, #home-services, #home-quote { padding: 90px 0px 80px; } #home-intro .button { font-size: 1.3rem; letter-spacing: 0px; padding: 25px 0px; bottom: -65px; } #home-services { padding-top: 120px; } .shortcode-columns { text-align: left; columns: 2; column-gap: 0; } .gform_wrapper div.ginput_container input, .gform_wrapper div.ginput_container textarea { padding: 4px !important; } h1 { font-size: 1.4rem; line-height: 3rem; } .site-footer { padding: 50px 0 100px; text-align: center; } ul.site-info { display: block; float: none; text-align: center; } ul.site-info li, ul.site-info > li:first-child { float: none; width: 100%; text-align: center; margin-bottom: 20px; } ul.site-info li ul li { width: 32%; } #copyright, #developed { float: none; text-align: center; padding: 20px 0 0; } } @media only screen and ( max-width: 479px ) { .container { width: auto; padding: 0px 20px; } #primary { width: auto; float: none; padding: 20px 0px; } #secondary { width: auto; float: none; } .site-branding { width: 40%; } .main-navigation { width: 60%; } #home-intro, #home-services, #home-quote { padding: 60px 0px 80px; } #home-intro .button { position: relative; width: 90%; margin: 0 auto; bottom: 0; left: 0; } #home-services article section ul li { padding: 5px 1% 5px 3%; } #home-services article section ul li::before { font-size: 29px; } h1 { font-size: 1.4rem; line-height: 1.6rem; margin-bottom: 20px; } input[type="button"], input[type="submit"], button, .button, a.read-more, .reply-container a, #commentform input#submit { display: block; padding: 12px 0px 10px; width: 100%; } .shortcode-ticks { } .shortcode-ticks ul li { width: 100%; margin-bottom: 20px; } .alignleft { float: none; margin-right: 0; margin-bottom: 5px; } ul, ol { margin: 0 0 1.5em 0.5em; } ul.site-info li, ul.site-info li:last-child { float: none; width: 100%; } ul.site-info > li #footer-logo { max-width: 160px; } ul.site-info li ul { display: block; width: 100%; } ul.site-info li ul li, ul.site-info li ul li:last-child { width: 100% !important; } } /********************************* [ RESPONSIVE STYLES ] *********************************/