*{margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;box-sizing:border-box;}
body{background-color:#000;color:#f2f2f2;}
a{text-decoration:none;color:lightyellow;}
a:hover{color:yellow;font-weight:bold;}

title::first-letter{text-transform:capitalize;}

#mainview{display:none;position:relative;}

header{background-color:#123;position:fixed;top:0;width:100%;z-index:3;}
header img{width:30px;margin:10px;}
header button{background-color:transparent;height:100%;
    font-weight:bold;font-size:28px;color:#fff;border:none;
    position:absolute;top:0;right:0;cursor:pointer;padding:0 15px;}
header button:hover{background-color:#000;}
nav{display:flex;flex-direction:column;z-index:2;
    background-color:#123;height:90%;width:100%;max-width:250px;
    position:fixed;top:52px;left:-250px;transition:0.5s;
    padding:30px 0;}
nav a{font-size:28px;margin:10px 0;padding:10px;display:block;}
nav a:hover{background-color:#000;}

#navbg{position:absolute;top:0;left:0;width:100%;height:100%;
    background-color:#000;opacity:0.5;z-index:1;display:none;cursor:alias;}

.material-icons{font-size:36px;}
.gihome{color:#0090e7;}
.gipeople{color:#00d25b;}
.gievent{color:#ffab00;}
.giassignment_returned{color:#fc424a;}

main{margin:70px 10px;}

/* login view */

#loginview{display:none;}
.bg-img{
    /*background-image: url("img/loginbg.jpg");*/
    background-color:#000;
    /*min-height: 900px;*/
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
  
  	display: flex;
	align-items: center;
	height: 10vh;
	flex-direction: column;
}

/* Add styles to the form container */
#loginform h3{text-align:center;margin:20px 0;}
#loginform h1{margin:20px 0;}
#loginform{margin:20px;max-width:300px;padding:16px;
    background-color:#123;border-radius: 5px;}

/* Full-width input fields */
input[type=email], input[type=password] {
    border-radius: 5px;
    width: 100%;
    padding: 15px;
    margin: 5px 0 22px 0;
    border: none;
    background: #f1f1f1;
}
input[type=email]:focus,input[type=password]:focus{
  background-color: #ddd;
  outline: none;
}

/* Set a style for the submit button */
#loginform button{
	margin-top:20px;border-radius: 5px;
  background-color: #04AA6D;
  color: white;
  padding: 16px 20px;
  border: none;
  cursor: pointer;
  width: 100%;
  opacity: 0.9;
}
#loginform button:hover{opacity:1;}

#errmsg{color:red;margin-top:10px;}