/*Css file
*@author Myxo victor
*@description this CSS file is specifically made for Aximo  webapp 
*@date 15th dec. 2024
*@coded Aximo platforms
*@Desktop version - Myxo victor
*/


/*larger screen display*/

@media screen and (min-width:850px){
body{
margin:0;
padding:0;
box-sizing:border-box;

}

.top{
	width:100%;
	height:80px;
	display:flex;
	background:white;
	position:fixed;
	padding-bottom:10px;
	z-index:5;
	padding-left:15px;

}

.logo{
	width:80px;
	height:60px;
	padding:5px;
	display:block;

}

.brand{
	width:180px;
	height:65px;
	padding:5px;
	z-index:4;
	
}


/*desktop nav*/
.nav{
	width:100%;
	height:auto;
	font-size:20px;
	display:flex;
	justify-content:space-evenly;
	padding-top:10px;
	
}

/*android display*/
.android{
	display:none;
}

#h1{
	font-size:60px;
	padding-top:50px;
	font-family:palladio;
}


.nav span{
	font-size:20px;
	color:black;
	font-family:arial;
	width:avail;
	heigth:60px;
	padding:10px;
	border-radius:8px;
	
}

.nav span:hover{
background-color:#EDEDED;
padding-left:8px;
padding-right:8px;
border-radius:10px;

}

.flexy{
	width:100%;
	height:auto;
	display:flex;
	flex-direction:row;
	flex-flow:wrap;
}

.flexy .left{
	width:100%;
	height:auto;
	float:left;
	margin:30px auto;
}


.flexy .right{
	width:90%;
	height:auto;
	float:right;
	margin:10px auto;
}


 .banner{
	width:100%;
	height:80vh;
	border-radius:20px;
	padding:5px;
	transition: all 2s;
}

.btn1{
	width:150px;
	height:45px;
	padding:5px;
	background:#2134FF;
	border-radius:30px;
	border:none;
	outline:none;
	color:white;
	font-size:17px;
	text-align:center;
	
}

/*set well on mobile*/
.carriage{
	display:flex;
	justify-content:space-evenly;
	margin-left:80px;
	flex-direction:row;
}
.float{
	padding-top:14px;
}


.infoSpecific{
	width:100%;
	
	background:#525CC9;
	border-radius:15px;
	margin-top:30px;
	display:flex;
	justify-content:space-evenly;
	color:white;
	flex-direction:row;
	flex-flow:wrap;
	padding-bottom:10px;

}

.icon{
	width:220px;
	height:auto;
	padding:8px;
}

/*desktop*/
.conText{
	height:auto;
	color:white;
	padding-top:40px;
}

.conText h2{
	color:white;
}

.btn2{
	width:150px;
	height:45px;
	padding:5px;
	background:#525CC9;
	border-radius:30px;
	border:none;
	outline:none;
	color:white;
	font-size:17px;
	text-align:center;
	
}



.btn3{
	width:40%;
	height:35px;
	padding:10px;
	background:#2134FF;
	border-radius:12px;
	color:white;
	border:none;
	outline:none;
	display:block;
	text-align:center;
	margin:0 auto;
}

.banner3{
	width:100%;
	height:60vh;
	border-radius:30px;
	padding:10px;
	margin-top:30px;
	
}

.bannerCon{
	position:relative;
}
.bannerCon span{
position:absolute;
bottom:50px;
right:110px;
color:white;
font-size:20px;

}

.icns{
	position:absolute;
bottom:45px;
right:60px;
color:white;
font-size:20px;
height:40px;
width:40px;
border-radius:60px;
border:4px solid white;
padding-bottom:4px;
padding-left:6px;
padding-top:2px;


}

.icns:hover{
	background:#EDEDED;
	color:black;
}

.icony{
	width:50px;
	padding:10px;
	display:flex;
}

.inline{
	display:flex;

}

.banner4{
	width:100%;
	height:auto;
	border-radius:30px;
	padding:10px;
	margin-top:30px;
}

/*for desktop edit well*/
.form{
	width:60%;
	height:25vh;
	border-radius:30px;
/*	box-shadow:0 2px 4px 4px #EDEDED, 0 2px 4px 4px #EDEDED;*/
	padding-top:10px;
	margin:0 auto;
	padding-left:20px;
}

.input{
	width:350px;
	height:40px;
	padding:10px;
	outline:none;
	border:2px solid black;
	border-radius:30px;
	margin-left:60px;
	margin-bottom:20px;
}





