:root {
    /* Font Family */
    --ffP: "Calling Code";
    --ffS: "Futura-PT";
    /* Font Weight */
    --fWD: 400;
    /* Font Size */
    --fzH1: 30px;
    --fzH2: 28px;
    --fzA1: 15px;
    --fzA2: 14px;
    --fzT1: 12px;
    --fzT2: 16px;
    --fzT3: 15px;
    /* Letter Specing */
    --lspMinue: -2px;
    /* Line Height */
    --lHheading: calc(125 / 130);
    --lHNormal: calc(95 / 90);
    --lHDefault: calc(50 / 34);
    /* Color List */
    --cP:#184177;
    --cS:;
    --cWhite: #fff;
    --cBlack: #000;
    /* Backgroud Color */
    --bgP: #fff;
    --bgS: #f6f6f6;
    /* Text Color */
    --tP: #000;
    --tS: #184177;
    --tSP: #272727;
    /* button color */
    --btnP: #184177;
    --btnS: #fff;
    /* Border Color */
    --bdP: 1px solid rgba(0, 0, 0, .12);
    /* Box Shadow */
}

@font-face {
    font-family: "MuseoSansCyrl";
    src: url("../fonts/MuseoSansCyrl-500.ttf");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "MuseoSansCyrl";
    src: url("../fonts/MuseoSansCyrl-700.ttf");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "MuseoSansCyrl";
    src: url("../fonts/MuseoSansCyrl-900.ttf");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: "Charter-Bold";
    src: url("../fonts/charter-bold.ttf");
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: "Charter";
    src: url("../fonts/Charter.ttc");
}

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


/* scree overlay */

[class*="screen"].open {
    background-color: rgba(0, 0, 0, 1);
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 9999;
    transition: .3s;
}


/* Cusotm Grid Stytem By Liakut Ali Khan */

[class*="container"] {
    --gutterX: 16px;
}

[class~="container"] {
    margin: auto;
    max-width: 100%;
    padding: 0 var(--gutterX);
}

[class*="container-"] {
    margin: auto;
    max-width: 100%;
    padding: 0 var(--gutterX);
}

[class*="container_"] {
    margin: auto;
    max-width: 100%;
    padding: 0 var(--gutterX);
}


/* Wrapper */

[class*="wrapper"] {
    --gutterX: 25px;
}

[class~="wrapper"] {
    margin: auto;
    max-width: 100%;
    padding: 0 var(--gutterX);
}

[class*="wrapper-"] {
    margin: auto;
    max-width: 100%;
    padding: 0 var(--gutterX);
}

[class*="wrapper_"] {
    margin: auto;
    max-width: 100%;
    padding: 0 var(--gutterX);
}

[class*="-wrapper"],
[class*="_wrapper"],
[class*="-container"],
[class*="_container"] {
    --gutterX: 0;
}

/* Row / Group  gap, column setting*/

[class*="row"],
[class*="group"] {
    --gap: 0px;
    --gapX: var(--gap);
    --gapY: var(--gap);
    --col: 1;
}


/* Group */

[class~="group"] {
    display: flex;
    flex-wrap: wrap;
    margin: 0 calc(var(--gapX) / -2);
}

[class*="-group"] {
    display: flex;
    flex-wrap: wrap;
    margin: 0 calc(var(--gapX) / -2);
}

[class*="_group"] {
    display: flex;
    flex-wrap: wrap;
    margin: 0 calc(var(--gapX) / -2);
}


/* Row */

[class~="row"] {
    display: flex;
    flex-wrap: wrap;
    margin: 0 calc(var(--gapX) / -2);
}

[class*="-row"] {
    display: flex;
    flex-wrap: wrap;
    margin: 0 calc(var(--gapX) / -2);
}

[class*="_row"] {
    display: flex;
    flex-wrap: wrap;
    margin: 0 calc(var(--gapX) / -2);
}


/* Row / Group margin top setting*/

[class*="row"],
[class*="group"] {
    margin-top: calc(var(--gapY) * -1);
}


/* Group box / item / content / list */

[class*="group"]>[class*="box-"],
[class*="group"]>[class*="box_"],
[class*="group"]>[class*="-box"],
[class*="group"]>[class*="_box"] {
    --width: calc(100% / var(--col));
    --multiply: 1;
    width: calc((var(--width) * var(--multiply)) - var(--gapX));
    margin: 0 calc(var(--gapX) / 2);
    margin-top: var(--gapY);
}

