* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*::before,
*::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* Global Styles */
:root {
    --black: black;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
}

a {
    margin: 0;
    text-decoration: none;
    -o-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

ul {
    margin-bottom: 0;
}

ul li {
    list-style-type: none;
}

figure {
    margin: 0;
}

img {
    margin: 0;
    vertical-align: middle;
}

a,
input,
button,
select,
textarea {
    margin: 0;
    outline: none;
    box-shadow: none;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
    box-shadow: none;
}

/* .container {
    max-width: 1300px;
    width: 95%;
    margin: 0 auto;
} */


/*====================== Template css ======================*/
.ht_ctc_chat_greetings_box :not(ul):not(ol):not(.ht_ctc_default):not(.ht_ctc_defaults *):not(.iti *) {
    padding: 0;
    margin: 0;
    box-sizing: border-box
}

.ht_ctc_chat_greetings_box ul,
.ht_ctc_chat_greetings_box ol {
    margin-top: 0;
    margin-bottom: 0
}

.ctc_g_content,
.ctc_g_sentbutton,
.ctc_g_bottom {
    margin-top: -.9px !important
}

.ctc_g_content {
    max-height: calc(80vh - 140px);
    overflow-y: auto
}

.greetings_header_image img {
    object-fit: cover
}

.greetings_header_image {
    position: relative;
    display: inline-block
}

.g_header_badge_online {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    width: 12px;
    height: 12px;
    border-radius: 50%
}

@media only screen and (max-width: 420px) {
    .ctc_side_positions .ctc_m_p_left {
        right: unset !important;
        left: 0 !important
    }

    .ctc_side_positions .ctc_m_p_right {
        left: unset !important;
        right: 0 !important
    }

    .ctc_side_positions .ctc_m_p_left .ctc_greetings_close_btn {
        float: left !important
    }

    .ctc_side_positions .ctc_m_p_right .ctc_greetings_close_btn {
        float: right !important
    }

    .ctc_side_positions .ctc_m_cta_order_0 {
        order: 0 !important
    }

    .ctc_side_positions .ctc_m_cta_order_1 {
        order: 1 !important
    }

    .ht_ctc_greetings.ctc_m_full_width {
        position: fixed !important;
        bottom: 0 !important;
        right: 0 !important
    }

    .ht_ctc_greetings.ctc_m_full_width .ht_ctc_chat_greetings_box {
        position: unset !important;
        margin: 7px !important;
        min-width: 80vw !important;
        width: calc(100vw - 14px) !important
    }

    .ctc_m_full_width .ctc_g_message_box_width {
        max-width: 85% !important
    }

    .ht_ctc_animation:has(.ht_ctc_greetings) {
        animation-fill-mode: none !important
    }
}

@media only screen and (min-width: 900px) {
    .ctc_g_content::-webkit-scrollbar {
        width: 2.8px
    }

    .ctc_g_content::-webkit-scrollbar-thumb {
        background: #a5a5a5
    }
}




:root {
    --aspect-ratio--square: 1;
    --aspect-ratio--4-3: 4/3;
    --aspect-ratio--3-4: 3/4;
    --aspect-ratio--3-2: 3/2;
    --aspect-ratio--2-3: 2/3;
    --aspect-ratio--16-9: 16/9;
    --aspect-ratio--9-16: 9/16;
    --color--black: #000000;
    --color--cyan-bluish-gray: #abb8c3;
    --color--white: #ffffff;
    --color--pale-pink: #f78da7;
    --color--vivid-red: #cf2e2e;
    --color--luminous-vivid-orange: #ff6900;
    --color--luminous-vivid-amber: #fcb900;
    --color--light-green-cyan: #7bdcb5;
    --color--vivid-green-cyan: #00d084;
    --color--pale-cyan-blue: #8ed1fc;
    --color--vivid-cyan-blue: #0693e3;
    --color--vivid-purple: #9b51e0;
    --gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg, rgba(6, 147, 227, 1) 0%, rgb(155, 81, 224) 100%);
    --gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg, rgb(122, 220, 180) 0%, rgb(0, 208, 130) 100%);
    --gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg, rgba(252, 185, 0, 1) 0%, rgba(255, 105, 0, 1) 100%);
    --gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg, rgba(255, 105, 0, 1) 0%, rgb(207, 46, 46) 100%);
    --gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg, rgb(238, 238, 238) 0%, rgb(169, 184, 195) 100%);
    --gradient--cool-to-warm-spectrum: linear-gradient(135deg, rgb(74, 234, 220) 0%, rgb(151, 120, 209) 20%, rgb(207, 42, 186) 40%, rgb(238, 44, 130) 60%, rgb(251, 105, 98) 80%, rgb(254, 248, 76) 100%);
    --gradient--blush-light-purple: linear-gradient(135deg, rgb(255, 206, 236) 0%, rgb(152, 150, 240) 100%);
    --gradient--blush-bordeaux: linear-gradient(135deg, rgb(254, 205, 165) 0%, rgb(254, 45, 45) 50%, rgb(107, 0, 62) 100%);
    --gradient--luminous-dusk: linear-gradient(135deg, rgb(255, 203, 112) 0%, rgb(199, 81, 192) 50%, rgb(65, 88, 208) 100%);
    --gradient--pale-ocean: linear-gradient(135deg, rgb(255, 245, 203) 0%, rgb(182, 227, 212) 50%, rgb(51, 167, 181) 100%);
    --gradient--electric-grass: linear-gradient(135deg, rgb(202, 248, 128) 0%, rgb(113, 206, 126) 100%);
    --gradient--midnight: linear-gradient(135deg, rgb(2, 3, 129) 0%, rgb(40, 116, 252) 100%);
    --font-size--small: 13px;
    --font-size--medium: 20px;
    --font-size--large: 36px;
    --font-size--x-large: 42px;
    --spacing--20: 0.44rem;
    --spacing--30: 0.67rem;
    --spacing--40: 1rem;
    --spacing--50: 1.5rem;
    --spacing--60: 2.25rem;
    --spacing--70: 3.38rem;
    --spacing--80: 5.06rem;
    --shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);
    --shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);
    --shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);
    --shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);
    --shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);
}