.schoolLogo{
	width:60%;
	height:auto;
	padding:20px;
	display:block;
	margin:0 auto;
}
	
	/*create slider desktop*/
	.rowa{
		flex-direction:row;
		overflow-x:scroll;
		display:flex;
	justify-content:space-evenly;
	
	margin-bottom:40px;
	
	}
	
	
	.rowa .row_hold{
		height:450px;
	width:100%;
		height:auto;
		background:#EDEDED;
		padding-top:30px;

	}
	
	.row_hold .content_{
		width:200px;
		height:250px;
		background:white;
		border-radius:10px;
		margin-left:10px;
		
		padding-top:10px;
	}
	
	
	.icon1{
		width:100%;
		padding:10px;
		border-top-left-radius:20px;
		border-top-right-radius:20px;
	}
	
	
.icns1{
	width:30px;
	height:30px;
	border:4px solid black;
	border-radius:60px;
	padding-left:3.5px;
}
.icns1:hover{
	background:#EDEDED;
	color:white;
	border:4px solid white;
}


/*footer part*/

.foter{
	width:100%;
	height:auto;
	background:#303030;
	padding:2em;
}


.class{
	width:300px;
	padding:10px;
	margin:0 auto;
	display:block;
}


/*Education page styling*/
.description{
	width:100%;
	height:83vh;
	background:#EDEDED;
	padding:2em;
}

#descip{
	height:120vh
}

/*register*/


.logoPosition{
	width:150px;
	padding:10px;
	margin:0 auto;
	display:block;
}

.inForm{
	margin-top:30px;
	width:100%;
	height:45px;
	padding:10px;
	outline:none;
	border:2px solid black;
	border-radius:12px;
}


.select{
	margin-top:10px;
	width:48%;
	height:45px;
	padding:10px;
	outline:none;
	border:2px solid black;
	border-radius:12px;
	background:white;
	margin-bottom:20px;
}



.whitepaper{
	padding-left:200px;
	padding-right:200px;
	padding-top:50px;
	padding-bottom:20px;
}


.contenter{
	width:90%;
	height:auto;
	padding:1em;
	background:#EDEDED;
	border-radius:12px;
	margin:0 auto;
	display:block;
}



/*updated*/
.flex-box{
	width:100%;
	height:auto;
	display:flex;
	flex-direction:row;
	flex-flow:wrap;
}

.flex-box .left{
	width:50%;
	height:auto;
	float:left;
}


.flex-box .right{
	width:50%;
	height:auto;
	float:right;
}


.form1{
	padding:2em;
	height: auto;
	width:80%;
	display:block;
	margin:0 auto;
}



.formBtn{
	width:90%;
	height:40px;
	padding:10px;
	outline:none;
	border:none;
	background:#2134FF;
	color:white;
	border-radius:12px;
	display:block;
	margin:0 auto;
}

.subContent{
	width:700px;
	height:auto;
	display:block;
	margin:auto;
}
.smallBox{
	width:46%;
	height:50px;
	padding:1em;
	border:2px solid black;
margin:5px;
}

.demo{
	width:100%;
	height:55vh;
	padding:4em;
	background:#25294D;
	margin-top:40px;
	color:white;
}

	.desktop{
	display:block;
	color:black;
	font-size:24px;
	padding-top:20px;
	padding-right:20px;

}

.body{
	width:100%;
	height:auto;
	display:flex;
}


.body .left{
	width:25%;
	background:#2134FF;
	height:100vh;
	border-right:8px solid grey;
	position:fixed;
	
}


.body .right{
	width:75%;
	background:#EDEDED;
	height:110vh;
margin-left:25%;
padding-left:20px;
}
.navigate{
	width:90%;
	height:80px;
	padding:1em;
    margin:15px;
    color:white;
background:#525CC9;
box-shadow:0 2px 2px #EDEDED, 0 2px 2px #EDEDED;
text-align:center;
font-size:25px;
border-radius:15px;	
}


.profile{
	width:50px;
	height:50px;
	border-radius:100px;
	border:2px solid #EDEDED;
	padding:5px;
	margin-left:70%;
	margin-top:10px;
}

.progressCon{
	width:80%;
	height:20px;
	padding-top:0px;
	padding-left:0px;
	padding-right:30px;
	border-radius:20px;
	border:0.5px groove #4AB125;
	background:white;
}
.progressHos{
	width:100%;
	height:20px;
	border-radius:20px;
	
	
}

