@font-face {
  font-display: swap;
}
.p2-thumb-parent{
    aspect-ratio:800/300;
}
.p2-thumb-parent-sq{
    aspect-ratio:1;
}
.hover80:hover{
    opacity:0.8;
}
.hover-grey:hover{
    background-color:#efefef !important;
}
.fw-800{
    font-weight:800;
}
.bg-brand-primary{
    background-color:#2f5573;
}
.text-brand-primary{
    color:#2f5573;
}
.bg-brand-secondary{
    background-color:#5991bd;
}
.text-brand-secondary{
    color:#5991bd;
}
.bg-success-light{
    background-color:#e9fce1;
}
.bg-secondary-light{
    background-color:#dce0e6;
}
.bg-danger-light{
    background-color:#f8d7da;
}
.bg-warning-light{
    background-color:#fff9e6;
}
.alert-danger-dark{
    background-color:#ffa1a9;
}
.alert-success-dark{
    background-color:#8ceda3;
}
.custom-toggler.navbar-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
.custom-toggler.navbar-toggler {
  border-color: rgb(255, 255, 255);
  padding:4px 6px !important;
}
.custom-toggler.navbar-toggler:focus {
  outline-color: rgb(255, 255, 255);
}
.gradient{
    background: -moz-linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(31,174,198,1) 0%, rgba(28,79,161,1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(31,174,198,1) 0%, rgba(28,79,161,1) 100%);
    background: linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(31,174,198,1) 0%, rgba(28,79,161,1) 100%);
}
.gradient-circle{
    background: radial-gradient(circle, rgba(185,232,255,0.5) 1%, rgba(255,255,255,0) 100%);
}
.glow{
  box-shadow:
    0 0 40px #fff,            /* outer white */
    -5px 0 80px #3498DB,        /* outer left magenta */
    5px 0 80px lime;         /* outer right cyan */
}
.nowrap{
    white-space:nowrap;
}
.cursor{
    cursor:pointer;
}
.cursor-no{
    cursor: not-allowed !important;
}
.hid{
    display:none;
}
.op40{
    opacity:0.4;
}
.grecaptcha-badge{ 
    visibility: hidden;
    z-index:-2;
}

.z2{
    z-index:2;   
}
.z1{
    z-index:1;   
}
.z0{
    z-index:0;   
}
.z-1{
    z-index:-1;   
}
.z-2{
    z-index:-2 !important;   
}

.home-subtitle{
    line-height:1em !important;
    font-size:3.5vw !important;
}
.home-search-input{
    width:400px; max-width:80vw; 
    padding:0.8em 0.5em 0.8em 3em; 
    border:0; border-radius:20px; outline:none; 
    background-image:url('https://i.imgur.com/lmPgdH6.png');
    background-size:1.4em; background-position:0.75em center; background-repeat:no-repeat;
}

.btn-random{
    display:none;
}

.reply-form{
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAA30lEQVRYR+2VOwrDMAyGZQw9RycvfdDX1il7xtyvB+jcG2R2hhpKcpg4OLTEhbYEJIOhf2ZLfPl+S1Yk8FnX+dDmsDZKoN1bC5GGAOTGAoMwyDCAKWbIG0thEAbnGMCinmPp1xkYhEGGgWwWddM8lkrrYrc1l/h/sgG0rq2J1Ln3VJ425vaCzAiwuxJRNb6/nsr9EzJLwBhSFJAxCx9Lg8n/AJQwZ910B8UjlgaMJ1kkYhHAe1uTSrRmJADDou4XujiuEixqCcBvPbKJGICpYkbEXLMwCINcA9x63EGuwQEnYpG3XQSF4gAAAABJRU5ErkJggg==') top left no-repeat;
}





