:root {
	
	margin: 0;
	
	/* Font Sizes - MOBILE */
  	--font-size-mobile-header-1: 40px; /*h1*/
	--font-size-mobile-header-2: 32px; /*h2*/
	--font-size-mobile-header-3: 24px; /*h3*/
	--font-size-mobile-card-title: 18px; /*h4*/
	--font-size-mobile-subtitle: 20px; /*h5*/ 
	--font-size-mobile-pretitle: 12px; /*h6*/
	--font-size-mobile-body: 16px; /*body or paragraph*/
	--font-size-mobile-small: 14px; /* small html tag*/
	
	
	/* Font Sizes - Desktop */
  	--font-size-desktop-header-1: 64px; /*h1*/
	--font-size-desktop-header-2: 51px; /*h2*/
	--font-size-desktop-header-3: 38px; /*h3*/
	--font-size-desktop-card-title: 22px; /*h4*/
	--font-size-desktop-subtitle: 24px; /*h5*/ 
	--font-size-desktop-pretitle: 14px; /*h6*/
	--font-size-desktop-body: 18px; /*body or paragraph*/
	--font-size-desktop-small: 16px; /* small html tag*/
	
	/* Colors */
	--color-primary: #16BECF;
	--color-primary-tint-1: #50CEDB;
	--color-primary-tint-2: #8BDFE7; 
	--color-primary-tint-3: #F0FBFC;
	--color-primary-dark-1: #29B0BF;
	--color-primary-dark-2: #249DAA; 
	--color-primary-dark-3: #1F8994; 
	--color-primary-dark-4: #1B767F;
	
	--color-secondary: #F27932;
	--color-secondary-tint-1: #F59B65;
	--color-secondary-tint-2: #F9BC99; 
	--color-secondary-tint-3: #FBDDCB;
	--color-secondary-dark-1: #DA6D2D;
	--color-secondary-dark-2: #C26128; 
	--color-secondary-dark-3: #A95523; 
	--color-secondary-dark-4: #91491E;
	
	--color-tertiary: #662D91;
	--color-tertiary-tint-1: #8C62AD;
	--color-tertiary-tint-2: #B396C8; 
	--color-tertiary-tint-3: #D8CAE3;
	--color-tertiary-dark-1: #5C2983;
	--color-tertiary-dark-2: #522474; 
	--color-tertiary-dark-3: #471F66; 
	--color-tertiary-dark-4: #3D1B57;
	
	--color-success: #8CC83C;
	--color-success-tint-1: #A9D66D;
	--color-success-tint-2: #C6E49E; 
	--color-success-tint-3: #E2F1CE;
	--color-success-dark-1: #7EB436;
	--color-success-dark-2: #70A030; 
	--color-success-dark-3: #628C2A; 
	--color-success-dark-4: #547824;
	
	--color-dark: #3C2415;
	--color-dark-tint-1: #6D5B50;
	--color-dark-tint-2: #9E928A; 
	--color-dark-tint-3: #CEC8C4;
	
	--color-text: #D2D2D2;
	--color-text-tint-1: #DDDDDD;
	--color-text-tint-2: #E9E9E9; 
	--color-text-tint-3: #F3F3F3;
	
	--color-accent-1: #FFE119;
	--color-accent-1-tint-1: #FFE953;
	--color-accent-1-tint-2: #FFF08C; 
	--color-accent-1-tint-3: #FFF7C5;
	
	--color-accent-2: #F28D6A;
	--color-accent-2-tint-1: #F5AA8F;
	--color-accent-2-tint-2: #F9C6B5; 
	--color-accent-2-tint-3: #FBE2D9;
	
	--color-accent-3: #F5C823;
	--color-accent-3-tint-1: #F8D65A;
	--color-accent-3-tint-2: #FAE491; 
	--color-accent-3-tint-3: #FCF1C8;
	
}



/* ============
 * Colors 
 * ============*/


