/* Custom css begins here */


.hidden {
	display:none!important;
}
#loading-container {
	background-image: linear-gradient(to bottom right, #c5fff3, #c5fff3, #e1f3ef, #fff, #fff, #fff, #fff);
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 999;
}

#loading {
	width: 80px;
	height: 80px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}

#logo {
	position: relative;
	z-index: 1;
	animation: heartbeat 2s infinite;
	width: 80%;
}

#circle {
	width: 100%;
	height: 100%;
	border: 5px solid #ccc;
	border-top-color: #22BB9C;
	border-radius: 50%;
	position: absolute;
	top: 0px;
	left: 0px;
	animation: circle 1s linear infinite;
}

@keyframes circle {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

@keyframes heartbeat {
  	0% {
   		transform: scale(1);
  	}
  	50% {
    	transform: scale(1.2);
  	}
  	100% {
    	transform: scale(1);
  	}
}
/*Loader ends*/

.loading-btn::after {
	content: "";
	display: block;
	position: relative;
	top: 50%;
	left: 50%;
	width: 1.5em;
	height: 1.5em;
	margin: 0;
	border-radius: 50%;
	border: 0.2em solid rgba(96, 93, 93, 0.65);
	border-top-color: #fff;
	animation: spin 1s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.theme-bg {
	background: #22BB9C;
}
.theme-color {
	color: #22BB9C;
}
.logo a img {
	height: auto;
	width: auto;
}

.gradient-bg {
	background:linear-gradient(to bottom right, #c5fff3, #c5fff3, #e1f3ef, #fff, #fff, #fff, #fff);
	opacity: 0.99;
}

.sticky-menu .header {
	background: #fff;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
.main-menu ul li .mega-menu a:hover {
	background-color: #efefef;
}

.mega-menu.mega-dropdown-menu li a {
	display: block;
	padding: 10px 10px 10px 30px;
	border-bottom: 1px solid #e5e5e5;
}
.pt-50 {
	padding-top: 50px;
}
.display-table {
	display: table;
}
.home7 .port-over-content h3, .home8 .port-over-content h3, .home4 .port-over-content h3 {
	font-size: 16px;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	font-weight: 400;
}

.register-area-2 {
	padding: 10px 60px;
}

@media screen  and (max-width: 768px) {
	.mean-container .mean-nav ul li .mega-menu li {
		border-bottom: 1px solid #e1e1e1;
		padding-top: 7px;
		padding-bottom: 7px;
		padding-left: 10px;
	}
	.port-content {
		right: 30px;
		top: 20px;
		font-size: 18px;
		visibility: visible;
		opacity: 1;
		z-index: 11;
		cursor: pointer;
		background: #fff;
		width: 60px;
		height: 60px;
		line-height: 60px;
		border-radius: 50%;
	}
	.port-over-content {
		bottom: -5px;
		opacity: 1;
		transition: 0.6s;
	}
	.port-over-content{opacity: 1;}
	.port-content {
		visibility: visible;
		opacity: 1;
	}
	.single-portfolio::before {
		opacity: 0.7;
	}
	.register-area-2 {
		padding: 50px 20px;
	}
	.pt-65 {
		padding-top: 65px;
	}
	.login-register-area {
		margin-top: 0px;
		margin-bottom: 25px;
	}
	.slider-content p {
		font-size: 18px;
	}
	.slider-content span {
		font-size: 20px;
	}
	.slider-content h1 {
		font-size: 35px;
		margin-bottom: 0;
		padding-right: 50px;
	}
	.hero-section {
		margin-top: 150px;
	}
	.page-title {
		margin-top: 110px;
	}
}

.link-primary {
	color: #3f3f3f;
}

img.width-20-percent {
	height: 20% !important;
}
#error-msg p {
	color: #dc3545 !important;
}
.footer-bg {
	background: url("/assets/images/footer-background-image.png");
	background-color: #3E4241;
}
.footer-widget h6 {
	color: #22bb9c;
}
.footer-area li, .footer-area span, .footer-top a {
	color: #fff;
	font-size: 14px;
}
.footer-subscribe p {
	color: #fff;
	font-size: 14px;
}
.home5-about-left-img {
	margin-bottom: 0;
	margin-left: -125px;
}
.pl-130 {
	padding-left: 130px;
}
.f-count span {
	font-size: 35px;
	color: #22BB9C;
}
.home5-feature-wrapper2 .service-text li {
	font-size: 16px;
}
.home4-feature-product-bg {
	background: #22bb9c;
	border-radius: 20px;
}
.home4-feature-product-img img {
	max-height: 425px;
}
.home5-feature-img img {
	max-height: 480px;
}
@media screen and (max-width: 767px) {
  .logo img {
    max-width: 100%;
  }
  .sticky-menu .logo img {
    max-width: 100%;
  }
}
.social-link a {
	font-size: 30px;
}
ul.useful-link li a:hover {
	color: #22bb9c;
}
@media (min-width: 992px) {
  .p-lg-lr-10 {
    padding-left: 10rem !important;
    padding-right: 10rem !important;
  }
}

li a.my-btn-2 {
	background-color: #22bb9c !important;
	border: 1px solid #22bb9c !important;
	border-radius: 20px !important;
	text-align: center !important;
	color: #fff !important;
	margin-top: 1.5rem !important;
}

li a.my-btn-2:hover {
	background-color: #fff !important;
	color: #222 !important;
}

/* Swal Alert Custom Css */

div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
	border: 0;
	border-radius: .25em;
	background: initial;
	background-color: #22bb9c;
	color: #fff;
	font-size: 1em;
}
div:where(.swal2-container) h2:where(.swal2-title) {
	position: relative;
	max-width: 100%;
	margin: 0;
	padding: .8em 1em 0;
	color: #222;
	font-size: 16px;
	font-weight: 500;
	text-align: center;
	text-transform: none;
	word-wrap: break-word;
}
div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm:focus {
	box-shadow: 0 0 0 3px rgba(102, 224, 190, 0.5);
}
div:where(.swal2-container) input:where(.swal2-input):focus, div:where(.swal2-container) input:where(.swal2-file):focus, div:where(.swal2-container) textarea:where(.swal2-textarea):focus {
	border: 1px solid #22bb9c;
	outline: none;
	box-shadow: 0 0 0 3px rgba(102, 224, 190, 0.5);
}

@keyframes typing {
	0% { width: 0; }
	100% { width: 100%; }
}
@keyframes deleting {
	0% { width: 100%; }
	100% { width: 0; }
}
.write_animx {
	white-space: nowrap;
	overflow: hidden;
/*	border-right: 2px solid black;*/
	/* animation: typing 4s steps(40) 1s forwards, deleting 2s steps(40) 5s forwards, typing 4s steps(40) 7s forwards, deleting 2s steps(40) 11s forwards; */
	animation: typing 4s steps(40) 1s forwards, deleting 2s steps(40) 2s forwards, typing 4s steps(40) 4s forwards;
}

.download-logo a img {
	width: 200px;
}
.width-55 {
	width: 55% !important;
}
.title h6 {
	font-weight: 700;
}
.pt-5px {
	padding-top:5px;
}