/*
#D70321 - red
#EAEDF0 - light grey
#485272 - dark grey

 */
body {
    font-family: din-2014, serif;
}

.row {
    row-gap: 24px;
}

.language li.active a.link {
    pointer-events: none;
}

header {
    border-bottom: 1px solid #48527252;
}
header .desktop img {
    height: 54px;
}
header .desktop ul.menu {
    line-height: 54px;
}
header .desktop ul.menu a {
    cursor: pointer;
    padding: 30px 32px;
    color: #485272;
    text-decoration: none;
    font: normal normal 700 16px/28px din-2014;
}
header .desktop ul.menu a:hover, header .desktop ul.menu a.active {
    color: #D70321;
}
header .desktop ul.language {
    line-height: 54px;
    margin-left: 38px;
    gap: 12px;
}
header .desktop ul.language li {
    width: 48px;
    height: 48px;
    background-color: #EAEDF0;
    border-radius: 48px;
    text-align: center;
    line-height: 45px;
    color: #485272;
}
header .desktop ul.language li.active {
    background-color: #D70321;
    color: #FFFFFF;
}
header .desktop ul.language li.active a {
    color: #FFFFFF;
}
header .desktop ul.language a {
    padding:0;
    color: #485272;
    text-decoration: none;
    font: normal normal 700 16px/28px din-2014;
}

header .tablet img {
    height: 54px;
}
header .tablet ul.menu {
    line-height: 16px;
}
header .tablet ul.menu a {
    cursor: pointer;
    padding: 30px 32px;
    color: #485272;
    text-decoration: none;
    font: normal normal 700 16px/28px din-2014;
}
header .tablet ul.menu a:hover, header .tablet ul.menu a.active {
    color: #D70321;
}
header .tablet ul.language {
    line-height: 54px;
    margin-left: 38px;
    gap: 12px;

}
header .tablet ul.language li {
    width: 48px;
    height: 48px;
    background-color: #EAEDF0;
    border-radius: 48px;
    text-align: center;
    line-height: 48px;
    color: #485272;
}
header .tablet ul.language li.active {
    background-color: #D70321;
    color: #FFFFFF;
}
header .tablet ul.language li.active a {
    color: #FFFFFF;
}
header .tablet ul.language a {
    padding:0;
    color: #485272;
    text-decoration: none;
    font: normal normal 700 16px/28px din-2014;
}


/* 5 Columns */

.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

