// SCROLLBARS =====================================================================================
::-webkit-scrollbar {
	width: 6px;
	height: 6px;
}
::-webkit-scrollbar-track {
	background-color: #e6e6e6;
}
::-webkit-scrollbar-thumb {
	background-color: @g3;
}
::-moz-scrollbar {
	width: 6px;
	height: 6px;
}
::-moz-scrollbar-track {
	background-color-color: #e6e6e6;
}
::-moz-scrollbar-thumb {
	background-color: @g3;
}

// SELECCIÓN DE TEXTO =============================================================================
::-moz-selection {
    color: @b;
    background: @n;
}
::selection {
    color: @b;
    background: @n;
}

// PADDINGS & MARGINS =============================================================================
// PADDINGS eje Y
.py-0px { padding-top: 0px @i; padding-bottom: 0px @i; }
.pt-0px { padding-top: 0px @i; }
.pb-0px { padding-bottom: 0px @i; }
.py-5px { padding-top: 5px @i; padding-bottom: 5px @i; }
.pt-5px { padding-top: 5px @i; }
.pb-5px { padding-bottom: 5px @i; }
.py-10px { padding-top: 10px @i; padding-bottom: 10px @i; }
.pt-10px { padding-top: 10px @i; }
.pb-10px { padding-bottom: 10px @i; }
.py-15px { padding-top: 15px @i; padding-bottom: 15px @i; }
.pt-15px { padding-top: 15px @i; }
.pb-15px { padding-bottom: 15px @i; }
.py-20px { padding-top: 20px @i; padding-bottom: 20px @i; }
.pt-20px { padding-top: 20px @i; }
.pb-20px { padding-bottom: 20px @i; }
.py-25px { padding-top: 25px @i; padding-bottom: 25px @i; }
.pt-25px { padding-top: 25px @i; }
.pb-25px { padding-bottom: 25px @i; }
.py-30px { padding-top: 30px @i; padding-bottom: 30px @i; }
.pt-30px { padding-top: 30px @i; }
.pb-30px { padding-bottom: 30px @i; }
.py-50px { padding-top: 50px @i; padding-bottom: 50px @i; }
.pt-50px { padding-top: 50px @i; }
.pb-50px { padding-bottom: 50px @i; }
.py-75px { padding-top: 75px @i; padding-bottom: 75px @i; }
.pt-75px { padding-top: 75px @i; }
.pb-75px { padding-bottom: 75px @i; }
.py-100px { padding-top: 100px @i; padding-bottom: 100px @i; }
.pt-100px { padding-top: 100px @i; }
.pb-100px { padding-bottom: 100px @i; }
.py-125px { padding-top: 125px @i; padding-bottom: 125px @i; }
.pt-125px { padding-top: 125px @i; }
.pb-125px { padding-bottom: 125px @i; }
.py-150px { padding-top: 150px @i; padding-bottom: 150px @i; }
.pt-150px { padding-top: 150px @i; }
.pb-150px { padding-bottom: 150px @i; }
.py-200px { padding-top: 200px @i; padding-bottom: 200px @i; }
.pt-200px { padding-top: 200px @i; }
.pb-200px { padding-bottom: 200px @i; }
.py-250px { padding-top: 250px @i; padding-bottom: 250px @i; }
.pt-250px { padding-top: 250px @i; }
.pb-250px { padding-bottom: 250px @i; }

// PADDINGS eje X
.px-0px { padding-left: 0px @i; padding-right: 0px @i; }
.pl-0px { padding-left: 0px @i; }
.pr-0px { padding-right: 0px @i; }
.px-5px { padding-left: 5px @i; padding-right: 5px @i; }
.pl-5px { padding-left: 5px @i; }
.pr-5px { padding-right: 5px @i; }
.px-10px { padding-left: 10px @i; padding-right: 10px @i; }
.pl-10px { padding-left: 10px @i; }
.pr-10px { padding-right: 10px @i; }
.px-15px { padding-left: 15px @i; padding-right: 15px @i; }
.pl-15px { padding-left: 15px @i; }
.pr-15px { padding-right: 15px @i; }
.px-20px { padding-left: 20px @i; padding-right: 20px @i; }
.pl-20px { padding-left: 20px @i; }
.pr-20px { padding-right: 20px @i; }
.px-25px { padding-left: 25px @i; padding-right: 25px @i; }
.pl-25px { padding-left: 25px @i; }
.pr-25px { padding-right: 25px @i; }
.px-30px { padding-left: 30px @i; padding-right: 30px @i; }
.pl-30px { padding-left: 30px @i; }
.pr-30px { padding-right: 30px @i; }
.px-50px { padding-left: 50px @i; padding-right: 50px @i; }
.pl-50px { padding-left: 50px @i; }
.pr-50px { padding-right: 50px @i; }
.px-75px { padding-left: 75px @i; padding-right: 75px @i; }
.pl-75px { padding-left: 75px @i; }
.pr-75px { padding-right: 75px @i; }
.px-100px { padding-left: 100px @i; padding-right: 100px @i; }
.pl-100px { padding-left: 100px @i; }
.pr-100px { padding-right: 100px @i; }
.px-125px { padding-left: 125px @i; padding-right: 125px @i; }
.pl-125px { padding-left: 125px @i; }
.pr-125px { padding-right: 125px @i; }
.px-150px { padding-left: 150px @i; padding-right: 150px @i; }
.pl-150px { padding-left: 150px @i; }
.pr-150px { padding-right: 150px @i; }
.px-200px { padding-left: 200px @i; padding-right: 200px @i; }
.pl-200px { padding-left: 200px @i; }
.pr-200px { padding-right: 200px @i; }
.px-250px { padding-left: 250px @i; padding-right: 250px @i; }
.pl-250px { padding-left: 250px @i; }
.pr-250px { padding-right: 250px @i; }

// MARGINS eje Y
.my-0px { margin-top: 0px @i; margin-bottom: 0px @i; }
.mt-0px { margin-top: 0px @i; }
.mb-0px { margin-bottom: 0px @i; }
.my-5px { margin-top: 5px @i; margin-bottom: 5px @i; }
.mt-5px { margin-top: 5px @i; }
.mb-5px { margin-bottom: 5px @i; }
.my-10px { margin-top: 10px @i; margin-bottom: 10px @i; }
.mt-10px { margin-top: 10px @i; }
.mb-10px { margin-bottom: 10px @i; }
.my-15px { margin-top: 15px @i; margin-bottom: 15px @i; }
.mt-15px { margin-top: 15px @i; }
.mb-15px { margin-bottom: 15px @i; }
.my-20px { margin-top: 20px @i; margin-bottom: 20px @i; }
.mt-20px { margin-top: 20px @i; }
.mb-20px { margin-bottom: 20px @i; }
.my-25px { margin-top: 25px @i; margin-bottom: 25px @i; }
.mt-25px { margin-top: 25px @i; }
.mb-25px { margin-bottom: 25px @i; }
.my-30px { margin-top: 30px @i; margin-bottom: 30px @i; }
.mt-30px { margin-top: 30px @i; }
.mb-30px { margin-bottom: 30px @i; }
.my-50px { margin-top: 50px @i; margin-bottom: 50px @i; }
.mt-50px { margin-top: 50px @i; }
.mb-50px { margin-bottom: 50px @i; }
.my-75px { margin-top: 75px @i; margin-bottom: 75px @i; }
.mt-75px { margin-top: 75px @i; }
.mb-75px { margin-bottom: 75px @i; }
.my-100px { margin-top: 100px @i; margin-bottom: 100px @i; }
.mt-100px { margin-top: 100px @i; }
.mb-100px { margin-bottom: 100px @i; }
.my-125px { margin-top: 125px @i; margin-bottom: 125px @i; }
.mt-125px { margin-top: 125px @i; }
.mb-125px { margin-bottom: 125px @i; }
.my-150px { margin-top: 150px @i; margin-bottom: 150px @i; }
.mt-150px { margin-top: 150px @i; }
.mb-150px { margin-bottom: 150px @i; }
.my-200px { margin-top: 200px @i; margin-bottom: 200px @i; }
.mt-200px { margin-top: 200px @i; }
.mb-200px { margin-bottom: 200px @i; }
.my-250px { margin-top: 250px @i; margin-bottom: 250px @i; }
.mt-250px { margin-top: 250px @i; }
.mb-250px { margin-bottom: 250px @i; }

// MARGINS eje X
.mx-0px { margin-left: 0px @i; margin-right: 0px @i; }
.ml-0px { margin-left: 0px @i; }
.mr-0px { margin-right: 0px @i; }
.mx-5px { margin-left: 5px @i; margin-right: 5px @i; }
.ml-5px { margin-left: 5px @i; }
.mr-5px { margin-right: 5px @i; }
.mx-10px { margin-left: 10px @i; margin-right: 10px @i; }
.ml-10px { margin-left: 10px @i; }
.mr-10px { margin-right: 10px @i; }
.mx-15px { margin-left: 15px @i; margin-right: 15px @i; }
.ml-15px { margin-left: 15px @i; }
.mr-15px { margin-right: 15px @i; }
.mx-20px { margin-left: 20px @i; margin-right: 20px @i; }
.ml-20px { margin-left: 20px @i; }
.mr-20px { margin-right: 20px @i; }
.mx-25px { margin-left: 25px @i; margin-right: 25px @i; }
.ml-25px { margin-left: 25px @i; }
.mr-25px { margin-right: 25px @i; }
.mx-30px { margin-left: 30px @i; margin-right: 30px @i; }
.ml-30px { margin-left: 30px @i; }
.mr-30px { margin-right: 30px @i; }
.mx-50px { margin-left: 50px @i; margin-right: 50px @i; }
.ml-50px { margin-left: 50px @i; }
.mr-50px { margin-right: 50px @i; }
.mx-75px { margin-left: 75px @i; margin-right: 75px @i; }
.ml-75px { margin-left: 75px @i; }
.mr-75px { margin-right: 75px @i; }
.mx-100px { margin-left: 100px @i; margin-right: 100px @i; }
.ml-100px { margin-left: 100px @i; }
.mr-100px { margin-right: 100px @i; }
.mx-125px { margin-left: 125px @i; margin-right: 125px @i; }
.ml-125px { margin-left: 125px @i; }
.mr-125px { margin-right: 125px @i; }
.mx-150px { margin-left: 150px @i; margin-right: 150px @i; }
.ml-150px { margin-left: 150px @i; }
.mr-150px { margin-right: 150px @i; }
.mx-200px { margin-left: 200px @i; margin-right: 200px @i; }
.ml-200px { margin-left: 200px @i; }
.mr-200px { margin-right: 200px @i; }
.mx-250px { margin-left: 250px @i; margin-right: 250px @i; }
.ml-250px { margin-left: 250px @i; }
.mr-250px { margin-right: 250px @i; }

// PADDINGS & MARGINS MEDIA QUERIES ===============================================================
@media only screen and (max-width: 1799px) {
	// PADDINGS eje Y
	.xxl-py-0px { padding-top: 0px @i; padding-bottom: 0px @i; }
	.xxl-pt-0px { padding-top: 0px @i; }
	.xxl-pb-0px { padding-bottom: 0px @i; }
	.xxl-py-5px { padding-top: 5px @i; padding-bottom: 5px @i; }
	.xxl-pt-5px { padding-top: 5px @i; }
	.xxl-pb-5px { padding-bottom: 5px @i; }
	.xxl-py-10px { padding-top: 10px @i; padding-bottom: 10px @i; }
	.xxl-pt-10px { padding-top: 10px @i; }
	.xxl-pb-10px { padding-bottom: 10px @i; }
	.xxl-py-15px { padding-top: 15px @i; padding-bottom: 15px @i; }
	.xxl-pt-15px { padding-top: 15px @i; }
	.xxl-pb-15px { padding-bottom: 15px @i; }
	.xxl-py-20px { padding-top: 20px @i; padding-bottom: 20px @i; }
	.xxl-pt-20px { padding-top: 20px @i; }
	.xxl-pb-20px { padding-bottom: 20px @i; }
	.xxl-py-25px { padding-top: 25px @i; padding-bottom: 25px @i; }
	.xxl-pt-25px { padding-top: 25px @i; }
	.xxl-pb-25px { padding-bottom: 25px @i; }
	.xxl-py-30px { padding-top: 30px @i; padding-bottom: 30px @i; }
	.xxl-pt-30px { padding-top: 30px @i; }
	.xxl-pb-30px { padding-bottom: 30px @i; }
	.xxl-py-50px { padding-top: 50px @i; padding-bottom: 50px @i; }
	.xxl-pt-50px { padding-top: 50px @i; }
	.xxl-pb-50px { padding-bottom: 50px @i; }
	.xxl-py-75px { padding-top: 75px @i; padding-bottom: 75px @i; }
	.xxl-pt-75px { padding-top: 75px @i; }
	.xxl-pb-75px { padding-bottom: 75px @i; }
	.xxl-py-100px { padding-top: 100px @i; padding-bottom: 100px @i; }
	.xxl-pt-100px { padding-top: 100px @i; }
	.xxl-pb-100px { padding-bottom: 100px @i; }
	.xxl-py-125px { padding-top: 125px @i; padding-bottom: 125px @i; }
	.xxl-pt-125px { padding-top: 125px @i; }
	.xxl-pb-125px { padding-bottom: 125px @i; }
	.xxl-py-150px { padding-top: 150px @i; padding-bottom: 150px @i; }
	.xxl-pt-150px { padding-top: 150px @i; }
	.xxl-pb-150px { padding-bottom: 150px @i; }
	.xxl-py-200px { padding-top: 200px @i; padding-bottom: 200px @i; }
	.xxl-pt-200px { padding-top: 200px @i; }
	.xxl-pb-200px { padding-bottom: 200px @i; }
	.xxl-py-250px { padding-top: 250px @i; padding-bottom: 250px @i; }
	.xxl-pt-250px { padding-top: 250px @i; }
	.xxl-pb-250px { padding-bottom: 250px @i; }

	// PADDINGS eje X
	.xxl-px-0px { padding-left: 0px @i; padding-right: 0px @i; }
	.xxl-pl-0px { padding-left: 0px @i; }
	.xxl-pr-0px { padding-right: 0px @i; }
	.xxl-px-5px { padding-left: 5px @i; padding-right: 5px @i; }
	.xxl-pl-5px { padding-left: 5px @i; }
	.xxl-pr-5px { padding-right: 5px @i; }
	.xxl-px-10px { padding-left: 10px @i; padding-right: 10px @i; }
	.xxl-pl-10px { padding-left: 10px @i; }
	.xxl-pr-10px { padding-right: 10px @i; }
	.xxl-px-15px { padding-left: 15px @i; padding-right: 15px @i; }
	.xxl-pl-15px { padding-left: 15px @i; }
	.xxl-pr-15px { padding-right: 15px @i; }
	.xxl-px-20px { padding-left: 20px @i; padding-right: 20px @i; }
	.xxl-pl-20px { padding-left: 20px @i; }
	.xxl-pr-20px { padding-right: 20px @i; }
	.xxl-px-25px { padding-left: 25px @i; padding-right: 25px @i; }
	.xxl-pl-25px { padding-left: 25px @i; }
	.xxl-pr-25px { padding-right: 25px @i; }
	.xxl-px-30px { padding-left: 30px @i; padding-right: 30px @i; }
	.xxl-pl-30px { padding-left: 30px @i; }
	.xxl-pr-30px { padding-right: 30px @i; }
	.xxl-px-50px { padding-left: 50px @i; padding-right: 50px @i; }
	.xxl-pl-50px { padding-left: 50px @i; }
	.xxl-pr-50px { padding-right: 50px @i; }
	.xxl-px-75px { padding-left: 75px @i; padding-right: 75px @i; }
	.xxl-pl-75px { padding-left: 75px @i; }
	.xxl-pr-75px { padding-right: 75px @i; }
	.xxl-px-100px { padding-left: 100px @i; padding-right: 100px @i; }
	.xxl-pl-100px { padding-left: 100px @i; }
	.xxl-pr-100px { padding-right: 100px @i; }
	.xxl-px-125px { padding-left: 125px @i; padding-right: 125px @i; }
	.xxl-pl-125px { padding-left: 125px @i; }
	.xxl-pr-125px { padding-right: 125px @i; }
	.xxl-px-150px { padding-left: 150px @i; padding-right: 150px @i; }
	.xxl-pl-150px { padding-left: 150px @i; }
	.xxl-pr-150px { padding-right: 150px @i; }
	.xxl-px-200px { padding-left: 200px @i; padding-right: 200px @i; }
	.xxl-pl-200px { padding-left: 200px @i; }
	.xxl-pr-200px { padding-right: 200px @i; }
	.xxl-px-250px { padding-left: 250px @i; padding-right: 250px @i; }
	.xxl-pl-250px { padding-left: 250px @i; }
	.xxl-pr-250px { padding-right: 250px @i; }

	// MARGINS eje Y
	.xxl-my-0px { margin-top: 0px @i; margin-bottom: 0px @i; }
	.xxl-mt-0px { margin-top: 0px @i; }
	.xxl-mb-0px { margin-bottom: 0px @i; }
	.xxl-my-5px { margin-top: 5px @i; margin-bottom: 5px @i; }
	.xxl-mt-5px { margin-top: 5px @i; }
	.xxl-mb-5px { margin-bottom: 5px @i; }
	.xxl-my-10px { margin-top: 10px @i; margin-bottom: 10px @i; }
	.xxl-mt-10px { margin-top: 10px @i; }
	.xxl-mb-10px { margin-bottom: 10px @i; }
	.xxl-my-15px { margin-top: 15px @i; margin-bottom: 15px @i; }
	.xxl-mt-15px { margin-top: 15px @i; }
	.xxl-mb-15px { margin-bottom: 15px @i; }
	.xxl-my-20px { margin-top: 20px @i; margin-bottom: 20px @i; }
	.xxl-mt-20px { margin-top: 20px @i; }
	.xxl-mb-20px { margin-bottom: 20px @i; }
	.xxl-my-25px { margin-top: 25px @i; margin-bottom: 25px @i; }
	.xxl-mt-25px { margin-top: 25px @i; }
	.xxl-mb-25px { margin-bottom: 25px @i; }
	.xxl-my-30px { margin-top: 30px @i; margin-bottom: 30px @i; }
	.xxl-mt-30px { margin-top: 30px @i; }
	.xxl-mb-30px { margin-bottom: 30px @i; }
	.xxl-my-50px { margin-top: 50px @i; margin-bottom: 50px @i; }
	.xxl-mt-50px { margin-top: 50px @i; }
	.xxl-mb-50px { margin-bottom: 50px @i; }
	.xxl-my-75px { margin-top: 75px @i; margin-bottom: 75px @i; }
	.xxl-mt-75px { margin-top: 75px @i; }
	.xxl-mb-75px { margin-bottom: 75px @i; }
	.xxl-my-100px { margin-top: 100px @i; margin-bottom: 100px @i; }
	.xxl-mt-100px { margin-top: 100px @i; }
	.xxl-mb-100px { margin-bottom: 100px @i; }
	.xxl-my-125px { margin-top: 125px @i; margin-bottom: 125px @i; }
	.xxl-mt-125px { margin-top: 125px @i; }
	.xxl-mb-125px { margin-bottom: 125px @i; }
	.xxl-my-150px { margin-top: 150px @i; margin-bottom: 150px @i; }
	.xxl-mt-150px { margin-top: 150px @i; }
	.xxl-mb-150px { margin-bottom: 150px @i; }
	.xxl-my-200px { margin-top: 200px @i; margin-bottom: 200px @i; }
	.xxl-mt-200px { margin-top: 200px @i; }
	.xxl-mb-200px { margin-bottom: 200px @i; }
	.xxl-my-250px { margin-top: 250px @i; margin-bottom: 250px @i; }
	.xxl-mt-250px { margin-top: 250px @i; }
	.xxl-mb-250px { margin-bottom: 250px @i; }

	// MARGINS eje X
	.xxl-mx-0px { margin-left: 0px @i; margin-right: 0px @i; }
	.xxl-ml-0px { margin-left: 0px @i; }
	.xxl-mr-0px { margin-right: 0px @i; }
	.xxl-mx-5px { margin-left: 5px @i; margin-right: 5px @i; }
	.xxl-ml-5px { margin-left: 5px @i; }
	.xxl-mr-5px { margin-right: 5px @i; }
	.xxl-mx-10px { margin-left: 10px @i; margin-right: 10px @i; }
	.xxl-ml-10px { margin-left: 10px @i; }
	.xxl-mr-10px { margin-right: 10px @i; }
	.xxl-mx-15px { margin-left: 15px @i; margin-right: 15px @i; }
	.xxl-ml-15px { margin-left: 15px @i; }
	.xxl-mr-15px { margin-right: 15px @i; }
	.xxl-mx-20px { margin-left: 20px @i; margin-right: 20px @i; }
	.xxl-ml-20px { margin-left: 20px @i; }
	.xxl-mr-20px { margin-right: 20px @i; }
	.xxl-mx-25px { margin-left: 25px @i; margin-right: 25px @i; }
	.xxl-ml-25px { margin-left: 25px @i; }
	.xxl-mr-25px { margin-right: 25px @i; }
	.xxl-mx-30px { margin-left: 30px @i; margin-right: 30px @i; }
	.xxl-ml-30px { margin-left: 30px @i; }
	.xxl-mr-30px { margin-right: 30px @i; }
	.xxl-mx-50px { margin-left: 50px @i; margin-right: 50px @i; }
	.xxl-ml-50px { margin-left: 50px @i; }
	.xxl-mr-50px { margin-right: 50px @i; }
	.xxl-mx-75px { margin-left: 75px @i; margin-right: 75px @i; }
	.xxl-ml-75px { margin-left: 75px @i; }
	.xxl-mr-75px { margin-right: 75px @i; }
	.xxl-mx-100px { margin-left: 100px @i; margin-right: 100px @i; }
	.xxl-ml-100px { margin-left: 100px @i; }
	.xxl-mr-100px { margin-right: 100px @i; }
	.xxl-mx-125px { margin-left: 125px @i; margin-right: 125px @i; }
	.xxl-ml-125px { margin-left: 125px @i; }
	.xxl-mr-125px { margin-right: 125px @i; }
	.xxl-mx-150px { margin-left: 150px @i; margin-right: 150px @i; }
	.xxl-ml-150px { margin-left: 150px @i; }
	.xxl-mr-150px { margin-right: 150px @i; }
	.xxl-mx-200px { margin-left: 200px @i; margin-right: 200px @i; }
	.xxl-ml-200px { margin-left: 200px @i; }
	.xxl-mr-200px { margin-right: 200px @i; }
	.xxl-mx-250px { margin-left: 250px @i; margin-right: 150px @i; }
	.xxl-ml-250px { margin-left: 250px @i; }
	.xxl-mr-250px { margin-right: 250px @i; }
}

