// Responsive Padding Top
.pt-120 {
	--_pt: 60px;
	@media (min-width: 992px) {
		--_pt: 120px;
	}
	padding-top: var(--_pt);
}
.pt-100 {
	--_pt: 50px;
	@media (min-width: 992px) {
		--_pt: 100px;
	}
	padding-top: var(--_pt);
}
.pt-80 {
	--_pt: 40px;
	@media (min-width: 992px) {
		--_pt: 80px;
	}
	padding-top: var(--_pt);
}
.pt-60 {
	--_pt: 32px;
	@media (min-width: 992px) {
		--_pt: 60px;
	}
	padding-top: var(--_pt);
}
.pt-40 {
	--_pt: 20px;
	@media (min-width: 992px) {
		--_pt: 40px;
	}
	padding-top: var(--_pt);
}
.pt-32 {
	--_pt: 16px;
	@media (min-width: 992px) {
		--_pt: 32px;
	}
	padding-top: var(--_pt);
}

// Responsive Padding Bottom
.pb-120 {
	--_pb: 60px;
	@media (min-width: 992px) {
		--_pb: 120px;
	}
	padding-bottom: var(--_pb);
}
.pb-100 {
	--_pb: 50px;
	@media (min-width: 992px) {
		--_pb: 100px;
	}
	padding-bottom: var(--_pb);
}
.pb-80 {
	--_pb: 40px;
	@media (min-width: 992px) {
		--_pb: 80px;
	}
	padding-bottom: var(--_pb);
}
.pb-60 {
	--_pb: 32px;
	@media (min-width: 992px) {
		--_pb: 60px;
	}
	padding-bottom: var(--_pb);
}
.pb-40 {
	--_pb: 20px;
	@media (min-width: 992px) {
		--_pb: 40px;
	}
	padding-bottom: var(--_pb);
}
.pb-32 {
	--_pb: 16px;
	@media (min-width: 992px) {
		--_pb: 32px;
	}
	padding-bottom: var(--_pb);
}

// Size
@each $size, $value in $spacers {
	// Width
	.w-#{$size} {
		width: $value;
	}

	// Height
	.h-#{$size} {
		height: $value;
	}
	@each $screen, $screenSize in $grid-breakpoints {
		.w-#{$screen}-#{$size} {
			@media (min-width: $screenSize) {
				width: $value;
			}
		}
	}
	@each $screen, $screenSize in $grid-breakpoints {
		.h-#{$screen}-#{$size} {
			@media (min-width: $screenSize) {
				height: $value;
			}
		}
	}
}

.w-max-con {
	width: max-content;
}

// Opacity
.bg-opacity-5 {
	--bs-bg-opacity: 0.05;
}
.bg-opacity-10 {
	--bs-bg-opacity: 0.1;
}

//Transition
.transition {
	transition: $transition-base;
}

// hover
.hover\:text-primary:hover {
	color: $primary !important;
}
.hover\:text-white:hover {
	color: $white !important;
}
.hover\:text-dark:hover {
	color: $dark !important;
}

.hover\:bg-primary:hover {
	background-color: $primary !important;
}
.hover\:bg-success:hover {
	background-color: $success !important;
}
.hover\:bg-dark:hover {
	background-color: $dark !important;
}

.hover\:border-primary:hover {
	border-color: $primary !important;
}
.hover\:border-success:hover {
	border-color: $success !important;
}

.hover\:border-dark:hover {
	border-color: $dark !important;
}

// Color
.text-heading {
	color: $headings-color;
}
.fw-900 {
	font-weight: 900;
}