[class*="group"]>[class*="item-"],
[class*="group"]>[class*="item_"],
[class*="group"]>[class*="-item"],
[class*="group"]>[class*="_item"] {
    --width: calc(100% / var(--col));
    --multiply: 1;
    width: calc((var(--width) * var(--multiply)) - var(--gapX));
    margin: 0 calc(var(--gapX) / 2);
    margin-top: var(--gapY);
}

[class*="group"]>[class*="list-"],
[class*="group"]>[class*="list_"],
[class*="group"]>[class*="-list"],
[class*="group"]>[class*="_list"] {
    --width: calc(100% / var(--col));
    --multiply: 1;
    width: calc((var(--width) * var(--multiply)) - var(--gapX));
    margin: 0 calc(var(--gapX) / 2);
    margin-top: var(--gapY);
}

[class*="group"]>[class*="content-"],
[class*="group"]>[class*="content_"],
[class*="group"]>[class*="-content"],
[class*="group"]>[class*="_content"] {
    --width: calc(100% / var(--col));
    --multiply: 1;
    width: calc((var(--width) * var(--multiply)) - var(--gapX));
    margin: 0 calc(var(--gapX) / 2);
    margin-top: var(--gapY);
}


/* Row box / item / content / list */

[class*="row"]>[class*="box-"],
[class*="row"]>[class*="box_"],
[class*="row"]>[class*="-box"],
[class*="row"]>[class*="_box"] {
    --width: calc(100% / var(--col));
    --multiply: 1;
    width: calc((var(--width) * var(--multiply)) - var(--gapX));
    margin: 0 calc(var(--gapX) / 2);
    margin-top: var(--gapY);
}

[class*="row"]>[class*="item-"],
[class*="row"]>[class*="item_"],
[class*="row"]>[class*="-item"],
[class*="row"]>[class*="_item"] {
    --width: calc(100% / var(--col));
    --multiply: 1;
    width: calc((var(--width) * var(--multiply)) - var(--gapX));
    margin: 0 calc(var(--gapX) / 2);
    margin-top: var(--gapY);
}

[class*="row"]>[class*="list-"],
[class*="row"]>[class*="list_"],
[class*="row"]>[class*="-list"],
[class*="row"]>[class*="_list"] {
    --width: calc(100% / var(--col));
    --multiply: 1;
    width: calc((var(--width) * var(--multiply)) - var(--gapX));
    margin: 0 calc(var(--gapX) / 2);
    margin-top: var(--gapY);
}

[class*="row"]>[class*="content-"],
[class*="row"]>[class*="content_"],
[class*="row"]>[class*="-content"],
[class*="row"]>[class*="_content"] {
    --width: calc(100% / var(--col));
    --multiply: 1;
    width: calc((var(--width) * var(--multiply)) - var(--gapX));
    margin: 0 calc(var(--gapX) / 2);
    margin-top: var(--gapY);
}


/* Custom Grid Responsive */