@media only screen and (max-width: 1599px) {
	// PADDINGS eje Y
	.xl-py-0px { padding-top: 0px @i; padding-bottom: 0px @i; }
	.xl-pt-0px { padding-top: 0px @i; }
	.xl-pb-0px { padding-bottom: 0px @i; }
	.xl-py-5px { padding-top: 5px @i; padding-bottom: 5px @i; }
	.xl-pt-5px { padding-top: 5px @i; }
	.xl-pb-5px { padding-bottom: 5px @i; }
	.xl-py-10px { padding-top: 10px @i; padding-bottom: 10px @i; }
	.xl-pt-10px { padding-top: 10px @i; }
	.xl-pb-10px { padding-bottom: 10px @i; }
	.xl-py-15px { padding-top: 15px @i; padding-bottom: 15px @i; }
	.xl-pt-15px { padding-top: 15px @i; }
	.xl-pb-15px { padding-bottom: 15px @i; }
	.xl-py-20px { padding-top: 20px @i; padding-bottom: 20px @i; }
	.xl-pt-20px { padding-top: 20px @i; }
	.xl-pb-20px { padding-bottom: 20px @i; }
	.xl-py-25px { padding-top: 25px @i; padding-bottom: 25px @i; }
	.xl-pt-25px { padding-top: 25px @i; }
	.xl-pb-25px { padding-bottom: 25px @i; }
	.xl-py-30px { padding-top: 30px @i; padding-bottom: 30px @i; }
	.xl-pt-30px { padding-top: 30px @i; }
	.xl-pb-30px { padding-bottom: 30px @i; }
	.xl-py-50px { padding-top: 50px @i; padding-bottom: 50px @i; }
	.xl-pt-50px { padding-top: 50px @i; }
	.xl-pb-50px { padding-bottom: 50px @i; }
	.xl-py-75px { padding-top: 75px @i; padding-bottom: 75px @i; }
	.xl-pt-75px { padding-top: 75px @i; }
	.xl-pb-75px { padding-bottom: 75px @i; }
	.xl-py-100px { padding-top: 100px @i; padding-bottom: 100px @i; }
	.xl-pt-100px { padding-top: 100px @i; }
	.xl-pb-100px { padding-bottom: 100px @i; }
	.xl-py-125px { padding-top: 125px @i; padding-bottom: 125px @i; }
	.xl-pt-125px { padding-top: 125px @i; }
	.xl-pb-125px { padding-bottom: 125px @i; }
	.xl-py-150px { padding-top: 150px @i; padding-bottom: 150px @i; }
	.xl-pt-150px { padding-top: 150px @i; }
	.xl-pb-150px { padding-bottom: 150px @i; }
	.xl-py-200px { padding-top: 200px @i; padding-bottom: 200px @i; }
	.xl-pt-200px { padding-top: 200px @i; }
	.xl-pb-200px { padding-bottom: 200px @i; }
	.xl-py-250px { padding-top: 250px @i; padding-bottom: 250px @i; }
	.xl-pt-250px { padding-top: 250px @i; }
	.xl-pb-250px { padding-bottom: 250px @i; }

	// PADDINGS eje X
	.xl-px-0px { padding-left: 0px @i; padding-right: 0px @i; }
	.xl-pl-0px { padding-left: 0px @i; }
	.xl-pr-0px { padding-right: 0px @i; }
	.xl-px-5px { padding-left: 5px @i; padding-right: 5px @i; }
	.xl-pl-5px { padding-left: 5px @i; }
	.xl-pr-5px { padding-right: 5px @i; }
	.xl-px-10px { padding-left: 10px @i; padding-right: 10px @i; }
	.xl-pl-10px { padding-left: 10px @i; }
	.xl-pr-10px { padding-right: 10px @i; }
	.xl-px-15px { padding-left: 15px @i; padding-right: 15px @i; }
	.xl-pl-15px { padding-left: 15px @i; }
	.xl-pr-15px { padding-right: 15px @i; }
	.xl-px-20px { padding-left: 20px @i; padding-right: 20px @i; }
	.xl-pl-20px { padding-left: 20px @i; }
	.xl-pr-20px { padding-right: 20px @i; }
	.xl-px-25px { padding-left: 25px @i; padding-right: 25px @i; }
	.xl-pl-25px { padding-left: 25px @i; }
	.xl-pr-25px { padding-right: 25px @i; }
	.xl-px-30px { padding-left: 30px @i; padding-right: 30px @i; }
	.xl-pl-30px { padding-left: 30px @i; }
	.xl-pr-30px { padding-right: 30px @i; }
	.xl-px-50px { padding-left: 50px @i; padding-right: 50px @i; }
	.xl-pl-50px { padding-left: 50px @i; }
	.xl-pr-50px { padding-right: 50px @i; }
	.xl-px-75px { padding-left: 75px @i; padding-right: 75px @i; }
	.xl-pl-75px { padding-left: 75px @i; }
	.xl-pr-75px { padding-right: 75px @i; }
	.xl-px-100px { padding-left: 100px @i; padding-right: 100px @i; }
	.xl-pl-100px { padding-left: 100px @i; }
	.xl-pr-100px { padding-right: 100px @i; }
	.xl-px-125px { padding-left: 125px @i; padding-right: 125px @i; }
	.xl-pl-125px { padding-left: 125px @i; }
	.xl-pr-125px { padding-right: 125px @i; }
	.xl-px-150px { padding-left: 150px @i; padding-right: 150px @i; }
	.xl-pl-150px { padding-left: 150px @i; }
	.xl-pr-150px { padding-right: 150px @i; }
	.xl-px-200px { padding-left: 200px @i; padding-right: 200px @i; }
	.xl-pl-200px { padding-left: 200px @i; }
	.xl-pr-200px { padding-right: 200px @i; }
	.xl-px-250px { padding-left: 250px @i; padding-right: 250px @i; }
	.xl-pl-250px { padding-left: 250px @i; }
	.xl-pr-250px { padding-right: 250px @i; }

	// MARGINS eje Y
	.xl-my-0px { margin-top: 0px @i; margin-bottom: 0px @i; }
	.xl-mt-0px { margin-top: 0px @i; }
	.xl-mb-0px { margin-bottom: 0px @i; }
	.xl-my-5px { margin-top: 5px @i; margin-bottom: 5px @i; }
	.xl-mt-5px { margin-top: 5px @i; }
	.xl-mb-5px { margin-bottom: 5px @i; }
	.xl-my-10px { margin-top: 10px @i; margin-bottom: 10px @i; }
	.xl-mt-10px { margin-top: 10px @i; }
	.xl-mb-10px { margin-bottom: 10px @i; }
	.xl-my-15px { margin-top: 15px @i; margin-bottom: 15px @i; }
	.xl-mt-15px { margin-top: 15px @i; }
	.xl-mb-15px { margin-bottom: 15px @i; }
	.xl-my-20px { margin-top: 20px @i; margin-bottom: 20px @i; }
	.xl-mt-20px { margin-top: 20px @i; }
	.xl-mb-20px { margin-bottom: 20px @i; }
	.xl-my-25px { margin-top: 25px @i; margin-bottom: 25px @i; }
	.xl-mt-25px { margin-top: 25px @i; }
	.xl-mb-25px { margin-bottom: 25px @i; }
	.xl-my-30px { margin-top: 30px @i; margin-bottom: 30px @i; }
	.xl-mt-30px { margin-top: 30px @i; }
	.xl-mb-30px { margin-bottom: 30px @i; }
	.xl-my-50px { margin-top: 50px @i; margin-bottom: 50px @i; }
	.xl-mt-50px { margin-top: 50px @i; }
	.xl-mb-50px { margin-bottom: 50px @i; }
	.xl-my-75px { margin-top: 75px @i; margin-bottom: 75px @i; }
	.xl-mt-75px { margin-top: 75px @i; }
	.xl-mb-75px { margin-bottom: 75px @i; }
	.xl-my-100px { margin-top: 100px @i; margin-bottom: 100px @i; }
	.xl-mt-100px { margin-top: 100px @i; }
	.xl-mb-100px { margin-bottom: 100px @i; }
	.xl-my-125px { margin-top: 125px @i; margin-bottom: 125px @i; }
	.xl-mt-125px { margin-top: 125px @i; }
	.xl-mb-125px { margin-bottom: 125px @i; }
	.xl-my-150px { margin-top: 150px @i; margin-bottom: 150px @i; }
	.xl-mt-150px { margin-top: 150px @i; }
	.xl-mb-150px { margin-bottom: 150px @i; }
	.xl-my-200px { margin-top: 200px @i; margin-bottom: 200px @i; }
	.xl-mt-200px { margin-top: 200px @i; }
	.xl-mb-200px { margin-bottom: 200px @i; }
	.xl-my-250px { margin-top: 250px @i; margin-bottom: 250px @i; }
	.xl-mt-250px { margin-top: 250px @i; }
	.xl-mb-250px { margin-bottom: 250px @i; }

	// MARGINS eje X
	.xl-mx-0px { margin-left: 0px @i; margin-right: 0px @i; }
	.xl-ml-0px { margin-left: 0px @i; }
	.xl-mr-0px { margin-right: 0px @i; }
	.xl-mx-5px { margin-left: 5px @i; margin-right: 5px @i; }
	.xl-ml-5px { margin-left: 5px @i; }
	.xl-mr-5px { margin-right: 5px @i; }
	.xl-mx-10px { margin-left: 10px @i; margin-right: 10px @i; }
	.xl-ml-10px { margin-left: 10px @i; }
	.xl-mr-10px { margin-right: 10px @i; }
	.xl-mx-15px { margin-left: 15px @i; margin-right: 15px @i; }
	.xl-ml-15px { margin-left: 15px @i; }
	.xl-mr-15px { margin-right: 15px @i; }
	.xl-mx-20px { margin-left: 20px @i; margin-right: 20px @i; }
	.xl-ml-20px { margin-left: 20px @i; }
	.xl-mr-20px { margin-right: 20px @i; }
	.xl-mx-25px { margin-left: 25px @i; margin-right: 25px @i; }
	.xl-ml-25px { margin-left: 25px @i; }
	.xl-mr-25px { margin-right: 25px @i; }
	.xl-mx-30px { margin-left: 30px @i; margin-right: 30px @i; }
	.xl-ml-30px { margin-left: 30px @i; }
	.xl-mr-30px { margin-right: 30px @i; }
	.xl-mx-50px { margin-left: 50px @i; margin-right: 50px @i; }
	.xl-ml-50px { margin-left: 50px @i; }
	.xl-mr-50px { margin-right: 50px @i; }
	.xl-mx-75px { margin-left: 75px @i; margin-right: 75px @i; }
	.xl-ml-75px { margin-left: 75px @i; }
	.xl-mr-75px { margin-right: 75px @i; }
	.xl-mx-100px { margin-left: 100px @i; margin-right: 100px @i; }
	.xl-ml-100px { margin-left: 100px @i; }
	.xl-mr-100px { margin-right: 100px @i; }
	.xl-mx-125px { margin-left: 125px @i; margin-right: 125px @i; }
	.xl-ml-125px { margin-left: 125px @i; }
	.xl-mr-125px { margin-right: 125px @i; }
	.xl-mx-150px { margin-left: 150px @i; margin-right: 150px @i; }
	.xl-ml-150px { margin-left: 150px @i; }
	.xl-mr-150px { margin-right: 150px @i; }
	.xl-mx-200px { margin-left: 200px @i; margin-right: 200px @i; }
	.xl-ml-200px { margin-left: 200px @i; }
	.xl-mr-200px { margin-right: 200px @i; }
	.xl-mx-250px { margin-left: 250px @i; margin-right: 150px @i; }
	.xl-ml-250px { margin-left: 250px @i; }
	.xl-mr-250px { margin-right: 250px @i; }
}

