@charset "utf-8";

/* CSS Document */

@font-face {
    font-family: Impact;
    src: url("../fonts/Black.ttf")
}

@font-face {
    font-family: Public;
    src: url("../fonts/Public.ttf")
}

@font-face {
    font-family: Poppins;
    src: url("../fonts/Poppins-Regular.ttf")
}


.fa-solid, .fa-brands
{
    font-size: 20px;
    padding-right: 10px;
}


/*PRINCIPALES*/
body 
{
    width: 100%;
    font-family: Public, Arial, sans-serif;
    font-family: Poppins,Arial, sans-serif;
    font-size: 13px;
    padding: 0;
    margin: 0;
    color:#328399!important;
    line-height: 28px;
    box-sizing: border-box;
    background-color: #fff;
    letter-spacing: 0.1px;
}

header 
{
    border-top:4px solid #ff373d;
    border-top:4px solid #FC6E51;
    border-top:4px solid #ff8852;
    
    /*border-bottom:1px solid #f5f5ff;*/
    height: 85px;
    line-height: 0;
}

header > div:nth-child(1)
{
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1700px;
    margin: 0 auto;
    height: 100%;
    padding: 0 15px;
}



.logo 
{
    width: 98%;
    max-width: 300px;
}

header,footer,.menu
{
    background-color: #3a5075;
    background-color: #005278;
    background-color: #124466;
    background-color: #324154;
    color: #fff;
}

.clear 
{
    clear: both;
}

section,article,#header-menu 
{
    margin: 0 auto;
    text-align: center;
}

section 
{    
    min-height: 600px;
}

article 
{
    width: 96%;
    max-width: 1200px;
    margin:0 auto;
    margin-top: 30px;
}

footer 
{
    padding: 10px 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: left;
    margin-top: 20px;
}
footer div > div
{
    padding: 5px 0;
}

footer a 
{
    color: #fff;
}



/*FIN PRINCIPALES*/

/*INICIO*/

.inicio 
{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}


.img-inicio 
{
    width:90%; 
    max-width:350px;
}

.list-informes 
{
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content:space-around;
}

.list-informes .boton 
{
    font-size: 0.9rem;
    padding: 5px;
    margin: 0 5px;
}

#informacion-inicio
{
    width: 100%;
    margin:0 auto;
    display:flex;
    justify-content: space-evenly;   
}

#informacion-inicio .material-icons-round 
{
    font-size: 40px!important;
}
#informacion-inicio div
{
    padding: 0 10px;
    box-sizing: border-box;
    max-width: 380px;
    min-height:150px; 
    line-height: 20px;
    margin-bottom: 10px;
}


.list-informes, #informacion-inicio 
{
    margin-top:30px!important;
}

/*FIN INICIO*/

/*ETIQUETAS*/

.alinear {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 10px;
}
.shadow 
{
    box-shadow: 1px 1px 4px #999;   
}

a {
    text-decoration: none;
}

h1 {
    font-weight: 100;
    color:#108cc6;
    color:#40536B;
    color:#1B768E;
    font-family: Impact;
    font-weight: 500;
    font-size: 1.9rem;
    line-height: 35px;
    padding-bottom: 1px;
    margin: 0;
}

h2 
{
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
}

h3 
{
    font-size: 14px;
    font-weight: 300;
    color:#09d;
}

i 
{
    font-size: 0.7rem;
    line-height: 0.7rem;
}

.box 
{
    width: 96%;
    margin: 0 auto;
    background-color: #FFF2F2;
    border: 1px #ddd solid;
    border-radius: 5px;
    padding: 8px;
    
}

.sabiasque 
{
    font-size: 0.8rem;
    line-height: 1rem;
    max-width: 350px;
    color: #35AA53;
}

.material-icons-round 
{
    font-size: 25px!important;
    color: #ddd;
}

.icono
{
    font-size: 35px!important;
    background-color: #FFF2F2;
    padding: 8px!important;
    border: 1px #ddd solid;
    border-radius: 45%;
}