@media (min-width: 576px) {
    [class~="container"] {
        max-width: 540px;
    }
    [class*="container-"] {
        max-width: 540px;
    }
    [class*="container_"] {
        max-width: 540px;
    }
    [class~="wrapper"] {
        max-width: 540px;
    }
    [class*="wrapper-"] {
        max-width: 540px;
    }
    [class*="wrapper_"] {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    [class~="container"] {
        max-width: 720px;
    }
    [class*="container-"] {
        max-width: 720px;
    }
    [class*="container_"] {
        max-width: 720px;
    }
    [class~="wrapper"] {
        max-width: 720px;
    }
    [class*="wrapper-"] {
        max-width: 720px;
    }
    [class*="wrapper_"] {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    [class~="container"] {
        max-width: 960px;
    }
    [class*="container-"] {
        max-width: 960px;
    }
    [class*="container_"] {
        max-width: 960px;
    }
    [class~="wrapper"] {
        max-width: 960px;
    }
    [class*="wrapper-"] {
        max-width: 960px;
    }
    [class*="wrapper_"] {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    [class~="container"] {
        max-width: 1140px;
    }
    [class*="container-"] {
        max-width: 1140px;
    }
    [class*="container_"] {
        max-width: 1140px;
    }
    [class~="wrapper"] {
        max-width: 1140px;
    }
    [class*="wrapper-"] {
        max-width: 1140px;
    }
    [class*="wrapper_"] {
        max-width: 1140px;
    }
}

@media (min-width: 1400px) {
    [class~="container"] {
        max-width: 1320px;
    }
    [class*="container-"] {
        max-width: 1320px;
    }
    [class*="container_"] {
        max-width: 1320px;
    }
    [class~="wrapper"] {
        max-width: 1320px;
    }
    [class*="wrapper-"] {
        max-width: 1320px;
    }
    [class*="wrapper_"] {
        max-width: 1320px;
    }
}

[class*="-wrapper"],
[class*="_wrapper"],
[class*="-container"],
[class*="_container"] {
    max-width: 100%;
}

[class*="-full"],
[class*="_full"],
[class*="full-"],
[class*="full_"] {
    max-width: 100%;
}


/* Content Allignment */

[class*="centerA"] {
    justify-content: center;
    align-items: center;
}

[class*="Xcenter"] {
    justify-content: center;
}

[class*="Ycenter"] {
    align-items: center;
}

[class*="group"]>[class*="centerA"],
[class*="group"]>[class*="Xcenter"],
[class*="group"]>[class*="Ycenter"] {
    display: flex;
}

[class*="row"]>[class*="centerA"],
[class*="row"]>[class*="Xcenter"],
[class*="row"]>[class*="Ycenter"] {
    display: flex;
}

[class*="textA"] {
    text-align: center;
}

[class*="textR"] {
    text-align: right;
}

[class*="textL"] {
    text-align: left;
}

[class*="right"] {
    justify-content: flex-end;
}

[class*="gap"] {
    justify-content: space-between;
}

[class*="flex"] {
    display: flex;
}


/* Image or object Fit To Screen Div */

[class*="sketch"],
[class*="-sketch"],
[class*="_sketch"],
[class*="sketch-"],
[class*="sketch_"],
[class*="canvas"],
[class*="-canvas"],
[class*="_canvas"],
[class*="canvas-"],
[class*="canvas_"] {
    --fit: 100;
    padding-top: calc(var(--fit) * 1%);
}

[class*="obj-"]::before,
[class*="obj_"]::before,
[class*="-obj"]::before,
[class*="_obj"]::before {
    content: " ";
    position: absolute;
    width: 100%;
    height: 0;
    --fit: 100;
    padding-top: calc(var(--fit) * 1%);
    display: block;
    background-color: #ededed;
}

[class*="fit"] {
    position: relative;
}

[class*="fit"] video,
[class*="fit"] img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-position: center center;
    -o-object-fit: cover;
    object-fit: cover;
}

[class*="fit"] *:not(video),
[class*="fit"] *:not(img) {
    z-index: 2;
}


/* Ancor Button And Input Controll */

[class*="btn"] {
    border: 0;
    outline: 0;
    line-height: 1;
    padding: 10px 15px;
    color: var(--textPrimary);
}

a[class*="btn"] {
    text-decoration: none;
    cursor: pointer;
    background-color: #ededed;
}

button[class*="btn"] {
    cursor: pointer;
    background-color: #ededed;
}

input[class*="btn"] {
    border: 1px solid #ededed;
    background-color: transparent;
}

textarea {
    outline: 0;
    display: flex;
    padding: 10px 15px;
    border: 1px solid #ededed;
}

[class*="btn-"],
[class*="btn_"] {
    justify-content: center;
    align-items: center;
}

a[class*="btn-"],
a[class*="btn_"] {
    display: inline-flex;
}

input[class*="btn-"],
input[class*="btn_"],
button[class*="btn-"],
button[class*="btn_"] {
    display: flex;
}

input[class*="center"],
button[class*="center"],
textarea[class*="center"] {
    margin: auto;
}

input[class*="right"],
button[class*="right"],
textarea[class*="right"] {
    margin-left: auto;
}

a[class*="full"],
input[class*="full"],
button[class*="full"],
textarea[class*="full"] {
    width: 100%;
}

form>[class*="wrap"] {
    display: flex;
}

[class*="space"] {
    display: flex;
    --space: 0;
}

[class*="wrap-space"]>[class*="btn"]:not(:last-child),
[class*="wrap_space"]>[class*="btn"]:not(:last-child),
[class*="wrap space"]>[class*="btn"]:not(:last-child) {
    margin-right: calc(var(--space) * 1px);
}

[class*="wrap"]>input {
    width: 100%;
}

[class*="wrap-space"]>[class*="animation"]:not(:last-child) [class*="btn"],
[class*="wrap_space"]>[class*="animation"]:not(:last-child) [class*="btn"],
[class*="wrap space"]>[class*="animation"]:not(:last-child) [class*="btn"] {
    margin-right: calc(var(--space) * 1px);
}

[class*="btn-"]>svg[class*="icon"],
[class*="btn_"]>svg[class*="icon"],
[class*="btn-"]>img[class*="icon"],
[class*="btn_"]>img[class*="icon"] {
    height: 1em;
    width: auto;
    box-sizing: content-box;
}


/* Link Button Input Textarea Styling */

[class*="border"] {
    border: 1px solid;
}


/* Button Color */

a[class*="primary"],
button[class*="primary"] {
    background-color: var(--btnS);
    color: var(--btnP);
    border-color: var(--btnS);
}

a[class*="primary"]:hover,
button[class*="primary"]:hover {
    background-color: var(--btnP);
    color: var(--btnS);
    border-color: var(--btnP);
}

a[class*="secondary"],
button[class*="secondary"] {
    background-color: var(--btnSecondary);
    color: var(--linkSecondary);
    border-color: var(--btnSecondary);
}

a[class*="darkred"],
button[class*="darkred"] {
    background-color: var(--btnDarkRed);
    color: var(--linkPrimary);
    border-color: var(--btnDarkRed);
}

a[class*="gray"],
button[class*="gray"] {
    background-color: var(--btnGray);
    color: var(--linkPrimary);
    border-color: var(--btnGray);
}

[class*="radius"] {
    border-radius: 4px;
}


/* Border Color  */

[class*="border"] {
    background-color: transparent !important;
}

[class*="border-primary"],
[class*="border_primary"],
[class*="border primary"] {
    color: var(--btnPrimary) !important;
}

[class*="border-secondary"],
[class*="border_secondary"],
[class*="border secondary"] {
    color: var(--btnSecondary) !important;
}

[class*="border-darkred"],
[class*="border_darkred"],
[class*="border darkred"] {
    color: var(--btnDarkRed) !important;
}

[class*="border-gray"],
[class*="border_gray"],
[class*="border gray"] {
    color: var(--btnGray) !important;
}

.animation_link {
    opacity: 0;
}

.slick-current.slick-active .hero_sub_title .animation_item {
    animation: 1s cubic-bezier(0.26, 0.54, 0.32, 1) 0.7s forwards;
    animation-name: rise-up;
}

.slick-current.slick-active .hero_sub_title .animation_item {
    animation: 1s cubic-bezier(0.26, 0.54, 0.32, 1) 0.7s forwards;
    animation-name: rise-up;
}

.slick-current.slick-active .link_button_group .link_button {
    animation: fade-in 2s ease 1.3s forwards;
}

.slick-current.slick-active .link_button_group .link_button:nth-child(2) {
    animation: fade-in 2s ease 1.6s forwards;
}


/* Animation Css Start */


/* Button Link Hover Animation  */


/* must use 
    1. data-style="border" for agter animation
*/

[data-style*="border"] {
    display: inline-block;
    text-transform: uppercase;
    position: relative;
    text-decoration: none;
    border-bottom: 1px solid;
    border-bottom-color: rgba(0, 0, 0, 0.15);
}

[data-style*="border"]::after {
    position: absolute;
    content: "";
    left: 0;
    width: 0%;
    bottom: -2px;
    border-bottom: 2px solid currentColor;
    transition: width 0.5s ease;
}

[data-style*="border"]:hover::after {
    width: 100%;
}


/* must use 
      1. data-style="shine" default
      2. data-style="shine white" for white button
  */

@keyframes shine {
    to {
        left: -200%;
    }
}

[data-style*="shine"] {
    position: relative;
    overflow: hidden;
    transition: background 0.2s ease 0s;
}

[data-style*="shine"]::after {
    content: "";
    position: absolute;
    top: 0;
    left: 150%;
    width: 200%;
    height: 100%;
    transform: skewX(-20deg);
    background-image: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.25), transparent);
}