@media only screen and (max-width: 1199px) {
	// PADDINGS eje Y
	.lg-py-0px { padding-top: 0px @i; padding-bottom: 0px @i; }
	.lg-pt-0px { padding-top: 0px @i; }
	.lg-pb-0px { padding-bottom: 0px @i; }
	.lg-py-5px { padding-top: 5px @i; padding-bottom: 5px @i; }
	.lg-pt-5px { padding-top: 5px @i; }
	.lg-pb-5px { padding-bottom: 5px @i; }
	.lg-py-10px { padding-top: 10px @i; padding-bottom: 10px @i; }
	.lg-pt-10px { padding-top: 10px @i; }
	.lg-pb-10px { padding-bottom: 10px @i; }
	.lg-py-15px { padding-top: 15px @i; padding-bottom: 15px @i; }
	.lg-pt-15px { padding-top: 15px @i; }
	.lg-pb-15px { padding-bottom: 15px @i; }
	.lg-py-20px { padding-top: 20px @i; padding-bottom: 20px @i; }
	.lg-pt-20px { padding-top: 20px @i; }
	.lg-pb-20px { padding-bottom: 20px @i; }
	.lg-py-25px { padding-top: 25px @i; padding-bottom: 25px @i; }
	.lg-pt-25px { padding-top: 25px @i; }
	.lg-pb-25px { padding-bottom: 25px @i; }
	.lg-py-30px { padding-top: 30px @i; padding-bottom: 30px @i; }
	.lg-pt-30px { padding-top: 30px @i; }
	.lg-pb-30px { padding-bottom: 30px @i; }
	.lg-py-50px { padding-top: 50px @i; padding-bottom: 50px @i; }
	.lg-pt-50px { padding-top: 50px @i; }
	.lg-pb-50px { padding-bottom: 50px @i; }
	.lg-py-75px { padding-top: 75px @i; padding-bottom: 75px @i; }
	.lg-pt-75px { padding-top: 75px @i; }
	.lg-pb-75px { padding-bottom: 75px @i; }
	.lg-py-100px { padding-top: 100px @i; padding-bottom: 100px @i; }
	.lg-pt-100px { padding-top: 100px @i; }
	.lg-pb-100px { padding-bottom: 100px @i; }
	.lg-py-125px { padding-top: 125px @i; padding-bottom: 125px @i; }
	.lg-pt-125px { padding-top: 125px @i; }
	.lg-pb-125px { padding-bottom: 125px @i; }
	.lg-py-150px { padding-top: 150px @i; padding-bottom: 150px @i; }
	.lg-pt-150px { padding-top: 150px @i; }
	.lg-pb-150px { padding-bottom: 150px @i; }
	.lg-py-200px { padding-top: 200px @i; padding-bottom: 200px @i; }
	.lg-pt-200px { padding-top: 200px @i; }
	.lg-pb-200px { padding-bottom: 200px @i; }
	.lg-py-250px { padding-top: 250px @i; padding-bottom: 250px @i; }
	.lg-pt-250px { padding-top: 250px @i; }
	.lg-pb-250px { padding-bottom: 250px @i; }

	// PADDINGS eje X
	.lg-px-0px { padding-left: 0px @i; padding-right: 0px @i; }
	.lg-pl-0px { padding-left: 0px @i; }
	.lg-pr-0px { padding-right: 0px @i; }
	.lg-px-5px { padding-left: 5px @i; padding-right: 5px @i; }
	.lg-pl-5px { padding-left: 5px @i; }
	.lg-pr-5px { padding-right: 5px @i; }
	.lg-px-10px { padding-left: 10px @i; padding-right: 10px @i; }
	.lg-pl-10px { padding-left: 10px @i; }
	.lg-pr-10px { padding-right: 10px @i; }
	.lg-px-15px { padding-left: 15px @i; padding-right: 15px @i; }
	.lg-pl-15px { padding-left: 15px @i; }
	.lg-pr-15px { padding-right: 15px @i; }
	.lg-px-20px { padding-left: 20px @i; padding-right: 20px @i; }
	.lg-pl-20px { padding-left: 20px @i; }
	.lg-pr-20px { padding-right: 20px @i; }
	.lg-px-25px { padding-left: 25px @i; padding-right: 25px @i; }
	.lg-pl-25px { padding-left: 25px @i; }
	.lg-pr-25px { padding-right: 25px @i; }
	.lg-px-30px { padding-left: 30px @i; padding-right: 30px @i; }
	.lg-pl-30px { padding-left: 30px @i; }
	.lg-pr-30px { padding-right: 30px @i; }
	.lg-px-50px { padding-left: 50px @i; padding-right: 50px @i; }
	.lg-pl-50px { padding-left: 50px @i; }
	.lg-pr-50px { padding-right: 50px @i; }
	.lg-px-75px { padding-left: 75px @i; padding-right: 75px @i; }
	.lg-pl-75px { padding-left: 75px @i; }
	.lg-pr-75px { padding-right: 75px @i; }
	.lg-px-100px { padding-left: 100px @i; padding-right: 100px @i; }
	.lg-pl-100px { padding-left: 100px @i; }
	.lg-pr-100px { padding-right: 100px @i; }
	.lg-px-125px { padding-left: 125px @i; padding-right: 125px @i; }
	.lg-pl-125px { padding-left: 125px @i; }
	.lg-pr-125px { padding-right: 125px @i; }
	.lg-px-150px { padding-left: 150px @i; padding-right: 150px @i; }
	.lg-pl-150px { padding-left: 150px @i; }
	.lg-pr-150px { padding-right: 150px @i; }
	.lg-px-200px { padding-left: 200px @i; padding-right: 200px @i; }
	.lg-pl-200px { padding-left: 200px @i; }
	.lg-pr-200px { padding-right: 200px @i; }
	.lg-px-250px { padding-left: 250px @i; padding-right: 250px @i; }
	.lg-pl-250px { padding-left: 250px @i; }
	.lg-pr-250px { padding-right: 250px @i; }

	// MARGINS eje Y
	.lg-my-0px { margin-top: 0px @i; margin-bottom: 0px @i; }
	.lg-mt-0px { margin-top: 0px @i; }
	.lg-mb-0px { margin-bottom: 0px @i; }
	.lg-my-5px { margin-top: 5px @i; margin-bottom: 5px @i; }
	.lg-mt-5px { margin-top: 5px @i; }
	.lg-mb-5px { margin-bottom: 5px @i; }
	.lg-my-10px { margin-top: 10px @i; margin-bottom: 10px @i; }
	.lg-mt-10px { margin-top: 10px @i; }
	.lg-mb-10px { margin-bottom: 10px @i; }
	.lg-my-15px { margin-top: 15px @i; margin-bottom: 15px @i; }
	.lg-mt-15px { margin-top: 15px @i; }
	.lg-mb-15px { margin-bottom: 15px @i; }
	.lg-my-20px { margin-top: 20px @i; margin-bottom: 20px @i; }
	.lg-mt-20px { margin-top: 20px @i; }
	.lg-mb-20px { margin-bottom: 20px @i; }
	.lg-my-25px { margin-top: 25px @i; margin-bottom: 25px @i; }
	.lg-mt-25px { margin-top: 25px @i; }
	.lg-mb-25px { margin-bottom: 25px @i; }
	.lg-my-30px { margin-top: 30px @i; margin-bottom: 30px @i; }
	.lg-mt-30px { margin-top: 30px @i; }
	.lg-mb-30px { margin-bottom: 30px @i; }
	.lg-my-50px { margin-top: 50px @i; margin-bottom: 50px @i; }
	.lg-mt-50px { margin-top: 50px @i; }
	.lg-mb-50px { margin-bottom: 50px @i; }
	.lg-my-75px { margin-top: 75px @i; margin-bottom: 75px @i; }
	.lg-mt-75px { margin-top: 75px @i; }
	.lg-mb-75px { margin-bottom: 75px @i; }
	.lg-my-100px { margin-top: 100px @i; margin-bottom: 100px @i; }
	.lg-mt-100px { margin-top: 100px @i; }
	.lg-mb-100px { margin-bottom: 100px @i; }
	.lg-my-125px { margin-top: 125px @i; margin-bottom: 125px @i; }
	.lg-mt-125px { margin-top: 125px @i; }
	.lg-mb-125px { margin-bottom: 125px @i; }
	.lg-my-150px { margin-top: 150px @i; margin-bottom: 150px @i; }
	.lg-mt-150px { margin-top: 150px @i; }
	.lg-mb-150px { margin-bottom: 150px @i; }
	.lg-my-200px { margin-top: 200px @i; margin-bottom: 200px @i; }
	.lg-mt-200px { margin-top: 200px @i; }
	.lg-mb-200px { margin-bottom: 200px @i; }
	.lg-my-250px { margin-top: 250px @i; margin-bottom: 250px @i; }
	.lg-mt-250px { margin-top: 250px @i; }
	.lg-mb-250px { margin-bottom: 250px @i; }

	// MARGINS eje X
	.lg-mx-0px { margin-left: 0px @i; margin-right: 0px @i; }
	.lg-ml-0px { margin-left: 0px @i; }
	.lg-mr-0px { margin-right: 0px @i; }
	.lg-mx-5px { margin-left: 5px @i; margin-right: 5px @i; }
	.lg-ml-5px { margin-left: 5px @i; }
	.lg-mr-5px { margin-right: 5px @i; }
	.lg-mx-10px { margin-left: 10px @i; margin-right: 10px @i; }
	.lg-ml-10px { margin-left: 10px @i; }
	.lg-mr-10px { margin-right: 10px @i; }
	.lg-mx-15px { margin-left: 15px @i; margin-right: 15px @i; }
	.lg-ml-15px { margin-left: 15px @i; }
	.lg-mr-15px { margin-right: 15px @i; }
	.lg-mx-20px { margin-left: 20px @i; margin-right: 20px @i; }
	.lg-ml-20px { margin-left: 20px @i; }
	.lg-mr-20px { margin-right: 20px @i; }
	.lg-mx-25px { margin-left: 25px @i; margin-right: 25px @i; }
	.lg-ml-25px { margin-left: 25px @i; }
	.lg-mr-25px { margin-right: 25px @i; }
	.lg-mx-30px { margin-left: 30px @i; margin-right: 30px @i; }
	.lg-ml-30px { margin-left: 30px @i; }
	.lg-mr-30px { margin-right: 30px @i; }
	.lg-mx-50px { margin-left: 50px @i; margin-right: 50px @i; }
	.lg-ml-50px { margin-left: 50px @i; }
	.lg-mr-50px { margin-right: 50px @i; }
	.lg-mx-75px { margin-left: 75px @i; margin-right: 75px @i; }
	.lg-ml-75px { margin-left: 75px @i; }
	.lg-mr-75px { margin-right: 75px @i; }
	.lg-mx-100px { margin-left: 100px @i; margin-right: 100px @i; }
	.lg-ml-100px { margin-left: 100px @i; }
	.lg-mr-100px { margin-right: 100px @i; }
	.lg-mx-125px { margin-left: 125px @i; margin-right: 125px @i; }
	.lg-ml-125px { margin-left: 125px @i; }
	.lg-mr-125px { margin-right: 125px @i; }
	.lg-mx-150px { margin-left: 150px @i; margin-right: 150px @i; }
	.lg-ml-150px { margin-left: 150px @i; }
	.lg-mr-150px { margin-right: 150px @i; }
	.lg-mx-200px { margin-left: 200px @i; margin-right: 200px @i; }
	.lg-ml-200px { margin-left: 200px @i; }
	.lg-mr-200px { margin-right: 200px @i; }
	.lg-mx-250px { margin-left: 250px @i; margin-right: 250px @i; }
	.lg-ml-250px { margin-left: 250px @i; }
	.lg-mr-250px { margin-right: 250px @i; }
}

