/*
	Padding & Margin Style
	<<<<======================================================>>>>*/ 
	.p-20 {
		padding: 20px;
	}
	.p-25 {
		padding: 25px;
	}
	.p-30 {
		padding: 30px;
	}
	.p-40 {
		padding: 40px;
	}
	.pb-10 {
		padding-bottom: 10px;
	}
	.pb-15 {
		padding-bottom: 15px;
	}
	.pb-20 {
		padding-bottom: 20px;
	}
	.pb-24 {
		padding-bottom: 24px;
	}
	.pt-25 {
		padding-top: 25px;
	}
	.pb-25 {
		padding-bottom: 25px;
	}
	.pb-30 {
		padding-bottom: 30px;
	}
	.pb-35 {
		padding-bottom: 35px;
	}
	.pb-40 {
		padding-bottom: 40px;
	}
	.pb-45 {
		padding-bottom: 45px;
	}
	.pb-50 {
		padding-bottom: 50px;
	}
	.mt-10 {
		margin-top: 10px;
	}
	.mb-10 {
		margin-bottom: 10px;
	}
	.mb-15 {
		margin-bottom: 15px;
	}
	.mb-20 {
		margin-bottom: 20px;
	}
	.mb-24 {
		margin-bottom: 24px;
	}
	.mt-25 {
		margin-top: 25px;
	}
	.mb-25 {
		margin-bottom: 25px;
	}
	.mb-30 {
		margin-bottom: 30px;
	}
	.mb-35 {
		margin-bottom: 35px;
	}
	.mb-40 {
		margin-bottom: 40px;
	}
	.mb-45 {
		margin-bottom: 45px;
	}
	.mb-50 {
		margin-bottom: 50px;
	}
	.ms-minus-20 {
		margin-left: -20px;
	}

	/*
	Font Size Style
	<<<<======================================================>>>>*/ 
	.fs-12 {
		font-size: var(--fontSize12);
	}
	.fs-13 {
		font-size: var(--fontSize13);
	}
	.fs-14 {
		font-size: var(--fontSize14);
	}
	.fs-15 {
		font-size: var(--fontSize15);
	}
	.fs-16 {
		font-size: var(--fontSize16);
	}
	.fs-17 {
		font-size: var(--fontSize17);
	}
	.fs-18 {
		font-size: var(--fontSize18);
	}
	.fs-19 {
		font-size: var(--fontSize19);
	}
	.fs-20 {
		font-size: var(--fontSize20);
	}
	.fs-21 {
		font-size: var(--fontSize21);
	}
	.fs-22 {
		font-size: var(--fontSize22);
	}
	.fs-23 {
		font-size: var(--fontSize23);
	}
	.fs-24 {
		font-size: var(--fontSize24);
	}
	.fs-25 {
		font-size: var(--fontSize25);
	}
	.fs-26 {
		font-size: var(--fontSize26);
	}
	.fs-27 {
		font-size: var(--fontSize27);
	}
	.fs-28 {
		font-size: var(--fontSize28);
	}
	.fs-29 {
		font-size: var(--fontSize29);
	}
	.fs-30 {
		font-size: var(--fontSize30);
	}

	/*
	Width Style
	<<<<======================================================>>>>*/
	.wh-100 {
		width: 100px;
		height: 100px;
	}
	.wh-80 {
		width: 80px;
		height: 80px;
	}
	.wh-60 {
		width: 60px;
		height: 60px;
	}
	.wh-40 {
		width: 40px;
		height: 40px;
	}
	.wh-50 {
		width: 50px;
		height: 50px;
	}
	.wh-32 {
		width: 32px;
		height: 32px;
	}
	.wh-24 { 
		width: 24px;
		height: 24px;
	}
	.cw-65 {
		width: 65px;
	}
	.cw-313 {
		max-width: 313px;
	}
	.mw-560 {
		max-width: 560px;
	}

	/*
	Height Style
	<<<<======================================================>>>>*/
	.h-255 {
		max-height: 255px;
	}
	.h-300 {
		max-height: 300px;
	}
	.h-357 {
		max-height: 357px;
	}
	.h-365 {
		max-height: 365px;
	}
	.h-400 {
		max-height: 400px;
	}
	.h-428 {
		max-height: 428px;
	}
	.h-458 {
		max-height: 458px;
	}
	.h-459 {
		max-height: 459px;
	}
	.h-452 {
		max-height: 452px;
	}
	.h-500 {
		max-height: 500px;
	}
	.h-516 {
		max-height: 516px;
	}
	.h-540 {
		max-height: 540px;
	}
	.h-512 {
		max-height: 512px;
	}
	.h-549 {
		max-height: 549px;
	}
	.h-550 {
		max-height: 550px;
	}
	.h-571 {
		max-height: 571px;
	}
	.h-583 {
		max-height: 583px;
	}
	.h-590 {
		max-height: 590px;
	}
	.h-594 {
		max-height: 594px;
	}
	.h-600 {
		max-height: 600px;
	}
	.h-602 {
		max-height: 602px;
	}
	.h-624 {
		max-height: 624px;
	}
	.h-634 {
		max-height: 634px;
	}
	.h-700 {
		max-height: 700px;
	}
	.h-713 {
		max-height: 713px;
	}
	.h-738 {
		max-height: 738px;
	}
	.h-1043 {
		max-height: 1043px;
	}
	.ch-200 {
		height: 200px;
	}

	/*
Custom Scroll Bar Style
<<<<======================================================>>>>*/
.scroll-bar {
    margin-top: 0 !important;
    overflow: auto;
    /* width */
    &::-webkit-scrollbar {
        width: 6px;
		height: 6px;
        transition: var(--transition);
		border-radius: 50px;
    }
	/* Track */
    &::-webkit-scrollbar-track {
        background: #F0F0F4;
		transition: var(--transition);
		border-radius: 50px;
    }
	/* Handle */
    &::-webkit-scrollbar-thumb {
        background: #e0e0e2;
		transition: var(--transition);
		border-radius: 50px;
    }
	/* Handle on hover */
    &::-webkit-scrollbar-thumb:hover {  
        background: var(--mainColor);
		border-radius: 50px;
    }
	&.active {
		&::-webkit-scrollbar-thumb {
			background: var(--mainColor);
		}
	}
}

	/*
Font Width Style
<<<<======================================================>>>>*/
.fw-normal {
	font-weight: 400 !important;
}
.fw-medium {
	font-weight: 500 !important;
}
.fw-semibold {
	font-weight: 600 !important;
}
.fw-bold {
	font-weight: 700 !important;
}

