@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

@import url('https://fonts.cdnfonts.com/css/yantramanav');


*{

	font-family: 'Yantramanav', 'Poppins', sans-serif;


}

body{

	background: #f1f1f1 !important;

}


li{

	list-style: none;

}

a, a:hover{

	text-decoration: none;

}

ul{

	padding: 0;

	margin: 0;

}
 #login_box{


	background: white;

	border-radius: 15px;

	padding: 20px; 

	box-shadow: 0px 7px 10px -10px rgba(0,0,0,0.75);

	z-index: 2;


	position: absolute;
    
    top: 50%;
    
    left: 50%;
    
    
    transform: translate(-50%, -50%);

	/*height: 100%;*/

	align-items: center;
}

main, #login_box{

	background: white;

	border-radius: 5px;

	padding: 20px; 

	box-shadow: 0px 7px 10px -10px rgba(0,0,0,0.75);

}

main table thead{
    background: #909090;
    color: white;
    border: none;
}



main table{
	margin-top: 20px;
}

label{

	color: gray;

    font-size: 0.9em;

}

input{

	border-radius: 25px;

}

.top_bar{
	
	/*background: white; */
	
	color: gray;
	
	font-size: 1em;
	
	height: 125px;
	
	overflow: hidden;
	
	display: flex;

	justify-content: space-between;
	
	align-items: center;

	padding: 0 20px;


}

.right_bar{
	
	/*padding: 10px;*/

	/*background: white;*/

	color: #363636;

	display: flex;

	justify-content: space-between;

	align-items: center;

	/*box-shadow: 0px 4px 10px -10px rgba(0,0,0,0.75);*/


}

.right_bar div a{

	color: #001a46;

}

.background-top{
	border-bottom-left-radius: 15px;
	
	border-bottom-right-radius: 15px;

	background: #007bff;
	
	position: absolute;
	
	height: 200px !important;
	
	z-index: 0;
	
	width: 100%;
}


table th{

	font-size: 0.8em;

	font-family: 'helvetica';

	text-transform: uppercase;

	font-weight: 700;

}
table td{
	font-size: 0.9em;
}

.seccion_title{

	padding: 20 0px;

	border-bottom: 1px solid #f1f1f1;

	margin-bottom: 20px;

	display: flex;

	align-items: center;

	justify-content: space-between;

	flex-wrap: wrap;

}

.seccion_title h2{

	color: #2196f3;

	/*text-transform: uppercase;*/

	font-size: 1.1em;

	font-weight: 600;

	padding: 20px 0;

}



.filtros{

	padding: 10 0px;

	display: none;

}

.formFilter label{

	color: gray;

	font-size: 0.7em;

	text-transform: uppercase;

}




/* --------- BOTONES -------------------------------------- */

.menu_button{

	font-size: 1.2em;

	display: none;

}

.menu_button i:hover{

	transition: all 0.5s ease-in-out;

	transform: rotateY(180deg);

}

#close_menu{

    position: absolute;

    right: 5px;

}



#filterButton{

	margin: 10px 0;
    
    background: transparent;

    border: none;

    font-size: 0.9em;
    
    color: cornflowerblue;

    cursor: pointer;

}

.btn-success:not(#reservar_pasajes){
	/* color: #0da212 !important; */
}

.btnSubmit{

	border-radius: 15px;

    width: 200px;

    background: #3f51b5;

    border: none;

}

.btnVolver{

	color: cornflowerblue;

/*    text-transform: uppercase;*/

    font-weight: 500;

}

#searchFlights{
	color: #fff !important;
}
/* --------- LOGIN -------------------------------------- */

#login_container{

	position: absolute;

	top: 0;

	padding: 0;

	bottom: 0;

	background: url('../../assets/img/fondo.jpeg') center no-repeat; 

}

.background_image{

	position: relative;

	top: 0;

	height: 100%;

	right: 0;

	left: 0;

	bottom: 0;

}


.top_login{

	margin: 30px 0;

}

.top_login img{

	max-width: 126px;

}

#login_form{

	grid-column: 2 / span 2 ;

	grid-row: 2 ;
}

#back_button{

	font-size: 2em;
    
    grid-row: 1;
    
    grid-column: 1;
    
    position: absolute;
    
    top: 0;

    cursor: pointer;

}

.filterBtn{
	color: cornflowerblue;
}
#createBtn{
	color: #0da212;
}

.footer_login{
	
	grid-row: 3;
	
	grid-column: 2 / span 2;
	
	align-items: center;
}

.title-login{

	font-size: 1.2em;

	font-weight: 600;

	grid-row: 1;
	
	grid-column: 2 / span 2;
}

.animate_entrance{
	animation: 600ms entrance ease-in-out;
}


/* --------- ASIDE -------------------------------------- */

.datos-usuario{


}

.datos-usuario li{
	
	color: #fff;
	
	font-size: 0.9em;
}

#logo-empresa{
		/*max-width: 180px !important;*/
}

.grid-content{

	
	display: grid ;
	
	grid-template-columns: 300px 2fr;
	
	grid-gap: 10;
}

.grid-20{

    grid-column: 1;

    height: 100%;

}



.grid-80 {

    padding-bottom: 20px;

    grid-column: 2 /sp;

}

aside#aside_bar{


	overflow-y: hidden;
	
	/* height: 100vh; */
	
	overflow: auto;
	
	/*position: sticky;

	top: 0;*/

}

