@charset "utf-8";

html{height:100%;width:100%;margin:0;padding:0;box-sizing: border-box !important;}
*{margin:0;padding:0;box-sizing: inherit !important;}
*:before, *:after {box-sizing: inherit !important;}
body{background:#313131;color:#1f385d;height:100%;width:100%; font-family:'Lato', sans-serif!important; letter-spacing:-.3px}
h1, h2, h3{font-family: 'Lato', sans-serif; font-weight: 300; font-size: 26px; letter-spacing: -.3px}
#formulario form, #formulario h1, #formulario p{color:#1f385d;}
.demo_container{margin:0 auto;max-width:960px;padding-bottom:30px;}
.demo_block{display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;font-family:'Lato', sans-serif!important;font-size:14px;width:100%;position:relative;margin:0 auto;height:300px;background:#f6f6f6;margin-bottom:50px;}
.upper{text-transform: uppercase; font-size:.9em; width:90%; margin:0 auto;}

/* progress bar */
#quiz_progress_outer{position:relative;height:6px;width:100%;border:none;background:#eee;z-index:2;}
#quiz_progress_inner{height:8px;background:#bf5b44;width:0px;}

#openingText{border-radius:11px; -webkit-border-radius:11px; -moz-border-radius: 11px; padding:20px 0; color:#fff!important; text-align: center;}
#openingText h1{border-top: 1px solid #cccccc82;
    padding-top: 25px;}
#element8 h1, #element8 p{color:#fff!important}
#element7 img{ display: block; margin:0 auto}
#col1_1, #col2_1, #col3_1, #col4_1, #col5_1, #col6_1, #col7_1, #col8_1, #col9_1, #col10_1, #col11_1, #col12_1, #col13_1, #col14_1, #col15_1, #col16_1, #col17_1, #col18_1, #col19_1, #col20_1, #col21_1, #col22_1, #col23_1, #col24_1, #col25_1, #col26_1, #col27_1, #col28_1, #col29_1, #col30_1, #col31_1, #col32_1, #col33_1, #col34_1, #col35_1, #col36_1, #col37_1, #col38_1, #col39_1, #col40_1, #col41_1, #col42_1, #col43_1, #col44_1, #col45_1, #col46_1, #col47_1, #col48_1, #col49_1, #col50_1, #col51_1, #col52_1, #col53_1, #col54_1, #col55_1, #col56_1, #col57_1, #col58_1, #col59_1, #col60_1, #col61_1, #col62_1, #col63_1, #col64_1, #col65_1, #col66_1, #col67_1, #col68_1{padding:10px 20px 20px 20px; border-radius: 6px; background:#e2e6ea; border:6px solid #fff}
#element8{text-align: center; }
#element9{float:left; width:100%!important; text-align: center}
#quiz_container div{overflow:hidden}
#quiz_container em{color: #1e385d; font-style: normal; font-size: 1.3em; letter-spacing: -.1px; text-align: justify; margin: 10px 0; float: left;}
#logobottom{display:block; width:320px; margin:30px auto; }
#logobottomtwo{position: absolute; top: 30px; width:280px; margin: 0 50%;  left: -140px;}
.logobottom{display:block; width:320px; margin:30px auto; }
#logobottom img{width:97%; margin: 30px 0;}
#timerRow{top:350px!important}
.seleB{background: #eeeeee; border: 1px solid #ccc; width: 100%; float: left; height: 44px;  border-radius: 5px; padding: 0 0 0 10px; margin-bottom: 19px;}


/* quiz_container and descendants */
#quiz_container{margin:0 auto;font-family:'Lato', sans-serif!important;font-size:14px;padding:0px;padding-bottom:30px;text-align:left;position:relative;min-height:680px;width:100%;overflow:hidden;color:#111;margin-bottom:50px;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;}

#quiz_container button{background:#bf5b44;font-size:16px; text-transform: uppercase; font-weight:normal;color:#fff;padding:11px 15px 11px 15px; border:2px solid #fff;-webkit-appearance:none;border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px; font-family:'Lato', sans-serif!important;outline:none; }
#quiz_container .btnOver button{background:#5281b3;color:#fff;border:1apx solid #fff;}

#quiz_container img{max-width:100%;height:auto;} 
#quiz_container div, p, a, li, td, input{ -webkit-text-size-adjust:none; outline:none;}
#quiz_container p{font-size:14px;line-height:24px;}
#quiz_container p:last-child{margin-bottom:0px;}
.resetbtn{background: none!important;
    float: right!important;
    border: none!important;
    color:#1f385d!important;
    font-size:.9em!important;
    margin: 0!important;
    padding: 0px!important;
    width: 100%!important;
    text-align: right!important;
}

#quiz_container .cover{
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#quiz_container .timerContainer{}
#quiz_container .timer{background:transparent none no-repeat 0px 0px;display:none;position:relative !important;zoom:.4;-moz-transform: scale(.4);-moz-transform-origin: top center; margin: 0px auto; width: 250px; display: block;}

#quiz_container .timeoutContainer{position:absolute;top:0px;width:100%;height:100%;} /* allows for vertical alignment */
#quiz_container .scoreContainer{position:absolute;top:0px;width:100%;height:100%;} /* allows for vertical alignment */

#quiz_container .p_16{font-size:14px; line-height:24px; font-weight: 200; font-family:lato;}
#quiz_container .p_24{font-size:22px;line-height:32px; color:#1f385d; text-align: justify}
#quiz_container .p_30{font-size:30px;line-height:40px; text-align: justify}
#quiz_container .p_32{font-size:32px;line-height:42px; text-align: justify}
#quiz_container .p_42{font-size:26px;line-height:36px; color: #fff; text-transform: uppercase;}

#quiz_container .optionBox{background:#5281b3;padding:8px 30px 8px 35px; border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; border: 0px solid #bf5b44;border:2px solid #fff; outline:none; margin:0 13px 0 4px; text-align: center;}
#quiz_container .optionBox p{font-size:12px; color:#fff; text-transform: uppercase;}
#quiz_container .optionOver{background:#bf5b44;}
#quiz_container .optionOver p{color:#fff;}

#quiz_container .radioBtn{width:16px;height:16px;background:#fff;border:1px solid #1f385d;border-radius:100%; display: none}
#quiz_container .radioBtn.selected{background:#1f385d;border:1px solid #1f385d;box-shadow:inset 0 0 0 3px #fff;}

#quiz_container .checkbox > .radioBtn{width:16px;height:16px;background:#fff;border:1px solid #1f385d;border-radius:0px;box-shadow:none;}
#quiz_container .checkbox > .radioBtn.selected{background:#fff;}
#quiz_container .checkbox > .radioBtn.selected:before {
font-family: "Material Icons"; 
font-size: 18px;
line-height:28px;
content: "\E5CD";
color: #4b4b40;
position: absolute;
top: -2px;
left: -2px;
}

#quiz_container .tick{color:#e2b757;}
#quiz_container .indicate_correct{color:#5dbe84;}
#quiz_container .img-border img{border:5px solid #f6f6f6;}

#quiz_container .imgOver img{
  border:5px solid #f6f6f6;
  -webkit-transition: -webkit-transform 0.5s ease;
  -moz-transition: -moz-transform 0.5s ease;
  transition: transform 0.5s ease;
  -webkit-transform: scale(1.15);
  -moz-transform: scale(1.15);
  -o-transform: scale(1.15);
  transform: scale(1.15);
  outline:none;
}

