/*!
 * Entornos Interactivos
 * www.entornos-interactivos.org
 */

 .panel-body {
  padding: 0;
 }

/*************************
********* marco1 *********
**************************/

#frame #marco1 {
  top: 0px;
  left: 0px;
  width: 970px;
  height: 575px;
  position: absolute;
}

#jumbotron1 {
  width: 500px;
}

/*************************
********* marco2 *********
**************************/

#frame #marco2 {
  top: 0px;
  left: 1000px;
  width: 970px;
  height: 575px;
  position: absolute;
}

/*************************
********* marco3 *********
**************************/

#frame #marco3 {
  top: 0px;
  left: 2000px;
  width: 970px;
  height: 575px;
  position: absolute;
}

/********************************
********* drag and drop *********
*********************************/

#marco4 h1,
#marco4 h2,
#marco5 h1,
#marco5 h2,
#marco6 h1,
#marco6 h2 {
  color: white;
  text-align: center;
}

.continuar {
  bottom: 0px;
  right: 30px;
  position: absolute;
  display: none;
}

.reinicio {
  bottom: 0px;
  right: 190px;
  position: absolute;
  display: none;
}

.checar {
  bottom: 0px;
  right: 341px;
  position: absolute;
  display: none;
}

.gobierno1 {
  top: 90px;
  left: 357.648px;
  position: absolute;
}

.gobierno2 {
  top: 90px;
  left: 650.422px;
  position: absolute;
}

.alerta {
  font-weight: 400;
  padding: 10px 25px;
  margin-top: -25px;
  line-height: 1.3;
  font-size: 16px;
  text-align: justify;
}

.showOver{
  background-color: #DA2A86;
}

.revision {
  right: 0;
  bottom: 0;
  position: absolute;
}

/*************************
********* marco4 *********
**************************/

#IrMarco3 {
  right: 15px;
  bottom: -25px;
  position: absolute;
}

/*************************
********* marco4 *********
**************************/

#IrMarco4 {
  right: 60px;
  bottom: 120px;
  position: absolute;
}

/*************************
********* marco4 *********
**************************/

#frame #marco4 {
  top: 0px;
  left: 3000px;
  width: 970px;
  height: 575px;
  position: absolute;
}

.demo1 {
  width: 970px;
  height: 550px;
  position: absolute;
}

.box1 {
  background-color: #8E3B09;
  width: 280px;
  height: 85px;
  line-height: 50px;
  position: absolute;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 9px; 
}

.targetA {
  background-color: transparent;
  width: 280px;
  height: 85px;
  position: absolute;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  padding: 5px;
}

#retro1 {
  display: none;
}

#fondo-rec-1 {
  top: 65px;
  left: 25px;
  position: absolute;
}

#title1 {
  top: 40px;
  left: 337.086px;
  position: absolute;
}

.dragger1 {
  top: 75px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger2 {
  top: 170px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger3 {
  top: 265px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger4 {
  top: 360px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger5 {
  top: 455px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

#target1 {
  top: 150px;
  left: 345px;
}

#target2 {
  top: 245px;
  left: 345px;
}

#target3 {
  top: 150px;
  left: 655px;
}

#target4 {
  top: 245px;
  left: 655px;
}

#target5 {
  top: 340px;
  left: 655px;
}

/*************************
********* marco5 *********
**************************/

#frame #marco5 {
  top: 0px;
  left: 4000px;
  width: 970px;
  height: 575px;
  position: absolute;
}

.demo2 {
  width: 970px;
  height: 550px;
  position: absolute;
}

.box2 {
  background-color: #8E3B09;
  width: 280px;
  height: 85px;
  line-height: 50px;
  position: absolute;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 9px; 
}

.targetB {
  background-color: transparent;
  width: 280px;
  height: 85px;
  position: absolute;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  padding: 5px;
}

#retro2 {
  display: none;
}

#fondo-rec-2 {
  top: 65px;
  left: 25px;
  position: absolute;
}

#title2 {
  top: 40px;
  left: 388.508px;
  position: absolute;
}

.dragger6 {
  top: 75px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger7 {
  top: 170px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger8 {
  top: 265px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger9 {
  top: 360px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger10 {
  top: 455px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger11 {
  top: 455px;
  left: 325px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

#target6 {
  top: 150px;
  left: 345px;
}

#target7 {
  top: 245px;
  left: 345px;
}

#target8 {
  top: 340px;
  left: 345px;
}

#target9 {
  top: 150px;
  left: 655px;
}

#target10 {
  top: 245px;
  left: 655px;
}

#target11 {
  top: 340px;
  left: 655px;
}

/*************************
********* marco6 *********
**************************/

#frame #marco6 {
  top: 0px;
  left: 5000px;
  width: 970px;
  height: 575px;
  position: absolute;
}

.demo3 {
  width: 970px;
  height: 550px;
  position: absolute;
}

.box3 {
  background-color: #8E3B09;
  width: 280px;
  height: 60px;
  line-height: 50px;
  position: absolute;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 9px; 
}

.targetC {
  background-color: transparent;
  width: 280px;
  height: 60px;
  position: absolute;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  box-shadow: inset 0px 0px 16px 0px rgba(0,0,0,0.5);
  padding: 5px;
}

#retro3 {
  display: none;
}

#fondo-rec-3 {
  top: 50px;
  left: 25px;
  position: absolute;
}

#title3 {
  top: 50px;
  left: 329.109px;
  position: absolute;
}

#title3 h1 {
  font-size: 23px;
}

.dragger12 {
  top: 60px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger13 {
  top: 130px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger14 {
  top: 200px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger15 {
  top: 270px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger16 {
  top: 340px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger17 {
  top: 410px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger18 {
  top: 480px;
  left: 35px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

.dragger19 {
  top: 470px;
  left: 655px;
  line-height: 1.2;
  color: white;
  font-weight: 400;
  text-align: center;
}

#target12 {
  top: 150px;
  left: 345px;
}

#target13 {
  top: 220px;
  left: 345px;
}

#target14 {
  top: 290px;
  left: 345px;
}

#target15 {
  top: 360px;
  left: 345px;
}

#target16 {
  top: 430px;
  left: 345px;
}

#target17 {
  top: 150px;
  left: 655px;
}

#target18 {
  top: 220px;
  left: 655px;
}

#target19 {
  top: 290px;
  left: 655px;
}

/*************************
********* marco7 *********
**************************/

#frame #marco7 {
  top: 0px;
  left: 6000px;
  width: 970px;
  height: 575px;
  position: absolute;
}

#jumbotron2 {
  width: 650px;
}

.jumbotron h1 {
  font-size: 40px;
  color: #DA2A86;
}