/* -------------------------------------------------------------------------*/
/* -------------------------------------------------------------------------*/
/* ------------------------   ESTILOS GLOBALES    --------------------------*/
/* -------------------------------------------------------------------------*/
/* -------------------------------------------------------------------------*/

:root {/* LLAMADAS DE LA WEB */
/* Paleta de colores de esta web */
    --primario: #545249;
    --secundario: #f5cf05;
    --Blanco: #FFF;
    --Negro: #000;
/* Tipografias de esta web */
    --fuenteTextos: "Lato", sans-serif;
}


body {/*DECORACIÓN BASE*/
    background-color: var(--primario);/*color de fondo*/
    font-family: var(--fuenteTextos);/*tipografia de los textos de base*/
    line-height: 1.6;/*gran interlineado de los textos en general*/
    text-align: justify;/*todos los textos justificados (a menos qe se indique lo contrario)*/
}

/* COLOR DE LETRA Y FONDO PA CUANDO SE SEÑALE EL TEXTO*/
::-moz-selection {background: var(--Blanco); color: var(--primario); text-shadow: none}
::selection {background: var(--Blanco); color: var(--primario); text-shadow: none}

/*CLASES PARA RECURRIR EL HTML*/
.contenedor {/*Contenedor de esta web*/
    max-width: 120rem;/*1.200px de ancho*/
    width: 100%;/*ESTO FUERZA LA ANCHURA EN CONFLICTOS CON DISPLAY:FLEX*/
    margin: 0 auto;/*centrada*/
    padding: 0 2rem; /*y con padding a los lados pal movil*/
    /*background-color: rgba(0, 111, 255, 0.4);*/
}


/*ESTILO DE LOS BOTONES DE LA WEB*/

 /*1º estructura del botón <a>*/
 .boton {font-weight: 500; text-align: center; padding: 1rem 3rem; border-radius: 10px;
 transition: background 0.5s ease}

    .btn-azul {background: #2899f1}
    .btn-azul:hover {background: #b6dfff}
    .btn-azul.boton {color: var(--Blanco)}

    /*3º que el botón ocupe el 100%*/
    .btn-100 {display: block; width: 100%}

    /*3º o alinear botón al centro o la derecha (.boton debe estar envuelto por este <div>)*/
    .padre-btn-centro {display: flex; justify-content: center}
    .padre-btn-derecha {display: flex; justify-content: flex-end}

/*4º en movil los botones se ponen al 100%*/
@media (max-width: 600px) {.boton {display: block; width: 100%}}


/*TODOS LOS ELEMENTOS QE LES HAGAN "HOVER" LO HACEN DESPACIO */
.transicion {transition: all 0.3s ease}

















/* -------------------------------------------------------------------------*/
/* -------------------------------------------------------------------------*/
/* -----------------------------   TODO    ---------------------------------*/
/* -------------------------------------------------------------------------*/
/* -------------------------------------------------------------------------*/
.contenedor {min-height: 100vh; display: flex; flex-direction: column; justify-content: space-between; align-items: center}
.centro {margin: auto 0; transform: translateY(-30px)}

.centro * {color: var(--Blanco); text-align: center}

.logokiras h1 {font-size: 5rem; font-weight: 400; margin-bottom: -2.3rem}
.logokiras h2 {font-size: 1.7rem; font-weight: 300; margin-bottom: 2rem; margin-left: 3px}

.centro p {font-size: 2.2rem; font-weight: 300; line-height: 1.3}














/* -------------------------------------------------------------------------*/
/* -------------------------------------------------------------------------*/
/* --------------------------   PIE DE PÁGINA    ---------------------------*/
/* -------------------------------------------------------------------------*/
/* -------------------------------------------------------------------------*/
.pie {background-color: black; padding: 3rem 0}
.pie p {color: var(--Blanco); font-weight: 200; font-size: 1.8rem; text-align: center}