#quiz_container .imgOut img{
  border:5px solid #f6f6f6;
  -webkit-transition: -webkit-transform 0.5s ease;
  -moz-transition: -moz-transform 0.5s ease;
  transition: transform 0.5s ease;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

#quiz_container .vertical-align {
  position: relative !important;
  top:35% !important;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

#quiz_container .col1{margin-top:140px; padding:10px 20px 20px 20px; border-radius: 6px; background:#e2e6ea; border:6px solid #fff}
#quiz_container .col2{margin-top:15px;}
#failimage{margin-top: 80px}

@media (max-width: 992px) {
#quiz_container{margin:0 auto;font-family:'Lato', sans-serif!important;font-size:14px;padding:0px;padding-bottom:30px;text-align:left;position:relative;min-height:680px;width:90%;overflow:auto;;color:#111;margin-bottom:50px;}
#quiz_container .optionBox{width:100%!important; margin-bottom: 5px}
#openingText{margin-top: 20px!important}
#quiz_container .col1{margin-top:130px;} /* moves the question allowing space for the timer */
#quiz_container .col2{margin-top:40px;} /* moves the question allowing space for the timer */
#quiz_container .timerRow{width:100%;}
#quiz_container .timerContainer{text-align: center;width:100%;}
#quiz_container .timer {margin-top:40px;zoom:0.35;-moz-transform: scale(0.35);-moz-transform-origin: top center;}
#quiz_container .p_16{width:94%; margin:0 auto; font-size:.9em}
#element7{padding-bottom:10px}
#logobottomtwo{left:-120px!important;}
#openingText{width:100%!important; left:0%!important}
#openingText h1{font-size: 1.2em; margin-top:20px!important}

#quiz_container .p_16{font-size:14px; text-align: justify}
#quiz_container .p_24{font-size:19px;}
#quiz_container .p_30{font-size:30px;}
#quiz_container .p_32{font-size:32px;}
#quiz_container .p_42{font-size:26px;}

#openingText .p_16{text-align: center!important;}
}

/* preloader */
.preloader{
    width:34px;
    height:34px;
    display:inline-block;
    padding:0px;
    border-radius:100%;
    border:2px solid;
    border-top-color:rgba(0,0,0, 0.8);
    border-bottom-color:rgba(0,0,0, 0.2);
    border-left-color:rgba(0,0,0, 0.8);
    border-right-color:rgba(0,0,0, 0.2);
    outline: 1px solid transparent;

    -webkit-animation: preloader 1s linear infinite;
    animation: preloader 1s linear infinite;
}
@keyframes preloader{
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}
@-webkit-keyframes preloader{
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}