.progress1{
	width:30%;
	height:19px;
	border-radius:10px;
	background:#4AB125;
	transition:all 2s;
}

.cashbox{
	width:90%;
	height:auto;
	padding:2em;
	border-radius:12px;
	background:#525CC9;
	margin:0 auto;
	color:white;
}

.cert{
	padding-left:180px;
	padding-right:180px;
	padding-top:10px;
	padding-bottom:20px;
	margin:0 auto;
	display:block;
}

.QR{
	width:30%;padding:10px;display:block;margin:0 auto; height:200px;
}
.cert-qr{
	width:15%;padding:10px;display:block;margin:0 auto; height:130px;
}

/*register rebuild*/
.box_form{
	width:500px;
	height:auto;
	padding:2em;
	background:tarnsparent;
	border:3px solid #EDEDED;
	border-radius:20px;
	display:block;
	float:right;
	margin-top:100px;
	margin-right:50px;

}

.modernInput{
	width:100%;
	height:40px;
	padding:1em;
	border:1px groove #EDEDED;
	background:transparent;
	outline:none;
	border-radius:8px;
	margin-bottom:30px;
	display:block;
	color:white;
}

.modernInput::placeholder{
	color:white;
}
	
.modernButton{
	width:90%;
	height:40px;
	padding:10px;
	border:1px groove #EDEDED;
	background:transparent;
	outline:none;
	border-radius:8px;
    margin:0 auto; 
	display:block;
	color:white;
	text-align:center;
}
	
	
	.logoBrand{
	width:500px;
	height:150px;
	padding:5px;
	
	
}
.paddingtop{
	padding-top:200px;
}


.payment_form{
	width:700px;
	height:auto;
	padding:1em;
	margin:0 auto;
	border:1px groove blue;
	background:white;
	justify-content:center;
	display:block;
	border-radius:10px;

}

.pInput{
	width:100%;
	height:50px;
	padding:1em;
	border:1px groove grey;
	color:black;
}

.pSelect{
	width:100%;
	height:50px;
	padding:1em;
	border:1px groove grey;
	color:black;
	background:transparent;
	margin-bottom:15px;
}

.pBtn{
	width:95%;
	height:45px;
	padding:1em;
	border:none;
	color:white;
	background:#25294D;
	margin:0 auto;
	border-radius:8px;
	display:block;

}
.payment_receipt{
	width:650px;
	height:auto;
	padding:1em;
	margin:0 auto;
	border:1px groove blue;
	background:white;
	justify-content:center;
	display:block;
	border-radius:10px;
}


/*alerts*/
/* Your Custom CSS Styles */

.alert {
  padding: 5px;
  border: 1px solid #ddd;
  border-radius: 4px;
  height: auto;
}

.alert.success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}

.alert.warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}

.alert.danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}
	

/*desktop displayof rotating logo*/
.RT{
	width:200px;
	height:auto;
	display:block;
	margin:0 auto;
	transition:all 2s;
animation-name:myRT;
animation-iteration-count:infinite;
animation-duration:3s;


}

@keyframes myRT{
	from{
		transform: rotateX(-90deg);
	}
	to{
		transform: rotateX(-360deg);
	}
}



.preloader{
	width:100%;
	height:110vh;
	background:white;
	justify-content:center;
z-index:20;
	position:fixed;
}


.margin{
margin-top:25vh;
}



/*image slider design*/
.mySlides {display: none;}
.sliderImg {
vertical-align: middle;
border-radius:30px;
}

/* Slideshow container */
.slideshow-container {
  max-width: 100%;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next" button to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 18px;
  font-weight:800;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: 0.3s;
}



/* Slide-in animation */
.slide-in {
  -webkit-animation: slideIn 1.5s ease-in-out;
  animation: slideIn 1.5s ease-in-out;
}

