*{
	margin:0;
	padding:0;
	box-sizing:border-box;
	font-family:arial;
}

.data-form{
	max-width:600px;
	width:95%;
	padding:20px;
	border:2px solid #efefef;
	margin:100px auto;
	font-family:arial;
}

.data-form h1{
	color:steelblue;
	text-align:center;
}

.form-input{
	width:100%;
	height:40px;
	margin:10px 0;
}

.submit-btn{
	width:100%;
	height:40px;
	font-weight:bold;
	font-size:1.2em;
	color:white;
	border:none;
	background:steelblue;
}

.danger{
	width:100%;
	background:tomato;
	color:white;
	padding:10px;
}

.success{
	width:100%;
	background:#AFE1AF;
	color:white;
	padding:10px;
}

.form-select{
	width:100%;
	height:40px;
	margin:10px 0;
}

.table{
	margin:30px 0;
	width:100%;
	border-collapse:collapse;
	font-size:0.9em;
}

.table tr th{
	background:#333;
	color:#fff;
	
	height:30px;
}

.table tr td{
	height:30px;
	padding:5px;
}

.table tr:nth-child(even){
	background:rgba(216, 255,255, 1);
}

.nav{
	margin:20px auto;
	background:steelblue;
	padding:5px;
	width:100%;
}

.nav a{
	color:white;
	text-decoration:none;
	font-size:0.90em;
}

.nav a:hover{
	font-weight:bold;
	
}

.top-bar{
	background:steelblue;
	color:white;
	padding:10px;
	text-align:center;
	display:flex;
	justify-content:space-between;
	align-items:center;
}

.wrapper{
	padding:20px;
	display:flex;
	justify-content:space-between;
}

.sidebar{
	width:25%;
	border:2px solid #eee;
	height:auto;
}

.sidebar-title {
	padding:10px;
	background:skyblue;
	color:#333;
}

.sidebar-main{
	padding:10px;
	
}

.main{
	width:70%;
	border:2px solid #eee;
	height:auto;
}

.main-title{
	padding:10px;
	background:skyblue;
	color:#333;
}

.main-body{
	padding:20px;
	font-size:1.2em;
	font-family:arial;
}

.mylink{
	display:block;
	margin:10px 0;
}

.gradebook{
	display:block;
	text-decoration:none;
	background:red;
	color:white;
	padding:10px;
}

.gradebook-table{
	width:100%;
	margin:10px auto;
	border-collapse:collapse;
	border:1px solid #333;
}

.gradebook-table thead tr {
	height:40px;
	background:steelblue;
	color:white;
	text-align:left;
	font-size:1.0em;
	padding:5px;
	border:1px solid #333;
}

.gradebook-table thead tr th{
	padding:5px;
	border:1px solid #333;
}

.gradebook-table tbody tr {
	height:30px;
	border:1px solid #333;
	font-size:0.9em;
	
}

.gradebook-table tbody tr:nth-child(even) {
	background-color:rgba(0,128,129,0.05);
		
}

.gradebook-table tbody td {
	padding:5px;
	font-size:0.9em;
	border:1px solid #333;
	text-align:left;
	
}

.sex{
	margin-left:5px;
}

.radio:last-child{
	margin-bottom:20px;
}

.label{
	margin-bottom:10px;
}
.update{
	color:green;
	text-decoration:none;
	font-size:0.8em;
	font-weight:bold;
	}
.delete{
	color:red;
	text-decoration:none;
	font-size:0.8em;
	font-weight:bold;
	
}


.my-table table{
	width:100%;
	border:1px solid #333;
	border-collapse:collapse;
	padding:5px;
}

.my-table table tr{
	height:30px;
	border:1px solid #333;
}


.my-table table tr:first-child{
	background:#333;
	color:white;
}

.my-table table td{
	border:1px solid #333;
	padding:5px;
}


.my-table table th{
	border:1px solid #333;
	padding:5px;
}

.heading{
	margin-bottom:1rem;
}
/*Login Form Begin*/
.login-wrapper{
	width:100%;
	height:100vh;
	display:flex;
	justify-content:center;
	align-items:center;
	background:#f2f2f2;
	}

.login{
	width:90%;
	max-width:450px;
	border:2px solid #efefef;
	padding:20px;
	background:white;
	font-weight:bold;
}

.login-form{
	height:40px;
	width:100%;
	padding:10px;
}

.button-submit{
	width:100%;
	height:40px;
	background:steelblue;
	cursor:pointer;
	border:none;
	color:white;
	font-size:1.0rem;
}

