/* !//////////////////////// !DISUKO 0.8! ////////////////////////! */

/* 0 - Development & Testing  */

/* 0.1 - Wrapper Testing Borders  */

.dsk1 {
	border: black solid 1px;
}

.dsk2 {
	border: red solid 1px;
}

.dsk3 {
	border: blue solid 1px;
}

.dsk4 {
	border: green solid 1px;
}

.dsk5 {
	border: yellow solid 1px;
}

/* 1 - General  */

/* 1.1 - Section Wrappers */

.section {
	container-type: inline-size;
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
}

.section--full_width {
	container-type: inline-size;
	margin-left: 0;
	margin-right: 0;
}

/* 1.2 - Color Variables  */

/* 1.2.1 - Primary Colors  */
:root {
	--primary_violet: #4b1e78;
	--primary_black: #000;
	--primary_white: #fff;
	--primary_grey: #333;
}

/* 1.2.2 - Secondary Colors  */
:root {
	--secondary_dark_violet: #26193A;
	--secondary_bright_violet: #7B47D2;
	--secondary_light_violet: #D6A4EA;
	--secondary_dark_grey: #191D1F;
	--secondary_light_grey: #8C8C8C;
	--secondary_light_grey_extra: #D2D2D2;

}

/* 1.2.3 - Tertiary Colors  */
:root {
	--tertiary_magenta: #C724B1;
	--tertiary_blue: #008AD8;
	--tertiary_red: #C5003E;
	--tertiary_orange: #FF7500;
	--tertiary_green: #55A51C;
}


/* 1.3 - Copy & Content */
.copy_block {
	/* General wrapper class for multiple paragrpahs */
	margin-top: 1rem;
}

/* 1.3.1 - Paragraphs */
p {
	margin-bottom: 1rem;
	margin-top: 0;
}

/* 1.3.2 - Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
	margin-bottom: 1rem;
	margin-top: 0;
}


/* 1.3 - Responsive Hide/Show */

/* 1.3.1 - Desktop Show/Mobile Hide */
.ds_mh {
	display: block;
}

/* 1.3.2 - Mobile Show/Desktop Hide */
.ms_dh {
	display: none;
}

/* 1.4. - Hover States  */
/*
These hover states are independant of whether the element is an anchor or not
*/

.hover {
	cursor: pointer;
	transition: 0.3s;
}

/* 1.4.1 - Hover Zoom  */
.hover-zoom:hover {
	-ms-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-webkit-transform: scale(0.9);
	-o-transform: scale(0.9);
	transform: scale(0.9);
}

/* 1.4.2 - Hover Invert  */
.hover-invert:hover {
	-webkit-filter: invert(75%);
	-moz-filter: invert(75%);
	filter: invert(75%);
}

/* 1.4.3 - Hover Dim  */
.hover-dim:hover {
	filter: brightness(50%);
}

/* 1.4.4 - Hover Lightbox - TODO */

/* 1.5 - Animations - TODO */


/* 2 - Container Layout */



/* 3 - Block & Inline Layout */

.block {
	display: block;
}

.inline {
	display: inline;
}

/* 3.1 - Block Posistion  */

.block_centre {
	display: block;
	margin: auto;
	text-align: center;
}

.block_left {
	display: block;
	/* margin: auto; */
	text-align: left;
}

.block_right {
	display: block;
	text-align: right;
}

/* 3.2 - Block Object Width  */
.block_w100 {
	width: 100%;
}

.block_w85 {
	width: 85%;
}

.block_w80 {
	width: 80%;
}

.block_w75 {
	width: 75%;
}

.block_w70 {
	width: 70%;
}

.block_w60 {
	width: 60%;
}

.block_w50 {
	width: 50%;
}

.block_w30 {
	width: 30%;
}

.block_w25 {
	width: 25%;
}



/* 4 - Grid Layout  */

/* 5 - Flex Layout  */


/* 5.1 - Flex Container */
.fx {
	/* Top Level Flex Container Object */
	display: flex;
}

/* 5.1.1 - Flex Direction */
.fx_row {
	flex-direction: row;
}

.fx_col {
	flex-direction: column;
}

.fx_row-sml {
	flex-direction: row;
}

.fx_wrap {
	flex-wrap: wrap;
}

/* 5.1.2 - Flex Justify  */

.fx_just-start {
	justify-content: flex-start;
}

.fx_just-end {
	justify-content: flex-end;
}

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

.fx_just-between {
	justify-content: space-between;
}

.fx_just-around {
	justify-content: space-around;
}

.fx_just-even {
	justify-content: space-evenly;
}


/* 5.1.3 - Flex Align Items */
.fx_item-start_align {
	align-items: flex-start;
}

.fx_item-end_align {
	align-items: flex-end;
}

.fx_item-center_align {
	align-items: center;
}

.fx_item-stretch_align {
	align-items: stretch;
}

.fx_item-baseline_align {
	align-items: baseline;
}

/* 5.1.4 - Flex Align Content */
.fx_align-start {
	align-content: flex-start;
}

.fx_align-end {
	align-content: flex-end;
}

.fx_align-center {
	align-content: center;
}

.fx_align-stretch {
	align-content: stretch;
}

.fx_align-between {
	align-content: space-between;
}

.fx_align-around {
	align-content: space-around;
}

/* 5.1.6 - Flex Place Items place-items TODO  */

/* 5.1.5 - Flex Justify Items */

/* 5.2 - Flex Items */
.item_fx {}

/* 5.2.1 - Flex Item Self Align */
.item_align-self-start {
	align-self: flex-start;
}

.item_align-self-end {
	align-self: flex-end;
}

.item_align-self-auto {
	align-self: auto;
}

.item_align-self-center {
	align-self: center;
}



/* 5.2.2 - Flex Item Size */
.item_size-100 {
	flex: 100%;
}

.item_size-90 {
	flex: 90%;

}

.item_size-80 {
	flex: 80%;

}

.item_size-70 {
	flex: 70%;

}

.item_size-60 {
	flex: 60%;

}

.item_size-50 {
	flex: 50%;

}

.item_size-40 {
	flex: 40%;

}

.item_size-30 {
	flex: 30%;

}

.item_size-20 {
	flex: 20%;

}

.item_size-10 {
	flex: 10%;

}

/* 5.2.3 - Flex Item Order */
.item_order-1 {}

.item_order-2 {}

.item_order-3 {}

.item_order-4 {}

.item_order-5 {}

.item_order-6 {}

.item_order-7 {}

.item_order-8 {}

.item_order-9 {}

.item_order-10 {}

.item_order-11 {}

.item_order-12 {}

.item_order-13 {}

.item_order-14 {}

.item_order-15 {}

.item_order-16 {}

/* 5.2.4 - Flex Item Shape */
.item_shape-shrink {}

.item_shape-grow {}

.item_shape-basis {}

/* 6 - Typography */

/* 6.1 - Font Family & Styl */
.font_oswald {
	font-family: "Oswald", "Lucida Grande", sans-serif;
}