@media only screen and (max-width: 991px) {
	// PADDINGS eje Y
	.md-py-0px { padding-top: 0px @i; padding-bottom: 0px @i; }
	.md-pt-0px { padding-top: 0px @i; }
	.md-pb-0px { padding-bottom: 0px @i; }
	.md-py-5px { padding-top: 5px @i; padding-bottom: 5px @i; }
	.md-pt-5px { padding-top: 5px @i; }
	.md-pb-5px { padding-bottom: 5px @i; }
	.md-py-10px { padding-top: 10px @i; padding-bottom: 10px @i; }
	.md-pt-10px { padding-top: 10px @i; }
	.md-pb-10px { padding-bottom: 10px @i; }
	.md-py-15px { padding-top: 15px @i; padding-bottom: 15px @i; }
	.md-pt-15px { padding-top: 15px @i; }
	.md-pb-15px { padding-bottom: 15px @i; }
	.md-py-20px { padding-top: 20px @i; padding-bottom: 20px @i; }
	.md-pt-20px { padding-top: 20px @i; }
	.md-pb-20px { padding-bottom: 20px @i; }
	.md-py-25px { padding-top: 25px @i; padding-bottom: 25px @i; }
	.md-pt-25px { padding-top: 25px @i; }
	.md-pb-25px { padding-bottom: 25px @i; }
	.md-py-30px { padding-top: 30px @i; padding-bottom: 30px @i; }
	.md-pt-30px { padding-top: 30px @i; }
	.md-pb-30px { padding-bottom: 30px @i; }
	.md-py-50px { padding-top: 50px @i; padding-bottom: 50px @i; }
	.md-pt-50px { padding-top: 50px @i; }
	.md-pb-50px { padding-bottom: 50px @i; }
	.md-py-75px { padding-top: 75px @i; padding-bottom: 75px @i; }
	.md-pt-75px { padding-top: 75px @i; }
	.md-pb-75px { padding-bottom: 75px @i; }
	.md-py-100px { padding-top: 100px @i; padding-bottom: 100px @i; }
	.md-pt-100px { padding-top: 100px @i; }
	.md-pb-100px { padding-bottom: 100px @i; }
	.md-py-125px { padding-top: 125px @i; padding-bottom: 125px @i; }
	.md-pt-125px { padding-top: 125px @i; }
	.md-pb-125px { padding-bottom: 125px @i; }
	.md-py-150px { padding-top: 150px @i; padding-bottom: 150px @i; }
	.md-pt-150px { padding-top: 150px @i; }
	.md-pb-150px { padding-bottom: 150px @i; }
	.md-py-200px { padding-top: 200px @i; padding-bottom: 200px @i; }
	.md-pt-200px { padding-top: 200px @i; }
	.md-pb-200px { padding-bottom: 200px @i; }
	.md-py-250px { padding-top: 250px @i; padding-bottom: 250px @i; }
	.md-pt-250px { padding-top: 250px @i; }
	.md-pb-250px { padding-bottom: 250px @i; }

	// PADDINGS eje X
	.md-px-0px { padding-left: 0px @i; padding-right: 0px @i; }
	.md-pl-0px { padding-left: 0px @i; }
	.md-pr-0px { padding-right: 0px @i; }
	.md-px-5px { padding-left: 5px @i; padding-right: 5px @i; }
	.md-pl-5px { padding-left: 5px @i; }
	.md-pr-5px { padding-right: 5px @i; }
	.md-px-10px { padding-left: 10px @i; padding-right: 10px @i; }
	.md-pl-10px { padding-left: 10px @i; }
	.md-pr-10px { padding-right: 10px @i; }
	.md-px-15px { padding-left: 15px @i; padding-right: 15px @i; }
	.md-pl-15px { padding-left: 15px @i; }
	.md-pr-15px { padding-right: 15px @i; }
	.md-px-20px { padding-left: 20px @i; padding-right: 20px @i; }
	.md-pl-20px { padding-left: 20px @i; }
	.md-pr-20px { padding-right: 20px @i; }
	.md-px-25px { padding-left: 25px @i; padding-right: 25px @i; }
	.md-pl-25px { padding-left: 25px @i; }
	.md-pr-25px { padding-right: 25px @i; }
	.md-px-30px { padding-left: 30px @i; padding-right: 30px @i; }
	.md-pl-30px { padding-left: 30px @i; }
	.md-pr-30px { padding-right: 30px @i; }
	.md-px-50px { padding-left: 50px @i; padding-right: 50px @i; }
	.md-pl-50px { padding-left: 50px @i; }
	.md-pr-50px { padding-right: 50px @i; }
	.md-px-75px { padding-left: 75px @i; padding-right: 75px @i; }
	.md-pl-75px { padding-left: 75px @i; }
	.md-pr-75px { padding-right: 75px @i; }
	.md-px-100px { padding-left: 100px @i; padding-right: 100px @i; }
	.md-pl-100px { padding-left: 100px @i; }
	.md-pr-100px { padding-right: 100px @i; }
	.md-px-125px { padding-left: 125px @i; padding-right: 125px @i; }
	.md-pl-125px { padding-left: 125px @i; }
	.md-pr-125px { padding-right: 125px @i; }
	.md-px-150px { padding-left: 150px @i; padding-right: 150px @i; }
	.md-pl-150px { padding-left: 150px @i; }
	.md-pr-150px { padding-right: 150px @i; }
	.md-px-200px { padding-left: 200px @i; padding-right: 200px @i; }
	.md-pl-200px { padding-left: 200px @i; }
	.md-pr-200px { padding-right: 200px @i; }
	.md-px-250px { padding-left: 250px @i; padding-right: 250px @i; }
	.md-pl-250px { padding-left: 250px @i; }
	.md-pr-250px { padding-right: 250px @i; }

	// MARGINS eje Y
	.md-my-0px { margin-top: 0px @i; margin-bottom: 0px @i; }
	.md-mt-0px { margin-top: 0px @i; }
	.md-mb-0px { margin-bottom: 0px @i; }
	.md-my-5px { margin-top: 5px @i; margin-bottom: 5px @i; }
	.md-mt-5px { margin-top: 5px @i; }
	.md-mb-5px { margin-bottom: 5px @i; }
	.md-my-10px { margin-top: 10px @i; margin-bottom: 10px @i; }
	.md-mt-10px { margin-top: 10px @i; }
	.md-mb-10px { margin-bottom: 10px @i; }
	.md-my-15px { margin-top: 15px @i; margin-bottom: 15px @i; }
	.md-mt-15px { margin-top: 15px @i; }
	.md-mb-15px { margin-bottom: 15px @i; }
	.md-my-20px { margin-top: 20px @i; margin-bottom: 20px @i; }
	.md-mt-20px { margin-top: 20px @i; }
	.md-mb-20px { margin-bottom: 20px @i; }
	.md-my-25px { margin-top: 25px @i; margin-bottom: 25px @i; }
	.md-mt-25px { margin-top: 25px @i; }
	.md-mb-25px { margin-bottom: 25px @i; }
	.md-my-30px { margin-top: 30px @i; margin-bottom: 30px @i; }
	.md-mt-30px { margin-top: 30px @i; }
	.md-mb-30px { margin-bottom: 30px @i; }
	.md-my-50px { margin-top: 50px @i; margin-bottom: 50px @i; }
	.md-mt-50px { margin-top: 50px @i; }
	.md-mb-50px { margin-bottom: 50px @i; }
	.md-my-75px { margin-top: 75px @i; margin-bottom: 75px @i; }
	.md-mt-75px { margin-top: 75px @i; }
	.md-mb-75px { margin-bottom: 75px @i; }
	.md-my-100px { margin-top: 100px @i; margin-bottom: 100px @i; }
	.md-mt-100px { margin-top: 100px @i; }
	.md-mb-100px { margin-bottom: 100px @i; }
	.md-my-125px { margin-top: 125px @i; margin-bottom: 125px @i; }
	.md-mt-125px { margin-top: 125px @i; }
	.md-mb-125px { margin-bottom: 125px @i; }
	.md-my-150px { margin-top: 150px @i; margin-bottom: 150px @i; }
	.md-mt-150px { margin-top: 150px @i; }
	.md-mb-150px { margin-bottom: 150px @i; }
	.md-my-200px { margin-top: 200px @i; margin-bottom: 200px @i; }
	.md-mt-200px { margin-top: 200px @i; }
	.md-mb-200px { margin-bottom: 200px @i; }
	.md-my-250px { margin-top: 250px @i; margin-bottom: 250px @i; }
	.md-mt-250px { margin-top: 250px @i; }
	.md-mb-250px { margin-bottom: 250px @i; }

	// MARGINS eje X
	.md-mx-0px { margin-left: 0px @i; margin-right: 0px @i; }
	.md-ml-0px { margin-left: 0px @i; }
	.md-mr-0px { margin-right: 0px @i; }
	.md-mx-5px { margin-left: 5px @i; margin-right: 5px @i; }
	.md-ml-5px { margin-left: 5px @i; }
	.md-mr-5px { margin-right: 5px @i; }
	.md-mx-10px { margin-left: 10px @i; margin-right: 10px @i; }
	.md-ml-10px { margin-left: 10px @i; }
	.md-mr-10px { margin-right: 10px @i; }
	.md-mx-15px { margin-left: 15px @i; margin-right: 15px @i; }
	.md-ml-15px { margin-left: 15px @i; }
	.md-mr-15px { margin-right: 15px @i; }
	.md-mx-20px { margin-left: 20px @i; margin-right: 20px @i; }
	.md-ml-20px { margin-left: 20px @i; }
	.md-mr-20px { margin-right: 20px @i; }
	.md-mx-25px { margin-left: 25px @i; margin-right: 25px @i; }
	.md-ml-25px { margin-left: 25px @i; }
	.md-mr-25px { margin-right: 25px @i; }
	.md-mx-30px { margin-left: 30px @i; margin-right: 30px @i; }
	.md-ml-30px { margin-left: 30px @i; }
	.md-mr-30px { margin-right: 30px @i; }
	.md-mx-50px { margin-left: 50px @i; margin-right: 50px @i; }
	.md-ml-50px { margin-left: 50px @i; }
	.md-mr-50px { margin-right: 50px @i; }
	.md-mx-75px { margin-left: 75px @i; margin-right: 75px @i; }
	.md-ml-75px { margin-left: 75px @i; }
	.md-mr-75px { margin-right: 75px @i; }
	.md-mx-100px { margin-left: 100px @i; margin-right: 100px @i; }
	.md-ml-100px { margin-left: 100px @i; }
	.md-mr-100px { margin-right: 100px @i; }
	.md-mx-125px { margin-left: 125px @i; margin-right: 125px @i; }
	.md-ml-125px { margin-left: 125px @i; }
	.md-mr-125px { margin-right: 125px @i; }
	.md-mx-150px { margin-left: 150px @i; margin-right: 150px @i; }
	.md-ml-150px { margin-left: 150px @i; }
	.md-mr-150px { margin-right: 150px @i; }
	.md-mx-200px { margin-left: 200px @i; margin-right: 200px @i; }
	.md-ml-200px { margin-left: 200px @i; }
	.md-mr-200px { margin-right: 200px @i; }
	.md-mx-250px { margin-left: 250px @i; margin-right: 250px @i; }
	.md-ml-250px { margin-left: 250px @i; }
	.md-mr-250px { margin-right: 250px @i; }
}

@media only screen and (max-width: 767px) {
	// PADDINGS eje Y
	.sm-py-0px { padding-top: 0px @i; padding-bottom: 0px @i; }
	.sm-pt-0px { padding-top: 0px @i; }
	.sm-pb-0px { padding-bottom: 0px @i; }
	.sm-py-5px { padding-top: 5px @i; padding-bottom: 5px @i; }
	.sm-pt-5px { padding-top: 5px @i; }
	.sm-pb-5px { padding-bottom: 5px @i; }
	.sm-py-10px { padding-top: 10px @i; padding-bottom: 10px @i; }
	.sm-pt-10px { padding-top: 10px @i; }
	.sm-pb-10px { padding-bottom: 10px @i; }
	.sm-py-15px { padding-top: 15px @i; padding-bottom: 15px @i; }
	.sm-pt-15px { padding-top: 15px @i; }
	.sm-pb-15px { padding-bottom: 15px @i; }
	.sm-py-20px { padding-top: 20px @i; padding-bottom: 20px @i; }
	.sm-pt-20px { padding-top: 20px @i; }
	.sm-pb-20px { padding-bottom: 20px @i; }
	.sm-py-25px { padding-top: 25px @i; padding-bottom: 25px @i; }
	.sm-pt-25px { padding-top: 25px @i; }
	.sm-pb-25px { padding-bottom: 25px @i; }
	.sm-py-30px { padding-top: 30px @i; padding-bottom: 30px @i; }
	.sm-pt-30px { padding-top: 30px @i; }
	.sm-pb-30px { padding-bottom: 30px @i; }
	.sm-py-50px { padding-top: 50px @i; padding-bottom: 50px @i; }
	.sm-pt-50px { padding-top: 50px @i; }
	.sm-pb-50px { padding-bottom: 50px @i; }
	.sm-py-75px { padding-top: 75px @i; padding-bottom: 75px @i; }
	.sm-pt-75px { padding-top: 75px @i; }
	.sm-pb-75px { padding-bottom: 75px @i; }
	.sm-py-100px { padding-top: 100px @i; padding-bottom: 100px @i; }
	.sm-pt-100px { padding-top: 100px @i; }
	.sm-pb-100px { padding-bottom: 100px @i; }
	.sm-py-125px { padding-top: 125px @i; padding-bottom: 125px @i; }
	.sm-pt-125px { padding-top: 125px @i; }
	.sm-pb-125px { padding-bottom: 125px @i; }
	.sm-py-150px { padding-top: 150px @i; padding-bottom: 150px @i; }
	.sm-pt-150px { padding-top: 150px @i; }
	.sm-pb-150px { padding-bottom: 150px @i; }
	.sm-py-200px { padding-top: 200px @i; padding-bottom: 200px @i; }
	.sm-pt-200px { padding-top: 200px @i; }
	.sm-pb-200px { padding-bottom: 200px @i; }
	.sm-py-250px { padding-top: 250px @i; padding-bottom: 250px @i; }
	.sm-pt-250px { padding-top: 250px @i; }
	.sm-pb-250px { padding-bottom: 250px @i; }

	// PADDINGS eje X
	.sm-px-0px { padding-left: 0px @i; padding-right: 0px @i; }
	.sm-pl-0px { padding-left: 0px @i; }
	.sm-pr-0px { padding-right: 0px @i; }
	.sm-px-5px { padding-left: 5px @i; padding-right: 5px @i; }
	.sm-pl-5px { padding-left: 5px @i; }
	.sm-pr-5px { padding-right: 5px @i; }
	.sm-px-10px { padding-left: 10px @i; padding-right: 10px @i; }
	.sm-pl-10px { padding-left: 10px @i; }
	.sm-pr-10px { padding-right: 10px @i; }
	.sm-px-15px { padding-left: 15px @i; padding-right: 15px @i; }
	.sm-pl-15px { padding-left: 15px @i; }
	.sm-pr-15px { padding-right: 15px @i; }
	.sm-px-20px { padding-left: 20px @i; padding-right: 20px @i; }
	.sm-pl-20px { padding-left: 20px @i; }
	.sm-pr-20px { padding-right: 20px @i; }
	.sm-px-25px { padding-left: 25px @i; padding-right: 25px @i; }
	.sm-pl-25px { padding-left: 25px @i; }
	.sm-pr-25px { padding-right: 25px @i; }
	.sm-px-30px { padding-left: 30px @i; padding-right: 30px @i; }
	.sm-pl-30px { padding-left: 30px @i; }
	.sm-pr-30px { padding-right: 30px @i; }
	.sm-px-50px { padding-left: 50px @i; padding-right: 50px @i; }
	.sm-pl-50px { padding-left: 50px @i; }
	.sm-pr-50px { padding-right: 50px @i; }
	.sm-px-75px { padding-left: 75px @i; padding-right: 75px @i; }
	.sm-pl-75px { padding-left: 75px @i; }
	.sm-pr-75px { padding-right: 75px @i; }
	.sm-px-100px { padding-left: 100px @i; padding-right: 100px @i; }
	.sm-pl-100px { padding-left: 100px @i; }
	.sm-pr-100px { padding-right: 100px @i; }
	.sm-px-125px { padding-left: 125px @i; padding-right: 125px @i; }
	.sm-pl-125px { padding-left: 125px @i; }
	.sm-pr-125px { padding-right: 125px @i; }
	.sm-px-150px { padding-left: 150px @i; padding-right: 150px @i; }
	.sm-pl-150px { padding-left: 150px @i; }
	.sm-pr-150px { padding-right: 150px @i; }
	.sm-px-200px { padding-left: 200px @i; padding-right: 200px @i; }
	.sm-pl-200px { padding-left: 200px @i; }
	.sm-pr-200px { padding-right: 200px @i; }
	.sm-px-250px { padding-left: 250px @i; padding-right: 250px @i; }
	.sm-pl-250px { padding-left: 250px @i; }
	.sm-pr-250px { padding-right: 250px @i; }

	// MARGINS eje Y
	.sm-my-0px { margin-top: 0px @i; margin-bottom: 0px @i; }
	.sm-mt-0px { margin-top: 0px @i; }
	.sm-mb-0px { margin-bottom: 0px @i; }
	.sm-my-5px { margin-top: 5px @i; margin-bottom: 5px @i; }
	.sm-mt-5px { margin-top: 5px @i; }
	.sm-mb-5px { margin-bottom: 5px @i; }
	.sm-my-10px { margin-top: 10px @i; margin-bottom: 10px @i; }
	.sm-mt-10px { margin-top: 10px @i; }
	.sm-mb-10px { margin-bottom: 10px @i; }
	.sm-my-15px { margin-top: 15px @i; margin-bottom: 15px @i; }
	.sm-mt-15px { margin-top: 15px @i; }
	.sm-mb-15px { margin-bottom: 15px @i; }
	.sm-my-20px { margin-top: 20px @i; margin-bottom: 20px @i; }
	.sm-mt-20px { margin-top: 20px @i; }
	.sm-mb-20px { margin-bottom: 20px @i; }
	.sm-my-25px { margin-top: 25px @i; margin-bottom: 25px @i; }
	.sm-mt-25px { margin-top: 25px @i; }
	.sm-mb-25px { margin-bottom: 25px @i; }
	.sm-my-30px { margin-top: 30px @i; margin-bottom: 30px @i; }
	.sm-mt-30px { margin-top: 30px @i; }
	.sm-mb-30px { margin-bottom: 30px @i; }
	.sm-my-50px { margin-top: 50px @i; margin-bottom: 50px @i; }
	.sm-mt-50px { margin-top: 50px @i; }
	.sm-mb-50px { margin-bottom: 50px @i; }
	.sm-my-75px { margin-top: 75px @i; margin-bottom: 75px @i; }
	.sm-mt-75px { margin-top: 75px @i; }
	.sm-mb-75px { margin-bottom: 75px @i; }
	.sm-my-100px { margin-top: 100px @i; margin-bottom: 100px @i; }
	.sm-mt-100px { margin-top: 100px @i; }
	.sm-mb-100px { margin-bottom: 100px @i; }
	.sm-my-125px { margin-top: 125px @i; margin-bottom: 125px @i; }
	.sm-mt-125px { margin-top: 125px @i; }
	.sm-mb-125px { margin-bottom: 125px @i; }
	.sm-my-150px { margin-top: 150px @i; margin-bottom: 150px @i; }
	.sm-mt-150px { margin-top: 150px @i; }
	.sm-mb-150px { margin-bottom: 150px @i; }
	.sm-my-200px { margin-top: 200px @i; margin-bottom: 200px @i; }
	.sm-mt-200px { margin-top: 200px @i; }
	.sm-mb-200px { margin-bottom: 200px @i; }
	.sm-my-250px { margin-top: 250px @i; margin-bottom: 250px @i; }
	.sm-mt-250px { margin-top: 250px @i; }
	.sm-mb-250px { margin-bottom: 250px @i; }

	// MARGINS eje X
	.sm-mx-0px { margin-left: 0px @i; margin-right: 0px @i; }
	.sm-ml-0px { margin-left: 0px @i; }
	.sm-mr-0px { margin-right: 0px @i; }
	.sm-mx-5px { margin-left: 5px @i; margin-right: 5px @i; }
	.sm-ml-5px { margin-left: 5px @i; }
	.sm-mr-5px { margin-right: 5px @i; }
	.sm-mx-10px { margin-left: 10px @i; margin-right: 10px @i; }
	.sm-ml-10px { margin-left: 10px @i; }
	.sm-mr-10px { margin-right: 10px @i; }
	.sm-mx-15px { margin-left: 15px @i; margin-right: 15px @i; }
	.sm-ml-15px { margin-left: 15px @i; }
	.sm-mr-15px { margin-right: 15px @i; }
	.sm-mx-20px { margin-left: 20px @i; margin-right: 20px @i; }
	.sm-ml-20px { margin-left: 20px @i; }
	.sm-mr-20px { margin-right: 20px @i; }
	.sm-mx-25px { margin-left: 25px @i; margin-right: 25px @i; }
	.sm-ml-25px { margin-left: 25px @i; }
	.sm-mr-25px { margin-right: 25px @i; }
	.sm-mx-30px { margin-left: 30px @i; margin-right: 30px @i; }
	.sm-ml-30px { margin-left: 30px @i; }
	.sm-mr-30px { margin-right: 30px @i; }
	.sm-mx-50px { margin-left: 50px @i; margin-right: 50px @i; }
	.sm-ml-50px { margin-left: 50px @i; }
	.sm-mr-50px { margin-right: 50px @i; }
	.sm-mx-75px { margin-left: 75px @i; margin-right: 75px @i; }
	.sm-ml-75px { margin-left: 75px @i; }
	.sm-mr-75px { margin-right: 75px @i; }
	.sm-mx-100px { margin-left: 100px @i; margin-right: 100px @i; }
	.sm-ml-100px { margin-left: 100px @i; }
	.sm-mr-100px { margin-right: 100px @i; }
	.sm-mx-125px { margin-left: 125px @i; margin-right: 125px @i; }
	.sm-ml-125px { margin-left: 125px @i; }
	.sm-mr-125px { margin-right: 125px @i; }
	.sm-mx-150px { margin-left: 150px @i; margin-right: 150px @i; }
	.sm-ml-150px { margin-left: 150px @i; }
	.sm-mr-150px { margin-right: 150px @i; }
	.sm-mx-200px { margin-left: 200px @i; margin-right: 200px @i; }
	.sm-ml-200px { margin-left: 200px @i; }
	.sm-mr-200px { margin-right: 200px @i; }
	.sm-mx-250px { margin-left: 250px @i; margin-right: 250px @i; }
	.sm-ml-250px { margin-left: 250px @i; }
	.sm-mr-250px { margin-right: 250px @i; }
}

