/* 
	
	VARIABLES
	
*/

@color-brand: #496DF1;
@color-brand-hover: darken(@color-brand, 15%);
@color-black: #353535;
@color-white: #FFFFFF;
@color-light-gray: #f9f9f9;
@color-dark-gray: #424346;
@color-terciary :rgba(73, 110, 243, 0.82);

@pixels-s: 10px;
@pixels-m: 30px;
@pixels-l: 40px;
@pixels-xl: 50px;
@pixels-xxl: 100px;

@screen-xs: 520px;
@screen-s: 640px;
@screen-m: 960px;
@screen-l: 1200px;
@screen-xl: 1600px;

@less-black: lighten(@color-black,20%);


.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, h1, h2, h3, h4, h5, h6{
	font-family:inherit!important;
}


/* 
	
	GENERALES   
	
*/

body {
	overflow-x: hidden;
	font-family: 'Work Sans', sans-serif;	
}

.uk-border-rounded-xl {
	border-radius: 12px;
	overflow: hidden;
}

.uk-transition-toggle.uk-active{
	visibility:visible!important;
}

.text-black{
	color:@color-black!important;
}

.text-light-black {
	color: @less-black!important;
}

.text-white{
	color:@color-white;
}

.text-dark-gray{
	 color:#424346;
}

.text-light-gray{
	color:#B2B2B2;
}

.color-brand{
	color:@color-brand!important;
}

.bg-black{
	background: @color-black;
}

.bg-white{
	background: @color-white;
}

.bg-light-gray{
	background: @color-light-gray!important;
}

.text-light{
	font-weight:100;
}

.text-medium{
	font-weight: 500;
}

.text-bold{
	font-weight:700;
}

.logo{
	width:200px!important;
	@media screen and (max-width:639px) {
		& {
			width:70px;
		}
	}
}

.z-index{
	z-index: 9999!important;
}

.uk-height-xlarge{
	height:600px;
	@media screen and (max-width:960px) {
		& {
			height:750px;
		}
	}

}



/* 
	
	SLIDESHOW   
	
*/



.uk-card .uk-slideshow-items {
	@media screen and (min-width:639px) {
		& {
			height:100%!important;
		}
	}
}


.uk-dotnav>*>* {
	border-radius: 0 !important;
	height: 5px !important;
	background-color: white;
	display: block;
	box-sizing: border-box;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	transition: .2s ease-in-out;
	transition-property: background-color;
	&:hover {
		background-color: @color-brand !important;
	}

	@media screen and (min-width: @screen-l) {
		& {
			width: 40px !important;
			margin-top: 5px;
		}
	}
}



.uk-dotnav .uk-active a{
	background-color:@color-brand!important;
}





/* 
	
	NAVBAR     
	
*/


header{
	background-color:white;
	padding-top:30px;
	padding-bottom:30px;
	
	&.uk-sticky-fixed.uk-active{
		padding:0!important;
		transition:padding ease 0.4s;
	}
}



.uk-navbar {
	background:@color-white;
	@media screen and (max-width:639px) {
		& {
			padding:0px;
		}
	}
	
	li a{
		font-size:1em;
		font-weight:400;
	}
	.uk-navbar-nav li a{
		text-decoration:none;
		text-transform: none;
	}	
	.uk-navbar-right a:hover{
		text-decoration:none;
		color:@color-brand!important;
	}
	
}


.uk-navbar-dropdown {
    display: none;
    position: absolute;
    z-index: 1020;
    box-sizing: border-box;
    width: 240px;
    padding: 25px;
    background: #fff;
    color: #666;
    box-shadow: 0 5px 12px rgba(0,0,0,.15);
    margin-top:-20px;
}


/* 
	
	OFFCANVAS
	
*/





#offcanvas-flip-push .uk-offcanvas-bar{
	background-color:white;
	color:@color-black;
	& .uk-offcanvas-close{
		color:@color-black;
	}
}



#offcanvas-nav-primary{
	.uk-icon-button{
		color:@color-black;
		border:1px solid @color-black;
		margin-bottom:5px;
	}
	.uk-icon-button:hover{
		background-color:@color-black;
		color:@color-white;
		
	}

	.uk-offcanvas-bar{
    background-size: cover;
    background-position: center bottom;
	background-color:white;
	}
	ul li a{
		color:@color-black!important;
		transition: color ease 0.4s;
		&:hover{
		color:@color-brand!important;
		}
	}
	
}






/* 
	
	BOTONES
	
*/


.btn-brand{
	background-color: @color-brand;
	color: @color-white;
	padding: 17px 17px;
	font-size:0.9em!important;
	text-transform: uppercase;
	cursor: pointer;
	border:none;
	&:hover{
		background-color: @color-brand-hover;
		color:white!important;
		text-decoration:none!important;
		transition:all ease 0.4s; 
	}
}	


.uk-button-text {
    padding: 0;
    color: #272424;

    letter-spacing: 1px;
	&:hover{
		text-decoration:none!important;
		border-bottom:none!important;
	}
	
}






/* 
	
	OVERLAYS
	
*/


.uk-overlay-primary {
    background: rgba(53, 53, 53, 0.95);
}

.uk-overlay-blue{
    background:rgba(73, 110, 243, 0.82);
    opacity:0;
    &:hover{
		opacity:1;
		transition:opacity ease-in-out 0.4s;
	
	}
	@media screen and (max-width:639px) {
		& {
			opacity:1!important;
			
		}
	}
}

.uk-position-cover-phone{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	@media screen and (max-width:639px) {
		& {
			opacity:1!important;
			top:75%;
		}			
			
	}
	
}

.uk-overlay-terciary{
	background:rgba(53, 53, 53, 0.5);
    opacity:1;
    &:hover{
		background:rgba(73, 110, 243, 0.82);
		transition:background ease-in-out 0.4s;
	
	}
}
.background-terciary {
	background: @color-terciary;
}

.uk-overlay-lighter{
	background:rgba(53, 53, 53, 0.7);
    opacity:1;
}

.uk-overlay-icon{
	color:rgba(224, 224, 224, 1);
}




/* 
	
	Footer
	
*/


footer {
	background: @color-black;
	a {
		color: white;
		&:hover {
			color:@color-brand!important;
			text-decoration:none;
		}
	}
}

footer .uk-icon-button{
	background:transparent;
	border:1px solid white;
	color:white;
	&:hover{
		background:@color-brand;
		border:1px solid @color-brand;
		color:white!important;
	}
}