@import "libraries/bootstrap 4.3.1/vendor/twbs/bootstrap/dist/css/bootstrap.css";

body {
  color: var(--dark);
  background-color: var(--white);
  font-family: var(--font-family-sans-serif);
}

a:hover{
	text-decoration: none;
}

/*******************************************************************/

/**************************   GENERALES   **************************/

/*******************************************************************/

.gradient-background{
	background: linear-gradient(90deg, var(--primary), var(--secondary));
	background-size: 150% 150%;
	-webkit-animation: Gradient 10s ease infinite;
	-moz-animation: Gradient 10s ease infinite;
	animation: Gradient 10s ease infinite;	
}

.dark-opacity{
	filter: brightness(50%) contrast(80%);
	-webkit-filter: brightness(50%) contrast(80%);	
}

form{
	margin: 0;
}

.divider-sm{
	height: 2px;
	width: 50px;
}

.divider-plus hr:first-child{
	height: 1px;
	width: 15%;
	margin-top: 0;
}

.divider-plus hr:last-child{
	height: 1px;
	opacity: 0.5;
	width: 85%;
	margin-top: 0;
}

.divider-plus{
	display: flex!important;
}

.bg-image{
	background-size: cover;
  background-position: center, center;
  background-repeat: no-repeat;
}

.no-margin{
	margin: 0!important;
}

.btn-outline-white{
	color:var(--white);
	border-color:var(--white);
}

.btn-outline-white:hover, .btn-outline-white:focus, .btn-outline-white:active{
	color:var(--dark);
	background-color: var(--white);
	border-color:var(--white);
}

/* Aspect Ratio */

.aspect-ratio{
	position: relative;
	margin: auto;
}

.aspect-ratio *{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;	
}

.aspect-ratio:before{
	content: "";
	display: block;	
}

.ratio-1-1:before{
	padding-top: 100%;
}

.ratio-16-9:before{
	padding-top: 56.25%; 
}

.ratio-4-3:before{
	padding-top: 75%; 
}

.ratio-3-2:before{
	padding-top: 66%; 
}

.ratio-8-5:before{
	padding-top: 62.5%; 
}

/* Efectos */

@-webkit-keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

@-moz-keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

@keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

/* Navegador */

.navbar-nav .nav-item.active{
	background-color: var(--primary);
  border-radius: 0.25rem;	
}

.navbar-nav .nav-item.active a.nav-link{
	color: var(--white);
}

.navbar-expand-xl{
	position: fixed;
	background-color: var(--white);
	width: 100%;
	z-index: 99999;
}

/* Menú Lateral */

#menu-lateral{
	width: 400px;
	height: calc(100vh - 56px);
	position: fixed;
	top:56px;
	background-color: var(--white);
	z-index: 99999;
	left: -400px;
	transition: 0.5s ease;
}

#menu-lateral.show{
	left: 0;
}

/* Slider */

.carousel-inner, .carousel-item{
	max-height: 70vh;
	background-color: black;
}

/* Gritter */

.gritter-top, .gritter-item, .gritter-bottom{
  background: none!important;
}

.gritter-close{
 right: 3px!important;
 left: inherit!important;
}

.gritter-title{
	text-shadow: none!important;
}