:where(.is-layout-flex) {
    gap: 0.5em;
}

:where(.is-layout-grid) {
    gap: 0.5em;
}

body .is-layout-flex {
    display: flex;
}

.is-layout-flex {
    flex-wrap: wrap;
    align-items: center;
}

.is-layout-flex> :is(*, div) {
    margin: 0;
}

body .is-layout-grid {
    display: grid;
}

.is-layout-grid> :is(*, div) {
    margin: 0;
}

:where(.wp-block-columns.is-layout-flex) {
    gap: 2em;
}

:where(.wp-block-columns.is-layout-grid) {
    gap: 2em;
}

:where(.wp-block-post-template.is-layout-flex) {
    gap: 1.25em;
}

:where(.wp-block-post-template.is-layout-grid) {
    gap: 1.25em;
}

.has-black-color {
    color: var(--color--black) !important;
}

.has-cyan-bluish-gray-color {
    color: var(--color--cyan-bluish-gray) !important;
}

.has-white-color {
    color: var(--color--white) !important;
}

.has-pale-pink-color {
    color: var(--color--pale-pink) !important;
}

.has-vivid-red-color {
    color: var(--color--vivid-red) !important;
}

.has-luminous-vivid-orange-color {
    color: var(--color--luminous-vivid-orange) !important;
}

.has-luminous-vivid-amber-color {
    color: var(--color--luminous-vivid-amber) !important;
}

.has-light-green-cyan-color {
    color: var(--color--light-green-cyan) !important;
}

.has-vivid-green-cyan-color {
    color: var(--color--vivid-green-cyan) !important;
}

.has-pale-cyan-blue-color {
    color: var(--color--pale-cyan-blue) !important;
}

.has-vivid-cyan-blue-color {
    color: var(--color--vivid-cyan-blue) !important;
}

.has-vivid-purple-color {
    color: var(--color--vivid-purple) !important;
}

.has-black-background-color {
    background-color: var(--color--black) !important;
}

.has-cyan-bluish-gray-background-color {
    background-color: var(--color--cyan-bluish-gray) !important;
}

