/* General CSS Setup */
      
      /* container */
      .container {
        padding: 5% 5%;
      }
      
      /* CSS talk bubble */
      .talk-bubble {
          margin: 40px;
        display: inline-block;
        position: absolute;
          width: 200px;
          height: auto;
          background-color: #fff;
          font-family: Arial, Helvetica, sans-serif;
          font-size:14px;
      }
      .border{
        border: 4px solid #666;
      }
      .round{
        border-radius: 30px;
          -webkit-border-radius: 30px;
          -moz-border-radius: 30px;
      
      }
      
     
      
      /* TRIANGULO A LA IZQUIERDA */
 .tri-right.border.left-in:before {
          content: ' ';
          position: absolute;
          width: 0;
          height: 0;
        left: -21px;
          right: auto;
        top: 34px;
          bottom: auto;
          border: 10px solid;
          border-color: #666 #666 transparent transparent;
      }
      .tri-right.left-in:after{
          content: ' ';
          position: absolute;
          width: 0;
          height: 0;
        left: -13px;
          right: auto;
        top: 37px;
          bottom: auto;
          border: 7px solid;
          border-color: #fff #fff transparent transparent;
      }
/* FIN TRIANGULO A LA IZQUIERDA*/


/*TRIANGULO ABAJO IZQUIERDA*/
.tri-right.border.btm-left-in:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: 35px;
  right: auto;
  top: auto;
	bottom: -28px;
	border: 14px solid;
	border-color: #666 transparent transparent #666;
}
.tri-right.btm-left-in:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: 38px;
  right: auto;
  top: auto;
	bottom: -20px;
	border: 12px solid;
	border-color: #fff transparent transparent #fff;
}
/*FIN TRIANGULO ABAJO IZQUIERDA*/

/*TRIANGULO ABAJO DERECHA*/
.tri-right.border.btm-right-in:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: 35px;
	bottom: -28px;
	border: 14px solid;
	border-color: #666 #666 transparent transparent;
}
.tri-right.btm-right-in:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: 38px;
	bottom: -20px;
	border: 12px solid;
	border-color: #fff #fff transparent transparent;
}
/* FIN TRIANGULO ABAJO DERECHA*/


/* TRIANGULO DERECHA */
.tri-right.border.right-in:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
  right: -29px;
    top: 35px;
	bottom: auto;
	border: 14px solid;
	border-color: #666 transparent transparent #666;
}
.tri-right.right-in:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: -20px;
  top: 38px;
	bottom: auto;
	border: 12px solid;
	border-color: #fff transparent transparent #fff;
}
/* FIN TRIANGULO DERECHA */
      
      /* talk bubble contents */
      .talktext{
        padding: 1em;
          text-align: left;
        line-height: 1.5em;
      }
      .talktext p{
        /* remove webkit p margins */
        -webkit-margin-before: 0em;
        -webkit-margin-after: 0em;
      }



    .contenedor{
      width:800px;
  }
.botones{
  width:100%;
  padding:10px;
}

.escena{
  display:none;
  max-width: 800px;
}

.escena img{
  max-width: 800px;
}

.escena.activa{
  display:block;
}

.botones div {
text-decoration: none;
display: inline-block;
padding: 8px 16px;
font-size:20px;
font-weight: bolder;
cursor: pointer;
background-color: #ce3229;
}

.botones div:hover {
background-color: rgb(175, 76, 81);
color: black;
}

.anterior {
color: white;
}

.siguiente {
color: white;
}

.next {
color: white;
font-family: Arial, Helvetica, sans-serif;
font-size:14px!important;
}

.talk-bubble{
  display:none;
}