@-webkit-keyframes slideIn {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

@keyframes slideIn {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

/*image iconX*/
.iconX{
	width:45px;
	padding:5px;
	border-radius:80px;
}



/*text animi*/
ul h1{
  font-size: 50px;
  font-weight: 600;

  letter-spacing: 2px;
  color: #484848;
  animation:light 4s linear infinite
}
@keyframes light{
  0%{
    color: blue;
    text-shadow: none;
  }
  50%{
    color: fuchsia;
    text-shadow: none;
	animation-delay:1s;
  }
  100%{
    color: black;
    text-shadow: 0 0 7px #EDEDE, 0 0 50px #fff900;
	animation-delay:1.5s;
  }
}

/*contact style by myxo*/
.topper{
	
		width:100%;
	height:auto;
	padding:5em;
	text-align:center;
	font-family:palladio;
	color:white;
	background:#525CC9;
}

.contactBox{
	display:flex;
	flex-direction:column;
	flex-flow:wrap;
	width:60%;
	margin:5px auto;
	justify-content:space-evenly;
}

.contactBox .box{
	width:150px;
	height:auto;
	border-radius:8px;
	border:1px outset black;
	justify-content:center;
	padding:2em;
}


.imgContact{
	width:80px;
	height:80px;
	border-radius:160px;
	padding:5px;
	display:block;
	margin:8px auto;
}
.contactBox p{
	text-align:center;
}




/*services box*/
.service{
	width:70%;
	height:auto;
	padding:1em;
	border-radius:15px;
	background:white;
	display:block;
	justify-content:space-evenly;
	flex-flow:wrap;
	margin:10px auto;
}

.smallS{
	width:70px;
	height:70px;
	padding:10px;
	border-radius:6px;
	background:#525CC9;
	text-align:center;
	font-size:25px;
	color:white;
	padding-top:18px;

}

.board{
	width:100%;
	height:110vh;
	background:#2E2F33EB;
	justify-content:center;
z-index:20;
	position:fixed;
	padding:2em;
	display:none;
}

/*pricing table*/
.table{
	border-collapse:collapse;
	margin-top:40px;
}
.table th, td{
	border:3px groove blue;
	padding:5px;
}
.table thead th, tbody td{
	text-align:center;
}
/*img div with centering text*/
.newImgCon{
	position:relative;
}
.newImgCon span{
	position:absolute;
	top:20px;
	left:10px;
}

.newImgCon h2{
	position:absolute;
	top:40px;
	left:10px;
	
}

.newImgCon img{
	width:100%;
	height:auto;
	opacity:0.1;
}

}




/*Mobile responsible code*/

@media screen and (max-width:840px){
*{
margin:0;
padding:0;
box-sizing:border-box;

}

.top{
	width:100%;
	height:80px;
	display:flex;
	background:white;
	position:fixed;
	/*padding-bottom:10px;*/
	z-index:5;
	padding-left:15px;
	justify-content:space-between;
	padding-right:30px;

}

.logo{
	width:80px;
	height:60px;
	padding:5px;
	display:block;

}

.brand{
	width:155px;
	height:65px;
	padding:5px;
	
	
}

/*desktop nav*/
.nav{
	display:flex;
				flex-flow:wrap;
				flex-grow:wrap;
				justify-content:space-evenly;
				height:300px;
				width:100%;
				padding:2em;
				position:fixed;
				background:#232326;
				bottom:-400px;
				transition:all 1.5s;
				z-index:10;
}

/*android display*/
.android{
	display:block;
	color:black;
	font-size:18px;
	padding-top:29px;
	margin-right:25px;
}

#h1{
	font-weight:600;
	font-family:arial;
	padding-top:30px;
}


.nav a {
	font-size:18px;
    width:48%;
	height:70px;
	padding-top:15px;
	border:2px solid blue;
	border-radius:0px;
	text-align:center;
	background:black;
	padding-left:5px;
}

.nav a:hover{
background-color:#EDEDED;
padding-left:8px;
padding-right:8px;
border-radius:10px;

}

.flexy{
	width:100%;
	height:auto;
	display:flex;
	flex-direction:row;
	flex-flow:wrap;
}

.flexy .left{
	width:100%;
	height:auto;
	margin:10px auto;
	padding:1em;
}


.flexy .right{
	width:90%;
	height:auto;
	margin:5px auto;
}


 .banner{
	width:100%;
	height:auto;
	border-radius:20px;
	padding:5px;
	transition: all 2s;

}

.btn1{
	width:150px;
	height:45px;
	padding:5px;
	background:#2134FF;
	border-radius:30px;
	border:none;
	outline:none;
	color:white;
	font-size:17px;
	text-align:center;
	
}

/*set well on mobile*/
.carriage{
	display:flex;
	justify-content:space-evenly;
	margin-left:80px;
	flex-direction:row;
}
.float{
	padding-top:14px;
}


.infoSpecific{
	width:100%;
	
	background:#525CC9;
	border-radius:15px;
	margin:0 auto;
	display:flex;
	justify-content:space-evenly;
	color:white;
	flex-direction:row;
	flex-flow:wrap;
	padding:1em;

}

.icon{
	width:120px;
	height:auto;
	padding:8px;
}

/*desktop*/
.conText{
	height:auto;
	color:white;
	padding-top:0px;
	justify-content:center;
}

.conText h2{
	color:white;
}

.btn2{
	width:150px;
	height:45px;
	padding:5px;
	background:#525CC9;
	border-radius:30px;
	border:none;
	outline:none;
	color:white;
	font-size:17px;
	text-align:center;
	
}



.btn3{
	width:40%;
	height:35px;
	padding:10px;
	background:#2134FF;
	border-radius:12px;
	color:white;
	border:none;
	outline:none;
	display:block;
	text-align:center;
	margin:0 auto;
}

.banner3{
	width:100%;
	height:200px;
	border-radius:30px;
	padding:10px;
	margin-top:30px;
	
}

.bannerCon{
	position:relative;
}
.bannerCon span{
position:absolute;
bottom:50px;
right:110px;
color:white;
font-size:20px;

}

.icns{
	position:absolute;
bottom:45px;
right:60px;
color:white;
font-size:20px;
height:40px;
width:40px;
border-radius:60px;
border:4px solid white;
padding-bottom:4px;
padding-left:6px;
padding-top:2px;


}

.icns:hover{
	background:#EDEDED;
	color:black;
}

.icony{
	width:50px;
	padding:10px;
	display:flex;
}

.inline{
	display:flex;

}

.banner4{
	width:100%;
	height:auto;
	border-radius:30px;
	padding:10px;
	margin-top:30px;
}

/*for desktop edit well*/
.form{
	width:100%;
	height:auto;
	border-radius:30px;
/*	box-shadow:0 2px 4px 4px #EDEDED, 0 2px 4px 4px #EDEDED;*/
	padding-top:10px;
	margin:0 auto;
	padding-left:20px;
	justify-content:space-evenly;
}

.input{
	width:60%;
	height:40px;
	padding:10px;
	outline:none;
	border:2px solid black;
	border-radius:30px;
	margin-left:60px;
	margin-bottom:20px;
}





.schoolLogo{
	width:60%;
	height:auto;
	padding:20px;
	display:block;
	margin:0 auto;
}
	
	/*create slider desktop*/
	.rowa{
		flex-direction:row;
		overflow-x:scroll;
		display:flex;
	justify-content:space-evenly;
	
	margin-bottom:40px;
	
	}
	
	
	.rowa .row_hold{
		height:450px;
	width:100%;
		height:auto;
		background:#EDEDED;
		padding-top:30px;

	}
	
	.row_hold .content_{
		width:200px;
		height:250px;
		background:white;
		border-radius:10px;
		margin-left:10px;
		
		padding-top:10px;
	}
	
	
	.icon1{
		width:100%;
		padding:10px;
		border-top-left-radius:20px;
		border-top-right-radius:20px;
	}
	
	
.icns1{
	width:30px;
	height:30px;
	border:4px solid black;
	border-radius:60px;
	padding-left:3.5px;
}
.icns1:hover{
	background:#EDEDED;
	color:white;
	border:4px solid white;
}


/*footer part*/

.footer{
	width:100%;
	height:auto;
	background:#303030;
	padding:1em;
}


.class{
	width:150px;
	padding:10px;
	margin:0 auto;
	display:block;
}


/*Education page styling*/
.description{
	width:100%;
	height:83vh;
	background:#EDEDED;
	padding:2em;
}

#descip{
	height:50vh
}

