/* Efectos basicos /. ************************************** */

.mal_tiembla {
	transition: all 200ms ease;
	animation: mal_tiembla 125ms ease-in-out infinite alternate;
}
@keyframes mal_tiembla {
 0% {
transform:rotateZ(-5deg);
}
 50% {
transform:rotateZ( 0deg) scale(.8);
border-color: red;
}
 100% {
transform:rotateZ( 5deg);
}
}
.mal_cabeza {
	transition: all 250ms ease;
	animation: mal_cabeza 250ms ease-in-out infinite alternate;
}
@keyframes mal_cabeza {
 0% {
 margin-left:0px;
}
 50% {
 margin-left:20px;
 border-color: red;
}
 100% {
 margin-left:-20px;
}
}
.bien_cabeza {
	transition: all 250ms ease;
	animation: bien_cabeza 250ms ease-in-out infinite alternate;
}
@keyframes bien_cabeza {
 0% {
 margin-top:0px;
}
 50% {
 margin-top:20px;
 border-color: green;
}
 100% {
 margin-top:-20px;
}
}
.mal_cabeza_R {
	transition: all 250ms ease;
	animation: mal_cabeza_R 250ms ease-in-out infinite alternate;
}
@keyframes mal_cabeza_R {
 0% {
 left:0px;
}
 50% {
 left:20px;
}
 100% {
 left:-20px;
 border-color: red;
}
}
.bien_cabeza_R {
	transition: all 250ms ease;
	animation: bien_cabeza_R 250ms ease-in-out infinite alternate;
}
@keyframes bien_cabeza_R {
 0% {
 top:0px;
}
 50% {
 top:20px;
}
 100% {
 top:-20px;
 border-color: green;
}
}
/* Escala */

.sca, .sca_child>* {
	transition: all 300ms ease;
}
.sca:hover, .sca_child>*:hover {
	transform: scale(1.1);
}
.sca:active, .sca_child>*:active {
	transform: scale(0.9);
}
/* Transicion en drag revert */
.animation {
	transition: all 250ms ease;
}
/* Botonera */
  
#botonera:before {
	background-color: transparent!important;
}
#botonera div {
	border-bottom: 6px solid #89380f;
}
/* Escala infinite*/
.agranda {
	transition: all 250ms ease;
	animation: agranda 800ms ease-out infinite alternate;
	cursor: pointer;
}
 @keyframes agranda {
 from {
 transform:scale(1);
}
 to {
 transform:scale(1.15);
 -webkit-box-shadow: 0px 0px 59px 0px rgba(246,255,117,1);
 -moz-box-shadow: 0px 0px 59px 0px rgba(246,255,117,1);
 box-shadow: 0px 0px 59px 0px rgba(246,255,117,1);
}
}
.off {
	visibility: hidden;
}
.encima {
	transform: scale(1.15);
	transition: all 250ms ease;
}
/* ./  ************************************** */
 

.cont_1 {
	position: absolute;
	top: 380px;
	left: 60px;
}
img.bandeja {
	position: absolute;
	top: 420px;
	left: 190px;
}
img.parte1 {
	position: absolute;
	top: 446px;
	left: 218px;
	cursor: pointer;
	z-index: 2;
}
img.parte2 {
	position: absolute;
	top: 446px;
	left: 324px;
	z-index: 2;
	cursor: pointer;
}
img.parte3 {
	position: absolute;
	top: 553px;
	left: 218px;
	cursor: pointer;
	z-index: 2;
}
img.parte4 {
	position: absolute;
	top: 553px;
	left: 324px;
	cursor: pointer;
	z-index: 2;
}
.plato {
	position: absolute;
	top: 460px;
	left: 940px;
	width: 232px;
	height: 230px;
	background-image: url(../img/resumen/plato.png);
	padding: 20px 0px 0px 20px;
	z-index: 1;
}
.plato img {
	display: none;
	z-index: 1;
}
input.inp1 {
	position: absolute;
	top: 219px;
	left: 510px;
	font-size: 50px;
	border-radius: 15px;
	border: 3px dashed black;
	width: 300px;
	text-align: center;
}
/*Drop 1*/


