/*
 * Complement for Bootstrap v4.1.2
 * Copyright 2018 http://hytcom.net
 *
*/

/* SMALL SIZE =======================================================================================*/
@media (max-width: 767px) {
	/* AVATARS =======================================================================================*/ 
	.xs-avatar-xs { height: 32px; width: 32px; }
	.xs-avatar-sm { height: 64px; width: 64px; }
	.xs-avatar-md { height: 80px; width: 80px; }
	.xs-avatar-lg { height: 180px; width: 180px; }
	.xs-avatar-xl { height: 300px; width: 300px; }
	.xs-avatar-hg { height: 600px; width: 600px; }

	/* DIPLAY ========================================================================================*/
	.xs-invisible { opacity: 0; }
	.xs-visible { opacity: 1; }

	/* .xs-o-porcentaje_de_opacidad */
	.xs-o-0 { opacity: 0 !important; filter: alpha(opacity=0) !important; }
	.xs-o-10 { opacity: 0.1 !important; filter: alpha(opacity=10) !important; }
	.xs-o-20 { opacity: 0.2 !important; filter: alpha(opacity=20) !important; }
	.xs-o-30 { opacity: 0.3 !important; filter: alpha(opacity=30) !important; }
	.xs-o-40 { opacity: 0.4 !important; filter: alpha(opacity=40) !important; }
	.xs-o-50 { opacity: 0.5 !important; filter: alpha(opacity=50) !important; }
	.xs-o-60 { opacity: 0.6 !important; filter: alpha(opacity=60) !important; }
	.xs-o-70 { opacity: 0.7 !important; filter: alpha(opacity=70) !important; }
	.xs-o-80 { opacity: 0.8 !important; filter: alpha(opacity=80) !important; }
	.xs-o-90 { opacity: 0.9 !important; filter: alpha(opacity=90) !important; }
	.xs-o-100 { opacity: 1 !important; filter: alpha(opacity=100) !important; }

	/* SIZES =========================================================================================*/
	.xs-w-25 { width:25% !important; }
	.xs-w-50 { width:50% !important; }
	.xs-w-75 { width:75% !important; }
	.xs-w-100 { width:100% !important; }
	.xs-w-auto { width:auto !important; }
	.xs-h-25 { height:25% !important; }
	.xs-h-50 { height:50% !important; }
	.xs-h-75 { height:75% !important; }
	.xs-h-100 { height:100% !important; }
	.xs-h-auto { height:auto !important; }

	.xs-max-width-xs { max-width: 576px !important; }
	.xs-max-width-sm { max-width: 768px !important; }
	.xs-max-width-md { max-width: 992px !important; }
	.xs-max-width-lg { max-width: 1200px !important; }
	.xs-max-width-xl { max-width: 1600px !important; }

	.xs-height-auto { height: auto !important; }
	.xs-height-100 { height: 100% !important; }
	.xs-height-75 { height: 75% !important; }
	.xs-height-50 { height: 50% !important; }
	.xs-height-25 { height: 25% !important; }
	.xs-height-0 { height: 0px !important; }

	.xs-vh { height: 100vh !important; }
	.xs-vh-75 { height: 75vh !important; }
	.xs-vh-50 { height: 50vh !important; }
	.xs-vh-25 { height: 25vh !important; }
	.xs-vh-min { min-height: 100vh !important; }
	.xs-vh-min-75 { min-height: 75vh !important; }
	.xs-vh-min-50 { min-height: 50vh !important; }
	.xs-vh-min-25 { min-height: 25vh !important; }
	.xs-vh-max { max-height: 100vh !important; }
	.xs-vh-max-75 { max-height: 75vh !important; }
	.xs-vh-max-50 { max-height: 50vh !important; }
	.xs-vh-max-25 { max-height: 25vh !important; }

	.xs-vw { width: 100vw !important; }
	.xs-vw-75 { width: 75vw !important; }
	.xs-vw-50 { width: 50vw !important; }
	.xs-vw-25 { width: 25vw !important; }
	.xs-vw-min { min-width: 100vw !important; }
	.xs-vw-min-75 { min-width: 75vw !important; }
	.xs-vw-min-50 { min-width: 50vw !important; }
	.xs-vw-min-25 { min-width: 25vw !important; }
	.xs-vw-max { max-width: 100vw !important; }
	.xs-vw-max-75 { max-width: 75vw !important; }
	.xs-vw-max-50 { max-width: 50vw !important; }
	.xs-vw-max-25 { max-width: 25vw !important; }

	/* MARGIN ========================================================================================*/
	/* valor de margin general */
	.xs-m-xs { margin: 5px !important; }
	.xs-m-sm { margin: 10px !important; }
	.xs-m-md { margin: 15px !important; }
	.xs-m-lg { margin: 30px !important; }
	.xs-m-xl { margin: 60px !important; }
	.xs-m-hg { margin: 120px !important; }
	.xs-m-ww { margin: 180px !important; }

	.xs-mx-auto { margin-left: auto !important; margin-right: auto !important; }
	.xs-my-auto { margin-top: auto !important; margin-bottom: auto !important; }

	/* valores de margin individuales*/
	/* .xs-m[lado]-[tamaño] */

		/* valor de margin TOP */
		.xs-mt-xs { margin-top: 5px !important; }
		.xs-mt-sm { margin-top: 10px !important; }
		.xs-mt-md { margin-top: 15px !important; }
		.xs-mt-lg { margin-top: 30px !important; }
		.xs-mt-xl { margin-top: 60px !important; }
		.xs-mt-hg { margin-top: 120px !important; }
		.xs-mt-ww { margin-top: 180px !important; }

		/* valor de margin RIGHT */
		.xs-mr-xs { margin-right: 5px !important; }
		.xs-mr-sm { margin-right: 10px !important; }
		.xs-mr-md { margin-right: 15px !important; }
		.xs-mr-lg { margin-right: 30px !important; }
		.xs-mr-xl { margin-right: 60px !important; }
		.xs-mr-hg { margin-right: 120px !important; }
		.xs-mr-ww { margin-right: 180px !important; }

		/* valor de margin BOTTOM */
		.xs-mb-xs { margin-bottom: 5px !important; }
		.xs-mb-sm { margin-bottom: 10px !important; }
		.xs-mb-md { margin-bottom: 15px !important; }
		.xs-mb-lg { margin-bottom: 30px !important; }
		.xs-mb-xl { margin-bottom: 60px !important; }
		.xs-mb-hg { margin-bottom: 120px !important; }
		.xs-mb-ww { margin-bottom: 180px !important; }

		/* valor de margin LEFT */
		.xs-ml-xs { margin-left: 5px !important; }
		.xs-ml-sm { margin-left: 10px !important; }
		.xs-ml-md { margin-left: 15px !important; }
		.xs-ml-lg { margin-left: 30px !important; }
		.xs-ml-xl { margin-left: 60px !important; }
		.xs-ml-hg { margin-left: 120px !important; }
		.xs-ml-ww { margin-left: 180px !important; }

		/* valor de margin TOP-BOTTOM */
		.xs-my-xs { margin-bottom: 5px !important;  margin-top: 5px !important; }
		.xs-my-sm { margin-bottom: 10px !important; margin-top: 10px !important; }
		.xs-my-md { margin-bottom: 15px !important; margin-top: 15px !important; }
		.xs-my-lg { margin-bottom: 30px !important; margin-top: 30px !important; }
		.xs-my-xl { margin-bottom: 60px !important; margin-top: 60px !important; }
		.xs-my-hg { margin-bottom: 120px !important; margin-top: 120px !important; }
		.xs-my-ww { margin-bottom: 180px !important; margin-top: 180px !important; }

		/* valor de margin LEFT-RIGHT */
		.xs-mx-xs { margin-left: 5px !important;  margin-right: 5px !important; }
		.xs-mx-sm { margin-left: 10px !important; margin-right: 10px !important; }
		.xs-mx-md { margin-left: 15px !important; margin-right: 15px !important; }
		.xs-mx-lg { margin-left: 30px !important; margin-right: 30px !important; }
		.xs-mx-xl { margin-left: 60px !important; margin-right: 60px !important; }
		.xs-mx-hg { margin-left: 120px !important; margin-right: 120px !important; }
		.xs-mx-ww { margin-left: 180px !important; margin-right: 180px !important; }

	/* valores de margenes negativos */
	.xs--m-xs { margin: -5px !important; }
	.xs--m-sm { margin: -10px !important; }
	.xs--m-md { margin: -15px !important; }
	.xs--m-lg { margin: -30px !important; }
	.xs--m-xl { margin: -60px !important; }
	.xs--m-hg { margin: -120px !important; }
	.xs--m-ww { margin: -180px !important; }

		.xs--mt-xs { margin-top: -5px !important; }
		.xs--mt-sm { margin-top: -10px !important; }
		.xs--mt-md { margin-top: -15px !important; }
		.xs--mt-lg { margin-top: -30px !important; }
		.xs--mt-xl { margin-top: -60px !important; }
		.xs--mt-hg { margin-top: -120px !important; }
		.xs--mt-ww { margin-top: -180px !important; }

		.xs--mr-xs { margin-right: -5px !important; }
		.xs--mr-sm { margin-right: -10px !important; }
		.xs--mr-md { margin-right: -15px !important; }
		.xs--mr-lg { margin-right: -30px !important; }
		.xs--mr-xl { margin-right: -60px !important; }
		.xs--mr-hg { margin-right: -120px !important; }
		.xs--mr-ww { margin-right: -180px !important; }

		.xs--mb-xs { margin-bottom: -5px !important; }
		.xs--mb-sm { margin-bottom: -10px !important; }
		.xs--mb-md { margin-bottom: -15px !important; }
		.xs--mb-lg { margin-bottom: -30px !important; }
		.xs--mb-xl { margin-bottom: -60px !important; }
		.xs--mb-hg { margin-bottom: -120px !important; }
		.xs--mb-ww { margin-bottom: -180px !important; }

		.xs--ml-xs { margin-left: -5px !important; }
		.xs--ml-sm { margin-left: -10px !important; }
		.xs--ml-md { margin-left: -15px !important; }
		.xs--ml-lg { margin-left: -30px !important; }
		.xs--ml-xl { margin-left: -60px !important; }
		.xs--ml-hg { margin-left: -120px !important; }
		.xs--ml-ww { margin-left: -180px !important; }

		.xs--my-xs { margin-bottom: -5px !important;  margin-top: -5px !important; }
		.xs--my-sm { margin-bottom: -10px !important; margin-top: -10px !important; }
		.xs--my-md { margin-bottom: -15px !important; margin-top: -15px !important; }
		.xs--my-lg { margin-bottom: -30px !important; margin-top: -30px !important; }
		.xs--my-xl { margin-bottom: -60px !important; margin-top: -60px !important; }
		.xs--my-hg { margin-bottom: -120px !important; margin-top: -120px !important; }
		.xs--my-ww { margin-bottom: -180px !important; margin-top: -180px !important; }

		.xs--mx-xs { margin-left: -5px !important;  margin-right: -5px !important; }
		.xs--mx-sm { margin-left: -10px !important; margin-right: -10px !important; }
		.xs--mx-md { margin-left: -15px !important; margin-right: -15px !important; }
		.xs--mx-lg { margin-left: -30px !important; margin-right: -30px !important; }
		.xs--mx-xl { margin-left: -60px !important; margin-right: -60px !important; }
		.xs--mx-hg { margin-left: -120px !important; margin-right: -120px !important; }
		.xs--mx-ww { margin-left: -180px !important; margin-right: -180px !important; }

	/* exclusiones de margin */
	/* .xs-m[lado]-n = para NONE */
	/* .xs-m[lado]-o = para ONLY */
	.xs-m-n { margin: 0px !important; }
	.xs-mx-n { margin-left: 0px !important; margin-right: 0px !important; }
	.xs-my-n { margin-top: 0px !important; margin-bottom: 0px !important; }
	.xs-mt-n { margin-top: 0px !important; }
	.xs-mb-n { margin-bottom: 0px !important; }
	.xs-ml-n { margin-left: 0px !important; }
	.xs-mr-n { margin-right: 0px !important; }
	.xs-mx-o { margin-top: 0px !important; margin-bottom: 0px !important; }
	.xs-my-o { margin-left: 0px !important; margin-right: 0px !important; }
	.xs-mt-o { margin-bottom: 0px !important; margin-left: 0px !important; margin-right: 0px !important; }
	.xs-mb-o { margin-top: 0px !important; margin-left: 0px !important; margin-right: 0px !important; }
	.xs-ml-o { margin-top: 0px !important; margin-bottom: 0px !important; margin-right: 0px !important; }
	.xs-mr-o { margin-top: 0px !important; margin-bottom: 0px !important; margin-left: 0px !important; }

	/* PADDING =======================================================================================*/
	/* valor de padding general */
	.xs-p-xs { padding: 5px !important; }
	.xs-p-sm { padding: 10px !important; }
	.xs-p-md { padding: 15px !important; }
	.xs-p-lg { padding: 30px !important; }
	.xs-p-xl { padding: 60px !important; }
	.xs-p-hg { padding: 120px !important; }
	.xs-p-ww { padding: 180px !important; }

	/* valores de padding individuales*/
	/* .xs-m[lado]-[tamaño] */

		/* valor de padding TOP */
		.xs-pt-xs { padding-top: 5px !important; }
		.xs-pt-sm { padding-top: 10px !important; }
		.xs-pt-md { padding-top: 15px !important; }
		.xs-pt-lg { padding-top: 30px !important; }
		.xs-pt-xl { padding-top: 60px !important; }
		.xs-pt-hg { padding-top: 120px !important; }
		.xs-pt-ww { padding-top: 180px !important; }

		/* valor de padding RIGHT */
		.xs-pr-xs { padding-right: 5px !important; }
		.xs-pr-sm { padding-right: 10px !important; }
		.xs-pr-md { padding-right: 15px !important; }
		.xs-pr-lg { padding-right: 30px !important; }
		.xs-pr-xl { padding-right: 60px !important; }
		.xs-pr-hg { padding-right: 120px !important; }
		.xs-pr-ww { padding-right: 180px !important; }

		.xs-pb-xs { padding-bottom: 5px !important; }
		.xs-pb-sm { padding-bottom: 10px !important; }
		.xs-pb-md { padding-bottom: 15px !important; }
		.xs-pb-lg { padding-bottom: 30px !important; }
		.xs-pb-xl { padding-bottom: 60px !important; }
		.xs-pb-hg { padding-bottom: 120px !important; }
		.xs-pb-ww { padding-bottom: 180px !important; }

		.xs-pl-xs { padding-left: 5px !important; }
		.xs-pl-sm { padding-left: 10px !important; }
		.xs-pl-md { padding-left: 15px !important; }
		.xs-pl-lg { padding-left: 30px !important; }
		.xs-pl-xl { padding-left: 60px !important; }
		.xs-pl-hg { padding-left: 120px !important; }
		.xs-pl-ww { padding-left: 180px !important; }

		.xs-py-xs { padding-bottom: 5px !important;  padding-top: 5px !important; }
		.xs-py-sm { padding-bottom: 10px !important; padding-top: 10px !important; }
		.xs-py-md { padding-bottom: 15px !important; padding-top: 15px !important; }
		.xs-py-lg { padding-bottom: 30px !important; padding-top: 30px !important; }
		.xs-py-xl { padding-bottom: 60px !important; padding-top: 60px !important; }
		.xs-py-hg { padding-bottom: 120px !important; padding-top: 120px !important; }
		.xs-py-ww { padding-bottom: 180px !important; padding-top: 180px !important; }

		.xs-px-xs { padding-left: 5px !important;  padding-right: 5px !important; }
		.xs-px-sm { padding-left: 10px !important; padding-right: 10px !important; }
		.xs-px-md { padding-left: 15px !important; padding-right: 15px !important; }
		.xs-px-lg { padding-left: 30px !important; padding-right: 30px !important; }
		.xs-px-xl { padding-left: 60px !important; padding-right: 60px !important; }
		.xs-px-hg { padding-left: 120px !important; padding-right: 120px !important; }
		.xs-px-ww { padding-left: 180px !important; padding-right: 180px !important; }

	.xs-p-n { padding: 0px !important; }
	.xs-px-n { padding-left: 0px !important; padding-right: 0px !important; }
	.xs-py-n { padding-top: 0px !important; padding-bottom: 0px !important; }
	.xs-pt-n { padding-top: 0px !important; }
	.xs-pb-n { padding-bottom: 0px !important; }
	.xs-pl-n { padding-left: 0px !important; }
	.xs-pr-n { padding-right: 0px !important; }
	.xs-px-o { padding-top: 0px !important; padding-bottom: 0px !important; }
	.xs-py-o { padding-left: 0px !important; padding-right: 0px !important; }
	.xs-pt-o { padding-bottom: 0px !important; padding-left: 0px !important; padding-right: 0px !important; }
	.xs-pb-o { padding-top: 0px !important; padding-left: 0px !important; padding-right: 0px !important; }
	.xs-pl-o { padding-top: 0px !important; padding-bottom: 0px !important; padding-right: 0px !important; }
	.xs-pr-o { padding-top: 0px !important; padding-bottom: 0px !important; padding-left: 0px !important; }

	/* TEXT ==========================================================================================*/
	.xs-text-justify { text-align: justify !important; }
	.xs-text-nowrap { white-space: nowrap !important; }
	.xs-text-truncate { overflow: hidden; text-overflow:ellipsis; white-space:nowrap; }
	.xs-text-left { text-align: left !important; }
	.xs-text-right { text-align: right !important; }
	.xs-text-center { text-align: center !important; }

	.xs-text-tt,
	.xs-text-monospace {
		font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Courier New", Courier, monospace !important;
	}

	.xs-overflow-auto {
		overflow: auto !important;
	}

	.xs-overflow-hidden {
		overflow: hidden !important;
	}

	.xs-overflow-scroll {
		overflow: scroll !important;
	}

	.xs-overflow-clip {
		overflow: hidden !important;
		text-overflow: clip !important; 
		white-space: nowrap !important; 
	}

	.xs-overflow-ellipsis {
		overflow: hidden !important;
		text-overflow: ellipsis !important; 
		white-space: nowrap !important; 
	}

	.xs-text-underline { text-decoration: underline !important; }
	.xs-text-underline-n { text-decoration: none !important; }
	.xs-text-through { text-decoration: line-through !important; }
	.xs-text-italic { font-style: italic !important; }
	.xs-text-nowrap { white-space: nowrap !important; }

	.xs-text-bold { font-weight: bold !important; }
	.xs-text-bolder { font-weight: bolder !important; }
	.xs-text-lighter { font-weight: lightert !important; }
	.xs-text-normal { font-weight: normal !important; }
	.xs-text-weight-100 { font-weight: 100 !important; }
	.xs-text-weight-200 { font-weight: 200 !important; }
	.xs-text-weight-300 { font-weight: 300 !important; }
	.xs-text-weight-400 { font-weight: 400 !important; }
	.xs-text-weight-500 { font-weight: 500 !important; }
	.xs-text-weight-600 { font-weight: 600 !important; }
	.xs-text-weight-700 { font-weight: 700 !important; }
	.xs-text-weight-800 { font-weight: 800 !important; }
	.xs-text-weight-900 { font-weight: 900 !important; }

	.xs-text-sp-xs { letter-spacing: 1px !important; }
	.xs-text-sp-sm { letter-spacing: 3px !important; }
	.xs-text-sp-md { letter-spacing: 6px !important; }
	.xs-text-sp-lg { letter-spacing: 12px !important; }
	.xs-text-sp-xl { letter-spacing: 18px !important; }
	.xs-text-sp-hg { letter-spacing: 24px !important; }
	.xs-text-sp-ww { letter-spacing: 48px !important; }

	/* TEXT SIZE =====================================================================================*/
	.xs-text-8 { font-size: 8px !important; }
	.xs-text-9 { font-size: 9px !important; }
	.xs-text-10 { font-size: 10px !important; }
	.xs-text-11 { font-size: 11px !important; }
	.xs-text-12 { font-size: 12px !important; }
	.xs-text-14 { font-size: 14px !important; }
	.xs-text-16 { font-size: 16px !important; }
	.xs-text-18 { font-size: 18px !important; }
	.xs-text-20 { font-size: 20px !important; }
	.xs-text-24 { font-size: 24px !important; }
	.xs-text-30 { font-size: 30px !important; }
	.xs-text-36 { font-size: 36px !important; }

	.xs-text-xs { font-size: 8px !important; }
	.xs-text-sm { font-size: 10px !important; }
	.xs-text-md { font-size: 15px !important; }
	.xs-text-lg { font-size: 20px !important; }
	.xs-text-xl { font-size: 25px !important; }
	.xs-text-hg { font-size: 45px !important; }
	.xs-text-ww { font-size: 65px !important; }

	/* TEXT COLORS ===================================================================================*/
	.xs-text-bg-primary, 
	.xs-text-bg-success, 
	.xs-text-bg-info, 
	.xs-text-bg-warning, 
	.xs-text-bg-danger {
		color: #FFFFFF !important;
	}

	.xs-text-none { color: inherit !important; }
	.xs-text-amber { color: #FFC107 !important; }
	.xs-text-black { color: #000000 !important; }
	.xs-text-blue { color: #2196f3 !important; }
	.xs-text-blue-gray, .xs-text-blue-grey { color: #607D8B !important; }
	.xs-text-blue-dark-gray, .xs-text-blue-dark-grey { color: #263238 !important; }
	.xs-text-brown { color: #795548 !important; }
	.xs-text-burgundy { color: #AB0000 !important; }
	.xs-text-cyan { color: #00BCD4 !important; }
	.xs-text-dark { color: #111112 !important; }
	.xs-text-dark-gray, .xs-text-dark-grey { color: #666666 !important; }
	.xs-text-deep-orange { color: #FF5722 !important; }
	.xs-text-deep-purple { color: #673AB7 !important; }
	.xs-text-gray, .xs-text-grey { color: #9E9E9E !important; }
	.xs-text-indigo { color: #3F51B5 !important; }
	.xs-text-ivory { color: #FFFFF0 !important; }
	.xs-text-green { color: #4CAF50 !important; }
	.xs-text-light-blue { color: #B3E5FC !important; }
	.xs-text-light-green { color: #D7FFD9 !important; }
	.xs-text-light-gray, .xs-text-light-grey { color: #D8D8D8 !important; }
	.xs-text-lighter-gray, .xs-text-lighter-grey { color: #F9F9F9 !important; }
	.xs-text-lime { color: #CDDC39 !important; }
	.xs-text-peach { color: #FFDAB9 !important; }
	.xs-text-pink { color: #E91E63 !important; }
	.xs-text-orange { color: #FF9800 !important; }
	.xs-text-purple { color: #9C27B0 !important; }
	.xs-text-red { color: #D50000 !important; }
	.xs-text-teal { color: #009688 !important; }
	.xs-text-white { color: #FFFFFF !important; }
	.xs-text-yellow { color: #FFEB3B !important; }

	/* BACK COLORS ===================================================================================*/
	.xs-bg-hover:hover { background-color: #F5F5F5 !important; }
	.xs-bg-none, .xs-bg-n { background-color: transparent !important; }
	.xs-bg-amber { background-color: #FFC107 !important; }
	.xs-bg-black { background-color: #000000 !important; }
	.xs-bg-blue { background-color: #2196f3 !important; }
	.xs-bg-blue-gray, .xs-bg-blue-grey { background-color: #607D8B !important; }
	.xs-bg-blue-dark-gray, .xs-bg-blue-dark-grey { background-color: #263238 !important; }
	.xs-bg-brown { background-color: #795548 !important; }
	.xs-bg-burgundy { background-color: #AB0000 !important; }
	.xs-bg-cyan { background-color: #00BCD4 !important; }
	.xs-bg-dark { background-color: #111112 !important; }
	.xs-bg-dark-gray, .xs-bg-dark-grey { background-color: #666666 !important; }
	.xs-bg-deep-orange { background-color: #FF5722 !important; }
	.xs-bg-deep-purple { background-color: #673AB7 !important; }
	.xs-bg-gray, .xs-bg-grey { background-color: #9E9E9E !important; }
	.xs-bg-indigo { background-color: #3F51B5 !important; }
	.xs-bg-ivory { background-color: #FFFFF0 !important; }
	.xs-bg-green { background-color: #4CAF50 !important; }
	.xs-bg-light-blue { background-color: #B3E5FC !important; }
	.xs-bg-light-green { background-color: #D7FFD9 !important; }
	.xs-bg-light-gray, .xs-bg-light-grey { background-color: #D8D8D8 !important; }
	.xs-bg-lighter-gray, .xs-bg-lighter-grey { background-color: #F9F9F9 !important; }
	.xs-bg-lime { background-color: #CDDC39 !important; }
	.xs-bg-peach { background-color: #FFDAB9 !important; }
	.xs-bg-pink { background-color: #E91E63 !important; }
	.xs-bg-orange { background-color: #FF9800 !important; }
	.xs-bg-purple { background-color: #9C27B0 !important; }
	.xs-bg-red { background-color: #D50000 !important; }
	.xs-bg-teal { background-color: #009688 !important; }
	.xs-bg-white { background-color: #FFFFFF !important; }
	.xs-bg-yellow { background-color: #FFEB3B !important; }

	.xs-bg-amber-glass { background-color: rgba(255,193,7,0.4) !important; }
	.xs-bg-black-glass { background-color: rgba(0,0,0,0.4) !important; }
	.xs-bg-blue-glass { background-color: rgba(33,150,243,0.4) !important; }
	.xs-bg-blue-gray-glass, .xs-bg-blue-grey-glass { background-color: rgba(33,150,243,0.4) !important; }
	.xs-bg-blue-dark-gray-glass, .xs-bg-blue-dark-grey-glass { background-color: rgba(38,50,56,0.4) !important; }
	.xs-bg-brown-glass { background-color: rgba(121,85,72,0.4) !important; }
	.xs-bg-burgundy-glass { background-color: rgba(171,0,0,0.4) !important; }
	.xs-bg-cyan-glass { background-color: rgba(0,188,212,0.4) !important; }
	.xs-bg-dark-glass { background-color: rgba(17,17,18,0.4) !important; }
	.xs-bg-dark-gray-glass, .xs-bg-dark-grey-glass { background-color: rgba(102,102,102,0.4) !important; }
	.xs-bg-deep-orange-glass { background-color: rgba(255,87,34,0.4) !important; }
	.xs-bg-deep-purple-glass { background-color: rgba(103,58,183,0.4) !important; }
	.xs-bg-gray-glass, .xs-bg-grey-glass { background-color: rgba(158,158,158,0.4) !important; }
	.xs-bg-indigo-glass { background-color: rgba(63,81,181,0.4) !important; }
	.xs-bg-ivory-glass { background-color: rgba(255,255,240,0.4) !important; }
	.xs-bg-green-glass { background-color: rgba(76,175,80,0.4) !important; }
	.xs-bg-light-blue-glass { background-color: rgba(3,169,244,0.4) !important; }
	.xs-bg-light-green-glass { background-color: rgba(139,195,74,0.4) !important; }
	.xs-bg-light-gray-glass, .xs-bg-light-grey-glass { background-color: rgba(216,216,216,0.4) !important; }
	.xs-bg-lighter-gray-glass, .xs-bg-lighter-grey-glass { background-color: rgba(249,249,249,0.4) !important; }
	.xs-bg-lime-glass { background-color: rgba(205,220,57,0.4) !important; }
	.xs-bg-peach-glass { background-color: rgba(255,218,185,0.4) !important; }
	.xs-bg-pink-glass { background-color: rgba(233,30,99,0.4) !important; }
	.xs-bg-orange-glass { background-color: rgba(255,152,0,0.4) !important; }
	.xs-bg-purple-glass { background-color: rgba(156,39,176,0.4) !important; }
	.xs-bg-red-glass { background-color: rgba(213,0,0,0.4) !important; }
	.xs-bg-teal-glass { background-color: rgba(0,150,136,0.4) !important; }
	.xs-bg-white-glass { background-color: rgba(255,255,255,0.4) !important; }
	.xs-bg-yellow-glass { background-color: rgba(255,235,59,0.4) !important; }

	/* BORDERS =======================================================================================*/
	.xs-brd-none, .xs-brd-n { border: none !important; }
	.xs-brd-solid { border-style: solid !important; }
	.xs-brd-dotted { border-style: dotted !important; }
	.xs-brd-dashed { border-style: dashed !important; }
	.xs-brd-double { border-style: double !important; }
	.xs-brd-groove { border-style: groove !important; }
	.xs-brd-ridge { border-style: ridge !important; }
	.xs-brd-inset { border-style: inset !important; }
	.xs-brd-outset { border-style: outset !important; }

	.xs-brd-xs { border-width: 1px !important; }
	.xs-brd-sm { border-width: 2px !important; }
	.xs-brd-md { border-width: 4px !important; }
	.xs-brd-lg { border-width: 6px !important; }
	.xs-brd-xl { border-width: 10px !important; }
	.xs-brd-hg { border-width: 20px !important; }

	.xs-brdr { border-radius: 100% !important; }
	.xs-brdr-xs { border-radius: 3px !important; }
	.xs-brdr-sm { border-radius: 5px !important; }
	.xs-brdr-md { border-radius: 15px !important; }
	.xs-brdr-lg { border-radius: 35px !important; }
	.xs-brdr-xl { border-radius: 80px !important; }
	.xs-brdr-hg { border-radius: 125px !important; }
	.xs-brdr-n { border-radius: 0px !important; }

	.xs-brdr-t-o { border-bottom-left-radius: 0px !important; border-bottom-right-radius: 0px !important; }
	.xs-brdr-r-o { border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; }
	.xs-brdr-b-o { border-top-left-radius: 0px !important; border-top-right-radius: 0px !important; }
	.xs-brdr-l-o { border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; }

	.xs-brdr-tl-n { border-top-left-radius: 0px !important; }
	.xs-brdr-tr-n { border-top-right-radius: 0px !important; }
	.xs-brdr-bl-n { border-bottom-left-radius: 0px !important; }
	.xs-brdr-br-n { border-bottom-right-radius: 0px !important; }
	.xs-brdr-tl-o { border-top-right-radius: 0px !important; border-bottom-left-radius: 0px !important; border-bottom-right-radius: 0px !important; }
	.xs-brdr-tr-o { border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; border-bottom-right-radius: 0px !important; }
	.xs-brdr-bl-o { border-top-left-radius: 0px !important; border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; }
	.xs-brdr-br-o { border-top-left-radius: 0px !important; border-top-right-radius: 0px !important; border-bottom-left-radius: 0px !important; }

	.xs-brd-x-n { border-left-width: 0px !important; border-right-width: 0px !important; }
	.xs-brd-y-n { border-top-width: 0px !important; border-bottom-width: 0px !important; }
	.xs-brd-t-n { border-top-width: 0px !important; }
	.xs-brd-b-n { border-bottom-width: 0px !important; }
	.xs-brd-l-n { border-left-width: 0px !important; }
	.xs-brd-r-n { border-right-width: 0px !important; }
	.xs-brd-x-o { border-top-width: 0px !important; border-bottom-width: 0px !important; }
	.xs-brd-y-o { border-left-width: 0px !important; border-right-width: 0px !important; }
	.xs-brd-t-o { border-bottom-width: 0px !important; border-left-width: 0px !important; border-right-width: 0px !important; }
	.xs-brd-b-o { border-top-width: 0px !important; border-left-width: 0px !important; border-right-width: 0px !important; }
	.xs-brd-l-o { border-top-width: 0px !important; border-bottom-width: 0px !important; border-right-width: 0px !important; }
	.xs-brd-r-o { border-top-width: 0px !important; border-bottom-width: 0px !important; border-left-width: 0px !important; }

	.xs-brd-amber { border-color: #FFC107 !important; }
	.xs-brd-black { border-color: #000000 !important; }
	.xs-brd-blue { border-color: #2196f3 !important; }
	.xs-brd-blue-gray, .xs-brd-blue-grey { border-color: #607D8B !important; }
	.xs-brd-blue-dark-gray, .xs-brd-blue-dark-grey { border-color: #263238 !important; }
	.xs-brd-brown { border-color: #795548 !important; }
	.xs-brd-burgundy { border-color: #AB0000 !important; }
	.xs-brd-cyan { border-color: #00BCD4 !important; }
	.xs-brd-dark { border-color: #111112 !important; }
	.xs-brd-dark-gray, .xs-brd-dark-grey { border-color: #666666 !important; }
	.xs-brd-deep-orange { border-color: #FF5722 !important; }
	.xs-brd-deep-purple { border-color: #673AB7 !important; }
	.xs-brd-gray, .xs-brd-grey { border-color: #9E9E9E !important; }
	.xs-brd-indigo { border-color: #3F51B5 !important; }
	.xs-brd-ivory { border-color: #FFFFF0 !important; }
	.xs-brd-green { border-color: #4CAF50 !important; }
	.xs-brd-light-blue { border-color: #B3E5FC !important; }
	.xs-brd-light-green { border-color: #D7FFD9 !important; }
	.xs-brd-light-gray, .xs-brd-light-grey { border-color: #D8D8D8 !important; }
	.xs-brd-lighter-gray, .xs-brd-lighter-grey { border-color: #F9F9F9 !important; }
	.xs-brd-lime { border-color: #CDDC39 !important; }
	.xs-brd-peach { border-color: #FFDAB9 !important; }
	.xs-brd-pink { border-color: #E91E63 !important; }
	.xs-brd-orange { border-color: #FF9800 !important; }
	.xs-brd-purple { border-color: #9C27B0 !important; }
	.xs-brd-red { border-color: #D50000 !important; }
	.xs-brd-teal { border-color: #009688 !important; }
	.xs-brd-white { border-color: #FFFFFF !important; }
	.xs-brd-yellow { border-color: #FFEB3B !important; }

	/* BOTONES =======================================================================================*/
	.xs-btn {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-rendering: optimizeLegibility;
		font-size: 15px;
		line-height: 15px;
	}

	.xs-btn-group-hg > .xs-btn, .xs-btn-hg {
		border-radius: 12px;
		font-size: 45px;
		line-height: 45px;
		padding: 22px 26px;
	}
		.xs-btn-group-hg > .xs-btn *, .xs-btn-hg * {
			font-size: 45px !important;
			line-height: 45px !important;
		}

	.xs-btn-group-xl > .xs-btn, .xs-btn-xl {
		border-radius: 10px;
		font-size: 25px;
		line-height: 25px;
		padding: 16px 22px;
	}
		.xs-btn-group-xl > .xs-btn *, .xs-btn-xl * {
			font-size: 25px !important;
			line-height: 25px !important;
		}

	.xs-btn-group-lg > .xs-btn, .xs-btn-lg {
		border-radius: 8px;
		font-size: 20px;
		line-height: 20px;
		padding: 12px 18px;
	}
		.xs-btn-group-lg > .xs-btn *, .xs-btn-lg * {
			font-size: 20px !important;
			line-height: 20px !important;
		}

	.xs-btn-group-md > .xs-btn, .xs-btn-md {
		border-radius: 6px;
		font-size: 15px;
		line-height: 15px;
		padding: 10px 12px;
	}
		.xs-btn-group-md > .xs-btn *, .xs-btn-md * {
			font-size: 15px !important;
			line-height: 15px !important;
		}

	.xs-btn-group-sm > .xs-btn, .xs-btn-sm {
		border-radius: 4px;
		font-size: 11px;
		line-height: 11px;
		padding: 6px 8px;
	}
		.xs-btn-group-sm > .xs-btn *, .xs-btn-sm * {
			font-size: 11px !important; 
			line-height: 11px !important;
		}

	.xs-btn-group-xs > .xs-btn, .xs-btn-xs {
		border-radius: 5px;
		font-size: 9px;
		line-height: 9px;
		padding: 4px 6px;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-rendering: optimizeLegibility;
	}
		.xs-btn-group-xs > .xs-btn *, .xs-btn-xs * {
			font-size: 9px;
			line-height: 9px;
		}

	/* circle */
	.xs-btn-circle {
		width: 30px;
		height: 30px;
		text-align: center;
		padding: 6px 0;
		font-size: 12px;
		line-height: 1.428571429;
		border-radius: 15px;
	}

	.xs-btn-circle.btn-lg {
		width: 50px;
		height: 50px;
		padding: 10px 16px;
		font-size: 18px;
		line-height: 1.33;
		border-radius: 25px;
	}

	.xs-btn-circle.btn-xl {
		width: 70px;
		height: 70px;
		padding: 10px 16px;
		font-size: 24px;
		line-height: 1.33;
		border-radius: 35px;
	}

	/* colores */
	.xs-btn-amber {
		background-color: #FFC107 !important;
		border-color: #EFB107 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-amber.active, .xs-btn-amber.focus, .xs-btn-amber:active, .xs-btn-amber:focus, .xs-btn-amber:hover {
		background-color: #EFB107 !important;
		border-color: #DFA100 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-black {
		background-color: #000000 !important;
		border-color: #000000 !important;
		color: #EEEEEE !important;
	}
	.xs-btn-black.active, .xs-btn-black.focus, .xs-btn-black:active, .xs-btn-black:focus, .xs-btn-black:hover {
		background-color: #222222 !important;
		border-color: #222222 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-blue {
		background-color: #2196f3 !important;
		border-color: #1186E3 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-blue.active, .xs-btn-blue.focus, .xs-btn-blue:active, .xs-btn-blue:focus, .xs-btn-blue:hover {
		background-color: #1186E3 !important;
		border-color: #0176D3 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-blue-gray, .xs-btn-blue-grey {
		background-color: #607D8B !important;
		border-color: #506D7B !important;
		color: #FFFFFF !important;
	}
	.xs-btn-blue-gray.active, .xs-btn-blue-gray.focus, .xs-btn-blue-gray:active, .xs-btn-blue-gray:focus, .xs-btn-blue-gray:hover, 
	.xs-btn-blue-grey.active, .xs-btn-blue-grey.focus, .xs-btn-blue-grey:active, .xs-btn-blue-grey:focus, .xs-btn-blue-grey:hover {
		background-color: #506D7B !important;
		border-color: #405D6B !important;
		color: #FFFFFF !important;
	}

	.xs-btn-blue-dark-gray, .xs-btn-blue-dark-grey {
		background-color: #263238 !important;
		border-color: #162018 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-blue-dark-gray.active, .xs-btn-blue-dark-gray.focus, .xs-btn-blue-dark-gray:active, .xs-btn-blue-dark-gray:focus, .xs-btn-blue-dark-gray:hover,
	.xs-btn-blue-dark-grey.active, .xs-btn-blue-dark-grey.focus, .xs-btn-blue-dark-grey:active, .xs-btn-blue-dark-grey:focus, .xs-btn-blue-dark-grey:hover {
		background-color: #162018 !important;
		border-color: #061008 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-brown {
		background-color: #795548 !important;
		border-color: #674236 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-brown.active, .xs-btn-brown.focus, .xs-btn-brown:active, .xs-btn-brown:focus, .xs-btn-brown:hover {
		background-color: #674236 !important;
		border-color: #573226 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-burgundy {
		background-color: #AB0000 !important;
		border-color: #9B0000 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-burgundy.active, .xs-btn-burgundy.focus, .xs-btn-burgundy:active, .xs-btn-burgundy:focus, .xs-btn-burgundy:hover {
		background-color: #9B0000 !important;
		border-color: #7B0000 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-cyan {
		background-color: #00BCD4 !important;
		border-color: #00ACC4 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-cyan.active, .xs-btn-cyan.focus, .xs-btn-cyan:active, .xs-btn-cyan:focus, .xs-btn-cyan:hover {
		background-color: #00ACC4 !important;
		border-color: #009CB4 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-dark {
		background-color: #111112 !important;
		border-color: #222224 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-dark.active, .xs-btn-dark.focus, .xs-btn-dark:active, .xs-btn-dark:focus, .xs-btn-dark:hover {
		background-color: #282830 !important;
		border-color: #222224 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-dark-gray, .xs-btn-dark-grey {
		background-color: #666666 !important;
		border-color: #555555 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-dark-gray.active, .xs-btn-dark-gray.focus, .xs-btn-dark-gray:active, .xs-btn-dark-gray:focus, .xs-btn-dark-gray:hover,
	.xs-btn-dark-grey.active, .xs-btn-dark-grey.focus, .xs-btn-dark-grey:active, .xs-btn-dark-grey:focus, .xs-btn-dark-grey:hover {
		background-color: #555555 !important;
		border-color: #444444 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-deep-orange {
		background-color: #FF5722 !important;
		border-color: #EF4712 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-deep-orange.active, .xs-btn-deep-orange.focus, .xs-btn-deep-orange:active, .xs-btn-deep-orange:focus, .xs-btn-deep-orange:hover {
		background-color: #EF4712 !important;
		border-color: #DF3702 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-deep-purple {
		background-color: #673AB7 !important;
		border-color: #572AA5 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-deep-purple.active, .xs-btn-deep-purple.focus, .xs-btn-deep-purple:active, .xs-btn-deep-purple:focus, .xs-btn-deep-purple:hover {
		background-color: #572AA5 !important;
		border-color: #471A95 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-gray, .xs-btn-grey {
		background-color: #9E9E9E !important;
		border-color: #8E8E8E !important;
		color: #FFFFFF !important;
	}
	.xs-btn-gray.active, .xs-btn-gray.focus, .xs-btn-gray:active, .xs-btn-gray:focus, .xs-btn-gray:hover,
	.xs-btn-grey.active, .xs-btn-grey.focus, .xs-btn-grey:active, .xs-btn-grey:focus, .xs-btn-grey:hover {
		background-color: #8E8E8E !important;
		border-color: #7E7E7E !important;
		color: #FFFFFF !important;
	}

	.xs-btn-indigo {
		background-color: #3F51B5 !important;
		border-color: #2F41A0 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-indigo.active, .xs-btn-indigo.focus, .xs-btn-indigo:active, .xs-btn-indigo:focus, .xs-btn-indigo:hover {
		background-color: #2F41A0 !important;
		border-color: #1F3190 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-ivory {
		background-color: #FFFFF0 !important;
		border-color: #DFDFBF !important;
		color: #000000 !important;
	}
	.xs-btn-ivory.active, .xs-btn-ivory.focus, .xs-btn-ivory:active, .xs-btn-ivory:focus, .xs-btn-ivory:hover {
		background-color: #DFDFBF !important;
		border-color: #B5B48B !important;
		color: #000000 !important;
	}

	.xs-btn-green {
		background-color: #4CAF50 !important;
		border-color: #3C9F40 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-green.active, .xs-btn-green.focus, .xs-btn-green:active, .xs-btn-green:focus, .xs-btn-green:hover {
		background-color: #3C9F40 !important;
		border-color: #2C8F30 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-light-blue {
		background-color: #B3E5FC !important;
		border-color: #0399E4 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-light-blue.active, .xs-btn-light-blue.focus, .xs-btn-light-blue:active, .xs-btn-light-blue:focus, .xs-btn-light-blue:hover {
		background-color: #0399E4 !important;
		border-color: #0389D4 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-light-green {
		background-color: #D7FFD9 !important;
		border-color: #7BB33A !important;
		color: #FFFFFF !important;
	}
	.xs-btn-light-green.active, .xs-btn-light-green.focus, .xs-btn-light-green:active, .xs-btn-light-green:focus, .xs-btn-light-green:hover {
		background-color: #7BB33A !important;
		border-color: #6BA32A !important;
		color: #FFFFFF !important;
	}

	.xs-btn-light-gray, .xs-btn-light-grey {
		background-color: #D8D8D8 !important;
		border-color: #DDDDDD !important;
		color: #999999 !important;
	}
	.xs-btn-light-gray.active, .xs-btn-light-gray.focus, .xs-btn-light-gray:active, .xs-btn-light-gray:focus, .xs-btn-light-gray:hover,
	.xs-btn-light-grey.active, .xs-btn-light-grey.focus, .xs-btn-light-grey:active, .xs-btn-light-grey:focus, .xs-btn-light-grey:hover {
		background-color: #DDDDDD !important;
		border-color: #CCCCCC !important;
		color: #999999 !important;
	}

	.xs-btn-lighter-gray, .xs-btn-lighter-grey {
		background-color: #F9F9F9 !important;
		border-color: #E9E9E9 !important;
		color: #999999 !important;
	}
	.xs-btn-lighter-gray.active, .xs-btn-lighter-gray.focus, .xs-btn-lighter-gray:active, .xs-btn-lighter-gray:focus, .xs-btn-lighter-gray:hover,
	.xs-btn-lighter-grey.active, .xs-btn-lighter-grey.focus, .xs-btn-lighter-grey:active, .xs-btn-lighter-grey:focus, .xs-btn-lighter-grey:hover {
		background-color: #EAEAEA !important;
		border-color: #DADADA !important;
		color: #999999 !important;
	}

	.xs-btn-lime {
		background-color: #CDDC39 !important;
		border-color: #BDCC29 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-lime.active, .xs-btn-lime.focus, .xs-btn-lime:active, .xs-btn-lime:focus, .xs-btn-lime:hover {
		background-color: #BDCC29 !important;
		border-color: #CDBC19 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-peach {
		background-color: #FFDAB9 !important;
		border-color: #C80E53 !important;
		color: #000000 !important;
	}
	.xs-btn-peach.active, .xs-btn-peach.focus, .xs-btn-peach:active, .xs-btn-peach:focus, .xs-btn-peach:hover {
		background-color: #C9A180 !important;
		border-color: #BA8559 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-pink {
		background-color: #E91E63 !important;
		border-color: #C80E53 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-pink.active, .xs-btn-pink.focus, .xs-btn-pink:active, .xs-btn-pink:focus, .xs-btn-pink:hover {
		background-color: #C80E53 !important;
		border-color: #B80E43 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-orange {
		background-color: #FF9800 !important;
		border-color: #E88400 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-orange.active, .xs-btn-orange.focus, .xs-btn-orange:active, .xs-btn-orange:focus, .xs-btn-orange:hover {
		background-color: #E88400 !important;
		border-color: #D87400 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-purple {
		background-color: #9C27B0 !important;
		border-color: #8C17B7 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-purple.active, .xs-btn-purple.focus, .xs-btn-purple:active, .xs-btn-purple:focus, .xs-btn-purple:hover {
		background-color: #8C17B7 !important;
		border-color: #7C07C7 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-red {
		background-color: #D50000 !important;
		border-color: #B50000 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-red.active, .xs-btn-red.focus, .xs-btn-red:active, .xs-btn-red:focus, .xs-btn-red:hover {
		background-color: #B50000 !important;
		border-color: #950000 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-teal {
		background-color: #009688 !important;
		border-color: #008578 !important;
		color: #FFFFFF !important;
	}
	.xs-btn-teal.active, .xs-btn-teal.focus, .xs-btn-teal:active, .xs-btn-teal:focus, .xs-btn-teal:hover {
		background-color: #008578 !important;
		border-color: #007568 !important;
		color: #FFFFFF !important;
	}

	.xs-btn-white {
		background-color: #FFFFFF !important;
		border-color: #CCCCCC !important;
		color: #888888 !important;
	}
	.xs-btn-white.active, .xs-btn-white.focus, .xs-btn-white:active, .xs-btn-white:focus, .xs-btn-white:hover {
		background-color: #EEEEEE !important;
		border-color: #DDDDDD !important;
		color: #888888 !important;
	}

	.xs-btn-yellow {
		background-color: #FFEB3B !important;
		border-color: #EFDB2B !important;
		color: #9F8B0B !important;
	}
	.xs-btn-yellow.active, .xs-btn-yellow.focus, .xs-btn-yellow:active, .xs-btn-yellow:focus, .xs-btn-yellow:hover {
		background-color: #EFDB2B !important;
		border-color: #DFCB1B !important;
		color: #9F8B0B !important;
	}


	/* SHADOWS =======================================================================================*/
	.xs-sw-n { box-shadow: none !important; }

	.xs-sw-xs { box-shadow: 0 .xs-125rem .xs-25rem rgba(0,0,0,.15) !important; }
	.xs-sw-sm { box-shadow: 0 .xs-25rem .xs-5rem rgba(0,0,0,.15) !important; }
	.xs-sw-md { box-shadow: 0 .xs-5rem 1rem rgba(0,0,0,.15) !important; }
	.xs-sw-lg { box-shadow: 0 1rem 3rem rgba(0,0,0,.15) !important; }
	.xs-sw-xl { box-shadow: 0 1.5rem 5rem rgba(0,0,0,.15) !important; }

	.xs-swu-xs { box-shadow: 0 -.125rem .xs-25rem rgba(0,0,0,.15) !important; }
	.xs-swu-sm { box-shadow: 0 -.25rem .xs-5rem rgba(0,0,0,.15) !important; }
	.xs-swu-md { box-shadow: 0 -.5rem 1rem rgba(0,0,0,.15) !important; }
	.xs-swu-lg { box-shadow: 0 -1rem 3rem rgba(0,0,0,.15) !important; }
	.xs-swu-xl { box-shadow: 0 -1.5rem 5rem rgba(0,0,0,.15) !important; }


	/* POSICION ======================================================================================*/
	.xs-p-absolute { position: absolute !important; }
	.xs-p-fixed-top { position: fixed !important; top: 0px !important; }
	.xs-p-fixed-bottom { position: fixed !important; bottom: 0px !important;  }
	.xs-p-inherit { position: inherit !important; }
	.xs-p-initial { position: initial !important; }
	.xs-p-relative { position: relative !important; }
	.xs-p-static { position: static !important; }
	.xs-p-sticky { position: sticky !important; top: 0 !important;  z-index: 10; }
	.xs-p-sticky-xs { position: sticky !important; top: 5px !important;  z-index: 10; }
	.xs-p-sticky-sm { position: sticky !important; top: 10px !important;  z-index: 10; }
	.xs-p-sticky-md { position: sticky !important; top: 15px !important;  z-index: 10; }
	.xs-p-sticky-lg { position: sticky !important; top: 30px !important;  z-index: 10; }
	.xs-p-sticky-xl { position: sticky !important; top: 60px !important;  z-index: 10; }
	.xs-p-sticky-hg { position: sticky !important; top: 120px !important;  z-index: 10; }
	.xs-p-sticky-ww { position: sticky !important; top: 180px !important;  z-index: 10; }


	/* DISPLAY =======================================================================================*/
	.xs-clearfix::after { display:block; clear:both; content:""; }
	.xs-d-none { display: none !important; }
	.xs-d-inline { display: inline !important; }
	.xs-d-inline-block { display: inline-block !important; }
	.xs-d-block { display: block !important; }
	.xs-d-table { display: table !important; }
	.xs-d-table-row { display: table-row !important; }
	.xs-d-table-cell { display: table-cell !important; }
	.xs-d-flex { display: -ms-flexbox !important; display: flex !important; }
	.xs-d-inline-flex { display:-ms-inline-flexbox !important; display:inline-flex !important; }


	/* CURSORES ======================================================================================*/
	.xs-c-default { cursor: default !important; }
	.xs-c-help { cursor: help !important; }
	.xs-c-move { cursor: move !important; }
	.xs-c-none { cursor: none !important; }
	.xs-c-not { cursor: not-allowed !important; }
	.xs-c-pointer, .xs-c-hand { cursor: pointer !important; }
	.xs-c-progress { cursor: progress !important; }
	.xs-c-zoom-in { cursor: zoom-in !important; }
	.xs-c-zoom-out { cursor: zoom-out !important; }

	/* ALIGNMENT AND FLOAT ===========================================================================*/
	.xs-justify-content-start { -ms-flex-pack: start !important; justify-content: flex-start !important; } 
	.xs-justify-content-end { -ms-flex-pack: end !important; justify-content: flex-end !important; } 
	.xs-justify-content-center { -ms-flex-pack: center !important; justify-content: center !important; } 
	.xs-justify-content-between { -ms-flex-pack: justify !important; justify-content: space-between !important; } 
	.xs-justify-content-around { -ms-flex-pack: distribute !important; justify-content: space-around !important; } 
	.xs-align-items-start { -ms-flex-align: start !important; align-items: flex-start !important; } 
	.xs-align-items-end { -ms-flex-align: end !important; align-items: flex-end !important; } 
	.xs-align-items-center { -ms-flex-align: center !important; align-items: center !important; } 
	.xs-align-items-baseline { -ms-flex-align: baseline !important; align-items: baseline !important; } 
	.xs-align-items-stretch { -ms-flex-align: stretch !important; align-items: stretch !important; } 
	.xs-align-content-start { -ms-flex-line-pack: start !important; align-content: flex-start !important; } 
	.xs-align-content-end { -ms-flex-line-pack: end !important; align-content: flex-end !important; } 
	.xs-align-content-center { -ms-flex-line-pack: center !important; align-content: center !important; } 
	.xs-align-content-between { -ms-flex-line-pack: justify !important; align-content: space-between !important; } 
	.xs-align-content-around { -ms-flex-line-pack: distribute !important; align-content: space-around !important; } 
	.xs-align-content-stretch { -ms-flex-line-pack: stretch !important; align-content: stretch !important; } 
	.xs-align-self-auto { -ms-flex-item-align: auto !important; align-self: auto !important; } 
	.xs-align-self-start { -ms-flex-item-align: start !important; align-self: flex-start !important; } 
	.xs-align-self-end { -ms-flex-item-align: end !important; align-self: flex-end !important; } 
	.xs-align-self-center { -ms-flex-item-align: center !important; align-self: center !important; } 
	.xs-align-self-baseline { -ms-flex-item-align: baseline !important; align-self: baseline !important; } 
	.xs-align-self-stretch { -ms-flex-item-align: stretch !important; align-self: stretch !important; }

	.xs-abs-top-left { position: absolute; top: 0% !important; left: 0% !important; z-index: 1000 !important; }
	.xs-abs-top-center { position: absolute; top: 0% !important; left: 50% !important; z-index: 1000 !important; transform: translateX(-50%) !important; }
	.xs-abs-top-right { position: absolute; top: 0% !important; right: 0% !important; z-index: 1000 !important; }

	.xs-abs-center-left { position: absolute; top: 50% !important; left: 0% !important; z-index: 1000 !important; transform: translateY(-50%) !important; }
	.xs-abs-center-center { position: absolute; top: 50% !important; left: 50% !important; z-index: 1000 !important; transform: translate(-50%, -50%) !important; }
	.xs-abs-center-right { position: absolute; top: 50% !important; right: 0% !important; z-index: 1000 !important; transform: translateY(-50%) !important; }

	.xs-abs-bottom-left { position: absolute; bottom: 0% !important; left: 0% !important; z-index: 1000 !important; }
	.xs-abs-bottom-center { position: absolute; bottom: 0% !important; left: 50% !important; z-index: 1000 !important; transform: translateX(-50%) !important; }
	.xs-abs-bottom-right { position: absolute; bottom: 0% !important; right: 0% !important; z-index: 1000 !important; }

	.xs-abs-fixed { position: fixed !important; }

	.xs-pull-center, .xs-float-center {
		display: block !important;
		float: none !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	.xs-clear, .xs-clearfix { clear: both !important; }
		.xs-clear:after {
			content: "";
			display: table;
			clear: both !important;
		}

	.xs-row-left {
		text-align: left;
	}
		.xs-row-left > [class^="col-"],
		.xs-row-left > [class*=" col-"] {
			display: inline-block;
			float: none;
			margin-right: -4px;
			text-align: left;
		}


	.xs-col-fit {
		flex-grow: 0;
		white-space: nowrap;
	}
		.xs-col-fit > .xs-row {
			flex-wrap: nowrap;
		}

	.xs-col1, .xs-col2, .xs-col3, .xs-col4, .xs-col5, .xs-col6, .xs-col7, .xs-col8, .xs-col9, .xs-col10, .xs-col11, .xs-col12 {
		position: relative;
		width: 100%;
		padding-right: 15px;
		padding-left: 15px;
	}
		.xs-col1 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }
		.xs-col2 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
		.xs-col3 { -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; }
		.xs-col4 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; }
		.xs-col5 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; }
		.xs-col6 { -ms-flex: 0 0 16.66666%; flex: 0 0 16.66666%; max-width: 16.66666%; }
		.xs-col7 { -ms-flex: 0 0 14.28571%; flex: 0 0 14.28571%; max-width: 14.28571%; }
		.xs-col8 { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; }
		.xs-col9 { -ms-flex: 0 0 11.11111%; flex: 0 0 11.11111%; max-width: 11.11111%; }
		.xs-col10 { -ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%; }
		.xs-col11 { -ms-flex: 0 0 9.09091%; flex: 0 0 9.09091%; max-width: 9.09091%; }
		.xs-col12 { -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%; }
		
	/* DIVIDERS ======================================================================================*/
	.xs-row-divider {
		border-bottom: #BBBBBB solid 2px !important;
	}
	.xs-row-divider-top {
		border-top: #BBBBBB solid 2px !important;
	}

	.xs-col-divider {
		border-right: #BBBBBB solid 2px !important;
	}

	.xs-col-divider-left {
		border-left: #BBBBBB solid 2px !important;
	}


	/* ROTATE AND FLIP ===============================================================================*/
	.xs-rotate-45 { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
	.xs-rotate-90 { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); }
	.xs-rotate-135 { -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); }
	.xs-rotate-180 { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
	.xs-rotate-225 { -webkit-transform: rotate(225deg); -moz-transform: rotate(225deg); -ms-transform: rotate(225deg); -o-transform: rotate(225deg); transform: rotate(225deg); }
	.xs-rotate-270 { -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg); }
	.xs-rotate-315 { -webkit-transform: rotate(315deg); -moz-transform: rotate(315deg); -ms-transform: rotate(315deg); -o-transform: rotate(315deg); transform: rotate(315deg); }

	.xs-img-flip-h {
		-moz-transform: scaleX(-1);
		-o-transform: scaleX(-1);
		-webkit-transform: scaleX(-1);
		transform: scaleX(-1);
	}

	.xs-img-flip-v {
		-moz-transform: scaleY(-1);
		-o-transform: scaleY(-1);
		-webkit-transform: scaleY(-1);
		transform: scaleY(-1);
	}

	.xs-spinRight {
		-webkit-animation: spinRightAnimation 2s infinite linear;
		-moz-animation: spinRightAnimation 2s infinite linear;
		-o-animation: spinRightAnimation 2s infinite linear;
	}

	.xs-spinLeft {
		-webkit-animation: spinLeftAnimation 2s infinite linear;
		-moz-animation: spinLeftAnimation 2s infinite linear;
		-o-animation: spinLeftAnimation 2s infinite linear;
	}
		
	.xs-spinRightEase {
		-webkit-animation: spinRightAnimation 2s infinite ease;
		-moz-animation: spinRightAnimation 2s infinite ease;
		-o-animation: spinRightAnimation 2s infinite ease;
	}

	.xs-spinLeftEase {
		-webkit-animation: spinLeftAnimation 1s infinite ease;
		-moz-animation: spinLeftAnimation 1s infinite ease;
		-o-animation: spinLeftAnimation 1s infinite ease;
	}
		/* right */
		@-webkit-keyframes spinRightAnimation {
			from { -webkit-transform: rotate(0deg) scale(1) skew(1deg) translate(0px); }
			to { -webkit-transform: rotate(360deg) scale(1) skew(1deg) translate(0px); }
		}
		@-moz-keyframes spinRightAnimation {
			from { -moz-transform: rotate(0deg) scale(1) skew(1deg) translate(0px); }
			to { -moz-transform: rotate(360deg) scale(1) skew(1deg) translate(0px); }
		}
		@-o-keyframes spinRightAnimation {
			from { -o-transform: rotate(0deg) scale(1) skew(1deg) translate(0px); }
			to { -o-transform: rotate(360deg) scale(1) skew(1deg) translate(0px); }
		}

		/* left */
		@-webkit-keyframes spinLeftAnimation {
			from { -webkit-transform: rotate(360deg) scale(1) skew(1deg) translate(0px); }
			to { -webkit-transform: rotate(0deg) scale(1) skew(1deg) translate(0px); }
		}
		@-moz-keyframes spinLeftAnimation {
			from { -moz-transform: rotate(360deg) scale(1) skew(1deg) translate(0px); }
			to { -moz-transform: rotate(0deg) scale(1) skew(1deg) translate(0px); }
		}
		@-o-keyframes spinLeftAnimation {
			from { -o-transform: rotate(360deg) scale(1) skew(1deg) translate(0px); }
			to { -o-transform: rotate(0deg) scale(1) skew(1deg) translate(0px); }
		}
}