form div{
	margin-bottom:10px;
	font-family:arial;
}

.login h1{
	margin-bottom:30px;
	text-align:center;
	font-family:arial;
	color:steelblue;
}
/*Login Form End*/

.student-link a{
	text-decoration:none;
	display:block;
	width:95%;
	max-width:200px;
	margin:10px 0;
	background:#ff2400;
	color:white;
	padding:10px;
	font-size:0.8em;
	font-weight:bold;
	border-radius:7px;
	text-align:center;
	
}

.fi{
	width:100%;
	padding:10px;
}

h1{
	margin:20px 0;
}

.mylink{
	text-decoration:none;
	font-family:arial;
	font-size:0.8rem;
	color:#333;
	font-weight:bold;
	border-bottom:1px solid #eee;
	padding-bottom:10px;
}

.mylink:hover{
	text-decoration:underline;
}

.table thead tr th{
	text-align:left;
}
.logo{
	width:100px;
	margin:0 auto;
}

.logo img{
	width:100%;
	
}

.top-bin{
	text-align:center;
	width:100%;
	
}


.top-bin p{
	font-weight:bold;
	font-size:0.85em;
	
}


.top-bin h3{
	margin:20px 0;
	
}

.bivis{
	font-size:2rem;
	font-weight:bold;
}

.term{
	width:100%;
	display:flex;
	justify-content:space-between;
	align-items:center;
	height:50px;
	
	
}

.report-wrapper{
	display:flex;
	justify-content:space-between;
	align-items:flex-start;	
}

.badge{
	width:110px;
}

.badge img{
	max-width:100%;
}

.report-blanket{
	padding:10px;
}

.address{
	text-align:right;
}
.address h1{
	margin:0;
	font-size:1.7rem;
	font-weight:bold;
	color:#333;
}


.address p{
	font-size:0.8rem;
	font-weight:bold;
	color:#333;
}

.bio-wrapper{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-top:30px;
}

.bio:nth-child(2){
	text-align:right;
}

.bio h3{
	font-size:1.3rem;
}
.bio p{
	font-size:0.9rem;
}

.acada{
	font-size:1.1rem;
}

.report-card{
	border:3px solid black;
	width:100%;
	border-collapse:collapse;
	margin-top:20px;
}

.report-card tr th{
	border:1px solid #333;
	font-size:0.8rem;
	padding:5px;
}

.report-card tr td{
	border:1px solid #333;
	font-size:0.8rem;
	padding:5px;
}

.cumulative{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-top:30px;
	
}
.grade {
	
	width:15%;
}

.grade:nth-child(2) {
	text-align:right;
	width:20%;
}
.grades{
	border-collapse:collapse;
	width:100%;
	border:3px solid #333;
}

.grades tr td{
	border:1px solid #333;
	font-size:0.8rem;
	padding:5px;
}

.grade h1{
	margin:0;
	font-size:1.5rem;
	font-weight:bold;
	color:#333;
}

.ht{
	margin-top:50px;
	font-weight:bold;
	text-align:left;
	width:30%;
	
}

.our-date{
	font-size:0.9rem;
}

.toplink a{
	text-decoration:none;
	background:#d26632;
	color:white;
	padding:5px 7px;
	border-radius:3px;
	margin-right:5px;
	margin-bottom:30px;
}


.toplink a:hover{
	background:orange;
}

.cb{
	display:block;
	width:100%;
}

.df{
	width:95%;
	margin:0 auto;
	border:1px solid #e5e5e5;
	padding:10px;
}

.blanket{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
	border:1px solid #e5e5e5;
	padding:10px;
	height:auto;
	
	}

.left{
	
	width:30%;
	
		
}


.right{
	width:68%;
	border:1px solid #e5e5e5;
	padding:10px;

}
#rights{
	padding:5px;
}
.toppie{
	margin-bottom:10px;
}

.top{
	margin-bottom:30px;
	background:#eeeeee;
	padding:20px;
	height:100%;
}

.bottom{
	margin-bottom:30px;
	background:#eeeeee;
	padding:20px;
}
.supertab{
	width:100%;
	border:1px solid #eeeeee;
	border-collapse:collapse;
}

.supertab thead tr{
	background:#333;
	color:white;
	height:30px;
	text-align:left;
	
}

.supertab thead tr th{
	padding:5px;
	
}

.supertab tbody tr td{
	padding:5px;
	border:1px solid #eee;
}
.top-header{
	color:teal;
	margin-bottom:10px;
}
.bucket-head{
    background:red;
    color:white;
}