@media only screen and (max-width: 575px) {
	// PADDINGS eje Y
	.xs-py-0px { padding-top: 0px @i; padding-bottom: 0px @i; }
	.xs-pt-0px { padding-top: 0px @i; }
	.xs-pb-0px { padding-bottom: 0px @i; }
	.xs-py-5px { padding-top: 5px @i; padding-bottom: 5px @i; }
	.xs-pt-5px { padding-top: 5px @i; }
	.xs-pb-5px { padding-bottom: 5px @i; }
	.xs-py-10px { padding-top: 10px @i; padding-bottom: 10px @i; }
	.xs-pt-10px { padding-top: 10px @i; }
	.xs-pb-10px { padding-bottom: 10px @i; }
	.xs-py-15px { padding-top: 15px @i; padding-bottom: 15px @i; }
	.xs-pt-15px { padding-top: 15px @i; }
	.xs-pb-15px { padding-bottom: 15px @i; }
	.xs-py-20px { padding-top: 20px @i; padding-bottom: 20px @i; }
	.xs-pt-20px { padding-top: 20px @i; }
	.xs-pb-20px { padding-bottom: 20px @i; }
	.xs-py-25px { padding-top: 25px @i; padding-bottom: 25px @i; }
	.xs-pt-25px { padding-top: 25px @i; }
	.xs-pb-25px { padding-bottom: 25px @i; }
	.xs-py-30px { padding-top: 30px @i; padding-bottom: 30px @i; }
	.xs-pt-30px { padding-top: 30px @i; }
	.xs-pb-30px { padding-bottom: 30px @i; }
	.xs-py-50px { padding-top: 50px @i; padding-bottom: 50px @i; }
	.xs-pt-50px { padding-top: 50px @i; }
	.xs-pb-50px { padding-bottom: 50px @i; }
	.xs-py-75px { padding-top: 75px @i; padding-bottom: 75px @i; }
	.xs-pt-75px { padding-top: 75px @i; }
	.xs-pb-75px { padding-bottom: 75px @i; }
	.xs-py-100px { padding-top: 100px @i; padding-bottom: 100px @i; }
	.xs-pt-100px { padding-top: 100px @i; }
	.xs-pb-100px { padding-bottom: 100px @i; }
	.xs-py-125px { padding-top: 125px @i; padding-bottom: 125px @i; }
	.xs-pt-125px { padding-top: 125px @i; }
	.xs-pb-125px { padding-bottom: 125px @i; }
	.xs-py-150px { padding-top: 150px @i; padding-bottom: 150px @i; }
	.xs-pt-150px { padding-top: 150px @i; }
	.xs-pb-150px { padding-bottom: 150px @i; }
	.xs-py-200px { padding-top: 200px @i; padding-bottom: 200px @i; }
	.xs-pt-200px { padding-top: 200px @i; }
	.xs-pb-200px { padding-bottom: 200px @i; }
	.xs-py-250px { padding-top: 250px @i; padding-bottom: 250px @i; }
	.xs-pt-250px { padding-top: 250px @i; }
	.xs-pb-250px { padding-bottom: 250px @i; }

	// PADDINGS eje X
	.xs-px-0px { padding-left: 0px @i; padding-right: 0px @i; }
	.xs-pl-0px { padding-left: 0px @i; }
	.xs-pr-0px { padding-right: 0px @i; }
	.xs-px-5px { padding-left: 5px @i; padding-right: 5px @i; }
	.xs-pl-5px { padding-left: 5px @i; }
	.xs-pr-5px { padding-right: 5px @i; }
	.xs-px-10px { padding-left: 10px @i; padding-right: 10px @i; }
	.xs-pl-10px { padding-left: 10px @i; }
	.xs-pr-10px { padding-right: 10px @i; }
	.xs-px-15px { padding-left: 15px @i; padding-right: 15px @i; }
	.xs-pl-15px { padding-left: 15px @i; }
	.xs-pr-15px { padding-right: 15px @i; }
	.xs-px-20px { padding-left: 20px @i; padding-right: 20px @i; }
	.xs-pl-20px { padding-left: 20px @i; }
	.xs-pr-20px { padding-right: 20px @i; }
	.xs-px-25px { padding-left: 25px @i; padding-right: 25px @i; }
	.xs-pl-25px { padding-left: 25px @i; }
	.xs-pr-25px { padding-right: 25px @i; }
	.xs-px-30px { padding-left: 30px @i; padding-right: 30px @i; }
	.xs-pl-30px { padding-left: 30px @i; }
	.xs-pr-30px { padding-right: 30px @i; }
	.xs-px-50px { padding-left: 50px @i; padding-right: 50px @i; }
	.xs-pl-50px { padding-left: 50px @i; }
	.xs-pr-50px { padding-right: 50px @i; }
	.xs-px-75px { padding-left: 75px @i; padding-right: 75px @i; }
	.xs-pl-75px { padding-left: 75px @i; }
	.xs-pr-75px { padding-right: 75px @i; }
	.xs-px-100px { padding-left: 100px @i; padding-right: 100px @i; }
	.xs-pl-100px { padding-left: 100px @i; }
	.xs-pr-100px { padding-right: 100px @i; }
	.xs-px-125px { padding-left: 125px @i; padding-right: 125px @i; }
	.xs-pl-125px { padding-left: 125px @i; }
	.xs-pr-125px { padding-right: 125px @i; }
	.xs-px-150px { padding-left: 150px @i; padding-right: 150px @i; }
	.xs-pl-150px { padding-left: 150px @i; }
	.xs-pr-150px { padding-right: 150px @i; }
	.xs-px-200px { padding-left: 200px @i; padding-right: 200px @i; }
	.xs-pl-200px { padding-left: 200px @i; }
	.xs-pr-200px { padding-right: 200px @i; }
	.xs-px-250px { padding-left: 250px @i; padding-right: 250px @i; }
	.xs-pl-250px { padding-left: 250px @i; }
	.xs-pr-250px { padding-right: 250px @i; }

	// MARGINS eje Y
	.xs-my-0px { margin-top: 0px @i; margin-bottom: 0px @i; }
	.xs-mt-0px { margin-top: 0px @i; }
	.xs-mb-0px { margin-bottom: 0px @i; }
	.xs-my-5px { margin-top: 5px @i; margin-bottom: 5px @i; }
	.xs-mt-5px { margin-top: 5px @i; }
	.xs-mb-5px { margin-bottom: 5px @i; }
	.xs-my-10px { margin-top: 10px @i; margin-bottom: 10px @i; }
	.xs-mt-10px { margin-top: 10px @i; }
	.xs-mb-10px { margin-bottom: 10px @i; }
	.xs-my-15px { margin-top: 15px @i; margin-bottom: 15px @i; }
	.xs-mt-15px { margin-top: 15px @i; }
	.xs-mb-15px { margin-bottom: 15px @i; }
	.xs-my-20px { margin-top: 20px @i; margin-bottom: 20px @i; }
	.xs-mt-20px { margin-top: 20px @i; }
	.xs-mb-20px { margin-bottom: 20px @i; }
	.xs-my-25px { margin-top: 25px @i; margin-bottom: 25px @i; }
	.xs-mt-25px { margin-top: 25px @i; }
	.xs-mb-25px { margin-bottom: 25px @i; }
	.xs-my-30px { margin-top: 30px @i; margin-bottom: 30px @i; }
	.xs-mt-30px { margin-top: 30px @i; }
	.xs-mb-30px { margin-bottom: 30px @i; }
	.xs-my-50px { margin-top: 50px @i; margin-bottom: 50px @i; }
	.xs-mt-50px { margin-top: 50px @i; }
	.xs-mb-50px { margin-bottom: 50px @i; }
	.xs-my-75px { margin-top: 75px @i; margin-bottom: 75px @i; }
	.xs-mt-75px { margin-top: 75px @i; }
	.xs-mb-75px { margin-bottom: 75px @i; }
	.xs-my-100px { margin-top: 100px @i; margin-bottom: 100px @i; }
	.xs-mt-100px { margin-top: 100px @i; }
	.xs-mb-100px { margin-bottom: 100px @i; }
	.xs-my-125px { margin-top: 125px @i; margin-bottom: 125px @i; }
	.xs-mt-125px { margin-top: 125px @i; }
	.xs-mb-125px { margin-bottom: 125px @i; }
	.xs-my-150px { margin-top: 150px @i; margin-bottom: 150px @i; }
	.xs-mt-150px { margin-top: 150px @i; }
	.xs-mb-150px { margin-bottom: 150px @i; }
	.xs-my-200px { margin-top: 200px @i; margin-bottom: 200px @i; }
	.xs-mt-200px { margin-top: 200px @i; }
	.xs-mb-200px { margin-bottom: 200px @i; }
	.xs-my-250px { margin-top: 250px @i; margin-bottom: 250px @i; }
	.xs-mt-250px { margin-top: 250px @i; }
	.xs-mb-250px { margin-bottom: 250px @i; }

	// MARGINS eje X
	.xs-mx-0px { margin-left: 0px @i; margin-right: 0px @i; }
	.xs-ml-0px { margin-left: 0px @i; }
	.xs-mr-0px { margin-right: 0px @i; }
	.xs-mx-5px { margin-left: 5px @i; margin-right: 5px @i; }
	.xs-ml-5px { margin-left: 5px @i; }
	.xs-mr-5px { margin-right: 5px @i; }
	.xs-mx-10px { margin-left: 10px @i; margin-right: 10px @i; }
	.xs-ml-10px { margin-left: 10px @i; }
	.xs-mr-10px { margin-right: 10px @i; }
	.xs-mx-15px { margin-left: 15px @i; margin-right: 15px @i; }
	.xs-ml-15px { margin-left: 15px @i; }
	.xs-mr-15px { margin-right: 15px @i; }
	.xs-mx-20px { margin-left: 20px @i; margin-right: 20px @i; }
	.xs-ml-20px { margin-left: 20px @i; }
	.xs-mr-20px { margin-right: 20px @i; }
	.xs-mx-25px { margin-left: 25px @i; margin-right: 25px @i; }
	.xs-ml-25px { margin-left: 25px @i; }
	.xs-mr-25px { margin-right: 25px @i; }
	.xs-mx-30px { margin-left: 30px @i; margin-right: 30px @i; }
	.xs-ml-30px { margin-left: 30px @i; }
	.xs-mr-30px { margin-right: 30px @i; }
	.xs-mx-50px { margin-left: 50px @i; margin-right: 50px @i; }
	.xs-ml-50px { margin-left: 50px @i; }
	.xs-mr-50px { margin-right: 50px @i; }
	.xs-mx-75px { margin-left: 75px @i; margin-right: 75px @i; }
	.xs-ml-75px { margin-left: 75px @i; }
	.xs-mr-75px { margin-right: 75px @i; }
	.xs-mx-100px { margin-left: 100px @i; margin-right: 100px @i; }
	.xs-ml-100px { margin-left: 100px @i; }
	.xs-mr-100px { margin-right: 100px @i; }
	.xs-mx-125px { margin-left: 125px @i; margin-right: 125px @i; }
	.xs-ml-125px { margin-left: 125px @i; }
	.xs-mr-125px { margin-right: 125px @i; }
	.xs-mx-150px { margin-left: 150px @i; margin-right: 150px @i; }
	.xs-ml-150px { margin-left: 150px @i; }
	.xs-mr-150px { margin-right: 150px @i; }
	.xs-mx-200px { margin-left: 200px @i; margin-right: 200px @i; }
	.xs-ml-200px { margin-left: 200px @i; }
	.xs-mr-200px { margin-right: 200px @i; }
	.xs-mx-250px { margin-left: 250px @i; margin-right: 250px @i; }
	.xs-ml-250px { margin-left: 250px @i; }
	.xs-mr-250px { margin-right: 250px @i; }
}


// DEFINICIÓN DE MIXINS ===========================================================================
.transition(@transition) {
  -webkit-transition: @transition;
  -moz-transition: @transition;
  -ms-transition: @transition;
  -o-transition: @transition;
  transition: @transition;
}
.transition-delay(@transition-delay) {
  -webkit-transition-delay: @transition-delay;
  -moz-transition-delay: @transition-delay;
  -ms-transition-delay: @transition-delay;
  -o-transition-delay: @transition-delay;
  transition-delay: @transition-delay;
}
.transform(@transform) {
  -webkit-transform: @transform;
  -moz-transform: @transform;
  -ms-transform: @transform;
  -o-transform: @transform;
  transform: @transform;
}
.radius(@radius) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  -ms-border-radius: @radius;
  -o-border-radius: @radius;
  border-radius: @radius;
}
.box-shadow(@box-shadow) {
  -webkit-box-shadow: @box-shadow;
  -moz-box-shadow: @box-shadow;
  -ms-box-shadow: @box-shadow;
  -o-box-shadow: @box-shadow;
  box-shadow: @box-shadow;
}
.text-shadow(@text-shadow) {
  -webkit-text-shadow: @text-shadow;
  -moz-text-shadow: @text-shadow;
  -ms-text-shadow: @text-shadow;
  -o-text-shadow: @text-shadow;
  text-shadow: @text-shadow;
}
.box-sizing(@box-sizing) {
  -webkit-box-sizing: @box-sizing;
  -moz-box-sizing: @box-sizing;
  -ms-box-sizing: @box-sizing;
  -o-box-sizing: @box-sizing;
  box-sizing: @box-sizing;
}
.filter(@filter) {
  -webkit-filter: @filter;
  -moz-filter: @filter;
  -ms-filter: @filter;
  -o-filter: @filter;
  filter: @filter;
}
.opacity(@opacity) {
  opacity: @opacity;
  filter: ~"alpha(opacity=@{opacity})";
}

// FUENTES ========================================================================================
@font-face {
    font-family: 'Din Condensed Regular';    
    font-style: normal;
    font-weight: 300;
    src: url('fuentes/dincond-webfont.eot');
    src: url('fuentes/dincond-webfont.eot?#iefix') format('embedded-opentype'),
         url('fuentes/dincond-webfont.woff') format('woff'),
         url('fuentes/dincond-webfont.ttf') format('truetype'),
         url('fuentes/dincond-webfont.svg#DINCondRegular') format('svg');
}

@font-face {
  font-family: 'Din Condensed Bold';
  font-style: normal;
  font-weight: 700;
  src: url('fuentes/dincondensed-bold.eot') format('embedded-opentype');
  src: url('fuentes/dincondensed-bold.eot#iefix') format('embedded-opentype'),
       url('fuentes/dincondensed-bold.woff') format('woff'),
       url('fuentes/dincondensed-bold.ttf') format('truetype'),
       url('fuentes/dincondensed-bold.svg#din_condensedbold') format('svg');
}

// RECURSOS ======================================================================================
/*
calc(~" ");

content: attr(data-*);
//con el atributo "data-*" añadido en una etiqueta html puedo incluir un texto en el ":before" ó ":after" como valor del "content"

[class^="col-"]

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

background-image: url(../gestor/recursos/uploads/imagenes/.svg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;

background: linear-gradient(to bottom, #34b8c0 0%, #6f51c7 100%);

display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;

@keyframes blink {
  0% {
    opacity: .2;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: .2;
  }
}
*/

