/*---------------------------------------------
STYLESHEET INDEXING
|
|___ Default Styles
|	|___ Variables
|	|___ Reset Styels
|	|___ Typography
|	|___ Forms Styles
|	|___ Helper Classes
|
|___ Elements Styles
|	|___ Back To Top
|	|___ Breadcrumb
|	|___ Button
|	|___ Pagination
|	|___ Section Heading
|	|___ Slick
|
|___Template Styles
|	|___ About Us
|	|___ Banner
|	|___ Brand
|	|___ Call To Action
|	|___ Case Study
|	|___ Contact
|	|___ Counter Up
|	|___ FAQ
|	|___ Pricing
|	|___ Process
|	|___ Project
|	|___ Service
|	|___ Team
|	|___ Testimonial
|	|___  Why Choose
|	|___  404 Error
|
|___Blocks Styles
|	|___ Header Styles
|	|___ Blog Styles
|	|___ Footer Styles
|
|___Dark Style
|
|___Spacing
|
|___ END STYLESHEET INDEXING

--------------------------------------------*/
/*=======================================================================
1. Default Styles
=========================================================================*/
/*-------------------------
    Variables
-------------------------*/
:root {
    --color-primary: #5956E9;
    --color-white: #ffffff;
    --color-black: #000000;
    --color-light: #ECF2F6;
    --color-dark: #27272E;
    --color-text-dark: #292930;
    --color-accent1: #FFDC60;
    --color-accent2: #FAB8C4;
    --color-blue-shade: #6865FF;
    --color-link: #2522BA;
    --color-mabel: #DBF8FF;
    --color-fog: #DBDEFF;
    --color-pink-shade: #FFD3DB;
    --color-peach: #FFEDDC;
    --color-rose: #ff687b; /*#C75C6F*/
    --color-blue: #9568ff;
    --color-chart1: #896BA7;
    --color-chart2: #BADEFF;
    --color-body: #525260;
    --color-gray-1: #757589;
    --color-gray-2: #999FAE;
    --color-gray-3: #999AB8;
    --color-gray-4: #99A1AA;
    --color-ship-gray: #42424A;
    --color-ghost: #C7C7D5;
    --color-mercury: #E5E5E5;
    --gradient-color: linear-gradient(90deg, rgb(226 165 254 / 39%) 0%, rgb(255 255 255 / 16%) 48%, rgb(166 156 255 / 34%) 100%);
    --gradient-primary: linear-gradient(90deg, #ECF2F6 0%, rgba(236, 242, 246, 0) 70.31%);
    --gradient-blue: linear-gradient(145.92deg, #5956E9 20.18%, #9991FF 76.9%);
    --gradient-accent: linear-gradient(180deg, #FAB8C4 0%, #FFEDF0 100%);
    --gradient-white: linear-gradient(266.3deg, rgba(236, 242, 246, 0) 7.84%, #ECF2F6 29.1%, rgba(236, 242, 246, 0) 64.32%);
    --gradient-dark: linear-gradient(180deg, #27272E 0%, #303035 100%);
    --border-light: 1px solid #E3E6E9;
    --border-lighter: 1px solid #ECF2F6;
    --border-dark: 1px solid var(--color-ship-gray);
    --border-gray: 1px solid var(--color-gray-4);
    --font-primary: "Unbounded", sans-serif;
    --font-secondary: 'Wix Madefor Display', sans-serif;
    --font-awesome: "Font Awesome 5 Pro";
    --transition: all 0.3s ease-in-out;
    --font-body-1: 18px;
    --font-body-2: 16px;
    --font-body-3: 14px;
    --font-body-4: 12px;
    --line-height-b1: 1.5;
    --line-height-b3: 1.1;
    --h1: 80px;
    --h2: 64px;
    --h3: 48px;
    --h4: 32px;
    --h5: 24px;
    --h6: 20px;
}

/*-------------------------
    Reset Styels
-------------------------*/
a {
    display: inline-block;
    text-decoration: none;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

span {
    display: inline-block;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

ul.list-style,
ol.list-style {
    margin: -10px 0;
}

ul.list-style li,
ol.list-style li {
    margin: 10px 0;
}

ul.list-style li::marker,
ol.list-style li::marker {
    color: var(--color-primary);
}

.list-unstyled {
    padding-left: 0;
    list-style: none;
    margin-bottom: 0;
}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    padding-left: 15px;
    padding-right: 15px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .container {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }
}

.row {
    margin-left: -15px;
    margin-right: -15px;
}

.row > [class*=col] {
    padding-left: 15px;
    padding-right: 15px;
}

.row.g-0 {
    margin-left: 0;
    margin-right: 0;
}

.row.g-0 > [class*=col] {
    padding-left: 0;
    padding-right: 0;
}

@media only screen and (min-width: 1400px) {
    .row-35 {
        margin-left: -35px;
        margin-right: -35px;
    }

    .row-35 > [class*=col] {
        padding-left: 35px;
        padding-right: 35px;
    }

    .row-40 {
        margin-left: -40px;
        margin-right: -40px;
    }

    .row-40 > [class*=col] {
        padding-left: 40px;
        padding-right: 40px;
    }

    .row-45 {
        margin-left: -45px;
        margin-right: -45px;
    }

    .row-45 > [class*=col] {
        padding-left: 45px;
        padding-right: 45px;
    }
}
/*-------------------------
    Typography
-------------------------*/
body {
    font-family: var(--font-secondary);
    font-size: var(--font-body-2);
    line-height: var(--line-height-b1);
    color: var(--color-body);
    font-weight: 400;
    height: 100%;
    vertical-align: baseline;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
address,
p,
pre,
blockquote,
table,
hr {
    margin: 0 0 30px 0;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    color: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-primary);
    font-weight: 500;
    letter-spacing: -0.025em;
    color: var(--color-text-dark);
}

h1,
.h1 {
    font-size: var(--h1);
    line-height: 1.2;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    h1,
.h1 {
        font-size: 68px;
    }
}

@media only screen and (max-width: 1199px) {
    h1,
.h1 {
        font-size: 68px;
    }
}

@media only screen and (max-width: 767px) {
    h1,
.h1 {
        font-size: 48px;
    }
}

h2,
.h2 {
    font-size: var(--h2);
    line-height: 1.2;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    h2,
.h2 {
        font-size: 56px;
    }
}

@media only screen and (max-width: 1199px) {
    h2,
.h2 {
        font-size: 56px;
    }
}

@media only screen and (max-width: 767px) {
    h2,
.h2 {
        font-size: 38px;
    }
}

@media only screen and (max-width: 479px) {
    h2, .h2 { font-size: 34px!important;}
   .h2 span { font-size: 39px!important;}
}

h3,
.h3 {
    font-size: var(--h3);
    line-height: 1.2;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    h3,
.h3 {
        font-size: 40px;
    }
}

@media only screen and (max-width: 1199px) {
    h3,
.h3 {
        font-size: 36px;
    }
}

@media only screen and (max-width: 767px) {
    h3,
.h3 {
        font-size: 32px;
    }
}

h4,
.h4 {
    font-size: var(--h4);
    line-height: 1.2;
}

@media only screen and (max-width: 991px) {
    h4,
.h4 {
        font-size: 26px;
    }
}

@media only screen and (max-width: 767px) {
    h4,
.h4 {
        font-size: 20px!important;
    }
}

h5,
.h5 {
    font-size: var(--h5);
    line-height: 1.4;
}

@media only screen and (max-width: 767px) {
    h5,
.h5 {
        font-size: 20px;
    }
}

h6,
.h6 {
    font-size: var(--h6);
    line-height: 1.2;
}

@media only screen and (max-width: 767px) {
    h6,
.h6 {
        font-size: 18px;
    }
}

p {
    font-size: var(--font-body-2);
    line-height: var(--line-height-b1);
    margin: 0 0 40px 0;
}

.body-font1 {
    font-size: var(--font-body-1);
    line-height: var(--line-height-b1);
}

.body-font2 {
    font-size: var(--font-body-2);
    line-height: var(--line-height-b1);
}

.body-font3 {
    font-size: var(--font-body-3);
    line-height: var(--line-height-b3);
}

.body-font4 {
    font-size: var(--font-body-4);
    line-height: var(--line-height-b3);
}

/*-------------------------
    Forms Styles
-------------------------*/
input,
.form-control {
    border: var(--border-lighter);
    border-radius: 16px;
    background-color: transparent;
    color: var(--color-text-dark);
    padding: 15px 20px;
    width: 100%;
  /* -- Placeholder -- */
}

input:focus,
.form-control:focus {
    outline: none;
    box-shadow: 0 20px 48px -14px rgba(153, 161, 170, 0.25);
    border-color: transparent;
}

input::-webkit-input-placeholder, .form-control::-webkit-input-placeholder {
    color: var(--color-gray-2);
  /* Firefox */
    opacity: 1;
}

input::-moz-placeholder, .form-control::-moz-placeholder {
    color: var(--color-gray-2);
  /* Firefox */
    opacity: 1;
}

input:-ms-input-placeholder, .form-control:-ms-input-placeholder {
    color: var(--color-gray-2);
  /* Firefox */
    opacity: 1;
}

input::-ms-input-placeholder, .form-control::-ms-input-placeholder {
    color: var(--color-gray-2);
  /* Firefox */
    opacity: 1;
}

input::placeholder,
.form-control::placeholder {
    color: var(--color-gray-2);
  /* Firefox */
    opacity: 1;
}

input:-ms-input-placeholder,
.form-control:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
    color: var(--color-gray-2);
}

input::-ms-input-placeholder,
.form-control::-ms-input-placeholder {
  /* Microsoft Edge */
    color: var(--color-gray-2);
}

input {
    height: 60px;
}

.form-group {
    margin-bottom: 16px;
}

.form-group label {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-dark);
    margin-bottom: 10px;
}

.input-group {
    background-color: var(--color-white);
    border-radius: 20px;
    height: 72px;
    padding: 10px 10px 10px 55px;
    box-shadow: 0 24px 48px -15px rgba(153, 161, 170, 0.25);
}

@media only screen and (max-width: 479px) {
    .input-group {
        display: block;
        box-shadow: none;
        height: auto;
        padding: 0;
    }
}

.input-group:before {
    content: url("../../assets/media/icon/message.png");
    position: absolute;
    left: 30px;
    top: 24px;
    z-index: 1;
}

@media only screen and (max-width: 479px) {
    .input-group:before {
        left: 15px;
        top: 18px;
    }
}

.input-group .form-control {
    padding: 5px 15px;
    height: auto;
    border: none;
    background-color: transparent;
}

.input-group .form-control:focus {
    box-shadow: none;
}

@media only screen and (max-width: 479px) {
    .input-group .form-control {
        height: 60px;
        width: 100%;
        border-radius: 20px !important;
        padding: 5px 15px 5px 50px;
        border: 1px solid var(--color-light);
    }
}

.input-group .subscribe-btn {
    border: none;
    background-color: var(--color-primary);
    color: var(--color-white);
    border-radius: 16px !important;
    margin-left: 0 !important;
    padding: 10px 28px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.input-group .subscribe-btn:hover {
    background-color: var(--color-link);
}

@media only screen and (max-width: 479px) {
    .input-group .subscribe-btn {
        margin-top: 15px;
        padding: 14px 30px;
    }
}

.error-msg, .success-msg {
    margin-top: 25px;
}

.error-msg p, .success-msg p {
    margin-bottom: 0;
    font-size: 14px;
}

.error-msg p {
    color: #ff0000;
}

.success-msg p {
    color: #15c54b;
}

/*-------------------------
  Helper Classes
-------------------------*/
.bg-color-dark {
    background-color: var(--color-dark);
}

.bg-color-light {
    background-color: var(--color-light);
}

.bg-gradient-color {
    background: var(--gradient-color);
  }

.bg-color-mercury {
    background-color: var(--color-mercury);
}

.bg-color-ship-gray {
    background-color: var(--color-ship-gray);
}

.color-gray-4 {
    color: var(--color-gray-4);
}

.opacity-50 {
    opacity: 0.5;
}

/*=======================================================================
2. Elements Styles
=========================================================================*/
/*-------------------------
    Back To Top
--------------------------*/
.back-to-top {
    position: fixed;
    bottom: -40px;
    right: 40px;
    display: block;
    width: 50px;
    height: 54px;
    line-height: 50px;
    background: var(--color-primary);
    color: #fff;
    text-align: center;
    text-decoration: none;
    border-radius: 50%;
    opacity: 0;
    -webkit-transform: scale(0.3);
    -ms-transform: scale(0.3);
    transform: scale(0.3);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
    z-index: 9;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    border: 2px #ffe3a8;
    border-style: groove none ridge none;
    box-shadow: rgba(126, 93, 255, 0.55) 2px 3px 5px -2px, inset -9px 0 13px #5a74c359;
}
.back-to-top img {
    width: 30px;
    top: -3px;
    position: relative;
    }

@media only screen and (max-width: 575px) {
    .back-to-top {
        width: 45px;
        height: 49px;
        line-height: 40px;
    }
    .back-to-top img { top: -1px; width: 27px;}
}

.back-to-top:focus {
    color: var(--color-white);
}

.back-to-top.show {
    bottom: 40px;
    right: 40px;
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

@media only screen and (max-width: 575px) {
    .back-to-top.show {
        bottom: 10px;
        right: 10px;
    }
}

.back-to-top.show:hover {
    color: var(--color-white);
    bottom: 30px;
    opacity: 1;
}

@media only screen and (max-width: 575px) {
    .back-to-top.show:hover {
        bottom: 10px;
    }
}
/*-------------------------
    Breadcrumb
-------------------------*/
.breadcrum-area {
    background: var(--gradient-primary);
    padding: 200px 0 100px;
    margin-top: -160px;
    position: relative;
    z-index: 1;

    border: 2px #ffffff;
    border-style: outset;
    border-left: none;
    border-radius: 0 0 4rem 4rem;
}

@media only screen and (max-width: 1199px) {
    .breadcrum-area {
        margin-top: -120px;
    }
}

@media only screen and (max-width: 767px) {
    .breadcrum-area {
        padding: 150px 0 40px;
    }
}

.breadcrumb {
    display: block;
}

.breadcrumb ul {
    margin-bottom: 40px;
}

@media only screen and (max-width: 767px) {
    .breadcrumb ul {
        margin-bottom: 35px;
    }
}

.breadcrumb li {
    display: inline-block;
    color: var(--color-primary);
    font-weight: 500;
    position: relative;
    margin-right: 22px;
}

.breadcrumb li:after {
    content: ".";
    color: var(--color-gray-2);
    font-size: 18px;
    position: absolute;
    top: -5px;
    right: -15px;
}

.breadcrumb li a {
    color: var(--color-gray-2);
}

.breadcrumb li a:hover {
    color: var(--color-primary);
}

.breadcrumb li:last-child:after {
    display: none;
}

.breadcrumb .title {
    margin-bottom: 0;
    width: 80%;
}

@media only screen and (max-width: 991px) {
    .breadcrumb .title {
        width: 100%;
    }
}

.breadcrumb-banner {
    padding: 280px 0 200px;
}

@media only screen and (max-width: 1199px) {
    .breadcrumb-banner {
        padding: 200px 0 50px;
    }
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner {
        padding: 150px 0 40px;
    }
}

@media only screen and (max-width: 767px) {
    .breadcrumb-banner {
        padding: 150px 0 20px;
    }
}

.breadcrumb-banner .section-heading .title {
    color: #000248;
    width: 55%;
    margin-bottom: 40px;
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner .section-heading .title {
        width: 100%;
        margin-bottom: 30px;
    }
}

.breadcrumb-banner .section-heading p {
    width: 40%;
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner .section-heading p {
        width: 100%;
    }
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner .section-heading {
        margin-bottom: 40px;
    }
}

.breadcrumb-banner .banner-thumbnail {
    position: absolute;
    bottom: -100px;
    right: 190px;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .breadcrumb-banner .banner-thumbnail {
        right: -50px;
        bottom: -80px;
    }

    .breadcrumb-banner .banner-thumbnail img {
        width: 90%;
    }
}

@media only screen and (max-width: 1199px) {
    .breadcrumb-banner .banner-thumbnail {
        right: -40px;
        bottom: -50px;
    }

    .breadcrumb-banner .banner-thumbnail img {
        width: 65%;
    }
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner .banner-thumbnail {
        position: initial;
        text-align: center;
    }

    .breadcrumb-banner .banner-thumbnail img {
        width: 100%;
    }
}

.breadcrumb-banner .banner-thumbnail.thumbnail-2 {
    bottom: 120px;
    right: 100px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .breadcrumb-banner .banner-thumbnail.thumbnail-2 {
        right: -50px;
    }
}

@media only screen and (max-width: 1199px) {
    .breadcrumb-banner .banner-thumbnail.thumbnail-2 {
        right: 0;
    }
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner .banner-thumbnail.thumbnail-2 {
        margin: -40px 0 0;
    }

    .breadcrumb-banner .banner-thumbnail.thumbnail-2 img {
        width: 100%;
    }
}

.breadcrumb-banner .banner-thumbnail.thumbnail-3 {
    bottom: -120px;
    right: 80px;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .breadcrumb-banner .banner-thumbnail.thumbnail-3 {
        right: -100px;
        bottom: -60px;
    }

    .breadcrumb-banner .banner-thumbnail.thumbnail-3 img {
        width: 80%;
    }
}

@media only screen and (max-width: 1199px) {
    .breadcrumb-banner .banner-thumbnail.thumbnail-3 {
        right: 0px;
        bottom: -50px;
    }

    .breadcrumb-banner .banner-thumbnail.thumbnail-3 img {
        width: 60%;
    }
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner .banner-thumbnail.thumbnail-3 {
        text-align: center;
        margin: -40px 0 0;
    }

    .breadcrumb-banner .banner-thumbnail.thumbnail-3 img {
        width: 100%;
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .breadcrumb-banner .banner-thumbnail.thumbnail-4 img {
        width: 100%;
    }
}

@media only screen and (max-width: 1199px) {
    .breadcrumb-banner .shape-group-8 .shape.shape-2 img {
        width: 60%;
    }
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner .shape-group-8 .shape.shape-2 img {
        width: 50%;
    }
}

.breadcrumb-banner .shape-group-8 .shape.shape-3 {
    bottom: -200px;
    top: auto;
}

@media only screen and (max-width: 1199px) {
    .breadcrumb-banner .shape-group-8 .shape.shape-3 {
        bottom: 0;
        opacity: 0.5;
    }
}

.breadcrumb-banner.single-breadcrumb {
    padding: 200px 0 75px;
}

@media only screen and (max-width: 1199px) {
    .breadcrumb-banner.single-breadcrumb {
        padding: 180px 0 70px;
    }
}

@media only screen and (max-width: 991px) {
    .breadcrumb-banner.single-breadcrumb {
        padding: 150px 0 40px;
    }
}

.breadcrumb-banner.single-breadcrumb .section-heading .title {
    width: 100%;
}

.breadcrumb-banner.single-breadcrumb .section-heading p {
    width: 100%;
}

.breadcrumb-banner.single-breadcrumb .banner-thumbnail {
    position: initial;
}

.breadcrumb-banner.single-breadcrumb .banner-thumbnail img {
    border-radius: 24px;
}

@media only screen and (max-width: 1199px) {
    .breadcrumb-banner.single-breadcrumb .banner-thumbnail img {
        width: 100%;
    }
}

/*-------------------------
    Button
-------------------------*/
.axil-btn {
    border-radius: 20px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.04em;
    padding: 18px 55px;
    height: auto;
    text-align: center;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    position: relative;
    z-index: 1;
}

.axil-btn.btn-borderd {
    border: var(--border-gray);
    color: var(--color-dark);
    background-color: transparent;
}

.axil-btn.btn-borderd:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

.axil-btn.btn-fill-primary {
    background-color: var(--color-primary);
    color: var(--color-white);
    border: 1px solid var(--color-primary);
    overflow: hidden;
}

.axil-btn.btn-fill-primary::after {
    content: "";
    height: 300px;
    width: 300px;
    /* background-color: var(--color-link); */
    background-color: #b3b2ff;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%) scale(0);
    -ms-transform: translateY(-50%) translateX(-50%) scale(0);
    transform: translateY(-50%) translateX(-50%) scale(0);
    -webkit-transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: -1;
}

.axil-btn.btn-fill-primary:hover {
    background-color: var(--color-link);
    border-color: var(--color-link);
}

.axil-btn.btn-fill-primary:hover::after {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
    -ms-transform: translateY(-50%) translateX(-50%) scale(1);
    transform: translateY(-50%) translateX(-50%) scale(1);
}

.axil-btn.btn-fill-white {
    background-color: var(--color-white);
    box-shadow: 0px 48px 48px 0px rgba(0, 0, 0, 0.12);
}

.axil-btn.btn-fill-white:hover {
    background-color: var(--color-accent1);
    color: var(--color-white);
}

.axil-btn.btn-large {
    padding: 23px 55px;
}

@media only screen and (max-width: 991px) {
    .axil-btn.btn-large {
        padding: 18px 35px;
    }
}

.axil-btn.btn-middle {
    padding: 18px 55px;
}

@media only screen and (max-width: 991px) {
    .axil-btn.btn-middle {
        padding: 14px 35px!important;;
    }
}

.axil-btn.btn-large-fluid {
    padding: 23px;
    width: 100%;
}

.axil-btn.btn-fluid {
    width: 100%;
}

/* -----------------------
Pagination
--------------------------*/
.pagination {
    margin-top: 80px;
    width: 100%;
}

@media only screen and (max-width: 991px) {
    .pagination {
        margin-top: 45px;
    }
}

.pagination ul {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: -3px;
    padding: 0;
}

@media only screen and (max-width: 575px) {
    .pagination ul {
        margin: -2px;
    }
}

.pagination ul li {
    margin: 3px;
}

@media only screen and (max-width: 575px) {
    .pagination ul li {
        margin: 2px;
    }
}

.pagination ul li a {
    line-height: 42px;
    min-width: 42px;
    text-align: center;
    color: var(--color-dark);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    display: block;
    padding: 0 15px;
    transition: all 0.5s;
    border: var(--border-light);
    border-radius: 2rem;
}

.pagination ul li a:hover {
    background: var(--color-primary);
    color: #ffffff;
    border-color: var(--color-primary);
}

.pagination ul li a.current {
    background: var(--color-primary);
    color: #ffffff;
    border-color: var(--color-primary);
}

@media only screen and (max-width: 575px) {
    .pagination ul li a {
        line-height: 35px;
        min-width: 35px;
        padding: 0 10px;
        font-size: 14px;
    }
}

.pagination ul li a.disabled {
    pointer-events: none;
    opacity: 0.5;
}

/*кнопки вход регистрация*/
.authbutton a {
    font-size: 18px;
    font-weight: 500;
    color: var(--bs-white)!important;
    background-color: var(--color-primary);
    text-align: center;
    border-radius: 60px;
    padding: 0px 25px;
    letter-spacing: -0.025em;
    margin: -16px!important;
}

@media only screen and (min-width: 995px) and (max-width: 1199px) {
    .authbutton a {
       margin: -10px!important;
    }
}

.authbutton a .nav-link.active {
    background-color: var(--color-primary);
    color: var(--color-white);
}

@media only screen and (max-width: 575px) {
    .authbutton a .nav-link {
        font-size: 15px;
        padding: 12px 25px;
    }
}

/*authbutton::after {
    content: "";
    height: 300px;
    width: 300px;
    background-color: var(--color-link);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%) scale(0);
    -ms-transform: translateY(-50%) translateX(-50%) scale(0);
    transform: translateY(-50%) translateX(-50%) scale(0);
    -webkit-transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: -1;
}

.authbutton:hover::after {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
    -ms-transform: translateY(-50%) translateX(-50%) scale(1);
    transform: translateY(-50%) translateX(-50%) scale(1);
}*/

.authbutton:hover {
color: #3a7999;
/* box-shadow: inset 0 0 0 3px #3a7999; */
}



/*-------------------------
    Section Heading
-------------------------*/
.section {
    position: relative;
    z-index: 1;
}

.section-heading {
    text-align: center;
    margin-bottom: 60px;
}

@media only screen and (max-width: 991px) {
    .section-heading {
        margin-bottom: 50px!important;
    }
}

.section-heading .subtitle {
    color: var(--color-rose);
    font-weight: 500;
    font-size: 20px;
    font-family: var(--font-primary);
    margin-bottom: 15px;
}

.subtitle-black {
  color: var(--dark-body-text)!important;
}

.subtitle-blue {
  color: var(--color-blue)!important;
}

@media only screen and (max-width: 991px) {
    .section-heading .subtitle {
        font-size: 18px;
    }
}

@media only screen and (max-width: 767px) {
    .section-heading .subtitle {
        font-size: 16px;
    }
    .statya .section-heading {justify-items: center;}
}

@media only screen and (max-width: 1199px) {
    .section-heading .title {
        font-size: 60px;
    }
}

@media only screen and (max-width: 991px) {
    .section-heading .title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 575px) {
    .section-heading .title {
        font-size: 38px;
    }
}

@media only screen and (max-width: 479px) {
    .section-heading .title {
        font-size: 34px;
    }
}

.section-heading p {
    font-size: var(--font-body-1);
    width: 50%;
    margin: 0 auto 40px;
}

@media only screen and (max-width: 991px) {
    .section-heading p {
        font-size: 16px;
        width: 100%;
    }
}

.heading-light-left {
    text-align: left;
}

.heading-light-left .title {
    color: var(--color-white);
    margin-bottom: 35px;
    width: 50%;
}

@media only screen and (max-width: 1199px) {
    .heading-light-left .title {
        width: 70%;
    }
}

@media only screen and (max-width: 991px) {
    .heading-light-left .title {
        width: 100%;
    }
}

.heading-light-left p {
    color: var(--color-white);
    margin: 0 0 40px;
    width: 40%;
    opacity: 0.6;
}

@media only screen and (max-width: 1199px) {
    .heading-light-left p {
        width: 60%;
    }
}

@media only screen and (max-width: 991px) {
    .heading-light-left p {
        width: 100%;
    }
}

.heading-light .title {
    color: var(--color-white);
}

.heading-light p {
    color: var(--color-white);
}

.heading-left {
    text-align: left;
}

.heading-left p {
    margin: 0 0 30px;
}

.heading-left p + p {
    margin: 0 0 40px;
}

.shape-group-1 .shape {
    position: absolute;
    z-index: -1;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-1 .shape img {
        opacity: 0.4;
    }
}

@media only screen and (max-width: 991px) {
    .shape-group-1 .shape img {
        opacity: 0.4;
    }
}

.shape-group-1 .shape.shape-1 {
    top: 140px;
    left: 315px;
}

.shape-group-1 .shape.shape-2 {
    top: 120px;
    right: 0;
}

.shape-group-1 .shape.shape-3 {
    bottom: 80px;
    left: 0;
}

.shape-group-1 .shape.shape-4 {
    bottom: 60px;
    right: 230px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-1 .shape.shape-4 {
        right: 100px;
    }
}

.shape-group-2 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-2 .shape.shape-1 {
    bottom: 0;
    right: 135px;
}

.shape-group-2 .shape.shape-2 {
    right: 500px;
    top: 0;
}

.shape-group-2 .shape.shape-3 {
    right: 815px;
    top: 125px;
}

.shape-group-3 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-3 .shape.shape-1 {
    right: 0;
    top: 90px;
}

.shape-group-3 .shape.shape-2 {
    right: 390px;
    top: 165px;
}

.shape-group-3 .shape.shape-3 {
    right: 0;
    top: 255px;
    z-index: 2;
    pointer-events: none;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-3 .shape.shape-3 {
        display: none;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-3 .shape.shape-3 {
        display: none;
    }
}

.shape-group-4 .shape-1 {
    position: absolute;
    top: 140px;
    right: 440px;
    z-index: -1;
}

.shape-group-5 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-5 .shape.shape-1 {
    top: 0;
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
    left: 22%;
}

.shape-group-5 .shape.shape-2 {
    bottom: 0;
    left: 250px;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.shape-group-5 .shape.shape-3 {
    bottom: 110px;
    left: 160px;
}

.shape-group-5 .shape.shape-4 {
    top: 90px;
    left: 35%;
}

.shape-group-6 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-6 .shape.shape-1 {
    top: 0;
    left: 0;
}

.shape-group-6 .shape.shape-2 {
    top: 110px;
    left: 0;
}

.shape-group-6 .shape.shape-3 {
    bottom: 140px;
    right: 0;
}

.shape-group-6 .shape.shape-4 {
    bottom: -1px;
    left: 11%;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-6 .shape.shape-4 {
        left: 0;
    }

    .shape-group-6 .shape.shape-4 img {
        width: 90%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-6 .shape.shape-4 {
        left: 0;
    }

    .shape-group-6 .shape.shape-4 img {
        width: 70%;
    }
}

.shape-group-7 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-7 .shape.shape-1 {
    top: 90px;
    right: 200px;
}

.shape-group-7 .shape.shape-2 {
    top: 210px;
    left: 52%;
}

@media only screen and (max-width: 991px) {
    .shape-group-7 .shape.shape-2 {
        display: none;
    }
}

.shape-group-7 .shape.shape-3 {
    top: 40%;
    left: 170px;
}

.shape-group-8 .shape {
    position: absolute;
    z-index: -1;
    pointer-events: none;
}

.shape-group-8 .shape.shape-1 {
    top: 0;
    left: 0;
}

@media only screen and (max-width: 767px) {
    .shape-group-8 .shape.shape-1 {
        display: none;
    }
}

.shape-group-8 .shape.shape-2 {
    top: 0;
    right: 0;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-8 .shape.shape-2 img {
        width: 90%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-8 .shape.shape-2 img {
        width: 80%;
    }
    .blog .shape-group-8 .shape.shape-2 img {
        width: 50%;opacity: .9;
    }
}

@media only screen and (max-width: 767px) {
    .shape-group-8 .shape.shape-2 img {
        width: 60%;
    }
    .blog .shape-group-8 .shape.shape-2 img {
        width: 40%;
    }
}
 
.shape-group-8 .shape.shape-3 {
    top: 115px;
    left: 0;
}

.shape-group-9 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-9 .shape.shape-1 {
    top: 0;
    left: 32%;
    margin-left: auto;
    margin-right: auto;
}

.shape-group-9 .shape.shape-2 {
    top: 180px;
    left: 18%;
    opacity: 0.5;
    -webkit-animation: movingleftright1 infinite 20000ms;
    animation: movingleftright1 infinite 20000ms;
}

.shape-group-9 .shape.shape-3 {
    top: 31%;
    left: 20%;
    -webkit-animation: movingleftright2 infinite 25000ms;
    animation: movingleftright2 infinite 25000ms;
}

.shape-group-9 .shape.shape-4 {
    top: 44%;
    left: 28%;
    -webkit-animation: movingleftright1 infinite 25000ms;
    animation: movingleftright1 infinite 25000ms;
}

.shape-group-9 .shape.shape-5 {
    top: 50%;
    left: 17%;
    -webkit-animation: movingleftright2 infinite 30000ms;
    animation: movingleftright2 infinite 30000ms;
}

.shape-group-9 .shape.shape-6 {
    top: 26%;
    right: 21%;
    -webkit-animation: movingleftright3 infinite 30000ms;
    animation: movingleftright3 infinite 30000ms;
}

@media only screen and (max-width: 767px) {
    .shape-group-9 .shape.shape-6 {
        display: none;
    }
}

.shape-group-9 .shape.shape-7 {
    top: 30%;
    right: 15%;
    -webkit-animation: movingleftright1 infinite 30000ms;
    animation: movingleftright1 infinite 30000ms;
}

.shape-group-10 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-10 .shape.shape-1 {
    top: 100px;
    right: 0;
}

.shape-group-10 .shape.shape-2 {
    bottom: 200px;
    left: 0;
}

.shape-group-10 .shape.shape-3 {
    top: 680px;
    left: 110px;
}

.shape-group-11 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-11 .shape.shape-1 {
    top: 40px;
    right: 0;
}

.shape-group-11 .shape.shape-2 {
    bottom: -310px;
    left: -10px;
    opacity: 0.4;
}

.shape-group-12 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-12 .shape.shape-1 {
    top: 115px;
    left: 38%;
}

.shape-group-12 .shape.shape-2 {
    left: 60px;
    bottom: 130px;
}

.shape-group-12 .shape.shape-3 {
    right: 60px;
    bottom: 50px;
}

.shape-group-13 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-13 .shape.shape-1 {
    top: 0;
    left: 0;
}

@media only screen and (max-width: 991px) {
    .shape-group-13 .shape.shape-1 img {
        width: 60%;
    }
}

.shape-group-13 .shape.shape-2 {
    top: 0;
    right: -5px;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-13 .shape.shape-2 img {
        width: 80%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-13 .shape.shape-2 img {
        width: 75%;
    }
}

@media only screen and (max-width: 991px) {
    .shape-group-13 .shape.shape-2 img {
        width: 50%;
    }
}

@media only screen and (max-width: 479px) {
    .shape-group-13 .shape.shape-2 img {
        width: 40%;
    }
}

.shape-group-13 .shape.shape-3 {
    right: -10px;
    bottom: 62px;
    z-index: 2;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-13 .shape.shape-3 {
        bottom: 220px;
    }

    .shape-group-13 .shape.shape-3 img {
        width: 60%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-13 .shape.shape-3 {
        bottom: 100px;
    }

    .shape-group-13 .shape.shape-3 img {
        width: 50%;
    }
}

@media only screen and (max-width: 767px) {
    .shape-group-13 .shape.shape-3 img {
        width: 40%;
    }
}

.shape-group-13 .shape.shape-4 {
    left: 220px;
    top: 45%;
    height: 48px;
    width: 48px;
    -webkit-animation: movingleftright1 infinite 25000ms;
    animation: movingleftright1 infinite 25000ms;
}

.shape-group-13 .shape.shape-5 {
    left: 45%;
    bottom: 130px;
    height: 32px;
    width: 32px;
    -webkit-animation: movingleftright3 infinite 20000ms;
    animation: movingleftright3 infinite 20000ms;
}

.shape-group-14 .shape {
    position: absolute;
    z-index: -1;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-14 .shape img {
        width: 70%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-14 .shape img {
        width: 40%;
    }
}

.shape-group-14 .shape.shape-1 {
    left: 40%;
    bottom: 230px;
    -webkit-animation: movingleftright1 infinite 20000ms;
    animation: movingleftright1 infinite 20000ms;
}

.shape-group-14 .shape.shape-2 {
    left: 47%;
    bottom: 115px;
    -webkit-animation: movingleftright3 infinite 30000ms;
    animation: movingleftright3 infinite 30000ms;
}

.shape-group-14 .shape.shape-3 {
    right: 160px;
    bottom: 270px;
    -webkit-animation: movingleftright2 infinite 40000ms;
    animation: movingleftright2 infinite 40000ms;
}

.shape-group-16 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-16 .shape.shape-1 {
    top: 0;
    right: 0;
}

.shape-group-16 .shape.shape-2 {
    top: 120px;
    left: 30%;
}

.shape-group-16 .shape.shape-3 {
    bottom: 250px;
    left: 0;
}

.shape-group-17 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-17 .shape.shape-1 {
    top: 0;
    margin-right: auto;
    margin-left: auto;
}

media only screen and (max-width: 578px) {
    .shape-group-17 .shape.shape-1 {
      left: 0;
    }
}

.shape-group-17 .shape.shape-2 {
    top: 360px;
    right: 0;
}

.shape-group-17 .shape.shape-3 {
    top: 430px;
    left: 0;
    opacity: 20%;
}

.shape-group-17 .shape.shape-4 {
    top: 35%;
    right: 0;
    opacity: 20%;
}

.shape-group-17 .shape.shape-5 {
    top: 56%;
    left: 0;
    opacity: 20%;
}

.shape-group-17 .shape.shape-6 {
    top: 75%;
    right: 0;
    opacity: 20%;
}

.shape-group-18 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-18 .shape.shape-1 {
    top: 0;
    right: 0;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-18 .shape.shape-1 img {
        width: 70%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-18 .shape.shape-1 img {
        width: 50%;
    }
}

@media only screen and (max-width: 991px) {
    .shape-group-18 .shape.shape-1 img {
        width: 40%;
    }
}

.shape-group-18 .shape.shape-2 {
    bottom: 0;
    left: 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-18 .shape.shape-2 img {
        width: 70%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-18 .shape.shape-2 img {
        width: 50%;
    }
}

.shape-group-18 .shape.shape-3 {
    top: 34%;
    left: 50%;
    -webkit-animation: movingleftright1 infinite 20000ms;
    animation: movingleftright1 infinite 20000ms;
}

.shape-group-18 .shape.shape-3 img {
    opacity: 0.5;
}

.shape-group-18 .shape.shape-4 {
    bottom: 240px;
    left: 45%;
    -webkit-animation: movingleftright2 infinite 30000ms;
    animation: movingleftright2 infinite 30000ms;
}

.shape-group-18 .shape.shape-4 img {
    width: 75px;
    opacity: 0.5;
}

.shape-group-18 .shape.shape-5 {
    bottom: 120px;
    left: 53%;
    -webkit-animation: movingleftright1 infinite 25000ms;
    animation: movingleftright1 infinite 25000ms;
}

.shape-group-18 .shape.shape-6 {
    bottom: 100px;
    left: 40%;
    -webkit-animation: movingleftright1 infinite 35000ms;
    animation: movingleftright1 infinite 35000ms;
}

.shape-group-18 .shape.shape-7 {
    top: 0;
    right: 100px;
    z-index: -2;
    text-align: right;
}

@media only screen and (max-width: 1199px) {
    .shape-group-18 .shape.shape-7 img {
        width: 80%;
    }
}

@media only screen and (max-width: 991px) {
    .shape-group-18 .shape.shape-7 img {
        width: 60%;
    }
}

.shape-group-19 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-19 .shape.shape-1 {
    top: 0;
    right: 0;
    text-align: right;
}

@media only screen and (max-width: 991px) {
    .shape-group-19 .shape.shape-1 img {
        width: 60%;
    }
}

.shape-group-19 .shape.shape-2 {
    top: 145px;
    right: 0;
}

.shape-group-20 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-20 .shape.shape-1 {
    top: 0;
    left: 120px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-20 .shape.shape-1 {
        left: -10px;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-20 .shape.shape-1 {
        left: -10px;
    }
}

@media only screen and (max-width: 991px) {
    .shape-group-20 .shape.shape-1 img {
        width: 60%;
    }
}

.shape-group-20 .shape.shape-2 {
    bottom: 0;
    right: 0;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-20 .shape.shape-2 img {
        width: 80%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-20 .shape.shape-2 img {
        width: 75%;
    }
}

@media only screen and (max-width: 991px) {
    .shape-group-20 .shape.shape-2 {
        display: none;
    }
}

.shape-group-20 .shape.shape-3 {
    right: -10px;
    bottom: 62px;
    z-index: 2;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-20 .shape.shape-3 {
        bottom: 220px;
    }

    .shape-group-20 .shape.shape-3 img {
        width: 60%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-20 .shape.shape-3 {
        bottom: 100px;
    }

    .shape-group-20 .shape.shape-3 img {
        width: 50%;
    }
}

@media only screen and (max-width: 767px) {
    .shape-group-20 .shape.shape-3 img {
        width: 40%;
    }
}

.shape-group-20 .shape.shape-4 {
    left: 220px;
    top: 45%;
    height: 48px;
    width: 48px;
    -webkit-animation: movingleftright1 infinite 25000ms;
    animation: movingleftright1 infinite 25000ms;
}

.shape-group-20 .shape.shape-5 {
    left: 45%;
    bottom: 130px;
    height: 32px;
    width: 32px;
    -webkit-animation: movingleftright3 infinite 20000ms;
    animation: movingleftright3 infinite 20000ms;
}

.shape-group-20 .shape.shape-6 {
    left: 50%;
    top: 250px;
}

@media only screen and (max-width: 991px) {
    .shape-group-20 .shape.shape-6 {
        display: none;
    }
}

.shape-group-20 .shape.shape-7 {
    left: 65%;
    top: 180px;
    -webkit-animation: movingleftright3 infinite 20000ms;
    animation: movingleftright3 infinite 20000ms;
}

.shape-group-20 .shape.shape-8 {
    bottom: 0;
    right: 0;
}

@media only screen and (max-width: 991px) {
    .shape-group-20 .shape.shape-8 {
        display: none;
    }
}

.shape-group-20 .shape.shape-8.marque-images {
    background-image: url("../media/others/designer-text.png");
    background-repeat: repeat-x;
    background-size: auto;
    height: 250px;
    width: 52%;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-20 .shape.shape-8.marque-images {
        width: 49%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-20 .shape.shape-8.marque-images {
        width: 62%;
    }
}

.shape-group-21 .shape {
    position: absolute;
    z-index: -1;
}

.shape-group-21 .shape.shape-1 {
    top: 12px;
    left: 15px;
    width: 86px;
    filter: invert(1) brightness(1.5);
}

@media only screen and (max-width: 991px) {
    .shape-group-21 .shape.shape-1 img {
        width: 60%;
    }
}

.shape-group-21 .shape.shape-2 {
    top: 200px;
    right: 200px;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-21 .shape.shape-2 {
        top: 120px;
        right: 15px;
    }

    .shape-group-21 .shape.shape-2 img {
        width: 90%;
    }
}

@media only screen and (max-width: 1199px) {
    .shape-group-21 .shape.shape-2 {
        right: 15px;
    }

    .shape-group-21 .shape.shape-2 img {
        width: 50%;
    }
}

@media only screen and (max-width: 991px) {
    .shape-group-21 .shape.shape-2 {
        display: none;
    }
}

.shape-group-21 .shape.shape-3 {
    right: 100px;
    top: 45%;
    height: 53px;
    width: 53px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .shape-group-21 .shape.shape-3 {
        display: none;
    }
}

.shape-group-21 .shape.shape-4 {
    left: 220px;
    top: 45%;
    height: 20px;
    width: 20px;
    -webkit-animation: movingleftright1 infinite 25000ms;
    animation: movingleftright1 infinite 25000ms;
}

.shape-group-21 .shape.shape-5 {
    left: 45%;
    bottom: 130px;
    height: 20px;
    width: 20px;
    -webkit-animation: movingleftright3 infinite 20000ms;
    animation: movingleftright3 infinite 20000ms;
}

.shape-group-21 .shape.shape-6 {
    right: 230px;
    bottom: 40%;
    height: 20px;
    width: 20px;
}

@media only screen and (max-width: 1199px) {
    .shape-group-21 .shape.shape-6 {
        display: none;
    }
}

.shape-group-21 .shape.shape-7 {
    right: 250px;
    top: 40%;
    height: 20px;
    width: 20px;
}

@media only screen and (max-width: 1199px) {
    .shape-group-21 .shape.shape-7 {
        display: none;
    }
}
.shape-group-21 .shape.shape-8 {    
    top: 12px;
    right: 6px;
    width: 86px;
    filter: invert(1) brightness(1.5);
}

@-webkit-keyframes movingleftright1 {
    0% {
        -webkit-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0);
    }

    40% {
        -webkit-transform: translateX(50px) translateY(-200px);
        transform: translateX(50px) translateY(-200px);
    }

    75% {
        -webkit-transform: translateX(800px);
        transform: translateX(800px);
    }

    100% {
        -webkit-transform: translateY(0) translateX(0);
        transform: translateY(0) translateX(0);
    }
}

@keyframes movingleftright1 {
    0% {
        -webkit-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0) rotate(15deg);
    }

    40% {
        -webkit-transform: translateX(50px) translateY(-200px);
        transform: translateX(50px) translateY(-200px) rotate(103deg);
    }

    75% {
        -webkit-transform: translateX(800px);
        transform: translateX(800px) translateY(-200px)rotate(314deg);
    }

    100% {
        -webkit-transform: translateY(0) translateX(0);
        transform: translateY(0) translateX(0) rotate(334deg);
    }
}

@-webkit-keyframes movingleftright2 {
    0% {
        -webkit-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0);
    }

    40% {
        -webkit-transform: translateX(-50px) translateY(200px);
        transform: translateX(-50px) translateY(200px);
    }

    75% {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);
    }

    100% {
        -webkit-transform: translateY(0) translateX(0);
        transform: translateY(0) translateX(0);
    }
}

@keyframes movingleftright2 {
    0% {
        -webkit-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0);
    }

    40% {
        -webkit-transform: translateX(-50px) translateY(200px);
        transform: translateX(-50px) translateY(200px);
    }

    75% {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);
    }

    100% {
        -webkit-transform: translateY(0) translateX(0);
        transform: translateY(0) translateX(0);
    }
}

@-webkit-keyframes movingleftright3 {
    0% {
        -webkit-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0);
    }

    40% {
        -webkit-transform: translateX(100px) translateY(-200px);
        transform: translateX(100px) translateY(-200px);
    }

    75% {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);
    }

    100% {
        -webkit-transform: translateY(0) translateX(0);
        transform: translateY(0) translateX(0);
    }
}

@keyframes movingleftright3 {
    0% {
        -webkit-transform: translateX(0) translateY(0);
        transform: translateX(0) translateY(0);
    }

    40% {
        -webkit-transform: translateX(100px) translateY(-200px);
        transform: translateX(100px) translateY(-200px);
    }

    75% {
        -webkit-transform: translateX(-500px);
        transform: translateX(-500px);
    }

    100% {
        -webkit-transform: translateY(0) translateX(0);
        transform: translateY(0) translateX(0);
    }
}

.my_switcher {
    position: fixed;
    top: 200px;
    left: 0;
    background-color: var(--color-primary);
    border-radius: 0 30px 30px 0;
    padding: 10px;
    z-index: 5;
}

@media only screen and (max-width: 991px) {
    .my_switcher {
        position: initial;
        display: none;
    }
}

.my_switcher ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.my_switcher ul li a {
    text-align: center;
    color: var(--color-white);
    font-size: 18px;
    height: 40px;
    width: 40px;
    line-height: 40px;
    border: 1px solid transparent;
    border-radius: 50%;
}

@media only screen and (max-width: 991px) {
    .my_switcher ul li a {
        font-size: 16px;
        height: 30px;
        width: 42px;
        line-height: 30px;
        top: -5px;
        right: -1px;
        position: relative;
        filter: brightness(1.25) drop-shadow(2px 4px 6px black);
    }
}

.my_switcher ul li a.active {
    color: var(--color-rose);
    display: none;
}

.main-wrapper {
    overflow: hidden;
    background-color: var(--color-white);
}

/*-------------------------
    Slick
-------------------------*/
.slick-list {
    margin: 0 -15px;
}

.slick-list .slick-slide {
    padding: 0 15px;
}

.slick-dotted.slick-slider {
    margin-bottom: 0;
}

.slick-dot-nav .slick-dots {
    bottom: 0;
    text-align: left;
    margin: 0 -10px;
}

.slick-dot-nav .slick-dots li {
    margin: 0 10px;
    height: 11px;
    width: 11px;
}

.slick-dot-nav .slick-dots li button {
    border: none;
    background-color: #DBDEFF;
    border-radius: 50%;
    height: 11px;
    width: 11px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.slick-dot-nav .slick-dots li button::before {
    display: none;
}

.slick-dot-nav .slick-dots li.slick-active button {
    background-color: var(--color-primary);
}

.slick-arrow-nav .slick-arrow {
    height: 40px;
    width: 40px;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    z-index: 1;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.slick-arrow-nav .slick-arrow::before {
    font-family: var(--font-awesome);
    opacity: 1;
    font-size: 16px;
}

.slick-arrow-nav .slick-arrow:hover {
    background-color: rgb(0, 0, 0);
}

.slick-arrow-nav .slick-arrow.slick-next {
    right: 50px;
}

@media only screen and (max-width: 767px) {
    .slick-arrow-nav .slick-arrow.slick-next {
        right: 20px;
    }
}

.slick-arrow-nav .slick-arrow.slick-next::before {
    content: "\f105";
}

.slick-arrow-nav .slick-arrow.slick-prev {
    left: 50px;
}

@media only screen and (max-width: 767px) {
    .slick-arrow-nav .slick-arrow.slick-prev {
        left: 20px;
    }
}

.slick-arrow-nav .slick-arrow.slick-prev::before {
    content: "\f104";
}

/*=======================================================================
3. Template Styles
=========================================================================*/
/*-------------------------
   About Us
-------------------------*/
.about-us .section-heading p {
    width: 100%;
}

.contact-form-box {
    background-color: var(--color-white);
    padding: 50px;
    border-radius: 30px;
}

@media only screen and (max-width: 767px) {
    .contact-form-box {
        padding: 40px 30px;
    }
}

.contact-form-box .title {
    font-size: 40px!important;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .contact-form-box .title {
        font-size: 36px;
    }
}

@media only screen and (max-width: 1199px) {
    .contact-form-box .title {
        font-size: 32px;
    }
}

@media only screen and (max-width: 767px) {
    .contact-form-box .title {
        font-size: 28px;
    }
}

.contact-form-box .form-group .axil-btn::after {
    width: calc(100% + 50px);
}

.contact-form-box.shadow-box {
    box-shadow: 0 20px 48px 0 rgba(153, 161, 170, 0.25);
}

.about-expert {
    text-align: center;
    position: relative;
}

.about-expert .thumbnail {
    position: relative;
    display: inline-block;
    border-radius: 40px;
    box-shadow: 0px 17px 26px 0px rgba(0, 0, 0, 0.2);
}

.about-expert .thumbnail img {
    border-radius: 40px;
}

.about-expert .thumbnail .popup-video {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.about-expert .thumbnail .popup-video .play-btn {
    height: 150px;
    width: 150px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.8);
    border-radius: 50%;
    margin: 0 auto;
    font-size: 32px;
    color: var(--color-white);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.about-expert .thumbnail .popup-video .play-btn:hover {
    background-color: var(--color-primary);
}

@media only screen and (max-width: 991px) {
    .about-expert .thumbnail .popup-video .play-btn {
        height: 120px;
        width: 120px;
        font-size: 28px;
    }
}

@media only screen and (max-width: 767px) {
    .about-expert .thumbnail .popup-video .play-btn {
        height: 80px;
        width: 80px;
        font-size: 24px;
    }
}

@media only screen and (max-width: 1199px) {
    .about-expert .frame-shape {
        display: none;
    }
}

.about-expert .frame-shape .shape {
    position: absolute;
}

.about-expert .frame-shape .shape.shape-1 {
    left: -10px;
    bottom: 75px;
}

.about-expert .frame-shape .shape.shape-2 {
    bottom: 190px;
    right: -30px;
}

.about-quality {
    margin-bottom: 60px;
}

.about-quality .sl-number {
    text-align: center;
    height: 80px;
    width: 80px;
    line-height: 80px;
    border-radius: 50%;
    background: -webkit-linear-gradient(left, #565677 0%, rgba(39, 39, 46, 0) 70.31%);
    background: linear-gradient(90deg, #565677 0%, rgba(39, 39, 46, 0) 70.31%);
    color: var(--color-white);
    margin-bottom: 40px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.about-quality .title {
    color: var(--color-white);
}

.about-quality p {
    opacity: 0.5;
    color: var(--color-white);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.about-quality:hover .sl-number, .about-quality.active .sl-number {
    background-color: var(--color-primary);
}

.about-quality:hover p, .about-quality.active p {
    opacity: 1;
}

.about-team .section-heading p {
    width: 100%;
    margin-bottom: 50px;
}

.about-team .axil-btn {
    width: 240px;
}

.about-team .thumbnail {
    padding-right: 100px;
}

/*-------------------------
    Banner
-------------------------*/
.banner {
    margin-top: -160px;
    padding: 200px 0 0;
    position: relative;
    z-index: 2;
    min-height: 800px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner {
        padding: 220px 0 0;
        margin-top: -130px;
    }
}

@media only screen and (max-width: 1199px) {
    .banner {
        padding: 200px 0 0;
        min-height: 100%;
    }
}

@media only screen and (max-width: 991px) {
    .banner {
        margin-top: -115px;
        padding: 160px 0 0;
    }
}

@media only screen and (max-width: 767px) {
    .banner {
        margin-top: -115px;
        padding: 150px 0 0;
    }
}

@media only screen and (max-width: 991px) {
    .banner .banner-content {
        margin-bottom: 90px;
    }
}

@media only screen and (max-width: 767px) {
    .banner .banner-content {
        margin-bottom: 60px;
    }
}

@media only screen and (max-width: 575px) {
    .banner .banner-content {
        margin-bottom: 40px;
    }
}

.banner .banner-content .title {
    font-size: 80px;
    font-weight: 700;
    color: var(--color-dark);
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner .banner-content .title {
        font-size: 68px;
    }
}

@media only screen and (max-width: 1199px) {
    .banner .banner-content .title {
        font-size: 60px;
    }
}

@media only screen and (max-width: 991px) {
    .banner .banner-content .title {
        font-size: 55px;
    }
}

@media only screen and (max-width: 767px) {
    .banner .banner-content .title {
        font-size: 40px!important;
    }
}

.banner .banner-content .subtitle {
    font-size: var(--font-body-1);
    margin-bottom: 40px;
    width: 90%;
}

.banner .banner-content .axil-btn {
    padding: 28px 45px;
    box-shadow: 0 44px 84px -24px #5956e9;
}

@media only screen and (max-width: 991px) {
    .banner .banner-content .axil-btn {
        padding: 20px 35px;
    }
}

.banner .banner-content .btn-group {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

@media only screen and (max-width: 575px) {
    .banner .banner-content .btn-group {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
}

.banner .banner-content .btn-group a {
    margin-right: 40px;
}

@media only screen and (max-width: 575px) {
    .banner .banner-content .btn-group a {
        margin-right: 0;
        margin-bottom: 30px;
    }
}

.banner .banner-content .btn-group a:last-child {
    margin-right: 0;
    margin-bottom: 0;
}

.banner .banner-content .about-btn {
    font-weight: 500;
    color: var(--color-primary);
    position: relative;
    padding-left: 50px;
}

.banner .banner-content .about-btn::before {
    content: "";
    height: 1px;
    width: 34px;
    background-color: var(--color-primary);
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.banner .banner-content .about-btn:hover::before {
    width: 100%;
}

.banner .banner-thumbnail {
    position: relative;
}

.banner .banner-social {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.banner .banner-social .border-line {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 1px;
    width: 100%;
    background-color: var(--color-body);
    margin-right: 30px;
}

@media only screen and (max-width: 575px) {
    .banner .banner-social .border-line {
        display: none;
    }
}

.banner .banner-social .social-icon {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.banner .banner-social .social-icon li {
    margin-right: 20px;
}

.banner .banner-social .social-icon li:last-child {
    margin-right: 0;
}

.banner .banner-social .social-icon li a {
    color: var(--color-body);
}

.banner .banner-social .social-icon li a i {
    margin-right: 8px;
    font-size: 20px;
    color: var(--color-gray-4);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.banner .banner-social .social-icon li a:hover {
    color: var(--color-primary);
}

.banner .banner-social .social-icon li a:hover i {
    color: var(--color-primary);
}

.banner.banner-style-1 .banner-content {
    margin-top: 85px;
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-1 .banner-content {
        padding-bottom: 100px;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-1 .banner-content {
        margin-top: 0;
        padding-bottom: 0;
    }
}

.banner.banner-style-1 .banner-content .title {
    font-size: 78px;
    line-height: 1;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-1 .banner-content .title {
        font-size: 68px;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-1 .banner-content .title {
        font-size: 60px;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-1 .banner-content .title {
        font-size: 55px;
    }
}

@media only screen and (max-width: 767px) {
    .banner.banner-style-1 .banner-content .title {
        font-size: 40px!important;
    }
}

.banner.banner-style-1 .banner-thumbnail {
    z-index: 5;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-1 .banner-thumbnail .large-thumb img {
        width: 74%;
    }
}

.banner.banner-style-1 .banner-thumbnail .large-thumb-2 {
    text-align: right;
    margin-top: -303px;
    margin-right: -3px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-1 .banner-thumbnail .large-thumb-2 img {
        width: 85%;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-1 .banner-thumbnail .large-thumb-2 {
        margin-top: -200px;
        margin-right: -30px;
    }

    .banner.banner-style-1 .banner-thumbnail .large-thumb-2 img {
        width: 60%!important;
    }

    .banner.banner-style-1 .banner-thumbnail .large-thumb {
        text-align: center!important;
        z-index: 100;
        position: relative;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-1 .banner-thumbnail .large-thumb-2 {
        margin-top: -260px;
        margin-right: 0;
    }
}

@media only screen and (max-width: 767px) {
    .banner.banner-style-1 .banner-thumbnail .large-thumb-2 {
        margin-top: 0;
        text-align: center;
        position: absolute;
        bottom: 0;
    }
}

.banner.banner-style-1 .banner-thumbnail .shape-group .shape {
    position: absolute;
}

.banner.banner-style-1 .banner-thumbnail .shape-group .shape.shape-1 {
    top: -25px;
    right: 20px;
    left: auto;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-1 .banner-thumbnail .shape-group .shape.shape-1 {
        right: 0;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-1 .banner-thumbnail .shape-group .shape.shape-1 {
        /*display: none;*/
        z-index:1;
    }
}

.banner.banner-style-2 {
    margin: 0 95px;
    padding: 250px 0 300px 200px;
    background-color: var(--color-link);
    border-radius: 60px;
    overflow: hidden;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-2 {
        padding: 150px 0 200px 100px;
        min-height: 600px;
        margin: 0 30px;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-2 {
        margin: 0 30px;
        padding: 150px 60px;
        min-height: 600px;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-2 {
        min-height: 100%;
    }
}

@media only screen and (max-width: 767px) {
    .banner.banner-style-2 {
        padding: 80px 30px;
    }
}

@media only screen and (max-width: 575px) {
    .banner.banner-style-2 {
        margin: 0 15px;
    }
}

.banner.banner-style-2 .banner-content {
    margin-bottom: 0;
}

.banner.banner-style-2 .banner-content .title {
    color: var(--color-white);
    margin-bottom: 40px;
}

.banner.banner-style-3 {
    padding: 220px 0 210px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-3 {
        padding: 180px 0 160px;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-3 {
        padding: 200px 0 150px;
    }
}

@media only screen and (max-width: 767px) {
    .banner.banner-style-3 {
        padding: 150px 0 100px;
    }
}

.banner.banner-style-3 .banner-content {
    position: relative;
    z-index: 1;
}

.banner.banner-style-3 .banner-content .subtitle {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-rose);
    letter-spacing: 0.1em;
    font-family: var(--font-primary);
    margin-bottom: 30px;
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-3 .banner-content .subtitle {
        font-size: 16px;
    }
}

.banner.banner-style-3 .banner-content .title {
    margin-bottom: 60px;
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-3 .banner-content .title {
        margin-bottom: 40px;
    }
}

.banner.banner-style-3 .banner-thumbnail {
    margin-right: -120px;
    text-align: right;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-3 .banner-thumbnail {
        margin-right: 0;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-3 .banner-thumbnail {
        margin-right: 0;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-3 .banner-thumbnail {
        text-align: left;
    }
}

.banner.banner-style-4 {
    background: -webkit-linear-gradient(left, #ECF2F6 0%, rgba(236, 242, 246, 0) 70.31%);
    background: linear-gradient(90deg, #ECF2F6 0%, rgba(236, 242, 246, 0) 70.31%);
    padding: 310px 0 100px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-4 {
        padding: 250px 0 100px;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-4 {
        padding: 250px 0 100px;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-4 {
        padding: 180px 0 80px;
        min-height: 100%;
    }
}

@media only screen and (max-width: 767px) {
    .banner.banner-style-4 {
        padding: 150px 0 60px;
    }
}

.banner.banner-style-4 .banner-content {
    margin-bottom: 200px;
    position: relative;
    z-index: 1;
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-4 .banner-content {
        margin-bottom: 100px;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-4 .banner-content {
        margin-bottom: 0;
    }
}

.banner.banner-style-4 .banner-content .title {
    width: 60%;
    margin-bottom: 50px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-4 .banner-content .title {
        font-size: 70px;
        width: 55%;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-4 .banner-content .title {
        font-size: 70px;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-4 .banner-content .title {
        font-size: 60px;
        width: 100%;
    }
}

@media only screen and (max-width: 767px) {
    .banner.banner-style-4 .banner-content .title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 575px) {
    .banner.banner-style-4 .banner-content .title {
        font-size: 40px;
        margin-bottom: 30px;
    }
}

.banner.banner-style-4 .banner-content p {
    font-size: var(--font-body-1);
    width: 50%;
    margin-bottom: 40px;
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-4 .banner-content p {
        width: 100%;
    }
}

.banner.banner-style-4 .banner-thumbnail {
    position: absolute;
    top: 45%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-4 .banner-thumbnail {
        right: -300px;
    }

    .banner.banner-style-4 .banner-thumbnail img {
        width: 85%;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-4 .banner-thumbnail {
        right: -570px;
    }

    .banner.banner-style-4 .banner-thumbnail img {
        width: 60%;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-4 .banner-thumbnail {
        position: initial;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
        text-align: center;
        margin: -20px 0 20px;
    }

    .banner.banner-style-4 .banner-thumbnail img {
        width: 100%;
    }
}

@media only screen and (max-width: 575px) {
    .banner.banner-style-4 .banner-thumbnail {
        margin: 0 0 20px;
    }
}

.banner.banner-style-5 {
    background-image: url("../media/banner/banner-bg-1.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 310px 0 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .banner.banner-style-5 {
        padding: 250px 0 0;
        min-height: 750px;
    }
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-5 {
        padding: 230px 0 0;
        min-height: 750px;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-5 {
        padding: 170px 0 80px;
        min-height: 100%;
    }
}

@media only screen and (max-width: 767px) {
    .banner.banner-style-5 {
        padding: 150px 0 60px;
        min-height: 100%;
    }
}

.banner.banner-style-5::after {
    content: "";
    height: 100%;
    width: 100%;
    background-color: rgba(41, 41, 48, 0.8);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-5 .banner-content {
        margin-bottom: 40px;
    }
}

.banner.banner-style-5 .banner-content .title {
    color: var(--color-white);
    margin-bottom: 50px;
}

@media only screen and (max-width: 1199px) {
    .banner.banner-style-5 .banner-content .title {
        font-size: 70px;
    }
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-5 .banner-content .title {
        font-size: 60px;
    }
}

@media only screen and (max-width: 767px) {
    .banner.banner-style-5 .banner-content .title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 575px) {
    .banner.banner-style-5 .banner-content .title {
        font-size: 40px;
        margin-bottom: 40px;
    }
}

.banner.banner-style-5 .banner-content .axil-btn {
    color: var(--color-text-dark);
    box-shadow: none;
}

.banner.banner-style-5 .banner-form {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-bottom: -140px;
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-5 .banner-form {
        margin-bottom: 0;
        display: block;
    }
}

.banner.banner-style-5 .banner-form .contact-form-box {
    max-width: 450px;
}

@media only screen and (max-width: 991px) {
    .banner.banner-style-5 .banner-form .contact-form-box {
        max-width: 100%;
    }
}

.banner.banner-style-5 .banner-form .title {
    letter-spacing: -0.045em;
}

/*-------------------------
   Brand
-------------------------*/
.brand-wrap-area {
    padding: 90px 0;
}

.brand-grid {
    padding: 10px 0;
}

.brand-grid img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity: 0.3;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.brand-grid:hover img, .brand-grid.active img {
    opacity: 1;
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}

/*-------------------------
   Call To Action
-------------------------*/
.call-to-action-area {
    padding: 140px 0 100px;
    position: relative;
    z-index: 1;
}

@media only screen and (max-width: 1199px) {
    .call-to-action-area {
        padding: 100px 0;
    }
}

@media only screen and (max-width: 991px) {
    .call-to-action-area {
        padding: 80px 0;
    }
}

@media only screen and (max-width: 767px) {
    .call-to-action-area {
        padding: 60px 0 40px;
    }
}

.call-to-action-area:before {
    content: "";
    height: 730px;
    width: 100%;
    background-color: var(--color-primary);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: -1;
}

@media only screen and (max-width: 991px) {
    .call-to-action-area:before {
        height: 500px;
    }
}

@media only screen and (max-width: 767px) {
    .call-to-action-area:before {
        height: 480px;
    }
}

@media only screen and (max-width: 575px) {
    .call-to-action-area:before {
        height: 400px;
        border-radius: 0 0 72px 72px;
    }
}

.call-to-action {
    border-bottom: 1px solid #e7e7e7;
}

.call-to-action .section-heading {
    margin-bottom: 65px;
}

@media only screen and (max-width: 767px) {
    .call-to-action .section-heading {
        margin-bottom: 50px;
    }
}

.call-to-action .section-heading span {
    color: var(--color-accent1);
}

.call-to-action .section-heading .title {
    width: 60%;
    margin: 0 auto 55px;
}

@media only screen and (max-width: 991px) {
    .call-to-action .section-heading .title {
        width: 100%;
    }
}

.call-to-action .thumbnail {
    position: relative;
    text-align: center;
}

.call-to-action .thumbnail .larg-thumb {
    display: inline-block;
}


@media only screen and (max-width: 1199px) {
    .call-to-action .thumbnail .larg-thumb img {
        width: 90%;
    }
}

@media only screen and (max-width: 991px) {
    .call-to-action .thumbnail .larg-thumb img {
        width: 70%;
    }
}

@media only screen and (max-width: 767px) {
    .call-to-action .thumbnail .larg-thumb img {
        width: 50%;
    }
}

@media only screen and (max-width: 575px) {
    .call-to-action .thumbnail .larg-thumb img {
        width: 50%;
    }
}

.call-to-action .thumbnail .small-thumb li {
    position: absolute;
}

@media only screen and (max-width: 1199px) {
    .call-to-action .thumbnail .small-thumb li img {
        width: 90%;
    }
}

@media only screen and (max-width: 991px) {
    .call-to-action .thumbnail .small-thumb li img {
        width: 70%;
    }
}

@media only screen and (max-width: 767px) {
    .call-to-action .thumbnail .small-thumb li img {
        width: 35%;
    }
}

.call-to-action .thumbnail .small-thumb li.shape-1 {
    bottom: 0;
    left: 155px;
}

@media only screen and (min-width: 1200px) and (max-width: 1299px) {
    .call-to-action .thumbnail .small-thumb li.shape-1 {
        left: 90px;
    }
}

@media only screen and (max-width: 1199px) {
    .call-to-action .thumbnail .small-thumb li.shape-1 {
        left: 15px;
    }
}

@media only screen and (max-width: 991px) {
    .call-to-action .thumbnail .small-thumb li.shape-1 {
        left: -50px;
    }
}

@media only screen and (max-width: 767px) {
    .call-to-action .thumbnail .small-thumb li.shape-1 {
        left: -70px;
    }
}

@media only screen and (max-width: 575px) {
    .call-to-action .thumbnail .small-thumb li.shape-1 {
        left: -125px;
    }
}

.call-to-action .thumbnail .small-thumb li.shape-2 {
    bottom: 0;
    right: 80px;
}

@media only screen and (min-width: 1200px) and (max-width: 1299px) {
    .call-to-action .thumbnail .small-thumb li.shape-2 {
        right: 30px;
    }
}

@media only screen and (max-width: 1199px) {
    .call-to-action .thumbnail .small-thumb li.shape-2 {
        bottom: 0;
        right: -60px;
    }
}

@media only screen and (max-width: 991px) {
    .call-to-action .thumbnail .small-thumb li.shape-2 {
        right: -95px;
    }
}

@media only screen and (max-width: 767px) {
    .call-to-action .thumbnail .small-thumb li.shape-2 {
        right: -110px;
    }
}

@media only screen and (max-width: 575px) {
    .call-to-action .thumbnail .small-thumb li.shape-2 {
        right: -130px;
    }
}

/*-------------------------
   Case Study
-------------------------*/
.case-study-featured {
    margin-bottom: 60px;
}

.case-study-featured .section-heading .title {
    letter-spacing: -0.045em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    padding-bottom: 5px;
}

@media only screen and (max-width: 575px) {
    .case-study-featured .section-heading .title {
        -webkit-line-clamp: 2;
    }
}

.case-study-featured .section-heading p {
    width: 100%;
    font-size: 16px;
}

.case-study-counterup {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.case-study-counterup .single-counterup {
    margin-right: 60px;
    padding-right: 60px;
    border-right: 1px solid var(--color-ghost);
}

.case-study-counterup .single-counterup:last-child {
    margin-right: 0;
    padding-right: 0;
    border-right: none;
}

@media only screen and (max-width: 1199px) {
    .case-study-counterup .single-counterup {
        margin-right: 40px;
        padding-right: 40px;
    }
}

@media only screen and (max-width: 575px) {
    .case-study-counterup .single-counterup {
        margin-right: 30px;
        padding-right: 30px;
    }
}

.case-study-counterup .count-number {
    color: var(--bs-link-color);
    letter-spacing:0;
    margin-bottom: 0;
    padding: 0 6px;
    font-family: var(--font-primary);
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .case-study-counterup .count-number {
        padding: 0 2px;
    }
}

@media only screen and (max-width: 1199px) {
    .case-study-counterup .count-number {
        padding: 0;
    }
}

.case-study-counterup .count-number span {
    vertical-align: middle;
}

.case-study-counterup .count-number span.symbol {
    margin-left: -6px;
}

.case-study-featured-thumb {
    text-align: right;
}

@media only screen and (max-width: 991px) {
    .case-study-featured-thumb {
        text-align: left;
        margin-bottom: 30px;
    }
}

.case-study-featured-thumb img {
    display: inline-block;
}

.case-study-page-area .case-study-featured-thumb {
    margin-bottom: 150px;
}

@media only screen and (max-width: 991px) {
    .case-study-page-area .case-study-featured-thumb {
        margin-bottom: 60px;
    }
}

.case-study-solution {
    position: relative;
    z-index: 1;
}

.case-study-solution .section-heading p {
    width: 100%;
}

/*-------------------------
    Contact
-------------------------*/
.office-location {
    margin-bottom: 30px;
}

.office-location .thumbnail {
    margin-bottom: 30px;
}

.office-location .thumbnail img {
    width: 100%;
}

.office-location .content .title {
    color: var(--color-white);
    margin-bottom: 20px;
}

.office-location .content p {
    color: var(--color-gray-2);
    width: 70%;
}

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

.novosti img {
  width: 60px;
  height: 60px;
  border-radius: 35px;
  display: block;
  position: absolute;
  z-index: 20;
  backface-visibility: hidden;
  margin-left: -2rem;
  border: 2px solid rgb(195, 183, 145); 
}

.novosti ul {
 padding: 12px 0px 0px 0px;
 margin-left: 2rem;
 margin-bottom: 2rem;
}

.novosti li{
  float: left;
  margin: 0 40px 0 0;
  list-style-type: none;
}

 

.contact-info {
    /* background-color: #3b3b8d; */
    background: linear-gradient(45deg, #3b3b8d 27%, #223b94 44%, #3b3b8d 66%);
    border-radius: 25px;
    padding: 60px 50px;
    box-shadow: 0 9px 18px 0 rgba(0, 0, 0, 0.25);
    corner-shape: scoop;
    border: 2px solid #c3b791;
    @media only screen and (max-width: 600px) { padding: 30px; border-radius: 14px; }
}

.contact-info .title {
    color: var(--color-white);
    margin-bottom: 20px;
}

.contact-info p {
    color: var(--color-gray-2);
    width: 80%;
}

.contact-info .phone-number {
    font-size: 28px;
    color: #fae2b8;
    margin-bottom: 0;
}

@media only screen and (max-width: 1199px) {
    .contact-info .phone-number {
        font-size: 25px;
    }
}

@media only screen and (max-width: 991px) {
    .contact-info .phone-number {
        font-size: 25px;
    }
}

@media only screen and (max-width: 767px) {
    .contact-info .phone-number {
        font-size: 18px!important;
    }
}

.contact-info .phone-number a:hover {
    color: var(--color-white);
}

.contact-address .section-heading {
    margin-bottom: 180px;
}

@media only screen and (max-width: 991px) {
    .contact-address .section-heading {
        margin-bottom: 80px;
    }
}

.contact-address .section-heading .title {
    width: 100%;
}

.contact-address .address {
    margin-bottom: 40px;
}

.contact-address .address:last-child {
    margin-bottom: 0;
}

.contact-address .address .title {
    color: var(--color-white);
    font-weight: 700;
    margin-bottom: 10px;
}

.contact-address .address p {
    font-family: var(--font-primary);
    font-weight: 500;
    font-size: 24px;
    color: var(--color-gray-2);
    width: 50%;
    margin-bottom: 0;
}

@media only screen and (max-width: 991px) {
    .contact-address .address p {
        font-size: 18px;
        width: 80%;
    }
}

.contact-address .address p a {
    color: var(--color-gray-2);
}

.contact-address .address p a:hover {
    color: var(--color-white);
}

/*-------------------------
   Counter Up
-------------------------*/
.counterup-progress {
    background: transparent;
    border: 1px solid;
    border-image-source: linear-gradient(0deg, #27272E 64.45%, rgba(74, 75, 86, 0.72) 100%);
    text-align: center;
    padding: 70px 20px 60px;
    border-radius: 30px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
    .counterup-progress {
        padding: 40px 20px;
    }
}

@media only screen and (max-width: 575px) {
    .counterup-progress {
        padding: 30px 10px;
    }
}

.counterup-progress .icon {
    margin-bottom: 20px;
}

.counterup-progress .count-number {
    font-weight: 500;
    color: var(--color-primary);
    font-family: var(--font-primary);
    margin-bottom: 10px;
    letter-spacing: -0.045em;
}

@media only screen and (max-width: 767px) {
    .counterup-progress .count-number {
        letter-spacing: 0;
    }
}

.counterup-progress .count-number span.symbol {
    margin: 0 -6px;
}

.counterup-progress .title {
    color: var(--color-white);
}

.counterup-progress:hover, .counterup-progress.active {
    background: var(--gradient-dark);
}

.counterup-progress.counterup-style-2 {
    background: var(--gradient-primary);
    border: none;
}

.counterup-progress.counterup-style-2 .icon .light-icon {
    display: none;
}

.counterup-progress.counterup-style-2 .title {
    color: var(--color-body);
}

.counterup-progress.counterup-style-2:hover, .counterup-progress.counterup-style-2.active {
    background-color: var(--color-light);
}

.expert-counterup-area .section-heading p {
    width: 100%;
}

.expert-counterup-area .section-heading .axil-btn {
    width: 240px;
}

/*-------------------------
    FAQ
-------------------------*/
.faq-area .section-heading .title {
    font-size: 48px;
    margin-bottom: 40px;
}

@media only screen and (max-width: 575px) {
    .faq-area .section-heading .title {
        font-size: 38px;
    }
}

.faq-area .section-heading p {
    width: 100%;
}

.faq-accordion .accordion-item {
    background-color: var(--color-white);
    border-radius: 24px;
    border: none;
    margin-bottom: 20px;
    box-shadow: 0 10px 48px -30px rgb(153, 161, 170);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.faq-accordion .accordion-item:last-child {
    margin-bottom: 0;
}

.faq-accordion .accordion-item:last-child .accordion-button.collapsed {
    margin-bottom: 0;
}

.faq-accordion .accordion-button {
    box-shadow: none;
    font-size: var(--font-body-1);
    color: var(--color-primary);
    font-weight: 500;
    font-family: var(--font-primary);
    padding: 30px 40px 20px;
    position: relative;
    border-radius: 0 !important;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    background-color: transparent;
}

.faq-accordion .accordion-button:after {
    content: "\f068";
    font-family: var(--font-awesome);
    background-image: none;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    width: auto;
    color: var(--color-primary);
    -webkit-transition: var(--transition);
    transition: var(--transition);
    padding-left: 10px;
}

.faq-accordion .accordion-button.collapsed {
    color: var(--color-dark);
    border-radius: 24px !important;
    padding: 30px 40px;
    background-color: #f8f8f8;
    margin-bottom: -10px;
}

.faq-accordion .accordion-button.collapsed:after {
    content: "\f067";
    color: var(--color-dark);
}

.faq-accordion .accordion-body {
    padding: 0 40px 40px;
}

.faq-accordion .accordion-body p {
    color: var(--color-gray-1);
    margin-bottom: 0;
}

/*-------------------------
   Pricing
-------------------------*/
.pricing-table {
    background-color: var(--color-white);
    padding: 40px;
    border-radius: 30px;
    position: relative;
    margin-bottom: 30px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    /* background: radial-gradient(circle at 36% 212%, #ebfffda8 43%, #558ea86b 61%, #ffffff00 67%), linear-gradient(0deg, #d5d7ffbf, #ffffff78);
    box-shadow: -8px 6px 14px -5px #d2c7ff, inset 0 0 5px #fff; */
    box-shadow: inset 0 0 26px #fff !important;
    background: radial-gradient(circle at 80% 197%, #48749ed4 43%, rgb(130 255 240 / 42%) 61%, rgb(95 163 161 / 41%) 67%), linear-gradient(0deg, rgb(237 213 255 / 75%), rgb(8 9 255 / 47%));
    background-color: #ffffff00;
}
.free-card {
  padding: 3px!important;
  border: 1px solid #ffc737;
  border-radius: 2rem ! Important;
  background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%);
  height: min-content;
  /* margin-top: 2rem; */
}
.free-card .pricing-table {
   background: radial-gradient(circle at 36% 212%, #ebfffda8 43%, #558ea86b 61%, #ffffff00 67%), linear-gradient(0deg, #d5d7ffbf, #ffffff78);
   background-color: #cecece;
    /* padding: 17px 30px; */
    padding: 17px 36px;
    border: 1px solid #ffc737;
    border-radius: 2rem ! Important;
    justify-content: space-evenly;
    display: flex;
    flex-direction: column;
    box-shadow: inset 0 0 3px #726969!important;
    margin-bottom: 10px;
    height: fit-content;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .pricing-table {
        padding: 40px 15px;
    }
}

@media only screen and (max-width: 575px) {
    .pricing-table {
        padding: 40px 30px;
    }
}

.pricing-table .pricing-header {
    text-align: center;
}

.pricing-table .pricing-header .title {
    color: var(--color-primary);
    font-weight: 400;
    font-size: 40px;
    margin-bottom: 8px;
    letter-spacing: -0.045em;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 1199px) {
    .pricing-table .pricing-header .title {
        font-size: 36px;
    }
}

@media only screen and (max-width: 575px) {
    .pricing-table .pricing-header .title {
        font-size: 30px;
    }
}

.pricing-table .pricing-header .subtitle {
    font-size: 14px;
    color: #e0e0ff;
    font-family: 'Unbounded';
    -webkit-transition: var(--transition);
    transition: var(--transition);
    margin-bottom: 20px;
}

.pricing-table .pricing-header .price-wrap {
    border-top: 1px solid rgb(227, 230, 233);
    padding-top: 50px;
    margin-bottom: 30px;
    font-family: var(--font-primary);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.pricing-table .pricing-header .price-wrap .amount {
    font-size: 54px;
    line-height: 1;
    color: #d4d4ffa1;
    background: linear-gradient(44deg, #11fff6de, transparent) text;
    font-weight: 500;
    letter-spacing: -0.045em;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 1199px) {
    .pricing-table .pricing-header .price-wrap .amount {
        font-size: 50px;
    }
}

@media only screen and (max-width: 575px) {
    .pricing-table .pricing-header .price-wrap .amount {
        font-size: 40px;
    }
}
@media (min-width: 992px) and (max-width: 1100px) {
    .pricing-table .pricing-header .price-wrap .amount {
        font-size: 34px!important;
    }
}
.pricing-table .pricing-header .price-wrap .duration {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-gray-2);
    margin-left: 8px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.pricing-table .pricing-header .price-wrap .yearly-pricing {
    display: none;
}

.pricing-table .pricing-body {
    margin-top: 30px;
}

.pricing-table .pricing-body li {
    padding: 12px 0;
    /* color: var(--color-gray-2); */
    color: #535a6b;
    padding-left: 34px;
    position: relative;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.pricing-table .pricing-body li:before {
    content: "\f00c";
    font-family: var(--font-awesome);
    font-weight: 900;
    position: absolute;
    top: 10px;
    left: 0;
}

.pricing-table .star-icon {
    height: 48px;
    width: 48px;
    line-height: 48px;
    text-align: center;
    color: var(--color-primary);
    background-color: var(--color-accent1);
    border-radius: 50%;
    position: absolute;
    top: 8px;
    right: 10px;
}

.pricing-table:hover, .pricing-table.active {
    background-color: var(--color-primary);
}

.pricing-table:hover .pricing-header .title, .pricing-table.active .pricing-header .title {
    color: var(--color-white);
}

.pricing-table:hover .pricing-header .subtitle, .pricing-table.active .pricing-header .subtitle {
    color: var(--color-white);
}

.pricing-table:hover .pricing-header .price-wrap, .pricing-table.active .pricing-header .price-wrap {
    border-color: rgba(227, 230, 233, 0.2);
}

.pricing-table:hover .pricing-header .price-wrap .amount, .pricing-table.active .pricing-header .price-wrap .amount {
    color: var(--color-white);
}

.pricing-table:hover .pricing-header .price-wrap .duration, .pricing-table.active .pricing-header .price-wrap .duration {
    color: var(--color-white);
}

.pricing-table:hover .pricing-header .axil-btn, .pricing-table.active .pricing-header .axil-btn {
    background-color: var(--color-white);
    border-color: var(--color-white);
    color: var(--color-dark);
}

.pricing-table:hover .pricing-header .axil-btn:hover, .pricing-table.active .pricing-header .axil-btn:hover {
    background-color: var(--color-accent1);
    border-color: var(--color-accent1);
    color: var(--color-white);
}

.pricing-table:hover .pricing-body li, .pricing-table.active .pricing-body li {
    color: var(--color-white);
}

.pricing-table.pricing-borderd {
    border: var(--border-light);
}

.pricing-billing-duration {
    text-align: center;
}

.pricing-billing-duration ul {
    list-style: none;
    padding: 5px;
    margin-bottom: 60px;
    border-bottom: none;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--color-white);
    border: 1px solid #E3E6E9;
    border-radius: 110px;
}

.pricing-billing-duration ul .nav-item {
    margin-right: 10px;
}

.pricing-billing-duration ul .nav-item:last-child {
    margin-right: 0;
}

.pricing-billing-duration ul .nav-link {
    color: var(--color-text-dark);
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -0.025em;
    font-family: var(--font-primary);
    background-color: transparent;
    border: none;
    border-radius: 60px;
    padding: 14px 30px;
}

.pricing-billing-duration ul .nav-link.active {
    background-color: var(--color-primary);
    color: var(--color-white);
}

@media only screen and (max-width: 575px) {
    .pricing-billing-duration ul .nav-link {
        font-size: 15px;
        padding: 12px 25px;
    }
}

.pricing-billing-duration ul .billed-check-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.pricing-billing-duration ul .billed-check-box input {
    height: 0;
    width: 0;
    visibility: hidden;
}

.pricing-billing-duration ul .billed-check-box label {
    cursor: pointer;
    width: 56px;
    height: 24px;
    background-color: var(--color-primary);
    border-radius: 12px;
    position: relative;
}

.pricing-billing-duration ul .billed-check-box label::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 16px;
    height: 16px;
    background-color: var(--color-white);
    border-radius: 50%;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.pricing-billing-duration ul .billed-check-box input:checked + label:after {
    left: calc(100% - 4px);
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
}

/*-------------------------
    Process
-------------------------*/
.process-work {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 80px;
}

@media only screen and (max-width: 767px) {
    .process-work {
        display: block;
        margin-bottom: 50px;
    }
}

.process-work .thumbnail {
    background-color: var(--color-white);
    border-radius: 30px;
    text-align: center;
}

@media only screen and (max-width: 991px) {
    .process-work .thumbnail {
        width: 300px;
    }
}

@media only screen and (max-width: 767px) {
    .process-work .thumbnail {
        width: 100%;
        margin-bottom: 30px;
    }
}

.process-work .content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 60px;
}

@media only screen and (max-width: 767px) {
    .process-work .content {
        margin-left: 0;
    }
}

.process-work .content .subtitle {
    font-size: 20px;
    color: var(--color-rose);
    font-weight: 700;
    font-family: var(--font-primary);
    margin-bottom: 20px;
}

@media only screen and (max-width: 767px) {
    .process-work .content .subtitle {
        font-size: 16px;
        margin-bottom: 10px;
    }
}

.process-work .content .title {
    font-size: 40px;
}

@media only screen and (max-width: 767px) {
    .process-work .content .title {
        font-size: 32px;
    }
}

.process-work .content p {
    color: #737387;
    width: 60%;
    margin-bottom: 0;
}

@media only screen and (max-width: 1199px) {
    .process-work .content p {
        width: 100%;
    }
}

.process-work.content-reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.process-work.content-reverse .content {
    margin: 0 60px 0 0;
    padding-left: 300px;
}

@media only screen and (max-width: 1199px) {
    .process-work.content-reverse .content {
        padding-left: 0;
    }
}

@media only screen and (max-width: 767px) {
    .process-work.content-reverse .content {
        margin: 0;
    }
}

.process-work.content-reverse .content p {
    width: 100%;
}

/*-------------------------
   Project
-------------------------*/
.project-grid {
    box-shadow: 0 55px 86px -35px #ECF2F6;
    border-radius: 30px;
    margin-bottom: 40px;
}

.project-grid .thumbnail {
    overflow: hidden;
    position: relative;

    border-radius: 50% 50% 0 0;
    position: relative;
    border-top: 5px #f9e6bf;
    border-top: 5px #ffd2a5;
    border-style: groove;
    transition: border-radius 2s cubic-bezier(0.2, 0.96, 0.34, 1);
}

.project-grid .thumbnail img {
    border-radius: 50% 50% 0 0;
    width: 100%;
    height: 270px;
    object-fit: cover;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transition: -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: transform 2s cubic-bezier(0.2, 0.96, 0.34, 1), -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1), height 2s cubic-bezier(0.2, 0.96, 0.34, 1);
}
.project-grid:hover .thumbnail {
      border-radius: 140px 140px 0 0;
}
.project-grid .content {
    background-color: var(--color-white);
    border-radius: 0 0 30px 30px;
    padding: 40px 50px;
}

@media only screen and (max-width: 1199px) {
    .project-grid .content {
        padding: 40px;
    }
}

@media only screen and (max-width: 767px) {
    .project-grid .content {
        padding: 30px;
    }
}

.project-grid .content .title {
    letter-spacing: -0.045em;
    margin-bottom: 10px;
}

.project-grid .content .title a:hover {
    color: var(--color-link);
}

.project-grid:hover .thumbnail img {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
    height: 290px;
}

.project-grid.project-style-2 {
    box-shadow: none;
    position: relative;
    margin-bottom: 60px;
}

.project-grid.project-style-2 .thumbnail {
    border-radius: 30px;
}

.project-grid.project-style-2 .thumbnail img {
    border-radius: 30px;
}

.project-grid.project-style-2 .content {
    background-color: transparent;
    border-radius: 0;
    padding: 0;
    position: absolute;
    top: 50px;
    left: 50px;
}

@media only screen and (max-width: 991px) {
    .project-grid.project-style-2 .content {
        top: 30px;
        left: 30px;
    }
}

.project-grid.project-style-2 .content .subtitle {
    font-size: 18px;
    margin-bottom: 15px;
}

.more-project-btn {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 20px;
}

@media only screen and (max-width: 767px) {
    .more-project-btn {
        margin-top: 0;
    }
}

.more-project-btn .axil-btn {
    padding: 24px 80px;
    color: var(--color-dark);
    display: block;
}

.more-project-btn .axil-btn.btn-fill-primary {
    color: var(--color-white);
}

@media only screen and (max-width: 767px) {
    .more-project-btn .axil-btn {
        padding: 18px 40px;
        font-size: 15px;
    }
}

.project-add-banner {
    background-color: var(--color-peach);
    border-radius: 30px;
    padding: 50px 60px 50px 50px;
    margin-bottom: 120px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

@media only screen and (max-width: 991px) {
    .project-add-banner {
        padding: 40px 20px;
        margin-bottom: 100px;
    }
}

@media only screen and (max-width: 575px) {
    .project-add-banner {
        display: block;
    }
}

.project-add-banner .content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-right: 50px;
}

@media only screen and (max-width: 575px) {
    .project-add-banner .content {
        padding-right: 0;
    }
}

.project-add-banner .content .subtitle {
    font-size: var(--font-body-1);
    margin-bottom: 15px;
}

.project-add-banner .content .title {
    width: 80%;
    letter-spacing: -0.045em;
    margin-bottom: 110px;
}

@media only screen and (max-width: 1199px) {
    .project-add-banner .content .title {
        width: 100%;
    }
}

@media only screen and (max-width: 991px) {
    .project-add-banner .content .title {
        margin-bottom: 60px;
    }
}

.project-add-banner .thumbnail {
    margin: -170px 0 -110px;
}

@media only screen and (max-width: 1199px) {
    .project-add-banner .thumbnail {
        width: 50%;
    }
}

@media only screen and (max-width: 767px) {
    .project-add-banner .thumbnail {
        width: 30%;
    }
}

@media only screen and (max-width: 575px) {
    .project-add-banner .thumbnail {
        margin: 40px auto 0;
        width: 70%;
    }
}

.isotope-project-btn {
    margin-bottom: 55px;
}

.isotope-project-btn button {
    border: none;
    background-color: transparent;
    font-size: 20px;
    font-weight: 500;
    color: var(--color-body);
    font-family: var(--font-primary);
    margin-right: 100px;
    padding: 8px 0;
    position: relative;
}

@media only screen and (max-width: 575px) {
    .isotope-project-btn button {
        margin-right: 50px;
        font-size: 18px;
    }
}

.isotope-project-btn button:focus-visible {
    outline: none;
}

.isotope-project-btn button:after {
    content: "";
    height: 2px;
    width: 100%;
    background-color: var(--color-primary);
    position: absolute;
    bottom: 0;
    left: 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.isotope-project-btn button.is-checked {
    color: var(--color-dark);
}

.isotope-project-btn button.is-checked:after {
    visibility: visible;
    opacity: 1;
}

.isotope-project-btn button:last-child {
    margin-right: 0;
}

@media only screen and (max-width: 991px) {
    .single-portfolio-area .why-choose-us {
        margin-top: 50px;
    }
}

.project-column-4 .project-grid .content {
    padding:30px;
}

/*-------------------------
    Service
-------------------------*/
.services-grid {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 50px 50px 40px;
    border-radius: 30px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    margin-bottom: 40px;
    position: relative;
    z-index: 1;
    transition: var(--transition);
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .services-grid {
        padding: 50px 30px 40px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .services-grid {
        padding: 40px 15px;
    }
}

@media only screen and (max-width: 991px) {
    .services-grid {
        padding: 40px 25px;
    }
}

.services-grid:after {
    content: "";
    height: 100%;
    width: 100%;
    background: var(--gradient-dark);
    border: 1px solid;
    border-image-source: linear-gradient(0deg, #27272E 64.45%, rgba(74, 75, 86, 0.72) 100%);
    border-radius: 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.services-grid .thumbnail {
    margin-right: 25px;
    max-width: 85px;
}

@media only screen and (max-width: 1199px) {
    .services-grid .thumbnail {
        max-width: 60px;
    }
}

@media only screen and (max-width: 991px) {
    .services-grid .thumbnail {
        width: 60px;
        margin-right: 15px;
    }
}

.services-grid .content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.services-grid .content .title a {
    color: var(--color-white);
}

.services-grid .content .title a:hover {
    color: var(--color-primary);
}

.services-grid .content p {
    color: var(--color-white);
    opacity: 0.5;
    letter-spacing: -0.025em;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.services-grid .content .more-btn {
    font-weight: 500;
    color: var(--color-white);
    position: relative;
    padding-left: 50px;
}

.services-grid .content .more-btn:before {
    content: "";
    width: 34px;
    height: 1px;
    background-color: var(--color-white);
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.services-grid:hover:after, .services-grid.active:after {
    visibility: visible;
    opacity: 1;
}

.services-grid:hover .thumbnail::after, .services-grid.active .thumbnail::after {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.services-grid:hover .content p, .services-grid.active .content p {
    color: var(--color-light);
    opacity: 1;
}

.services-grid:hover .content .more-btn, .services-grid.active .content .more-btn {
    color: var(--color-accent2);
}

.services-grid:hover .content .more-btn:before, .services-grid.active .content .more-btn:before {
    background-color: var(--color-accent2);
}

.services-grid.service-style-2 {
    background: -webkit-linear-gradient(top, #F8F8F8 0%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(180deg, #F8F8F8 0%, rgba(255, 255, 255, 0) 100%);
    border: 1px solid;
    border-image-source: linear-gradient(90deg, #ECF2F6 0%, rgba(236, 242, 246, 0) 70.31%);
    background-color: var(--color-white);
    margin-bottom: 30px;
    height: 500px;
}

.services-grid.service-style-2:after {
    display: none;
}

.services-grid.service-style-2 .content .title a {
    color: var(--color-text-dark);
}

.services-grid.service-style-2 .content .title a:hover {
    color: var(--color-primary);
}

.services-grid.service-style-2 .content p {
    color: var(--color-body);
    opacity: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    /* -webkit-line-clamp: 3; */
    -webkit-box-orient: vertical;
}

.services-grid.service-style-2 .content .more-btn {
    color: var(--color-body);
}

.services-grid.service-style-2 .content .more-btn:before {
    background-color: var(--color-body);
}

.services-grid.service-style-2:hover, .services-grid.service-style-2.active {
    background-color: var(--color-light);
}

.services-grid.service-style-2:hover .content .more-btn, .services-grid.service-style-2.active .content .more-btn {
    color: var(--color-primary);
}

.services-grid.service-style-2:hover .content .more-btn:before, .services-grid.service-style-2.active .content .more-btn:before {
    background-color: var(--color-primary);
}

.service-scroll-navigation-area {
    position: relative;
    padding-top: 90px;
}

.service-scroll-nav {
    background-color: var(--color-white);
    z-index: 3;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    padding-top: 5px;
    padding-bottom: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.service-scroll-nav ul {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-bottom: 1px solid var(--color-mercury);
}

.service-scroll-nav ul li {
    margin: 0 10px;
}

.service-scroll-nav ul li a {
    padding: 30px 10px;
    color: var(--color-dark);
    position: relative;
}

@media only screen and (max-width: 991px) {
    .service-scroll-nav ul li a {
        padding: 26px 0;
        font-size: 15px;
    }
}

@media only screen and (max-width: 767px) {
    .service-scroll-nav ul li a {
        padding: 10px 0;
        font-size: 15px;
    }
}

@media only screen and (max-width: 575px) {
    .service-scroll-nav ul li a {
        font-size: 14px;
    }
}

.service-scroll-nav ul li a::after {
    content: "";
    height: 2px;
    width: 0;
    background-color: var(--color-primary);
    position: absolute;
    bottom: -1px;
    left: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.service-scroll-nav ul li a:hover {
    color: var(--color-primary);
}

.service-scroll-nav ul li a:hover::after {
    width: 100%;
}

.service-scroll-nav ul li.current a {
    color: var(--color-primary);
}

.service-scroll-nav ul li.current a::after {
    width: 100%;
}

/*-------------------------
    Team
-------------------------*/
.team-grid {
    text-align: center;
    margin-bottom: 80px;
}

.team-grid .thumbnail {
    margin-bottom: 30px;
    display: inline-block;
}

.team-grid .thumbnail a {
    position: relative;
}

.team-grid .thumbnail a:after {
    content: "";
    height: 100%;
    width: 100%;
    border: 8px dashed var(--color-rose);
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.team-grid .thumbnail a img {
    border-radius: 50%;
}

/* .chat img {
    border-radius: 50%;
    width: 111px;
} */

.team-grid .content .title {
    color: var(--color-white);
    margin-bottom: 10px;
}

.team-grid .content .designation {
    display: block;
    color: var(--color-gray-2);
}

.team-grid:hover .thumbnail a:after, .team-grid.active .thumbnail a:after {
    visibility: visible;
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.team-details-content {
    padding-right: 50px;
    margin-bottom: 30px;
}

@media only screen and (max-width: 767px) {
    .team-details-content {
        padding-right: 0;
    }
}

.team-details-content .subtitle {
    display: block;
    color: var(--color-primary);
    border-bottom: 3px solid;
    font-weight: 700;
    font-size: 22px;
    line-height: 26px;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

@media only screen and (max-width: 767px) {
    .team-details-content .subtitle {
        font-size: 18px;
    }
}

.team-details-content .social-share {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -10px;
}

.team-details-content .social-share li {
    margin: 10px;
}

.team-details-content .social-share li a {
    font-size: 20px;
    color: var(--color-gray-2);
}

.team-details-content .social-share li a:hover {
    color: var(--color-primary);
}

.team-details-content p {
    font-size: 20px;
    margin-top: 40px;
    line-height: 1.7;
}

.team-details-thumb img {
    border-radius: 10px;
}

/*-------------------------
   Testimonial
-------------------------*/
.testimonial-grid {
    padding: 50px 0 30px;
    border-top: 2px solid transparent;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 767px) {
    .testimonial-grid {
        padding: 30px 0;
    }
}

.testimonial-grid .social-media {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-rose);
    font-family: var(--font-primary);
    letter-spacing: -0.025em;
    margin-bottom: 30px;
}

.testimonial-grid p {
    font-size: 24px;
    line-height: 1.2;
    color: var(--color-text-dark);
    font-family: var(--font-primary);
    letter-spacing: -0.025em;
}

@media only screen and (max-width: 767px) {
    .testimonial-grid p {
        font-size: 18px;
    }
}

.testimonial-grid .author-info {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.testimonial-grid .author-info .thumb img {
    border-radius: 50%;
}

.testimonial-grid .author-info .content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 20px;
}

.testimonial-grid .author-info .content span {
    display: block;
}

.testimonial-grid .author-info .content .name {
    font-weight: 500;
    color: var(--color-text-dark);
    letter-spacing: -0.04em;
    margin-bottom: 3px;
}

.testimonial-grid .author-info .content .designation {
    font-size: 14px;
    color: var(--color-gray-2);
    letter-spacing: -0.025em;
}

.testimonial-grid:hover, .testimonial-grid.active {
    border-top-color: var(--color-primary);
}

.testimonial-grid.testimonial-light p {
    color: var(--color-white);
}

.testimonial-grid.testimonial-light .author-info .content .name {
    color: var(--color-white);
}

.customer-review-area .section-heading .title {
    font-size: 50px;
    margin-bottom: 40px;
}

@media only screen and (max-width: 1199px) {
    .customer-review-area .section-heading .title {
        font-size: 46px;
    }
}

@media only screen and (max-width: 991px) {
    .customer-review-area .section-heading .title {
        font-size: 38px;
    }
}

.customer-review-area .review-site-logo {
    text-align: right;
}

@media only screen and (max-width: 991px) {
    .customer-review-area .review-site-logo img {
        width: 80%;
    }
}

@media only screen and (max-width: 991px) {
    .customer-review-area .review-site-logo {
        text-align: left;
        margin-bottom: 5px;
    }
}

.followers-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 90px -50px -15px;
}

@media only screen and (max-width: 991px) {
    .followers-list {
        margin: 90px -15px -15px;
    }
}

@media only screen and (max-width: 767px) {
    .followers-list {
        margin: 50px -15px -15px;
    }
}

.followers-list li {
    margin: 0 50px;
    margin-bottom: 15px;
}

@media only screen and (max-width: 991px) {
    .followers-list li {
        margin: 0 15px;
    }
}

.followers-list li a i {
    height: 67px;
    width: 67px;
    line-height: 67px;
    text-align: center;
    color: var(--color-white);
    border-radius: 100%;
    margin-right: 25px;
}

@media only screen and (max-width: 991px) {
    .followers-list li a i {
        margin-right: 10px;
        height: 50px;
        width: 50px;
        line-height: 50px;
    }
}

.followers-list li a span {
    color: #000248;
    font-weight: 500;
    font-size: 20px;
    line-height: 26px;
    font-family: var(--font-primary);
}

@media only screen and (max-width: 991px) {
    .followers-list li a span {
        font-size: 18px;
    }
}

@media only screen and (max-width: 767px) {
    .followers-list li a span {
        margin-top: 10px;
    }
}

.followers-list li.dribble a i {
    background-color: #EA4C89;
    box-shadow: 0 10px 37px -5px rgba(234, 76, 137, 0.5);
}

.followers-list li.behance a i {
    background-color: #0067FF;
    box-shadow: 0 10px 37px -5px rgba(0, 103, 255, 0.5);
}

.followers-list li.linkedin a i {
    background-color: #0177AC;
    box-shadow: 0 10px 37px -5px rgba(1, 119, 172, 0.5);
}

/*-------------------------
    Why Choose
-------------------------*/
@media only screen and (max-width: 991px) {
    .why-choose-us {
        margin-bottom: 60px;
    }
}

.why-choose-us .section-heading {
    margin-bottom: 50px!important;
}

.why-choose-us .section-heading p {
    width: 100%;
}

.why-choose-us .accordion-item {
    border: none;
    border-bottom: 1px solid var(--color-gray-2);
    background-color: transparent;
    border-radius: 0;
}

.why-choose-us .accordion-item .accordion-button {
    font-size: 24px;
    color: var(--color-primary);
    background-color: transparent;
    box-shadow: none;
    padding: 20px 10px 20px 0;
}

.why-choose-us .accordion-item .accordion-button i {
    margin-right: 20px;
}

.why-choose-us .accordion-item .accordion-button:after {
    display: none;
}

.why-choose-us .accordion-item .accordion-button.collapsed {
    color: var(--color-body);
}

.why-choose-us .accordion-item .accordion-body {
    padding: 0 0 18px 0;
}

.why-choose-us .why-choose-thumb {
    position: relative;
    z-index: 1;
}

.why-choose-us .why-choose-thumb img {
    border-radius: 30px;
}

/*-------------------------
    404 Error
-------------------------*/
.onepage-screen-area {
    position: relative;
    z-index: 1;
    background: var(--gradient-primary);
    margin-top: -160px;
    min-height: 500px;
    height: 100vh;
    padding: 150px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .onepage-screen-area {
        margin-top: -130px;
        padding: 150px 0 50px;
    }
}

@media only screen and (max-width: 1199px) {
    .onepage-screen-area {
        margin-top: -120px;
        padding: 150px 0 50px;
    }
}

@media only screen and (max-width: 991px) {
    .onepage-screen-area {
        height: 100%;
        padding: 200px 0 100px;
        text-align: center;
    }
}

@media only screen and (max-width: 767px) {
    .onepage-screen-area {
        padding: 150px 0 100px;
    }
}

.onepage-screen-area .content .title {
    font-size: 80px;
    margin-bottom: 40px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .onepage-screen-area .content .title {
        font-size: 70px;
    }
}

@media only screen and (max-width: 1199px) {
    .onepage-screen-area .content .title {
        font-size: 60px;
    }
}

@media only screen and (max-width: 991px) {
    .onepage-screen-area .content .title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 767px) {
    .onepage-screen-area .content .title {
        font-size: 40px;
    }
}

.onepage-screen-area .content .axil-btn {
    padding: 22px 80px;
}

@media only screen and (max-width: 991px) {
    .onepage-screen-area .content .axil-btn {
        padding: 18px 50px;
    }
}

.error-page h2 {
    text-shadow: .5px .5px 1px #ffffff;
    @media only screen and (max-width: 600px) {text-shadow: .5px .5px 1px #24355b;color: aliceblue;}
}
.error-page p {
    font-family: 'Unbounded';
    FONT-WEIGHT: 300;
    @media only screen and (max-width: 600px) { text-shadow: .5px .5px 1px #323232;color: aliceblue;}
}
.btn-404 {
    padding: 10px 71px !important;
    color: #fff !important;
    background: linear-gradient(347deg, #1b468b 15%, #3d9dff 59%, #67b4ff 82%) !important;
    box-shadow: -5px 5px 6px -5px #065293 !important;
    border: 1px solid #ffffff42 !important;
    border-radius: .75rem;
    font-family: 'Unbounded';
    text-shadow: .5px .5px 1px #a64929;
    FONT-WEIGHT: 400;
    letter-spacing: .04em;
} 
.onepage-screen-area .content .countdown {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 60px;
    margin-bottom: 40px;
}

.onepage-screen-area .content .countdown .countdown-section {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center;
    position: relative;
}

.onepage-screen-area .content .countdown .countdown-section::after {
    content: "";
    height: 80px;
    width: 1px;
    background-color: var(--color-light);
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.onepage-screen-area .content .countdown .countdown-section:last-child::after {
    display: none;
}

.onepage-screen-area .content .countdown .countdown-section .countdown-number {
    font-size: 80px;
    font-weight: 700;
    color: var(--color-rose);
    font-family: var(--font-primary);
    line-height: 1;
    margin-bottom: 10px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .onepage-screen-area .content .countdown .countdown-section .countdown-number {
        font-size: 70px;
    }
}

@media only screen and (max-width: 1199px) {
    .onepage-screen-area .content .countdown .countdown-section .countdown-number {
        font-size: 60px;
    }
}

@media only screen and (max-width: 767px) {
    .onepage-screen-area .content .countdown .countdown-section .countdown-number {
        font-size: 50px;
    }
}

@media only screen and (max-width: 575px) {
    .onepage-screen-area .content .countdown .countdown-section .countdown-number {
        font-size: 30px;
    }
}

.onepage-screen-area .content .countdown .countdown-section .countdown-unit {
    font-size: 18px;
}

@media only screen and (max-width: 575px) {
    .onepage-screen-area .content .countdown .countdown-section .countdown-unit {
        font-size: 15px;
    }
}

.onepage-screen-area .thumbnail {
    margin-right: -90px;
}

@media only screen and (max-width: 991px) {
    .onepage-screen-area .thumbnail {
        margin-right: 0;
    }
}

.onepage-screen-area .shape-group-8 .shape-3 {
    top: auto;
    bottom: -80px;
}

.onepage-screen-area.coming-soon-area {
    margin-top: 0;
    padding: 50px 0;
}

@media only screen and (max-width: 1199px) {
    .onepage-screen-area.coming-soon-area {
        height: 100%;
        text-align: center;
    }
}

.onepage-screen-area.coming-soon-area .site-logo {
    margin-bottom: 100px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .onepage-screen-area.coming-soon-area .site-logo {
        margin-bottom: 50px;
    }
}

@media only screen and (max-width: 1199px) {
    .onepage-screen-area.coming-soon-area .site-logo {
        margin-bottom: 50px;
    }
}

.onepage-screen-area.coming-soon-area .site-logo .logo-dark {
    display: none;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .onepage-screen-area.coming-soon-area .thumbnail {
        margin-right: 0;
    }
}

@media only screen and (max-width: 1199px) {
    .onepage-screen-area.coming-soon-area .thumbnail {
        display: none;
    }
}

.onepage-screen-area.coming-soon-area .shape-group-8 .shape-3 {
    bottom: auto;
    top: 25px;
}

/*-------------------------
    Privacy Policy
-------------------------*/
.privacy-policy-area .section-title {
    margin-bottom: 60px;
}

.privacy-policy-area .section-title .title {
    border-bottom: 3px solid var(--color-primary);
    padding-bottom: 15px;
}

.privacy-policy-area h4 {
    margin-bottom: 20px;
}

.privacy-policy-area p {
    line-height: 1.7;
}

.privacy-policy-area ul {
    padding-left: 20px;
    margin-bottom: 40px;
}

.privacy-policy-area ul li {
    margin-top: 10px;
    margin-bottom: 10px;
    line-height: 28px;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.privacy-policy-area ul li:hover {
    color: var(--color-primary);
}

/*-------------------------
    Splash Page Style
-------------------------*/
.splash-header-style .axil-mainmenu .header-navbar .header-main-nav {
    margin: 0 22px;
}

.splash-header-style .mainmenu li.current a {
    color: var(--color-primary);
}

.splash-header-style .mainmenu li.current a:before {
    width: 100%;
    opacity: 1;
}

.splash-header-style .buy-btn a {
    display: block;
}

@media only screen and (max-width: 767px) {
    .splash-header-style .buy-btn a {
        padding: 15px 30px;
        font-size: 15px;
    }
}

.splash-main-banner {
    margin-top: -162px;
    background-color: var(--color-light);
    padding: 240px 0;
    height: 1000px;
    z-index: 2;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .splash-main-banner {
        margin-top: -132px;
        padding: 200px 0;
    }
}

@media only screen and (max-width: 1199px) {
    .splash-main-banner {
        height: auto;
        padding: 240px 0 50px;
    }
}

@media only screen and (max-width: 991px) {
    .splash-main-banner {
        padding: 170px 0 0;
        margin-top: -122px;
    }
}

@media only screen and (max-width: 767px) {
    .splash-main-banner {
        padding: 150px 0 0;
    }
}

.splash-main-banner:before {
    content: "";
    height: 100%;
    width: 100%;
    background: -webkit-linear-gradient(bottom, rgba(250, 184, 196, 0.7) 10%, #FFFFFF 100%);
    background: linear-gradient(0deg, rgba(250, 184, 196, 0.7) 10%, #FFFFFF 100%);
    -webkit-clip-path: circle(103% at 50% -52%);
    clip-path: circle(103% at 50% -52%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: -1;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .splash-main-banner:before {
        -webkit-clip-path: circle(120% at 50% -52%);
        clip-path: circle(120% at 50% -52%);
    }
}

@media only screen and (max-width: 1199px) {
    .splash-main-banner:before {
        -webkit-clip-path: circle(140% at 50% -52%);
        clip-path: circle(140% at 50% -52%);
    }
}

@media only screen and (max-width: 479px) {
    .splash-main-banner:before {
        -webkit-clip-path: circle(170% at 50% -52%);
        clip-path: circle(170% at 50% -52%);
    }
}

.splash-main-banner .banner-content {
    text-align: center;
}

.splash-main-banner .banner-content .title {
    font-size: 70px;
    line-height: 1.4;
    font-weight: 700;
    margin-bottom: 40px;
    letter-spacing: -0.045em;
}

@media only screen and (max-width: 1199px) {
    .splash-main-banner .banner-content .title {
        font-size: 60px;
    }
}

@media only screen and (max-width: 991px) {
    .splash-main-banner .banner-content .title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 767px) {
    .splash-main-banner .banner-content .title {
        font-size: 40px;
    }
}

.splash-main-banner .site-element-count {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.splash-main-banner .site-element-count .count-box {
    margin-right: 55px;
    text-align: center;
    min-width: 150px;
}

.splash-main-banner .site-element-count .count-box:last-child {
    margin-right: 0;
}

@media only screen and (max-width: 767px) {
    .splash-main-banner .site-element-count .count-box {
        min-width: 80px;
        margin-right: 30px;
    }
}

.splash-main-banner .site-element-count .count-title {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px;
    font-family: var(--font-primary);
}

.splash-main-banner .site-element-count .count-number {
    font-size: 80px;
    color: var(--color-primary);
    font-weight: 700;
    padding: 0 8px;
}

@media only screen and (max-width: 1199px) {
    .splash-main-banner .site-element-count .count-number {
        font-size: 70px;
    }
}

@media only screen and (max-width: 991px) {
    .splash-main-banner .site-element-count .count-number {
        font-size: 50px;
    }
}

@media only screen and (max-width: 575px) {
    .splash-main-banner .site-element-count .count-number {
        font-size: 40px;
    }
}

.splash-main-banner .site-element-count .count-number span.symbol {
    margin: -8px;
}

@media only screen and (max-width: 991px) {
    .splash-main-banner .site-element-count .count-number span.symbol {
        margin: -4px;
    }
}

.splash-main-banner .demo-slider {
    margin-top: 60px;
}

@media only screen and (max-width: 767px) {
    .splash-main-banner .demo-slider {
        margin-top: 30px;
    }
}

.splash-main-banner .demo-slider .slick-slide {
    -webkit-transform: scale(0.75);
    -ms-transform: scale(0.75);
    transform: scale(0.75);
    margin: 0 -36px 100px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 991px) {
    .splash-main-banner .demo-slider .slick-slide {
        margin: 0 0 100px;
    }
}

@media only screen and (max-width: 767px) {
    .splash-main-banner .demo-slider .slick-slide {
        margin: 0 0 60px;
    }
}

.splash-main-banner .demo-slider .slick-slide a {
    border-radius: 30px;
    box-shadow: 0 60px 86px -30px rgba(153, 159, 174, 0.4);
}

.splash-main-banner .demo-slider .slick-slide a img {
    border-radius: 30px;
}

.splash-main-banner .demo-slider .slick-slide.slick-active.slick-center {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.main-demo-area {
    padding: 380px 0 120px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .main-demo-area {
        padding: 300px 0 90px;
    }
}

@media only screen and (max-width: 1199px) {
    .main-demo-area {
        padding: 0 0 80px;
    }
}

.main-demo-area .section-heading {
    margin-bottom: 40px;
}

@media only screen and (max-width: 991px) {
    .main-demo-area .section-heading {
        margin-bottom: 10px;
    }
}

.main-demo-area .section-heading p {
    width: 100%;
}

.main-demo-area .single-demo {
    text-align: center;
    margin-bottom: 80px;
}

@media only screen and (max-width: 767px) {
    .main-demo-area .single-demo {
        margin-bottom: 60px;
    }
}

.main-demo-area .single-demo a {
    display: block;
}

.main-demo-area .single-demo .thumb {
    border-radius: 30px;
    display: block;
    margin-bottom: 40px;
    box-shadow: 0 78px 40px -58px rgba(153, 161, 170, 0.5);
    position: relative;
    overflow: hidden;
}

.main-demo-area .single-demo .thumb:before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    -webkit-transform: skewX(-25deg);
    -ms-transform: skewX(-25deg);
    transform: skewX(-25deg);
}

.main-demo-area .single-demo .thumb img {
    border-radius: 30px;
    -webkit-transition: -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: transform 2s cubic-bezier(0.2, 0.96, 0.34, 1), -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    width: 100%;
}

.main-demo-area .single-demo .title {
    margin-bottom: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.main-demo-area .single-demo:hover .thumb:before {
    -webkit-animation: shine 0.75s;
    animation: shine 0.75s;
}

.main-demo-area .single-demo:hover .thumb img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.main-demo-area .single-demo:hover .title {
    color: var(--color-primary);
}

.main-demo-area .shape-group li {
    position: absolute;
    top: 25%;
    z-index: -1;
}

.main-demo-area .shape-group li.shape-2 {
    top: 39%;
}

.splash-demo-button {
    text-align: center;
    margin: 0 -5px 50px;
}

.splash-demo-button button {
    background-color: transparent;
    border-radius: 60px;
    border: none;
    color: var(--color-dark);
    font-size: 40px;
    font-weight: 500;
    font-family: var(--font-primary);
    padding: 20px 60px 25px;
    margin: 10px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    position: relative;
}

.splash-demo-button button:before {
    content: "";
    height: 100%;
    width: 100%;
    background-color: var(--color-white);
    box-shadow: 0 20px 50px 0 rgba(52, 49, 139, 0.1);
    border-radius: 60px;
    position: absolute;
    top: 0;
    left: -30px;
    z-index: -1;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.splash-demo-button button.is-checked {
    color: var(--color-primary);
}

.splash-demo-button button.is-checked:before {
    visibility: visible;
    opacity: 1;
    left: 0;
}

@media only screen and (max-width: 767px) {
    .splash-demo-button button {
        font-size: 20px;
        padding: 10px 30px;
    }
}

@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}

@keyframes shine {
    100% {
        left: 125%;
    }
}

.active-dark-mode .splash-demo-button button {
    border-color: var(--dark-border-gray);
    color: var(--dark-title-light);
}

.active-dark-mode .splash-demo-button button:hover {
    border-color: var(--color-primary);
}

.active-dark-mode .splash-demo-button button.is-checked {
    border-color: var(--color-primary);
}

.splash-features .section-heading {
    margin-bottom: 40px;
}

@media only screen and (max-width: 991px) {
    .splash-features .section-heading {
        margin-bottom: 10px;
    }
}

.splash-features .section-heading .title {
    width: 100%;
}

.splash-features .section-heading p {
    width: 100%;
}

.splash-features .services-grid {
    padding: 55px;
    height: 100%;
    margin-bottom: 0;
    display: block;
}

.splash-features .services-grid .thumbnail {
    margin-bottom: 30px;
    margin-right: 0;
    max-width: 100%;
}

.splash-features .services-grid .content .title {
    color: var(--color-white);
}

.splash-features .services-grid .content p {
    margin-bottom: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.splash-features .services-grid:hover .content p, .splash-features .services-grid.active .content p {
    opacity: 1;
    color: var(--color-light);
}

.spalsh-why-choose .section-heading {
    margin-bottom: 40px;
}

@media only screen and (max-width: 991px) {
    .spalsh-why-choose .section-heading {
        margin-bottom: 10px;
    }
}

.spalsh-why-choose .section-heading p {
    width: 100%;
}

.spalsh-why-choose .line-shape {
    position: absolute;
    top: 90px;
    left: 0;
    -webkit-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    transform: scaleX(-1);
    z-index: -1;
}

.why-buy-box {
    background-color: var(--color-white);
    border-radius: 30px;
    padding: 35px;
    margin-bottom: 80px;
    border: var(--border-light);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 991px) {
    .why-buy-box {
        margin-bottom: 30px;
    }
}

.why-buy-box .heading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
}

.why-buy-box .heading .icon {
    text-align: center;
    height: 62px;
    width: 62px;
    line-height: 60px;
    background-color: var(--color-accent1);
    border-radius: 50%;
    margin-right: 20px;
}

.why-buy-box .heading .title {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-bottom: 20px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.why-buy-box p {
    margin-bottom: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.support-box {
    height: 100%;
    padding-bottom: 30px;
}

.support-box a {
    display: block;
    height: 100%;
    position: relative;
    z-index: 1;
    background-color: var(--color-white);
    border: var(--border-light);
    border-radius: 30px;
    overflow: hidden;
}

.support-box .inner {
    height: 100%;
    padding: 30px 35px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative;
    z-index: 1;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.support-box .heading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
}

.support-box .heading .icon {
    text-align: center;
    height: 62px;
    width: 62px;
    line-height: 60px;
    background-color: var(--color-light);
    border-radius: 50%;
    margin-left: 20px;
}

.support-box .heading .title {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-weight: 700;
    margin-bottom: 18px;
    letter-spacing: -0.045em;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.support-box p {
    color: var(--color-body);
    margin-bottom: 16px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.support-box .item-btn {
    text-align: center;
    height: 46px;
    width: 68px;
    line-height: 46px;
    font-size: 26px;
    border-radius: 100px;
    color: var(--color-white);
    border: none;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.support-box .shape-group li {
    position: absolute;
    right: 0;
    bottom: -1px;
    z-index: -1;
}

.support-box:hover a, .support-box.active a {
    box-shadow: 0 50px 50px -24px rgba(153, 161, 170, 0.3);
}

.support-box:hover .inner .item-btn, .support-box.active .inner .item-btn {
    background-color: var(--color-primary);
}

.support-box.online-docuentation .item-btn {
    background-color: var(--color-rose);
}

.support-box.support-ticket .item-btn {
    background-color: var(--color-chart1);
}

.splash-call-to-action {
    background-color: var(--color-primary);
    padding: 140px 0 80px;
    margin-bottom: 0;
}

@media only screen and (max-width: 1199px) {
    .splash-call-to-action {
        padding: 100px 0 40px;
    }
}

@media only screen and (max-width: 991px) {
    .splash-call-to-action {
        padding: 80px 0 30px;
    }
}

@media only screen and (max-width: 767px) {
    .splash-call-to-action {
        padding: 60px 0 10px;
    }
}

.splash-call-to-action:before {
    display: none;
}

.splash-call-to-action .section-heading .title {
    margin-bottom: 20px;
    font-size: 80px;
    width: 100%;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .splash-call-to-action .section-heading .title {
        font-size: 70px;
    }
}

@media only screen and (max-width: 1199px) {
    .splash-call-to-action .section-heading .title {
        font-size: 60px;
    }
}

@media only screen and (max-width: 767px) {
    .splash-call-to-action .section-heading .title {
        font-size: 50px;
    }
}

@media only screen and (max-width: 575px) {
    .splash-call-to-action .section-heading .title {
        font-size: 40px;
    }
}

.splash-call-to-action .section-heading p {
    width: 100%;
    font-size: 20px;
    color: var(--color-light);
}

@media only screen and (max-width: 991px) {
    .splash-call-to-action .section-heading p {
        font-size: 18px;
    }
}

.splash-call-to-action .section-heading p a {
    font-weight: 700;
    margin-left: 10px;
    color: var(--color-light);
    text-decoration: underline;
}

.splash-call-to-action .section-heading p a:hover {
    color: var(--color-white);
}

.splash-call-to-action .section-heading .axil-btn {
    color: #2A288B;
    padding: 24px 80px;
    -webkit-filter: drop-shadow(0px 14px 20px rgba(35, 34, 87, 0.4)) drop-shadow(0px 48px 48px rgba(0, 0, 0, 0.12));
    filter: drop-shadow(0px 14px 20px rgba(35, 34, 87, 0.4)) drop-shadow(0px 48px 48px rgba(0, 0, 0, 0.12));
    box-shadow: none;
}

.splash-call-to-action .call-to-action {
    border-bottom: none;
}

.splash-footer {
    padding-top: 0 !important;
}

.splash-footer .footer-bottom {
    border: none;
    padding: 30px 0;
}

@media only screen and (max-width: 991px) {
    .splash-footer .footer-copyright {
        text-align: center;
        margin-bottom: 20px;
    }
}

.splash-footer .footer-copyright .copyright-text {
    font-size: 16px;
}

.splash-footer .footer-social {
    text-align: center;
}

@media only screen and (max-width: 991px) {
    .splash-footer .footer-social {
        margin-bottom: 20px;
    }
}

.splash-footer .footer-social li {
    display: inline-block;
    margin-right: 25px;
}

.splash-footer .footer-social li:last-child {
    margin-right: 0;
}

.splash-footer .footer-social li a {
    height: 40px;
    width: 40px;
    line-height: 42px;
    text-align: center;
    background-color: var(--color-light);
    border-radius: 50%;
    color: var(--color-body);
}

.splash-footer .footer-social li a:hover {
    background-color: var(--color-primary);
    color: var(--color-light);
}

@media only screen and (max-width: 991px) {
    .splash-footer .footer-bottom-link {
        text-align: center;
    }
}

.splash-footer .footer-bottom-link ul {
    margin: 0 -30px;
}

@media only screen and (max-width: 991px) {
    .splash-footer .footer-bottom-link ul {
        margin: 0 -20px;
    }
}

.splash-footer .footer-bottom-link ul li {
    padding: 0 30px;
}

@media only screen and (max-width: 991px) {
    .splash-footer .footer-bottom-link ul li {
        padding: 0 20px;
    }
}

.splash-footer .footer-bottom-link ul li:after {
    height: 58%;
    width: 2px;
    right: -4px;
}

.splash-footer .footer-bottom-link ul li a {
    font-size: 16px;
    color: var(--color-body);
}

/*-------------------------
    Onepage Template
-------------------------*/
.onepage-template .mainmenu li.current a:not(.axil-btn) {
    color: var(--color-primary);
}

.onepage-template .mainmenu li.current a:not(.axil-btn):before {
    width: 100%;
    opacity: 1;
}

.onepage-template .mainmenu .header-btn {
    margin-right: 0;
}

@media only screen and (max-width: 991px) {
    .onepage-template .mainmenu .header-btn {
        padding: 10px 0;
    }
}

.onepage-template .mainmenu .header-btn a {
    padding-top: 0;
    padding-bottom: 0;
}

.onepage-template .mainmenu .header-btn a.btn-fill-white {
    color: var(--color-primary);
}

.onepage-template .mainmenu .header-btn a:before {
    display: none;
}

.onepage-template .mainmenu .header-btn a:hover {
    color: var(--color-white);
}

.onepage-template .mainmenu .header-btn.current a:after {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
    -ms-transform: translateY(-50%) translateX(-50%) scale(1);
    transform: translateY(-50%) translateX(-50%) scale(1);
}

.onepage-template .mainmenu-nav .mainmenu > li:last-child {
    border-bottom: none;
}

.onepage-template .axil-header.header-style-4 .mainmenu li.current a {
    color: var(--color-light);
}

.onepage-template .axil-header .header-navbar .header-main-nav {
    margin-right: 0;
}

.onepage-template .blog-list .modal-thumb {
    display: none;
}

.onepage-template .blog-list .post-content p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.onepage-template .services-grid .content .title {
    color: var(--color-white);
}

.onepage-template .services-grid.service-style-2 .content .title {
    color: var(--color-text-dark);
}

.onepage-template .header-offcanvasmenu .offcanvas-body .main-navigation li.current a {
    color: var(--color-primary);
}

.blog-list .post-content p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.blog-list .post-content .details-description {
    display: none;
    visibility: hidden;
    opacity: 0;
}

.project-grid .modal-thumb {
    display: none;
}

.project-grid .details-description {
    display: none;
    visibility: hidden;
    opacity: 0;
}

.case-study-featured .details-description {
    display: none;
    visibility: hidden;
    opacity: 0;
}

.op-modal-wrap {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 100;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    padding: 50px;
}

@media only screen and (max-width: 767px) {
    .op-modal-wrap {
        padding: 20px;
    }
}

.op-modal-wrap.open {
    visibility: visible;
    opacity: 1;
    pointer-events: all;
}

.op-modal-wrap .op-modal-inner {
    background-color: var(--color-white);
    max-width: 1000px;
    width: 100%;
    padding: 50px;
    padding-top: 70px;
    position: relative;
    overflow-y: auto;
}

@media only screen and (max-width: 767px) {
    .op-modal-wrap .op-modal-inner {
        padding: 30px;
        padding-top: 60px;
    }
}

.op-modal-wrap .op-modal-inner .close {
    position: absolute;
    right: 15px;
    top: 15px;
    border: none;
    background-color: var(--color-light);
    border-radius: 4px;
    padding: 3px 10px;
    color: var(--color-dark);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.op-modal-wrap .op-modal-inner .close:hover {
    color: var(--color-light);
    background-color: var(--color-primary);
}

.op-blog-modal .post-thumbnail {
    margin-bottom: 30px;
}

.op-blog-modal .post-thumbnail a {
    display: block;
}

.op-blog-modal .post-thumbnail img {
    max-height: 450px;
    width: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 24px;
}

.op-blog-modal .post-content .title a {
    pointer-events: none;
}

.op-blog-modal .post-content .blog-share {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 16px;
}

.op-blog-modal .post-content .blog-share .share-label {
    margin-bottom: 0;
    margin-right: 25px;
}

@media only screen and (max-width: 1199px) {
    .op-blog-modal .post-content .blog-share .share-label {
        margin-right: 20px;
    }
}

.op-blog-modal .post-content .blog-share .social-list {
    margin: 0 -10px;
}

.op-blog-modal .post-content .blog-share .social-list li {
    display: inline-block;
}

.op-blog-modal .post-content .blog-share .social-list li a {
    color: var(--color-dark);
    padding: 5px 10px;
}

@media only screen and (max-width: 1199px) {
    .op-blog-modal .post-content .blog-share .social-list li a {
        padding: 5px;
    }
}

.op-blog-modal .post-content .blog-share .social-list li a:hover {
    color: var(--color-primary);
}

.op-portfolio-modal .portfolio-thumbnail {
    margin-bottom: 30px;
}

.op-portfolio-modal .portfolio-thumbnail a {
    display: block;
    pointer-events: none;
}

.op-portfolio-modal .portfolio-thumbnail img {
    max-height: 450px;
    width: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 24px;
}

.op-portfolio-modal .portfolio-content .title a {
    pointer-events: none;
}

.op-portfolio-modal .portfolio-content .project-share {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 16px;
}

.op-portfolio-modal .portfolio-content .project-share .share-label {
    margin-bottom: 0;
    margin-right: 25px;
}

@media only screen and (max-width: 1199px) {
    .op-portfolio-modal .portfolio-content .project-share .share-label {
        margin-right: 20px;
    }
}

.op-portfolio-modal .portfolio-content .project-share .social-list {
    margin: 0 -10px;
}

.op-portfolio-modal .portfolio-content .project-share .social-list li {
    display: inline-block;
}

.op-portfolio-modal .portfolio-content .project-share .social-list li a {
    color: var(--color-dark);
    padding: 5px 10px;
}

@media only screen and (max-width: 1199px) {
    .op-portfolio-modal .portfolio-content .project-share .social-list li a {
        padding: 5px;
    }
}

.op-portfolio-modal .portfolio-content .project-share .social-list li a:hover {
    color: var(--color-primary);
}

.op-case-modal .op-modal-inner {
    border-radius: 10px;
}

.op-case-modal .case-content p:last-child {
    margin-bottom: 0;
}

.op-case-modal .case-content .title {
    font-size: 36px;
}

@media only screen and (max-width: 991px) {
    .op-case-modal .case-content .title {
        font-size: 30px;
    }
}

body.op-modal-open {
    overflow: hidden;
}

.active-dark-mode .op-modal-wrap .op-modal-inner {
    background-color: var(--dark-main-body);
}

.active-dark-mode.onepage-template .services-grid .content .title {
    color: var(--dark-title-light);
}

.active-dark-mode.onepage-template .op-blog-modal .post-content .blog-share .social-list li a {
    color: var(--dark-title-light);
}

.active-dark-mode.onepage-template .op-blog-modal .post-content .blog-share .social-list li a:hover {
    color: var(--color-primary);
}

.active-dark-mode.onepage-template .op-portfolio-modal .portfolio-content .project-share .social-list li a {
    color: var(--dark-title-light);
}

.active-dark-mode.onepage-template .op-portfolio-modal .portfolio-content .project-share .social-list li a:hover {
    color: var(--color-primary);
}

.active-dark-mode.onepage-template .mainmenu li.current a:not(.axil-btn) {
    color: var(--color-white);
}

@media (prefers-reduced-motion: no-preference) {
    :root {
        scroll-behavior: auto;
    }
}
/*=======================================================================
4.Blocks Styles
=========================================================================*/
/*-------------------------
   Header Styles
-------------------------*/
.axil-header {
    position: relative;
    z-index: 4;
}

.axil-header .header-navbar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.axil-header .header-navbar .header-logo a {
    display: block;
}

.header-logo img {
    height: 4rem;
}

.axil-header .header-navbar .header-logo .dark-version-logo {
    display: none;
}

.axil-header .header-navbar .header-logo .sticky-logo {
    display: none;
}

@media only screen and (max-width: 991px) {
    .axil-header .header-navbar .header-logo img {
        width: 150px;
    }
}

.axil-header .header-navbar .header-main-nav {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0 55px 0 50px;
}

@media only screen and (max-width: 1199px) {
    .axil-header .header-navbar .header-main-nav {
        margin: 0 30px;
    }
}

@media only screen and (max-width: 991px) {
    .axil-header .header-navbar .header-main-nav {
        margin: 0;
    }
}

.axil-header.header-style-1 .axil-mainmenu.axil-sticky .header-navbar .header-logo .light-version-logo {
    display: none;
}

.axil-header.header-style-1 .axil-mainmenu.axil-sticky .header-navbar .header-logo .sticky-logo {
    display: block;
}

.axil-header.header-style-2 .axil-mainmenu {
    padding: 50px 80px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .axil-header.header-style-2 .axil-mainmenu {
        padding: 35px 15px;
    }
}

@media only screen and (max-width: 1199px) {
    .axil-header.header-style-2 .axil-mainmenu {
        padding: 35px 15px;
    }
}

@media only screen and (max-width: 575px) {
    .axil-header.header-style-2 .axil-mainmenu {
        padding: 30px 0;
    }
}

.axil-header.header-style-2 .axil-mainmenu.axil-sticky {
    padding: 15px 80px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .axil-header.header-style-2 .axil-mainmenu.axil-sticky {
        padding: 15px;
    }
}

@media only screen and (max-width: 1199px) {
    .axil-header.header-style-2 .axil-mainmenu.axil-sticky {
        padding: 15px;
    }
}

@media only screen and (max-width: 575px) {
    .axil-header.header-style-2 .axil-mainmenu.axil-sticky {
        padding: 15px 0;
    }
}

.axil-header.header-style-2 .axil-mainmenu .mainmenu {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.axil-header.header-style-3 .axil-mainmenu.axil-sticky .header-navbar .header-logo .light-version-logo {
    display: none;
}

.axil-header.header-style-3 .axil-mainmenu.axil-sticky .header-navbar .header-logo .sticky-logo {
    display: block;
}

.axil-header.header-style-3 .header-action .sidemenu-btn .btn-wrap {
    background-color: var(--color-light);
}

@media only screen and (max-width: 1299px) {
    .axil-header.header-style-4 .header-main-nav {
        margin: 0 15px;
    }
}

@media only screen and (max-width: 991px) {
    .axil-header.header-style-4 .header-main-nav {
        margin: 0;
    }
}

@media only screen and (max-width: 991px) {
    .axil-header.header-style-4 .mainmenu-nav {
        background-color: var(--color-dark);
    }
}

.axil-header.header-style-4 .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu {
    background-color: var(--color-dark);
}

.axil-header.header-style-4 .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li a {
    color: var(--color-light);
}

.axil-header.header-style-4 .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li a:hover {
    color: var(--color-primary);
}

.axil-header.header-style-4 .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li a.active {
    color: var(--color-primary);
}

.axil-header.header-style-4 .mobile-nav-header {
    border-color: var(--color-gray-4);
}

.axil-header.header-style-4 .mobile-nav-header .mobile-nav-logo .light-mode {
    display: none;
}

.axil-header.header-style-4 .mobile-nav-header .mobile-nav-logo .dark-mode {
    display: block;
}

.axil-header.header-style-4 .mobile-nav-header .mobile-menu-close {
    background-color: var(--color-white);
    color: var(--color-black);
    border: none;
}

.axil-header.header-style-4 .axil-mainmenu.axil-sticky {
    background-color: var(--color-dark);
}

@media only screen and (max-width: 1199px) {
    .axil-header.header-style-4 .mainmenu li {
        margin: 0 10px;
    }
}

@media only screen and (max-width: 991px) {
    .axil-header.header-style-4 .mainmenu li {
        border-color: var(--color-gray-4);
    }
}

.axil-header.header-style-4 .mainmenu li a {
    color: var(--color-light);
}

.axil-header.header-style-4 .mainmenu li a::before {
    background-color: var(--color-white);
}

.axil-header.header-style-4 .mainmenu li a::after {
    color: var(--color-gray-4);
}

.axil-header.header-style-4 .header-action .header-btn .axil-btn {
    display: block;
}

.axil-mainmenu {
    padding: 46px 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .axil-mainmenu {
        padding: 33px 0;
    }
}

@media only screen and (max-width: 1199px) {
    .axil-mainmenu {
        padding: 28px 0;
    }
    .blog .axil-mainmenu, .statya .axil-mainmenu {
        padding: 28px 0!important;
    }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
    .axil-mainmenu {
        padding: 0px 0;
        margin-top: -10px;
    }
}
.axil-mainmenu.axil-sticky {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 5;
    background-color: var(--color-white);
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
    padding: 15px 0;
    border-bottom: 3px aliceblue;
    border-style: ridge;
    -webkit-animation: headerSlideDown 0.8s ease forwards;
    animation: headerSlideDown 0.8s ease forwards;
}

.axil-mainmenu.axil-sticky .header-action .sidemenu-btn .btn-wrap {
    background-color: var(--color-body);
}

.axil-mainmenu.axil-sticky .header-action .sidemenu-btn .btn-wrap span {
    background-color: var(--color-white);
}

.axil-mainmenu.axil-sticky .header-action .social-icon-list li a {
    color: var(--color-dark);
}

.axil-mainmenu.axil-sticky .header-action .social-icon-list li a:hover {
    color: var(--color-primary);
}

.mainmenu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    list-style: none;
    padding: 4px;
    margin: 0;
}

.mainmenu > li {
    margin: 0 24px;
}

@media only screen and (max-width: 1199px) {
    .mainmenu > li {
        margin: 40px 12px;
    }
}
@media (min-width: 990px) and (max-width: 1199px) {
    .blog .mainmenu > li, .statya .mainmenu > li {
        margin: 34px 12px;
    }
    .blog .axil-mainmenu, .statya .axil-mainmenu {
        padding: 0px 0 !important;
    }
}

.mainmenu > li > a {
      font-weight: 500;
      font-size: var(--font-body-2);
      font-family: var(--font-primary);
      display: block;
      position: relative;
      -webkit-transition: var(--transition);
      transition: var(--transition);
      background: linear-gradient(45deg, #b7c5fa, #f0f8ff5e);
      border-radius: 31px;
      padding: 0px 25px;
      line-height: 33px;
      box-shadow: 0 0 3px 2px #66f2ff33, inset 1px -1px 4px 1px #c8c8c8cc, inset 0px 1px 4px 1px #e0faffb8;
      color: #ececec !important;
      height: 36.2px;
      /* background: radial-gradient(ellipse at top, #5d8ce1 0%, #2a5298 50%, #29c0b2 100%); */
      background: radial-gradient(ellipse at top, #5d8ce1 0%, #4574c6 50%, #5cfff0 100%);
      border: 1px solid #bfdfff5c;
      border: 1px solid #bfdfff;
}


.mainmenu > li > a::before {
    content: "";
    height: 2px;
    width: 0;
    /*background-color: var(--color-primary);*/
    position: absolute;
    bottom: 12px;
    left: 0;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.mainmenu > li > a:hover {
    color: var(--color-primary);
}

.mainmenu > li > a:hover::before {
    opacity: 1;
    width: 100%;
}

.mainmenu > li > a.active {
    color: var(--color-primary);
}

.mainmenu > li > a.active::before {
    width: 100%;
    opacity: 1;
}

.mainmenu > .menu-item-has-children {
    position: relative;
}

.mainmenu > .menu-item-has-children > a {
    position: relative;
    margin-right: 20px;
}

.mainmenu > .menu-item-has-children > a::after {
    content: "\f107";
    font-family: var(--font-awesome);
    font-weight: 400;
    color: var(--color-text-dark);
    font-size: 18px;
    position: absolute;
    top: 0;
    right: -20px;
}

.mainmenu > .menu-item-has-children .axil-submenu {
    position: absolute;
    top: 100%;
    left: 20px;
    background: #ffffff;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    min-width: 250px;
    padding: 15px 10px;
    border-radius: 4px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    list-style: none;
    margin: 0;
    box-shadow: 0 13px 48px 0 rgba(0, 0, 0, 0.15);
}

.mainmenu > .menu-item-has-children .axil-submenu li {
    margin: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
}

.mainmenu > .menu-item-has-children .axil-submenu li a {
    position: relative;
    font-size: 14px;
    text-transform: capitalize;
    color: var(--color-body);
    font-weight: 500;
    padding: 7px 15px;
    border-radius: 4px;
    display: block;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.mainmenu > .menu-item-has-children .axil-submenu li a::after {
    content: "";
    height: 1px;
    width: 0;
    background-color: var(--color-primary);
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.mainmenu > .menu-item-has-children .axil-submenu li a:hover {
    color: var(--color-primary);
}

.mainmenu > .menu-item-has-children .axil-submenu li a:hover::after {
    width: 100%;
}

.mainmenu > .menu-item-has-children .axil-submenu li a.active {
    color: var(--color-primary);
}

.mainmenu > .menu-item-has-children .axil-submenu li a.active::after {
    width: 100%;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu {
    opacity: 1;
    visibility: visible;
    z-index: 9;
    left: 0;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(1n) {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(2n) {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(3n) {
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(4n) {
    -webkit-transition-delay: 0.4s;
    transition-delay: 0.4s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(5n) {
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(6n) {
    -webkit-transition-delay: 0.6s;
    transition-delay: 0.6s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(7n) {
    -webkit-transition-delay: 0.7s;
    transition-delay: 0.7s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(8n) {
    -webkit-transition-delay: 0.8s;
    transition-delay: 0.8s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(9n) {
    -webkit-transition-delay: 0.8s;
    transition-delay: 0.8s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(10n) {
    -webkit-transition-delay: 0.8s;
    transition-delay: 0.8s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(11n) {
    -webkit-transition-delay: 0.8s;
    transition-delay: 0.8s;
}

.mainmenu > .menu-item-has-children:hover .axil-submenu li:nth-child(12n) {
    -webkit-transition-delay: 0.8s;
    transition-delay: 0.8s;
}

.header-action > ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.header-action > ul > li {
    margin-right: 30px;
}

.header-action > ul > li:last-child {
    margin-right: 0;
}

.header-action .sidemenu-btn {
    margin-right: 0;
}

.header-action .sidemenu-btn .btn-wrap {
    height: 60px;
    width: 60px;
    background-color: var(--color-light);
    border: none;
    border-radius: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 991px) {
    .header-action .sidemenu-btn .btn-wrap {
        height: 50px;
        width: 50px;
    }
}

.header-action .sidemenu-btn .btn-wrap span {
    height: 2px;
    width: 20px;
    background-color: var(--color-dark);
    margin-bottom: 4px;
    border-radius: 10px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.header-action .sidemenu-btn .btn-wrap span:last-child {
    margin-bottom: 0;
    width: 10px;
    margin-right: -10px;
}

.header-action .sidemenu-btn .btn-wrap:focus {
    box-shadow: none;
}

.header-action .sidemenu-btn .btn-wrap:hover span:last-child {
    width: 20px;
    margin-right: 0;
}

.header-action .sidemenu-btn .btn-wrap:hover span:first-child {
    width: 10px;
    margin-right: -10px;
}

.header-action .sidemenu-btn .btn-wrap.btn-dark {
    background-color: var(--color-body);
}

.header-action .sidemenu-btn .btn-wrap.btn-dark span {
    background-color: var(--color-white);
}

@media only screen and (max-width: 575px) {
    .header-action .header-social-link {
        display: none;
    }
}

.header-action .social-icon-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -15px;
}

.header-action .social-icon-list li {
    margin: 15px;
}

.header-action .social-icon-list li a {
    font-size: 20px;
    color: var(--color-body);
}

@media only screen and (max-width: 991px) {
    .header-action .social-icon-list li a {
        color: var(--color-dark);
    }
}

.header-action .social-icon-list li a:hover {
    color: var(--color-primary);
}

.header-action .header-btn {
    margin-right: 0;
}

@media only screen and (max-width: 1399px) {
    .header-action .header-btn .axil-btn {
        padding: 15px 40px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-action .header-btn .axil-btn {
        padding: 15px 25px;
    }
}

@media only screen and (max-width: 991px) {
    .header-action .header-btn {
        margin-right: 30px;
    }
}

@media only screen and (max-width: 575px) {
    .header-action .header-btn {
        display: none;
    }
}

@media only screen and (min-width: 992px) {
    .header-action .mobile-menu-btn {
        display: none;
    }
}

.header-action .mobile-menu-btn .btn-wrap {
    height: 50px;
    width: 50px;
}

.header-action .my_switcher {
    margin-left: 20px;
    border-radius: 50%;
    height: 50px;
    width: 50px;
    line-height: 52px;
    padding: 0;
    text-align: center;
}

@media only screen and (max-width: 767px) {
    .header-action .my_switcher {
        margin-left: 15px;
    }
}

.header-action .my_switcher ul {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.header-offcanvasmenu {
    width: 60vw !important;
    min-width: 300px;
    -webkit-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
    transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
}

@media only screen and (max-width: 1199px) {
    .header-offcanvasmenu {
        width: 70vw !important;
    }
}

.header-offcanvasmenu .offcanvas-header {
    padding: 50px 100px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .header-offcanvasmenu .offcanvas-header {
        padding: 50px;
    }
}

@media only screen and (max-width: 1199px) {
    .header-offcanvasmenu .offcanvas-header {
        padding: 50px;
    }
}

@media only screen and (max-width: 767px) {
    .header-offcanvasmenu .offcanvas-header {
        padding: 30px 30px 0;
    }
}

.header-offcanvasmenu .offcanvas-header .btn-close {
    margin: 0;
    font-size: 22px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 991px) {
    .header-offcanvasmenu .offcanvas-header .btn-close {
        font-size: 14px;
    }
}

.header-offcanvasmenu .offcanvas-header .btn-close:hover {
    color: var(--color-primary);
    opacity: 1;
}

.header-offcanvasmenu .offcanvas-header .btn-close:focus {
    border: none;
    box-shadow: none;
}

.header-offcanvasmenu .offcanvas-body {
    padding: 50px 100px;
}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {
    .header-offcanvasmenu .offcanvas-body {
        padding: 50px;
    }
}

@media only screen and (max-width: 1199px) {
    .header-offcanvasmenu .offcanvas-body {
        padding: 50px;
    }
}

@media only screen and (max-width: 767px) {
    .header-offcanvasmenu .offcanvas-body {
        padding: 30px;
    }
}

.header-offcanvasmenu .offcanvas-body .side-nav-search-form {
    position: relative;
    margin-bottom: 70px;
}

@media only screen and (max-width: 991px) {
    .header-offcanvasmenu .offcanvas-body .side-nav-search-form {
        margin-bottom: 40px;
    }
}

.header-offcanvasmenu .offcanvas-body .side-nav-search-form .search-field {
    font-size: 40px;
    height: auto;
    border: none;
    border-bottom: 2px solid var(--color-gray-3);
    border-radius: 0;
    padding: 5px 0;
}

@media only screen and (max-width: 991px) {
    .header-offcanvasmenu .offcanvas-body .side-nav-search-form .search-field {
        font-size: 20px;
    }
}

.header-offcanvasmenu .offcanvas-body .side-nav-search-form .search-field:focus {
    box-shadow: none;
}

.header-offcanvasmenu .offcanvas-body .side-nav-search-form .side-nav-search-btn {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: transparent;
    border: none;
    padding: 0;
}

.header-offcanvasmenu .offcanvas-body .side-nav-search-form .side-nav-search-btn i {
    font-weight: 400;
    font-size: 24px;
    color: var(--color-gray-4);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 991px) {
    .header-offcanvasmenu .offcanvas-body .side-nav-search-form .side-nav-search-btn i {
        font-size: 18px;
    }
}

.header-offcanvasmenu .offcanvas-body .side-nav-search-form .side-nav-search-btn:hover i {
    color: var(--color-primary);
}

.header-offcanvasmenu .offcanvas-body .main-navigation {
    margin: -30px 0;
    margin-top: -45px;
}

@media only screen and (max-width: 991px) {
    .header-offcanvasmenu .offcanvas-body .main-navigation {
        margin-bottom: 40px;
    }
}

@media only screen and (max-width: 767px) {
    .header-offcanvasmenu .offcanvas-body .main-navigation {
        margin: -20px 0;
        margin-bottom: 40px;
    }
}

.header-offcanvasmenu .offcanvas-body .main-navigation li {
    margin: 30px 0;
}

@media only screen and (max-width: 767px) {
    .header-offcanvasmenu .offcanvas-body .main-navigation li {
        margin: 20px 0;
    }
}

.header-offcanvasmenu .offcanvas-body .main-navigation li a {
    color: var(--color-dark);
    font-size: 36px;
    font-weight: 500;
}

@media only screen and (max-width: 1199px) {
    .header-offcanvasmenu .offcanvas-body .main-navigation li a {
        font-size: 24px;
    }
}

@media only screen and (max-width: 767px) {
    .header-offcanvasmenu .offcanvas-body .main-navigation li a {
        font-size: 20px;
    }
}

.header-offcanvasmenu .offcanvas-body .main-navigation li a:hover {
    color: var(--color-primary);
}

.header-offcanvasmenu .offcanvas-body .main-navigation li a.active {
    color: var(--color-primary);
}

.header-offcanvasmenu .offcanvas-body .contact-inner .title {
    font-size: 18px;
    line-height: 1;
    color: var(--color-dark);
    font-weight: 500;
    display: block;
    margin-bottom: 15px;
}

@media only screen and (max-width: 1199px) {
    .header-offcanvasmenu .offcanvas-body .contact-inner .title {
        font-size: 16px;
    }
}

.header-offcanvasmenu .offcanvas-body .contact-inner .address {
    margin-bottom: 40px;
}

@media only screen and (max-width: 991px) {
    .header-offcanvasmenu .offcanvas-body .contact-inner .address {
        margin-bottom: 25px;
    }
}

.header-offcanvasmenu .offcanvas-body .contact-inner .address a {
    color: var(--color-body);
    display: block;
    margin-bottom: 10px;
}

.header-offcanvasmenu .offcanvas-body .contact-inner .address a i {
    margin-right: 20px;
}

.header-offcanvasmenu .offcanvas-body .contact-inner .address p {
    margin-bottom: 0;
}

.header-offcanvasmenu .offcanvas-body .contact-inner .social-share {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -15px -6px;
}

.header-offcanvasmenu .offcanvas-body .contact-inner .social-share li {
    margin: 15px 6px;
}

.header-offcanvasmenu .offcanvas-body .contact-inner .social-share li a {
    color: var(--color-white);
    font-size: 16px;
    text-align: center;
    width: 50px;
    height: 50px;
    line-height: 53px;
    display: block;
    border-radius: 100%;
    background-color: var(--color-primary);
    text-align: center;
}

.header-offcanvasmenu .offcanvas-body .contact-inner .social-share li a:hover {
    background-color: var(--color-dark);
}

.mobile-nav-header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 10px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--color-fog);
}

@media only screen and (min-width: 992px) {
    .mobile-nav-header {
        display: none;
    }
}

.mobile-nav-header .mobile-nav-logo {
    width: 150px;
    line-height: 1;
}

.mobile-nav-header .mobile-nav-logo .dark-mode {
    display: none;
}

.mobile-nav-header .mobile-menu-close {
    height: 30px;
    width: 30px;
    border-radius: 26px;
    border: none;
    background: #897b6f00;
    color: var(--color-dark);
    font-size: 14px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    line-height: 1;
    filter: hue-rotate(39deg);
}

.mobile-nav-header .mobile-menu-close:hover {
    /* background-color: var(--color-primary);
    border-color: var(--color-primary); */
    background-color: #6e117387;
    border-color: #56e1e9;
    color: var(--color-white);
}
.mobile-menu-close img {
    filter: drop-shadow(1px 1px 1px #213b52);
    transition: .3s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.mobile-menu-close:active img {
    rotate: 45deg;
}
@media only screen and (max-width: 991px) {
    .axil-mainmenu.axil-sticky {
        -webkit-animation: none;
        animation: none;
    }

    .mainmenu-nav {
        position: fixed;
        top: 0;
        bottom: 0;
        left: -300px;
        height: max-content;
        border-radius: 1rem;
        background: radial-gradient(#ffffffbd, #f0f8ffbd);
        width: 300px;
        padding: 20px 10px;
        -webkit-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
        transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
        z-index: 1050;
    }

    .mainmenu-nav.show {
        left: 0;
    }

    .mainmenu-nav .mainmenu {
        display: block;
        height: 100%;
        overflow: auto;
    }

    .mainmenu-nav .mainmenu > li {
        border-bottom: 1px solid var(--color-fog);
    }

    .mainmenu-nav .mainmenu > li > a {
        height: 50px;
        line-height: 50px;
        text-align: center;
    }

    .mainmenu-nav .mainmenu > li > a::before {
        display: none;
    }

    .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu {
        display: none;
        position: initial;
        visibility: visible;
        opacity: 1;
        min-width: 100%;
        box-shadow: none;
        padding: 0 0 10px;
        -webkit-transition: initial;
        transition: initial;
    }

    .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }

    .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li a {
        padding: 7px 10px;
    }

    .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li a::after {
        display: none;
    }

    .mainmenu-nav .mainmenu .menu-item-has-children.menu-item-open .axil-submenu {
        display: block;
    }

    .mainmenu > .menu-item-has-children > a .submenu-toggle-btn {
        position: absolute;
        top: 0;
        right: -20px;
        height: 50px;
        width: 12px;
        background-color: transparent;
        z-index: 5;
    }

    .mainmenu > .menu-item-has-children > a:after {
        -webkit-transition: 0.3s;
        transition: 0.3s;
    }

    .mainmenu > .menu-item-has-children.open > a {
        color: var(--color-primary);
    }

    .mainmenu > .menu-item-has-children.open > a:after {
        color: var(--color-primary);
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    }
}

@-webkit-keyframes headerSlideDown {
    0% {
        margin-top: -50px;
        opacity: 0;
    }

    30% {
        margin-top: -10px;
        opacity: 0;
    }

    100% {
        margin-top: 0;
        opacity: 1;
    }
}

@keyframes headerSlideDown {
    0% {
        margin-top: -50px;
        opacity: 0;
    }

    30% {
        margin-top: -10px;
        opacity: 0;
    }

    100% {
        margin-top: 0;
        opacity: 1;
    }
}
/*-------------------------
    Blog Styles
-------------------------*/
.blog-list {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: var(--border-light);
    border-bottom: var(--border-light);
    padding: 40px 20px 40px 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);

    background: radial-gradient(ellipse at top, #ccd9f0 0%, #c6c8cc 50%, #b6b6c3 100%);
    border-radius: 2rem;
    padding: 1rem;
    border-left: 1px solid #fff;

}

@media only screen and (max-width: 1199px) {
    .blog-list {
        padding: 40px 0;
    }
}

@media only screen and (max-width: 767px) {
    .blog-list {
        display: block;
    }
}

@media only screen and (max-width: 767px) {
    .blog-list .post-thumbnail {
        margin-bottom: 30px;
    }
}

.blog-list .post-thumbnail a {
    border-radius: 30px;
    overflow: hidden;
    display: block;
}

.blog-list .post-thumbnail a img {
    border-radius: 30px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

@media only screen and (max-width: 767px) {
    .blog-list .post-thumbnail a img {
        width: 100%;
    }
}

.blog-list .post-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 20px;
}

@media only screen and (max-width: 767px) {
    .blog-list .post-content {
        margin-left: 0;
    }
}

.blog-list .post-content .title {
    margin-bottom: 20px;
}

.blog-list .post-content .title a {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.blog-list .post-content .title a:hover {
    color: var(--color-link);
}

.blog-list .post-content p {
    color: var(--color-gray-2);
    letter-spacing: -0.025em;
    margin-bottom: 30px;

    color: #565a63;
}

.blog-list .post-content .more-btn {
    font-weight: 500;
    color: var(--color-text-dark);
    
    font-family: 'Old Standart TT';
    font-style: italic;
    font-size: 20px;
}

.blog-list .post-content .more-btn i {
    margin-left: 20px;
    font-weight: 700;
    vertical-align: middle;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.blog-list .post-content .more-btn:hover {
    color: var(--color-link);
}

.blog-list .post-content .more-btn:hover i {
    margin-left: 10px;
}

.blog-list:hover, .blog-list.active {
    border-top-color: var(--color-primary);
}

.blog-list:hover .post-thumbnail a img, .blog-list.active .post-thumbnail a img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.blog-list.border-start {
    border-left: var(--border-light) !important;
    padding-left: 25px;
    padding-right: 0;
}

@media only screen and (max-width: 1199px) {
    .blog-list.border-start {
        border-left: none !important;
        padding-left: 0;
    }
}

.blog-grid {
    margin-bottom: 80px;
}

@media only screen and (max-width: 991px) {
    .blog-grid {
        margin-bottom: 60px;
    }
}

.blog-grid .title {
    letter-spacing: -0.045em;
    margin-bottom: 35px;
    color: var(--color-dark);
}

@media only screen and (max-width: 767px) {
    .blog-grid .title {
        margin-bottom: 30px;
        letter-spacing: 0;
        line-height: 1.15;
    }
}

.blog-grid .title a:hover {
    color: var(--color-primary);
}

.blog-grid .author {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.blog-grid .author .info {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 20px;
}

.blog-grid .author .author-name {
    margin-bottom: 6px;
}

.blog-grid .post-thumbnail {
    margin: 30px 0;
    position: relative;
}

.blog-grid .post-thumbnail a {
    border-radius: 30px;
    overflow: hidden;
}

.blog-grid .post-thumbnail a img {
    border-radius: 30px;
    -webkit-transition: -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
    transition: transform 2s cubic-bezier(0.2, 0.96, 0.34, 1), -webkit-transform 2s cubic-bezier(0.2, 0.96, 0.34, 1);
}

.blog-grid .post-thumbnail .popup-video {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.blog-grid .post-thumbnail .popup-video .play-btn {
    height: 150px;
    width: 150px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: -webkit-linear-gradient(top, rgba(32, 38, 43, 0.8) 0%, #20262B 100%);
    background: linear-gradient(180deg, rgba(32, 38, 43, 0.8) 0%, #20262B 100%);
    border-radius: 50%;
    margin: 0 auto;
    font-size: 32px;
    color: var(--color-white);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.blog-grid .post-thumbnail .popup-video .play-btn:hover {
    background-color: var(--color-primary);
}

@media only screen and (max-width: 1199px) {
    .blog-grid .post-thumbnail .popup-video .play-btn {
        height: 100px;
        width: 100px;
        font-size: 26px;
    }
}

@media only screen and (max-width: 575px) {
    .blog-grid .post-thumbnail .popup-video .play-btn {
        height: 80px;
        width: 80px;
        font-size: 20px;
    }
}

.blog-grid:hover .post-thumbnail a img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.blog-grid.blog-without-thumb {
    background: var(--gradient-primary);
    padding: 50px;
    border-radius: 30px;
    border-right: 2px solid rgba(80, 92, 253, 0);

    background: linear-gradient(45deg, #1f3185db, #2d44aedb) !important;
    color: #e1ddd6;
    border-radius: 3rem;
}
.blog-grid.blog-without-thumb .title {color: #e1ddd6;}
.blog-grid.blog-without-thumb .author-name { color: #c8c0b8;}
.blog-grid.blog-without-thumb li {color: #e1ddd6;}

@media only screen and (max-width: 767px) {
    .blog-grid.blog-without-thumb {
        padding: 40px;
    }
}

.blog-grid.blog-without-thumb blockquote .title {
    margin-bottom: 30px;
    line-height: 1.4;
}

.blog-grid.blog-without-thumb .author .info {
    margin-left: 0;
}

.blog-grid.blog-thumb-slide .post-thumbnail .slick-list {
    margin: 0;
}

.blog-grid.blog-thumb-slide .post-thumbnail .slick-list .slick-slide {
    padding: 0;
}

.blog-grid.blog-thumb-slide .post-thumbnail .slick-dots {
    text-align: center;
    bottom: 50px;
}

@media only screen and (max-width: 767px) {
    .blog-grid.blog-thumb-slide .post-thumbnail .slick-dots {
        bottom: 20px;
    }
}

.recent-post-slide .slick-list {
    margin: 0;
}

.recent-post-slide .slick-list .slick-slide {
    padding: 0;
}

.blog-meta li {
    display: inline-block;
    color: var(--color-gray-2);
    color: #897f72;
    margin-right: 20px;
    position: relative;
    font-size: 14px;
}

.blog-meta li:after {
    content: "";
    height: 17px;
    width: 1px;
    background-color: var(--color-gray-2);
    position: absolute;
    top: 2px;
    right: -15px;
}

.blog-meta li:last-child:after {
    display: none;
}

.single-blog .single-blog-content .post-thumbnail {
    margin: 0 0 35px;
}

.single-blog .single-blog-content .post-thumbnail img {
    border-radius: 30px;
}

.single-blog .single-blog-content .author {
    margin-bottom: 30px;
}

.single-blog .single-blog-content p {
    margin-bottom: 20px;
    line-height: 1.7;
}

.single-blog .single-blog-content .wp-block-quote {
    margin: 50px 0;
    background: var(--gradient-primary);
    padding: 50px;
    border-radius: 30px;
    border-right: 2px solid rgba(80, 92, 253, 0);
}

.single-blog .single-blog-content .wp-block-quote p {
    font-size: 18px;
    margin-bottom: 0;
}

.single-blog .single-blog-content .list-style {
    padding-left: 20px;
    margin-top: 30px;
    margin-bottom: 30px;
}

.single-blog .single-blog-content .list-style li {
    margin: 12px 0;
}

.single-blog .audio-player {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 50px;
    margin-bottom: 60px;
    background-color: var(--color-mercury);
    box-shadow: none;
    border-radius: 30px;
    padding: 5px 30px;
}

.single-blog .audio-player .play-pause-btn svg {
    width: 10px;
}

.single-blog .audio-player .controls {
    font-size: 14px;
}

.single-blog .audio-player .controls .gap-progress {
    background-color: var(--color-primary);
}

.single-blog .audio-player .controls .gap-progress .progress__pin {
    height: 10px;
    width: 10px;
    top: -3px;
    background-color: var(--color-primary);
}

.single-blog .audio-player .volume .volume__button svg {
    width: 15px;
}

.single-blog .audio-player .volume .volume__button.open svg path {
    fill: var(--color-primary);
}

.single-blog .audio-player .volume .volume__controls .volume__progress {
    background-color: var(--color-primary);
}

.single-blog .audio-player .volume .volume__controls .volume__progress .pin {
    background-color: var(--color-primary);
}

.blog-author {
    background-color: var(--color-light);
    padding: 50px;
    border-radius: 30px;
    margin-bottom: 80px;
}

@media only screen and (max-width: 991px) {
    .blog-author {
        margin-bottom: 60px;
    }
}

@media only screen and (max-width: 767px) {
    .blog-author {
        padding: 30px;
    }
}

.blog-author .author {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

@media only screen and (max-width: 767px) {
    .blog-author .author {
        display: block;
        text-align: center;
    }
}

@media only screen and (max-width: 767px) {
    .blog-author .author .author-thumb {
        margin-bottom: 20px;
    }
}

.author .author-thumb img {
    border-radius: 50%;
}
.author-thumb {
    background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%) border-box;
    border-radius: 50em;
    border: 3px solid transparent;
    box-shadow: 2px 3px 5px -2px #7e5dff8c;
}

.blog-author .author .info {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 30px;
}

@media only screen and (max-width: 767px) {
    .blog-author .author .info {
        margin-left: 0;
    }
}

.blog-author .author .info .title {
    margin-bottom: 10px;
}
.blog-author .author .info .title a {
    font-family: 'Old Standard TT';
    font-style: italic;
    font-size: 35px;
    FONT-WEIGHT: 800;
}
.blog-author .author .info p {
    color: #737387;
    color: #30302f;
    margin-bottom: 22px;
    FONT-WEIGHT: 500;
}

.blog-author .author .social-share {
    margin: 0 -10px;
}

.blog-author .author .social-share li {
    display: inline-block;
}

.blog-author .author .social-share li a {
    font-size: var(--font-body-1);
    color: var(--color-body);
    padding: 0 10px;
}

.blog-author .author .social-share li a:hover {
    color: var(--color-primary);
}

.blog-comment {
    margin-bottom: 55px;
}

@media only screen and (max-width: 575px) {
    .blog-comment {
        margin-bottom: 40px;
    }
}

.blog-comment .section-title {
    margin-bottom: 50px;
}

.blog-comment .comment-list .comment {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 30px;
}

.blog-comment .comment-list .comment:last-child {
    margin-bottom: 0;
}

.blog-comment .comment-list .comment .thumbnail {
    padding-right: 30px;
}

.blog-comment .comment-list .comment .thumbnail img {
    height: 60px;
    width: 60px;
}

.blog-comment .comment-list .comment .content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.blog-comment .comment-list .comment .content .heading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 10px;
}

@media only screen and (max-width: 479px) {
    .blog-comment .comment-list .comment .content .heading {
        display: block;
    }
}

.blog-comment .comment-list .comment .content .heading .title {
    margin-bottom: 0;
}

@media only screen and (max-width: 479px) {
    .blog-comment .comment-list .comment .content .heading .title {
        margin-bottom: 8px;
    }
}

.blog-comment .comment-list .comment .content .heading .comment-date {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.blog-comment .comment-list .comment .content .heading .comment-date p {
    margin-bottom: 0;
    font-size: 15px;
    color: var(--color-primary);
}

.blog-comment .comment-list .comment .content .heading .comment-date .reply-btn {
    font-size: 14px;
    color: var(--color-primary);
    padding-left: 10px;
}

.blog-comment .comment-list .comment .content .heading .comment-date .reply-btn:hover {
    color: var(--color-dark);
}

.blog-comment .comment-list .comment .content p {
    margin-bottom: 20px;
}

.blog-comment .comment-list .comment-reply {
    margin-left: 75px;
}

@media only screen and (max-width: 575px) {
    .blog-comment .comment-list .comment-reply {
        margin-left: 30px;
    }
}

.blog-comment-form {
    background-color: var(--color-white);
    border-radius: 30px;
    padding: 50px;
    box-shadow: 0 40px 48px 0 rgba(153, 161, 170, 0.25);
}

@media only screen and (max-width: 767px) {
    .blog-comment-form {
        padding: 30px;
    }
}

.blog-comment-form .title {
    font-size: 40px;
}

@media only screen and (max-width: 991px) {
    .blog-comment-form .title {
        font-size: 36px;
    }
}

@media only screen and (max-width: 767px) {
    .blog-comment-form .title {
        font-size: 32px;
    }
}

@media only screen and (max-width: 767px) {
    .related-blog-area .section-heading .title {
        font-size: 36px;
    }
}

@media only screen and (max-width: 575px) {
    .related-blog-area .section-heading .title {
        font-size: 30px;
    }
}

.wp-block-quote {
    margin: 50px 0;
    background: var(--gradient-primary);
    padding: 50px;
    border-radius: 30px;
    border-right: 2px solid rgba(80, 92, 253, 0);
}

.wp-block-quote p {
    font-size: 18px;
    margin-bottom: 0;
}

/*-------------------------
    Widget
-------------------------*/
@media only screen and (max-width: 991px) {
    .axil-sidebar {
        margin-top: 50px;
    }
}

.axil-sidebar .widget {
    margin-bottom: 80px;
}

@media only screen and (max-width: 991px) {
    .axil-sidebar .widget {
        margin-bottom: 50px;
    }
}

.axil-sidebar .widget:last-child {
    margin-bottom: 0;
}

.widget.widget-search .blog-search {
    position: relative;
}

.widget.widget-search .blog-search input {
    padding-right: 45px;
}

.widget.widget-search .blog-search input:focus {
    box-shadow: none;
    border: var(--border-lighter);
}

.widget.widget-search .blog-search input::-webkit-input-placeholder {
    color: var(--color-dark);
}

.widget.widget-search .blog-search input::-moz-placeholder {
    color: var(--color-dark);
}

.widget.widget-search .blog-search input:-ms-input-placeholder {
    color: var(--color-dark);
}

.widget.widget-search .blog-search input::-ms-input-placeholder {
    color: var(--color-dark);
}

.widget.widget-search .blog-search input::placeholder {
    color: var(--color-dark);
}

.widget.widget-search .blog-search .search-button {
    position: absolute;
    right: 20px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    border: 0;
    padding: 0;
    background-color: transparent;
    font-weight: 500;
    color: var(--color-body);
}

.widget.widget-search .blog-search .search-button:before {
    content: "";
    position: absolute;
    background: var(--color-gray-4);
    height: 18px;
    width: 1px;
    left: -14px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.widget.widget-categories .category-list li:first-child a {
    padding-top: 0;
}

.widget.widget-categories .category-list a {
    display: block;
    font-size: var(--font-body-1);
    color: var(--color-body);
    border-bottom: var(--border-lighter);
    padding: 18px 0;
    position: relative;
}

.widget.widget-categories .category-list a:before {
    content: "";
    height: 1px;
    width: 0;
    background-color: var(--color-primary);
    position: absolute;
    bottom: -1px;
    left: 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.widget.widget-categories .category-list a:after {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4.5px 0 4.5px 6px;
    border-color: transparent transparent transparent var(--color-dark);
    position: absolute;
    right: 0;
    content: "";
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.widget.widget-categories .category-list a:hover {
    color: var(--color-primary);
}

.widget.widget-categories .category-list a:hover:before {
    visibility: visible;
    opacity: 1;
    width: 100%;
}

.widget.widget-categories .category-list a:hover:after {
    border-color: transparent transparent transparent var(--color-primary);
}

.widget.widge-social-share .blog-share {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    /* background-color: var(--color-primary); */
    background-color: #cecece;
    padding: 17px 30px;
    border-radius: 16px;
}

@media only screen and (max-width: 1199px) {
    .widget.widge-social-share .blog-share {
        padding: 24px 20px;
    }
}

.widget.widge-social-share .blog-share .title {
    color: var(--color-white);
    margin-bottom: 0;
    margin-right: 25px;

    font-family: 'Old Standard TT';
    font-style: italic;
    color: #050505;
}

@media only screen and (max-width: 1199px) {
    .widget.widge-social-share .blog-share .title {
        margin-right: 20px;
    }
}

.widget.widge-social-share .social-list {
    margin: 0 -10px;
}

.widget.widge-social-share .social-list li {
    display: inline-block;
}

.widget.widge-social-share .social-list li a {
    color: var(--color-white);
    padding: 5px 10px;
}

@media only screen and (max-width: 1199px) {
    .widget.widge-social-share .social-list li a {
        padding: 5px;
    }
}

.widget.widge-social-share .social-list li a:hover {
    opacity: 0.8;
}

.widget.widget-recent-post .single-post {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: var(--border-lighter);
}

.widget.widget-recent-post .single-post .post-thumbnail a {
    border-radius: 16px;
    overflow: hidden;
}

.widget.widget-recent-post .single-post .post-thumbnail a img {
    border-radius: 16px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.widget.widget-recent-post .single-post .post-content {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 20px;
}

.widget.widget-recent-post .single-post .post-content .title {
    margin-bottom: 10px;
}

.widget.widget-recent-post .single-post:hover .post-thumbnail a img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.widget.widget-recent-post .single-post:last-child {
    margin-bottom: 0;
    border-bottom: none;
    padding-bottom: 0;
}

.widget.widget-banner-ad a {
    border-radius: 20px;
}

.widget.widget-banner-ad a img {
    border-radius: 20px;
}

/*-------------------------
   Footer Styles
-------------------------*/
.footer-area {
    padding-top: 10px;
}

.footer-top {
    padding-bottom: 70px;
}

@media only screen and (max-width: 991px) {
    .footer-top {
        padding-bottom: 50px;
    }
}

.footer-social-link ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 -5px;
}

.footer-social-link ul li a {
    color: var(--color-gray-3);
    font-size: 30px;
    padding: 5px;
}

@media only screen and (max-width: 991px) {
    .footer-social-link ul li a {
        font-size: 20px;
    }
}

.footer-social-link ul li a:hover {
    color: var(--color-link);
}

.footer-widget {
    margin-bottom: 80px;
}

@media only screen and (max-width: 767px) {
    .footer-widget {
        margin-bottom: 50px;
    }
}

.footer-widget .widget-title {
    font-weight: 700;
}

.footer-widget.border-end {
    border-right-color: var(--color-ghost) !important;
    padding-right: 80px;
    margin-right: 40px;
}

@media only screen and (max-width: 1199px) {
    .footer-widget.border-end {
        border: none !important;
        padding-right: 0;
        margin-right: 0;
    }
}

.footer-newsletter .title {
    margin-bottom: 20px;
    letter-spacing: -0.045em;
    color:#f0f8ffb8;
}
.footer-newsletter p {
      color: #f0f8ffb8;
}
.footer-menu-link ul {
    margin: -8px 0;
}

.footer-menu-link li a {
    /* color: var(--color-body); */
    color: #f0f8ffb8;
    padding: 8px 0;
    font-size: 18px;
    line-height: 1.5;
}

@media only screen and (max-width: 991px) {
    .footer-menu-link li a {
        font-size: 16px;
    }
}

.footer-menu-link li a:hover {
    color: var(--color-link);
}

.footer-bottom {
    border-top: 1px solid var(--color-ghost);
    padding: 25px 0;
}

@media only screen and (max-width: 767px) {
    .footer-copyright {
        text-align: center;
        margin-bottom: 10px;
    }
}

.footer-copyright .copyright-text {
    color: var(--color-gray-1);
}

.footer-copyright .copyright-text a {
    color: var(--color-gray-1);
}

.footer-copyright .copyright-text a:hover {
    color: var(--color-primary);
}

.footer-bottom-link {
    text-align: right;
}

@media only screen and (max-width: 767px) {
    .footer-bottom-link {
        text-align: center;
    }
}

.footer-bottom-link ul {
    margin: 0 -20px;
}

.footer-bottom-link ul li {
    padding: 0 20px;
    display: inline-block;
    position: relative;
}

.footer-bottom-link ul li::after {
    content: "";
    height: 4px;
    width: 4px;
    background-color: var(--color-gray-4);
    border-radius: 50%;
    position: absolute;
    top: 53%;
    right: -5px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.footer-bottom-link ul li:last-child::after {
    display: none;
}

.footer-bottom-link ul li a {
    color: var(--color-gray-1);
}

.footer-bottom-link ul li a:hover {
    color: var(--color-link);
}

.footer-dark {
    background-color: var(--color-dark);
    padding-top: 0;
}

.footer-dark .footer-bottom {
    border-top-color: var(--color-body);
}

.footer-dark .footer-copyright .copyright-text {
    color: var(--color-gray-2);
}

.footer-dark .footer-copyright .copyright-text a {
    color: var(--color-gray-2);
}

.footer-dark .footer-copyright .copyright-text a:hover {
    color: var(--color-white);
}

.footer-dark .footer-bottom-link ul li a {
    color: var(--color-gray-2);
}

.footer-dark .footer-bottom-link ul li a:hover {
    color: var(--color-primary);
}

.footer-dark .footer-bottom-link ul li:after {
    background-color: var(--color-gray-2);
}

/*=======================================================================
5. Dark Style
=========================================================================*/
/*-------------------------
    Dark Style
-------------------------*/
.active-dark-mode {
    color-scheme: dark;
    --dark-main-body: #212121;
    --dark-bg-color: var(--color-dark);
    --dark-body-text: #D3D3D4;
    --dark-title-light: #D3D3D4;
    --dark-solid-btn: var(--color-ghost);
    --dark-border-gray: var(--color-body);
}

.active-dark-mode body {
    color: var(--dark-body-text);
}

.active-dark-mode p {
    color: var(--dark-body-text);
}

.active-dark-mode h1,
.active-dark-mode h2,
.active-dark-mode h3,
.active-dark-mode h4,
.active-dark-mode h5,
.active-dark-mode h6 {
    color: var(--dark-title-light);
}

.active-dark-mode ul li, .active-dark-mode ol li {
    color: var(--dark-body-text);
}

.active-dark-mode .form-group label {
    color: var(--dark-body-text);
}

.active-dark-mode input,
.active-dark-mode .form-control {
    color: var(--dark-body-text);
    border-color: var(--dark-border-gray);
  /* -- Placeholder -- */
}

.active-dark-mode input:focus,
.active-dark-mode .form-control:focus {
    box-shadow: none;
    border-color: transparent;
    background-color: #171717;
}

.active-dark-mode input::-webkit-input-placeholder, .active-dark-mode .form-control::-webkit-input-placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode input::-moz-placeholder, .active-dark-mode .form-control::-moz-placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode input:-ms-input-placeholder, .active-dark-mode .form-control:-ms-input-placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode input::-ms-input-placeholder, .active-dark-mode .form-control::-ms-input-placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode input::placeholder,
.active-dark-mode .form-control::placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode input:-ms-input-placeholder,
.active-dark-mode .form-control:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
    color: var(--dark-body-text);
}

.active-dark-mode input::-ms-input-placeholder,
.active-dark-mode .form-control::-ms-input-placeholder {
  /* Microsoft Edge */
    color: var(--dark-body-text);
}

.active-dark-mode .input-group {
    background-color: #171717;
    box-shadow: none;
}

.active-dark-mode .input-group::before {
    content: url("../../assets/media/icon/message-light.png");
}

@media only screen and (max-width: 479px) {
    .active-dark-mode .input-group {
        background-color: transparent;
    }

    .active-dark-mode .input-group .form-control:focus {
        background-color: transparent;
        border-color: var(--dark-border-gray);
    }
}

.active-dark-mode .error-msg, .active-dark-mode .success-msg {
    margin-top: 25px;
}

.active-dark-mode .error-msg p, .active-dark-mode .success-msg p {
    margin-bottom: 0;
    font-size: 14px;
}

.active-dark-mode .error-msg p {
    color: #ff0000;
}

.active-dark-mode .success-msg p {
    color: #15c54b;
}

.active-dark-mode .bg-color-light {
    background-color: var(--color-text-dark);
}

.active-dark-mode .bg-color-mercury {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .main-wrapper {
    background-color: var(--dark-main-body);
}

.active-dark-mode .axil-btn.btn-borderd {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
    overflow: hidden;
}

.active-dark-mode .axil-btn.btn-borderd::after {
    content: "";
    height: 350px;
    width: 350px;
    background-color: var(--color-link);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%) scale(0);
    -ms-transform: translateY(-50%) translateX(-50%) scale(0);
    transform: translateY(-50%) translateX(-50%) scale(0);
    -webkit-transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: -1;
}

.active-dark-mode .axil-btn.btn-borderd:hover {
    border-color: var(--color-link);
}

.active-dark-mode .axil-btn.btn-borderd:hover:after {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
    -ms-transform: translateY(-50%) translateX(-50%) scale(1);
    transform: translateY(-50%) translateX(-50%) scale(1);
}

.active-dark-mode .axil-btn.btn-fill-white {
    background-color: var(--color-primary);
    color: var(--color-white);
    overflow: hidden;
}

.active-dark-mode .axil-btn.btn-fill-white::after {
    content: "";
    height: 350px;
    width: 350px;
    background-color: var(--color-link);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%) scale(0);
    -ms-transform: translateY(-50%) translateX(-50%) scale(0);
    transform: translateY(-50%) translateX(-50%) scale(0);
    -webkit-transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: -1;
}

.active-dark-mode .axil-btn.btn-fill-white:hover:after {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
    -ms-transform: translateY(-50%) translateX(-50%) scale(1);
    transform: translateY(-50%) translateX(-50%) scale(1);
}

.active-dark-mode .shape-group-1 .shape img {
    -webkit-filter: brightness(0.2);
    filter: brightness(0.2);
}

.active-dark-mode .shape-group-3 .shape:not(.shape-3) img {
    -webkit-filter: brightness(0.3);
    filter: brightness(0.3);
}

.active-dark-mode .shape-group-4 .shape-1 img {
    -webkit-filter: brightness(0.2);
    filter: brightness(0.2);
}

.active-dark-mode .shape-group-6 .shape img {
    -webkit-filter: brightness(0.3);
    filter: brightness(0.3);
}

.active-dark-mode .shape-group-7 .shape img {
    -webkit-filter: brightness(0.2);
    filter: brightness(0.2);
}

.active-dark-mode .shape-group-8 .shape-1 img, .active-dark-mode .shape-group-8 .shape-2 img, .active-dark-mode .shape-group-8 .shape-3 img {
    -webkit-filter: brightness(0.3);
    filter: brightness(0.3);
}

.active-dark-mode .shape-group-9 .shape img {
    -webkit-filter: brightness(0.5);
    filter: brightness(0.5);
}

.active-dark-mode .shape-group-11 .shape img {
    -webkit-filter: brightness(0.5);
    filter: brightness(0.5);
}

.active-dark-mode .shape-group-12 .shape-3 img {
    opacity: 0.3;
}

.active-dark-mode .shape-group-13 .shape-1 img {
    -webkit-filter: brightness(0.1);
    filter: brightness(0.1);
}

.active-dark-mode .shape-group-13 .shape-2 img {
    -webkit-filter: brightness(0.3);
    filter: brightness(0.3);
}

.active-dark-mode .shape-group-17 .shape img {
    -webkit-filter: brightness(0.3);
    filter: brightness(0.3);
}

.active-dark-mode .shape-group-19 .shape {
    opacity: 0.2;
}

.active-dark-mode .shape-group-20 .shape-1 {
    opacity: 0.2;
}

.active-dark-mode .shape-group-20 .shape-2 {
    opacity: 0.2;
}

.active-dark-mode .shape-group-21 .shape-1 img {
    -webkit-filter: brightness(0.1);
    filter: brightness(0.1);
}

.active-dark-mode .shape-group-21 .shape-2 img {
    -webkit-filter: brightness(0.3);
    filter: brightness(0.3);
}

.active-dark-mode .slick-dot-nav .slick-dots li button {
    background-color: var(--dark-body-text);
}

.active-dark-mode .slick-dot-nav .slick-dots li.slick-active button {
    background-color: var(--color-primary);
}

.active-dark-mode .mainmenu li a {
    color: var(--dark-body-text);
}

.active-dark-mode .mainmenu li a::before {
    background-color: var(--dark-body-text);
}

.active-dark-mode .mainmenu li a:hover {
    color: var(--dark-title-light);
}

.active-dark-mode .mainmenu .menu-item-has-children a::after {
    color: var(--dark-body-text);
}

.active-dark-mode .mainmenu .menu-item-has-children .axil-submenu {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .mainmenu .menu-item-has-children .axil-submenu li a {
    color: var(--dark-body-text);
}

.active-dark-mode .mainmenu .menu-item-has-children .axil-submenu li a::after {
    background-color: var(--dark-title-light);
}

.active-dark-mode .mainmenu .menu-item-has-children .axil-submenu li a:hover {
    color: var(--dark-title-light);
}

.active-dark-mode .axil-mainmenu.axil-sticky {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .axil-mainmenu.axil-sticky .header-action .social-icon-list li a {
    color: var(--color-white);
}

.active-dark-mode .axil-header .header-navbar .header-logo .light-version-logo {
    display: none;
}

.active-dark-mode .axil-header .header-navbar .header-logo .dark-version-logo {
    display: block;
}

.active-dark-mode .axil-header.header-style-1 .axil-mainmenu.axil-sticky .header-navbar .header-logo .sticky-logo {
    display: none;
}

.active-dark-mode .axil-header.header-style-3 .axil-mainmenu.axil-sticky .header-navbar .header-logo .sticky-logo {
    display: none;
}

.active-dark-mode .axil-header.header-style-3 .header-action .sidemenu-btn .btn-wrap {
    background-color: #464646;
}

.active-dark-mode .axil-header.header-style-3 .header-action .social-icon-list li a {
    color: var(--dark-body-text);
}

.active-dark-mode .axil-header.header-style-4 .mainmenu-nav .mainmenu li a {
    color: var(--dark-body-text);
}

.active-dark-mode .axil-header.header-style-4 .mainmenu-nav .mainmenu li a::after {
    color: var(--dark-body-text);
}

.active-dark-mode .axil-header.header-style-4 .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li a {
    color: var(--dark-body-text);
}

.active-dark-mode .header-offcanvasmenu {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .header-offcanvasmenu .offcanvas-header .btn-close {
    background-color: var(--dark-body-text);
    border-radius: 50%;
    height: 20px;
    width: 20px;
    line-height: 20px;
    font-size: 14px;
}

.active-dark-mode .header-offcanvasmenu .offcanvas-body .main-navigation li a {
    color: var(--dark-title-light);
}

.active-dark-mode .header-offcanvasmenu .offcanvas-body .main-navigation li a:hover {
    color: var(--color-white);
}

.active-dark-mode .header-offcanvasmenu .offcanvas-body .contact-inner .title {
    color: var(--dark-title-light);
}

.active-dark-mode .header-offcanvasmenu .offcanvas-body .contact-inner .address a {
    color: var(--dark-body-text);
}

.active-dark-mode .header-offcanvasmenu .offcanvas-body .contact-inner .address a:hover {
    color: var(--color-white);
}

.active-dark-mode .header-action .sidemenu-btn .btn-wrap {
    background-color: var(--color-body);
}

.active-dark-mode .header-action .sidemenu-btn .btn-wrap span {
    background-color: var(--dark-title-light);
}

.active-dark-mode .mobile-nav-header {
    border-bottom-color: var(--dark-border-gray);
}

.active-dark-mode .mobile-nav-header .mobile-menu-close {
    /* background-color: #6d9ab5; */
    color: var(--dark-bg-color);
    border: none;
}

.active-dark-mode .mobile-nav-header .mobile-nav-logo .light-mode {
    display: none;
}

.active-dark-mode .mobile-nav-header .mobile-nav-logo .dark-mode {
    display: block;
}

@media only screen and (max-width: 991px) {
    .active-dark-mode .mainmenu-nav {
        /* background-color: var(--dark-bg-color); */
         background: radial-gradient(#518bafbd 46%, #161616bd);
    }

    .active-dark-mode .mainmenu-nav .mainmenu > li {
        border-bottom-color: var(--dark-border-gray);
    }

    .active-dark-mode .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu {
        background-color: transparent;
    }

    .active-dark-mode .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li a {
        color: var(--dark-body-text);
    }

    .active-dark-mode .mainmenu-nav .mainmenu .menu-item-has-children .axil-submenu li a:hover {
        color: var(--color-primary);
    }
}

.active-dark-mode .banner .banner-content .title {
    color: var(--dark-title-light);
}

.active-dark-mode .banner .banner-content .subtitle {
    color: var(--dark-body-text);
}

.active-dark-mode .banner .banner-content .axil-btn {
    box-shadow: none;
}

.active-dark-mode .banner .banner-social .social-icon li a {
    color: var(--dark-body-text);
}

.active-dark-mode .banner .banner-social .social-icon li a i {
    color: var(--dark-body-text);
}

.active-dark-mode .banner.banner-style-2 {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .banner.banner-style-4 {
    background: var(--dark-main-body);
}

.active-dark-mode .banner.banner-style-5 .banner-content .axil-btn {
    color: var(--dark-solid-btn);
}

.active-dark-mode .section-heading .title {
    color: var(--dark-title-light);
}

.active-dark-mode .section-heading p {
    color: var(--dark-body-text);
}

.active-dark-mode .heading-light-left p {
    opacity: 1 !important;
}

.active-dark-mode .breadcrum-area {
    background: var(--dark-bg-color);
}

.active-dark-mode .case-study-counterup .single-counterup {
    border-right-color: var(--dark-border-gray);
}

.active-dark-mode .case-study-counterup .counter-title {
    color: var(--dark-body-text);
}

.active-dark-mode .isotope-project-btn button {
    color: var(--dark-body-text);
}

.active-dark-mode .isotope-project-btn button::after {
    background-color: var(--dark-body-text);
}

.active-dark-mode .project-add-banner .content .title {
    color: var(--color-dark);
}

.active-dark-mode .project-grid {
    box-shadow: none;
}

.active-dark-mode .project-grid .content {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .project-grid .content .subtitle {
    color: var(--dark-body-text);
}

.active-dark-mode .project-grid.project-style-2 .content {
    background-color: transparent;
}

.active-dark-mode .project-grid.project-style-2 .content .subtitle {
    color: var(--color-body);
}

.active-dark-mode .project-grid.project-style-2 .content .title {
    color: var(--color-text-dark);
}

.active-dark-mode .process-work .content p {
    color: var(--dark-body-text);
}

.active-dark-mode .services-grid .content .title a {
    color: inherit;
}

.active-dark-mode .services-grid .content .title a:hover {
    color: var(--color-primary);
}

.active-dark-mode .services-grid .content p {
    color: var(--dark-body-text);
    opacity: 1;
}

.active-dark-mode .services-grid .content .more-btn {
    color: var(--dark-solid-btn);
}

.active-dark-mode .services-grid:hover .content .more-btn, .active-dark-mode .services-grid.active .content .more-btn {
    color: var(--color-accent2);
}

.active-dark-mode .services-grid.service-style-2 {
    background: var(--dark-bg-color);
}

.active-dark-mode .services-grid.service-style-2 .content .title a {
    color: var(--dark-title-light);
}

.active-dark-mode .services-grid.service-style-2 .content p {
    color: var(--dark-body-text);
}

.active-dark-mode .services-grid.service-style-2 .content .more-btn {
    color: var(--dark-solid-btn);
}

.active-dark-mode .services-grid.service-style-2:hover .content .more-btn, .active-dark-mode .services-grid.service-style-2.active .content .more-btn {
    color: var(--color-primary);
}

.active-dark-mode .service-scroll-nav {
    background-color: var(--dark-main-body);
}

.active-dark-mode .service-scroll-nav ul {
    border-bottom-color: var(--dark-border-gray);
}

.active-dark-mode .service-scroll-nav ul li a {
    color: var(--dark-body-text);
}

.active-dark-mode .service-scroll-nav ul li a:hover {
    color: var(--color-white);
}

.active-dark-mode .service-scroll-nav ul li a:after {
    background-color: var(--color-white);
}

.active-dark-mode .service-scroll-nav ul li.current a {
    color: var(--color-white);
}

.active-dark-mode .contact-form-box {
    background-color: var(--dark-main-body);
}

.active-dark-mode .contact-form-box.shadow-box {
    box-shadow: 0 20px 48px 0 rgba(0, 0, 0, 0.25);
}

.active-dark-mode .contact-address .address p {
    color: var(--dark-body-text);
}

.active-dark-mode .contact-address .address p a {
    color: var(--dark-body-text);
}

.active-dark-mode .testimonial-grid .author-info .content .name {
    color: var(--dark-title-light);
}

.active-dark-mode .testimonial-grid p {
    color: var(--dark-body-text);
}

.active-dark-mode .followers-list li a span {
    color: var(--dark-body-text);
}

.active-dark-mode .pricing-billing-duration ul {
    background-color: var(--dark-main-body);
    border-color: var(--dark-border-gray);
}

.active-dark-mode .pricing-billing-duration ul .nav-link {
    color: var(--dark-body-text);
}

.active-dark-mode .pricing-billing-duration ul .nav-link.active {
    background-color: var(--color-link);
}

.active-dark-mode .pricing-table {
    background-color: var(--dark-main-body);
}

.active-dark-mode .pricing-table .pricing-header .subtitle {
    color: var(--dark-body-text);
}

.active-dark-mode .pricing-table .pricing-header .price-wrap {
    border-color: rgba(227, 230, 233, 0.2);
}

.active-dark-mode .pricing-table .pricing-header .price-wrap .amount {
    color: var(--dark-body-text);
}

.active-dark-mode .pricing-table:hover .pricing-header .price-wrap, .active-dark-mode .pricing-table.active .pricing-header .price-wrap {
    border-color: rgba(227, 230, 233, 0.4);
}

.active-dark-mode .pricing-table:hover .pricing-header .price-wrap .amount, .active-dark-mode .pricing-table.active .pricing-header .price-wrap .amount {
    color: var(--color-white);
}

.active-dark-mode .pricing-table:hover .pricing-header .axil-btn, .active-dark-mode .pricing-table.active .pricing-header .axil-btn {
    background-color: var(--color-primary);
    border-color: var(--color-link);
    color: var(--color-white);
}

.active-dark-mode .pricing-table:hover .pricing-header .axil-btn:after, .active-dark-mode .pricing-table.active .pricing-header .axil-btn:after {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
    -ms-transform: translateY(-50%) translateX(-50%) scale(1);
    transform: translateY(-50%) translateX(-50%) scale(1);
}

.active-dark-mode .pricing-table.pricing-borderd {
    border-color: var(--dark-border-gray);
}

.active-dark-mode .why-choose-us .accordion-item {
    border-bottom-color: var(--dark-border-gray);
}

.active-dark-mode .why-choose-us .accordion-item .accordion-button.collapsed {
    color: var(--dark-body-text);
}

.active-dark-mode .why-choose-us .accordion-item .accordion-body {
    color: var(--dark-body-text);
}

.active-dark-mode .faq-accordion .accordion-item {
    background-color: var(--dark-main-body);
    box-shadow: none;
}

.active-dark-mode .faq-accordion .accordion-button {
    background-color: transparent;
}

.active-dark-mode .faq-accordion .accordion-button.collapsed {
    color: var(--dark-body-text);
}

.active-dark-mode .faq-accordion .accordion-button.collapsed::after {
    color: var(--dark-body-text);
}

.active-dark-mode .faq-accordion .accordion-body p {
    color: var(--dark-body-text);
}

.active-dark-mode .counterup-progress .title {
    color: var(--dark-title-light);
}

.active-dark-mode .counterup-progress.counterup-style-2 {
    background: var(--dark-bg-color);
}

.active-dark-mode .counterup-progress.counterup-style-2 .icon .light-icon {
    display: inline-block;
}

.active-dark-mode .counterup-progress.counterup-style-2 .icon .dark-icon {
    display: none;
}

.active-dark-mode .counterup-progress.counterup-style-2 .title {
    color: var(--dark-title-light);
}

.active-dark-mode .blog-list {
    border-top-color: var(--dark-border-gray);
    border-bottom-color: var(--dark-border-gray);
}

.active-dark-mode .blog-list .post-content p {
    color: var(--dark-body-text);
}

.active-dark-mode .blog-list .post-content .more-btn {
    color: var(--dark-solid-btn);
}

.active-dark-mode .blog-list.border-start {
    border-left-color: var(--dark-border-gray) !important;
}

.active-dark-mode .blog-grid .title {
    color: var(--dark-title-light);
}

.active-dark-mode .blog-grid.blog-without-thumb {
    background: var(--dark-bg-color);
}

.active-dark-mode .blog-author {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .blog-author .author .info .title {
    color: var(--dark-title-light);
}

.active-dark-mode .blog-author .author .info p {
    color: var(--dark-body-text);
}

.active-dark-mode .blog-author .author .social-share li a {
    color: var(--dark-body-text);
}

.active-dark-mode .blog-author .author .social-share li a:hover {
    color: var(--color-white);
}

.active-dark-mode .blog-comment-form {
    background-color: var(--dark-bg-color);
    box-shadow: none;
}

.active-dark-mode .blog-comment-form .form-control:focus {
    background-color: var(--dark-main-body);
}

.active-dark-mode .single-blog .single-blog-content .wp-block-quote {
    background: var(--dark-bg-color);
}

.active-dark-mode .wp-block-quote {
    background: var(--dark-bg-color);
}

.active-dark-mode .call-to-action-area {
    border: var(--dark-border-gray);
}

.active-dark-mode .call-to-action-area::before {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .call-to-action-area .call-to-action {
    border-color: var(--dark-border-gray);
}

.active-dark-mode .footer-social-link ul li a {
    color: var(--dark-body-text);
    -webkit-transition: var(--transition);
    transition: var(--transition);
}

.active-dark-mode .footer-social-link ul li a:hover {
    color: var(--color-primary);
}

.active-dark-mode .footer-widget.border-end {
    border-right-color: var(--dark-border-gray) !important;
}

.active-dark-mode .footer-menu-link li a {
    color: var(--dark-body-text);
}

.active-dark-mode .footer-menu-link li a:hover {
    color: var(--color-primary);
}

.active-dark-mode .footer-bottom {
    border-top-color: var(--dark-border-gray);
}

.active-dark-mode .footer-bottom-link ul li a {
    color: var(--dark-body-text);
}

.active-dark-mode .footer-bottom-link ul li a:hover {
    color: var(--color-white);
}

.active-dark-mode .footer-bottom-link ul li::after {
    background-color: var(--dark-body-text);
}

.active-dark-mode .footer-copyright .copyright-text {
    color: var(--dark-body-text);
}

.active-dark-mode .footer-copyright .copyright-text a {
    color: var(--dark-body-text);
}

.active-dark-mode .footer-copyright .copyright-text a:hover {
    color: var(--color-white);
}

.active-dark-mode .widget.widget-search .blog-search input {
  /* -- Placeholder -- */
}

.active-dark-mode .widget.widget-search .blog-search input::-webkit-input-placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode .widget.widget-search .blog-search input::-moz-placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode .widget.widget-search .blog-search input:-ms-input-placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode .widget.widget-search .blog-search input::-ms-input-placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode .widget.widget-search .blog-search input::placeholder {
    color: var(--dark-body-text);
  /* Firefox */
    opacity: 1;
}

.active-dark-mode .widget.widget-search .blog-search input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
    color: var(--dark-body-text);
}

.active-dark-mode .widget.widget-search .blog-search input::-ms-input-placeholder {
  /* Microsoft Edge */
    color: var(--dark-body-text);
}

.active-dark-mode .widget.widget-search .blog-search .search-button {
    color: var(--dark-body-text);
}

.active-dark-mode .widget.widget-categories .category-list a {
    color: var(--dark-body-text);
    border-bottom-color: var(--dark-border-gray);
}

.active-dark-mode .widget.widget-categories .category-list a::after {
    border-color: transparent transparent transparent var(--dark-body-text);
}

.active-dark-mode .widget.widge-social-share .blog-share {
    background-color: var(--dark-bg-color);
}

.active-dark-mode .widget.widget-recent-post .single-post {
    border-bottom-color: var(--dark-border-gray);
}

.active-dark-mode .pagination ul li a {
    border-color: var(--dark-border-gray);
    color: var(--dark-body-text);
}

.active-dark-mode .pagination ul li a:hover {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.active-dark-mode .pagination ul li a.current {
    border-color: var(--color-primary);
}

.active-dark-mode .onepage-screen-area {
    background: transparent;
}

.active-dark-mode .onepage-screen-area .content .countdown .countdown-section::after {
    background-color: var(--dark-border-gray);
}

.active-dark-mode .onepage-screen-area .content .countdown .countdown-section .countdown-unit {
    color: var(--dark-body-text);
}

.active-dark-mode .onepage-screen-area.coming-soon-area .site-logo .logo-light {
    display: none;
}

.active-dark-mode .onepage-screen-area.coming-soon-area .site-logo .logo-dark {
    display: block;
}

.active-dark-mode .splash-main-banner {
    background-color: var(--color-text-dark);
}

.active-dark-mode .splash-main-banner:before {
    background: var(--dark-main-body);
}

.active-dark-mode .splash-main-banner .site-element-count .count-title {
    color: var(--dark-body-text);
}

.active-dark-mode .splash-main-banner .demo-slider .slick-slide a {
    box-shadow: none;
}

.active-dark-mode .main-demo-area .single-demo .thumb {
    box-shadow: none;
}

.active-dark-mode .main-demo-area .shape-group li {
    opacity: 0.1;
}

.active-dark-mode .spalsh-why-choose .why-buy-box {
    background-color: var(--dark-main-body);
    border-color: var(--dark-main-body);
}

.active-dark-mode .spalsh-why-choose .why-buy-box.active {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.active-dark-mode .spalsh-why-choose .line-shape {
    opacity: 0.1;
}

.active-dark-mode .support-box a {
    background-color: var(--dark-main-body);
    border-color: var(--dark-main-body);
}

.active-dark-mode .support-box:hover a, .active-dark-mode .support-box.active a {
    box-shadow: 0 50px 50px -24px rgba(1, 1, 1, 0.3);
}

.active-dark-mode .splash-call-to-action {
    background-color: var(--dark-bg-color);
}

/*=======================================================================
6. Spacing
=========================================================================*/
/*-------------------------
    Section Space
-------------------------*/
.section-padding {
    padding: 140px 0 110px;
}

@media only screen and (max-width: 1199px) {
    .section-padding {
        padding: 100px 0 70px;
    }
}

@media only screen and (max-width: 991px) {
    .section-padding {
        padding: 80px 0 50px;
    }
}

@media only screen and (max-width: 767px) {
    .section-padding {
        padding: 60px 0 30px;
    }
}

.section-padding-2 {
    padding: 140px 0 100px;
}

@media only screen and (max-width: 1199px) {
    .section-padding-2 {
        padding: 100px 0 60px;
    }
}

@media only screen and (max-width: 991px) {
    .section-padding-2 {
        padding: 80px 0 40px;
    }
}

@media only screen and (max-width: 767px) {
    .section-padding-2 {
        padding: 60px 0 20px;
    }
}

.section-padding-equal {
    padding: 140px 0;
}

@media only screen and (max-width: 1199px) {
    .section-padding-equal {
        padding: 100px 0;
    }
}

@media only screen and (max-width: 991px) {
    .section-padding-equal {
        padding: 80px 0;
    }
}

@media only screen and (max-width: 767px) {
    .section-padding-equal {
        padding: 60px 0;
    }
}

.mt--200 {
    margin-top: 200px;
}

.mt--150 {
    margin-top: 150px;
}

.mt--100 {
    margin-top: 100px;
}

.mt--90 {
    margin-top: 90px;
}

.mt--80 {
    margin-top: 80px;
}

.mt--20 {
    margin-top: 20px !important;
}

.mb--100 {
    margin-bottom: 100px;
}

.mb--90 {
    margin-bottom: 90px;
}

.mb--80 {
    margin-bottom: 80px !important;
}

.mb--50 {
    margin-bottom: 50px !important;
}

.mb--40 {
    margin-bottom: 40px !important;
}

.mb--30 {
    margin-bottom: 30px !important;
}

.mb--20 {
    margin-bottom: 20px !important;
}

.ml--20 {
    margin-left: 20px !important;
}

.pt--250 {
    padding-top: 250px;
}

.pt--200 {
    padding-top: 200px;
}

.pt--150 {
    padding-top: 150px;
}

.pb--90 {
    padding-bottom: 90px;
}

.pb--80 {
    padding-bottom: 80px;
}

.pb--70 {
    padding-bottom: 70px;
}

.plr--30 {
    padding: 0 30px;
}

@media only screen and (max-width: 1199px) {
    .pt_lg--200 {
        padding-top: 200px;
    }

    .pt_lg--100 {
        padding-top: 100px;
    }

    .pb_lg--40 {
        padding-bottom: 40px;
    }

    .pb_lg--20 {
        padding-bottom: 20px;
    }
}

@media only screen and (max-width: 991px) {
    .mb_md--70 {
        margin-bottom: 70px;
    }

    .mb_md--30 {
        margin-bottom: 30px;
    }

    .pt_md--100 {
        padding-top: 100px;
    }

    .pt_md--80 {
        padding-top: 80px;
    }

    .pb_md--70 {
        padding-bottom: 70px;
    }

    .pb_md--20 {
        padding-bottom: 20px;
    }

    .mt_md--0 {
        margin-top: 0;
    }

    .mb_md--0 {
        margin-bottom: 0;
    }

    .pb_md--0 {
        padding-bottom: 0;
    }
}

@media only screen and (max-width: 767px) {
    .pt_sm--80 {
        padding-top: 80px;
    }

    .pt_sm--60 {
        padding-top: 60px;
    }

    .pb_sm--0 {
        padding-bottom: 0;
    }
}

/* контакты */
.contact-p {
    /* background: radial-gradient(circle at 72% -8%, #98aeff, transparent, #daa130); */
    background: radial-gradient(circle at 72% -8%, #98aeff, transparent, #ba7b00)
} 
.header-action .sidemenu-btn .btn-wrap span {
    background-color: #2354a2!important;
}
.contact-p h1 {
    FONT-WEIGHT: 400;
    margin-top: 4px;
    color: #2254a2 !important;
    text-shadow: .5px .5px 1px #ffffff;
    line-height: 1;
     @media only screen and (max-width: 767px) { margin-left: 1rem;}
}
.contact-p h4, .h4 {
    font-size: var(--h4);
    line-height: 1.2;
    font-family: 'Old Standart TT';
    text-transform: uppercase;
    letter-spacing: .05em;
    @media only screen and (max-width: 767px) { font-size: 24px !important;}
}
/* .contact-p .footer {
    background: #aaa298;
    } */
.contact-p .footer-menu-link a {
    color: #916b27 !important;
 }
    @media only screen and (max-width: 600px)  {
       .contact-p .footer-newsletter p {color: #916b27 !important;}
    }
/* куки */
.cookie-p, .privacy-p, .rekvizit-p, .term-p, .vozvrat-p {background: #151797;    background: linear-gradient(226deg, #151797, #7273a6);}
  
:is(.cookie-p, .privacy-p, .rekvizit-p, .term-p, .vozvrat-p) h1 {
    FONT-WEIGHT: 400;
    margin-top: 4px;
    color: #f6faff !important;
    text-shadow: .5px .5px 1px #275ac0;
    line-height: 1;
     @media only screen and (max-width: 767px) { margin-left: 1rem;}
}
:is(.cookie-p, .privacy-p, .rekvizit-p, .term-p, .vozvrat-p) .contact-info {
     text-align: justify;
     justify-items: center;
}
:is(.cookie-p, .privacy-p, .rekvizit-p, .term-p, .vozvrat-p) .contact-info p {
    color: #c8cfdf;
}
:is(.cookie-p, .privacy-p, .rekvizit-p, .term-p, .vozvrat-p) .contact-info h4 {
    color: #c8cfdf;text-align: left;
}
:is(.cookie-p, .privacy-p, .rekvizit-p, .term-p, .vozvrat-p) .contact-info ul {
    color: #c8cfdf;width: 80%;
}
:is(.cookie-p, .privacy-p, .rekvizit-p, .term-p, .vozvrat-p) .footer-area {
    background: #b5c7b6;background: #89b78b;
}
:is(.cookie-p, .privacy-p, .rekvizit-p, .term-p, .vozvrat-p) .header-action .sidemenu-btn .btn-wrap span {
    background-color: #cecee4;
}
 
.rekvizit-p h4 {
    line-height: 1.2;
    font-family: 'Old Standart TT';
    text-transform: uppercase;
    letter-spacing: .05em;
}
/* .faq-p h1 {
    FONT-WEIGHT: 400;
    margin-top: 4px;
    color: #4776c8 !important;
    text-shadow: .5px .5px 1px #ffffff;
    line-height: 1;
} */
.news-p {
    background: radial-gradient(circle at 72% -8%, #ff98f0, transparent, #daa130);
}
.news-p .novosti .title {
    color: #ffeaea !important;
    line-height: 1.2;
    font-family: 'Old Standart TT';
    text-transform: uppercase;
    letter-spacing: .05em;
}
.novosti p {
    width: 100% !important;
    margin: 0;
    color: #f1d8d8 !important;
}
.novosti {
    box-shadow: -2px 3px 4px rgb(0 101 227 / 19%), inset -2px 2px 81px rgb(207 219 255 / 51%) !important;
    }
.news-p .contact-info {
    @media only screen and (max-width: 600px) {padding: 30px 30px 50px;
    }
}
.news .footer-area {
    background: #afc3d5;
}
.lh-100 {line-height: 100%!important}
.lh-120 {line-height: 120%!important}
.lh-125 {line-height: 125%!important}
.fw-700 {font-weight: 700!important}

.old-curs {font-family: 'Old Standart TT';font-style: italic;}

.main-wrapper.subtle-stars-plate {padding: 2rem;}

.services-grid.service-style-2 .yung {bottom: 0;position: absolute;width: 170px;left: 212px; filter: drop-shadow(-7px 4px 6px aliceblue);}
.services-grid.service-style-2 .proger {bottom: 0;position: absolute;width: 189px;left: 7px;filter: drop-shadow(6px 4px 6px aliceblue);}
.shtora-left {opacity: .8;width: 473px;left: -33%;position: relative;}
.shtora-right {opacity: .8;transform: scaleX(-1);right: -93px;position: relative;width: 473px;}
.sms-pers-2-fon {mask: url(/assets/media/fig.png);border-radius: 0;width: 514px;mask-size: 342px;mask-repeat: no-repeat;z-index: 11;position: relative;align-content: center;display: flex;justify-content: center;align-items: center;left: 38px;top: 47px;}
.process-work.content-reverse .content {margin-right: 85px;}
.process-work.zigmund .paralax-image {filter: drop-shadow(#000000b5 20px 4px 6px);height: 421px;align-self: center;will-change: transform;transform: perspective(1000px) rotateX(0deg) rotateY(0deg);}
.process-work.zigmund .subtitle {justify-self: center;}



.but-reg a {
  /* background: radial-gradient(circle at top, #cfcfcf00 20%, #5a68a9 45%, #cecdfffc 108%) !important; */
  background: radial-gradient(circle at top, #5866a7 20%, #5a68a9 45%, #cecdfffc 108%) !important;
  color: #1f2c55 !important;
}

.reg-but {
  --star-x: 0px;
  --star-y: 0px;
  --star-scale: 1;
  --star-opacity: 0;
  position: relative;
}

.oval-path {
  position: absolute;
  width: 100px;
  height: 50px;
  top: -25px;
  left: calc(50% - 50px);
  opacity: 0; /* Скрываем путь, оставляем только для анимации */
  pointer-events: none;
}

.star {
  position: absolute;
  top: -10px;
  left: 50%;
  font-size: 20px;
  color: #fff7b0;
  opacity: 0;
  offset-path: path('M50,0 a25,15 0 1,1 0,30 a25,15 0 1,1 0,-30');
  offset-anchor: center;
  width: 19px;
    filter: contrast(3.5);
}
.star img {filter: hue-rotate(55deg)}
.reg-but:hover .star {
  opacity: 1;
  /* filter: brightness(1.5); */
  animation: moveOnPath 2s linear infinite;
}

@keyframes moveOnPath {
  0 {
    offset-distance: 0%;transform:scale(1);
  }
  50% {
    offset-distance: 50%;transform:scale(1.5);
  }
  100% {
    offset-distance: 100%;transform:scale(1);
  }
}

.main-btn {
  background: linear-gradient(347deg, #65a0ff66 15%, #3dd1ff87 41%, #c8c4f9 82%) !important;
  border: 1px solid rgb(255 255 255 / 59%) !important;
  border-radius: 25px !important;
  padding: 0px 25px !important;
  font-family: 'Unbounded';
  line-height: 41px;
  box-shadow: rgb(157, 157, 157) 0px 0px 5px 0px, rgb(28 153 255) 1px -1px 5px 0px inset !important;
  height: 46px;
  color: rgb(255 255 255) !important;
  letter-spacing: .1px;
}
.axil-mainmenu.axil-sticky {
    backdrop-filter: blur(1px);
    background-position: center;
    background-size: 150%;
    border-radius: 0 0 40% 40%;
    background-color: #ffffff5c;
}
.menu-svet {
  /* border: 2px #fff;
  border-style: ridge groove groove none;
  background: radial-gradient(#ffffff61, #d3cce9);
  box-shadow: rgba(126, 93, 255, 0.55) 2px 3px 5px -2px; */
    border: 2px #ffe3a8;
    border-style: groove ridge ridge none;
    background: #ffffff61;
    box-shadow: rgba(126, 93, 255, 0.55) 2px 3px 5px -2px, inset -9px 0 13px #5a74c359;
}
.menu-svet img {
    filter: drop-shadow(2px 0px 0px #927e37) brightness(1.25);
    pointer-events: none;
    transition: 1s ease-in;
}

.menu-svet:active img, .menu-mob:active img { 
    animation: svet-oborot 1s;
} 
.menu-mob {
    border: 2px #ffe3a8;
    /* border-style: groove ridge ridge groove; */
    border-radius: 50%;
    border-style: groove none ridge none;
    background: #ffffff61;
    box-shadow: rgba(126, 93, 255, 0.55) 2px 3px 5px -2px, inset -9px 0 13px #5a74c359;
}
.menu-mob button {
    background-color:unset!important;
    height: 48px!important;
}
.menu-mob img {
    max-width: 99%;
    filter: drop-shadow(0px 0px 0px #927e37) brightness(1.25);
    pointer-events: none;
    transition: 1s ease-in;
}
.header-action .sidemenu-btn .btn-wrap span {
    background-color: #cecee4;
}
 @keyframes svet-oborot {
    0% { rotate: 0deg; } 
    100% {rotate: -45deg; }
}
 
.sec-1, .sec-2-2, .sec-3, .sec-4, .sec-5, .sec-6, .sec-7 {
  border: 2px #bbbbbb;
  border-style: outset;
  border-radius: 96px!important;
  padding: 5rem 4rem 4rem;
  @media screen and (max-width:600px) { padding: 2.5rem .5rem 2rem!important;border-radius: 68px!important; }
  @media (min-width:600px) and (max-width:1000px) {padding: 4rem 3rem 3rem!important;}
}
}
}
/* секция 1 */
.sec-1 {
  background: #dfdfdf29 !important;
  overflow: hidden!Important;
  padding-bottom: 5rem;
}
.sec-1 h1 {
  background-clip: text;
  color: #8c8c8c75;
  width: fit-content;
  background-image: url(/assets/media/plast-min.png);
  background-position: 20% 20%;
  text-shadow: 1px 0 4px #8685856e;
  font-size: 63px !important;
  line-height: 1 !important;
  color: #ffffff75 !important; */
  background-clip: text;
  width: fit-content;
  /* background-image: url(/assets/media/plast-min.png); */
  background-position: 20% 20%;
  text-shadow: 1px 0 2px #ffffff8f;
  line-height: 1 !important;
  color: #ffffff75 !important;
  color: #ffffffb5 !important;
}
.sec-1 .subtitle {
    line-height: 120%;
    background: linear-gradient(180deg, #ffffff 20%, #52441d 30%, #fff 71%, #484848 76%, #fff 86%);
    background-clip: text;
    font-family: 'Unbounded';
    FONT-WEIGHT: 400;
    text-shadow: .5px .5px 1px #ffffffd1;
    color: #f0f8ff52;
}
.cont-main-r {
    padding: .35rem;
    border-radius: 96px;
    background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2), inset 0 0 0 2px rgba(255, 255, 255, 0.3);
}
.cont-on-main {
  background: radial-gradient(ellipse at top, #1e3c72 0%, #2a5298 50%, #1c1c3e 100%);
  border-radius: 7rem;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 50, 0.3);
  display: flex;
  position: relative;
  width: 100%;
  @media screen and (max-width:1100px) { max-height: 912px;}
}
.cont-on-main > .row {
    padding-bottom: 130px;
    padding-top: 130px;
    background: linear-gradient(45deg, black, transparent);
    border-radius: 7rem;
    box-shadow: 0 0 5px 0px #9d9d9d, inset 1px -1px 5px 0px #9d9d9d;
    @media screen and (max-width:1100px) {padding-bottom: 0;padding-top: 260px; }
}
@keyframes glavnay {
      0% {
          opacity: 0;
      }

      5% {
          opacity: 100%;
      }

      25% {
          transform: translateX(50px) translateY(-8px);
          opacity: 0;
      }

      60% {
          opacity: 0;
      }

      100% {
          opacity: 0;
          transform: translateX(-50px) translateY(8px);
      }
}

.personas-fon {
  background-size: cover;
  animation: personas-fon-change 35s linear infinite;
  transition: .5s all;
}
@keyframes personas-fon-change {
  0% {background-image: url(/assets/media/banner/fon-1.jpg);}
    18% {background-image: url(/assets/media/banner/fon-1.jpg);}
  20% {background-image: url(/assets/media/banner/fon-2.jpg);}
    38% {background-image: url(/assets/media/banner/fon-2.jpg);}
  40% {background-image: url(/assets/media/banner/fon-3.jpg);}
    58% {background-image: url(/assets/media/banner/fon-3.jpg);}
  60% {background-image: url(/assets/media/banner/fon-4.jpg);}
    78% {background-image: url(/assets/media/banner/fon-4.jpg);}
  80% {background-image: url(/assets/media/banner/fon-5.jpg);}
    100% {background-image: url(/assets/media/banner/fon-5.jpg);}
}

.chichi {
  animation: glavnay 35s infinite ease-in-out;
}

.chapa {
  animation: glavnay 35s infinite ease-in-out 7s;
}

.rubi {
  animation:  glavnay 35s infinite ease-in-out 14s;
}

.bubi {
  animation:  glavnay 35s infinite ease-in-out 21s;
}
.kapa {
  animation:glavnay 35s infinite ease-in-out 28s;
}

/* .dapa {
  animation:  glavnay 30s infinite ease-in-out 31s;
}

.uuu {
  animation:glavnay 30s infinite backwards ease-in-out 37s;
} */
img.chichi {
  bottom: 0;right: 140px;width: 383px;
  @media screen and (max-width:500px) {right: 50px }
}
img.chapa {
  right: 140px;bottom: -8px;width: 352px;
@media screen and (max-width:500px) {right: 40px }
}
img.rubi {
  bottom: 0;right: 51px;width: 330px;
  @media screen and (max-width:500px) { }
}
img.bubi {
  bottom: -99px;right: 147px;width: 281px;
  @media screen and (max-width:500px) {right: 100px}
}
img.kapa {
  bottom: 0;right: 66px; width:337px;
  @media screen and (max-width:500px) {right: 100px}
}
/* секция 2 */
.sec-2 {
      /* background: radial-gradient(circle, #ffffff 20%, #8d10ff3b 30%, #fff 71%, #9fa5da 76%, #fff 86%);
      background: radial-gradient(circle at top, #a0bdff7d 20%, #8d10ff3b 30%, #ffffff8a 71%, #9fa5dab5 76%, #fff 86%); */
      background: radial-gradient(circle at top, #a0bdffb5 6%, #eedbff 30%, #ffffff8a 71%, #ada8e0 76%, #fff 103%);
}
/* .sec-2 .style-krug li {mix-blend-mode: color-dodge;} */
.sec-2 .subtitle{
    /* color: #c0abf4; */
    color: #364095;
    color: #6d6387;
}
.sec-2 h2 {
  background: linear-gradient(180deg, #c7c7c7 20%, #2c3721 30%, #c5c2c2 71%, #484848 76%, #b2afaf 86%);
  background-clip: text;
  color: #3ea5ff87;
  width: fit-content;
}
/* .sec-2 .title {
    background: linear-gradient(6deg, #003c55f0, #5c9cff, #101011f5) text;
    color: #ffffffd4;
    text-shadow: 0.5px 0.5px 17px #2b5fcf5c, 0.5px 0.5px 3px #062f90;
}
.sec-2 .content p {
    color: #ffffff!important;
    text-shadow: 0 0 3px #646262;
    FONT-WEIGHT: 600;
    font-size: 18px; 
    line-height: 120%;
}
.sec-2 .services-grid {  
    display: block;padding: 2rem;
    box-shadow: -2px 3px 4px rgb(0 101 227 / 35%), inset -2px 2px 285px rgb(207 219 255) !important;
    z-index: 10;
    border-radius: 2rem;
    background: radial-gradient(circle at 92% -76%, #48669e2b 43%, rgb(130 168 255 / 42%) 61%, rgb(105 95 163 / 16%) 67%), linear-gradient(0deg, rgba(213, 215, 255, 0.75), rgb(8 88 255 / 44%))!important;
    width: fit-content;
    border: 3px #ffffff !important;
    border-style: groove ridge ridge groove !important;
} */
h2::before {
    content: url(/assets/media/ugol4.svg);
    width: 139px;
    position: absolute;
    top: 148px;
    rotate: 180deg;
    left: 76px;
}
.zerkalo-min {
  position: relative;
  display: grid;
  position: absolute;
  width: 253px;
  height: 322px;
  left: 167px;
  top: 60px;
}

.zerkalo-min .rama {
  width: 309px; grid-area: stack; height: 100%;object-fit: cover;grid-area: stack; object-fit: cover;z-index: 3;transform: translate(6%, 0);
}
.zerkalo-min .steklo {
  width: 179px;z-index: 3;grid-area: stack; object-fit: cover;transform: translate(54px, 122px);
}
.zerkalo-min video {
  z-index: 2;
  grid-area: stack;
  width: 174px;
  height: 247px;
  object-fit: cover;
  transform: translate(57px, 129px);
}
.zerkalo-min .fon {
  width: 179px; z-index: 1;transform: translate(59px, 115px);grid-area: stack; object-fit: cover;
}
  /* h1::after {
    content: url(/assets/media/ramka.svg);
    filter: drop-shadow(2px 4px 6px black);
    position: relative;
    margin-bottom: -2rem;
} */

.star-krug {
  animation: krug 15s infinite alternate-reverse;
}
@keyframes krug {
    0% {rotate:0deg}
    100% {rotate:360deg}

}

.sms {
    font-family: var(--font-secondary);
    font-size: 16px;
    background: linear-gradient(0deg, #d5d7ff, #ffffff);
    padding: 1rem 2rem;
    line-height: 110%;
    border-radius: 0 3rem 3rem 2rem;
    border-radius: 3rem 5px 3.5rem 3rem;
    box-shadow: 0 0 5px 0px #ffffffd9, inset -1px 0px 5px 0px #ffffff, -4px 6px 20px -2px #d2c7ff;
}
 
.sec-3 h2 {
  margin-top: 4px; justify-self: center;text-shadow: .5px .5px 1px #5b5b5b00;line-height: 1;font-size: 2rem;    color: #976f80;
  margin-top: 4px;
  text-shadow: .5px .5px 17px #ffffff, .5px .5px 1px #ffa1a1;
  line-height: 1;
  font-size: 2rem;

  text-shadow: .5px .5px 27px #ffffff, .5px .5px 1px #ffa1a1;
  /* color: #91ccfb; */

  text-shadow: .5px .5px 27px #4a4a4a, .5px .5px 1px #ffa1a1;
color: #e6f4ff;
}
.sec-3-sub {
  color: #fbfbfb!important; text-shadow:none
}

.sec-3-sub::after {
    content: url(/assets/media/obodok2.svg);
}

.sec-3 .shape-group-17 ul > shape-1:nth-child(1) {
  right: 0;filter: drop-shadow(2px 4px 6px #5f93c1);
}
.sec-3 .shape-group-17 ul > shape-1:nth-child(2) {
  filter: drop-shadow(-2px 4px 6px #5f93c1);
}
/* Контейнер-карусель для мобилок */
@media only screen and (max-width: 990px) {
  .horiz-scroll-container {
    display: flex;
    flex-direction: row;
    overflow: scroll;
    flex-wrap: nowrap;
    scrollbar-width: none;
    gap: 1rem;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
  }
  #arLeft, #arRight {
      cursor: pointer !important;
      pointer-events: auto !important;
      z-index: 9999 !important;
      position: relative !important;
      opacity: 1 !important;
  }

.scroll-card .draco-sec,
.scroll-card .platon-sec,
.scroll-card .sad-sec,
.scroll-card .freid-sec {
    margin: 0 !important;
}
}


.tablichka {
    padding: 4px;
    background: linear-gradient(358deg, #070a15d6, #080257, #b0d6ff, #384792d6);
    background: linear-gradient(358deg, #070a155e, #08025782, #b0d6ff, #384792d6);
    /* background: linear-gradient(358deg, #61389200, #08025717, #b5b0ff, #6138921a); */
    position: relative;
    margin: 50px auto 10px;
    width: 64%;
    /* corner-shape: superellipse(-0.8); */
    border-radius: 1rem;
    border: 1px solid #c7bfde5e;
    border-style: double;
    corner-shape: superellipse(0.6);
    box-shadow: 0 2px 5px -2px #000;
    @media screen and (max-width:600px) { width: 96%; }
}
.tablichka p {
  text-shadow: .5px .5px 1px #343330;
  color: #f6e4cc !important;
  font-family: 'Old Standart TT';
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 1.1rem;
  FONT-WEIGHT: 400;
  padding: 1.2rem 1rem 0.9rem;
  box-shadow: inset 0 0 5px #303030;
  border-bottom: 2px solid #dbd1bd;
  corner-shape: bevel;
  border-radius: 0.7rem;
  background: linear-gradient(360deg, #997e71 40%, #7b6459 50%, #e7edf3 117%);
  margin: 0;
  width: 100%;
}



.sec-3 .process-work .title {font-family: 'Old Standart TT';font-style: italic;}
.sms-ramka {
  position: absolute;
  z-index: 111;
  align-content: center;
  display: flex ;
  justify-content: center;
  align-items: center;
  width: 427px;
}
.sms-pers {
  mask: url(/assets/media/fig.png);
  border-radius: 0;
  mask-size: 342px;
  mask-repeat: no-repeat;
  align-content: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.sms-pers-1 {
  width: 348px;
  z-index: 110;
  position: absolute;
  left: 79px;padding: 54px;
  top: 26px;
  filter: drop-shadow(2px 4px 6px #7a7a7a) hue-rotate(350deg);
}
.sms-pers-1-fon {mask: url(/assets/media/fig.png);border-radius: 0;width: 419px;mask-size: 342px;mask-repeat: no-repeat;z-index: 11;position: relative;align-content: center;display: flex;justify-content: center;align-items: center;left: 38px; top: 47px;}
.sms-pers-2 {
  width: 339px;
  z-index: 110;
  position: absolute;
  left: 41px;padding: 54px;
  top: 47px;filter: drop-shadow(2px 4px 6px #454545);
}
.sms-pers-3 {
 width: 419px;
 z-index: 11;
 position: relative;
 left: 38px;
 top: 47px;
}
/* .sms-txt {
    background: radial-gradient(circle at 24% -108%, #e7fffd3d 43%, #c5edffa3 61%, #ffffff3b 67%) !important;
    box-shadow: inset 0 0 5px #fff;
    font-family: 'Unbounded' !important;
    FONT-WEIGHT: 300 !important;
    font-size: 0.9rem !important;
    line-height: 134% !important;
    color: aliceblue !important;
    text-shadow: 0.5px .5px 1px #000;
} */
.sms-from-1 {
  border-radius: 3rem 5px 3.5rem 3rem;
  box-shadow: -8px 6px 14px -5px #d2c7ff, inset 0 0 5px #fff;
  background: linear-gradient(0deg, #d5d7ff, #59d7fff5);
  padding: 1rem 2rem;
}
/* .sms-to-1 {
  box-shadow: -5px 6px 17px -2px #d2c7ff;
  background: linear-gradient(0deg, #d5d7ff, #ffffff);
  background:linear-gradient(0deg, #ecedffb5, #93e5ffd6);
  padding: 2rem;
  border-radius: 3rem 4rem 4rem 0;
} */
/* .sms-from-2 {
  border-radius: 0 3rem 3rem 2rem;
  box-shadow: -8px 6px 14px -5px #d2c7ff, inset 0 0 5px #fff;
  background: linear-gradient(0deg, #ffffffc4, #fff1ff6e);
  padding: 1rem 2rem;
} */
.sms-to-2 {
  box-shadow: -5px 6px 17px -2px #d2c7ff;
  background: radial-gradient(circle at right -358px, #fff0 49%, #3a3faf52 61%, #ffffff00 82%), linear-gradient(0deg, #d5d7ff, #ffffff);
  padding: 2rem;
  border-radius: 2.5rem 0rem 3.5rem 2.5rem;
}
.sms-from-3 {
  box-shadow: -8px 6px 14px -5px #d2c7ff, inset 0 0 5px #fff;
  background: linear-gradient(0deg, #d5d7fff7, #2ef5ff73);
  padding: 1rem 2rem;
  border-radius: 3rem 5px 3.5rem 3rem;
}
.sms-to-3 {
  box-shadow: -5px 6px 17px -2px #d2c7ff;
  background: linear-gradient(0deg, #d5d7ff, #ffffff);
  padding: 2rem;
  border-radius: 4rem 4rem 3rem 0;
  text-shadow: 0.5px .5px 7px #ffffff;
  color: #0a544d !important;
}

/* 3 стиль звез. плашки */

.subtle-stars-plate {
  position: relative;
  width: 100%;
  /* height: 120px; */
  background:
    radial-gradient(ellipse at top, #1e3c72 0%, #2a5298 50%, #1c1c3e 100%);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 50, 0.3);
}

.subtle-star {
  position: absolute;
  width: 2px;
  height: 2px;
  background-color: white;
  border-radius: 50%;
  box-shadow: 0 0 4px white;
  opacity: 0;
}

.subtle-star:nth-child(1) { animation: subtle-twinkle 7s infinite; }
.subtle-star:nth-child(2) { animation: subtle-twinkle 9s infinite 1s; }
.subtle-star:nth-child(3) { animation: subtle-twinkle 6s infinite 2s; }
.subtle-star:nth-child(4) { animation: subtle-twinkle 8s infinite 3s; }
.subtle-star:nth-child(5) { animation: subtle-twinkle 5s infinite 4s; }
.subtle-star:nth-child(6) { animation: subtle-twinkle 10s infinite 5s; }
.subtle-star:nth-child(7) { animation: subtle-twinkle 5s infinite 6s; }
.subtle-star:nth-child(8) { animation: subtle-twinkle 4s infinite 7s; }

@keyframes subtle-twinkle {
  0%, 100% {
    opacity: 0;
    transform: scale(0.5);
  }
  20%, 80% {
    opacity: 0.8;
    transform: scale(1.2);
  }
  50% {
    opacity: 1;
    transform: scale(1.5);
  }
}

/*   легкое свечение фона */
.subtle-stars-plate::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:
    radial-gradient(circle at 20% 80%,
      rgba(100, 100, 255, 0.1) 0%,
      transparent 70%),
    radial-gradient(circle at 80% 20%,
      rgba(255, 100, 255, 0.1) 0%,
      transparent 70%);
  animation: pulse 15s infinite alternate;
  height: 1000px
}

@keyframes pulse {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.7; }
}
/* 3 стиль звездной плашки конец */

/* секция 4 */

.sec-4 {
    background-image: url(/besedka/assets/media/room-1.png);
    background-size: cover;
    padding-bottom: 50px !important;
    box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.2), inset 0 0 22px 20px rgb(255 255 255 / 29%), inset 0 0 2px 10px rgb(255 255 255 / 29%), -5px 5px 6px -5px #065293, rgb(0, 0, 0) 0px 0px 201px inset;
}
.sec-4 h2 {
    color: #f2e4d8;margin-top: 4px;text-shadow: .5px .5px 1px #232323;line-height: 1;font-size: 2rem;
}
.sec-4 h2>span {
  font-family: 'Old Standart TT';
  font-style: italic;
  font-size: 2.6rem;
  FONT-WEIGHT: 700;
    @media screen and (max-width:990px) {font-size: 4.1rem; FONT-WEIGHT: 500;}
    @media (min-width:990px) and (max-width:1200px) { font-size: 4.6rem; FONT-WEIGHT: 500;}
}
.sec-4 .slick-slide p {
  width: 100%;color: white;filter: drop-shadow(2px 1px 16px #8a5326) drop-shadow(2px 1px 9px #192c50);FONT-WEIGHT: 300;font-family: 'Unbounded';font-size: 0.9rem;
}
.monetka img {
  width: 20px;
  height: fit-content;
  margin-right: 10px;
}
.monetka p {
  width: 100%;color: aliceblue;filter:drop-shadow(2px 1px 7px black);FONT-WEIGHT: 600;width: 100%;color: aliceblue;filter: drop-shadow(2px 1px 7px black);FONT-WEIGHT: 600;font-family: 'Unbounded';font-size: .9rem;
}
.big-kartina {
  display: block;
  width: 313px;
  height: 654px;
  animation: float 4s ease-in-out infinite, rotateZ 12s linear infinite;
  overflow: hidden;
  justify-content: flex-end;
  align-items: center;
  perspective: 1000px;
  justify-self: end;
  margin-right: 6rem;scale: 1.1;
  margin-top: 10%;
  position: relative;
  @media (min-width:960px) and (max-width:1400px) {margin-right: 3rem;}
}
.big-kartina .glare {
  top: 145px;
}
.big-kartina img {
  width: 352px;
  position: absolute;
  grid-area: stack;
  z-index: 3;
  transform: translate(6%, 0);
  filter: brightness(1.35) hue-rotate(349deg);
}
.big-kartina video {
  z-index: 2;
  grid-area: stack;
  width: 203px;
  object-fit: cover;
  top: 104px;
  position: relative;
  left: 24%;
  height: 359px;
  grid-area: stack;
}
/* секция 5 - категории */
.sec-5 {
  /* background-color: #dadada;
  background-image: radial-gradient(circle at right -358px, #fff0 49%, #3a3faf52 61%, #ffffff00 82%), linear-gradient(0deg, #d5d7ff, #ffffff7a); */

  FONT-WEIGHT: 400;
  z-index: 3;
  color: #f3f3f3 !important;
  /* text-shadow: .5px .5px 8px #2254a2, .5px .5px 1px #000000; */
  line-height: 1;
  font-size: 1.3rem;
  background: radial-gradient(#7c7bb573, #544ca47d);
  padding: 0.8rem 2rem 0.8rem;
  border-radius: 2rem;
  /* border: 2px #ffffff00 solid; */
  background-image: url(https://besedka.digital/assets/media/fig/gold-besedka.png);
  background-position: center;
  background-size: 25px;
  /* box-shadow: -8px 6px 14px -5px #d2c7ff, inset 0 0 5px #fff; */
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2), inset 0 0 22px 20px rgb(255 255 255 / 29%),inset 0 0 2px 10px rgb(255 255 255 / 29%), -5px 5px 6px -5px #065293;
  box-shadow:0 10px 20px rgba(0, 0, 0, 0.2), inset 0 0 22px 20px rgb(255 255 255 / 29%),inset 0 0 2px 10px rgb(255 255 255 / 29%), -5px 5px 6px -5px #065293, inset 0 0 1000px #000;
  padding: 4rem;
  /* background-color: #e3a94361; */
  background-blend-mode: darken;

  /* background-blend-mode: soft-light;
  background-color: #ffffff0f; */
  background-size: 130px;
  background-size: 19px;
  background-blend-mode: screen;
    background-color: #4488978c;
    background-size: 335px;

/* красный пол */
    /* background-blend-mode: screen;
    background-color: #97445af2;
    background-size: 95px; */
}

.sec-5 h2 {
  margin-top: 4px;
  color: #ffffff !important;
  text-shadow: .5px .5px 1px #393939f2;
  line-height: 1;
  font-size: 2rem;
}
.sec-5 .shape-group-7 li {
  top: -46px;
  left: 61%;
}
.sec-5 .shape-group-7 li {
  filter: brightness(1.5) drop-shadow(0px 2px 3px #4c316c);rotate: 110deg;  width: 374px;
}
/* секция 6 - прайс */
.sec-6 {
      background: radial-gradient(#7280a5, transparent);
      padding: 5rem 4rem 4rem;
}
.sec-6 h2 {
  margin-top: 4px;
  color: #ffffff !important;
  text-shadow: .5px .5px 1px #393939f2;
  line-height: 1;
  font-size: 2rem;
}
.sec-6 .section-heading p {
  color: #c8e5ff;
  font-family: 'Unbounded';
  FONT-WEIGHT: 300;
  font-size: 17px;
}
.sec-6 .pricing-billing-duration ul {
    background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%);box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2), inset 0 0 0 2px rgba(255, 255, 255, 0.3);
}
@media (min-width:960px) and (max-width:1100px) {
  .sec-6 .btn-met-bsd {
    padding: 10px 30px!important;
  }
}
.trio ul {
  bottom: -1%; right: 5%;
  @media screen and (max-width:600px) { bottom: -43px;right: 0; }
}
.trio img {
  width: 855px;
  @media (min-width:900px) and (max-width:1400px) {width: 600px;}
}
@media (min-width:575px) and (max-width:900px) {
  .trio {margin-top: 54%;}
}
@media (min-width:900px) and (max-width:1400px) {
  .trio {margin-top: 34%;}
}


.left-ram {
  width: 126px;
  rotate: 180deg;
  z-index: 100!important;
  translate: -33px -27px;
}
.right-ram {
  width: 126px;
  rotate: 270deg;
  z-index: 100!important;
  translate: 24px -27px;
}

/* секция 7  */
.sec-7 {
  background-color: #dadada;
  background-image: radial-gradient(circle at right -358px, #fff0 49%, #3a3faf52 61%, #ffffff00 82%), linear-gradient(0deg, #d5d7ff, #ffffff7a);
  @media (min-width:600px) and (max-width:1100px) {  padding: 2rem 1rem 3rem;!important; }
}
.active-dark-mode .sec-7 {
  background-color: #000000;
}
/* .sec-7 .container {
  height: 719px;
  top: 100px;
} */
.sec-7 video {
  z-index: 2;
  object-fit: cover;
  position: relative;
  left: 0;
  border-radius: 5rem;
  border: 2px #bbbbbb;
  border-style: outset;
  border-radius: 96px !important;
  width: auto;
  height: 100%;
  display: flex;
  @media screen and (max-width:1000px) {width: 100%; border-radius: 56px !important; }
  @media (min-width:1000px) and (max-width:1400px) {width: 100%;}
}
.sec-7 .subtitle {
  /* font-family: 'Old Standart TT';
  text-transform: uppercase;
  font-size: 2rem; */
  letter-spacing: 1px;
  text-shadow: .5px .5px 1px #333333;
  color: #fff !important;
  color: aliceblue;
}
.sec-7 h2 {
  margin-top: 4px;
  color: #ffffff !important;
  text-shadow: .5px .5px 1px #393939f2;
  line-height: 1;
  font-size: 3rem;
}
.sec-7 p {
  FONT-WEIGHT: 400;text-shadow: 0 0 5px BLACK;font-family: 'Unbounded';
  @media screen and (max-width:900px) { /*text-shadow: 0.5px 0.5px 1px #f44336;*/text-shadow: 0.5px 0.5px 1px #2b2b2b; color: #ffe2aba8; }
}
.sec-7 .btn-met-bsd {
  text-shadow: .5px .5px 1px #a64929, .5px .5px 8px #000000!important;
}
.sec-7 .btn-met-bsd .shape-1 img {filter: drop-shadow(-3px -3px 2px #fff) blur(5px)!important;}
.sec-7 .btn-met-bsd .shape-8 img {filter: drop-shadow(-3px -3px 2px #fff) blur(5px)!important;}

  @media screen and (max-width:1200px) {
      .sec-7 .cont-main-r {
          border-radius: 52px;
          width: 100%;
      }
      .sec-7>.container {flex-direction: column; max-width: 900px;}
      /* .sec-7 .shape-group-21 .shape.shape-1 {
          width: 161px!important;
          translate: -66px -14px!important;
      } */
  }
  @media screen and (max-width:1200px) {  .call-to-action {position:relative!important} }

/* CТРАНИЦА ПЕРСОНА */
.badge-1 {
  width: 80px;
  background-image: url(../media/greece-symb.png);
  mask: url(../media/fig.png);
  mask-image: url(../media/fig.png);
    -webkit-mask-position: center center;
    border-radius: 16rem;
    margin-right: .5rem;
    filter: drop-shadow(1px 1px 1px #4b4b4b9c) invert(1);
}
img.badge-1:hover {
    transform: rotate3d(32, -22, 18, 333deg);
}

@media only screen and (max-width: 600px) {
  .main-wrapper.subtle-stars-plate {padding: 1rem;}
  .sec-1, .sec-2, .sec-3, .sec-4, .sec-5, .sec-6, .sec-7 {border-radius: 50px !important;}
.sec-2 h2 { color: #d7ecff29!important;background: linear-gradient(180deg, #d0e7f8 20%, #f7f9ff 64%, #8500ff 43%, #0de2ff 112%)!important;background-clip: text!important; /* background: linear-gradient(180deg, #d0e7f8 20%, #f7f9ff 64%, #002eff 43%, #0de2ff 112%);*/}
  .services-grid.service-style-2 {height: 390px}
  .services-grid.service-style-2 h5>span {font-size: 15px!important;}
  .zerkalo-min { width: 226px!important; left: 127px!important; top: 40px!important;}
  .zerkalo-min .steklo { width: 163px!important;  transform: translate(44px, 111px)!important}
  .zerkalo-min video {width: 150px!important;height: 229px!important; transform: translate(52px, 111px)!important;}
  .zerkalo-min .fon { width: 167px!important; transform: translate(45px, 92px)!important;}
  .services-grid.service-style-2 .yung { width: 118px!important; left: 223px!important;}
  .services-grid.service-style-2 .proger { bottom: -51px!important; width: 164px!important; left: -13px!important;}
  .shtora-left {width: 289px!important}
  .shtora-right {width: 289px!important}
  .sms-ramka {width: 153px !important;}
  .sms-txt {font-size: 12px !important;}
  .sms-pers-1 {width: 194px !important; left: 2px !important; top: -23px !important;}
  .sms-pers-1-fon {left: 36px !important; top: 23px !important; width: 163px !important; mask-size: 114px !important;}
  .sms-pers-2 {width: 254px!important; left: 0px!important; padding: 43px!important; top: -1px!important; }
  .process-work .content h3 { font-size: 26px!important;}
  .sms-pers-2-fon {width: 168px!important;mask-size: 140px!important;  left: 11px!important;top: 14px!important;}
  .sms-pers-3 {width: 172px!important;  left: 10px!important;top: 14px!important;mask-size: 131px!important;}
  .process-work.content-reverse .content {margin-right: 0!important;}
  .process-work.zigmund {display: grid;}
  .process-work.zigmund .paralax-image {order:-1;height: unset!important;justify-self: right;}
  .process-work.zigmund .subtitle {justify-self: baseline!important;}
  .astrolog .paralax-image {height: 117px;}
  .astrolog .subtitle {justify-self: end!important;}
    .left-ram {top: 0; left: 5px;}
  .left-ram img { width: 100% !important;}
  .call-to-action-area {height: auto!important}
  .call-to-action-area .container {height: auto!important;}
  .call-to-action .section-heading .title {margin: 0 auto 25px;}
  .call-to-action .section-heading p {margin: 0 auto 50px;}
}

 /* .person img {
    filter: drop-shadow(2px 4px 26px black);
 } */
/* БЛОГ */
:is(.statya) .main-wrapper {background-color: #dfdfdf;}
.blog .axil-mainmenu {
    padding: 44px 0;
}
.blog .main-wrapper {
    background-color: #dfdfdf;
    background: linear-gradient(285deg, #cdc5b9, #aba8a800);
    background-size: 214px;
    box-shadow: inset 0 0 107px #9c9082;
}
.blog .breadcrum-area, .statya .breadcrum-area {
	background: linear-gradient(53deg, #060041 20.18%, #05317a 76.9%);
	border: 3px #f5cb84;
	/* border: 3px #ffffff; */
    border-style: outset;
    border-left: none;
    border-radius: 0 0 7rem 7rem;
    box-shadow: #1717684d 0px 10px 6px;
     @media only screen and (max-width: 479px) {border-radius: 0 0 4rem 4rem;}
} 
.blog .breadcrum-area .container img {
    filter: saturate(1.5) brightness(1.25) hue-rotate(336deg);
    width: 23px;
    rotate: 37deg;
    margin-bottom: 4px;
}
.blog h1, .statya h1 {
	color: #a9adbf;
    font-size: 56px;
    FONT-WEIGHT: 700;
    text-shadow: 0 0 20px #060d51;
    color: #d2ceca;
}

.blog h1 .old-style, .statya h1 .old-style  {
    font-family: 'Old Standard TT';font-style: italic; FONT-WEIGHT: normal;font-size: 73px;
}
.blog h3 .old-style {
    font-family: 'Old Standard TT';font-style: italic; FONT-WEIGHT: normal;font-size: 58px;
    @media only screen and (max-width: 500px) {font-size: 40px;}   
}

.blog .shape-1 img{
	filter: saturate(1.5) hue-rotate(313deg);
    width: 1000px;
}
.blog .shape-2 {
    top: -49px!important;
    right: -55px!important;
    animation: oborot 30s linear infinite;
}
@keyframes oborot { from {rotate: 0deg}
                    to {rotate: 360deg} }
.blog .shape-2 img {
    filter: brightness(1.05) saturate(0.8) drop-shadow(2px 4px 6px #ffefb378);
    width: 416px;
}
.blog .shape-3 img, .statya .shape-3 img {
	filter: hue-rotate(248deg) brightness(1.25) blur(5px);
}
.mainmenu > li > a, .statya .mainmenu > li > a {
      box-shadow: 0 0 3px 2px #66f2ff00, inset 1px -1px 4px 1px #004aac, inset 0px 1px 4px 1px #e0faffb8;
      margin:0!important;
}
.mainmenu > li {
    background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2), inset 0 0 0 2px rgba(255, 255, 255, 0.3), -5px 5px 6px -5px #065293;
    padding: 3px;
    border-radius: 1.75rem;
}
.blog .blog-grid {
    border: 2px #bbbbbb;
    border-radius: 4rem;
    padding: 2rem;
    border-style: outset;
    background: #c1c5cb !important;
    box-shadow: 0 10px 30px rgba(0, 0, 50, 0.3);

    background: #d2ceca !important;
}

.blog .blog-grid .axil-btn {
    color: #fff !important;
    background: radial-gradient(circle at top, #6c86ff 20%, #2b3abaf2 45%, #20ccff78 108%) !important;
    box-shadow: -5px 5px 6px -5px #065293 !important;
    border: #fff0 !important;
    font-family: 'Unbounded';
    padding: .75rem 2rem;
    border-radius: 1rem;
    display: flex;
    text-align: center;
    justify-content: center;

    background: radial-gradient(circle at top, #b9b1a0 20%, #c6ad97f2 45%, #20ccff78 108%) !important;
}
.blog .blog-grid .axil-btn:hover {
    background: #859ac3!important;
    /* border-radius: 3rem; */
}

.page-numbers.current {
    background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%) border-box!important;
    border-radius: 50em;
    border: 5px solid transparent;
    box-shadow: 2px 3px 5px -2px #7e5dff8c;
    padding: 0 18px;    FONT-WEIGHT: 600;
    color: #4a6d6d!important;
    border-color: #f0f8ff61!important;
}
.blog .widge-social-share {
   background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%) border-box;
    border-radius: 2rem;
    border: 5px solid transparent;
    box-shadow: 2px 3px 5px -2px #7e5dff8c;
}
.blog .blog-share{
    border: 1px solid #ffc737;
    border-radius: 2rem!Important;
    /* background: linear-gradient(45deg, #1f3185db, #2d44aedb); */
    padding: 24px 30px;
}
:is(.blog, .statya) .widget-recent-post {
    border: 1px #ffffff;
    border-radius: 3.5rem;
    padding: 2rem;
    border-style: outset;
    box-shadow: 0 1px 10px rgba(0, 0, 50, 0.3);

    /* background: radial-gradient(ellipse at top, #1e3c721c 0%, #5f88d163 50%, #7c7cc645 100%); */
    background: radial-gradient(ellipse at top, #ccd9f0 0%, #c6c8cc 50%, #b6b6c3 100%);
    background: radial-gradient(ellipse at top, #ccd0f0fa 0%, #c6c8cc 50%, #c3bcb6 100%);
}
.statya .widget-recent-post { background: none}
:is(.blog, .statya) .widget.widget-recent-post .single-post {
    border-bottom:1px solid #bfbfee;
}
:is(.blog, .statya) .widget-recent-post .blog-meta li {
    margin-right: 8px; 
    font-size: 11px;
}
:is(.blog, .statya) .widget.widget-recent-post .single-post .post-thumbnail a {
    background: linear-gradient(135deg, #5978cf 0%, #b5f0fc 50%, #6b59cf 100%) border-box;
    border: 2px solid transparent;
    box-shadow: 2px 3px 5px -2px #7e5dff8c;
}
:is(.blog, .statya) .widget-recent-post .blog-meta li:after { 
    height: 11px; 
    right: -6px;
}
.blog .footer-area {
        background: radial-gradient(ellipse at top, #1e3c721c 0%, #2a529863 50%, #1c1c3e45 100%);
        background: radial-gradient(ellipse at top, #1e3c72 0%, #2a5298 50%, #1c1c3e 100%);
    padding-top: 4rem;
}
.statya .footer-area {
    background: radial-gradient(ellipse at top, #1e3c721c 0%, #2a529863 50%, #1c1c3e45 100%);
    padding-top: 4rem;
}
.statya .shape-group-8 .shape.shape-2 {
    top: -142px;
    right: 151px;
    text-align: right;
}
.statya .shape-2 img {
    /* filter: brightness(2.5) blur(62px) hue-rotate(272deg); */
    filter: brightness(2.5) blur(15px) hue-rotate(310deg);
    width: 550px;
    animation: oborot 30s linear infinite;
}
:is(.blog, .statya) .author-thumb img {width: 60px;}

.blog-grid .post-thumbnail a {
    border: 2px solid #ffffff;
    box-shadow: 2px 3px 5px -2px #7e5dff8c;
    box-shadow: 2px 3px 5px -2px #5d8dff8c;    border: 2px solid #7693c885;
}
.blog .social-list i { font-size: 1.8rem;}
.blog .blog-grid.blog-without-thumb {
    background: linear-gradient(45deg, #1f3185db, #2d44aedb) !important;
    border-radius: 3rem;
}
.statya .post-thumbnail img, .statya .featured-img img {
    border: 2px solid #ffffff;
    box-shadow: 2px 3px 5px -2px #7e5dff8c;
    /* box-shadow: 2px 3px 5px -2px #5d8dff8c; */
    /* border: 2px solid #7693c885;*/
}    

.blog-author {
    background: linear-gradient(45deg, #1f3185db, #2d44aedb);
    position: relative;
    box-shadow: rgb(105 105 105 / 56%) 0px 2px 9px 2px, rgb(0, 74, 172) 1px -1px 4px 1px inset, rgb(224 250 255) 0px 1px 11px 3px inset;
    background: #babfce;
    background: #92a0cb;
    /* background: radial-gradient(ellipse at top, #ccd9f0 0%, #c6c8cc 50%, #b6b6c3 100%); */
    box-shadow: rgb(105 105 105 / 56%) 0px 2px 9px 2px, rgb(255 255 255) 1px -1px 4px 1px inset, #bcb9ff 0px 1px 11px 3px inset;
    border-radius: 3rem;
}
.blog-author .author-thumb {
        height: 100%;
    /* box-shadow: rgba(102, 242, 255, 0) 0px 0px 3px 2px, rgb(0, 74, 172) 1px -1px 4px 1px inset, rgba(224, 250, 255, 0.72) 0px 1px 4px 1px inset; */
    box-shadow: rgb(235 235 235 / 69%) 0px 3px 15px, rgba(255, 255, 255, 0.3) 0px 0px 0px 2px inset, rgb(28 44 93) -5px 5px 6px -5px;
        background: linear-gradient(135deg, rgb(207, 170, 89) 0%, rgb(252, 238, 181) 50%, rgb(207, 170, 89) 100%) border-box border-box;
    border-radius: 50em 50em 24rem 24rem;
    border: 6px solid transparent;
}
.statya .blog-author .author-thumb img {
    width: 166px;
    box-shadow: rgb(255 255 255) 0px 0px 3px 2px, rgb(13 13 13) 1px -1px 4px 1px inset, rgb(221 206 206) 0px 1px 4px 1px inset;
    border-radius: 5rem 5rem 3rem 3rem;
}
.statya .blog-author p {
color: #30302f;
}
.statya .section-heading { 
    margin-bottom: 30px;
}
:is(.blog, .statya) .sticky-logo { filter: drop-shadow(1px 1px 1px #ccc);}

.statya .single-blog .single-blog-content p, .blog .blog-grid p, .statya .blog-grid li {
    FONT-WEIGHT: 500;
    color: #665f58;
    color: #4a4540;
}
.statya .blog-grid :is(h1, h2, h3, h4, h5, h6 ){color: #4a4540;}

.statya .call-to-action-area:before {
    content: "";
    width: 100%;
    position: absolute;
    left: 0;
    right: 0;
    z-index: -1;
    background: radial-gradient(ellipse at top, #728fc2 -131%, #22005e 50%, #19198e78 153%);
    border-radius: 2rem 2rem 0 0;
    bottom: 0;
    top: unset;
    height: 100%;
    box-shadow: inset 0 0 97px #16135e;
    background: radial-gradient(ellipse at top, #03008c -131%, #85e2f6 50%, #fff 60%, #6834ff 153%);
    /*  background: radial-gradient(ellipse at top, #8e3a10 -131%, #7e5d51 50%, #977a63 60%, #ffa734 153%); коричневый */
   
    /* серая
    box-shadow: inset 0 0 97px #615c55;
    background: radial-gradient(ellipse at top, #ccd9f0 0%, #c6c8cc 50%, #b6b6c3 100%); */
}
.statya .paralax-image {
    position: relative;
    background: linear-gradient(135deg, rgb(207, 170, 89) 0%, rgb(252, 238, 181) 50%, rgb(207, 170, 89) 100%);
    box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 20px, rgba(255, 255, 255, 0.3) 0px 0px 0px 2px inset, rgb(6, 82, 147) -5px 5px 6px -5px;
    border-radius: 12rem 12rem 1rem 1rem;
    filter: drop-shadow(rgb(255, 231, 200) 2px 4px 29px);
    padding: 9px !important;
    will-change: transform;
    transform: perspective(1000px) rotateX(0deg) rotateY(0deg);
}

.statya .paralax-image img {
    filter: drop-shadow(rgba(225, 225, 225, 0.37) -7px 4px 7px) contrast(0.95);
    background: linear-gradient(135deg, rgb(56, 44, 155), rgb(33, 45, 106), rgba(66, 27, 157, 0.97));
    will-change: transform;transform: perspective(1000px) rotateX(0deg) rotateY(0deg);
    box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 20px, rgb(82 69 255) 0px 0px 4px 27px inset, rgb(6, 82, 147) -5px 5px 6px -5px;
    border-radius: 12rem 12rem 1rem 1rem;
    padding: 4px !important; object-fit: cover;width: 354px;height: 533px;
    
    /* для серой 
    box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 20px, rgb(217 187 82) 0px 0px 4px 27px inset, rgb(6, 82, 147) -5px 5px 6px -5px; */
    @media (min-width: 500px) and (max-width: 960px) { width: 297px;height: 350px;}
    @media only screen and (max-width: 500px) { width: 280px; height: 333px;}
}
.statya .call-to-action .section-heading .title {   
    color: #4f80b9e0;
    z-index: 10;
    width: 70%;
    font-size: 56px;
    background: linear-gradient(32deg, #ff9f0a, #ffe4e4eb, #ffd483, #ffe4e4eb, #ff9f0a) text;
    
    @media only screen and (max-width: 500px) { width: 100%;}
    @media (min-width: 500px) and (max-width: 960px) { font-size: 34px;}
    @media (min-width: 500px) and (max-width: 1100px) { width: 100%; }
}

.statya .call-to-action .axil-btn.btn-large a {
    font-family: 'Unbounded';
    color: rgb(64 86 153) !important;
}

/* брауни */
.statya .call-to-action-area.brown:before {
    background: radial-gradient(ellipse at top, #000000 -131%, #82776c 50%, #736b64 60%, #ffffff 153%);
    box-shadow: inset 0 0 97px #615c55;
}
.statya .call-to-action-area.brown .section-heading .title {
    color:#d7cfc4;
}
.statya .call-to-action-area.brown .main-btn {
        color: rgb(103 103 103) !important;
    }
.statya .call-to-action-area.brown .paralax-image img {
        box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 20px, rgb(164 161 203) 0px 0px 4px 27px inset, rgb(6, 82, 147) -5px 5px 6px -5px;
    }
.statya .call-to-action-area.brown {
        border: 3px #ebd6b9;
}
/* брауни */
/* ваниль */
.statya .call-to-action-area.vanilla .paralax-image {
    background:none;
    padding: 9px 9px 0 !important;
}
.statya .call-to-action-area.vanilla .paralax-image img {
    padding: 4px 4px 0 !important; 
    width: 320px;
    height: 533px;box-shadow: none;    background: #ffba1a36;background: none;
}
.statya .call-to-action-area.vanilla {
    padding: 87px 0 10px;}
/* ваниль */

.statya .g-but {
    background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2), inset 0 0 0 2px rgba(255, 255, 255, 0.3), -5px 5px 6px -5px #065293;
    padding: 4px !important;
    border-radius: 1.75rem;
}
.statya .call-to-action-area {
    padding: 87px 0 100px;overflow: hidden; border-radius: 88px 88px 0 0!important;border: 3px #7bc2ef;border-style: ridge groove groove ridge;
    box-shadow: #1717174d 0px -10px 6px;
    @media only screen and (max-width: 500px) { padding: 36px 0 9px; }
}
.statya .call-to-action-area .first-col {
    justify-items: right;
     @media (min-width: 500px) and (max-width: 960px) { justify-items: left;}
     @media only screen and (max-width: 500px) { justify-items: center;}
}
.statya .blog-author .rama {
    width: 171px; top: -25px;justify-self:center;
    @media only screen and (max-width: 500px) { top: -5px;}
}
.statya figcaption {
    font-family: 'Old Standart TT';
    font-style: italic;
    text-align: right;
    margin: 0;
}
.statya b {
    font-family: 'Old Standart TT';
    font-style: italic;
    font-size: 18.5px;
    FONT-WEIGHT: bold;
}
/* .statya blockquote {
    color: #4f6690;
    color: #72719c;
    FONT-WEIGHT: 500;
} */

.widget.widget-recent-post .single-post .post-thumbnail a img { 
    width: 118px;
    border:none;
    /* object-fit: cover;
    height: 92px; */
}
.widget.widget-recent-post .single-post .list-unstyled {
    line-height: 80%!Important;
}
.statya .slick-list .blog-list .post-thumbnail a img {
    width: 300px;
    object-fit: cover;
    height: 245px;
    filter: grayscale(1);
}
.author-besedka img {
        animation: oborot 30s linear infinite;
}
/* Базовые утилиты position */
.position-static {
  position: static !important;
}
.position-relative {
  position: relative !important;
}
.position-absolute {
  position: absolute !important;
}
.position-fixed {
  position: fixed !important;
}
.position-sticky {
  position: sticky !important;
}

/* Адаптивные утилиты для каждого брейкпоинта Bootstrap */
@media (min-width: 576px) {
  .position-sm-static {
    position: static !important;
  }
  .position-sm-relative {
    position: relative !important;
  }
  .position-sm-absolute {
    position: absolute !important;
  }
  .position-sm-fixed {
    position: fixed !important;
  }
  .position-sm-sticky {
    position: sticky !important;
  }
}

@media (min-width: 768px) {
  .position-md-static {
    position: static !important;
  }
  .position-md-relative {
    position: relative !important;
  }
  .position-md-absolute {
    position: absolute !important;
  }
  .position-md-fixed {
    position: fixed !important;
  }
  .position-md-sticky {
    position: sticky !important;
  }
}

@media (min-width: 992px) {
  .position-lg-static {
    position: static !important;
  }
  .position-lg-relative {
    position: relative !important;
  }
  .position-lg-absolute {
    position: absolute !important;
  }
  .position-lg-fixed {
    position: fixed !important;
  }
  .position-lg-sticky {
    position: sticky !important;
  }
}

@media (min-width: 1200px) {
  .position-xl-static {
    position: static !important;
  }
  .position-xl-relative {
    position: relative !important;
  }
  .position-xl-absolute {
    position: absolute !important;
  }
  .position-xl-fixed {
    position: fixed !important;
  }
  .position-xl-sticky {
    position: sticky !important;
  }
}

@media (min-width: 1400px) {
  .position-xxl-static {
    position: static !important;
  }
  .position-xxl-relative {
    position: relative !important;
  }
  .position-xxl-absolute {
    position: absolute !important;
  }
  .position-xxl-fixed {
    position: fixed !important;
  }
  .position-xxl-sticky {
    position: sticky !important;
  }
}


.sec-3 {
    /* border: 2px #7a8cd199;
    border-style: outset;
    background: radial-gradient(circle at top, #a0bdffb5 6%, #feffdb 30%, #ffffff8a 71%, #e0d2a8 76%, #fff 103%);
    background-size: 50px;
    background-repeat: repeat;
    box-shadow: inset 0 0 44px #fff; */

    /* border: 2px #7a8cd199;
border-style: outset;
background: radial-gradient(circle at top, #a0d7ff8f 6%, #feffdb 30%, #ffffff8a 71%, #e0d2a8 76%, #fff 103%);
background-size: 50px;
background-repeat: repeat;
box-shadow: inset 0 0 44px #27407e; */
    z-index: 3;
border: 2px #7a8cd199;
border-style: outset;
background: radial-gradient(circle at 50% 1%, #6b85bd 1%, #feffdb00 23%), radial-gradient(circle at top, #a0d7ff8f 6%, #feffdb 30%, #ffffff8a 71%, #e0d2a8 76%, #fff 103%);
/* background-size: 50px; */
background-repeat: repeat;
box-shadow: inset 0 0 44px #27407e, 0 17px 8px -9px #282828bf;
}
.draco-sec {
      background-image: url(../media/new/draco-back.jpg);
      background-size: cover;
      border-radius: 6rem;
      border-style: ridge groove groove ridge;
      border-width: 10px 5px 10px 5px;
      border-color: #517560;
      @madia screen and (max-width: 600px) {border-radius: 5rem}
}
.draco-sec img {
  width: 316px;
  bottom: 0;
  left: 5%;
  @media screen and (max-width:1200px) { width: 350px;max-width: 350px;bottom: -79px;/*left: 19%;*/display: flex;justify-self: center;margin-top: -5rem;}
  @media screen and (max-width:600px)  {width: 310px;}
  @media (min-width:960px) and (max-width:1200px) {width: 330px;max-width: 330px;}
}
.draco-sec .title {
  color: #e9f5ff;text-shadow: 0.5px .5px 3px #000;
}
.platon-sec, .sad-sec {
    display: flex;
    flex-wrap: wrap;
    align-content: stretch;
    height: auto;
      @media screen and (max-width:600px) {height: min-content;}
}
.platon-sec, .sad-sec {
  width:47%;
  @media screen and (max-width:1400px) { width:100% }
}
.platon-sec img {
  bottom: 0;width: 305px;
  @media screen and (max-width:600px) { max-width: 247px;bottom: -11px;}
  @media screen and (max-width:800px) { display: flex;justify-self: center;}
  @media (min-width:1100px) and (max-width:1400px) { bottom: -10%;}
}
.platon-sec .row {
      background-image: url(../media/new/greece.jpeg);
      background-size: cover;
      border-radius: 6rem;
      border-style: ridge groove groove ridge;
      border-width: 10px 5px 10px 5px ;
      border-color: #90adcd;
      /* border-left-color: aliceblue; */
      @media screen and (border-radius: 5rem;)
}
.platon-sec .title {
  color: #e9f5ff;
}
.platon-sec .subtitle-from {
    color: #fff;
    text-shadow: 0.5px .5px 3px #3e96c8;
}
.sad-sec .row {
      background-image: url(../media/new/sad-back.png);
      background-size: cover;
      background-position: bottom;
      border-radius: 6rem;
      border-style: ridge groove groove ridge;
      border-width: 10px 5px 10px 5px ;
      border-color: #f1e5d3;

}

.sad-sec .col-md-4 img {
      bottom: 0;
      left: -18%;
      width: 368px;
      position: absolute;
      filter: hue-rotate(-8deg) contrast(1.2) saturate(0.9);
      @media screen and (max-width:770px) { position:relative; width: 315px;max-width: 315px;bottom: -63px;left: 19%; }
      @media (min-width:770px) and (max-width:1400px) {left: -6%;}
}
.sad-sec .subtitle-from {
    color: #f2fff0;
    text-shadow: 0.5px .5px 6px #efae56, 0.5px .5px 1px #1c7000;
}
.sad-sec .title {
  color: #e9f5ff;
}
.freid-sec {
      background-image: url(../media/new/freid-back.webp);
      background-size: cover;
      border-radius: 6rem;
      border-style: ridge groove groove ridge;
      border-width: 10px 5px 10px 5px ;
      border-color: #8e8478;
}
.freid-sec img {
  width: 300px;bottom: -200px;
  @media screen and (max-width:770px) { position:relative; max-width: 280px;bottom: -170px !important;max-width: 280px;margin-top: -12rem;display: flex;justify-self: center; }
}
.sms-txt {
  background: radial-gradient(circle at 24% -108%, #e7fffd3d 43%, #c5edffa3 61%, #ffffff3b 67%) !important;
  font-family: 'Unbounded' !important;
  FONT-WEIGHT: 400 !important;
  line-height: 134% !important;
  color: aliceblue !important;
  text-shadow: 0.5px .5px 7px #000;
  backdrop-filter: blur(3px);
  box-shadow: -8px 6px 14px -5px #d2c7ff, inset 0 0 5px #fff;
  font-size: .9rem;

  backdrop-filter: blur(25px);
  /* text-shadow: 0.5px .5px 7px #000; */
}
.sms-from-1 {
   font-size: 0.9rem !important;
   border-radius: 3rem 5px 3.5rem 3rem;
}
.sms-to-1 {
   border-radius: 3rem 4rem 4rem 0;
   font-size: .9rem
}
/* .sms-from-2 {
  color: #335b7f !important;
  text-shadow: 0.5px .5px 1px #ffffff;
  backdrop-filter: blur(3px) brightness(.5);
  box-shadow: -8px 6px 14px -5px #d2c7ff, inset 0 0 5px #fff;
  font-size: 0.8rem !important;
  border-radius: 5px 3rem 3.5rem 3rem;
} */
.sms-to-2 {
  font-size: 0.9rem !important;
  text-shadow: 0.5px .5px 7px #000;
  border-radius: 3rem 3rem 0 4rem;
  @media screen and (max-width:600px) { border-radius: 3rem 3rem 4rem 0!important; }
}
.sms-from-2 {
  color: #335b7f !important;
  text-shadow: 0.5px .5px 7px #ffffff;
  backdrop-filter: blur(3px);
  /* box-shadow: -8px 6px 14px -5px #d2c7ff, inset 0 0 5px #fff; */
  font-size: 0.8rem !important;
  border-radius: 5px 3rem 3.5rem 3rem;
  box-shadow: 8px 6px 14px -5px #7cd2ff, inset 0 0 5px #fff;
  color: #004a8d !important;
  text-shadow: 0.5px .5px 2px #ffffff;
  backdrop-filter: blur(14px) brightness(1.25);
  width: 467px;
    @media screen and (max-width:600px) {width:unset}
}
.sms-to-2 {
  font-size: 0.8rem !important;
  text-shadow: 0.5px .5px 1px #000;
  border-radius: 4rem 0 3rem 4rem;
  box-shadow: -8px 6px 14px -5px #7cd2ff, inset 0 0 5px #fff;
}
.sms-from-3 {
  color: #0a544d !important;
  text-shadow: 0.5px .5px 1px #ffffff;
  font-size: 0.8rem !important;
  width: 467px;
  box-shadow: -8px 6px 14px -5px #395c08, inset 0 0 5px #fff;
    @media screen and (max-width:600px) {width:unset}
}
.sms-to-3 {
  font-size: 0.8rem !important;
  backdrop-filter: blur(25px);
  border-radius: 3rem 3rem 4rem 0;
  box-shadow: 8px 6px 14px -5px #395c08, inset 0 0 5px #fff;
  text-shadow: 0.5px .5px 7px #000;
}
.sms-from-4 {
  font-size: 0.9rem !important;
  border-radius: 5px 3rem 3rem 3.5rem;
  padding: 1rem 2rem;
}
.sms-to-4 {
  font-size: 0.8rem !important;
  border-radius: 3rem 0 4rem 3rem;
  @media screen and (max-width:600px) {   border-radius: 3rem 4rem 3rem 0; }
}
.sec-3 .process-work.content-reverse .content {
  padding-left:0!important;
  margin-right:0!important;
}
.sec-3 .process-work .content .title {
    font-family: 'Old Standart TT';
    font-style: italic;
    font-size: 40px !important;
    text-shadow: 0.5px .5px 3px #000;
  }
.sec-3 .row .subtitle {
    text-shadow: 0.5px .5px 9px #000;
}
:is(.platon-sec, .freid-sec) .content {
  margin-right: 0!important
}
.subtitle-from {
  color: #e9f5ff;
  font-family: 'Unbounded';
  font-size: 16px;
  FONT-WEIGHT: 600;
}
.odometer-inside {
  font-family: 'Old Standart TT';
  font-size: 4rem;
}
.counter-title {
  font-family: 'Old Standart TT';
  text-transform: uppercase;
  letter-spacing: 1.7px;
}


.glare {
  position: absolute;
      top: 270px;
      left: 113px;
      width: 27%;
      height: 50%;
      /* background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0) 100%); */
      background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgb(255 255 255 / 37%) 50%, rgba(255, 255, 255, 0) 100%);
      border-radius: inherit;
      animation: moveGlare 6s linear infinite alternate-reverse;
      z-index: 10000;
      object-fit: cover;
}
@keyframes moveGlare {
  from { transform: translateX(-90%); }
  to { transform: translateX(120%); }
}
    @keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-15px); }
}

/* Поворот по оси Z */
@keyframes rotateZ {
  0%, 100% { transform: rotateY(-25deg); filter: drop-shadow(-25px -2px 6px #000000b5);}
  50% { transform: rotateY(25deg); filter: drop-shadow(25px -2px 6px #000000b5);}
}

.shape-group-21 .shape.shape-1 {
    top: 16px;
    left: 19px;
    width: 66px;
    filter: invert(1) brightness(3.5) opacity(0.85) blur(0.3px);
}
.shape-group-21 .shape.shape-8 {
    top: 16px;
    right: 11px;
    width: 66px;
    filter: invert(1) brightness(3.5) opacity(0.85) blur(0.3px);
}

.pricing-table .pricing-header .title {
  font-family: 'Old Standart TT';
  font-style: italic;
  font-size: 30px;
}
.old-curs {
    font-family: 'Old Standart TT';
    font-style: italic;
}
.pricing-table .pricing-header .price-wrap .amount {
  font-size: 43px;
}
.pricing-table .pricing-body li {
  font-size: 15px;
  line-height: 1.3;
}
.pricing-table {
    padding: 20px;
  }
.pricing-table .pricing-header .title {
  color: #a9efff;
}
.free-card .pricing-table .pricing-header .title {
  color: var(--color-primary);
}
.pricing-table .pricing-header .price-wrap .duration {
    color: #b1c7ff;
  }
.free-card .pricing-table .amount {
  font-family: 'Old Standart TT';
  letter-spacing: 0.5px;
  font-style: italic;
}

.project-grid {
    border: 3px solid #a69a81;
    border-radius: 13rem 13rem 1.5rem 1.5rem;
    box-shadow: 0 5px 16px -5px #262626;
    /* box-shadow: 0 5px 10px 1px #071b29;
    box-shadow: 0 5px 10px 1px #100047; */
    box-shadow: 0 5px 10px 1px #002a47;

    box-shadow: 0 5px 10px 1px #352b28;
    @media screen and (max-width:600px) { border-radius: 3rem 3rem 1.5rem 1.5rem; }
}
.project-column-4 .project-grid .content {
    border: 1px #ffffff !important;
    border-style: outset !important;
    box-shadow: -2px 3px 4px rgb(0 101 227 / 19%), inset -2px 2px 8px rgb(207 219 255 / 51%) !important;
    border-radius: 0 0 1rem 1rem !important;
    /* background: #314381 !important; */
    background: #316281 !important;
    padding: 1rem;
    hyphens: auto;
    @media screen and (max-width:600px) { padding: .7rem; }
}
.project-grid .content .title {
  text-shadow: .5px .5px 1px #8e8367;
  color: #dfc499 !important;
  font-family: 'Old Standart TT';
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 1.2rem;
  @media screen and (max-width:600px) { font-size: 0.9rem; }
}
.project-grid .content span {
  font-family: 'Unbounded';
  FONT-WEIGHT: 200;
  font-size: 0.8rem;
}
.btn-met-bsd {
  padding: 10px 71px !important;
  color: #fff !important;
  background: linear-gradient(347deg, #1b468b 15%, #3d9dff 59%, #67b4ff 82%) !important;
  box-shadow: -5px 5px 6px -5px #065293 !important;
  border: 1px solid #ffffff42 !important;
  border-radius: .75rem;
  font-family: 'Unbounded';
  text-shadow: .5px .5px 1px #a64929;
  FONT-WEIGHT: 400;
  letter-spacing: .04em;
  filter: hue-rotate(189deg) saturate(0.5) brightness(1.25) !important;
}
.btn-met-bsd:hover {
    color: #5886ae !important;
}
.pricing-billing-duration ul .nav-link {
  background: radial-gradient(#ffffff4d, #00000040);
  /* text-shadow: .5px .5px 1px #8e8367;   color: #ac7928 !important;*/
  text-shadow: .5px .5px 1px #35332e, .5px .5px 11px #8e8367;
  color: #fff1d9 !important;
  font-family: 'Old Standart TT';
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 1.2rem;
  padding: 5px 30px;
}
.rama-left {
  opacity: .9;
  height: 434px;
  right: 0;
  position: relative;
}
.rama-right {
  opacity: .9;
      transform: scaleX(-1);
      left: 0;height: 434px;
      position: relative;
}
.draco-sec, .platon-sec .row, .sad-sec .row, .freid-sec {
  corner-shape: scoop;
  /* border-color: #f1e5d3; */
  corner-shape: superellipse(0.8);
  box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.2), inset 0 0 22px 20px rgb(255 255 255 / 29%), inset 0 0 2px 10px rgb(255 255 255 / 29%), -5px 5px 6px -5px #065293, rgb(0, 0, 0) 0px 0px 200px inset;
  @madia screen and (max-width: 600px) {border-radius: 5rem}
}
/* 2 cекция */
.sec-2-2 {
  box-shadow: 0 6px 17px -3px #465fa2, inset 0 0 5px #673ab7 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='32' viewBox='0 0 16 32'%3E%3Cg fill='%2379a4b2' fill-opacity='0.4'%3E%3Cpath fill-rule='evenodd' d='M0 24h4v2H0v-2zm0 4h6v2H0v-2zm0-8h2v2H0v-2zM0 0h4v2H0V0zm0 4h2v2H0V4zm16 20h-6v2h6v-2zm0 4H8v2h8v-2zm0-8h-4v2h4v-2zm0-20h-6v2h6V0zm0 4h-4v2h4V4zm-2 12h2v2h-2v-2zm0-8h2v2h-2V8zM2 8h10v2H2V8zm0 8h10v2H2v-2zm-2-4h14v2H0v-2zm4-8h6v2H4V4zm0 16h6v2H4v-2zM6 0h2v2H6V0zm0 24h2v2H6v-2z'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 17px;
  background-color: #8167d745;
  /* background-color: #606bbf; */
  /* padding: 4rem; */
  background-color: #eae5faf5;
}
.sec-2-2::before {
    content: '';
    background-image: url(/assets/media/shtora-min.png);
    background-size: 478px;
    background-repeat: no-repeat;
    top: -175px;
    right: -134px;
    position: absolute;
    width: 500px;
    height: 100%;
    background-position: top right;
    mix-blend-mode: multiply;
    transform: scaleX(-1);
    opacity: 0.7;
    z-index: -1;
    @media screen and (max-width:600px)  {mix-blend-mode: overlay;}
}
.active-dark-mode .sec-2-2 {
  background-color: #2c315c;
}
.sec-2-2 .section-heading .subtitle {
  color:#c0abf4; color: #6d6387;
}
.sec-2-2 h2 {
  margin-top: 4px;
  color: #292929 !important;
  text-shadow: .5px .5px 1px #5b5b5b00;
  line-height: 1;
  font-size: 2rem;
}
.sec-2-2 .g-ram {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2), inset 0 0 0 2px rgba(255, 255, 255, 0.3), -5px 5px 6px -5px #065293;
  padding: 4px;
  border-radius: 1.5rem;
  background: linear-gradient(135deg, #cfaa59 0%, #fceeb5 50%, #cfaa59 100%);
}
.g-ram .card {
  display: flex;
  align-items: center;
  font-size: .9rem;
  color: aliceblue;
  box-shadow: -1px 1px 6px #6b6a74d1;
  flex-direction: column;
  background: radial-gradient(circle at 56% 197%, #48669ed4 43%, rgb(130 168 255 / 42%) 61%, rgb(105 95 163 / 41%) 67%), linear-gradient(0deg, rgba(213, 215, 255, 0.75), rgb(8 88 255 / 47%));
  background-color: #215481;
  border: 2px #ffffffa1;
  border-style: groove;
  border-radius: 1.5rem !important;
}
.g-ram .card span {
  color: #ffeaea !important;
  line-height: 1.2;
  font-family: 'Old Standart TT';
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 1.2rem;
}
.sec-2-2 p {
  line-height: 1.5;
  font-family: 'Unbounded';
  FONT-WEIGHT: 300;
  font-size: 14px;
  color: #ffffff;
}
.sec-2-2 .rycar ul {
  bottom: -8%; right: 5%;
  @media (min-width:576px) and (max-width:800px) { width: 300px;right: 17%;bottom: 35%; }
  @media (min-width:801px) and (max-width:1200px) { width: 334px;right: 8%;bottom: 35%; }
  @media (min-width:1201px) and (max-width:1700px) {right: 0}
}
.sec-2-2 .rycar ul li {
  bottom: 0;right: 0;
  @media screen and (max-width:800px) { bottom: -15px;right: -63px; }
}
.sec-2-2 .rycar ul li img {
  /*transform: scaleX(-1);*/width: 459px; z-index: -1;
}
@media screen and (max-width:600px) {
    .slick-track {
      min-width: 320px
    }
    .slick-slide {
      min-width: 320px
    }
}
.skidka {
  color: #343196!important;
  transform: scale(.75);
}
.skidka::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -5px;
    width: calc(100% + 10px);
    height: 2px;
    background: #ff7144;
    transform: rotate(-15deg);
    transform-origin: center;
}
.discount-badge {
     position: absolute;
      color: white;
      padding: 5px 4px 5px 12px;
      border-radius: 20px;
      font-size: 10px;
      z-index: 100;
      background: rgb(168, 0, 0);
      box-shadow: rgb(21, 2, 2) 0px 0px 15px inset;
      top: -11px;
      right: -9px;
      font-family: 'Unbounded';
    /* background: #6000a8; */

}

/* CТРАНИЦА ПЕРСОНЫ */
.category-sec {
  border-radius: 5rem;padding-top: 10rem;margin-bottom: 5rem;overflow: scroll !important;
  transition: height 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: height;
  @media only screen and (max-width: 1200px) {height: 80vh;}
}
.category-sec h1 {
  z-index: 1000;
  color: #ffffffde !important;
  font-size: 63px;
  @media screen and (max-width: 485px) {
      padding-top: 18rem;
      position: absolute;
      font-size: 32px!important;
      padding-left: 2rem;
    }
  @media (min-width: 485px) and (max-width: 700px) {
      padding-top: 18rem;
      position: absolute;
      font-size: 48px!important;
      padding-left: 2rem;
      }
  @media (min-width: 701px)  and (max-width: 1000px) {
    padding-top: 10rem;
    padding-right: 5rem;position: absolute;
  }
}
.category-sec .newcard {
   border: none!important;
   box-shadow: -2px 3px 4px rgb(0 101 227 / 19%), inset -2px 2px 81px rgb(207 219 255 / 51%)!important;
}
.category-sec img {
  pointer-events: none;
}
.personas {
  justify-self: anchor-center;hyphens: auto;
  @media screen and (max-width:1000px) { margin-top: 468px!important; }
}
.personas .project { pointer-events: none; }
.personas .subtitle { font-size: 12px;line-height: 110%; margin-top: 0rem;color: #3a3a3a;FONT-WEIGHT: 300;color: #3a3a3a;}
.category-sec .project-grid .content .title { font-size: 15px; }
.category-sec .project-grid .content { padding: 12px;}
.stick-to-fullwidth .project-grid .content { padding: 12px 16px;}
.category-sec .project-grid .thumbnail img {
  height: 168px;
  border-radius: 25% 25% 0 0;
  @media (min-width:1200px) and (max-width:1600px) {border-radius: 25% 25% 0 0;height: 180px}
}
.category-sec .project-grid .thumbnail { border-radius: 20rem 20rem 0 0;}
.category-sec .height-pers-tmb {
  height: 216px!important;
  @media screen and (max-width:600px) {height: 168px!important; }
}
.category-sec .inter-foto {
    object-position: center -36px;
    @media screen and (max-width:850px) { object-position: unset;}
}
#drag-container {
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform;
    @media only screen and (max-width: 1300px) {
        top: 192px;
        position: absolute!important;
        margin-left: auto!important;
        margin-right: auto!important;
        left: 20%!important;
    }
    @media (min-width: 1000px) and (max-width: 1300px) {top: 40%;}
}

#drag-container.position-absolute {
    position: absolute !important;
    top: 0;
    left: 0;
    opacity: 0.7;
    transform: scale(0.95);
}

.banner-style-1.sec-1 .personas {
    margin: 0 auto;
    position: relative;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform, opacity;
}
.banner-style-1.sec-1 .personas.stick-to-fullwidth {
  position: absolute;
  top: 45%;
  @media screen and (max-width:999px) {top:0;}
}
/* карусель */
#drag-container, #spin-container {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin: auto;
-webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
-webkit-transform: rotateX(-10deg);
        transform: rotateX(-10deg);

        left: -20%;
}

#drag-container img, #drag-container video {
-webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
line-height: 200px;
font-size: 50px;
text-align: center;
-webkit-box-shadow: 0 0 8px #fff;
        box-shadow: 0 0 8px #fff;
-webkit-box-reflect: below 10px linear-gradient(transparent, transparent, #0005);
border-radius:1rem;
object-fit: cover;
}

#drag-container img:hover, #drag-container video:hover {
-webkit-box-shadow: 0 0 15px #fffd;
        box-shadow: 0 0 15px #fffd;
-webkit-box-reflect: below 10px linear-gradient(transparent, transparent, #0007);
}

#drag-container p {
font-family: Serif;
position: absolute;
top: 100%;
left: 50%;
-webkit-transform: translate(-50%,-50%) rotateX(90deg);
        transform: translate(-50%,-50%) rotateX(90deg);
color: #fff;
}

#ground {
width: 900px;
height: 900px;
position: absolute;
top: 100%;
left: 50%;
-webkit-transform: translate(-50%,-50%) rotateX(90deg);
        transform: translate(-50%,-50%) rotateX(90deg);
background: -webkit-radial-gradient(center center, farthest-side , #9993, transparent);
}

#music-container {
position: absolute;
top: 0;
left: 0;
}

@-webkit-keyframes spin {
from{
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
} to{
  -webkit-transform: rotateY(360deg);
          transform: rotateY(360deg);
}
}

@keyframes spin {
from{
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
} to{
  -webkit-transform: rotateY(360deg);
          transform: rotateY(360deg);
}
}
@-webkit-keyframes spinRevert {
from{
  -webkit-transform: rotateY(360deg);
          transform: rotateY(360deg);
} to{
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
}
}
@keyframes spinRevert {
from{
  -webkit-transform: rotateY(360deg);
          transform: rotateY(360deg);
} to{
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
}
}

/* Растянутое состояние — 4 колонки */
/* .category-sec.banner-style-1.sec-1 .personas.stick-to-fullwidth .isotope-list {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
} */
/* Обычное состояние — 3 колонки */
.category-sec .isotope-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    @media screen and (max-width:650px) { grid-template-columns: repeat(2, 1fr); gap: 0;}
    @media (min-width:650px) and (max-width:767px) {  gap: 0;}
    @media (min-width:1650px) and (max-width:2200px) { grid-template-columns: repeat(4, 1fr); }
    @media (min-width:2200px) and (max-width:6200px) { grid-template-columns: repeat(5, 1fr); }
    @media (min-width:1000px) and (max-width:1300px) { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width:1000px) and (max-width:1300px) {
.stick-to-fullwidth .isotope-list {grid-template-columns: repeat(3, 1fr);}
}

.category-sec .isotope-list .project {
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Убр. абс. позиционирование от Isotope */
.category-sec .isotope-list .project {
    position: relative !important;
    left: auto !important;
    top: auto !important;
}
.category-sec .project-grid {
  width: 170px;
  border-radius: 13rem 13rem 30px 30px !important;
}
.stick-to-fullwidth .project-grid {
    @media (min-width:850px) and (max-width:1000px) { width: 214px; }
    @media (min-width:1000px) and (max-width:1150px) { width: 250px; }
    @media (min-width:1150px) and (max-width:3600px) { width: 300px; }
}

.category-sec .btn-met-bsd {
    margin-top: 2rem;
    margin-bottom: 4rem;
    filter: hue-rotate(185deg) saturate(0.5) brightness(1.25) !important
}

.axil-mainmenu .stickyprice {display: none;}

.axil-mainmenu .nostickyprice { display: block;}

.axil-sticky .stickyprice { display: block;}

.axil-sticky .nostickyprice { display: none; }
@media only screen and (max-width: 991px) {
  .mainmenu .nostickyprice { display:none}
  .mainmenu .stickyprice{ display:block}
  .mainmenu > li { border-bottom: none!important;}
  .mainmenu-nav {
    border: 2px #ffe3a8;
    border-style: groove ridge ridge groove;
    border-radius: 3rem;
    border-style: groove none ridge none;
    box-shadow: rgba(126, 93, 255, 0.55) 2px 3px 5px -2px, inset -9px 0 13px #5a74c359;
}
}