*{
	box-sizing:border-box;
}
body{
	background-color:#020640/*8DB6CB*/;
}
#contenido{
	background-color:#020640;
	height:auto;	
}
#cont-form{
	position:absolute;
	left:20%;
	top:32%;
	width:60%;	
}
.todos{
    display:flex;
    float:left;
    width:30%;
	margin-left:2%;
	border:none;
}
.todos_select{
    display:flex;
    float:left;
    width:25%;
	margin-left:8%;
}

.titulo{	
	padding:20px;
	background-color:#3F4048;
	color:white;
	font-size:25px;
	font-weight:100;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	border-bottom: 5px solid;	
}
.form{
	margin: 0 auto;
	width:80%;
	height:auto;	
	top:32%;
	background-color:#020640;	
	border-radius:10px;	
	border:3.5px solid;
	color:white;
	opacity:0.95;
}
/*input{
	margin:8px;
	margin-left:8%;
	margin-bottom:25px;
	padding:6px;
	border-radius:10px;
	font-family: 'Kaisei HarunoUmi', serif;
	font-weight:600;
	font-size:90%;
	color:black;
	width:30%;	
	text-align:center;
	box-sizing:border-box;
	font-size:15px;
	
}*/
.campos{
    margin:8px;
	margin-left:8%;
	margin-bottom:25px;
	padding:6px;
	border-radius:10px;
	border:black;
	font-family: 'Kaisei HarunoUmi', serif;
	font-weight:600;
	font-size:90%;
	color:black;
	width:20%;	
	text-align:center;
	box-sizing:border-box;
	font-size:15px;
}
.campos_select{
    margin:8px;
	margin-left:8%;
	margin-bottom:25px;
	padding:6px;
	border-radius:10px;
	font-family: 'Kaisei HarunoUmi', serif;
	font-weight:600;
	font-size:90%;
	color:black;
	width:40%;	
	text-align:center;
	box-sizing:border-box;
	font-size:15px;
}

input:focus{
	background-color:#C7D8EE;
	
}
span{
	margin-left:2%;
	font-family: 'Kaisei HarunoUmi', serif;
	font-weight:500;
	font-size:80%;
	color:white;
}
.rec{
	margin-left:5%;
	font-family: 'Kaisei HarunoUmi', serif;
	font-weight:500;
	font-size:90%;
	color:white;	
}

.fondo{
	position:relative;
	left:0%;
	width:100%;
	height:auto;
}
.fecha{
    margin:8px;
	margin-left:8%;
	margin-bottom:25px;
	padding:6px;
	border-radius:10px;
	font-family: 'Kaisei HarunoUmi', serif;
	font-weight:600;
	font-size:90%;
	color:black;
	text-align:center;
	box-sizing:border-box;
	font-size:15px;
	width:auto;
    border:none;
}

.descripcion{
	position:relative;
	left:3%;
	width:80%;
	height:25%;
	font-size:18px;
}
.pre{
	height:7%;
}
.lib, .pre, .prod{
	margin:8px;
	margin-left:8%;
	margin-bottom:25px;
	padding:5px;
	border-radius:10px;
	font-family: 'Kaisei HarunoUmi', serif;
	font-weight:600;
	font-size:90%;
	color:black;
	width:30%;	
	text-align:center;
}
.boton{
   	display:flex;
	justify-content:center;
	text-align:center;
}
.ingresar{
	width:28%;
	height:10%;
	color:white;
	font-family: OpenSans;
	font-size:22px;
	background-color:#0B16BB;
	border:20px;
	border-radius:20px;
/*	position:relative;
	left:32%;
	text-align:center;*/
	padding:6px;
}
h2{
	text-align:center;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
input[type="month"]::-webkit-inner-spin-button,
input[type="month"]::-webkit-calendar-picker-indicator{
    dispay: none;
}
input[type="month"]::-webkit-datetime-edit-text{
    padding: 0;
}
@media screen and (max-width:768px){
#cont-form{	
		position:absolute;
		left:5%;
		width:90%;	
		top:26%;
}
.form{
	width:100%;	
}
.fondo{
	position:relative;
	width:100%;
	height:105%;
}
.todos{
    display:flex;
}
.todos_select{
    display:flex;
    width:30%;
	margin-left:2%;
}
.campos{
    width:40%;
}
.campos_select{
    width:50%;
}
.descripcion{
    position:relative;
	left:2%;
    width:90%;
    font-size:16px;
}
input[type="submit"]{
  -webkit-appearance:none;
}
.ingresar{
    -webkit-appearance:none;
    width:50%;
	font-size:18px;
	padding:10px;
	
}   
}
@media screen and (max-width:1024px) and (orientation: landscape){
    .fondo{
	position:relative;
	width:100%;
	height:230%;

}
.todos{
    width:40%;
}
#cont-form{	
		position:absolute;
		left:5%;
		width:90%;	
		top:35%;
}

input[type="submit"]{
  -webkit-appearance:none;
}

.ingresar{
    -webkit-appearance:none;
    width:50%;
	font-size:18px;
	padding:10px;
}   
}
