/*
Theme Name: Chronos Technology
Author: 
Description: Your description goes here
Version: 1.0
Template: hello-elementor

This is the child theme for Hello Elementor theme, generated with Generate Child Theme plugin by catchthemes.

(optional values you can add: Theme URI, Author URI, License, License URI, Tags, Text Domain)
*/

/*========================== COMMON DETAILS START ==========================*/

.overflow-hidden{
    overflow: hidden !important;
}

.common-details>*:last-child{
    margin-bottom: 0 !important;
}
.common-details p:last-child {
    margin-bottom: 0;
}


.common-details h1,
.common-details h2,
.common-details h3,
.common-details h4,
.common-details h5,
.common-details h6 {
    margin-bottom: 20px;
    margin-top: 0;
}


.common-details ul,
.common-details ol {
    margin-bottom: 20px;
}


.common-details ul li,
.common-details ol li {
    margin-bottom: 15px;
}
.common-icon-box:hover{
    cursor: pointer;
}
.common-icon-box .elementor-icon-box-title{
    margin-top: 0;
}
.common-icon-box .elementor-icon-box-icon{
    background-image: linear-gradient(270deg, #7FCBF2 0%, #2487D8 100%);
    border-radius: 16px;
    width: fit-content !important;
    padding: 1px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    -ms-border-radius: 16px;
    -o-border-radius: 16px;
}
.common-icon-box .elementor-icon-box-icon .elementor-icon{
    position: relative;
    overflow: hidden;
    transition: background 0.5s ease-in-out !important;
    -webkit-transition: background 0.5s ease-in-out !important;
    -moz-transition: background 0.5s ease-in-out !important;
    -ms-transition: background 0.5s ease-in-out !important;
    -o-transition: background 0.5s ease-in-out !important;
}
.common-icon-box .elementor-icon-box-icon .elementor-icon svg{
    z-index: 2 !important;
}
.common-icon-box:hover .elementor-icon-box-icon .elementor-icon{
    background: transparent !important;
}
.common-icon-box .elementor-icon-box-icon .elementor-icon::after{
    content: '' !important;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 16px !important;
    -webkit-border-radius: 16px !important;
    -moz-border-radius: 16px !important;
    -ms-border-radius: 16px !important;
    -o-border-radius: 16px !important;
    background: linear-gradient(270deg, #7FCBF2 0%, #2487D8 100%);
    transform: translate(100%,100%);
    -webkit-transform: translate(100%,100%);
    -moz-transform: translate(100%,100%);
    -ms-transform: translate(100%,100%);
    -o-transform: translate(100%,100%);
    transition: transform 0.5s ease-in-out !important;
    -webkit-transition: transform 0.5s ease-in-out !important;
    -moz-transition: transform 0.5s ease-in-out !important;
    -ms-transition: transform 0.5s ease-in-out !important;
    -o-transition: transform 0.5s ease-in-out !important;
    z-index: 1 !important;
}
.common-icon-box:hover .elementor-icon-box-icon .elementor-icon::after{
    transform: translate(0);
    -webkit-transform: translate(0);
    -moz-transform: translate(0);
    -ms-transform: translate(0);
    -o-transform: translate(0);
}
/*========================== COMMON DETAILS END ==========================*/

/*========================== HEADER START ==========================*/
.header-menu nav ul li:nth-last-child(2){
    margin-right: 0 !important;
}

.common-btn a{
    background: linear-gradient(270deg, #7FCBF2 0%, #2487D8 100%) no-repeat;
}
.common-btn a:hover{
    background: linear-gradient(90deg, #7FCBF2 0%, #2487D8 100%) no-repeat;
}
.header-main-wrapper.sticky-header{
    box-shadow: 0px 0px 15px 0px black;
}
.header-menu .hfe-nav-menu__toggle .hfe-nav-menu-icon svg{
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.header-menu .hfe-nav-menu__toggle .hfe-nav-menu-icon:hover svg{
    filter: brightness(0) invert(0);
    -webkit-filter: brightness(0) invert(0);
}
.header-menu a.zi-menu-item-clicked,
.header-menu nav li.current-menu-item a{
    color: #757575 !important;
}
.header-menu a.zi-menu-active-first,
.header-menu a.zi-menu-active-first.zi-menu-item-clicked{
    color: #000000 !important;
}

/*========================== HEADER END ==========================*/

/*========================== HERO SECTION START ==========================*/
.hero-banner-img{
    width: 100% !important;
    height: 100% !important;
    mix-blend-mode: plus-lighter;
}
.hero-box-wrapper{
    position: relative !important;
}
.hero-box-wrapper::after{
    content: '' !important;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    bottom: 0;
    background: linear-gradient(270deg, rgba(28, 38, 90, 0) 37.21%, #1C265A 100%) no-repeat !important;
    pointer-events: none !important;
    z-index: 1;
}
/*========================== HERO SECTION END ==========================*/

/*========================== SERVICES SECTION START ==========================*/

.services-icon-box .elementor-icon-box-description,
.services-icon-box .elementor-icon svg{
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}
.services-icon-box:hover .elementor-icon svg{
    filter: brightness(0) invert(1);
    -webkit-filter: brightness(0) invert(1);
}
.services-icon-box:hover .elementor-icon-box-description{
    color: #757575 !important;
}
/*========================== SERVICES SECTION END ==========================*/

/*========================== OUR PROCESS SECTION START ==========================*/
.our-process-main-wrapper{
    mix-blend-mode: lighten;
}
/*========================== OUR PROCESS SECTION END ==========================*/

/*========================== FOOTER START ==========================*/
.footer-menu nav,
.privacy-menu nav{
    width: 100% !important;
}
.footer-menu nav li.current-menu-item a,
.footer-menu nav a.zi-menu-item-clicked{
    color: #C4C4C4 !important;
}
.footer-menu a.zi-menu-active-first,
.footer-menu a.zi-menu-active-first.zi-menu-item-clicked{
    color: #FFFFFF !important;
}

.footer-top-wrapper{
    position: relative !important;
}
.footer-top-wrapper::after{
    content: '' !important;
    position: absolute;
    width: 100%;
    height: 1px;
    background: url('./assets/images/chronos-top-border-img.png') no-repeat !important;
    bottom: 0;
    left: 50% !important;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    background-position: center !important;
    background-size: contain !important;
}
/*========================== FOOTER END ==========================*/

/*========================== MEDIA QUERIES START ==========================*/
@media(min-width: 1367px) and (max-width: 1800px){
    .header-main-wrapper, .common-border-radius{border-bottom-right-radius: 44px !important; border-bottom-left-radius: 44px !important;}
    .common-border-radius{border-top-left-radius: 44px !important;border-top-right-radius: 44px !important;}
    .hero-main-title{max-width: 60% !important; width: 100% !important;}
}
@media(max-width: 1366px){
    .service-item-left-block{width: 60% !important;}
    .service-item-right-block{width: 40% !important;}
}
@media(min-width: 1025px){
    .header-menu nav{ width: fit-content !important; } 
    .header-menu .mobile-menu-item{ display: none; }
}
@media(max-width: 1024px){
    .header-main-inner-wrapper, .header-menu{ position: unset !important; } 
    .header-menu .hfe-nav-menu{align-items: flex-end; width: 30px !important;}
    .header-menu .hfe-nav-menu__toggle{ margin: 0 !important; z-index: 99999 !important;}
    .header-menu .hfe-nav-menu__toggle .hfe-nav-menu-icon{ padding: 0 !important; } 
    .header-menu nav{width: 100vw !important; position: absolute; top: 0 !important; left: 0 !important;right: 0 !important; height: 100vh !important; background: #FFFFFF; justify-content: center !important;}
    .header-menu nav ul.hfe-nav-menu{width: 100% !important; flex-direction: column !important; align-items: center !important; justify-content: center !important;}
    .header-menu nav ul.hfe-nav-menu li{width: fit-content !important;}
    .header-menu nav ul.hfe-nav-menu li:not(:last-child){margin-bottom: 30px;}
    .header-menu .mobile-menu-item a{ background: linear-gradient(270deg, #7FCBF2 0%, #2487D8 100%) no-repeat; color: #FFFFFF !important; border-radius: 16px !important; -webkit-border-radius: 16px !important; -moz-border-radius: 16px !important; -ms-border-radius: 16px !important; -o-border-radius: 16px !important; padding: 11px 20px !important;}
    .header-menu .mobile-menu-item a:hover{ background: linear-gradient(90deg, #7FCBF2 0%, #2487D8 100%) no-repeat !important;}
}
@media(max-width: 575px){
    .common-width-100{width: 100% !important;}
}
@media(max-width: 767px){
    .footer-menu nav ul,.privacy-menu nav ul{flex-direction: column !important; justify-content: center; align-items: center;}
    .footer-menu nav ul li:not(:last-child),.privacy-menu ul li:not(:last-child){margin-bottom: 24px !important;} 
    .hero-box-wrapper::after{background: linear-gradient(360deg, #1C265A 2.03%, rgba(28, 38, 90, 0) 68.24%) !important;}
    .common-icon-box .elementor-icon-box-icon .elementor-icon{background: transparent !important;}
    .common-icon-box .elementor-icon-box-icon .elementor-icon::after{ transform:translate(0) ; -webkit-transform:translate(0) ; -moz-transform:translate(0) ; -ms-transform:translate(0) ; -o-transform:translate(0) ; }
    .services-icon-box .elementor-icon svg{ filter: brightness(0) invert(1); -webkit-filter: brightness(0) invert(1); }
    .service-item-left-block,.service-item-right-block{width: 100% !important;}
}
/*========================== MEDIA QUERIES END ==========================*/