:root {
    --TEXT: rgb(121,134,140);
    --SECONDARY-TEXT: rgb(203,216,222);
    --MAIN: rgb(0,75,133);
    --SECONDARY: rgb(219,230,234);
    --HOVER: rgb(240,244,247);
    --TITLE: rgb(62,180,226);
    --HOVER-SECONDARY:rgb(0,112,202);
}

@font-face {
    font-family: 'newake-font-regular';
    src: url('../fonts/newake-font-regular.otf') format('opentype');
}

@font-face {
    font-family: 'visbycf-regular';
    src: url('../fonts/visbycf-regular.otf') format('opentype');
}

@font-face {
    font-family: 'visbycf-light';
    src: url('../fonts/visbycf-light.otf') format('opentype');
}


span.validationStyle {
    color: rgb(229,0,0);
    display: flex; 
    align-items:center;
    padding-left:23px;
    font: 600 10pt 'visbycf-light';
    text-transform: capitalize;
    animation: prueba 0.75s ease-in;
    background: url('../images/validation/error.png') no-repeat center left;
    height:32px;
}

@keyframes prueba{
    from{
        opacity:0;
    }
    to{
        opacity:1;
    }
}

.main-container{
    height:100%;
    background: url("../images/fondop.png") no-repeat;
    background-size:100%;
}


    .main-container header{
        background: url("../images/fondoc.png") no-repeat;
        background-size:100% 100%;
        padding:15px!important;
        display:flex;
        align-items:center;
        justify-content:center;
        box-shadow:0px 0px 15px 5px silver;
        height:135px;
    }


    .main-container header img {
        display: block;
        width: 695px;
    }




.main-container footer {
    background: url("../images/pie.png") no-repeat;
    background-position: bottom center;
    background-size: 175px auto;
    width: 65%;
    display: flex;
    flex-wrap: wrap;
    margin: auto !important;
    padding: 25px !important;
    box-shadow: 0 -11px 11px -11px silver;
}



.main-container footer > div:nth-child(1) img {
        display: block;
        width: 24px;
        height: 24px;
        margin: 5px !important;
    }

    .main-container footer > div:nth-child(2) img {
        display: block;
        width: 67px;
    }

    .main-container footer > div:nth-child(1) {
        display: flex;
        align-items: center;
        flex-wrap:wrap;
        justify-content: flex-start;
    }

        .main-container footer > div:nth-child(1) > div {
            flex-basis: 100%;
            display: flex;
            align-items: center;
            font: 600 11pt 'visbycf-regular'!important;
            color: var(--SECONDARY-TEXT);
        }

            .main-container footer > div:nth-child(1) > div img{
                width:19px!important;
                height:19px!important;
            }

            .main-container footer > div:nth-child(2) {
                display: flex;
                align-items: center;
                justify-content: flex-end;
            }

    .main-container footer > div{
        width:50%;
    }



    @media screen and (min-width:240px) and (max-width: 1023px) and (orientation:portrait) {
        .main-container header img {
        width:355px!important;
    }

    .main-container header{
        height:79px!important;
    }

}

@media screen and (min-width:240px) and (max-width: 1023px) and (orientation:landscape) {
    .main-container header img {
        width: 495px !important;
    }

    .main-container header {
        height: 91px !important;
    }

}
#page-container {
    position: relative !important;
    min-height: 100vh !important;
}
#content-wrap {
    padding-bottom: 2.5rem !important; /* Footer height */
}
.hhh {
    font: 30pt 'newake-font-regular';
    color: black;
    text-align: center;
    margin-bottom: 35px !important;
}
.hhhf {
    font: 28pt 'newake-font-regular';
    color: #0165E1;
    text-align: center;
    margin-bottom: 35px !important;
}
.hhhi {
    font: 28pt 'newake-font-regular';
    color: #E1306C;
    text-align: center;
    margin-bottom: 35px !important;
}
.hhht {
    font: 28pt 'newake-font-regular';
    color: #1DA1F2;
    text-align: center;
    margin-bottom: 35px !important;
}