.has-white-background-color {
    background-color: var(--color--white) !important;
}

.has-pale-pink-background-color {
    background-color: var(--color--pale-pink) !important;
}

.has-vivid-red-background-color {
    background-color: var(--color--vivid-red) !important;
}

.has-luminous-vivid-orange-background-color {
    background-color: var(--color--luminous-vivid-orange) !important;
}

.has-luminous-vivid-amber-background-color {
    background-color: var(--color--luminous-vivid-amber) !important;
}

.has-light-green-cyan-background-color {
    background-color: var(--color--light-green-cyan) !important;
}

.has-vivid-green-cyan-background-color {
    background-color: var(--color--vivid-green-cyan) !important;
}

.has-pale-cyan-blue-background-color {
    background-color: var(--color--pale-cyan-blue) !important;
}

.has-vivid-cyan-blue-background-color {
    background-color: var(--color--vivid-cyan-blue) !important;
}

.has-vivid-purple-background-color {
    background-color: var(--color--vivid-purple) !important;
}

.has-black-border-color {
    border-color: var(--color--black) !important;
}

.has-cyan-bluish-gray-border-color {
    border-color: var(--color--cyan-bluish-gray) !important;
}

.has-white-border-color {
    border-color: var(--color--white) !important;
}

.has-pale-pink-border-color {
    border-color: var(--color--pale-pink) !important;
}

.has-vivid-red-border-color {
    border-color: var(--color--vivid-red) !important;
}

.has-luminous-vivid-orange-border-color {
    border-color: var(--color--luminous-vivid-orange) !important;
}

.has-luminous-vivid-amber-border-color {
    border-color: var(--color--luminous-vivid-amber) !important;
}

.has-light-green-cyan-border-color {
    border-color: var(--color--light-green-cyan) !important;
}

.has-vivid-green-cyan-border-color {
    border-color: var(--color--vivid-green-cyan) !important;
}

.has-pale-cyan-blue-border-color {
    border-color: var(--color--pale-cyan-blue) !important;
}

.has-vivid-cyan-blue-border-color {
    border-color: var(--color--vivid-cyan-blue) !important;
}

.has-vivid-purple-border-color {
    border-color: var(--color--vivid-purple) !important;
}

.has-vivid-cyan-blue-to-vivid-purple-gradient-background {
    background: var(--gradient--vivid-cyan-blue-to-vivid-purple) !important;
}

.has-light-green-cyan-to-vivid-green-cyan-gradient-background {
    background: var(--gradient--light-green-cyan-to-vivid-green-cyan) !important;
}

.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background {
    background: var(--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;
}

.has-luminous-vivid-orange-to-vivid-red-gradient-background {
    background: var(--gradient--luminous-vivid-orange-to-vivid-red) !important;
}

.has-very-light-gray-to-cyan-bluish-gray-gradient-background {
    background: var(--gradient--very-light-gray-to-cyan-bluish-gray) !important;
}

.has-cool-to-warm-spectrum-gradient-background {
    background: var(--gradient--cool-to-warm-spectrum) !important;
}

.has-blush-light-purple-gradient-background {
    background: var(--gradient--blush-light-purple) !important;
}

.has-blush-bordeaux-gradient-background {
    background: var(--gradient--blush-bordeaux) !important;
}

.has-luminous-dusk-gradient-background {
    background: var(--gradient--luminous-dusk) !important;
}

.has-pale-ocean-gradient-background {
    background: var(--gradient--pale-ocean) !important;
}

.has-electric-grass-gradient-background {
    background: var(--gradient--electric-grass) !important;
}

.has-midnight-gradient-background {
    background: var(--gradient--midnight) !important;
}

.has-small-font-size {
    font-size: var(--font-size--small) !important;
}

.has-medium-font-size {
    font-size: var(--font-size--medium) !important;
}

.has-large-font-size {
    font-size: var(--font-size--large) !important;
}

.has-x-large-font-size {
    font-size: var(--font-size--x-large) !important;
}

:where(.wp-block-post-template.is-layout-flex) {
    gap: 1.25em;
}

:where(.wp-block-post-template.is-layout-grid) {
    gap: 1.25em;
}

:where(.wp-block-columns.is-layout-flex) {
    gap: 2em;
}

:where(.wp-block-columns.is-layout-grid) {
    gap: 2em;
}

:root :where(.wp-block-pullquote) {
    font-size: 1.5em;
    line-height: 1.6;
}





/*======================
 OUR CUSTOME STYLES 
======================*/


/*--------------
  	Preloader CSS
------------------- */
#preLoader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    z-index: 1000;
    background-color: var(--color--black);
}

