@charset "UTF-8";

:root {

    --font-family: "Source Sans Pro";

    --font-size: 16px;

    --font-weight: 400;

    --font-style: normal;

    --line-height: 1.625;

    --heading-font-family: "Montserrat";

    --heading-font-size: 2.5rem;

    --heading-line-height: 1.3;

    --heading-font-weight: 700;

    --accent-color: #186ADC;

    --el-gradient-start: #1859B4;

    --el-gradient-end: #0467F1;

    --background-color: #ffffff;

    --background-secondary-color: #F0F4F8;

    --text-primary: #303036;

    --text-secondary: #63636b;

    --border-color: #D4D4E1;

    --placeholder-color: #6F6F76;

    --error-color: #ff3d0d;

    --alert-primary: #0065D1;

    --alert-success: #1CAB55;

    --alert-danger: #E91C1C;

    --alert-warning: #C79C00;

    --el-border-radius: 10px;

    --el-border-radius-min: 6px;

    --el-box-shadow: 2px 4px 20px 1px rgba(45, 45, 45, 0.13);

    --header-box-shadow: 0px 0px 14px 0px rgba(77, 82, 94, 0.15)

}



.preloader {

    position: fixed;

    left: 0;

    top: 0;

    display: flex;

    width: 100%;

    height: 100%;

    background-color: var(--background-color);

    opacity: 0;

    visibility: hidden;

    z-index: 1111111111;

    transition: opacity 0.2s

}



.preloader.active {

    opacity: 1;

    visibility: visible

}



.preloader-ellipsis {

    position: relative;

    display: block;

    margin: auto;

    width: 80px;

    height: 80px

}



.preloader-ellipsis div {

    position: absolute;

    top: 33px;

    width: 13px;

    height: 13px;

    border-radius: 50%;

    background: var(--text-primary);

    animation-timing-function: cubic-bezier(0, 1, 1, 0)

}



.preloader-ellipsis div:nth-child(1) {

    left: 8px;

    animation: preloader-ellipsis1 0.6s infinite

}



.preloader-ellipsis div:nth-child(2) {

    left: 8px;

    animation: preloader-ellipsis2 0.6s infinite

}



.preloader-ellipsis div:nth-child(3) {

    left: 32px;

    animation: preloader-ellipsis2 0.6s infinite

}



.preloader-ellipsis div:nth-child(4) {

    left: 56px;

    animation: preloader-ellipsis3 0.6s infinite

}



@keyframes preloader-ellipsis1 {

    0% {

        transform: scale(0)

    }

    100% {

        transform: scale(1)

    }

}



@keyframes preloader-ellipsis3 {

    0% {

        transform: scale(1)

    }

    100% {

        transform: scale(0)

    }

}



@keyframes preloader-ellipsis2 {

    0% {

        transform: translate(0, 0)

    }

    100% {

        transform: translate(24px, 0)

    }

}



@font-face {

    font-family: "Material Icons";

    font-style: normal;

    font-weight: 400;

    font-display: swap;

    src: url(../fonts/material-icons.woff2) format("woff2")

}



@font-face {

    font-family: "Material Icons Outlined";

    font-style: normal;

    font-weight: 400;

    font-display: swap;

    src: url(../fonts/material-icons-outlined.woff2) format("woff2")

}



* {

    box-sizing: border-box

}



*:before, *:after {

    box-sizing: border-box

}



html {

    font-size: var(--font-size)

}



html, body {

    min-height: 100%

}



body {

    font-size: 1rem;

    width: 100%;

    min-width: 320px;

    line-height: var(--line-height);

    font-family: var(--font-family);

    font-weight: var(--font-weight);

    font-style: var(--font-style);

    overflow-x: hidden;

    color: var(--text-primary);

    margin: 0;

    padding: 0;

    opacity: 1;

    background-color: var(--background-color)

}



body.overflow-hidden {

    overflow: hidden

}



.main {

    position: relative;

    margin: 0;

    padding: 0;

    min-height: 100vh;

    height: 100%;

    width: 100%;

    max-width: 2560px;

    margin: 0 auto;

    display: flex;

    flex-direction: column;

    opacity: 1;

    box-shadow: var(--el-box-shadow);

    visibility: hidden;

    opacity: 0

}



.main.main-visible {

    visibility: visible;

    opacity: 1

}



.main-inner {

    flex: 1 0 auto;

    overflow: hidden

}



.footer {

    flex: 0 0 auto

}



header ul, header ol, footer ul, footer ol, aside ul, aside ol, nav ul, nav ol {

    list-style: none;

    margin: 0;

    padding: 0

}



a {

    color: var(--accent-color);

    text-decoration: underline;

    transition: all 0.2s

}



a:hover {

    text-decoration: none;

    color: var(--accent-color)

}



code {

    font-size: 87.5%;

    color: #e83e8c;

    word-break: break-word

}



table {

    width: 100%;

    border-bottom: 1px solid var(--border-color)

}



table.table-border {

    border: 1px solid var(--border-color)

}



table.table-border td {

    border-right: 1px solid var(--border-color)

}



table.table-secondary tr:nth-child(even) {

    background-color: transparent

}



table.table-secondary tbody tr {

    border-bottom: 1px solid var(--border-color);

    transition: all 0.2s

}



table.table-secondary tbody tr:first-child {

    border-top: 1px solid var(--border-color)

}



table.table-secondary tbody tr:hover {

    background-color: var(--background-secondary-color)

}



table.table-bordered tr:nth-child(even) {

    background-color: transparent

}



table.table-bordered td {

    border: 1px solid var(--border-color)

}



table.table-bordered thead tr th {

    color: var(--text-primary);

    border: 1px solid var(--border-color)

}



table td, table th {

    padding: 1rem

}



table tr:nth-child(even) {

    background-color: var(--background-secondary-color)

}



table thead tr {

    border-bottom: 1px solid var(--border-color)

}



table thead tr th {

    font-weight: 700;

    font-size: 1rem

}



table tfoot {

    font-weight: 600

}



