/***********************
POSITIONING
***********************/
.relative { position: relative; }
.absolute { position: absolute; }
.fixed    { position: fixed; }
.static   { position: static; }

/***********************
BACKGROUND/IMAGE SIZE & POSITION
***********************/
.bg-no-repeat { background-repeat: no-repeat; }
.bg-cover     { background-size: cover; }
.bg-contain   { background-size: contain; }
.bg-center    { background-position: center; }
.bg-top       { background-position: top; }
.bg-right     { background-position: right; }
.bg-bottom    { background-position: bottom; }
.bg-left      { background-position: left; }

.bg-fixed     { background-attachment: fixed; }
.bg-local     { background-attachment: local; }

.img-cover      { object-fit: cover; }
.img-contain    { object-fit: contain; }
.img-fill       { object-fit: fill; }
.img-scale-down { object-fit: scale-down; }

/***********************
DISPLAY
***********************/
.hidden       { display: none; }
.block        { display: block; }
.flex         { display: flex; }
.inline       { display: inline; }
.inline-block { display: inline-block; }
.inline-flex  { display: inline-flex; }

.overflow-hidden { overflow: hidden; }
.overflow-scroll { overflow: scroll; }
.overflow-auto   { overflow: auto; }
@media screen and (max-width:768px){
		.hide-on-small  {display: none !important; }
}
@media screen and (min-width:1024px) and (max-width:769px){
	.hide-on-medium {display: none !important; }
}
@media screen and (min-width:1025px){
	.hide-on-large  { display: none !important; }
}

/***********************
FLOAT
***********************/
.left {float:left!important; }
.right {float:right!important; }
.float-none {float:none!important; } 

/***********************
TEXT-WRAP
***********************/
.pre       { white-space: pre; }
.nowrap    { white-space: nowrap; }

/***********************
SCROLLING
***********************/
.scroll-horizontal {overflow-x: scroll;overflow-y: hidden; }
.scroll-vertical {overflow-x: hidden; overflow-y: scroll; }
.no-scrollbar::-webkit-scrollbar {width: 0px; height: 0px; background: transparent; }

/***********************
TEXTAREAS
***********************/
.resize-none       { resize: none; }
.resize-vertical   { resize: vertical; }
.resize-horizontal { resize: horizontal; }

/***********************
MISC
***********************/
.no-pointer-events {pointer-events: none; }
.disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }

/***********************
FONT
***********************/
.base-font-size {font-size:1rem; }
.base-line-height {line-height:1.6; }
h1 {font-size:2.25rem; }
h2 {font-size:1.75rem; }
h3 {font-size:1.5rem; }
h4 {font-size:1.25rem; }
h5 {font-size:1.125rem; }
h6 {font-size:1rem; }

/***********************
TEXT
***********************/
.text-align-left {text-align:left;}
.text-align-right {text-align:right;}
.text-align-center {text-align:center;}
.text-align-justify {text-align:justify;}

/***********************
COLOR / BG COLOUR
***********************/
/**COOL**/
	/*PALEBLUE*/
	.col-paleblue {color:#BDDCDC; }
	.bg-paleblue {background-color:#BDDCDC; }
	/*BLUE*/
	.col-blue {color:#82BFBF; }
	.bg-blue {background-color:#82BFBF; }
	/*SLATE*/
	.col-slate {color:#5F777E; }
	.bg-slate {background-color:#5F777E; }
	/*PALEGREEN*/
	.col-palegreen {color:#D0EDA7; }
	.bg-palegreen {background-color:#D0EDA7; }
	/*GREEN*/
	.col-green {color:#B4D388; }
	.bg-green {background-color:#B4D388; }
	/*DARKGREEN*/
	.col-darkgreen {color:#809161; }
	.bg-darkgreen {background-color:#809161; }
/**WARM**/
	/*PALEYELLOW*/
	.col-paleyellow {color:#F5F5AE; }
	.bg-paleyellow {background-color:#F5F5AE; }
	/*YELLOW*/
	.col-yellow {color:#EDE480; }
	.bg-yellow {background-color:#EDE480; }
	/*ORANGE*/
	.col-orange {color:#F49D62; }
	.bg-organge {background-color:#F49D62; }
	/*RED*/
	.col-red {color:#CF5340; }
	.bg-red {background-color:#CF5340; }
	/*DARKRED*/
	.col-darkred {color:#893121; }
	.bg-darkred {background-color:#893121; }
	/*MAROON*/
	.col-maroon {color:#55201B; }
	.bg-maroon {background-color:#55201B; }