* {
  box-sizing: border-box;
}
.main-container {
  max-width: 800px;
  margin: auto;
  text-align: center;
}
@font-face {
  font-family: "DKCanoodle";
  src: url("../imagenes/DKCanoodle.ttf");  
}
@font-face {
  font-family: "Arial Rounded Bold";
  src: url("../imagenes/Arial_Rounded_Bold.ttf");
}
h1.titulo {
  margin: 50px auto 80px auto;
  text-align: center;
}
h1#msg-final {
  text-align: center;
  color: crimson;
  transition: all .5s ease;
  transform: scale(0);
  min-height: 50px;
  margin-bottom: 0;
}
.zoom-in {
  transform: scale(1) !important;
}
#acierto {
  text-align: center;
  min-height: 24px;
  transform: scale(0);
}
.acierto {
  animation: zoomInOut 1s ease;
}
.rojo {
  color: red;
}
.verde {
  color: green;
}
@keyframes zoomInOut {
  0% { transform: scale(0); }
  50% { transform: scale(1); }
  70% { transform: scale(1); }
  100% { transform: scale(0); }
}
h2.palabra {
  margin: 50px auto 25px auto;
  text-align: center;
  color: white;
  text-transform: uppercase;
  letter-spacing: 6px;
  border-bottom: none;
  font-family: "DKCanoodle";
  font-size: 3em;
}
.flex-row {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 10px auto; 
}
.no-wrap {
  flex-wrap: nowrap !important;
}
.col {
  width: 50%;
  text-align: center;
}
.col span {
  
}
#turnos {
	margin-bottom: 30px;
}
#turnos h3 {
	margin: auto;
	width: auto;
	left: auto;
    color: white;
    font-family: 'DKCanoodle';
	background-color: transparent;
    border-bottom: none;	
    transform: none;
}
#hueco-pista {
	text-decoration: underline;
}
#pista {
	font-family: 'DKCanoodle';
    font-size: 1.5em;
    border-radius: 10px;
}
.btnSiguiente {
	font-family: 'DKCanoodle';
    font-size: 1.5em;
    border-radius: 10px;
	transform: scale(1) !important;
}
h3 span {
   color: blue;
}
#abcdario {
	max-width: 500px
}
.letra {
	margin: 5px;
	font-family: "DKCanoodle";
	font-size: 1.4em;
    border-radius: 10px;
}
.letra:disabled {
  color:rgba(255, 0, 0, 0.5);
}
picture {
  position: absolute;
}
picture img {
  position: absolute;
  top: -190px;
  left: -130px;
  height: 250px;
}
#image5, #image4, #image3,
#image2, #image1, #image0 {
  opacity: 0;
  transition: opacity .3s ease;
}
.fade-in {
  opacity: 1 !important;
}
.encuadre {
  border: none;
  padding: 3px 2px 2px 6px;
}