/* ANIMATIONS */
.bg-color-anim{
    background: -o-linear-gradient(135deg, #5991bd, #50a5bf, #4b7399, #3c99b5);
    background: linear-gradient(-45deg, #5991bd, #50a5bf, #4b7399, #3c99b5);
	background-size: 400% 400%;
	-webkit-animation: gradient 4s ease infinite;
	        animation: gradient 4s ease infinite;
}
@keyframes gradient {
	0% {background-position: 0% 50%;}
	50% {background-position: 100% 50%;}
	100% {background-position: 0% 50%;}
}



.b-circle{  position: absolute;  border-radius: 50%;  background: white;  animation: ripple 8s infinite;  box-shadow: 0px 0px 1px 0px #508fb9; z-index:0;}
.b-small{  width: 200px;  height: 200px;  left: -100px;  bottom: -100px;}
.b-medium{  width: 400px;  height: 400px;  left: -200px;  bottom: -200px;}
.b-large{  width: 600px;  height: 600px;  left: -300px;  bottom: -300px;}
.b-xlarge{  width: 800px;  height: 800px;  left: -400px;  bottom: -400px;}
.b-xxlarge{  width: 1000px;  height: 1000px;  left: -500px;  bottom: -500px;}
.b-shade1{  opacity: 0.2;}
.b-shade2{  opacity: 0.5;}
.b-shade3{  opacity: 0.7;}
.b-shade4{  opacity: 0.8;}
.b-shade5{  opacity: 0.9;}
@keyframes ripple{  0%{transform: scale(0.8);}  50%{transform: scale(1.2);}  100%{transform: scale(0.8);} }

.b-diagonal {  animation:slide 2s ease-in-out infinite alternate;  background-image: linear-gradient(-60deg, #2f5573 50%, #09f 50%); bottom:0; left:-50%; opacity:.5; position:fixed; right:-50%; top:0; z-index:-1;}
.b-diagonal2 {  animation-direction:alternate-reverse;  animation-duration:3s;}
.b-diagonal3 {  animation-duration:4s;}
@keyframes slide{  0% {transform:translateX(-25%);} 100% {transform:translateX(25%);}}

.cube {
  position: absolute;
  top: 80vh;
  left: 45vw;
  width: 10px;
  height: 10px;
  border: solid 1px #234056;
  -webkit-transform-origin: top left;
          transform-origin: top left;
  -webkit-transform: scale(0) rotate(0deg) translate(-50%, -50%);
          transform: scale(0) rotate(0deg) translate(-50%, -50%);
  -webkit-animation: cube 5s ease-in forwards infinite;
          animation: cube 5s ease-in forwards infinite;
    z-index:-1;
}
.cube:nth-child(2n) {
  border-color: #3e7097;
}
.cube:nth-child(2) {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
  left: 15vw;
  top: 40vh;
}
.cube:nth-child(3) {
  -webkit-animation-delay: 2s;
          animation-delay: 2s;
  left: 55vw;
  top: 12vh;
}
.cube:nth-child(4) {
  -webkit-animation-delay: 3s;
          animation-delay: 3s;
  left: 77vw;
  top: 10vh;
}
.cube:nth-child(5) {
  -webkit-animation-delay: 5s;
          animation-delay: 5s;
  left: 10vw;
  top: 85vh;
}
.cube:nth-child(6) {
  -webkit-animation-delay: 6s;
          animation-delay: 6s;
  left: 90vw;
  top: 20vh;
}
.cube:nth-child(7) {
  -webkit-animation-delay: 4s;
          animation-delay: 4s;
  left: 5vw;
  top: 10vh;
}
.cube:nth-child(8) {
  -webkit-animation-delay: 3s;
          animation-delay: 3s;
  left: 85vw;
  top: 25vh;
}

@-webkit-keyframes cube {
  from {
    -webkit-transform: scale(0) rotate(0deg) translate(-50%, -50%);
            transform: scale(0) rotate(0deg) translate(-50%, -50%);
    opacity: 1;
  }
  to {
    -webkit-transform: scale(20) rotate(960deg) translate(-50%, -50%);
            transform: scale(20) rotate(960deg) translate(-50%, -50%);
    opacity: 0;
  }
}

@keyframes cube {
  from {
    -webkit-transform: scale(0) rotate(0deg) translate(-50%, -50%);
            transform: scale(0) rotate(0deg) translate(-50%, -50%);
    opacity: 1;
  }
  to {
    -webkit-transform: scale(20) rotate(960deg) translate(-50%, -50%);
            transform: scale(20) rotate(960deg) translate(-50%, -50%);
    opacity: 0;
  }
}







.quiz-title{
    font-size:18px !important;
    font-weight:800 !important;
}
.ranking-item-title{
    font-size:12px !important;
}

.row-val{
    background:url('https://pregunta2.com/img/pixel.png') repeat-y;
    background-position:20px;
}
.col-val-padding{
    background:url('https://pregunta2.com/img/pixel.val.png') top repeat-x;
    margin-left:20px !important;
}
.col-val-res{
    background:url('https://pregunta2.com/img/pixel.val.png') top repeat-x;
}
.col-val-res span{
    background:#f8f9fa;
}


/* XXS -- Ultra small (smallest in Chrome Inspect preview) */
@media (min-width: 320px) {

}

/* XS -- Very small (2nd smallest in Chrome Inspect preview)  */
@media (min-width: 375px) {
    .btn-random{
        display:inline-block;
        font-size:28px;
    }
    
}

/* SM -- Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .quiz-title{
        font-size:4.8vw !important;
    }
    .ranking-item-title{
        font-size:2.4vw !important;
    }
    .home-subtitle{ 
        font-size:2.5vw !important;
    }
}


/* MD -- Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .quiz-title{
        font-size:3.4vw !important;
    }
    .ranking-item-title{
        font-size:1.7vw !important;
    }
    .home-subtitle{
        font-size:2vw !important;
    }
}


/* LG -- Large devices (desktops, 992px and up) - - - - NAV */
@media (min-width: 992px){
    .quiz-title{
        font-size:2.5rem !important;
    }
    .ranking-item-title{
        font-size:1.5vw !important;
    }
    .home-subtitle{
        font-size:1.6vw !important;
    }
}


/* XL -- Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .ranking-item-title{
        font-size:1.2vw !important;
    }
    .home-subtitle{
        font-size:1.3vw !important;
    }
}

/* XXL -- BEYOND (1200px and up) */
@media (min-width: 1200px) {
    .ranking-item-title{
        font-size:1.2rem !important;
    }
}
/* XXXL -- BEYOND (2400px and up) */
@media (min-width: 2400px) {
    .home-subtitle{
        font-size:0.8vw !important;
    }
}