/* Colors Primary */
	.color-primary {
		color: var(--color-primary);
	}

	.color-primary-tint-1 {
		color: var(--color-primary-tint-1);
	}

	.color-primary-tint-2 {
		color: var(--color-primary-tint-2);
	}

	.color-primary-tint-3 {
		color: var(--color-primary-tint-3);
	}

	.color-primary-dark-1 {
		color: var(--color-primary-dark-1);
	}

	.color-primary-dark-2 {
		color: var(--color-primary-dark-2);
	}

	.color-primary-dark-3 {
		color: var(--color-primary-dark-3);
	}

	.color-primary-dark-4 {
		color: var(--color-primary-dark-4);
	}

		.background-color-primary {
		background-color: var(--color-primary);
	}

	.background-color-primary-tint-1 {
		background-color: var(--color-primary-tint-1);
	}

	.background-color-primary-tint-2 {
		background-color: var(--color-primary-tint-2);
	}

	.background-color-primary-tint-3 {
		background-color: var(--color-primary-tint-3);
	}

	.background-color-primary-dark-1 {
		background-color: var(--color-primary-dark-1);
	}

	.background-color-primary-dark-2 {
		background-color: var(--color-primary-dark-2);
	}

	.background-color-primary-dark-3 {
		background-color: var(--color-primary-dark-3);
	}

	.background-color-primary-dark-4 {
		background-color: var(--color-primary-dark-4);
	}

/* Colors Secondary */

	.color-secondary {
		color: var(--color-secondary);
	}

	.color-secondary-tint-1 {
		color: var(--color-secondary-tint-1);
	}

	.color-secondary-tint-2 {
		color: var(--color-secondary-tint-2);
	}

	.color-secondary-tint-3 {
		color: var(--color-secondary-tint-3);
	}

	.color-secondary-dark-1 {
		color: var(--color-secondary-dark-1);
	}

	.color-secondary-dark-2 {
		color: var(--color-secondary-dark-2);
	}

	.color-secondary-dark-3 {
		color: var(--color-secondary-dark-3);
	}

	.color-secondary-dark-4 {
		color: var(--color-secondary-dark-4);
	}

	.background-color-secondary {
		background-color: var(--color-secondary);
	}

	.background-color-secondary-tint-1 {
		background-color: var(--color-secondary-tint-1);
	}

	.background-color-secondary-tint-2 {
		background-color: var(--color-secondary-tint-2);
	}

	.background-color-secondary-tint-3 {
		background-color: var(--color-secondary-tint-3);
	}

	.background-color-secondary-dark-1 {
		background-color: var(--color-secondary-dark-1);
	}

	.background-color-secondary-dark-2 {
		background-color: var(--color-secondary-dark-2);
	}

	.background-color-secondary-dark-3 {
		background-color: var(--color-secondary-dark-3);
	}

	.background-color-secondary-dark-4 {
		background-color: var(--color-secondary-dark-4);
	}

/* Colors Secondary */

	.color-tertiary {
		color: var(--color-tertiary);
	}

	.color-tertiary-tint-1 {
		color: var(--color-tertiary-tint-1);
	}

	.color-tertiary-tint-2 {
		color: var(--color-tertiary-tint-2);
	}

	.color-tertiary-tint-3 {
		color: var(--color-tertiary-tint-3);
	}

	.color-tertiary-dark-1 {
		color: var(--color-tertiary-dark-1);
	}

	.color-tertiary-dark-2 {
		color: var(--color-tertiary-dark-2);
	}

	.color-tertiary-dark-3 {
		color: var(--color-tertiary-dark-3);
	}

	.color-tertiary-dark-4 {
		color: var(--color-tertiary-dark-4);
	}

		.background-color-tertiary {
		background-color: var(--color-tertiary);
	}

	.background-color-tertiary-tint-1 {
		background-color: var(--color-tertiary-tint-1);
	}

	.background-color-tertiary-tint-2 {
		background-color: var(--color-tertiary-tint-2);
	}

	.background-color-tertiary-tint-3 {
		background-color: var(--color-tertiary-tint-3);
	}

	.background-color-tertiary-dark-1 {
		background-color: var(--color-tertiary-dark-1);
	}

	.background-color-tertiary-dark-2 {
		background-color: var(--color-tertiary-dark-2);
	}

	.background-color-tertiary-dark-3 {
		background-color: var(--color-tertiary-dark-3);
	}

	.background-color-tertiary-dark-4 {
		background-color: var(--color-tertiary-dark-4);
	}