@media only screen and (max-width: 767.98px), only screen and (min-width: 567px) and (max-width: 900px) and (orientation: landscape) {

    .table-responsive {

        position: relative;

        width: 100%;

        overflow-y: auto

    }



    .table-responsive table {

        width: 650px

    }



    .table-responsive-outer {

        position: relative

    }



    .table-responsive-outer::after {

        content: "";

        position: absolute;

        top: 0;

        right: 0;

        width: .625rem;

        height: 100%;

        background-image: linear-gradient(0deg, rgba(255, 255, 255, .3), #fff)

    }



    .table-container::-webkit-scrollbar {

        -webkit-appearance: none;

        width: .875rem;

        height: .875rem

    }



    .table-container::-webkit-scrollbar-thumb {

        border-radius: var(--el-border-radius);

        border: 3px solid #fff;

        background-color: rgba(0, 0, 0, .3)

    }

}



h1, h2, h3, h4, h5, h6 {

    font-family: var(--heading-font-family);

    font-weight: var(--heading-font-weight);

    line-height: var(--heading-line-height);

    padding: 0;

    margin: 0 0 2rem 0

}



h1 {

    font-size: 2.5rem

}



h2 {

    font-size: 2rem

}



h3 {

    font-size: 1.75rem

}



h4 {

    font-size: 1.5rem

}



h5 {

    font-size: 1.25rem

}



h6 {

    font-size: 1.125rem

}



p {

    margin: 0 0 2rem 0

}



a {

    color: var(--accent-color);

    text-decoration: underline;

    transition: all 0.2s

}



a:hover {

    text-decoration: none;

    color: var(--accent-color)

}



code {

    font-size: 87.5%;

    color: #e83e8c;

    word-break: break-word

}



hr {

    border: none;

    border-top: 1px solid var(--border-color)

}



mark {

    padding: .2em;

    background-color: var(--accent-color);

    color: var(--background-color)

}



small {

    font-size: .85rem

}



blockquote {

    padding: 0 0 0 1.25em;

    font-style: italic;

    color: var(--text-secondary);

    border-left: 3px solid var(--accent-color)

}



blockquote p {

    margin-bottom: 0 !important

}



blockquote footer {

    color: var(--accent-color);

    font-style: normal;

    padding-top: .8em

}



.article, .entry-content {

    --margin: 2rem

}



.article.article-md, .entry-content.article-md {

    --margin: 1.5rem

}



.article > *, .entry-content > * {

    margin-bottom: var(--margin)

}



.article > *:last-child, .entry-content > *:last-child {

    margin-bottom: 0

}



.article h2, .article h3, .article h4, .article h5, .article h6, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 {

    margin-top: calc(var(--margin) + 0.5rem)

}



.article h2:first-child, .article h3:first-child, .article h4:first-child, .article h5:first-child, .article h6:first-child, .entry-content h2:first-child, .entry-content h3:first-child, .entry-content h4:first-child, .entry-content h5:first-child, .entry-content h6:first-child {

    margin-top: 0

}



.article ul:not([class*=wp-block-]), .article ol:not([class*=wp-block-]), .entry-content ul:not([class*=wp-block-]), .entry-content ol:not([class*=wp-block-]) {

    list-style: none;

    margin: 0 0 var(--margin) 0;

    padding: 0

}



.article ul:not([class*=wp-block-]) li, .article ol:not([class*=wp-block-]) li, .entry-content ul:not([class*=wp-block-]) li, .entry-content ol:not([class*=wp-block-]) li {

    position: relative;

    margin-bottom: .625rem

}



.article ul:not([class*=wp-block-]) li::before, .article ol:not([class*=wp-block-]) li::before, .entry-content ul:not([class*=wp-block-]) li::before, .entry-content ol:not([class*=wp-block-]) li::before {

    color: var(--accent-color);

    line-height: var(--line-height);

    margin-right: .5rem

}



.article ul:not([class*=wp-block-]) li::before, .entry-content ul:not([class*=wp-block-]) li::before {

    content: "•";

    margin-right: .75rem

}



.article ul:not([class*=wp-block-]) li > *, .entry-content ul:not([class*=wp-block-]) li > * {

    display: inline-flex

}



.article ol:not([class*=wp-block-]), .entry-content ol:not([class*=wp-block-]) {

    counter-reset: item

}



.article ol:not([class*=wp-block-]) li::before, .entry-content ol:not([class*=wp-block-]) li::before {

    content: counter(item) ".";

    counter-increment: item

}



.article img, .entry-content img {

    display: block;

    max-width: 100%;

    height: auto;

    border-radius: var(--el-border-radius)

}



.article .aligncenter, .entry-content .aligncenter {

    margin-left: auto;

    margin-right: auto

}



.article .alignright, .entry-content .alignright {

    margin-left: auto

}



.article.article-margin-min > *, .entry-content.article-margin-min > * {

    margin-bottom: 1.25rem

}



.article.article-margin-min > *:last-child, .entry-content.article-margin-min > *:last-child {

    margin-bottom: 0

}



.article.article-margin-min .section-subheading, .entry-content.article-margin-min .section-subheading {

    margin-bottom: .3125rem

}



.article.article-margin-min h2, .entry-content.article-margin-min h2 {

    font-size: 2.5rem

}



.article.article-margin-min h3, .entry-content.article-margin-min h3 {

    font-size: 2rem

}



.article.article-margin-min h2, .article.article-margin-min h3, .article.article-margin-min h4, .article.article-margin-min h5, .article.article-margin-min h6, .entry-content.article-margin-min h2, .entry-content.article-margin-min h3, .entry-content.article-margin-min h4, .entry-content.article-margin-min h5, .entry-content.article-margin-min h6 {

    margin-top: 0

}



.article.article-margin-min h2:first-child, .article.article-margin-min h3:first-child, .article.article-margin-min h4:first-child, .article.article-margin-min h5:first-child, .article.article-margin-min h6:first-child, .entry-content.article-margin-min h2:first-child, .entry-content.article-margin-min h3:first-child, .entry-content.article-margin-min h4:first-child, .entry-content.article-margin-min h5:first-child, .entry-content.article-margin-min h6:first-child {

    margin-top: 0

}



@media only screen and (max-width: 767.98px), only screen and (min-width: 567px) and (max-width: 900px) and (orientation: landscape) {

    h1 {

        font-size: 2rem

    }



    h2 {

        font-size: 1.75rem

    }



    h3 {

        font-size: 1.5rem

    }



    h4 {

        font-size: 1.25rem

    }



    h5 {

        font-size: 1.125rem

    }



    .article.article-margin-min h2 {

        font-size: 2rem

    }



    .article.article-margin-min h3 {

        font-size: 1.5rem

    }

}



.litems {

    margin-bottom: calc(0px - var(--bs-gutter-x) + var(--bs-gutter-x) / 2)

}



.litem {

    margin-bottom: calc(var(--bs-gutter-x) + var(--bs-gutter-x) / 2)

}



.items {

    margin-bottom: calc(0px - var(--bs-gutter-x))

}



.item {

    margin-bottom: var(--bs-gutter-x)

}



.item-style {

    position: relative;

    background-color: var(--background-color);

    border-radius: var(--el-border-radius);

    overflow: hidden;

    color: var(--text-primary);

    height: 100%;

    transition: box-shadow 0.2s

}



.item-style:hover {

    box-shadow: var(--el-box-shadow)

}



.item-style:hover::after {

    border-color: transparent

}



.item-style::after {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    border-radius: var(--el-border-radius);

    border: 1px solid var(--border-color);

    overflow: hidden;

    pointer-events: none;

    transition: border-color 0.2s;

    z-index: 1

}



.item-border-radius {

    border-radius: var(--el-border-radius);

    overflow: hidden

}



.item-bordered {

    border: 1px solid var(--border-color)

}



.aspect-ratio {

    --aspect-ratio-size: 100%;

    position: relative;

    display: block;

    width: 100%;

    overflow: hidden

}



.aspect-ratio::after {

    content: "";

    float: left;

    margin-top: 100%

}



.aspect-ratio.ar-3x4::after {

    margin-top: 133.33333%

}



.aspect-ratio.ar-4x3::after {

    margin-top: 75%

}



.aspect-ratio.ar-4x5::after {

    margin-top: 125%

}



.aspect-ratio.ar-5x4::after {

    margin-top: 80%

}



.aspect-ratio.ar-16x9::after {

    margin-top: 56.25%

}



.aspect-ratio.ar-9x16::after {

    margin-top: 177.7777%

}



.aspect-ratio.ar-2x1::after {

    margin-top: 50%

}



.aspect-ratio.ar-custom::after {

    margin-top: var(--aspect-ratio-size)

}



.aspect-ratio > img {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%

}



.flickity-slider .item-style:hover {

    box-shadow: none

}



.flickity-slider .item-style:hover::after {

    border-color: var(--accent-color)

}



.img-style {

    border-radius: var(--el-border-radius);

    overflow: hidden

}



.img-style img {

    margin: 0

}



.img-style-min {

    border-radius: calc(var(--el-border-radius) * 0.6)

}



.img-cover {

    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover

}



.img-responsive {

    display: block;

    max-width: 100%;

    height: auto

}



.item-heading, .item-heading-middle, .item-heading-large {

    font-family: var(--heading-font-family);

    font-size: 1.125rem;

    font-weight: var(--heading-font-weight)

}



.item-heading a, .item-heading-middle a, .item-heading-large a {

    text-decoration: none;

    color: var(--text-primary)

}



.item-heading a:hover, .item-heading-middle a:hover, .item-heading-large a:hover {

    color: var(--accent-color)

}



.item-heading-middle {

    font-size: 1.25rem

}



.item-heading-large {

    font-size: 1.5rem

}



.widget-heading {

    margin-bottom: 1.25rem

}



.item-border-radius {

    border-radius: var(--el-border-radius);

    overflow: hidden

}



.item-text-row {

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden

}



.item-text-row-2 {

    display: -webkit-box;

    -webkit-line-clamp: 2;

    -webkit-box-orient: vertical;

    overflow: hidden

}



.item-text-row-3 {

    display: -webkit-box;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;

    overflow: hidden

}



.content-items {

    margin-bottom: -3.5rem

}



.content-item {

    margin-bottom: 3.5rem

}



.el-ripple {

    --ripple-width: 100%;

    --ripple-time: 0.4s;

    position: relative;

    overflow: hidden;

    transition: all var(--ripple-time)

}



.el-ripple .el-ripple-circle {

    content: "";

    position: absolute;

    display: block;

    width: 0;

    height: 0;

    border-radius: 50%;

    background: var(--el-gradient-start);

    transform: translate(-50%, -50%);

    transition: width var(--ripple-time), padding-top var(--ripple-time);

    z-index: 0

}



.el-ripple span, .el-ripple div, .el-ripple i {

    position: relative;

    z-index: 1

}



.el-ripple:hover {

    color: var(--background-color)

}



.el-ripple:hover .el-ripple-circle {

    width: calc(var(--ripple-width) * 3);

    padding-top: calc(var(--ripple-width) * 3)

}



.list-style-none {

    list-style: none;

    padding: 0;

    margin: 0

}



.text-center {

    text-align: center

}



.text-right {

    text-align: right

}



.text-justify {

    text-align: justify

}



.text-secondary {

    color: var(--text-secondary)

}



.d-flex {

    display: flex;

    flex-wrap: wrap

}



.gutters-default {

    margin-right: -.625rem;

    margin-left: -.625rem

}



.gutters-default > .col, .gutters-default > [class*=col-] {

    padding-right: .625rem;

    padding-left: .625rem

}



.gutters-20 {

    margin-right: -.625rem;

    margin-left: -.625rem

}



.gutters-20 > .col, .gutters-20 > [class*=col-] {

    padding-right: .625rem;

    padding-left: .625rem

}



.gutters-10 {

    margin-right: -.3125rem;

    margin-left: -.3125rem

}



.gutters-10 > .col, .gutters-10 > [class*=col-] {

    padding-right: .3125rem;

    padding-left: .3125rem

}



.flex-nowrap {

    flex-wrap: nowrap

}



.bread-crumbs {

    position: relative;

    padding: 1.125rem 0;

    background-color: var(--background-secondary-color)

}



.bread-crumbs-list {

    position: relative;

    display: flex;

    font-size: 1rem;

    overflow: hidden;

    color: var(--accent-color)

}



.bread-crumbs-list li {

    position: relative;

    margin-right: 2rem;

    white-space: nowrap

}



.bread-crumbs-list li:last-child {

    margin-right: 0

}



.bread-crumbs-list li:last-child i {

    display: none

}



.bread-crumbs-list li a {

    text-decoration: none;

    color: var(--text-secondary)

}



.bread-crumbs-list li a:hover {

    text-decoration: underline

}



.bread-crumbs-list li i {

    position: absolute;

    top: 50%;

    right: -1.5625rem;

    margin-top: -.5625rem

}



.btn-group {

    display: flex;

    flex-wrap: wrap;

    align-items: flex-start;

    margin: 0 0 -1.25rem -1.25rem

}



.btn-group > * {

    display: block;

    margin: 0 0 1.25rem 1.25rem

}



.btn {

    --ripple-width: 100%;

    --ripple-time: 0.4s;

    position: relative;

    display: inline-block;

    text-align: center;

    font-size: 1rem;

    font-weight: var(--font-weight);

    font-family: var(--font-family);

    line-height: var(--line-height);

    color: var(--background-color);

    fill: var(--background-color);

    background: var(--el-gradient-end);

    background: linear-gradient(to right, var(--el-gradient-start) 0%, var(--el-gradient-end) 100%);

    text-decoration: none;

    padding: .75em 1.75em;

    border-radius: var(--el-border-radius-min);

    outline: none;

    border: none;

    cursor: pointer;

    overflow: hidden;

    transition: color var(--ripple-time), fill var(--ripple-time)

}



.btn > i, .btn > span, .btn > svg, .btn > img {

    position: relative;

    z-index: 1

}



.btn > img {

    width: 1.375rem;

    height: 1.375rem

}



.btn .el-ripple-circle {

    content: "";

    position: absolute;

    display: block;

    width: 0;

    height: 0;

    border-radius: 50%;

    background: var(--el-gradient-start);

    transform: translate(-50%, -50%);

    transition: width var(--ripple-time), padding-top var(--ripple-time);

    z-index: 0

}



.btn.btn-w240 {

    min-width: 15rem

}



.btn.btn-wide {

    display: block;

    width: 100%

}



.btn.btn-min {

    font-size: .875rem;

    padding: .375em 1em

}



.btn.btn-min.btn-with-icon > svg {

    width: .8125rem;

    min-width: .8125rem;

    height: .8125rem

}



.btn.btn-min > img {

    width: 1.25rem;

    height: 1.25rem

}



.btn.btn-small {

    font-size: .875rem

}



.btn.btn-small.btn-with-icon > svg {

    width: .8125rem;

    min-width: .8125rem;

    height: .8125rem

}



.btn.btn-small > img {

    width: 1.25rem;

    height: 1.25rem

}



.btn.btn-large {

    font-size: 1.125rem

}



.btn.btn-large.btn-with-icon > svg {

    width: 1rem;

    min-width: 1rem;

    height: 1rem

}



.btn.btn-large > img {

    width: 1.5rem;

    height: 1.5rem

}



.btn.btn-border {

    background: transparent;

    color: var(--text-primary);

    fill: var(--text-primary)

}



.btn.btn-border:hover {

    background: none;

    color: var(--background-color)

}



.btn.btn-border::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    border: 1px solid var(--text-primary);

    border-radius: var(--el-border-radius-min);

    overflow: hidden

}



.btn.btn-border .el-ripple-circle {

    background: var(--text-primary)

}



.btn.btn-with-icon {

    display: flex;

    align-items: center;

    justify-content: center

}



.btn.btn-with-icon > svg {

    width: .875rem;

    height: .875rem

}



.btn.btn-with-icon .btn-icon-right {

    margin-left: .5rem

}



.btn.btn-with-icon .btn-icon-left {

    margin-right: .5rem

}



.btn:focus {

    outline: none

}



.btn:hover {

    color: var(--background-color);

    fill: var(--background-color)

}



.btn:hover .el-ripple-circle {

    width: calc(var(--ripple-width) * 2.5);

    padding-top: calc(var(--ripple-width) * 2.5)

}



.play-video {

    position: absolute;

    left: 50%;

    top: 50%;

    width: 4rem;

    height: 4rem;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    transform: translate(-50%, -50%);

    background-color: var(--background-color);

    box-shadow: var(--el-box-shadow);

    color: var(--accent-color);

    cursor: pointer;

    transition: all 0.2s

}



.play-video.play-video-static {

    position: relative;

    left: inherit;

    top: inherit;

    transform: none

}



.play-video.play-video-sm {

    width: 3rem;

    height: 3rem

}



.play-video.play-video-sm .material-icons {

    font-size: 1.75rem;

    width: 1.75rem;

    height: 1.75rem

}



.play-video .material-icons {

    font-size: 2.25rem;

    width: 2.25rem;

    height: 2.25rem

}



.ripple {

    position: relative;

    overflow: hidden

}



.ripple-effect {

    display: inline-block;

    position: absolute;

    top: 0;

    left: 0;

    width: .25rem;

    height: .25rem;

    background-color: rgba(255, 255, 255, .3);

    border-radius: 50%;

    animation: ripple 1s ease forwards;

    z-index: 3

}



@keyframes ripple {

    0% {

        transform: none

    }

    100% {

        transform: scale(250)

    }

}



.hover-link.active, .hover-link.open, .hover-link:hover {

    color: var(--accent-color)

}



.wrapp-btn-circl-arrow {

    display: flex;

    flex-wrap: wrap

}



.btn-circl-arrow {

    position: relative;

    display: flex;

    width: 2rem;

    height: 2rem;

    color: var(--background-color);

    fill: var(--background-color);

    background-color: var(--accent-color);

    border-radius: 50%;

    text-align: center;

    font-size: 1rem;

    overflow: hidden

}



.btn-circl-arrow:hover {

    background-color: var(--background-secondary-color)

}



.btn-circl-arrow > svg {

    margin: auto;

    transition: all 0.2s

}



.btn-circl-arrow.btn-circl-arrow-white {

    color: var(--accent-color);

    fill: var(--accent-color);

    background-color: var(--background-color)

}



.btn-circl-arrow.btn-circl-arrow-white:hover {

    background-color: var(--background-secondary-color)

}



.btn-circl-arrow-text {

    position: absolute;

    transform: translateX(-100%);

    z-index: 1;

    white-space: nowrap;

    margin-right: .625rem;

    line-height: 2rem;

    transition: all 0.2s

}



.wrapp-btn-link {

    display: flex

}



.btn-link {

    display: flex;

    align-items: center;

    font-size: 1rem;

    text-decoration: none;

    color: var(--accent-color);

    fill: var(--accent-color)

}



.btn-link .btn-link-ico {

    margin-top: -.0625rem;

    transition: all 0.2s

}



.btn-link .btn-link-ico-right {

    margin-left: .375rem

}



.btn-link .btn-link-ico-left {

    margin-right: .625rem

}



.btn-link:hover .btn-link-ico {

    transform: rotateY(180deg)

}