#preLoader .loader {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    display: block;
    margin: 15px auto;
    position: relative;
    left: -100px;
    box-sizing: border-box;
    -webkit-animation: shadowRolling 2s linear infinite;
    animation: shadowRolling 2s linear infinite;
}

@-webkit-keyframes shadowRolling {
    0% {
        box-shadow: 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
    }

    12% {
        box-shadow: 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
    }

    25% {
        box-shadow: 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
    }

    36% {
        box-shadow: 120px 0 white, 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0);
    }

    50% {
        box-shadow: 130px 0 white, 120px 0 white, 110px 0 white, 100px 0 white;
    }

    62% {
        box-shadow: 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white, 110px 0 white;
    }

    75% {
        box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white;
    }

    87% {
        box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white;
    }

    100% {
        box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0);
    }
}

@keyframes shadowRolling {
    0% {
        box-shadow: 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
    }

    12% {
        box-shadow: 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
    }

    25% {
        box-shadow: 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
    }

    36% {
        box-shadow: 120px 0 white, 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0);
    }

    50% {
        box-shadow: 130px 0 white, 120px 0 white, 110px 0 white, 100px 0 white;
    }

    62% {
        box-shadow: 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white, 110px 0 white;
    }

    75% {
        box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white;
    }

    87% {
        box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 130px 0 white;
    }

    100% {
        box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0);
    }
}



/*------------------
    HEADER 
=------------------*/
header {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 999;
    padding: 10px;
    background-color: var(--color--white);
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

header.is-sticky {
    box-shadow: 0px 1px 0px #44444440;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

header .logo {
    width: 150px;
    height: 150px;
    /* height: 50px; */
}


/* -----------------------------------------
	Hero Banner CSS
----------------------------------------- */
.hero-banner {
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.hero-banner .banner-content {
    max-width: 640px;
}

.hero-banner .banner-content p {
    font-size: var(--font-lg);
    max-width: 540px;
    margin-bottom: 0;
}

.hero-banner .banner-image {
    position: relative;
    -webkit-margin-start: auto;
    margin-inline-start: auto;
    z-index: 1;
}

.hero-banner .banner-image img {
    filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.1));
}

.hero-banner .shape img {
    position: absolute;
    z-index: -1;
    opacity: 0.6;
}

.hero-banner.hero-banner-2 {
    padding-top: 170px;
    background-image: linear-gradient(0deg, rgb(255, 255, 255) 25%, rgba(var(--color-primary-rgb), 0.2) 100%);
}

.hero-banner.hero-banner-2 .swiper {
    background-size: contain !important;
    background-position: center;
    background-repeat: no-repeat;
    padding: 30px 0;
}

@media (max-width: 575.98px) {
    .hero-banner.hero-banner-2 .swiper {
        padding: 0;
    }
}

.hero-banner.hero-banner-2 .shape img {
    opacity: 1;
}

.hero-banner.hero-banner-2 .shape img.shape-1 {
    top: 18%;
    left: 10%;
    -webkit-animation: moveLeftRight 10s linear infinite;
    animation: moveLeftRight 10s linear infinite;
}

.hero-banner.hero-banner-2 .shape img.shape-2 {
    top: 33%;
    left: 25%;
    -webkit-animation: moveUpDown 5s linear infinite;
    animation: moveUpDown 5s linear infinite;
}

.hero-banner.hero-banner-2 .shape img.shape-3 {
    bottom: 30%;
    left: 13%;
    -webkit-animation: moveUpDown 10s linear infinite;
    animation: moveUpDown 10s linear infinite;
}

.hero-banner.hero-banner-2 .shape img.shape-4 {
    top: 33%;
    right: 25%;
    -webkit-animation: moveLeftRight 8s linear infinite;
    animation: moveLeftRight 8s linear infinite;
}

.hero-banner.hero-banner-2 .shape img.shape-5 {
    bottom: 30%;
    right: 13%;
    -webkit-animation: rotate 20s linear infinite;
    animation: rotate 20s linear infinite;
}

.hero-banner.hero-banner-2 .shape img.shape-6 {
    top: 18%;
    right: 10%;
    -webkit-animation: moveLeftRight 10s linear infinite;
    animation: moveLeftRight 10s linear infinite;
}

/* -----------------------------------------
    Choose CSS
----------------------------------------- */
.choose-area {
    position: relative;
    overflow: hidden;
}

.choose-area .card .card-text {
    flex: auto;
}

.choose-area .card-icon {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    font-size: 28px;
    color: var(--color--black);
    box-shadow: 0px 8px 20px rgba(39, 39, 39, 0.08);
}

.choose-area .image {
    position: relative;
}

.choose-area .client {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 15px;
}

.choose-area .client .client-img {
    max-width: 60px;
}

.choose-area .info-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.choose-area .info-list li {
    position: relative;
}

.choose-area .info-list li i {
    color: var(--color--black);
    -webkit-margin-end: 5px;
    margin-inline-end: 5px;
}

.choose-area .info-list li span {
    position: absolute;
    top: 50%;
    left: 0;
    width: 25px;
    height: 25px;
    transform: translateY(-50%);
    line-height: 25px;
    text-align: center;
    color: var(--text-white);
    font-size: 12px;
    background-color: var(--color--black);
    border-radius: 50%;
}


/* -----------------------------------------
    Screenshot CSS
----------------------------------------- */
.screenshot-area {
    position: relative;
    overflow: hidden;
}

.screenshot-area .screenshot-slider-1 .swiper-slide {
    position: relative;
}

.screenshot-area .screenshot-slider-1 .swiper-slide::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: linear-gradient(180deg, rgba(var(--color--black), 0.03) 50.06%, rgba(var(--color--black), 0.85) 97.53%);
    z-index: 2;
}

