/********************************* [ GLOBAL STYLES ] *********************************/ html { height: 100%; overflow-x: hidden; } .clear, .clearfix { clear: both; } .clear:after, .clearfix: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: 1rem; line-height: 1.4rem; font-weight: 400; font-family: 'Roboto', sans-sans-serif; color: #374453; } #page { z-index: 1; } /***************************/ /* GLOBAL COLOUR - #f4a709 */ /***************************/ a, a:visited { text-decoration: none; color: #2E598A; } a:active, a:hover { text-decoration: none; color: #f4a709; } .entry-content a, #home-intro a, #primary a { text-decoration: underline; color: #2E598A; } .entry-content a:hover, #home-intro a:hover, #primary a:hover { text-decoration: underline; color: #f4a709; } h1, h2, h3, h4, h5, h6 { margin: 0 0 40px; color: #4b5267; letter-spacing: 0px; line-height: 1em; font-weight: 600; font-style: normal; font-family: 'Gabarito', sans-serif; text-shadow: none; text-transform: uppercase; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #4b5267; } h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong { font-weight: 700; } h1.entry-title a, h2.entry-title a, h3.entry-title a, h4.entry-title a, h5.entry-title a, h6.entry-title a { color: #4b5267 !important; } h1 { font-size: 3rem; line-height: 3.3rem; } h2 { font-size: 2rem; line-height: 2rem; } h3 { font-size: 1.6rem; line-height: 2rem; margin-bottom: 20px; } h4 { font-size: 1.6rem; line-height: 2rem; margin-bottom: 20px; } h5 { font-size: 1.4rem; line-height: 1.8rem; margin-bottom: 20px; } h6 { font-size: 1.4rem; line-height: 1.8rem; margin-bottom: 20px; } strong { font-weight: 700; } p { margin: 0 0 2rem; } figure { margin: 0 0; } ::-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, img { 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 #d1d1d1; padding: 14px !important; font-weight: 400; font-size: inherit; border-radius: 0px; -webkit-border-radius: 0px; } 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: #b6b6b6; color: #222; box-shadow: 0 0 20px rgba(0,0,0,0.1); } textarea { resize: vertical; } .ginput_container_checkbox { padding-top: 20px; } .gfield_checkbox input[type="checkbox"] { opacity: 0; } .gfield_checkbox label::before{ content: ""; display: inline-block; height: 20px; width: 20px; left: 0; border: 2px solid #ccc; border-radius: 0 0; -webkit-border-radius: 0 0; } .gfield_checkbox label::after { content: ""; display: inline-block; height: 8px; width: 12px; border-left: 2px solid #f4a709; border-bottom: 2px solid #f4a709; transform: rotate(-45deg); } .gfield_checkbox label { position: relative; padding-left: 30px !important; padding-bottom: 6px !important; } .gfield_checkbox label::before, .gfield_checkbox label::after { position: absolute; } .gfield_checkbox label::before { top: 1px; } .gfield_checkbox label::after { left: 4px; top: 5px; } /*Hide the checkmark by default*/ .gfield_checkbox input[type="checkbox"] + label::after { content: none; outline: none; } /*Unhide the checkmark on the checked state*/ .gfield_checkbox input[type="checkbox"]:checked + label::after { content: ""; outline: none; } /*Adding focus styles on the outer-box of the fake checkbox*/ .gfield_checkbox input[type="checkbox"]:focus + label::before { outline: none; } .gfield_checkbox input[type="checkbox"]:checked + label::before { border-color: #f4a709; } .gform_wrapper ul li { background: none transparent !important; padding: 0 16px 0 0 !important; line-height: inherit !important; } .gform_wrapper .gfield_checkbox li label, .gform_wrapper .gfield_radio li label { line-height: 1.7 !important; } .gform_wrapper { margin: 0 0 !important; } .gform_wrapper input[type="text"], .gform_wrapper input[type="url"], .gform_wrapper input[type="email"], .gform_wrapper input[type="tel"], .gform_wrapper input[type="number"], .gform_wrapper input[type="password"], .gform_wrapper .gfield_checkbox li label, .gform_wrapper .gfield_radio li label, .gform_wrapper li select , .gform_wrapper li textarea { font-size: 1.05rem !important; font-weight: 400 !important; } .gform_wrapper .gfield_html.gfield_no_follows_desc { margin-top: 0 !important; } body .gform_wrapper .top_label div.ginput_container { margin: 0 0 !important; } .gform_wrapper .field_description_below .gfield_description { padding-top: 0px !important; margin-top: -5px; } .gform_wrapper li.hidden_label input { margin: 0 0 10px !important; } /*.gform_wrapper textarea.medium { height: 100px !important; }*/ .gfield.gfield--type-fileupload { margin-bottom: 20px; } .gform_wrapper .gform_footer { padding: 20px 0 0 !important; margin: 0 0 !important; } .gfield_checkbox li, .gfield_radio li { position: relative; } body .gform_wrapper .gfield_radio li label, body .gform_wrapper .gfield_checkbox li label { margin: 4px 0 0 30px !important; } body .gform_wrapper ul li.gfield.optional .gfield_checkbox label::after, body .gform_wrapper ul li.gfield.optional .gfield_radio label::after { content: ""; opacity: 1; } body .gform_wrapper .gfield_radio li input[type="radio"], body .gform_wrapper .gfield_checkbox li input[type="checkbox"] { display: none; } ul.gfield_checkbox li[class^="gchoice"] label:before, ul.gfield_checkbox li[class^="gchoice"] label:after, ul.gfield_radio li[class^="gchoice"] label:before, ul.gfield_radio li[class^="gchoice"] label:after { bottom: 0; content: ''; margin: 4px 0 0 0; position: absolute; top: 0; } ul.gfield_checkbox li[class^="gchoice"] label:after, ul.gfield_radio li[class^="gchoice"] label:after { position: absolute; content: ""; z-index: 1; background: url(images/gf-radio-buttons.png) no-repeat 0% 0; display: inline-block; width: 19px; height: 19px; left: 0; top: 3px; } ul.gfield_checkbox input[type="checkbox"]:checked + label:before, ul.gfield_radio input[type="radio"]:checked + label:before { position: absolute; content: ""; z-index: 1; background: url(images/gf-radio-buttons.png) no-repeat 100% 0; left: 0; top: 3px; width: 19px; height: 19px; } input[type=button], input[type=submit], button, .button, a.read-more, .reply-container a, #commentform input#submit, .shortcode-button a, .gform_wrapper.gravity-theme .gform_previous_button.button, .gform_wrapper.gravity-theme .gform_save_link.button { -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; /* For Mobiles */ z-index: 1; border-radius: 0px; -webkit-border-radius: 0px; position: relative; background: #f4a709; border: 0px none; display: inline-block; cursor: pointer; color: #fff !important; font-size: 1rem; font-weight: 600; font-family: 'Gabarito', sans-sans-serif; text-decoration: none !important; text-transform: uppercase; letter-spacing: 0px; line-height: 2rem; padding: 12px 40px; text-align: center; } 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 { vertical-align: middle; margin-right: 10px; font-size: 120%; position: relative; top: 3px; } 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, .gform_wrapper.gravity-theme .gform_previous_button.button:hover, .gform_wrapper.gravity-theme .gform_save_link.button:hover { background: #ffc000 !important; text-decoration: none !important; color: #fff !important; } /* Change this class to whatever ID or class you wish to animate */ a, i, span, div, input, select, textarea, article, section, input[type=button], input[type=submit], button, .button, a.read-more, .reply-container a, #commentform input#submit, .shortcode-button a, .site-info section .footer-socials a, .main-navigation ul ul, #back-top, .main-navigation ul ul a, .main-navigation li a::after, .main-navigation li a::before, .main-navigation, .main-navigation li a, ul#post-page-loop li, ul#post-page-loop li .post-page-img img, .shortcode-features-list ul li, .site-header, .main-header, .header-left, .site-branding, .site-branding img, #home-services ul li a, #home-services ul li a span, #project-slider ul li .post-page-img, #project-slider ul li .post-page-img img, #home-extra-services ul 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: right; width: 65%; text-align: left; padding: 100px 0px; } .fullwidth #primary { float: none; width: auto; } #secondary { float: left; width: 30%; text-align: left; padding: 100px 0px; } #page-short-desc { background: #eee; padding: 100px 0; font-size: 1.4rem; line-height: 2rem; } #page-short-desc p:last-of-type { margin-bottom: 0; } /********************************* [ HEADER STYLES ] *********************************/ .site-header { position: fixed; z-index: 111; top: 0; width: 100%; box-shadow: 0 0 10px rgba(0,0,0,0); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0); background: rgba(21,26,42,0); border-bottom: 1px solid rgba(255,255,255,0.1); } .topbar-header { background: #f4a709; padding: 5px 20px; font-family: "Gabarito", sans-sans-serif; font-size: 0.7rem; text-transform: uppercase; } .topbar-header a { display: inline-block; color: #fff; padding: 0 5px; letter-spacing: 0.5px; } .topbar-header a:hover { color: #fff; } .topbar-header a::after { content: ''; border-right: 1px solid rgba(255,255,255,0.4); margin-left: 15px; height: 11px; position: relative; display: inline-block; top: 2px; } .main-header { display: flex; flex-flow: row nowrap; padding: 20px 30px; } .header-left { width: 320px; display: flex; flex-flow: row wrap; align-items: center; } .site-branding { margin: 0 0; padding: 0 30px 0 0; } .site-branding img { display: block; width: 100%; } /********************************* [ NAVIGATION STYLES ] *********************************/ .header-right { width: calc(100% - 320px); display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: center; } .header-mobmenu { display: none; width: 100px; text-align: center; } .header-mobmenu.shiftnav-toggle-button { background: none transparent !important; color: #fff !important; margin-right: 10px; top: -2px; position: relative; } .header-mobmenu.shiftnav-toggle-button i { vertical-align: middle; position: relative; top: 2px; margin: 0 10px 0 0; font-size: 25px; } .main-navigation { width: calc(100% - 200px); display: flex; flex-flow: row nowrap; align-items: center; justify-content: flex-start; } .menu-main-menu-container { } .main-navigation ul { display: flex; flex-flow: row nowrap; justify-content: flex-end; list-style: none; margin: 0; } .main-navigation li { } .main-navigation li a { position: relative; display: inline-block; margin: 0 20px; line-height: 3.5rem; font-size: 1.1rem; font-family: "Gabarito", sans-sans-serif; font-weight: 500; text-decoration: none; color: #fff; } .main-navigation li a:hover { text-decoration: none; color: #f4a709; } .main-navigation li a::after { position: absolute; content: ''; z-index: 1; bottom: 10px; left: 50%; width: 0; height: 2px; background: #fff; opacity: 0; -webkit-opacity: 0; visibility: hidden; } .main-navigation li a:hover::after { left: 0; width: 100%; opacity: 1; -webkit-opacity: 1; visibility: visible; background: #f4a709; } .main-navigation li:last-child a { margin-right: 0px; } .menu-item-has-children { padding-right: 10px; } .menu-item-has-children::before { position: absolute; z-index: 11; right: 9px; top: 50%; margin-top: -10px; font-size: 20px; font-family: uicons-regular-rounded !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\e07c"; color: #fff; } .menu-item-has-children:hover::before { color: #fff; } .main-navigation ul ul { display: block; top: 80px; left: 0; opacity: 0; visibility: hidden; width: 290px; background: #fff; margin-top: 0; padding: 22px 30px; text-align: left; box-shadow: 6px 6px 20px rgba(0,0,0,0.2); -webkit-box-shadow: 6px 6px 20px rgba(0,0,0,0.2); margin-right: 0px; border-radius: 0px; -webkit-border-radius: 0px; font-size: 90%; } .main-navigation ul li.menu-item-has-children:hover ul { top: 60px; left: 0; opacity: 1; visibility: visible; } .main-navigation ul ul::before { display: block; background: rgba(255, 0, 0,0); height: 6px; position: absolute; top: -9px; left: 0; width: 100%; content: ''; z-index: 2; } .main-navigation ul ul a { width: 100%; padding: 18px 15px 18px 20px; margin: 0 0; background: none transparent; line-height: 1rem; color: #333; border-bottom: 1px solid #dcdcdc; } .main-navigation ul ul li:last-child a { border-bottom: 0 none; } .main-navigation ul ul a::before { position: absolute; z-index: 11; left: 0px; top: 50%; bottom: unset; margin-top: -9px; font-size: 16px; font-family: uicons-regular-rounded !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\e07c"; background: none transparent; color: #333; width: auto; height: auto; opacity: 1; -webkit-opacity: 1; transform: rotate(-90deg); -webkit-transform: rotate(-90deg); } .main-navigation ul ul a:hover::before { width: auto; height: auto; left: 0px; color: #f4a709; } .main-navigation ul ul a::after { display: none; } .main-navigation ul ul a:hover { background: none transparent; color: #f4a709; } /* Sub Sub Menus */ .main-navigation ul ul ul { display: none; left: 250px; top: 2px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } .main-navigation ul ul li:hover ul { display: block; left: 250px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; } .main-navigation ul li.menu-item-has-children ul li.menu-item-has-children ul, .main-navigation ul li.menu-item-has-children ul li.menu-item-has-children ul:last-child { left: 220px !important; margin-left: 0; } .donatebtn { display: flex; align-items: center; justify-content: center; width: 200px; padding: 10px 10px; } .donatebtn i { font-size: 20px; } /******************************* [ END NAVIGATION STYLES ] *******************************/ .body-fixed { padding-top: 0px; } .site-header.scroll-fixed { position: fixed; box-shadow: 0 0 30px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 30px rgba(0,0,0,0.2); background: rgba(21,26,42,0.7); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); } .site-header.scroll-fixed .topbar-header { display: none; } .site-header.scroll-fixed .header-left { } .site-header.scroll-fixed .site-branding { } .site-header.scroll-fixed .site-branding img { } .site-header.scroll-fixed .header-right { } /******************************* [ END HEADER STYLES ] *******************************/ /********************** [ BODY STYLES ] **********************/ #homepage-slider { position: relative; z-index: 0; background: #111; } #slider-header { display: none; } #slider-header img { display: block; opacity: 0.5; -webkit-opacity: 0.5; } #slider-header h1, #slider-header h2 { position: absolute; z-index: 2; left: 50px; } #slider-header h1 { bottom: 100px; width: 65%; color: #fff; font-size: 1.8rem; line-height: 2.4rem; } #slider-header h2 { bottom: 30px; border: 1px solid #fff; border-radius: 1000px; -webkit-border-radius: 1000px; padding: 5px 20px; color: #fff; text-transform: uppercase; letter-spacing: 2px; font-weight: 400; font-size: 1rem; } #home-intro section h1 em, #home-services section h2, #home-extra-services h2, #home-feedback h2 { font-size: 4rem; line-height: 4rem; text-align: center; } #home-intro { padding: 200px 0px 350px; background: #fff; background: url(images/bg-homepage.png) no-repeat 100% 100%; background-size: 1200px auto; -webkit-background-size: 1200px auto; } #home-intro::before { content: ''; position: absolute; left: 0; top: 200px; width: 30px; height: 70%; background: #f4a709; } #home-intro article { display: flex; flex-flow: row wrap; align-items: flex-start; } #home-intro section.intro-text { width: 100%; padding: 0; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: flex-start; } #home-intro section.intro-text div { width: 45%; } #home-intro section.intro-text div:first-of-type { padding-left: 5%; } #home-intro section.intro-text h1 { text-align: left; margin-bottom: 10px; font-size: 2.5rem; line-height: 3rem; } #home-intro section.intro-text h1 em { font-style: normal; color: #f4a709; } #home-intro section.intro-text h2 { text-align: left; font-family: 'Caveat'; font-size: 2rem; line-height: 3rem; text-transform: capitalize; } #home-intro section.intro-text img.home-mba { display: block; margin: 30px 0 20px; border: 1px solid #ececec; padding: 10px 15px; max-width: 210px; } #home-intro section.intro-text p { position: relative; text-align: left; margin: 0 0 3rem; font-size: 1.1rem; line-height: 2rem; } #home-intro section.intro-text p:last-of-type { margin-bottom: 0px; } #home-intro section.intro-pics { width: 100%; margin: 0 0; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: stretch; padding: 0 0; } #home-intro section.intro-pics div { width: 47%; } #home-intro section.intro-pics div.home-pic2 { padding: 150px 0 0; } #home-intro section.intro-pics img { width: 100%; height: auto; } #home-intro section.intro-pics div.home-pic1 img { position: relative; top: -50px; } #home-services { top: -200px; margin-bottom: -200px; padding: 0px 0px 200px; } /*#home-services::before { position: absolute; content: ''; z-index: 1; bottom: 0; left: 0; width: 100%; height: 100%; background: url(images/bg-home-donate.png) no-repeat 50% 100%; background-size: 100% auto; -webkit-background-size: 100% auto; }*/ #home-services::after { position: absolute; content: ''; z-index: 0; bottom: 0; left: 0; width: 100%; height: 80%; background: #f4a709; } #home-services article { z-index: 1; display: block; } #home-services section:first-of-type { width: 100%; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; background: #fff; padding: 150px 100px 20px; text-align: center; box-shadow: 0 0 60px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 60px rgba(0,0,0,0.2); } #home-services section h2 { font-size: 5rem; line-height: 5.5rem; color: #f4a709; margin-bottom: 10px; } #home-services section h3 { margin-bottom: 50px; } #home-services section p { padding: 0 7%; } #home-services article section:last-of-type { width: 100%; background: #fff; padding: 0 100px 150px; } #home-services article section:last-of-type #project-slider ul { } #home-services article section:last-of-type #project-slider ul li { } #home-services article section:last-of-type #project-slider ul li h3 { } #project-slider { width: 100%; z-index: 2; } #project-slider a.projects-all { position: absolute; right: 10px; top: -50px; } #project-slider a.projects-all i { font-size: 1rem; vertical-align: middle; position: relative; top: -2px; padding-left: 5px; } #project-slider a.projects-all:hover { color: #fff; } #project-slider ul li { margin: 0; padding: 10px; } #project-slider ul li a { display: block; position: relative; overflow: hidden; } #project-slider ul li .post-page-img { display: block; overflow: hidden; } #project-slider ul li .post-page-img img { display: block; width: 100%; height: auto; } #project-slider ul li .post-page-img i { display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: linear-gradient(to bottom, rgba(20,20,20,0.1) 50%,rgba(0,0,0,0.6) 100%); width: 100%; } #project-slider ul li .projects-member-info { display: block; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; padding: 20px 30px; } #project-slider ul li .projects-member-info h3 { width: 90%; font-size: 1.6rem; line-height: 1.6rem; margin: 0 0; color: #fff; font-weight: 600; text-shadow: 2px 2px 0 rgba(0,0,0,0.2); } #project-slider ul li .projects-member-info .projects-more { color: #f4a709; font-size: 20px; line-height: 20px; bottom: -20px; opacity: 0; transition-delay: 200ms; margin: 0 0; top: 0; } .projects-member-info .projects-more { } #project-slider ul li a:hover { color: #fff; } #project-slider ul li a:hover .post-page-img img { transform: scale(1.06); filter: brightness(0.8); } #project-slider ul li a:hover .projects-member-info { bottom: 20px; } #project-slider ul li a:hover .projects-member-info .projects-more { bottom: 0px; opacity: 1; } .splide__track { padding-bottom: 0px; } .splide__slide { aspect-ratio: 4 / 3; } .splide__slide { position: relative; width: 100%; padding-top: 75%; /* 3 / 4 = 0.75 */ } .splide__slide > * { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .splide__pagination { bottom: -30px !important; padding: 0 0 !important; } .splide__pagination__page { background: #f4a709 !important; } .splide__pagination__page.is-active { background: #f4a709 !important; } .splide__arrows { position: absolute !important; height: auto !important; top: 0 !important; right: 0px !important; bottom: 0 !important; left: 0px !important; } .splide__arrow { background: #f4a709 !important; width: 3.5em !important; height: 3.5em !important; margin-top: -50px !important; opacity: 1 !important; -webkit-opacity: 1 !important; top: 65% !important; } .splide__arrow.splide__arrow--prev { left: -20px; } .splide__arrow.splide__arrow--next { right: -20px; } .splide__arrow:hover { background: #ffcc30 !important; } .splide__arrow svg { fill: #ffffff !important; height: 13px !important; width: 13px !important; } #home-services article:last-of-type { z-index: 1; display: block; text-align: center; padding-top: 50px; } #home-services article:last-of-type div { } #home-services article:last-of-type div a.button { border: 1px solid #fff !important; color: #fff !important; background: none transparent !important; } #home-services article:last-of-type div a.button:hover { border: 1px solid #fff !important; color: #4b5267 !important; background: #fff !important; } #home-extra-services { padding: 150px 0 170px; text-align: center; } #home-extra-services h2 { color: #f4a709; margin-bottom: 10px; } #home-extra-services h3 { margin-bottom: 50px; } #home-extra-services .extra-services-content { padding: 0 10% 3%; } #home-extra-services ul { width: 100%; list-style: none outside; margin: 0 0; padding: 0 0; display: flex; flex-flow: row wrap; justify-content: space-between; } #home-extra-services ul li { width: 31%; margin: 0 0; padding: 50px 95px; text-align: center; border: 1px solid #ececec; } #home-extra-services ul li a.extra-icon-link { display: inline-block; background: #4b5267; padding: 30px; border-radius: 1000px; -webkit-border-radius: 1000px; margin-bottom: 10px; } #home-extra-services ul li a.extra-icon-link svg { display: block; width: 40px; height: 40px; margin-bottom: 0; fill: #ffffff !important; } #home-extra-services ul li h3 { font-size: 1.3rem; line-height: 1.4rem; margin-bottom: 15px; } #home-extra-services ul li h3 a, #home-extra-services ul li h3 a:hover { color: #4b5267; } #home-extra-services ul li p { margin-bottom: 5px; line-height: 1.5rem; } #home-extra-services ul li a.extra-more { position: relative; display: inline-block; margin: 0 auto; color: #f4a709; background: none transparent; padding: 0 10px; text-transform: uppercase; font-size: 0.7rem; border: 1px solid #f4a709; } #home-extra-services ul li a.extra-more i { top: 0.5px; margin: 0 0 0 5px; } #home-extra-services ul li:hover { border: 1px solid #bababa; } #home-extra-services ul li:hover a.extra-icon-link { background: #f4a709; } #home-extra-services ul li:hover h3 a { color: #f4a709; } #home-extra-services ul li a.extra-more:hover { background: #f4a709 !important; color: #fff; } #home-feedback { padding: 150px 0; text-align: center; background: url(images/bg-wall-texture.webp) no-repeat 50% 50%; background-size: cover; -webkit-background-size: cover; overflow: hidden; } #home-feedback h2 { color: #f4a709; margin-bottom: 10px; } #home-feedback h3 { margin-bottom: 50px; } #home-feedback .feedback-reviews { } #home-feedback .wpmslider-viewport { overflow: visible !important; } #home-feedback h3.strong-view.wpmtst-simple .wpmtst-testimonial-heading { margin-bottom: 10px !important; } #home-feedback .strong-view.wpmtst-simple .wpmtst-testimonial-inner { font-size: 90% !important; } /******************** [ END BODY STYLES ] ********************/ .entry-header { position: relative; top: 0; left: 0; width: 100%; background: #151a2a url(images/bg-page-header.webp) no-repeat 50% 50%; background-size: cover; -webkit-background-size: cover; padding: 320px 0px 120px; text-align: left; } .entry-header h1.entry-title { position: relative; z-index: 1; font-size: 3rem; line-height: 3rem; margin: 0px 0px 10px; color: #fff; } .entry-header strong { position: relative; z-index: 1; display: inline-block; color: #fff; padding: 2px 18px; background: #f4a709; border-radius: 100px; -webkit-border-radius: 100px; margin-bottom: 5px; text-transform: uppercase; font-size: 0.8rem; } .entry-breadcrumbs, .entry-meta { z-index: 1; display: inline-block; border: 1px solid #f4a709; padding: 0px 13px 1px 18px; color: #f4a709; font-size: 0.7rem; line-height: 1.7rem; font-weight: bold; text-transform: uppercase; border-radius: 100px; -webkit-border-radius: 100px; margin-right: 10px; } .entry-breadcrumbs a, .entry-breadcrumbs i, .entry-meta a { vertical-align: middle; display: inline-block; margin-right: 10px; color: #f4a709; } .entry-breadcrumbs i { position: relative; vertical-align: middle; top: 2px; font-size: 0.8rem; } .entry-breadcrumbs a:hover { text-decoration: underline; } .page-header-overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 0; background: rgba(21,26,42,0.9); } .page-content, .entry-content, .entry-summary, #post-page-loop { padding: 0 0; margin: 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; } .red-swish { background: url(images/red-underline.png) no-repeat 50% 100%; background-size: 100% 9px; -webkit-background-size: 100% 9px; padding-bottom: 15px; color: #4b5267; font-size: 140%; } .entry-content iframe { width: 100% !important; } iframe.googlemap { border: 10px solid rgba(0,0,0,0.1); } .alignright { float: right; margin: 5px 0 15px 7%; } .alignleft { float: left; margin: 5px 3% 15px 0; } .imageborder { border: 5px solid #ececec; border-radius: 12px; border-radius: 12px; } .entry-content > ul, .post-content > .post-text-side > ul, .shortcode-one-half > ul, .shortcode-one-half-last > ul { margin: -10px 0 30px; padding: 0 0 0 5px; list-style: none outside; } .entry-content > ul > li, .post-content > .post-text-side > ul > li, .shortcode-one-half > ul > li, .shortcode-one-half-last > ul > li { padding: 5px 0 10px 33px; background: url(images/icon-list-item.svg) no-repeat 0 10px; background-size: 20px auto; -webkit-background-size: 20px auto; line-height: 1.6rem; } footer.entry-footer { clear: both; } /* Call To Actions Styles */ .quote-top-cta { background: #ddd url(images/bg-quote-top-cta.jpg) no-repeat 100% 0; padding: 50px 40% 50px 50px; text-align: left; margin-bottom: 40px; background-size: 30% 100%; -webkit-background-size: 30% 100%; font-size: 120%; line-height: 160%; } .cta-inspiration { background: #f4a709; padding: 3.5% 5%; text-align: center; margin: 100px 0; letter-spacing: 3px; color: #fff; } .cta-inspiration h2 { font-size: 3rem; line-height: 3rem; margin-bottom: 10px; color: #fff; } .cta-inspiration a { color: #fff !important; } .cta-inspiration p:last-of-type { margin-bottom: 0; } /* Call To Actions Styles */ /* Post Loop */ ul#post-page-loop { display: flex; flex-flow: row wrap; justify-content: space-evenly; align-items: stretch; width: 100%; list-style: none outside; margin: 0 0 50px; } ul#post-page-loop li { width: 30%; margin-right: 2%; margin-bottom: 50px; padding: 0; border-radius: 0px; -webkit-border-radius: 0px; box-shadow: 0 0 32px rgba(0,0,0,0.14); -webkit-box-shadow: 0 0 32px rgba(0,0,0,0.14); border-bottom: 4px solid #fff; } ul#post-page-loop li .post-page-img { display: block; position: relative; border-radius: 0 0; -webkit-border-radius: 0 0; } ul#post-page-loop li .post-page-img img { display: block; width: 100%; border-radius: 0 0; -webkit-border-radius: 0 0; } ul#post-page-loop li .post-page-img span.news-hover-btn { position: absolute; z-index: 2; bottom: 0px; left: 50%; margin-left: -45px; width: 90px; text-align: center; font-size: 0.7rem; text-transform: uppercase; background: #f4a709; padding: 0 10px; color: #fff; font-weight: bold; border-radius: 25px; -webkbit-border-radius: 25px; opacity: 0; visibility: hidden; transition-delay: 0.2s; } ul#post-page-loop li .post-info { background: #fff; padding: 8%; margin-bottom: 10px; font-size: 1rem; line-height: 1.4rem; } ul#post-page-loop li h3 { font-size: 1.2rem; line-height: 1.1rem; margin: 0 0 10px; color: #f4a709; } ul#post-page-loop li h3 a { color: #f4a709; } ul#post-page-loop li .post-meta { font-size: 0.8rem; line-height: 1.3rem; font-weight: 600; letter-spacing: 0.5px; margin-bottom: 20px; color: #888; } ul#post-page-loop li .post-meta i { position: relative; top: 1px; vertical-align: middle; } ul#post-page-loop li p { margin-bottom: 0; } ul#post-page-loop li:hover { z-index: 3; box-shadow: 0 0 40px rgba(0,0,0,0.30); -webkit-box-shadow: 0 0 40px rgba(0,0,0,0.30); transform: scale(1.03); border-color: #f4a709; } ul#post-page-loop li:hover .post-page-img span.news-hover-btn { bottom: 20px; opacity: 1; visibility: visible; } /* End Post Loop */ /* Single Post Styles */ article.post, article.page { margin-bottom: 20px !important; } article.page.type-page { } .single-post-structure { display: flex; flex-flow: column wrap; align-items: flex-start; } .single-post-structure .entry-featured-image { display: flex; flex-flow: row nowrap; width: 100%; margin-bottom: 20px; } .single-post-structure .entry-featured-image img { width: 100%; border-radius: 8px; -webkit-border-radius: 8px; border: 5px solid #ececec; } .single-post-structure .post-details { width: 100%; margin-bottom: 30px; background: #f6f6f6; padding: 10px 20px; font-size: 0.9rem; border-radius: 8px; -webkit-border-radius: 8px; } .single-post-structure .post-details {} .single-post-structure .post-content { width: 100%; } #page-secondary-section { margin: 50px 0px; } .post-meta { margin-bottom: 10px; font-size: 70%; line-height: 1rem; text-transform: uppercase; } .entry-header h1 { margin-bottom: 20px; } .entry-header .post-meta { margin-top: 30px; } .post-meta strong { display: inline-block; background: #00879a; padding: 2px 15px; margin-right: 5px; font-weight: normal; color: #fff; text-transform: uppercase; border-radius: 100px; -webkit-border-radius: 100px; } .post-meta strong i { position: relative; vertical-align: middle; margin-top: -2px; margin-right: 4px; } .post-meta strong a { color: #fff; } .post h1 { margin-bottom: 10px; } .post .post-thumbnail { width: 20%; margin: 0 50px 50px 0; } .post .post-thumbnail img { display: block; width: 100%; height: auto; border: 1px solid #ccc; padding: 20px; } .post .post-content { width: 100%; display: flex; flex-flow: row nowrap; justify-content: space-between; } .post .post-content .post-text-side { width: 47%; } .post .post-content .post-text-side.post-full-width { width: 100%; } .post .post-content .post-text-side h2 {} .post .post-content .post-text-side h2 em { display: block; color: #f4a709; font-weight: 500; font-style: normal; font-size: 130%; } .post .post-content .post-text-side h3 { font-size: 1.6rem; margin-bottom: 10px; } .post .post-content .post-gallery-side { width: 47%; } .post .post-content .post-gallery-side .button { width: 100%; margin: 10px 0; padding: 30px 20px; font-size: 1.4rem; letter-spacing: 1px; } .post .post-content .post-gallery-side .button i { font-size: 30px; } .post .single-post-posted { display: block; margin-bottom: 30px; font-weight: bold; font-size: 120%; color: #00879a; } .post .fg-default.fg-gutter-10 { padding-left: 0; margin-bottom: 30px; display: flex; flex-flow: row wrap; } .post .fg-default .fg-item { width: 32%; } .post #post-social-share { display: flex; flex-wrap: nowrap; justify-content: flex-start; align-content: flex-start; } .post #post-social-share div { max-width: 170px; } .post-tags { } .post-tags ul { list-style: none outside; margin: 0 0; padding: 0 0; } .post-tags ul li { display: inline-block; background: #00879a; padding: 0px 10px; margin-right: 5px; font-weight: normal; text-transform: uppercase; border-radius: 100px; -webkit-border-radius: 100px; font-size: 70%; } .post-tags ul li a { color: #444; } #comments { margin: 0 auto !important; } #wpdcom { margin: 0 !important; padding: 0 !important; max-width: 100% !important; } #wpdcom .wpd-thread-list { padding: 30px 0 0; } /* End Single Post Styles */ /* Single Project Page */ .project .post-content.type-project { margin: 0 0 100px; } body.single-project #project-details { display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; margin-bottom: 50px; } body.single-project #project-details div { width: 32%; background: #ececec; padding: 30px; text-align: center; } body.single-project #project-details div strong { display: block; color: #111; font-size: 110%; margin-bottom: 10px; } /* End Single Project Page */ /* About Page Styles */ body.page-template-page-about-us {} body.page-template-page-about-us .about-primary { display: flex; flex-flow: row nowrap; justify-content: space-between; } body.page-template-page-about-us .about-primary > div { width: 47%; display: flex; flex-flow: row nowrap; } body.page-template-page-about-us .about-primary > div.about-primary-photo { } body.page-template-page-about-us .about-primary > div.about-primary-photo div { width: 100%; background-color: #ccc; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; -webkit-background-size: cover; } body.page-template-page-about-us .about-primary > div > .about-inner { padding: 50px 0; } body.page-template-page-about-us .about-primary > div > .about-inner p:last-of-type { margin-bottom: 0; } body.page-template-page-about-us #project-slider { background: #ececec; padding: 60px 60px 100px; margin: 100px 0; } body.page-template-page-about-us #project-slider h2 { position: relative; z-index: 2; text-align: center; font-size: 4rem; line-height: 6rem; } body.page-template-page-about-us #project-slider .splide__pagination { bottom: 20px !important; } /* End About Page Styles */ /* Services Page Styles */ body.page-template-page-services {} body.page-template-page-services .services-sections { display: flex; flex-flow: row nowrap; justify-content: space-between; margin-bottom: 100px; } body.page-template-page-services .services-sections .services-primary-left, body.page-template-page-services .services-sections .services-primary-right { width: 47%; display: flex; flex-flow: row nowrap; align-items: center; } body.page-template-page-services .services-sections .services-primary-left p:last-of-type, body.page-template-page-services .services-sections .services-primary-right p:last-of-type { margin-bottom: 0px; } body.page-template-page-services #services-posts h2 { position: relative; z-index: 2; text-align: center; font-size: 4rem; line-height: 6rem; margin-bottom: 20px; } body.page-template-page-services #services-posts .services-inspiration-link { position: relative; z-index: 2; display: block; text-align: center; font-size: 120%; margin-bottom: 100px; color: #888; } body.page-template-page-services #services-posts .services-inspiration-link i { vertical-align: middle; position: relative; top: 2px; margin-right: 10px; font-size: 26px; } body.page-template-page-services #services-posts .services-inspiration-link a { color: #888; } ul#post-page-loop.page-service-extras { flex-flow: row nowrap; } ul#post-page-loop.page-service-extras li { width: 18.4%; margin-right: 2%; } ul#post-page-loop.page-service-extras li:last-child { margin-right: 0; } ul#post-page-loop li .post-info { margin-bottom: 0; } ul#post-page-loop.page-service-extras li h3 { font-size: 1.2rem; line-height: 1.6rem; margin: 0 0; } /* End Services Page Styles */ /* Contact Page Styles */ body.page-template-page-contact #primary { display: flex; flex-flow: row nowrap; } body.page-template-page-contact #primary section:first-of-type { width: 45%; padding-right: 10%; } body.page-template-page-contact #primary section:last-of-type { width: 55%; background: #ececec; border-top: 10px solid #f4a709; padding: 4%; border-radius: 10px; -webkit-border-radius: 10px; } /* End Contact Page Styles */ /********************************* [ SIDEBAR STYLES ] *********************************/ #secondary { } .widget { background: #f9f9f9; padding: 10%; margin: 0 0 20px; border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #e7e7e7; } .widget.widget_media_image { padding: 0 0; } .widget.widget_media_image img { display: block; } .widget h2 { color: #4b5267; font-size: 1.8rem; line-height: 2.2rem; font-weight: 300; margin: 0 0 40px; text-transform: uppercase; } .widget a { } #widget_my_account.widget_nav_menu { } .widget_nav_menu ul { margin: 0 0; padding: 0 0; list-style: none outside; } .widget_nav_menu ul li { display: flex; flex-wrap: nowrap; flex-direction: row; margin-bottom: 5px; } .widget_nav_menu ul li a { width: 100%; color: #666; padding: 8px 10px 8px 15px; border-radius: 5px; -webkit-border-radius: 5px; background: rgba(0,0,0,0.05); font-size: 0.9rem; font-weight: bold; } .widget_nav_menu ul li a::before { position: relative; top: -1px; margin: 0 20px 0 0; vertical-align: middle; font-size: 20px; font-family: uicons-regular-rounded !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .widget_nav_menu ul li a:hover, .widget_nav_menu ul li.current-menu-item a { color: #333; background: rgba(0,0,0,0.15); } .widget_nav_menu ul li.current-menu-item a { } .widget_nav_menu ul li#menu-item-317 a::before { content: "\fbef"; } .widget_nav_menu ul li#menu-item-316 a::before { content: "\fbe2"; } .widget_nav_menu ul li#menu-item-314 a::before { content: "\fb39"; } .widget_nav_menu ul li#menu-item-315 a::before { content: "\f452"; } .widget_nav_menu ul li#menu-item-318 a::before { content: "\f4c2"; } .widget_nav_menu ul li#menu-item-319 a::before { content: "\f9e7"; } /******************************* [ END SIDEBAR STYLES ] *******************************/ /********************************* [ FOOTER STYLES ] *********************************/ .site-footer { width: 100%; position: relative; padding: 120px 0px 0px; background: #151a2a; font-size: 94%; color: #fff; } .site-info { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; } .site-info section.footer-left, .site-info section.footer-right { } .site-info a { color: #fff; } .site-info a:hover { } .site-info section h1, .site-info section h2, .site-info section h3, .site-info section h4, .site-info section h5, .site-info section h6 { position: relative; font-size: 1.3rem; line-height: 1.3rem; margin-bottom: 20px; color: #f4a709; } .site-info section strong { } .site-quote { margin-bottom: 50px; padding-bottom: 50px; border-bottom: 1px solid rgba(255,255,255,0.2); } .site-quote section:first-of-type { width: 70%; display: flex; align-items: center; } .site-quote section:first-of-type h5 { color: #fff; font-size: 2rem; line-height: 2.2rem; margin-bottom: 0; letter-spacing: 3px; } .site-quote section:last-of-type { width: 30%; } .site-quote section:last-of-type .button { width: 100%; text-align: center; } .site-info section.footer-left { width: 30%; } .site-info section.footer-left .footer-logo { max-width: 100%; width: 300px; height: auto; margin: 0 0 50px; } .site-info section.footer-left div { margin-bottom: 10px; } .site-info section.footer-left div i { vertical-align: middle; position: relative; top: 2px; margin-right: 10px; font-size: 22px; } .site-info section.footer-left .ftr-hia { width: 160px; height: auto; margin-top: 20px; } .site-info section.footer-right { width: 70%; } .site-info section.footer-right #footer-logos { margin-bottom: 80px; } .site-info section.footer-right #footer-logos img { vertical-align: middle; max-width: 200px; height: auto; display: inline-block; margin-right: 100px; } .site-info section.footer-right #footer-logos img:last-of-type { margin-right: 0px; } .site-info section.footer-right ul { list-style: none outside; margin: 0 0 70px; padding: 0 0; display: flex; flex-flow: row nowrap; align-items: flex-start; } .site-info section.footer-right ul li { margin: 0 0; padding: 0 0 10px; width: 33.333%; } .site-info section.footer-right ul li a i { vertical-align: middle; position: relative; top: 2px; font-size: 22px; font-style: normal; color: #f4a709; min-width: 35px; text-align: center; } .site-info section.footer-right .ftrrecognition { color: rgba(255,255,255,0.8); } .site-info-copy { font-size: 70%; margin-top: 80px; color: rgba(255,255,255,0.6); letter-spacing: 2px; text-transform: uppercase; } #copyright, #developed { margin-bottom: 50px; } #developed { color: rgba(255,255,255,0.2); } #copyright a { color: rgba(255,255,255,0.6); } #developed a { color: rgba(255,255,255,0.2); } #copyright a:hover, #developed a:hover { color: rgba(255,255,255,1); text-decoration: underline; } #back-top { padding: 0; bottom: 40%; position: fixed; z-index: 3; right: 20px; } #back-top a { display: block; width: 57px; color: #FFF; text-align: center; text-decoration: none; text-transform: uppercase; } #back-top span { background: #f4a709 url(images/up-arrow.png) no-repeat 50% 50%; display: block; width: 57px; height: 58px; margin-bottom: 0; background-size: 70% auto; -webkit-background-size: 70% auto; border-radius: 5px; -webkit-border-radius: 5px; } #back-top span:hover { background-color: #f4a709; } #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: #f4a709; color: #fff; width: 100%; margin: 0 0; padding: 0 0; } #footer-toggle-menu li { display: block; width: 33.333%; vertical-align: middle; text-align: center; } #footer-toggle-menu li a { display: block; min-height: 62px; padding: 13px 0px 9px; color: #fff; font-size: 0.7rem; line-height: 1rem; font-family: 'Roboto', Arial, sans-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: #c7890b; text-decoration: none; color: #fff; } .shiftnav-toggle-button { background: #c7890b; color: #fff !important; } .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; } .edit-link { position: fixed; top: 30%; left: 0; z-index: 10; display: block; width: auto; height: auto; padding: 7px 15px; background: #f4a709; color: #fff; text-align: center; text-transform: uppercase; font-size: 0.8rem; font-weight: 600; border-radius: 0 4px 4px 0; -webkit-border-radius: 0 4px 4px 0; } .edit-link a { display: block; color: #fff; } .edit-link a::before { position: relative; vertical-align: middle; display: inline-block; color: #fff; margin-right: 6px; font-size: 20px; font-family: uicons-regular-rounded !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\e5df"; } /******************************* [ END FOOTER STYLES ] *******************************/ /********************** [ GRAVITY FORMS STYLES ] **********************/ .gform_wrapper { margin: 0 0 !important; } .gform_wrapper li { margin-top: 12px !important; } body .gform_legacy_markup_wrapper .top_label div.ginput_container { margin-top: 2px !important; } .gform_wrapper div.ginput_container input, .gform_wrapper div.ginput_container textarea, .gform_wrapper div.ginput_container select { font-size: 0.9rem !important; padding: 12px 12px !important; border-radius: 5px; -webkit-border-radius: 5px; } .gform_wrapper.gravity-theme .gfield_label { text-transform: uppercase; margin-bottom: 0 !important; font-size: 1rem !important; } .gform_wrapper.gravity-theme label { margin-bottom: 0 !important; font-size: 1rem !important; } .gform_wrapper.gravity-theme .gfield_description { padding-top: 0 !important; line-height: 1rem !important; } .gform_body.gform-body h2, .gform_body.gform-body h3, .gform_body.gform-body h4, .gform_body.gform-body h5, .gform_body.gform-body h6 { margin: 0 0 10px; } .gform_wrapper.gravity-theme .gform_previous_button.button svg, .gform_wrapper.gravity-theme .gform_save_link.button svg { vertical-align: middle; } .gform_body.gform-body .button svg path { fill: #fff; } .gform_delete_file { background: #222; padding: 5px 5px; line-height: 1rem; } .gform_required_legend { display: none; } body.page-template-page-contact-details .gform_wrapper, .enquiryform { background: #ececec; border-top: 10px solid #f4a709; padding: 4%; } .gform_wrapper.gravity-theme .gfield.gf_list_inline .gfield_checkbox .gchoice, .gform_wrapper.gravity-theme .gfield.gf_list_inline .gfield_radio .gchoice { padding-right: 3% !important; } /* RADIO BUTTON STYLES */ .gform_wrapper.gravity-theme .customradio input[type="radio"] { opacity: 0; -webkit-opacity: 0; position: fixed; width: 0; } .gform_wrapper.gravity-theme .customradio .gchoice { float: left; width: 48%; margin-right: 2%; margin-bottom: 30px; } .gform_wrapper.gravity-theme .customradio label { display: block !important; background-color: #666; padding: 3% 3%; font-weight: 400; font-size: 1.3rem !important; line-height: 2.2rem; border: 0px none; color: #fff; cursor: pointer; text-align: center; width: 100% !important; max-width: 100% !important; border-radius: 5px; -webkit-border-radius: 5px; } .gform_wrapper.gravity-theme .customradio label:hover { background-color: #f4a709; } .gform_wrapper.gravity-theme .customradio input[type="radio"]:checked + label { background-color: #f4a709; border-color: #81b33f; color: #fff; } /* RADIO BUTTON STYLES */ /******************** [ END GRAVITY FORMS STYLES ] ********************/ .lrm-form a.button, .lrm-form button, .lrm-form button[type=submit], .lrm-form #buddypress input[type=submit], .lrm-form input[type=submit] { background: #4b5267 !important; } div.is-ajax-search-details, div.is-ajax-search-result { padding: 1px !important; } .xoo-el-form-container button.btn.button.xoo-el-action-btn { height: auto !important; } .strong-view.wpmtst-simple a.disabled { display: block !important; } .yith-wcwl-add-to-wishlist i { font-family: "Font Awesome 6 Free" !important; font-weight: 400; } .fa.fa-facebook, .fa.fa-twitter, .fa.fa-google-plus, .fa.fa-google-plus-square, .fa.fa-pinterest, .fa.fa-pinterest-square { font-family: "Font Awesome 6 Brands" !important; margin-right: 0 !important; } .fa.fa-envelope-o, .fa.fa-whatsapp { margin-right: 0 !important; } .yith-wcwl-add-to-wishlist i.fa-heart { font-weight: 900; } /* FAQS Accordion Styles */ .sp-easy-accordion .sp-ea-single .ea-header { font-family: 'Roboto', sans-sans-serif; } .sp-easy-accordion .sp-ea-single .ea-header a { padding: 25px !important; font-weight: 700 !important; font-size: 18px !important; } .sp-ea-one.sp-easy-accordion .sp-ea-single .ea-body { padding: 35px !important; } #wpgmza_map { border: 20px solid #f4f4f4; } /* Add some Lazy Load Styles */ .lazy-load { opacity: 0; transform: translateY(30px); /* slight vertical offset */ transition: opacity 1s ease-out, transform 1s ease-out; will-change: opacity, transform; } .lazy-load.visible { opacity: 1; transform: translateY(0); } /* End some Lazy Load Styles */ /* Strong Testimonials Styles */ .strong-view.wpmtst-simple .wpmtst-testimonial { margin: 0 0 100px !important; padding: 0 15px !important; } .strong-view.wpmtst-simple .wpmtst-testimonial-inner { background: #fff; border-radius: 15px; -webkit-border-radius: 15px; padding: 50px !important; box-shadow: 3px 2px 40px rgba(0,0,0,0.1); -webkit-box-shadow: 3px 2px 40px rgba(0,0,0,0.1); border-bottom: 4px solid #f4a709; font-style: italic; } .strong-view.wpmtst-simple .wpmtst-testimonial-inner strong { font-size: 1.3rem; } .strong-view.wpmtst-simple .wpmtst-testimonial-inner::after { position: absolute; z-index: 1; bottom: -20px; right: 60px; background: #fff; padding: 20px 22px; border-radius: 100px; -webkit-border-radius: 100px; font-size: 25px !important; color: #f4a709; box-shadow: 3px 3px 0 #f4a709; -webkit-box-shadow: 3px 3px 0 #f4a709; font-family: uicons-regular-rounded !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\eca2"; } .strong-view.wpmtst-simple .wpmtst-testimonial-inner .testimonial-name { font-weight: bold; margin-top: 30px; } /* End Strong Testimonials Styles */ /********************************* [ SHORTCODES STYLES ] *********************************/ .shortcode-pdf { position: relative; display: inline-block; margin-bottom: 40px; } .shortcode-pdf a { position: relative; display: block; padding: 15px 25px 15px 70px; line-height: 26px; background: #ed3f16; border-radius: 6px; -webkit-border-radius: 6px; color: #fff; font-weight: bold; text-decoration: none; } .shortcode-pdf a::before { position: absolute; left: 20px; z-index: 1; font: var(--fa-font-regular); content: '\f1c1'; font-size: 26px; line-height: 26px; color: #fff; } .shortcode-pdf a:hover { color: #fff; background: #c93614; text-decoration: none; } .shortcode-hr { position: relative; margin: 50px 0px; border-top: 2px solid #f4a709; } .shortcode-address, .shortcode-phone, .shortcode-fax, .shortcode-email, .shortcode-time, .shortcode-facebook, .shortcode-instagram, .shortcode-shop { position: relative; margin-bottom: 20px; display: block; background: #4b5267; font-size: 1.2rem; color: #fff; padding: 30px 0px; text-align: center; border-radius: 7px; -webkit-border-radius: 7px; } .shortcode-address i, .shortcode-phone i, .shortcode-fax i, .shortcode-email i, .shortcode-time i, .shortcode-facebook i, .shortcode-instagram i, .shortcode-shop i { position: relative; top: 2px; font-size: 1.5rem; margin: 0px 10px 0px 0px; vertical-align: middle; color: #f4a709; } .shortcode-address p, .shortcode-phone p, .shortcode-fax p, .shortcode-email p, .shortcode-time p, .shortcode-facebook p, .shortcode-instagram p, .shortcode-shop p { padding-bottom: 0px; } .shortcode-address + br, .shortcode-phone + br, .shortcode-fax + br, .shortcode-email + br, .shortcode-time + br, .shortcode-facebook + br, .shortcode-facebook + br, .shortcode-shop + br { display: none; } .shortcode-address a, .shortcode-phone a, .shortcode-fax a, .shortcode-email a, .shortcode-time a, .shortcode-facebook a, .shortcode-instagram a, .shortcode-shop a { color: #fff !important; text-decoration: none !important; } .shortcode-address a:hover, .shortcode-phone a:hover, .shortcode-fax a:hover, .shortcode-email a:hover, .shortcode-time a:hover, .shortcode-facebook a:hover, .shortcode-instagram a:hover, .shortcode-shop a:hover { color: #fff; text-decoration: underline; } .shortcode-time i { margin: 4px 20px 40px 0; float: left; } .shortcode-cta { position: relative; display: block; margin-bottom: 3rem; font-size: 1.8rem; line-height: 2rem; text-align: center; color: #f4a709; padding: 0 10%; } .shortcode-cta a { color: #4b5267 !important; font-size: inherit; } .shortcode-cta a:hover { color: #4b5267 !important; font-size: inherit; text-decoration: underline; } .shortcode-cta2 { position: relative; font-size: 1.8rem; line-height: 2.3rem; color: #f4a709; text-transform: uppercase; letter-spacing: -0.5px; font-weight: 600; } .shortcode-cta2 a { color: #f4a709; font-size: inherit; text-decoration: none; font-weight: bold; text-transform: uppercase; } .shortcode-cta2 a:hover { color: #f4a709; font-size: inherit; text-decoration: underline; } .shortcode-urllink { position: relative; padding-left: 30px; font-weight: bold; color: #4b5267; } .shortcode-urllink a { color: #4b5267; text-decoration: underline; } .shortcode-urllink a:hover { color: #4b5267; } .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; margin-bottom: 30px; } .shortcode-quote { position: relative; font-family: 'Gabarito', sans-serif; font-size: 2rem; line-height: 3rem; color: #fff; font-weight: 700; margin: 4rem 0; padding: 5% 8%; background: #4b5267; } .shortcode-quote::before { position: absolute; z-index: 1; content: ''; bottom: -15px; right: 50px; width: 105px; height: 85px; background: url(images/shortcode-quote.svg) no-repeat 0 10px; background-size: 100% auto; -webkit-background-size: 100% auto; } .shortcode-quote strong { clear: right; } .shortcode-quote-large { position: relative; font-family: 'Gabarito', sans-serif; font-size: 1.3rem; line-height: 2rem; color: #666; font-weight: 700; margin: 0 0; padding: 9% 10%; background: rgba(0,0,0,0.1); text-align: center; } .shortcode-quote-large::before { position: absolute; z-index: 1; content: ''; bottom: -20px; right: 60px; width: 130px; height: 100px; background: url(images/shortcode-quote.svg) no-repeat 0 10px; background-size: 100% auto; -webkit-background-size: 100% auto; } .shortcode-quote-large strong { clear: right; } .shortcode-quote-large p:last-of-type { margin-bottom: 0; } .shortcode-one-half { display: flex; flex-flow: row nowrap; justify-content: space-between; width: 100%; } .shortcode-one-half div.sc-half { width: 47%; } .shortcode-one-half div.sc-half:last-of-type p:first-of-type { margin-bottom: 0; } .shortcode-one-half div.sc-half h2, .shortcode-one-half div.sc-half h3 { } .shortcode-one-half div.sc-half img { display: block; max-width: 100% !important; } .shortcode-one-third, .shortcode-one-third-last { float: left; width: 32%; margin-right: 2%; margin-bottom: 20px; } .shortcode-one-third-last { margin-right: 0; } .shortcode-one-third p, .shortcode-one-third-last p { margin: 0 0 20px; } .shortcode-one-third img, .shortcode-one-third-last img { display: block; margin-bottom: 10px; } .shortcode-one-third h3, .shortcode-one-third-last h3 { margin-bottom: 20px; font-size: 1.6rem; } .shortcode-one-third p:last-of-type a, .shortcode-one-third-last p:last-of-type a { text-align: center; } .shortcode-one-third p:last-of-type a:hover, .shortcode-one-third-last p:last-of-type a:hover { } .shortcode-one-third ul, .shortcode-one-third-last ul { margin: 0 0 3rem; padding: 0 0 0 20px; list-style: none outside; } .shortcode-one-third ul li, .shortcode-one-third-last ul li { padding: 0 0 5px 40px; background: url(images/icon-list-item.png) no-repeat 0 5px; } .shortcode-one-fourth, .shortcode-one-fourth-last { float: left; width: 23.5%; margin-right: 2%; margin-bottom: 20px; text-align: center; } .shortcode-one-fourth-last { margin-right: 0; } .shortcode-one-fourth p, .shortcode-one-fourth-last p { margin: 0 0; } .shortcode-one-fourth p:last-of-type, .shortcode-one-fourth-last p:last-of-type { margin: 20px 0 0; } .shortcode-one-fourth img, .shortcode-one-fourth-last img { display: block; text-align: center; margin: 10px auto; } .shortcode-one-fourth h3, .shortcode-one-fourth-last h3 { margin: 0 0 10px; } .shortcode-one-fourth p:last-of-type a, .shortcode-one-fourth-last p:last-of-type a { display: block; text-align: center; } .shortcode-one-fourth p:last-of-type a:hover, .shortcode-one-fourth-last p:last-of-type a:hover { } .shortcode-timetable { position: relative; margin-bottom: 15px; } .shortcode-timetable::before { } .shortcode-timetable i { float: left; margin: 6px 10px 10px 0; color: #98b10c; } .shortcode-timetable strong { display: block; } .shortcode-faq { display: block; border-bottom: 2px solid #e8e8e8; margin-bottom: 50px; padding-left: 100px; background: url(images/icon-faq.png) no-repeat 0 5px; background-size: 70px auto; -webkit-background-size: 70px auto; } .shortcode-faq h4 { font-size: 1.6rem; line-height: 2rem; } .shortcode-faq p:first-of-type { margin: 0 0; } .shortcode-columns { columns: 2; column-gap: 10%; margin-bottom: 3rem; } .shortcode-columns p:first-of-type { margin: 0 0; } .shortcode-list-ticks { } .shortcode-list-ticks ul { list-style: none; margin: 0 0; padding: 0 0; } .shortcode-list-ticks ul li { padding: 0 0 11px 35px; } .shortcode-list-ticks ul li::before { position: absolute; left: 0; top: 0; margin-top: 2px; font-size: 24px; color: #f4a709; font-family: uicons-regular-rounded !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\e35f"; } /******************************* [ END SHORTCODES STYLES ] *******************************/ /********************************* [ RESPONSIVE STYLES ] *********************************/ .post img, #logo { max-width: 100%; height: auto; } embed, iframe, object, video { max-width: 100%; } @media only screen and ( max-width: 1700px ) { body { font-size: 1rem; } .container { width: 1160px; } #primary { width: 65%; } #secondary { width: 31%; } .header-left { width: 300px; } .header-right { width: calc(100% - 300px); } .main-navigation li a { margin: 0 13px; font-size: 1rem; } .menu-item-has-children::before { right: 5px; margin-top: -6px; font-size: 17px; } #home-intro section h1 em, #home-services section h2, #home-extra-services h2, #home-feedback h2 { font-size: 3rem; line-height: 3rem; } #home-intro { padding: 100px 0px 350px; } #home-intro::before { width: 20px; height: 60%; } #home-intro section.intro-text h1 { font-size: 2rem; line-height: 2rem; } #home-intro section.intro-text p { font-size: 1rem; line-height: 1.6rem; } #home-services { padding: 0px 0px 100px; } #home-services section:first-of-type { padding: 100px 100px 0px; } #home-services section h2 { font-size: 4rem; line-height: 4.5rem; } #project-slider ul li .projects-member-info h3 { font-size: 1.3rem; line-height: 1.3rem; } #home-extra-services { padding: 100px 0 120px; } #home-extra-services ul li { padding: 50px 40px; } #home-feedback { padding: 100px 0; } .entry-header { padding: 260px 0px 90px; } .entry-header h1.entry-title { } h1 { font-size: 3rem; } .shortcode-quote { font-size: 1.5rem; line-height: 2rem; } .shortcode-cta { font-size: 1.5rem; line-height: 2.2rem; } .alignright { max-width: 40% !important; } .shortcode-one-half img, .shortcode-one-half-last img { max-width: 100% !important; } .shortcode-address, .shortcode-phone, .shortcode-fax, .shortcode-email, .shortcode-time, .shortcode-facebook, .shortcode-instagram, .shortcode-shop { font-size: 1rem; } .post .post-content {} .post .post-content .post-text-side { width: 45%; } .post .post-content .post-gallery-side { width: 52%; } ul#post-page-loop.page-service-extras li h3 { font-size: 1.1rem; line-height: 1.3rem; margin: 0 0; } .site-info section.footer-left .footer-logo { width: 270px; } } @media only screen and ( max-width: 1260px ) { .container { width: 960px; } h1, h2, h3, h4, h5, h6 { margin: 0 0 20px; } h2 { font-size: 1.6rem; line-height: 1.6rem; } .main-header { padding: 20px 20px; } .header-left { width: 280px; } .header-right { width: calc(100% - 280px); } .main-navigation { width: calc(100% - 160px); } .main-navigation li a { font-size: 1rem; line-height: 1rem; margin: 0 10px; } .main-navigation li a::after { bottom: -7px; } .menu-item-has-children::before { font-size: 18px; right: 4px; margin-top: -7px; } .donatebtn { width: 160px; padding: 10px 4px; font-size: 0.8rem; } .slider-header { font-size: 40px !important; } .slider-subheader { font-size: 28px !important; } .slider-quotetext { display: none !important; } #home-services section h2, #home-extra-services h2, #home-feedback h2 { font-size: 3rem; line-height: 3rem; } #home-intro {} #home-intro section.intro-text div { width: 48%; } #home-intro section.intro-text div:first-of-type { padding-left: 4%; } #home-intro section.intro-text h1 { font-size: 1.7rem; line-height: 2rem; } #home-intro section.intro-text h1 em { font-size: 3rem; line-height: 2.6rem; display: block; text-align: left; } #home-intro section.intro-pics div.home-pic2 { padding: 100px 0 0; } #home-services section:first-of-type { padding: 100px 50px 0px; } #home-services article section:last-of-type { padding: 0 100px 100px; } #home-extra-services {} #home-extra-services ul li { padding: 50px 25px; } #home-extra-services ul li h3 { font-size: 1.1rem; } .entry-header { padding: 200px 0px 50px; } .entry-header h1.entry-title { font-size: 2rem; line-height: 2rem; } p { margin: 0 0 2rem; } .alignright, .alignleft { max-width: 50%; } ul#post-page-loop li { padding: 20px; width: 48%; } ul#post-page-loop li .post-page-stats { left: 20px; top: 20px; } ul#post-page-loop li h3 { font-size: 1rem; line-height: 1.3rem; } #rpwwt-recent-posts-widget-with-thumbnails-2 img { width: 60px; height: auto; } ul.contact-details-fields li { padding: 30px 10px; } .shortcode-quote { } .shortcode-cta { font-size: 1.5rem; line-height: 2.2rem; } .post .fg-default .fg-item { width: 31%; } .post .post-thumbnail, .team .post-thumbnail { width: 40%; } .post .post-content { display: block; } .post .post-content .post-text-side { width: 100%; } .post .post-content .post-gallery-side { width: 100%; } ul#post-page-loop.page-service-extras { flex-flow: row wrap; } ul#post-page-loop.page-service-extras li { width: 31%; } body.page-template-page-about-us #project-slider h2, body.page-template-page-services #services-posts h2 { font-size: 3rem; line-height: 3rem; } .widget { } .widget h2 { } .site-footer { padding: 70px 0px 0px; } .site-info section h1, .site-info section h2, .site-info section h3, .site-info section h4, .site-info section h5, .site-info section h6 { margin-bottom: 10px; } .site-info section.footer-left { } .site-info section.footer-left .footer-logo { width: 85%; } .site-info section.footer-right { } .site-info section.footer-right ul { flex-flow: row wrap; margin: 0 0; } .site-info section.footer-right ul li { padding: 0 0 50px; width: 50%; } } @media only screen and ( max-width: 980px ) { .container { width: 750px; } .body-fixed { padding-top: 0; } .site-header, .site-header.scroll-fixed { position: absolute; } .header-left { width: 300px; } .site-branding { margin: 0 auto; } .header-right { width: calc(100% - 300px); justify-content: flex-end; } .main-navigation { display: none; } .header-mobmenu { display: block; } .slider-header, .slider-subheader, .slider-quotetext, .slider-bar, .slider-overlay { display: none !important; } #home-intro { padding: 100px 0px 280px; background-size: 900px auto; -webkit-background-size: 900px auto; } .entry-header { padding: 200px 0px 50px; } .entry-header h1.entry-title { font-size: 2rem; line-height: 2rem; } #primary { width: 100%; float: none; padding: 100px 0px 20px; } h2, h3 { font-size: 1.5rem; line-height: 2rem; } .shortcode-hr { margin: 20px 0px; } .shortcode-quote { } .shortcode-quote-large { font-size: 1.1rem; line-height: 1.6rem; } .shortcode-quote-large::before { bottom: -26px; right: 26px; width: 80px; height: 80px; } .cta-inspiration { letter-spacing: 0; } .cta-inspiration h2 { font-size: 2rem; line-height: 2rem; } body.page-template-page-services #services-posts h2, body.page-template-page-about-us #project-slider h2 { font-size: 2.3rem; line-height: 2.3rem; } ul.services-page-list { } ul.services-page-list li:nth-child(odd) { width: 49%; margin-right: 2%; } ul.services-page-list li:nth-child(even) { width: 49%; margin-right: 0; } ul.services-page-list li h4 { font-size: 1.3rem; } body.page-template-page-contact #primary { display: block; } body.page-template-page-contact #primary section:first-of-type { width: 100%; padding: 0; } body.page-template-page-contact #primary section:first-of-type .shortcode-hr { display: none; } body.page-template-page-contact #primary section:last-of-type { width: 100%; } #page-short-desc { font-size: 1.2rem; line-height: 1.7rem; } ul#post-page-loop.services-posts li { width: 48%; } ul#post-page-loop.services-posts li:nth-child(odd) { margin-right: 2% !important; } ul#post-page-loop.services-posts li:nth-child(even) { margin-right: 0 !important; } body.page-template-page-about-us .about-primary { display: block; } body.page-template-page-about-us .about-primary > div { width: 100%; display: block; margin-bottom: 50px; } body.page-template-page-about-us .about-primary > div > .about-inner { padding: 0 0; } body.page-template-page-about-us .about-primary > div.about-primary-photo { } body.page-template-page-about-us .about-primary > div.about-primary-photo div { min-height: 300px; } body.page-template-page-about-us #project-slider { margin: 50px 0; } .gform_wrapper.gravity-theme .gfield_label { font-size: 0.9rem !important; } .gform_wrapper.gravity-theme .customradio .gchoice { margin-bottom: 15px; } .gform_wrapper.gravity-theme .customradio label { font-size: 1rem !important; } #secondary { float: none; width: 100%; font-size: 100%; margin-right: 0; padding: 0px 0px 100px; } .widget { float: none; width: 100%; margin-right: 0; } .widget h2 { } .site-footer { padding: 50px 0px 80px; } .site-info { display: block; } .site-info.site-quote { display: flex !important; } .site-quote section:first-of-type h5 { font-size: 1.7rem; letter-spacing: 2px; } .site-info section.footer-left { width: 100%; text-align: center; } .site-info section.footer-left .footer-logo { width: 50%; margin: 0 0 20px; } .site-info section.footer-right { width: 100%; margin-top: 40px; } .site-info section.footer-right ul { text-align: center; justify-content: space-evenly; } .site-info section.footer-right .ftrrecognition { text-align: center; } .site-info-copy { text-align: center; } #footer-toggle-menu { display: flex; } } @media only screen and ( max-width: 768px ) { body { font-size: 1rem; } .body-fixed { padding-top: 0px !important; } .container { width: auto; padding: 0px 50px; } #primary { width: auto; float: none; padding: 50px 0 50px; clear: both; } #secondary { width: auto; float: none; clear: both; } .topbar-header a.hdrforster, .donatebtn { display: none; } .site-header, .site-header.scroll-fixed { position: relative; background: #151a2a; } .site-header .main-header { padding: 20px 20px; } .site-branding img { width: 100%; margin: 0 auto 0; border: 1px solid #f4a709; padding: 20px 50px; } .site-header .donatebtn { padding: 3px 0px 3px; } #home-intro section h1 em, #home-services section h2, #home-extra-services h2, #home-feedback h2 { font-size: 2.3rem !important; line-height: 2.3rem !important; } #home-intro { background-size: 700px auto; -webkit-background-size: 700px auto; } #home-intro::before { display: none; } #home-intro section.intro-text { display: block; } #home-intro section.intro-text div { padding: 0; width: 100%; text-align: center; } #home-intro section.intro-text div:first-of-type { padding-left: 0; } #home-intro section.intro-text h1, #home-intro section.intro-text h1 em, #home-intro section.intro-text p { text-align: center; } #home-intro section.intro-text img.home-mba { margin: 30px auto 20px; } #home-intro section.intro-pics { margin: 50px 0 0; } #home-intro section.intro-pics div.home-pic1 img { top: 0; } #home-intro section.intro-pics div.home-pic2 { padding: 0; } #home-services {} #home-services section:first-of-type { padding: 50px 20px 0px; } #home-services section h2 { margin-bottom: 0; } #home-services section h3 { margin-bottom: 20px; } #home-services section p { padding: 0 20px; } #home-services article section:last-of-type { padding: 0 50px 50px; } #home-extra-services { padding: 70px 0 90px; } #home-extra-services h2 { margin-bottom: 0; } #home-extra-services h3 { margin-bottom: 20px; } #home-extra-services ul li { padding: 20px 10px; } #home-extra-services ul li a.extra-icon-link svg { width: 30px; height: 30px; } #home-extra-services ul li h3 { font-size: 1rem; line-height: 1rem; } .entry-header { padding: 100px 0px 50px; } article.post, article.page { margin-right: 0 !important; } ul#post-page-loop { padding-right: 0; justify-content: space-evenly; } ul#post-page-loop.page-service-extras li { width: 48%; padding: 10px; margin-bottom: 20px; } ul#post-page-loop li .post-info { padding: 10px 0 0; } ul.contact-details-fields { display: block; } ul.contact-details-fields li { width: 100%; margin: 0 0 20px; } .shortcode-quote { margin: 2rem 0 3rem; font-size: 1.2rem; } .shortcode-quote::before { right: 20px; width: 80px; height: 68px; } .shortcode-quote-large { padding: 40px; } .shortcode-one-half, .shortcode-one-half-last { display: block; float: none; width: auto; margin-right: 0; } .shortcode-one-half div.sc-half { width: 100%; } input[type="button"], input[type="submit"], button, .button, a.read-more, .reply-container a, #commentform input#submit, .shortcode-button a, .gform_wrapper.gravity-theme .gform_previous_button.button, .gform_wrapper.gravity-theme .gform_save_link.button { font-size: 1rem; } #primary {} body.page-template-page-services .services-sections { display: block; } body.page-template-page-services .services-sections .services-primary-left, body.page-template-page-services .services-sections .services-primary-right { width: 100%; } body.page-template-page-services .services-sections .services-primary-left { margin-bottom: 30px; } body.page-template-page-services #services-posts h2 { font-size: 2.3rem; line-height: 2.3rem; } body.page-template-page-services #services-posts .services-inspiration-link { font-size: 100%; margin-bottom: 50px; } ul#post-page-loop li .post-info { padding: 20px 0 0; } body.single-project #project-details { flex-flow: row wrap; } body.single-project #project-details div { width: 48%; padding: 20px; margin-bottom: 20px; } body.single-project #project-details div:last-of-type { width: 100%; } body.single-project #project-details div strong { font-size: 100%; } .post .attachment-post-thumbnail { max-width: 100%; float: none; } p { margin: 0 0 2rem; } .gform_wrapper div.ginput_container input, .gform_wrapper div.ginput_container textarea, .gform_wrapper div.ginput_container select { font-size: 1rem !important; padding: 8px 12px !important; } #secondary { text-align: left; display: block; margin-right: 0 !important; font-size: 100% !important; padding: 0px 0px 30px; } .site-info.site-quote { display: block !important; } .site-quote section:first-of-type { width: 100%; display: block; text-align: center; margin-bottom: 20px; } .site-quote section:last-of-type { width: 100%; margin-bottom: 50px; text-align: center; } .site-quote section:last-of-type .button { width: 70%; text-align: center; margin: 0 auto; } #back-top { bottom: 40px; right: 0px; } } @media only screen and ( max-width: 479px ) { .body-fixed { padding-top: 0px !important; } .container { width: auto; padding: 0px 15px; } .site-header { border-bottom: 0; } .site-header .main-header { display: block; } .topbar-header { display: none; } .site-header.scroll-fixed .header-left, .site-header.scroll-fixed .header-right { width: inherit; } .header-left, .header-right { width: 100%; margin-bottom: 0px; } .site-branding { padding: 0 0; } .site-branding img { padding: 15px 75px; margin: 0 auto 13px; } .header-right { justify-content: space-between; } .donatebtn { width: 170px !important; } #homepage-slider { max-height: 210px; overflow: hidden; } #slider-header h1, #slider-header h2 { display: none; } #home-intro section.intro-text h1, #home-intro section.intro-text h1 em, #home-services section h2, #home-extra-services h2, #home-feedback h2 { font-size: 1.5rem !important; line-height: 1.6rem !important; } #home-services section h3, #home-extra-services h3, #home-feedback h3 { font-size: 1.2rem; line-height: 1.3rem; } .post .post-content .post-text-side h2 em { display: inline; font-size: 100%; } #home-intro { padding: 40px 0px 250px; } #home-intro section.intro-text img.home-mba { max-width: 135px; padding: 10px 20px; } #home-intro section.intro-text p { padding: 0 18px; } #home-intro section.intro-pics { display: block; } #home-intro section.intro-pics div { width: 100%; } #home-services { padding: 0px 0px 50px; } #home-services article section:last-of-type { padding: 0 30px 50px; } #project-slider ul li .projects-member-info { padding: 8px 15px; } #home-services .splide__arrow { width: 2em !important; height: 2em !important; } #home-extra-services { padding: 50px 0 40px; } #home-extra-services ul { display: block; } #home-extra-services ul li { padding: 20px 10px; width: 100%; margin-bottom: 20px; } #home-feedback { padding: 50px 0; } .strong-view.wpmtst-simple .wpmtst-testimonial-inner { padding: 30px !important; } 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%; text-align: center; letter-spacing: 0; font-size: 1rem; } .entry-header { padding: 80px 0px; text-align: center; } .entry-header h1.entry-title { font-size: 1.4rem; line-height: 1.6rem; } .entry-breadcrumbs { display: none; } .post-meta strong { display: block; max-width: 70%; margin: 0 auto 10px; } #page-short-desc { font-size: inherit; line-height: inherit; } ul#post-page-loop { padding-right: 0; display: block; } ul#post-page-loop li { float: none; width: auto; margin-right: 0; } article.type-team .entry-content { display: block; } .post .post-thumbnail, .team .post-thumbnail { width: 100%; } .post .post-content, .team .post-content { width: 100%; } .entry-content > ul { padding: 0 0; } .post.type-post { margin-right: 0 !important; } .post .post-thumbnail { max-width: 100%; width: 100%; float: none; margin: 0 0 20px; } .post .post-content .post-gallery-side .button { padding: 15px 10px; font-size: 1.2rem; letter-spacing: 0px; } .alignleft, .alignright { display: block; float: none; width: 100%; max-width: 100% !important; margin: 0 0 20px; } ul, ol { margin: 0 0 1.5em 0.5em; } .shortcode-quote { padding: 7% 8% 15%; text-align: center; } .shortcode-cta { font-size: 1.2rem; line-height: 1.6rem; padding: 15px 6%; } .shortcode-address, .shortcode-phone, .shortcode-fax, .shortcode-email, .shortcode-time, .shortcode-facebook, .shortcode-instagram, .shortcode-shop { font-size: 1rem; } .shortcode-columns { columns: 1; } section#services-posts { text-align: center; } ul#post-page-loop.services-posts li, ul#post-page-loop.page-service-extras li { width: 100%; } ul#post-page-loop.services-posts li:nth-child(odd), ul#post-page-loop.services-posts li:nth-child(even) { margin-right: 0 !important; } body.single-project #project-details { display: block; } body.single-project #project-details div { width: 100%; padding: 20px; margin-bottom: 10px; } body.single-project #project-details div strong { margin-bottom: 0px; } .gform_wrapper.gravity-theme .gfield.gf_list_inline .gfield_checkbox .gchoice { display: block; } .gform_wrapper.gravity-theme .customradio .gchoice { float: none; width: 100%; margin-right: 0; } #secondary { text-align: center; display: block; } .widget ul { } .widget { width: 100%; margin-right: 0; } .site-footer { padding: 60px 0px 80px; } .site-quote section:first-of-type h5 { font-size: 1.3rem; letter-spacing: 0px; } .site-info section.footer-left .footer-logo { width: 75%; } .site-info section.footer-left div { margin-bottom: 17px; } .site-info section.footer-left .ftr-hia { width: 130px; } .site-info section.footer-right ul { margin-bottom: 20px; display: block; } .site-info section.footer-right ul li { width: 100%; padding: 0 0 20px; } #back-top span { width: 40px; height: 40px; } } /* Woocommerce Specific Styles */ @media only screen and ( max-width: 768px ) { table.shop_table_responsive tr:first-of-type { display: block !important; } table.shop_table_responsive tr.woocommerce-cart-form__cart-item { border-bottom: 1px solid #ccc; display: block; float: left; width: 100%; margin-bottom: 20px; } table.shop_table_responsive tr td { display: inline-block !important; float: left !important; text-align: left !important; clear: none !important; } table.shop_table_responsive tr td::before { content: '' !important; } table.shop_table_responsive tr td.product-remove { width: 10% !important; } table.shop_table_responsive tr td.product-thumbnail { width: 18% !important; padding: 10px !important; } table.shop_table_responsive tr td.product-name { width: 50% !important; line-height: 1.5rem; } table.shop_table_responsive tr td.product-name .variation { margin: 5px 0 0 !important; } table.shop_table_responsive tr td.product-name .variation-Colours, table.shop_table_responsive tr td.product-name .variation-Colours p { margin: 0 0 !important; } table.shop_table_responsive tr td.product-quantity { width: 20% !important; } table.shop_table_responsive tr td.product-quantity input { width: 100% !important; padding: 6px !important; } table.shop_table_responsive tr td.product-price, table.shop_table_responsive tr td.product-subtotal { display: none !important; width: 0 !important; } table.shop_table_responsive tr td.actions, table.shop_table_responsive tr td.actions input, table.shop_table_responsive tr td.actions .button { float: none; width: 100%; display: block !important; } .cart_totals th { display: block; width: 100%; } /* End Woocommerce Styles */ /********************************* [ RESPONSIVE STYLES ] *********************************/