/*register*/

.mainForm{
	width:100%;
	height:auto;
	background:white;
	display:block;
	padding-top:10px;
	margin:0 auto;
	
	
}

.logoPosition{
	width:150px;
	padding:10px;
	margin:0 auto;
	display:block;
}

.inForm{
	margin-top:30px;
	width:100%;
	height:45px;
	padding:10px;
	outline:none;
	border:2px solid black;
	border-radius:12px;
}


.select{
	margin-top:10px;
	width:48%;
	height:45px;
	padding:10px;
	outline:none;
	border:2px solid black;
	border-radius:12px;
	background:white;
	margin-bottom:20px;
}



.imG{
	opacity:0.4;
}

.btn4{
	width: 60%;
	height:40px;
	padding:10px;
	border:none;
	border-radius:20px;
	outline:blue;
	color:white;
	text-align:center;
	background:blue;
	margin:0 auto;
	display:block;
	
	

}


.whitepaper{
padding:1em;
}


.contenter{
	width:100%;
	height:auto;
	padding:1em;
	background:#EDEDED;
	border-radius:20px;
	margin:0 auto;
	display:block;
}




.desktop{
	display:none;
	color:black;
	font-size:18px;
	padding-top:29px;
	margin-right:15px;
}

.formBtn{
	width:90%;
	height:40px;
	padding:10px;
	outline:none;
	border:none;
	background:#2134FF;
	color:white;
	border-radius:12px;
	display:block;
	margin:0 auto;
}