@media (min-width: 992px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

a.button {
    display: flex;
    text-decoration: none;
}

.hero { background-color: #EAEDF0; padding: 65px 0; }
.hero .hero-wrapper { padding-right: 50px; }
.hero .hero-card {
    background-color: #FFFFFF;
    /*width: 390px;*/
    padding: 48px;
    border-top-left-radius: 48px;
    border-bottom-right-radius: 48px;
    border-bottom-left-radius: 48px;
    max-width: 100%;
}
.hero .image {
    overflow: hidden;
    border-top-right-radius: 48px;
    border-bottom-right-radius: 48px;
    border-bottom-left-radius: 48px;
}
.hero .image img { max-width: 100%; }

.hero h1 {
    color: #485272;
    margin-bottom: 45px;
}
.info-sbs {
    display: flex;
    font: normal normal 300 20px/28px din-2014;
    letter-spacing: 1px;
    margin-bottom: 60px;
    gap: 24px;
}
.info-sbs img {
    width: 56px;
    height: 56px;
}
.for-you img {
    width: 40px;
    height: 40px;
}

.for-you {
    padding-top: 56px;
}
.for-you h2 {
    margin-bottom: 10px;
}
.info-under .image {
    margin-bottom: 25px;
}
.info-under .text {
    font: normal normal 300 20px/28px din-2014;
}

.sal-card {
    background-color: #EAEDF0;
    border-radius: 0 24px 24px 24px;
    padding: 32px 24px;
    height: 100%;
}

.orders .wrapper {
    background-color: #EAEDF0;
    border-radius: 24px;
    margin-top: 26px;
    margin-bottom: 60px;
    padding: 24px;
    display: flex;
    justify-content: space-between;
}
.orders .text { max-width: 50%; }
.orders .action {
    display: flex;
    align-items: center;
}
.orders h3 {
    font: normal normal 700 24px/32px din-2014;
}
.orders .text {
    font: normal normal 300 16px/20px din-2014;
}

.imgtxt, .txtimg {
    margin-bottom: 20px;
}
.imgtxt .image {
    border-top-left-radius: 56px;
    border-top-right-radius: 56px;
    border-bottom-left-radius: 56px;
    overflow: hidden;
    aspect-ratio: 16/11;
}
.imgtxt .text-col {
    display: flex;
    padding-left: 100px;
    align-items: center;
}
.txtimg .image {
    border-top-right-radius: 56px;
    border-bottom-right-radius: 56px;
    border-bottom-left-radius: 56px;
    overflow: hidden;
    aspect-ratio: 16/11;
}
.txtimg .text-col {
    display: flex;
    padding-right: 100px;
    align-items: center;
}
.imgtxt h3, .txtimg h3 {
    font: normal normal 700 32px/36px din-2014;
    margin-bottom: 25px;
}
.imgtxt .text, .txtimg .text {
    font: normal normal 300 16px/24px din-2014;
}

.imgtxt .image img, .txtimg .image img {
    width: 100%;
}

/*header.mobile { display: none; }*/
/*header.desktop {*/
/*    display: block;*/
/*    position: fixed;*/
/*    top: 0;*/
/*    width: 100%;*/
/*    z-index: 99991;*/
/*    background-color: white;*/
/*}*/
/*!*navbar.desktop { display: block; }*!*/

/*footer.mobile { display: none; }*/
/*!*footer .tablet { display: none; }*!*/

/*!*@media (max-width:992px) {*!*/
/*!*    footer .tablet {*!*/
/*!*        display: block;*!*/
/*!*    }*!*/
/*!*}*!*/



.button-red {
    cursor: pointer;
    padding: 14px 48px;
    gap: 8px;
    border: 0;
    border-radius: 56px;
    background-color: #d70321;
    color: #fff;
    font: normal normal 700 20px/28px din-2014;
    box-shadow:
        0 2px 5px 0 #C52A2C40,
        0 9px 9px 0 #C52A2C36,
        0 20px 12px 0 #C52A2C21,
        0 36px 14px 0 #C52A2C0A,
        0 56px 16px 0 #C52A2C00;
}
.button-red:hover {
    box-shadow: none;
}

h1 {
    font: normal normal 700 32px/40px din-2014;
    color: #485272;
}
h2, .order h1, .contacts h1 {
    font: normal normal 700 42px/48px din-2014;
    color: #485272;
}
h3 {
    font: normal normal 700 32px/36px din-2014;
    color: #485272;
}
text {
    font: normal normal 300 16px/24px din-2014;
}

.team {
    margin-top: 30px;
    margin-bottom: 60px;
}
.team h2 {
    margin-bottom: 35px;
}
.team .desc { margin-bottom: 50px; }
.team .image {
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid #4852721F;
    margin-bottom: 15px;
}
.team .image img { max-width: 100%; }
.team .title {
    font: normal normal 300 14px/16px din-2014;
    margin-bottom: 2px;
}
.team .name {
    font: normal normal 700 16px/20px din-2014;
    color: #485272;
}
.team .job-title {
    margin-top: 8px;
    font: normal normal 300 14px/16px din-2014;
}
.staff-wrapper {
    margin-bottom: 10px;
}

.contact {
    background-color: #EAEDF0;
    padding-top: 55px;
    text-align: center;
}
.contact h2 {
    text-align: center;
    margin-bottom: 20px;
}
.contacts {
    background-color: #EAEDF0;
    padding-top: 55px;
    text-align: left;
}
.contacts h1 {
    text-align: left;
    margin-bottom: 50px;
}
.contact a.contact-wrapper, .contacts a.contact-wrapper {
    text-decoration: none;
    background-color: #FFFFFF;
    border-radius: 16px;
    gap: 20px;
    padding: 32px 24px 32px 0;
    display: flex;
    justify-content: center;
    font: normal normal 700 24px/35px din-2014;
    letter-spacing: -0.4px;
    text-align: left;
    color: #000000;
}
.contact .text, .contacts .text {
    font: normal normal 300 16px/24px din-2014;
    color: #000000;
    margin-bottom: 20px;
    margin-top: 30px;
}
.contact .button, .contacts .button {
    justify-content: center;
    margin-bottom: 65px;
}
.contact a.contact-wrapper .contact-text {
    padding-right: 15px;
}
.contact a.contact-wrapper .phone .contact-text {
    padding-right: 5px;
}
.contacts .map-wrapper iframe {
    width: 100%;
}



.footer {
    background-color: #272C39;
    color: #fff;
    font: normal normal 400 16px/24px din-2014;
    padding-top: 30px;
}
.footer a {
    color: #ffffff;
    text-decoration: none;
}

.footer .menu{
    font: normal normal 700 16px/24px din-2014;
}
.footer .desktop ul.menu a {
    cursor: pointer;
    padding: 30px 32px;
    line-height: 80px;

    /*color: #485272;*/
    /*text-decoration: none;*/
    /*font: normal normal 700 16px/28px din-2014;*/
}
.footer .desktop ul.menu a:hover,
.footer .desktop ul.menu a.active {
    color: #485272;
}
.footer .desktop ul.social {
    line-height: 80px;
    /*margin-left: 24px;*/
}
.footer .desktop ul.social li {
    width: 24px;
    height: 24px;
/*    background-color: #EAEDF0;*/
/*    border-radius: 48px;*/
/*    text-align: center;*/
/*    line-height: 45px;*/
/*    color: #485272;*/
    margin-left: 24px;
}
.footer .desktop.footer-top {
    border-bottom: 2px solid gray;
    padding: 10px 0 45px;
}
.footer .desktop.footer-bottom {
    padding: 10px 0;
}
.footer .desktop.footer-bottom ul.menu-extra a {
    line-height: 24px;
    margin-left: 20px;
    text-decoration: underline;
}
.footer .desktop.footer-bottom ul.menu-extra a:hover {
    color: #485272;
}

.footer .tablet .footer-top {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: flex-start;
}
.footer .tablet .footer-top .menu, .footer .tablet .footer-top .social, .footer .tablet .footer-top .menu-extra {
    display: flex;
    justify-content: end;
    margin-bottom: 10px;
}
.footer .tablet .footer-top .menu-extra {
    text-align: right;
    flex-flow: column;
}
.footer .tablet .footer-top .menu .nav-item, .footer .tablet .footer-top .social .nav-item {
    margin-left: 20px;
}
.footer .mobile {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}
.footer .mobile .menu, .footer .mobile .menu-extra {
    flex-direction: column;
    text-align: center;
}
.footer .mobile .menu li.nav-item {
    margin-bottom: 15px;
}
.footer .mobile .social {
    gap: 20px;
    margin-bottom: 15px;
}
/*.footer .desktop ul.language li.active {*/
/*    background-color: #D70321;*/
/*    color: #FFFFFF;*/
/*}*/
/*.footer .desktop ul.language li.active a {*/
/*    color: #FFFFFF;*/
/*}*/
/*.footer .desktop ul.language a {*/
/*    padding:0;*/
/*    color: #485272;*/
/*    text-decoration: none;*/
/*    font: normal normal 700 16px/28px din-2014;*/
/*}*/

.order {
    padding-top: 55px;
    padding-bottom: 55px;
}
.order .description {
    margin-top: 30px;
    margin-bottom: 40px;
}
.form-block {
    background-color: #EAEDF0;
    border-radius: 24px;
    padding: 12px 32px 32px;
    gap: 16px;
    display: flex;
    overflow: visible;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.form-block .block-title {
    font: normal normal 700 24px/32px din-2014;
    color: #485272;
    margin-top: 20px;
}
.form-block label {
    font: normal normal 700 15px/24px din-2014;
    color: #000000;
}
.form-block input[type='text'], .form-block input[type='email'], .form-block textarea {
    height: 48px;
    border-radius: 8px;
    background-color: #ffffff;
    color: #000000;
    margin-top: 2px;
}
.form-block label.w100 {
    width: 100%;
}
.form-block label.w30 {
    width: calc(30% - 8px);
}
.form-block label.w70 {
    width: calc(70% - 8px);
}

:nth-last-child(1 of .block-item) {
    padding-bottom: 110px;
}

#snippet--formItem { position: relative; }
#frm-orderForm-more, #frm-contactForm-message { height: 150px; }

.next-item {
    position: absolute;
    bottom: 32px;
    left: 32px;
    height: 48px;
    border-radius: 24px;
    line-height: 24px;
    border: 1px solid #485272;
    padding: 10px 20px 10px 16px;
    color: #485272;
    font: normal normal 700 15px/28px din-2014;
    cursor: pointer;
}
.next-item-btn {
    display: none;
}
.image-dropzone {
    border-radius: 8px;
    /*background-color: #ffffff;*/
    color: #000000;
    margin-top: 2px;
    height: 170px;
    border: 1px dashed #485272
}
.agree-wrapper {
    margin-top: 25px;
    font: normal normal 400 14px/24px din-2014;
    display: flex;
    color: #485272;
}
.agree-wrapper a {
    color: #485272;
}
.agree-wrapper label {
    display: flex;
}
.agree {
    width: 16px;
    height: 16px;
    margin-top: 5px;
    margin-right: 8px;
    color: #485272;
}
.button-wrapper {
    margin-top: 25px;
    margin-bottom: 50px;
}
.contact-form {
    /*margin-top: 24px;*/
}
.contact-form .form-block {
    background-color: #fff;
}
.contact-form .form-block input[type='text'], .contact-form .form-block input[type='email'], .contact-form .form-block textarea {
    background-color: #EAEDF0;
}
.contact-form .form-block .agree-wrapper {
    width: 100%;
    margin-top: 5px;
}
.contact-form .form-block .button-wrapper {
    margin-top: 15px;
    margin-bottom: 10px;
}
.map-wrapper {
    /*margin-top: 24px;*/
    border-radius: 24px;
    overflow: hidden;
    height: 610px;
}
.contacts .text-wrapper {
    display: flex;
    margin-bottom: 64px;
}
.qr-wrapper {
    background-color: #fff;
    border-radius: 16px;
    padding: 17px;
    margin-right: 16px;
}
.address-wrapper {
    width: 100%;
}
.address-wrapper .company {
    font: normal normal 700 24px/24px din-2014;
    color: #485272;
    margin-top: 16px;
    margin-bottom: 16px;
}
.address-wrapper .address {
    font: normal normal 300 20px/28px din-2014;
}
.address-wrapper .address a {
    color: #000000;
}
.address-wrapper .hours-title {
    font: normal normal 700 24px/24px din-2014;
    color: #485272;
    margin-top: 16px;
    margin-bottom: 16px;
}
.address-wrapper .hours {
    font: normal normal 300 20px/28px din-2014;
}
.hours-wrapper {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.document {
    padding-top: 55px;
    padding-bottom: 55px;
}
.document h1 { font-size: 38px; margin-bottom: 15px;}
.document h2 { font-size: 32px; }
.document h3 { font-size: 20px; }

.flash-wrapper { margin-bottom: 0; padding: 0 12px;}
.flash-wrapper .flash { padding: 12px 16px; border-radius: 16px; }
.flash-wrapper.danger .flash { background-color: #ff6767; }
.flash-wrapper.info .flash {background-color: rgba(69, 255, 136, 0.52); }

.order .flash-wrapper { margin-bottom: 24px; padding: 0;}


.mobile-menu-wrapper {
    display: none;
}

.dropzone .dz-preview { margin: 0; }
.dropzone .dz-preview .dz-image { width: 100px; height: 100px; }
.dropzone.dz-clickable { overflow: scroll; background-color: #EAEDF0; }
.dropzone.dz-clickable .dz-message {
    height: 100%;
    margin: 0;
}
.dropzone .dz-message .dz-button {
    width: 100%;
    gap: 7px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.dropzone .dz-txt {
    font: normal normal 400 14px/24px din-2014;
}
.dropzone .dz-link {
    font: normal normal 700 16px/24px din-2014;
    color: #485272;
}

@media screen and (max-width: 1399px) {
    .contact a.contact-wrapper .contact-text, .contacts a.contact-wrapper .contact-text {
        font-size: 21px;
    }
}
@media screen and (max-width: 1399px) {
    .contact a.contact-wrapper, .contacts a.contact-wrapper {
        padding: 32px 8px;
        gap: 15px;
    }
    .contact a.contact-wrapper .contact-text, .contacts a.contact-wrapper .contact-text {
        font-size: 19px;
    }
}
@media screen and (max-width: 1199px) {
    .hero .hero-wrapper { padding: 0; }
}
@media screen and (max-width: 992px) {
    .contact a.contact-wrapper .contact-text, .contacts a.contact-wrapper .contact-text {
        font-size: 24px;
        padding-right: 0;
    }
    .hours-wrapper {
        flex-flow: column;
        gap: 10px;
    }

}

@media (max-width:768px) {
    header .tablet ul.menu {
        flex-direction: column;
        align-items: center;
    }
    header .tablet ul.language {
        margin-left: 0;
    }
    .hero .hero-card {
        width: auto;
    }
    .contacts .text-wrapper {
        margin-bottom: 20px;
    }
    .contacts .hours-wrapper {
        margin-bottom: 64px;
    }

}




@media screen and (max-width: 992px) and (min-width: 577px) {
    .contact a.contact-wrapper {
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
    }
    .imgtxt .text-col {
        padding-left: 30px;
    }
    .txtimg .text-col {
        padding-right: 30px;
    }
}
@media screen and (max-width: 576px) {
    .hero {
        padding-top: 12px;
        padding-bottom: 24px;
    }
    .hero h1 {
        margin-bottom: 30px;
    }
    .hero .hero-card {
        width: auto;
        text-align: center;
    }
    .info-sbs {
        margin-bottom: 35px;
        flex-flow: column;
    }
    .hero .row { gap: 12px;}
    a.button {
        justify-content: center;
    }
    .sal-card {
        max-width: 300px;
        margin: 0 auto;
    }
    .for-you {
        padding-top: 32px;
    }
    .for-you h2 { text-align: center; }
    .for-you .row { gap: 12px;}
    .info-under { display: flex; }
    .info-under .image {
        margin-right: 25px;
    }
    .orders .wrapper {
        flex-direction: column;
        text-align: center;
    }
    .orders .wrapper .text {
        width: 100%;
        max-width: 100%;
    }
    .orders .wrapper a.button {
        width: 100%;
        margin-top: 16px;
    }
    .imgtxt .text-col, .txtimg .text-col {
        padding-left: 12px;
        padding-right: 12px;
        padding-top: 24px;
        text-align: center;
    }
    .team {
        margin-top: 64px;
    }
    .team .desc {
        margin-bottom: 32px;
    }
    .team h2 {
        text-align: center;
        margin-bottom: 15px
    }
    .team .desc .text {
        text-align: center;
    }
    .contact .row { gap: 12px;}
    .contact a.contact-wrapper {
        margin: 0 auto;
        max-width: 280px;
    }
    .contacts h1 {
        text-align: center;
        margin-bottom: 15px
    }
    .contacts .row { gap: 12px;}
    .contacts a.contact-wrapper {
        margin: 0 auto;
        max-width: 280px;
    }
    .contacts .button-wrapper {
        margin: 15px auto 0;
    }
    .contacts .address-wrapper {
        flex-direction: column;
    }
    .contacts .text-wrapper {
        margin-bottom: 24px;
    }
    .qr-wrapper {
        display: flex;
    }
    .qr-wrapper picture {
        margin: auto;
    }

    .icon.menu { padding-top: 10px; }
    header .mobile .icon.menu .burger { display: block; }
    header .mobile .icon.menu .close { display: none; }
    header .mobile .icon.menu.active .burger { display: none; }
    header .mobile .icon.menu.active .close { width: 32px; display: block; }
    .mobile-wrapper-menu {
        position: absolute;
        width: 100%;
        top: 86px;
        z-index: 90;
        transition: max-height 0.4s ease-out;
        -webkit-transition: max-height 0.4s ease-out;
        -moz-transition: max-height 0.4s ease-out;
        display: flex;
        flex-flow: column;
        align-items: flex-end;
        max-height: 0;
        overflow: hidden;
        background-color: #ffffff;
        -webkit-box-shadow: 0 4px 4px 0 rgba(0,0,0,0.25);
        -moz-box-shadow: 0 4px 4px 0 rgba(0,0,0,0.25);
        box-shadow: 0 4px 4px 0 rgba(0,0,0,0.25);
        margin-left: -15px;
    }
    .mobile-wrapper-menu.active {
        max-height: 454px;
    }
    .mobile-wrapper-menu ul.menu {
        flex-flow: column;
        width: 100%;
        text-align: center;
        line-height: 42px;
    }
    .mobile-wrapper-menu ul.menu a {
        cursor: pointer;
        padding: 30px 32px;
        color: #485272;
        text-decoration: none;
        font: normal normal 700 16px/28px din-2014;
    }
    .mobile-wrapper-menu ul.language {
        margin-right: 10px;
        margin-bottom: 10px;
        gap: 10px;
    }
    .mobile-wrapper-menu ul.language a {
        padding: 0;
        color: #485272;
        text-decoration: none;
        font: normal normal 700 16px/28px din-2014;
    }
    .mobile-wrapper-menu ul.language li {
        width: 48px;
        height: 48px;
        background-color: #EAEDF0;
        border-radius: 48px;
        text-align: center;
        line-height: 45px;
        color: #485272;
    }
    .mobile-wrapper-menu ul.language li.active {
        background-color: #D70321;
        color: #FFFFFF;
    }
    .mobile-wrapper-menu ul.language li.active a {
        color: #FFFFFF;
    }
    .mobile-wrapper-menu ul.language li.active a.link {
        pointer-events: none;
    }


}