body {
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
}

.slider {
    position: relative;
    overflow: hidden;
}

.slider-container {
    position: relative;
    top: 0;
    left: 0;
    width: 400%;
    transition: left 0.4s;
    display: flex;
}

.slider-item {
    width: 100%;
    display: flex;
    flex-flow: column nowrap;
    align-items: flex-start;
}

.slider-caption {
    margin-left: 25px;
    font-weight: 500;
    position: absolute;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    text-transform: capitalize;
    color: white;
}

.slider-dot-control label {
    cursor: pointer;
    border-radius: 50%;
    display: inline-block;
    width: 10px;
    height: 10px;
    background: black;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    margin:8px;
}

.slider-dot-control {
    position: absolute;
    width: 100%;
    bottom: 0;
    text-align: center;
    display: flex;
    justify-content: center;
    flex-flow: nowrap;
    z-index: 1;
}

.about-us-principles .slider-dot-control {
    display: none;
}

.slider-nav {
    cursor: pointer;
    display: none;
}

@media (max-width: 475px) {
    .slider-nav:checked:nth-of-type(1) ~ .slider-dot-control label:nth-of-type(1){
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(2) ~ .slider-dot-control label:nth-of-type(2) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(3) ~ .slider-dot-control label:nth-of-type(3) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(4) ~ .slider-dot-control label:nth-of-type(4) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(5) ~ .slider-dot-control label:nth-of-type(5) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(6) ~ .slider-dot-control label:nth-of-type(6) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(7) ~ .slider-dot-control label:nth-of-type(7) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(8) ~ .slider-dot-control label:nth-of-type(8) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(9) ~ .slider-dot-control label:nth-of-type(9) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(10) ~ .slider-dot-control label:nth-of-type(10) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(11) ~ .slider-dot-control label:nth-of-type(11) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(12) ~ .slider-dot-control label:nth-of-type(12) {
        opacity: 0.6;
    }

    .slider-nav:checked:nth-of-type(1) ~ .slider-container {
        left: 0;
    }

    .slider-nav:checked:nth-of-type(2) ~ .slider-container {
        left: -100%;
    }

    .slider-nav:checked:nth-of-type(3) ~ .slider-container {
        left: -200%;
    }

    .slider-nav:checked:nth-of-type(4) ~ .slider-container {
        left: -300%;
    }

    .slider-nav:checked:nth-of-type(5) ~ .slider-container {
        left: -400%;
    }

    .slider-nav:checked:nth-of-type(6) ~ .slider-container {
        left: -500%;
    }

    .slider-nav:checked:nth-of-type(7) ~ .slider-container {
        left: -600%;
    }

    .slider-nav:checked:nth-of-type(8) ~ .slider-container {
        left: -700%;
    }

    .slider-nav:checked:nth-of-type(9) ~ .slider-container {
        left: -800%;
    }

    .slider-nav:checked:nth-of-type(10) ~ .slider-container {
        left: -900%;
    }

    .slider-nav:checked:nth-of-type(11) ~ .slider-container {
        left: -1000%;
    }

    .slider-nav:checked:nth-of-type(12) ~ .slider-container {
        left: -1100%;
    }
}

.about-us-principles .slider-nav:checked:nth-of-type(1) ~ .about-us-principles-keys label:nth-of-type(1){
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(2) ~ .about-us-principles-keys label:nth-of-type(2) {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(3) ~ .about-us-principles-keys label:nth-of-type(3) {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(4) ~ .about-us-principles-keys label:nth-of-type(4) {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(5) ~ .about-us-principles-keys label:nth-of-type(5) {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(6) ~ .about-us-principles-keys label:nth-of-type(6) {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(7) ~ .about-us-principles-keys label:nth-of-type(7) {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(8) ~ .about-us-principles-keys label:nth-of-type(8) {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(9) ~ .about-us-principles-keys label:nth-of-type(9) {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-principles .slider-nav:checked:nth-of-type(10) ~ .about-us-principles-keys label:nth-of-type(10) {
    color: #F7FBF9;
    background: #36875F;
}


.about-us-principles .slider-nav:checked:nth-of-type(1) ~  .slider-container {
    left: 0;
}

.about-us-principles .slider-nav:checked:nth-of-type(2) ~  .slider-container {
    left: -100%;
}

.about-us-principles .slider-nav:checked:nth-of-type(3) ~ .slider-container {
    left: -200%;
}

.about-us-principles .slider-nav:checked:nth-of-type(4) ~ .slider-container {
    left: -300%;
}

.about-us-principles .slider-nav:checked:nth-of-type(5) ~ .slider-container {
    left: -400%;
}

.about-us-principles .slider-nav:checked:nth-of-type(6) ~ .slider-container {
    left: -500%;
}

.about-us-principles .slider-nav:checked:nth-of-type(7) ~ .slider-container {
    left: -600%;
}

.about-us-principles .slider-nav:checked:nth-of-type(8) ~  .slider-container {
    left: -700%;
}

.about-us-principles .slider-nav:checked:nth-of-type(9) ~  .slider-container {
    left: -800%;
}

.about-us-principles .slider-nav:checked:nth-of-type(10) ~ .slider-container {
    left: -900%;
}

.about-us-techstack-items img {
  width: 120px;
  height: 60px;
}

.about-us-header {
    color: white;
    display: flex;
    justify-content: space-between;
    padding: 20px;
}

.about-us-teaser {
    background-image: url("/assets/about-us/img/main-459299a2bb8999266339a66187986431.jpg");
    background-color: #7f7f7f;
    position: absolute;
    z-index: -1;
    top: 0;
    width: 100%;
    height: 170px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

.logo {
    height: 25px;
}

.about-us-logo {
    display: inline-block;
    text-decoration: none;
}

.about-us-logo-text {
    color: white;
    display: block;
    margin: -5px -8px 0 0;
    font-size: 7px;
    text-align: right;
}

.about-us-header-burger {
    display: flex;
    flex-grow: 1;
    justify-content: flex-end;
}

.category-menu-burger {
    display: inline-block;
}

.category-menu-burger-layer:first-child {
    margin-top: 5px;
}

.category-menu-burger-layer {
    display: block;
    width: 24px;
    height: 2px;
    margin: 0 0 4px;
    background: white;
    border-radius: 3px;
    z-index: 7;
    cursor: pointer;
    transition: transform .5s cubic-bezier(0.77, 0.2, 0.05, 1), background .5s ease-in-out;
}

.category-menu {
    top: 0;
    z-index: 7;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    display: flex;
}

.category-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.category-menu .toggle {
    display: none;
    cursor: pointer;
}

.drop-menu {
    list-style: none;
    display: none;
}

.category-menu-toggle-title {
    width: 0;
    display: none;
    cursor: pointer;
    align-items: center;
    height: 100%;
    justify-content: center;
    font-size: 1.6rem;
    font-weight: 500;
    color: white;
    text-transform: capitalize;
}

.category-menu-toggle-title  .logo{
    margin:25px 10px 0;
}

.category-menu-toggle-title .about-us-logo-text {
    color: #323246;
}

.toggle:checked ~ .category-menu-toggle-title {
    left: 0;
    top: 0;
    width: 100%;
    display: block;
    position: absolute;
    background-color: white;
    color: black;
    height: 80px;
}

.toggle:checked ~ .drop-menu {
    display: inline-block;
    background: white;
    width: 100%;
    padding-top: 10px;
    position: absolute;
    top: 80px;
    left: 0;
    box-shadow: 1px 7px 10px rgba(0, 0, 0, 0.2);

}

.toggle:checked ~ .category-menu-burger span {
    opacity: 1;
    background: black;
    transform: rotate(45deg) translate(2px, 0);
}

.toggle:checked ~ .category-menu-burger span:nth-last-child(3) {
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
}

.toggle:checked ~ .category-menu-burger span:nth-last-child(2) {
    transform: rotate(-45deg) translate(-4px, 7px);
}

.toggle:checked ~ .category-menu-burger-layer:last-child {
    transform-origin: 0 100%;
    margin-bottom: 0;
}

.toggle:checked ~ .about-us-logo-text {
    background: black;
}

.toggle:checked ~ .category-menu-burger-layer:first-child {
    transform: rotate(45deg);
}

.toggle:checked ~ .category-menu-burger-layer:last-child {
    transform: rotate(135deg);
    position: relative;
    right: 1px;
    bottom: 6px;
}

.toggle:checked .about-us-header {
    background: white;
}

.about-us-header-info-menu {
    margin: 40px;
}

.about-us-header-info-menu li {
    margin: 10px;
}

.about-us-header-info-menu li a {
    font-size: 20px;
    line-height: 52px;
    font-weight: 600;
}

.about-us-header-content {
    background-color: white;
    padding: 20px 24px;
    margin-top: 95px;
}

.about-us-header-title {
    font-size: 24px;
    line-height: 29px;
}

.about-us-header-text {
    line-height: 180%;
}

.about-us-title {
    margin: 0 30px;
    padding-top: 30px;
    padding-bottom: 20px;
    font-weight: 600;
    font-size: 24px;
    line-height: 29px;
}

.about-us-subtitle {
  margin: 10px 45px 20px 45px;
}

.about-us-text {
    line-height: 180%;
    margin: 0 30px;
    padding: 20px 0;
}

.about-us-content {
    background: white;
}

.about-us-team {
    background: #F7FBF9;
    max-width: 1200px;
    margin: 0 auto;
}

.about-us-team-member picture {
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}

.about-us-team-member img {
    width: 100%;
}

.about-us-team-member-name {
    bottom: 35px;
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
}

.about-us-team-member-title {
    bottom: 10px;
    font-size: 15px;
    line-height: 18px;
}

.about-us-team-member-text {
    line-height: 180%;
    padding: 0 24px;
}

.about-us-team .slider-container {
    width: 900%;
}

.about-us-team .slider-dot-control {
    top:0;
}

.about-us-team .slider-dot-control label {
    background: white;
}

.about-us-text-box {
    font-weight: 500;
    font-size: 16px;
    line-height: 180%;
    background: #F7FBF9;
    padding: 20px;
}

.about-us-text-box-content {
    display: flex;
}

.about-us-text-box-item {
    display: inline-block;
    font-weight: 600;
    margin: 20px;
    font-size: 12px;
    line-height: 15px;
    text-align: center;
}

.about-us-galary-image {
    width: 100%;
    display: none;
}

.about-us-galary-image-1 {
    display: block;
}

.about-us-culture {
    background-color: white;
    max-width: 1200px;
    margin: 0 auto;
}

.about-us-culture li {
    list-style: none;
    background: url("/assets/about-us/img/dot-5d7ebb7092764ad0c69200e2030b3ba5.svg") no-repeat left top;
    padding: 30px 0 0 10px;
}

.about-us-benefits-galary-image {
    width: 100%;
    display: none;
}

.about-us-benefits-galary-image-1 {
    display: block;
}

.about-us-benefits {
    background-color: white;
    max-width: 1200px;
    margin: 10px auto;
}

.about-us-benefits-box-container span{
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
}

.about-us-benefits-box-container {
    padding: 20px 50px;
    background: #F7FBF9;
}

.about-us-benefits-box-container ul {
    padding: 0;
    font-weight: 500;
    font-size: 16px;
    line-height: 180%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;

}

.about-us-principles {
    background-color: white;
    max-width: 1200px;
    margin: 30px auto;
}

.about-us-principles .slider-container {
    width: 1000%;
}

.about-us-principles .slider-item {
    width: 100%;
}

.about-us-principles .about-us-text-box {
    font-weight: 600;
    font-size: 16px;
    margin: 10px;
    align-self: center;
}

.about-us-principles-keys {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.about-us-principles-keys .about-us-text-box {
    display: inline-block;
    background: #F7FBF9;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
    line-height: 180%;
    padding: 10px;
    margin: 10px;
    cursor: pointer;
}

.about-us-principles-keys .about-us-text-box:hover {
    color: #F7FBF9;
    background: #36875F;
}

.about-us-techstack {
    background-color: white;
    max-width: 1200px;
    margin: 30px auto;
}

.about-us-techstack .slider {
    background-color: #F7FBF9;
}

.about-us-techstack .slider-container {
    width: 1200%;
}

.about-us-techstack-items img {
    width: 100%;
}

.about-us-techstack-item {
    width: 100%;
    align-items: center;
}

.about-us-techstack-galary-image {
    display: none;
    width: 100%;
}

.about-us-techstack-galary-image-2 {
    display: block;
}

.about-us-techstack-item picture {
    padding: 50px;
}

.footer {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    background: #22874C;
    max-width: 1200px;
}

.footer-container {
    background: #22874C;
    position: relative;
}

.footer-menu-block {
    flex-basis: 100%;
    margin: 10px 10px 16px;
}

.footer-menu-block:last-child {
    margin-bottom: 0;
}

.footer-menu-block ul {
    margin: 0;
    padding: 0;
}

.footer-menu-block ul li {
    list-style: none;
    white-space: nowrap;
}

.footer-content {
    margin: 32px 24px;
}

.footer-item {
    background-position: center;
    margin: 10px;
}

.nav-header {
    color: white;
    margin-bottom: 0;
    white-space: nowrap;
}

.nav-item {
    font-size: 18px;
    line-height: 31px;
    text-align: center;
    margin-top: 5px;
}

.nav-item a {
    color: white;
}

.footer-ssl {
    width: 110px;
    height: 47px;
    background-repeat: no-repeat;
    background-image: url('/assets/about-us/img/ssl-logo-895912035024724867f7b7501abf0096.gif');
    background-size: 95px 47px;
}

.legal-hint {
    padding: 20px;
    font-size: 0.9em;
    background: #18A45C;
    text-align: center;
}

.legal-hint a, .btn a {
    cursor: pointer;
    background-color: transparent;
    color: white;
    text-decoration: none;
}


.btn {
    border: 1px solid #A9E8C8;
    border-radius: 5px;
    color: white;
    padding: 15px 10px;
    display: flex;
    align-items: center;
    text-decoration: none;
    white-space: nowrap;
}

.star-icon {
    margin: 0 8px;
}

@media screen and (min-width: 475px) {
    .about-us-teaser {
        height: 225px;
    }

    .about-us-header-content {
        margin-top: 150px;
    }

    .slider-container {
        width: 100%;
    }

    .slider-caption {
        color: black;
        position: relative;
        margin: 10px 0;
    }

    .slider-dot-control label {
        display: none;
    }

    .slider {
        margin: 0 10px;
    }

    .about-us-team-member-title {
        bottom: 0;
        font-weight: 600;
        font-size: 24px;
        line-height: 29px;
    }

    .about-us-team-member-text {
        padding: 0;
        bottom: 0;
        position: relative;
        top: 0;
    }

    .about-us-team-member-name {
        bottom: 0;
        font-weight: 600;
        font-size: 18px;
        line-height: 22px;
    }

    .about-us-team .slider-container {
        width: 100%;
    }

    .about-us-galary {
        display: flex;
      justify-content: center;
    }

    .about-us-galary-image {
        display: inline;
    }

    .about-us-principles .slider-container {
        flex-wrap: nowrap;
    }

    .about-us-techstack .slider-container {
        width: 100%;
    }

    .about-us-techstack-item picture {
        padding: 10px;
    }

    .about-us-grid-box {
        display: grid;
        grid-template-columns:  repeat(2, 1fr);
        grid-gap: 20px;
    }

    .about-us-culture-text-box-container {
        background: #F7FBF9;
    }

    .about-us-culture-text-box-container .about-us-text-box {
        padding: 0;
    }

    .about-us-techstack .about-us-grid-box {
        grid-template-columns:  repeat(3, 1fr);
    }

    .about-us-benefits .about-us-grid-box {
        grid-template-columns: 1fr;
    }

    .about-us-benefits .slider {
        margin: 0;
    }

    .about-us-benefits-box-container {
        width: auto;
    }
}

@media screen and (min-width: 661px) {
    .logo {
        height: 38px;
    }

    .about-us-teaser {
        height: 275px;
    }

    .about-us-header-content {
        margin-top: 190px;
    }

    .about-us-principles .about-us-text-box {
        border-radius: 60px;
        text-align: center;
        margin: 10px 30px;
    }

    .about-us-principles-keys {
        display: block;
        text-align: center;
        margin: 20px;
    }

    .about-us-principles-keys .about-us-text-box {
        border-radius: 54px;
    }

    .about-us-benefits .about-us-grid-box {
        grid-template-columns:  repeat(2, 1fr);
        grid-column-gap: 40px;
    }

    .about-us-benefits .slider {
        margin: 0 10px;
    }

    .about-us-benefits .about-us-grid-box {
        grid-template-columns:  repeat(2, 1fr);
    }
}

@media screen and (min-width: 768px) {
    .about-us-teaser {
        height: 360px;
    }

    .about-us-header-content {
        margin-top: 250px;
        text-align: center;
    }

    .about-us-header-title {
        font-size: 36px;
        line-height: 44px;
    }

    .about-us-header-text {
        max-width: 780px;
        display: inline-block;
    }

    .about-us-title {
        font-weight: 600;
        font-size: 36px;
        line-height: 44px;
    }

    .about-us-text {
        font-size: 14px;
    }

    .about-us-principles .about-us-text-box {
        align-items: center;
    }

    .footer {
        flex-wrap: nowrap;
        padding: 30px;
        margin: 0 auto;
        justify-content: space-around;
    }

    .footer-item {
        flex-basis: auto;
        margin-bottom: 0;
    }

    .footer-item .footer-best-prices, .footer-item .footer-ssl {
        margin: 10px;
        flex-basis: unset;
    }

    .footer-menu-block {
        flex-basis: 0;
    }

    .footer-menu-block ul li {
        text-align: left;
    }

    .nav-header {
        text-align: left;
    }

    .about-us-best-price-award-content {
      flex-direction: row;
    }
}

@media screen and (min-width: 992px) {
    .about-us-teaser {
        height: 500px;
    }

    .about-us-header-content {
        margin-top: 335px;
    }

    .about-us-text-box {
        padding: 25px;
    }

    .category-menu-burger {
        display: none;
    }

    .drop-menu {
        display: inline-block;
    }

    .about-us-header-info-menu {
        display: flex;
        margin: 0;
    }

    .about-us-header-info-menu li a {
        font-size: 15px;
        line-height: 22px;
        text-decoration-line: underline;
        color: #FFFFFF;
    }

    .category-menu-toggle-title {
        display: none;
    }

    .footer-menu-block nav {
        display: flex;
    }

    .footer-nav:nth-child(1) {
        margin-right: 50px;
    }

    .about-us-grid-box {
        grid-template-columns: repeat(4, 1fr) ;
    }

    .about-us-team .about-us-grid-box {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 1024px),
screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 1024px),
screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 1024px),
screen and (        min-device-pixel-ratio: 2)      and (min-width: 1024px),
screen and (                min-resolution: 2dppx)  and (min-width: 1024px) {

    .about-us-teaser {
        background-image: url("/assets/about-us/img/main@2x-fe2fbe7b2b421b8fcee3acabe9a64cd9.jpg");
    }
}

@media screen and (min-width: 1024px) {

    .about-us-header {
        margin: 20px;
    }

    .about-us-logo img {
        height: 39px;
    }
}

@media screen and (min-width: 1440px) {

    .about-us-header-info-menu li a {
        font-size: 18px;
    }

    .about-us-header-content {
        margin-top: 360px;
        padding: 10px;
    }

    .about-us-text {
        margin: 0 45px;
    }

    .about-us-title {
        margin: 0 40px;
    }
}

@media screen and (min-resolution: 2dppx) ,
screen and (-webkit-min-device-pixel-ratio: 2),
screen and (     -o-min-device-pixel-ratio: 2/1),
screen and (min-resolution: 192dpi) {

    .footer-ssl {
        background-image: url('/assets/about-us/img/ssl-logo@2x-5b7809892122f865278a223fa6e94a71.gif');
    }

    .footer-best-prices {
        background-image: url('/assets/about-us/img/best-price@2x-92ab8c8b78fd9912c89672021788302d.png');
    }
}

@media screen and (min-width: 1600px) {
    .about-us-teaser {
        background-image: url('/assets/about-us/img/main@4x-17578ac10c9d403e392102417742c315.jpg');
        height: 700px;
    }

    .about-us-header-content {
        margin-top: 540px;
    }
}

@media screen and (min-width: 2000px) {
    .about-us-teaser {
        height: 800px;
    }

    .about-us-header-content {
        margin-top: 640px;
    }
}

.legal-hint-popover {
    background-color: black;
    padding: 30px;
    opacity: .8;
    color: white;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    display: none;
    line-height: 180%;
}

.legal-hint-popover-content {
    max-width: 1200px;
    margin: auto;
    position: relative;
}

.legal-hint-popover-content .close::before {
    position: absolute;
    top: 5px;
    right: 15px;
    color: white;
    cursor: pointer;
    content: '\D7';
    font-size: 1.66em;
}

.legal-hint-popover:target {
   display: block;
}