.icono2 
{
    font-size: 2rem;
    border:1px #328399 solid;
    border-radius:5px;
    padding:5px;
    color: #328399;
}

.iconito 
{
    font-size: 22px!important;
    padding-bottom: 3px;
}

#img-formas-pago img
{
    width: 98%;
    max-width: 550px;
    margin: 0 auto;
    box-sizing: border-box;
}

.mensaje {
    box-sizing: border-box;
    flex-wrap: nowrap;
    width: 100%;
    max-width: 340px;
    min-height: 120px;
    margin: 0 auto;
    text-align: left;
    
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    
    padding: 15px;
    box-sizing: border-box;
    border: #ddd 1px solid;
    border-radius: 5px;
    line-height: 15px;
    font-size: 0.9rem;
}

.msg-verde 
{
    border-left: 12px #35aa53 solid;
}

.padding-h
{
    padding: 0 30px;
}


/*FIN ETIQUETAS*/

.datodolar 
{
    width: 96%;
    max-width: 400px;
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 25px;
    border:1px #ddd solid;
    border-radius: 5px;
    background-color: #f8f8f8;
    padding: 5px;
    font-size: 1rem;
}

.datodolar th 
{
    color: #fff;
    border-radius: 5px;
    padding: 5px 0;
    background-color: #35AA53;
    font-size: 1em;
    font-weight: 300;
}

.datodolar td 
{
    font-weight: bold;
    padding: 5px 0;
}

.dolar 
{
    font-weight: 200;
}


/*TAMAÑO*/

.f-18
{
    font-size:18px;
}

.face-contact a:hover
{
    color:#35aa53;
}

#secciones {
    text-align: left;
    width: 98%;
    max-width: 750px;
    margin: 0 auto;
    box-sizing: border-box;
}


.datodolar 
{
    width: 96%;
    max-width: 400px;
    margin: 0 auto;
    margin-bottom: 20px;
    border:1px #ddd solid;
    padding: 5px;
    border-radius: 8px;
    background-color: #FFF2F2;
}

.datodolar th 
{
    color: #fff;
    border-radius: 5px;
}

.datodolar td 
{
    font-weight: bold;
}

.dolar {
    font-size: 12px;
    font-weight: 200;
}

#notas 
{
    width: 96%;
    max-width: 800px;
    margin:0 auto;
    box-sizing: border-box;
    text-align: left;
}

#notas h3
{
    font-weight: 600;
    font-size: 20px;
}

@media only screen and (max-width:780px) 
{
    .inicio 
    {
        flex-direction: column;
    }

    h1 
    {
        font-size: 26px;
    }


    .list-informes 
    {
        width: 96%;
        margin: 0 auto;
        flex-direction: column;
        align-items: center;
        box-sizing: border-box;
    }

    .list-informes .boton
    {
        width: 180px;
        margin-bottom: 8px;
    }

 
    #informacion-inicio 
    {
        flex-direction: column;
    }

    .msg-verde 
    {
        border-left: 1px #ddd solid;
        border-top: 12px #35aa53 solid;
    }
    

    #mail-header 
    {
        display: none;
    }

    #secciones {
        padding: 0 20px;
    }

}


/*COLORES*/
/*
#FB9833
#FCEFEF
#1B768E
#012538
#4D555B

*/

.azul 
{
    /*color: #1790C5;*/
    color:#108cc6;
    --color-azul: #198CC6;
    color: #1B768E;
}

.azul2 
{
    color:#328399!important;
}
.rojo 
{
    /*color:#eb5029;*/
    color:#FC6E51;
    color: #E6686A;
}

.verde 
{
    color: #35aa53; 
}

.naranja 
{
    color: #fd7e14;
}

.blanco 
{
    color:#fff;
}

.gris 
{
    color:#777;
}

.bg-azul 
{
    background-color: #1B768E;
}
.bg-rojo 
{
    background-color:#eb5029;
}

.bg-verde 
{
    background-color: #35aa53!important;
}

.amarillo 
{
    color: #ffd202;
}
/*FIN COLORES*/