.btn-top {

    position: fixed;

    right: 15px;

    bottom: -5rem;

    width: 2.5rem;

    height: 2.5rem;

    display: flex;

    border-radius: var(--el-border-radius-min);

    border: 1px solid var(--border-color);

    background: var(--background-color);

    z-index: 100;

    fill: var(--accent-color);

    transition: all 0.2s;

    cursor: pointer;

    opacity: 0;

    visibility: hidden

}



.btn-top.active {

    opacity: 1;

    visibility: visible;

    bottom: 15px

}



.btn-top:hover {

    border-color: var(--accent-color);

    fill: var(--accent-color)

}



.btn-top > svg {

    width: .875rem;

    height: .625rem;

    margin: auto;

    transform: rotate(-90deg)

}



*::-webkit-input-placeholder, *::placeholder {

    color: var(--placeholder-color);

    opacity: 1

}



input[type=text], input[type=email], input[type=tel], input[type=password], input[type=number], input[type=search], input[type=url], input[type=date], input[type=month], input[type=week], input[type=time], input[type=datetime-local], input[type=file], textarea, select, .form-field-input-file {

    display: block;

    font-size: 1rem;

    font-family: var(--font-family);

    font-weight: var(--font-weight);

    width: 100%;

    padding: calc(0.75em - 1px) 1rem;

    margin-bottom: 1rem;

    line-height: var(--line-height);

    border-radius: var(--el-border-radius-min);

    border: 1px solid var(--border-color);

    background-color: transparent;

    outline: none;

    color: var(--text-primary);

    box-shadow: none;

    appearance: none;

    transition: all 0.2s

}



input[type=text]:focus, input[type=email]:focus, input[type=tel]:focus, input[type=password]:focus, input[type=number]:focus, input[type=search]:focus, input[type=url]:focus, input[type=date]:focus, input[type=month]:focus, input[type=week]:focus, input[type=time]:focus, input[type=datetime-local]:focus, input[type=file]:focus, textarea:focus, select:focus, .form-field-input-file:focus {

    border-color: var(--accent-color)

}



input[type=text]:disabled, input[type=email]:disabled, input[type=tel]:disabled, input[type=password]:disabled, input[type=number]:disabled, input[type=search]:disabled, input[type=url]:disabled, input[type=date]:disabled, input[type=month]:disabled, input[type=week]:disabled, input[type=time]:disabled, input[type=datetime-local]:disabled, input[type=file]:disabled, textarea:disabled, select:disabled, .form-field-input-file:disabled {

    background-color: var(--background-secondary-color)

}



.form-field-input-file {

    color: var(--placeholder-color);

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden;

    padding-right: 2.25rem

}



.form-field-input-file::after {

    content: "\e2bc";

    font-family: "Material Icons";

    font-size: 1.5rem;

    color: var(--placeholder-color);

    position: absolute;

    right: .75rem;

    top: 50%;

    transform: translateY(-50%)

}



textarea {

    height: auto;

    resize: none

}



.select {

    position: relative

}



.select select {

    padding-right: 2rem

}



.select::after {

    content: "\e5d7";

    font-family: "Material Icons";

    font-size: 1.375rem;

    position: absolute;

    right: .625rem;

    top: 50%;

    transform: translateY(-50%);

    color: var(--placeholder-color);

    pointer-events: none

}



.form-fields {

    margin-bottom: -1.25rem

}



.form-field {

    position: relative;

    margin-bottom: 1.25rem

}



.form-field input[type=text], .form-field input[type=email], .form-field input[type=tel], .form-field input[type=password], .form-field input[type=number], .form-field input[type=search], .form-field input[type=url], .form-field input[type=date], .form-field input[type=month], .form-field input[type=week], .form-field input[type=time], .form-field input[type=datetime-local], .form-field input[type=file], .form-field textarea, .form-field select, .form-field .form-field-input-file, .form-field .form-field-label {

    margin: 0

}



.form-field.form-field-m0 {

    margin: 0

}



.form-field.focus .form-field-label {

    opacity: 0;

    visibility: hidden;

    transform: translateX(1rem)

}



.form-field label.error {

    position: absolute;

    right: .3125rem;

    top: .3125rem;

    color: var(--error-color);

    font-size: .75rem;

    line-height: 1

}



.form-field input.error, .form-field textarea.error, .form-field select.error {

    border-color: var(--error-color)

}



.form-field input[type=file] {

    position: absolute;

    left: 0;

    top: 0;

    width: 0;

    height: 0;

    opacity: 0;

    visibility: hidden;

    z-index: -111

}



.form-field input[type=file].error + .error + .form-field-input-file {

    border-color: var(--error-color)

}



.form-field.form-field-large input[type=text], .form-field.form-field-large input[type=email], .form-field.form-field-large input[type=tel], .form-field.form-field-large input[type=password], .form-field.form-field-large input[type=number], .form-field.form-field-large input[type=search], .form-field.form-field-large input[type=url], .form-field.form-field-large input[type=date], .form-field.form-field-large input[type=month], .form-field.form-field-large input[type=week], .form-field.form-field-large input[type=time], .form-field.form-field-large input[type=datetime-local], .form-field.form-field-large input[type=file], .form-field.form-field-large textarea, .form-field.form-field-large select, .form-field.form-field-large .form-field-input-file, .form-field.form-field-large .form-field-label {

    font-size: 1.125rem

}



.form-field.form-field-large .select::after {

    font-size: 1.5rem

}



.form-field.form-field-large .form-field-input-file {

    padding-right: 2.5rem

}



.form-field.form-field-large .form-field-input-file::after {

    font-size: 1.75rem

}



.form-field.form-field-small input[type=text], .form-field.form-field-small input[type=email], .form-field.form-field-small input[type=tel], .form-field.form-field-small input[type=password], .form-field.form-field-small input[type=number], .form-field.form-field-small input[type=search], .form-field.form-field-small input[type=url], .form-field.form-field-small input[type=date], .form-field.form-field-small input[type=month], .form-field.form-field-small input[type=week], .form-field.form-field-small input[type=time], .form-field.form-field-small input[type=datetime-local], .form-field.form-field-small input[type=file], .form-field.form-field-small textarea, .form-field.form-field-small select, .form-field.form-field-small .form-field-input-file, .form-field.form-field-small .form-field-label {

    font-size: .875rem

}



.form-field.form-field-small .select::after {

    font-size: 1.25rem

}



.form-field.form-field-small .form-field-input-file {

    padding-right: 2rem

}



.form-field.form-field-small .form-field-input-file::after {

    font-size: 1.25rem

}



.form-field small {

    color: var(--text-secondary)

}



.input-states-labelled {

    display: block

}



.form-field-group {

    position: relative

}



.form-field-group.focus .form-field-label {

    opacity: 0;

    visibility: hidden;

    transform: translateX(1rem)

}



.required {

    color: var(--error-color)

}



.form-field-label {

    font-size: 1rem;

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    pointer-events: none;

    color: var(--placeholder-color);

    padding: calc(0.75em - 1px) 1rem;

    transition: all 0.2s;

    border: 1px solid transparent;

    opacity: 1;

    visibility: visible;

    transform: none

}



.form-btn {

    display: flex

}



.form-btn.form-btn-wide .btn {

    width: 100%

}



.form-btn .btn {

    display: block

}



.custom-controls {

    display: flex;

    flex-wrap: wrap;

    margin-left: -1.5rem;

    margin-bottom: -1rem

}



.custom-control {

    margin-left: 1.5rem;

    margin-bottom: 1rem

}



.checkbox {

    position: relative

}



.checkbox-input {

    position: absolute;

    left: 0;

    top: 0;

    z-index: -1;

    width: 0;

    height: 0;

    visibility: hidden;

    opacity: 0

}



.checkbox-input:hover + .checkbox-label::before {

    border-color: var(--accent-color)

}



.checkbox-input:checked + .checkbox-label::after {

    opacity: 1

}



.checkbox-input:checked + .checkbox-label::before {

    border-color: var(--accent-color)

}



.checkbox-label {

    position: relative;

    font-size: .9375rem;

    font-weight: var(--font-weight);

    line-height: 1.25rem;

    margin: 0;

    padding: .0625rem 0 0 1.875rem;

    cursor: pointer

}



.checkbox-label::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    display: flex;

    width: 1.25rem;

    height: 1.25rem;

    min-width: 1.25rem;

    border: 1px solid var(--border-color);

    fill: var(--accent-color);

    color: var(--accent-color);

    border-radius: .25rem;

    transition: all 0.2s

}



.checkbox-label::after {

    content: "\e5ca";

    position: absolute;

    left: 0;

    top: 0;

    font-family: "Material Icons";

    text-align: center;

    font-size: 1rem;

    width: 1.25rem;

    height: 1.25rem;

    line-height: 1.25rem;

    color: var(--accent-color);

    opacity: 0;

    transition: all 0.2s

}



.radio {

    position: relative

}



.radio-input {

    position: absolute;

    left: 0;

    top: 0;

    z-index: -1;

    width: 0;

    height: 0;

    visibility: hidden;

    opacity: 0

}



.radio-input:hover + .radio-label::before {

    border-color: var(--accent-color)

}



.radio-input:checked + .radio-label::after {

    opacity: 1

}



.radio-input:checked + .radio-label::before {

    border-color: var(--accent-color)

}



.radio-label {

    position: relative;

    display: flex;

    font-size: .9375rem;

    font-weight: var(--font-weight);

    line-height: 1.25rem;

    margin: 0;

    padding: .0625rem 0 0 1.875rem;

    cursor: pointer

}



.radio-label::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    display: flex;

    width: 1.25rem;

    height: 1.25rem;

    min-width: 1.25rem;

    border: 1px solid var(--border-color);

    border-radius: 50%;

    fill: var(--accent-color);

    color: var(--accent-color);

    transition: all 0.2s

}



.radio-label::after {

    content: "";

    position: absolute;

    left: .3125rem;

    top: .3125rem;

    width: .625rem;

    height: .625rem;

    background-color: var(--accent-color);

    border-radius: 50%;

    opacity: 0;

    transition: all 0.2s

}



.toggle {

    position: relative;

    display: inline-flex;

    align-items: center;

    cursor: pointer

}



.toggle input {

    position: absolute;

    width: 0;

    height: 0;

    opacity: 0;

    visibility: hidden;

    z-index: -1

}



.toggle input:checked + .toggle-text {

    color: var(--text-primary)

}



.toggle input:checked + .toggle-text + .toggle-slider::after {

    transform: translateX(1.25rem)

}



.toggle input:checked + .toggle-text + .toggle-slider + .toggle-text {

    color: var(--accent-color)

}



.toggle-slider {

    position: relative;

    display: block;

    height: 1.5rem;

    width: 2.75rem;

    border-radius: 100px;

    overflow: hidden;

    background-color: var(--accent-color)

}



.toggle-slider::after {

    content: "";

    position: absolute;

    left: .125rem;

    top: .125rem;

    width: 1.25rem;

    height: 1.25rem;

    border-radius: 50%;

    background-color: var(--background-color);

    transition: transform 0.2s

}



.toggle-text {

    display: flex;

    align-items: center;

    transition: color 0.2s

}



.toggle-text-before {

    color: var(--accent-color);

    margin-right: .625rem

}



.toggle-text-before .badge {

    margin-right: .5rem

}



.toggle-text-after {

    margin-left: .625rem

}



.toggle-text-after .badge {

    margin-left: .5rem

}



.form-center {

    max-width: 31.25rem;

    margin-left: auto;

    margin-right: auto

}



.form-or-text {

    text-transform: uppercase;

    text-align: center;

    margin: 1.5rem 0;

    font-size: 1rem;

    position: relative;

    overflow: hidden;

    color: var(--text-secondary)

}



.form-or-text span {

    position: relative;

    z-index: 1;

    padding: 0 .625rem;

    background-color: var(--background-color)

}



.form-or-text span::after {

    content: "";

    position: absolute;

    right: 100%;

    top: 50%;

    width: 62.5rem;

    height: 1px;

    margin-top: -1px;

    background-color: var(--border-color)

}



.form-or-text span::before {

    content: "";

    position: absolute;

    left: 100%;

    top: 50%;

    width: 62.5rem;

    height: 1px;

    margin-top: -1px;

    background-color: var(--border-color)

}



.social-login {

    list-style: none;

    margin: 0 0 -1rem -1rem;

    padding: 0;

    display: flex;

    font-size: 1rem;

    width: 100%

}



.social-login.social-login-wide {

    display: block

}



.social-login li {

    margin: 0 0 1rem 1rem;

    width: 100%;

    border-radius: var(--el-border-radius-min);

    overflow: hidden

}



