*{margin:0;padding:0;box-sizing:border-box;line-height:24px;}
h3{text-align: center;background-image: linear-gradient(to top,#FFFFFF, #5256ad); padding:3px;}
.grid{
	display:grid;
	grid-template-columns: 1fr 500px;
	grid-gap:20px;
	height:100vh;
	margin:0 auto;
}
#preview{
	max-height:100vh;
	overflow: scroll;
}
.file-container {
	position:relative;
	width:14%;
	display:block;
	float:left;
	margin:2% 2% 2% 0;
}
.file-container .close{
	cursor:pointer;
	position: absolute;
	top:3px;
	right:10px;
	width:25px;
	height:25px;
	border-radius: 15px;
	background-color: #999797;
	font-weight: 500;
	font-size:30px;
	line-height: 20px;
	text-align: center;
}
.file-container img{width: 100%;}

.sidebar{
	display:grid;
	grid-template-rows: 45px 270px 3fr 1fr ;
	border-left:solid 2px #5256ad ;
}

.boton{
	padding:10px 25px;
	font-size:20px;
	border:0;
	outline:none;
	background-color:#5256ad;
	color:white;
	cursor:pointer;
	width:49%;
}
.boton:hover{
	background-color:#9399FF;
}
.boton:disabled{
	background-color: #717172;color:black;
}
.medio{width:24%;}
.drag-area{
	border:2px dashed #17D0ED;
	border-radius:5px;
	display:flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

}
.drag-area.active{
	background-color:#b8d4fe;
	color:black;
	border:2px dashed #618ac9;
}
.drag-area h2{
	font-size:30px;
	color:#000000;
}
.drag-area span{
	font-size:30px;
	color:#000000;
	font-weight: 500;
}
.drag-area button{
	padding:10px 25px;
	font-size:20px;
	border:0;
	outline:none;
	background-color:#5256ad;
	color:white;
	cursor:pointer;
}
#previsualiza{
	position:relative;
	margin:auto;
}
#previsualiza:before{
	content:'clic aquí para actualizar';
	position: absolute;
	bottom:-4px;
	left:20px;
	text-align: center;
	color:#3D3D3D;
	font-style: italic;
	font-size: 14px;
}
#muestra{

	display: grid;
	padding:10px;
	background-color:#dddddd;
	border:solid 1px black;
}
.num{
	color:tomato;
	text-align:center;
/*	top: 50%;
	transform: translateY(50%);*/

}
#config p{font-weight: bold;}
#config div{
	display:flex;
}
#config input{border:none;font-weight: bold;padding:0 5px;line-height: 30px;border:solid 2px #5256ad ;border-radius: 5px;width:60px;}
#dibujoOrient{width:40px;height:30px;border: solid 2px black;margin-left:50px;background-color: white;bottom: 47px;margin-right:10px;}


#captcha{font-size: 24px;
	font-weight: bold;
	text-align: center;
	margin-top: 50px;
}
#captcha input{
	padding: 20px;
	font-size: 40px;
	width: 100px;
	margin:16px;
}
#captcha button{
	font-size:40px;
	background-color: #009CD1;
	color:#ffffff;
	padding:10px;
}
#captcha #error{
	color:RED;}