[data-style*="white"]::after {
    background-image: linear-gradient( 90deg, transparent, rgba(0, 0, 0, 0.3), transparent);
}

[data-style*="shine"]:hover::after {
    animation: shine 0.75s cubic-bezier(0.01, 0.56, 1, 1);
}


/* Animatio Rise Up */


/* must use 
      1. data-style="riseUp" for wapping inside animation_cropper
      2. data-style="animation" for use data attribute animation delay and duration
      3. data-delay=".3"
      4. data-duration=".8"
  */

@keyframes riseUp {
    0% {
        opacity: 1;
        transform: translateY(120%);
    }
    to {
        transform: translateY(0%);
        opacity: 1;
    }
}

[class*="animation_cropper"] {
    overflow: hidden;
    opacity: 0;
}

[class*="-active"] [class*="animation_cropper"] {
    opacity: 1;
}

[class*="crop_content"] {
    opacity: 0;
    transform: translateY(15px);
    transition: none;
    animation-delay: 0.3s;
    animation-duration: 0.8s;
}

[class*="-active"] [class*="crop_content"] {
    /* transform: translateY(0px); */
    animation-name: riseUp;
    animation-timing-function: cubic-bezier(0.26, 0.54, 0.32, 1);
    animation-fill-mode: forwards;
}