// MENSAJE COOKIES ================================================================================
#eucookielaw {
	display: none;
	color: @b @i;
    text-align: center @i;
    position: fixed @i;
    right: 0 @i;
    left: 0 @i;
    width: 100% @i;
    bottom: 0 @i;
    background: #212529 @i;
    z-index: 9999999 @i;
    padding: 25px @i;
    top: initial @i;
    max-width: initial @i;
    min-width: initial @i;
    box-shadow: none @i;

	p {
		max-width: 980px @i;
	    margin-left: auto @i;
	    margin-right: auto @i;

	    a {
	    	color: #ffffff @i;
	    	font-weight: bold @i;
	    	text-decoration: underline @i;
	    }
	}

	a#removecookie {
	    font-size: 1.6rem @i;
	    text-transform: uppercase @i;
		line-height: 1.2 @i;
	    font-weight: 700 @i;
		color: #212529 @i;
	    display: inline-flex @i;
	    justify-content: center @i;
	    align-items: center @i;
	    flex: 0 0 auto @i;
	    width: fit-content @i;
	    height: 35px @i;
	    width: 200px @i;
	    padding-left: 17px @i;
	    padding-right: 17px @i;
	    border-radius: 18px @i;
	    background: #ffc522 @i;
		position: relative @i;
		-webkit-transition: all 0.25s ease @i;
		-moz-transition: all 0.25s ease @i;
		transition: all 0.25s ease @i;

		&:hover {
			background-color: @b @i;
		}
	}
}

// TABLES =========================================================================================
table {
	font-size: 1.2rem;
	line-height: 1;
	width: 100%;
	border-right: solid 1px transparent;
    margin-bottom: 10px;

	thead {
		tr {
			th {
				color: @b;
				font-weight: 700;
				padding: 0px;
				margin: 0px;
				background: @azul;
				border-radius: 4px;

				span {
					padding: 5px 30px 0px;
				    display: flex;
				    height: 25px;
				    align-items: center;
				}
			}
		}
	}
	
	tbody {
		border-top: 10px solid transparent;

		tr {
			td {
				padding: 0px 30px;

				span {
					display: flex;
					align-items: center;
					height:  35px;
					padding: 0 20px;
					border-right: 1px solid #e9e9e9;
					border-bottom: 1px solid #e9e9e9;

					strong a {
						color: @azul;
					}

					ul {
						display: inline-flex;
						flex-wrap: wrap;
						margin-left: -15px;
						margin-bottom: 0px;

						li {
							list-style: disc;
							margin-left: 30px;
							margin-bottom: 0px;
							white-space: nowrap;
    

							&:last-child {
								margin-right: 0px;
							}
						}
					}
				}

				&:first-of-type {
					padding-right: 0;

					span {
						//padding-right: 20px;						
					}
				}

				&:last-of-type {
					padding-left: 0px;

					span {
						//padding-left: 20px;
						border-right: 0px;
					}
				}
			}

			&:last-of-type {
				td {
					span {
						border-bottom: none;
					}
				}
			}
		}
	}

	&.xs {
		font-size: 1.6rem;
		border: none;
		margin-bottom: 50px;

		thead {
			tr {
				th {
					color: @b;
					background: transparent;
					width: 50%;

					span {
						display: flex;
						justify-content: center;
						align-items: center;
						height: 55px;
						padding: 0 25px;
						background: @azul;
						border: none;
						border-radius: 4px;
					}
				}
			}
		}

		tbody {
			border-top: 5px solid transparent;

			tr {
				td {
					width: 50%;
					padding: 5px;
					vertical-align: top;

					span {
						line-height: 1.5;
						display: flex;
						justify-content: flex-start;
						align-items: flex-start;	
						height:  initial;					
						padding: 0 10px;
						background: transparent;
						border: none;
						border-radius: 4px;
					}
				}

				&:first-of-type {
					td {
						span {
							font-weight: 700;
							line-height: 1;
							justify-content: center;
							align-items: center;
							text-align: center;
							height: 55px;
							padding: 0 15px;
							background: @e1;
						}

						&:first-of-type {
							//border-right: solid 1px @e1;
						}
					}
				}
			}
		}
	}

	&.xl {
		font-size: 1.6rem;
		border: none;
		min-width: 690px;

		thead {
			tr {
				th {
					background: initial;
					border-right: 1px solid @b;

					span {
						font-size: 2rem;
						font-weight: 700;
						text-align: center;
						display: flex;
						justify-content: center;
						align-items: center;
						height: 100px;
						padding: 0 35px;						
						background: @azul;
						border-radius: 5px;

						&.smartphone-show {
							font-size: 1.6rem;
							color: #bbbbbb;
							font-weight: 400;
							text-align: center;
							height: initial;
							padding: 0 15px;
							background: transparent;

							i {
								margin-top: 5px;
							}
						}
					}
				}
			}
		}

		tbody {
			border: none;

			tr {
				&:first-of-type {
					td {
						&:first-of-type {
							span {
								border-top-left-radius: 5px;
							}
						}
					}
				}

				&:last-of-type {
					td {
						&:first-of-type {
							border-bottom: none;

							span {

								border-bottom-left-radius: 5px;
							}
						}
					}
				}

				td {
					padding: 0px;
					border-bottom: 1px solid @e1;
					border-right: 1px solid @e1;

					span {
						display: flex;
						justify-content: flex-start;
						align-items: center;
						height: 65px;
						padding: 0 35px;
						background: @b;
						border: none;
					}

					&:first-of-type {
						border-color: @b;

						span {
							text-align: right;
							justify-content: flex-end;
							background: @e1;
						}
					}
				}
			}
		}
	}
}

.wrapper-table {
    margin-bottom: 30px;
    overflow: auto;
}

// FORMULARIOS ====================================================================================
form {
	text-align: left;
	
	label {
		color: @n;
		font-size: inherit;
		font-weight: 400;
		margin-bottom: 0px;
		position: relative;

		&.independiente {
			margin-bottom: 10px;
		}
	}

	.vacio {
		box-shadow: inset 0px 0px 3px rgba(225,221,0,0.8) @i;
	}
	
	.input-field {
		margin-top: 25px;
		margin-bottom: 0px;
		
		textarea.materialize-textarea {
			height: auto;
			min-height: 85px;
			padding-top: 20px;
			padding-bottom: 20px;
		}
	}
	
	.condiciones {
		span {
			a {
				text-decoration: underline;

				&:hover, &:focus, &:active {
					color: @azul;
					text-decoration: none;
				}
			}
		}
	}
	
	.select-wrapper {
		position: relative;

		ul li {
			margin-bottom: 0px @i;
		}

		input.select-dropdown {
			text-overflow: ellipsis;
			outline: none;
			border: solid 1px #979797;
			width: calc(~'100% - 42px');
			margin: 0 0 20px 0;
			display: block;
			float: none;
			font-size: 1.6rem;
			line-height: 50px;
			height: auto;
			color: #979797;
			padding: 0 20px;
			background-color: transparent;			
			
			&.active {
				 border-color:@azul;
			}

			li.optgroup {
				background-color: @f6;
				
				> span {
					color: rgba(0,0,0,0.7);
				}
			}
		}

		span.caret {
			color: transparent;
			z-index: 1;
			line-height: 5px;
			right: 30px;
			top: 5px;
			width: 0px;
			border: none;
			z-index: 0;
			
			&:before {
				font-family: @fa;
				font-weight: 900;
				content:"\f0d7";
				color: #979797;
				font-size: 20px;
				background-color: @b;
			}
		}
	}
	
	.dropdown-content {
		background-color: transparent;
		box-shadow: 0 0 0 0 transparent;
		
		&.active {
			li:first-child {
				opacity: 0;
			}
		}
		
		li {
			background-color: #bbbbbb;
			border-bottom: solid 1px #fff;
			.transition(@ef-25);

			&:hover, &.active, &.selected {
				background-color:@azul @i;

				span {
					color: @b @i;
				}
			}
			
			&:first-child {
				border-top-left-radius: 4px;
				border-top-right-radius: 4px;
				margin-bottom: 1px;
				
				label {
					display: none;
				}
			}

			&:nth-child(2) {
				border-top-left-radius: 4px;
				border-top-right-radius: 4px;
			}
			
			&:last-child {
				border-bottom-left-radius: 4px;
				border-bottom-right-radius: 4px;
			}
		}
	}
	
	.dropdown-content li > a,
	.dropdown-content li > span {
		font-size: 16px;
		color: @b @i;
		line-height: 61px;
		padding: 0 20px;
	}
	
	.dropdown-content li > span > label {
		top: 2px;
		left: initial;
		height: 18px;
		position: relative;
		overflow: visible;
	}

	.file-field {
		max-width: 400px;

		::-webkit-input-placeholder {
		    color: @n @i;
		}
		:-moz-placeholder {
		    color: @n @i;
		}
		::-moz-placeholder {
		    color: @n @i;
		}
		:-ms-input-placeholder {
		    color: @n @i;
		}
		::-ms-input-placeholder {
		    color: @n @i;
		}
		:placeholder-shown {
		    color: @n @i;
		}

		.file-path-wrapper {
			padding-top: 25px;
			padding-left: 0px;
		}

		.btn {
			position: absolute;
			top: 25px;
			right: 0;
			bottom: 0;
			left: 0;
			height: 60px;
			opacity: 0;
		}

		span {
			font-size: 16px;
			position: relative;
			top: 20px;
		}

		input.file-path {
			width: calc(~'100% - 32px') @i;
			background-color: #eaeaea;

			&.valid {
				background-color: @b @i;
			}
		}
	}

	.switch {
		display: flex;

		label, p {
			margin-bottom: 0px;
		}

		label {
			margin-left: 20px;
		}

		p {
			max-width: 100% @i;
			font-size: 16px;
			margin: 0px;

			span {
				font-size: 80%;
				color: #666666;
			}
		}
	}

	ul {
		&.radios, &.check {
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1px solid #979797;
			margin-bottom: 20px;

			> li {
				flex-basis: 100%;
				padding: 20px;
				border-top: 1px solid #979797;
				border-left: 1px solid #979797;

				&:first-child {
					border-left: none;
				}

				label {
					font-size: 16px;
					margin-bottom: 0px;
				}
			}
		}

		&.check {
			border-bottom: solid 1px@azul;

			input[type="checkbox"] + label:before,
			input[type="checkbox"]:not(.filled-in) + label:after {
			    width: 28px;
			    height: 28px;
			    border: 1px solid #5a5a5a;
			}

			input[type="checkbox"] + label {
				height: initial;
				padding-left: 40px;

				small {
					color: @n;
				}
			}

			input[type="checkbox"]:checked + label:before {
			    top: -3px;
			    left: -7px;
			    width: 14px;
			    height: 28px;
			    border-top: 2px solid transparent;
			    border-left: 2px solid transparent;
			    border-right: 2px solid #E75112;
			    border-bottom: 2px solid #E75112;
			    -webkit-transform: rotate(40deg);
			    transform: rotate(40deg);
			    -webkit-backface-visibility: hidden;
			    backface-visibility: hidden;
			    -webkit-transform-origin: 100% 100%;
			    transform-origin: 100% 100%;	
			}

			> li {
				padding: 20px 0px 10px 20px;
				border-top: solid 1px@azul;
				border-left: none;

				label {
					font-weight: 500;
					font-size: 20px;
					line-height: 1.3;

					small {
						display: block;
					}
				}
			}
		}
	}

	input:-internal-autofill-selected {
		background-color: transparent @i;
	}

	/* Text inputs */
	input:not([type]),
	input[type=text],
	input[type=password],
	input[type=email],
	input[type=url],
	input[type=time],
	input[type=date],
	input[type=datetime],
	input[type=datetime-local],
	input[type=tel],
	input[type=number],
	input[type=search],
	textarea.materialize-textarea {
		text-align: left;
		outline: none;
		border-bottom: solid 1px #979797;
		width: 100%;
		height: 40px;  
		margin: 0 0 20px 0;	  
		box-shadow: none;
		box-sizing: content-box;	  
		font-size: 1.6rem;
		line-height: 1.2;	  
		padding: 0px;
		//background-color: @f6 @i;
		.transition(@ef-25);
		position: relative;
		z-index: 1;
	}

	/*
	input[type=text]::before {
	    content: '';
	    display: block;
	    position: absolute;
	    z-index: 1;
	    top: 0;
	    right: 0;
	    bottom: 0;
	    left: 0;
	    background: #fff;
	}
	*/

	input[type=text].buscador {
		width: calc(~'100% - 80px');
		background-image: url('img/ic-buscar.svg');
		background-position: calc(~'100% - 20px') center;
		background-repeat: no-repeat;
		padding: 0px 55px 0 25px;
	    margin: 0px;
	    border: none @i;
	    border-radius: 12px;
	    background-color: #f1f1f1;
	    position: relative;

	    &:focus {
	    	box-shadow: none @i;
	    }
	}

	// RADIO BUTTON =================================================
	input[type="radio"]:not(:checked),
	input[type="radio"]:checked {
		//width: 100%;
		//height: 100%;
	}

	input[type="radio"] + span:before,
	input[type="radio"] + span:after {
		top: 4px;
		.transform(translateY(0));
	}

	/*
		input[type="radio"]:not(:checked) + span,
		input[type="radio"]:checked + span {
			line-height: 1.4;
		}

		input[type="radio"]:not(:checked)+label,
		input[type="radio"]:checked+label {
		    position: relative;
		    padding-left: 28px;
		    cursor: pointer;
		    display: inline-block;
		    height: 25px;
		    line-height: 25px;
		    font-size: 1.7rem;
		    margin-bottom: 0px;
		    -webkit-transition: .28s ease;
		    transition: .28s ease;
		    -webkit-user-select: none;
		    -moz-user-select: none;
		    -ms-user-select: none;
		    user-select: none;
		}

		input[type="radio"]+span::before,
		input[type="radio"]+span::after {
		    content: '';
		    position: absolute;
		    left: 0;
		    top: 3px;
		    width: 16px;
		    height: 16px;
		    z-index: 0;
		    -webkit-transition: .28s ease;
		    transition: .28s ease;
		    .transform(translateY(0));
		}

		input[type="radio"]:checked+span::after {
			width: 16px;
		    height: 16px;
		}

		input[type="radio"]:not(:checked)+span::before {
		    border: 2px solid #5a5a5a;
		}

		input[type="radio"]:not(:checked)+span::before,
		input[type="radio"]:not(:checked)+span::after,
		input[type="radio"]:checked+span::before,
		input[type="radio"]:checked+span::after,
		input[type="radio"].with-gap:checked+span::before,
		input[type="radio"].with-gap:checked+span::after {
		    border-radius: 50%;
		}

		input[type="radio"].with-gap:checked+span::before {
		    border: 2px solid #5a5a5a;
		}

		input[type="radio"]:checked+span::after,
		input[type="radio"].with-gap:checked+span::after {
		    background-color: @azul;
		}

		input[type="radio"].with-gap:checked+span::after {
		    -webkit-transform: scale(0.6);
		    transform: scale(0.6);
		}
	*/

	// CHECKBOX =====================================================
	input[type="checkbox"]:not(:checked),
	input[type="checkbox"]:checked {
		//width: 100%;
		//height: 100%;
	}

	input[type="checkbox"] + span:not(.lever) {
		//line-height: 1.8;
	}

	input[type="checkbox"] + span:not(.lever):before,
	input[type="checkbox"]:not(.filled-in) + span:not(.lever):after {
		top: 3px;
	}

	/*
		input[type="checkbox"]+label {
			font-size: 1.6rem;
			color: @n;
			margin-bottom: 0px;
			padding-left: 30px;

			small {
				color: #666666;
			}
		}

		input[type="checkbox"] + span:not(.lever) {
			line-height: 1.4;
		}

		input[type="checkbox"] + span:not(.lever):before,
		input[type="checkbox"]:not(.filled-in) + span:not(.lever):after {
			top: 1px;
			width: 16px;
			height: 16px;
		}
	*/

	/*
	&.newsletter {
		input[type=text] {
			font-size: inherit @i;
			width: 230px @i;
			height: 36px @i;
			padding: 0 20px @i;
			margin: 0px @i;
			background: @b @i;
			border-radius: 18px @i;
			border: none @i;

			&:focus {
				border-bottom: none @i;
				-webkit-box-shadow: none @i;
				box-shadow: none @i;
			}
		}
	}
	*/
}

::-webkit-input-placeholder {
    color: @g3 @i;
}
:-moz-placeholder {
    color: @g3 @i;
}
::-moz-placeholder {
    color: @g3 @i;
}
:-ms-input-placeholder {
    color: @g3 @i;
}
::-ms-input-placeholder {
    color: @g3 @i;
}
:placeholder-shown {
    color: @g3 @i;
}