/* Colors Success */

		.color-success {
		color: var(--color-success);
	}

	.color-success-tint-1 {
		color: var(--color-success-tint-1);
	}

	.color-success-tint-2 {
		color: var(--color-success-tint-2);
	}

	.color-success-tint-3 {
		color: var(--color-success-tint-3);
	}

	.color-success-dark-1 {
		color: var(--color-success-dark-1);
	}

	.color-success-dark-2 {
		color: var(--color-success-dark-2);
	}

	.color-success-dark-3 {
		color: var(--color-success-dark-3);
	}

	.color-success-dark-4 {
		color: var(--color-success-dark-4);
	}

		.background-color-success {
		background-color: var(--color-success);
	}

	.background-color-success-tint-1 {
		background-color: var(--color-success-tint-1);
	}

	.background-color-success-tint-2 {
		background-color: var(--color-success-tint-2);
	}

	.background-color-success-tint-3 {
		background-color: var(--color-success-tint-3);
	}

	.background-color-success-dark-1 {
		background-color: var(--color-success-dark-1);
	}

	.background-color-success-dark-2 {
		background-color: var(--color-success-dark-2);
	}

	.background-color-success-dark-3 {
		background-color: var(--color-success-dark-3);
	}

	.background-color-success-dark-4 {
		background-color: var(--color-success-dark-4);
	}

/* Color Dark */

		.color-dark {
		color: var(--color-dark);
	}

	.color-dark-tint-1 {
		color: var(--color-dark-tint-1);
	}

	.color-dark-tint-2 {
		color: var(--color-dark-tint-2);
	}

	.color-dark-tint-3 {
		color: var(--color-dark-tint-3);
	}

	.color-dark-dark-1 {
		color: var(--color-dark-dark-1);
	}

	.color-dark-dark-2 {
		color: var(--color-dark-dark-2);
	}

	.color-dark-dark-3 {
		color: var(--color-dark-dark-3);
	}

	.color-dark-dark-4 {
		color: var(--color-dark-dark-4);
	}

	.background-color-dark {
		background-color: var(--color-dark);
	}

	.background-color-dark-tint-1 {
		background-color: var(--color-dark-tint-1);
	}

	.background-color-dark-tint-2 {
		background-color: var(--color-dark-tint-2);
	}

	.background-color-dark-tint-3 {
		background-color: var(--color-dark-tint-3);
	}

	.background-color-dark-dark-1 {
		background-color: var(--color-dark-dark-1);
	}

	.background-color-dark-dark-2 {
		background-color: var(--color-dark-dark-2);
	}

	.background-color-dark-dark-3 {
		background-color: var(--color-dark-dark-3);
	}

	.background-color-dark-dark-4 {
		background-color: var(--color-dark-dark-4);
	}