/*
Border Radius Style
<<<<======================================================>>>>*/ 
.rounded-3 {
	border-radius: var(--borderRadius) !important;
}

/*
Box Shadow Style
<<<<======================================================>>>>*/ 
.box-shadow {
	box-shadow: var(--boxShadow) !important;
}

	/*
Border Style
<<<<======================================================>>>>*/
.border-color {
	border-color: var(--borderColor09) !important;
}
.border-1 {
	border: 1px solid var(--borderColor09) !important;
} 
.border-primary {
	border-color: var(--mainColor) !important;
}
.border-secondary {
	border-color: var(--headingColor) !important;
}
.border-success {
	border-color: var(--successColor) !important;
}
.border-danger {
	border-color: var(--dangerColor) !important;
}
.border-warning {
	border-color: var(--warningColor) !important;
}
.border-info {
	border-color: var(--infoColor) !important;
}
.border-light {
	border-color: var(--whiteColor) !important;
}
.border-dark {
	border-color: var(--headingColor) !important;
}
.border-body {
	border-color: var(--bodyColor) !important;
}
.border-dark {
	border-color: var(--headingColor) !important;
}

	/*
Badge BG Opacity Style
<<<<======================================================>>>>*/
.bg-primary-transparent {
	background-color: var(--mainColor01);
}
.bg-secondary-transparent {
	background-color: var(--headingColor01);
}
.bg-dark-transparent {
	background-color: var(--blackColor01);
}
.bg-success-transparent {
	background-color: var(--successColor01);
}
.bg-danger-transparent {
	background-color: var(--dangerColor01);
}
.bg-warning-transparent {
	background-color: var(--warningColor01);
}
.bg-info-transparent {
	background-color: var(--infoColor01);
}
.bg-white1-transparent {
	background-color: var(--whiteColor1);
}

	/*
BG Color Style
<<<<======================================================>>>>*/ 
.bg-primary {
	background-color: var(--mainColor) !important;
}
.bg-success {
	background-color: var(--successColor) !important;
}
.bg-danger {
	background-color: var(--dangerColor) !important;
}
.bg-warning {
	background-color: var(--warningColor) !important;
}
.bg-info {
	background-color: var(--infoColor) !important;
}
.bg-white {
	background-color: var(--whiteColor) !important;
}
.bg-white1 {
	background-color: var(--whiteColor1) !important;
}

	/*
Text Color Style
<<<<======================================================>>>>*/ 
.text-primary {
	color: var(--mainColor) !important;
}
.text-success {
	color: var(--successColor) !important;
}
.text-danger {
	color: var(--dangerColor) !important;
}
.text-warning {
	color: var(--warningColor) !important;
}
.text-info {
	color: var(--infoColor) !important;
}
.text-body {
	color: var(--bodyColor) !important;
}
.text-dark {
	color: var(--headingColor) !important;
}