@font-face {
    font-family: "icomoon";
    src: url("../fonts/icomoon.eot?bqvrq0");
    src: url("../fonts/icomoon.eot?bqvrq0#iefix") format("embedded-opentype"), url("../fonts/icomoon.ttf?bqvrq0") format("truetype"), url("../fonts/icomoon.woff?bqvrq0") format("woff"), url("../fonts/icomoon.svg?bqvrq0#icomoon") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: block
}

@font-face {
    font-family: "Mada";
    src: url("../fonts/Mada-Bold.woff2") format("woff2"), url("../fonts/Mada-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Mada";
    src: url("../fonts/Mada-ExtraBold.woff2") format("woff2"), url("../fonts/Mada-ExtraBold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Mada";
    src: url("../fonts/Mada-Light.woff2") format("woff2"), url("../fonts/Mada-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Mada";
    src: url("../fonts/Mada-Regular.woff2") format("woff2"), url("../fonts/Mada-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Mada";
    src: url("../fonts/Mada-ExtraLight.woff2") format("woff2"), url("../fonts/Mada-ExtraLight.woff") format("woff");
    font-weight: 200;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Mada";
    src: url("../fonts/Mada-Medium.woff2") format("woff2"), url("../fonts/Mada-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: "Mada";
    src: url("../fonts/Mada-SemiBold.woff2") format("woff2"), url("../fonts/Mada-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

[class^=icon-],
[class*=" icon-"] {
    font-family: "icomoon" !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-arrow-down:before {
    content: ""
}

.icon-arrow-left:before {
    content: ""
}

.icon-arrow-right:before {
    content: ""
}

.icon-arrow-up:before {
    content: ""
}

.icon-art:before {
    content: ""
}

.icon-bottledesign:before {
    content: ""
}

.icon-bottlepainting:before {
    content: ""
}

.icon-cap-1:before {
    content: ""
}

.icon-cap:before {
    content: ""
}

.icon-car-1:before {
    content: ""
}

.icon-car:before {
    content: ""
}

.icon-catalogue:before {
    content: ""
}

.icon-check:before {
    content: ""
}

.icon-close:before {
    content: ""
}

.icon-collar:before {
    content: ""
}

.icon-comma:before {
    content: ""
}

.icon-comma2:before {
    content: ""
}

.icon-copy:before {
    content: ""
}

.icon-cream:before {
    content: ""
}

.icon-dote:before {
    content: ""
}

.icon-down_a:before {
    content: ""
}

.icon-down:before {
    content: ""
}

.icon-download:before {
    content: ""
}

.icon-error:before {
    content: ""
}

.icon-eye:before {
    content: ""
}

.icon-facebook:before {
    content: ""
}

.icon-grid-big-o:before {
    content: ""
}

.icon-home:before {
    content: ""
}

.icon-info:before {
    content: ""
}

.icon-instagram:before {
    content: ""
}

.icon-left_a:before {
    content: ""
}

.icon-left:before {
    content: ""
}

.icon-list:before {
    content: ""
}

.icon-location:before {
    content: ""
}

.icon-mail:before {
    content: ""
}

.icon-menu:before {
    content: ""
}

.icon-msnsset:before {
    content: ""
}

.icon-negative:before {
    content: ""
}

.icon-oil-1:before {
    content: ""
}

.icon-oil:before {
    content: ""
}

.icon-overflow-menu-vertical:before {
    content: ""
}

.icon-parfume-1:before {
    content: ""
}

.icon-parfume:before {
    content: ""
}

.icon-phone:before {
    content: ""
}

.icon-pinterest:before {
    content: ""
}

.icon-play:before {
    content: ""
}

.icon-plus:before {
    content: ""
}

.icon-right_a:before {
    content: ""
}

.icon-right:before {
    content: ""
}

.icon-room-1:before {
    content: ""
}

.icon-room:before {
    content: ""
}

.icon-search:before {
    content: ""
}

.icon-send:before {
    content: ""
}

.icon-share:before {
    content: ""
}

.icon-spray:before {
    content: ""
}

.icon-stock:before {
    content: ""
}

.icon-sustanabiltiy:before {
    content: ""
}

.icon-trigger:before {
    content: ""
}

.icon-up_a:before {
    content: ""
}

.icon-up:before {
    content: ""
}

.icon-warning:before {
    content: ""
}

.icon-WhatsApp:before {
    content: ""
}

.icon-x:before {
    content: ""
}

.icon-youtube:before {
    content: ""
}

.icon-zoom-out-map:before {
    content: ""
}

.icon-copy1:before {
    content: ""
}

.icon-language:before {
    content: ""
}

.icon-link:before {
    content: ""
}

.icon-file-empty:before {
    content: ""
}

.icon-spinner2:before {
    content: ""
}

.icon-blocked:before {
    content: ""
}

:root {
    --mybrand-primary: #121212;
    --brk-base-1: #69adff;
    --brk-base-2: #00c6ff;
    --brk-base-3: #0f5ae0;
    --brk-base-3-grid: #fd8000;
    --brk-base-4: #e8ecff;
    --brk-base-5: #00f6ff;
    --brk-base-6: #0b98f6;
    --brk-base-7: #a7ebff;
    --brk-base-8: #1600ba;
    --brk-secondary-1: #4f34c9;
    --brk-secondary-2: #4f00ba;
    --brk-secondary-3: #7400ba;
    --brk-secondary-4: #6e50c2;
    --brk-secondary-5: #6377df;
    --brk-secondary-6: #b50aff;
    --brk-base-1-rgb: rgb(105, 173, 255);
    --brk-base-2-rgb: rgb(0, 198, 255);
    --brk-base-3-rgb: rgba(15, 90, 224, 0.6);
    --brk-base-4-rgb: rgb(232, 236, 255);
    --brk-base-5-rgb: rgb(0, 246, 255);
    --brk-base-6-rgb: rgb(11, 152, 246);
    --brk-base-7-rgb: rgb(167, 235, 255);
    --brk-base-8-rgb: rgba(22, 0, 186, 0.12);
    --brk-secondary-1-rgb: 79, 52, 201;
    --brk-secondary-2-rgb: 79, 0, 186;
    --brk-secondary-3-rgb: 116, 0, 186;
    --brk-secondary-4-rgb: 110, 80, 194;
    --brk-secondary-5-rgb: 99, 119, 223;
    --brk-secondary-6-rgb: 181, 10, 255;
    --secondary-rgb: 114, 2, 187;
    --brand-primary: #2775ff;
    --brand-primary-rgb: 39, 117, 255;
    --secondary: #ffc109
}

.mContainer {
    width: 100%;
    max-width: 100%;
    padding: 0 60px;
    margin-right: auto;
    margin-left: auto
}

@media(max-width: 63.9375em) {
    .mContainer {
        padding-right: 15px;
        padding-left: 15px
    }
}

.mContainer.beFit {
    padding-left: 60px
}

@media(max-width: 63.9375em) {
    .mContainer.beFit {
        padding-right: 15px
    }
}

.mContainer.leftFit {
    padding-left: 60px;
    padding-right: 0
}

@media(max-width: 63.9375em) {
    .mContainer.leftFit {
        padding-left: 15px
    }
}

.mContainer.leftNoFit {
    padding-left: 0
}

@media(max-width: 63.9375em) {
    .mContainer.leftNoFit {
        padding-left: 15px
    }
}

.specleft {
    padding-left: 60px
}

@media(max-width: 63.9375em) {
    .specleft {
        padding-left: 15px
    }
}

html {
    overflow: visible !important;
    scroll-behavior: smooth;
    margin-right: 0 !important;
    overflow-x: clip !important
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background-attachment: fixed;
    padding: 0;
    margin: 0;
    height: 100%;
    font-family: "Mada";
    background-color: #fff;
    background-image: url("../images/back.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow-x: clip !important
}

body::before {
    content: "";
    transition: all .4s ease
}

body.modal-open {
    overflow: visible !important;
    padding-right: 0 !important
}

body.full-height {
    height: calc(var(--vh, 1vh)*100)
}

body.mainbody {
    overflow: hidden !important
}

body.scrollbody {
    overflow-x: hidden !important
}

body.menuOpening:before {
    content: "";
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    -webkit-backdrop-filter: blur(10.1372003555px);
    backdrop-filter: blur(10.1372003555px);
    --webkit-backdrop-filter: blur(10.137200355529785px);
    background-color: rgba(255, 255, 255, 0);
    inset: 0;
    z-index: 999
}

.main-wrapper {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    /*height: 100%;*/
    min-height: 100vh;
    overflow-x: clip !important
}

.main-wrapper.with-overflow {
    overflow: hidden;
    height: 100%;
    min-height: auto
}

.main-wrapper .main {
    z-index: 4;
    flex: 1;
    flex-direction: column;
    display: flex;
    justify-content: center;
    width: 100%;
    position: relative
}

.main-wrapper .main.scrolling-main {
    overflow-y: auto
}

ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0
}

p {
    margin: 0
}

a,
a:focus,
a:hover,
button,
textarea,
input {
    outline: none !important;
    text-decoration: none !important
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto;
    display: none
}

input[type=date]::-webkit-calendar-picker-indicator {
    color: green;
    cursor: pointer;
    opacity: 1;
    display: block;
    background: url(/assets/img/favicon/003-calendar.svg) no-repeat;
    width: 20px;
    height: 20px;
    border-width: thin
}

textarea {
    resize: none
}

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

.my-radio {
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    z-index: 0;
    display: inline-block;
    align-items: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.my-radio a {
    position: relative;
    z-index: 50
}

.my-radio .radiomark {
    position: absolute;
    top: 4px;
    left: 0;
    z-index: 2;
    height: 15px;
    width: 15px;
    background-color: #fff;
    border: 1px solid #000
}

.my-radio .radiomark.not-radius {
    border-radius: 0
}

.my-radio .radiomark.not-radius::after {
    border-radius: 0 !important
}

.my-radio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    z-index: 9;
    left: 0
}

.my-radio:hover input~.radiomark {
    background-color: #ccc
}

.my-radio input:checked~.radiomark {
    background-color: #81b5d6
}

.radiomark.selected {
    background-color: green
}

.radiomark::after {
    content: "";
    position: absolute;
    display: none
}

.slick-list {
    height: 100% !important
}

.slick-track {
    height: 100%
}

.form-outer-wrapper {
    padding: 25px;
    margin-left: 20px
}

@media(max-width: 63.9375em) {
    .form-outer-wrapper {
        margin: 0
    }
}

.form-outer-wrapper .form-inner-wrapper form .form-group {
    margin-bottom: 2rem
}

.form-outer-wrapper .form-inner-wrapper form button {
    background-color: #325fae;
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-style: normal;
    color: #fff;
    border-radius: 10px;
    border-color: #325fae;
    width: 180px;
    height: 55px
}

.form-outer-wrapper .form-inner-wrapper form label {
    margin-bottom: 10px
}

.form-outer-wrapper .form-inner-wrapper form label.required::after {
    content: "*";
    color: #52ae32
}

.form-outer-wrapper .form-inner-wrapper form input {
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.0625rem;
    font-size: clamp(1.0625rem, 1vw, 1.0625rem);
    font-style: normal;
    color: #0d1028
}

.form-outer-wrapper .form-inner-wrapper form input::-moz-placeholder {
    opacity: 1;
    -moz-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.0625rem;
    font-size: clamp(1.0625rem, 1vw, 1.0625rem);
    font-style: normal;
    color: #0d1028
}

.form-outer-wrapper .form-inner-wrapper form input:-ms-input-placeholder {
    opacity: 1;
    -ms-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.0625rem;
    font-size: clamp(1.0625rem, 1vw, 1.0625rem);
    font-style: normal;
    color: #0d1028
}

.form-outer-wrapper .form-inner-wrapper form input::placeholder {
    opacity: 1;
    transition: opacity .3s ease-in-out;
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.0625rem;
    font-size: clamp(1.0625rem, 1vw, 1.0625rem);
    font-style: normal;
    color: #0d1028
}

.form-outer-wrapper .form-inner-wrapper form input:focus::-moz-placeholder {
    opacity: 0
}

.form-outer-wrapper .form-inner-wrapper form input:focus:-ms-input-placeholder {
    opacity: 0
}

.form-outer-wrapper .form-inner-wrapper form input:focus::placeholder {
    opacity: 0
}

.form-outer-wrapper .form-inner-wrapper form input.form-control {
    height: 55px;
    box-shadow: none !important;
    border: 1px solid #c5c5c5
}

.form-outer-wrapper .form-inner-wrapper form input.form-control:focus {
    border: 1px solid #c5c5c5;
    box-shadow: none
}

.form-control:focus {
    border: 1px solid #c5c5c5;
    box-shadow: none
}

.select2-mContainer {
    width: 100% !important;
    z-index: 9
}

.select2-results__option[aria-selected=true] {
    display: none
}

.selectable {
    position: relative;
    z-index: 0;
    cursor: pointer
}

.selectable.filter {
    width: 100% !important;
    height: auto
}

.selectable.current_active .select2-mContainer--default .select2-selection--single {
    background-color: rgba(0, 0, 0, 0)
}

.select2Dropdown .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #cde2ef !important;
    color: purple !important
}

.select2Dropdown ul.select2-results__options {
    padding: 0 !important
}

.select2Dropdown ul.select2-results__options::-webkit-scrollbar-thumb {
    background-color: #ae7f4e !important
}

.select2Dropdown ul.select2-results__options li.select2-results__option--selectable.select2-results__option--selected {
    background-color: #cde2ef !important;
    color: #002944 !important
}

.select2Dropdown .select2-results {
    background-color: #fff
}

.select2Dropdown .select2-results .select2-results__options li {
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.125rem;
    font-size: clamp(1rem, 1vw, 1.125rem);
    font-style: normal;
    color: #0d1028
}

.select2Dropdown .select2-results .select2-results__options li.select2-results__option--selectable {
    color: #ae7f4e !important;
    border: 0 !important;
    font-family: "Mada";
    font-size: 1rem;
    font-size: clamp(1rem, 1vw, 1rem);
    font-style: normal;
    color: #fff
}

.select2Dropdown .select2-results .select2-results__options li.select2-results__option--selectable:hover {
    background-color: #fff;
    color: #002944 !important
}

#goUpButton {
    position: fixed;
    right: 20px;
    bottom: 20px;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transition: all .5s ease;
    z-index: 2
}

#goUpButton.show {
    opacity: 1;
    visibility: visible
}

.form__wrapper {
    position: relative;
    border: 1px solid red;
    border-radius: 5px;
    padding: 1.83575rem 8.9375rem 5.25rem 2.23125rem
}

.nav-overlay {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 9;
    width: 100%;
    display: none;
    background: rgba(20, 20, 20, .7);
    overflow: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    cursor: none
}

.form-group {
    margin-bottom: .5rem
}

.iti {
    display: block
}

.iti__selected-flag::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 100%;
    background: red;
    right: 0
}

.bxShadow {
    -ms-box-shadow: 0px 4px 11px rgba(0, 0, 0, .11);
    -o-box-shadow: 0px 4px 11px rgba(0, 0, 0, .11);
    box-shadow: 0px 4px 11px rgba(0, 0, 0, .11)
}

.turk-before {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    display: inline-flex
}

.turk-before::before {
    content: "";
    position: absolute;
    font-family: poppinsRegular, arial, sans-serif;
    font-size: .9375rem;
    color: #000;
    left: -15px
}

.turk-after {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    display: inline-flex
}

.turk-after::after {
    content: "";
    position: relative;
    display: inline-block;
    font-family: poppinsRegular, arial, sans-serif;
    font-size: clamp(12px, 1vw, 15px);
    color: #000;
    margin-left: 2px
}

.input-inherit {
    position: absolute;
    top: 50%;
    right: 5%;
    margin-top: 20px;
    cursor: pointer;
    color: #ff0
}

.typed-cursor {
    display: none
}

.fancybox-mContainer {
    z-index: 999999999 !important
}

.fancybox-active {
    overflow: visible !important
}

.compensate-for-scrollbar {
    margin-right: 0 !important
}

.tab-content {
    width: 100%
}

.bk-gradient {
    background: linear-gradient(#f1f2f6 0%, rgba(250, 251, 252, 0) 6.74%, rgba(255, 255, 255, 0) 0)
}

.display-1024-not-showing {
    display: none
}

.display-1536-s {
    display: none !important
}

.display-1536-ns {
    display: flex !important
}

.loading-anim::after {
    content: "";
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.5em;
    height: 1.5em;
    position: relative;
    margin: 0;
    left: 0;
    top: 0;
    border: .15em solid rgba(0, 0, 0, 0);
    border-right-color: #fff;
    border-radius: 50%;
    -webkit-animation: button-anim .7s linear infinite;
    animation: button-anim .7s linear infinite;
    z-index: 99
}

@-webkit-keyframes button-anim {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes button-anim {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.video-play-button {
    position: relative;
    z-index: 10;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    box-sizing: content-box;
    display: block;
    border-radius: 50%;
    padding: 18px 20px 18px 28px;
    display: flex;
    justify-content: center;
    align-items: center
}

.video-play-button.withAbsolute {
    position: absolute;
    left: auto;
    top: auto;
    transform: none;
    right: 0;
    bottom: 0
}

.video-play-button.withFixed {
    position: fixed;
    left: auto;
    top: auto;
    transform: none;
    right: 20px;
    bottom: 20px
}

.video-play-button.withFixed .icon-WhatsApp {
    font-size: 2rem;
    margin-left: -5px
}

.video-play-button i {
    color: #fff;
    font-size: 20px;
    z-index: 11;
    margin-left: -2px
}

@media(max-width: 63.9375em) {
    .video-play-button i {
        font-size: 16px
    }
}

.video-play-button:after,
.video-play-button:before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 54px;
    height: 54px;
    background: #325fae;
    border-radius: 50%
}

.video-play-button:before {
    -webkit-animation: pulse-border 1500ms ease-out infinite;
    animation: pulse-border 1500ms ease-out infinite
}

.video-play-button:after {
    transition: all 200ms
}

.video-play-button.green::after,
.video-play-button.green::before {
    background: #40c351
}

.video-play-button.yellow::after,
.video-play-button.yellow::before {
    background: #d1c900
}

.video-play-button.red::after,
.video-play-button.red::before {
    background: #db0d15
}

.video-play-button.blue::after,
.video-play-button.blue::before {
    background: #81b5d6
}

.circle-Image {
    position: absolute;
    right: -150px;
    top: -90px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center
}

@media(max-width: 63.9375em) {
    .circle-Image {
        top: 100%;
        bottom: 0;
        right: 0
    }
}

.circle-Image .text-overlay {
    position: relative;
    overflow: hidden
}

.circle-Image .text-overlay p {
    position: relative;
    margin-top: 25px;
    z-index: 3
}

.circle-Image .text-overlay:before {
    content: "";
    background: #002944;
    opacity: .53;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    z-index: 1
}

.circle-Image .video-play-button {
    position: relative;
    z-index: 20;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%)
}

.circle-Image p {
    padding-left: 1.5rem;
    font-family: "Mada";
    font-size: .875rem;
    font-size: clamp(.875rem, 1vw, .875rem);
    font-weight: bold;
    font-style: normal;
    color: #fff
}

@media(max-width: 63.9375em) {
    .circle-Image p {
        padding: 0
    }
}

.circle-Image span {
    background-size: cover;
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    overflow: hidden
}

.circle-Image span img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: contain;
    object-fit: contain;
    max-width: 500px;
    min-height: 100px
}

.circle-Image:before {
    -webkit-animation: pulse-border 1500ms ease-out infinite;
    animation: pulse-border 1500ms ease-out infinite
}

.circle-Image:after {
    transition: all 200ms
}

.circle-Image:after,
.circle-Image:before {
    content: "";
    position: absolute;
    overflow: hidden;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    background: #81b5d6;
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid #81b5d6
}

.section-padding {
    padding: 30px 0
}

@media(max-width: 39.9375em) {
    .section-padding {
        padding: 20px 0
    }
}

.nice-select {
    border: 0;
    height: 100%;
    display: flex;
    align-items: center
}

.nice-select::after {
    all: unset;
    content: "";
    font-family: icomoon;
    color: #00acee;
    font-size: 15px;
    border: 0;
    transform: rotate(0);
    height: auto;
    margin: 0;
    top: auto;
    right: 0;
    position: absolute
}

.nice-select.open::after {
    transform: rotate(180deg)
}

.np {
    padding: 0 !important
}

.white-popup {
    position: relative;
    background: #fff;
    padding: 25px;
    width: auto;
    max-width: 400px;
    margin: 0 auto
}

.mfp-zoom-in .mfp-with-anim {
    opacity: 0;
    transition: all .2s ease-in-out;
    transform: scale(0.8)
}

.mfp-zoom-in.mfp-bg {
    opacity: 0;
    transition: all .3s ease-out
}

.mfp-zoom-in.mfp-ready .mfp-with-anim {
    opacity: 1;
    transform: scale(1)
}

.mfp-zoom-in.mfp-ready.mfp-bg {
    opacity: .8
}

.mfp-zoom-in.mfp-removing .mfp-with-anim {
    transform: scale(0.8);
    opacity: 0
}

.mfp-zoom-in.mfp-removing.mfp-bg {
    opacity: 0
}

.modal-popup {
    max-width: 900px;
    overflow-x: auto;
    max-height: 500px
}

.modal-popup p {
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.0625rem;
    font-size: clamp(1.0625rem, 1vw, 1.0625rem);
    font-style: normal;
    color: #0d1028
}

.modal-popup p+p {
    margin-top: 12px
}

.modal-popup ul {
    padding: 10px
}

.modal-popup ul li {
    display: flex;
    align-items: center;
    position: relative;
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.0625rem;
    font-size: clamp(1.0625rem, 1vw, 1.0625rem);
    font-style: normal;
    color: #0d1028
}

.modal-popup ul li:not(:last-child) {
    margin-bottom: 12px
}

.modal-popup ul li::before {
    content: "";
    width: 5px;
    height: 5px;
    position: absolute;
    top: 10px;
    left: -10px;
    border-radius: 50%;
    background-color: #52ae32
}

.modal-popup .desc {
    margin-bottom: 12px
}

.modal-popup .desc .title {
    font-family: poppinsMedium, arial, sans-serif;
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-style: normal;
    color: #0d1028;
    text-align: left
}

.modal-popup .desc .count {
    position: relative;
    display: flex;
    align-items: baseline;
    font-family: oswRegular, arial, sans-serif;
    font-size: 1.0625rem;
    font-size: clamp(1.0625rem, 1vw, 1.0625rem);
    font-style: normal;
    color: #8f8f8f
}

.modal-popup .desc .count span {
    font-family: oswBold, arial, sans-serif;
    font-size: 1.875rem;
    font-size: clamp(1.875rem, 1vw, 1.875rem);
    font-style: normal;
    color: #52ae32;
    margin-right: 10px
}

.video-filter {
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 10px;
    background: rgba(0, 0, 0, .4);
    z-index: 3;
    height: 100%;
    transition: all .3s ease
}

.video-filter .media-button {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    background: #52ae32;
    color: #fff;
    transform: translateX(-50%) translateY(-50%)
}

@media(max-width: 63.9375em) {
    .video-filter .media-button {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 60px;
        height: 60px
    }
}

.video-filter .media-button.enlarge-effect {
    -webkit-animation: enlarge 2s infinite ease;
    animation: enlarge 2s infinite ease
}

.video-filter .media-button.play i {
    font-size: 32px;
    line-height: 82px;
    margin-left: 8px
}

@media(max-width: 63.9375em) {
    .video-filter .media-button.play i {
        line-height: 0;
        font-size: 20px
    }
}

.video-filter .media-button.play .icon-play {
    display: inline-block
}

.video-filter .media-button.play .icon-pause2 {
    display: none
}

.video-filter .media-button.pause i {
    font-size: 32px
}

.video-filter .media-button.pause .icon-play {
    display: none
}

.video-filter .media-button.pause .icon-pause2 {
    display: inline-block
}

.services-area {
    position: relative
}

.services-area p {
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.25rem;
    font-size: clamp(1.125rem, 1vw, 1.25rem);
    font-style: normal;
    color: #0d1028
}

.services-area p+p {
    margin-top: 12px
}

.services-area ul {
    padding: 0 20px
}

.services-area ul.withnum li {
    display: flex;
    position: relative;
    align-items: center
}

.services-area ul.withnum li::before {
    content: "";
    width: 5px;
    height: 5px;
    left: -20px;
    background-color: #000;
    position: absolute;
    border-radius: 50%
}

.services-area ul li {
    display: block;
    margin: 20px 0;
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-style: normal;
    color: #0d1028
}

.services-area ul li p {
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-style: normal;
    color: #0d1028
}

@-webkit-keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes spin-reverse {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(-360deg)
    }
}

@keyframes spin-reverse {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(-360deg)
    }
}

@-webkit-keyframes enlarge {
    0% {
        box-shadow: 0 0 0 0 #52ae32
    }

    50% {
        box-shadow: 0 0 0 10px rgba(76, 175, 111, .5)
    }

    100% {
        box-shadow: 0 0 0 0 #3f8627
    }
}

@keyframes enlarge {
    0% {
        box-shadow: 0 0 0 0 #52ae32
    }

    50% {
        box-shadow: 0 0 0 10px rgba(76, 175, 111, .5)
    }

    100% {
        box-shadow: 0 0 0 0 #3f8627
    }
}

.counter-wrapper {
    margin-top: 20px
}

.counter-wrapper .counter-text {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%
}

.counter-wrapper .counter-text p {
    margin: 1rem 0;
    font-family: poppinsBold, arial, sans-serif;
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-style: normal;
    color: #fff
}

.counter-wrapper .counter-text .countDown__cont .countDown__interval_basic_cont_description {
    color: #fff
}

.counter-wrapper .counter-text .countDown__cont :nth-child(1) .countDown__digit_cont_1 .countDown__digit_new_rotated_inner {
    background: #00acee
}

.counter-wrapper .counter-text .countDown__cont :nth-child(1) .countDown__digit_cont_0 .countDown__digit_new_rotated_inner {
    background: #00acee
}

.counter-wrapper .counter-text .countDown__cont :nth-child(2) .countDown__digit_cont_1 .countDown__digit_new_rotated_inner {
    background: #52ae32
}

.counter-wrapper .counter-text .countDown__cont :nth-child(2) .countDown__digit_cont_0 .countDown__digit_new_rotated_inner {
    background: #52ae32
}

.counter-wrapper .counter-text .countDown__cont :nth-child(3) .countDown__digit_cont_1 .countDown__digit_new_rotated_inner {
    background: #fff;
    color: #000
}

.counter-wrapper .counter-text .countDown__cont :nth-child(3) .countDown__digit_cont_0 .countDown__digit_new_rotated_inner {
    background: #fff;
    color: #000
}

.countDown__cont {
    display: flex
}

.countDown__cont .countDown__interval_cont {
    display: flex;
    justify-content: space-around;
    width: auto
}

.countDown__cont .countDown__digit_cont {
    position: relative
}

.countDown__cont .countDown__digit_new_rotate {
    display: flex;
    justify-content: center;
    font-size: 26px;
    overflow: hidden
}

.countDown__cont .countDown__digit_last_placeholder,
.countDown__cont .countDown__digit_new_placeholder,
.countDown__cont .countDown__digit_last_rotate {
    display: none
}

.countDown__cont .countDown__interval_basic_cont {
    display: flex;
    align-items: baseline
}

.countDown__cont .countDown__digit_new_rotated_inner {
    background: red;
    color: #fff;
    padding: 1px 4px;
    margin: auto 3px;
    border-radius: 5px;
    line-height: 32px
}

.countDown__cont .countDown__interval_basic_cont_description {
    top: 4px;
    position: relative;
    margin: 0 8px 0px 6px;
    color: #000
}

label.error {
    position: absolute;
    bottom: 0;
    margin: auto;
    -webkit-animation: fadeInUp .6s;
    animation: fadeInUp .6s;
    color: #d9000d !important;
    font-size: 11px !important;
    padding: 10px;
    -webkit-animation: fadeInUp 1s ease;
    animation: fadeInUp 1s ease
}

.form-control.error {
    border-bottom: 1px solid #db0d15 !important;
    border: 1px solid #db0d15
}

.bg-color {
    background-color: #f5f3f0
}

.wow {
    visibility: hidden
}

.overlay::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(rgba(0, 0, 0, 0) 0%, #000 100%);
    opacity: .3
}

.simple-spinner {
    width: 30px;
    height: 30px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.simple-spinner span {
    display: block;
    width: 30px;
    height: 30px;
    border: 3px solid rgba(0, 0, 0, 0);
    border-radius: 50%;
    border-right-color: rgba(255, 255, 255, .7);
    -webkit-animation: spinner-anim .8s linear infinite;
    animation: spinner-anim .8s linear infinite
}

@-webkit-keyframes spinner-anim {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@keyframes spinner-anim {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.loading {
    font-size: 0 !important;
    width: 30px !important;
    height: 30px !important;
    margin-top: 5px;
    border-radius: 50%;
    padding: 0;
    border: 3px solid #fff;
    border-bottom: 3px solid #ae7f4e;
    border-left: 3px solid #ae7f4e;
    background-color: rgba(0, 0, 0, 0) !important;
    animation-name: rotateAnimation;
    -webkit-animation-name: wk-rotateAnimation;
    animation-duration: 1s;
    -webkit-animation-duration: 1s;
    animation-delay: .2s;
    -webkit-animation-delay: .2s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    pointer-events: none
}

@media(max-width: 63.9375em) {
    .loading {
        font-size: 0 !important;
        width: 16px !important;
        height: 16px !important;
        margin-top: 5px;
        border-radius: 50%;
        padding: 0;
        border: 3px solid #fff;
        border-bottom: 3px solid #ae7f4e;
        border-left: 3px solid #ae7f4e;
        background-color: rgba(0, 0, 0, 0) !important;
        animation-name: rotateAnimation;
        -webkit-animation-name: wk-rotateAnimation;
        animation-duration: 1s;
        -webkit-animation-duration: 1s;
        animation-delay: .2s;
        -webkit-animation-delay: .2s;
        animation-iteration-count: infinite;
        -webkit-animation-iteration-count: infinite;
        pointer-events: none
    }
}


@-webkit-keyframes wk-rotateAnimation {
    0% {
        -webkit-transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

.bkImage {
    background-repeat: no-repeat;
    background-size: cover
}

.bkImage.back2 {
    background-image: url("../../assets/img/backImages/back2.jpg")
}

.bkImage.backTop {
    background-size: contain;
    background-image: url("../../assets/img/backImages/altsayfaback.jpg")
}

.bkImage.backProfil {
    background-image: url("../../assets/img/backImages/profilback.jpg")
}

.policy-button {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-style: normal;
    color: #fff
}

.policy-button a {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-style: normal;
    color: #fff;
    text-decoration: underline !important
}

.policy-button.gold a {
    color: #ae7f4e;
    transition: color .4s ease-in-out
}

.policy-button.gold a:hover {
    color: #81b5d6
}

.policy-button.blue a {
    color: #cde2ef;
    transition: color .4s ease-in-out
}

.policy-button.blue a:hover {
    color: #81b5d6
}

.ba-slider .handle {
    display: flex;
    align-items: center;
    width: 2px
}

.ba-slider .handle.beBlue {
    background: #003a4b
}

.ba-slider .handle.beBlue .icon-wrapper {
    background: #003a4b
}

.ba-slider .handle.beYellow {
    background: #b18e14
}

.ba-slider .handle.beYellow .icon-wrapper {
    background: #b18e14
}

.ba-slider .handle .icon-wrapper {
    display: flex;
    width: 62px;
    height: 62px;
    padding: 1rem;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: absolute;
    left: -30px;
    filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16));
    transform: translate3d(0, 0, 0)
}

.ba-slider .handle .icon-wrapper i {
    font-size: .8rem;
    color: #fff
}

.ba-slider .handle .icon-wrapper i+i {
    margin-left: 1rem
}

.ba-slider .handle::before {
    display: none;
    position: absolute;
    top: 50%;
    content: "";
    font-size: .2rem;
    font-family: icomoon;
    color: #fff;
    font-weight: 700;
    font-size: 36px;
    text-align: center;
    line-height: 64px;
    border: 1px solid #b18e14;
    border-top-right-radius: 50%;
    transition: all .3s ease;
    filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16));
    box-shadow: 0 2px 6px rgba(0, 0, 0, .3), inset 0 2px 0 rgba(255, 255, 255, .5), inset 0 60px 50px -30px #b18e14
}

.ba-slider .handle::after {
    display: none;
    background: #b18e14;
    filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.16))
}

.z-9 {
    z-index: 9
}

.ps-8 {
    padding-left: 6rem !important
}

.spinner-grow {
    width: 15px;
    height: 15px;
    -webkit-animation: loadingA 1.5s 1s infinite;
    animation: loadingA 1.5s 1s infinite;
    background-color: #839fac;
    opacity: 1;
    border-radius: 12px
}

.spinner-grow:nth-last-child(1) {
    -webkit-animation: loadingA 1.5s 1s infinite;
    animation: loadingA 1.5s 1s infinite
}

.spinner-grow:nth-last-child(2) {
    -webkit-animation: loadingA 1.5s .5s infinite;
    animation: loadingA 1.5s .5s infinite
}

.spinner-grow:nth-last-child(3) {
    -webkit-animation: loadingA 1.5s 0s infinite;
    animation: loadingA 1.5s 0s infinite
}

@-webkit-keyframes loadingA {
    0% {
        height: 15px
    }

    50% {
        height: 35px
    }

    100% {
        height: 15px
    }
}

@keyframes loadingA {
    0% {
        height: 15px
    }

    50% {
        height: 35px
    }

    100% {
        height: 15px
    }
}

@-webkit-keyframes pulse-border {
    0% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1
    }

    100% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
        opacity: 0
    }
}