.screenshot-area .screenshot-slider-1 .swiper-pagination {
    width: auto;
    height: auto;
    left: 0;
    right: 0;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    margin-inline: auto;
    padding: 30px 25px 60px;
    bottom: -50px;
    border-radius: 50%;
    background-color: var(--color--black);
}

.screenshot-area .screenshot-slider-1 .swiper-pagination .swiper-pagination-bullet {
    background-color: var(--color--white);
    opacity: 0.5;
    transform: translateY(-5px);
}

.screenshot-area .screenshot-slider-1 .swiper-pagination .swiper-pagination-bullet-active {
    width: 10px;
}

.screenshot-area .screenshot-slider-1 .swiper-pagination .swiper-pagination-bullet-active,
.screenshot-area .screenshot-slider-1 .swiper-pagination .swiper-pagination-bullet:hover {
    background-color: var(--color--white);
    opacity: 1;
}

.screenshot-area .swiper-scrollbar {
    z-index: 999;
    background-color: rgba(var(--color--black), 0.5);
    width: 100%;
    left: 0;
    top: 0;
    position: static;
    border-radius: 0;
}

.screenshot-area .swiper-scrollbar .swiper-scrollbar-drag {
    background-color: var(--color--black);
}

.screenshot-area .screenshot-slider .swiper-slide {
    overflow: hidden;
}

.screenshot-area .screenshot-slider#screenshot-slider-4 .swiper-slide {
    transform-origin: bottom !important;
}

.screenshot-area .screenshot-slider#screenshot-slider-4 .swiper-slide img {
    transform-origin: bottom !important;
}

.screenshot-area .screenshot-slider.shadow-none .swiper-slide {
    overflow: unset;
}

.screenshot-area .screenshot-slider.shadow-none .swiper-slide *:not(img) {
    width: 0;
}

.screenshot-area .screenshot-slider.shadow-none img {
    filter: drop-shadow(rgba(0, 0, 0, 0.1) 0px 10px 10px);
}

.screenshot-area.screenshot-2 {
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center bottom;
}