*{
	padding: 0px;
	margin: 0px;
cursor: default;
user-select: none;
}

.d-block {
width: 100%;
height: 100%;
}

#todojunto {	
justify-content: center;
align-items: center;
background: rgba(135, 20, 39, 0.5);
border-radius: 5px;
text-align: center;
height: 180px;
vertical-align: middle;
}

#bienv {
margin-top: -15px;
}
#nombre {
margin-top: -35px;
}


#rojota {	
	text-align: center;
	color: #871427;
	padding: 0px;
     font-weight: bold;
}
#rojota2 {	
	text-align: center;
	color: #871427;
	padding: 0px;
	font-weight: bold;
       
}
 
#negro {	
	text-align: center;
	color: #000000;
margin-top: -18px;
       
}

#negro:hover {	
	text-align: center;
	color: #871427;
        text-decoration: underline;
       
}


.contenedor{
	display: grid;
	grid-template-columns: 200px 1fr;
	grid-template-rows: 80px calc(100vh - 130px) 50px;
	grid-template-areas:"header header"
						 "main  main"
						 "foter foter";



}
.contenedor .header{
	grid-area:header;
	display: grid;
	grid-template-columns: 2px 1fr 690px;
	grid-template-rows: 100px 2px;
	grid-template-areas: "logo titulo titulo"
						 "line line line";
	position: relative;



}
.contenedor .header .menu-bar{
		display: none;
	
	}

	.contenedor .header .intro{
		grid-area: titulo;
		text-align: center;

	}
	.contenedor .header .intro h1{
    color: #871427;
    margin-top: 20px;
	}
.contenedor .header .logo{
	grid-area: logo;
	left: 20px;

}
.contenedor .header .logo img{
	width: 100px;
	height: 100px;

}


.contenedor .header .up-nab{
	grid-area: up-nab;
	display: flex;
	justify-content: center;
	align-items: center;
}
.contenedor .header .up-nab .list{
	justify-content: space-between;
	width:690px;
}
.contenedor i{
	margin-right: 7px;

}
.contenedor .header .up-nab ul li{
	display: inline-block;
    list-style: none;
    font-size: 19px;
    margin: 19px;
}
.contenedor .header .up-nab ul li a{
text-decoration: none;
color: #3a3d3a;
margin-left:9px; 

}
.contenedor .header .up-nab ul li a:hover{
	color: #ba2913;
    background-color:#f7f9fa;
}
.contenedor .header .up-nab ul {
	justify-content: space-between;

}

.contenedor hr{
	position: relative;
	bottom: 20px;
	z-index: 1000;
   background-color:#f5f5f5;

}
.contenedor .line{
	grid-area: line;


}
/*-----------------------------------comienzo main----------------------------*/
.contenedor .main{
	grid-area: main;
	display: grid;
	grid-template-columns: minmax(400px, 700px) minmax(200px, 600px);
	grid-template-rows:400px;
	grid-template-areas: "calesita input";
						 grid-gap: 5px;
	
	align-items: center;
	margin-top: 5vh;
	justify-content: center;
	margin-left: 10px;
	margin-right: 10px;
    

}

	
.contenedor .main .intro2{
		display: none;
}
.contenedor .main .input {
	grid-area: input;
	display:grid;
grid-template-columns: 200px;
	grid-template-rows:50px 50px 50px 0px 30px;
	grid-template-areas: "data"
					     "legajo"
					     "dni"
                         "contraseña"
                         "error" 
					     "submit";
	margin-top:70px;
	background-color:#f7f7f7;
border: 2px solid;
border-color: #fff7f7;
border-left: 15px color #fff7f7;
height: 396px;
border-radius: 8px;
width: 85%;
z-index: 10000;

}
.contenedor .main .input input {
	width: 325px;

}
.contenedor .main .input .dni input:hover {
        transition: 0.1s all;
	border-color: #871427;
        box-shadow: 5px 5px #dbd9d9;
}

.contenedor .main .input .legajo input, .contenedor .main .input .dni input, .contenedor .main .input .password input {
        border-radius: 8px;
        padding: 6px;
        border: solid 1px grey;
}





.contenedor .main .input .legajo input:hover {
        transition: 0.1s all;
	border-color: #871427;
        box-shadow: 5px 5px #dbd9d9;
}