/* Fade In */


/* must use 
      1. data-style="fadeIn" for wapping inside animation_item
      2. data-style="animation" for use data attribute animation delay and duration
      3. data-delay="2s"
      4. data-duration="1.6s"
  */

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

[data-style*="fadeIn"] {
    animation-delay: 0.5s;
    animation-duration: 2s;
    opacity: 0;
}

[data-style*="fadeIn"].open,
[class*="-active"] [data-style*="fadeIn"] {
    animation-name: fadeIn;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
}


/* Sticky NavBar */

[data-style*="sticky"] {
    z-index: 9999;
    position: relative;
}

[data-style*="sticky"].active {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: red;
    transform: translate3d(0, -100%, 0);
}

[data-style*="sticky"].active.open {
    transform: translateZ(0);
    transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}


/* Toggle Activation */


/* must use 
  1. data-toggle="open" in click button
  2. data-toggle="close" in click button
  3. data-toggle="content" in content wrap which will show
  4. data-target="any thing" must match in those open, close and content
  */


/* Mobile Menu Left To Right Animation*/

[data-style*="left-to-right"] {
    position: fixed;
    overflow: hidden;
    top: 0;
    bottom: 0;
    left: calc(-100% + 60px);
    width: calc(100% - 60px);
    max-width: 95%;
    z-index: 99999;
    background-color: red;
    color: var(--textColorPrimary);
    box-shadow: 0 0 150px rgb(0 0 0 / 10%);
    transform: translateX(0px);
    transition: transform 0.45s cubic-bezier(0.165, 0.84, 0.44, 1);
}

[data-style*="left-to-right"].open {
    transform: translateX(100%);
}

[data-style*="right-to-left"] {
    position: fixed;
    overflow: hidden;
    top: 0;
    bottom: 0;
    right: -300px;
    width: 300px;
    max-width: 95%;
    z-index: 99999;
    background-color: red;
    color: var(--textColorPrimary);
    box-shadow: 0 0 150px rgb(0 0 0 / 10%);
    transform: translateX(0px);
    transition: transform 0.45s cubic-bezier(0.165, 0.84, 0.44, 1);
}

[data-style*="right-to-left"].open {
    transform: translateX(-300px);
}


/* Animation Auto */


/* must use 
      1. data-style="animation-auto" (child Item will animate not this div)
      2. data-delay-unit=".2" animation delay increment set
      3. data-style="animation" in chield div for for custom animation duration in each div
      4. data-style="fix-duration" in prent div for equal animatio time and use (data-duratio-unit) for valu set  
      3. data-duratin-unit="1" same animation time in all chield, must use (fix-duration for this property)
      4. data-target="any thing" must match in those open, close and content
  */

@keyframes fadeInSlideUp {
    0% {
        top: 50px;
        opacity: 0;
    }
    100% {
        top: 0;
        opacity: 1;
    }
}

