/**
* Font
* ----------------------------------------------------------------------------
*/
.b-font { font-family: var(--g5-body-font) !important;}
.s-font {font-family: var(--g5-secondary-font) !important;}
/**
* Color
* ----------------------------------------------------------------------------
*/
.p-color {
	color: var(--g5-color-accent) !important;
}
.s-color {
	color: var(--g5-color-secondary) !important;
}
.color-white
{
	color: #FFF;
}
.color-dark{
	color: #000;
}

.bg-primary {
	background-color: var(--g5-color-accent) !important;
}
.bg-secondary {
	background-color: var(--g5-color-secondary) !important;
}
.text-color-medium {
	color: var(--g5-text-color-medium) !important;
}
.text-color-bold {
	color: var(--g5-text-color-bold) !important;
}
.text-color-light {
	color: var(--g5-header-text-color-light) !important;
}
.bordered {
	border: 1px solid var(--g5-border-color) !important;
}
.border-dark {
	border: 1px solid var(--g5-border-color-dark) !important;
}
.badge {
	background-color: var(--g5-color-secondary);
}


.padding-none {
	padding: 0 !important;
}

/**
* Padding Top
* ----------------------------------------------------------------------------
*/


@for $i from 0 through 20 {
	.pd-top-#{$i *5} {
		padding-top: #{$i *5}px !important;
	}
}


@media screen and (max-width: 991px) {
	@for $i from 0 through 20 {
		.sm-pd-top-#{$i *5} {
			padding-top: #{$i *5}px !important;
		}
	}
}

@media screen and (max-width: 767px) {
	@for $i from 0 through 20 {
		.xs-pd-top-#{$i *5} {
			padding-top: #{$i *5}px !important;
		}
	}
}


/**
* Padding Bottom
* ----------------------------------------------------------------------------
*/

@for $i from 0 through 20 {
	.pd-bottom-#{$i *5} {
		padding-bottom: #{$i *5}px !important;
	}
}

@media screen and (max-width: 991px) {
	@for $i from 0 through 20 {
		.sm-pd-bottom-#{$i *5} {
			padding-bottom: #{$i *5}px !important;
		}
	}
}

@media screen and (max-width: 767px) {
	@for $i from 0 through 20 {
		.xs-pd-bottom-#{$i *5} {
			padding-bottom: #{$i *5}px !important;
		}
	}
}


/**
* No Margin
* ----------------------------------------------------------------------------
*/
.no-margin{
	margin: 0 !important;
}

/**
* Margin Top
* ----------------------------------------------------------------------------
*/

@for $i from 0 through 20 {
	.mg-top-#{$i *5} {
		margin-top: #{$i *5}px !important;
	}
}

@media screen and (max-width: 991px) {
	@for $i from 0 through 20 {
		.sm-mg-top-#{$i *5} {
			margin-top: #{$i *5}px !important;
		}
	}
}

@media screen and (max-width: 767px) {
	@for $i from 0 through 20 {
		.xs-mg-top-#{$i *5} {
			margin-top: #{$i *5}px !important;
		}
	}
}

@media (min-width: 992px) {
	.widget-mg-top--30 {
		margin-top: -30px;
	}
}

/**
* Margin Bottom
* ----------------------------------------------------------------------------
*/

@for $i from 0 through 20 {
	.mg-bottom-#{$i *5} {
		margin-bottom: #{$i *5}px !important;
	}
}

@media screen and (max-width: 991px) {
	@for $i from 0 through 20 {
		.sm-mg-bottom-#{$i *5} {
			margin-bottom: #{$i *5}px !important;
		}
	}
}

@media screen and (max-width: 767px) {
	@for $i from 0 through 20 {
		.xs-mg-bottom-#{$i *5} {
			margin-bottom: #{$i *5}px !important;
		}
	}
}


/**
* Letter Spacing
* ----------------------------------------------------------------------------
*/
.spacing--02 {letter-spacing: -0.02em!important;}
.spacing--03 {letter-spacing: -0.03em!important;}
.spacing-50 {letter-spacing: 0.05em!important;}
.spacing-100 {letter-spacing: 0.1em!important;}
.spacing-200 {letter-spacing: 0.2em!important;}
.spacing-400 {letter-spacing: 0.4em!important;}

/**
* Font Weight
* ----------------------------------------------------------------------------
*/
.fw-light { font-weight: 300!important;}
.fw-medium { font-weight: 500!important;}
.fw-bold { font-weight: 600!important;}
.fw-semi-bold { font-weight: 700!important; }

/**
* Font Size
* ----------------------------------------------------------------------------
*/
.fs-11 { font-size: 11px!important; }
.fs-12 { font-size: 12px!important; }
.fs-13 { font-size: 13px!important; }
.fs-14 { font-size: 14px!important; }
.fs-16 { font-size: 16px!important; }
.fs-18 { font-size: 18px!important; }
.fs-20 { font-size: 20px!important; }
.fs-21 { font-size: 21px!important; }
.fs-24 { font-size: 24px!important; }
.fs-32 { font-size: 32px!important; }
.fs-36 { font-size: 36px!important; }
.fs-38 { font-size: 38px!important; }
.fs-46 { font-size: 46px!important; }

/**
* Font Style
* ----------------------------------------------------------------------------
*/
.text-italic {
	font-style: italic!important;
}

.uppercase {
	text-transform: uppercase!important;
}

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

/**
* Line Height
* ----------------------------------------------------------------------------
*/
.line-small { line-height: 1em!important; }
.line-normal { line-height: 1.5em!important; }
.line-medium { line-height: 1.6em!important; }
.line-large { line-height: 1.8em!important; }
.line-2x { line-height: 2em!important; }
.line-3x { line-height: 3em!important; }
.line-21 { line-height: 21px!important; }
.line-24 { line-height: 24px!important; }
.line-44 { line-height: 44px!important; }


/**
* TRANSITION
* ----------------------------------------------------------------------------
*/
.transition03 {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.transition05 {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}

/**
* OTHERS MIXIN
* ----------------------------------------------------------------------------
*/
.overflow-hidden {
	overflow: hidden!important;
}
//==============================================================================
// FUNCTION MIXIN
//==============================================================================
.fixed{
	position: fixed;
	@include backface-visibility(visible);
	@include transform(translate3d(0,0,0));
}