.font_helvetica {
	font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

/* 6.2 - Font Style (.font) */

.font_none {
	/* Remove All Font Styling */
	text-decoration: none;
}

.font_ital {
	font-style: italic;
}

.font_under {
	text-decoration: underline;
}

.font_up {
	text-transform: uppercase;
}

.font_cap {
	text-transform: capitalize;
}


/* 6.3.1 - Font Size Static */

.fs0_5 {
	font-size: 0.5rem;
}

.fs0_7 {
	font-size: 0.7rem;
}

.fs0_8 {
	font-size: 0.8rem;
}

.fs0_9 {
	font-size: 0.9rem;
}

.fs1 {
	font-size: 1rem;
}

.fs1_1 {
	font-size: 1.1rem;
}

.fs1_2 {
	font-size: 1.2rem;
}

.fs1_3 {
	font-size: 1.3rem;
}

.fs1_4 {
	font-size: 1.4rem;
}

.fs1_5 {
	font-size: 1.5rem;
}

.fs1_6 {
	font-size: 1.6rem;
}

.fs1_7 {
	font-size: 1.7rem;
}

.fs1_8 {
	font-size: 1.8rem;
}

.fs1_9 {
	font-size: 1.9rem;
}

.fs2 {
	font-size: 2rem;
}

.fs2_1 {
	font-size: 2.1rem;
}

.fs2_2 {
	font-size: 2.2rem;
}

.fs2_3 {
	font-size: 2.3rem;
}

.fs2_4 {
	font-size: 2.4rem;
}

.fs2_5 {
	font-size: 2.5rem;
}

.fs2_6 {
	font-size: 2.6rem;
}

.fs2_7 {
	font-size: 2.7rem;
}

.fs2_8 {
	font-size: 2.8rem;
}

.fs2_9 {
	font-size: 2.9rem;
}

.fs3 {
	font-size: 3rem;
}

.fs3_2 {
	font-size: 3.25rem;
}

.fs3_5 {
	font-size: 3.5rem;
}

.fs3_7 {
	font-size: 3.75rem;
}

.fs4 {
	font-size: 4rem;
}

.fs4_5 {
	font-size: 4.5rem;
}

.fs5 {
	font-size: 5rem;
}

.fs5_5 {
	font-size: 5.5rem;
}

.fs6 {
	font-size: 6rem;
}

.fs6_5 {
	font-size: 6.5rem;
}

.fs7 {
	font-size: 7rem;
}

.fs7_5 {
	font-size: 7.5rem;
}

.fs8 {
	font-size: 8rem;
}


/* 6.3.2 - Font Size Clamp */
.fs_sml {
	/* font-size: clamp(0.875rem, 0.208vw + 0.833rem, 1rem); */
	font-size: clamp(.8rem, 1vw, 1rem);
}

.fs_reg {
	font-size: clamp(1rem, 2vw, 1.15rem);
}

.fs_med {
	/* font-size: clamp(1rem, 0.208vw + 0.958rem, 1.125rem); */
	font-size: clamp(1.4rem, 2.5vw, 2.3rem);

}

.fs_lrg {
	/* font-size: clamp(1.25rem, 0.417vw + 1.167rem, 1.5rem); */
	font-size: clamp(1.8rem, 3vw, 3.2rem);

}

.fs_xlrg {
	/* font-size: clamp(1.5625rem, 0.729vw + 1.417rem, 2rem); */
	font-size: clamp(2.3rem, 4vw, 4rem)
}


/* 6.4 - Font Weight */
.fw200 {
	font-weight: 200;
}

.fw300 {
	font-weight: 300;
}

.fw500 {
	font-weight: 500;
}

.fw600 {
	font-weight: 600;
}

.fw700 {
	font-weight: 700;
}

.fw800 {
	font-weight: 800;
}

.fw900 {
	font-weight: 900;
}


/* 6.5 - Font Colours */
/* 6.5.1 - Primary Font Colours */

.fc_blk {
	color: var(--primary_black);
}

.fc_vio {
	color: var(--primary_violet);
}

.fc_wht {
	color: var(--primary_white);
}

.fc_gry {
	color: var(--primary_grey);
}


/* 6.5.2 - Secondary Font Colours */

.fc_gry_dark {
	color: var(--secondary_dark_grey);
}

.fc_gry_light {
	color: var(--secondary_light_grey);
}

.fc_vio_dark {
	color: var(--secondary_dark_violet);
}

.fc_vio_bright {
	color: var(--secondary_bright_violet);
}

.fc_vio_light {
	color: var(--secondary_light_violet);
}


/* 6.5.3 - Tertiary Font Colours */
.fc_mag {
	color: var(--tertiary_magenta);
}

.fc_blu {
	color: var(--tertiary_blue);
}

.fc_red {
	color: var(--tertiary_red);
}

.fc_org {
	color: var(--tertiary_orange);
}

.fc_grn {
	color: var(--tertiary_green);
}



/* 6.6 - Text Posistioning  */


/* 6.6.1 - Text Alignment */
.font_cent {
	text-align: center;
}

.font_left {
	text-align: left;
}

.font_right {
	text-align: right;
}



/* 6.6.2 - Responsive Text Alignment  */

.font_res_cent_right {
	text-align: center;
}

.font_res_cent_left {
	text-align: center;
}

.font_res_right_cent {
	text-align: right;
}

.font_res_left_cent {
	text-align: left;
}



/* 6.7 - Line Height */

.lh0_4 {
	line-height: 0.4;
}

.lh0_5 {
	line-height: 0.5;
}

.lh0_6 {
	line-height: 0.6;
}

.lh0_7 {
	line-height: 0.7;
}

.lh0_8 {
	line-height: 0.8;
}

.lh0_9 {
	line-height: 0.9;
}

.lh1 {
	line-height: 1;
}

.lh1_1 {
	line-height: 1.1;
}

.lh1_2 {
	line-height: 1.2;
}

.lh1_3 {
	line-height: 1.3;
}

.lh1_4 {
	line-height: 1.4;
}

.lh1_5 {
	line-height: 1.5;
}



/* 6.8 - Letter Spacing */
.ls01 {
	letter-spacing: 0.01rem;
}

.ls02 {
	letter-spacing: 0.02rem;
}

.ls03 {
	letter-spacing: 0.03rem;
}

.ls04 {
	letter-spacing: 0.04rem;
}

.ls05 {
	letter-spacing: 0.05rem;
}

.ls06 {
	letter-spacing: 0.06rem;
}

.ls07 {
	letter-spacing: 0.07rem;
}

.ls08 {
	letter-spacing: 0.08rem;
}

.ls1 {
	letter-spacing: 0.1rem;
}

.ls1_5 {
	letter-spacing: 0.15rem;
}

.ls2 {
	letter-spacing: 0.2rem;
}

.ls2_2 {
	letter-spacing: 0.22rem;
}

.ls2_5 {
	letter-spacing: 0.25rem;
}

.ls2_7 {
	letter-spacing: 0.27rem;
}

.ls3 {
	letter-spacing: 0.3rem;
}



/* 7 - Object Margin    */

/* 7.1 - Margin Vertical   */

.mv0 {
	margin-top: 0;
	margin-bottom: 0;
}

.mv0_2 {
	margin-top: 0.25rem;
	margin-bottom: 0.25rem;
}

.mv0_5 {
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

.mv1 {
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.mv1_5 {
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}

.mv2 {
	margin-top: 2rem;
	margin-bottom: 2rem;
}

.mv2_5 {
	margin-top: 2.5rem;
	margin-bottom: 2.5rem;
}

.mv3 {
	margin-top: 3rem;
	margin-bottom: 3rem;
}

.mv3_5 {
	margin-top: 3.5rem;
	margin-bottom: 3.5rem;
}

.mv4 {
	margin-top: 4rem;
	margin-bottom: 4rem;
}

.mv4_5 {
	margin-top: 4.5rem;
	margin-bottom: 4.5rem;
}

.mv5 {
	margin-top: 5rem;
	margin-bottom: 5rem;
}

.mv5_5 {
	margin-top: 5.5rem;
	margin-bottom: 5.5rem;
}

.mv6 {
	margin-top: 6rem;
	margin-bottom: 6rem;
}

.mv6_5 {
	margin-top: 6.5rem;
	margin-bottom: 6.5rem;
}

.mv7 {
	margin-top: 7rem;
	margin-bottom: 7rem;
}

.mv7_5 {
	margin-top: 7.5rem;
	margin-bottom: 7.5rem;
}

.mv8 {
	margin-top: 8rem;
	margin-bottom: 8rem;
}

/* 7.2 - Margin Top   */

.mt0 {
	margin-top: 0;
}

.mt0_1 {
	margin-top: 0.15rem;
}

.mt0_2 {
	margin-top: 0.25rem;
}

.mt0_3 {
	margin-top: 0.35rem;
}

.mt0_5 {
	margin-top: 0.5rem;
}

.mt0_7 {
	margin-top: 0.75rem;
}

.mt1 {
	margin-top: 1rem;
}

.mt1_2 {
	margin-top: 1.25rem;
}

.mt1_5 {
	margin-top: 1.5rem;
}

.mt1_7 {
	margin-top: 1.75rem;
}

.mt2 {
	margin-top: 2rem;
}

.mt2_2 {
	margin-top: 2.25rem;
}

.mt2_5 {
	margin-top: 2.5rem;
}

.mt2_7 {
	margin-top: 2.75rem;
}

.mt3 {
	margin-top: 3rem;
}

.mt3_2 {
	margin-top: 3.25rem;
}

.mt3_5 {
	margin-top: 3.5rem;
}

.mt3_7 {
	margin-top: 3.75rem;
}

.mt4 {
	margin-top: 4rem;
}

.mt4_2 {
	margin-top: 4.25rem;
}

.mt4_5 {
	margin-top: 4.5rem;
}

.mt4_7 {
	margin-top: 4.75rem;
}

.mt5 {
	margin-top: 5rem;
}

.mt5_2 {
	margin-top: 5.25rem;
}

.mt5_5 {
	margin-top: 5.5rem;
}

.mt5_7 {
	margin-top: 5.75rem;
}

.mt6 {
	margin-top: 6rem;
}

.mt6_2 {
	margin-top: 6.25rem;
}

.mt6_5 {
	margin-top: 6.5rem;
}

.mt6_7 {
	margin-top: 6.75rem;
}

.mt7 {
	margin-top: 7rem;
}

.mt7_2 {
	margin-top: 7.25rem;
}

.mt7_5 {
	margin-top: 7.5rem;
}

.mt7_7 {
	margin-top: 7.75rem;
}

.mt8 {
	margin-top: 8rem;
}

/* 7.3 - Margin Bottom   */

.mb0 {
	margin-bottom: 0;
}

.mb0_1 {
	margin-bottom: 0.15rem;
}

.mb0_2 {
	margin-bottom: 0.25rem;
}

.mb0_3 {
	margin-bottom: 0.35rem;
}

.mb0_5 {
	margin-bottom: 0.5rem;
}

.mb0_7 {
	margin-bottom: 0.75rem;
}

.mb1 {
	margin-bottom: 1rem;
}

.mb1_2 {
	margin-bottom: 1.25rem;
}

.mb1_5 {
	margin-bottom: 1.5rem;
}

.mb1_7 {
	margin-bottom: 1.75rem;
}

.mb2 {
	margin-bottom: 2rem;
}

.mb2_2 {
	margin-bottom: 2.25rem;
}

.mb2_5 {
	margin-bottom: 2.5rem;
}

.mb2_7 {
	margin-bottom: 2.75rem;
}

.mb3 {
	margin-bottom: 3rem;
}

.mb3_2 {
	margin-bottom: 3.25rem;
}

.mb3_5 {
	margin-bottom: 3.5rem;
}

.mb3_7 {
	margin-bottom: 3.75rem;
}

.mb4 {
	margin-bottom: 4rem;
}

.mb4_2 {
	margin-bottom: 4.25rem;
}

.mb4_5 {
	margin-bottom: 4.5rem;
}

.mb4_7 {
	margin-bottom: 4.75rem;
}

.mb5 {
	margin-bottom: 5rem;
}

.mb5_2 {
	margin-bottom: 5.25rem;
}

.mb5_5 {
	margin-bottom: 5.5rem;
}

.mb5_7 {
	margin-bottom: 5.75rem;
}

.mb6 {
	margin-bottom: 6rem;
}

.mb6_2 {
	margin-bottom: 6.25rem;
}

.mb6_5 {
	margin-bottom: 6.5rem;
}

.mb6_7 {
	margin-bottom: 6.75rem;
}

.mb7 {
	margin-bottom: 7rem;
}

.mb7_2 {
	margin-bottom: 7.25rem;
}

.mb7_5 {
	margin-bottom: 7.5rem;
}

.mb7_7 {
	margin-bottom: 7.75rem;
}

.mb8 {
	margin-bottom: 8rem;
}


/* 7.4 - Margin Horizontal   */

.mh0_2 {
	margin-left: 0.25rem;
	margin-right: 0.25rem;
}

.mh0_5 {
	margin-left: 0.55rem;
	margin-right: 0.55rem;
}

.mh0_7 {
	margin-left: 0.75rem;
	margin-right: 0.75rem;
}

.mh1 {
	margin-left: 1rem;
	margin-right: 1rem;
}

.mh1_2 {
	margin-left: 1.25rem;
	margin-right: 1.25rem;
}

.mh1_5 {
	margin-left: 1.5rem;
	margin-right: 1.5rem;
}

.mh1_7 {
	margin-left: 1.75rem;
	margin-right: 1.75rem;
}

.mh2 {
	margin-left: 2rem;
	margin-right: 2rem;
}

.mh2_2 {
	margin-left: 2.25rem;
	margin-right: 2.25rem;
}

.mh2_5 {
	margin-left: 2.5rem;
	margin-right: 2.5rem;
}

.mh2_7 {
	margin-left: 2.75rem;
	margin-right: 2.75rem;
}

.mh3 {
	margin-left: 3rem;
	margin-right: 3rem;
}

.mh3_2 {
	margin-left: 3.25rem;
	margin-right: 3.25rem;
}

.mh3_5 {
	margin-left: 3.5rem;
	margin-right: 3.5rem;
}

.mh3_7 {
	margin-left: 3.75rem;
	margin-right: 3.75rem;
}

.mh4 {
	margin-left: 4rem;
	margin-right: 4rem;
}

.mh4_2 {
	margin-left: 4.25rem;
	margin-right: 4.25rem;
}

.mh4_5 {
	margin-left: 4.5rem;
	margin-right: 4.5rem;
}

.mh4_7 {
	margin-left: 4.75rem;
	margin-right: 4.75rem;
}

.mh5 {
	margin-left: 5rem;
	margin-right: 5rem;
}

.mh5_2 {
	margin-left: 5.25rem;
	margin-right: 5.25rem;
}

.mh5_5 {
	margin-left: 5.5rem;
	margin-right: 5.5rem;
}

.mh5_7 {
	margin-left: 5.75rem;
	margin-right: 5.75rem;
}

.mh6 {
	margin-left: 6rem;
	margin-right: 6rem;
}

.mh6_2 {
	margin-left: 6.25rem;
	margin-right: 6.25rem;
}

.mh6_5 {
	margin-left: 6.5rem;
	margin-right: 6.5rem;
}

.mh6_7 {
	margin-left: 6.75rem;
	margin-right: 6.75rem;
}

.mh7 {
	margin-left: 7rem;
	margin-right: 7rem;
}

/* 7.5 - Margin Left   */


.ml0 {
	margin-left: 0;
}

.ml0_1 {
	margin-left: 0.15rem;
}

.ml0_2 {
	margin-left: 0.25rem;
}

.ml0_3 {
	margin-left: 0.35rem;
}

.ml0_5 {
	margin-left: 0.5rem;
}

.ml0_7 {
	margin-left: 0.75rem;
}

.ml1 {
	margin-left: 1rem;
}

.ml1_2 {
	margin-left: 1.25rem;
}

.ml1_5 {
	margin-left: 1.5rem;
}

.ml1_7 {
	margin-left: 1.75rem;
}

.ml2 {
	margin-left: 2rem;
}

.ml2_2 {
	margin-left: 2.25rem;
}

.ml2_5 {
	margin-left: 2.5rem;
}

.ml2_7 {
	margin-left: 2.75rem;
}

.ml3 {
	margin-left: 3rem;
}

.ml3_2 {
	margin-left: 3.25rem;
}

.ml3_5 {
	margin-left: 3.5rem;
}

.ml3_7 {
	margin-left: 3.75rem;
}

.ml4 {
	margin-left: 4rem;
}

.ml4_2 {
	margin-left: 4.25rem;
}

.ml4_5 {
	margin-left: 4.5rem;
}

.ml4_7 {
	margin-left: 4.75rem;
}

.ml5 {
	margin-left: 5rem;
}

.ml5_2 {
	margin-left: 5.25rem;
}

.ml5_5 {
	margin-left: 5.5rem;
}

.ml5_7 {
	margin-left: 5.75rem;
}

.ml6 {
	margin-left: 6rem;
}

.ml6_2 {
	margin-left: 6.25rem;
}

.ml6_5 {
	margin-left: 6.5rem;
}

.ml6_7 {
	margin-left: 6.75rem;
}

.ml7 {
	margin-left: 7rem;
}

.ml7_2 {
	margin-left: 7.25rem;
}

.ml7_5 {
	margin-left: 7.5rem;
}

.ml7_7 {
	margin-left: 7.75rem;
}

.ml8 {
	margin-left: 8rem;
}

/* 7.6 - Margin Right   */

.mr0 {
	margin-right: 0;
}

.mr0_1 {
	margin-right: 0.15rem;
}

.mr0_2 {
	margin-right: 0.25rem;
}

.mr0_3 {
	margin-right: 0.35rem;
}

.mr0_5 {
	margin-right: 0.5rem;
}

.mr0_7 {
	margin-right: 0.75rem;
}

.mr1 {
	margin-right: 1rem;
}

.mr1_2 {
	margin-right: 1.25rem;
}

.mr1_5 {
	margin-right: 1.5rem;
}

.mr1_7 {
	margin-right: 1.75rem;
}

.mr2 {
	margin-right: 2rem;
}

.mr2_2 {
	margin-right: 2.25rem;
}

.mr2_5 {
	margin-right: 2.5rem;
}

.mr2_7 {
	margin-right: 2.75rem;
}

.mr3 {
	margin-right: 3rem;
}

.mr3_2 {
	margin-right: 3.25rem;
}

.mr3_5 {
	margin-right: 3.5rem;
}

.mr3_7 {
	margin-right: 3.75rem;
}

.mr4 {
	margin-right: 4rem;
}

.mr4_2 {
	margin-right: 4.25rem;
}

.mr4_5 {
	margin-right: 4.5rem;
}

.mr4_7 {
	margin-right: 4.75rem;
}

.mr5 {
	margin-right: 5rem;
}

.mr5_2 {
	margin-right: 5.25rem;
}

.mr5_5 {
	margin-right: 5.5rem;
}

.mr5_7 {
	margin-right: 5.75rem;
}

.mr6 {
	margin-right: 6rem;
}

.mr6_2 {
	margin-right: 6.25rem;
}

.mr6_5 {
	margin-right: 6.5rem;
}

.mr6_7 {
	margin-right: 6.75rem;
}

.mr7 {
	margin-right: 7rem;
}

.mr7_2 {
	margin-right: 7.25rem;
}

.mr7_5 {
	margin-right: 7.5rem;
}

.mr7_7 {
	margin-right: 7.75rem;
}

.mr8 {
	margin-right: 8rem;
}





/* 7.8 - Margin Responsive Clear  */

/* 7.8.1 - Margin Clear Large  */
.mh_clear {}

.mv_clear {}

/* 7.8.2 - Margin Clear Small */
.mh_res_clear {
	margin-left: 0;
	margin-right: 0;
}

.mv_res_clear {
	margin-top: 0;
	margin-bottom: 0;
}

/* 7.9 - Padding Small Screen Only  - TODO */

/* 7.9.2 -  Margin Horizontal (Small Screen Only) TODO  */

/* 7.9.3 -  Margin Left (Small Screen Only) TODO  */

/* 7.9.4 -  Margin Right (Small Screen Only) TODO  */

/* 7.10 - Margin Dynamic Responsive - clamp() - TODO  */



/* 8 - Object Padding   */

/* 8.1 - Padding Vertical   */
.pv0 {
	padding-top: 0;
	padding-bottom: 0;
}

.pv0_2 {
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
}

.pv0_5 {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

.pv1 {
	padding-top: 1rem;
	padding-bottom: 1rem;
}

.pv1_5 {
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
}

.pv2 {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.pv2_5 {
	padding-top: 2.5rem;
	padding-bottom: 2.5rem;
}

.pv3 {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.pv3_5 {
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
}

.pv4 {
	padding-top: 4rem;
	padding-bottom: 4rem;
}

.pv4_5 {
	padding-top: 4.5rem;
	padding-bottom: 4.5rem;
}

.pv5 {
	padding-top: 5rem;
	padding-bottom: 5rem;
}

.pv5_5 {
	padding-top: 5.5rem;
	padding-bottom: 5.5rem;
}

.pv6 {
	padding-top: 6rem;
	padding-bottom: 6rem;
}

.pv6_5 {
	padding-top: 6.5rem;
	padding-bottom: 6.5rem;
}

.pv7 {
	padding-top: 7rem;
	padding-bottom: 7rem;
}

.pv7_5 {
	padding-top: 7.5rem;
	padding-bottom: 7.5rem;
}

.pv8 {
	padding-top: 8rem;
	padding-bottom: 8rem;
}

/* 8.2 - Padding Top   */

.pt0 {
	padding-top: 0;
}


.pt0_1 {
	padding-top: 0.15rem;
}

.pt0_2 {
	padding-top: 0.25rem;
}

.pt0_3 {
	padding-top: 0.35rem;
}

.pt0_5 {
	padding-top: 0.5rem;
}

.pt0_7 {
	padding-top: 0.75rem;
}

.pt1 {
	padding-top: 1rem;
}

.pt1_2 {
	padding-top: 1.25rem;
}

.pt1_5 {
	padding-top: 1.5rem;
}

.pt1_7 {
	padding-top: 1.75rem;
}

.pt2 {
	padding-top: 2rem;
}

.pt2_2 {
	padding-top: 2.25rem;
}

.pt2_5 {
	padding-top: 2.5rem;
}

.pt2_7 {
	padding-top: 2.75rem;
}

.pt3 {
	padding-top: 3rem;
}

.pt3_2 {
	padding-top: 3.25rem;
}

.pt3_5 {
	padding-top: 3.5rem;
}

.pt3_7 {
	padding-top: 3.75rem;
}

.pt4 {
	padding-top: 4rem;
}

.pt4_2 {
	padding-top: 4.25rem;
}

.pt4_5 {
	padding-top: 4.5rem;
}

.pt4_7 {
	padding-top: 4.75rem;
}

.pt5 {
	padding-top: 5rem;
}

.pt5_2 {
	padding-top: 5.25rem;
}

.pt5_5 {
	padding-top: 5.5rem;
}

.pt5_7 {
	padding-top: 5.75rem;
}

.pt6 {
	padding-top: 6rem;
}

.pt6_2 {
	padding-top: 6.25rem;
}

.pt6_5 {
	padding-top: 6.5rem;
}

.pt6_7 {
	padding-top: 6.75rem;
}

.pt7 {
	padding-top: 7rem;
}

.pt7_2 {
	padding-top: 7.25rem;
}

.pt7_5 {
	padding-top: 7.5rem;
}

.pt7_7 {
	padding-top: 7.75rem;
}

.pt8 {
	padding-top: 8rem;
}

/* 8.3 - Padding Bottom   */

.pb0 {
	padding-bottom: 0;
}

.pb0_1 {
	padding-bottom: 0.15rem;
}

.pb0_2 {
	padding-bottom: 0.25rem;
}

.pb0_3 {
	padding-bottom: 0.35rem;
}

.pb0_5 {
	padding-bottom: 0.5rem;
}

.pb0_7 {
	padding-bottom: 0.75rem;
}

.pb1 {
	padding-bottom: 1rem;
}

.pb1_2 {
	padding-bottom: 1.25rem;
}

.pb1_5 {
	padding-bottom: 1.5rem;
}

.pb1_7 {
	padding-bottom: 1.75rem;
}

.pb2 {
	padding-bottom: 2rem;
}

.pb2_2 {
	padding-bottom: 2.25rem;
}

.pb2_5 {
	padding-bottom: 2.5rem;
}

.pb2_7 {
	padding-bottom: 2.75rem;
}

.pb3 {
	padding-bottom: 3rem;
}

.pb3_2 {
	padding-bottom: 3.25rem;
}

.pb3_5 {
	padding-bottom: 3.5rem;
}

.pb3_7 {
	padding-bottom: 3.75rem;
}

.pb4 {
	padding-bottom: 4rem;
}

.pb4_2 {
	padding-bottom: 4.25rem;
}

.pb4_5 {
	padding-bottom: 4.5rem;
}

.pb4_7 {
	padding-bottom: 4.75rem;
}

.pb5 {
	padding-bottom: 5rem;
}

.pb5_2 {
	padding-bottom: 5.25rem;
}

.pb5_5 {
	padding-bottom: 5.5rem;
}

.pb5_7 {
	padding-bottom: 5.75rem;
}

.pb6 {
	padding-bottom: 6rem;
}

.pb6_2 {
	padding-bottom: 6.25rem;
}

.pb6_5 {
	padding-bottom: 6.5rem;
}

.pb6_7 {
	padding-bottom: 6.75rem;
}

.pb7 {
	padding-bottom: 7rem;
}

.pb7_2 {
	padding-bottom: 7.25rem;
}

.pb7_5 {
	padding-bottom: 7.5rem;
}

.pb7_7 {
	padding-bottom: 7.75rem;
}

.pb8 {
	padding-bottom: 8rem;
}


/* 8.4 - Padding Horizontal   */
.ph0_2 {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}

.ph0_5 {
	padding-left: 0.55rem;
	padding-right: 0.55rem;
}

.ph0_7 {
	padding-left: 0.75rem;
	padding-right: 0.75rem;
}

.ph1 {
	padding-left: 1rem;
	padding-right: 1rem;
}

.ph1_2 {
	padding-left: 1.25rem;
	padding-right: 1.25rem;
}

.ph1_5 {
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

.ph1_7 {
	padding-left: 1.75rem;
	padding-right: 1.75rem;
}

.ph2 {
	padding-left: 2rem;
	padding-right: 2rem;
}

.ph2_2 {
	padding-left: 2.25rem;
	padding-right: 2.25rem;
}

.ph2_5 {
	padding-left: 2.5rem;
	padding-right: 2.5rem;
}

.ph2_7 {
	padding-left: 2.75rem;
	padding-right: 2.75rem;
}

.ph3 {
	padding-left: 3rem;
	padding-right: 3rem;
}

.ph3_2 {
	padding-left: 3.25rem;
	padding-right: 3.25rem;
}

.ph3_5 {
	padding-left: 3.5rem;
	padding-right: 3.5rem;
}

.ph3_7 {
	padding-left: 3.75rem;
	padding-right: 3.75rem;
}

.ph4 {
	padding-left: 4rem;
	padding-right: 4rem;
}

.ph4_2 {
	padding-left: 4.25rem;
	padding-right: 4.25rem;
}

.ph4_5 {
	padding-left: 4.5rem;
	padding-right: 4.5rem;
}

.ph4_7 {
	padding-left: 4.75rem;
	padding-right: 4.75rem;
}

.ph5 {
	padding-left: 5rem;
	padding-right: 5rem;
}

.ph5_2 {
	padding-left: 5.25rem;
	padding-right: 5.25rem;
}

.ph5_5 {
	padding-left: 5.5rem;
	padding-right: 5.5rem;
}

.ph5_7 {
	padding-left: 5.75rem;
	padding-right: 5.75rem;
}

.ph6 {
	padding-left: 6rem;
	padding-right: 6rem;
}

.ph6_2 {
	padding-left: 6.25rem;
	padding-right: 6.25rem;
}

.ph6_5 {
	padding-left: 6.5rem;
	padding-right: 6.5rem;
}

.ph6_7 {
	padding-left: 6.75rem;
	padding-right: 6.75rem;
}

.ph7 {
	padding-left: 7rem;
	padding-right: 7rem;
}

/* 8.5 - Padding Left   */

.pl0 {
	padding-left: 0;
}

.pl0_1 {
	padding-left: 0.15rem;
}

.pl0_2 {
	padding-left: 0.25rem;
}

.pl0_3 {
	padding-left: 0.35rem;
}

.pl0_5 {
	padding-left: 0.5rem;
}

.pl0_7 {
	padding-left: 0.75rem;
}

.pl1 {
	padding-left: 1rem;
}

.pl1_2 {
	padding-left: 1.25rem;
}

.pl1_5 {
	padding-left: 1.5rem;
}

.pl1_7 {
	padding-left: 1.75rem;
}

.pl2 {
	padding-left: 2rem;
}

.pl2_2 {
	padding-left: 2.25rem;
}

.pl2_5 {
	padding-left: 2.5rem;
}

.pl2_7 {
	padding-left: 2.75rem;
}

.pl3 {
	padding-left: 3rem;
}

.pl3_2 {
	padding-left: 3.25rem;
}

.pl3_5 {
	padding-left: 3.5rem;
}

.pl3_7 {
	padding-left: 3.75rem;
}

.pl4 {
	padding-left: 4rem;
}

.pl4_2 {
	padding-left: 4.25rem;
}

.pl4_5 {
	padding-left: 4.5rem;
}

.pl4_7 {
	padding-left: 4.75rem;
}

.pl5 {
	padding-left: 5rem;
}

.pl5_2 {
	padding-left: 5.25rem;
}

.pl5_5 {
	padding-left: 5.5rem;
}

.pl5_7 {
	padding-left: 5.75rem;
}

.pl6 {
	padding-left: 6rem;
}

.pl6_2 {
	padding-left: 6.25rem;
}

.pl6_5 {
	padding-left: 6.5rem;
}

.pl6_7 {
	padding-left: 6.75rem;
}

.pl7 {
	padding-left: 7rem;
}

.pl7_2 {
	padding-left: 7.25rem;
}

.pl7_5 {
	padding-left: 7.5rem;
}

.pl7_7 {
	padding-left: 7.75rem;
}

.pl8 {
	padding-left: 8rem;
}

/* 8.6 - Padding Right   */

.pr0 {
	padding-right: 0;
}

.pr0_1 {
	padding-right: 0.15rem;
}

.pr0_2 {
	padding-right: 0.25rem;
}

.pr0_3 {
	padding-right: 0.35rem;
}

.pr0_5 {
	padding-right: 0.5rem;
}

.pr0_7 {
	padding-right: 0.75rem;
}

.pr1 {
	padding-right: 1rem;
}

.pr1_2 {
	padding-right: 1.25rem;
}

.pr1_5 {
	padding-right: 1.5rem;
}

.pr1_7 {
	padding-right: 1.75rem;
}

.pr2 {
	padding-right: 2rem;
}

.pr2_2 {
	padding-right: 2.25rem;
}

.pr2_5 {
	padding-right: 2.5rem;
}

.pr2_7 {
	padding-right: 2.75rem;
}

.pr3 {
	padding-right: 3rem;
}

.pr3_2 {
	padding-right: 3.25rem;
}

.pr3_5 {
	padding-right: 3.5rem;
}

.pr3_7 {
	padding-right: 3.75rem;
}

.pr4 {
	padding-right: 4rem;
}

.pr4_2 {
	padding-right: 4.25rem;
}

.pr4_5 {
	padding-right: 4.5rem;
}

.pr4_7 {
	padding-right: 4.75rem;
}

.pr5 {
	padding-right: 5rem;
}

.pr5_2 {
	padding-right: 5.25rem;
}

.pr5_5 {
	padding-right: 5.5rem;
}

.pr5_7 {
	padding-right: 5.75rem;
}

.pr6 {
	padding-right: 6rem;
}

.pr6_2 {
	padding-right: 6.25rem;
}

.pr6_5 {
	padding-right: 6.5rem;
}

.pr6_7 {
	padding-right: 6.75rem;
}

.pr7 {
	padding-right: 7rem;
}

.pr7_2 {
	padding-right: 7.25rem;
}

.pr7_5 {
	padding-right: 7.5rem;
}

.pr7_7 {
	padding-right: 7.75rem;
}

.pr8 {
	padding-right: 8rem;
}



/* 8.8 - Padding Responsive   */

/* 8.8.1 - Padding Clear Large   */
.ph_clear {}

.pv_clear {}

/* 8.8.2 - Padding Clear Small  */
.ph_res_clear {
	padding-left: 0;
	padding-right: 0;
}

.pv_res_clear {
	padding-top: 0;
	padding-bottom: 0;
}

/* 8.9 - Padding Small Screen Only (@media) - TODO  */
/* 8.9.1 - Padding Horizontal (small only) TODO */
/* 8.9.2 - Padding Left (small only) TODO */
/* 8.9.3 - Padding Right (small only) TODO */

/* 8.10 - Padding Dynamic Responsive - clamp() - TODO   */


/* 9 - Object Styling  */

/* 9.1 - Object Width */

/* 9.1.1 - Object Width Respnisive Clear */
.width_clear {
	/* width: 100%; */
}

/* 9.1.2 - Object Width Percentage  */
.wp10 {
	width: 10%;
}

.wp15 {
	width: 15%;
}

.wp20 {
	width: 20%;
}

.wp25 {
	width: 25%;
}

.wp30 {
	width: 30%;
}

.wp35 {
	width: 35%;
}

.wp40 {
	width: 40%;
}

.wp45 {
	width: 45%;
}

.wp50 {
	width: 50%;
}

.wp55 {
	width: 55%;
}

.wp60 {
	width: 60%;
}

.wp65 {
	width: 65%;
}

.wp70 {
	width: 70%;
}

.wp75 {
	width: 75%;
}

.wp80 {
	width: 80%;
}

.wp85 {
	width: 85%;
}

.wp90 {
	width: 90%;
}

.wp95 {
	width: 95%;
}

.wp100 {
	width: 100%;
}

/* 9.1.3 - Object Width Relative - clamp() TODO */

/* 9.2 - Object Height */
/* 9.2.1 - Object Height Respnisive Clear */
.height_clear {
	/* width_clear */
}

/* 9.2.1 - Object Height Percentage  */
.hp10 {
	height: 10%;
}

.hp15 {
	height: 15%;
}

.hp20 {
	height: 20%;
}

.hp25 {
	height: 25%;
}

.hp30 {
	height: 30%;
}

.hp35 {
	height: 35%;
}

.hp40 {
	height: 40%;
}

.hp45 {
	height: 45%;
}

.hp50 {
	height: 50%;
}

.hp55 {
	height: 55%;
}

.hp60 {
	height: 60%;
}

.hp65 {
	height: 65%;
}

.hp70 {
	height: 70%;
}

.hp75 {
	height: 75%;
}

.hp80 {
	height: 80%;
}

.hp85 {
	height: 85%;
}

.hp90 {
	height: 90%;
}

.hp95 {
	height: 95%;
}

.hp100 {
	height: 100%;
}

/* 9.2.2 - Object Height Relative - TODO */

/* 9.3 - Borders  */
.bdr {}

/* 9.3.1 - Border Style  */
.brd_style-solid {
	border-style: solid;
}

.brd_style-dash {
	border-style: dashed;
}

.brd_style-dotted {
	border-style: dotted;
}

.brd_style-none {
	border-style: hidden;
}

/* 9.3.2 - Border Colors  */
.brd_color-black {
	border-color: var(--primary_black);
}

.brd_color-violet {
	border-color: var(--primary_violet);
}

.brd_color-white {
	border-color: var(--primary_white);
}

.brd_color-grey {
	border-color: var(--primary_grey);
}

.brd_color-light_grey {
	border-color: var(--secondary_light_grey);
}

.brd_color-dark_grey {
	border-color: var(--secondary_dark_grey);
}

.brd_color-dark_violet {
	border-color: var(--secondary_dark_violet);
}

/* 9.3.3 - Border Width (in pixels)  */
.brd_width-1 {
	border-width: 0.1rem;
}

.brd_width-2 {
	border-width: 0.2rem;
}

.brd_width-3 {
	border-width: 0.3rem;
}

.brd_width-4 {
	border-width: 0.4rem;
}

.brd_width-5 {
	border-width: 0.5rem;
}

.brd_width-6 {
	border-width: 0.6rem;
}

.brd_width-7 {
	border-width: 0.7rem;
}

.brd_width-8 {
	border-width: 0.8rem;
}

.brd_width-9 {
	border-width: 0.9rem;
}

.brd_width-10 {
	border-width: 1rem;
}

/* 9.3.4 - Border Side (to be set last) */
.brd_pos-btm {
	border-top: none;
	border-left: none;
	border-right: none;
}

.brd_pos-top {
	border-bottom: none;
	border-left: none;
	border-right: none;
}

.brd_pos-left {
	border-top: none;
	border-bottom: none;
	border-right: none;
}

.brd_pos-right {
	border-top: none;
	border-bottom: none;
	border-left: none;
}

.brd_pos-top_btm {
	border-left: none;
	border-right: none;
}

.brd_pos-left_right {
	border-top: none;
	border-bottom: none;
}

/* 9.4 - Backgrounds */
.bg {
	/* This is the top level background object */
}

/* 9.4.1 - Background Colour */
.bg_col {}

.bg_full_white {
	background-color: var(--primary_white);
}

.bg_black {
	background-color: var(--primary_black);
}

.bg_grey {
	background-color: var(--primary_grey);
}

.bg_light_grey {
	background-color: var(--secondary_light_grey);
}

.bg_dark_grey {
	background-color: var(--secondary_dark_grey);
}

.bg_bright_violet {
	background-color: var(--secondary_bright_violet);
}

.bg_light_violet {
	background-color: var(--secondary_light_violet);
}

/* 9.4.2 - Background Image */
.bg_img {
	position: relative;
}

.bg_img_content-centre {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* 9.5 - Opacity */
/* 9.6 - Shadows & Lightboxs */
.light_box_img-gry {
	img {
		box-shadow:
			0 4px 8px 0 rgba(0, 0, 0, 0.64),
			0 6px 20px 0 rgba(0, 0, 0, 0.19);
	}
}

/* 9.7 - Horizontal Lines */
.hr {
	height: 1px;
	border: 0;
	width: 100%;
}

.hr_wht {
	background: #fff;
}

.hr_blk {
	background: #000;
}

.hr_vio {
	background: #4b1e78;
}

.hr_gry {
	background: #585858;
}

.hr_l_gry {
	background: #d9d9d9;
}

.hr_h1 {
	height: 1px;
}

.hr_h2 {
	height: 3px;
}

.hr_h3 {
	height: 5px;
}

.hr_h4 {
	height: 8px;
}

.hr_h5 {
	height: 10px;
}

.hr_w30 {
	width: 30%;
}

.hr_w50 {
	width: 50%;
}

.hr_w55 {
	width: 55%;
}

.hr_w60 {
	width: 60%;
}

.hr_w65 {
	width: 65%;
}

.hr_w70 {
	width: 70%;
}

.hr_w75 {
	width: 75%;
}

.hr_w80 {
	width: 80%;
}

.hr_w85 {
	width: 85%;
}

.hr_w100 {
	width: 100%;
}




/* 10 - Button & Links */

/* 10.1 - Buttons */
/* Top Level Button Wrapper */
/* Buttons don't need any styles on the anchor, except font size */
.but {
	a {
		/* Default Button Spacing */
		padding: 0.5rem 2rem;
		border-radius: 0.3rem;

		cursor: pointer;
		transition: 0.3s;
		text-decoration: none;
		display: inline-block;
	}
}

/* 10.1.1 - Button Wrapper Posistion  */
.but-align_cent {
	a {
		text-align: center;
	}
}

.but-align_left {
	a {
		text-align: left;
	}
}

.but-align_right {
	a {
		text-align: right;
	}
}

/* 10.1.2 - Button Internal Spacing */
.but-inner_sml {
	a {
		padding: 0.2rem 0.8rem;
	}
}

.but-inner_mid {
	a {
		padding: 1rem 4rem;
	}
}

.but-inner_wide {
	a {
		padding: 2rem 5rem;
	}
}

/* 10.1.3 - Button Width */
.but-100 {
	a {
		width: 100%;
	}
}

.but-75 {
	a {
		min-width: 75%;
	}
}

.but-60 {
	a {
		min-width: 60%;
	}
}

.but-55 {
	a {
		min-width: 55%;
	}
}

.but-50 {
	a {
		min-width: 50%;
	}
}

.but-45 {
	a {
		min-width: 45%;
	}
}

.but-40 {
	a {
		min-width: 40%;
	}
}

.but-35 {
	a {
		min-width: 35%;
	}
}

.but-30 {
	a {
		min-width: 30%;
	}
}

.but-25 {
	a {
		min-width: 25%;
	}
}

/* 10.1.4  - Button Color & Hover */
.but-blk {
	a {
		/* text-transform: uppercase; */
		background-color: var(--primary_black);
		border: 1px solid var(--primary_black);
		color: var(--primary_white);

		&:hover,
		&:active {
			text-decoration: none;
			background-color: var(--primary_white);
			border: 1px solid var(--primary_black);
			color: var(--primary_black);
			transition: 0.3s;
		}
	}
}

.but-wht {
	a {
		background-color: var(--primary_white);
		border: 1px solid var(--primary_black);
		color: var(--primary_black);

		&:hover,
		&:active {
			text-decoration: none;
			background-color: var(--primary_black);
			border: 1px solid var(--primary_white);
			color: var(--primary_white);
			transition: 0.3s;
		}
	}
}

.but-vio_main {
	a {
		background-color: var(--primary_violet);
		border: 1px solid var(--primary_violet);
		color: var(--primary_white);
		text-decoration: none;

		&:hover,
		&:active {
			text-decoration: none;
			background-color: var(--primary_white);
			border: 1px solid var(--primary_violet);
			color: var(--primary_violet);
			transition: 0.3s;
		}
	}
}

.but-vio_bri {
	a {
		background-color: var(--secondary_bright_violet);
		border: 1px solid var(--secondary_bright_violet);
		color: var(--primary_white);
		text-decoration: none;

		&:hover,
		&:active {
			text-decoration: none;
			background-color: var(--primary_white);
			border: 1px solid var(--secondary_bright_violet);
			color: var(--secondary_bright_violet);
			transition: 0.3s;
		}
	}
}

.but-wht_border {
	a {
		background-color: transparent;
		border: 1px solid var(--primary_white);
		color: var(--primary_white);
		text-decoration: none;

		&:hover,
		&:active {
			text-decoration: none;
			background-color: var(--primary_black);
			border: 1px solid var(--primary_white);
			color: var(--primary_white);
			transition: 0.3s;
		}
	}
}

/* 10.1.5 - Button Shape */
.but_round {
	a {
		border-radius: 50%;
	}
}

.but_pill {
	a {
		border-radius: 2rem;
	}
}

.but_square {
	a {
		border-radius: 0;
	}
}

/* 10.2 - Links */
.link {}

/* 10.2.1 - Text Links  */

.link-default {
	a {
		text-decoration: none;
		color: inherit;

		&:hover {
			transition: 0.3s;
			color: var(--primary_violet);
		}
	}
}

.link-underline {
	a {
		text-decoration: underline;
		color: inherit;

		&:hover {
			transition: 0.3s;
			color: var(--primary_violet);
		}
	}
}



.link-bold {
	a {
		color: inherit;
		text-decoration: underline;
		font-weight: 600;

		&:hover {
			transition: 0.3s;
			color: var(--primary_violet);
		}
	}
}

.link_color-blk {
	a {

		&:hover {
			color: var(--primary_black);

		}
	}
}

.link_color-wht {
	a {

		&:hover {
			color: var(--primary_white);

		}
	}
}

.link_color-vio_bright {
	a {

		&:hover {
			color: var(--secondary_bright_violet);

		}
	}
}

.link_color-blue {
	a {

		&:hover {
			color: var(--tertiary_blue);

		}
	}
}

.link_color-mag {
	a {

		&:hover {
			color: var(--tertiary_magenta);

		}
	}
}

/* 10.2.2 - Content Link Wrapper */
.link-content {
	/* TODO */
}

/* 10.2.3 - Image Link Wrapper */

.link-img {
	transition: 0.3s;

	&:hover {
		filter: brightness(50%);
	}
}

/* 10.2.4 - SVG/Icon Links */
.link-icon_arrow_right {
	a {
		color: var(--primary_grey);
		text-decoration: none;

		display: flex;
		align-items: center;
		transition: 0.3s;

		&:hover {
			transition: 0.3s;
			color: var(--primary_violet);

			svg {
				fill: var(--primary_violet);
			}
		}
	}

	.icon_wrap {
		display: flex;
		height: 1.1em;
		margin-left: 0.5rem;
	}


}



/* 11 - Components  */

/* 11.1 - Banners */

.banner {
	/* position: relative; */
}

/* 11.1.1 - Banner Height */

.banner-height40 {
	height: 40vh;
}

.banner-height50 {
	height: 50vh;
}

.banner-height55 {
	height: 55vh;
}

.banner-height60 {
	height: 60vh;
}

.banner-height65 {
	height: 65vh;
}

.banner-height70 {
	height: 70vh;
}

.banner-height75 {
	height: 75vh;
}

.banner-height80 {
	height: 80vh;
}

.banner-height85 {
	height: 85vh;
}

/* 11.1.2 - Page/Content Wide Image Banner */
.banner-wide {
	img {
		width: 100%;
	}
}

/* 11.1.3 - Full Width Image Banner */

/* Banner Image - requires the following, inline, for G-Web
    #d?????? {
        background-image: url("@@tcm:138-???????");
        background-attachment: scroll;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }
*/

.banner_img {
	position: relative;
	overflow: hidden;
}

.banner_img-center_content_wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
}

.banner_img-left_content_wrapper {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.banner_img-right_content_wrapper {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

/* 11.1.4 - Full Width Video Banner */

/* Banner Video - requires the following, inline, for G-Web
     #d??????? {
        padding: 0;

        .l-inner {
            max-width: 100%;
        }
    }
*/

.banner_vid {
	position: relative;
	overflow: hidden;

	video {
		position: absolute;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.banner_vid-content_center {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		padding-left: 0;
		padding-right: 0;
	}

	.banner_vid-content_left {
		position: absolute;
		left: 5%;
		top: 50%;
		transform: translate(0, -50%);
		padding-left: 1.5rem;
	}
}

/* 11.1.5 - Parallax Banner TODO - Include Safari fix*/

/* 11.2 - Tables */
.tab,
.tab-list {
	table {
		border-collapse: collapse;
		width: 100%;
		table-layout: fixed;

		td,
		th {
			padding: 0.5rem;
		}
	}
}

.tab-min_padding {
	table {
		border-collapse: collapse;
		width: 100%;
		table-layout: fixed;

		td,
		th {
			padding: 0.2rem;
		}
	}
}

.tab-med_padding {
	table {
		border-collapse: collapse;
		width: 100%;
		table-layout: fixed;

		td,
		th {
			padding: 0.8rem;
		}
	}
}


/* 11.2.1 - Responisve Table Settings */
.tab-ds_mh {
	display: block;
}

.tab-ms_dh {
	display: none;
}

/* 11.2.2 - General Table Width & Height */
.tab_width-20 {
	width: 20%;
}

.tab_width-30 {
	width: 30%;
}

.tab_width-40 {
	width: 40%;
}

.tab_width-50 {
	width: 50%;
}

.tab_width-60 {
	width: 60%;
}

.tab_width-70 {
	width: 70%;
}

.tab_width-80 {
	width: 80%;
}

.tab-2_col_50_50 {
	table {

		th:nth-child(1),
		td:nth-child(1),
		th:nth-child(2n),
		td:nth-child(2n) {
			width: 50%;
		}
	}
}

.tab-2_col_60_40 {
	table {

		th:nth-child(1),
		td:nth-child(1) {
			width: 60%;
		}

		th:nth-child(2n),
		td:nth-child(2n) {
			width: 40%;
		}
	}
}

.tab-2_col_30_70 {
	table {

		th:nth-child(1),
		td:nth-child(1) {
			width: 30%;
		}

		th:nth-child(2n),
		td:nth-child(2n) {
			width: 70%;
		}
	}
}

.tab-3_col_20_40_40 {
	table {

		th,
		td {
			width: 40%;
		}

		th:nth-child(1),
		td:nth-child(1) {
			width: 20%;
		}
	}
}

.tab-4_col_25 {
	table {

		th,
		td {
			width: 25%;
		}
	}
}

.tab-var_width {
	table {}
}

/* 11.2.3 - Individual Column Widths & Height */
.col_20 {
	width: 20%;
}

.col_25 {
	width: 25%;
}

.col_30 {
	width: 30%;
}

/* 11.2.4 - Table Borders */
.tab-border_blk {

	table {

		td,
		th {
			border: 1px solid var(--primary_black);
		}
	}
}

.tab-border_grey {

	table {

		td,
		th {
			border: 1px solid var(--primary_grey);
		}
	}
}

.tab-border_grey_light {

	table {

		td,
		th {
			border: 1px solid var(--secondary_light_grey);
		}
	}
}

.tab-border_bottom_grey {

	table {

		td,
		th {
			border-bottom: 1px solid var(--primary_grey);
		}
	}
}

.tab-border_bottom_blk {

	table {

		td,
		th {
			border-bottom: 1px solid var(--primary_black);
		}
	}
}

.tab-border_bottom_dotted {
	table {
		tr {
			border-bottom: dotted 2px var(--primary_black);
		}
	}
}

.tab-border_bottom_none {
	table {
		tr {
			border-bottom: none;
		}
	}
}

/* 11.2.5 - Table Styles */
.tab-alt_odd--light_grey {
	table {
		tr:nth-child(odd) {
			background-color: var(--secondary_light_grey_extra);
		}
	}
}

.tab-alt_even--light_grey {
	table {
		tr:nth-child(even) {
			background-color: var(--secondary_light_grey_extra);
		}
	}
}

.tab-alt_odd--dark_grey {
	table {
		tr:nth-child(odd) {
			background-color: var(--secondary_dark_grey);
		}
	}
}

.tab-alt_even--dark_grey {
	table {
		tr:nth-child(even) {
			background-color: var(--secondary_dark_grey);
		}
	}
}

/* 11.2.6 - Table Header Cell Styles */
.tab_heading-bold {
	table {
		th {
			font-weight: 700;
		}
	}
}

.tab_heading-bg_light_grey {
	table {
		th {
			background-color: var(--secondary_light_grey)
		}
	}
}

.tab_heading-bg_dark_grey {
	table {
		th {
			background-color: var(--secondary_dark_grey)
		}
	}
}

/* 11.2.7 - Table Header Borders Style */
.tab_header-border_solid {
	table {
		th {
			border-bottom-style: solid;
		}
	}
}

.tab_header-border_dotted {
	table {
		th {
			border-bottom-style: dotted;
		}
	}
}

/* 11.2.8 - Individual Cell Background */
.tab_cell_bg-grey {
	background-color: var(--primary_grey);
	color: var(--primary_black);
	border: none;
}

.tab_cell_bg-grey_light {
	background-color: var(--secondary_light_grey);
	color: var(--primary_black);
	border: none;
}

.tab_cell_bg-grey_dark {
	background-color: var(--secondary_dark_grey);
	color: var(--primary_white);
	border: none;
}

/* 11.3 - Lists */
.list {

	ol,
	ul {
		list-style: revert-layer;
	}

	li {
		margin-bottom: 0.5rem;
	}
}

.list_inner_list {

	ol,
	ul {
		list-style: revert-layer;
	}
}

.list-item_no_btm_margin {
	li {
		margin-bottom: 0;
	}
}

/* 11.3.1 - List Marker Style */
.list-no_markers {

	ul,
	ol {
		list-style-type: none;
	}
}

.list-item_in {

	ul,
	ol {
		list-style-position: inside;
	}
}

.list-item_out {

	ul,
	ol {
		list-style-position: outside;
	}
}

/* 11.3.2 - List Posistioning */
.list-left_align {

	ul,
	ol {
		padding-left: 0;
	}
}

.list-min_spacing {
	li {
		margin-bottom: 0.2rem;
		margin-top: 0;
	}
}

/* 11.3.3 - List Item Styling */
.list-li_bold {
	li::marker {
		font-weight: bold;
	}
}

.list-li_ital {
	li::marker {
		font-style: italic;
	}
}

/* 11.4 - Images  */

/* 11.4.1 - Image Posistion */
.img_left {
	text-align: left;
}

.img_right {
	text-align: right;
}

.img_cent {
	text-align: center;
}

/* 11.4.2 - Image Width - !Responsive ! */
.img_w100 {
	img {
		width: 100%;
	}
}

.img_w80 {
	img {
		width: 80%;
	}
}

.img_w75 {
	img {
		width: 75%;
	}
}

.img_w70 {
	img {
		width: 70%;
	}
}

.img_w60 {
	img {
		width: 60%;
	}
}

.img_w50 {
	img {
		width: 50%;
	}
}

.img_w40 {
	img {
		width: 40%;
	}
}

.img_w30 {
	img {
		width: 30%;
	}
}

.img_w25 {
	img {
		width: 25%;
	}
}

/* 11.4.3 - Responsive Image Height */
.img_res--30 {
	max-height: 100vh;
	object-fit: cover;
}

/* 11.5 - Videos */
.vid {
	video {}
}

/* 11.5.1 - Embed */

.vid-embed_full_width {
	video {
		max-width: 100%;
	}
}

/* 11.5.2 - iFrame */
.vid-iframe {}

.vid-frame_portrait {
	position: relative;
	overflow: hidden;
	width: 50%;
	padding-top: 50%;
	margin: auto;

	iframe {
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 100%;
	}
}



/* 12 - Dynamic Components  */

/* 12.1 - Accordion Dropdown  */
/* Set colors and border with inline style */
.accordion {
	padding: 2rem 0 2.5rem 0;

	.fa {
		font-size: 1.2rem;
	}

	.accordion_item-border {}
}

.accordion_item_wrap {
	padding: .5rem 0;
}


.accordion_dropdown_header {
	padding: .5rem 0;
	display: flex;
	justify-content: space-between;
}

.accordion_dropdown_content {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height 0.3s ease, opacity 0.3s ease;
}

.accordion_dropdown_content.accordion_dropdown-show {
	max-height: 200px;
	opacity: 1;
}

.accordion_dropdown_header-icon {
	transition: transform .4s;
	transform: rotate(0deg);
}

.accordion_dropdown_header-icon.accordion_dropdown_header-icon_rotate {
	-webkit-transition: transform .4s;
	transition: transform .4s;
	transform: rotate(180deg);
}





/* @container (max-width: 999px) { */
@media only screen and (max-width: 999px) {
	/* 1 - General  */

	/* 1.1 - Section Wrappers */
	/* 1.2 - Paragraphs */
	/* 1.3 - Headings */

	/* 1.3 - Responsive Hide/Show */

	/* 1.3.1 - Desktop Show/Mobile Hide */
	.ds_mh {
		display: none;
	}

	/* 1.3.2 - Mobile Show/Desktop Hide */
	.ms_dh {
		display: block;
	}



	/* 2 - Block & Inline Layout */
	.block_w85,
	.block_w80,
	.block_w75,
	.block_w70,
	.block_w60,
	.block_w50,
	.block_w30,
	.block_w25 {
		width: 100%;
	}




	/* 5.1.1 - Flex Direction */
	.fx_row {
		flex-direction: column;
	}


	/* 5 - Typography */

	/* 5.1 - Font Family */
	/* 5.2 - Font Style */

	.font_res_cent_right {
		text-align: right;
	}

	.font_res_cent_left {
		text-align: left;
	}

	.font_res_right_cent {
		text-align: center;
	}

	.font_res_left_cent {
		text-align: center;
	}

	/* 6.3.1 - Font Size Static */

	/* .fs1 {
        }

        .fs1_1 {
        }

        .fs1_2 {
        }

        .fs1_3 {
        }

        .fs1_4 {
        }

        .fs1_5 {
        }

        .fs1_6 {
        }

        .fs1_7 {
        }

        .fs1_8 {
        }

        .fs1_9 {
        }

        .fs2 {
        }
*/
	.fs2_1 {
		font-size: 2rem;
	}

	.fs2_2 {
		font-size: 2rem;
	}

	.fs2_3 {
		font-size: 2rem;
	}

	.fs2_4 {
		font-size: 2rem;
	}

	.fs2_5 {
		font-size: 2.15rem;
	}

	.fs2_6 {
		font-size: 2.175rem;
	}

	.fs2_7 {
		font-size: 2.2rem;
	}

	.fs2_8 {
		font-size: 2.3rem;
	}

	.fs2_9 {
		font-size: 2.4rem;
	}

	.fs3 {
		font-size: 2.8rem;
	}

	.fs3_2 {
		font-size: 3rem;
	}

	.fs3_5 {
		font-size: 3rem;
	}

	.fs3_7 {
		font-size: 3.2rem;
	}

	.fs4 {
		font-size: 2rem;
	}

	.fs4_5 {
		font-size: 2.5rem;
	}

	.fs5 {
		font-size: 3rem;
	}

	.fs5_5 {
		font-size: 3.5rem;
	}

	.fs6 {
		font-size: 4.8rem;
	}

	.fs6_5 {
		font-size: 5rem;
	}

	.fs7 {
		font-size: 5.2rem;
	}

	.fs7_5 {
		font-size: 5.5rem;
	}

	.fs8 {
		font-size: 5.7rem;
	}


	/* 6.4 - Font Weight (.fw) */
	/* 6.5 - Font Colours (.fc) */
	/* 6.5.1 - Primary Font Colours */
	/* 6.5.2 - Secondary Font Colours */
	/* 6.5.3 - Tertiary Font Colours */

	/* 6.6 - Text Posistioning  */
	/* 6.6.1 - Text Alignment (.ta) */
	/* 6.6.2 - Responsive Text Alignment (.font_res_) */

	/* 6.7 - Line Height (.lh)  */
	/* 6.8 - Letter Spacing (.ls)  */



	/* 7 - Object Margin   */
	/* 7.1 - Margin Vertical  */

	.mv0_2 {
		margin-top: 0.125rem;
		margin-bottom: 0.125rem;
	}

	.mv0_5 {
		margin-top: 0.25rem;
		margin-bottom: 0.25rem;
	}

	.mv1 {
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
	}

	.mv1_5 {
		margin-top: .75rem;
		margin-bottom: .75rem;
	}

	.mv2 {
		margin-top: 1rem;
		margin-bottom: 1rem;
	}

	.mv2_5 {
		margin-top: 1.25rem;
		margin-bottom: 1.25rem;
	}

	.mv3 {
		margin-top: 1.5rem;
		margin-bottom: 1.5rem;
	}

	.mv3_5 {
		margin-top: 1.75rem;
		margin-bottom: 1.75rem;
	}

	.mv4 {
		margin-top: 2rem;
		margin-bottom: 2rem;
	}

	.mv4_5 {
		margin-top: 2.25rem;
		margin-bottom: 2.25rem;
	}

	.mv5 {
		margin-top: 2.5rem;
		margin-bottom: 2.5rem;
	}

	.mv5_5 {
		margin-top: 2.75rem;
		margin-bottom: 2.75rem;
	}

	.mv6 {
		margin-top: 3rem;
		margin-bottom: 3rem;
	}

	.mv6_5 {
		margin-top: 3.25rem;
		margin-bottom: 3.25rem;
	}

	.mv7 {
		margin-top: 3.5rem;
		margin-bottom: 3.5rem;
	}

	.mv7_5 {
		margin-top: 3.75rem;
		margin-bottom: 3.75rem;
	}

	.mv8 {
		margin-top: 4rem;
		margin-bottom: 4rem;
	}

	/* 7.2 - Margin Top  */

	.mt0_1 {
		margin-top: 0.075rem;
	}

	.mt0_2 {
		margin-top: 0.125rem;
	}

	.mt0_3 {
		margin-top: 0.175rem;
	}

	.mt0_5 {
		margin-top: 0.25rem;
	}

	.mt0_7 {
		margin-top: 0.375rem;
	}

	.mt1 {
		margin-top: 0.5rem;
	}

	.mt1_2 {
		margin-top: 0.625rem;
	}

	.mt1_5 {
		margin-top: .75rem;
	}

	.mt1_7 {
		margin-top: 0.875rem;
	}

	.mt2 {
		margin-top: 1rem;
	}

	.mt2_2 {
		margin-top: 1.125rem;
	}

	.mt2_5 {
		margin-top: 1.25rem;
	}

	.mt2_7 {
		margin-top: 1.375rem;
	}

	.mt3 {
		margin-top: 1.5rem;
	}

	.mt3_2 {
		margin-top: 1.625rem;
	}

	.mt3_5 {
		margin-top: 1.75rem;
	}

	.mt3_7 {
		margin-top: 1.875rem;
	}

	.mt4 {
		margin-top: 2rem;
	}

	.mt4_2 {
		margin-top: 2.125rem;
	}

	.mt4_5 {
		margin-top: 2.25rem;
	}

	.mt4_7 {
		margin-top: 2.375rem;
	}

	.mt5 {
		margin-top: 2.5rem;
	}

	.mt5_2 {
		margin-top: 2.625rem;
	}

	.mt5_5 {
		margin-top: 2.75rem;
	}

	.mt5_7 {
		margin-top: 2.875rem;
	}

	.mt6 {
		margin-top: 3rem;
	}

	.mt6_2 {
		margin-top: 3.125rem;
	}

	.mt6_5 {
		margin-top: 3.25rem;
	}

	.mt6_7 {
		margin-top: 3.375rem;
	}

	.mt7 {
		margin-top: 3.5rem;
	}

	.mt7_2 {
		margin-top: 3.625rem;
	}

	.mt7_5 {
		margin-top: 3.75rem;
	}

	.mt7_7 {
		margin-top: 3.875rem;
	}

	.mt8 {
		margin-top: 4rem;
	}

	/* 7.3 - Margin Bottom  */

	.mb0_1 {
		margin-bottom: 0.075rem;
	}

	.mb0_2 {
		margin-bottom: 0.125rem;
	}

	.mb0_3 {
		margin-bottom: 0.175rem;
	}

	.mb0_5 {
		margin-bottom: 0.25rem;
	}

	.mb0_7 {
		margin-bottom: 0.375rem;
	}

	.mb1 {
		margin-bottom: 0.5rem;
	}

	.mb1_2 {
		margin-bottom: 0.625rem;
	}

	.mb1_5 {
		margin-bottom: .75rem;
	}

	.mb1_7 {
		margin-bottom: 0.875rem;
	}

	.mb2 {
		margin-bottom: 1rem;
	}

	.mb2_2 {
		margin-bottom: 1.125rem;
	}

	.mb2_5 {
		margin-bottom: 1.25rem;
	}

	.mb2_7 {
		margin-bottom: 1.375rem;
	}

	.mb3 {
		margin-bottom: 1.5rem;
	}

	.mb3_2 {
		margin-bottom: 1.625rem;
	}

	.mb3_5 {
		margin-bottom: 1.75rem;
	}

	.mb3_7 {
		margin-bottom: 1.875rem;
	}

	.mb4 {
		margin-bottom: 2rem;
	}

	.mb4_2 {
		margin-bottom: 2.125rem;
	}

	.mb4_5 {
		margin-bottom: 2.25rem;
	}

	.mb4_7 {
		margin-bottom: 2.375rem;
	}

	.mb5 {
		margin-bottom: 2.5rem;
	}

	.mb5_2 {
		margin-bottom: 2.625rem;
	}

	.mb5_5 {
		margin-bottom: 2.75rem;
	}

	.mb5_7 {
		margin-bottom: 2.875rem;
	}

	.mb6 {
		margin-bottom: 3rem;
	}

	.mb6_2 {
		margin-bottom: 3.125rem;
	}

	.mb6_5 {
		margin-bottom: 3.25rem;
	}

	.mb6_7 {
		margin-bottom: 3.375rem;
	}

	.mb7 {
		margin-bottom: 3.5rem;
	}

	.mb7_2 {
		margin-bottom: 3.625rem;
	}

	.mb7_5 {
		margin-bottom: 3.75rem;
	}

	.mb7_7 {
		margin-bottom: 3.875rem;
	}

	.mb8 {
		margin-bottom: 4rem;
	}


	/* 7.4 - Margin Horizontal  */
	.mh0_2,
	.mh0_5,
	.mh0_7,
	.mh1,
	.mh1_2,
	.mh1_5,
	.mh1_7,
	.mh2,
	.mh2_2,
	.mh2_5,
	.mh2_7,
	.mh3,
	.mh3_2,
	.mh3_5,
	.mh3_7,
	.mh4,
	.mh4_2,
	.mh4_5,
	.mh4_7,
	.mh5,
	.mh5_2,
	.mh5_5,
	.mh5_7,
	.mh6,
	.mh6_2,
	.mh6_5,
	.mh6_7,
	.mh7 {
		margin-left: 0;
		margin-right: 0;
	}


	/* 7.5 - Margin Left  */

	.ml0,


	.ml0_1,


	.ml0_2,


	.ml0_3,


	.ml0_5,


	.ml0_7,


	.ml1,


	.ml1_2,


	.ml1_5,


	.ml1_7,


	.ml2,


	.ml2_2,


	.ml2_5,


	.ml2_7,


	.ml3,


	.ml3_2,


	.ml3_5,


	.ml3_7,


	.ml4,


	.ml4_2,


	.ml4_5,


	.ml4_7,


	.ml5,


	.ml5_2,


	.ml5_5,


	.ml5_7,


	.ml6,


	.ml6_2,


	.ml6_5,


	.ml6_7,


	.ml7,


	.ml7_2,


	.ml7_5,


	.ml7_7,


	.ml8 {
		margin-left: 0;
	}

	/* 7.6 - Margin Right  */

	.mr0,


	.mr0_1,


	.mr0_2,


	.mr0_3,


	.mr0_5,


	.mr0_7,


	.mr1,


	.mr1_2,


	.mr1_5,


	.mr1_7,


	.mr2,


	.mr2_2,


	.mr2_5,


	.mr2_7,


	.mr3,


	.mr3_2,


	.mr3_5,


	.mr3_7,


	.mr4,


	.mr4_2,


	.mr4_5,


	.mr4_7,


	.mr5,


	.mr5_2,


	.mr5_5,


	.mr5_7,


	.mr6,


	.mr6_2,


	.mr6_5,


	.mr6_7,


	.mr7,


	.mr7_2,


	.mr7_5,


	.mr7_7,


	.mr8 {
		margin-right: 0;
	}




	/* 7.8.1 - Margin Clear Large  */
	.mh_clear {
		margin-left: 0;
		margin-right: 0;
	}

	.mv_clear {
		margin-top: 0;
		margin-bottom: 0;
	}

	/* 7.8.2 - Margin Clear Small */
	.mh_res_clear {}

	.mv_res_clear {}

	/* 7.7 - 7.9 - Padding Small Screen Only  - TODO */
	/* 7.9.2 -  Margin Horizontal (Small Screen Only) TODO */
	/* 7.9.3 -  Margin Left (Small Screen Only) TODO */
	/* 7.9.4 -  Margin Right (Small Screen Only) TODO */

	/* 7.10 - Margin Dynamic Responsive - clamp() - TODO */

	/* 8 - Object Padding  */
	/* 8.1 - Padding Vertical  */

	.pv0_2 {
		padding-top: 0.125rem;
		padding-bottom: 0.125rem;
	}

	.pv0_5 {
		padding-top: 0.25rem;
		padding-bottom: 0.25rem;
	}

	.pv1 {
		padding-top: 0.5rem;
		padding-bottom: 0.5rem;
	}

	.pv1_5 {
		padding-top: .75rem;
		padding-bottom: .75rem;
	}

	.pv2 {
		padding-top: 1rem;
		padding-bottom: 1rem;
	}

	.pv2_5 {
		padding-top: 1.25rem;
		padding-bottom: 1.25rem;
	}

	.pv3 {
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
	}

	.pv3_5 {
		padding-top: 1.75rem;
		padding-bottom: 1.75rem;
	}

	.pv4 {
		padding-top: 2rem;
		padding-bottom: 2rem;
	}

	.pv4_5 {
		padding-top: 2.25rem;
		padding-bottom: 2.25rem;
	}

	.pv5 {
		padding-top: 2.5rem;
		padding-bottom: 2.5rem;
	}

	.pv5_5 {
		padding-top: 2.75rem;
		padding-bottom: 2.75rem;
	}

	.pv6 {
		padding-top: 3rem;
		padding-bottom: 3rem;
	}

	.pv6_5 {
		padding-top: 3.25rem;
		padding-bottom: 3.25rem;
	}

	.pv7 {
		padding-top: 3.5rem;
		padding-bottom: 3.5rem;
	}

	.pv7_5 {
		padding-top: 3.75rem;
		padding-bottom: 3.75rem;
	}

	.pv8 {
		padding-top: 4rem;
		padding-bottom: 4rem;
	}


	/* 8.2 - Padding Top  */

	.pt0_1 {
		padding-top: 0.075rem;
	}

	.pt0_2 {
		padding-top: 0.125rem;
	}

	.pt0_3 {
		padding-top: 0.175rem;
	}

	.pt0_5 {
		padding-top: 0.25rem;
	}

	.pt0_7 {
		padding-top: 0.375rem;
	}

	.pt1 {
		padding-top: 0.5rem;
	}

	.pt1_2 {
		padding-top: 0.625rem;
	}

	.pt1_5 {
		padding-top: .75rem;
	}

	.pt1_7 {
		padding-top: 0.875rem;
	}

	.pt2 {
		padding-top: 1rem;
	}

	.pt2_2 {
		padding-top: 1.125rem;
	}

	.pt2_5 {
		padding-top: 1.25rem;
	}

	.pt2_7 {
		padding-top: 1.375rem;
	}

	.pt3 {
		padding-top: 1.5rem;
	}

	.pt3_2 {
		padding-top: 1.625rem;
	}

	.pt3_5 {
		padding-top: 1.75rem;
	}

	.pt3_7 {
		padding-top: 1.875rem;
	}

	.pt4 {
		padding-top: 2rem;
	}

	.pt4_2 {
		padding-top: 2.125rem;
	}

	.pt4_5 {
		padding-top: 2.25rem;
	}

	.pt4_7 {
		padding-top: 2.375rem;
	}

	.pt5 {
		padding-top: 2.5rem;
	}

	.pt5_2 {
		padding-top: 2.625rem;
	}

	.pt5_5 {
		padding-top: 2.75rem;
	}

	.pt5_7 {
		padding-top: 2.875rem;
	}

	.pt6 {
		padding-top: 3rem;
	}

	.pt6_2 {
		padding-top: 3.125rem;
	}

	.pt6_5 {
		padding-top: 3.25rem;
	}

	.pt6_7 {
		padding-top: 3.375rem;
	}

	.pt7 {
		padding-top: 3.5rem;
	}

	.pt7_2 {
		padding-top: 3.625rem;
	}

	.pt7_5 {
		padding-top: 3.75rem;
	}

	.pt7_7 {
		padding-top: 3.875rem;
	}

	.pt8 {
		padding-top: 4rem;
	}


	/* 8.3 - Padding Bottom  */

	.pb0_1 {
		padding-bottom: 0.075rem;
	}

	.pb0_2 {
		padding-bottom: 0.125rem;
	}

	.pb0_3 {
		padding-bottom: 0.175rem;
	}

	.pb0_5 {
		padding-bottom: 0.25rem;
	}

	.pb0_7 {
		padding-bottom: 0.375rem;
	}

	.pb1 {
		padding-bottom: 0.5rem;
	}

	.pb1_2 {
		padding-bottom: 0.625rem;
	}

	.pb1_5 {
		padding-bottom: .75rem;
	}

	.pb1_7 {
		padding-bottom: 0.875rem;
	}

	.pb2 {
		padding-bottom: 1rem;
	}

	.pb2_2 {
		padding-bottom: 1.125rem;
	}

	.pb2_5 {
		padding-bottom: 1.25rem;
	}

	.pb2_7 {
		padding-bottom: 1.375rem;
	}

	.pb3 {
		padding-bottom: 1.5rem;
	}

	.pb3_2 {
		padding-bottom: 1.625rem;
	}

	.pb3_5 {
		padding-bottom: 1.75rem;
	}

	.pb3_7 {
		padding-bottom: 1.875rem;
	}

	.pb4 {
		padding-bottom: 2rem;
	}

	.pb4_2 {
		padding-bottom: 2.125rem;
	}

	.pb4_5 {
		padding-bottom: 2.25rem;
	}

	.pb4_7 {
		padding-bottom: 2.375rem;
	}

	.pb5 {
		padding-bottom: 2.5rem;
	}

	.pb5_2 {
		padding-bottom: 2.625rem;
	}

	.pb5_5 {
		padding-bottom: 2.75rem;
	}

	.pb5_7 {
		padding-bottom: 2.875rem;
	}

	.pb6 {
		padding-bottom: 3rem;
	}

	.pb6_2 {
		padding-bottom: 3.125rem;
	}

	.pb6_5 {
		padding-bottom: 3.25rem;
	}

	.pb6_7 {
		padding-bottom: 3.375rem;
	}

	.pb7 {
		padding-bottom: 3.5rem;
	}

	.pb7_2 {
		padding-bottom: 3.625rem;
	}

	.pb7_5 {
		padding-bottom: 3.75rem;
	}

	.pb7_7 {
		padding-bottom: 3.875rem;
	}

	.pb8 {
		padding-bottom: 4rem;
	}

	/* 8.4 - Padding Horizontal  */
	.ph0_2,
	.ph0_5,
	.ph0_7,
	.ph1,
	.ph1_2,
	.ph1_5,
	.ph1_7,
	.ph2,
	.ph2_2,
	.ph2_5,
	.ph2_7,
	.ph3,
	.ph3_2,
	.ph3_5,
	.ph3_7,
	.ph4,
	.ph4_2,
	.ph4_5,
	.ph4_7,
	.ph5,
	.ph5_2,
	.ph5_5,
	.ph5_7,
	.ph6,
	.ph6_2,
	.ph6_5,
	.ph6_7,
	.ph7 {
		padding-left: 0;
		padding-right: 0;
	}


	/* 8.5 - Padding Left  */

	.pl0,


	.pl0_1,


	.pl0_2,


	.pl0_3,


	.pl0_5,


	.pl0_7,


	.pl1,


	.pl1_2,


	.pl1_5,


	.pl1_7,


	.pl2,


	.pl2_2,


	.pl2_5,


	.pl2_7,


	.pl3,


	.pl3_2,


	.pl3_5,


	.pl3_7,


	.pl4,


	.pl4_2,


	.pl4_5,


	.pl4_7,


	.pl5,


	.pl5_2,


	.pl5_5,


	.pl5_7,


	.pl6,


	.pl6_2,


	.pl6_5,


	.pl6_7,


	.pl7,


	.pl7_2,


	.pl7_5,


	.pl7_7,


	.pl8 {
		padding-left: 0;
	}

	/* 8.6 - Padding Right  */

	.pr0,
	.pr0_1,

	.pr0_2,

	.pr0_3,

	.pr0_5,

	.pr0_7,

	.pr1,

	.pr1_2,

	.pr1_5,

	.pr1_7,

	.pr2,

	.pr2_2,

	.pr2_5,

	.pr2_7,

	.pr3,

	.pr3_2,

	.pr3_5,

	.pr3_7,

	.pr4,

	.pr4_2,

	.pr4_5,

	.pr4_7,

	.pr5,

	.pr5_2,

	.pr5_5,

	.pr5_7,

	.pr6,
	.pr6_2,
	.pr6_5,
	.pr6_7,
	.pr7,
	.pr7_2,
	.pr7_5,
	.pr7_7,
	.pr8 {
		padding-right: 0;
	}



	/* 8.8 - Padding Responsive  */
	/* 8.8.1 - Padding Clear Large Screen */
	.ph_clear {
		padding-left: 0;
		padding-right: 0;
	}

	.pv_clear {
		padding-top: 0;
		padding-bottom: 0;
	}

	/* 8.8.2 - Padding Clear Small Screen  */
	.ph_res_clear {}

	.pv_res_clear {}

	/* 8.9 - Padding Small Screen Only - TODO  */
	/* 8.9.1 - Padding Horizontal (Small Screen Only) TODO */
	/* 8.9.2 - Padding Left (Small Screen Only) TODO */
	/* 8.9.3 - Padding Right (Small Screen Only) TODO */





	/* 9 - Object Styling  */

	/* 9.1 - Object Width */
	/* 9.1.1 - Object Width Respnisive Clear */
	.width_clear {
		width: 100%;
	}

	/* 9.1.2 - Object Width Percentage  */

	/* 9.1.3 - Object Width Relative - clamp() TODO */

	/* 9.2 - Object Height */
	/* 9.2.1 - Object Height Respnisive Clear */
	.height_clear {
		height: 100%;
	}

	/* 9.2.1 - Object Height Percentage  */

	/* 9.2.2 - Object Height Relative - TODO */

	/* /////////////////////// !!! ///////////////////////   */

	/* 9 - Button & Links */


	/* 10.1 - Buttons */

	/* 10.1.1 - Button Layout */

	/* 10.1.2 - Button Width */
	.but-75,
	.but-60,
	.but-55,
	.but-50,
	.but-45,
	.but-40,
	.but-35,
	.but-30,
	.but-25 {
		a {
			width: 100%;
		}
	}

	/* 10.2 - Links */



	/* 11 - Components  */

	/* 11.1 - Banners */
	.banner {
		/* position: relative; */
	}

	/* 11.1.1 - Banner Height */
	.banner-height50 {
		height: 65vh;
	}
	.banner-height55 {
		height: 70vh;
	}
	.banner-height60 {
		height: 75vh;
	}
	.banner-height65 {
		height: 80vh;
	}
	.banner-height70 {
		height: 80vh;
	}
	.banner-height75 {
		height: 85vh;
	}
	.banner-height80 {
		height: 90vh;
	}
	.banner-height85 {
		height: 95vh;
	}
	/* 11.2 - Tables */
	.tab {
		table {

			td,
			th {
				padding: 0.5rem;
			}
		}
	}

	.tab-list {
		table {
			width: 105%;
			table-layout: fixed;
			margin-left: -30px;

			td,
			th {
				padding: 0.5rem;
			}
		}
	}


	/* 11.2.1 - Responisve Table Settings */
	.tab-ds_mh {
		display: none;
	}

	.tab-ms_dh {
		display: block;

		table {
			margin: 2rem 0;
		}
	}

	/* 11.2.2 - General Table Width & Height */
	.tab_width-20,

	.tab_width-30,

	.tab_width-40,

	.tab_width-50,

	.tab_width-60,

	.tab_width-70,

	.tab_width-80 {
		width: 100%;
	}

	/* 11.3 - Lists */
	.list {

		ul,
		ol {
			/* margin-left: 0;
			padding-left: 0; */
		}
	}

	.list_inner_list {

		ul,
		ol {
			margin-left: 1rem;
			padding-left: 1rem;
		}
	}

	/* 11.3.1 - List Marker Style */
	/* 11.3.2 - List Posistioning */
	.list-left_align {

		ul,
		ol {
			padding-left: 1rem;
		}
	}

	/* 11.3.3 - List Item Styling */

	/* 11.4.1 - Image Posistion */
	.img_left,
	.img_right,
	.img_cent {
		text-align: center;
	}

	/* 11.4.2 - Image Width - !Responsive ! */

	/* 11.4.3 - Responsive Image Height - !Responsive ! */
	.img_res--30 {
		max-height: 30vh;
		object-fit: cover;
	}

	/* 11.5 - Videos */
	/* 11.5.1 - Embed */
	/* 11.5.2 - iFrame */
	.vid-iframe {}

	.vid-frame_portrait {
		width: 100%;
		padding-top: 100%;

		iframe {}
	}
}

/* @container (max-width: 599px) { */
@media only screen and (max-width: 599px) {


	/* 10.4.1 - Image Posistion */

	/* 10.4.2 - Image Width - !Responsive ! */
	.img_w80,
	.img_w75,
	.img_w70,
	.img_w60,
	.img_w50,
	.img_w40,
	.img_w30,
	.img_w25 {
		img {
			width: 100%;
		}
	}
}

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


	/* 10 - Components  */

	/* 10.1 - Banners */
	/* 10.1.1 - Banner Height */
	/* .banner-height50 {
		height: 20vh;
	}

	.banner-height60 {
		height: 30vh;
	}

	.banner-height70 {
		height: 35vh;
	}

	.banner-height80 {
		height: 40vh;
	} */

	/* 10.1.2 - Page/Content Wide Image Banner */

	/* 10.1.3 - Full Width Image Banner */

	/* 10.1.4 - Full Width Video Banner */
	.banner_vid {
		.banner_vid-content_center {
			/* position: absolute;
            top: 50%; */
			left: 0;
			transform: translate(0%, -50%);
			padding-left: 1rem;
			padding-right: 1rem;
		}

		.banner_vid-content_left {
			/* position: absolute;
            left: 5%;
            top: 50%;
            transform: translate(0, -50%); */
			padding-left: 0;
		}
	}
}