﻿.contenedorPrincipal {
    width: 100%;
}

.panelLogin,
.panelServicio {
    padding: 0.8em 1.2em;
}

    .panelLogin .gn-panel-heading h2.gn-panel-title,
    .panelServicio .gn-panel-heading h2.gn-panel-title {
        font-size: 150%;
    }

.cuadroConImagen {
    display: inline-block;
    margin-bottom: 30px;
}

    .cuadroConImagen img {
        display: inline-block;
        width: 15%;
        margin-right: 12px;
    }

    .cuadroConImagen div {
        display: inline-block;
        width: 79%;
    }

.panelBoton {
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-end;
    align-items: center;
    margin-top: 1em;
    text-align: end;
}

    .panelBoton .gn-btn-outline,
    .panelBoton .gn-btn-solid {
        margin: 1em 0 0 1em;
    }

    .panelBoton .gn-btn-solid {
        width: 15em;
        height: 3em;
    }

    .panelBoton.accionesSolicitudDatosInicioSesion {
        display: flex;
        justify-content: space-between;
    }

        .panelBoton.accionesSolicitudDatosInicioSesion .gn-btn-solid,
        .panelBoton.accionesSolicitudDatosInicioSesion .gn-btn-outline {
            height: 3em;
            display: flex;
            justify-content: center;
            align-items: center;
        }

.panelSimple {
    background-color: white;
    border: 0;
    border-radius: 5px;
}

.formulario div {
    padding: 5px;
}

.formulario input {
    padding: 5px;
}

.exito {
    color: #5cb85c;
}

    .exito .glyphicon {
        margin-right: 10px;
    }

.panelBoton.navegacion {
    margin: 5em 0 0 0;
    display: flex;
    justify-content: space-between;
}

    .panelBoton.navegacion .gn-btn-outline:first-of-type {
        margin-left: 0;
    }

#panelRecuperarDatos {
    margin: 0;
    position: absolute;
    left: 50%;
    top: 40%;
    transform: translate(-50%, -50%);
    width: 95%;
    max-width: 60em;
}

    #panelRecuperarDatos .gn-panel-title {
        font-size: large;
    }

#panelBotonRecuperarDatos {
    display: flex;
    justify-content: flex-end;
}

    #panelBotonRecuperarDatos .btn {
        min-width: 50%;
    }

#contenido p {
    text-align: justify;
}

/* ORDENADOR */
@media (min-width: 992px) {

    .panelServicio {
        margin-top: 150px;
        margin-right: 20%;
    }

    .panelLogin {
        margin-top: 150px;
        margin-left: 20%;
    }

    .panelSimple {
        padding: 20px;
        margin-top: 40px;
        margin-left: 25%;
        width: 50%;
        margin-bottom: 50px;
    }
}

/*  TABLET */
@media (min-width: 425px) and (max-width: 991px) {

    .panelServicio {
        padding: 3px 20px 15px 20px;
        margin: 20px 5%;
    }

    .panelLogin {
        padding: 3px 25px 20px 25px;
        margin: 20px 10%;
    }

    .panelSimple {
        padding: 20px;
        margin: 10%;
        width: 80%;
    }

    #panelBotonRecuperarDatos .btn {
        width: 100%;
    }
}

/* MÓVIL */
@media (max-width: 425px) {

    #panelBotonRecuperarDatos {
        justify-content: center;
    }

    .form-control {
        font-size: 1.25em !important;
    }

    .panelServicio {
        padding: 15px;
        margin: 0;
    }

    .panelLogin {
        padding: 15px;
        margin: 40% 0 10% 0;
    }

    .panelSimple {
        padding: 10px;
        margin: 2%;
    }

        .panelSimple h1,
        .panelSimple h2 {
            font-size: 140%;
            text-align: center;
        }

    .panelBoton {
        margin: 0;
    }

    .btn {
        padding: 5%;
        font-size: 1.1em !important;
    }

    .panelLogin .panelBoton {
        margin: 2em 0 0 0;
    }

        .panelLogin .panelBoton .btn {
            width: 90%;
        }

    .panelServicio .panelBoton {
        margin: 2em 0 0 0;
        display: flex;
        flex-direction: row;
        justify-content: space-around;
    }
}
