@import url(font-awesome.min.css);
@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,300italic,400italic");


.imagenJuego {
    width:700px;
}


.conmis {
    width: 700px;
	height: 30px;
}

.juego2 {
    width: 700px;
	height: 550px;
    background: #252122;
    background-image: url("/images/misiones/muestra1/bg_juego.png");
    font-family: 'Source Sans Pro';
    font-weight: 300;
    color: #5d5d5d;
}

.cajafinal{
	width: 700px;
	height: 500px;
	background: #fff;
	background-image: url("/images/misiones/muestra1/bg_resultados.png");
    background-repeat: no-repeat, repeat;

}

.imagenJuego2 {
    width:700px;
} 

.juegoSecuencia {
	width: 80px;
	height: 100px;
    float:left;
    margin: 5px 5px 5px 5px;
    border: solid 2px black;
  	
}

.juegoSecuenciamal {
	width: 64px;
	height: 94px;
    float:left;
    margin: 5px 5px 5px 5px;
    border: solid 2px red;
 	
}

.juegoSecuencia2 {
	width: 64px;
	height: 94px;
    float:left;
    margin: 5px 5px 5px 5px;
    border: solid 2px black;
}


.juegoSecuencia3 {
    width: 80px;
	height: 100px;
    float:left;
    margin: 5px 5px 5px 5px;
    border: solid 2px blue;
}

.juegoSecuenciamal2 {
	width: 76px;
	height: 140px;
    float:left;
    margin: 5px 5px 5px 5px;
    border: solid 1px red;	
}

.conjunto1 {
    width: 150px;
	height: 330px;
    float:left;
    margin: 10px 5px 5px 90px;
    padding: 60px 10px 10px 10px;
   
}

.conjunto12 {
    width: 180px;
	height: 330px;
    float:left;
    margin: 10px 5px 5px 5px;
    padding: 60px 10px 10px 30px;
   
}

.conjunto2 {
     width: 180px;
	height: 330px;
    float:left;
    margin: 10px 5px 5px 5px;
    padding: 60px 10px 10px 50px;
   
}

.drag {
    width: 50px;
	height: 80px;
    float:left;
    margin: 5px 1px 1px 5px;
}

.dregmal {
    width: 40px;
	height: 64px;
    float:left;
    margin: 3px 1px 1px 1px;
     border: solid 1px red;
}



.dreg {
    width: 40px;
	height: 64px;
    float:left;
    margin: 3px 1px 1px 1px;
}

.dragmal {
     width: 50px;
	height: 80px;
    float:left;
    margin: 5px 1px 1px 5px;
    border: solid 2px red;
}

.dragmal2 {
    width: 44px;
   height: 66px;
   float:left;
   margin: 0px 0px 0px 0px;
   border: solid 1px red;
}

#drep1 {
    width: 120px;
		height: 180px;
    float:left;
    margin: 50px 1px 1px 130px;
    padding: 1px 1px 1px 5px;
}

#drep2 {
    width: 120px;
	height: 180px;
    float:left;
    margin: 50px 1px 1px 40px;
    padding: 5px 1px 1px 10px;
}

#drep3 {
     width: 120px;
	height: 180px;
    float:left;
    margin: 50px 1px 1px 20px;
    padding: 5px 1px 1px 25px;
}


#drig1 {
	width: 120px;
	  height: 180px;
	float:left;
	margin: 70px 1px 1px 130px;
	padding: 1px 1px 1px 5px;
}

#drig2 {
	width: 80px;
  height: 180px;
	float:left;
	margin: 70px 1px 1px 80px;
	padding: 5px 1px 1px 10px;
}

#drig3 {
	 width: 120px;
  height: 180px;
	float:left;
	margin: 70px 1px 1px 60px;
	padding: 5px 1px 1px 25px;
}


#drip1 {
	width: 120px;
	  height: 180px;
	float:left;
	margin: 50px 1px 1px 130px;
	padding: 1px 1px 1px 5px;
}

#drip2 {
	width: 120px;
    height: 180px;
	float:left;
	margin: 50px 1px 1px 40px;
	padding: 5px 1px 1px 10px;
}

#drip3 {
	 width: 120px;
  height: 180px;
	float:left;
	margin: 50px 1px 1px 20px;
	padding: 5px 1px 1px 25px;
}



.circulo {
    background-color: dimgrey;
    font-size: 1.9em;
    line-height: 1.5em;
    font-weight:900;
    letter-spacing: -0.025em;
    color:black;
    
    border-radius: 50% 50% 50% 50%;
    float:left;
    width: 40px;
    height: 40px;
    border: solid 1px blue;
    
    display: flex;
    justify-content: center;
    align-items: center;

}


.dregmal {
    width: 46px;
	height: 68px;
    float:left;
    margin: 1px 1px 1px 1px;
    border: solid 2px red;
}








/*
 .hidden {
    visibility:hidden;
}
*/
/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
    clear:both;
}
input, select {
    vertical-align:middle;
}
/* RESET TERMINA */

/* CLEARFIX EMPIEZA */
.cf:before,
.cf:after {
    content:"";
    display:table;
}
.cf:after {
    clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.cf {
    zoom:1;
}
/* CLEARFIX TERMINA */
/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}
del {
    text-decoration: line-through;
}
abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
.hidden {
    visibility:hidden;
}
.hidden1 {
    visibility:hidden;
}
.hidden2 {
    visibility:hidden;
}
.hidden3 {
    visibility:hidden;
}
.opacidad {
    opacity:.8;
}