﻿body {
    font-family: futura_md_bt_bold important;
    margin: 0;
    padding: 0;
    min-width: 262px !important;
    line-height: 1.5;
    background: url('/Common/Images/background-image-newLayout.png') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    text-align: center;
}


input, a {
    border-radius: 0 !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}


html {
    height: 100%;
    scroll-behavior: smooth;
}


@font-face {
    font-family: 'futura_bk_bt_book';
    src: url('../../../dist/fonts/futura_bk_bt_book.ttf') format('truetype');
}

@font-face {
    font-family: 'futura_md_bt_bold';
    src: url('../../../dist/fonts/futura_md_bt_bold.ttf') format('truetype');
}


.bookFont {
    font-family: futura_bk_bt_book
}

.boldFont {
    font-family: futura_md_bt_bold !important
}


.checkbox.checkbox-outline > span {
    height: 25px;
    width: 25px;
    background-color: white;
}



.checkbox.checkbox-outline > input:checked ~ span {
    background-color: white;
}

.checkbox:hover > input:not([disabled]) ~ span {
    background-color: white;
}

.btn-grande-loja {
    font-size: 28px;
    font-family: futura_md_bt_bold !important;
    width: 100%;
    background-color: #094ca0;
    color: #FFF;
}

    .btn-grande-loja:hover {
        color: #FFF;
        background-color: #073d80;
    }

.btn-grande {
    font-family: futura_md_bt_bold !important;
    font-size: 35px;
    min-width: 85%;
    background-color: #094ca0;
    color: #FFF;
}

    .btn-grande:hover {
        color: #FFF;
        background-color: #073d80;
    }


.btn-amarelo {
    background-color: #fdbd10;
    color: #094ca0;
    font-size: 28px;
    margin: 0;
}

    .btn-amarelo:hover {
        background-color: #d59c02;
        color: #094ca0;
    }


.font-weight-semibold {
    font-weight: bolder;
}

.titlesSection {
    padding: 30px 20px;
}



.containerProdutos {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 20px;
    padding: 30px;
}

.cards {
    flex: 1;
    background-color: #fff;
    width: 100%;
}


/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
    /* Styles */

    .headerLogo {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
    }

    .logo {
        flex: 1;
    }

    .txtLogo {
        flex: 1;
    }

    /*#region Login */

    .loginContainer {
        display: flex;
        flex-direction: column;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
    }

    .loginSide {
        flex: .5;
        flex-direction: row;
        background-color: #FFFFFFaa;
        margin-top: 20px;
    }

        .loginSide img {
            height: 200px;
        }

        .loginSide .title {
            font-family: futura_md_bt_bold;
            font-size: 35px;
            color: #0063ad;
            line-height: 1.5;
        }

        .loginSide span {
            font-family: futura_md_bt_bold;
            font-size: 22px;
            color: #0063ad;
            line-height: 1.2;
        }

        .loginSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
            margin-top: 50px;
        }

    /*#endregion */

    /*#region Loja */

    .lojaContainer {
        display: flex;
        flex-direction: column;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
    }

    .lojaSide {
        background-color: #FFFFFFaa;
        margin-top: 20px;
    }

        .lojaSide img {
            height: 200px;
        }

        .lojaSide .title {
            font-family: futura_md_bt_bold;
            font-size: 35px;
            color: #0063ad;
            line-height: 1.5;
        }

        .lojaSide span {
            font-family: futura_md_bt_bold;
            font-size: 22px;
            color: #0063ad;
            line-height: 1.2;
        }

        .lojaSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
            margin-top: 50px;
        }

    /*#endregion */


}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-width : 321px) and (max-width :768px) {
    /* Styles */

    .headerLogo {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .logo {
        flex: 1;
    }

    .txtLogo {
        flex: 1;
    }

    /*#region Login */

    .loginContainer {
        display: flex;
        flex-direction: column;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
    }

    .loginSide {
        background-color: #FFFFFFaa;
        align-items: center;
        justify-content: center;
        margin-top: 20px;
    }

        .loginSide img {
            height: 200px;
        }


        .loginSide .title {
            font-family: futura_md_bt_bold;
            font-size: 35px;
            color: #0063ad;
            line-height: 1.5;
        }

        .loginSide span {
            font-family: futura_md_bt_bold;
            font-size: 22px;
            color: #0063ad;
            line-height: 1.2;
        }

        .loginSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
        }


    /*#endregion */

    /*#region Loja */

    .lojaContainer {
        display: flex;
        flex-direction: column;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
    }

    .lojaSide {
        background-color: #FFFFFFaa;
        align-items: center;
        justify-content: center;
        margin-top: 20px;
    }

        .lojaSide img {
            height: 200px;
        }


        .lojaSide .title {
            font-family: futura_md_bt_bold;
            font-size: 35px;
            color: #0063ad;
            line-height: 1.5;
        }

        .lojaSide span {
            font-family: futura_md_bt_bold;
            font-size: 22px;
            color: #0063ad;
            line-height: 1.2;
        }

        .lojaSide a {
            display: none;
        }








    /*#endregion */

}

