/*
Theme Name: 	   Chrowix
Text Domain: 	   chrowix
Template: 			chromax
Version:            0.2
Tested up to:       6.8
Requires at least:  4.7
Requires PHP:       5.6
Author:             DesertThemes
Author URI:         https://desertthemes.com/
Theme URI:          https://desertthemes.com/themes/chrowix-free/
Description:        Chrowix is lightweight, highly extendable and multi-purpose WordPress Theme. Chrowix is perfect for Startup, IT Solutions, IT Business, Agencies, Marketing, Consulting and Services Company related to any business websites. Chrowix based on in-depth research into IT Solutions, IT Services, IT Business, Consulting & Software, Digital Solution, Technical Engineering, Technology, and Services Company, to deliver all needed layouts and blocks. It will enable you to create almost any type of website with a beautiful & professional design. Chrowix supports popular WordPress plugins such as Elementor, WPML, Polylang, Yoast SEO, WooCommerce, Contact Form 7, Jetpack, and much more. Chrowix Pro demo https://preview.desertthemes.com/pro/chrowix/
Tags:               one-column, two-columns ,right-sidebar, flexible-header, custom-background, custom-header, custom-menu, editor-style, featured-images, footer-widgets, post-formats, theme-options, threaded-comments, translation-ready, full-width-template, custom-logo, blog, e-commerce, portfolio
License: GPLv3 or later
License URI:  https://www.gnu.org/licenses/gpl-3.0.html

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned
with others.
*/

:root {
    --dt-main-rgb: 221, 17, 30;
    --dt-secondary-color: #06416F;
}

/* Header--Five */

.header--five .dt_header-topbar {
    min-height: 5rem;
}

.header--five .dt_header-topbar,
.header--five .dt_header-topbar .dt_header-widget i,
.header--five .dt_header-topbar .contact__body a:hover,
.header--five .dt_header-topbar .contact__body a:focus {
    color: #fff;
}

.header--five .dt-col-2.dt-my-auto {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
}

.header--five .dt_header-navwrapperinner {
    min-height: 6rem;
}

.header--five .dt_navbar-menu {
    margin-bottom: -3rem;
    min-height: 10rem;
    padding: 0px 30px;
    background-color: #fff;
    justify-content: space-between;
}

.header--five .dt_navbar-menu .dt_navbar-nav {
    text-align: start;
}

.header--five .dt_navbar-wrapper.is--sticky.on .dt-col-2 .dt_navbar-right,
.header--five .dt_navbar-wrapper.is--sticky.on .site--logo {
    margin-top: 0;
}

.header--five .dt_navbar-wrapper.is--sticky.on .dt_navbar-menu {
    box-shadow: 0px 24px 64px 0px rgba(199, 206, 218, 0.25);
}

.header--five .dt_header-inner .dt_mobilenav .dt_mobilenav-right .dt_navbar-list-right {
    padding-left: 1.8rem;
    padding-right: 1.8rem;
}

.header--five .dt_header-inner .dt_mobilenav .dt_navbar-info-contact .contact__body .title,
.header--five .dt_header-inner .dt_mobilenav .dt_navbar-info-contact .contact__body .description,
.header--five .dt_header-inner .dt_mobilenav .dt_navbar-user-item .dt_user_btn,
.header--five .dt_header-inner .dt_mobilenav .dt_navbar-cart-item .dt_navbar-cart-icon,
.header--five .dt_header-inner .dt_mobilenav .dt_navbar-search-item button.dt_navbar-search-toggle {
    color: #fff;
}

.header--five .dt_header-inner .dt_mobilenav .hamburger span {
    background-color: #fff;
}

.header--five .dt_navbar-menu .dt_navbar-right .dt_navbar-list-right li.dt_navbar-info-contact {
    position: relative;
    padding-right: 1.8rem;
}

.header--five .dt_navbar-menu .dt_navbar-right .dt_navbar-list-right li.dt_navbar-info-contact:before {
    position: absolute;
    right: 0;
    top: 50%;
    content: "";
    height: 100%;
    width: 1px;
    background: rgba(189, 189, 189, 0.75);
    transform: translateY(-50%);
}

.header--five .dt_navbar-info-contact .contact__list i {
    margin-right: 1.2rem;
}

.header--five .dt_mobilenav {
    background-color: var(--dt-secondary-color);
}

.header--five + .dt_pagetitle .dt_pagetitle_bgimage {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 0;
}

