@charset "UTF-8";

/* Parámetros Generales*/

html {
    font-family: Tahoma, Verdana, sans-serif;
}

body {
    background-color: #Ffff;
    margin: 0 auto;
    padding: 0px 0px 0px 0px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #1b7bc4;
}

a {

    text-decoration: none;
    transition: color 0.3s ease;
}



/* Parámetros para móviles*/

.movil {
    display: none;

    h1 {
        font-size: 4em;
        margin: 15px 10px 15px 10px;
    }

    h2 {
        font-size: 3.75em;
        margin: 15px 10px 15px 10px;
    }

    h3 {
        font-size: 3.5em;
        margin: 15px 10px 15px 10px;
    }

    h4 {
        font-size: 3.25em;
        margin: 15px 10px 15px 10px;
    }

    h5 {
        font-size: 3em;
        margin: 15px 10px 15px 10px;
    }

    h6 {
        font-size: 2.75em;
        margin: 15px 10px 15px 10px;
    }


    p {
        font-family: Tahoma, Verdana, sans-serif;
        font-size: 2.3em;
    }

    #div-inicio {
        width: 96%;
        height: 100%;
        margin-left: auto;
        margin-right: auto;
        border: 2px solid rgb(0, 54, 125);
        border-radius: 22px;
        background-color: #fff;
        padding: 10px 10px 10px 10px;
    }

}


/* Parámetros para NO móviles*/

.no-movil {
    display: block;

    h1 {
        font-size: 1.75em;
        margin: 5px 0px 5px 0px;
    }

    h2 {
        font-size: 1.5em;
        margin: 5px 0px 5px 0px;
    }

    h3 {
        font-size: 1.25em;
        margin: 5px 0px 5px 0px;
    }

    h4 {
        font-size: 1em;
        margin: 5px 0px 5px 0px;
    }

    h5 {
        font-size: 0.75em;
        margin: 5px 0px 5px 0px;
    }

    h6 {
        font-size: 0.5em;
        margin: 5px 0px 5px 0px;
    }


    p {
        font-family: Tahoma, Verdana, sans-serif;
        font-size: 1em;
    }

    .button_slide {
        color: #FfffFF;
        border: 2px solid rgb(0, 180, 255);
        border-radius: 5px;
        padding: 5px 7px;
        display: inline-block;
        font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif;
        font-size: 0.7em;
        font-weight: 200;
        letter-spacing: 1px;
        cursor: pointer;
        background-color: #00b4ff;
        box-shadow: inset 0 0 0 0 #00b4ff;
        -webkit-transition: ease-out 0.4s;
        -moz-transition: ease-out 0.4s;
        transition: ease-out 0.4s;
    }

    .slide_down:hover {
        box-shadow: inset 0 100px 0 0 #000000;
    }

    .slide_right:hover {
        box-shadow: inset 400px 0 0 0 #000000;
    }

    .slide_left:hover {
        box-shadow: inset 0 0 0 50px #000000;
    }

    .slide_diagonal:hover {
        box-shadow: inset 400px 50px 0 0 #000000;
    }

    #outer {
        width: 400px;
        margin: 50px auto 0 auto;
        text-align: center;
    }

    #div-inicio {
        width: 100%;
        height: 100%;
        margin-left: auto;
        margin-right: auto;
        border: 0px solid rgb(0, 54, 125);
        border-radius: 6px;
        background-color: #fff;
        padding: 1px 1px 1px 1px;
    }


}


/* Pantallas pequeñas: móviles */
@media (max-width: 1080px) {
    .movil {
        display: block;
    }

    .no-movil {
        display: none;
    }
}


/* Parámetros por definir categoria: Generales - Móviles - NO Móviles*/

p.xxsmall {
    font-size: 35%;
    margin: 5px 10px 5px 10px;
}

p.xsmall {
    font-size: 45%;
    margin: 5px 10px 5px 10px;
}

p.small {
    font-size: 55%;
    margin: 5px 10px 5px 10px;
}

p.normall {
    font-size: 65%;
    margin: 5px 10px 5px 10px;
}

p.xxsmallblack {
    font-size: 35%;
    margin: 5px 10px 5px 10px;
    font-weight: 500;
}

p.xsmallblack {
    font-size: 45%;
    margin: 5px 10px 5px 10px;
    font-weight: 500;
}

p.smallblack {
    font-size: 55%;
    margin: 5px 10px 5px 10px;
    font-weight: 500;
}

p.normallblack {
    font-size: 65%;
    margin: 5px 10px 5px 10px;
    font-weight: 500;
}


/*DIVs-----------------------------------------------------*/

.div-azul {
    background-color: #00367d;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.div-blue {
    background-color: #010f20;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.div-negro {
    background-color: #000000;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.div-blanco {
    color: #000000;
    background-color: #fff;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.div-claro {
    background-color: #ebebeb;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}


.button_slide {
    color: #FfffFF;
    border: 2px solid rgb(0, 180, 255);
    border-radius: 7px;
    padding: 18px 36px;
    display: inline-block;
    font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif;
    font-size: 2.3em;
    font-weight: 500;
    letter-spacing: 1px;
    cursor: pointer;
    background-color: #00b4ff;
    box-shadow: inset 0 0 0 0 #00b4ff;
    -webkit-transition: ease-out 0.4s;
    -moz-transition: ease-out 0.4s;
    transition: ease-out 0.4s;
}


.slide_down:hover {
    box-shadow: inset 0 100px 0 0 #000000;
}

.slide_right:hover {
    box-shadow: inset 400px 0 0 0 #000000;
}

.slide_left:hover {
    box-shadow: inset 0 0 0 50px #000000;
}

.slide_diagonal:hover {
    box-shadow: inset 400px 50px 0 0 #000000;
}

#outer {
    width: 400px;
    margin: 50px auto 0 auto;
    text-align: center;
}