/* Desktops and laptops ----------- */
@media only screen and (min-width : 769px) and (max-width : 1823px) {
    /* Styles */
    .headerLogo {
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;
    }

    .logo {
        flex: 1;
    }

    .txtLogo {
        flex: 1;
    }
    /*#region Login */


    .loginContainer {
        display: flex;
        flex-direction: row;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
    }

    .loginSide {
        flex: .5;
        background-color: #FFFFFFaa;
        align-items: center;
        justify-content: center;
        margin-left: 40px;
    }

        .loginSide img {
            height: 300px;
        }


        .loginSide .title {
            font-family: futura_md_bt_bold;
            font-size: 48px;
            color: #0063ad;
            line-height: 1.5;
        }

        .loginSide span {
            font-family: futura_md_bt_bold;
            font-size: 35px;
            color: #0063ad;
            line-height: 1.2;
        }

        .loginSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
            margin-top: 100px;
        }


    /*#endregion */

    /*#region Loja */

    .lojaContainer {
        display: flex;
        flex-direction: column;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
    }

    .lojaSide {
        display: flex;
        flex: .7;
        background-color: #FFFFFFaa;
        align-items: center;
        justify-content: center;
        margin-left: 40px;
    }

        .lojaSide img {
            height: 400px;
        }


        .lojaSide .title {
            font-family: futura_md_bt_bold;
            font-size: 48px;
            color: #0063ad;
            line-height: 1.5;
        }

        .lojaSide span {
            font-family: futura_md_bt_bold;
            font-size: 35px;
            color: #0063ad;
            line-height: 1.2;
        }

        .lojaSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
        }

    .containerProdutos {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 20px;
        padding: 30px;
    }

    .cards {
        display: flex;
        width: 100%;
        height: 100%;
        min-width: 250px;
        min-height: 370px;
        flex-basis: calc(50% - 40px);
        justify-content: center;
        flex-direction: column;
    }

    .containerHeader {
        display: flex;
        flex-direction: row;
    }

    .containerLoja {
        display: flex;
        flex-direction: column;
    }
    /*#endregion */

}

/* Large screens ----------- */
@media only screen and (min-width : 1824px) and (max-width : 2560px) {
    /* Styles */
    .headerLogo {
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;
    }

    .logo {
        flex: 1;
    }

    .txtLogo {
        flex: 1;
    }

    /*#region Login */

    .loginContainer {
        display: flex;
        flex-direction: row;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
    }

    .loginSide {
        flex: .4;
        background-color: #FFFFFFaa;
        align-items: center;
        justify-content: center;
        margin-left: 20px;
    }

        .loginSide img {
            height: 400px;
        }


        .loginSide .title {
            font-family: futura_md_bt_bold;
            font-size: 48px;
            color: #0063ad;
            line-height: 1.5;
        }

        .loginSide span {
            font-family: futura_md_bt_bold;
            font-size: 35px;
            color: #0063ad;
            line-height: 1.2;
        }

        .loginSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
            margin-top: 100px;
        }

    /*#endregion */

    /*#region Loja */

    .lojaContainer {
        display: flex;
        flex-direction: column;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
        width: 100%;
        margin: auto;
    }

    .lojaSide {
        display: flex;
        flex: .5;
        background-color: #FFFFFFaa;
        align-items: center;
        justify-content: center;
        margin-left: 40px;
    }

        .lojaSide img {
            height: 400px;
        }


        .lojaSide .title {
            font-family: futura_md_bt_bold;
            font-size: 48px;
            color: #0063ad;
            line-height: 1.5;
        }

        .lojaSide span {
            font-family: futura_md_bt_bold;
            font-size: 35px;
            color: #0063ad;
            line-height: 1.2;
        }

        .lojaSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
            margin-top: 100px;
        }

    .containerProdutos {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 20px;
        padding: 30px;
    }

    .cards {
        display: flex;
        width: 100%;
        height: 100%;
        min-width: 250px;
        min-height: 370px;
        flex-basis: calc(50% - 40px);
        justify-content: center;
        flex-direction: column;
    }

    .containerHeader {
        display: flex;
        flex-direction: row;
    }

    .containerLoja {
        display: flex;
        flex-direction: column;
    }
    /*#endregion */
}