.social-login li a {

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--background-color);

    fill: var(--background-color);

    font-size: 1rem;

    padding: calc(0.95em - 1px) 1rem;

    text-decoration: none

}



.social-login li a svg {

    width: 1rem;

    height: 1rem;

    margin-right: .625rem

}



.social-login li a.link-google-plus svg {

    width: 1.375rem;

    height: 1.375rem

}



.link-facebook {

    background-color: #29487d

}



.link-facebook:hover {

    background-color: rgba(41, 72, 125, .8)

}



.link-twitter {

    background-color: #1da1f2

}



.link-twitter:hover {

    background-color: rgba(29, 161, 242, .8)

}



.link-google-plus {

    background-color: #e85858

}



.link-google-plus:hover {

    background-color: rgba(232, 88, 88, .8)

}



.section-subscribe-bg {

    min-height: 21.875rem;

    display: flex;

    align-items: center;

    flex-wrap: wrap

}



.section-subscribe-bg-header {

    text-align: center;

    max-width: 37.5rem;

    margin-left: auto;

    margin-right: auto

}



@media (min-width: 768px) {

    .form-fields-md {

        margin-bottom: -1.25rem

    }

}



@media (min-width: 992px) {

    .form-fields-lg {

        margin-bottom: -1.25rem

    }

}



@media (min-width: 1200px) {

    .form-fields-xl {

        margin-bottom: -1.25rem

    }

}



.material-icons {

    font-family: "Material Icons";

    font-weight: 400;

    font-style: normal;

    line-height: 1;

    letter-spacing: normal;

    text-transform: none;

    display: inline-block;

    white-space: nowrap;

    word-wrap: normal;

    direction: ltr;

    -webkit-font-smoothing: antialiased;

    font-size: 1rem;

    height: 1rem;

    width: 1rem

}



.material-icons.material-icons-outlined {

    font-family: "Material Icons Outlined"

}



.material-icons.md-18 {

    font-size: 1.125rem;

    width: 1.125rem;

    height: 1.125rem

}



.material-icons.md-20 {

    font-size: 1.25rem;

    width: 1.25rem;

    height: 1.25rem

}



.material-icons.md-22 {

    font-size: 1.375rem;

    width: 1.375rem;

    height: 1.375rem

}



.material-icons.md-24 {

    font-size: 1.5rem;

    width: 1.5rem;

    height: 1.5rem

}



.material-icons.md-26 {

    font-size: 1.625rem;

    width: 1.625rem;

    height: 1.625rem

}



.material-icons.md-28 {

    font-size: 1.75rem;

    width: 1.75rem;

    height: 1.75rem

}



.material-icons.md-32 {

    font-size: 2rem;

    width: 2rem;

    height: 2rem

}



.material-icons.md-36 {

    font-size: 2.25rem;

    width: 2.25rem;

    height: 2.25rem

}



.material-icons.md-40 {

    font-size: 2.5rem;

    width: 2.5rem;

    height: 2.5rem

}



.material-icons.md-44 {

    font-size: 2.75rem;

    width: 2.75rem;

    height: 2.75rem

}



.material-icons.md-48 {

    font-size: 3rem;

    width: 3rem;

    height: 3rem

}



.material-icons.md-60 {

    font-size: 3.75rem;

    width: 3.875rem;

    height: 3.75rem

}



.material-icons.md-72 {

    font-size: 4.5rem;

    width: 4.5rem;

    height: 4.5rem

}



.alerts {

    position: fixed;

    right: 1rem;

    bottom: 1rem;

    padding-left: 15px;

    z-index: 300000

}



.alerts.alerts-static {

    position: relative;

    right: 0;

    bottom: 0;

    padding: 0;

    z-index: 0

}



.alerts.alerts-static .alert {

    margin-left: 0

}



.alert {

    position: relative;

    padding: .75rem 1rem;

    display: flex;

    align-items: flex-start;

    border-radius: var(--el-border-radius-min);

    color: var(--text-primary);

    font-size: 1rem;

    margin-left: 15px;

    margin-bottom: .625rem;

    overflow: hidden

}



.alert::before, .alert::after {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%

}



.alert::after {

    background-color: var(--alert-primary);

    opacity: .15;

    z-index: -1

}



.alert::before {

    background-color: var(--background-color);

    z-index: -2

}



.alert a {

    color: var(--text-primary);

    text-decoration: none;

    font-weight: 600

}



.alert a a {

    color: var(--text-primary)

}



.alert a:hover {

    text-decoration: underline

}



.alert .alert-ico {

    color: var(--alert-primary)

}



.alert:last-child {

    margin-bottom: 0

}



.alert.alert-success::after {

    background-color: var(--alert-success)

}



.alert.alert-success .alert-ico {

    color: var(--alert-success)

}



.alert.alert-danger::after {

    background-color: var(--alert-danger)

}



.alert.alert-danger .alert-ico {

    color: var(--alert-danger)

}



.alert.alert-warning::after {

    background-color: var(--alert-warning)

}



.alert.alert-warning .alert-ico {

    color: var(--alert-warning)

}



.alert-text {

    line-height: 1.375rem

}



.alert-ico {

    display: flex;

    align-items: center;

    margin-right: .625rem

}



.alert-close {

    position: absolute;

    right: .375rem;

    top: .375rem;

    padding: 0;

    border: none;

    background-color: transparent;

    line-height: 1;

    cursor: pointer;

    color: var(--text-primary);

    outline: none;

    opacity: .6;

    transition: all 0.2s

}



.alert-close:focus {

    outline: none

}



.alert-close:hover {

    opacity: 1;

    transform: rotate(90deg)

}



.alert-title {

    margin-bottom: .625rem;

    margin-left: 1rem

}



.badges {

    display: flex;

    flex-wrap: wrap;

    margin-left: -.5rem

}



.badges > * {

    margin-left: .5rem

}



.badge {

    position: relative;

    display: inline-flex;

    font-size: .625rem;

    text-transform: uppercase;

    color: var(--text-primary);

    padding: .125rem .375rem;

    font-weight: 700;

    white-space: nowrap;

    border-radius: var(--el-border-radius-min);

    overflow: hidden;

    z-index: 1

}



.badge::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background-color: var(--background-color);

    pointer-events: none;

    z-index: -1

}



.badge::after {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background-color: var(--text-primary);

    border-radius: var(--el-border-radius-min);

    opacity: .1

}



.badge.badge-primary {

    color: var(--alert-primary)

}



.badge.badge-primary::after {

    background-color: var(--alert-primary)

}



.badge.badge-danger {

    color: var(--alert-danger)

}



.badge.badge-danger::after {

    background-color: var(--alert-danger)

}



.badge.badge-success {

    color: var(--alert-success)

}



.badge.badge-success::after {

    background-color: var(--alert-success)

}



.badge.badge-warning {

    color: var(--alert-warning)

}



.badge.badge-warning::after {

    background-color: var(--alert-warning)

}



.widget-brand-info {

    display: flex;

    flex-direction: column;

    justify-content: space-between;

    height: 100%;

    line-height: 1

}



.widget-brand-info .logo {

    display: inline-flex;

    opacity: 1

}



.widget-brand-info .logo img {

    margin: 0;

    width: 100%;

    height: 100%

}



.widget-brand-info .wbim-socials {

    margin-top: 1.25rem

}



.widget-brand-info.aligncenter {

    text-align: center

}



.widget-brand-info.aligncenter .widget-brand-info-main, .widget-brand-info.aligncenter .logo {

    margin-left: auto;

    margin-right: auto

}



.widget-brand-info.aligncenter .widget-socials {

    justify-content: center

}



.widget-brand-info.alignright {

    text-align: right

}



.widget-brand-info.alignright .widget-brand-info-main, .widget-brand-info.alignright .logo {

    margin-left: auto

}



.widget-brand-info.alignright .widget-socials {

    justify-content: flex-end

}



.wbim-p p {

    margin-top: 1.25rem

}



.widget-brand-info-main {

    max-width: 30rem

}



.widget-brand-info-main > *:last-child {

    margin-bottom: 0

}



.widget-brand-info-main p {

    line-height: var(--line-height)

}



.widget-contacts {

    list-style: 0;

    margin: 0;

    padding: 0

}



.widget-contacts li {

    display: flex;

    margin-bottom: 1rem

}



.widget-contacts li:last-child {

    margin-bottom: 0

}



.widget-contacts li i {

    margin-right: .5rem

}



.widget-contacts i {

    display: flex;

    align-items: center;

    justify-content: center;

    margin-top: 2px

}



.widget-contacts i.footer-contact-tel {

    font-size: 1.25rem

}



.widget-contacts i.footer-contact-email {

    font-size: 1.125rem

}



.widget-contacts-info a {

    opacity: 1

}



.widget-contacts-info a:hover {

    text-decoration: underline

}



.widget-contacts-info p {

    margin: 0

}



.article .widget-contacts li {

    padding: 0

}



.article .widget-contacts li::before {

    content: none

}



.widget-socials {

    display: flex;

    list-style: none;

    margin: 0;

    padding: 0;

    transition: all 0.2s

}



.widget-socials > li {

    margin-right: .625rem

}



.widget-socials > li:last-child {

    margin-right: 0

}



.widget-socials > li > a {

    display: flex;

    width: 1.5rem;

    height: 1.5rem;

    fill: var(--text-primary)

}



.widget-socials > li > a > svg {

    display: block;

    width: 1rem;

    height: 1rem;

    margin: auto

}



.widget-socials.widget-socials-bordered > li > a {

    width: 2.25rem;

    height: 2.25rem;

    border-radius: var(--el-border-radius-min);

    border: 1px solid var(--border-color)

}



.widget-socials.widget-socials-bordered > li > a:hover {

    border-color: var(--text-secondary)

}



.widget-socials.widget-socials-bordered-hover-bg > li > a:hover {

    background-color: var(--text-primary);

    border-color: var(--text-primary);

    fill: var(--background-color)

}



.header {

    position: relative;

    width: 100%

}



.header.fixed {

    position: fixed;

    z-index: 101

}



.header.header-clear {

    padding: 1rem 0

}



.header-center {

    box-shadow: var(--header-box-shadow)

}



.header-center .header-lang-list {

    right: inherit;

    left: 0

}



.header-center .header-fixed {

    box-shadow: none

}



.header-center .header-fixed.fixed {

    box-shadow: var(--header-box-shadow)

}



.header-center .logo img {

    max-height: 6rem

}



.header-logo-center {

    padding: 1.5rem 0 .5rem;

    line-height: 1

}



.header-fixed {

    position: relative;

    left: 0;

    top: 0;

    width: 100%;

    padding: .75rem 0;

    background-color: var(--background-color);

    font-size: 1rem;

    min-height: 3.5rem;

    display: flex;

    align-items: center;

    z-index: 101;

    box-shadow: var(--header-box-shadow)

}



.header-fixed.sticky {

    position: sticky

}



.header-fixed.fixed {

    position: fixed

}



.header-fixed .col-static {

    position: static

}



.header-fixed .container {

    position: relative

}



.logo-wrapper {

    display: flex;

    align-items: center

}



.logo-wide {

    min-width: 16rem

}



.logo {

    --logo-max-width: 133px;

    --logo-max-height: 36px;

    display: inline-flex;

    text-decoration: none

}



.logo img {

    display: block;

    width: 100%;

    height: 100%;

    object-fit: contain;

    max-height: var(--logo-max-height);

    max-width: var(--logo-max-width)

}



.logo svg {

    display: block

}



.logo-text {

    font-family: var(--heading-font-family);

    font-size: 1.125rem;

    font-weight: var(--heading-font-weight);

    line-height: var(--heading-line-height);

    text-decoration: none;

    color: var(--text-primary)

}



body.mmm-open {

    overflow: hidden

}



body.mmm-open .header-fixed {

    box-shadow: var(--header-box-shadow)

}



body.mmm-open .mmm {

    transform: none

}



.mmm {

    display: none;

    position: fixed;

    left: 0;

    top: 0;

    flex-direction: column;

    justify-content: space-between;

    width: 100%;

    height: 100%;

    max-width: 20rem;

    background-color: var(--background-color);

    z-index: 100;

    box-shadow: var(--header-box-shadow);

    transform: translateX(-150%);

    overflow: hidden;

    overflow-y: auto;

    transition: transform 0.6s

}



.mf-bg {

    position: fixed;

    left: 0;

    top: 0;

    width: 0;

    height: 0;

    z-index: 99;

    opacity: 0;

    cursor: pointer;

    visibility: hidden;

    transition: opacity 0.4s

}



.mf-bg::after {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, .8)

}



.mf-bg.visible {

    opacity: 1;

    visibility: visible;

    width: 100%;

    height: 100%

}