/* Color Accent 1 */
 
  	.color-accent-1 {
		color: var(--color-accent-1);
	}

	.color-accent-1-tint-1 {
		color: var(--color-accent-1-tint-1);
	}

	.color-accent-1-tint-2 {
		color: var(--color-accent-1-tint-2);
	}

	.color-accent-1-tint-3 {
		color: var(--color-accent-1-tint-3);
	}

	.color-accent-1-dark-1 {
		color: var(--color-accent-1-dark-1);
	}

	.color-accent-1-dark-2 {
		color: var(--color-accent-1-dark-2);
	}

	.color-accent-1-dark-3 {
		color: var(--color-accent-1-dark-3);
	}

	.color-accent-1-dark-4 {
		color: var(--color-accent-1-dark-4);
	}

		.background-color-accent-1 {
		background-color: var(--color-accent-1);
	}

	.background-color-accent-1-tint-1 {
		background-color: var(--color-accent-1-tint-1);
	}

	.background-color-accent-1-tint-2 {
		background-color: var(--color-accent-1-tint-2);
	}

	.background-color-accent-1-tint-3 {
		background-color: var(--color-accent-1-tint-3);
	}

	.background-color-accent-1-dark-1 {
		background-color: var(--color-accent-1-dark-1);
	}

	.background-color-accent-1-dark-2 {
		background-color: var(--color-accent-1-dark-2);
	}

	.background-color-accent-1-dark-3 {
		background-color: var(--color-accent-1-dark-3);
	}

	.background-color-accent-1-dark-4 {
		background-color: var(--color-accent-1-dark-4);
	}

/* Color Accent 2 */

		.color-accent-2 {
		color: var(--color-accent-2);
	}

	.color-accent-2-tint-1 {
		color: var(--color-accent-2-tint-1);
	}

	.color-accent-2-tint-2 {
		color: var(--color-accent-2-tint-2);
	}

	.color-accent-2-tint-3 {
		color: var(--color-accent-2-tint-3);
	}

	.color-accent-2-dark-1 {
		color: var(--color-accent-2-dark-1);
	}

	.color-accent-2-dark-2 {
		color: var(--color-accent-2-dark-2);
	}

	.color-accent-2-dark-3 {
		color: var(--color-accent-2-dark-3);
	}

	.color-accent-2-dark-4 {
		color: var(--color-accent-2-dark-4);
	}

		.background-color-accent-2 {
		background-color: var(--color-accent-2);
	}

	.background-color-accent-2-tint-1 {
		background-color: var(--color-accent-2-tint-1);
	}

	.background-color-accent-2-tint-2 {
		background-color: var(--color-accent-2-tint-2);
	}

	.background-color-accent-2-tint-3 {
		background-color: var(--color-accent-2-tint-3);
	}

	.background-color-accent-2-dark-1 {
		background-color: var(--color-accent-2-dark-1);
	}

	.background-color-accent-2-dark-2 {
		background-color: var(--color-accent-2-dark-2);
	}

	.background-color-accent-2-dark-3 {
		background-color: var(--color-accent-2-dark-3);
	}

	.background-color-accent-2-dark-4 {
		background-color: var(--color-accent-2-dark-4);
	}

/* Color Accent 3*/

		.color-accent-3 {
		color: var(--color-accent-3);
	}

	.color-accent-3-tint-1 {
		color: var(--color-accent-3-tint-1);
	}

	.color-accent-3-tint-2 {
		color: var(--color-accent-3-tint-2);
	}

	.color-accent-3-tint-3 {
		color: var(--color-accent-3-tint-3);
	}

	.color-accent-3-dark-1 {
		color: var(--color-accent-3-dark-1);
	}

	.color-accent-3-dark-2 {
		color: var(--color-accent-3-dark-2);
	}

	.color-accent-3-dark-3 {
		color: var(--color-accent-3-dark-3);
	}

	.color-accent-3-dark-4 {
		color: var(--color-accent-3-dark-4);
	}

		.background-color-accent-3 {
		background-color: var(--color-accent-3);
	}

	.background-color-accent-3-tint-1 {
		background-color: var(--color-accent-3-tint-1);
	}

	.background-color-accent-3-tint-2 {
		background-color: var(--color-accent-3-tint-2);
	}

	.background-color-accent-3-tint-3 {
		background-color: var(--color-accent-3-tint-3);
	}

	.background-color-accent-3-dark-1 {
		background-color: var(--color-accent-3-dark-1);
	}

	.background-color-accent-3-dark-2 {
		background-color: var(--color-accent-3-dark-2);
	}

	.background-color-accent-3-dark-3 {
		background-color: var(--color-accent-3-dark-3);
	}

	.background-color-accent-3-dark-4 {
		background-color: var(--color-accent-3-dark-4);
	}

