@use '../utils' as *;

/*---------------------------------
    1.2 Common Classes
---------------------------------*/
.w-img {
	& img {
		width: 100%;
	}
}

.m-img {
	& img {
		max-width: 100%;
	}
}

.fix {
	overflow: hidden
}

.clear {
	clear: both;
}

.z-index-1 {
	z-index: 1;
}

.z-index-2 {
	z-index: 2;
}

.z-index-3 {
	z-index: 3;
}

.z-index-4 {
	z-index: 4;
}

.z-index-5 {
	z-index: 5;
}

.z-index-6 {
	z-index: 6;
}

.z-index-7 {
	z-index: 7;
}

.z-index-8 {
	z-index: 8;
}

.z-index-9 {
	z-index: 9;
}

.z-index-10 {
	z-index: 10;
}

.gx-10 {
	--bs-gutter-x: 10px;
}

.gx-20 {
	--bs-gutter-x: 20px;
}

.gx-30 {
	--bs-gutter-x: 30px;
}

.gx-40 {
	--bs-gutter-x: 40px;
}

.gx-45 {
	--bs-gutter-x: 45px;
}

.gx-50 {
	--bs-gutter-x: 50px;
}

.gx-60 {
	--bs-gutter-x: 60px;
}

.gx-70 {
	--bs-gutter-x: 70px;
}

.gx-80 {
	--bs-gutter-x: 80px;
}

.gx-90 {
	--bs-gutter-x: 90px;
}

.gx-100 {
	--bs-gutter-x: 100px;
}

.overflow-y-visible {
	overflow-x: hidden;
	overflow-y: visible;
}

.p-relative {
	position: relative;
}

.p-absolute {
	position: absolute;
}

.include-bg {
	@include tp-background();
}

/* dropcap */
.tp-dropcap {
	&::first-letter {
		float: left;
		width: 65px;
		height: 85px;
		font-size: 90px;
		line-height: .8;
		font-weight: 500;
		margin-right: 5px;
		text-align: center;
		line-height: inherit;
		text-transform: capitalize;
		color: var(--tp-common-white);
		font-family: var(--tp-ff-body);
	}
}

.tp-plr-rs {
	@media #{$md,$sm,$xs} {
		padding-top: 80px;
		padding-bottom: 80px;
	}
}