@media only screen and (min-width : 2561px) {
    /* Styles */

    .errorBig {
        font-size: 30px;
    }

    .titlesSection {
        padding: 100px 60px !important;
    }

    .titlesSection > h3{
        font-size: 75px !important;
    }
    .invalid-feedback {
        width: 85%;
        font-size: 5rem !important;
    }

    #EmailAddress-error {
        width: 85%;
        font-size: 5rem !important;
    }

    #usernameOrEmailAddress-error {
        width: 85%;
        font-size: 5rem !important;
    }

    #password-error {
        width: 85%;
        font-size: 5rem !important;
    }

    .checkbox.checkbox-outline > span {
        height: 75px;
        width: 75px;
        background-color: white;
    }

    .checkbox > span:after {
        width: 15px !important;
        height: 30px !important;
    }

    .loginForm {
        width: 50%;
    }

    input[type="text"], input[type="password"], imput[type="email"] {
        height: 10rem;
        font-size: 5rem !important;
        width: 70%;
    }

    .form-group {
        margin-bottom: 50px;
    }

    button, .aBtn {
        height: 10rem;
        font-size: 5rem !important;
        width: 60% !important;
    }

    .btn-grande {
        font-family: futura_md_bt_bold !important;
        font-size: 35px;
        min-width: 70%;
        background-color: #094ca0;
        color: #FFF;
    }

    .btn-amarelo {
        background-color: #fdbd10;
        color: #094ca0;
        font-size: 28px;
        min-width: 70%;
        margin: 0;
    }

        .btn-amarelo:hover {
            background-color: #d59c02;
            color: #094ca0;
        }

    .titleLarge {
        font-size: 7rem !important;
    }

    .subTitleLarge {
        font-size: 5rem !important;
    }

    .headerLogo {
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;
    }

    .logo {
        flex: 1;
    }

    .txtLogo {
        flex: 1;
    }

    /*#region Login */

    .loginContainer {
        display: flex;
        flex-direction: row;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
    }

    .loginSide {
        flex: .4;
        background-color: #FFFFFFaa;
        align-items: center;
        justify-content: center;
        margin-left: 5%;
    }

        .loginSide img {
            height: 800px;
        }


        .loginSide .title {
            font-family: futura_md_bt_bold;
            font-size: calc(3em + 1vmin);
            color: #0063ad;
            line-height: 1.5;
        }

        .loginSide span {
            font-family: futura_md_bt_bold;
            font-size: calc(3em + 1vmin);
            color: #0063ad;
            line-height: 1.2;
        }

        .loginSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
            margin-top: 100px;
        }

    h3 {
        font-size: calc(3em + 1vmin);
    }

    /*#endregion */

    /*#region Loja */

    .lojaContainer {
        display: flex;
        flex-direction: column;
        font-family: futura_bk_bt_book;
        background-color: #000000AA;
        height: 100%;
        margin: auto;
    }

    .lojaSide {
        display: flex;
        flex: .5;
        background-color: #FFFFFFaa;
        align-items: center;
        justify-content: center;
        margin-left: 40px;
    }

        .lojaSide img {
            height: 1200px;
        }


        .lojaSide .title {
            font-family: futura_md_bt_bold;
            font-size: calc(4em + 1vmin);
            color: #0063ad;
            line-height: 1.5;
        }

        .lojaSide span {
            font-family: futura_md_bt_bold;
            font-size: calc(4em + 1vmin);
            color: #0063ad;
            line-height: 1.2;
        }

        .lojaSide a {
            font-family: futura_md_bt_bold;
            font-size: calc(1.05em + 1vmin);
            color: #094ca0;
            margin: 10px;
            line-height: 1.2;
            margin-top: 100px;
        }

    h3 {
        font-size: calc(3em + 1vmin);
    }


    .containerProdutos {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 80px;
        padding: 60px;
    }

    .cards {
        display: flex;
        width: 100%;
        height: 100%;
        min-width: 750px;
        min-height: 1000px;
        flex-basis: calc(50% - 40px);
        justify-content: center;
        flex-direction: column;
    }

    .img-fluid {
        width: 500px !important;
    }



    h6 {
        font-size: calc(4em + 1vmin);
    }

    .card-body > a {
        border-radius: 30px;
        padding: 30px;
        font-size: 5rem !important;
        width: 40% !important;
    }

    .containerHeader {
        display: flex;
        flex-direction: row;
    }

    .containerLoja {
        display: flex;
        flex-direction: column;
    }

    .arrow-down {
        width: 0;
        height: 0;
        border-left: 150px solid transparent !important;
        border-right: 150px solid transparent !important;
        border-top: 150px solid #ffffff !important;
    }

    .arrow-down-blue {
        width: 0;
        height: 0;
        border-left: 150px solid transparent !important;
        border-right: 150px solid transparent !important;
        border-top: 150px solid #045d89 !important;
    }

    .arrow-down-white {
        width: 0;
        height: 0;
        border-left: 150px solid transparent !important;
        border-right: 150px solid transparent !important;
        border-top: 150px solid #ffffff !important;
    }

    .lojaForm {
        padding: 30px 20px;
    }


        .lojaForm > button, .lojaForm > .aBtn {
            height: 10rem;
            font-size: 5rem !important;
            width: 1200px !important;
            margin: 20px;
        }

    small {
        font-size: calc(1em + 1vmin);
    }

    /*#endregion */
}

.lojaContainer {
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}

.loginMain {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.lojaMain {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.lojaForm {
    padding: 30px 20px;
}



.lojaButtons {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    gap: 15px;
    align-items: center;
}

.btn + .btn {
    margin-left: 0px;
}