/* Color Text */
		.color-text {
		color: var(--color-text);
	}

	.color-text-tint-1 {
		color: var(--color-text-tint-1);
	}

	.color-text-tint-2 {
		color: var(--color-text-tint-2);
	}

	.color-text-tint-3 {
		color: var(--color-text-tint-3);
	}

	.color-text-dark-1 {
		color: var(--color-text-dark-1);
	}

	.color-text-dark-2 {
		color: var(--color-text-dark-2);
	}

	.color-text-dark-3 {
		color: var(--color-text-dark-3);
	}

	.color-text-dark-4 {
		color: var(--color-text-dark-4);
	}

		.background-color-text {
		background-color: var(--color-text);
	}

	.background-color-text-tint-1 {
		background-color: var(--color-text-tint-1);
	}

	.background-color-text-tint-2 {
		background-color: var(--color-text-tint-2);
	}

	.background-color-text-tint-3 {
		background-color: var(--color-text-tint-3);
	}

	.background-color-text-dark-1 {
		background-color: var(--color-text-dark-1);
	}

	.background-color-text-dark-2 {
		background-color: var(--color-text-dark-2);
	}

	.background-color-text-dark-3 {
		background-color: var(--color-text-dark-3);
	}

	.background-color-text-dark-4 {
		background-color: var(--color-text-dark-4);
	}

/* Standard Colors */
	.white {
		color:white;
	}
	.background-white {
		background-color:white;
	}

	.black {
		color: black;
	}

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


/* =============================
 * Height 
 * =============================*/

.height-1px {
	height:1px;
}

.height-2px {
	height:2px;
}

.height-3px {
	height:3px;
}

.height-4px {
	height:4px;
}

.height-5px {
	height:5px;
}

/* =============================
 * Width 
 * =============================*/

.width-25 {
	width:25%;
}

.width-50 {
	width:50%;
}

.width-75 {
	width:75%;
}

.width-100 {
	width:100%;
}


.max-width-300 {
	max-width:300px;
}

.max-width-450 {
	max-width:450px;
}

.max-width-500 {
	max-width:500px;
}

.max-width-700 {
	max-width:700px;
}

.max-width-800 {
	max-width:800px;
}


/* =============================
 * Border-Radius 
 * =============================*/

.border-radius-10{
	border-radius:10px;
}


.border-radius-20{
	border-radius:20px;
}


.border-radius-30{
	border-radius:30px;
}


.border-radius-40{
	border-radius:40px;
}


.border-radius-50{
	border-radius:50px;
}


.border-radius-60{
	border-radius:60px;
}


.border-radius-70{
	border-radius:70px;
}


.border-radius-80{
	border-radius:80px;
}

.border-radius-90{
	border-radius:90px;
}

/* =============================
 * Margin
 * =============================*/
.margin-30 {
	margin: 30px;
}



/* =============================
 * Padding
 * =============================*/


/* ==========
 * Display
 * ==========*/

.display-flex{
	display:flex;
	flex-wrap:wrap;
}

.display-block {
	display: block !important;
}

.display-block-flex {
	display:block;
}

.direction-column {
	flex-direction:column;
}

.direction-column_reverse-row {
	flex-direction: column-reverse;
}

.display-grid-1_3 {
	display: grid;
    grid-template-columns: 1fr;
}


/* ==========
 * Position
 * ==========*/

.position-relative {
	position:relative;
}


/* ================
 * Justify 
 * ================*/
.justify-space-between {
	justify-content:space-between
}

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




/*
Portrait Tablets- 768px and up 
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */
@media only screen and (min-width: 769px) {	
	
	/* ==========
	 * Display
	 * ==========*/
	.display-block-flex {
	display:flex;
	}
	
	.direction-column_reverse-row {
	flex-direction: row;
	}
	
	.display-grid-1_3 {
	display: grid;
    grid-template-columns: 1fr 1fr 1fr;
	}
}