aside .aside_link {

	border-bottom: 1px solid #efefef;

	display: flex;

	justify-content: space-between;

	align-items: center;

	padding: 20px;

	padding-right: 10px;

	width: 100%;

	font-weight: 500;

	color: #848282;

}

aside i{

	width: 30px;

	display: block;	

}

aside i.fas.fa-angle-down{
	text-align: right;
}

aside .aside_link:hover{

	transition: 0.5s all;

	/*background: #a3a3a3; */

	color: #007bff;

}



aside .mensaje_bienvenida{

	padding: 10px;

	color: white;

	margin-bottom: 0;

}


aside .active{

	background: #38383814;

   /* border-left: 3px solid #3f51b5;*/

}

aside .active span i, aside .active span {

	color: #2196F3 ;
}


aside .collapse_link .active{

	background: transparent;

	border: none;
	
	color: #007bff;

	font-weight: bold;

}

aside .collapse_link .aside_link{	

	padding: 10px 50px;
	
	font-size: 0.9em;

	font-weight: 500;



}

aside .aside_container{
	
	display: grid;

	grid-template-rows: 140px 2fr 50px;

	height: 100%;

	overflow-y: hidden; 
}

aside .container-list{


	/*margin: 0 10px;*/

	background: #fff;
	
	grid-row: 2;

	box-shadow: 0px 7px 10px -10px rgba(0,0,0,0.75);

	border-radius: 5px;
	

}

aside .container-list ul{
	
	background: #fff;


	border-radius: 10px;

}

aside #cerrar_menu{
	display: none;
}

aside .footer-responsive{
	
	display: none;
}

aside .welocome-aside{

	font-size: 1.2em;
    
    padding: 30px 0;
    
    border-bottom: 1px solid #efefef;

    margin: 0;

    color: #112952;
}

.cardBox{

	padding: 20px;

	height: 100%;


	box-shadow: 0px 4px 10px -6px rgba(0,0,0,0.75);

}
aside .collapse-link .aside_link{

	border: none ;

}

.cardBox h3{

	margin-bottom: 20px;

	font-weight: 600;

    font-size: 1em;

    color: #3f51c6;

}

.cardBox p{

	color: gray;

    font-size: 0.9em;

}



#preloader{

	position: fixed;

	top:0;

	bottom: 0;

	left: 0;

	right: 0;

	width: 100%;

	background: #000000b0;

	display: none;

	color: #fff;

	z-index: 50;

}

#preloader span{

	font-size: 1.2em;

}

#preloader div{

	display: flex;

	align-items: center;

	position: absolute;

	left: 50%;

	top: 50%;

	transform: translate(-50%, -50%);

}

#parametros_generales{

	display: grid;

	grid-template-columns: 1fr 1fr;

	grid-gap: 20px; 
}


/* --------- RESERVAS -------------------------------------- */

#reservaTable tbody{

	font-size: 0.9em;

}



/* --------- ESTADISTICAS -------------------------------------- */

.stats{

	border-radius: 3px;

}

.stats h3{

	font-size: 1em;

	text-align: center;

	font-weight: 600;

}

/* --------- FOOTER -------------------------------------- */

footer{

	padding-top: 20px;

	color: gray;

	/*border-top: 1.5px solid #f1f1f1;*/

	text-align: center;

}

footer p{

	font-size: 0.8em;

	margin: 0;

}




@media (max-width: 980px )  {

	aside .top_bar{

		height: 80px;

		background: #7099d6;
	}

	.grid-content{

		grid-template-columns: 1fr;
	} 

	aside{

		background: #fff;

		padding: 0 !important; 

	}

	aside .footer-responsive{
	
		display: block;
	
	}

	.datos-usuario{
		flex-wrap: wrap;
	}

	aside #cerrar_menu{
	
		display: block;

		color: #292929;

		font-size: 1.2em;

		cursor: pointer;
	
	}

	aside #logo-empresa{

		 max-width: 200px !important;
	}

	aside .container-list{
		box-shadow: 0 0 black; 
	}

	aside .aside_container{

		overflow-y: auto;

		grid-template-rows: 80px 2fr 50px;

	}


	#aside_bar{

		display: none;

		position: absolute;

		z-index: 2;

		top: 0;

		bottom: 0;

	}

	#logout{
		
		display: none

	}

	.menu_button{

		display: block;

		position: absolute;

		top: 20px;

		left: 20px
	}

	.menu_button i{
		color: #fff;

	}

	.grid-80{

		grid-column: 1 / span 2;
		padding: 0;
	}

	#login_box{

		width: 100%;
	
	}

}

@media (max-width: 550px )  {


	
	#login_box{

		grid-template-columns: 20px 2fr 2fr 20px;
	}

	.title-login{
		font-size: 1.4em;
	}
	
/*	.top_login img{

		max-width: 100%;
	}*/
	
	#back_button{
		top: 20px;
	}
	
	#parametros_generales div{
	
		grid-column: 1 / span 2;
	
	}

	.results-window{
		
		padding: 0 !important;
	}


}

@keyframes entrance{
	
	0% {
	   
	  /*  top: 0*/
	   
	    opacity: 0;
	 }

	100% {
	   	
	/*   	top: 50%;*/
	    
	    opacity: 100%;
	}
}