.mf-bg.side-visible {

    z-index: 1110

}



.mmm-footer {

    padding: 1.25rem;

    font-size: 1rem;

    border-bottom: 1px solid var(--background-color)

}



.mmm-lang {

    list-style: none;

    margin: 0;

    padding: 0;

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    text-transform: capitalize;

    margin: 0 -1.25rem -1.25rem 0

}



.mmm-lang li {

    margin: 0 1.25rem 1.25rem 0

}



.mmm-lang li a {

    color: var(--text-primary);

    text-decoration: none

}



.mmm-lang li.active a {

    color: var(--accent-color)

}



.mmm-content {

    background-color: var(--background-secondary-color)

}



.mmm-list {

    list-style: none;

    margin: 0;

    padding: 0;

    font-size: var(--font-size)

}



.mmm-list > li {

    position: relative;

    border-bottom: 1px solid var(--background-color)

}



.mmm-list > li > a {

    display: block;

    color: var(--text-primary);

    text-decoration: none;

    width: 100%;

    padding: 0 3.75rem 0 1.25rem;

    height: 3.125rem;

    line-height: 3.125rem;

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden

}



.mmm-list > li.active > a, .mmm-list > li.open > a, .mmm-list > li.current-lang > a {

    background-color: var(--accent-color);

    color: var(--background-color)

}



.mmm-list > li.active .mmm-btn, .mmm-list > li.open .mmm-btn, .mmm-list > li.current-lang .mmm-btn {

    color: var(--background-color)

}



.mmm-list > li.open .mmm-btn {

    transform: rotateX(180deg)

}



.mmm-list > li .mmm-btn {

    position: absolute;

    right: 0;

    top: 0;

    width: 3.125rem;

    height: 3.125rem;

    border-left: 1px solid var(--background-color);

    display: flex;

    align-items: center;

    justify-content: center;

    transition: all 0.2s;

    cursor: pointer

}



.mmsm {

    display: none;

    background-color: var(--background-color);

    font-size: 1rem;

    list-style: none;

    margin: 0;

    padding: 0

}



.mmsm li {

    border-bottom: 1px solid var(--border-color)

}



.mmsm li:first-child {

    border-top: 1px solid var(--border-color)

}



.mmsm li a {

    display: block;

    padding: .625rem 1.25rem .625rem 2rem;

    text-decoration: none;

    color: var(--text-primary)

}



.mmsm li.menu-item-has-children > a {

    font-weight: 700

}



.mmsm > li > ul > li:last-child {

    border: none

}



.mmsm > li > ul > li > a {

    padding-left: 2.75rem

}



.mmsm-item {

    margin-bottom: 1.25rem

}



.mmsm-item:first-child .mmsm-item-heading {

    padding-top: 1.25rem

}



.mmsm-item:last-child {

    margin-bottom: 0

}



.mmsm-item:last-child ul li:last-child {

    border-bottom: none

}



.mmsm-item-heading {

    font-size: .8125rem;

    font-weight: 700;

    margin-bottom: 1rem;

    padding: 0 1.25rem;

    text-transform: uppercase

}



.header-main-nav {

    padding-top: .25rem;

    padding-bottom: .5rem

}



.header-main-nav .form-field {

    margin-bottom: 0

}



.main-mnu-btn {

    position: relative;

    display: block;

    width: 24px;

    height: 18px;

    overflow: hidden

}



.main-mnu-btn .bar {

    position: absolute;

    display: block;

    width: 100%;

    height: 2px;

    background-color: var(--text-primary);

    transition: all 0.4s ease-in-out

}



.main-mnu-btn .bar-1 {

    top: 0

}



.main-mnu-btn .bar-2, .main-mnu-btn .bar-3 {

    top: 8px

}



.main-mnu-btn .bar-3 {

    right: 0

}



.main-mnu-btn .bar-4 {

    bottom: 0

}



.main-mnu-btn.active .bar-1 {

    transform: translateX(40px);

    background-color: transparent

}



.main-mnu-btn.active .bar-2 {

    transform: rotate(45deg)

}



.main-mnu-btn.active .bar-3 {

    transform: rotate(-45deg)

}



.main-mnu-btn.active .bar-4 {

    transform: translateX(-40px);

    background-color: transparent

}



.header-search.open .header-search-ico-close {

    transform: scale(1);

    opacity: 1;

    visibility: visible

}



.header-search.open .header-search-ico-search {

    visibility: hidden;

    opacity: 0;

    transform: scale(.3)

}



.header-search.open .header-search-form {

    visibility: visible;

    opacity: 1

}



.header-search-ico {

    cursor: pointer;

    position: relative;

    z-index: 3;

    transition: all 0.2s

}



.header-search-ico:hover {

    color: var(--accent-color)

}



.header-search-ico-search, .header-search-ico-close {

    position: absolute;

    left: .0625rem;

    top: .0625rem;

    transition: all 0.2s

}



.header-search-ico-close {

    visibility: hidden;

    opacity: 0;

    transform: scale(.3)

}



.header-search-ico-search {

    visibility: visible;

    opacity: 1;

    transform: scale(1)

}



.header-search-form {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background-color: var(--background-color);

    display: flex;

    align-items: center;

    opacity: 0;

    visibility: hidden;

    z-index: 2

}



.header-search-form .container {

    padding: 0 15px

}



.header-search-form .form-field {

    margin: 0

}



.header-search-form .form-field .form-field-input {

    padding-right: 2.5rem

}



.header-search-form input {

    margin: 0

}



.header-search-form .header-search-btn, .header-search-form .search-btn {

    position: absolute;

    right: .625rem;

    top: 50%;

    transform: translateY(-50%);

    padding: 0;

    margin: 0;

    color: var(--text-primary);

    border: none;

    background: none;

    cursor: pointer;

    display: flex;

    align-items: center;

    transition: all 0.2s

}



.header-search-form .header-search-btn:hover, .header-search-form .search-btn:hover {

    color: var(--accent-color)

}



.header-search-form .header-search-btn:focus, .header-search-form .search-btn:focus {

    outline: none

}



.header-search-form .header-search-btn:active i, .header-search-form .search-btn:active i {

    transform: scale(.8)

}



.header-search-form .header-search-btn i, .header-search-form .search-btn i {

    transition: all 0.2s

}



.header-lang {

    position: relative

}



.header-lang.open .header-lang-list {

    opacity: 1;

    visibility: visible;

    transform: none

}



.header-lang.open .header-lang-current {

    color: var(--accent-color)

}



.header-lang-current {

    display: flex;

    cursor: pointer;

    width: 1.5rem;

    height: 1.5rem;

    color: var(--text-primary);

    transition: all 0.2s

}



.header-lang-current:hover {

    color: var(--accent-color)

}



.header-lang-current .material-icons {

    margin: auto

}



.header-lang-list {

    position: absolute;

    right: 0;

    top: 100%;

    z-index: 10;

    background-color: var(--background-color);

    box-shadow: var(--el-box-shadow);

    padding: .75rem 0;

    margin-top: 1rem;

    border-radius: calc(var(--el-border-radius) * 0.6);

    transition: all 0.2s;

    transform: translateY(1rem);

    opacity: 0;

    visibility: hidden

}



.header-lang-list li {

    padding: .4rem 1.5625rem

}



.header-lang-list li a span {

    padding: .125rem 0

}



.header-lang-list li a::after {

    padding: .125rem 0

}



.header-lang-list li.active a {

    pointer-events: none;

    color: var(--accent-color)

}



.header-navbar {

    position: relative;

    z-index: 3

}



.header-navbar.open .header-navbar-content {

    opacity: 1;

    visibility: visible;

    transform: none

}



.header-navbar .widget-socials li a {

    opacity: 1

}



.header-navbar-btn {

    position: relative;

    display: flex;

    align-items: center;

    cursor: pointer;

    transition: all 0.2s

}



.header-navbar-btn:hover {

    color: var(--accent-color)

}



.header-navbar-btn:active {

    transform: scale(.8)

}



.header-navbar-content {

    position: absolute;

    top: 100%;

    right: 0;

    padding: 1.5rem;

    background-color: var(--background-color);

    font-size: 1rem;

    transition: all 0.4s;

    opacity: 0;

    visibility: hidden;

    transform: translateX(30px);

    white-space: nowrap;

    margin-top: .625rem;

    z-index: 15;

    box-shadow: var(--el-box-shadow);

    border-radius: calc(var(--el-border-radius) * 0.6)

}



.header-navbar-content .header-actions {

    padding: 0

}



.header-navbar-content > li {

    display: flex;

    align-items: center;

    margin-bottom: 1rem

}



.header-navbar-content > li:last-child {

    margin-bottom: 0

}



.header-navbar-content i {

    color: var(--text-primary);

    margin-right: .625rem

}



.header-navbar-content b {

    margin-right: .3125rem

}



.header-navbar-content a {

    color: var(--text-primary);

    text-decoration: none;

    display: flex;

    align-items: center

}



.header-navbar-content a:hover {

    color: var(--text-primary)

}



.header-navbar-content .header-button span {

    border-bottom: 1px dashed var(--text-primary);

    transition: all 0.2s;

    line-height: 1.3

}



.header-navbar-content .header-button:hover span {

    border-bottom-style: solid

}



.header-navbar-content .widget-socials {

    margin-top: .3125rem

}



.header-navbar-content .widget-socials li a {

    fill: var(--text-primary)

}



.header-actions {

    display: flex;

    align-items: center;

    margin-left: -1.25rem;

    padding: 1rem 0

}



.header-actions.header-actions-width-btn {

    padding: .25rem 0

}



.header-actions > li {

    margin-left: 1.25rem

}



.header-actions .btn {

    display: flex;

    align-items: center;

    padding-left: 1.25rem;

    padding-right: 1.25rem

}



.header-actions .btn i {

    display: none

}



.header-action-icon {

    cursor: pointer;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--text-primary);

    width: 1.5rem;

    height: 1.5rem;

    transition: all 0.2s

}



.header-action-icon:hover {

    color: var(--accent-color)

}



.side {

    position: fixed;

    top: 0;

    width: 20rem;

    height: 100%;

    background: var(--background-color);

    z-index: 1111;

    transition: all 0.4s

}



.side.side-right {

    right: 0;

    transform: translateX(20rem)

}



.side.open {

    transform: none

}



.side-scroll {

    padding: 1rem 1.5rem 1.25rem;

    width: 100%;

    height: 100%;

    overflow: hidden;

    overflow-y: auto

}



.side-close {

    position: absolute;

    right: 1rem;

    top: 1.25rem;

    width: 1.5rem;

    height: 1.5rem;

    cursor: pointer;

    transition: all 0.2s;

    z-index: 2

}



.side-close:hover {

    transform: rotate(90deg);

    color: var(--accent-color)

}



.side-login {

    margin-top: 2rem;

    margin-bottom: 1.25rem

}



.side-form-title {

    text-align: center;

    margin-bottom: 1.5rem

}



.side-form-nav {

    margin-top: 1.25rem;

    text-align: center

}



.sfn-row {

    margin-bottom: 1rem

}



.sfn-row:last-child {

    margin-bottom: 0

}



@media only screen and (max-height: 750px) {

    .side-form .input-states-labelled {

        display: none

    }

}



.sidebar-item-style, .sibebar-item-bg-style {

    position: relative;

    padding: 1.5rem 1rem;

    border-radius: var(--el-border-radius)

}



.sidebar-item-style {

    border: 1px solid var(--border-color)

}



.sibebar-item-bg-style {

    background-color: var(--background-secondary-color)

}



.sidebar-item-row {

    margin-bottom: 1.5rem

}



.sidebar-item-row:last-child {

    margin-bottom: 0

}



.sidebar-item-heading {

    line-height: 1.2;

    font-family: var(--heading-font-family);

    margin-bottom: 1.25rem

}



.sidebar-item-desc {

    font-size: 1rem;

    margin-bottom: 1.25rem;

    color: var(--text-secondary)

}



.sidebar-tags {

    display: flex;

    flex-wrap: wrap;

    margin-bottom: -.625rem;

    margin-left: -1rem;

    font-size: 1rem

}



.sidebar-tags li {

    margin-bottom: .625rem;

    margin-left: 1rem

}



.sidebar-tags li a {

    text-decoration: none

}



.sidebar-tags li a:hover {

    text-decoration: underline

}



.sidebar-filter-list > li {

    margin-bottom: .5rem;

    line-height: 1.25rem

}



.sidebar-filter-list > li:last-child {

    margin-bottom: 0

}



.sidebar-filter-list > li:hover::before {

    border-color: var(--accent-color)

}