// VARIABLES ======================================================================================
@i: !important;
@azul: #008ed2;
@n: #000000;
@b: #ffffff;
@e1: #e1e1e1;
@f6: #f6f6f6;
@g3: #333333;
@g6: #666666;
@g9: #999999;
@n10: rgba(0, 0, 0, 0.1);
@n20: rgba(0, 0, 0, 0.2);
@n30: rgba(0, 0, 0, 0.3);
@n40: rgba(0, 0, 0, 0.4);
@n50: rgba(0, 0, 0, 0.5);
@n60: rgba(0, 0, 0, 0.6);
@n70: rgba(0, 0, 0, 0.7);
@n80: rgba(0, 0, 0, 0.8);
@n90: rgba(0, 0, 0, 0.9);
@b10: rgba(255, 255, 255, 0.1);
@b20: rgba(255, 255, 255, 0.2);
@b30: rgba(255, 255, 255, 0.3);
@b40: rgba(255, 255, 255, 0.4);
@b50: rgba(255, 255, 255, 0.5);
@b60: rgba(255, 255, 255, 0.6);
@b70: rgba(255, 255, 255, 0.7);
@b80: rgba(255, 255, 255, 0.8);
@b90: rgba(255, 255, 255, 0.9);
@ef-15: all 0.15s ease;
@ef-25: all 0.25s ease;
@ef-4: all 0.4s ease;
@fa: 'Font Awesome 5 Pro';
@regular: 'Din Condensed Regular';
@bold: 'Din Condensed Bold';

// FLEX  ==========================================================================================
.flex {
	display: flex;

	&.inline-flex {
		display: inline-flex;
	}

	&.w-100 {
		width: 100%;
	}

	&.h-100 {
		height: 100%;
	}

	&.x-axis {
	    flex-flow: row wrap;
	    align-items: flex-start;
	    justify-content: flex-start;
	    padding: 0px;
	    margin-bottom: 0px;

	    &.x-center {
	    	justify-content: center;
	    }

	    &.x-end {
			justify-content: flex-end;
		}

	    &.y-center {
	    	align-items: center;
	    }

	    &.y-end {
	    	align-items: flex-end;
	    }

		&.space-between {
			display: flex;
			justify-content: space-between;
		}		

		&.last-right {
			> li:last-of-type {
				margin-left: auto;
			}
		}

		&.nowrap {
			flex-wrap: nowrap;
		}

		&.li-spacing-3px {
			margin-left: -3px;
			margin-right: -3px;
			> li {
				margin-left: 3px;
				margin-right: 3px;
			}
		}

		&.li-spacing-5px {
			margin-left: -5px;
			margin-right: -5px;
			> li {
				margin-left: 5px;
				margin-right: 5px;
			}
		}

		&.li-spacing-10px {
			margin-left: -10px;
			margin-right: -10px;
			> li {
				margin-left: 10px;
				margin-right: 10px;
			}
		}

		&.li-spacing-15px {
			margin-left: -15px;
			margin-right: -15px;
			> li {
				margin-left: 15px;
				margin-right: 15px;
			}
		}

		&.li-spacing-20px {
			margin-left: -20px;
			margin-right: -20px;
			> li {
				margin-left: 20px;
				margin-right: 20px;
			}
		}

		&.li-spacing-25px {
			margin-left: 0px;
			margin-right: 0px;
			> li {
				margin-left: 25px;
				margin-right: 25px;
			}
		}

		&.li-mb-0px {
			> li {
				margin-bottom: 0px;
			}
		}

		&.li-mb-10px {
			> li {
				margin-bottom: 10px;
			}
		}

		&.li-mb-20px {
			> li {
				margin-bottom: 20px;
			}
		}

		&.li-mb-30px {
			> li {
				margin-bottom: 30px;
			}
		}
	}

	&.y-axis {
		flex-flow: column nowrap;

		&.xy-center {
			justify-content: center;
			align-items: center;
		}

		&.y-center {
			justify-content: center;
		}

		&.y-start {
			justify-content: flex-start;
		}

		&.y-end {
			justify-content: flex-end;
		}

		&.x-center {
			align-items: center;
		}

		&.x-start {
			align-items: flex-start;
		}

		&.x-end {
			align-items: flex-end;
		}

		&.li-spacing-0px {
			> li {
				margin-bottom: 0px;
			}
		}

		&.li-spacing-3px {
			> li {
				margin-bottom: 3px;
			}
		}

		&.li-spacing-5px {
			> li {
				margin-bottom: 5px;
			}
		}

		&.li-spacing-10px {
			> li {
				margin-bottom: 10px;
			}
		}

		&.li-spacing-15px {
			> li {
				margin-bottom: 15px;
			}
		}

		&.li-spacing-20px {
			> li {
				margin-bottom: 20px;
			}
		}

		&.li-spacing-25px {
			> li {
				margin-bottom: 25px;
			}
		}
	}
}

// ESTILOS EN FORMATO LESS ========================================================================
* {
	padding: 0;
	margin: 0;
	.box-sizing(border-box);

	&::before,
	&::after {
		.box-sizing(border-box);
	}

	&:hover,
	&:focus,
	&:active {
		outline: none;
		text-decoration: none;
	}
}

html {
	font-size: 62.5%;
	/* El tamaño predeterminado de fuente del navegador es 16px [16px * 62.5% = 10px] Así se calcula más fácil el tamaño de fuente 1em = 10px */
	position: relative;
	min-height: 100vh;
	scroll-behavior: smooth;
}

body {
	font-family: @regular, Arial, sans-serif;
	font-size: 2.4rem;
	line-height: 1;
	color: #58595b;
	font-weight: 400;
	font-style: normal;
	background-color: @b;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	.transition(@ef-25);
	position: relative;

	/*
	&::before {
		content: '';
		display: block;
		position: absolute;
		z-index: -1;
		top: 0;
		right: 0;
		left: 0;
		height: 140px;
		background-color: @azul;
	}
	*/

	&.overflow {
		overflow: hidden;
	}

	&.navegando {
		header {
			
		}
	}
}

h1, h2, h3, h4, h5, h6 {
	font-family: @bold;
	color: inherit;
	line-height: 1;
	text-rendering: optimizeLegibility;
	display: block;
	margin: 0px;
}

h1 {
	font-size: 16rem;
}

h2 {
	font-size: 5.5rem;
}

h3 {
	font-size: 4.8rem;
}

h4 {
	font-size: 2.4rem;
}

ul {
	margin-bottom: 0px;
	clear: both;

	> li {
		list-style-type: none;
		margin-bottom: 10px;
	}
}

p {
	margin-bottom: 0px;
}

b, strong {
	font-family: @bold;
	font-weight: normal;
}

i, em {
	font-style: italic;
}

small {
	font-size: 80%;
}

a {
	color: inherit;
	outline: none;
	border: none;
	text-decoration: none;

	img {
		outline: none;
		border: none;
	}

	&.no-link {
		text-decoration: none;

		&:hover,
		&:focus,
		&:active {
			color: @n;
			text-decoration: underline;
		}
	}

	&:hover,
	&:focus,
	&:active {
		color: @azul;
		outline: none;
		text-decoration: none;
		cursor: pointer;
	}

	&:hover {
		.transition(@ef-15);
	}
}

.boton {
	font-family: @bold;
	font-size: 3.6rem;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 56px;
	padding: 0 20px 0 15px;
	border-radius: 10px;
	.box-shadow(3px 3px 5px @n50);

	&.completo, &.mas-info {
		font-size: 3.6rem;
		color: @b;
		padding: 0 30px;
		background: rgb(0,194,244);
		background: -moz-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
		background: -webkit-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
		background: linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00c2f4",endColorstr="#008ed2",GradientType=1);

		> span {
			font-size: 3.6rem;
		}
	}

	&.mas-info {
		height: initial;
		white-space: nowrap;
		padding: 10px;
	}

	> span {
		font-family: @regular;
		font-size: 2rem;
		position: relative;
		display: flex;
		flex-direction: column;
		padding-left: 30px;

		&::before {
			content: '';
			display: block;
			width: 4px;
			height: 50px;
			position: absolute;
			left: 13px;
			top: 50%;
			.transform(translateY(-50%)); 
			background-image: url('img/separador-small.svg');
		}

		> span {
			display: block;
		}
	}
}

.boton-slider {
	background-color: white;
	font-size: 30px;
	padding: 20px 80px 20px 30px;
	font-weight: bold;
	border-radius: 25px;
}

.overflow-hidden {
	overflow: hidden;
}

.overflow-visible {
	overflow: visible;
}

.bajar, .subir {
	color: @b;
	font-size: 6rem;
	line-height: 30px;
	display: block;
	height: 30px;    
	position: absolute;
	z-index: 2;
	bottom: 20px;
	left: 50%;
	.transform(translate(-50%));

	i {
		font-size: 6rem;
		line-height: 30px;
	}
}

.z-index_1 {
	position: relative;
	z-index: 1;
}

.txt-left {
	text-align: left @i;

	h1, h2, h3, h4, h5, h6, p {
		margin-left: initial @i;
	}
}

.txt-right {
	text-align: right @i;

	h1, h2, h3, h4, h5, h6, p {
		margin-right: initial @i;
	}
}

img {
	max-width: 100%;
	max-height: 100%;
}

hr {
	height: 1px;
	border: none;
	border-top: solid 1px @g9;
	margin-top: 30px;
	margin-bottom: 30px;
	clear: both;

	&.dotted {
		border-top: dotted 1px @g9;
		margin: 0px;
	}
}

.owl-carousel {
	.item {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	&.cabecera {
		z-index: 0;
		width: 100%;

		.owl-item, .item {
			height: 600px;
			min-height: 600px @i;
		}

		.item {
			background-size: cover;
			background-position: center;
			background-repeat: no-repeat;
			position: relative;

			&::before {
				content: '';
			    display: block;
			    position: absolute;
			    z-index: 0;
			    top: 0;
			    right: 0;
			    bottom: 0;
			    left: 0;
			    background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.2) 80%);
			    .transition(@ef-4);
			}

			&::after {
				content: '';
			    display: block;
			    position: absolute;
			    z-index: 1;
			    top: 0;
			    right: 0;
			    bottom: 0;
			    left: 0;
			    background: rgba(0, 0, 0, 0.4);
			    .transition(@ef-4);
			    opacity: 0;
			}

			.container-fluid, .row {
				height: 100%;
				position: relative;
			}

			[class*="col-"] {
				display: flex;
				flex-direction: column;
				max-height: 100%;
				align-items: flex-start;
				justify-content: center;
				flex-wrap: nowrap;
				padding: 75px 15px;

				&.img {
					align-items: center;

					img {
						width: 100%;
					}
				}

				&.txt {
					padding-left: 30px;
					padding-right: 30px;

					h1 {
						font-weight: 600;
						font-style: italic;
						color: @b;
						line-height: 1.2;
						margin-bottom: 0px;
						.text-shadow(1px 1px 2px rgba(0, 0, 0, 0.8));
					}

					p {
						font-size: 2rem;
						line-height: 1.5;
						color: @b;

						&:first-of-type {
							margin-top: 30px;
						}
					}
				}
			}

			.copyright {
				position: absolute;
				z-index: 1;
				bottom: 20px;
				right: 25px;
				padding: 0px 0px;

				p {
					font-size: 1.6rem;
					letter-spacing: 1px;
					font-weight: 400;					
					color: @b;
					.text-shadow(1px 1px 1px @n);
					margin: 0px;
				}
			}

			&.safe-tourism {
				&::before, &::after {
					display: none;
				}

				a.boton.white {
					&:hover {
						color: @b;
					}
				}

				[class*="col-"] {
					padding: 15px;

					&.txt {
						h1, p {
							
						}
					}
				}
			}
		}
	}
}

header {
	> .cabecera {
		height: 770px;
		background-size: cover;
		background-position: top center;
		background-repeat: no-repeat;
		position: relative;
		overflow: hidden;
		display: flex;
	    justify-content: center;
	    align-items: center;

		&::before {
			content: '';
			display: block;
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			background-image: url('../gestor/recursos/uploads/imagenes/home/mascara.svg');
			background-size: cover;
			background-position: top center;
			background-repeat: no-repeat;
		}

		> .logo {
			position: absolute;
			left: -50px;
			bottom: 0px;
		}

		> .txt {
			text-align: right;
			position: relative;
			z-index: 1;
			//top: 50%;
			//left: 50%;
			//.transform(translate(-50%, -50%));

			&::after {
				content: '···';
				font-family: 'Times New Roman';
				font-weight: bold;
				color: @b;
				font-size: 8rem;
				line-height: 1;				
				letter-spacing: -3px;
				position: absolute;
				right: 0;
				bottom: -55px;
				.text-shadow(1px 1px 8px @n70);
			}

			h1 {
				color: @b;
				.text-shadow(1px 1px 8px @n70);
			}

			h2 {
				font-family: @regular;
				color: @b;
				.text-shadow(1px 1px 8px @n70);

				strong {
					font-family: @bold;
				}
			}
		}

		&.intranet {
			background-size: 90%;
			background-position: -120% 70%;
			flex-direction: column;
		    justify-content: center;
		    align-items: flex-end;
		    padding: 0 10%;

			&::before {
				background-image: url('../gestor/recursos/uploads/imagenes/intranet/mascara-intranet.png');
			}

			> .logo {
				position: relative;
				left: 0px;
			    bottom: 0px;
			    z-index: 1;
			    margin-bottom: 100px;
			}

			> .txt {
				&::after {
					font-size: 14rem;
					letter-spacing: -10px;
					top: -75px;
					bottom: initial;
				}

				h1 {
					font-family: @regular;

					strong {
						font-family: @bold;
					}
				}
			}
		}
	}
}

