@charset "UTF-8";

:root {
    --accent: #02984F;
    --second: #1D5C75;
    --light: #F0F5F4;
    --light-2: #EDEDED;
    --red: #EF4444;
    --blue: #0072DE;
    --dark: #020202;
    --white: #ffffff;
    --black: #000000;
    --danger: #F61372;
    --success: #15803D;
    --yellow: #FDCE01;

    --color: #111827;
    --color-2: #4B5563;
    --color-3: #6B7280;
    --color-white: #ffffff;
    --color-white-2: rgba(255, 255, 255, 0.8);
    --color-dark: #111827;
    --color-dark-2: #3D3D3D;
    --color-dark-3: rgba(61, 61, 61, 0.5);

    --border: rgba(229, 231, 235, 1);
    --border-09: rgba(229, 231, 235, 0.9);
    --border-08: rgba(229, 231, 235, 0.8);
    --border-07: rgba(229, 231, 235, 0.7);
    --border-06: rgba(229, 231, 235, 0.6);
    --border-05: rgba(229, 231, 235, 0.5);
    --border-04: rgba(229, 231, 235, 0.4);
    --border-03: rgba(229, 231, 235, 0.3);
    --border-02: rgba(229, 231, 235, 0.2);
    --border-01: rgba(229, 231, 235, 0.1);

    --border-dark: rgba(67, 67, 67, 1);
    --border-dark-09: rgba(67, 67, 67, 0.9);
    --border-dark-08: rgba(67, 67, 67, 0.8);
    --border-dark-07: rgba(67, 67, 67, 0.7);
    --border-dark-06: rgba(67, 67, 67, 0.6);
    --border-dark-05: rgba(67, 67, 67, 0.5);
    --border-dark-04: rgba(67, 67, 67, 0.4);
    --border-dark-03: rgba(67, 67, 67, 0.3);
    --border-dark-02: rgba(67, 67, 67, 0.2);
    --border-dark-01: rgba(67, 67, 67, 0.1);
    
    --background: rgba(255, 255, 255, 1);
    --background-09: rgba(255, 255, 255, 0.9);
    --background-08: rgba(255, 255, 255, 0.8);
    --background-07: rgba(255, 255, 255, 0.7);
    --background-06: rgba(255, 255, 255, 0.6);
    --background-05: rgba(255, 255, 255, 0.5);
    --background-04: rgba(255, 255, 255, 0.4);
    --background-03: rgba(255, 255, 255, 0.3);
    --background-02: rgba(255, 255, 255, 0.2);
    --background-01: rgba(255, 255, 255, 0.1);


    --gradient-1: linear-gradient(101deg, var(--accent) 17.06%, var(--second) 79.87%);
    --gradient-2: linear-gradient(0deg, #021424 -11.21%, #2D5676 160.78%);
    --gradient-accent: linear-gradient(60deg, rgba(24, 236, 251, 0.7) 0%, rgba(24, 236, 251, 0.3) 50.5%, rgba(24, 236, 251, 0.1) 99%);
    --gradient-second: linear-gradient(60deg, rgba(255, 0, 183, 0.7) 0%, rgba(255, 0, 183, 0.3) 50.5%, rgba(255, 0, 183, 0.1) 99%);
    
    --background-dark: #020202;

    --blur: blur(10px);

    --shadow: 0 0.25rem 1rem 0.5rem rgba(54, 56, 72, 0.05);
    --shadow-xs: 0 0.15rem 0.625rem 0.5rem rgba(54, 56, 72, 0.035);
    --shadow-sm: 0 0.15rem 1rem 0.5rem rgba(54, 56, 72, 0.035);
    --shadow-md: 0 0.313rem 1.25rem rgba(54, 56, 72, 0.1);
    --shadow-accent: 0 0 3.125rem rgba(24, 237, 251, 0.75);
    --shadow-accent-sm: 0 0 1.875rem 0 rgba(24, 237, 251, 0.75);
    --shadow-second: 0 0 3.125rem rgba(255, 0, 183, 0.75);
    --shadow-second-sm: 0 0 1.875rem 0 rgba(255, 0, 183, 0.75);

    --transition-none: none;
    --transition: all .4s ease-in-out;
    --transition-2: all .2s ease-in-out;
    --transition-3: all .3s ease-in-out;
    --transition-4: all .4s ease-in-out;
    --transition-5: all .5s ease-in-out;
    --transition-6: all .6s ease-in-out;
    --transition-7: all .7s ease-in-out;
    --transition-8: all .8s ease-in-out;
    --transition-9: all .9s ease-in-out;

    --transform-fix: 'none';
    
    --font1: 'Inter', sans-serif;
}

@media (max-width: 992px) {
    :root {
        --space-top-site: 75px;
    }
}
@media (max-width: 580px) {
    :root {
        --space-top-site: 60px;
    }
}

[data-theme="dark"] {
    --color: rgba(255, 255, 255, 1);
    --color-2: #d7d7d7;
    --color-3: rgba(194, 194, 194, 0.5);
    --color-white: #ffffff;
    --color-white-2: rgba(255, 255, 255, 0.8);
    
    --border-dark: rgba(245, 245, 245, 1);
    --border-dark-09: rgba(245, 245, 245, 0.9);
    --border-dark-08: rgba(245, 245, 245, 0.8);
    --border-dark-07: rgba(245, 245, 245, 0.7);
    --border-dark-06: rgba(245, 245, 245, 0.6);
    --border-dark-05: rgba(245, 245, 245, 0.5);
    --border-dark-04: rgba(245, 245, 245, 0.4);
    --border-dark-03: rgba(245, 245, 245, 0.3);
    --border-dark-02: rgba(245, 245, 245, 0.2);
    --border-dark-01: rgba(245, 245, 245, 0.1);
}


/* ------------------------------------ base ------------------------------------ */
    *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
    html { -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; scroll-behavior: smooth; }
    html, body { font-size: 100%; }
    body { background: var(--background); cursor: auto; font-family: var(--font1); font-style: normal; font-weight: 400; font-size: 1rem; line-height: 1.5; letter-spacing: 0.02rem; color: var(--color); margin: 0; padding: 0; }

    ::-moz-selection { background: var(--accent); color: var(--white); }
    ::selection { background: var(--accent); color: var(--white); }

    a { color: var(--color); text-decoration: none; cursor: pointer; -webkit-transition-property: color; -moz-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    *:focus { text-decoration: none; outline: none; }
    a:focus, a:hover, a:active, *:focus,
    a:focus h1, a:hover h1, a:active h1,
    a:focus h2, a:hover h2, a:active h2,
    a:focus h3, a:hover h3, a:active h3,
    a:focus h4, a:hover h4, a:active h4,
    a:focus h5, a:hover h5, a:active h5,
    a:focus h6, a:hover h6, a:active h6 { 
        color: var(--accent); cursor: pointer; outline: none; text-decoration: none; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); 
    }

    a.hover:hover { text-decoration: underline; transition-duration: 0.2s; }
    a.hover-1 { padding-bottom: 0.1rem; text-decoration: none; background-image: linear-gradient(var(--accent), var(--accent)); background-position: 1% 100%; background-repeat: no-repeat; background-size: 0% 1px; transition: background-size cubic-bezier(0,.5,0,1) 0.3s; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    a.hover-1:hover { text-decoration: none; background-size: 100% 1px; -webkit-transition: var(--transition-3); -moz-transition: var(--transition-3); -ms-transition: var(--transition-3); -o-transition: var(--transition-3); transition: var(--transition-3); }
    a.hover-1.white { background-image: linear-gradient(var(--white), var(--light)); }
    a.hover-1.dark { background-image: linear-gradient(var(--color-2), var(--dark)); }
    a.hover-2 { text-decoration: none; background-image: linear-gradient(var(--light), var(--light)); background-position: 1% 100%; background-repeat: no-repeat; background-size: 0% 2px; transition: background-size cubic-bezier(0,.5,0,1) 0.3s; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    a.hover-2:hover { text-decoration: none; background-size: 100% 50px; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    a.hover-3:hover { margin-left: 3px; transition-duration: 0.2s; }
    a.hover-4:hover { padding-bottom: 3px; transition-duration: 0.2s; }

    .link { font-weight: 500; font-size: 1rem; line-height: 1.2; color: var(--color) !important; z-index: 4; }
    .link .icon { position: absolute; top: 2px; margin-left: 0.625rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .link:hover .icon { margin-left: 0.938rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    
    .link-arrow { position: relative; font-weight: 500; font-size: 1rem; line-height: 1.2; color: var(--color) !important; padding-right: 1.45rem; z-index: 4; -webkit-transition: right 0.4s; -moz-transition: right 0.4s; -ms-transition: right 0.4s; -o-transition: right 0.4s; transition: right 0.4s; }
    .link-arrow:before { content: '\e829'; font-family: 'Feather'; position: absolute; top: 50%; transform: translateY(-50%); right: 0; font-size: 1rem; color: var(--color); vertical-align: middle; -webkit-transition: right 0.4s; -moz-transition: right 0.4s; -ms-transition: right 0.4s; -o-transition: right 0.4s; transition: right 0.4s; }
    .link-arrow:hover:before { right: -0.313rem; }

    .link-arrow.reverse { padding-left: 1.45rem; padding-right: 0; }
    .link-arrow.reverse:before { left: 0; right: inherit; transform: rotate(180deg); -webkit-transition: transform 0.4s, left 0.4s; -moz-transition: transform 0.4s, left 0.4s; -ms-transition: transform 0.4s, left 0.4s; -o-transition: transform 0.4s, left 0.4s; transition: transform 0.4s, left 0.4s; }
    .link-arrow.reverse:hover:before { right: inherit; left: -0.1rem; transform: rotate(220deg); }

    .link-arrow.style-2:before { opacity: 0; visibility: hidden; }
    .link-arrow.style-2:hover:before { opacity: 1; visibility: visible; }

    .link-arrow.gradient-1 { background: var(--gradient-1); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    .link-arrow.gradient-1:before { background: var(--gradient-1); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

    .link.accent { color: var(--accent) !important; }
    .link.accent:before { color: var(--accent) !important; }

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

    @media (max-width: 768px) {
        .link { font-size: 0.875rem; }
    }

    ol { padding: 0; margin: 0; list-style: decimal outside; }
    ol > li { margin-left: 1rem; padding-left: 0.313rem; }
    ol > li:not(:last-child) { margin-bottom: 0.313rem; }
    ul { padding: 0; margin: 0; list-style-position: outside; list-style-type: circle; }
    ul > li { margin-left: 1rem; padding-left: 0.313rem; }
    ul > li:not(:last-child) { margin-bottom: 0.313rem; }
    .list-unstyled { padding-left: 0; list-style: none; }
    .list-unstyled > li { margin-left: 0; padding-left: 0; }
    .list-inline { padding-left: 0; list-style: none; }
    .list-inline-item { display: inline-block; }
    .list-inline-item:not(:last-child) { margin-right: 0.938rem; }

    meta.foundation-version { font-family: "/5.5.2/"; }
    meta.foundation-mq-small { font-family: "/only screen/"; width: 0; }
    meta.foundation-mq-small-only { font-family: "/only screen and (max-width: 40em)/"; width: 0; }
    meta.foundation-mq-medium { font-family: "/only screen and (min-width:40.0625em)/"; width: 40.0625em; }
    meta.foundation-mq-medium-only { font-family: "/only screen and (min-width:40.0625em) and (max-width:64em)/"; width: 40.0625em; }
    meta.foundation-mq-large { font-family: "/only screen and (min-width:64.0625em)/"; width: 64.0625em; }
    meta.foundation-mq-large-only { font-family: "/only screen and (min-width:64.0625em) and (max-width:90em)/"; width: 64.0625em; }
    meta.foundation-mq-xlarge { font-family: "/only screen and (min-width:90.0625em)/"; width: 90.0625em; }
    meta.foundation-mq-xlarge-only { font-family: "/only screen and (min-width:90.0625em) and (max-width:120em)/"; width: 90.0625em; }
    meta.foundation-mq-xxlarge { font-family: "/only screen and (min-width:120.0625em)/"; width: 120.0625em; }
    meta.foundation-data-attribute-namespace { font-family: false; }

    .opacity-1 { opacity: 0.1; }
    .opacity-2 { opacity: 0.2; }
    .opacity-3 { opacity: 0.3; }
    .opacity-4 { opacity: 0.4; }
    .opacity-5 { opacity: 0.5; }
    .opacity-6 { opacity: 0.6; }
    .opacity-7 { opacity: 0.7; }
    .opacity-8 { opacity: 0.8; }
    .opacity-9 { opacity: 0.9; }
    .opacity-none { opacity: 1; }

    #map_canvas img, #map_canvas embed, #map_canvas object, .map_canvas img, .map_canvas embed, .map_canvas object, .mqa-display img, .mqa-display embed, .mqa-display object { max-width: none !important; }

    .left { float: left !important; }
    .right { float: right !important; }

    .clearfix:before, .clearfix:after { content: " "; display: table; }
    .clearfix:after { clear: both; }

    .hide { display: none; }
    .show { display: block; }

    .invisible { visibility: hidden; }
    .visible { visibility: visible; }

    .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

    textarea { height: auto; min-height: 50px; }
    select { width: 100%; }

    .single { overflow: auto; width: 100%; height: 100%; }

    .no-padding { padding: 0; }
    .no-overflow { overflow: hidden; }

    .centered-text { text-align: center; }

    img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic; }
    .img-contain { object-fit: contain; position: 50% 50%; -webkit-transition: -webkit-transform .5s; transition: -webkit-transform .5s; -o-transition: transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s; }
    .img-cover { object-fit: cover; position: 50% 50%; width: 100%; height: 100%; -webkit-transition: -webkit-transform .5s; transition: -webkit-transform .5s; -o-transition: transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s; }
    .img-cover.hover-scale { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -webkit-transition: -webkit-transform .5s; transition: -webkit-transform .5s; -o-transition: transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s; }

    .hv-obj-zoom { overflow: hidden; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .hv-obj-zoom:hover, .hv-obj-zoom:focus { -webkit-transform: scale(1.09); -ms-transform: scale(1.09); transform: scale(1.09); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .hv-zoom { position: relative; overflow: hidden; }
    .hv-zoom img:not(.fix) { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .hv-zoom:hover img:not(.fix) { -webkit-transform: scale(1.09); -moz-transform: scale(1.09); -ms-transform: scale(1.09); -o-transform: scale(1.09); transform: scale(1.08); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .hv-shadow-sm { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .hv-shadow-sm:hover, .hv-shadow-sm:focus { box-shadow: 0 0.24rem 0.625rem rgba(0, 0, 0, 0.0786943); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .hv-shadow { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .hv-shadow:hover, .hv-shadow:focus { box-shadow: 0 0.625rem 2.813rem rgba(0, 0, 0, 0.0986943); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .hv-trigger { position: relative; overflow: hidden; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .hv-trigger:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 20%; height: 20%; opacity: 0; visibility: hidden; border-radius: 0.6rem; background: var(--light); z-index: 0; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .hv-trigger:hover:before, .hv-trigger:focus:before { width: 100%; height: 100%; opacity: 1; visibility: visible; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .hv-underline { position: relative; padding: 0; }
    .hv-underline:hover { text-decoration: none; }
    .hv-underline:before { content: ''; display: block; position: absolute; left: 0; bottom: 0; height: 1px; width: 0; transition: width 0s ease, background 0.25s ease; }
    .hv-underline:after {
        content: '';
        display: block;
        position: absolute;
        right: 0;
        bottom: 0;
        height: 1px;
        width: 0;
        background: var(--second);
        transition: width 0.25s ease;
    }
    .hv-underline:hover:before { width: 100%; background: var(--second); transition: width 0.25s ease; }
    .hv-underline:hover:after { width: 100%; background: transparent; transition: all 0s ease; }

    /* appear animation */
    .moveup {
        opacity: 0;
        -webkit-transform: translate(0, 200px);
        -moz-transform: translate(0, 200px);
        -ms-transform: translate(0, 200px);
        -o-transform: translate(0, 200px);
        transform: translate(0, 200px);
        -webkit-transition-property: opacity transform;
        -moz-transition-property: opacity transform;
        transition-property: opacity transform;
        -webkit-transition-duration: 0.5s;
        -moz-transition-duration: 0.5s;
        transition-duration: 0.5s; 
    }
    .appear.moveup { opacity: 1; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); }

    /* .row { margin: 0 auto; max-width: 62.5rem; width: 100%; }
    .row:before, .row:after { content: " "; display: table; }
    .row:after { clear: both; } */

    .spacing { height: 1.25rem; }
    .two.spacing { height: 2.5rem; }
    .three.spacing { height: 3.2rem; }
    .four.spacing { height: 5rem; }
    .w-100 { width: 100%; }

    main.wrap-site { position: relative; min-width: none; }
    main.wrap-site.clear { padding-top: 0; padding-bottom: 0; }

    /* section */
    .section { position: relative; }
    .section-xl { padding-top: 6.25rem; padding-bottom: 6.25rem; }
    .section-lg { padding-top: 5rem; padding-bottom: 5rem; }
    .section-md { padding-top: 3.75rem; padding-bottom: 3.75rem; }
    .section-sm { padding-top: 2.5rem; padding-bottom: 2.5rem; }
    .section-xs { padding-top: 1.563rem; padding-bottom: 1.563rem; }
    .section-xxs { padding-top: 0.938rem; padding-bottom: 0.938rem; }

    @media (max-width: 1200px) {
        .section-xl { padding-top: 5.75rem; padding-bottom: 5.75rem; }
        .section-lg { padding-top: 4.75rem; padding-bottom: 4.75rem; }
        .section-md { padding-top: 3.5rem; padding-bottom: 3.5rem; }
        .section-sm { padding-top: 2.25rem; padding-bottom: 2.25rem; }
        .section-xs { padding-top: 1.35rem; padding-bottom: 1.35rem; }
        .section-xxs { padding-top: 0.75rem; padding-bottom: 0.75rem; }
    }
    @media (max-width: 992px) {
        .section-xl { padding-top: 5rem; padding-bottom: 5rem; }
        .section-lg { padding-top: 4rem; padding-bottom: 4rem; }
        .section-md { padding-top: 3.10rem; padding-bottom: 3.10rem; }
        .section-sm { padding-top: 2.10rem; padding-bottom: 2.10rem; }
        .section-xs { padding-top: 1.25rem; padding-bottom: 1.25rem; }
        .section-xxs { padding-top: 0.625rem; padding-bottom: 0.625rem; }
    }

    /*scrollable*/
    .scrollable {
        position: relative;
        display: -ms-flexbox;
        display: flex; 
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: inherit;
        flex-wrap: inherit;
        white-space: nowrap;
        overflow-y: auto;
        overflow-x: hidden;
        width: 100%;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .scrollable::-webkit-scrollbar { width: 0.5rem; height: 0.5rem; cursor: pointer; }
    .scrollable::-webkit-scrollbar-track { background: rgba(241, 241, 241, 0); border-radius: 2.5rem; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }
    .scrollable::-webkit-scrollbar-thumb { background: rgba(195, 195, 195, 0); border-radius: 2.5rem; -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }
    .scrollable:hover::-webkit-scrollbar-track { background: rgba(241, 241, 241, 0.8); -webkit-box-shadow: inset 0 0.313rem 0.5rem rgba(241, 241, 241, 1); box-shadow: inset 0 0.313rem 0.5rem rgba(241, 241, 241, 1); -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }
    .scrollable:hover::-webkit-scrollbar-thumb { background: rgba(195, 195, 195, 0.5); -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }
    .scrollable::-webkit-scrollbar-thumb:horizontal:hover,
    .scrollable::-webkit-scrollbar-thumb:vertical:hover { background: rgba(195, 195, 195, 1); -webkit-transition: all .4s ease-in-out; -moz-transition: all .4s ease-in-out; -ms-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out; }
    .h-scrollable { overflow-y: hidden !important; overflow-x: auto !important; }
/* ------------------------------------ end basic ------------------------------------ */


/* ------------------------------------ typografi ------------------------------------ */
    .text-gradiant-1 { background: var(--gradient-1); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

    h1, h2, h3, h4, h5, h6 { font-weight: 600; letter-spacing: 0.03rem; color: var(--color); margin-bottom: 1.25rem; }
    p { letter-spacing: 0.02rem; color: var(--color-3); }

    .font-weight-200, .fw-200 { font-weight: 200 !important; }
    .font-weight-light, .fw-300 { font-weight: 300 !important; }
    .font-weight-lighter, .fw-lighter { font-weight: lighter !important; }
    .font-weight-normal, .fw-400 { font-weight: 400 !important; }
    .font-weight-500, .fw-500 { font-weight: 500 !important; }
    .font-weight-600, .fw-600 { font-weight: 600 !important; }
    .font-weight-bold, .fw-bold { font-weight: 600 !important; }
    .font-weight-800, .fw-800 { font-weight: 800 !important; }
    .font-weight-900, .fw-900 { font-weight: 900 !important; }
    .font-weight-ultra, .fw-ultra { font-weight: 900 !important; }
    .font-weight-bolder, .fw-bolder { font-weight: 700 !important; }
    .font-italic { font-style: italic !important; }

    .fs-10 { font-size: 0.625rem !important; }
    .fs-11 { font-size: 0.688rem !important; }
    .fs-12 { font-size: 0.75rem !important; }
    .fs-13 { font-size: 0.813rem !important; }
    .fs-14 { font-size: 0.875rem !important; }
    .fs-15 { font-size: 0.938rem !important; }
    .fs-16 { font-size: 1rem !important; }
    .fs-17 { font-size: 1.063rem !important; }
    .fs-18 { font-size: 1.125rem !important; }
    .fs-19 { font-size: 1.188rem !important; }
    .fs-20 { font-size: 1.25rem !important; }
    .fs-21 { font-size: 1.313rem !important; }
    .fs-22 { font-size: 1.375rem !important; }
    .fs-23 { font-size: 1.438rem !important; }
    .fs-24 { font-size: 1.5rem !important; }
    .fs-25 { font-size: 1.563rem !important; }
    .fs-30 { font-size: 1.875rem !important; }
    .fs-40 { font-size: 2.5rem !important; }
    .fs-50 { font-size: 3.125rem !important; }
    .fs-60 { font-size: 3.2rem !important; }

    .font-xs { font-size: 0.75rem !important; }
    .font-sm { font-size: 0.938rem !important; }
    .font-md { font-size: 1.125rem !important; }
    .font-lg { font-size: 1.25rem !important; }

    .lh-1 { line-height: 1 !important; }
    .lh-2 { line-height: 1.2 !important; }
    .lh-3 { line-height: 1.3 !important; }
    .lh-4 { line-height: 1.4 !important; }
    .lh-5 { line-height: 1.5 !important; }

    .text-decoration-none { text-decoration: none !important; }
    .text-break { word-break: break-word !important; overflow-wrap: break-word !important; }
    .word-break-all { word-break: break-all !important; }
    .text-reset { color: inherit !important; }

    .text-limit-1-row { overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 1 !important; -webkit-box-orient: vertical; }
    .text-limit-2-row { overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical; }
    .text-limit-3-row { overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical; }
    .text-limit-4-row { overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 4 !important; -webkit-box-orient: vertical; }
    .text-limit-5-row { overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 5 !important; -webkit-box-orient: vertical; }

    .text-accent { color: var(--accent) !important; }
    .text-second { color: var(--second) !important; }
    .text-light { color: var(--light) !important; }
    .text-dark { color: var(--dark) !important; }
    .text-white { color: var(--white) !important; }
    .text-black { color: var(--black) !important; }
    .text-color { color: var(--color) !important; }
    .text-color2 { color: var(--color-2) !important; }
    .text-color3 { color: var(--color-3) !important; }
    .text-danger { color: #f73757!important; }
    .text-success { color: #18bb6b!important; }
    .text-info { color: #32bfff!important; }
    .text-warning { color: #ffab4d!important; }
    .text-blue { color: var(--blue) !important; }
    .text-note { font-size: 0.75rem; letter-spacing: 0.04rem; color: var(--color-2); }

    :root {
        --stroke-width: calc(1.25em / 15);
    }

    .text-gradient-1 {
        background: linear-gradient(180deg, #083C2F 0%, rgba(8, 60, 47, 0.51) 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-gradient-2 {
        background: var(--gradient-1);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .section-subheading { font-weight: 400; font-size: 1rem; line-height: 1.5; letter-spacing: 0.25rem; color: var(--color); margin-bottom: 0.5rem; }
    .section-heading-xxl { font-weight: 500; font-size: 3.125rem; line-height: 1.3; color: var(--color); }
    .section-heading-xl { font-weight: 500; font-size: 2.8rem; line-height: 1.3; color: var(--color); }
    .section-heading-lg { font-weight: 500; font-size: 2.4rem; line-height: 1.3; color: var(--color); }
    .section-heading { font-weight: 500; font-size: 2rem; line-height: 1.3; color: var(--color); }
    .section-heading-sm { font-weight: 500; font-size: 1.75rem; line-height: 1.3; color: var(--color); }
    .section-heading-xs { font-weight: 500; font-size: 1.5rem; line-height: 1.3; color: var(--color); }
    .section-description-xl { font-weight: 400; font-size: 1.375rem; line-height: 160%; color: var(--color-2); }
    .section-description-lg { font-weight: 400; font-size: 1.25rem; line-height: 160%; color: var(--color-2); }
    .section-description { font-weight: 400; font-size: 1.125rem; line-height: 160%; color: var(--color-2); }
    .section-description-md { font-weight: 400; font-size: 1rem; line-height: 160%; color: var(--color-2); }
    .section-description-sm { font-weight: 400; font-size: 0.875rem; line-height: 160%; color: var(--color-2); }
    .section-description-xs { font-weight: 400; font-size: 0.75rem; line-height: 150%; color: var(--color-2); }
    .section-description-xxs { font-weight: 400; font-size: 0.625rem; line-height: 150%; color: var(--color-2); }

    @media (max-width: 1200px) {
        .section-heading-xxl { font-size: 2.7rem; }
        .section-heading-xl { font-size: 2.5rem; }
        .section-heading-lg { font-size: 2.2rem; }
        .section-heading { font-size: 1.75rem; }
        .section-heading-sm { font-size: 1.5rem; }
        .section-heading-xs { font-size: 1.375rem; }
        .section-description-xl { font-size: 1.25rem; }
        .section-description-lg { font-size: 1.125rem; }
        .section-description { font-size: 1.063rem; }
        .section-description-md { font-size: 0.938rem; }
        .section-description-sm { font-size: 0.813rem; }
        .section-description-xs { font-size: 0.688rem; }
        .section-description-xxs { font-size: 0.5rem; }
    }
    @media (max-width: 768px) {
        .section-heading-xxl { font-size: 2.5rem; }
        .section-heading-xl { font-size: 2.3rem; }
        .section-heading-lg { font-size: 2rem; }
        .section-heading { font-size: 1.625rem; }
        .section-heading-sm { font-size: 1.375rem; }
        .section-heading-xs { font-size: 1.313rem; }

        .section-description-xl { font-size: 1.125rem; }
        .section-description-lg { font-size: 1rem; }
        .section-description { font-size: 0.938rem; }
        .section-description-md { font-size: 0.9rem; }
        .section-description-sm { font-size: 0.75rem; }
        .section-description-xs { font-size: 0.625rem; }
        .section-description-xxs { font-size: 0.5rem; }
    }
/* ------------------------------------ end typografi ------------------------------------ */


/* ------------------------------------ form style ------------------------------------ */
    .form-style .form-group { width: 100%; position: relative; margin-bottom: 1rem; }

    @media (max-width: 580px) {
        .form-style .form-group { margin-bottom: 1.25rem; }
    }

    .control-label { font-weight: 600; font-size: 0.875rem; line-height: 1.5; color: var(--color); margin-bottom: 0.313rem; }
    .control-label .required { color: var(--danger); }
    .control-label .note { font-weight: 400; font-size: 0.7rem; letter-spacing: 0.03rem; color: var(--color-3); }
    .form-control { 
        position: relative;
        display: block;
        width: 100%;
        height: calc(2.2rem + 0.75rem + 2px);
        padding: 0.37rem 0.75rem;
        border-radius: 0.5rem;
        background: var(--background);
        border: 1px solid var(--border-dark-01);
        font-weight: 400;
        font-size: 0.875rem; 
        line-height: 1.2;
        color: var(--color); 
        -webkit-appearance: none; -moz-appearance: none; appearance: none;
        -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition);
    }
    .form-control::placeholder { font-weight: 300; font-size: 0.875rem; letter-spacing: 0.02rem; color: var(--color); opacity: 0.5; }
    .form-control::-webkit-input-placeholder { font-weight: 300; font-size: 0.875rem; letter-spacing: 0.02rem; color: var(--color); opacity: 0.5; }
    .form-control::-moz-placeholder { font-weight: 300; font-size: 0.875rem; letter-spacing: 0.02rem; color: var(--color); opacity: 0.5; }
    .form-control:-ms-input-placeholder { font-weight: 300; font-size: 0.875rem; letter-spacing: 0.02rem; color: var(--color); opacity: 0.5; }
    .form-control:-moz-placeholder { font-weight: 300; font-size: 0.875rem; letter-spacing: 0.02rem; color: var(--color); opacity: 0.5; }
    
    .form-control:disabled:focus, .form-control[readonly]:focus { box-shadow: none; }

    .form-control:focus,
    .select2-selection--single:focus { 
        box-shadow: var(--shadow-xs); background: var(--background) !important; border-color: var(--accent) !important; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); 
    }

    .form-actions { margin-top: 1.75rem; }
    .wrap-input { position: relative; }
    textarea.form-control { height: inherit; padding: 0.45rem 0.75rem; }

    .form-style .form-group input[type=checkbox] { appearance: checkbox; -moz-appearance: checkbox; -webkit-appearance: checkbox; -o-appearance: checkbox; -ms-appearance: checkbox; }
    .form-style .form-group input[type=radio] { appearance: radio; -moz-appearance: radio; -webkit-appearance: radio; -o-appearance: radio; -ms-appearance: radio; }
    .form-style .form-group input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; }

    .form-style .form-group .group-inner { position: relative; }
    .form-style .form-group .group-inner .group-inner-icon { position: absolute; top: 0.875rem; width: 1.25rem; z-index: 2; }
    .form-style .form-group .group-inner .group-inner-icon i { font-size: 1rem; color: var(--color-2); }
    .form-style .form-group .group-inner .group-inner-icon svg { max-width: 1rem; max-height: 1rem; }
    .form-style .form-group .group-inner .group-inner-icon svg * { stroke: var(--color-3); }
    
    .form-style .form-group .group-inner.s-icon .group-inner-icon { left: 0.75rem; }
    .form-style .form-group .group-inner.s-icon .form-control { padding-left: calc(0.95rem + 1.25rem); }

    .form-style .form-group .group-inner.e-icon .group-inner-icon { right: 0.75rem; }
    .form-style .form-group .group-inner.e-icon .form-control { padding-right: calc(0.95rem + 1.25rem); }
    
    .form-style .form-group .group-inner.se-icon .group-inner-icon { left: 0.75rem; right: 0.75rem; }
    .form-style .form-group .group-inner.se-icon .form-control { padding-left: calc(0.95rem + 1.25rem); padding-right: calc(0.95rem + 1.25rem); }

    .form-style .form-group .group-inner.style-1 .group-inner-icon { width: auto; right: 0.75rem; background: var(--background); color: var(--color) !important; }
    .form-style .form-group .group-inner.style-1 .group-inner-icon:before { content: ''; position: absolute; top: 0; left: -1rem; width: 1px; height: 100%; background: var(--border01); }
    .form-style .form-group .group-inner.style-1 .form-control { padding-right: calc(0.95rem + 4.5rem); }

    /*input group left icon*/
    .form-style .form-group .input-group.input-telp .input-group-addon { position: absolute; top: 0; bottom: 0; left: 0.75rem; margin: auto; z-index: 5; display: inline-flex; align-items: center; }
    .form-style .form-group .input-group.input-telp .input-group-addon img.flag-ind { width: auto; height: 1.125rem; margin-right: 0.25rem; }
    .form-style .form-group .input-group.input-telp .input-group-addon span { font-weight: 500; font-size: 0.875rem; line-height: 1.2; color: var(--color); }
    .form-style .form-group .input-group.input-telp .form-control { padding-left: 70px; border-radius: 0.625rem !important; }
    .form-style .form-group .input-group.input-telp .form-control:focus { box-shadow: none; border-color: var(--accent); }

    /* form search */
    .form-style .form-group.form-search .group-inner .group-inner-icon { width: 1.55rem; left: 1.25rem; }
    .form-style .form-group.form-search .group-inner .group-inner-icon i { font-size: 1.55rem; }
    .form-style .form-group.form-search .group-inner .form-control { padding-left: 3.5rem; letter-spacing: 0.04rem; border-radius: 1.25rem; }

    .select-form { 
        position: relative; 
        overflow: hidden; 
        width: 100%;
        display: flex; 
        align-items: stretch; 
        justify-content: space-between;
        border-radius: 0.625rem; 
        border: 1px solid var(--border2); 
        background: var(--background); 
    }
    .select-form .select-form-input { width: 100%; white-space: nowrap; border: none; margin: 0; background: none; color: var(--border-dark-06); }
    .select-form .select-form-input:focus { background: var(--light); }
    .select-form.select-form-2 { background: var(--light); border: 1px solid var(--border); }
    .select-form.select-form-2 .select-form-input:focus { background: var(--light) !important; }


    .search-form { 
        position: relative; 
        overflow: hidden; 
        width: 100%;
        display: flex; 
        align-items: stretch; 
        justify-content: space-between;
        border-radius: 0.625rem; 
        border: 1px solid var(--border2); 
        background: var(--background); 
    }
    .search-form .search-form-input { width: 100%; white-space: nowrap; border: none; margin: 0; background: none; color: var(--border-dark-06); }
    .search-form .search-form-input:focus { background: var(--light); }
    .search-form .search-form-submit { position: relative; flex-shrink: 0; padding: 0 1.5rem; background: var(--gradient-1); box-shadow: none; border-radius: 0; outline: 0; font-size: 1.25rem; color: var(--color-white); }

    .search-form.search-form-2 { background: var(--light); border: 1px solid var(--border); }
    .search-form.search-form-2 .search-form-input:focus { background: var(--light) !important; }
    
    
    /*show password*/
    .form-style .form-group .show-password { cursor: pointer; position: absolute; top: 1.34rem; right: 0.85rem; font-size: 0.875rem; color: var(--color); opacity: 0.4; z-index: 5; }


    /* radio button */
    .custom-radio { align-items: center; min-height: auto; margin-bottom: 0.313rem; }
    .custom-radio.form-check-inline { margin-right: 2rem; }
    .custom-radio input { position: absolute; opacity: 0; visibility: hidden; }
    .custom-radio input + label { position: relative; padding: 0; font-weight: 400; font-size: 0.875rem; cursor: pointer; }
    .custom-radio input + label:before, .custom-radio input + label:after { content: ''; position: absolute; top: 0.1rem; left: -1.45rem; height: 1.13rem; width: 1.13rem; border-radius: 50%; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .custom-radio input + label:before { background: var(--background); border: 1px solid var(--border2); }
    .custom-radio input + label:after { background: var(--accent); border-color: var(--accent); box-shadow: var(--shadow-accent); opacity: 0; transform: scale(2); }
    .custom-radio input:checked + label:after { opacity: 1; transform: scale(1); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    /* checkbox */
    .custom-checkbox { align-items: center; min-height: auto; margin-bottom: 0.313rem; }
    .custom-checkbox.form-check-inline { margin-right: 2rem; }
    .custom-checkbox input { position: absolute; opacity: 0; visibility: hidden; }
    .custom-checkbox input + label { position: relative; padding: 0; font-weight: 400; font-size: 0.875rem; cursor: pointer; }
    .custom-checkbox input + label:before, .custom-checkbox input + label:after { content: ''; position: absolute; top: 0.1rem; left: -1.45rem; height: 1.13rem; width: 1.13rem; display: flex; align-items: center; justify-content: center; border-radius: 0.25rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .custom-checkbox input + label:before { background: var(--background); border: 1px solid var(--border2); }
    .custom-checkbox input + label:after { content: '\e83f'; font-family: 'feather'; color: var(--color-dark); background: var(--accent); border-color: var(--accent); box-shadow: var(--shadow-accent); opacity: 0; transform: scale(2); }
    .custom-checkbox input:checked + label:after { opacity: 1; transform: scale(1); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }


    /* datepicker */
    .datepicker > div table thead tr th { font-weight: 500; font-size: 0.875rem; }
    .datepicker > div table tbody tr td { padding: 0.125rem 0.313rem; border-radius: 0.313rem; }
    .datepicker > div.datepicker-days table tbody tr td { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .datepicker > div.datepicker-months table tbody tr td span { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .datepicker > div.datepicker-years table tbody tr td span { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .datepicker > div.datepicker-days table tbody tr td:hover { background: var(--light) !important; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .datepicker > div.datepicker-months table tbody tr td span:hover { background: var(--light) !important; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .datepicker > div.datepicker-years table tbody tr td span:hover { background: var(--light) !important; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .datepicker > div table tbody tr td.active { background: var(--second) !important; }
    .datepicker > div table tbody tr td .active { background: var(--second) !important; }
    .datepicker.dropdown-menu {
        padding: 0.625rem;
        background-color: var(--white);
        border: none;
        -webkit-border-radius: 0.625rem;
        -moz-border-radius: 0.625rem;
        border-radius: 0.625rem;
        -webkit-box-shadow: 0 0.313rem 0.625rem rgba(0, 0, 0, 0.10);
        -moz-box-shadow: 0 0.313rem 0.625rem rgba(0, 0, 0, 0.10);
        box-shadow: 0 0.313rem 0.625rem rgba(0, 0, 0, 0.10);
        color: var(--dark);
    }
    .datepicker table tr td.day:hover, .datepicker table tr td.day.focused { background: var(--light); }


    /* select2 */
    .select2-container { width: 100% !important; }
    .select2-container.select2-container--open { z-index: 1070; }
    .select2-container .select2-selection--single {
        user-select: none;
        -webkit-user-select: none;
        position: relative;
        display: block;
        width: 100%;
        height: calc(2.5rem + 0.75rem + 2px);
        padding: 0.375rem 0.75rem;
        border-radius: 0.5rem;
        background: var(--light); 
        border: 1px solid var(--border);
        box-shadow: none !important;
        font-weight: 400 !important;
        font-size: 0.938rem !important; 
        line-height: 1.2 !important;
        color: var(--color) !important; 
    }
    .select2-container .select2-selection--single .select2-selection__placeholder { font-weight: 300; font-size: 0.875rem; letter-spacing: 0.02rem; color: var(--color); opacity: 0.3; }
    .select2-container .select2-selection--single .select2-selection__rendered { padding: 0.25rem 0; font-size: 0.825rem !important; line-height: 2rem !important; color: var(--color) !important; }
    .select2-container .select2-selection--single .select2-selection__arrow { height: 100%; position: absolute; top: 0%; right: 0.7rem; }
    .select2-container .select2-selection--single .select2-selection__arrow b { border-style: solid; border-width: 5px 4px 0 4px; border-color: var(--color-2) transparent transparent transparent; margin-left: 0; margin-top: 0; height: 0; width: 0; }
    
    .select2-container .select2-dropdown { background: var(--background-02); backdrop-filter: var(--blur); -webkit-backdrop-filter: var(--blur); border: 1px solid var(--border-02); border-radius: 0.4rem; box-shadow: var(--shadow-accent); overflow: hidden; -webkit-animation-duration: .6s; animation-duration: .6s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeIn; animation-name: fadeIn; }
    .select2-container .select2-dropdown .select2-search { padding: 0.375rem 0.5rem; }
    .select2-container .select2-dropdown .select2-search .select2-search__field { background: var(--background-01) !important; backdrop-filter: var(--blur) !important; -webkit-backdrop-filter: var(--blur) !important; border: 1px solid var(--border-02); border-radius: 0.45rem !important; outline: 0 !important; }
    .select2-container .select2-dropdown .select2-search .select2-search__field:focus { color: var(--color-white); }
    .select2-container .select2-results { max-height: 245px; overflow-y: scroll; }
    .select2-container .select2-results__option { font-weight: 500; font-size: 0.875rem; color: var(--color-white); padding: 0.375rem 0.5rem; border-radius: 0.313rem; -webkit-transition: color .3s, background .3s; -moz-transition: color .3s, background .3s; -ms-transition: color .3s, background .3s; -o-transition: color .3s, background .3s; transition: color .3s, background .3s; }
    .select2-container .select2-results__option--selected, .select2-container .select2-results__option--highlighted { background: var(--gradient-1) !important; -webkit-transition: color .3s, background .3s; -moz-transition: color .3s, background .3s; -ms-transition: color .3s, background .3s; -o-transition: color .3s, background .3s; transition: color .3s, background .3s; }


    /* input file */
    .file-input-custom { position: absolute; left: 0; top: 0; height: 100%; width: 100%; opacity: 0; cursor: pointer; }
    .file-input-custom:focus { outline: none; }
    .input-custom-area * { box-sizing: border-box; }
    .input-custom-area {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 100%;
        height: calc(2.25rem + 0.75rem + 2px);
        padding: 0.375rem 0.75rem;
        border-radius: 0.5rem;
        background: var(--background-01); 
        backdrop-filter: var(--blur); 
        -webkit-backdrop-filter: var(--blur);
        border: 1px solid var(--border-dark-03);
        font-weight: 400;
        font-size: 0.875rem; 
        line-height: 1.2;
        color: var(--color); 
    }
    .input-custom-area.is-active { background-color: rgba(0, 20, 20, 0.03); }
    .input-custom-area .input-custom-btn { display: inline-block; background: var(--gradient-1); border-radius: 0.313rem; padding: 0.5rem 1rem; margin-right: 0.625rem; font-size: 0.75rem; letter-spacing: 0.02rem; color: var(--color-white); }
    .input-custom-area .input-custom-btn:before { content: '\e872'; font-family: 'Feather'; margin-right: 0.313rem; }
    .input-custom-area .input-custom-hint { flex: 1; font-size: 0.75rem; color: var(--color-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .input-custom-area .input-custom-preview { position: relative; }
    .input-custom-area .input-custom-preview a { position: relative; padding-left: 1.5rem; color: var(--success); }
    .input-custom-area .input-custom-preview a:before { content: '\e83f'; font-family: 'feather'; line-height: 1; color: var(--color-white); position: absolute; top: 0; left: 0; width: 1.25rem; height: 1.25rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--success); }


    /* fileupload */
    .fileupload .thumbnail { text-align: left !important; overflow: hidden; height: 6.5rem; border: 1px solid var(--background-01); border-radius: 0.313rem; }
    .fileupload .thumbnail img { width: 100%; max-width: 6.5rem; max-height: 100%; object-fit: contain; object-position: center; }
    .fileupload .btn { padding: 0.35rem 0.625rem !important; font-size: 0.75rem !important; border-radius: 0.313rem; }
    .fileupload .btn i { margin-right: 0.15rem !important; }
    

    /* pin code */
    .pin-code { padding: 0; margin: 0 auto; display: flex; align-items: center; justify-content: center; }
    .pin-code input { text-align: center; width: 4.2rem; height: 4.2rem; font-size: 30px; line-height: 1; background: var(--light); margin-right: 0.625rem; }

    @media only screen and (max-width: 480px) {
        .pin-code input { width: 48px; height: 48px; }
    }


    /* validate */
    .has-error { color: var(--danger) !important; clear: both; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .has-error em, em.has-error { color: var(--danger) !important; font-size: 0.75rem !important; line-height: 1 !important; position: relative; z-index: 20; }
    .has-error > input { border-color: var(--danger) !important; color: var(--dark) !important; }
    .has-error > select { border: 1px solid var(--accent) !important; }
    .has-error > textarea { border: 1px solid var(--accent) !important; }
    input.has-error { border: 1px solid var(--danger) !important; color: var(--danger) !important; }
    textarea.has-error { border: 1px solid var(--danger) !important; color: var(--danger) !important; }
    select.has-error { border: 1px solid var(--danger) !important; color: var(--danger) !important; }
    .input-custom-area.has-error { border: 1px solid var(--danger) !important; }
    .custom-checkbox.has-error > .custom-control-label { color: var(--danger) !important; }
    .custom-checkbox.has-error > .custom-control-label::before { border-color: var(--danger) !important; }
    .has-error > .select2-container .select2-selection--single { border: 1px solid var(--danger) !important; -webskit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .has-error .custom-control-label { border: 1px solid var(--danger); }
/* ------------------------------------ end form style ------------------------------------ */


/* ------------------------------------ background ------------------------------------ */
    .bg-gradiant { background: linear-gradient(150deg, #7ba8ed 0%, var(--accent) 70%, var(--accent) 100%) !important; border: none !important; color: var(--white) !important }

    .bg-overlay {
        background-color: rgba(74,74,74,.7);
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%
    }

    .bg-overlay-gradiant {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(80deg, #7ba8ed 0%,var(--accent) 100%);
        opacity: .9
    }
    
    .bg-primary { background-color: #0076a3 !important }
    .bg-secondary { background-color: #979795 !important }
    .bg-success { background-color: #1d9b7b !important }
    .bg-info { background-color: #24bee6 !important }
    .bg-warning { background-color: #ffb60b !important }
    .bg-danger { background-color: #da3746 !important }
    .bg-light { background-color: #f8f9fc !important }
    .bg-dark { background-color: #183b56 !important }
    .bg-muted { background-color: #838485 !important }
    .bg-purple { background-color: #766df4 !important }
    .bg-blue { background-color: #1f86ef !important }
    .bg-orange { background-color: #e46e2a !important }
    .bg-white-70 { background-color: rgba(255,255,255,.7) !important }

    .bg-accent { background: var(--accent) !important; }
    .bg-second { background: var(--second) !important; }
    .bg-dark { background: var(--dark) !important; }
    .bg-light { background: var(--light) !important; }
    .bg-black { background: var(--black) !important; }
    .bg-white { background: var(--white) !important; }
/* ------------------------------------ end background ------------------------------------ */


/* ------------------------------------ badge ------------------------------------ */
    .badge { position: relative; font-weight: 500; line-height: 1.2; letter-spacing: 0.04rem; padding: 0.5rem 1rem; border-radius: 0.625rem; background: var(--accent); vertical-align: middle; cursor: default; }
    .badge-sm { font-size: 0.7rem; padding: 0.313rem 0.625rem; border-radius: 0.45rem; }
    .badge-md { font-size: 0.875rem; padding: 0.625rem 1rem; border-radius: 0.625rem; }
    .badge-lg { font-size: 0.925rem; padding: 0.825rem 1.25rem; border-radius: 0.925rem; }

    .badge-accent { background: var(--gradient-1); color: var(--color-white) !important; }
    .badge-second { background: var(--second); color: var(--white); }
    .badge-white { background: var(--background); color: var(--color); }
    .badge-primary { background: #13208a; color: var(--white); }
    .badge-secondary { background: #364a63; color: var(--white); }
    .badge-success { background: #15d670; color: var(--white); }
    .badge-info { background: #0da8e0; color: var(--white); }
    .badge-pink { background: #FF586F; color: var(--white); }
    .badge-warning { background: #f4bd0e; color: var(--white); }
    .badge-danger { background: #e85347; color: var(--white); }
    .badge-dark { background: #1c2b46; color: var(--white); }
    .badge-gray { background: #8091a7; color: var(--white); }
    .badge-light { background: #b7c2d0; color: var(--white); }
    .badge-lighter { background: #e5e9f2; color: var(--white); }
    .badge-light { background: var(--light); color: var(--dark); }
    .badge-lime { background: #C9F269; color: #083C2F; }
    .badge-salmon { background: #FF586F; font-weight: 300; color: var(--white); letter-spacing: 0.02rem; padding: 0.25rem 0.625rem; }


    .badge-style-1 { border: 0; }

    .badge-style-1.badge-accent { background: var(--accent); color: var(--white); }
    .badge-style-1.badge-primary { background: var(--accent); color: var(--white); }
    .badge-style-1.badge-secondary { background: rgba(54, 74, 99, 0.1); color: #364a63; }
    .badge-style-1.badge-success { background: rgba(21, 214, 112, 0.1); color: #15d670; }
    .badge-style-1.badge-info { background: rgba(13, 168, 224, 0.1); color: #0da8e0; }
    .badge-style-1.badge-warning { background: rgba(244, 189, 14, 1); color: var(--white); }
    .badge-style-1.badge-danger { background: #CE2C37; color: var(--white); }
    .badge-style-1.badge-dark { background: rgba(28, 43, 70, 0.1); color: #1c2b46; }
    .badge-style-1.badge-gray { background: rgba(128, 145, 167, 0.1); color: #8091a7; }
    .badge-style-1.badge-light { background: rgba(183, 194, 208, 0.1); color: #b7c2d0; }
    .badge-style-1.badge-lighter { background: rgba(229, 233, 242, 0.1); color: #e5e9f2; }


    .badge-style-2 { border: 1px solid currentColor; }

    .badge-style-2.badge-accent { background: rgba(19, 32, 138, 0.1); color: var(--accent); border-color: var(--accent); }
    .badge-style-2.badge-primary { background: rgba(19, 32, 138, 0.1); color: #13208a; border-color: #13208a; }
    .badge-style-2.badge-secondary { background: rgba(54, 74, 99, 0.1); color: #364a63; border-color: #364a63; }
    .badge-style-2.badge-success { background: rgba(21, 214, 112, 0.1); color: var(--accent); border-color: #15d670; }
    .badge-style-2.badge-info { background: rgba(13, 168, 224, 0.1); color: #0da8e0; border-color: #0da8e0; }
    .badge-style-2.badge-warning { background: rgba(244, 189, 14, 0.1); color: #f4bd0e; border-color: #f4bd0e; }
    .badge-style-2.badge-danger { background: rgba(232, 83, 71, 0.1); color: #e85347; border-color: #e85347; }
    .badge-style-2.badge-dark { background: rgba(28, 43, 70, 0.1); color: #1c2b46; border-color: #1c2b46; }
    .badge-style-2.badge-gray { background: rgba(128, 145, 167, 0.1); color: #8091a7; border-color: #8091a7; }
    .badge-style-2.badge-light { background: rgba(183, 194, 208, 0.1); color: #b7c2d0; border-color: #b7c2d0; }
    .badge-style-2.badge-lighter { background: rgba(229, 233, 242, 0.1); color: #e5e9f2; border-color: #e5e9f2; }
/* ------------------------------------ end badge ------------------------------------ */


/* ------------------------------------ button ------------------------------------ */
    .btn {
        position: relative;
        overflow: hidden;
        font-family: var(--font1);
        outline: 0;
        -webkit-box-shadow: none; 
        box-shadow: none;
        border-radius: 0.625rem;
        padding: 1rem 2rem;
        background: var(--gradient-1);
        border: 1px solid var(--accent);
        font-weight: 500;
        font-size: 1rem; 
        line-height: 1.2;
        color: var(--color-white) !important;
        cursor: pointer;
        -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition);
    }
    .btn:hover .btn:focus, .btn.focus { outline: 0; background: var(--accent) !important; color: var(--color-white) !important; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .btn .text { position: relative; -webkit-transition: var(--transition-2); -moz-transition: var(--transition-2); -ms-transition: var(--transition-2); -o-transition: var(--transition-2); transition: var(--transition-2); }
    .btn .icon { font-size: 1rem; width: 1rem; height: 1rem; margin-right: 0.313rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .btn *:has(.icon) { display: inline-flex; align-items: center; }
    .btn .loading-area { position: relative; }
    .btn .loading-area .text { font-weight: 500; margin-left: 0.625rem; }

    .btn-hover-chevron-right:hover { padding-left: 2rem !important; padding-right: 3rem !important; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .btn-hover-chevron-right:after { content: '\ea62'; font-family: 'LineIcons'; position: absolute; top: 0; bottom: 0; right: -1.25rem; display: inline-flex; align-items: center; opacity: 1; visibility: hidden; -webkit-transition: var(--transition-3); -moz-transition: var(--transition-3); -ms-transition: var(--transition-3); -o-transition: var(--transition-3); transition: var(--transition-3); }
    .btn-hover-chevron-right:hover:after { right: 1rem; opacity: 1; visibility: visible; -webkit-transition: var(--transition-3); -moz-transition: var(--transition-3); -ms-transition: var(--transition-3); -o-transition: var(--transition-3); transition: var(--transition-3); }

    .btn-hover-arrow-right:hover { padding-left: 2rem !important; padding-right: 3rem !important; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .btn-hover-arrow-right:after { content: '\ea21'; font-family: 'LineIcons'; position: absolute; top: 0; bottom: 0; right: -1.25rem; display: inline-flex; align-items: center; opacity: 1; visibility: hidden; -webkit-transition: var(--transition-3); -moz-transition: var(--transition-3); -ms-transition: var(--transition-3); -o-transition: var(--transition-3); transition: var(--transition-3); }
    .btn-hover-arrow-right:hover:after { right: 1rem; opacity: 1; visibility: visible; -webkit-transition: var(--transition-3); -moz-transition: var(--transition-3); -ms-transition: var(--transition-3); -o-transition: var(--transition-3); transition: var(--transition-3); }

    .btn-hover-icon-left .icon { position: absolute; top: 0; bottom: 0; left: -1.25rem; display: inline-flex; align-items: center; opacity: 0; visibility: hidden; -webkit-transition: var(--transition-3); -moz-transition: var(--transition-3); -ms-transition: var(--transition-3); -o-transition: var(--transition-3); transition: var(--transition-3); }
    .btn-hover-icon-left:hover { padding-left: 3rem !important; padding-right: 2rem !important; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .btn-hover-icon-left:hover .icon { left: 1.25rem; opacity: 1; visibility: visible; -webkit-transition: var(--transition-3); -moz-transition: var(--transition-3); -ms-transition: var(--transition-3); -o-transition: var(--transition-3); transition: var(--transition-3); }

    .btn-whatsapp { font-size: 0.875rem; color: var(--white) !important; background: #00C064; box-shadow: 0 0.25rem 0.313rem rgba(0, 0, 0, 0.25); border: 0; padding-left: 1.875rem; padding-right: 1.875rem; }
    .btn-whatsapp i { margin-right: 0.313rem; }

    .btn-padd-xs { padding-top: 0.313rem; padding-bottom: 0.313rem; }
    .btn-padd-sm { padding-top: 0.625rem; padding-bottom: 0.625rem; }
    .btn-padd { padding-top: 0.75rem; padding-bottom: 0.75rem; }
    .btn-padd-md { padding-top: 0.875rem; padding-bottom: 0.875rem; }
    .btn-padd-lg { padding-top: 1rem; padding-bottom: 1rem; font-size: 1rem; }

    .btn-block { display: block; width: 100%; text-align: center; }

    .btn-accent { color: var(--color-white) !important; background: var(--accent); border-color: var(--accent); }
    .btn-accent:hover, .btn-accent:focus { color: var(--accent) !important; background: transparent; border-color: var(--accent); box-shadow: none; }
    .btn-accent.fix:hover, .btn-accent.fix:focus { color: var(--color-dark) !important; background: var(--accent); border-color: var(--accent); }
    .btn-accent.hv-shadow:hover, .btn-accent.hv-shadow:focus { box-shadow: var(--shadow-accent) !important; }
    .btn-accent svg path { fill: var(--color-white); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .btn-accent:hover svg path, .btn-accent:focus svg path { fill: var(--accent); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .btn.btn-accent-2 { color: var(--color-white) !important; background: var(--gradient-accent); }
    .btn.btn-accent-2:hover { background: linear-gradient(60deg, rgba(24, 236, 251, 0.7) 0%, rgba(24, 236, 251, 0.4) 50.5%, rgba(24, 236, 251, 0.2) 99%); -webkit-box-shadow: 0 0 4.5rem rgba(24, 237, 251, 0.75); box-shadow: 0 0 4.5rem rgba(24, 237, 251, 0.75); }

    .btn-outline-accent { color: var(--accent) !important; background: transparent; border-color: var(--accent); }
    .btn-outline-accent:hover, .btn-outline-accent:focus { color: var(--white) !important; background-color: var(--accent); }

    .btn-second { color: var(--white) !important; background: var(--second); border-color: var(--second); }
    .btn-second:hover, .btn-second:focus { color: var(--second) !important; background: transparent; border-color: var(--second); box-shadow: none; }
    .btn-second.fix:hover, .btn-second.fix:focus { color: var(--color-dark) !important; background: var(--second); border-color: var(--second); }
    .btn-second.hv-shadow:hover, .btn-second.hv-shadow:focus { box-shadow: var(--shadow-accent) !important; }
    .btn-second svg path { fill: var(--color-white); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .btn-second:hover svg path, .btn-second:focus svg path { fill: var(--second); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .btn.btn-second-2 { color: var(--color-white) !important; background: var(--gradient-second); box-shadow: var(--shadow-second); }
    .btn.btn-second-2:hover { background: linear-gradient(60deg, rgba(255, 0, 183, 0.7) 0%, rgba(255, 0, 183, 0.4) 50.5%, rgba(255, 0, 183, 0.2) 99%); -webkit-box-shadow: 0 0 4.5rem rgba(255, 0, 183, 0.75); box-shadow: 0 0 4.5rem rgba(255, 0, 183, 0.75); }

    .btn-outline-second { color: var(--second); background: transparent; border-color: var(--second); }
    .btn-outline-second:hover, .btn-outline-second:focus { color: var(--white) !important; background-color: var(--second) !important; }
    
    .btn-light { color: var(--color-dark) !important; background: var(--light); border-color: var(--light); }
    .btn-light:hover, .btn-light:focus { color: var(--color) !important; background: transparent; border-color: var(--light); }

    .btn.btn-light-2 { color: var(--color) !important; background: var(--background-02); border-color: var(--background-03); }
    .btn.btn-light-2:hover { background: linear-gradient(60deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.4) 50.5%, rgba(255, 255, 255, 0.2) 99%); -webkit-box-shadow: 0 0 4.5rem rgba(255, 255, 255, 0.15); box-shadow: 0 0 4.5rem rgba(255, 255, 255, 0.15); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .btn-outline-light { color: var(--light) !important; background: transparent; border-color: var(--light); }
    .btn-outline-light:hover, .btn-outline-light:focus { color: var(--dark) !important; background-color: var(--light); }

    .btn-white { color: var(--dark) !important; background: var(--white); border-color: var(--white); }
    .btn-white:hover, .btn-white:focus { color: var(--dark) !important; background: var(--white); border-color: var(--white); }

    .btn-white-2 { position: relative; border-color: var(--white); }
    .btn-white-2:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--white); }
    .btn-white-2 span { position: relative; background: linear-gradient(101deg, #02984F 17.06%, #1D5C75 79.87%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

    .btn-outline-white { color: var(--white) !important; background: transparent; border-color: var(--white); }
    .btn-outline-white:hover, .btn-outline-white:focus { color: var(--dark) !important; background-color: var(--white); }

    .btn-dark { color: var(--white) !important; background: var(--dark); border-color: var(--dark); }
    .btn-dark:hover, .btn-dark:focus { color: var(--dark) !important; background: transparent; border-color: var(--dark); }

    .btn-outline-dark { color: var(--dark) !important; background: transparent; border-color: var(--dark); }
    .btn-outline-dark:hover, .btn-outline-dark:focus { color: var(--white) !important; background-color: var(--dark); }

    .btn-danger { color: var(--white) !important; background: var(--danger); border: 1px solid var(--danger); }
    .btn-danger:hover, .btn-danger:focus { color: var(--danger) !important; background: transparent; }

    .btn-outline-danger { color: var(--danger) !important; background: transparent; border: 1px solid var(--danger); }
    .btn-outline-danger:hover, .btn-outline-danger:focus { color: var(--white) !important; background-color: var(--danger); }

    .btn-yellow { color: var(--color) !important; background: var(--yellow); border-color: var(--yellow); }
    .btn-yellow:hover, .btn-yellow:focus { color: var(--color) !important; -webkit-box-shadow: 0 0 4.5rem rgba(255, 0, 183, 0.75); box-shadow: 0 0 4.5rem rgba(253, 206, 1, 0.75); border-color: var(--yellow); }
    .btn-yellow.fix:hover, .btn-yellow.fix:focus { color: var(--color) !important; background: var(--yellow); border-color: var(--yellow); }
/* ------------------------------------ end button ------------------------------------ */


/* ------------------------------------ accordion ------------------------------------ */
    .accordion { width: 100%; }
    .accordion-item { position: relative; overflow: hidden; border-radius: 1rem !important; background: var(--background-01); -webkit-backdrop-filter: var(--blur); backdrop-filter: var(--blur); border: 0; margin-bottom: 1.25rem; }
    .accordion-item .accordion-head { position: relative; width: 100%; background: transparent; padding: 1rem 1.25rem; border: 0; text-align: left; font-weight: 600; color: var(--color); }
    .accordion-item .accordion-head:before { content: '\e844'; font-family: 'Feather'; transform: rotate(90deg); font-size: 1rem; color: var(--accent) !important; position: absolute; top: 1rem; right: 1rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .accordion-item .accordion-head.collapsed:before { transform: rotate(0deg); color: var(--accent) !important; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .accordion-item .accordion-body { padding: 0 1.25rem 1rem 1.25rem; }

    @media only screen and (max-width: 480px) {
        .accordion-item .accordion-head { padding: 0.625rem 2.3rem 0.625rem 1rem; }
        .accordion-item .accordion-head:before { top: 0.625rem; }
        .accordion-item .accordion-body { padding: 0 1rem 0.625rem 1rem; }
    }
/* ------------------------------------ end accordion ------------------------------------ */


/* ------------------------------------ modal ------------------------------------ */
    .modal-style:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(2, 2, 2, 0.1); backdrop-filter: var(--blur); -webkit-backdrop-filter: var(--blur); }
    .modal-style .modal-content { overflow: hidden; border: 0; background: var(--background); border-radius: 1rem; box-shadow: var(--shadow); }
    .modal-style .inner-modal { position: relative; overflow: hidden; padding: 1.875rem; }
    .modal-style .inner-modal .close { position: absolute; top: 0.625rem; right: 0.625rem; width: 1.875rem; height: 1.875rem; border-radius: 50%; background: var(--background-02); border: 0; box-shadow: 0; z-index: 10; opacity: 0.5; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .modal-style .inner-modal .close:before { content: '\e8f6'; font-family: 'feather'; font-size: 1rem; color: var(--color-white); }
    .modal-style .inner-modal .close:hover { opacity: 1; transform: scale(0.95); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .modal-style .modal-title { font-size: 1.25rem; line-height: 1.3; color: var(--dark); }

    .modal-style .modal-body.padd-md { padding: 1.25rem; }
    .modal-style .modal-body.padd-md .close { top: 0.938rem; right: 0.938rem; }
    .modal-style .modal-body.padd-lg { padding: 1.875rem; }

    .modal-style.style-2 .modal-content { background: var(--gradient-1); }

    .auth-modal .inner-modal { padding: 3.2rem 1.875rem; }

    @media (max-width: 580px) {
        .modal-style .inner-modal { padding: 1.875rem 0.938rem; }
    }


    /* verification register */
    .verification-modal .inner-modal { text-align: center; }
    .verification-modal .icon { margin-bottom: 1.25rem; }
    
    @media (max-width: 580px) {
        .verification-modal .icon svg { width: 6.25rem; height: 6.25rem; }
    }

    /* event info */
    .event-info-modal .event-info-area { padding: 1.875rem 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
    .event-info-modal .event-info-area .info { width: calc(100% - 150px); z-index: 2; }
    .event-info-modal .event-info-area .thumb { position: absolute; top: 0; right: 0; transform: translateY(-2.5rem) rotate(-25deg); z-index: 1; }
    .event-info-modal .event-info-area .thumb { max-width: 14.25rem; opacity: 0.3; }

    @media (max-width: 992px) {
        .event-info-modal .event-info-area .info { width: calc(100%); }
        .event-info-modal .event-info-area .thumb { max-width: 14.25rem; opacity: 0.15; }
    }
/* ------------------------------------ end modal ------------------------------------ */


/* ------------------------------------ swiper slider ------------------------------------ */
    .swiper-container { position: relative; height: 100%; }
    .swiper-button-next, .swiper-button-prev {
        width: calc(var(--swiper-navigation-size)/ 44 * 27);
        height: var(--swiper-navigation-size);
        margin-top: calc(0.313rem - (var(--swiper-navigation-size)/ 2));
        z-index: 10;
        color: var(--dark);
    }
    .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { opacity: .35; cursor: auto; pointer-events: none; }

    .swiper-button-next:after, .swiper-button-prev:after { font-family: swiper-icons; font-size: 1.875rem; line-height: 1; letter-spacing: 0; text-transform: none; font-variant: initial; }
    .swiper-button-prev { left: -0.625rem; right: auto; }
    .swiper-button-prev:after { content: 'prev'; }
    .swiper-button-next { right: -0.625rem; left: auto; }
    .swiper-button-next:after { content: 'next'; }

    .swiper-button-lg:after { font-size: 2.5rem; }

    .swiper-button.style-1 { color: var(--color-3); opacity: 0.5; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .swiper-button.style-1:hover { opacity: 0.8; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .swiper-button-prev.style-1 { left: 1.25rem; }
    .swiper-button-next.style-1 { right: 1.25rem; }

    @media screen and (max-width: 580px) {
        .swiper-button.style-1 { opacity: 0.3; }
    }

    .swiper-button.style-2 { background: var(--background); border: 1px solid var(--light-2); width: 3.2rem; height: 3.2rem; border-radius: 50%; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .swiper-button.style-2:after { font-size: 1.35rem; color: var(--dark); }
    .swiper-button.style-2:hover { box-shadow: 0 1.45rem 2.5rem rgba(208, 231, 243, 0.7); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    
    .swiper-button-area { position: relative; display: inline-block; }
    .swiper-button-area .swiper-button { position: relative; display: inline-flex; }
    .swiper-button-area .swiper-button-prev { left: 0; right: inherit; }
    .swiper-button-area .swiper-button-next { left: inherit; right: 0; }

    .swiper-pagination-bullet { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .swiper-pagination-bullet.swiper-pagination-bullet-active { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .swiper-pagination-bullet-active { background: var(--accent) !important; }

    .swiper-pagination.pagination-bullet-2 .swiper-pagination-bullet { width: 0.6rem; height: 0.6rem; background: var(--dark); border: 1px solid transparent; opacity: 0.3; }
    .swiper-pagination.pagination-bullet-2 .swiper-pagination-bullet:not(:last-child) { margin-right: 0.313rem; }
    .swiper-pagination.pagination-bullet-2 .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 1.825rem; height: 0.6rem; border-radius: 0.25rem; opacity: 1; background: var(--accent) !important; }

    .swiper-pagination-line .swiper-pagination-bullet { width: 1.825rem; border-radius: 3.125rem; background: var(--dark); opacity: 1; }
    .swiper-pagination-line .swiper-pagination-bullet:not(:last-child) { margin-right: 0.313rem; }
    .swiper-pagination-line .swiper-pagination-bullet.swiper-pagination-bullet-active { width: 3.125rem; background: var(--white) !important; opacity: 1; }

    .swiper-pagination.bottom { bottom: 0 !important; }
    .swiper-pagination.offset-bottom { bottom: -1.75rem !important; }
/* ------------------------------------ end swiper slider ------------------------------------ */


/* ------------------------------------ header ------------------------------------ */
    /* top header */
    .top-header { position: relative; padding: 0.625rem 0; background: var(--gradient-1); }
    .top-header .top-header-inner { display: flex; align-items: center; justify-content: flex-end; gap: 1.875rem; }
    .top-header .top-header-inner .top-header-item { display: flex; align-items: center; justify-content: flex-start; gap: 0.5rem; }
    .top-header .top-header-inner .top-header-item .icon { width: 1rem; height: 1rem; }
    .top-header .top-header-inner .top-header-item .label { line-height: 1.2; color: var(--color-white); }

    @media (max-width: 992px) {
        .top-header .top-header-inner { justify-content: center; gap: 1.25rem; }
    }
    @media (max-width: 580px) {
        .top-header .top-header-inner { gap: 1rem; }
        .top-header .top-header-inner .top-header-item { gap: 0.313rem; }
    }

    /* header */
    .header { position: sticky; top: 0; left: 0; right: 0; padding: 0; z-index: 100; width: 100%; background: var(--background); border-bottom: 1px solid var(--border); -webkit-transition: background .1s ease; -moz-transition: background .1s ease; -ms-transition: background .1s ease; -o-transition: background .1s ease; transition: background .1s ease; }
    .header.slide-down { -webkit-animation: slide-down 0.5s; animation: slide-down 0.5s; }
    .header.slide-up { -webkit-animation: slide-up 0.5s; animation: slide-up 0.5s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }

    .header .header-inner { display: flex; align-items: center; justify-content: space-between; gap: 2.5rem; width: 100%; }
    .header .header-inner .header-logo { display: inline-block; }
    .header .header-inner .header-logo .logo-img { object-fit: contain; max-width: 11rem; max-height: 2.5rem; }
    
    .header-nav .main-navigation { display: flex; align-items: stretch; flex-direction: row; flex-wrap: nowrap; gap: 1.875rem; }
    .header-nav .main-navigation .nav-item { list-style: none; padding: 0; margin: 0; padding-left: 0; }
    .header-nav .main-navigation .nav-item a.nav-link { position: relative; display: flex; align-items: center; justify-content: center; text-align: center; padding: 1.25rem 0; font-weight: 500; font-size: 1rem; line-height: 1.2; color: var(--color); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .header-nav .main-navigation .nav-item a.nav-link:hover { color: var(--accent); }

    .header-bars { background: none; border: 0; box-shadow: none; outline: 0; width: 3rem; cursor: pointer; padding: 0; display: none; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .header-bars::after { display: table; clear: both }
    .header-bars .bar { display: block; height: 0.2rem; border-radius: 0.5rem; background: var(--color); margin: 0.25rem 0; float: right; }
    .header-bars .bar.bar-1 { width: 100%; }
    .header-bars .bar.bar-2 { width: 75%; }
    .header-bars .bar.bar-3 { width: 50%; }

    .header-bars.close-navigation { display: none; position: absolute; top: calc(0.625rem); right: 4rem; height: 3rem; }
    .header-bars.close-navigation .bar { margin: -0.17rem 0; float: none; }
    .header-bars.close-navigation .bar.bar-1 { width: 100%; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
    .header-bars.close-navigation .bar.bar-2 { opacity: 0; }
    .header-bars.close-navigation .bar.bar-3 { width: 100%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

    .header-nav .main-navigation .nav-item.dropdown .nav-link:after { content: '\e842'; font-family: 'Feather'; }
    .header-nav .main-navigation .nav-item.dropdown .nav-link[aria-expanded="true"]:after { transform: rotate3d(360deg); }

    /* .header.shrink { background: var(--background); } */
    
    @media (max-width: 1200px) {
        .header-nav .main-navigation { gap: 1.25rem; }
    }
    @media (max-width: 992px) {
        .header { padding: 0.75rem 0; }

        .header-nav {
            position: fixed;
            top: 0;
            right: -100%;
            opacity: 0;
            width: 100%;
            height: 100vh;
            background: var(--background);
            display: flex; 
            flex-direction: column;
            flex-wrap: inherit;
            overflow-y: auto;
            overflow-x: hidden;
            -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition);
        }
        .header-nav::-webkit-scrollbar { display: none; }
        .header-nav.shown { right: 0; opacity: 1; }

        .header-bars { display: block; }
        .header-bars.close-navigation { display: block }

        .header-nav .main-navigation { flex-direction: column; gap: 0.625rem; width: 100%; padding: 4rem 4rem; }
        .header-nav .main-navigation .nav-item { position: relative; width: 100%; }
        .header-nav .main-navigation .nav-item:not(:last-child):before { content: ''; position: absolute; bottom: calc(-1rem / 2); left: 0; width: 100%; height: 1px; background: var(--border); opacity: 0.35; }
        .header-nav .main-navigation .nav-item a.nav-link { justify-content: flex-start; padding: 1rem 0; }

        .header-nav .main-navigation .nav-item.dropdown .dropdown-menu { position: relative !important; padding-top: 0; border: 0; box-shadow: none; }
        .header-nav .main-navigation .nav-item.dropdown .dropdown-menu.show { transform: translate(0, 0) !important; }
    }
    @media (max-width: 768px) {
        .header-bars { width: 2.5rem; }
        .header-bars .bar { margin: 0.2rem 0; }
    }
    @media (max-width: 580px) {
        .header .header-inner .header-logo .logo-img { max-width: 8rem; }

        .header-bars.close-navigation { right: 1.25rem; }

        .header-nav .main-navigation { padding: 4rem 1rem; }
    }

    .mega-menu .nav-link:after { content: '\e842'; font-family: 'Feather'; }
    .mega-menu .mega-content { position: absolute; top: 101%; left: 0; right: 0; width: 100%; height: auto; padding: 1.25rem 0; background: var(--background); opacity: 0; visibility: hidden; box-shadow: 0 4px 8px -2px rgba(18, 26, 43, 0.05), 0 2px 6px -2px rgba(18, 26, 43, 0.03); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .mega-menu .mega-content .mega-area { display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; gap: 1rem; }
    .mega-menu .mega-content .mega-area .mega-item { position: relative; overflow: hidden; width: calc(100% / 3 - 1rem); padding: 1.25rem; border-radius: 1rem; }
    .mega-menu .mega-content .mega-area .mega-item:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--light); border-radius: 1rem; transform: scale(0.85); visibility: hidden; opacity: 0; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .mega-menu .mega-content .mega-area .mega-item:hover:before { transform: scale(1); visibility: visible; opacity: 1; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .mega-menu .mega-content .mega-area .mega-item * { position: relative; }
    .mega-menu .mega-content .mega-area .mega-item .mega-title { display: flex; align-items: center; gap: 0.625rem; margin-bottom: 0.625rem; }
    .mega-menu .mega-content .mega-area .mega-item .mega-title .icon { flex-shrink: 0; width: 24px; height: 24px; }
    .mega-menu .mega-content .mega-area .mega-item .mega-title .label { font-weight: 500; color: var(--color); }
    .mega-menu .mega-content .mega-area .mega-item .mega-description { color: var(--color-3); margin-bottom: 0.313rem; }

    @media (min-width: 991px) {
        .mega-menu:hover .mega-content { opacity: 1; visibility: visible; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    }
    @media (max-width: 992px) {
        .mega-menu .mega-content { top: 0; padding: 0.313rem 0 1rem 0.313rem; box-shadow: none; -webkit-transition: var(--transition-none); -moz-transition: var(--transition-none); -ms-transition: var(--transition-none); -o-transition: var(--transition-none); transition: var(--transition-none); }
        .mega-menu.mgshow .mega-content { position: relative; opacity: 1; visibility: visible; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
        .mega-menu .mega-content .container { padding-left: 0; padding-right: 0; max-width: 100%; }
        .mega-menu .mega-content .mega-area .mega-item { width: calc(100% / 2 - 1rem); padding: 1rem; }
    }
    @media (max-width: 768px) {
        .mega-menu .mega-content .mega-area { flex-direction: column; }
        .mega-menu .mega-content .mega-area .mega-item { width: calc(100%); }
    }
/* ------------------------------------ end header ------------------------------------ */


/* ------------------------------------ components ------------------------------------ */
    /* section-title */
    .section-title { position: relative; z-index: 4; width: 100%; margin-bottom: 2.5rem; }
    .section-title.center { text-align: center; }
    .section-title .subtitle { font-weight: 500; letter-spacing: 0.02rem; color: var(--red); margin-bottom: 0.313rem; }
    .section-title .title { font-weight: 500; line-height: 1.4; color: var(--color); margin-bottom: 0; }
    .section-title .description, .description { font-weight: 300; color: var(--color-2); }

    .section-title.between { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.625rem; }
    .section-title.between > div:nth-child(2) { flex-shrink: 0; }
    
    .section-title.white .title { color: var(--color-white) !important; }
    .section-title.white .description { color: var(--color-white-2) !important; }

    .section-title.style-2 { margin-bottom: 3.2rem; }
    .section-title.style-2:before { content: ''; position: absolute; bottom: calc(-3.2rem / 2); left: 0; width: 100%; height: 1px; background: var(--border); }

    .section-title .brand-img { width: 100%; max-width: 500px; }
    
    @media (max-width: 1200px) {
        .section-title { margin-bottom: 1.375rem; }
    }
    @media (max-width: 992px) {
        .section-title { margin-bottom: 1.25rem; }
    }
    @media (max-width: 768px) {
        .section-title .brand-img { max-width: 400px; }
    }
    @media (max-width: 580px) {
        .section-title .brand-img { max-width: 350px; }
    }


    /* back to top */
    .back-to-top {
        position: fixed;
        bottom: -10%;
        right: 1rem;
        width: 2.5rem;
        height: 2.5rem;
        border-radius: 1.25rem;
        border: 0;
        z-index: 99;
        text-align: center;
        cursor: pointer;
        background: none;
        border: 1px solid var(--border);
        box-shadow: 0 0.25rem 0.625rem 0 rgba(0, 0, 0, 0.02);
        visibility: hidden;
        opacity: 0;
        -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition);
    }
    .back-to-top:before { content: '\e845'; font-family: 'Feather'; font-size: 1rem; color: var(--accent); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .back-to-top.active { bottom: 1rem; visibility: visible; opacity: 0.7; }
    .back-to-top:hover, .back-to-top:focus { opacity: 1; background: var(--gradient-1); border-color: var(--accent); box-shadow: 0 1rem 1.25rem rgba(54, 56, 72, 0.09); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .back-to-top:hover:before, .back-to-top:focus:before { color: var(--color-white); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    @media (max-width: 580px) {
        .back-to-top { bottom: 0.938rem; right: 0.938rem; width: 2.5rem; height: 2.5rem; }
        .back-to-top:before { font-size: 1.2rem; }
        .back-to-top.active { bottom: 1rem; opacity: 0.4; }
    }


    .emg-section { position: fixed; bottom: 20%; right: 0; height: auto; z-index: 10; }
    .emg-section .emg-area { display: flex; align-items: flex-start; justify-content: flex-start; flex-direction: column; gap: 0.25rem; }
    .emg-section .emg-area .emg-item { width: 150px; transform: translateX(100px); display: flex; align-items: center; justify-content: flex-start; gap: 0.875rem; padding: 1rem 0.875rem; background: var(--gradient-1); border: 1px solid var(--light-2); border-radius: 0.625rem 0 0 0.625rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .emg-section .emg-area .emg-item .label { line-height: 1.1; color: var(--color-white); }
    .emg-section .emg-area .emg-item:hover { transform: translateX(0); gap: 0.313rem; box-shadow: var(--shadow-sm); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .emg-section .emg-area .emg-item.main-item { display: none; position: relative; margin-top: 0.625rem; }
    .emg-section .emg-area .emg-item.main-item:before { content: ''; position: absolute; top: -20%; left: -20%; width: 140%; height: 140%; border-radius: 50%; z-index: -1; background: var(--gradient-1); -webkit-animation: phonering-alo-circle-anim 1.2s infinite ease-in-out; animation: phonering-alo-circle-anim 1.2s infinite ease-in-out; }
    .emg-section .emg-area .emg-item.main-item:after { content: ''; position: absolute; top: -23%; left: -23%; width: 146%; height: 146%; border-radius: 50%; z-index: -1; background: transparent; border: 2px solid var(--accent); opacity: 0.1; -webkit-animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out; animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out; }
    .emg-section .emg-area .emg-item.main-item .icon { -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out; animation: phonering-alo-circle-img-anim 1s infinite ease-in-out; }

    @media (max-width: 992px) {
        .emg-section { bottom: 4.25rem; right: 0.938rem; }
        .emg-section .emg-area { gap: 0.5rem }
        .emg-section .emg-area .emg-item { width: 2.875rem; height: 2.875rem; padding: 0.313rem; align-items: center; justify-content: center; border-radius: 50%; transform: translateX(0); }
        .emg-section .emg-area .emg-item .icon svg { width: 1.25rem; height: 1.25rem; }
        .emg-section .emg-area .emg-item .label { display: none; }

        .emg-section .emg-area .emg-item.main-item { display: flex; }
        .emg-section .emg-area .emg-item:not(.main-item) { transform: translateY(1.25rem); visibility: hidden; opacity: 0; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
        .emg-section.emg-show .emg-area .emg-item:not(.main-item) { transform: translateY(0); visibility: visible; opacity: 1; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    }

    @-webkit-keyframes phonering-alo-circle-anim {
        0% { -webkit-transform: rotate(0) scale(0.5) skew(1deg); -webkit-opacity: 0.1; }
        30% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); -webkit-opacity: 0.5; }
        100% { -webkit-transform: rotate(0) scale(1) skew(1deg); -webkit-opacity: 0.1; }
    }
    @-webkit-keyframes phonering-alo-circle-fill-anim {
        0% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); opacity: 0.2; }
        50% { -webkit-transform: rotate(0) scale(1) skew(1deg); opacity: 0.2; }
        100% { -webkit-transform: rotate(0) scale(0.7) skew(1deg); opacity: 0.2; }
    }
    @-webkit-keyframes phonering-alo-circle-img-anim {
        0% { -webkit-transform: rotate(0) scale(1) skew(1deg); }
        10% { -webkit-transform: rotate(-25deg) scale(1) skew(1deg); }
        20% { -webkit-transform: rotate(25deg) scale(1) skew(1deg); }
        30% { -webkit-transform: rotate(-25deg) scale(1) skew(1deg); }
        40% { -webkit-transform: rotate(25deg) scale(1) skew(1deg); }
        50% { -webkit-transform: rotate(0) scale(1) skew(1deg); }
        100% { -webkit-transform: rotate(0) scale(1) skew(1deg); }
    }


    /* load more */
    .load-more-area { text-align: center; margin-top: 1.875rem; }

    /* no result */
    .no-more-result { position: relative; padding: 2.5rem; border-radius: 0.938rem; text-align: center; max-width: 768px; margin: auto; display: flex; align-items: center; flex-direction: column; background: var(--white); }
    .no-more-result img, .no-more-result svg { object-fit: contain; max-width: 11rem; max-height: 11rem; margin-bottom: 1.25rem; }
    .no-more-result h2 { color: var(--color-2) !important; margin-bottom: 0.625rem !important; }
    .no-more-result p { letter-spacing: 0.04rem !important; color: var(--color-2) !important; margin-bottom: 0 !important; }
    
    @media (max-width: 1400px) {
        .no-more-result img, .no-more-result svg { max-width: 9rem; max-height: 9rem; }
    }
    @media (max-width: 1200px) {
        .no-more-result img, .no-more-result svg { max-width: 8rem; max-height: 8rem; }
    }
    @media (max-width: 580px) {
        .no-more-result { padding: 2.5rem 0.938rem; }
    }

    /* card */
    .card { border: 0; border-radius: 0.625rem; }

    .tooltip .tooltip-inner { font-family: var(--font1); letter-spacing: 0.02rem; min-width: 280px; background: var(--gradient-1); backdrop-filter: var(--blur); -webkit-backdrop-filter: var(--blur); border: 1px solid var(--border-02); border-radius: 0.4rem; box-shadow: var(--shadow-accent); }


    /* dropdown */
    .dropdown-menu { position: absolute !important; background: var(--background); border: 1px solid var(--light); padding: 0.45rem; border-radius: 0.625rem; box-shadow: var(--shadow-sm); z-index: 20; }
    .dropdown-item { position: relative; font-weight: 400; color: var(--color-2); padding: 0.5rem; border-radius: 0.5rem; display: inline-flex; align-items: center; margin: 0; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .dropdown-item:not(:last-child) { margin-bottom: 0.25rem; }
    .dropdown-item a { color: var(--color-2) !important; }
    .dropdown-item:hover { background: var(--light); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .dropdown-item:hover a { color: var(--color-2) !important; }
    .dropdown-item .icon { width: 1.25rem; margin-right: 0.625rem; }


    /* alert */
    .alert { position: relative; padding: 1rem; border-radius: 0.5rem; background: var(--white); border: 1px solid var(--border); box-shadow: var(--shadow-sm); }
    .alert .btn-close { position: absolute; top: 0.625rem; right: 0.625rem; padding: 0; font-size: 0.875rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .alert .btn-close:hover { transform: rotate(20deg); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .alert .btn-close:focus { outline: 0; box-shadow: none; }
    .alert .alert-inner { display: flex; align-items: center; }
    .alert .alert-inner .alert-icon { position: relative; margin-right: 1rem; }
    .alert .alert-inner .alert-icon i { position: relative; font-size: 1.75rem; z-index: 2; }
    .alert .alert-inner .alert-icon svg { max-width: 1.45rem; max-height: 1.45rem; transform: translateY(-1px); }
    .alert .alert-inner .alert-text { font-size: 0.875rem; padding-right: 1rem; }


    /* hero */
    .hero-section { position: relative; display: flex; align-items: center; justify-content: center; background: var(--background); }
    .hero-section.style-1:before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(-5deg, rgba(255, 255, 255, 0.5) -10%, rgba(255, 255, 255, 0) 100%); z-index: 1; }
    .hero-section .hero-cover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; z-index: 0; opacity: 0.7; }
    .hero-section .content { position: relative; z-index: 3; }
    .hero-section.hero-sm { height: 10rem; padding: 2.5rem 0; }
    .hero-section.hero-md { height: 23.5rem; padding: 2.5rem 0; }
    .hero-section.hero-lg { height: 26rem; padding: 2.5rem 0; }


    /* nav tabs */
    .nav-tabs-style { position: relative; overflow: hidden; padding: 0; border: 0; }
    .nav-tabs-style .nav-item { background: none; border: 0; padding: 0; margin: 0; }
    .nav-tabs-style .nav-item .nav-link {
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 100%;
        border: 0;
        border-radius: 0.45rem;
        padding: 0.75rem 1.875rem;
        font-weight: 500;
        color: var(--color-3);
        text-align: center;
        -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition);
    }
    .nav-tabs-style .nav-item .nav-link:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--accent); visibility: hidden; opacity: 0; z-index: -1; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .nav-tabs-style .nav-item .nav-link.active { background: var(--light); color: var(--color); }

    .nav-tabs-style.style-2 .nav-item .nav-link.active { background: var(--gradient-1); color: var(--color-white); }

    @media screen and (max-width: 768px) {
        .nav-tabs-style .nav-item .nav-link { padding: 0.5rem 1.5rem; }
    }


    /* social media */
    .social-media { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 0 0.313rem; }
    .social-media .social-item { position: relative; }
    .social-media .icon {
        position: relative;
        overflow: hidden;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 2.3rem;
        height: 2.3rem;
        cursor: pointer;
        text-align: center;
        background: transparent;
        color: var(--color) !important;
        -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition);
    }
    .social-media .icon img { object-fit: contain; max-width: 24px; }
    .social-media .icon:before { content: ''; border-radius: 0.5rem; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; transform: scale(0.8); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .social-media .icon:hover:before { transform: scale(1); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .social-media .icon i { position: relative; z-index: 2; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .social-media.style-2 .icon { position: relative; background: var(--light); border: 0; border-radius: 0.625rem; color: var(--color) !important; z-index: 2; }
    .social-media.style-2 .icon:before { border-radius: 0.625rem; }

    .social-media .icon.facebook:hover i { color: var(--color-white) !important; }
    .social-media .icon.facebook:hover:before { background: #4267B2; }

    .social-media .icon.twitter:hover i { color: var(--color-white) !important; }
    .social-media .icon.twitter:hover:before { background: #1DA1F2; }

    .social-media .icon.instagram:hover i { color: var(--color-white) !important; }
    .social-media .icon.instagram:hover:before { background: #E1306C;  }

    .social-media .icon.whatsapp:hover i { color: var(--color-white) !important; }
    .social-media .icon.whatsapp:hover:before { background: #25D366; }

    .social-media .icon.telegram:hover i { color: var(--color-white) !important; }
    .social-media .icon.telegram:hover:before { background: #0088CC; }

    .social-media .icon.linkedin:hover i { color: var(--color-white) !important; }
    .social-media .icon.linkedin:hover:before { background: #2867B2; }

    .social-media .icon.youtube:hover i { color: var(--color-white) !important; }
    .social-media .icon.youtube:hover:before { background: #FF0000; }


    /* meta info */
    .post-meta-info { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 0.313rem 0.45rem; }
    .post-meta-info span { font-weight: 400; line-height: 1.2; color: var(--color-3); }
    .post-meta-info span .icon { color: var(--color4); }
    .post-meta-info.dot-divider > *:not(:last-child) { position: relative; margin-right: 0.45rem; }
    .post-meta-info.dot-divider > *:not(:last-child):before { content: ''; position: absolute; top: 0; bottom: 0; right: -0.625rem; margin: auto; width: 0.25rem; height: 0.25rem; border-radius: 50%; background: var(--color4); }


    /* post */
    .post { position: relative; z-index: 4; width: 100%; height: 100%; background: var(--background); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .post .post-head { position: relative; overflow: hidden; width: 100%; aspect-ratio: 3/2; border-radius: 1rem; margin-bottom: 0.625rem; }
    .post .post-head .post-img { object-fit: cover; object-position: center; width: 100%; height: 100%; margin: auto; -webkit-transition: 6s ease; -moz-transition: 6s ease; -ms-transition: 6s ease; -o-transition: 6s ease; transition: 6s ease; }
    .post .post-head .badge { position: absolute; left: 0.625rem; bottom: 0.625rem; }
    .post .post-body { position: relative; overflow: hidden; }
    .post .post-body .post-title { font-weight: 500; line-height: 1.4; color: var(--color); margin-bottom: 0.5rem; overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical; }
    .post .post-body .post-description { overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical; }

    /* post hover zoom image */
    .post.hv-zoom .post-head { position: relative; overflow: hidden; }
    .post.hv-zoom .post-head img:not(.fix) { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .post.hv-zoom:hover .post-head img:not(.fix) { -webkit-transform: scale(1.08); -moz-transform: scale(1.08); -ms-transform: scale(1.08); -o-transform: scale(1.08); transform: scale(1.08); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .post.post-2 { overflow: hidden; padding: 0.625rem; border-radius: 1rem; }
    .post.post-2:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--light); border-radius: 1rem; transform: scale(0.85); visibility: hidden; opacity: 0; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .post.post-2:hover { box-shadow: var(--shadow-xs); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .post.post-2:hover:before { transform: scale(1); visibility: visible; opacity: 1; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .post.post-hr { display: flex; align-items: flex-start; gap: 0.625rem; }
    .post.post-hr .post-head { flex-shrink: 0; width: 31%; border-radius: 0.625rem; margin-bottom: 0; }
    .post.post-hr .post-head .post-img { height: auto; }
    .post.post-hr .post-title { -webkit-line-clamp: 3 !important; }

    .post.post-service .post-body .post-description { -webkit-line-clamp: 2 !important; }
    .post.post-service .post-action { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.625rem; margin-top: 0.625rem; }

    @media (max-width: 580px) {
        .post.post-service .post-action .btn { padding: 0.625rem 1rem; }
    }

    .price { font-weight: 700; letter-spacing: -0.04rem; }


    /* video area */
    .video-area { position: relative; overflow: hidden; width: 100%; aspect-ratio: 16/9; border-radius: 0.625rem; display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-accent); }
    .video-area .video-thumb { object-fit: cover; object-position: center; width: 100%; height: 100%; }
    .video-area .play-button-video { position: absolute; z-index: 5; }


    /* play button video */
    .play-button-video {
        width: 3rem; 
        height: 3rem; 
        border-radius: 50%; 
        border: 1px solid var(--color-white); 
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        background: rgba(0, 0, 0, 0.4);
        -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition);
    }
    .play-button-video:before { content: '\f04b'; font-family: 'Font Awesome 5 Free'; font-weight: 900; font-size: 1.45rem; line-height: 1; color: var(--color-white); }
    .play-button-video:hover { transform: scale(0.9); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .play-button-video.md { width: 4rem; height: 4rem; }

    @media (max-width: 580px) {
        .play-button-video { width: 2.7rem; height: 2.7rem; }
        .play-button-video.md { width: 2.7rem; height: 2.7rem; }
        .play-button-video:before { font-size: 1.25rem; }
    }


    /* list info */
    .list-info { display: flex; align-items: flex-start; flex-direction: column; gap: 0.625rem; }
    .list-info .list-item { position: relative; }
    .list-info .list-item .label { display: block; color: var(--color3); }
    .list-info .list-item .value { display: block; font-weight: 500; color: var(--color); }

    .list-info.list-info-2 { gap: 1.45rem; }
    .list-info.list-info-2 .list-item:not(:last-child):before { content: ''; position: absolute; bottom: calc(-1.45rem / 2); left: 0; width: 100%; height: 1px; background: var(--border); }
/* ------------------------------------ end components ------------------------------------ */


/* ------------------------------------ content ------------------------------------ */
    /* intro */
    .intro-section .intro-item { position: relative; overflow: hidden; background: var(--gradient-1); border-radius: 1rem; }
    .intro-section .intro-item .cover { position: absolute; top: 0; right: 0; width: 40%; height: 100%; object-fit: cover; object-position: center; opacity: 0.4; }
    .intro-section .intro-item .inner { position: relative; display: flex; align-items: stretch; justify-content: space-between; }
    .intro-section .intro-item .inner .content { width: 45%; padding: 3.2rem 1.25rem 3.2rem 3.2rem; display: flex; align-items: center; }
    .intro-section .intro-item .inner .content .title { font-weight: 600; line-height: 1.2; letter-spacing: -0.02rem; margin-bottom: 1rem; }
    .intro-section .intro-item .inner .content .description { color: var(--color-white) !important; }
    .intro-section .intro-item .inner .thumb { position: relative; width: calc(100% - 45%); display: flex; align-items: flex-end; }
    .intro-section .intro-item .inner .thumb .thumb-img { object-fit: contain; object-position: top center; transform: translateY(2.5rem); }
    
    @media (max-width: 1400px) {
        .intro-section .intro-item .inner .content { padding: 3.2rem 0.625rem 3.2rem 3.2rem; }
    }
    @media (max-width: 1200px) {
        .intro-section .intro-item .inner .content { width: 50%; }
        .intro-section .intro-item .inner .thumb { width: 50%; }
    }
    @media (max-width: 992px) {
        .intro-section .intro-item .inner { flex-direction: column; }
        .intro-section .intro-item .inner .content { width: 100%; padding: 3.2rem 2.5rem; }
        .intro-section .intro-item .inner .thumb { width: 100%; }
    }
    @media (max-width: 768px) {
        .intro-section .intro-item .inner .content { padding: 2.5rem 2rem; }
    }
    @media (max-width: 580px) {
        .intro-section .intro-item .inner .content { padding: 2.5rem 1rem; }
    }


    /* blog */
    .blog-area { display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; gap: 1.875rem 1rem; }
    .blog-area .blog-item { width: calc(100% / 3 - 1rem); }
    .blog-single .head-area { margin-bottom: 1.875rem; }
    .blog-single .head-area .post-meta-info { display: inline-flex; width: auto; border-radius: 2.5rem; padding: 0.25rem 0.45rem 0.25rem 0.25rem; gap: 0.625rem; border: 1px solid var(--border); }
    .blog-single .head-area .post-meta-info span { color: var(--color); }
    .blog-single .head-area .post-meta-info .badge { font-size: 0.875rem; background: var(--border-02); border-color: var(--border); }
    .blog-single .head-area .blog-img { position: relative; overflow: hidden; object-fit: contain; border-radius: 1rem; }
    .blog-single .head-area .title { font-weight: 600; }
    .blog-single .body-area { position: relative; overflow: hidden; }
    .blog-single .body-area .share-area { display: inline-flex; align-items: center; margin-top: 1.25rem; }
    .blog-single .body-area .share-area .share-label { font-weight: 500; margin-right: 1.25rem; }

    @media (max-width: 768px) {
        .blog-area .blog-item { width: calc(100% / 2 - 1rem); }
    }
    @media (max-width: 580px) {
        .blog-single .head-area .title { font-size: 1.65rem; }
    }
    @media (max-width: 350px) {
        .blog-area .blog-item { width: calc(100%); }
    }


    /* tags style */
    .tags-area { width: 100%; display: flex; align-items: stretch; justify-content: flex-start; flex-direction: row; flex-wrap: wrap; gap: 0.313rem; }
    .tags-item { display: inline-flex; padding: 0.25rem 0.75rem; background: rgba(21, 214, 112, 0.1); border: 1px solid rgba(21, 214, 112, 0.1); border-radius: 1.875rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .tags-item span { font-weight: 500; color: var(--accent); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .tags-item:hover { border: 1px solid var(--accent); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .tags-item:hover span { color: var(--accent); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }


    /* sidebar */
    .sidebar { position: relative; }
    .sidebar .sidebar-widget:not(:last-child) { margin-bottom: 1.875rem; }
    .sidebar .sidebar-widget .sidebar-title { position: relative; margin-bottom: 1.875rem;}
    .sidebar .sidebar-widget .sidebar-title .title { font-weight: 600; line-height: 1; color: var(--color); margin-bottom: 0; }


    /* service */
    .service-section { background: var(--light); }
    .service-section .section-title div:nth-child(1) { width: 100%; max-width: 440px; }
    .service-area { display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; gap: 1rem }
    .service-area .service-item { position: relative; overflow: hidden; width: calc(100% / 5 - 1rem); padding: 1.25rem; border-radius: 1rem; }
    .service-area .service-item:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--gradient-1); border-radius: 1rem; transform: scale(0.85); visibility: hidden; opacity: 0; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .service-area .service-item .inner { position: relative; }
    .service-area .service-item .thumb { margin-bottom: 1rem; }
    .service-area .service-item .thumb .thumb-img { object-fit: contain; width: 100px; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .service-area .service-item .title { font-weight: 500; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .service-area .service-item .description { -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    .service-area .service-item:hover:before { transform: scale(1); visibility: visible; opacity: 1; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .service-area .service-item:hover .thumb .thumb-img { filter: invert(1) brightness(10) contrast(10) saturate(10) grayscale(1); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .service-area .service-item:hover .title { color: var(--color-white); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .service-area .service-item:hover .description { color: var(--color-white); -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    @media (max-width: 1400px) {
        .service-area .service-item { padding: 1.875rem 1.25rem; }
    }
    @media (max-width: 1200px) {
        .service-area .service-item { width: calc(100% / 2 - 1rem); }
    }
    @media (max-width: 580px) {
        .service-area .service-item { padding: 1.25rem 1rem; }
        .service-area .service-item .thumb .thumb-img { max-width: 2.5rem; }
    }
    @media (max-width: 460px) {
        .service-area .service-item { width: calc(100% / 1 - 1rem); }
    }

    .service-area-2 { display: flex; align-items: stretch; justify-content: flex-start; flex-wrap: wrap; gap: 1.875rem 1rem; }
    .service-area-2 .service-item { width: calc(100% / 3 - 1rem); }

    @media (max-width: 992px) {
        .service-area-2 .service-item { width: calc(100% / 2 - 1rem); }
    }
    @media (max-width: 768px) {
        .service-area-2 .service-item { width: calc(100%); }
    }

    .service-detail-area { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.875rem; }
    .service-detail-area .head { width: 430px; flex-shrink: 0; }
    .service-detail-area .head .thumb-img { object-fit: contain; width: 100%; height: auto; }
    .service-detail-area .body { width: calc(100% - 430px - 1.875rem); }
    .service-detail-area .body .action { position: relative; display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 1.875rem; margin-top: 1.25rem; }

    @media (max-width: 1200px) {
        .service-detail-area .head { width: 385px; }
        .service-detail-area .body { width: calc(100% - 385px - 1.875rem); }
    }
    @media (max-width: 992px) {
        .service-detail-area { flex-direction: column; }
        .service-detail-area .head { width: 100%; }
        .service-detail-area .body { width: calc(100%); }
    }
    @media (max-width: 580px) {
        .service-detail-area .body .action { justify-content: space-between; }
    }

    
    /* about */
    .about-section .thumb { position: relative; }
    .about-section .thumb .matric { position: absolute; right: 0; bottom: 8%; object-fit: contain; }
    .about-section .thumb-img { overflow: hidden; object-fit: cover; object-position: center; aspect-ratio: 1/1; border-radius: 1rem; max-width: 90%; }
    .about-section .content .action { display: flex; align-items: center; justify-content: flex-start; gap: 1.875rem; margin-top: 1.25rem; }

    @media (max-width: 992px) {
        .about-section .thumb .matric { max-width: 17.5rem; }
    }
    @media (max-width: 580px) {
        .about-section .thumb .matric { max-width: 14.5rem; }
    }


    /* client */
    .client-section { position: relative; overflow: hidden; }
    .client-area { position: relative; display: flex; justify-content: center; flex-wrap: wrap; }
    .client-area .client-item { position: relative; overflow: hidden; padding: 1rem; border-radius: 1.25rem; background: var(--background); border: 1px solid transparent; display: flex; align-items: center; justify-content: center; text-align: center; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .client-area .client-item .client-img { position: relative; object-fit: contain; max-width: 100%; max-height: 75px; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }

    @media (max-width: 992px) {
        .client-area:not(.marquee-area) .client-item { width: calc(100% / 4); }
    }
    @media (max-width: 580px) {
        .client-area:not(.marquee-area) .client-item { width: calc(100% / 3); }
    }

    .client-area.client-2 .client-item { background: none; }
    .client-area.client-2 .client-item .client-img { filter: invert(0) grayscale(0) contrast(1) brightness(1); }

    :root {
        --size: clamp(10rem, 1rem + 40vmin, 18rem);
        --gap: calc(var(--size) / 35);
    }
    @media (max-width: 1400px) {
        :root { --size: clamp(10rem, 1rem + 40vmin, 16rem); }
    }
    @media (max-width: 1200px) {
        :root { --size: clamp(10rem, 1rem + 40vmin, 14rem); }
    }
    @media (max-width: 992px) {
        :root { --size: clamp(10rem, 1rem + 40vmin, 12rem); }
    }
    @media only screen and (max-width: 768px) {
        :root { --size: clamp(10rem, 1rem + 40vmin, 9rem); }
    }
    @media only screen and (max-width: 580px) {
        :root { --size: clamp(10rem, 1rem + 40vmin, 6rem); }
    }

    .marquee-group { display: flex; align-items: center; user-select: none; gap: 0; }
    .marquee-group .marquee-area {
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: space-around;
        gap: var(--gap);
        min-width: 100%;
        animation: scroll-x linear infinite;
        animation-duration: 60s;
        animation-play-state: running;
    }
    .marquee-group .marquee-item { width: var(--size); }

    /* reverse */
    .marquee-group.marquee-reverse .marquee-area { animation-direction: reverse; animation-delay: -3s; }

    /* vertical */
    .marquee-group.marquee-vertical { --mask-direction: to bottom; }
    .marquee-group.marquee-vertical .marquee-area { flex-direction: column; }
    .marquee-group.marquee-vertical .marquee-area { animation-name: scroll-y; }
    .marquee-group.marquee-vertical .marquee-item { aspect-ratio: 1; width: calc(var(--size) / 1.5); padding: calc(var(--size) / 6); }

    @media (prefers-reduced-motion: reduce) {
        .marquee-group .marquee-area { animation-play-state: paused; }
    }
    @keyframes scroll-x {
        from { transform: translateX(0); }
        to { transform: translateX(calc(-100% - var(--gap))); }
    }
    @keyframes scroll-y {
        from { transform: translateY(0); }
        to { transform: translateY(calc(-100% - var(--gap))); }
    }


    /* promo */
    #swiper-promo .swiper-wrapper { display: flex; align-items: stretch; }
    #swiper-promo .swiper-wrapper .swiper-slide { height: auto; }
    .promo-item { position: relative; overflow: hidden; border-radius: 1.25rem; height: 100%; }
    .promo-item .promo-img { object-fit: cover; object-position: center; width: 100%; height: 100%; }


    /* single page */
    .banner-area { margin-bottom: 2.75rem; }
    .banner-area .banner-img { width: 100%; height: auto; object-fit: contain; }
    .single-page-body .banner-img-page { width: 55%; height: auto; object-fit: contain; border-radius: 15px; }

    @media (max-width: 768px) {
        .single-page-body .banner-img-page { width: 100%; border-radius:10px; }
    }


    /* table schedule */
    .schedule-section { background: var(--background-01); }
    .schedule-section .section-title div:nth-child(1) { width: 50%; }
    .schedule-section .section-title .input-area { display: flex; gap: 1.5rem; }
    .schedule-area { display: flex; align-items: flex-start; flex-direction: column; gap: 1.5rem; }
    .schedule-area .schedule-item { position: relative; overflow: hidden; width: 100%; border: 1px solid var(--border); border-top: 0; border-radius: 0 0.625rem 0.625rem 0.625rem; }

    .table-schedule { margin-bottom: 0; }
    .table-schedule thead tr th { background: var(--accent); border-radius: 0.625rem 0.625rem 0 0; font-weight: 500; color: var(--color-white); }
    .table-schedule thead tr th:nth-child(1) { background: var(--gradient-1); border-radius: 0 0.625rem 0 0; }
    .table-schedule tr { border: 0; }
    .table-schedule tr th, .table-schedule tr td { width: calc(70% / 7); text-align: center; vertical-align: middle; border: 0; }
    .table-schedule tr th:nth-child(1), .table-schedule tr td:nth-child(1) { width: 30%; text-align: left; }
    .table-schedule tbody tr:not(:last-child) { border-bottom: 1px solid var(--border); }
    .table-schedule tbody tr td:not(:first-child) { padding: .5rem .25rem; }
    .table-schedule tbody tr td { letter-spacing: -0.02rem; }

    .doctor-info { width: 100%; display: flex; align-items: center; justify-content: flex-start; gap: 0.625rem; }
    .doctor-info .doctor-img { flex-shrink: 0; width: 2.75rem; height: 2.75rem; object-fit: cover; object-position: center; border-radius: 50%; overflow: hidden; border: 1px solid var(--border); }
    .doctor-info .doctor-name { line-height: 1.5; }

    @media (max-width: 1200px) {
        .schedule-section .section-title div:nth-child(1) { width: 80%; }
        .table-schedule tr th, .table-schedule tr td { width: calc(75% / 7); }
        .table-schedule tr th:nth-child(1), .table-schedule tr td:nth-child(1) { width: 25%; }
    }
    @media (max-width: 992px) {
        .schedule-section .section-title div:nth-child(1) { width: 100%; }
        .schedule-section .section-title .input-area { align-items: flex-start; flex-direction: column; }
        .schedule-item .table-responsive { width: 100%; overflow-x: auto; }
        .table-schedule { width: 1000px; }
    }
    @media (max-width: 768px) {
        
    }
    

    /* contact */
    .contact-area { display: flex; align-items: center; justify-content: space-between; gap: 1.875rem; margin-top: 2.5rem; }
    .contact-area .contact-info { order: 1; width: 40%; }
    .contact-area .contact-info .list-info { gap: 2.5rem; }
    .contact-area .contact-info .list-info .list-item { display: flex; align-items: flex-start; gap: 1rem; }
    .contact-area .contact-info .list-info .list-item .icon { flex-shrink: 0; width: 3.6rem; height: 3.6rem; display: flex; align-items: center; justify-content: center; background: var(--light); border-radius: 50%; }
    .contact-area .contact-info .list-info .list-item .icon i { font-size: 1.45rem; }
    .contact-area .contact-info .list-info .list-item .content .label { font-weight: 600; margin-bottom: 0.25rem; }
    .contact-area .contact-info .list-info .list-item .content .value { font-weight: 400; margin-bottom: 0; }
    .contact-area .contact-form { order: 0; width: 40%; background: var(--light); border-radius: 1rem; padding: 1.875rem; }

    .contact-section .contact-maps { height: 350px; position: relative; z-index: 3; }
    .contact-section .contact-maps iframe { border: 0; height: 100%; width: 100%; border-radius: 1rem; }

    @media (max-width: 1200px) {
        .contact-area .contact-info { width: 40%; }
        .contact-area .contact-form { width: 50%; }
    }
    @media (max-width: 992px) {
        .contact-area { flex-direction: column; gap: 3.2rem; }
        .contact-area .contact-info { order: 0; width: 100%; }
        .contact-area .contact-form { order: 1; width: 100%; }
    }
    @media (max-width: 580px) {
        .contact-area .contact-form { padding: 1rem; }
    }


    /* reset content style */
    .reset-style, .reset-style h1, .reset-style h2, .reset-style h3, .reset-style h4, .reset-style h5, .reset-style h6, .reset-style p, .reset-style span { 
        font-family: var(--font1) !important; 
        text-align: left !important;
        line-height: 1.6;
    }
    .reset-style * { font-family: var(--font1) !important; text-align: left !important; font-style: normal; font-weight: 400; line-height: 1.6; color: var(--color-2) !important; }
    .reset-style p { margin-bottom: 0.5rem; }
    .reset-style a { font-weight: 600; color: var(--accent); text-decoration: underline; }
    .reset-style h1, .reset-style h2, .reset-style h3, .reset-style h4, .reset-style h5, .reset-style h6 { font-weight: 500; color: var(--color) !important; }
    .reset-style b { font-weight: 600; }
    .reset-style ul { padding-left: 1.25rem; margin-bottom: 0.625rem; }
    .reset-style ul li { list-style: disc; font-family: var(--font1); font-weight: 400; font-size: 1rem; line-height: 1.5; color: var(--color-2); }
    .reset-style ul li:not(:last-child) { margin-bottom: 0.5rem; }
    .reset-style ol { padding-left: 0.313rem; margin-bottom: 0.625rem; }
    .reset-style ol li { font-family: var(--font1); font-weight: 400; font-size: 1rem; line-height: 1.5; color: var(--color-2); }
    .reset-style ol li:not(:last-child) { margin-bottom: 0.5rem; }
    

    /* cta */
    .cta-section .inner { position: relative; overflow: hidden; padding: 4.5rem 3.2rem; border-radius: 1.875rem; text-align: center; background: var(--gradient-1); }
    .cta-section .inner .cover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
    .cta-section .inner .action { display: flex; align-items: center; justify-content: center; gap: 1.875rem; margin-top: 1.25rem; }

    @media (max-width: 768px) {
        .cta-section .inner { padding: 4.5rem 1.875rem; }
        .cta-section .inner .action { flex-direction: column; gap: 1.25rem; }
    }
    @media (max-width: 580px) {
        .cta-section .inner { padding: 4.5rem 0.938rem; }
    }


    /* footer */
    .footer { border-top: 1px solid var(--accent); }
    .footer > * > .inner { padding: 4.2rem 0 3.2rem 0; }
    .footer .footer-column { position: relative; z-index: 3; }
    .footer .footer-title { color: var(--color-3); margin-bottom: 0.625rem; }
    .footer .brand-img { object-fit: contain; max-width: 8.5rem; max-height: 3rem; margin-bottom: 1.875rem; }

    .footer .footer-bottom { position: relative; background: var(--gradient-1); padding: 0.625rem 0; }
    .footer .footer-bottom .cover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
    .footer .footer-bottom * > .inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
    .footer .footer-bottom * > .inner .copyright { color: var(--color-white); margin-bottom: 0; }
    .footer .footer-bottom * > .inner .social .social-media .icon i { font-size: 1.125rem; color: var(--color-white); }

    .footer .footer-list { display: flex; align-items: flex-start; gap: 0.5rem; flex-direction: column; list-style-type: none; padding-left: 0; }
    
    @media (max-width: 992px) {
        .footer > * > .inner { padding: 1.875rem 0 1rem 0; }

        .footer .footer-column { margin-bottom: 1.875rem; }
        
        .footer .footer-bottom { padding: 1.25rem 0; }
        .footer .footer-bottom * > .inner { flex-direction: column; gap: 0.625rem; }
    }
/* ------------------------------------ end content ------------------------------------ */


/* ------------------------------------ dashboard ------------------------------------ */
    .dash-section { position: relative; min-height: calc(100vh - var(--space-top-site)); }
    
    .dash-section .inner { display: flex; align-items: flex-start; gap: 2.5rem; }
    .dash-section .inner .dash-sidebar { position: sticky; top: calc(var(--space-top-site) + 1.25rem ); width: 280px; flex-shrink: 0; }
    .dash-section .inner .dash-content { position: relative; width: calc(100% - 280px); overflow: hidden; }
    .dash-section .inner .dash-content .dash-title { position: relative; padding-bottom: 0.313rem; margin-bottom: 1rem; }
    .dash-section .inner .dash-content .dash-title:before { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: var(--background-01); }
    .dash-section .inner .dash-content .dash-title .title { margin-bottom: 0.313rem; }
    
    .dash-sidebar .sidebar-head { display: block; margin-bottom: 1rem; border-bottom: 0; }
    .dash-sidebar .sidebar-head p { color: var(--color-white); margin-bottom: 0.313rem; }
    .dash-sidebar .sidebar-body .nav { 
        position: relative; 
        display: flex; 
        align-items: stretch; 
        justify-content: flex-start; 
        flex-direction: column; 
        background: var(--background-01);
        backdrop-filter: var(--blur);
        -webkit-backdrop-filter: var(--blur);
        border-radius: 0.625rem;
        padding: 0.625rem;
    }
    .dash-sidebar .sidebar-body .nav .nav-item .nav-link { overflow: hidden; font-weight: 500; color: var(--color-white); padding: 0.625rem; border-radius: 0.5rem; -webkit-transition: var(--transition); -moz-transition: var(--transition); -ms-transition: var(--transition); -o-transition: var(--transition); transition: var(--transition); }
    .dash-sidebar .sidebar-body .nav .nav-item .nav-link.active { color: var(--color-white); background: var(--gradient-accent); box-shadow: var(--shadow-accent); }
    .dash-sidebar .sidebar-body .nav .nav-item .nav-link:not(.active):hover { color: var(--accent); }
    .dash-sidebar .sidebar-body .nav .nav-item .nav-link .icon { font-size: 1.25rem; line-height: 1; width: 1.45rem; margin-right: 0.4rem; }
    
    @media (max-width: 1400px) {
        .dash-section .inner { gap: 1.875rem; }
        .dash-section .inner .dash-sidebar { width: 250px; }
        .dash-section .inner .dash-content { width: calc(100% - 250px); }
    }
    @media (max-width: 992px) {
        .dash-section .inner { flex-direction: column; }
        .dash-section .inner .dash-sidebar { position: relative; top: 0; width: 100%; }
        .dash-section .inner .dash-content { width: calc(100%); }

        .dash-sidebar .sidebar-head { display: none; }
        .dash-sidebar .sidebar-body .nav { 
            padding: 0.313rem; 
            flex-direction: row; 
            flex-wrap: inherit;
            white-space: nowrap;
            overflow-y: hidden; 
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
            -ms-overflow-style: none;
            scrollbar-width: none;
        }
        .dash-sidebar .sidebar-body .nav .nav-item .nav-link { padding: 0.625rem 1rem; }
    }
/* ------------------------------------ end dashboard ------------------------------------ */


/* ------------------------------------ animation ------------------------------------ */
    .delay-1-0s { -webkit-animation-delay: 1s; animation-delay: 1s; }
    .delay-2-0s { -webkit-animation-delay: 2s; animation-delay: 2s; }
    .delay-0-1s { -webkit-animation-delay: 0.1s; animation-delay: 0.1s; }
    .delay-0-2s { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; }
    .delay-0-3s { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; }
    .delay-0-4s { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; }
    .delay-0-5s { -webkit-animation-delay: 0.5s; animation-delay: 0.5s; }
    .delay-0-6s { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; }
    .delay-0-7s { -webkit-animation-delay: 0.7s; animation-delay: 0.7s; }
    .delay-0-8s { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; }
    .delay-0-9s { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; }
    .delay-1-1s { -webkit-animation-delay: 1.1s; animation-delay: 1.1s; }
    .delay-1-2s { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; }
    .delay-1-3s { -webkit-animation-delay: 1.3s; animation-delay: 1.3s; }
    .delay-1-4s { -webkit-animation-delay: 1.4s; animation-delay: 1.4s; }
    .delay-1-5s { -webkit-animation-delay: 1.5s; animation-delay: 1.5s; }
    .delay-1-6s { -webkit-animation-delay: 1.6s; animation-delay: 1.6s; }
    .delay-1-7s { -webkit-animation-delay: 1.7s; animation-delay: 1.7s; }
    .delay-1-8s { -webkit-animation-delay: 1.8s; animation-delay: 1.8s; }
    .delay-1-9s { -webkit-animation-delay: 1.9s; animation-delay: 1.9s; }

    .customSlideInRight { -webkit-animation-name: customSlideInRight; animation-name: customSlideInRight; }
    @-webkit-keyframes customSlideInRight {
        from { -webkit-transform: translate3d(100px, -100px, 0); transform: translate3d(100px, -100px, 0); }
        to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 
    }
    @keyframes customSlideInRight {
        from { -webkit-transform: translate3d(100px, -100px, 0); transform: translate3d(100px, -100px, 0); }
        to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 
    }

    .customSlideInLeft { -webkit-animation-name: customSlideInLeft; animation-name: customSlideInLeft; }
    @-webkit-keyframes customSlideInLeft {
        from { -webkit-transform: translate3d(-100px, 0, 0); transform: translate3d(-100px, 0, 0); }
        to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 
    }
    @keyframes customSlideInLeft {
        from { -webkit-transform: translate3d(-100px, 0, 0); transform: translate3d(-100px, 0, 0); }
        to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 
    }

    @-webkit-keyframes slide-down {
        from { -webkit-transform: translateY(-250%); transform: translateY(-250%); }
        to { -webkit-transform: translateY(0%); transform: translateY(0%); }
    }
    @keyframes slide-down {
        from { -webkit-transform: translateY(-250%); transform: translateY(-250%); }
        to { -webkit-transform: translateY(0%); transform: translateY(0%); }
    }

    @-webkit-keyframes slide-up {
        from { -webkit-transform: translateY(0%); transform: translateY(0%); }
        to { -webkit-transform: translateY(-250%); transform: translateY(-250%); }
    }
    @keyframes slide-up {
        from { -webkit-transform: translateY(0%); transform: translateY(0%); }
        to { -webkit-transform: translateY(-250%); transform: translateY(-250%); }
    }
    
    @-webkit-keyframes marquee-left {
        0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
        100% { -webkit-transform: translateX(calc((-25% + 17vw) * 3)); -ms-transform: translateX(calc((-25% + 17vw) * 3)); transform: translateX(calc((-25% + 17vw) * 3)); }
    }
    @keyframes marquee-left {
        0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
        100% { -webkit-transform: translateX(calc((-25% + 17vw) * 3)); -ms-transform: translateX(calc((-25% + 17vw) * 3)); transform: translateX(calc((-25% + 17vw) * 3)); }
    }

    @-webkit-keyframes marquee-right {
        from { transform: translateX(-50%); }
        to { transform: translateX(0%); }
    }
    @keyframes marquee-right {
        from { transform: translateX(-50%); }
        to { transform: translateX(0%); }
    }

    @keyframes thumbScroll {
        10% { background-position-y: 0%; }
        50% { background-position-y: 50%; }
        100%{ background-position-y: 100%; }
    }
    @-webkit-keyframes thumbScroll {
        10% { background-position-y: 0%; }
        50% { background-position-y: 50%; }
        100% { background-position-y: 1 00%; }
    }
    @-moz-keyframes thumbScroll {
        10% { background-position-y: 0%; }
        50% { background-position-y: 50%; }
        100% { background-position-y: 1 00%; }
    }
    @keyframes thumbScroll {
        10% { background-position-y: 0%; }
        50% { background-position-y: 50%; }
        100% { background-position-y: 1 00%; }
    }

    /* End Shape rotate */
    @-webkit-keyframes moveBounce {
        0% { -webkit-transform: translateY(0px); transform: translateY(0px); }
        50% { -webkit-transform: translateY(20px); transform: translateY(20px); }
        100% { -webkit-transform: translateY(0px); transform: translateY(0px); }
    }
    @keyframes moveBounce {
        0% { -webkit-transform: translateY(0px); transform: translateY(0px); }
        50% { -webkit-transform: translateY(20px); transform: translateY(20px); }
        100% { -webkit-transform: translateY(0px); transform: translateY(0px); }
    }

    @-webkit-keyframes moveLeftBounce {
        0% { -webkit-transform: translateX(0); transform: translateX(0); }
        50% { -webkit-transform: translateX(5px); transform: translateX(5px); }
        100% { -webkit-transform: translateX(0); transform: translateX(0); }
    }
    @keyframes moveLeftBounce {
        0% { -webkit-transform: translateX(0); transform: translateX(0); }
        50% { -webkit-transform: translateX(5px); transform: translateX(5px); }
        100% { -webkit-transform: translateX(0); transform: translateX(0); }
    }

    @keyframes ripple {
        0% { -webkit-transform: scale(1); transform: scale(1); }
        75% { -webkit-transform: scale(1.75); transform: scale(1.75); opacity: 1;  }
        100% { -webkit-transform: scale(2); transform: scale(2); opacity: 0; }
    }

    @-webkit-keyframes rotateMe {
        from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
        to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
    }

    @keyframes rotateMe {
        from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
        to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
    }

    @-webkit-keyframes moveScale {
        0% { -webkit-transform: scale(1); transform: scale(1); }
        50% { -webkit-transform: scale(0.8); transform: scale(0.8); }
        100% { -webkit-transform: scale(1); transform: scale(1); }
    }

    @keyframes moveScale {
        0% { -webkit-transform: scale(1); transform: scale(1); }
        50% { -webkit-transform: scale(0.8); transform: scale(0.8); }
        100% { -webkit-transform: scale(1); transform: scale(1); }
    }

    @-webkit-keyframes sk-bouncedelay {
        0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); }
        40% { -webkit-transform: scale(1); transform: scale(1); }
    }

    @keyframes sk-bouncedelay {
        0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); }
        40% { -webkit-transform: scale(1); transform: scale(1); }
    }

    @keyframes animationFramesOne {
        0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
        20% { -webkit-transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg); }
        40% { -webkit-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg); }
        60% { -webkit-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg); }
        80% { -webkit-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg); }
        100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); }
    }

    @-webkit-keyframes animateGradient {
        0% { background-position: left bottom }
        50% { background-position: right top }
        100% { background-position: left bottom }
    }
    @keyframes animateGradient {
        0% { background-position: left bottom }
        50% { background-position: right top }
        100% { background-position: left bottom }
    }
/* ------------------------------------ end animation ------------------------------------ */


/* ------------------------------------ animate css ------------------------------------ */
    :root{--animate-duration:1s;--animate-delay:1s;--animate-repeat:1}.not-animated,[data-animate]:not(.animated){opacity:0}.animated{-webkit-animation-duration:var(--animate-duration);animation-duration:var(--animate-duration);-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.repeat-1{-webkit-animation-iteration-count:var(--animate-repeat);animation-iteration-count:var(--animate-repeat)}.animated.repeat-2{-webkit-animation-iteration-count:calc(var(--animate-repeat) * 2);animation-iteration-count:calc(var(--animate-repeat) * 2)}.animated.repeat-3{-webkit-animation-iteration-count:calc(var(--animate-repeat) * 3);animation-iteration-count:calc(var(--animate-repeat) * 3)}.animated.delay-1s{-webkit-animation-delay:var(--animate-delay);animation-delay:var(--animate-delay)}.animated.delay-2s{-webkit-animation-delay:calc(var(--animate-delay) * 2);animation-delay:calc(var(--animate-delay) * 2)}.animated.delay-3s{-webkit-animation-delay:calc(var(--animate-delay) * 3);animation-delay:calc(var(--animate-delay) * 3)}.animated.delay-4s{-webkit-animation-delay:calc(var(--animate-delay) * 4);animation-delay:calc(var(--animate-delay) * 4)}.animated.delay-5s{-webkit-animation-delay:calc(var(--animate-delay) * 5);animation-delay:calc(var(--animate-delay) * 5)}.animated.faster{-webkit-animation-duration:calc(var(--animate-duration)/ 2);animation-duration:calc(var(--animate-duration)/ 2)}.animated.fast{-webkit-animation-duration:calc(var(--animate-duration) * .8);animation-duration:calc(var(--animate-duration) * .8)}.animated.slow{-webkit-animation-duration:calc(var(--animate-duration) * 2);animation-duration:calc(var(--animate-duration) * 2)}.animated.slower{-webkit-animation-duration:calc(var(--animate-duration) * 3);animation-duration:calc(var(--animate-duration) * 3)}@media print,(prefers-reduced-motion:reduce){.animated{-webkit-animation-duration:1ms!important;animation-duration:1ms!important;-webkit-transition-duration:1ms!important;transition-duration:1ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important}.animated[class*=Out]{opacity:0}}@-webkit-keyframes bounce{20%,53%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-30px,0) scaleY(1.1);transform:translate3d(0,-30px,0) scaleY(1.1)}70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-15px,0) scaleY(1.05);transform:translate3d(0,-15px,0) scaleY(1.05)}80%{-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translate3d(0,0,0) scaleY(.95);transform:translate3d(0,0,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,-4px,0) scaleY(1.02);transform:translate3d(0,-4px,0) scaleY(1.02)}}@keyframes bounce{20%,53%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-30px,0) scaleY(1.1);transform:translate3d(0,-30px,0) scaleY(1.1)}70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-15px,0) scaleY(1.05);transform:translate3d(0,-15px,0) scaleY(1.05)}80%{-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translate3d(0,0,0) scaleY(.95);transform:translate3d(0,0,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,-4px,0) scaleY(1.02);transform:translate3d(0,-4px,0) scaleY(1.02)}}.headShake,.pulse{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{50%,from,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{50%,from,to{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{from,to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}}@keyframes pulse{from,to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse;animation-timing-function:ease-in-out}@-webkit-keyframes rubberBand{from,to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}}@keyframes rubberBand{from,to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shakeX{from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shakeX{from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.shakeX{-webkit-animation-name:shakeX;animation-name:shakeX}@-webkit-keyframes shakeY{from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}20%,40%,60%,80%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}}@keyframes shakeY{from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}20%,40%,60%,80%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}}.shakeY{-webkit-animation-name:shakeY;animation-name:shakeY}@-webkit-keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}.headShake{animation-timing-function:ease-in-out;-webkit-animation-name:headShake;animation-name:headShake}@-webkit-keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}to{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}@keyframes swing{20%{-webkit-transform:rotate3d(0,0,1,15deg);transform:rotate3d(0,0,1,15deg)}40%{-webkit-transform:rotate3d(0,0,1,-10deg);transform:rotate3d(0,0,1,-10deg)}60%{-webkit-transform:rotate3d(0,0,1,5deg);transform:rotate3d(0,0,1,5deg)}80%{-webkit-transform:rotate3d(0,0,1,-5deg);transform:rotate3d(0,0,1,-5deg)}to{-webkit-transform:rotate3d(0,0,1,0deg);transform:rotate3d(0,0,1,0deg)}}.swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{from,to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}}@keyframes tada{from,to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg);transform:scale3d(.9,.9,.9) rotate3d(0,0,1,-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg);transform:scale3d(1.1,1.1,1.1) rotate3d(0,0,1,-3deg)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}}@keyframes wobble{from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}15%{-webkit-transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg);transform:translate3d(-25%,0,0) rotate3d(0,0,1,-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg);transform:translate3d(20%,0,0) rotate3d(0,0,1,3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-1deg)}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello{11.1%,from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(.390625deg) skewY(.390625deg);transform:skewX(.390625deg) skewY(.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}@keyframes jello{11.1%,from,to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(.390625deg) skewY(.390625deg);transform:skewX(.390625deg) skewY(.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes heartBeat{0%,28%,70%{-webkit-transform:scale(1);transform:scale(1)}14%,42%{-webkit-transform:scale(1.3);transform:scale(1.3)}}@keyframes heartBeat{0%,28%,70%{-webkit-transform:scale(1);transform:scale(1)}14%,42%{-webkit-transform:scale(1.3);transform:scale(1.3)}}.heartBeat{-webkit-animation-name:heartBeat;animation-name:heartBeat;-webkit-animation-duration:calc(var(--animate-duration) * 1.3);animation-duration:calc(var(--animate-duration) * 1.3);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}@-webkit-keyframes backInDown{0%{-webkit-transform:translateY(-1200px) scale(.7);transform:translateY(-1200px) scale(.7);opacity:.7}80%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backInDown{0%{-webkit-transform:translateY(-1200px) scale(.7);transform:translateY(-1200px) scale(.7);opacity:.7}80%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.backInDown{-webkit-animation-name:backInDown;animation-name:backInDown}@-webkit-keyframes backInLeft{0%{-webkit-transform:translateX(-2000px) scale(.7);transform:translateX(-2000px) scale(.7);opacity:.7}80%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backInLeft{0%{-webkit-transform:translateX(-2000px) scale(.7);transform:translateX(-2000px) scale(.7);opacity:.7}80%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.backInLeft{-webkit-animation-name:backInLeft;animation-name:backInLeft}@-webkit-keyframes backInRight{0%{-webkit-transform:translateX(2000px) scale(.7);transform:translateX(2000px) scale(.7);opacity:.7}80%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backInRight{0%{-webkit-transform:translateX(2000px) scale(.7);transform:translateX(2000px) scale(.7);opacity:.7}80%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.backInRight{-webkit-animation-name:backInRight;animation-name:backInRight}@-webkit-keyframes backInUp{0%{-webkit-transform:translateY(1200px) scale(.7);transform:translateY(1200px) scale(.7);opacity:.7}80%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backInUp{0%{-webkit-transform:translateY(1200px) scale(.7);transform:translateY(1200px) scale(.7);opacity:.7}80%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}100%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.backInUp{-webkit-animation-name:backInUp;animation-name:backInUp}@-webkit-keyframes backOutDown{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}100%{-webkit-transform:translateY(700px) scale(.7);transform:translateY(700px) scale(.7);opacity:.7}}@keyframes backOutDown{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}100%{-webkit-transform:translateY(700px) scale(.7);transform:translateY(700px) scale(.7);opacity:.7}}.backOutDown{-webkit-animation-name:backOutDown;animation-name:backOutDown}@-webkit-keyframes backOutLeft{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}100%{-webkit-transform:translateX(-2000px) scale(.7);transform:translateX(-2000px) scale(.7);opacity:.7}}@keyframes backOutLeft{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}100%{-webkit-transform:translateX(-2000px) scale(.7);transform:translateX(-2000px) scale(.7);opacity:.7}}.backOutLeft{-webkit-animation-name:backOutLeft;animation-name:backOutLeft}@-webkit-keyframes backOutRight{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}100%{-webkit-transform:translateX(2000px) scale(.7);transform:translateX(2000px) scale(.7);opacity:.7}}@keyframes backOutRight{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}100%{-webkit-transform:translateX(2000px) scale(.7);transform:translateX(2000px) scale(.7);opacity:.7}}.backOutRight{-webkit-animation-name:backOutRight;animation-name:backOutRight}@-webkit-keyframes backOutUp{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}100%{-webkit-transform:translateY(-700px) scale(.7);transform:translateY(-700px) scale(.7);opacity:.7}}@keyframes backOutUp{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}100%{-webkit-transform:translateY(-700px) scale(.7);transform:translateY(-700px) scale(.7);opacity:.7}}.backOutUp{-webkit-animation-name:backOutUp;animation-name:backOutUp}@-webkit-keyframes bounceIn{20%,40%,60%,80%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes bounceIn{20%,40%,60%,80%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}.bounceIn{-webkit-animation-duration:calc(var(--animate-duration) * .75);animation-duration:calc(var(--animate-duration) * .75);-webkit-animation-name:bounceIn;animation-name:bounceIn}.bounceOut,.flipOutX{-webkit-animation-duration:calc(var(--animate-duration) * .75);animation-duration:calc(var(--animate-duration) * .75)}@-webkit-keyframes bounceInDown{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0) scaleY(3);transform:translate3d(0,-3000px,0) scaleY(3)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0) scaleY(.9);transform:translate3d(0,25px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,-10px,0) scaleY(.95);transform:translate3d(0,-10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,5px,0) scaleY(.985);transform:translate3d(0,5px,0) scaleY(.985)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInDown{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0) scaleY(3);transform:translate3d(0,-3000px,0) scaleY(3)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0) scaleY(.9);transform:translate3d(0,25px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,-10px,0) scaleY(.95);transform:translate3d(0,-10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,5px,0) scaleY(.985);transform:translate3d(0,5px,0) scaleY(.985)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0) scaleX(3);transform:translate3d(-3000px,0,0) scaleX(3)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0) scaleX(1);transform:translate3d(25px,0,0) scaleX(1)}75%{-webkit-transform:translate3d(-10px,0,0) scaleX(.98);transform:translate3d(-10px,0,0) scaleX(.98)}90%{-webkit-transform:translate3d(5px,0,0) scaleX(.995);transform:translate3d(5px,0,0) scaleX(.995)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInLeft{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0) scaleX(3);transform:translate3d(-3000px,0,0) scaleX(3)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0) scaleX(1);transform:translate3d(25px,0,0) scaleX(1)}75%{-webkit-transform:translate3d(-10px,0,0) scaleX(.98);transform:translate3d(-10px,0,0) scaleX(.98)}90%{-webkit-transform:translate3d(5px,0,0) scaleX(.995);transform:translate3d(5px,0,0) scaleX(.995)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(3000px,0,0) scaleX(3);transform:translate3d(3000px,0,0) scaleX(3)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0) scaleX(1);transform:translate3d(-25px,0,0) scaleX(1)}75%{-webkit-transform:translate3d(10px,0,0) scaleX(.98);transform:translate3d(10px,0,0) scaleX(.98)}90%{-webkit-transform:translate3d(-5px,0,0) scaleX(.995);transform:translate3d(-5px,0,0) scaleX(.995)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInRight{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(3000px,0,0) scaleX(3);transform:translate3d(3000px,0,0) scaleX(3)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0) scaleX(1);transform:translate3d(-25px,0,0) scaleX(1)}75%{-webkit-transform:translate3d(10px,0,0) scaleX(.98);transform:translate3d(10px,0,0) scaleX(.98)}90%{-webkit-transform:translate3d(-5px,0,0) scaleX(.995);transform:translate3d(-5px,0,0) scaleX(.995)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(0,3000px,0) scaleY(5);transform:translate3d(0,3000px,0) scaleY(5)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaleY(.9);transform:translate3d(0,-20px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,10px,0) scaleY(.95);transform:translate3d(0,10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,-5px,0) scaleY(.985);transform:translate3d(0,-5px,0) scaleY(.985)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes bounceInUp{60%,75%,90%,from,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}from{opacity:0;-webkit-transform:translate3d(0,3000px,0) scaleY(5);transform:translate3d(0,3000px,0) scaleY(5)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaleY(.9);transform:translate3d(0,-20px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,10px,0) scaleY(.95);transform:translate3d(0,10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,-5px,0) scaleY(.985);transform:translate3d(0,-5px,0) scaleY(.985)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.bounceOut{animation-duration:calc(var(--animate-duration) * .75);-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0) scaleY(.985);transform:translate3d(0,10px,0) scaleY(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaleY(.9);transform:translate3d(0,-20px,0) scaleY(.9)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0) scaleY(3);transform:translate3d(0,2000px,0) scaleY(3)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0) scaleY(.985);transform:translate3d(0,10px,0) scaleY(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaleY(.9);transform:translate3d(0,-20px,0) scaleY(.9)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0) scaleY(3);transform:translate3d(0,2000px,0) scaleY(3)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0) scaleX(.9);transform:translate3d(20px,0,0) scaleX(.9)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0) scaleX(2);transform:translate3d(-2000px,0,0) scaleX(2)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0) scaleX(.9);transform:translate3d(20px,0,0) scaleX(.9)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0) scaleX(2);transform:translate3d(-2000px,0,0) scaleX(2)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0) scaleX(.9);transform:translate3d(-20px,0,0) scaleX(.9)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0) scaleX(2);transform:translate3d(2000px,0,0) scaleX(2)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0) scaleX(.9);transform:translate3d(-20px,0,0) scaleX(.9)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0) scaleX(2);transform:translate3d(2000px,0,0) scaleX(2)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0) scaleY(.985);transform:translate3d(0,-10px,0) scaleY(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0) scaleY(.9);transform:translate3d(0,20px,0) scaleY(.9)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0) scaleY(3);transform:translate3d(0,-2000px,0) scaleY(3)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0) scaleY(.985);transform:translate3d(0,-10px,0) scaleY(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0) scaleY(.9);transform:translate3d(0,20px,0) scaleY(.9)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0) scaleY(3);transform:translate3d(0,-2000px,0) scaleY(3)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInDown{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{from{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInDownBig{from{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInLeft{from{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{from{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInLeftBig{from{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInRight{from{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{from{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInRightBig{from{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInUp{from{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{from{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInUpBig{from{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeInTopLeft{from{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInTopLeft{from{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInTopLeft{-webkit-animation-name:fadeInTopLeft;animation-name:fadeInTopLeft}@-webkit-keyframes fadeInTopRight{from{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInTopRight{from{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInTopRight{-webkit-animation-name:fadeInTopRight;animation-name:fadeInTopRight}@-webkit-keyframes fadeInBottomLeft{from{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInBottomLeft{from{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInBottomLeft{-webkit-animation-name:fadeInBottomLeft;animation-name:fadeInBottomLeft}@-webkit-keyframes fadeInBottomRight{from{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeInBottomRight{from{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.fadeInBottomRight{-webkit-animation-name:fadeInBottomRight;animation-name:fadeInBottomRight}@-webkit-keyframes fadeOut{from{opacity:1}to{opacity:0}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes fadeOutTopLeft{from{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}}@keyframes fadeOutTopLeft{from{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}}.fadeOutTopLeft{-webkit-animation-name:fadeOutTopLeft;animation-name:fadeOutTopLeft}@-webkit-keyframes fadeOutTopRight{from{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}}@keyframes fadeOutTopRight{from{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}}.fadeOutTopRight{-webkit-animation-name:fadeOutTopRight;animation-name:fadeOutTopRight}@-webkit-keyframes fadeOutBottomRight{from{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}}@keyframes fadeOutBottomRight{from{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}}.fadeOutBottomRight{-webkit-animation-name:fadeOutBottomRight;animation-name:fadeOutBottomRight}@-webkit-keyframes fadeOutBottomLeft{from{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}}@keyframes fadeOutBottomLeft{from{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}}.fadeOutBottomLeft{-webkit-animation-name:fadeOutBottomLeft;animation-name:fadeOutBottomLeft}@-webkit-keyframes flip{from{-webkit-transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,0) rotate3d(0,1,0,-360deg);transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,0) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95) translate3d(0,0,0) rotate3d(0,1,0,0deg);transform:perspective(400px) scale3d(.95,.95,.95) translate3d(0,0,0) rotate3d(0,1,0,0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,0) rotate3d(0,1,0,0deg);transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,0) rotate3d(0,1,0,0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{from{-webkit-transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,0) rotate3d(0,1,0,-360deg);transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,0) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95) translate3d(0,0,0) rotate3d(0,1,0,0deg);transform:perspective(400px) scale3d(.95,.95,.95) translate3d(0,0,0) rotate3d(0,1,0,0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,0) rotate3d(0,1,0,0deg);transform:perspective(400px) scale3d(1,1,1) translate3d(0,0,0) rotate3d(0,1,0,0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{from{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{from{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}.flipInY,.flipOutX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipInY{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{from{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-20deg);transform:perspective(400px) rotate3d(0,1,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(0,1,0,10deg);transform:perspective(400px) rotate3d(0,1,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-5deg);transform:perspective(400px) rotate3d(0,1,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.flipInY{backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}@keyframes flipOutX{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0}}.flipOutX{animation-duration:calc(var(--animate-duration) * .75);-webkit-animation-name:flipOutX;animation-name:flipOutX;backface-visibility:visible!important}@-webkit-keyframes flipOutY{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}@keyframes flipOutY{from{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotate3d(0,1,0,-15deg);transform:perspective(400px) rotate3d(0,1,0,-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotate3d(0,1,0,90deg);transform:perspective(400px) rotate3d(0,1,0,90deg);opacity:0}}.flipOutY{-webkit-animation-duration:calc(var(--animate-duration) * .75);animation-duration:calc(var(--animate-duration) * .75);-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedInRight{from{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes lightSpeedInRight{from{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.lightSpeedInRight{-webkit-animation-name:lightSpeedInRight;animation-name:lightSpeedInRight;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedInLeft{from{-webkit-transform:translate3d(-100%,0,0) skewX(30deg);transform:translate3d(-100%,0,0) skewX(30deg);opacity:0}60%{-webkit-transform:skewX(-20deg);transform:skewX(-20deg);opacity:1}80%{-webkit-transform:skewX(5deg);transform:skewX(5deg)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes lightSpeedInLeft{from{-webkit-transform:translate3d(-100%,0,0) skewX(30deg);transform:translate3d(-100%,0,0) skewX(30deg);opacity:0}60%{-webkit-transform:skewX(-20deg);transform:skewX(-20deg);opacity:1}80%{-webkit-transform:skewX(5deg);transform:skewX(5deg)}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.lightSpeedInLeft{-webkit-animation-name:lightSpeedInLeft;animation-name:lightSpeedInLeft;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOutRight{from{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOutRight{from{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.lightSpeedOutRight{-webkit-animation-name:lightSpeedOutRight;animation-name:lightSpeedOutRight;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes lightSpeedOutLeft{from{opacity:1}to{-webkit-transform:translate3d(-100%,0,0) skewX(-30deg);transform:translate3d(-100%,0,0) skewX(-30deg);opacity:0}}@keyframes lightSpeedOutLeft{from{opacity:1}to{-webkit-transform:translate3d(-100%,0,0) skewX(-30deg);transform:translate3d(-100%,0,0) skewX(-30deg);opacity:0}}.lightSpeedOutLeft{-webkit-animation-name:lightSpeedOutLeft;animation-name:lightSpeedOutLeft;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{from{-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes rotateIn{from{-webkit-transform:rotate3d(0,0,1,-200deg);transform:rotate3d(0,0,1,-200deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes rotateInDownLeft{from{-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes rotateInDownLeft{from{-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateInDownRight{from{-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes rotateInDownRight{from{-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateInUpLeft{from{-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes rotateInUpLeft{from{-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateInUpRight{from{-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}@keyframes rotateInUpRight{from{-webkit-transform:rotate3d(0,0,1,-90deg);transform:rotate3d(0,0,1,-90deg);opacity:0}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateOut{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}@keyframes rotateOut{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,200deg);transform:rotate3d(0,0,1,200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes rotateOutDownLeft{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}@keyframes rotateOutDownLeft{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateOutDownRight{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutDownRight{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateOutUpLeft{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}@keyframes rotateOutUpLeft{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,-45deg);transform:rotate3d(0,0,1,-45deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateOutUpRight{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}@keyframes rotateOutUpRight{from{opacity:1}to{-webkit-transform:rotate3d(0,0,1,90deg);transform:rotate3d(0,0,1,90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes hinge{0%{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate3d(0,0,1,80deg);transform:rotate3d(0,0,1,80deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate3d(0,0,1,60deg);transform:rotate3d(0,0,1,60deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.hinge{-webkit-animation-duration:calc(var(--animate-duration) * 2);animation-duration:calc(var(--animate-duration) * 2);-webkit-animation-name:hinge;animation-name:hinge;-webkit-transform-origin:top left;transform-origin:top left}@-webkit-keyframes jackInTheBox{from{opacity:0;-webkit-transform:scale(.1) rotate(30deg);transform:scale(.1) rotate(30deg);-webkit-transform-origin:center bottom;transform-origin:center bottom}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}70%{-webkit-transform:rotate(3deg);transform:rotate(3deg)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes jackInTheBox{from{opacity:0;-webkit-transform:scale(.1) rotate(30deg);transform:scale(.1) rotate(30deg);-webkit-transform-origin:center bottom;transform-origin:center bottom}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}70%{-webkit-transform:rotate(3deg);transform:rotate(3deg)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.jackInTheBox{-webkit-animation-name:jackInTheBox;animation-name:jackInTheBox}@-webkit-keyframes rollIn{from{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes rollIn{from{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg);transform:translate3d(-100%,0,0) rotate3d(0,0,1,-120deg)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}@keyframes rollOut{from{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg);transform:translate3d(100%,0,0) rotate3d(0,0,1,120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInDown{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInLeft{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInRight{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInUp{from{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@keyframes zoomOut{from{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0)}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0)}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft;-webkit-transform-origin:left center;transform-origin:left center}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0)}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0)}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight;-webkit-transform-origin:right center;transform-origin:right center}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes slideInDown{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInDown{from{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{from{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInLeft{from{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{from{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInRight{from{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes slideInUp{from{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideOutDown{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes slideOutLeft{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes slideOutRight{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideOutUp{from{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}
/* ------------------------------------ end animate css ------------------------------------ */


/* ------------------------------------ magnific popup ------------------------------------ */
    .mfp-bg,.mfp-wrap{position:fixed;z-index:1055}.mfp-bg,.mfp-container,.mfp-wrap{left:0;top:0;width:100%;height:100%}.mfp-container:before,.mfp-content{display:inline-block;vertical-align:middle}.mfp-bg{overflow:hidden;background:#0b0b0b;opacity:.8}.mfp-wrap{outline:0!important;-webkit-backface-visibility:hidden;backface-visibility:hidden}.mfp-container{text-align:center;position:absolute;padding:0 8px;box-sizing:border-box}.mfp-container:before{content:'';height:100%}.mfp-align-top .mfp-container:before,.mfp-loading.mfp-figure,.mfp-s-error .mfp-content,.mfp-s-ready .mfp-preloader{display:none}.mfp-content{position:relative;margin:0 auto;text-align:left;z-index:1055}.mfp-ajax-holder .mfp-content,.mfp-inline-holder .mfp-content{width:100%;cursor:auto}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out}.mfp-gallery .mfp-image-holder .mfp-figure,.mfp-zoom{cursor:pointer}.mfp-zoom{cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.mfp-auto-cursor .mfp-content{cursor:auto}.mfp-arrow,.mfp-close,.mfp-counter,.mfp-preloader{-webkit-user-select:none;-moz-user-select:none;user-select:none}.mfp-hide{display:none!important}.mfp-preloader{color:#ccc;position:absolute;top:50%;width:auto;text-align:center;margin-top:-.8em;left:8px;right:8px;z-index:1055}.mfp-close,.mfp-preloader a:hover{color:#fff}.mfp-preloader a{color:#ccc}button.mfp-arrow,button.mfp-close{overflow:visible;cursor:pointer;background:0 0;border:0;-webkit-appearance:none;appearance:none;display:block;outline:0;padding:0;z-index:1055;box-shadow:none;touch-action:manipulation}.mfp-figure:after,.mfp-iframe-scaler iframe{box-shadow:0 0 8px rgba(0,0,0,.6);position:absolute;left:0}button::-moz-focus-inner{padding:0;border:0}.mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:.65;padding:0 0 18px 10px;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace}.mfp-arrow:focus,.mfp-arrow:hover,.mfp-close:focus,.mfp-close:hover{opacity:1}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#333}.mfp-iframe-holder .mfp-close,.mfp-image-holder .mfp-close{color:#fff;right:-6px;text-align:right;padding-right:6px;width:100%}.mfp-counter{position:absolute;top:0;right:0;color:#ccc;font-size:12px;line-height:18px;white-space:nowrap}.mfp-figure,img.mfp-img{line-height:0}.mfp-arrow{position:absolute;opacity:.65;margin:-55px 0 0;top:50%;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:transparent}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:after,.mfp-arrow:before{content:'';display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:inset transparent}.mfp-arrow:after{border-top-width:13px;border-bottom-width:13px;top:8px}.mfp-arrow:before{border-top-width:21px;border-bottom-width:21px;opacity:.7}.mfp-arrow-left{left:0}.mfp-arrow-left:after{border-right:17px solid #fff;margin-left:31px}.mfp-arrow-left:before{margin-left:25px;border-right:27px solid #3f3f3f}.mfp-arrow-right{right:0}.mfp-arrow-right:after{border-left:17px solid #fff;margin-left:39px}.mfp-arrow-right:before{border-left:27px solid #3f3f3f}.mfp-iframe-holder{padding-top:40px;padding-bottom:40px}.mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px}.mfp-image-holder .mfp-content,img.mfp-img{max-width:100%}.mfp-iframe-holder .mfp-close{top:-40px}.mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%}.mfp-iframe-scaler iframe{display:block;top:0;width:100%;height:100%;background:#000}.mfp-figure:after,img.mfp-img{width:auto;height:auto;display:block}img.mfp-img{box-sizing:border-box;padding:40px 0;margin:0 auto}.mfp-figure:after{content:'';top:40px;bottom:40px;right:0;z-index:-1;background:#444}.mfp-figure small{color:#bdbdbd;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto}.mfp-title{text-align:left;line-height:18px;color:#f3f3f3;word-wrap:break-word;padding-right:36px}@media screen and (max-width:800px) and (orientation:landscape),screen and (max-height:300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0}.mfp-img-mobile .mfp-bottom-bar:empty,.mfp-img-mobile img.mfp-img{padding:0}.mfp-img-mobile .mfp-figure:after{top:0;bottom:0}.mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;box-sizing:border-box}.mfp-img-mobile .mfp-counter{right:5px;top:3px}.mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,.6);position:fixed;text-align:center;padding:0}}@media all and (max-width:900px){.mfp-arrow{-webkit-transform:scale(.75);transform:scale(.75)}.mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0}.mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%}.mfp-container{padding-left:6px;padding-right:6px}}
/* ------------------------------------ end magnific popup ------------------------------------ */