.sidebar-filter-list > li.active::before, .sidebar-filter-list > li.is-checked::before {

    border-color: var(--accent-color)

}



.sidebar-filter-list > li.active::after, .sidebar-filter-list > li.is-checked::after {

    opacity: 1

}



.sidebar-posts li {

    margin-bottom: 1.25rem

}



.sidebar-posts li:last-child {

    margin-bottom: 0

}



.sidebar-post {

    display: flex;

    align-items: center;

    text-decoration: none;

    font-size: 1rem;

    color: var(--text-primary);

    font-weight: 700

}



.sidebar-post:hover {

    color: var(--accent-color)

}



.sidebar-post-img {

    height: 4.6875rem;

    min-width: 5.3125rem;

    width: 5.3125rem

}



.sidebar-post-img img {

    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover

}



.sidebar-post-title {

    text-decoration: none;

    padding-left: .625rem;

    line-height: var(--line-height)

}



.sidebar-cat-tree .sidebar-cat-item {

    display: block

}



.sidebar-cat-tree > li.open > a::after {

    color: var(--text-primary)

}



.sidebar-cat-tree > li.open .sidebar-cat-icon {

    transform: translateY(-50%) rotate(90deg)

}



.sidebar-cat-item {

    margin-bottom: .75rem;

    font-size: 1rem;

    display: flex;

    color: var(--text-secondary)

}



.sidebar-cat-item:last-child {

    margin-bottom: 0

}



.sidebar-cat-item a {

    position: relative;

    color: var(--text-secondary);

    display: block;

    width: 100%;

    text-decoration: none

}



.sidebar-cat-item a:hover, .sidebar-cat-item a.active {

    color: var(--accent-color)

}



.sidebar-cat-item ul {

    padding-left: .625rem;

    margin-top: .5rem

}



.sidebar-cat-item ul > li {

    margin-bottom: .5rem

}



.sidebar-cat-item ul > li:last-child {

    margin-bottom: 0

}



.sidebar-cat-item .sidebar-cat-icon {

    position: absolute;

    right: 0;

    top: 50%;

    transform: translateY(-50%);

    color: var(--accent-color);

    transition: all 0.2s

}



.sidebar-cat-count {

    margin-left: .625rem;

    min-width: 1.125rem;

    text-align: right

}



.section {

    position: relative;

    padding: 4.5rem 0;

    background-color: var(--background-color);

    color: var(--text-primary)

}



.section.section-without-padding {

    padding: 0

}



.section.section-without-padding-top {

    padding-top: 0

}



.section.section-without-padding-bottom {

    padding-bottom: 0

}



.section.section-minimal-padding {

    padding: 30px 0

}



.section.section-container-fluid-without-padding .container-fluid {

    padding: 0

}



.section-bg-overlay {

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background: var(--section-bg-overlay)

}



.page-sections {

    padding-top: 3.5rem

}



.page-sections .section {

    padding: 0;

    margin-bottom: 3.5rem

}



.page-sections .section:last-child {

    margin-bottom: 0

}



.section-overflow-hidden {

    overflow: hidden

}



.section-bg, .section-background-image {

    background-position: center;

    background-size: cover;

    background-repeat: no-repeat

}



.section-bg, .section-bgc {

    background-color: var(--background-secondary-color)

}



.section-dark {

    background-color: #000;

    color: #fff;

    background-position: center;

    background-size: cover;

    background-repeat: no-repeat

}



.section-dark a {

    color: #fff

}



.section-header-margin-none .section-heading {

    margin: 0

}



.section-heading {

    margin-bottom: 3.25rem;

    max-width: 850px

}



.section-heading h1, .section-heading h2, .section-heading h3 {

    position: relative;

    font-size: 2.5rem;

    margin: 0

}



.section-heading.shm-none {

    margin-bottom: 0

}



.section-heading .btn-group {

    margin-top: 2rem

}



.heading-center {

    text-align: center;

    margin-left: auto;

    margin-right: auto

}



.heading-center .section-desc {

    margin-left: auto;

    margin-right: auto

}



.heading-right {

    text-align: right;

    margin-left: auto

}



.heading-right .section-desc {

    margin-left: auto

}



.section-subheading {

    margin-bottom: .3125rem;

    text-transform: uppercase;

    color: var(--accent-color)

}



.section-desc {

    margin: 1.25rem 0;

    max-width: 30rem;

    color: var(--text-secondary)

}



.section-footer {

    margin-top: 1rem

}



.section-footer .article {

    margin-bottom: 1.25rem;

    max-width: 30rem

}



.section-footer .article.text-center {

    margin-left: auto;

    margin-right: auto

}



.section-footer .article.text-right {

    margin-left: auto

}



.section-footer.section-footer-mt-1 {

    margin-top: -.75rem

}



.section-nav {

    position: relative;

    margin-bottom: 2rem;

    margin-top: -.3125rem

}



.section-nav-list {

    list-style: none;

    margin: 0;

    padding: .3125rem 0;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    font-size: 1rem;

    text-transform: uppercase;

    margin: -.5rem -1.5rem 0 0;

    overflow-x: auto

}



.section-nav-list li {

    cursor: pointer;

    margin: .5rem 1.5rem 0 0;

    white-space: nowrap;

    transition: all 0.2s

}



.section-nav-list li:last-child {

    margin-right: 0

}



.section-nav-list li:hover, .section-nav-list li.active {

    color: var(--accent-color)

}



.section-row {

    display: flex;

    flex-wrap: wrap;

    justify-content: center

}



.section-path {

    width: 100%;

    padding: 0 var(--bs-gutter-x, 15px)

}



.main-content .container .container {

    padding: 0

}



@media (min-width: 576px) {

    .section-path {

        max-width: 540px

    }

}



@media (min-width: 768px) {

    .section-path {

        max-width: 720px

    }

}



@media (min-width: 992px) {

    .section-row {

        justify-content: flex-start

    }



    .section-item {

        width: 50%;

        max-height: 100%

    }



    .section-path {

        max-width: 480px

    }



    .section-path-left {

        margin-left: auto

    }



    .section-path-right {

        margin-right: auto

    }



    .section-right-picture {

        display: block;

        width: 100%;

        height: 100%;

        padding-left: 2rem

    }



    .section-right-picture img {

        display: block;

        width: 100%;

        height: 100%;

        object-fit: cover;

        border-top-left-radius: var(--el-border-radius);

        border-bottom-left-radius: var(--el-border-radius)

    }

}



@media (min-width: 1200px) {

    .section-path {

        max-width: 570px

    }

}



@media (min-width: 1400px) {

    .section-path {

        max-width: 660px

    }

}



.grid-item p {

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis

}



.p-title {

    font-size: 1.125rem;

    font-weight: 700;

    margin-bottom: .625rem

}



.page-404-title {

    font-size: 5rem

}



.search-page-container {

    max-width: 50rem;

    margin-left: auto;

    margin-right: auto

}



.search-page-list {

    list-style: none;

    margin: 0;

    padding: 0;

    margin-top: 3.5rem;

    counter-reset: item

}



.search-page-list li {

    margin-bottom: 1.5rem;

    display: flex;

    align-items: flex-start

}



.search-page-list li:last-child {

    margin-bottom: 0

}



.search-page-list li a {

    font-weight: var(--heading-font-weight);

    font-family: var(--heading-font-family);

    text-decoration: none

}



.search-page-list li a:hover {

    text-decoration: underline

}



.search-page-list li::before {

    content: counter(item) ".";

    counter-increment: item;

    display: block;

    min-width: 2rem;

    top: 0

}



.search-page-list li p {

    margin-top: .3125rem;

    margin-bottom: 0;

    color: var(--text-secondary);

    font-size: 1rem

}



.search-page-results-text {

    margin-bottom: 0;

    margin-top: 2rem

}



.search-page-results-text b, .search-page-results-text strong {

    font-weight: 600;

    font-family: var(--heading-font-family)

}



.lg-outer .lg-video-cont .lg-object {

    object-fit: cover

}



.footer {

    position: relative;

    background-color: var(--text-primary);

    width: 100%;

    color: var(--background-color);

    font-size: 1rem

}



.footer p, .footer i {

    opacity: .8

}



.footer a {

    opacity: .8;

    color: var(--background-color);

    text-decoration: none

}



.footer a:hover {

    color: var(--background-color);

    opacity: 1

}



.footer a::after {

    color: var(--background-color)

}



.footer form input {

    color: var(--background-color)

}



.footer form .wpcf7-checkbox .wpcf7-list-item-label, .footer form .form-field-label {

    color: var(--background-color);

    opacity: .8

}



.footer form .wpcf7-spinner::before, .footer form .wpcf7-spinner::after {

    background-color: var(--background-color)

}



.footer form *::-webkit-input-placeholder, .footer form *::placeholder {

    color: var(--background-color)

}



.footer .menu > li.active > a {

    opacity: 1

}



.footer .menu > li.active > a span {

    transform: translateY(100%)

}



.footer .menu > li.active > a::after {

    transform: translateY(0)

}



.footer .widget-socials > li > a {

    fill: var(--background-color)

}



.footer .widget-socials.widget-socials-bordered-hover-bg > li > a {

    fill: var(--background-color);

    border-color: var(--background-color)

}



.footer .widget-socials.widget-socials-bordered-hover-bg > li > a:hover {

    background-color: var(--background-color);

    border-color: var(--background-color);

    fill: var(--text-primary)

}



.mobile .footer, .tablet .footer {

    z-index: 1 !important;

    position: relative !important

}



.mobile .main-inner, .tablet .main-inner {

    margin-bottom: 0 !important

}



.footer-minimal .footer-main {

    padding: 2.5rem 0

}



.footer-minimal .footer-company-info .logo {

    margin-bottom: 0

}



.footer-center {

    text-align: center

}



.footer-center .widget-socials {

    justify-content: center

}



.footer-center .widget-brand-info-main {

    max-width: 400px;

    margin-left: auto;

    margin-right: auto;

    display: flex;

    flex-wrap: wrap;

    justify-content: center

}



.footer-main {

    position: relative;

    padding: 4rem 0

}



.footer-main::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 1px;

    background-color: var(--background-color);

    opacity: .1

}



.footer-main > .container > .items {

    margin-bottom: -2.5rem

}



.footer-main .footer-widget {

    margin-bottom: 2.5rem

}



.footer-item {

    margin-bottom: 2rem

}



.footer-item:last-child {

    margin-bottom: 0

}



.footer-mnu li {

    margin-bottom: 1rem

}



.footer-mnu li:last-child {

    margin-bottom: 0

}



.footer-mnu-line {

    display: flex;

    flex-wrap: wrap;

    justify-content: flex-end;

    margin-left: -2rem;

    margin-bottom: -1rem

}



.footer-mnu-line li {

    margin-left: 2rem;

    margin-bottom: 1rem

}



.footer-subscribe {

    display: flex

}



.footer-subscribe .form-field {

    margin-right: 1rem;

    margin-bottom: 0;

    width: 100%

}



.footer-subscribe .form-field input {

    background-color: transparent;

    color: var(--background-color)

}



.footer-subscribe .form-field input::-webkit-input-placeholder, .footer-subscribe .form-field input::placeholder {

    color: var(--background-color);

    opacity: 1

}



.footer-subscribe .form-field .form-field-label {

    color: var(--background-color)

}



.footer-bottom {

    position: relative;

    padding: 1.625rem 0 1.5rem;

    font-size: .875rem

}



.footer-bottom::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 1px;

    background-color: var(--background-color);

    opacity: .1

}



.footer-bottom .copyright {

    opacity: .8

}



.footer-bottom .items {

    margin-bottom: -1.5rem

}



.footer-bottom .item {

    margin-bottom: 1.5rem

}



.footer-links ul {

    display: flex;

    margin-bottom: -1rem;

    margin-left: -1.25rem

}



.footer-links ul li {

    margin-bottom: 1rem;

    margin-left: 1.25rem

}



.footer-links ul li a {

    display: block;

    text-decoration: none;

    border-bottom: 1px dashed var(--background-color)

}



.footer-links ul li a:hover {

    border-bottom-style: solid

}



@media (max-width: 1399.98px) {

    .main-mnu-list > li.mega-menu > ul > li {

        padding: 2rem .5rem

    }

}



@media (max-width: 1199.98px) {

    .mmm {

        display: flex

    }



    .header-fixed .container {

        padding-left: .625rem;

        padding-right: .625rem

    }



    .header-fixed .row {

        margin-left: -.625rem;

        margin-right: -.625rem

    }



    .header-fixed .row .header-fixed-col {

        padding: 0 .625rem

    }



    .item-wide {

        height: 28.125rem

    }

}



