sgi/CIDIT/css/secciones/cuestionario.css

/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 27/06/2020, 12:51:03 PM
    Author     : LCI
*/
/********** MODAL CUESTIONARIO **********/
.modalCuestionario .close{ position: absolute; top: 1.5rem; right: 1.5rem; }
.iframeCuestionario{ border:0; min-height: 600px; width: 100%; }
#iframeVideo{ width: 100%; border: 0; min-height: 600px; }
.formaVoto{ overflow: hidden; overflow-y: auto; }
#evalua{ max-height: 600px; overflow: hidden; overflow-y: auto; }
#scrollContainer { overflow: auto; position:absolute; top: 0; height: 100%; width: 100%; }
input[type="radio"] { display: none; }
.modalCuestionario .ing-finalistas, .modalCuestionario .ing-no-cargado, .modalCuestionario .ing-negar{ font-size: 150px; }
.modalCuestionario .ing-no-cargado, .modalCuestionario .ing-negar{ color: #D21034; }
.modalCuestionario .ing-finalistas{ color:#339933; }
.instrucciones{ margin: 0.5rem; color: #001D68; font-size: 1rem; font-family: 'indivisa-text-italic'; }

/********** OPCIONES **********/
section{ margin-bottom: 2rem; }
section:last-of-type { margin-bottom: 0; }
section > .fondoAnuncio{ padding: 1rem; }
section > .fondoAnuncio .ing-no-cargado{ font-size: 100px; }
section .pregError, section .pregError .ing-no-cargado{ font-size: 20px; }
@media (max-width:520px) { 
    section > .fondoAnuncio .ing-no-cargado{ font-size: 50px; }
}
h3.eval::before{ width: 40px; }
.subtituloEval{ background: url('../../img/pleca.webp'); position: relative; height: 15px; margin-top: 15px; }
.subtituloEval > h5{ background: #FFFFFF; color: #001D68; width: max-content; padding: 0 10px; margin: 0; position: absolute; top: -7px; left: 25px; }
.subtituloEval > h5 > label { margin: 0; }
.opciones, .abierta{ display: flex; flex-flow: row wrap; margin: 0.5rem; }
.opciones > div{ flex: 1; padding: 0.5rem; }
.opciones > div > label { display: flex; justify-content: center; align-items: center; height: 100%; width: 100%; border-radius: 1rem; border: 2px solid #696969;
                          color: #696969; padding: 1rem; margin: 0; position: relative; }
.opciones > div > label{ cursor: pointer; text-align: center; }
.opciones > div > input[type="radio"]:checked + label, .opciones > div > label:hover{ color: #001D68; }
.opciones > div > label:hover{ text-shadow: 0 0 1px #001D68; }
.opciones > div > input[type="radio"]:checked + label::after { position: absolute; bottom: -0.5rem; right: -0.5rem; background: #FFFFFF; border-radius: 50%; width: 34px; height: 34px; font-family: 'ingfont'; content: '\e916'; font-size: 1rem; padding: 5px; }
.opciones > div > input[type="radio"]:checked + label.op1, .opciones > div > label.op1:hover { background: #007BC4; border-color: #007BC4; }
.opciones > div > label.op1:hover { box-shadow: 0 0 5px #007BC4; }
.opciones > div > label.op1:after { color: #007BC4; border: 1px solid #007BC4; }
.opciones > div > input[type="radio"]:checked + label.op2, .opciones > div > label.op2:hover { background: #65B2E8; border-color: #65B2E8; }
.opciones > div > label.op2:hover { box-shadow: 0 0 5px #65B2E8; }
.opciones > div > label.op2:after { color: #65B2E8; border: 1px solid #65B2E8; }
.opciones > div > input[type="radio"]:checked + label.op3, .opciones > div > label.op3:hover { background: #009ED7; border-color: #009ED7; }
.opciones > div > label.op3:hover { box-shadow: 0 0 5px #009ED7; }
.opciones > div > label.op3:after { color: #009ED7; border: 1px solid #009ED7; }
.opciones > div > input[type="radio"]:checked + label.op4, .opciones > div > label.op4:hover { background: #00A6CE; border-color: #00A6CE; }
.opciones > div > label.op4:hover { box-shadow: 0 0 5px #00A6CE; }
.opciones > div > label.op4:after { color: #0091CF; border: 1px solid #00A6CE; }
.opciones > div > input[type="radio"]:checked + label.op5, .opciones > div > label.op5:hover { background: #00ADDE; border-color: #00ADDE; }
.opciones > div > label.op5:hover { box-shadow: 0 0 5px #00ADDE; }
.opciones > div > label.op5:after { color: #00A6CE; border: 1px solid #00ADDE; }
.opciones > div > input[type="radio"]:checked + label.op6, .opciones > div > label.op6:hover { background: #64BEE6; border-color: #64BEE6; }
.opciones > div > label.op6:hover { box-shadow: 0 0 5px #64BEE6; }
.opciones > div > label.op6:after { color: #64BEE6; border: 1px solid #64BEE6; }
.opciones > div > input[type="radio"]:checked + label.op7, .opciones > div > label.op7:hover { background: #8AAAC8; border-color: #8AAAC8; }
.opciones > div > label.op7:hover { box-shadow: 0 0 5px #8AAAC8; }
.opciones > div > label.op7:after { color: #8AAAC8; border: 1px solid #8AAAC8; }
.opciones > div > input[type="radio"]:checked + label.op8, .opciones > div > label.op8:hover { background: #7197BA; border-color: #7197BA; }
.opciones > div > label.op8:hover { box-shadow: 0 0 5px #7197BA; }
.opciones > div > label.op8:after { color: #7197BA; border: 1px solid #7197BA; }
.opciones > div > input[type="radio"]:checked + label.op9, .opciones > div > label.op9:hover { background: #5285B2; border-color: #5285B2; }
.opciones > div > label.op9:hover { box-shadow: 0 0 5px #5285B2; }
.opciones > div > label.op9:after { color: #5285B2; border: 1px solid #5285B2; }
.opciones > div > input[type="radio"]:checked + label.op10, .opciones > div > label.op10:hover { background: #137EA3; border-color: #137EA3; }
.opciones > div > label.op10:hover { box-shadow: 0 0 5px #137EA3; }
.opciones > div > label.op10:after { color: #137EA3; border: 1px solid #137EA3; }
.opciones > div > input[type="radio"]:checked + label.op11, .opciones > div > label.op11:hover { background: #0C7696; border-color: #0C7696; }
.opciones > div > label.op11:hover { box-shadow: 0 0 5px #0C7696; }
.opciones > div > label.op11:after { color: #0C7696; border: 1px solid #0C7696; }
.opciones > div > input[type="radio"]:checked + label.op12, .opciones > div > label.op12:hover { background: #2D549B; border-color: #2D549B; }
.opciones > div > label.op12:hover { box-shadow: 0 0 5px #2D549B; }
.opciones > div > label.op12:after { color: #2D549B; border: 1px solid #2D549B; }
.opciones > div > input[type="radio"]:checked + label.op13, .opciones > div > label.op13:hover { background: #27489B; border-color: #27489B; }
.opciones > div > label.op13:hover { box-shadow: 0 0 5px #27489B; }
.opciones > div > label.op13:after { color: #27489B; border: 1px solid #27489B; }

@media (max-width:700px) {
    .opciones { flex-flow: column wrap; }    
}
.errorLbl{ background: #D21034; color: #FFFFFF !important; border-color: #D21034 !important; }
.errorLbl:hover{ box-shadow: 0 0 5px #D21034 !important; background: #EA0029 !important; }
#errorLblEval{ font-size: 25px; }

/********** RATING **********/
.star-rating > .fieldset > label { display: flex; flex-direction: column; align-items: center; padding-left: 1vw; padding-right: 1vw; cursor: pointer; }
.star-rating > .fieldset > label > div{ font-family: 'ingfont'; }
.star-rating > .fieldset > input:checked ~ label > div{ color: #F9BF3B; }
.star-rating > .fieldset > input:checked ~ label > span{ color: #001D68; }
.star-rating > .fieldset > input:checked ~ label > div:before { content: '\e903'; }
.star-rating > .fieldset > label > div:active { position: relative; top: 2px; }
.star-rating > .fieldset:not(:checked) > label > div { font-size: 5vw; color: #969696; }
.star-rating > .fieldset:not(:checked) > label > span { font-size: 1.5vw; color: #969696; }
.star-rating > .fieldset:not(:checked) > label > div:before { content: '\e904'; }
.star-rating > .fieldset:not(:checked) > label:hover{ cursor: pointer; }
.star-rating > .fieldset:not(:checked) > label:hover > div,.star-rating > .fieldset:not(:checked) > label:hover ~ label > div { color: #F9BF3B; text-shadow: 0 0 5px #F9BF3B; }
.star-rating > .fieldset:not(:checked) > label:hover > span,.star-rating > .fieldset:not(:checked) > label:hover  ~ label > span { color: #001D68; text-shadow: 0 0 1px #001D68; }
.star-rating > .fieldset:not(:checked) > div:hover > label,.star-rating > .fieldset:not(:checked) > label:hover ~ label > div:before { content: '\e903'; }

/********** FALTANTES **********/
#faltantes > div { cursor: pointer; background: #F8D52B; padding: 0.5rem 1rem; }
#faltantes > div:hover{ opacity: 0.75; }
#faltantes > div > #msgFaltantes{ color: #42210B; font-size: 23px; font-family: 'indivisa-text-bold-italic'; }
#faltantes > div > #msgFaltantes > .num{ font-family: 'indivisa-text-black-italic'; }
#faltantes > div > .ing-importante{ font-size: 40px; color: #FFFFFF; }

/********** MODAL ALERTA **********/
#modalAlerta #listaAlerta { max-height: 400px; overflow-y: auto; }
#modalAlerta #listaAlerta > .elemento{ border-bottom: 1px solid #001D68; cursor: pointer; }
#modalAlerta #listaAlerta > .elemento:last-of-type{ border-bottom: 0; }
#modalAlerta #listaAlerta > .elemento:hover{ background: #E0E0E0; }
#modalAlerta #listaAlerta > .elemento > div:first-of-type{ font-family: 'indivisa-text-bold'; }
#loaderFaltantes { background: #FFF; }