@media only screen and (min-width: 992px) {
    .header--five .dt_header-topbar .dt_header-widget .dt-container {
        max-width: 96%;
    }
    .header--five .site--logo {
        padding-left: 8%;
        margin-top: -2.5rem;
    }
    .header--five .dt-col-2 .dt_navbar-right {
        padding-right: 8%;
        margin-top: -2.5rem;
    }
    .header--five .dt-col-2 .dt_navbar-right .dt_navbar-list-right {
        padding-left: 0;
        justify-content: flex-end;
    }
    .header--five .dt_navbar-right .dt_navbar-list-right .dt-btn {
        white-space: normal;
        padding: 1.2rem 1.6rem;
    }
    .header--five .dt_navbar-wrapper.is--sticky.on::before,
    .header--five::before {
        content: "";
        width: 50%;
        height: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        background-color: var(--dt-main-color);
        clip-path: polygon(0 0, 95% 0, 100% 100%, 0 100%);
        z-index: 0;
    }
    .header--five .dt_navbar-wrapper.is--sticky.on::after,
    .header--five::after {
        content: "";
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0px;
        left: 0px;
        background-color: var(--dt-secondary-color);
        z-index: -1;
    }
    .header--five .dt_navbar-wrapper.is--sticky.on::before {
        z-index: -1;
    }

    .header--five .dt_navbar-wrapper.is--sticky.on::after {
        z-index: -2;
    }
    .header--five .dt-col-2 .dt_navbar-info-contact .contact__body .title,
    .header--five .dt-col-2 .dt_navbar-right .dt_navbar-info-contact .contact__body .description {
        color: #fff;
    }
    .header--five .dt_navbar-menu .dt_navbar-right .dt_navbar-list-right {
        color: var(--dt-secondary-color);
        min-height: 10rem;
        position: relative;
        z-index: 0;
    }
    .header--five .dt_navbar-menu .dt_navbar-right .dt_navbar-list-right:before {
        content: "";
        position: absolute;
        top: 0;
        right: -30px;
        left: -25px;
        bottom: 0;
        background-color: rgba(189, 189, 189, 0.4);
        z-index: -1;
    }
}

@media only screen and (min-width: 1200px) {
    .header--five .site--logo {
        padding-left: 12%;
        margin-top: -2.5rem;
    }
    .header--five .dt-col-2 .dt_navbar-right {
        padding-right: 12%;
        margin-top: -2.5rem;
    }
}

@media only screen and (min-width: 1800px) {
    .header--five .dt_header-topbar .dt_header-widget .dt-container {
        max-width: 67%;
    }
}

/* Information Three */

.dt_slider + .dt_information--three {
    padding-top: 0;
    padding-bottom: 0;
}

.dt_slider + .dt_information--three .particles-js-area {
    margin-top: 7.5rem;
}

.dt_slider + .dt_information--three .dt-row {
    position: relative;
    margin-top: -7rem;
    padding-bottom: 8rem;
}

.dt_information--three .item-inner {
    position: relative;
    background-color: #ffffff;
    box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.15);
    overflow: hidden;
}

.dt_information--three .item-inner .item-image {
    width: 0%;
    height: 100%;
    position: relative;
    position: absolute;
    top: 0px;
    right: 0px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    transition: all 500ms ease;
}

.dt_information--three .item-inner .item-image::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(var(--dt-main-rgb), 0.9);
}

.dt_information--three .item-inner:hover .item-image {
    width: 100%;
    left: 0px;
}

.dt_information--three .item-inner .item-inside {
    position: relative;
    z-index: 1;
}

.dt_information--three .item-inner .item-inside .item-inner-top {
    position: relative;
    display: flex;
    align-items: flex-start;
}

.dt_information--three .item-inner .item-inside .item-inner-top::after {
    content: "";
    width: 100%;
    height: 12px;
    background-color: #F2F2F2;
    position: absolute;
    left: 0px;
    bottom: 0px;
    transition: all 500ms ease;
}

.dt_information--three .item-inner:hover .item-inside .item-inner-top::after {
    background-color: rgba(242, 242, 242, 0.3);
}

.dt_information--three .item-inner .item-inside .item-inner-top .item-icon {
    position: relative;
    width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 50px;
    color: #ffffff;
    background-color: var(--dt-main-color);
    z-index: 1;
    transition: all 500ms ease;
}

.dt_information--three .item-inner:hover .item-inside .item-inner-top .item-icon {
    background-color: #ffffff;
    color: var(--dt-secondary-color);
}

.dt_information--three .item-inner .item-inside .item-inner-top .item-icon::before {
    content: "";
    width: 2px;
    height: 100%;
    background-color: var(--dt-secondary-color);
    position: absolute;
    top: 0px;
    right: 0px;
}

.dt_information--three .item-inner .item-inside .item-inner-top .item-icon::after {
    content: "";
    width: 18px;
    height: 18px;
    font-size: 60px;
    color: #ffffff;
    background-color: var(--dt-secondary-color);
    position: absolute;
    right: -18px;
    bottom: 0px;
    transition: all 500ms ease;
}