@keyframes pulse-border {
    0% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1
    }

    100% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
        opacity: 0
    }
}

@-webkit-keyframes run {
    0% {
        left: -20%
    }

    50% {
        left: 0%
    }

    100% {
        left: 20%
    }
}

@-webkit-keyframes fade-in {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes fade-in {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.banner-area {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #010f19
}

.banner-area .banner-desc {
    position: relative;
    padding: 3rem 2rem;
    z-index: 4
}

.banner-area .banner-desc h1 {
    font-family: poppinsBold, arial, sans-serif;
    font-size: 1.75rem;
    font-size: clamp(1.375rem, 2vw, 1.75rem);
    font-style: normal;
    color: #0d1028
}

.banner-area .banner-desc h2 {
    font-family: poppinsBold, arial, sans-serif;
    font-size: 1.625rem;
    font-size: clamp(1.25rem, 2vw, 1.625rem);
    font-style: normal;
    color: #fff
}

.banner-area .payment-list-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%
}

.banner-area .payment-list-wrapper li {
    width: 100%
}

.banner-area .payment-list-wrapper li:not(:last-child) .payment-info {
    border-right: 1px solid #c5c5c5
}

.banner-area .payment-list-wrapper li.not-active {
    opacity: .3
}

.banner-area .payment-list-wrapper li .payment-info {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem 0
}

@media(max-width: 63.9375em) {
    .banner-area .payment-list-wrapper li .payment-info {
        flex-direction: column;
        text-align: center
    }
}

.banner-area .payment-list-wrapper li .payment-info span {
    margin-right: .5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    padding: 1rem;
    width: 2rem;
    height: 2rem;
    background-color: #fff;
    border: 1px solid #0d1028;
    font-family: poppinsBold, arial, sans-serif;
    font-size: 1rem;
    font-size: clamp(1rem, 1vw, 1rem);
    font-style: normal;
    color: #0d1028
}

.banner-area .payment-list-wrapper li .payment-info p {
    font-family: poppinsRegular, arial, sans-serif;
    font-size: 1.125rem;
    font-size: clamp(.875rem, 1vw, 1.125rem);
    font-style: normal;
    color: #0d1028
}

.navbar {
    flex-wrap: nowrap;
    padding: 0 !important
}

.navbar-expand-xl .navbar-nav .nav-link {
    all: unset
}

.general {
    background: rgba(0, 0, 0, 0);
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 99
}

.general.sOpen {
    z-index: -1
}

@media(max-width: 63.9375em) {
    .general {
        padding-left: 0
    }
}

.general #mainMenu {
    background: rgba(0, 0, 0, 0);
    border-bottom: .5px solid rgba(255, 255, 255, .15);
    transition: background .4s ease-in-out
}

