html h1,
html h2,
html h3,
html h4,
html h5,
html h6 {
	margin: 0;
}

html h1 {
	color: #333;
	font-weight: 500;
}

html h3 {
	color: #aaa;
	font-weight: 500;
}

html h4 {
	color: #999;
	font-weight: 500;
}

html h4:after {
	/* content: "%"; */
	padding-left: 1px;
}

html input[type="range"] {
	outline: 0;
	border: 0;
	border-radius: 500px;
	width: 400px;
	max-width: 100%;
	margin: 24px 0 16px;
	transition: box-shadow 0.2s ease-in-out;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
	html input[type="range"] {
		overflow: hidden;
		height: 40px;
		-webkit-appearance: none;
		background-color: #ddd;
	}

	html input[type="range"]::-webkit-slider-runnable-track {
		height: 40px;
		-webkit-appearance: none;
		color: #444;
		transition: box-shadow 0.2s ease-in-out;
	}

	html input[type="range"]::-webkit-slider-thumb {
		width: 40px;
		-webkit-appearance: none;
		height: 40px;
		cursor: ew-resize;
		background: #fff;
		box-shadow: -340px 0 0 320px #54B2D3, inset 0 0 0 40px #54B2D3;
		border-radius: 50%;
		transition: box-shadow 0.2s ease-in-out;
		position: relative;
	}

	html input[type="range"]:active::-webkit-slider-thumb {
		background: #fff;
		box-shadow: -340px 0 0 320px #54B2D3, inset 0 0 0 3px #54B2D3;
	}
}

html input[type="range"]::-moz-range-progress {
	background-color: #54B2D3;
}

html input[type="range"]::-moz-range-track {
	background-color: #54B2D3;
}

html input[type="range"]::-ms-fill-lower {
	background-color: #54B2D3;
}

html input[type="range"]::-ms-fill-upper {
	background-color: #54B2D3;
}

#h4-container {
	width: 400px;
	max-width: 100%;
	padding: 0 20px;
	box-sizing: border-box;
	position: relative;
}

#h4-container #h4-subcontainer {
	width: 100%;
	position: relative;
}

#h4-container #h4-subcontainer h4 {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 0;
	width: 40px;
	height: 40px;
	color: #fff !important;
	font-size: 12px;
	transform-origin: center -10px;
	transform: translateX(-50%);
	transition: margin-top 0.15s ease-in-out, opacity 0.15s ease-in-out;
}

#h4-container #h4-subcontainer h4 span {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #54B2D3;
	border-radius: 0 50% 50% 50%;
	transform: rotate(45deg);
	z-index: -1;
}

input:not(:active) + #h4-container h4 {
	opacity: 0;
	margin-top: -50px;
	pointer-events: none;
}
#number-of-users {
    font-size: 22px;
    width: 50px;
    color: #3d3d3d;
    font-weight: 500;
}
.font-size-38 {
    font-size: 22px;
    color: #3d3d3d;
    font-weight: 500;
}



.p-pricing-card {
    background-color: #fefefe; 
    box-shadow: 0px 0px 20px 0px rgba(195,195,195,0.75);
}
.p-pricing-title {
    background-color: #E3F8FD; 
    text-align: center; 
    padding: 18px 0 10px 0;
}
.p-pricing-body {
    text-align: center; 
    padding: 20px 50px;
}
.p-pricing-price-value {
    display: flex; 
    justify-content: center; 
    align-items: center; 
    margin-bottom: -15px;
}
.p-btn-select {
    background-color: #40A0C1;
    border: 2px solid #40A0C1;
    color: #fff !important; 
    padding: 10px 30px 12px 30px; 
    border-radius: 5px;
}
.p-btn-select:hover {
    background-color: transparent;
    border: 2px solid #40A0C1;
    color: #40A0C1 !important; 
    padding: 10px 30px 12px 30px; 
    border-radius: 5px;
}
.col-4 {
    width: 40%;
    margin: auto;
}
.ent-pricing-box {
	width: 33%; 
	margin: auto;
}
.ent-pricing-box-font-size {
	font-size: 50px;
}
.range-container {
	width: 100%;
}

@media screen and (max-width: 1024px) {
	.ent-pricing-box {
		width: 50%; 
		margin: auto;
	}	
}

@media screen and (max-width: 767px) {
	.ent-pricing-box {
		width: 70%; 
		margin: auto;
	}	
}

@media screen and (max-width: 515px) {
	.ent-pricing-box {
		width: 100%; 
		margin: auto;
	}
	.range-container {
		width: 90%;
		margin: auto;
	}
}

@media screen and (max-width: 375px) {
	.ent-pricing-box-font-size {
		font-size: 36px;
	}
	.p-pricing-price-value sub {
		margin-top: 0;
	}
}