/* ----------------------------------------------------------------

	Canvas: Hosting

-----------------------------------------------------------------*/



:root {

	--cnvs-themecolor: #7D2BE3;

	--cnvs-themecolor-rgb: 68, 170, 172;



	--cnvs-body-font: 'roboto', sans-serif;

	--cnvs-primary-font: 'istok web', sans-serif;

}



#header:not(.dark) {

	--cnvs-primary-menu-tt: uppercase;

	--cnvs-primary-menu-font-size: 13px;

	--cnvs-primary-menu-font-weight: 600;

	--cnvs-primary-menu-hover-color: var(--cnvs-themecolor) !important;

	--cnvs-primary-menu-active-color: var(--cnvs-themecolor) !important;

}



/* Slider Section */

.slider-element {

	height: 600px;

	overflow: visible;

	background-color: var(--cnvs-themecolor);

}



.slider-title h2 {
    font-size: 3rem;
    letter-spacing: -1px;
    line-height: 1.25 !important;
    font-weight: 600;
    color: rgba(166,13,193,1);
    font-style: normal;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;

}



.slider-title p {

	opacity: .9;

	font-size: 1.1rem;

	line-height: 1.8 !important;

	font-weight: 300;

}



.slider-bottom-box {

	display: block;

	padding: 40px;

	background: #FFF;

	box-shadow: 0px 10px 40px 0px rgba(47,47,47,0.1);

	border-radius: 3px;

}



.slider-bottom-box li {

	font-size: 16px;

	font-weight: 500;

}

/* button color*/


.bg-contrast-1000, .h-bg-contrast-1000:hover {
	background-color: #15888a !important;
}

.bg-contrast-700,
.h-bg-contrast-700:hover {
  background-color: #dc3545 !important;
}
/* mega-menu */

.mega-menu-column .btn-link { font-size: 14px; }



.section-domain .dropdown-toggle::after { vertical-align: middle }

.section-domain .form-select:focus,

.section-domain .form-control:focus {

	border-color: #ced4da;

	box-shadow: none

}

.section-domain .form-select {

	background-color: #F9F9F9;

}



.section-domain .input-group-lg > .form-control {

	font-size: 1.3125rem;

}



.before-heading {

	font-style: normal;

	font-size: 13px;

	font-weight: 400;

	letter-spacing: 1px;

	text-transform: uppercase;

	color: #CCC;

}



.cpu-price,

.ram-price,

.storage-price { font-size: 44px; }



.fst-normal { font-style: normal !important; }



#top-bar {

	height: 52px;

	line-height: 52px;

}



.slider-element { height: 700px; }



.content-wrap { overflow: visible; }



.slider-box-wrap {

	position: relative;

	top: -50px;

	margin-bottom: -50px;

	z-index: 2;

}



.heading-block p {

	margin-top: 10px;

	font-size: 17px;

	font-weight: 300;

	line-height: 1.7 !important;

}



/* Clouds */

.cloud-wrap {

	bottom: 0;

	left: 0;

	padding-top: 50px;

	position: absolute;

	right: 0;

	top: 0;

	overflow: hidden;

	opacity: .09; /* Set Cloud Opacity */

}



/* KEYFRAMES */

@-webkit-keyframes animateCloud {

	0% { margin-left: -1000px; }

	100% { margin-left: 100%; }

}



@-moz-keyframes animateCloud {

	0% { margin-left: -1000px; }

	100% { margin-left: 100%; }

}



@keyframes animateCloud {

	0% { margin-left: -1000px; }

	100% { margin-left: 100%; }

}



/* ANIMATIONS */

.c1 {

	-webkit-animation: animateCloud 35s linear infinite;

	-moz-animation: animateCloud 35s linear infinite;

	animation: animateCloud 35s linear infinite;

	-webkit-transform: scale(0.65);

	-moz-transform: scale(0.65);

	transform: scale(0.65);

}



