.completar select.error {
    border-color: red;
}

.completar span.error{
    background-color: red;
}

.completar .custom-select-option.correct-answer,
.completar .custom-select-option.correct-answer.has-focus,
.completar .custom-select-option.correct-answer.is-selected {
    background-color: #006D24;
    color: #ffffff;
}.concentrese .card {
	width: 100%;
	height: 200px;
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	-ms-perspective: 1000px;
	perspective: 1000px;
	border-radius: 12px 12px 2px 12px;
}

.concentrese .card-inner {
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	-webkit-transition: transform 0.6s;
	-o-transition: transform 0.6s;
	transition: transform 0.6s;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	border-radius: 8px;
}

.concentrese .card-front,.card-back {
	position: absolute;
	width: 100%;
	height: 100%;
	backface-visibility: hidden;
}

.concentrese .card-front {
	background-color: #2980b9;
    border-radius: 8px;
    -webkit-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
    -webkit-background-size: cover !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
}

.concentrese .card-back {
	-webkit-background-size: cover !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-color: #f4d963;
    color: #666;
    border-radius: 8px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 32px;
}

.concentrese .activar-card,.mostrar-card {
	-webkit-transform: rotateY(180deg);
	-ms-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}


.concentrese .font-blanco {
    color: black;

}.parejas .card {
  border: 3px solid #ffe25e;
  background-color: #ffe25e;
  border-radius: 8px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 230px;
  position: relative;
  cursor: pointer;
  line-height: 32px;
  -webkit-box-shadow: 0px 2px 9px 5px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 2px 9px 5px rgba(0, 0, 0, 0.2);
}

.parejas .card:before {
  content: '';
  position: absolute;
  border-radius: 50%;
  width: 26px;
  height: 26px;
  background-color: #fff;
  top: calc(50% - (26px / 2));
}

.parejas .card:after {
  content: '';
  position: absolute;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  background-color: #ffe25e;
  top: calc(50% - (14px / 2));
}

.parejas .right-cards .card:before {
  left: -13px;
}

.parejas .right-cards .card:after {
  left: -7px;
}

.parejas .left-cards .card:before {
  right: -13px;
}

.parejas .left-cards .card:after {
  right: -7px;
}

.parejas .card.is-valid {
  border-color: #70e50a;
}

.parejas .card.is-invalid {
  border-color: #ff7676;
}

.parejas .card.is-select {
  background-color: seagreen;
  color: white;
}

.text-game {
  border-radius: 6px;
  background-color: #00bead;
  line-height: 30px;
}
.preguntas .question-text {
  position: relative;
  border: 2px solid #fff;
  border-radius: 0 0 0 25px;
  margin: 1.5rem 0 4.5rem;
}

.preguntas .text-game .question-text {
  border-color: #83dfd7;
  background-color: #009b91;
}

.preguntas .question-text:before,
.preguntas .question-text:after {
  position: absolute;
  content: '';
  background-repeat: no-repeat !important;
  background-position: center center !important;
  -webkit-background-size: 100% 100% !important;
  background-size: 100% 100% !important;
  width: 50px;
  height: 36px;
}

.preguntas .question-text:not(.main) .count,
.preguntas .question-text:not(.main) .triangulo {
  display: none;
}

.preguntas .question-text.main .count {
  position: absolute;
  right: 0;
  top: -40px;
}

.preguntas .question-text.main .triangulo {
  position: absolute;
  border-left: 50px solid #fff;
  border-top: 50px solid transparent;
  border-bottom: 50px solid transparent;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  bottom: -2.15rem;
  right: -0.5rem;
}

.preguntas input[type='radio'],
.preguntas input[type='checkbox'] {
  display: none;
}

.preguntas .alert {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.preguntas ul {
  list-style: none;
  counter-reset: letras;
  margin: 0;
  padding: 0;
}

.preguntas ul > li {
  counter-increment: letras;
  position: relative;
}

.preguntas ul > li + li {
  margin-top: 2.5rem;
}

.preguntas ul.help {
  list-style: none;
  text-align: left;
}

.preguntas ul.help > li:before {
  content: '✓';
  margin-right: 20px;
}

.preguntas ul.help > li + li {
  margin-top: 10px;
}

.preguntas ul > li label span {
  position: relative;
}

.preguntas ul > li label span:before {
  content: counter(letras, upper-alpha) '.';
  position: absolute;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  padding: 0;
  font-weight: 700;
  align-items: center;
  justify-content: center;
  left: -35px;
  z-index: 66;
  top: -4px;
  font-size: 16px;
}

.preguntas label {
  display: block;
  position: relative;
  background-color: #eef2f9;
  border-radius: 0 0 0 25px;
  cursor: pointer;
  margin: 0;
  color: #4c4c4c;
  font-size: 16px;
  padding: 1rem 4rem 1rem 7rem;
  -webkit-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
  -webkit-box-shadow: -3px 3px 10px 2px rgba(0, 0, 0, 0.28);
  box-shadow: -3px 3px 10px 2px rgba(0, 0, 0, 0.28);
}

.preguntas .block-form label {
  background-color: transparent !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: #fff !important;
  text-align: center;
}

.preguntas input[type='radio']:checked + label,
.preguntas input[type='checkbox']:checked + label {
  background-color: #ffdd51;
  color: #666;
}

.preguntas input[type='radio']:checked + label span:before,
.preguntas input[type='checkbox']:checked + label span:before {
  color: #fff;
}

.preguntas input[type='radio'].is-invalid + label,
.preguntas input[type='checkbox'].is-invalid + label {
  background-image: url(../images/bg-invalid.png);
  background-repeat: no-repeat !important;
  background-position: calc(100% - 4px) calc(100% - (5px / 2));
  -webkit-background-size: auto calc(100% - 6px);
  background-size: auto calc(100% - 6px);
}

.preguntas input[type='radio'].is-valid + label,
.preguntas input[type='checkbox'].is-valid + label {
  background-image: url(../images/bg-valid.png);
  background-repeat: no-repeat !important;
  background-position: calc(100% - 4px) calc(100% - (5px / 2));
  -webkit-background-size: auto calc(100% - 6px);
  background-size: auto calc(100% - 6px);
}

.preguntas label:before,
.preguntas label:after {
  position: absolute;
  content: '';
  -webkit-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}

.preguntas .block-form label:before {
  position: relative;
  display: block;
  margin: 0 auto 0.75rem;
  left: auto;
}

.preguntas .block-form label:after {
  top: 9px;
  left: calc(50% - (20px / 2));
}

.preguntas label:before {
  background-color: #fff;
  border-radius: 50%;
  width: 38px;
  height: 38px;
  left: 1.5rem;
  top: calc(50% - (38px / 2));
  border: 1px solid #818181;
}

.preguntas input[type='checkbox'] + label:before {
  border-radius: 0.25rem;
}

.preguntas label:after {
  background-color: #00bead;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  left: 33px;
  top: calc(50% - (20px / 2));
  -webkit-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}

.preguntas input[type='checkbox'] + label:after {
  font-weight: 900;
  font-family: 'Font Awesome 5 Free';
  content: '\f00c';
  background-color: transparent;
  color: #00bead;
  font-size: 24px;
  top: calc(50% - (38px / 2));
  left: 31px;
}

.preguntas input[type='radio']:checked + label:after,
.preguntas input[type='checkbox']:checked + label:after {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}