.dt_information--three .item-inner .item-inside .item-inner-top .item-icon i {
    transition: all 500ms ease;
}

.dt_information--three .item-inner:hover .item-inside .item-inner-top .item-icon i {
    animation: flipInY 1s ease-in 1;
}

.dt_information--three .item-inner .item-inside .item-inner-top .title {
    position: relative;
    padding: 18px 30px 15px;
    z-index: 1;
    transition: all 500ms ease;
}

.dt_information--three .item-inner:hover .item-inside .item-inner-top .title a,
.dt_information--three .item-inner:hover .item-inside .item-inner-top .title {
    color: #ffffff;
}

.dt_information--three .item-inner .item-inside .item-inner-top .title a {
    transition: all 500ms ease;
}

.dt_information--three .item-inner .item-inside .item-inner-top .title a:hover {
    color: #ffffff;
}

.dt_information--three .item-inner .item-content {
    padding: 25px 35px 35px;
}

.dt_information--three .item-inner .item-content .text {
    transition: all 500ms ease;
}

.dt_information--three .item-inner:hover .item-content .text {
    color: #ffffff;
}

.dt_information--three .item-inner .dt-more {
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    font-size: 20px;
    text-align: center;
    line-height: 50px;
    color: #fff;
    background-color: var(--dt-main-color);
    margin-top: 20px;
    transition: all 500ms ease;
}

.dt_information--three .item-inner .dt-more i {
    display: inline-block;
    transition: all 0.35s ease-in-out;
}

.dt_information--three .item-inner .dt-more:focus i,
.dt_information--three .item-inner .dt-more:hover i {
    transform: rotate(360deg);
}

.dt_information--three .item-inner:hover .dt-more {
    background-color: #ffffff;
    color: var(--dt-secondary-color);
}

@media (max-width: 412px) {
    .dt_information--three .item-inner .item-inside .item-inner-top {
        flex-direction: column;
    }
    .dt_information--three .item-inner .item-inside .item-inner-top::after {
        display: none;
    }
    .dt_information--three .item-inner .item-inside .item-inner-top .title {
        width: 100%;
        padding-top: 30px;
        padding-bottom: 0px;
    }
    .dt_information--three .item-inner .item-content {
        padding: 20px 30px 30px;
    }
}

/* Information Four */

.dt_information--four .item-inner {
    background-color: #ffffff;
    border: 1px solid rgba(189, 189, 189, 0.4);
}

.dt_information--four .item-inner .item-image {
    position: relative;
    display: block;
    overflow: hidden;
}

.dt_information--four .item-inner .item-image img {
    width: 100%;
    display: block;
    object-fit: cover;
}

.dt_information--four .item-inner .item-image img:nth-child(2) {
    width: 0;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
    object-fit: cover;
    transition: 800ms;
}

.dt_information--four .item-inner:hover .item-image img:nth-child(2) {
    width: 100%;
    visibility: visible;
}

.dt_information--four .item-content {
    position: relative;
    padding: 0px 30px 22px;
    z-index: 1;
}

.dt_information--four .item-content .item-inner-top {
    margin-bottom: 30px;
    position: relative;
    width: calc(100% - 30px);
    min-height: 86px;
    padding: 17px 30px 17px 80px;
    background-color: var(--dt-main-color);
    transition: all 500ms ease;
}

.dt_information--four .item-content .item-inner-top::before {
    content: "";
    width: 31px;
    height: 100%;
    position: absolute;
    top: 0px;
    left: -31px;
    background-color: var(--dt-main-color);
    transition: all 500ms ease;
}

.dt_information--four .item-inner:hover .item-inner-top,
.dt_information--four .item-inner:hover .item-inner-top::before {
    background-color: var(--dt-secondary-color);
}

.dt_information--four .item-content .item-inner-top::after {
    content: "";
    width: 1px;
    height: 9px;
    position: absolute;
    left: 0px;
    bottom: -9px;
    background-color: var(--dt-secondary-color);
    transition: all 500ms ease;
}

.dt_information--four .item-inner:hover .item-inner-top::after {
    background-color: var(--dt-main-color);
}

.dt_information--four .item-inner .item-icon {
    width: 60px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0px;
    bottom: 0px;
    background-color: #fff;
}

.dt_information--four .item-inner .item-inner-top .item-icon i {
    font-size: 34px;
    transition: all 500ms ease;
}

.dt_information--four .item-inner:hover .item-inner-top .item-icon i {
    animation: flipInY 1s ease-in 1;
}

.dt_information--four .item-inner .item-inner-top .title a,
.dt_information--four .item-inner .item-inner-top .title {
    color: #ffffff;
}