.general #mainMenu .red-logo {
    display: none
}

.general #mainMenu .white-logo {
    display: block
}

.general #mainMenu .menu-icon {
    cursor: pointer
}

.general #mainMenu .menu-icon span {
    color: #fff
}

.general #mainMenu .menu-icon i {
    color: #fff
}

.general #mainMenu .navbar-toggle {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 2.3rem;
    height: 2.3rem;
    border-radius: 50%;
    background-color: #ae7f4e !important
}

.general #mainMenu .navbar-toggle i {
    color: #fff
}

.general #mainMenu .navbar-toggle.collapsed::before {
    content: "";
    position: absolute;
    font-family: icomoon;
    font-size: 1.3rem;
    color: #fff
}

.general #mainMenu .navbar-toggle::before {
    content: "";
    position: absolute;
    font-family: icomoon;
    font-size: 1.1rem;
    color: #fff;
    transition: all .4s ease
}

.general #mainMenu .navbar-toggle.collapsed .menu-bar {
    background-color: #fff
}

.general #mainMenu .navbar-toggle .menu-bar {
    background-color: #fff
}

.general #mainMenu .navbar-toggle:focus {
    box-shadow: none !important
}

.general #mainMenu .nav-item {
    position: relative
}

.general #mainMenu .nav-item.withSub .nav-link {
    color: #003a4b
}

