@import url(font.css);

html, body {
position: relative;
height: 100%;
}

body {
background: #eee;
font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
font-size: 14px;
color: #000;
margin: 0;
padding: 0;
}

swiper-container {
width: 100%;
height: 100%;
}

swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
display: flex;
justify-content: center;
align-items: center;
}

swiper-slide img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

.enroll{
    max-width: 100vw;
    height: 100vh;
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    overflow-y: scroll;
    scroll-behavior: smooth;
    transition-property: scroll-left;
    transition-duration: 0.5s;
    transition-timing-function: ease-in-out;
}

    .enroll__back{
        background-image: url(../img/site/matricularse/path.webp);
        padding: 1.25rem .9375rem;
        width: 1.375rem;
        height: 1.125rem;
        background-size: 1.375rem 1.125rem;
        background-position: 50%;
        background-repeat: no-repeat;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 5;
    }

    .slide6{
        background: linear-gradient(to bottom, #003059 0%, transparent 35%, transparent 58%, #003059 100%), url(../img/site/matricularse/imagem6.webp);
    }
    .slide {
        background: linear-gradient(to bottom, #003059 0%, transparent 35%, transparent 58%, #003059 100%);
        z-index: 1000;
    }

    .enroll__slide {
        width: 20rem;
        height: 115vh !important;
        background-position: 50%;
        background-size: auto 100%;
        flex-grow: 0;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        cursor: pointer;
    }

        .enroll__slide--title{
            max-width: 13.75rem;
            margin: 0 auto;
            margin-top: 2.375rem;
        }

            .enroll__slide--title_text{
                font-family: MullerExtrabold;
                font-size: 2.5rem;
                color: white;
            }

        .enroll__slide--body{
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            margin-bottom: 3.3125rem;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .enroll__slide--body1{
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            margin-bottom: 3.3125rem;
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
        }

            .enroll__slide--body_border1{
                margin-bottom: 2.6875rem;
                width: 11.25rem;
                height: 3.6875rem;
                padding: 7px .4063rem;
                border-radius: .9375rem;
            }

            .enroll__slide--body_border2{
                width: 11.25rem;
                height: 3.6875rem;
                padding: 7px .4063rem;
                border-radius: .9375rem;
                margin-top: 2.6875rem;
            }

            .enroll__slide--body_border3{
                width: 11.25rem;
                height: 3.6875rem;
                padding: 7px .4063rem;
                border-radius: .9375rem;
                margin-top: 2.6875rem;
            }

            .enroll__slide--body2_border1{
                margin-bottom: 2.6875rem;
                width: 11.25rem;
                height: 3.6875rem;
                padding: 7px .4063rem;
                border-radius: .9375rem;
            }

            .enroll__slide--body2_border2{
                width: 11.25rem;
                height: 3.6875rem;
                padding: 7px .4063rem;
                border-radius: .9375rem;
                margin-top: 2.6875rem;
            }

            .enroll__slide--body2_border3{
                width: 11.25rem;
                height: 3.6875rem;
                padding: 7px .4063rem;
                border-radius: .9375rem;
                margin-top: 2.6875rem;
            }

                .enroll__slide--body_border1:hover{
                    background-color: rgb(0, 162, 255, 0.3);
                }

                .enroll__slide--body_border2:hover{
                    background-color: rgb(0, 162, 255, 0.3);
                }

                .enroll__slide--body_border3:hover{
                    background-color: rgb(0, 48, 89, 0.3);
                }

                .enroll__slide--body_border-button{
                    width: 11.25rem;
                    height: 3.6875rem;
                    background-color: #00A2FF;
                    border-radius: .625rem;
                    border: none;
                    color: white;
                    font-family: 'Inter', sans-serif;
                    font-size: .875rem;
                    font-weight: 700;
                    cursor: pointer;
                }

                .enroll__slide--body_border-button1{
                    width: 11.25rem;
                    height: 3.6875rem;
                    background-color: #00A2FF;
                    border-radius: .625rem;
                    border: none;
                    color: white;
                    font-family: 'Inter', sans-serif;
                    font-size: .875rem;
                    font-weight: 700;
                    cursor: pointer;
                }

                .enroll__slide--body_border-button3{
                    width: 11.25rem;
                    height: 3.6875rem;
                    background-color: #003059;
                    border-radius: .625rem;
                    border: none;
                    color: white;
                    font-family: 'Inter', sans-serif;
                    font-size: .875rem;
                    font-weight: 700;
                    cursor: pointer;
                }

            .enroll__slide--body_text{
                font-family: MullerBold;
                font-size: 1rem;
                color: white;
                max-width: 16.25rem;
                text-align: center;
                transition: 500ms;
                line-height: 1.5;
            }

            .enroll__slide--body2_text{
                font-family: MullerBold;
                font-size: 1rem;
                color: white;
                max-width: 16.25rem;
                text-align: center;
                transition: 500ms;
            }


    .enroll__next{
        width: 3.4375rem;
        height: 100%;
        background: rgb(0, 0, 0, 0.3);
        background-image: url(arrowRight.webp);
        background-size: 1.0875rem 3.4431rem;
        background-position: 50%;
        background-repeat: no-repeat;
        position: fixed;
        right: 0;
        cursor: pointer;
    }

        .enroll__next:hover{
            background-color: transparent;
            background-image: none;
        }

.swiper-button-prev{
    display: none !important;
}

.swiper-button-next{
    background-color: rgb(0, 0, 0, 0.3);
    width: 15vw;
    position: absolute;
    top: 0;
    right: 0;
    height: 100vh;
    margin: 0;
}

.swiper-button-next::after{
    color: white;
}



@media screen and (min-width: 720px) {
.enroll{
    max-width: 100vw;
    max-height: 100vh;
    overflow-x: hidden;
    overflow-y: hidden;
}

    .enroll__slide {
        height: 100vh !important;
        width: 23.4vw;
    }

            .enroll__slide--title_text{
                transition: 500ms;
                line-height: 1.2;
            }

        .enroll__slide--body{
            width: 15.1875rem;
            display: flex;
            flex-direction: column-reverse;
            height: 25rem;
        }

            .enroll__slide--body_border1{
                margin-top: 2.6875rem;
                position: absolute;
                bottom: 0;
                margin-bottom: -31.25rem;
                transition: 500ms;
            }

            .enroll__slide--body_border2{
                margin-top: 2.6875rem;
                position: absolute;
                bottom: 0;
                margin-bottom: -31.25rem;
                transition: 500ms;
            }

            .enroll__slide--body_border3{
                margin-top: 2.6875rem;
                position: absolute;
                bottom: 0;
                margin-bottom: -31.25rem;
                transition: 500ms;
            }

            .enroll__slide--body2_border1{
                margin-top: 2.6875rem;
                position: static;
                bottom: 0;
                margin-bottom: 0;
                transition: 500ms;
            }

            .enroll__slide--body2_border2{
                margin-top: 2.6875rem;
                position: static;
                bottom: 0;
                margin-bottom: 0;
                transition: 500ms;
            }

            .enroll__slide--body2_border3{
                margin-top: 2.6875rem;
                position: static;
                bottom: 0;
                margin-bottom: 0;
                transition: 500ms;
            }

                .enroll__slide--body_border1:hover{
                    background-color: rgb(0, 162, 255, 0.3);
                }

                .enroll__slide--body_border2:hover{
                    background-color: rgb(0, 162, 255, 0.3);
                }

                .enroll__slide--body_border3:hover{
                    background-color: rgb(0, 162, 255, 0.3);
                }

                .enroll__slide--body2_border1:hover{
                    background-color: rgb(0, 162, 255, 0.3);
                }

                .enroll__slide--body2_border2:hover{
                    background-color: rgb(0, 162, 255, 0.3);
                }

                .enroll__slide--body2_border3:hover{
                    background-color: rgb(0, 48, 89, 0.3);
                }

                .enroll__slide--body_border-button{
                    width: 11.25rem;
                    height: 3.6875rem;
                    background-color: #00A2FF;
                    border-radius: .625rem;
                    border: none;
                    color: white;
                    font-family: 'Inter', sans-serif;
                    font-size: .875rem;
                    font-weight: 700;
                    cursor: pointer;

                }

            .enroll__slide--body2_text{
                position: absolute;
                margin-bottom: -31.25rem;
                transition: 500ms;
            }

    .enroll__next{
        width: 6.7vw;
        background-size: 1.25rem 3.75rem;
        background-color: rgb(0, 0, 0, 0.3);
    }

.swiper-button-next{
    background-color: rgb(0, 0, 0, 0.3);
    width: 5.8vw;
    position: absolute;
    top: 0;
    right: 0;
    height: 100vh;
    margin: 0;
}
}