.c2 {

	-webkit-animation: animateCloud 20s linear infinite;

	-moz-animation: animateCloud 20s linear infinite;

	animation: animateCloud 20s linear infinite;

	-webkit-transform: scale(0.3);

	-moz-transform: scale(0.3);

	transform: scale(0.3);

}



.c3 {

	-webkit-animation: animateCloud 30s linear infinite;

	-moz-animation: animateCloud 30s linear infinite;

	animation: animateCloud 30s linear infinite;

	-webkit-transform: scale(0.5);

	-moz-transform: scale(0.5);

	transform: scale(0.5);

}



.c4 {

	-webkit-animation: animateCloud 18s linear infinite;

	-moz-animation: animateCloud 18s linear infinite;

	animation: animateCloud 18s linear infinite;

	-webkit-transform: scale(0.4);

	-moz-transform: scale(0.4);

	transform: scale(0.4);

}



.c5 {

	-webkit-animation: animateCloud 25s linear infinite;

	-moz-animation: animateCloud 25s linear infinite;

	animation: animateCloud 25s linear infinite;

	-webkit-transform: scale(0.55);

	-moz-transform: scale(0.55);

	transform: scale(0.55);

}



.cloud {

	background: #FFF;

	background: -moz-linear-gradient(top,  #FFF 5%, #F1F1F1 100%);

	background: -webkit-gradient(linear, left top, left bottom, color-stop(5%,#FFF), color-stop(100%,#F1F1F1));

	background: -webkit-linear-gradient(top,  #FFF 5%,#F1F1F1 100%);

	background: -o-linear-gradient(top,  #FFF 5%,#F1F1F1 100%);

	background: -ms-linear-gradient(top,  #FFF 5%,#F1F1F1 100%);

	background: linear-gradient(top,  #FFF 5%,#F1F1F1 100%);

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFF', endColorstr='#F1F1F1',GradientType=0 );

	-webkit-border-radius: 100px;

	-moz-border-radius: 100px;

	border-radius: 100px;

	-webkit-box-shadow: 0 8px 5px rgba(0, 0, 0, 0.1);

	-moz-box-shadow: 0 8px 5px rgba(0, 0, 0, 0.1);

	box-shadow: 0 8px 5px rgba(0, 0, 0, 0.1);

	height: 120px;

	position: relative;

	width: 350px;

}



.cloud::after, .cloud::before {

	background: #FFF;

	content: '';

	position: absolute;

	z-indeX: -1;

}



.cloud::after {

	-webkit-border-radius: 100px;

	-moz-border-radius: 100px;

	border-radius: 100px;

	height: 100px;

	left: 50px;

	top: -50px;

	width: 100px;

}



.cloud::before {

	-webkit-border-radius: 200px;

	-moz-border-radius: 200px;

	border-radius: 200px;

	width: 180px;

	height: 180px;

	right: 50px;

	top: -90px;

}



.mega-menu-content .feature-box h3 a { color: #222; }



.dark .primary-menu ul li .mega-menu-content ul.mega-menu-column:not(:first-child) { border-left-color: #F2F2F2 !important; }



/* Hotspot */

.hotspot-img { position: relative; }



.hotspot-img img { opacity: .6; }



.hotspot-img .hot-spot {

	position: absolute;

	width: 12px;

	height: 12px;

	top: 5px;

	left: 5px;

	text-align: center;

	background-color: rgba(133, 36, 228, 0.8);

	border: 1px solid #FFF;

	border-radius: 100%;

	cursor: pointer;

	transition: transform .3s ease;

}



.hotspot-img .hot-spot .circle {

	display: block;

	position: absolute;

	top: 47%;

	left: 47%;

	width: 2em;

	height: 2em;

	margin: -1em auto auto -1em;

	-webkit-transform-origin: 50% 50%;

	transform-origin: 50% 50%;

	border-radius: 50%;

	background: var(--cnvs-themecolor);

	opacity: 0;

	z-index: -1;

	-webkit-animation: pulsate 3.5s ease-out infinite;

	animation: pulsate 3.5s ease-out infinite;

}



.hotspot-img .hot-spot:nth-child(2) .circle { animation-delay: 2s; }

.hotspot-img .hot-spot:nth-child(3) .circle { animation-delay: 3.5s; }

.hotspot-img .hot-spot:nth-child(4) .circle { animation-delay: 5.2s; }

.hotspot-img .hot-spot:nth-child(5) .circle { animation-delay: 6.4s; }

.hotspot-img .hot-spot:nth-child(6) .circle { animation-delay: 8s; }

.hotspot-img .hot-spot:nth-child(7) .circle { animation-delay: 9.2s; }

.hotspot-img .hot-spot:nth-child(8) .circle { animation-delay: 11s; }

.hotspot-img .hot-spot:nth-child(9) .circle { animation-delay: 13s; }

.hotspot-img .hot-spot:nth-child(10) .circle { animation-delay: 15s; }



.hotspot-img .hot-spot .tooltip {

	background-color: rgba(255, 255, 255, 0.9);

	-webkit-border-radius: 3px;

	-moz-border-radius: 3px;

	border-radius: 3px;

	font-size: 14px;

	opacity: 0;

	display: none;

	left: 0;

	padding: 8px 10px;

	position: absolute;

	top: 20px;

	width: auto;

	z-index: 999;

	box-shadow: 0 10px 80px rgba(0,0,0,0.1), 0 10px 50px rgba(0,0,0,0.1);

	-webkit-transform: translateY(3px);

	-ms-transform: translateY(3px);

	-o-transform: translateY(3px);

	transform: translateY(3px);

	-webkit-transition: all .3s linear;

	-o-transition: all .3s linear;

	transition: all .3s linear;

}



.hotspot-img .hot-spot.hotspot-tooltip-open .tooltip {

	opacity: 1;

	-webkit-transform: translateY(0);

	-ms-transform: translateY(0);

	-o-transform: translateY(0);

	transform: translateY(0);

}



.hotspot-img .hot-spot .tooltip.ontop {

	top: auto;

	bottom: 35px;

}



.hotspot-img .hot-spot .tooltip  p {

	font-size: 13px;

	line-height: 1.3rem !important;

	margin-bottom: 0;

	white-space: nowrap;

	color: #666 !important;

	text-transform: capitalize;

}



@-webkit-keyframes

	pulsate {  0% {

		-webkit-transform: scale(1);

		transform: scale(1);

		opacity: 0.8;

	}

	 45% {

		-webkit-transform: scale(1.75);

		transform: scale(1.75);

		opacity: 0;

	}

}

@keyframes

	pulsate {  0% {

		-webkit-transform: scale(1);

		transform: scale(1);

		opacity: 0.8;

	}

		45% {

		-webkit-transform: scale(1.75);

		transform: scale(1.75);

		opacity: 0;

	}

}



.iconlist li:not(:first-child) { margin-top: 8px; }

.iconlist li img {

	position: relative;

	margin-top: -2px;

	width: 16px;

	margin-right: 5px;

}



.iconlist a {

	font-size: 15px;

	color: #444;

}



.dark .iconlist a {

	color: rgba(255, 255, 255, 0.75);

}



.iconlist a:hover { text-decoration: underline !important; }

.text-muted {
    opacity: 0.5;
    text-align: center;
}



.pricing-price::after { content: none }



.irs-single { top: -12px; }



.irs-slider {

	background: var(--cnvs-themecolor);

	border-radius: 50%;

	width: 28px;

	height: 28px;

	top: 13px;

}



.irs-slider::after {

	content: "\f337";

	font-family: 'FontAwesome';

	color: #FFF;

	text-align: center;

	position: absolute;

	top: 50%;

	left: 50%;

	font-size: 11px;

	-webkit-transform: translate(-50%, -50%);

	-ms-transform: translate(-50%, -50%);

	-o-transform: translate(-50%, -50%);

	transform: translate(-50%, -50%);

}



.price-compare { list-style-type: disc; }

.price-compare.iconlist li:not(:first-child) {

	font-weight: 300;

	margin-top: 15px;

}





.testimonials-carousel .owl-item {

	opacity: 0.25;

	transform: scale(.9);

	-webkit-transition: all .5s linear;

	-o-transition: all .5s linear;

	transition: all .5s linear;

}



.testimonials-carousel .owl-item.active.center {

	opacity: 1;

	transform: scale(1);

}



.clients { max-height: 50px; }



.owl-stage-outer::before,

.owl-stage-outer::after {

	position: absolute;

	content: '';

	top: 0;

	left: 0;

	width: 300px;

	height: 100%;

	z-index: 1;

	background: -moz-linear-gradient(left, rgba(249,249,249,1) 52%, rgba(249,249,249,0.06) 90%, rgba(249,249,249,0) 100%);

	background: -webkit-linear-gradient(left, rgba(249,249,249,1) 52%,rgba(249,249,249,0.06) 90%,rgba(249,249,249,0) 100%);

	background: linear-gradient(to right, rgba(249,249,249,1) 52%,rgba(249,249,249,0.06) 90%,rgba(249,249,249,0) 100%);

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#00f9f9f9',GradientType=1 );

}



.owl-stage-outer::after {

	left: auto;

	right: 0;

	background: -moz-linear-gradient(right, rgba(249,249,249,1) 52%, rgba(249,249,249,0.06) 90%, rgba(249,249,249,0) 100%);

	background: -webkit-linear-gradient(right, rgba(249,249,249,1) 52%,rgba(249,249,249,0.06) 90%,rgba(249,249,249,0) 100%);

	background: linear-gradient(to left, rgba(249,249,249,1) 52%,rgba(249,249,249,0.06) 90%,rgba(249,249,249,0) 100%);

}



.bg-angle::after,

.section.bg-angle::before {

	content: '';

	height: 100%;

	overflow: hidden;

	width: 100%;

	position: absolute;

	height: 70px;

	bottom: -70px;

	left: 0;

	transform-origin: 0;

	-webkit-transform-origin: 0;

	-webkit-transform: skewY(-1.5deg);

	-moz-transform: skewY(-1.5deg);

	-ms-transform: skewY(-1.5deg);

	-o-transform: skewY(-1.5deg);

	transform: skewY(-1.5deg);

	background-color: var(--cnvs-themecolor);

	z-index: 1;

}



.section.bg-angle::before { top: -30px; }



.section.bg-angle::after,

.section.bg-angle::before { background-color: #FFF; }



.dark .primary-menu ul li,

.dark .primary-menu ul li .mega-menu-content ul.mega-menu-column:not(:first-child) { border-top-color: rgba(255, 255, 255, 0.1) }



@media (min-width: 991.98px) {

	#header {

		--cnvs-primary-menu-hover-color: #FFF !important;

		--cnvs-primary-menu-active-color: #FFF !important;

	}

}



/* Devices Under 991 Width */

@media (max-width: 991px) {



	#top-bar { height: 44px }



	#top-bar p {

		margin-bottom: 0px;

		line-height: 44px;

	}



	#header.transparent-header { z-index: 1 !important; }



	.vertical-middle { z-index: 0; }



	.cpu-price,

	.ram-price,

	.storage-price { font-size: 34px; }



	.pricing-price { font-size: 52px; }



	.mega-menu-content .btn.btn-link { display: none; }



	.primary-menu ul li .mega-menu-content.style-2 ul.mega-menu-column { padding: 10px 0; }



	.owl-stage-outer::before,

	.owl-stage-outer::after { display: none; }



	.slider-bottom-box { padding: 15px; }



	.img-map { opacity: 0.2; }

}