@media(max-width: 39.9375em) {
    .general #mainMenu .nav-item.withSub .nav-link {
        padding: 0 .5rem 0 0
    }
}

.general #mainMenu .nav-item.withSub .nav-link i {
    margin-right: .3rem
}

.general #mainMenu .nav-item.withSub:hover .nav-link {
    color: #b07a2f
}

.general #mainMenu .nav-item a {
    position: relative;
    display: flex;
    padding: 1.92rem 1.4rem;
    font-family: "Mada";
    font-size: 1.1875rem;
    font-size: clamp(1.125rem, 1vw, 1.1875rem);
    font-weight: 500;
    font-style: normal;
    color: #02171d
}

.general #mainMenu .nav-item a object g {
    display: none
}

.general #mainMenu .nav-item a .withButton {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 8px;
    height: 8px;
    background-color: #295836;
    transform: rotate(45deg);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .4s ease
}

.general #mainMenu .nav-item a .withButton i {
    opacity: 0;
    font-size: .6rem !important;
    margin: 0;
    visibility: hidden;
    transition: all .3s ease;
    color: #fff !important;
    transform: rotate(-45deg)
}

.general #mainMenu .nav-item a.withBg {
    position: relative
}

.general #mainMenu .nav-item a.withBg.one {
    background-color: rgba(0, 0, 0, .2)
}

.general #mainMenu .nav-item a.withBg.two {
    background-color: rgba(0, 58, 75, .7)
}

.general #mainMenu .nav-item a.withBg:hover .norm {
    color: #c38a3b
}

.general #mainMenu .nav-item a.withBg:hover .norm svg g {
    fill: #c38a3b
}

.general #mainMenu .nav-item a.withBg:hover .norm svg g path {
    fill: #c38a3b
}

.general #mainMenu .nav-item a .norm {
    font-size: 1.8rem;
    color: #fff;
    margin-right: .3rem !important;
    transition: all .4s ease
}

.general #mainMenu .nav-item a .norm svg {
    min-height: 30px;
    max-height: 30px
}

.general #mainMenu .nav-item a .norm svg g {
    fill: #fff;
    transition: all .4s ease
}

.general #mainMenu .nav-item a .norm svg g path {
    fill: #fff;
    transition: all .4s ease
}

.general #mainMenu .nav-item a.home-button::after {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #000;
    position: absolute;
    right: -5px;
    top: 0
}

.general #mainMenu.bkDarkTranslate {
    background: rgba(0, 0, 0, 0);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    --webkit-backdrop-filter: blur(6px);
    background-color: rgba(0, 0, 0, .6)
}

.general #mainMenu.bkDarkTranslate .translator::before {
    color: #fff
}

.general #mainMenu.bkDarkTranslate .translator::after {
    color: #fff
}

.general #mainMenu.bkDarkTranslate .translator li:not(.selected) {
    background: rgba(0, 0, 0, 0);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    --webkit-backdrop-filter: blur(6px);
    background-color: rgba(0, 0, 0, .6)
}

.general #mainMenu.bkDarkTranslate .menu-icon {
    cursor: pointer
}

.general #mainMenu.bkDarkTranslate .menu-icon span {
    color: #fff
}

.general #mainMenu.bkDarkTranslate .menu-icon i {
    color: #fff
}

.general #mainMenu.bkDarkTranslate .navbar-toggle .menu-bar {
    background-color: #fff
}

.general #mainMenu.bkDarkTranslate .white-logo {
    display: block
}

.general #mainMenu.bkDarkTranslate .red-logo {
    display: none
}

.general #mainMenu.bkDarkTranslate .nav-item.withSub ul {
    background: rgba(0, 0, 0, 0);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    --webkit-backdrop-filter: blur(6px);
    background-color: rgba(0, 0, 0, .6)
}

.general #mainMenu.bkWhite {
    background: #fff
}

.general #mainMenu.bkWhite .nav-item.withSub .nav-link::after {
    color: #003a4b
}

.general #mainMenu.bkWhite .nav-item.withSub ul {
    -ms-box-shadow: 0px 4px 11px rgba(0, 0, 0, .11);
    -o-box-shadow: 0px 4px 11px rgba(0, 0, 0, .11);
    box-shadow: 0px 4px 11px rgba(0, 0, 0, .11);
    background-color: #fff
}

.general #mainMenu.bkWhite .nav-item.withSub ul li a {
    color: #003a4b
}

.general #mainMenu.bkWhite .nav-item.withSub ul li:hover a {
    color: #fff
}

.general #mainMenu.bkWhite .navbar-toggle .menu-bar {
    background-color: #fff
}

.general #mainMenu.bkWhite .white-logo {
    display: none
}

.general #mainMenu.bkWhite .translator::before {
    color: #003a4b
}

.general #mainMenu.bkWhite .translator::after {
    color: #003a4b
}

.general #mainMenu.bkWhite .translator li a {
    color: #003a4b
}

.general #mainMenu.bkWhite .translator li:not(.selected) {
    background-color: #fff
}

.general #mainMenu.bkWhite .menu-icon {
    cursor: pointer;
    border: 0
}

.general #mainMenu.bkWhite .menu-icon span {
    color: #02171d;
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.general #mainMenu.bkWhite .menu-icon i {
    padding-top: .5rem;
    color: #02171d
}

.general #mainMenu.bkWhite .red-logo {
    display: block
}

.general #mainMenu.bkWhite .nav-item a {
    font-family: "Mada";
    font-size: 1.1875rem;
    font-size: clamp(1rem, 1vw, 1.1875rem);
    font-weight: 500;
    font-style: normal;
    color: #fff
}

.general #mainMenu.bkWhite .nav-item a.withBg.one {
    background-color: #88adb7
}

.general #mainMenu.bkWhite .nav-item a.withBg.two {
    background-color: #003a4b
}

.general #mainMenu.bkWhite .nav-item a .norm {
    font-size: 1.8rem;
    color: #fff;
    margin-right: .3rem !important
}

.general #mainMenu.light .nav-item a {
    color: #fff
}

.general #mainMenu .navbar-nav {
    align-items: center;
    flex-direction: row !important
}

.general #mainMenu .navbar-nav li a {
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center
}

.general #mainMenu .navbar-nav li a.home-button::after {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #fff;
    position: absolute;
    right: -5px;
    top: 0
}

.general #mainMenu .translator {
    cursor: pointer;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 1.42rem 1rem
}

@media(max-width: 63.9375em) {
    .general #mainMenu .translator {
        position: absolute;
        right: 40px
    }
}

.general #mainMenu .translator::before {
    content: "";
    position: absolute;
    top: 26px;
    right: 0;
    font-family: icomoon;
    font-size: .3rem;
    color: #fff
}

.general #mainMenu .translator::after {
    content: "";
    position: absolute;
    bottom: 26px;
    right: 0;
    font-family: icomoon;
    font-size: .3rem;
    opacity: .3;
    color: #fff
}

@media(max-width: 63.9375em) {
    .general #mainMenu .translator::after {
        bottom: 30px
    }
}

.general #mainMenu .translator li {
    padding: 1rem;
    display: none
}

.general #mainMenu .translator li.selected {
    display: flex;
    padding: 0
}

.general #mainMenu .translator li a {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1rem, 1vw, 1.125rem);
    font-weight: normal;
    font-style: normal;
    color: #fff
}

.general #mainMenu .translator:hover li:not(.selected) {
    -ms-box-shadow: 0px 4px 11px rgba(0, 0, 0, .11);
    -o-box-shadow: 0px 4px 11px rgba(0, 0, 0, .11);
    box-shadow: 0px 4px 11px rgba(0, 0, 0, .11);
    display: flex;
    position: absolute;
    top: 100%
}

.general #mainMenu .navbar-brand {
    margin: 0
}

.general #mainMenu .navbar-brand img {
    max-width: 190px;
    transition: all .4s ease
}

@media(max-width: 63.9375em) {
    .general #mainMenu .navbar-brand img {
        max-width: 80px;
        min-width: 88px
    }
}

.general #mainMenu .nav-item-s:not(:last-child) {
    padding-right: 1.5rem !important
}

@media(max-width: 63.9375em) {
    .general #mainMenu .nav-item-s:not(:last-child) {
        padding-right: 1rem !important
    }
}

.general #mainMenu .nav-item-s a i {
    color: #fff;
    font-size: 1.3rem
}

.general #mainMenu .nav-item-s .nav-link {
    padding: 0 !important
}

.general #mainMenu .nav-item-s .nav-link.basket span {
    position: absolute;
    background-color: #ae7f4e;
    width: .9rem;
    height: .9rem;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    top: -7px;
    right: -10px;
    font-family: "Mada";
    font-size: .6875rem;
    font-size: clamp(.6875rem, 1vw, .6875rem);
    font-style: normal;
    color: #fff
}

.general #mainMenu .nav-item.active a {
    color: #ae7f4e
}

.general #mainMenu .nav-item a {
    font-family: "Mada";
    font-size: 1.1875rem;
    font-size: clamp(1rem, 1vw, 1.1875rem);
    font-style: normal;
    color: #fff;
    transition: all .4s ease
}

.general #mainMenu .nav-item a:hover .withButton {
    border-radius: 5px;
    width: 22px;
    height: 22px
}

.general #mainMenu .nav-item a:hover .withButton i {
    opacity: 1;
    visibility: visible
}

.general #mainMenu .nav-item a.btn {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-style: normal;
    color: #fff;
    color: #fff;
    background-color: #ae7f4e;
    border: 0;
    border-radius: 50px;
    transition: background-color .3s ease-in-out
}

.general #mainMenu .nav-item a.btn:hover {
    color: #fff;
    background-color: #8b653e
}

.general.withsticky {
    position: -webkit-sticky !important;
    position: sticky !important
}

.footer {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end
}

.footer .footer-bottom {
    position: relative
}

.footer .footer-bottom .footerBottomImg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -100%);
    width: 89px;
    height: 90px
}

@media(max-width: 63.9375em) {
    .footer .footer-bottom .footerBottomImg {
        top: -30%
    }
}

@media(max-width: 39.9375em) {
    .footer .footer-bottom .footerBottomImg {
        width: 60px;
        height: 60px
    }
}

.footer .footer-bottom .footer-inner-bottom {
    padding-bottom: 1.5rem
}

@media(max-width: 63.9375em) {
    .footer .footer-bottom .footer-inner-bottom {
        padding-top: 0
    }
}

.footer .footer-bottom .footer-inner-bottom .footer-link {
    display: flex;
    align-items: center
}

@media(max-width: 63.9375em) {
    .footer .footer-bottom .footer-inner-bottom .footer-link {
        justify-content: center
    }
}

.footer .footer-bottom .footer-inner-bottom .footer-link li:not(:last-child) {
    padding-right: 1rem
}

.footer .footer-bottom .footer-inner-bottom .footer-link li a {
    font-family: "Mada";
    font-size: 1.0625rem;
    font-size: clamp(1rem, 1vw, 1.0625rem);
    font-weight: 600;
    font-style: normal;
    color: #000;
    transition: all .4s ease
}

.footer .footer-bottom .footer-inner-bottom .footer-link li:hover a {
    color: #c38a3b
}

.footer .footer-bottom .footer-inner-bottom .copyright p {
    font-family: "Mada";
    font-size: 1rem;
    font-size: clamp(.875rem, 1vw, 1rem);
    font-weight: normal;
    font-style: normal;
    color: #000
}