.contenedor .main .input .password input:hover {
	focus;
        transition: 0.1s all;
	border-color: #871427;
        box-shadow: 5px 5px #dbd9d9;
}
.contenedor .main .input .data {
	justify-content: center;
	display: flex;


}
.contenedor .main .input .data p{
	grid-area: data;
	display: block;
        margin-top: 10px;
	font-family: 'Raleway', sans-serif; 
	font-size: 30px;
	color:#428cdb;
	width: 320px;
	text-align: center;

}


.contenedor .main .input .legajo  {
 	grid-area: legajo;
        justify-content: center;
        margin-top: 40px;
        display: flex;
        font-size: 19px;
vertical-align: middle;
  
}
.contenedor .main .input i {
	margin-left: 15px;
	font-size: 20px;
	
}



.contenedor .main .input .password{
	grid-area:contraseña;
	margin-top: 8px;
	font-size: 19px;
	justify-content: center;
	display: flex;


}
.contenedor .main .input .dni{
	grid-area: dni;
	margin-top: 39px;
	font-size: 19px;
	justify-content: center;
	display: flex;
	position: relative;
}
.contenedor .main .input .dni i{
	margin-top: 2px;
	position: relative;
	top: 5px;
	font-size: 22px;
}	
.contenedor .main .input{
	display: block;
	justify-content: center;
	align-items: center;
width: 100%;

}
.contenedor .main .input .submit {
	grid-area: submit;
	display: grid;
	grid-template-columns: 250px 90px;
	grid-template-rows: 70px;
	grid-template-areas: "link-ayuda btn-enciar";

	}
.contenedor .main .error{
font-size: 15px ;
text-align: center;
color: red;
margin-top: 10px;




}


.contenedor .main .input .submit input{
	background-color:#b85363;
margin-bottom: 20px;
	width: 119px;
	color: white;

}

.contenedor .main .button .submit .btn-enviar{
	grid-area: btn-enviar;
position: relative;
font-size: 17px;
bottom: 45px;
right: 80px;
margin-left: 10px;


}


.contenedor .main .input .submit  button{
grid-area: btn-enviar;
position: relative;
font-size: 17px;
bottom: 45px;
right: 80px;
margin-left: 10px;


}
.contenedor .main .input .submit .link-ayuda{
	grid-area: link-ayuda;
display: flex;
justify-content: center;
align-items: center;
margin-left: 79px;
margin-bottom: -48px;

}
.contenedor .main .input .submit .link-ayuda a:hover{
	color: #c25353;
}
.contenedor .main .input .submit input:hover{
	background-color: #871427;

}
.contenedor .main .input .submit button:hover{
	background-color: #871427;

}




/*-------------------------------------------------------------*/
.contenedor .main .calecita {
	grid-area: calesita;
	height:50px;
	width: 100%;
	align-items: center;
position: relative;
bottom:138px;
display: block;
z-index: 1000;

}
.contenedor .main .calecita a:hover{
	background-color:rgba(225, 223, 223, 0.1);
	
}
/*---------------------------------------------footer----------------------------*/
footer {
	display: flex;
	position: fixed;
 justify-content: center;
 align-items: center;
 bottom: 0;
 width: 100%;
 background-color:#871427;
 height: 50px;
vertical-align: middle;
}


footer a{
color:white;
text-decoration: none;
font-size: 19px;
margin-left: 10px;
}
footer a:hover{
color:white;
transition: 0.1s ease 0.1s;
}
/*---------------------------------------mediaQ-------------------------*/

