/*
Theme Name: Zectron
Theme URI: https://www.zectron.com.au/
Author: Zectron Web & IT Services
Author URI: https://www.zectron.com.au/
Description: Custom theme for Zectron Web & IT Services, the managed IT, cyber security and web services provider based in Norwest, Sydney. Built on Bootstrap 5 with Advanced Custom Fields page templates, a mobile-first header and off-canvas menu, local SEO page layouts and LiteSpeed Cache compatibility. Version 2 merges the former zectron-it parent theme (based on Twenty Twenty-One) and the zectron-it-child theme into one standalone theme.
Version: 2.1.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 8.0
License: Proprietary
License URI: https://www.zectron.com.au/terms/
Text Domain: zectron
Tags: custom, business, bootstrap, custom-logo, custom-menu, featured-images
*/
/* Mukta font now loaded non-blocking from header.php */
/*-----Header-Css-----*/
/*header {float: left;width: 100%;position: absolute;z-index: 999;}
header .header-logo {float: left;width: 100%;padding-top: 10px;padding-bottom: 10px;}
header .header-logo img {float: left;}
header .header-menu {float: left;width: 100%;padding-top: 30px;}
header ul#menu-main_menu {list-style: none;float: right;}
header ul#menu-main_menu li {float: left;padding-left: 18px;font-family: Mukta;font-style: normal;font-weight: 600;font-size: 20px;}
header ul#menu-main_menu li a {color: #fff;text-decoration: none;}
header .row {border-bottom: 2px solid #fff;}
header ul#menu-main_menu li#menu-item-80 a {border: 1px solid;padding: 2px 10px;}
header ul#menu-main_menu {list-style: none;float: right;padding: 0;margin: 0;}
header #wp-megamenu-primary {padding-right: 0;padding-left: 0;}
header ul#menu-main_menu li {float: left;padding-left: 18px;font-family: Mukta;font-style: normal;font-weight: 600;font-size: 20px;}
header ul#menu-main_menu li a {color: #fff;text-decoration: none;font-size: 17px;letter-spacing: 1px;font-weight: 500;font-family: "Poppins";}
header ul#menu-main_menu button.sub-menu-toggle {display: none;}
.wp-megamenu-wrap .wpmm-nav-wrap > ul > li > a, 
.wp-megamenu-wrap .wpmm-nav-wrap > ul > li .wpmm-search-wrap > a.search-open-icon{padding: 0;}
header ul#menu-main_menu li ul li {margin: 3px;padding: 0px;text-transform: uppercase;}
header ul#menu-main_menu li ul li i {color: #ff5556;}
header .wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_dropdown_menu ul.wp-megamenu-sub-menu li > a {padding: 0px 1px;}
header ul#menu-main_menu li a:hover,header ul#menu-main_menu li ul li a:hover {color:#429CBD !important;}
header .wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_dropdown_menu > ul.wp-megamenu-sub-menu li a:hover, header .wp-megamenu-wrap .wpmm-nav-wrap > ul.wp-megamenu > li.wpmm_mega_menu ul.wp-megamenu-sub-menu li a:hover{color:#ff5556 !important;}
div#wpmm-strees-row-81 > ul > li > ul >li {float: left;width: 30%;}
div#wpmm-strees-row-81 > ul > li > ul >li >ul{float: left;width: 100%;}
div#wpmm-strees-row-81 > ul > li > ul >li > ul > li {float: left;width: 100%;text-align: center;border: 1px solid #75a100;background: #fff;}
div#wpmm-strees-row-81 > ul {position: absolute;left: -280px;}
div#wpmm-strees-row-81 > ul > li{width: 990px;position: relative;}
ul.wp-megamenu-sub-menu {position: absolute;z-index: 99;}*/
/*-----Home-banner-Css-----*/
.home-page-banner {float: left;width: 100%;position: relative;z-index: 1;}
.home-page-banner .hone-banner {float: left;width: 100%;padding: 0;}
.home-page-banner .hone-banner img {float: left;width: 100%;}
.extera-banner {position: absolute;width: 100%;background: linear-gradient(270deg, #75A100 0%, #429CBD 100%);-webkit-clip-path: polygon(100% 3%, 0 100%, 100% 100%);clip-path: polygon(45% 51%, 100% 21%, 100% 100%, 0 100%, 0 79%);top: 400px;z-index: 99;height: 190px;float: left;}
div#scroll_down {float: left;width: 100%;text-align: center;position: absolute;top: 140px;z-index: 99;}
div#scroll_down img.down_image {-webkit-animation: mover 1s infinite alternate;animation: mover 1s infinite alternate;}
div#scroll_down img {width: 40px;height: 40px;}
/*-----our-solutions-Css-----*/   
.our-solutions {float: left;width: 100%;text-align: center;padding: 80px 0;}
.common-title {font-family: Mukta;font-style: normal;font-weight: bold;font-size: 40px;float: left;width: 100%;color: #000;}
.common-text {font-family: Mukta;font-style: normal;font-weight: 500;font-size: 20px;line-height: 35px;float: left;width: 100%;padding: 20px 0;}
.our-solutions div#white-img {display: none;} 
.our-solutions-inner img {width: 35px;height: 35px;}
.our-solutions-inner:hover div#black-img{display: none;}
.our-solutions-inner:hover div#white-img{display:block;}
div#white-img {background: #429CBD;padding: 13px 10px;border-radius: 100%;margin: 0 auto;width: 63px;border: 1px solid #429CBD;}
.our-solutions #black-img {padding: 13px 10px;border: 1px solid #429CBD;border-radius: 1000%;width: 63px;margin: 0 auto;}
.our-solutions-inner {float: left;width: 100%;padding-bottom: 20px;}
.our-solutions .our-solutions-title {float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: bold;font-size: 30px;}
.our-solutions .our-solutions-content {float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: 500;font-size: 20px;}
.why-choose-us {float: left;width: 100%;text-align: center;padding: 50px;background:#e9f7f9;color: #000;}
.get-in-touch {float: left;width: 100%;}
.get-in-touch a {background: linear-gradient(270deg, #75A100 0%, #429CBD 100%);color: #fff;font-size: 22px;text-transform: uppercase;text-decoration: none;padding: 12px 22px;border: 2px solid;}
.our-partners {float: left;width: 100%;text-align: center;padding-top: 50px;}
.our-partners-image {float: left;width: 100%;padding: 20px 0;}
.our-partners-image img{float: left;width: 100%;}
.our-partners .owl-nav {display: none;}
.our-partners button.owl-dot span {padding: 3px 11px !important;border-radius: unset !important;}
.our-partners button.owl-dot.active span {background: #75a100 !important;}
/*.extera-banner-second {position: static;width: 100%;background: linear-gradient(270deg, #75A100 0%, #429CBD 100%);-webkit-clip-path: polygon(100% 3%, 0 100%, 100% 100%);z-index: 99;float: left;clip-path: polygon(0 18%, 100% 60%, 100% 100%, 0% 100%);height: 200px;}*/
.portfolio-banner-title {width: 100%;color: #000;padding-top: 74px;font-size: 22px;font-family: Mukta;font-style: normal;font-weight: bold;}
.portfolio-banner-text{font-family: Mukta;font-style: normal;font-weight: bold;font-size: 40px;color: #000;width: 100%;}
.portfolio {width: 100%;padding: 60px 0;}
.portfolio .portfolio-content-head {float: right;width: 100%;text-align: right;padding: 20px 0;}
.portfolio .portfolio-main-block {float: left;width: 100%;text-align: center;}
.portfolio .portfolio-block-inner {width: 100%;}
.portfolio .portfolio-inner {
   
    padding: 30px;
    background: linear-gradient( 
178deg, #75a100 0%, #429cbd 100%) !important;
    border: 1px solid #fff;
}
/*.portfolio .portfolio-image {float: left;width: 100%;padding: 20px;}*/
.portfolio .portfolio-title {font-family: Mukta;font-style: normal;font-weight: 600;
    font-size: 20px;line-height: 20px; padding: 20px 0;}
.portfolio select.controls {background-color: #C4C4C4;font-size: 18px;color: #000;border: none;padding: 4px;outline: none;}
.view-portfolio-link {width: 100%;text-align: center;padding-top: 50px;}
.view-portfolio-link a.red-btn {font-size: 20px;text-transform: uppercase;text-decoration: none;padding: 10px 10px;background: linear-gradient(270deg, #75A100 0%, #429CBD 100%);color: #fff;}
.about-us-home {float: left;width: 100%;background: linear-gradient(90deg, #F0FFF9 0%, #FFF5F0 100%);padding: 20px 0;}
.about-us-home .about-us-home-logo{text-align: center;float: left;width: 100%;padding: 30px 0;}
.about-us-home .about-us-home-title{float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: 600;font-size: 38px;}
.about-us-home .about-us-home-address{float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: 500;font-size: 20px;padding: 10px 0;color: #545454;}
.about-us-home .about-us-home-contact{float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: 500;font-size: 20px; margin-bottom: 20px;}
.about-us-home-contact span {float: left;width: 100%;font-weight: 600;font-size: 30px;color: #000;padding-top: 20px;}
.about-us-home-contact a {color: #545454;text-decoration: none;}
.about-us-home .view-portfolio-link {text-align: left;}
.about-us-home-content {float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: normal;font-size: 18px;color: #545454;}
.about-us-home-content h5{color: #000;}
.contact-us-home {float: left;width: 100%;background-position: 100% 100%;background-repeat: no-repeat;background-size: cover;height: auto;}
#myelement::before {content: "";position: absolute;width: 200%;height: 200%;top: -50%;left: -50%;z-index: -1;background: url(background.png) 0 0 repeat;transform: rotate(30deg);}
.contact-us-left-image {float: left;width: 100%;max-height: 460px;}
.contact-us-left-image img#black-img {float: left;width: 100%;height: auto;padding-top: 50px;}
.contact-us-left {float: left;width: 100%;position: relative;z-index: 99;top: -330px;color: #fff;padding: 71px;text-align: center;}
.contact-us-left-title {font-family: Mukta;font-style: normal;font-weight: 500;font-size: 22px;float: left;width: 100%;padding: 10px 0;}
.contact-us-left-text {float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: 500;font-size: 16px;}
.contact-us-form-title {float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: bold;font-size: 40px;}
.contact-us-form {float: left;width: 100%;height: auto;}
.contact-us-form form.wpcf7-form.init {float: left;width: 100%;}
.contact-us-form form.wpcf7-form.init span {float: left;width: 100%;}
.contact-us-form input.wpcf7-form-control,.contact-us-form textarea.wpcf7-form-control {float: left;width: 100%;background: no-repeat;border-left: 8px solid #75A100;padding: 7px 6px;margin: 10px 0;}
.contact-us-form textarea.wpcf7-form-control {height: 100px;}
.contact-us-form label {font-style: normal;font-weight: 600;font-size: 22px;}
.contact-us-form input.wpcf7-form-control.wpcf7-submit {font-size: 20px;text-transform: uppercase;text-decoration: none;padding: 10px 10px;background: linear-gradient(270deg, #75A100 0%, #429CBD 100%);color: #fff;width: 24%;display: table;margin: 0 auto;float: none;border: none;}
.contact-us-form label b {color: red;}
/*.portfolio-overlay .magnify-icon {opacity: 0;position: absolute;top: 32px;right: -15px;border-radius: 50%;width: 78px;height: 78px;margin: 2px;background: #fff;font-size: 11px;text-transform: uppercase;line-height: 78px;letter-spacing: 0;-webkit-box-shadow: 0 0 5px 0 rgb(0 0 0 / 20%);-moz-box-shadow: 0 0 5px 0 rgba(0,0,0,.2);box-shadow: 0 0 5px 0 rgb(0 0 0 / 20%);font-weight: 500;font-family: 'Montserrat',sans-serif;transition: all 0.1s linear 0.1s;}*/
/*.portfolio-overlay .magnify-web {opacity: 0; position: absolute;top: 127px;right: 5px;border-radius: 50%;width: 78px;height: 78px;margin: 2px;background: #fff;font-size: 11px;text-transform: uppercase;line-height: 78px;letter-spacing: 0;-webkit-box-shadow: 0 0 5px 0 rgb(0 0 0 / 20%);-moz-box-shadow: 0 0 5px 0 rgba(0,0,0,.2);box-shadow: 0 0 5px 0 rgb(0 0 0 / 20%);font-weight: 500;font-family: 'Montserrat',sans-serif;transition: all 0.1s linear 0.1s;}*/
/*.row .portfolio-inner:hover .magnify-web  {opacity: .99;top: 128px;right: 8px;}*/
/*.portfolio-block-inner {position: relative;margin-bottom: 0;}*/
/*.row .portfolio-inner:hover .magnify-icon {opacity: .99;top: 50px;right: 8px;}*/
/*.portfolio-overlay .magnify-icon a {color: #75A100;text-decoration: none;font-size: 12px;font-weight: 700;}*/
/*.portfolio-overlay .magnify-web a {color: #429CBD;text-decoration: none;font-size: 12px;font-weight: 700;}*/
/*-----Footer-Css-----*/
footer {float: left;width: 100%;background: #000; color: #e2e2e2;}
.footer-logo img {width: 200px !important;display: table;margin: 0 auto;text-align: center;}
.footer-logo {width: 100%;float: left;padding: 20px 0;}
.footer-menu {float: left;width: 100%;padding-bottom: 20px;border-bottom: 2px solid grey;}
.footer-menu ul#menu-footer-menu {list-style: none;display: table;margin: 0 auto;}
.footer-menu ul li {float: left;padding-right: 20px;}
.footer-menu ul li a {text-decoration: none;color: #fff;font-size: 20px;font-family: Mukta;font-style: normal;font-weight: normal;}
.footer-copyright {float: left;color: #fff;font-family: Mukta;font-style: normal;font-size: 18px;padding: 20px 0;}
.footer-Social-main {float: right;padding: 10px 0;}
.social_icons {float: left;}
.footer-Social-main .social_icons i {background: rgba(255, 255, 255, 0.5);margin: 0 5px;border-radius: 1000%;color: #fff;font-size: 17px;}
.footer-Social-main i.fa.fa-instagram {padding: 11px 12px 12px 12px;background: #f09433;background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);}
.footer-Social-main i.fa.fa-linkedin {padding: 11px 12px 12px 12px;background-color: #0073B0;}
.footer-Social-main i.fa.fa-twitter {padding: 11px 12px 12px 11px;background-color: #1DA1F2;}
.footer-Social-main i.fa.fa-facebook {padding: 12px 14px 10px 15px;background: #3b5998;}
.footer-copyright a {color: #75A100;text-decoration: none;font-family: Mukta;font-style: normal;font-size: 18px;}
a:hover {color: unset;}
.about-us-home .about-us-home-address b {
    float: left;
    width: 100%;
    font-weight: 600;
    font-size: 30px;
    color: #000;
    padding-top: 20px;
}
/*-----About-us-Css-----*/
.about-us {float: left;width: 100%;background-position: 100% 100% !important;background-repeat: no-repeat !important;background-size: cover !important;}
.about-us-title {float: left;width: 100%;color: #fff;font-size: 55px;font-weight: 700;text-transform: uppercase;text-align: center;padding-top: 160px; font-family: Mukta;}
.about-us-text {float: left;width: 100%;text-align: center;font-size: 19px;color: #fff;padding-bottom: 110px; font-family: Mukta;}
.about-us-main-text {float: left;width: 100%;color: #000;padding: 50px 0;font-family: Mukta;font-size: 19px;}
.about-us-main-text h2 {text-align: left;font-weight: 600;font-size: 30px;line-height: 40px;padding: 10px 0 20px;color: #75A100;font-family: Mukta;}
.about-us-main-text h1, .about-us-main-text h2, .about-us-main-text h3, .about-us-main-text h4, .about-us-main-text h5, .about-us-main-text h6 {color: #000;padding-bottom: 15px;}
.about-us-main-text strong,.about-us-main-text h1, .about-us-main-text h2, .about-us-main-text h3, .about-us-main-text h4, .about-us-main-text h5, .about-us-main-text h6{color: #68B5B8;}
.about-us-main-text h6{font-size: 21px;}
.about-us-text a {color: #fff;text-decoration: none;}
/*-----Error-Css-----*/
.error-main {float: left;width: 100%;text-align: center;padding-top: 100px;padding-bottom: 50px;}
.error-404 {float: left;width: 100%;font-size: 200px;font-weight: 900;background: linear-gradient(270deg, #75A100 0%, #429CBD 100%);color: #fff;}
.error-main-text {font-family: Mukta;font-style: normal;font-weight: bold;font-size: 50px;float: left;width: 100%;color: #000;padding: 30px 0;}
.error-main a {text-decoration: none;font-size: 24px;border: 1px solid;padding: 9px 18px;color: #429cbd;text-transform: uppercase;}
.thank-you-banner,.thank-you-banner img{float: left;width: 100%;}
/*-----Single-portfolio-Css-----*/
div#inner-page {float: left;width: 100%;padding-top: 50px;}
.portfolio-image {width: 100%;}
.portfolio-image img {width: 100%;
    box-shadow: 0px 0px 7px 5px #17131312;
    box-sizing: border-box;
     background:#fff;}
.port-title {text-align: left;font-weight: 800;font-size: 45px;line-height: 40px;padding: 0px 0 20px;color: #75A100;font-family: Mukta;float: left;width: 100%;}
.port-info {float: left;width: 100%;}
.port-link {float: left;width: 100%;}
.port-link ul {list-style: none;padding: 0;}
.port-link ul li img {width: 165px;height: auto;float: left;}
/*-----Contact-us-Css-----*/
.contact-us {float: left;width: 100%;padding: 50px;}
.contact-form{float: left;width: 100%;padding: 30px 15px 30px 15px;background-color: #ececec;border-radius: 5px;}
.contact-details a {float: left;width: 100%;color: #000;font-size: 20px;text-decoration: none;font-family: "mukta";padding: 10px 0;}
.contact-details i {color: #68b5b8;padding: 0px 7px 0 0;font-size: 18px !important;}
.contact-details span {float: left;width: 100%;font-size: 21px;font-weight: 600;font-family: 'Mukta'; padding: 0px 0 10px 0;color: #75A100;}
.contact-form input.wpcf7-form-control.wpcf7-submit {float: left;width: 100%;max-width: 176px;height: 43px;font-size: 20px;padding: 0;border: unset;border-radius: unset; margin: 2px 0 20px 0;border-radius: 5px;background: #85ab20;color: #fff; height:100%;}
.contact-details {float: left;width: 100%;padding: 62px 62px 69px 77px;background-color: #ececec;border-radius: 5px; height:100%;}
textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {width: 100%;font-size: 18px;margin: 0px;padding: 20px 20px;display: inline-block;border: 1px solid #dddddd;color: #000000;letter-spacing: 1px;transition-delay: 0s;transition-duration: 0.8s;transition-timing-function: ease-in-out;outline: none;box-shadow: none;margin: 8px 0;height: 35px;font-family: Mukta;}
textarea {height: 100px;}
.contact-address {float: left;width: 100%;text-align: center;padding: 25px 0;}
.contact-address-inner {float: left;width: 100%;}
.contact-address .address_icon i {width: 50px;height: 50px;line-height: 50px !important;text-align: center;background-color: #ececec;border-radius: 5px;font-size: 20px !important;color: #85ab20;}
.contact-address .address_title {float: left;width: 100%;font-weight: 600;font-size: 30px;color: #68b5b8; padding-top: 20px;text-align: center;}
.contact-address .address_text {float: left;width: 100%;font-family: Mukta;font-style: normal;font-weight: 500;font-size: 20px;padding: 10px 0;color: #545454;}
.contact-address  .address_text a{text-decoration: none;color: #545454;}
.google_map {float: left;width: 100%;}
.google_map iframe {height: 450px;}
.our-partners-image img {
    float: left;
    width: auto !important;
}
/*-----Responsive-Css-----*/
@media only screen and (min-width: 1477px){.extera-banner {display: none;}}
@media only screen and (max-width: 1476px){.extera-banner {top: 452px;}}
@media only screen and (max-width: 1385px){.extera-banner {top: 412px;}}
@media only screen and (max-width: 1293px){.extera-banner {top: 372px;}}
@media screen and (max-width: 1199px) and (min-width: 993px){ 
.container, .container-lg, .container-md, .container-sm{max-width: 90% !important;}  
}
@media screen and (max-width: 1199px) and (min-width: 992px){ 
.contact-us-left {padding: 74px 49px 71px 49px;}
.contact-us-left-title {font-size: 18px;}
.contact-us-left-text {font-size: 15px;}
.contact-details {padding: 59px 43px 69px 30px;}
}
@media only screen and (max-width: 1199px){
header ul#menu-main_menu li {padding-left: 12px;}
div#wpmm-strees-row-81 > ul {position: absolute;left: -320px;}
div#wpmm-strees-row-81 > ul > li {width: 926px;position: relative;}
.wp-megamenu-wrap .wpmm-nav-wrap > ul > li.wpmm-strees-row > .wpmm-strees-row-container > ul.wp-megamenu-sub-menu::after {right: 0;}
.extera-banner {top: 353px;}
}
@media only screen and (max-width: 1156px){.extera-banner {top: 314px;}}
@media only screen and (max-width: 1066px){.extera-banner {top: 274px;}}
@media only screen and (max-width: 991px) {
div#wpmm-strees-row-81 > ul > li {width: auto;position: unset;}
div#wpmm-strees-row-81 > ul {position: unset;}
div#wpmm-strees-row-81 > ul > li > ul >li >ul {width: 100%;padding: 0px 10px;}
div#wpmm-strees-row-81 > ul > li > ul >li {width: 100%;}
header ul#menu-main_menu li {padding-left: 0px;padding-right: 10px;}
div#wpmm-strees-row-81 > ul > li > ul >li > ul > li {text-align: left;}
.wp-megamenu-wrap.wpmm-mobile-menu .wpmm-nav-wrap>ul>li>a {padding: 7px 10px;}
#wp-megamenu-primary>.wpmm-nav-wrap ul.wp-megamenu>li ul.wp-megamenu-sub-menu li a {padding: 9px;padding-bottom: 3px;font-weight: 500 !important;}
ul.wp-megamenu-sub-menu li a:before {content: ' \2013'; margin-right: 10px;}
header ul#menu-main_menu {padding: 10px;}
#wp-megamenu-primary.wp-megamenu-wrap.wpmm-mobile-menu>.wpmm-nav-wrap ul.wp-megamenu>li>a {border: 1px solid green;margin-bottom: 5px;}
a.wpmm_mobile_menu_btn.show-close-icon {text-decoration: none;}
.portfolio-banner-text {font-size: 37px;}
.our-solutions {padding: 45px 0;}
.contact-us-form-title {font-size: 34px;text-align: center;}
.contact-details {margin-top: 15px;}
}
@media only screen and (max-width: 979px) {
.extera-banner {display: none;}
.about-us-home .about-us-home-title {font-size: 29px;}
}
@media only screen and (max-width: 768px) {
.common-title {font-size: 33px;}
}
@media only screen and (max-width: 767px) {
header .header-menu {float: right;width: 100%;padding-top: 0;position: relative;top: -41px;}
.portfolio-banner-title {padding-top: 88px;}
.portfolio-banner-text {font-size: 33px;}
.about-us-home .about-us-home-title,.about-us-home .about-us-home-address,.about-us-home .about-us-home-contact,.about-us-home .about-us-home-contact {text-align: center;}
.about-us-home .view-portfolio-link {text-align: center;padding-bottom: 40px;}
.footer-copyright {text-align: center;float: left;width: 100%;}
.footer-Social-main {float: none;display: table;margin: 0 auto;}
header .row {height: 95px;}
.portfolio .portfolio-image {padding: 44px;}
.port-title {font-weight: 600;font-size: 42px;padding: 10px 0 20px;text-align: center;}
.port-link {float: none;width: auto;display: table;margin: 0 auto;}
.about-us-text {padding-bottom: 50px;}
.about-us-title {font-size: 50px;font-weight: 600;}
}
@media only screen and (max-width: 600px) {
.contact-details {padding: 62px 16px 69px 39px;}
}
@media only screen and (max-width: 576px) {
header .header-logo {padding-top: 0;padding-bottom: 0;}
header .row {height: 75px;}
.extera-banner-second {position: unset;clip-path: unset;height: auto;padding: 20px 0;}
.portfolio-banner-title {padding-top: 0;text-align: center;}
.portfolio-banner-text {font-size: 30px;text-align: center;}
.why-choose-us {padding: 4px;}
.contact-us-left {padding: 58px 60px 71px 63px;}
.contact-us-left-text {font-size: 15px;}
.portfolio .portfolio-image {padding: 20px;}
.about-us-title {font-size: 40px;}
.contact-us {padding: 50px 0;}
.error-404 {font-size: 143px;}
.error-main-text {font-size: 40px;}
}
@media only screen and (max-width: 480px) {
header .header-logo img {width: 60%;height: auto;padding-top: 10px;}
header .row {height: 80px;}
.common-title {font-size: 26px;}
.portfolio-banner-text {font-size: 25px;text-align: center;}
.contact-us-left-image img#black-img{display: none;}
.contact-us-left {padding: 58px 0px 0px 0px;color: #000;position: unset;}
.contact-us-left-image {max-height: unset;}
.footer-menu ul li {padding-right: 14px;}
.contact-us-form input.wpcf7-form-control.wpcf7-submit {width: 40%;}
.contact-us-home {padding: 0;}
.common-text {line-height: normal;}
}
@media only screen and (max-width: 360px) {}
@media only screen and (max-width: 320px) {}


/*vatsal css*/
.header-top {padding: 10px;}
.header-top .contact-info li, .header-top .social li {
    display: inline-block;
}
.header-top .contact-info li:not(:last-child) {
    padding-right: 30px;
}
.header-top .contact-info i {
    padding-right: 5px;
}
.header-top .social li:not(:last-child) {
    padding-right: 10px;
}
.social a {
    color: #000;
}
.header-bottom {background: linear-gradient(90deg, #F0FFF9 0%, #FFF5F0 100%); padding: 20px;}
.custom-logo {    width: 100%;
    display: block;
    height: auto;}
.sub-menu-toggle {display: none;}
.mobile-menu {display: none;}
.header-menu ul {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
    display: flex;
}
.header-menu ul li a {font-size: 18px; font-weight: 600; color: #424242; padding: 5px 10px; text-decoration: none;}
.header-menu ul li a:hover{color: #75A100;}
.header-menu ul li ul {display: none;columns: 2;}

.header-menu ul li:hover ul {
    display: block;
    position: absolute;
    background-color: #fff;
    z-index: 999;
    top: 115px;
}
.header-menu ul li ul li {padding: 5px;border-bottom: 1px solid #cdced685;}
.header-menu .sub-menu::before {
    content: ' ';
    background: transparent;
    width: 30px;
    height: 20px;
    position: absolute;
    z-index: 3;
    bottom: 100%;
    left: 10px;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #fff;
}
.header-fixed .header-menu ul li:hover ul {top: 70px;}
.header-menu ul li.current-menu-item a{color: #75A100;}

.btn-grid
{background: linear-gradient(270deg, #75A100 0%, #429CBD 100%);
    color: #fff;
    font-size: 18px;
    text-transform: 
    uppercase;text-decoration: none;
    padding: 12px 22px;
    border-radius: 10px;}
footer {padding-top: 50px; padding-bottom: 30px;}
.footer-inner {    border-top: 1px solid;
    margin-top: 30px;}
.footer-Social-main .social {display: inline-flex;
    gap: 10px;}
.footer-Social-main .social a {color: #fff;}
footer .widget-title {font-size: 20px; font-weight: 600px;}
footer ul {padding: 0;
    list-style: none;}
footer ul li {padding: 5px 0;display: flex;gap:5px;}    
footer a {text-decoration: none; color: #fff;}
footer a:hover {color: #75A100;}
footer .subscribe-form {position: relative;}
footer .subscribe-form .email {padding: 19px 146px 19px 20px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    border: none;
    color: #fff;
    width: 100%;
    height: 60px;}
footer .subscribe-form .zt-cat {
    background: #fff;
    color: #75A100;
    border: 1px solid transparent;
    position: absolute;
    right: 0;
    padding: 15px 23px;
    top: 10px;
    border-radius: 5px;
}

.header-fixed {
    position: fixed;
    width: 100%;
    z-index: 999;
    top: 0;
    left: 0;
    animation: smoothScroll .9s forwards;
}
@keyframes smoothScroll {
    0% {
        top: -80px;
    }

    100% {
        top: 0;
    }
}
.header-fixed .header-top {
    display: none !important;
}

.hero-content h1 {font-size: 56px; font-weight: 700;
text-transform: capitalize;
}
.hero-content p {font-size: 20px; padding: 10px 0;
text-transform: capitalize;
}
.hero-content .hero-btns {
    
}
.hero-content .hero-btns {
    margin-bottom: 30px;
}
.our-solutions-inner {
    float: left;
    width: 100%;    
    /* padding-bottom: 20px; */
    box-shadow: 0px 4px 20px rgb(8 41 19 / 31%);
    border-radius: 8px;
    background-color: #fff;
    margin-bottom: 20px;
    padding: 20px;
    height: 280px;
    overflow: hidden;
}
.our-solutions .our-solutions-title {
    float: left;
    width: 100%;
    font-family: Mukta;
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    padding: 10px 0;
}
.our-solutions .our-solutions-content {
    float: left;
    width: 100%;
    font-family: Mukta;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
}
.our-solutions-btn a {text-decoration: none; font-size: 16px; color: #429cbd;padding: 10px 0;}
.a-underline {
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0 2px;
    transition: background-size .3s;
}

.a-underline:hover,
.a-underline:focus {
    background-size: 99.7% 2px;
}
.our-solutions .common-title h1 {font-weight: 700;}
.overlay-bg {background-color: #000000;}
.contact-us-left {    top: -370px;color: #fff;}
.contact-us-form-title,.contact-us-form {color: #fff;}
.about-box-bg {
    padding: 40px;
    background-color: #fff;
    border-radius: 20px;
    float: left;
    box-shadow: 0px 4px 10px rgb(8 41 19 / 31%);

}
.about-us-home-content h2, .about-us-home-content h3 {color: #000;}
.why-choose-us .wcu-content {text-align: left;}
.why-choose-us .wcu-content h4 {text-transform: uppercase; font-size: 20px; color: #429cbd;}
.why-choose-us .wcu-content h2 {font-weight: 700; font-size: 30px;}
a {color: #429cbd;}

.extera-banner-second{text-align: center;}
.portfolio-banner-title {
    text-transform: uppercase;
    font-size: 20px;
    color: #429cbd;}
.portfolio-banner-text {font-weight: 700;}
.portfolio .portfolio-inner {background: unset !important;}
.portfolio .portfolio-block-inner{ 
    background: linear-gradient(270deg, #75A100 0%, #429CBD 100%);
    box-shadow: 0px 0px 10px 2px #1713131c;
    box-sizing: border-box;
    border-radius: 4px;
    margin-top: -24px;
    z-index: 3;
    position: relative;}
.portfolio .portfolio-title h5 {font-size: 22px;
    font-weight: bold; color: #fff;}
.portfolio .portfolio-links {    display: flex;
    justify-content: center;
    padding-bottom: 20px;
    gap: 20px;}
.portfolio .portfolio-links a{font-size: 18px;
    text-transform: uppercase;
    font-weight: 600;
    color: #fff;
    text-decoration: none;}
.portfolio .portfolio-image img{box-shadow: 0px 0px 10px 2px #1713131c;transition: all 0.5s ease 0s;}
.portfolio .portfolio-image img:hover{transition: all 0.2s ease-in 0s;transform: scale(1.1);transition: all 1s ease 0s;}
/*.portfolio .portfolio-image:after{background-color: #000;}
.portfolio .portfolio-image img:hover .portfolio-image:after{opacity: 0.06;}*/
.contact-us-form input.wpcf7-form-control, .contact-us-form textarea.wpcf7-form-control {border-left: 8px solid #429cbd;}
.our-partners button.owl-dot.active span{background: #429cbd !important;}
.mobile-menu ul {list-style: none;}
.mobile-menu ul li a{ text-decoration:none; }
.mobile-menu .mega-menu a:after{content: "\f107";
    right: -22px;
    top: -1px;
    font-size: 13px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #429cbd;
}
.mobile-menu ul li ul {display: none;}
.mobile-menu ul li:hover ul {display: block; position: sticky;}

.mobile-menu ul li.mega-menu ul li a:after{display: none;}
.footer-copyright a {
    color: #429cbd;
}
.home-page-banner {padding: 50px 0; background: #e9f7f9;}

/*==================== Preloader ================= */

#preloader {
    background: #fff;
    z-index: 999999;
    transition: opacity 2s;
    -webkit-transition: opacity 2s;
    -moz-transition: opacity 2s;
    -ms-transition: opacity 2s;
    -o-transition: opacity 2s;
}

.ctn-preloader {
    align-items: center;
    -webkit-align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    -webkit-justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    z-index: 999999;
    background: #ffffff;
    transition: opacity 2s;
    -webkit-transition: opacity 2s;
    -moz-transition: opacity 2s;
    -ms-transition: opacity 2s;
    -o-transition: opacity 2s;
}

.ctn-preloader .animation-preloader {
    position: absolute;
    z-index: 999999;
}

.ctn-preloader .animation-preloader .spinner {
    animation: spinner 1.5s infinite linear;
    border-radius: 50%;
    border: 3px solid rgb(101 92 151 / 6%);
    border-top-color: #429cbd;
    border-bottom-color: #429cbd;
    height: 170px;
    margin: 0 auto 45px auto;
    width: 170px;
    -webkit-animation: spinner 1.5s infinite linear;
}

.ctn-preloader .animation-preloader .txt-loading {
    text-align: center;
    user-select: none;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:before {
    animation: letters-loading 4s infinite;
    color: #429cbd;
    content: attr(data-text-preloader);
    left: 0;
    opacity: 0;
    top: 0;
    line-height: 70px;
    position: absolute;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading {
    font-weight: 700;
    letter-spacing: 15px;
    display: inline-block;
    color: rgba(88, 97, 224, 0.14);
    position: relative;
    font-size: 70px;
    line-height: 70px;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(2):before {
    animation-delay: 0.2s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(3):before {
    animation-delay: 0.4s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(4):before {
    animation-delay: 0.6s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(5):before {
    animation-delay: 0.8s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(6):before {
    animation-delay: 1s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(7):before {
    animation-delay: 1.2s;
}

.ctn-preloader .animation-preloader .txt-loading .letters-loading:nth-child(8):before {
    animation-delay: 1.4s;
}

.ctn-preloader .loader-section {
    background-color: #ffffff;
    height: 100%;
    position: fixed;
    top: 0;
    width: calc(50% + 1px);
}

.loaded .animation-preloader {
    opacity: 0;
    transition: 0.3s ease-out;
    -webkit-transition: 0.3s ease-out;
    -moz-transition: 0.3s ease-out;
    -ms-transition: 0.3s ease-out;
    -o-transition: 0.3s ease-out;
}

@keyframes spinner {
    to {
        transform: rotateZ(360deg);
        -webkit-transform: rotateZ(360deg);
        -moz-transform: rotateZ(360deg);
        -ms-transform: rotateZ(360deg);
        -o-transform: rotateZ(360deg);
    }
}

@keyframes letters-loading {

    0%,
    75%,
    100% {
        opacity: 0;
        transform: rotateY(-90deg);
        -webkit-transform: rotateY(-90deg);
        -moz-transform: rotateY(-90deg);
        -ms-transform: rotateY(-90deg);
        -o-transform: rotateY(-90deg);
    }

    25%,
    50% {
        opacity: 1;
        transform: rotateY(0deg);
        -webkit-transform: rotateY(0deg);
        -moz-transform: rotateY(0deg);
        -ms-transform: rotateY(0deg);
        -o-transform: rotateY(0deg);
    }
}

@media screen and (max-width: 767px) {
    .ctn-preloader .animation-preloader .spinner {
        height: 8em;
        width: 8em;
    }
}

@media screen and (max-width: 500px) {
    .ctn-preloader .animation-preloader .spinner {
        height: 7em;
        width: 7em;
    }

    .ctn-preloader .animation-preloader .txt-loading .letters-loading {
        font-size: 40px;
        letter-spacing: 10px;
    }
}
/* end preloder */


/*responsive css */
@media (min-width: 0px) and (max-width: 767px){
.mobile-menu {display: flex;}
.about-box-bg {margin-bottom: 20px;}
.portfolio-banner-title {margin-top: 30px;}
.why-choose-us {
    padding: 20px;
    float: unset;
}
.hero-content h1 {
    font-size: 44px;}
.portfolio .portfolio-image {
    padding: 0;}
    .logo img {height: 50px;}
}

@media (min-width: 768px) and (max-width: 991px){
.mobile-menu {display: flex;}
.hero-content h1 {
    font-size: 44px;}
}

@media (min-width: 992px) and (max-width: 1199px){
.mobile-menu {display: none;}
.our-solutions-inner {height: 330px;}
.contact-us-left {top: -330px;}
}

/* Homepage: switching IT provider card (replaces laptop image) */
.contact-us-left-image #black-img{display:none!important}
.contact-us-left-image .contact-us-left{position:static!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;margin:0!important;width:100%!important;height:auto!important;max-width:none!important;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:32px 30px!important;text-align:left!important}
.contact-us-left .contact-us-left-title{font-size:28px;line-height:1.25;text-align:left!important;margin-bottom:6px}
.contact-us-left + br, .contact-us-left br{display:none}
.contact-us-left-text{text-align:left!important;font-size:16px;line-height:1.6}
.contact-us-left-text p{margin:0 0 14px}
ol.zt-switch-steps{list-style:none;counter-reset:zs;padding:0;margin:0 0 16px}
ol.zt-switch-steps li{counter-increment:zs;position:relative;padding:0 0 12px 46px;margin:0;text-align:left}
ol.zt-switch-steps li:before{content:counter(zs);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:50%;background:linear-gradient(270deg,#75a100 0%,#429cbd 100%);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center}
.contact-us-left-text a{color:#8fd3ee;font-weight:700}
@media(max-width:767px){.contact-us-left-image .contact-us-left{padding:24px 20px!important}.contact-us-left .contact-us-left-title{font-size:24px}}

/* Blog: cost guide table and checklist callout */
table.zt-cost-table{width:100%;border-collapse:collapse;margin:18px 0 8px;font-size:15px;line-height:1.45}
table.zt-cost-table th{background:linear-gradient(270deg,#75a100 0%,#429cbd 100%);color:#fff;text-align:left;padding:10px 12px;font-weight:700}
table.zt-cost-table td{padding:10px 12px;border-bottom:1px solid #dfe7ec;vertical-align:top}
table.zt-cost-table tr:nth-child(even) td{background:#f4f9fb}
table.zt-cost-table td:nth-child(2){font-weight:700;color:#1e6e8c;white-space:nowrap}
@media(max-width:767px){table.zt-cost-table{display:block;overflow-x:auto}table.zt-cost-table td:nth-child(2){white-space:normal}}
p.zt-checklist-callout{background:#eef6f9;border-left:4px solid #75a100;border-radius:8px;padding:14px 18px;margin:22px 0}