@media (max-width: 991.98px) {

    .header-top {

        display: none

    }



    .header-fixed {

        z-index: 101

    }



    .sidebar.section {

        padding: 0

    }



    .section-nav-list li {

        margin-right: 1rem

    }



    .item-wide {

        height: 20.625rem

    }

}



@media only screen and (max-width: 767.98px), only screen and (min-width: 567px) and (max-width: 900px) and (orientation: landscape) {

    .header-fixed {

        padding: .625rem 0 .625rem .25rem

    }



    .logo img {

        max-height: 2.25rem

    }



    .header-center .logo img {

        max-height: 2.25rem

    }



    .header-actions {

        padding: .5rem 0

    }



    .section-heading {

        margin-bottom: 3rem

    }



    .section-heading h1, .section-heading h2, .section-heading h3 {

        font-size: 2rem

    }



    .item-heading-large {

        font-size: 1.25rem

    }



    .section-nav {

        margin-bottom: 1.5rem

    }



    .section-nav-list {

        justify-content: start;

        white-space: nowrap;

        overflow-x: auto;

        flex-wrap: nowrap;

        margin: 0

    }



    .footer-main {

        padding: 3rem 0

    }



    .footer-mnu-line {

        justify-content: center

    }



    .footer-minimal .footer-company-top {

        display: flex;

        justify-content: center

    }



    .footer-minimal .footer-bottom {

        text-align: center

    }



    .footer-minimal .footer-links ul {

        justify-content: center

    }



    .footer-contacts li {

        margin-bottom: 1.25rem

    }



    .item-wide {

        height: 15rem

    }

}



@media (max-width: 575.98px) {

    .popup {

        padding: 2rem 1.5rem

    }



    .item-wide {

        height: 12rem

    }



    .item-heading-middle {

        font-size: 1.125rem

    }

}



@media (max-width: 480px) {

    .social-login {

        flex-wrap: wrap

    }



    .social-login li {

        width: 100%

    }



    .item-wide {

        height: 10rem

    }



    .el.el-16x9::after {

        margin-top: 65%

    }



    .el.el-2x1::after {

        margin-top: 60%

    }



    .header-minimal .btn-link .btn-link-ico {

        display: none

    }

}



@media (max-width: 767.98px) {

    .header-actions .btn {

        padding: .5em

    }



    .header-actions .btn i {

        display: block;

        font-size: 1.125rem;

        height: 1.125rem;

        width: 1.125rem

    }



    .header-actions .btn span {

        display: none

    }

}



@media (min-width: 992px) {

    .header-top {

        position: relative;

        background-color: var(--text-primary);

        color: var(--background-color);

        padding: .625rem 0;

        font-size: .9375rem;

        z-index: 1001

    }



    .header-top i {

        color: var(--background-color)

    }



    .header-top a {

        color: var(--background-color);

        opacity: .8;

        text-decoration: none

    }



    .header-top a:hover {

        color: var(--background-color);

        opacity: 1

    }



    .header-top .widget-socials > li > a {

        fill: var(--background-color)

    }



    .header-top.header-top-border-bottom::after {

        content: "";

        position: absolute;

        left: 0;

        bottom: 0;

        width: 100%;

        height: 1px;

        background-color: var(--background-color);

        opacity: .1

    }



    .header-top-links {

        display: flex;

        align-items: center;

        margin-left: -2rem

    }



    .header-top-links > * {

        margin-left: 2rem

    }



    .header-top-links .header-button {

        display: flex;

        align-items: center;

        color: var(--background-color);

        opacity: .8

    }



    .header-top-links .header-button i {

        margin-right: 5px

    }



    .header-top-links .header-button span {

        border-bottom: 1px dashed var(--background-color);

        transition: all 0.2s;

        line-height: 1.1

    }



    .header-top-links .header-button:hover {

        opacity: 1

    }



    .header-top-links .header-button:hover span {

        border-bottom-style: solid

    }



    .header-top-info {

        display: flex;

        align-items: center;

        margin-left: -1rem

    }



    .header-top-info b, .header-top-info strong {

        font-weight: 600;

        color: var(--background-color)

    }



    .header-top-info li {

        display: flex;

        align-items: center;

        margin-left: 1rem

    }



    .header-top-info li > a {

        opacity: 1;

        display: flex;

        align-items: center

    }



    .header-top-info li > a:hover span {

        opacity: 1

    }



    .header-top-info li b, .header-top-info li strong {

        margin-right: .375rem

    }



    .header-top-info li i {

        margin-right: .625rem

    }



    .header-top-info li span {

        opacity: .8;

        transition: all 0.25s

    }



    .play-video.play-video-lg {

        width: 5rem;

        height: 5rem

    }



    .play-video.play-video-lg .material-icons {

        font-size: 2.75rem;

        width: 2.75rem;

        height: 2.75rem

    }

}



@media (min-width: 1200px) {

    .main-mnu:not(.justify-content-center) {

        padding-left: 1.25rem

    }



    .header-fixed .col-xl {

        flex: 1 0 0%

    }



    .tablet .main-mnu-list > li.menu-item-has-children > a, .mobile .main-mnu-list > li.menu-item-has-children > a {

        pointer-events: none

    }



    .main-mnu {

        display: flex;

        align-items: center;

        justify-content: flex-end;

        width: 100%

    }



    .main-mnu:not(.main-mnu-js-init) {

        overflow-y: auto;

        scrollbar-width: none

    }



    .main-mnu:not(.main-mnu-js-init)::-webkit-scrollbar {

        width: 0;

        height: 0

    }



    .main-mnu-list {

        display: inline-flex;

        margin-left: -1.5rem

    }



    .main-mnu-list.hide {

        display: none

    }



    .main-mnu-list .badge {

        margin-left: .5rem

    }



    .main-mnu-list > li {

        position: relative;

        margin-left: 1.5rem;

        padding: 1rem 0

    }



    .main-mnu-list > li.current-lang > a {

        font-weight: 700

    }



    .main-mnu-list > li:hover > ul, .main-mnu-list > li:hover .main-sub-mnu {

        transform: none;

        opacity: 1;

        visibility: visible;

        z-index: 11

    }



    .main-mnu-list > li:hover > a i {

       transform: rotateX(180deg)

    }



    .main-mnu-list > li.main-mnu-item-mega-mnu {

        position: static

    }



    .main-mnu-list > li > a {

        color: var(--text-primary) !important;

        position: relative;

        display: flex;

        align-items: center;

        text-decoration: none;

        font-size: 1rem;

        transition: color 0.2s;

    }



    .main-mnu-list > li > a:hover {

        color: var(--accent-color) !important;

    }



    .main-mnu-list > li.menu-item-has-children {

        padding-right: 0

    }



    .main-mnu-list > li.menu-item-has-children > a {

        display: flex;

        align-items: center

    }



    .main-mnu-list > li.menu-item-has-children > a i {

        margin-left: .25rem;

        font-size: 1.125rem;

        width: 1.125rem;

        height: 1.125rem;

        color: var(--accent-color);

        transition: all 0.4s

    }



    .main-mnu-list > li.menu-item-has-children > a .badge {

        margin-left: .25rem

    }



    .main-mnu-list > li > ul {

        position: absolute;

        top: 100%;

        background-color: var(--background-color);

        box-shadow: var(--el-box-shadow);

        min-width: 12.5rem;

        z-index: 10;

        transform: translateY(1rem);

        border-radius: calc(var(--el-border-radius) * 0.6);

        font-weight: 400;

        opacity: 0;

        visibility: hidden;

        padding: .75rem 0;

        transition: all 0.2s;

        cursor: default

    }



    .main-mnu-list > li > ul > li {

        position: relative

    }



    .main-mnu-list > li > ul > li > a {

        display: flex;

        align-items: center;

        justify-content: space-between

    }



    .main-mnu-list > li > ul > li > a i {

        margin-left: .25rem;

        font-size: 1.125rem;

        width: 1.125rem;

        height: 1.125rem;

        color: var(--accent-color);

        transition: all 0.4s

    }



    .main-mnu-list > li > ul > li > ul {

        position: absolute;

        left: 100%;

        top: 0;

        min-width: 12.5rem;

        background-color: var(--background-color);

        border-radius: calc(var(--el-border-radius) * 0.6);

        border-top-left-radius: 0;

        padding: .75rem 0;

        opacity: 0;

        box-shadow: var(--el-box-shadow);

        transform: translateY(15px);

        visibility: hidden;

        transition: all 0.2s

    }



    .main-mnu-list > li > ul > li:hover > a {

        color: var(--accent-color)

    }



    .main-mnu-list > li > ul > li:hover > ul {

        opacity: 1;

        visibility: visible;

        transform: translateY(0)

    }



    .main-mnu-list > li > ul li {

        padding: .25rem 0

    }



    .main-mnu-list > li > ul li a {

        padding: .125rem 1rem .125rem 1.5rem;

        transition: all 0.2s 0s;

        overflow: hidden

    }



    .main-mnu-list > li > ul li a::after {

        padding: .25rem 1rem .25rem 1.5rem

    }



    .main-mnu-list > li.mega-menu {

        position: static

    }



    .main-mnu-list > li.mega-menu > ul {

        left: calc(var(--bs-gutter-x) * 0.5);

        width: calc(100% - var(--bs-gutter-x));

        display: flex;

        padding: 0 1.5rem;

        z-index: -1

    }



    .main-mnu-list > li.mega-menu > ul > li {

        width: 100%;

        max-width: 100%;

        flex: 1 0 0%;

        padding: 2.5rem 1rem

    }



    .main-mnu-list > li.mega-menu > ul > li > a {

        font-family: var(--heading-font-family);

        font-weight: var(--heading-font-weight);

        line-height: var(--heading-line-height);

        margin-bottom: 1.25rem

    }



    .main-mnu-list > li.mega-menu > ul > li > a::after {

        content: none

    }



    .main-mnu-list > li.mega-menu > ul > li > a > span {

        display: block;

        transform: translateY(0) !important;

        transition: all 0.4s

    }



    .main-mnu-list > li.mega-menu > ul > li > a i {

        display: none

    }



    .main-mnu-list > li.mega-menu > ul > li > ul {

        position: relative;

        left: inherit;

        top: inherit;

        transform: none;

        opacity: 1;

        visibility: inherit;

        box-shadow: none;

        padding: 0;

        border-radius: 0;

        background-color: transparent

    }



    .main-mnu-list > li.mega-menu > ul > li > ul li {

        padding: 0

    }



    .main-mnu-list > li.mega-menu > ul > li:hover > a {

        color: var(--text-primary)

    }



    .main-mnu-list > li.mega-menu > ul > li:hover > ul {

        transform: none

    }



    .main-mnu-list > li.mega-menu > ul li a {

        display: flex;

        align-items: center;

        padding: .25rem 0

    }



    .main-mnu-list > li.mega-menu > ul li a::after {

        padding: .25rem 0

    }



    .main-mnu-list > li.menu-item-more > div {

        display: block;

        padding: 0;

        width: 1.5rem;

        height: 1.5rem;

        cursor: pointer;

        transition: color 0.2s

    }



    .main-mnu-list > li.menu-item-more > div:hover {

        color: var(--accent-color)

    }



    .main-mnu-list > li.menu-item-more > ul {

        right: 0

    }



    .main-mnu-list li.active > a {

        color: black;

    }



    .main-mnu-list li > a > div {

        display: flex;

        align-items: center

    }



    .mega-mnu-item {

        padding: 2.5rem 1.25rem 2.5rem 3.125rem

    }



    .mega-mnu-item::after {

        content: "";

        position: absolute;

        right: 0;

        top: 0;

        width: 1px;

        height: 100%;

        background-color: var(--border-color);

        opacity: .5

    }



    .mega-mnu-item:last-child::after {

        content: none

    }



    .main-sub-mnu {

        position: absolute;

        left: 1rem;

        top: 100%;

        background-color: var(--background-color);

        box-shadow: var(--el-box-shadow);

        width: 100%;

        width: calc(100% - 2rem);

        z-index: 10;

        transform: translateY(1rem);

        font-weight: 400;

        opacity: 0;

        border-radius: calc(var(--el-border-radius) * 0.6);

        visibility: hidden;

        min-height: 18.75rem;

        transition: all 0.2s 0.1s;

        z-index: -1;

        cursor: default;

        overflow: hidden

    }



    .main-sub-mnu .mega-mnu-heading {

        font-size: 1rem;

        font-weight: 700;

        margin-bottom: 1.5rem

    }



    .main-sub-mnu .container, .main-sub-mnu .row {

        min-height: 18.75rem

    }



    .main-sub-mnu-banner {

        padding: 0

    }



    .main-sub-mnu-list {

        display: flex;

        flex-wrap: wrap;

        margin-bottom: -1.25rem

    }



    .main-sub-mnu-list.main-sub-mnu-listh {

        display: block

    }



    .main-sub-mnu-list.main-sub-mnu-listh > li {

        width: 100%

    }



    .main-sub-mnu-list > li {

        width: 50%;

        position: relative;

        padding-right: 1rem;

        margin-bottom: .5rem

    }



    .main-sub-mnu-list > li:hover > a > span {

        transform: translateY(100%)

    }



    .main-sub-mnu-list > li:hover > a::after {

        transform: translateY(0)

    }



    .main-sub-mnu-list > li > a {

        position: relative;

        display: block;

        overflow: hidden

    }



    .main-sub-mnu-list > li > a::after {

        content: attr(data-title);

        position: absolute;

        left: 0;

        top: 0;

        transform: translateY(-100%);

        transition: all 0.4s;

        color: var(--accent-color);

        width: 100%;

        padding: .125rem 0;

        white-space: nowrap;

        overflow: hidden;

        text-overflow: ellipsis

    }



    .main-sub-mnu-list > li > a > span {

        display: block;

        transform: translateY(0);

        transition: all 0.4s;

        padding: .125rem 0;

        white-space: nowrap;

        overflow: hidden;

        text-overflow: ellipsis

    }



    .main-sub-mnu-banner {

        position: relative;

        background-color: var(--background-secondary-color);

        color: var(--background-color)

    }



    .main-sub-mnu-slider {

        height: 100%

    }



    .main-sub-mnu-slider .owl-stage-outer, .main-sub-mnu-slider .owl-stage, .main-sub-mnu-slider .owl-item {

        height: 100%

    }



    .main-mnu-list > li a.mnu-slider-item {

        color: var(--background-color)

    }



    .mnu-slider-item {

        padding: 2.5rem 3.75rem 2.5rem 1.875rem;

        display: flex;

        flex-wrap: wrap;

        height: 100%;

        width: 100%;

        color: var(--background-color);

        background-repeat: no-repeat;

        background-position: center;

        background-size: cover

    }



    .mnu-slider-item-subtitle {

        font-size: .75rem;

        font-weight: 300;

        text-transform: uppercase;

        margin-bottom: .625rem

    }



    .mnu-slider-item-title {

        margin-bottom: 0;

        font-size: 1.125rem;

        font-weight: 500

    }



    .main-sub-mnu-slider .flickity-prev-next-button {

        position: absolute;

        padding: .3125rem;

        background: transparent;

        width: 1.25rem;

        height: 1.25rem;

        fill: var(--background-color);

        padding: 0;

        border: none;

        line-height: 1

    }



    .main-sub-mnu-slider .flickity-button-icon {

        fill: var(--background-color)

    }



    body:not(.site-default-links) .hover-link {

        position: relative;

        display: inline-block;

        text-decoration: none;

        color: #1c5958;

    }



    body:not(.site-default-links) .hover-link:hover {

        color: #2b2b31;

    }



    body:not(.site-default-links) .hover-link.active {

        font-weight: bold;

    }



    /* Remove all the transition and transform effects */

    body:not(.site-default-links) .hover-link > span {

        display: inline-block;

    }



    body:not(.site-default-links) .hover-link > span::before,

    body:not(.site-default-links) .hover-link::after {

        display: none;

    }



    body:not(.site-default-links) .hover-link:hover > span {

        transform: none;

    }



    /* Remove other hover effects */

    body:not(.site-default-links) .main-mnu-list > li:hover > a > span,

    body:not(.site-default-links) .main-mnu-list > li.active > a > span,

    body:not(.site-default-links) .main-mnu-list > li.current-lang > a > span,

    body:not(.site-default-links) .main-mnu-list > ul li:hover > a > span,

    body:not(.site-default-links) .main-mnu-list > ul li.active > a > span,

    body:not(.site-default-links) .main-mnu-list > ul li.current-lang > a > span {

        transform: none;

    }

}