.subContent{
	width:90%;
	height:auto;
	display:block;
	margin:auto;
}

.flex-box{
	width:100%;
	height:auto;
	display:flex;
	flex-direction:row;
	flex-flow:wrap;
	flex-grow:nowrap;
}

.smallBox{
	width:100%;
	height:50px;
	padding:1em;
	border:2px solid black;
margin:5px;
}

.demo{
	width:100%;
	height:80vh;
	padding:1em;
	background:#25294D;
	margin-top:10px;
	color:white;
	font-family:palladio;font-size:35px;
}

@media screen and (min-width:800px){
.demo{
	width:100%;
	height:100vh;
	padding:1em;
	background:#25294D;
	margin-top:10px;
	color:white;
	font-family:palladio;font-size:35px;
	display:none;
}
}

/*payment form mobile*/

.payment_form{
	width:100%;
	height:auto;
	padding:1em;
	margin:0 auto;
	border:1px groove blue;
	background:white;
	justify-content:center;
	display:block;
	border-radius:10px;

}

.pInput{
	width:100%;
	height:50px;
	padding:1em;
	border:1px groove grey;
	color:black;
}

.pSelect{
	width:100%;
	height:50px;
	padding:1em;
	border:1px groove grey;
	color:black;
	background:transparent;
	margin-bottom:15px;
}

.pBtn{
	width:95%;
	height:45px;
	padding:1em;
	border:none;
	color:white;
	background:#25294D;
	margin:0 auto;
	border-radius:8px;
	display:block;

}
.payment_receipt{
	width:90%;
	height:auto;
	padding:1em;
	margin:0 auto;
	border:1px groove blue;
	background:white;
	justify-content:center;
	display:block;
	border-radius:10px;
}
/*profile image*/
.profile{
	width:50px;
	height:50px;
	border-radius:100px;
	border:2px solid #EDEDED;
	padding:5px;

	margin-top:10px;
}

.tri{
	display:flex;
	justify-content:space-between;
	flex-direction:row;
	padding-right:6px;
}



.body .left{
	width:100%;
	height:50vh;
	padding:1em;
    margin:0 auto;
    color:white;
background:black;
text-align:center;
font-size:25px;
border-radius:15px;	
transition: all 1s;
position:fixed;
bottom:-400px;
z-index:10;
}

.body .right{
	width:100%;
	background:#EDEDED;
	height:107vh;
padding:1em;
}




	
	.logoBrand{
	width:180px;
	height:80px;
	padding:5px;
	display:block;
	margin:30px auto;
	
	
}


.flex-box .left{
	width:100%;
	height:auto;
	
}




/*register rebuild*/
.box_form{
	width:100%;
	height:auto;
	padding:1em;
	background:tarnsparent;
	border:none;
	border-radius:20px;
	display:block;
	margin:0 auto;

}


.modernInput{
	width:100%;
	height:40px;
	padding:1em;
	border:1px groove #EDEDED;
	background:transparent;
	outline:none;
	border-radius:8px;
	margin-bottom:30px;
	display:block;
	color:white;
}

.modernInput::placeholder{
	color:white;
}
	
.modernButton{
	width:90%;
	height:40px;
	padding:10px;
	border:1px groove #EDEDED;
	background:transparent;
	outline:none;
	border-radius:8px;
    margin:0 auto; 
	display:block;
	color:white;
	text-align:center;

}
.paddingtop{
	padding-top:5px;
}



.select{
	margin-top:10px;
	width:48%;
	height:45px;
	padding:10px;
	outline:none;
	border:2px solid white;
	border-radius:12px;
	background:tarnsparent;
	margin-bottom:10px;
	color:white;
}