@media(max-width: 63.9375em) {
    .footer .footer-bottom .footer-inner-bottom .copyright p {
        text-align: center
    }
}

.preloader,
.videopopup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999999;
    overflow: hidden;
    background: #02171d;
    /*background-image: url("../images/preloadImage.jpeg");*/
    background-repeat: no-repeat;
    background-position: center
}

.preloader.hide,
.videopopup.hide {
    display: none
}

.preloader .progressbar,
.videopopup .progressbar {
    position: absolute;
    width: 100%;
    height: 10px;
    background-color: #c3c3c3;
    z-index: 1;
    bottom: 0;
    left: 0
}

.preloader .progressbar span,
.videopopup .progressbar span {
    position: absolute;
    background-color: #5790a0;
    width: 100px;
    z-index: 2;
    height: 100%
}

.preloader .middle-image-wrapper,
.videopopup .middle-image-wrapper {
    position: relative
}

.preloader .middle-image-wrapper img,
.videopopup .middle-image-wrapper img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 300px;
    min-width: 300px
}

.preloader .logoImage,
.videopopup .logoImage {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 180px;
    min-width: 180px
}

.preloader .preloader-text,
.videopopup .preloader-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    top: auto;
    bottom: 20px;
    font-family: "Mada";
    font-size: 2.5rem;
    font-size: clamp(1.5rem, 1vw, 2.5rem);
    font-weight: bold;
    font-style: normal;
    color: #5790a0;
    top: 80%
}

.preloader .videopopup-wrapper,
.videopopup .videopopup-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.preloader .videopopup-wrapper .title,
.videopopup .videopopup-wrapper .title {
    font-family: poppinsBold, arial, sans-serif;
    font-size: 2.0625rem;
    font-size: clamp(1.125rem, 1vw, 2.0625rem);
    font-style: normal;
    color: #fff;
    text-align: center
}

.preloader .videopopup-wrapper .title2,
.videopopup .videopopup-wrapper .title2 {
    font-family: caveateBold, arial, sans-serif;
    font-size: 3.3125rem;
    font-size: clamp(1.25rem, 2vw, 3.3125rem);
    font-style: normal;
    color: #52ae32;
    margin: 0 0 20px 0;
    text-align: center
}

.preloader .videopopup-wrapper .video-wrapper,
.videopopup .videopopup-wrapper .video-wrapper {
    position: relative;
    width: 1015px;
    height: 571px
}

@media(max-width: 63.9375em) {

    .preloader .videopopup-wrapper .video-wrapper,
    .videopopup .videopopup-wrapper .video-wrapper {
        width: 100%;
        height: 100%;
        display: flex
    }
}

@media(max-width: 39.9375em) {

    .preloader .videopopup-wrapper .video-wrapper iframe,
    .videopopup .videopopup-wrapper .video-wrapper iframe {
        height: 220px !important
    }
}

@media(max-width: 63.9375em) {

    .preloader .videopopup-wrapper .video-wrapper iframe,
    .videopopup .videopopup-wrapper .video-wrapper iframe {
        height: 500px
    }
}

.preloader .videopopup-wrapper .video-wrapper video,
.videopopup .videopopup-wrapper .video-wrapper video {
    width: 100%;
    height: 100%
}

.preloader .videopopup-wrapper span,
.videopopup .videopopup-wrapper span {
    margin-top: 20px
}

.preloader .loader,
.videopopup .loader {
    position: relative;
    display: flex;
    left: 0;
    bottom: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    justify-content: center;
    transform: translateX(0) translateY(-50%);
    z-index: 11
}

.preloader .loader img,
.videopopup .loader img {
    width: 150px
}

.videopopup {
    z-index: 99999 !important;
    background: rgba(13, 16, 40, .9) !important
}

.form-wrapper {
    position: relative
}

.form-wrapper h2 {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 700;
    font-style: normal;
    color: #b5b5b5
}

.form-wrapper h3 {
    font-family: "Mada";
    font-size: 1.75rem;
    font-size: clamp(1.5rem, 2vw, 1.75rem);
    font-weight: 700;
    font-style: normal;
    color: #003a4b
}

.form-wrapper .form-controller.text-file-name:not(:-moz-placeholder-shown)+.removeFile {
    display: inline-block
}

.form-wrapper .form-controller.text-file-name:not(:-ms-input-placeholder)+.removeFile {
    display: inline-block
}

.form-wrapper .form-controller.text-file-name:not(:placeholder-shown)+.removeFile {
    display: inline-block
}

.form-wrapper form label {
    font-family: "Mada";
    font-size: 1.25rem;
    font-size: clamp(1.125rem, 1vw, 1.25rem);
    font-weight: 500;
    font-style: normal;
    color: #003a4b
}

.form-wrapper form input {
    margin: 1rem 0;
    padding: .5rem;
    background: #fff;
    border: 1px solid rgba(87, 144, 160, .45);
    height: 55px;
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #003a4b
}

.form-wrapper form input::-moz-placeholder {
    color: rgba(255, 255, 255, .6);
    font-family: "Mada";
    font-size: .9375rem;
    font-size: clamp(.9375rem, 1vw, .9375rem);
    font-weight: normal;
    font-style: normal;
    color: #b9d1d8
}

.form-wrapper form input:-ms-input-placeholder {
    color: rgba(255, 255, 255, .6);
    font-family: "Mada";
    font-size: .9375rem;
    font-size: clamp(.9375rem, 1vw, .9375rem);
    font-weight: normal;
    font-style: normal;
    color: #b9d1d8
}

.form-wrapper form input::placeholder {
    color: rgba(255, 255, 255, .6);
    font-family: "Mada";
    font-size: .9375rem;
    font-size: clamp(.9375rem, 1vw, .9375rem);
    font-weight: normal;
    font-style: normal;
    color: #b9d1d8
}

.form-wrapper form textarea {
    position: relative;
    margin: 1rem 0;
    height: 100px
}

.form-wrapper form textarea::-moz-placeholder {
    color: rgba(255, 255, 255, .6);
    font-family: "Mada";
    font-size: .9375rem;
    font-size: clamp(.9375rem, 1vw, .9375rem);
    font-weight: normal;
    font-style: normal;
    color: #b9d1d8
}

.form-wrapper form textarea:-ms-input-placeholder {
    color: rgba(255, 255, 255, .6);
    font-family: "Mada";
    font-size: .9375rem;
    font-size: clamp(.9375rem, 1vw, .9375rem);
    font-weight: normal;
    font-style: normal;
    color: #b9d1d8
}

.form-wrapper form textarea::placeholder {
    color: rgba(255, 255, 255, .6);
    font-family: "Mada";
    font-size: .9375rem;
    font-size: clamp(.9375rem, 1vw, .9375rem);
    font-weight: normal;
    font-style: normal;
    color: #b9d1d8
}

.form-wrapper .input-form-group {
    position: relative;
    display: flex;
    align-items: center
}

.form-wrapper .input-form-group .removeFile {
    position: absolute;
    cursor: pointer;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    top: 35%;
    right: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
    background-color: #b07a2f
}

.form-wrapper .input-form-group .removeFile i {
    font-size: .5rem;
    color: #fff
}

.mButton {
    position: relative;
    margin-top: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 3rem;
    color: #fff;
    background: linear-gradient(270deg, #905E1A -39%, #C38A3B 96.3%);
    border: 2px solid #c38a3b;
    border-radius: 5px;
    font-family: "Mada";
    font-size: 1.3125rem;
    font-size: clamp(1.125rem, 2vw, 1.3125rem);
    font-weight: 500;
    font-style: normal;
    color: #fff;
    transition: all .4s ease;
    overflow: hidden;
    z-index: 10;
}

.mButton.withAbs {
    position: absolute;
    bottom: 2px
}

@media(max-width: 63.9375em) {
    .mButton.withAbs {
        bottom: 30px;
        z-index: 2;
    }
}

@media(max-width: 63.9375em) {
    .mButton {
        position: relative;
        bottom: auto;
        max-width: 171px;
        min-width: 171px;
        max-height: 50px;
        min-height: 50px;
        white-space: nowrap
    }
}

.mButton img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    min-width: 25px;
    max-width: 25px;
    margin-right: 1rem;
    transform: translateX(0) translateY(0);
    transition: all .4s ease
}

@media(max-width: 63.9375em) {
    .mButton img {
        margin-right: .5rem
    }
}

.mButton i {
    margin-left: 1rem;
    font-size: 1rem;
    color: #fff;
    transform: translateX(0) translateY(0);
    transition: all .4s ease
}

.mButton:hover {
    color: #fff
}

.mButton:hover img {
    transform: translateX(0) translateY(-30%)
}

.mButton:hover i {
    transform: translateX(50%) translateY(0)
}

.confirmButton {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 3rem;
    color: #fff;
    background: linear-gradient(270deg, #905E1A -39%, #C38A3B 96.3%);
    border: 2px solid #c38a3b;
    border-radius: 5px;
    font-family: "Mada";
    font-size: 1.3125rem;
    font-size: clamp(1.125rem, 2vw, 1.3125rem);
    font-weight: 500;
    font-style: normal;
    color: #fff;
    transition: all .4s ease;
    overflow: hidden;
    max-height: 55px;
    min-height: 55px
}

.confirmButton.withAbs {
    position: absolute;
    bottom: 50px
}

@media(max-width: 63.9375em) {
    .confirmButton {
        position: relative;
        bottom: auto;
        max-width: 171px;
        min-width: 171px;
        white-space: nowrap
    }
}

.confirmButton img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    min-width: 25px;
    max-width: 25px;
    margin-right: 1rem;
    transform: translateX(0) translateY(0);
    transition: all .4s ease
}

@media(max-width: 63.9375em) {
    .confirmButton img {
        margin-right: .5rem
    }
}

.confirmButton i {
    margin-left: 1rem;
    font-size: 1rem;
    color: #fff;
    transform: translateX(0) translateY(0);
    transition: all .4s ease
}

.confirmButton:hover {
    color: #fff
}

.confirmButton:hover img {
    transform: translateX(0) translateY(-30%)
}

.confirmButton:hover i {
    transform: translateX(50%) translateY(0)
}

.cancelButton {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 3rem;
    color: #fff;
    background: linear-gradient(270deg, #5790A0 -39%, #0085AC 96.3%);
    border: 2px solid #0085ac;
    border-radius: 5px;
    max-height: 55px;
    min-height: 55px;
    font-family: "Mada";
    font-size: 1.3125rem;
    font-size: clamp(1.125rem, 2vw, 1.3125rem);
    font-weight: 500;
    font-style: normal;
    color: #fff;
    transition: all .4s ease;
    overflow: hidden
}

.cancelButton.withAbs {
    position: absolute;
    bottom: 50px
}

@media(max-width: 63.9375em) {
    .cancelButton {
        position: relative;
        bottom: auto;
        max-width: 171px;
        min-width: 171px;
        white-space: nowrap
    }
}

.cancelButton img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    min-width: 25px;
    max-width: 25px;
    margin-right: 1rem;
    transform: translateX(0) translateY(0);
    transition: all .4s ease
}

@media(max-width: 63.9375em) {
    .cancelButton img {
        margin-right: .5rem
    }
}

.cancelButton i {
    margin-left: 1rem;
    font-size: 1rem;
    color: #fff;
    transform: translateX(0) translateY(0);
    transition: all .4s ease
}

.cancelButton:hover {
    color: #fff
}

.cancelButton:hover img {
    transform: translateX(0) translateY(-30%)
}

.cancelButton:hover i {
    transform: translateX(50%) translateY(0)
}

.refresh-button-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    position: absolute;
    top: 50%;
    left: auto;
    z-index: 999999;
    transform: translate(-30%, -50%)
}

.refresh-button-wrapper .refresh-button {
    cursor: pointer;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    width: 72px;
    height: 72px;
    background-color: #9ea056
}

@media(max-width: 63.9375em) {
    .refresh-button-wrapper .refresh-button {
        width: 57px;
        height: 57px
    }
}

.refresh-button-wrapper .refresh-button img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    min-width: 30px;
    max-width: 30px;
    transition: all .4s ease;
    transform: rotate(0deg)
}

@media(max-width: 63.9375em) {
    .refresh-button-wrapper .refresh-button img {
        min-width: 20px;
        max-width: 20px
    }
}