@media (min-width: 1400px) {

    .main-mnu:not(.justify-content-center) {

        padding-left: 1.5rem

    }

}



@media (min-width: 1600px) {

    .container-fluid {

        padding: 0 2rem

    }

}



@media (min-width: 1800px) {

    .container-fluid {

        padding: 0 3rem

    }

}



@media (min-width: 1700px) {

    .container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {

        max-width: 1410px

    }



    html {

        font-size: calc(var(--font-size) + 1px)

    }

}



@media (min-width: 1921px) {

    .container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {

        max-width: 1500px

    }



    html {

        font-size: calc(var(--font-size) + 2px)

    }

}







/*here*/



:root {

    --glitter: url("https://assets.codepen.io/13471/silver-glitter-background.png");

    --duration: 6.66s;

}



.card-front:before {

    content: "";

    inset: 0;

    position: absolute;

    transform: translate3d(0, 0, 0.01px);

    background-image: var(--glitter), var(--glitter), linear-gradient(120deg, black 25%, white, black 75%);

    background-size: 100% 100%, 80% 80%, 200% 200%;

    background-blend-mode: multiply, multiply, overlay;

    background-position: 50% 50%, 50% 50%, 50% 50%;

    mix-blend-mode: color-dodge;

    filter: brightness(2) contrast(0.8);

    -webkit-animation: bg var(--duration) ease infinite;

    animation: bg var(--duration) ease infinite;

}



.card-front {

    display: grid;

    position: relative;

    transform: translate3d(0, 0, 0.01px);

    width: 70vw;

    max-width: 580px;

    aspect-ratio: 3/2;

    border-radius: 3.5% 3.5% 3.5% 3.5%/5% 5% 5% 5%;

    background-size: cover;

    box-shadow: 0 30px 40px -25px #0f0514, 0 20px 50px -15px #0f0514;

    overflow: hidden;

    -webkit-animation: tilt var(--duration) ease infinite;

    animation: tilt var(--duration) ease infinite;

    image-rendering: optimizequality;

}



.card-front:after {

    content: "";

    background: none, none, linear-gradient(125deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 0.1%, rgba(255, 255, 255, 0) 60%);

    background-size: 200% 200%;

    mix-blend-mode: hard-light;

    -webkit-animation: bg var(--duration) ease infinite;

    animation: bg var(--duration) ease infinite;

}



.card-front * {

    font-family: PT Mono, monospace;

}



.cardLogo,

.expiry,

.name,

.number,

.chip,

.icon {

    color: #ccc;

    position: absolute;

    margin: 0;

    padding: 0;

    letter-spacing: 0.075em;

    text-transform: uppercase;

    font-size: clamp(0.75rem, 2.8vw + 0.2rem, 1.1rem);

    inset: 5%;

    text-shadow: -1px -1px 0px rgba(255, 255, 255, 0.5), 1px -1px 0px rgba(255, 255, 255, 0.5), 1px 1px 0px rgba(0, 0, 0, 0.5), 1px -1px 0px rgba(0, 0, 0, 0.5);

    z-index: 5;

}



.name, .number, .expiry {

    background-image: linear-gradient(to bottom, #ededed 20%, #bababa 70%), none, linear-gradient(120deg, transparent 10%, white 40%, white 60%, transparent 90%);

    background-size: cover, cover, 200%;

    background-position: 50% 50%;

    background-blend-mode: overlay;

    -webkit-text-fill-color: transparent;

    -webkit-background-clip: text;

    -webkit-animation: bg var(--duration) ease infinite;

    animation: bg var(--duration) ease infinite;

}



.number {

    font-family: PT Mono, monospace;

    text-align: center;

    font-size: clamp(1rem, 8vw - 0.5rem, 2.5rem);

    letter-spacing: 0.025em;

    top: 60%;

    bottom: auto;

}



.expiry,

.name {

    top: auto;

}



.name {

    right: auto;

    max-width: 180px;

    line-height: 1.2;

    text-align: left;

}



.expiry {

    left: auto;

}



.cardLogo {

    bottom: auto;

    left: auto;

    width: 15%;

    filter: invert(1) saturate(0) brightness(1) contrast(1.2);

    mix-blend-mode: screen;

}



.chip {

    display: grid;

    place-items: center;

    width: 14%;

    aspect-ratio: 5/4;

    left: 10%;

    top: 30%;

    border-radius: 10% 10% 10% 10%/15% 15% 15% 15%;

    background-image: none, none, linear-gradient(120deg, #777 10%, #ddd 40%, #ddd 60%, #777 90%);

    background-size: 200% 200%;

    background-position: 50% 50%;

    overflow: hidden;

    -webkit-animation: bg var(--duration) ease infinite;

    animation: bg var(--duration) ease infinite;

}



.chip svg {

    display: block;

    width: 90%;

    fill: none;

    stroke: #444;

    stroke-width: 2;

}



.contactless {

    position: absolute;

    left: 23%;

    top: 30%;

    width: 12%;

    rotate: 90deg;

    stroke-width: 1.25;

    stroke: currentColor;

    fill: none;

    stroke-linecap: round;

    stroke-linejoin: round;

    opacity: 0.5;

}



.icon {

    width: 25%;

    bottom: auto;

    right: auto;

    top: 0;

    left: 15px;

    filter: invert(1) hue-rotate(180deg) saturate(5) contrast(2);

}



@-webkit-keyframes tilt {

    0%, 100% {

        transform: translate3d(0, 0, 0.01px) rotateY(-20deg) rotateX(5deg);

    }

    50% {

        transform: translate3d(0, 0, 0.01px) rotateY(20deg) rotateX(5deg);

    }

}



@keyframes tilt {

    0%, 100% {

        transform: translate3d(0, 0, 0.01px) rotateY(-20deg) rotateX(5deg);

    }

    50% {

        transform: translate3d(0, 0, 0.01px) rotateY(20deg) rotateX(5deg);

    }

}

@-webkit-keyframes bg {

    0%, 100% {

        background-position: 50% 50%, calc(50% + 1px) calc(50% + 1px), 0% 50%;

    }

    50% {

        background-position: 50% 50%, calc(50% - 1px) calc(50% - 1px), 100% 50%;

    }

}

@keyframes bg {

    0%, 100% {

        background-position: 50% 50%, calc(50% + 1px) calc(50% + 1px), 0% 50%;

    }

    50% {

        background-position: 50% 50%, calc(50% - 1px) calc(50% - 1px), 100% 50%;

    }

}

#app {

    display: grid;

    place-items: center;

    min-height: 100%;

    perspective: 1000px;

}









#chip,

#contactless {

    display: none;

}







#cardd{

    padding: 100px;

}



@media screen and (max-width: 414px){

    #cardd{

        padding: 10px;

    }

    #app{

        margin-top: 20px;

        padding-bottom: 70px;

    }

   .number{

       font-size: 15px;

   }

}





@media screen and (max-width: 1100px){

    .card-front{

        width: 50vw;

    }

   /* .number{

        font-size: 25px;

    }*/



}







/*our services intro*/



@media (min-width: 375px){

    .intro-item-1214111[data-loaded="true"] {

        background-image: url("/images/services-banner.jpg") !important;



    }}



/*our services end*/

@media (min-width: 375px){

    .intro-item-1214112[data-loaded="true"] {

        background-image: url("/images/services-banner.jpg") !important;



    }}



/*Role of supervision*/

@media (min-width: 375px){

    .intro-item-1214113[data-loaded="true"] {

        background-image: url("/images/supervision-banner.jpg") !important;



    }}

/*Role of supervision end */







/*compensation and asset protection*/

@media (min-width: 375px){

    .intro-item-1214114[data-loaded="true"] {

        background-image: url("/images/compensation-banner.jpg") !important;



    }}

/*compensation and asset protection end*/









/*petitions*/

@media (min-width: 375px){

    .intro-item-1214115[data-loaded="true"] {

        background-image: url("/images/petitions-banner.jpg") !important;



    }}

/*petitions end*/





@media (max-width: 414px){

#fixch{

    margin-left:55px;

}

#fixtxt{

    text-align:center;

}

    

}









.intro-item-img-right-121411[data-loaded="true"] {
    background-image: url("/images/services-banner.jpg") !important;
}

.intro-item-img-right-121411[data-loaded="true"] {
    background-image: url("/images/services-banner.jpg") !important;
}

.intro-item-img-right-121411[data-loaded="true"] {
    background-image: url("/images/supervision-banner.jpg") !important;
}

.intro-item-img-right-121411[data-loaded="true"] {
    background-image: url("/images/compensation-banner.jpg") !important;
}

.intro-item-img-right-121411[data-loaded="true"] {
    background-image: url("/images/petitions-banner.jpg") !important;
}