.dt_information--four .item-inner .shape {
    width: calc(100% + 19px);
    height: 1px;
    position: relative;
    position: absolute;
    left: 0px;
    bottom: -9px;
    background-color: var(--dt-secondary-color);
}

.dt_information--four .item-inner .shape::before,
.dt_information--four .item-inner .shape::after {
    content: "";
    width: 9px;
    height: 9px;
    position: absolute;
    right: 0px;
    transition: all 500ms ease;
}

.dt_information--four .item-inner .shape::before {
    top: -22px;
    background-color: rgba(189, 189, 189, 0.2);
}

.dt_information--four .item-inner .shape::after {
    top: -9px;
    background-color: var(--dt-secondary-color);
}

.dt_information--four .item-inner:hover .shape,
.dt_information--four .item-inner:hover .shape::after {
    background-color: var(--dt-main-color);
}

.dt_information--four .item-inner .dt-more {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0px;
    right: 0px;
    font-size: 20px;
    color: #fff;
    background-color: var(--dt-secondary-color);
    text-decoration: none;
    overflow: hidden;
    transition: all 500ms ease;
}

.dt_information--four .item-inner:hover .dt-more {
    transform: translateY(-60px);
}

.dt_information--four .item-inner .dt-more:hover {
    background-color: var(--dt-main-color);
}

.dt_information--four .item-inner .dt-more:hover i {
    animation: dt_slideRight 500ms;
}

@keyframes dt_slideRight {
    49% {
        transform: translateX(100%);
    }
    50% {
        opacity: 0;
        transform: translateX(-100%);
    }
    51% {
        opacity: 1;
    }
}

@media (max-width: 390px) {
    .dt_information--four .item-content {
        padding: 0px 20px 12px;
    }
    .dt_information--four .item-content .item-inner-top {
        padding-left: 0px;
        padding-right: 20px;
    }
    .dt_information--four .item-content .item-inner-top::before {
        width: 21px;
        left: -21px;
    }
    .dt_information--four .item-inner .item-icon {
        margin-bottom: 20px;
        position: static;
    }
    .dt_information--four .item-inner .dt-more {
        width: 50px;
        height: 50px;
    }
}

/* Slider */

.header--five + #content .dt_slider--two .dt_slider-content .subtitle {
    padding: 8px 13px;
    font-size: 16px;
    color: var(--dt-main-color);
    font-weight: 600;
    text-transform: capitalize;
    line-height: 1.5;
    background-color: #ffffff;
}

.header--five + #content .dt_slider--two .dt_slider-content .subtitle::before,
.header--five + #content .dt_slider--two .dt_slider-content .subtitle::after {
    display: none;
}

.header--five + #content .dt_slider--two .dt_slider-content {
    position: relative;
    z-index: 1;
}

.header--five + #content .dt_slider--two .dt-text-left .dt_slider-content {
    padding-left: 44px;
}

.header--five + #content .dt_slider--two .dt-text-right .dt_slider-content {
    padding-right: 44px;
}

.header--five + #content .dt_slider--two .dt_slider-content::before {
    content: "";
    width: 50px;
    height: 2px;
    position: absolute;
    top: 20px;
    background-color: #ffffff;
    z-index: -1;
    opacity: 0;
}

.header--five + #content .dt_slider--two .dt-text-left .dt_slider-content::before {
    left: 0px;
}

.header--five + #content .dt_slider--two .dt-text-right .dt_slider-content::before {
    right: 0px;
}

.header--five + #content .dt_slider--two .dt_slider-content::after {
    content: "";
    width: 2px;
    height: calc(100% - 25px);
    position: absolute;
    top: 20px;
    background: linear-gradient(9180deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255, 0) 50%);
    z-index: -1;
    opacity: 0;
}

.header--five + #content .dt_slider--two .dt-text-left .dt_slider-content::after {
    left: 0px;
}

.header--five + #content .dt_slider--two .dt-text-right .dt_slider-content::after {
    right: 0px;
}

.header--five + #content .dt_slider--two .active .dt_slider-content::before,
.header--five + #content .dt_slider--two .active .dt_slider-content::after {
    opacity: 1;
    transition: 1.3s cubic-bezier(0.5, 0.5, 0, 1);
}

.header--five + #content .dt_slider--two .dt-text-center .dt_slider-content::before,
.header--five + #content .dt_slider--two .dt-text-center .dt_slider-content::after {
    display: none;
}

@media (max-width: 767px) {
    .header--five + #content .dt_slider--two .dt-text-left .dt_slider-content,
    .header--five + #content .dt_slider--two .dt-text-right .dt_slider-content {
        padding: 0;
    }
    .header--five + #content .dt_slider--two .dt_slider-content::before,
    .header--five + #content .dt_slider--two .dt_slider-content::after {
        display: none;
    }
}