/* Google Font Embed */
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700,800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Baloo+Bhai+2:wght@400;500;600&display=swap');

/*
	font-family: 'Open Sans', sans-serif;
	font-family: 'Poppins', 'Open Sans', sans-serif;
	font-family: 'Baloo Bhai 2', cursive;
*/

/* 
	========================== 
	DEFAULT CSS 
	==========================
*/
*{box-sizing:border-box; position:relative;}

html,body {
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
}
body{
	margin:0px auto;
	font-family: 'Baloo Bhai 2', cursive;
	font-size:17px;
	color:#000;
	background-color: #55e2ff;
	font-weight: 400;
	overflow:hidden;	
	text-rendering: optimizeLegibility;
	overscroll-behavior: none;
}
body[data-header="false"]{margin-top:0px;}
body[data-footer="true"]{margin-bottom:50px;}
body[data-bottom="true"]{padding-bottom:50px;}
body[data-bgcolor="white"]{background-color: #fff;}

header, footer, menu, nav, article, section, aside, div{
	display:block;
	margin:0px;
	padding:0px;
	z-index:1;
}
h1, h2, h3, h4, h5, h6, form{
	margin:0px;
	padding:0px;
}
p, ul, li, a, dt, dl, i{
	margin:0px;
	padding:0px;
	list-style-type:none;	
}
a, span, label, dt, dl, i{
	display:inline-block;
}
img{
	max-width:100%;
	vertical-align:top;
}
a{
	outline:none;
	border:none;
	text-decoration:none;
	-webkit-transition: all 0.3s ease-out;
	   -moz-transition: all 0.3s ease-out;
		 -o-transition: all 0.3s ease-out;
			transition: all 0.3s ease-out;
			color:#4048af;
			-webkit-tap-highlight-color: rgba(0,0,0,0);
}
input, select, textarea{
	font-family: 'Poppins', 'Open Sans', sans-serif;
	font-size:16px;
	-webkit-transition: all 0.3s ease-out;
	   -moz-transition: all 0.3s ease-out;
		 -o-transition: all 0.3s ease-out;
			transition: all 0.3s ease-out;
			outline: none;
}
#main{}

.viewHolder{}

/*
	=======================
	%Widget: Custome Alert
	=======================
*/
.alert{
	position:fixed; 
	top:0px; left:0px;
	width:100%; height:100%;
	background:rgba(0,0,0,0.8);
	
	z-index:1000;
}
.alert .alertWrapper{
	margin: 0px auto 0px auto;
	top: calc(50% - 126px);
	background:#fff;
	width:85%;
	max-width:450px;
	border-radius:5px;
	border-top:5px solid rgb(255,105,147);
}
.alertContent{padding:25px 15px 25px; text-align:center;}
.alertContent h5{font-size:18px; font-weight:600;}
.alertContent p{color:#000; line-height:25px;}
.alertAction{background:#f6f6f6; border-radius: 0px 0px 10px 10px; padding:10px 25px; text-align:center;}
.alertAction a{ border-radius:3px; padding:7px 15px; margin-left:5px; font-weight:400; font-size:15px;}
.alertAction a.left{float:left}
.alertAction a.right{float:right}
.alertAction .blue{background:#a98cde; color:#fff}
.alertAction .blue:hover{background:#a98cde;}
.alertAction .green{background:#08bba3; color:#fff}
.alertAction .green:hover{background:#08a893;}
.alertAction .red{background:#f78888; color:#fff}
.alertAction .red:hover{background:#d75f5f;}
.alertAction .white{background:#fff; }
.alertAction .white:hover{background:#f4f4f4;}


/*
	=======================
	%Widget: Switch
	=======================
*/
input.switch {
  position: relative;
  -webkit-appearance: none;
  outline: none;
  width: 50px;
  height: 30px;
  background-color: #fff;
  border: 1px solid #D9DADC;
  border-radius: 50px;
  box-shadow: inset -20px 0 0 0 #fff;
}

input.switch:after {
  content: "";
  position: absolute;
  top: 1px;
  left: 1px;
  background: transparent;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  box-shadow: 2px 4px 6px rgba(0,0,0,0.2);
}

input.switch:checked {
  box-shadow: inset 20px 0 0 0 #4ed164;
  border-color: #4ed164;
}

input.switch:checked:after {
  left: 20px;
  box-shadow: -2px 4px 3px rgba(0,0,0,0.05);
}



/*
	=======================
	%Widget: ringLoader
	=======================
*/
.spinLoader
{
	border: 16px solid #ce3384;
	border-radius: 50%;
	border-top: 16px solid #ffffff;
	width: 120px;
	height: 120px;
	-webkit-animation: spin 0.5s linear infinite;
	animation: spin 0.5s linear infinite;
	cursor: wait;
}
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}
.spinLoader.small{
	width:22px;
	height:22px;
	border-width:4px;
}

/*
	=======================
	%Widget: Model
	=======================
*/
.modelWrapper{
	position:fixed;
	top:0px; left:0px; z-index:-8;
	width:100%; height:100%;
	background:rgba(10, 183, 187, 0.78);
	opacity:0;
	overflow:hidden;
	-webkit-transition: -webkit-transform 350ms ease;
	-moz-transition: -moz-transform 350ms ease;
	transition: transform 350ms ease;
}
.modelWrapper .clickOverlay{	
	position:fixed;
	top:0px; left:0px; z-index:3;
	width:100%; height:100%;	
	background:red;
	opacity:0;
}
.modelWrapper .model{
	background:#fff;
	box-shadow:0px 0px 48.06px 5.94px rgba(0, 0, 0, 0.4);	
	position:absolute;
	top:50%; left:10%; z-index:5;
	width:80%;
	
	-webkit-transform: translateY(150%);
	-ms-transform: translateY(150%);
	transform: translateY(150%);
	
	-webkit-transition: -webkit-transform 350ms ease;
	-moz-transition: -moz-transform 350ms ease;
	transition: transform 350ms ease;
}
.modelWrapper .model .modelTitle{
	background: rgb(231,108,66);
	background: linear-gradient(90deg, rgba(231,108,66,1) 0%, rgba(216,48,126,1) 35%, rgba(87,90,203,1) 100%);
	color:#fff;
	height:55px;
	line-height:55px;
	padding:0px 15px;
}
.modelWrapper .model .modelTitle .close{
	position:absolute;
	top:0; right:0;
	width:50px;
	text-align:center;
	background:rgba(0,0,0,0.1);
	color:#fff;
}
.modelWrapper .model .modelContent{padding:15px;}
.modelWrapper[data-modelShow="false"]{opacity:0;}
.modelWrapper[data-modelShow="true"]{z-index:10000; opacity:1;}
.modelWrapper[data-modelShow="true"] .model{
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}