#adrag1 {
	width: 28px;
	height: 27px;
	background-image: url(../img/guia.png);
	position: absolute;
	top: 218px;
	left: 374px;
	z-index: 10;
	cursor: pointer;
}
#adrag2 {
	width: 28px;
	height: 27px;
	background-image: url(../img/guia.png);
	position: absolute;
	top: 219px;
	left: 722px;
	z-index: 10;
	cursor: pointer;
}
#adrag3 {
	width: 28px;
	height: 27px;
	background-image: url(../img/guia.png);
	position: absolute;
	top: 229px;
	left: 1093px;
	z-index: 10;
	cursor: pointer;
}
#adrag4 {
	width: 28px;
	height: 27px;
	background-image: url(../img/guia.png);
	position: absolute;
	top: 380px;
	left: 430px;
}
#adrag5 {
	width: 28px;
	height: 27px;
	background-image: url(../img/guia.png);
	position: absolute;
	top: 444px;
	left: 430px;
}
#adrag6 {
	width: 28px;
	height: 27px;
	background-image: url(../img/guia.png);
	position: absolute;
	top: 518px;
	left: 430px;
}
.bord {
	border: 4px dashed black;
}
#adrop1 {
	width: 33px;
	height: 33px;
	/* background-image:url(../img/guia.png); */
	position: absolute;
	top: 328px;
	left: 363px;
	border: 2px dashed rgb(2, 2, 2);
	border-radius: 22px;
	padding-top: 5px;
	padding-left: 7px;
}
#adrop2 {
	width: 33px;
	height: 33px;
	/* background-image:url(../img/guia.png); */
	position: absolute;
	top: 319px;
	left: 713px;
	border: 2px dashed black;
	border-radius: 22px;
	padding-top: 5px;
	padding-left: 7px;
}
#adrop3 {
	width: 33px;
	height: 33px;
	/* background-image:url(../img/guia.png); */
	position: absolute;
	top: 338px;
	left: 1093px;
	border: 2px dashed black;
	border-radius: 22px;
	padding-top: 5px;
	padding-left: 7px;
}
#adrop4 {
	width: 33px;
	height: 33px;
	/* background-image:url(../img/guia.png); */
	position: absolute;
	top: 370px;
	left: 633px;
	border: 2px dashed black;
	border-radius: 22px;
	padding-top: 5px;
	padding-left: 7px;
}
#adrop5 {
	width: 33px;
	height: 33px;
	/* background-image:url(../img/guia.png); */
	position: absolute;
	top: 438px;
	left: 633px;
	border: 2px dashed black;
	border-radius: 22px;
	padding-top: 5px;
	padding-left: 7px;
}
#adrop6 {
	width: 33px;
	height: 33px;
	/* background-image:url(../img/guia.png); */
	position: absolute;
	top: 507px;
	left: 993px;
	border: 2px dashed black;
	border-radius: 22px;
	padding-top: 5px;
	padding-left: 7px;
}
.animar {
	transition: all 1s ease;
	-webkit-transition: all 200ms ease;
}
.cerrar {
	position: absolute;
	top: -10px;
	right: -20px;
}
/* drapdrop*/

.drog div {
	width: 171px;
	height: 170px;
	background-color: white;
	display: block;
	float: left;
	border: 3px solid black;
	border-radius: 15px;
}
.drog img {
	display: block;
	float: left;
}
.drog {
	position: absolute;
	top: 240px;
	left: 220px;
	width: 1000px;
	text-align: center;
}
.arrastra {
	position: absolute;
	top: 430px;
	left: 397px;
}
.sigue {
	position: absolute;
	top: 267px;
	left: 240px;
	padding: 13px 21px;
	background-color: white;
	border-radius: 12px;
	color: #EB7F26;
	font-size: 23px;
}
svg#linea>line {
	display: none;
}
input.input1 {
	position: absolute;
	top: 52px;
	left: 450px;
	font-size: 50px;
	border: 5px dashed black;
	border-radius: 15px;
	width: 100px;
	text-align: center;
}
input.input2 {
	position: absolute;
	top: 132px;
	left: 450px;
	font-size: 50px;
	border: 5px dashed black;
	border-radius: 15px;
	width: 100px;
	text-align: center;
}
.inputsgrup input {
	font-size: 36px;
	width: 58px;
	text-align: center;
	position: absolute;
	border: 3px dashed black;
	border-radius: 15px;
}
.inpss1 {
	top: 287px;
	left: 294px;
}
.inpss2 {
	top: 346px;
	left: 294px;
	height: 39px;
}
.inpss3 {
	top: 287px;
	left: 606px;
}
.inpss4 {
	top: 346px;
	left: 606px;
	height: 39px;
}
.inpss5 {
	top: 287px;
	left: 922px;
}
.inpss6 {
	top: 346px;
	left: 922px;
	height: 39px;
}
.inpss7 {
	top: 287px;
	left: 1230px;
}
.inpss8 {
	top: 346px;
	left: 1232px;
	height: 39px;
}