[data-style*="fade_InSlide_Up"],
[data-style*="animation-auto"][data-style*="fade_InSlide_Up"]>* {
    position: relative;
    animation-delay: 0.1s;
    animation-duration: 1s;
}

[data-style*="fade_InSlide_Up"].open,
[data-style*="animation-auto"][data-style*="fade_InSlide_Up"].open>*,
:hover>[data-style*="animation-auto"][data-style*="fade_InSlide_Up"]>* {
    animation: fadeInSlideUp 0.5s ease forwards;
    top: 50px;
    opacity: 0;
}


/* Fade In Slide Up*/


/* must use 
      1. data-style="fadeInSlideUp" in animation_item
      2. data-style="animation" for use data attribute animation delay and duration
      3. data-delay="2s"
      4. data-duration="1.6s" 
      5. In animation auto this datay-style and animation auto set in parent div (see animation auto)
  
  */

@keyframes fadeOutSlideDown {
    0% {
        top: 0;
        opacity: 1;
    }
    100% {
        top: 50px;
        opacity: 0;
    }
}

[data-style*="fadeOutSlideDown"],
[data-style*="animation-auto"][data-style*="fadeOutSlideDown"]>* {
    position: relative;
    animation-delay: 0.1s;
    animation-duration: 1s;
}

[data-style*="fadeOutSlideDown"].open,
[data-style*="animation-auto"][data-style*="fadeOutSlideDown"].open>*,
:hover>[data-style*="fadeOutSlideDown"]>* {
    animation: fadeOutSlideDown 0.5s ease forwards;
    top: 0;
    opacity: 1;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

[data-style*="spin"] {
    animation: spin 1s linear infinite;
}

@keyframes ping {
    75%,
    100% {
        transform: scale(2);
        opacity: 0;
    }
}

[data-style*="ping"] {
    animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}

@keyframes pulse {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

[data-style*="pulse"] {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes bounce {
    0%,
    100% {
        transform: translateY(0%);
        animationtimingfunction: cubic-bezier(0.8, 0, 1, 1);
    }
    50% {
        transform: translateY(-10%);
        animationtimingfunction: cubic-bezier(0, 0, 0.2, 1);
    }
}

a:hover [data-style*="bounce"] {
    animation: bounce .5s infinite;
}

[data-style*="animate"]{
    overflow: hidden;
}

[data-style*="SlideTOLeft"]{
    opacity: 0;
    transform: translate3d(-100px,0,0);
    transition-property: opacity,transform;
    transition-duration: 1.5s;
    transition-timing-function: ease;
    position: relative;
}

[class*="active"][data-style*="SlideTOLeft"],
[class*="active"] [data-style*="SlideTOLeft"]{
    opacity: 1;
    transform: translateZ(0);
}


 [data-style*="SlideTORight"]{
    opacity: 0;
    transform: translate3d(100px,0,0);
    transition-property: opacity,transform;
    transition-duration: 1.5s;
    transition-timing-function: ease;
    position: relative;
}

[class*="active"] [data-style*="SlideTORight"]{
    opacity: 1;
    transform: translateZ(0);
} 

[data-style*="zoomFade"]{
    opacity: 0;
    transform: scale(.6);
    transition-property: opacity,transform;
    transition-duration: 2s;
    transition-timing-function: ease;
}

[class*="active"] [data-style*="zoomFade"]{
    opacity: 1;
    transform: translateZ(0) scale(1);
}

[data-style*="fadeDown"]{
    opacity: 0;
    transform: translate3d(0,-100px,0);
    transition-property: opacity,transform;
    transition-duration: 2s;
    transition-timing-function: ease;
}

[class*="active"] [data-style*="fadeDown"]{
    opacity: 1;
    transform: translateZ(0);
}

/* General Setting For Design */

body {
    font-family: "MuseoSansCyrl";
    color: #fff;
    font-weight: 500;
    font-size: 34px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Charter-Bold";
    margin-bottom: 10px;
    font-weight: 700;
}

h1 {
    font-size: 72px;
    font-size: clamp(px, calc(100 * (72vw/1920)), 72px);
}

h2 {
    font-size: var(--fzH2);
}

a {
    text-decoration: none;
    color: currentColor;
    display: block;
    outline: 0;
    border: 0;
    text-transform: uppercase;
}

a:hover {
    color: currentColor;
}

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