/*
!!! Utitlity classes
*/
#main {margin-top: 0px;}
.wpcf7-form-control {width: 100%;border: none;border-bottom: 1px solid #eee;background: transparent;padding: 10px !important;margin-bottom: 10px;}
.wpcf7-form-control:focus {outline: none;}
.secondary-bg{background-color: var(--secondary-color);}
.primary-bg{background-color: var(--primary-color);}
.secondary-button, .wpcf7-submit { background-color: var(--primary-color); display: flex; max-width: 350px; justify-content: center; align-items: center; padding: 15px !important; color: var(--gray-color); font-size: 16px; letter-spacing: 1px; text-transform: uppercase; border: 2px solid var(--secondary-color); cursor: pointer; transition:all .3s ease-in; -webkit-transition:all .3s ease-in; -moz-transition:all .3s ease-in; -ms-transition:all .3s ease-in; -o-transition:all .3s ease-in; }
.secondary-button:hover, .wpcf7-submit:hover { background-color: var(--secondary-color); color: var(--gray-color); }
.wp-block-button__link.wp-element-button {border: none !important;padding: 12px 30px !important;}
.gray-color{color:var(--gray-color)}
.gray-bg{background-color: var(--gray-color)}
.bg-light{background-color: #fff !important;}
.primary-font{color:var(--primary-color)}
.secondary-font{color:var(--secondary-color)}
h1{font-size:3rem;font-weight: 400;line-height: 3rem;}
h2{font-size:2rem;font-weight: 400;line-height: 2rem;}
h3{font-size:1.4rem;font-weight: 400;line-height: 1.5rem;}
h4{font-size:1.2rem;font-weight: 400;line-height: 1.2rem;}
h5{font-size:1.1rem;line-height: 1.2em; font-weight: 400;}
h6{font-size: 1rem;font-weight: 400}
.swiper-slide{padding:10px}
.min-60 {min-height: 60vh;}
.font-4xl{font-size:3.5rem;font-weight: 600;line-height: 3.5rem;}
.font-3xl{font-size:3rem;font-weight: 400;line-height: 3rem;}
.font-2xl{font-size:2rem;font-weight: 400;line-height: 2rem;}
.font-1xl{font-size:1.4rem;font-weight: 400;line-height: 1.5rem;}
.font-xl{font-size:1.2rem;font-weight: 400;line-height: 1.2rem;}
.font-lg{font-size:1rem;line-height: 1.2em; font-weight: bold;}
.font-sm{font-size:15px;}
.shadow-lg{box-shadow: 2px 2px 8px rgba(0,0,0,.2);}
.padding-3xl{padding:150px 0px}
.padding-2xl{padding:100px 0px}
.padding-xl{padding:50px 0px}
.padding-bottom{padding-bottom:50px}
.padding-l{padding:20px 0px}
.padding-sm{padding:5px 0px}
.padding-10{padding:10px}
.padding-20{padding:20px}
.padding-30{padding:30px}
.rounded-md{ border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; }
.rounded-2xl{ border-radius:15px ; -webkit-border-radius:15px ; -moz-border-radius:15px ; -ms-border-radius:15px ; -o-border-radius:15px ; }
.spacer {height: 20px;}
.rotate-90 {transform: rotate(90deg);}
.rotate-45 { transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); }
.cursor-pointer{cursor: pointer;}
.contact-form p {margin-bottom: 0px;}
.nav-heading a {display: flex;margin-top: 10px;width: 100%;justify-content: center;align-items: center;padding: 7px;font-size: 20px;background: var(--gray-color);color: #000;border-radius: 10px;}
.dropdown-toggle::after {display:none !important}
.dropdown-toggle i {font-size: 13px;position: relative;left: 2px;font-weight: bold;}
/* Hide the submenu initially */
.dropdown-nav {background-color: #fff;position: absolute;display: block;opacity: 0;visibility: hidden;transform: translateY(40px);-webkit-transform: translateY(40px);-moz-transform: translateY(40px);-ms-transform: translateY(40px);-o-transform: translateY(40px);transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;list-style: none;padding: 10px;margin: 0;min-width: 250px;box-shadow: 2px 2px 8px rgba(0,0,0,.1);
}

/* Show submenu on hover with smooth transition */
.dropdown:hover .dropdown-nav {display: block;opacity: 1;visibility: visible;transform: translateY(10px);-webkit-transform: translateY(10px);-moz-transform: translateY(10px);-ms-transform: translateY(10px);-o-transform: translateY(10px);}
.dropdown-level { position: absolute; left: 100%; top: 0; transform: translateY(40px) !important; opacity: 0 !important; visibility: hidden !important; -webkit-transform: translateY(40px) !important; -moz-transform: translateY(40px) !important; -ms-transform: translateY(40px) !important; -o-transform: translateY(40px) !important; transition: all .3s ease-in-out; list-style: none; padding: 10px; margin: 0; min-width: 250px; box-shadow: 2px 2px 8px rgba(0,0,0,.1);  }
.dropdown-nav .dropdown:hover .dropdown-level {transform: translateY(0px) !important;opacity: 1 !important;visibility: visible !important;-webkit-transform: translateY(0px) !important;-moz-transform: translateY(0px) !important;-ms-transform: translateY(0px) !important;-o-transform: translateY(0px) !important;background-color: #fff;}
.nav-link,.dropdown-item {font-size: 16px;color: #000;}
.dropdown-nav li, .dropdown-level li  {padding: 5px 10px !important;}
.dropdown-item:focus, .dropdown-item:hover{background-color:transparent !important}
.dropdown-nav .dropdown a::after {content: '\F285';font-family: bootstrap-icons !important;position: absolute;right: 0;font-size: 14px;top: 4px;}
.dropdown-nav .dropdown a {position: relative;}
.dropdown-level li a:after{content:'' !important}
.navbar-brand img {max-width: 105px;}
#toggle-nav{display: none}
.fixed-nav {position: fixed !important;width: 100%;top: 0px;left: 0;z-index: 9999;}
#header {padding: 2px 0px;position: relative;}
#navbar {width: 70%;}
#navbar .navbar-nav {width: 100%;display: flex;justify-content: center;align-items: center;}
.nav-mega-menu { position: absolute; width: 100%; background: #fff; left: 0; top: 70px; visibility: hidden; opacity: 0; transform: translateY(30px); transition: all .3s ease-in; -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -ms-transition: all .3s ease-in; -o-transition: all .3s ease-in; }
.portal-nav:hover .nav-mega-menu{visibility: visible;opacity: 1;transform: translateY(0px);-webkit-transform: translateY(0px);-moz-transform: translateY(0px);-ms-transform: translateY(0px);-o-transform: translateY(0px);}
#side-nav{display: none;}
.selected-language {font-size: 18px;background: var(--primary-color);width: 70px;text-align: center;color: #fff;padding: 5px;cursor: pointer;height:40px; justify-content: center; align-items: center;display: flex;}
.language-selector {position: relative;}
.language-list { position: absolute; background: var(--primary-color); width: 70px; cursor: pointer; margin-top: 6px; opacity: 0; visibility: hidden; transition: all .3s ease-in; -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -ms-transition: all .3s ease-in; -o-transition: all .3s ease-in; }
.language-item {font-size: 20px;color: #fff;text-align: center;padding: 5px 0px;cursor: pointer;}
.show-language-list {opacity: 1 !important;visibility: visible !important;}
.selected-language::after {font-family: bootstrap-icons !important;content: '\F282';font-size: 14px;position: relative;left: 10px;top: 1px;}
#nav-container {z-index: 9999;}
.nav-item-container {display: grid;grid-template-columns: 1fr 1fr 1fr 1fr 1fr;gap: 10px;}
.container-item img {width: 100%;}
.container-item {transition: all .3s ease-in;cursor: pointer;}
.container-item:hover { box-shadow: 0px 0px 10px rgba(0,0,0,.1);}
.nav-title h4 {font-size: 18px;text-align: center;padding: 10px 0px;}
.nav-title a {color: #000;}

/*
!!! Mobile NAV
*/
   

/*
!!! Top Navigation
*/
.contact-information { display: grid; grid-template-columns: 1fr 1fr ; gap: 10px; grid-template-rows: 1fr; transition: all .3s ease-in; -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -ms-transition: all .3s ease-in; -o-transition: all .3s ease-in; }
.info h5 {font-size: 15px;margin-bottom: 1px;}
.info h4 {font-size: 14px;}
.info-icon {background: var(--primary-color);color: #fff;width: 30px;height: 30px;}
.info a {color: #000;}
.top-navigation { padding: 4px 0px; border-bottom: 1px solid #000; }
.info {position: relative;top: 3px;}
.hidden-top-navigation .contact-information{grid-template-rows: 0;overflow: hidden;}
.hidden-top-navigation{padding: 0px; border-bottom: none;}
.page-breadcrumb {list-style: none;padding: 0;display: flex;gap: 10px;font-size: 14px;margin: 0;}
/*
!!! Footer
*/
.footer-section {padding: 0px 30px;}
.footer-section p {color: #fff;}
.copyright {padding: 20px 10px;background: #f7f7f7;}
.footer-section h4 {color: #fff;}
.footer-section ul {list-style: none;margin: 0;padding: 0;}
.footer-section ul li a {color: #fff;font-size: 18px;position: relative;left: 20px;}
.footer-section ul li {margin: 10px 0px;}
.footer-section ul li a::before {content: '\F138';font-family: bootstrap-icons !important;position: relative;left: -10px;top: 3px;}
.footer-icon {width: 50px;height: 50px;background: #fff;font-size: 25px;display: flex;justify-content: center;align-items: center;border-radius: 2px;}
.footer-contact {margin: 15px 0px;}
.footer-contact-info {font-size: 17px;width: 70%;color: #fff;}
.social-media {display: flex;flex-wrap: wrap;gap: 10px;align-items: center;}
.media-link a {display: flex;width: 50px;height: 50px;background: var(--gray-color);justify-content: center;align-items: center;color: var(--primary-color);font-size: 22px;border-radius: 5px;transition: all .3s ease-in;}
/*
!!! Page Header
*/

/*
!!! Home Page
*/
#home-swiper .swiper-slide {padding: 0px;}
.slide-container-mobile {display: none;}
.slide-container {height: 90vh;background-size: cover !important;background-position: center !important;display: flex;align-items: end;text-align: center;width: 100%;position: relative;}
.overlay {position: absolute;width: 100%;height: 100%;left: 0;top: 0;background: rgba(0,0,0,.2);}
.swiper-button-next::after {content: '\F144';font-family: bootstrap-icons !important;font-size: 24px;color: #fff;}
.swiper-button-prev::after {content: '\F13F';font-family: bootstrap-icons !important;font-size: 24px;color: #fff;}
.swiper-button-prev, .swiper-button-next {background: var(--secondary-color);width: 60px;height: 60px;display: flex;justify-content: center;align-items: center;}    
.box-container {position: relative;top: -150px;max-width: 750px;margin: 0px auto;}

.box-container h2 { transform: translateY(15px); opacity: 0; transition: all .20s cubic-bezier(0.75, 0.26, 1, 0.68); -webkit-transform: translateY(15px); -moz-transform: translateY(15px); -ms-transform: translateY(15px); -o-transform: translateY(15px); -webkit-transition: all .20s cubic-bezier(0.75, 0.26, 1, 0.68); -moz-transition: all .20s cubic-bezier(0.75, 0.26, 1, 0.68); -ms-transition: all .20s cubic-bezier(0.75, 0.26, 1, 0.68); -o-transition: all .20s cubic-bezier(0.75, 0.26, 1, 0.68); line-height:60px}
.swiper-slide-active .box-container h2 { transform: translateY(0px); opacity: 1;}

.box-container p { transform: translateY(25px); opacity: 0; transition: all .25s cubic-bezier(0.75, 0.26, 1, 0.68); -webkit-transform: translateY(25px); -moz-transform: translateY(25px); -ms-transform: translateY(25px); -o-transform: translateY(25px); -webkit-transition: all .25s cubic-bezier(0.75, 0.26, 1, 0.68); -moz-transition: all .25s cubic-bezier(0.75, 0.26, 1, 0.68); -ms-transition: all .25s cubic-bezier(0.75, 0.26, 1, 0.68); -o-transition: all .25s cubic-bezier(0.75, 0.26, 1, 0.68); }
.swiper-slide-active .box-container p { transform: translateY(0px); opacity: 1;}

.box-container .btn-container { transform: translateY(45px); opacity: 0; transition: all .30s ease-in; -webkit-transform: translateY(45px); -moz-transform: translateY(45px); -ms-transform: translateY(45px); -o-transform: translateY(45px); -webkit-transition: all .30s ease-in; -moz-transition: all .30s ease-in; -ms-transition: all .30s ease-in; -o-transition: all .30s ease-in; }
.swiper-slide-active .btn-container { transform: translateY(10px); opacity: 1; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); }
.bg-image-settings {background-size: cover !important;background-position: center !important;}

.window-container {display: grid;grid-template-columns: 1fr 1fr 1fr 1fr;gap: 20px;}
.window-container-item { box-shadow: 0px 0px 10px rgba(0,0,0,.1); transition: all .3s ease-in; -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -ms-transition: all .3s ease-in; -o-transition: all .3s ease-in; position: relative; border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; overflow: hidden}
.window-container-item .window-link {position: absolute;bottom: 15px;left: 20px;display: flex;gap: 20px;align-items: center;color:#000}
.window-link i {position: relative;top: 1px;}
.swiper-pagination-bullet {width: 20px;height: 20px;background: var(--primary-color);}
.swiper-pagination-bullet.swiper-pagination-bullet-active {background: var(--secondary-color);}
.review-image {width: 70px;height: 70px;background: var(--secondary-color);color: var(--gray-color);font-size: 2rem;display: flex;justify-content: center;align-items: center;font-weight: 600;border-radius: 5px;margin-bottom: 20px;}

.qoute-container{padding:40px; padding-bottom: 10px;}
.reason{ border-radius:5px ; -webkit-border-radius:5px ; -moz-border-radius:5px ; -ms-border-radius:5px ; -o-border-radius:5px ; background: #fff;}
.reason p {margin-bottom: 0px;}
.reason h3 {display: flex;gap: 16px;}
.reason h3 span {font-size: 15px;position: relative;top: 2px;}
.reason h3 span::after {content: '.';}
.cate-container {position: relative; overflow: hidden;}
.cate-desciption {position: absolute;bottom: 0;padding: 25px;text-align: center;color: #fff;}
.cate-desciption a { display: flex; width: 230px; background: var(--primary-color); justify-content: center; align-items: center; margin: 0px auto; padding: 15px; color: #fff; text-transform: uppercase; border: 2px solid var(--secondary-color); transition: all .3s ease-in; -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -ms-transition: all .3s ease-in; -o-transition: all .3s ease-in; }
.cate-desciption a:hover{background-color: var(--secondary-color);} 
.header-image, .header-no-image {height: 300px;padding: 10px;display: flex;justify-content: center;align-items: end;padding: 20px;position: relative;}
.header-content {text-align: center;max-width: 700px;margin: 0px auto;}
.windows-container {display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 30px;}

.contact-list-container ul {list-style: none;padding: 0;}
.contact-list-container ul li {display: flex;gap: 20px;margin-bottom: 20px;align-items: center;}
.contact-icon {width: 55px;height: 55px;background: var(--primary-color);display: flex;justify-content: center;align-items: center;font-size: 25px;color: var(--gray-color);}
.contact-list-content p {margin-bottom: 0;}
textarea {height: 150px;}
.store-location{padding-top: 30px;}
.store-location iframe {width: 100%;height: 500px;border-radius: 20px;}
.page-content .wp-block-list {padding: 10px 20px;}
.page-content ul li, .page-content ol li  {padding: 5px !important;}

/*Post*/
.post-title {font-size: 22px;margin-bottom: 0;}
.post-title a {color: var(--font-color);}
.post-meta span, .post-meta a {font-size: 13px;color: var(--secondary-color);}
.post-data {font-size: 15px;color: var(--font-color);padding: 10px 0px;}
.post-date {color: var(--font-color);padding: 10px 0px;}
.post-thumbnail {height: 240px;overflow: hidden;border-radius: 5px;}
.posted-on {font-size: 15px;color: var(--font-color);}
.author-data {display: flex;gap: 18px;align-items: center;}
.author-data p { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 400; transition:all .3s ease-in; -webkit-transition:all .3s ease-in; -moz-transition:all .3s ease-in; -ms-transition:all .3s ease-in; -o-transition:all .3s ease-in; }
.author-data p:hover{color:var(--primary-color)}
.posted-on {font-size: 15px;color: var(--font-color);}
.straight-line {height: 14px;width: 1px;background: var(--primary-color);position: relative; top:-8px}
.post-thumbnail-single {margin-bottom: 20px;}
.wp-block-latest-posts li {display: flex !important;gap: 10px;align-items: center;margin-bottom: 12px;}
.wp-block-latest-posts__featured-image img {width: 130px;border-radius: 6px;height: 110px;object-fit: cover;}
.wp-block-latest-posts__featured-image {width: 30%;}
.wp-block-latest-posts__post-title {width: 70%;color: var(--secondary-color);font-size: 1.25rem;}
.wp-block-heading {font-size: 26px;margin: 13px 0px;font-weight: 400;}
.dotted-line {border-bottom: 1px dashed var(--secondary-color);margin: 60px 0px;}
.with-grid {display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 20px;}
.with-grid p {display: flex;gap: 10px;align-items: center;justify-content: flex-start;color: var(--secondary-color);}
.footer-section h4{font-size: 24px;}
.image-container {margin-bottom: 25px;}
@media (max-width: 767px) {
    .top-navigation {display: none;}
    .font-3xl{font-size: 2rem;line-height: 2rem;}
    .slide-container-mobile {height: 80vh;width: 100%;background-size: cover !important;background-position: center !important;display: flex;align-items: end;text-align: center;width: 100%;position: relative;}
    .slide-container {display: none;}
    .navbar-brand img {width: 85px;}
    #side-nav{display: block}
    #navbar {display: none !important;}
    #toggle-nav {background: var(--primary-color);color: #fff;border: none;width: 40px;height: 40px;font-size: 24px;display: flex;justify-content: center;align-items: center;}
    #header{padding:5px 0px}
    #side-nav {position: fixed;top: 0;height: 100vh;width: 330px;background: #fff;left: -340px;transition: all .3s ease-in;z-index:9999;box-shadow: 2px 0px 10px rgba(0,0,0,.1);}
    .show-nav{left:0px !important}
    .close-btn-container{position: relative;}
    #close-nav {width: 40px;height: 40px;display: flex;justify-content: center;align-items: center;background: var(--primary-color);position: absolute;right: 10px;top: 10px;color:#fff;cursor: pointer;}
    .mobile-nav {margin-top: 70px;padding: 10px 40px;}
    .mobile-nav a,.mobile-nav p { color: #000; display: flex; font-size: 15px; margin-bottom: 10px; transition: all .3s ease-in; -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -ms-transition: all .3s ease-in; -o-transition: all .3s ease-in; }
    
    .parent-element i, .submenu-parent i { font-size: 13px; transition:all .3s ease-in ; -webkit-transition:all .3s ease-in ; -moz-transition:all .3s ease-in ; -ms-transition:all .3s ease-in ; -o-transition:all .3s ease-in ; }
    .child-content a {display: flex;gap: 10px;align-items: center;transition: all .3s ease-in;background: #f7f7f7;min-height: 45px;padding-left: 5px;}
    .child-content a img {width: 40px;height: 40px;}
    .child-content a:hover{background: #f7f7f7 !important;}
    .parent-element,.submenu-parent{margin-bottom:0px;display: flex;justify-content: space-between;align-items: center;color:#000;font-size: 17px;margin-bottom: 10px;};
    
    .box-container{width: 90%;margin:0px auto;top:-50px}
    .padding-2xl {padding: 50px 0px;}
    .section-image-container {margin-bottom: 20px;}
    .padding-3xl {padding: 30px}
    .windows-container{grid-template-columns:1fr 1fr;padding:10px}
    .page-content {padding: 0px 10px;}
}
@media (max-width: 585px) {
    .wp-block-heading{font-size: 24px;}
    .header-image, .header-no-image{height:200px}
    .container {padding: 0px 12px;}
    #nav-container{width: 96%;margin:0px auto}
    .with-grid{grid-template-columns:1fr 1fr}
    .windows-container{grid-template-columns:1fr}
    .font-2xl {font-size: 1.4rem;line-height: 1.5rem !important;}
    .header-content p {font-size: 14px;}
    .font-3xl {font-size: 1.7rem;}  
    .container.protal-pro-container {
        padding: 0px;
    }  
}