.refresh-button-wrapper .refresh-button::after {
    position: absolute;
    content: "";
    height: calc(100% - 9px);
    width: calc(100% - 8px);
    border: 2px dashed #fff;
    border-radius: inherit
}

.refresh-button-wrapper .refresh-button:hover img {
    transform: rotate(-180deg)
}

@media(max-width: 63.9375em) {
    .fButton {
        top: 35px;
    }
}

.fButton {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(270deg, #003A4B -39%, #5790A0 96.3%);
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 400;
    font-style: normal;
    color: #fff;
    border: 0;
    border-radius: 2px;
    padding: 0 1rem;
    height: 100%;
    min-height: 55px;
    max-height: 55px;
    width: 30%
}

.pdf-download-wrapper {
    position: relative;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 230px;
    max-width: 230px;
}

@media(max-width: 63.9375em) {
    .pdf-download-wrapper {
        padding: 1rem 0;
    }
}

.pdf-download-wrapper .image-wrapper {
    position: absolute;
    left: 0;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 57px;
    height: 57px;
    background-color: #5790a0;
    z-index: 1;
    transition: all .4s ease
}

.pdf-download-wrapper .image-wrapper img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    min-width: 30px;
    max-width: 30px
}

.pdf-download-wrapper .image-wrapper::after {
    position: absolute;
    content: "";
    height: calc(100% - 9px);
    width: calc(100% - 8px);
    border: 1px dashed #fff;
    border-radius: inherit
}

.pdf-download-wrapper i {
    width: 50px;
    height: 50px;
    left: 0;
    border-radius: 50%;
    display: flex;
    position: absolute;
    justify-content: center;
    align-items: center;
    font-size: 1rem;
    color: #fff;
    background-color: #5790a0;
    z-index: 1;
    transition: all .4s ease
}

.pdf-download-wrapper span {
    position: relative;
    border-radius: 25px;
    background-color: #d9e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-height: 50px;
    min-height: 50px;
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 400;
    font-style: normal;
    color: #003a4b;
    transition: all .4s ease
}

.pdf-download-wrapper span.withDBlue {
    background-color: #5790a0;
    color: #fff
}

.pdf-download-wrapper:hover i {
    background-color: #003a4b
}

.pdf-download-wrapper:hover span {
    color: #fff;
    background-color: #5790a0
}

.pdf-download-wrapper:hover span.withDBlue {
    background-color: #003a4b
}

@media(max-width: 63.9375em) {
    .mobileButtons {
        position: absolute;
        width: 100%;
        right: 0;
    }
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px
}

::-webkit-scrollbar-track {
    background: #295836
}

::-webkit-scrollbar-thumb {
    background: #295836
}

::-webkit-scrollbar-thumb:hover {
    background: #295836
}

.mobile-menu {
    position: fixed;
    transform: translateX(-150%) translateY(0);
    left: 0;
    top: 0;
    box-shadow: 0px 5px 12px rgba(0, 0, 0, .16);
    height: 100%;
    width: 100%;
    max-width: 400px;
    background-color: #ae7f4e;
    z-index: 95;
    transition: all .5s cubic-bezier(0.77, 0, 0.175, 1);
    background-image: url("../../assets/img/menu_back.jpg");
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 9999
}

.mobile-menu.show {
    transform: translateX(0%) translateY(0);
    min-width: 400px;
    max-width: 400px
}

@media(max-width: 63.9375em) {
    .mobile-menu.show {
        min-width: 100%;
        max-width: 100%
    }
}

.mobile-menu .mobile-header {
    top: 0;
    padding: 1rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

.mobile-menu .mobile-header img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 64px
}

.mobile-menu .mobile-header .menuClose {
    cursor: pointer
}

@media(max-width: 63.9375em) {
    .mobile-menu .mobile-header .menuClose {
        position: absolute;
        top: 30px;
        right: 20px
    }
}

.mobile-menu ul {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%
}

.mobile-menu ul li {
    width: 100%
}

.mobile-menu ul li .withBg {
    padding: 1rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Mada";
    font-size: 1.1875rem;
    font-size: clamp(1.125rem, 1vw, 1.1875rem);
    font-weight: 500;
    font-style: normal;
    color: #fff
}

.mobile-menu ul li .withBg i {
    color: #fff;
    font-size: 2rem;
    margin-right: .5rem
}

.mobile-menu ul li .withBg.one {
    background-color: rgba(0, 58, 75, .3)
}

.mobile-menu ul li .withBg.two {
    background-color: rgba(0, 58, 75, .7)
}

.mobile-menu .mobile-menu-wrapper {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column
}

.mobile-menu .mobile-menu-wrapper .withCircle {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 2rem 0
}

.mobile-menu .mobile-menu-wrapper .withCircle a {
    width: 3rem;
    height: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%
}

.mobile-menu .mobile-menu-wrapper .withCircle a.darkBlue {
    background-color: #002944
}

.mobile-menu .mobile-menu-wrapper .withCircle a.beBlue {
    background-color: #2d658a
}

.mobile-menu .mobile-menu-wrapper .withCircle a+a {
    margin-left: 1rem
}

.mobile-menu .mobile-menu-wrapper .menu-list {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: auto;
    padding: 2rem 2rem 1rem 2rem;
    max-height: 40vw
}

@media(max-width: 63.9375em) {
    .mobile-menu .mobile-menu-wrapper .menu-list {
        width: auto;
        max-height: 400px;
        min-height: 400px
    }
}

.mobile-menu .mobile-menu-wrapper .menu-list ul li a,
.mobile-menu .mobile-menu-wrapper .menu-list ul li span {
    cursor: pointer;
    text-align: left;
    font-family: "Mada";
    font-size: 1.375rem;
    font-size: clamp(1.125rem, 1vw, 1.375rem);
    font-style: normal;
    color: #003a4b;
    transition: all .4s ease
}

.mobile-menu .mobile-menu-wrapper .menu-list ul li a:hover,
.mobile-menu .mobile-menu-wrapper .menu-list ul li span:hover {
    color: #c38a3b
}

.mobile-menu .mobile-menu-wrapper .menu-list .withSub .nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%
}

.mobile-menu .mobile-menu-wrapper .menu-list .withSub .nav-link i {
    margin-right: .5rem
}

.mobile-menu .mobile-menu-wrapper .menu-list .withSub ul {
    display: none;
    border-top: 1px solid rgba(220, 220, 220, .5) !important;
    border-bottom: 1px solid rgba(220, 220, 220, .5) !important;
    opacity: 0;
    visibility: visible;
    background-color: #fff;
    width: 100%;
    background: rgba(0, 0, 0, 0);
    -webkit-backdrop-filter: blur(10.1372003555px);
    backdrop-filter: blur(10.1372003555px);
    --webkit-backdrop-filter: blur(10.137200355529785px);
    background-color: rgba(255, 255, 255, 0);
    border: .5px solid rgba(255, 255, 255, .15);
    transition: all .4s ease;
    transition: opacity .5s display .5s
}

.mobile-menu .mobile-menu-wrapper .menu-list .withSub ul li a {
    padding: 0 .3rem;
    margin: .5rem;
    display: block;
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: normal;
    font-style: normal;
    color: #003a4b;
    transition: all .4s ease
}

.mobile-menu .mobile-menu-wrapper .menu-list .withSub ul li a:hover {
    background-color: #c38a3b
}

.mobile-menu .mobile-menu-wrapper .menu-list .withSub.selected .nav-link::after {
    content: ""
}

.mobile-menu .mobile-menu-wrapper .menu-list .withSub.selected ul {
    display: block;
    opacity: 1;
    visibility: visible
}

.mobile-menu .mobile-menu-wrapper .menu-list-second {
    position: absolute;
    bottom: 1.5rem;
    left: 0;
    right: 0;
    padding: 2rem
}

.mobile-menu .mobile-menu-wrapper .menu-list-second .menu-inner {
    cursor: pointer;
    display: flex;
    flex: 1;
    height: 100%;
    justify-content: center;
    align-items: center;
    position: relative
}

.mobile-menu .mobile-menu-wrapper .menu-list-second .menu-inner i {
    color: #fff;
    font-size: 2rem
}

.mobile-menu .mobile-menu-wrapper .menu-list-second .menu-inner .text-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.mobile-menu .mobile-menu-wrapper .menu-list-second .menu-inner .text-wrapper span {
    position: relative;
    display: block;
    font-family: "Mada";
    font-size: 1.625rem;
    font-size: clamp(1.5rem, 2vw, 1.625rem);
    font-weight: normal;
    font-style: normal;
    color: #5790a0;
    opacity: .15;
    letter-spacing: .1em;
    line-height: 23px
}

.mobile-menu .mobile-menu-wrapper .menu-list-second ul {
    padding: 20px 0 0 0;
    display: flex;
    align-items: center
}

.mobile-menu .mobile-menu-wrapper .menu-list-second ul li {
    padding: 5px 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.mobile-menu .mobile-menu-wrapper .menu-list-second ul li:not(:last-child) {
    margin-right: 1rem
}

.mobile-menu .mobile-menu-wrapper .menu-list-second ul li a {
    width: 47px;
    height: 47px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 23.5px;
    background: #f4fcff;
    box-shadow: 0px 5px 12px rgba(0, 0, 0, .16);
    transition: all .4s ease
}

.mobile-menu .mobile-menu-wrapper .menu-list-second ul li a i {
    font-size: 1rem;
    color: #003a4b;
    transition: all .4s ease
}

.mobile-menu .mobile-menu-wrapper .menu-list-second ul li a:hover {
    background-color: #003a4b
}

.mobile-menu .mobile-menu-wrapper .menu-list-second ul li a:hover i {
    color: #fff
}

.modal .btn-close {
    position: absolute;
    top: 15px;
    right: 15px;
    background: none;
    z-index: 9
}

.modal .btn-close:before {
    content: "";
    font-family: icomoon;
    font-size: 1rem;
    color: #003a4b;
    position: relative
}

.modal .btn-close:focus {
    box-shadow: none
}

.modal .modal-header {
    justify-content: center;
    border: 0;
    padding: 0
}

.modal .modal-content.darkBlue {
    background-color: #fff
}

.modal .modal-body .modal-title h3 {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 700;
    font-style: normal;
    color: #b5b5b5
}

.modal .modal-body .modal-title h4 {
    font-family: "Mada";
    font-size: 1.75rem;
    font-size: clamp(1.5rem, 2vw, 1.75rem);
    font-weight: 700;
    font-style: normal;
    color: #003a4b
}

.modal .modal-body .desc {
    padding: 2rem 0
}

.modal .modal-body .desc p {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #000
}

.modal .modal-body .desc ul {
    padding: 1rem
}

.modal .modal-body .desc ul li {
    list-style: decimal;
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #000
}

.modal .modal-body .desc ul li p {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #000
}

.modal .modal-body.modal-with-scroll {
    height: 100%;
    max-height: 500px;
    min-height: 500px;
    overflow-y: scroll;
    width: 100%
}

.toast-title {
    font-weight: bold;
    margin-left: .75rem;
    color: #5d596c;
    margin-bottom: .25rem
}

.toast-message {
    -ms-word-wrap: break-word;
    word-wrap: break-word;
    margin-left: .75rem !important;
    margin-right: .75rem !important;
    font-family: "Mada";
    font-size: 1rem;
    font-size: clamp(1rem, 1vw, 1rem);
    font-style: normal;
    color: #fff
}

.toast-message a {
    color: #fff;
    color: #7367f0
}

.toast-message a:hover {
    color: #ccc;
    text-decoration: none;
    color: rgba(115, 103, 240, .6)
}

.toast-message label {
    color: #fff
}

.toast-close-button {
    position: relative;
    right: -0.3em;
    top: -0.3em;
    float: right;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    -webkit-text-shadow: 0 1px 0 #fff;
    text-shadow: 0 1px 0 #fff;
    opacity: .8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80);
    position: absolute;
    right: 1.25rem !important;
    top: .5rem;
    text-shadow: none;
    color: #a5a3ae !important;
    padding: auto;
    font-size: 1.625rem
}

.toast-close-button:hover {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: .4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40)
}

.toast-close-button:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: .4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40)
}

button.toast-close-button {
    padding: 0;
    cursor: pointer;
    background: rgba(0, 0, 0, 0);
    border: 0;
    -webkit-appearance: none;
    color: #fff !important
}

.toast-top-center {
    top: 0;
    right: 0;
    width: 100%
}