main {
	section {
		padding-top: 30px;
		padding-bottom: 120px;

		h2 {
			font-size: 4rem;
            font-family: 'Din Condensed Regular';
		}

		.container {
			.evento {
				position: relative; 

				&:nth-of-type(2n+0) {
					.tarjeta > div.col-12, .boton.completo, .boton.mas-info {
						background: rgb(0,231,211);
						background: -moz-linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						background: -webkit-linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						background: linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00e7d3",endColorstr="#00bcac",GradientType=1);
					}
					
					.actividad > div.lugar, .boton.completo, .boton.mas-info {
						background: rgb(0,231,211);
						background: -moz-linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						background: -webkit-linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						background: linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00e7d3",endColorstr="#00bcac",GradientType=1);
					}
				}

				.tarjeta {
					margin-top: 90px;
					background: #e6e7e8;
					border-radius: 15px;
					.box-shadow(3px 3px 5px @n50);

					.col-12 {
						background: rgb(0,194,244);
						background: -moz-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
						background: -webkit-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
						background: linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
						filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00c2f4",endColorstr="#008ed2",GradientType=1);
						border-radius: 15px;
						border-bottom-left-radius: 0px;
						border-bottom-right-radius: 0px;
						color: white;

						.lugar {
							color: @b;
							text-align: left;
							//height: 190px;
							padding: 25px 110px 25px 20px;
							align-items: flex-start;

							>h2 { 
								font-size: 4.8rem;
								strong {
									font-family: @bold;
									font-size: 4.8rem;
								}
							}
							&::after {
								display: none;
							}
						}
					}

					.actividad {
						display: flex;
						flex-direction: row;
						flex-wrap: wrap;
						justify-content: space-between;
						align-items: stretch;

						> div {
							text-align: center;
							display: flex;
							flex-direction: column;
							justify-content: center;
							align-items: center;
							padding: 10px 10px;
							position: relative;

							&::after {
								content: url('img/separador-big.svg');
								position: absolute;
								right: -3px;
								top: 50%;
								.transform(translateY(-50%));
							}

							> span {
								font-family: @bold;
								font-size: 4.8rem;
							}

							&.fecha {
								width: 190px;
								padding-left: 0px;
							}

							&.hora {
								width: 140px;
							}

							&.precio {
								width: 300px;
							}

							&.precio, &.info {
								h3 {
									display: flex;
									align-items: center;

									span {
										font-family: @regular;
										line-height: 0.8;
										padding-left: 30px;
										position: relative;

										&::before {
											content: '';
											display: block;
											width: 3px;
											position: absolute;
											left: 14px;
											top: 0;
											bottom: 0;
											background-color: #00a99d;
										}
									}
								}
								
								h4 {
									display: flex;
									align-items: center;

									span {
										font-family: @regular;
										line-height: 0.8;
										padding-left: 30px;
										position: relative;									
									}
								}
							}

							&.info {
								width: 380px;

								> * {
									margin-bottom: 5px;
								}

								h3 {
									font-size: 3rem;
								}
							}

							&.contacto {

								h3 {
									display: flex;
									align-items: center;

									span {
										font-family: @regular;
										line-height: 0.8;
										padding-left: 30px;
										position: relative;

										&::before {
											content: '';
											display: block;
											width: 3px;
											position: absolute;
											left: 14px;
											top: 0;
											bottom: 0;
											background-color: #00a99d;
										}
									}
								}

								width: 315px;

								&::after {
									display: none;
								}

								> * {
									margin-bottom: 5px;
								}

								h3 {
									font-size: 3rem;
								}
							}
						}
					}
				}

				.actividad {
					display: flex;
					flex-direction: row;
					flex-wrap: wrap;
					justify-content: space-between;
					align-items: center;
					background: #e6e7e8;
					border-bottom-left-radius: 15px;
					border-bottom-right-radius: 15px;
					
					&.intranet{
						border-radius: 15px;
						.box-shadow(3px 3px 5px @n50);
					}
					
					> div {
						text-align: center;
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;
						padding: 10px 10px;
						position: relative;

						&::after {
							content: url('img/separador-big.svg');
							position: absolute;
							right: -3px;
							top: 50%;
							.transform(translateY(-50%));
						}

						> span {
							font-family: @bold;
							font-size: 4.8rem;
						}

						&.lugar {
							color: @b;
							text-align: left;
							//height: 190px;
							width: 420px;
							padding: 35px 140px 35px 30px;
							align-items: flex-start;
							border-top-left-radius: 15px;
							border-bottom-left-radius: 15px;
							-webkit-clip-path: polygon(0 0, 100% 0, 70% 100%, 0% 100%);
							clip-path: polygon(0 0, 100% 0, 70% 100%, 0% 100%);
							background: rgb(0,194,244);
							background: -moz-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
							background: -webkit-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
							background: linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
							filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00c2f4",endColorstr="#008ed2",GradientType=1);

							&::after {
								display: none;
							}
						}

						&.fecha {
							width: 125px;
							padding-left: 0px;
						}

						&.hora {
							width: 140px;
						}

						&.precio {
							width: 300px;
						}

						&.precio, &.info {
							h3 {
								display: flex;
								align-items: center;

								span {
									font-family: @regular;
									line-height: 0.8;
									padding-left: 30px;
									position: relative;

									&::before {
										content: '';
										display: block;
										width: 3px;
										position: absolute;
										left: 14px;
										top: 0;
										bottom: 0;
										background-color: #00a99d;
									}
								}
							}
                            
                            h4 {
								display: flex;
								align-items: center;

								span {
									font-family: @regular;
									line-height: 0.8;
									padding-left: 30px;
									position: relative;									
								}
							}
						}

						&.info {
							width: 380px;					

							> * {
								margin-bottom: 5px;
							}

							h3 {
								font-size: 3rem;
							}
						}
					}
				}
			}
		}

		&.intranet {
			background-image: url('../gestor/recursos/uploads/imagenes/intranet/marca-de-agua.svg');
			background-position: -10px calc(~'100% + 110px');
			background-repeat: no-repeat;

			.container {
				text-align: center;

				> img {

				}

				.evento {
					.tarjeta {
						margin-top: 120px;

						.col-12 {
							background: rgb(0,194,244);
							background: -moz-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
							background: -webkit-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
							background: linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
							filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00c2f4",endColorstr="#008ed2",GradientType=1);
							border-radius: 15px;
							border-bottom-left-radius: 0px;
							border-bottom-right-radius: 0px;
							color: white;
						}
					}
					.actividad {
						flex-direction: column;
						margin-top: 120px;
						padding: 20px 160px;
						background: rgb(0,231,211);
						background: -moz-linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						background: -webkit-linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						background: linear-gradient(90deg, rgba(0,231,211,1) 0%, rgba(0,188,172,1) 100%);
						filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00e7d3",endColorstr="#00bcac",GradientType=1);

						&::before {							
							content: '';
							width: 139px;
							height: 139px;
							display: block;
							background-image: url('img/ic-sello-sombra.svg');
							background-size: contain;
							background-position: center;
							background-repeat: no-repeat;
							position: absolute;
							z-index: 1;
							top: -60px;
							left: 10px;
						}

						h2 {
							color: @b;
						}
					}

					> ul {
						margin-top: 20px;

						> li {
							margin-top: 20px;
							position: relative;

							&::before {
								content: url('img/separador-big.svg');
							    position: absolute;
							    left: -27px;
							    top: 50%;
							    .transform(translateY(-50%));
							}

							&::after {
								content: url('img/separador-big.svg');
							    position: absolute;
							    right: -28px;
							    top: 50%;
							    .transform(translateY(-50%));
							}

							/*&:first-child::before {
								content: url('img/separador-big.svg');
							    position: absolute;
							    left: -28px;
							    top: 50%;
							    .transform(translateY(-50%));
							}*/

							> a {
								letter-spacing: 1px;
								display: flex;
								align-items: center;
								flex-direction: column;

								img {
									width: 46px;
									height: 46px;
									margin-top: 20px;
								}
							}
						}
					}
				}
			}
		}
	}
}

footer {
	color: @b;
	background: @azul;
	padding: 80px 0px 30px;

	ul.flex {
		justify-content: space-between @i;

		> li {
			margin-bottom: 50px;

			img {
				max-height: 120px;
				max-width: 185px;
			}
		}
	}
}


// CONDICIONALES ==================================================================================

// MIN WIDTH ===========================
@media screen and (min-width : 992px) {

	.desktop-hidden {
		display: none @i;
	}

}

@media screen and (min-width : 768px) {

	.smartphone-show {
		display: none @i;
	}

	.smartphone-hidden {
		display: block @i;
	}

}

// MAX WIDTH ===========================
@media screen and (max-width : 1599px) {

	header {
		> .cabecera {
			height: 500px;

			> .logo {
				left: -110px;
				bottom: -70px;
				height: 100%;
			}

			&.intranet {
				> .logo {
					height: initial;
					margin-bottom: 60px;

					img {
						width: 240px;
					}
				}

				> .txt {
					&::after {
						font-size: 9rem;
						top: -55px;
					}

					h1 {
					    font-size: 8.5rem;
					}

					h2 {
						font-size: 4rem;
					}
				}
			}
		}
	}

	main {
		section {
			.container {
				.evento {
					.actividad {
						> div {
							&.lugar {
								border-bottom-left-radius: 0px;
                                min-height: 200px;
							}

							&.fecha, &.hora {
								width: calc(~"calc(100% - 420px) / 2");
							}

							&.info {
								padding: 30px 30px;
								margin-left: auto;
							}

							&.precio, &.info {
								width: 50%;
							}
						}
					}
				}
			}
		}
	}

	footer {
		ul.flex {
			justify-content: center @i;
		}
	}

}

@media screen and (max-width : 1399px) {

	.boton.mas-info {
		top: initial;
	    bottom: 0;
	    left: 0;
	    padding: 0 10px;
	    height: 56px;
	}

}


@media screen and (max-width : 1199px) {
	.owl-carousel {
		&.cabecera {
			height: 500px @i;
			min-height: 500px @i;

			.owl-item, .item {
				height: 500px @i;
				min-height: 500px @i;
			}
		}
	}

	header {
		> .cabecera {
			height: 400px;

			> .logo {
				left: -110px;
			    bottom: 0px;
			    height: 350px;
			}

			&.intranet {
				> .logo {
					img {
						width: 160px;
					}
				}

				> .txt {
					h1 {
						font-size: 5.5rem;
					}
				}
			}
		}
	}

	h1 {
		font-size: 10rem;
	}

	h2 {
		font-size: 3.5rem;
	}

	main {
		section {
			&.intranet {
				background-size: 60%;

				.container img {
				    width: 200px;
				}
			}
		}
	}

}

@media screen and (max-width : 991px) {
	.owl-carousel {
		&.cabecera {
			height: 400px @i;
			min-height: 400px @i;
			//top: 70px;
			top: 65px;

			.owl-item {
				.container {
					max-width: 100%;
				}
			}

			.owl-item, .item {
				height: 400px @i;
				min-height: 400px @i;
			}

			.item {
				[class*="col-"] {
					&.img {
						justify-content: flex-start;
						padding-top: 30px;
					}

					&.txt {
						h1 {
							font-size: 3.5rem;
						}

						p {
							font-size: inherit;

							&:first-of-type {
								margin-top: 20px;
							}
						}
					}
				}
			}
		}
	}

	::-webkit-scrollbar {
		width: 4px;
		height: 4px;
		border-radius: 2px;
	}
	::-moz-scrollbar {
		width: 4px;
		height: 4px;
		border-radius: 2px;
	}

	.mobile-hidden {
		display: none @i;
	}

	.flex {
		&.x-axis {
			&.md-y-axis {
				flex-direction: column
			}
		}

		&.md-w-100 {
			width: 100%;

			> li {
				width: 100%;

				a.boton {
					width: 100%;
				}
			}
		}
	}

	a.boton {
		&.md-100 {
			width: 100%;
		}
	}

	.md-txt-center {
		text-align: center @i;

		h1, h2, h3, h4, h5, h6, p {
			margin-left: auto @i;
			margin-right: auto @i;
		}
	}

	header {
		> .cabecera {
			height: 300px;

			> .logo {
				left: -70px;
			    bottom: -30px;
			    height: 270px;
			}
		}
	}

	main {
		section {
			&.intranet {
				background-position: -10px calc(~'100% + 40px');
			}
		}
	}

}

@media screen and (max-width : 767px) {
	.owl-carousel {
		&.cabecera {
			//height: 320px @i;
			//min-height: 320px @i;

			.owl-item, .item {
				//height: 300px @i;
				//min-height: 300px @i;

				.container {
					max-width: 100%;
				}

				[class*="col-"] {
					&.img {
						justify-content: center;
						align-items: center;
						padding-top: 30px;
						padding-bottom: 0px;
						//margin-left: auto;
						//margin-right: auto;
						position: relative;
						opacity: 0.15;

						img {
							left: initial;
							bottom: initial;
							//max-height: 260px;
							//max-width: 80%;
							max-width: 200px;
						}

						.smartphone-show {
							position: absolute;
						    bottom: 30px;
						    left: 50%;
						    .transform(translateX(-50%));
						}

						&.center {
							img {
								left: initial;
								bottom: initial;
								max-height: 160px;
							}
						}
					}

					&.txt {
						justify-content: center;
						padding-top: 50px;
						padding-bottom: 50px;

						h1 {
							font-size: 3rem;
						}
					}
				}

				&.safe-tourism {
					[class*="col-"].img {
						position: absolute;
					}
				}
			}

			&.mini {
				&.sangre {
					.item {
						[class*="col-"] {
							&.img {
								padding: 0px 30px;

								img {
									max-height: 250px;
								}
							}
						}
					}
				}
			}
		}

		a.boton.lg {
		    font-size: 1.3rem;
		    width: fit-content;
		    height: 35px;
		    border-radius: 17px;
		    padding-left: 17px;
		    padding-right: 17px;
		}
	}

	.sm-txt-center {
		text-align: center @i;

		h1, h2, h3, h4, h5, h6, p {
			margin-left: auto @i;
			margin-right: auto @i;
		}
	}

	.sm-w-100 {
		max-width: 100%;
	}

	.flex {
		&.x-axis {
			&.x-axis {
				&.sm-y-axis {
					flex-direction: column
				}

				&.sm-x-start {
					justify-content: flex-start;
				}
			}
		}

		&.sm-w-100 {
			width: 100%;

			> li {
				width: 100%;

				a.boton {
					width: 100%;
				}
			}
		}
	}

	table {
		tbody {
			tr {
				td {
					padding: 0px 15px;
					
					span {
						padding: 0 15px;
					}
				}
			}
		}
	}

	.smartphone-hidden {
		display: none @i;
	}

	.smartphone-show {
		display: block @i;
	}

	.boton {
		font-size: 3rem;

		> span {
			font-size: 1.8rem;
		}

		&.completo {
			font-size: 3rem;
		}
	}

	body {
		font-size: 2rem;
	}

	h1 {
		font-size: 7rem;
	}

	h2 {
		font-size: 2.4rem;
	}

	h3 {
		font-size: 3rem;
	}

	header {
		> .cabecera {
			align-items: flex-end;
			padding-bottom: 40px;

			> .logo {
				width: 220px;
			    height: 185px;
			    bottom: initial;
			    top: 20px;
				left: calc(~'50% - 10px');
			    transform: translateX(-50%);
			    
			}

			&.intranet {
				> .logo {
					width: inherit;
					top: initial;
					.transform(none);
				}
			}
		}
	}

	main {
		section {
			.container {
				.evento {
					.actividad {
						> div {
							&::after {
								.transform(translateY(-50%) scale(0.7));
							}

							span {
								font-size: 3rem;
							}

							&.lugar {
							    width: 310px;
							    height: initial;
							    padding: 20px 80px 20px 20px;
                                min-height: 200px;
							}

							&.fecha, &.hora {
								width: calc(~'calc(100% - 310px) / 2');
							}

							&.hora::after {
								display: none;
							}
						}
					}
				}
			}

			&.intranet {
				.container {
					img {
						width: 140px;
					}

					.evento {
						margin-bottom: 80px;

						&:last-of-type {
							margin-bottom: 0px;
						}

						.tarjeta{
							margin-top: 40px;
							 padding: 50px 20px 20px;

							 .col-12 {
								 background: rgb(0,194,244);
								 background: -moz-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
								 background: -webkit-linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
								 background: linear-gradient(90deg, rgba(0,194,244,1) 0%, rgba(0,142,210,1) 100%);
								 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00c2f4",endColorstr="#008ed2",GradientType=1);
								 border-radius: 15px;
								 border-bottom-left-radius: 0px;
								 border-bottom-right-radius: 0px;
								 color: white;
							 }
						}

						.actividad {

							 &::before {
							 	top: -35px;
							 	width: 80px;
							 	height: 80px;
							 }

							 h2 {
							 	font-size: 3rem;
							 }
						}

						ul > li {
							width: calc(~'25% + 50px');

							> a img {
							    width: 36px;
							    height: 36px;
							}
						}
					}
				}
			}
		}
	}

	footer {
		ul.flex {
			> li img {
				max-height: 80px;
			}
		}
	}

}

@media screen and (max-width : 575px) {
	.owl-carousel {
		&.cabecera {
			left: 8px;
			right: 8px;
			width: calc(~'100% - 16px');

			.owl-item, .item {
				.container {
					width: 100%;
					margin-left: 0px;
					margin-right: 0px;
				}

				[class*="col-"] {
					height: initial;
					padding-bottom: 0px;

					&.txt {
						justify-content: flex-end;
						padding: 20px 25px 55px;

						h1 {
							font-size: 2.8rem;
						}
					}
				}

				&.safe-tourism {
					[class*="col-"] {
						&.txt {
							padding: 0px 7px 20px;

							h1 {
								font-size: 2.4rem;
							}

							p {
								&:last-of-type {
									margin-bottom: 0px;
								}
							}
						}
					}
				}
			}
		}

		.owl-item .row {
			width: calc(~'100% + 20px');
		}
	}

	body {
		font-size: 1.8rem;
	}

	.formulario-fancybox {
	    padding: 50px 20px;
	}

	.boton {
		&.completo, &.mas-info {
			font-size: 2rem;

			> span {
				font-size: 2rem;
			}
		}
	}

	h1 {
		
	}

	header {
		> .cabecera {
			&.intranet {
				background-size: cover;
				background-position: left top;
			}
		}
	}

	main {
		section {
			padding-top: 0px;
			padding-bottom: 60px;

			h2 {
				font-size: 4rem;
                font-family: 'Din Condensed Regular';
			}

			.container {
				.evento {
					.tarjeta{
						margin-top: 60px;
					}
					.actividad {

						> div {
							span {
								font-size: 2.8rem;
							}

							&.lugar {
							    width: 100%;
							    padding: 20px;
							    margin-bottom: 20px;
							    -webkit-clip-path: polygon(100% 0%, 0% 0%, 0% 100%, 100% 100%);
							    clip-path: polygon(100% 0%, 0% 0%, 0% 100%, 100% 100%);
							    border-top-right-radius: 15px;
                                min-height: 200px;
							}

							&.fecha, &.hora {
								width: 25%;
							}

							&.fecha {
								padding-left: 10px;
							}

							&.hora::after {
								display: block;
							}

							&.info {
								width: 100%;
								padding: 20px 10px 10px 10px;
							}
						}
					}
				}
			}

			&.intranet {
				padding-top: 15px;
				
				.container {
					img {
						width: 100px;
					}

					.evento {
						.tarjeta{padding: 35px 20px 20px;}
						.actividad {
						

						&::before {
							top: -25px;
							width: 60px;
							height: 60px;
						}

						h2 {
							font-size: 2.6rem;
						}
					}
				}
				}
			}
		}
	}

	footer {
		.container {
			padding-left: 25px;
			padding-right: 25px;
		}
	}

}

@media screen and (max-width : 375px) {

	main section {
		.container {
			.evento {
				.actividad {
					> div {
						span {
							font-size: 2.4rem;
						}

						&.precio, &.info {
							h3, h4 {
								font-size: 2.4rem;
							}
						}
					}
				}
			}
		}
	}

	footer {
		padding: 70px 0px 20px;

		ul.flex > li {
		    width: 100%;
		    text-align: center;
		}
	}

}

@media print {
	a[href]:after {
		content: none @i;
	}
}

.button.buscador-documentos{
    border: none;
    font-family: 'Din Condensed Regular';
    font-size: 20px;
    font-weight: normal;
}

.web-contacto{
	font-family: 'Arial'!important;
	font-size: 75%;
}