@font-face { font-family: Avenir-Ultra; src: local(AVENIRNEXTCYR-ULTRALIGHT), url('/fonts/Avenir/AVENIRNEXTCYR-ULTRALIGHT.OTF'); }
@font-face { font-family: Avenir-Thin; src: local(AVENIRNEXTCYR-THIN), url('/fonts/Avenir/AVENIRNEXTCYR-THIN.OTF'); }
@font-face { font-family: Avenir-Light; src: local(AVENIRNEXTCYR-LIGHT), url('/fonts/Avenir/AVENIRNEXTCYR-LIGHT.OTF'); }
@font-face { font-family: Avenir-Regular; src: local(AVENIRNEXTCYR-REGULAR), url('/fonts/Avenir/AVENIRNEXTCYR-REGULAR.OTF'); }
@font-face { font-family: Avenir-Italic; src: local(AVENIRNEXTCYR-ITALIC), url('/fonts/Avenir/AVENIRNEXTCYR-ITALIC.OTF'); }
@font-face { font-family: Avenir-Medium; src: local(AVENIRNEXTCYR-MEDIUM), url('/fonts/Avenir/AVENIRNEXTCYR-MEDIUM.OTF'); }
@font-face { font-family: Avenir-Bold; src: local(AVENIRNEXTCYR-BOLD), url('/fonts/Avenir/AVENIRNEXTCYR-BOLD.OTF'); }
@font-face { font-family: Avenir-BoldItalic; src: local(AVENIRNEXTCYR-BOLDITALIC), url('/fonts/Avenir/AVENIRNEXTCYR-BOLDITALIC.OTF'); }
@font-face { font-family: Avenir-Italic; src: local(AVENIRNEXTCYR-ITALIC), url('/fonts/Avenir/AVENIRNEXTCYR-ITALIC.OTF'); }
@font-face { font-family: Avenir-Italic; src: local(AVENIRNEXTCYR-ITALIC), url('/fonts/Avenir/AVENIRNEXTCYR-ITALIC.OTF'); }
@font-face { font-family: Jost-Regular; src: local(Jost-Regular), url('/fonts/Jost-Regular.ttf'); }
@font-face { font-family: Jost-Bold; src: local(Jost-Bold), url('/fonts/Jost-Bold.ttf'); }
@font-face { font-family: Jost-Black; src: local(Jost-Black), url('/fonts/Jost-Black.ttf'); }
@font-face { font-family: Jost-Medium; src: local(Jost-Medium), url('/fonts/Jost-Medium.ttf'); }

html {font-size: 14px;}
html,
body {
    position: relative;
    height: 100%;
    font-family: Jost-Regular;
}
.swiper-container {
    width: 100%;
    height: 100%;
}
a, a:hover {color: inherit; text-decoration: none;}
a:hover {opacity: 0.8}

.font-weight-bold {font-family: Jost-Bold; font-weight: normal;}
.font-weight-bolder {font-family: Jost-Medium; font-weight: normal;}

.btn-primary {background-color: #EA007D; border-color: #EA007D;}
.btn-primary:hover, .btn-primary:focus {background-color: #EA007D;  border-color: #EA007D;}

.btn-outline-primary {border-color: #EA007D; color: white;}
.btn-outline-primary:hover {border-color: #EA007D; background-color: #EA007D;}

.bg {background-repeat: no-repeat; background-size: cover; background-position: center center;}

.type:hover {background-color: #ea007d !important; color: white;
    cursor: pointer;}
.type:hover .type-svg {stroke: white;}

section {
    height: auto!important;
}

.swiper-wrapper {
    display: block!important;
}

.swiper-container {
    padding-top: 124px;
    overflow: auto!important;
}

.title {
    color: #EC008C;
    text-transform: uppercase;
    font-size: 34px;
    line-height: 120%;
    text-align: center;
    font-family: Jost-Bold;
}
.condom {
    width: 60%;
    transform: rotate(-7deg);
}
.middle {
    padding: 20px;
}

.h-40 {
    height: auto;
}
.h-60 {
    height: auto;
}
.prx-3 {
    background-image: url('/img/section-3-header.png');
}
.prx-4 {
    background-image: url('/img/section-4-header.png');
}

.logo {
    height: 32px;
}

.logo-place .logo-pink {
    display: none;
}

.logo-place:hover .logo-pink {
    display: block;
}

.logo-place:hover .logo-white {
    display: none;
}

@media (min-width: 576px) {
    section {
        height: 100% !important;
        padding-top: 70px;
    }
    .swiper-wrapper {
        display: flex!important;
    }
    .swiper-container {
        overflow: hidden!important;
        padding-top: 0;
    }
    .middle {
        height: 100% !important;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 0;
    }
    .title {
        font-size: 60px;
        text-align: left;
    }
    .h-40 {
        height: 35%;
    }
    .h-60 {
        height: 65%;
    }
    .prx-3 {
        background-image: none;
    }
    .prx-4 {
        background-image: none;
    }
    .logo {
        height: 40px;
    }
}

.text-primary {
    color: #EA007D!important;
}

.swiper-pagination {
    background-color: rgba(255,255,255,0.7);
    padding: 15px;
    border-radius: 25px;
}

.swiper-pagination-bullet {
    width: 15px;
    height: 15px;
    margin: 10px 0!important;
}

.swiper-pagination-bullet-active {
    background-color: #EA007D;
}

.swiper-pagination-bullet:focus {
    outline: none;
}