.toast-bottom-center {
    bottom: 0;
    right: 0;
    width: 100%
}

.toast-top-full-width {
    top: 0;
    right: 0;
    width: 100%
}

.toast-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%
}

.toast-top-left {
    top: 12px;
    left: 12px
}

.toast-top-right {
    top: 12px;
    right: 12px
}

.toast-bottom-right {
    right: 10px;
    bottom: 12px
}

.toast-bottom-left {
    bottom: 12px;
    left: 12px
}

#toast-mContainer {
    position: fixed;
    z-index: 999999
}

#toast-mContainer * {
    box-sizing: border-box
}

#toast-mContainer>div {
    position: relative;
    overflow: hidden;
    margin: 0 0 6px;
    padding: 15px 15px 15px 50px;
    width: 300px;
    border-radius: 3px 3px 3px 3px;
    background-position: 15px center;
    background-repeat: no-repeat;
    color: #fff;
    opacity: .8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80);
    padding: 20px 30px 20px 50px !important;
    opacity: 1;
    box-shadow: rgba(0, 0, 0, .16)
}

#toast-mContainer>div:hover {
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    filter: alpha(opacity=100);
    cursor: pointer
}

#toast-mContainer>.toast-info::before {
    content: "";
    font-family: icomoon;
    position: absolute;
    display: inline-flex;
    left: 20px;
    align-items: center;
    color: #fff;
    font-size: 1rem
}

#toast-mContainer>.toast-error::before {
    content: "";
    font-family: icomoon;
    position: absolute;
    display: inline-flex;
    left: 20px;
    align-items: center;
    color: #fff;
    font-size: 1rem
}

#toast-mContainer>.toast-success::before {
    content: "";
    font-family: icomoon;
    position: absolute;
    display: inline-flex;
    left: 20px;
    align-items: center;
    color: #fff;
    font-size: 1rem
}

#toast-mContainer>.toast-warning::before {
    content: "";
    font-family: icomoon;
    position: absolute;
    display: inline-flex;
    left: 20px;
    align-items: center;
    color: #fff;
    font-size: 1rem
}

#toast-mContainer>.toast {
    max-width: 100%;
    background-size: 28px;
    background-repeat: no-repeat
}

#toast-mContainer.toast-top-center>div {
    width: 300px;
    margin-left: auto;
    margin-right: auto
}

#toast-mContainer.toast-bottom-center>div {
    width: 300px;
    margin-left: auto;
    margin-right: auto
}

#toast-mContainer.toast-top-full-width>div {
    width: 96%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    margin-bottom: 0;
    border-radius: 0 !important
}

#toast-mContainer.toast-bottom-full-width>div {
    width: 96%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    margin-bottom: 0;
    border-radius: 0 !important
}

.toast {
    background-color: #030303
}

.toast-success {
    background-color: #8bb107
}

.toast-error {
    background-color: #ce2e47
}

.toast-info {
    background-color: #0492bc
}

.toast-warning {
    background-color: #d58619
}

.toast-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    background-color: #000;
    opacity: .4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40);
    position: absolute;
    bottom: auto;
    top: 0;
    opacity: .15;
    height: .1875rem;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=15);
    filter: alpha(opacity=15)
}

[dir=rtl] .toast-title {
    margin-right: .75rem
}

[dir=rtl] #toast-mContainer>div {
    direction: rtl;
    background-position: top .9rem right 1.25rem;
    padding: 20px 50px 20px 30px !important
}

[dir=rtl] #toast-mContainer.toast-top-left {
    right: 12px;
    left: auto
}

[dir=rtl] #toast-mContainer.toast-top-right {
    left: 12px;
    right: auto
}

[dir=rtl] #toast-mContainer.toast-bottom-left {
    right: 12px;
    left: auto
}

[dir=rtl] #toast-mContainer.toast-bottom-right {
    left: 12px;
    right: auto
}

[dir=rtl] #toast-mContainer.toast-top-full-width#toast-mContainer>div {
    left: 0;
    right: 0
}

[dir=rtl] #toast-mContainer.toast-bottom-full-width#toast-mContainer>div {
    left: 0;
    right: 0
}

[dir=rtl] .toast-progress {
    left: auto;
    right: 0
}

[dir=rtl] .toast-close-button {
    left: 1.25rem !important;
    right: auto !important
}

.toast-top-full-width>div {
    width: 22em !important
}

.light-style #toast-mContainer {
    z-index: 999999
}

.light-style #toast-mContainer .toast-close-button {
    font-weight: 300
}

.light-style #toast-mContainer>div {
    border-radius: .375rem
}

.light-style #toast-mContainer>.toast-success {
    color: #5d596c;
    background-color: #fff
}

.light-style #toast-mContainer .toast-error {
    color: #5d596c;
    background-color: #fff
}

.light-style #toast-mContainer .toast-info {
    color: #5d596c;
    background-color: #fff
}

.light-style #toast-mContainer .toast-warning {
    color: #5d596c;
    background-color: #fff
}

.dark-style #toast-mContainer {
    z-index: 999999
}

.dark-style #toast-mContainer .toast-close-button {
    font-weight: 300;
    color: #7983bb !important
}

.dark-style #toast-mContainer .toast-title {
    color: #cfd3ec
}

.dark-style #toast-mContainer>div {
    border-radius: .375rem
}

.dark-style #toast-mContainer .toast-progress {
    background-color: #fff
}

.dark-style #toast-mContainer>.toast-success {
    color: #cfd3ec;
    background-color: #2f3349
}

.dark-style #toast-mContainer .toast-error {
    color: #cfd3ec;
    background-color: #2f3349
}

.dark-style #toast-mContainer .toast-info {
    color: #cfd3ec;
    background-color: #2f3349
}

.dark-style #toast-mContainer .toast-warning {
    color: #cfd3ec;
    background-color: #2f3349
}

@media all and (max-width: 240px) {
    #toast-mContainer>div {
        padding: 8px 8px 8px 50px;
        width: 11em
    }

    #toast-mContainer .toast-close-button {
        right: -0.2em;
        top: -0.2em
    }
}

@media all and (min-width: 241px)and (max-width: 480px) {
    #toast-mContainer>div {
        padding: 8px 8px 8px 50px;
        width: 18em
    }

    #toast-mContainer .toast-close-button {
        right: -0.2em;
        top: -0.2em
    }
}

@media all and (min-width: 481px)and (max-width: 768px) {
    #toast-mContainer>div {
        padding: 15px 15px 15px 50px;
        width: 25em
    }
}

@media(min-width: 241px)and (max-width: 480px) {
    #toast-mContainer .toast-close-button {
        top: .3em
    }
}

.product-area {
    position: relative;
    margin: 2rem 0
}

@media(max-width: 39.9375em) {
    .product-area {
        margin: 0 0 2rem;
        min-height: calc(var(--vh, 1vh)*100);
    }
}

.product-area .panel-header-wrapper {
    display: none
}

@media (max-width: 63.9375em) {
    .product-area .panel.showing {
        position: fixed;
        bottom: 0;
        background-color: #fff;
        z-index: 3;
        padding: 0;
        transform: translate(0, 80%);
        transition: all .4s ease;
    }

    .product-area .panel.showing.up {
        transform: translate(0, 20%);
    }
}

.product-area .panel.showing .panel-header-wrapper {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center
}

.product-area .panel.showing .panel-header-wrapper .header-wrapper {
    font-family: "Mada";
    font-size: 1.375rem;
    font-size: clamp(1.375rem, 1vw, 1.375rem);
    font-weight: bold;
    font-style: normal;
    color: #003a4b;
    width: 100%;
    padding-left: 1rem
}

.product-area .panel.showing .panel-header-wrapper i {
    width: 40px;
    height: 40px;
    padding: 2rem;
    background-color: #c38a3b;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .8rem;
    color: #fff
}

.product-area .panel.showing .product-area-inner-wrapper {
    padding-bottom: 10rem;
    overflow-y: auto;
}

.product-area-wrapper {
    position: relative;
    background-color: #fff;
    border-radius: 16px
}

.product-area-wrapper .product-warning-wrapper {
    position: relative;
    padding: 3rem 0 0
}

.product-area-wrapper .product-warning-wrapper p {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 400;
    font-style: normal;
    color: #000
}

.product-area-wrapper .product-warning-wrapper p button {
    all: unset;
    cursor: pointer;
    text-decoration: underline !important;
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 400;
    font-style: normal;
    color: #c38a3b
}

.product-area-wrapper .product-image-wrapper {
    background-color: #fff;
    background-image: url("./img/logo/logo-light.svg");
    background-repeat: no-repeat;
    background-position: 50% 0%;
    background-size: contain
}

.product-area-wrapper .product-image-wrapper .image-wrapper img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: contain;
    object-fit: contain;
    min-height: 500px;
    max-height: 500px
}

.product-area-wrapper .product-area-inner-wrapper {
    position: relative;
    padding: 0 1rem 1rem;
    width: 100%;
    overflow-x: auto;
    min-height: 500px;
    max-height: 700px
}

@media(max-width: 63.9375em) {
    .product-area-wrapper .product-area-inner-wrapper {
        max-height: 500px;
        min-height: 500px;
        padding-top: 1rem
    }
}

.product-area-wrapper .product-area-inner-wrapper .fix-title {
    margin-top: -150px
}

@media(max-width: 63.9375em) {
    .product-area-wrapper .product-area-inner-wrapper .fix-title {
        margin-top: -130px
    }
}

.product-area-wrapper .nav {
    width: 100%;
    all: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    border-bottom: 1px dotted rgba(58, 119, 136, .3);
    overflow: hidden;
    overflow-x: auto
}

@media(max-width: 63.9375em) {
    .product-area-wrapper .nav {
        overflow-x: auto;
        overflow-y: hidden;
        position: relative;
        white-space: nowrap
    }
}

.product-area-wrapper .nav .nav-item {
    background-color: #fff;
    width: 100%;
    display: flex;
    align-items: center
}

.product-area-wrapper .nav .nav-item:not(:last-child) button {
    border-right: 1px dotted rgba(58, 119, 136, .3)
}

.product-area-wrapper .nav .nav-item button {
    all: unset;
    cursor: pointer;
    padding: 1rem .5rem;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transition: all .4s ease;
    font-family: "Mada";
    font-size: 1.25rem;
    font-size: clamp(1.125rem, 2vw, 0.95rem);
    font-weight: normal;
    font-style: normal;
    color: #5790a0
}

.product-area-wrapper .nav .nav-item button img {
    margin-bottom: 1rem;
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: contain;
    object-fit: contain;
    max-height: 45px;
    min-height: 45px;
    transition: all .4s ease
}

@media(max-width: 63.9375em) {
    .product-area-wrapper .nav .nav-item button img {
        display: none
    }
}

.product-area-wrapper .nav .nav-item button.active {
    background-color: #295836;
    color: #fff;
    text-align: center;
}

.product-area-wrapper .nav .nav-item button.active img {
    -moz-filter: invert(97%) sepia(78%) saturate(9%) hue-rotate(122deg) brightness(272%) contrast(104%);
    -ms-filter: invert(97%) sepia(78%) saturate(9%) hue-rotate(122deg) brightness(272%) contrast(104%);
    filter: invert(97%) sepia(78%) saturate(9%) hue-rotate(122deg) brightness(272%) contrast(104%);
    transform: translate3d(0, 0, 0)
}

.product-area-wrapper .nav .nav-item button:hover {
    background-color: #295836;
    color: #fff
}

.product-area-wrapper .nav .nav-item button:hover img {
    -moz-filter: invert(97%) sepia(78%) saturate(9%) hue-rotate(122deg) brightness(272%) contrast(104%);
    -ms-filter: invert(97%) sepia(78%) saturate(9%) hue-rotate(122deg) brightness(272%) contrast(104%);
    filter: invert(97%) sepia(78%) saturate(9%) hue-rotate(122deg) brightness(272%) contrast(104%);
    transform: translate3d(0, 0, 0)
}

@media(max-width: 63.9375em) {
    .product-area-wrapper .nav .nav-item button {
        flex-direction: row
    }

    .product-area-wrapper .nav .nav-item button img {
        margin-right: 1rem
    }
}

@media(max-width: 63.9375em) {
    .product-area-wrapper .nav .nav-item {
        width: 100%
    }
}

.product-area-wrapper .nav.mini-nav {
    width: auto;
    justify-content: start;
    border: none;
    padding: 1rem 0
}