/*image slider design*/
.mySlides {display: none;}
.sliderImg {
vertical-align: middle;
border-radius:10px;
}

/* Slideshow container */
.slideshow-container {
  width: 95%;
  position: static;
  margin:0 auto;
  overflow-x: scroll;
}


/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 18px;
  font-weight:800;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}


/* Slide-in animation */
.slide-in {
  -webkit-animation: slideIn 1.5s linear;
  animation: slideIn 1.5s ease-in-out;
}

@-webkit-keyframes slideIn {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

@keyframes slideIn {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}

.iconX{
	width:45px;
	padding:5px;
	border-radius:80px;
}


/*desktop displayof rotating logo*/
.RT{
	width:100px;
	height:auto;
	display:block;
	margin:0 auto;
	transition:all 2s;
animation-name:myRT;
animation-iteration-count:infinite;
animation-duration:3s;


}


@keyframes myRT{
	from{
		transform: rotateX(-90deg);
	}
	to{
		transform: rotateX(-360deg);
	}
}



.preloader{
	width:100%;
	height:110vh;
	background:white;
	justify-content:center;
z-index:20;
	position:fixed;
}


.margin{
margin-top:25vh;
}




.cashbox{
	width:90%;
	height:auto;
	padding:2em;
	border-radius:12px;
	background:#525CC9;
	margin:0 auto;
	color:white;
}


.progressCon{
	width:90%;
	height:20px;
	padding-top:0px;
	padding-left:0px;
	padding-right:30px;
	border-radius:20px;
	border:0.5px groove #4AB125;
	background:white;
}
.progressHos{
	width:100%;
	height:20px;
	border-radius:20px;
	
	
}

.progress1{
	width:30%;
	height:19px;
	border-radius:10px;
	background:#4AB125;
	transition:all 2s;
}

.cashbox{
	width:90%;
	height:auto;
	padding:2em;
	border-radius:12px;
	background:#525CC9;
	margin:0 auto;
	color:white;
}

/*text animi*/
ul h1{
  font-size: 30px;
  font-weight: 600;

  letter-spacing: 2px;
  color: #484848;
  animation:light 4s linear infinite
}
@keyframes light{
  0%{
    color: blue;
    text-shadow: none;
	animation-delay:0.5s;
  }
  50%{
    color: fuchsia;
    text-shadow: none;
	animation-delay:1s;
  }
  100%{
    color: black;
    text-shadow: 0 0 7px #EDEDE, 0 0 50px #fff900;
	animation-delay:1.5s;
  }
}

/*contact style by daniel akachukwu*/
.topper{
	width:100%;
	height:auto;
	padding:1em;
	text-align:center;
	font-family:palladio;
	color:white;
	background:#525CC9;
} 


.contactBox{
	display:flex;
	flex-direction:column;
	flex-flow:wrap;
	width:100%;
	margin:5px auto;
	justify-content:space-evenly;
}

.contactBox .box{
	width:100px;
	height:auto;
	border-radius:8px;
	border:1px outset black;
	justify-content:center;
	padding:2em;
	margin:8px;
}


.imgContact{
	width:40px;
	height:40px;
	border-radius:160px;
	padding:5px;
	display:block;
	margin:8px auto;
}
.contactBox p{
	text-align:center;
}




/*services box*/
.service{
	width:100%;
	height:auto;
	padding:1em;
	border-radius:15px;
	background:white;
	display:block;
	justify-content:space-evenly;
	flex-flow:wrap;
	margin:10px auto;
}

.smallS{
	width:70px;
	height:70px;
	padding:10px;
	border-radius:6px;
	background:#525CC9;
	text-align:center;
	font-size:25px;
	color:white;
	padding-top:18px;

}

/*alerts*/
/* Your Custom CSS Styles */

.alert {
  padding: 5px;
  border: 1px solid #ddd;
  border-radius: 4px;
  height: auto;
}

.alert.success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}

.alert.warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}

.alert.danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}
	
.board{
	width:100%;
	height:110vh;
	background:#2E2F33EB;
	justify-content:center;
z-index:20;
	position:fixed;
	padding:2em;
	display:none;
}



.table{
	border-collapse:collapse;
	margin-top:40px;
}
.table th, td{
	border:3px groove blue;
	padding:5px;
}
.table thead th, tbody td{
	text-align:center;
}



}