@media screen and (max-width: 768px){
	.contenedor{
		display:grid;
		grid-template-columns: minmax(300px, 768px);
		grid-template-rows: 100px 400px 40px;
		grid-template-areas: "header"
							 "main"
							 "foter";

	}
	.contenedor .header{
		display: grid;
		grid-template-columns:1px  minmax(100px, 768px);
		grid-template-rows: 100px 2px;
		grid-template-areas:"boton logo"
						     "line line";
		text-align: center;
		align-items: center;
	}

 
 .contenedor .header .intro h1{
 	display:none;
 }
	
	
	.contenedor hr{
	position: relative;
	bottom: 6px;
	z-index: 1000;
  

}
	.contenedor .header .logo{

		justify-content: center;
	}
	.contenedor .header .logo img{
		width: 100px;
		height: 100px;
	}
	.contenedor .header .up-nab{
		display:none;
	}
	.contenedor .main{
		display:grid;
		grid-template-columns: minmax(1px,768px);
		grid-template-rows: 60px 400px;
		grid-template-areas:"intro"
							"input";
							
							

	}
	.contenedor .main .intro2 h1{
		font-size: 35px;
		flex-wrap: wrap;
		position: relative;
		top: 30px;
		text-decoration: bold;
	
	}
	.contenedor .main .intro2{
		display: block;
		text-align: center;
		color:#871427;
		margin-top:-90px;
	}
	.contenedor .main .input {
	grid-area: input;
	display:grid;
	grid-template-columns: minmax(1px,768px);
	grid-template-rows:90px 90px 90px 10px 90px;
	grid-template-areas: "data"
					     "legajo"
                           "dni"
				         "contraseña"
				         "error"
					     "submit";
 	border:none;
	background-color: #f5f5f5;
	padding-left: 10px;
	padding-right: 10px;
margin-bottom: 100px;
padding-top: 70px;
	height: 400px;

 }
	.contenedor .main .input .data{
     margin-top:-165px;
	}

	.contenedor .main .input .legajo{
		margin-top: 120px;
	}

.contenedor .main .input .dni{
	margin-top: 35px;
	}
	.contenedor .main .input .password{
		margin-top:35px;
	}

	.contenedor .main .input .submit{
	

	} 
	.contenedor .main .input .submit .btn-enviar{
     position: relative;
    right: 109px;
	}
	.contenedor .main .input .submit .link-ayuda{
	grid-area: link-ayuda;
	position: relative;
	right: 20px;
	}

.contenedor .main .calecita {
	display: none;
}
}

@media screen and (max-width: 608px){
	.contenedor .main{
margin-top:5vh; 
}
}
@media screen and (max-width: 500px){
	.contenedor .main .input .submit  button{
	position: relative;
	right: 90px;
}
	.contenedor .main .input .submit .link-ayuda{
		right: 40px;
	}
.contenedor hr{
display:none;
}

#rojota {
font-size: 25px;
}

.contenedor .main .input .password{
margin-top: 25px;
}

}
/*----------------------------------------------400px-----------------------------------------------*/
@media screen and (max-width: 450px){
	.contenedor .main .input{
		height: 360px;
		margin-top: -40px;
		
}
.contenedor .main .intro2 h1{
    font-size: 30px;
    margin-top: -40px;
	}
.contenedor .main .input .submit  button{
	position: relative;
	top: -55px;
	right: 160px;
	width: 120px;
	height: 30px;
}
.contenedor .main{
		margin-top:3vh;
		
	}

	.contenedor .main .input .legajo{
		margin-top: 30px;
	}
	.contenedor .main .input .submit .link-ayuda{
left: -75px;
top: -8px;
}
}
@media screen and (max-width: 340px){
	.contenedor .main{
		margin-top: 20px;
		
	}
	.contenedor .main .input {
		margin-top: -40px;
		height: 330px;
	}
	

	.contenedor .main .input .legajo{
		margin-top: 30px;
	}
	
	.contenedor .main .intro2 h1{
    font-size: 30px;
    margin-top: -40px;
	}
.contenedor .main .input .submit button{
	position: relative;
	right: 160px;
	top: -69px;
	font-size: 20;
	width: 95px;
	height: 30px;
}
	.contenedor .main .input .submit .link-ayuda{
		position: relative;
		top: -20px;
		left:-80px;
}
}

#ingresara {	
border-radius: 8px;
height: 38px;
background-color: #e3e3e3;
margin-top: 5px;
outline: none;
}

#ingresara:hover {	
transition: 0.1s ease-in 0.1s;
transform: scale(0.98);
background-color: #8b2332;
text-decoration: underline;
color: white;
font-weight: bold;
cursor: pointer;
cursor: hand;
}

#ingresara:disabled {	
cursor: progress;
}

input, button { 
    outline: none;
}

:focus { 
    outline-color: transparent; 
    outline-style: none;
}

:hover { 
    outline-color: transparent; 
    outline-style: none;
}