.product-area-wrapper .nav.mini-nav .nav-item {
    width: auto;
    position: relative
}

.product-area-wrapper .nav.mini-nav .nav-item:not(:last-child) {
    all: unset
}

.product-area-wrapper .nav.mini-nav .nav-item:not(:last-child) button::after {
    content: "";
    position: relative;
    display: inline-flex;
    align-items: center;
    border-right: 1px solid #5790a0;
    height: 20px;
    margin: 0 1rem
}

.product-area-wrapper .nav.mini-nav .nav-item button {
    all: unset;
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
    font-family: "Mada";
    font-size: 1.25rem;
    font-size: clamp(1.125rem, 2vw, 1.25rem);
    font-weight: 700;
    font-style: normal;
    color: #c3c3c3;
    transition: all .4s ease
}

.product-area-wrapper .nav.mini-nav .nav-item button.active,
.product-area-wrapper .nav.mini-nav .nav-item button:hover {
    color: #5790a0
}

.product-area-wrapper .tab-content {
    position: relative
}

.tab-content .tab-pane .tab-pane-wrapper {
    background-color: #fff;
    background-image: url("./img/logo/logo-light.svg");
    background-repeat: no-repeat;
    background-position: center center
}

.tab-content .tab-pane .card-wrapper-outer-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.tab-content .tab-pane .card-wrapper-outer-wrapper .card-inner-wrapper {
    cursor: pointer;
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: normal;
    font-style: normal;
    color: #000;
    text-align: center;
    padding: 1rem 0 0 0;
    transition: all .4s ease
}

.tab-content .tab-pane .card-wrapper-outer-wrapper .card-inner-wrapper .card-wrapper {
    position: relative;
    border: 2px solid rgba(58, 119, 136, .3);
    border-radius: 5px;
    overflow: hidden;
    transition: all .4s ease
}

.tab-content .tab-pane .card-wrapper-outer-wrapper .card-inner-wrapper .card-wrapper img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover
}

.tab-content .tab-pane .card-wrapper-outer-wrapper .card-inner-wrapper p {
    margin-top: .5rem
}

.tab-content .tab-pane .card-wrapper-outer-wrapper .card-inner-wrapper:hover,
.tab-content .tab-pane .card-wrapper-outer-wrapper .card-inner-wrapper.selected {
    color: #5790a0
}

.tab-content .tab-pane .card-wrapper-outer-wrapper .card-inner-wrapper:hover .card-wrapper,
.tab-content .tab-pane .card-wrapper-outer-wrapper .card-inner-wrapper.selected .card-wrapper {
    border: 2px solid #5790a0
}

.tab-content .tab-pane .top-module-wrapper {
    position: relative
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper {
    all: unset;
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item {
    all: unset;
    display: flex;
    cursor: pointer
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button {
    all: unset;
    display: flex;
    align-items: center;
    background-color: #fff;
    padding: 1rem;
    margin-right: 1rem;
    border-radius: 10px;
    border: 1px solid #f7f7f7;
    position: relative
}

@media(max-width: 63.9375em) {
    .tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button {
        padding: .4rem
    }
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: contain;
    object-fit: contain;
    max-height: 30px;
    min-height: 30px;
    margin: 0
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button:hover {
    border: 1px solid #b07a2f;
    border-radius: 10px
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button:hover img {
    filter: unset
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button.active {
    border: 1px solid #b07a2f;
    border-radius: 10px
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button.active img {
    filter: unset
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button.active::after {
    cursor: pointer;
    content: "";
    font-family: icomoon;
    color: #fff;
    font-size: .5rem;
    position: absolute;
    top: -10px;
    right: -10px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #b07a2f;
    display: flex;
    justify-content: center;
    align-items: center
}

.tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper.withBkWhite .nav-item button span {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #003a4b;
    display: block;
    white-space: nowrap;
    margin-left: 1rem
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper.withBkWhite li {
    background-color: #fff;
    padding: 1rem;
    margin-right: 1rem
}

@media(max-width: 63.9375em) {
    .tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper.withBkWhite li {
        padding: .4rem
    }
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper.withBkWhite li span {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #003a4b
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper.subList li {
    margin: .3rem 1rem .3rem 0;
    padding: 0
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper.subList li::before {
    display: none
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li {
    position: relative;
    display: flex;
    align-items: center;
    background-color: #f7f7f7;
    border-radius: 10px;
    border: 1px solid #f7f7f7;
    cursor: pointer;
    transition: all .4s ease
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.keep-color-outer-wrapper {
    all: unset;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: start;
    border: 0;
    border-radius: 0
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.keep-color-outer-wrapper:not(:last-child) {
    margin-right: 1rem
}

@media(max-width: 39.9375em) {
    .tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.keep-color-outer-wrapper:not(:last-child) {
        margin-right: .4rem;
        margin-bottom: .6rem
    }
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.keep-color-outer-wrapper::after {
    display: none !important
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.keep-color-outer-wrapper:hover,
.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.keep-color-outer-wrapper.active {
    border: 0
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.keep-color-outer-wrapper:hover .keep-color-wrapper,
.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.keep-color-outer-wrapper.active .keep-color-wrapper {
    border-color: #5790a0
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li .keep-color-wrapper {
    position: relative;
    border: 1px solid rgba(58, 119, 136, .3);
    border-radius: 10px;
    width: 100%;
    height: 100%;
    min-width: 170px;
    max-width: 170px;
    min-height: 170px;
    max-height: 170px
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li .keep-color-wrapper.no-color::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url("./img/icons/engel.png");
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li:hover {
    border: 1px solid #b07a2f
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.active {
    border: 1px solid #b07a2f
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li.selector.active::after {
    cursor: pointer;
    content: "";
    font-family: icomoon;
    color: #fff;
    font-size: .5rem;
    position: absolute;
    top: -10px;
    right: -10px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #b07a2f;
    display: flex;
    justify-content: center;
    align-items: center
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    max-width: 30px;
    min-width: 30px
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li span {
    padding: 0 .5rem 0 0;
    white-space: nowrap;
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li .image-list {
    display: flex;
    align-items: center;
    padding: .5rem
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li .image-list li {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    overflow: hidden;
    width: 100%;
    height: 100%;
    min-width: 37px;
    max-width: 37px;
    min-height: 37px;
    max-height: 37px;
    margin-right: .5rem
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li .image-list li:not(:first-child) {
    margin-left: -1.5rem
}

.tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper li .image-list li img {
    width: 100%;
    height: auto;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 50%;
    max-width: 37px;
    min-width: 37px;
    min-height: 37px;
    max-height: 37px
}

.tab-content .tab-pane .moduller-inner-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.tab-content .tab-pane .moduller-inner-wrapper li {
    position: relative;
    background-color: #d9e7eb;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5rem 1rem;
    border-radius: 10px;
    transition: all .4s ease;
    margin: .3rem
}

.tab-content .tab-pane .moduller-inner-wrapper li span {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #003a4b;
    transition: all .4s ease
}

.tab-content .tab-pane .moduller-inner-wrapper li.active:before {
    content: "";
    font-family: icomoon;
    font-size: 1rem;
    color: #fff;
    position: relative;
    margin: 0 .5rem 0 0;
    border-radius: 10px;
    background-color: #295836;
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center
}

.tab-content .tab-pane .moduller-inner-wrapper li.active,
.tab-content .tab-pane .moduller-inner-wrapper li:hover {
    background-color: #295836
}

.tab-content .tab-pane .moduller-inner-wrapper li.active span,
.tab-content .tab-pane .moduller-inner-wrapper li:hover span {
    color: #fff
}

.title {
    padding: 2rem 0 0
}

@media(max-width: 63.9375em) {
    .title {
        padding: 0
    }
}

.title h2,
.title h3,
.title h4,
.title h5,
.title h6,
.title p,
.title span {
    font-family: "Mada";
    font-size: 1.25rem;
    font-size: clamp(1.125rem, 2vw, 1.25rem);
    font-weight: 700;
    font-style: normal;
    color: #5790a0
}

.title.withBorder {
    border-bottom: 1px solid rgba(58, 119, 136, .3)
}

.tasarim-2d-form-outer-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap
}

.tasarim-2d-form-outer-wrapper .tasarim-2d-form-inner-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    flex: 2
}

.info-content-title {
    position: relative;
    padding: 1rem 0 0;
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: bold;
    font-style: normal;
    color: #002944
}

.info-2d-desc-outer {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 1rem 0 0
}

.info-2d-desc-outer .info-desc-wrapper {
    display: flex;
    align-items: center
}

.info-2d-desc-outer .info-desc-wrapper:not(.info-2d-desc-outer .info-desc-wrapper:last-child) {
    margin-right: 1rem
}

.info-2d-desc-outer .info-desc-wrapper span {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #000
}

.info-2d-desc-outer .info-desc-wrapper p {
    font-family: "Mada";
    font-size: 1.125rem;
    font-size: clamp(1.125rem, 1vw, 1.125rem);
    font-weight: 500;
    font-style: normal;
    color: #5790a0;
    margin-left: .3rem
}

#loading-img {
    position: absolute;
    width: 100%;
    height: 100%
}

@media(max-width: 1199.98px) {
    .np-for-mobile {
        padding: 0
    }

    .nm-for-mobile {
        margin: 0
    }

    .navbar-toggle {
        z-index: 99999;
        border: none;
        background: rgba(0, 0, 0, 0) !important
    }

    .navbar-toggle .menu-bar {
        width: 30px;
        height: 2px;
        background: #fff;
        transition: all .3s ease
    }

    .navbar-toggle .top-bar {
        margin-bottom: 6px;
        transform: rotate(45deg);
        transform-origin: 14% 10%
    }

    .navbar-toggle .middle-bar {
        opacity: 0
    }

    .navbar-toggle .bottom-bar {
        margin-top: 6px;
        transform: rotate(-45deg);
        transform-origin: 10% 90%
    }

    .navbar-toggle.collapsed .top-bar {
        transform: rotate(0)
    }

    .navbar-toggle.collapsed .middle-bar {
        opacity: 1
    }

    .navbar-toggle.collapsed .bottom-bar {
        transform: rotate(0)
    }

    #mainMenu .nav-item a.home-button::after {
        display: none
    }

    .navbar-collapse.collapse.show .navbar-nav {
        opacity: 1
    }
}

@media only screen and (min-width: 63em)and (max-height: 49.9375em) {
    #enterSite {
        position: fixed;
        bottom: 0
    }
}

@media only screen and (max-width: 64em)and (max-height: 48em) {
    .general #mainMenu .nav-item a .norm {
        font-size: 1.4rem
    }
}

@media only screen and (max-width: 70.5625em)and (max-height: 85.475em) {
    .general #mainMenu .nav-item a .norm {
        font-size: 1.4rem
    }

    #gelecek .tabs {
        height: calc(40vh - 15px)
    }
}

@media(max-width: 63.9375em) {
    .general #mainMenu .nav-item:not(.withSub) a {
        width: 20px;
        height: 20px;
        justify-content: center
    }

    #gelecek .tabs {
        height: auto
    }
}

@media(max-width: 39.9375em) {
    .general #mainMenu .nav-item:not(.withSub) a {
        width: 20px;
        height: 10px;
        justify-content: center
    }

    .minitable .minitable-wrapper .image-outer-wrapper {
        flex-direction: column
    }

    .tab {
        margin-top: 20px
    }

    .tabs {
        overflow-x: auto !important;
        overflow-y: hidden;
        white-space: nowrap;
        flex-wrap: inherit;
        display: -webkit-box
    }

    .tabs li {
        display: inline-flex
    }
}

@media(max-width: 20em) {
    .general #mainMenu .navbar-brand img {
        max-width: 180px
    }
}

@media(max-width: 63.9375em) {
    .tasarim-2d-form-outer-wrapper {
        flex-direction: column;
    }

    .tab-content .tab-pane .top-module-wrapper .top-module-inner-wrapper {
        flex-wrap: nowrap;
        overflow-y: auto;
        padding: .5rem;
    }

    .tab-content .tab-pane .moduller-inner-wrapper {
        flex-wrap: nowrap;
        overflow-y: auto;
    }

    .tab-content .tab-pane .top-module-wrapper .top-sub-inner-wrapper {
        overflow-y: auto;
    }
}

a:hover {
    color: white !important
}

/*# sourceMappingURL=theme.min.css.map */