// Background
.bg-gray-900 {
	background-color: $gray-900;
}
.bg-gradient-1 {
	background-image: linear-gradient(253deg, #0a00e9 5.74%, #00165b 102.24%);
}

// Shadow
.hover-shadow {
	&:hover {
		box-shadow: $box-shadow;
	}
}

.form-control {
	&:focus {
		outline: none;
		box-shadow: none;
		border-color: $border-color;
	}
}
.form-select {
	&:focus {
		outline: none;
		box-shadow: none;
		border-color: $border-color;
	}
}
.position-unset {
	position: unset;
}
// Inititally Hide Yearly Price
.yearly-price {
	display: none;
}
.yearly-price-x {
	display: none;
}

.place-content-center {
	place-content: center;
}

// Dodge Effect
.blend-mode-dodge {
	mix-blend-mode: color-dodge;
}

// SSL Provider
.ssl-provider-area {
	margin-top: -175px;
	@media (max-width: 1399px) {
		margin-top: -145px;
	}
	@media (max-width: 1199px) {
		margin-top: -80px;
	}
}

// Premium  Network
.data-boosting {
	&::after {
		position: absolute;
		content: "";
		inset: 0;
		background-image: url(../img/shape/data-boost-bg.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		z-index: -1;
	}
}

.game-cta-wrapper {
	background-image: url(../img/shape/game-cta-bg.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.game-faq {
	.accordion-item {
		background-color: rgba($white, 0.05);
		border: 0 !important;
	}
}

// Home 8
.hsot-img-style-8 {
    margin-bottom: -80px;
	@media(max-width: 1199px) {
		margin-bottom: 0;
	}
}

.price-8 {
	padding-top: 170px;	
	@media(max-width: 1399px) {
		padding-top: 100px;
	}
	@media(max-width: 767px) {
		padding-top: 60px;
	}
}

.tab-nav-8 {
	.nav-link.active {
		background: linear-gradient(262.24deg, #7154C6 9.78%, #301C70 91.63%);
		color: $white !important;
	}
}

.price-card-8 {
	&:hover {
		background: linear-gradient(262.24deg, #7154C6 9.78%, #301C70 91.63%);
		color: $white !important;
		h3, h6, .text-black {
			color: $white !important;
		}
		.btn {
			background: $warning;
		}
	}
}

// Home 9
.tab-nav-9 {
	.nav-link.active {
		background: $dark;
		color: $white !important;
	}
}

.support-22 {
	a {
		text-decoration: none;
		&:hover {
			color: $warning !important;
		}
	}
}

.border-xl-0 {
	@media(min-width: 1200px) {
		border: 0 !important;
	}
}

// Home 10
.feedback-2-container {
	&.style_2 {
		.swiper-pagination-bullet-active {
			background-color: $green-light;
		}
	}
}

// Home 11
.dark-style-btn {
	border: 1.5px solid rgb(255 255 255 / 13%);
	background: rgba(40, 40, 40, 0.10);
	box-shadow: 2px 4px 16px 0px rgba(248, 248, 248, 0.06) inset;
	backdrop-filter: blur(50px);
}

.brand_slide_logo_wrapper {
	max-width: 300px;
	top: 50%;
	left: 50%;
	transform: translate(-50% , -50%);
}

.brand_slide_logo_svg {
	svg {
		@media(max-width: 991px) {
			height: 270px;
		}
	}
}

.overlay-wrapper {
	&::after {
		position: absolute;
		content: "";
		inset: 0;
		background: linear-gradient(270deg, #0A0714 0.93%, #0A0714 7.52%, rgba(5, 2, 16, 0.00) 47.93%, #050210 95.79%, #050210 99.92%);
		pointer-events: none;
	}
}

.overlay-wrapper-2 {
	&::after {
		position: absolute;
		content: "";
		inset: 0;
		background: linear-gradient(1deg, #0A0714 0.93%, #0A0714 7.52%, rgba(5, 2, 16, 0) 47.93%, #050210 95.79%, #050210 99.92%);
		pointer-events: none;
	}
}

.animation-gradient {
    position: relative;
    padding: 1px;
    background-color: #343a40;
}

.animation-gradient::after {
    position: absolute;
    content: "";
    width: 138%;
    height: 80px;
    background: linear-gradient(165.36deg, #6B41FF 79.37%, #F64CFF 85.2%, rgba(255, 197, 83, 0.8) 92.8%, #030313 100.2%);
    left: -220px;
    top: 200px;
    animation: borderRotate 5s linear infinite;
}

@keyframes borderRotate {
	100% {
		-webkit-transform: rotate(1turn);
		transform: rotate(1turn);
	}
}

.text-11 {
	color: $color-11;
}

.bg-11 {
	background: rgba(148, 41, 228, 0.12);
}

.bg-dark-11 {
	background: $dark-11 !important;
}

.bg-light-13 {
	background-color: $light-13;
}

.bg-warning-13 {
	background-color: $warning-13;
}

.text-warning-13 {
	color: $warning-13;
}

.bg-blue-13 {
	background-color: $blue-13;
}

.section_group {
	background: $gd-14-sec;
}

.style_15 {
	.social-icon {
		&:hover {
			background-color: $warning;
		}
	}
}

.btn_arrow {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.navbar-overlay.style_16 {
	top: 30px;	
	@media(max-width: 991px) {
		top: 0;
	}
}

.navbar-sticky-init {
	.navbar-overlay.style_16 {
		top: 0;	
	}
}