/*FONT SIZE*/
.text-xxxs {font-size: 0.875rem} /*14px*/
.text-xxs {font-size: 1rem} /*16px*/
.text-xs {font-size: 1.25rem;} /*20px*/
.text-md {font-size: 1.5rem;} /*24px*/
.text-lg {font-size: 2rem;} /*32px*/
.text-xl {font-size: 2.5rem;} /*40px*/
.text-xxl {font-size: 4rem;} /*64px*/

/*HEADLINE SIZE*/
.headline-2 {font-size:  4rem} /*64px*/
.headline-3 {font-size:  2.5rem} /*40px*/
.headline-4 {font-size:  1.5rem} /*24px*/
.headline-5 {font-size:  1.25rem} /*20px*/

/*FONT WEIGHT*/
.text-100 {font-weight: 100}
.text-200 {font-weight: 200}
.text-300 {font-weight: 300}
.text-400 {font-weight: 400}
.text-500 {font-weight: 500}
.text-600 {font-weight: 600}
.text-700 {font-weight: 700}
.text-800 {font-weight: 800}
.text-900 {font-weight: 900}

/*LINE HEIHGHT*/
.lh-md { line-height: 1.4}

/*TEXT COLOR*/
.text-primary {color: #FF7109!important;}
.text-gray {color: #8c8c8c!important;}
.text-dark {color: #26262D!important;}
.text-black-pearl {color: #1B1D1E!important;}

/*BACKGROUND COLOR*/
.bg-primary {background-color: #FF7109!important;}
.bg-dark {background-color: #26262D!important;}
.bg-black-pearl {background-color: #1B1D1E!important;}

/*BORDER*/

/*color*/
.border-primary {border-color: #FF7109!important;}
.border-light-gray {border-color: #8C8C8C!important;}

/*size*/
.border-7 {border-width: 7px;}

/*radius*/
.rounded-3 {border-radius: 10px!important;}
.rounded-5 {border-radius: 20px!important;}

/*opacity*/
.border-opacity-30 {
	--bs-border-opacity: 0.3;
}
.border-light-gray-opacity-20 {
	border: 1px solid rgba(140, 140, 140, 0.2);
}


/*SIZING - PADDING*/
.pe-1_25 {padding-right: 1.25rem;}

.p-4_5 {padding: 2rem;}

/*SIZING - MARGIN*/
.my-4_5 {margin: 2rem 0;}

/*BUTTON*/
.btn {	
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1;
	text-align: left;
	display: flex;
	border-radius: 3px;
	padding: 1.325rem 1.5rem;
	text-transform: uppercase;
}

/*button size*/
.btn-xs {	
	padding: 0.765rem 1.5rem;
}
.btn-sm {	
	padding: 1rem 1.5rem;
}
.btn-lg {	
	/*padding: 1.325rem 1.5rem; /*70px -noraml*/*/
}
.btn-xl {	
	padding: 1.638rem 1.5rem!important; /*80px*/
}
.btn-text-sm {	
	font-size: 1rem;
}

.btn:focus,
.btn:active {
	box-shadow: none!important;
	outline: none!important;	
	border: 1px solid transparent;
}
.btn-text {
	margin-right: auto;
	align-self: center;
}

/*button type*/
.btn-primary {
	color: #ffffff;
	background-color: #FF7109!important;
	border-color: #FF7109!important;
	box-shadow: 0px 8px 24px rgba(255, 113, 9, 0.15);
}
.btn-gray {
	color: #ffffff;
	background-color: linear-gradient(0deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 59%), #8C8C8C!important;
	border: 1px solid rgba(255, 255, 255, 0.5);
}
.btn-black {
	color: #ffffff;
	background-color: #000000!important;
	border-color: #000000!important;
}
.btn-outline-primary  {
	color: #ffffff;
	background-color: transparent;
	border: 2px solid #FF7109!important;
}
.btn-link-primary  {
	color: #FF7109;
	text-underline-offset: 3px;
	background-color: transparent;
	border-color: transparent;
	padding: 0;
}
.btn-link-primary .btn-text {
	text-decoration: underline;
}
.btn-center {
	text-align: center;
	display: inline-block;
}
.btn:after {
	content: "\2023";
	font-size: 1.6rem;
}
.btn-center:after {
	display: none;
}

/*BUTTON HOVER*/
.btn-primary:hover {
	background-color: #FF3509!important;
	border-color: #FF3509!important;
}
.btn-outline-primary:hover  {
	color: #ffffff;
	background-color: #FF7109;
	border: 2px solid #FF7109!important;
}
.btn-link-primary:hover  {
	color: #FF3509;
	background-color: transparent;
	border-color: transparent;
}
.btn-black:hover {
	color: #ffffff;
	background-color: #171718!important;
	border-color: #171718!important;
}

/*INPUT STYLE*/
.form-control {	
	color: #ffffff!important;
	font-family: 'Bebas Neue', cursive;
	font-size: 1.5rem!important;
	background-color: rgba(0, 0, 0, 0.3)!important;
	border: 1px solid #8C8C8C!important;
	padding: 0.625rem 1.25rem;	
}
.form-control.form-select {
	background-color: #1B1D1E!important;
}
.form-control::placeholder {
 	color: #ffffff!important;
}
.form-control:focus {	
	box-shadow: none;
	outline: none;
	background-color: transparent;
	border-color: #FF7109;	
}
.form-control:focus::placeholder {	
	color: #8C8C8C!important;
}
.form-control-lg {
	padding: 1rem 1.25rem;
}
.form-control-sm {
	padding: 0.313rem 1.25rem;
}
.form-control-xs {
	padding: 0rem 1.25rem;
}
/*Z-INDEX*/

.z-index_-3 {z-index: -3;}
.z-index_0 {z-index: 0;}
.z-index_3 {z-index: 3;}