*{
 margin: 0;
 padding: 0;
}

html{
    width: 100vw;
    height: 100vh;
}

body{
 background-repeat: no-repeat;
 background-attachment: fixed;
 background-size: cover;
 background-position: top;
 background-image:url(northern.jpg);
 width: 100%;
 height: 100%;
 font-family: monospace;
 letter-spacing: 0.02em;
  font-weight: 400;
 -webkit-font-smoothing: antialiased; 
}

html,body {
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

.blurred-box{
  position: relative;
  width: 250px;
  height: 350px;
  top: calc(50% - 175px);
  left: calc(50% - 125px);
  background: inherit;
  border-radius: 2px;
  overflow: hidden;
}

.blurred-box:after{
 content: '';
 width: 300px;
 height: 300px;
 background: inherit; 
 position: absolute;
 left: -25px;
 left position
 right: 0;
 top: -25px;  
 top position 
 bottom: 0;
 box-shadow: inset 0 0 0 200px rgba(255,255,255,0.05);
 filter: blur(10px);
}


.info-box{
  position: relative;
  margin-top: 50px;
  text-align: center;
  z-index: 1;
}
.info-box > *{
  display: inline-block;
  width: 200px;
}

.user-icon{
  width: 100px;
  height: 100px;
  position: relative;
  border-radius: 50%;
  background-size: contain;
  background-image: url(philosopher.jpg);
}

.user-name{
  margin-top: 15px;
  margin-bottom: 15px;
  color: white;
}

.styled-table {
    border-collapse: collapse;
    margin: 25px 0;
    font-size: 14pt;
    font-family: monospace;
    min-width: 400px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}

.styled-table thead tr {
    background-color: #009879;
    color: #ffffff;
    text-align: left;
}

.styled-table th,
.styled-table td {
    padding: 12px 15px;
}

.styled-table tbody tr {
    border-bottom: thin solid #dddddd;
}

.styled-table tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
}

.styled-table tbody tr:last-of-type {
    border-bottom: thin solid #009879;
}

.styled-table tbody tr.active-row {
    font-weight: bold;
    color: #009879;
}

.styled-table2 {
    border-collapse: collapse;
    margin: 25px 0;
    font-size: 11pt;
    font-family: monospace;
    min-width: 400px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}

.styled-table2 thead tr {
    background-color: #009879;
    color: #ffffff;
    text-align: left;
}

.styled-table2 th,
.styled-table2 td {
    padding: 12px 15px;
}

.styled-table2 tbody tr {
    border-bottom: thin solid #dddddd;
}

.styled-table2 tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
}

.styled-table2 tbody tr:last-of-type {
    border-bottom: thin solid #009879;
}

.styled-table2 tbody tr.active-row {
    font-weight: bold;
    color: #009879;
}

ol,ul {
	list-style: none;
}

#mainMenu {
	margin: 10px;
	width: 900px;
        align: center;
	font-family: monospace;
}

#mainMenu li {
	display:block;
        float:left;
	width:120px;
	smargin-left:2px;
	border:1px solid #000;
}

#mainMenu a {
	display:block;
	padding:3px;
	text-decoration:none;
	background-color:#fff;
	color:#009;
}

#mainMenu a:hover {
	background-color:#009;
	color:#fff;
}

.menu_nav ul {
    list-style: none;
    margin: 0 auto;
    width: 85%;
}

ul{
   width: 100%;
   display: table;
   text-align: center;
}

ul li{
     display: inline-block;
     float: none;
}

* {
  margin: 0;
  padding: 0;
}
.wrapper {
  padding-top: 10px;
  width: 700px;
  margin-left: auto; 
  margin-right: auto;
  overflow: hidden;
}

h1 {
  text-shadow: 2px 2px 4px #000000;
  color:white;
}

h2 {
  text-shadow: 2px 2px 4px #000000;
  color:white;
}

h3 {
  text-shadow: 2px 2px 4px #000000;
  color:white;
}

h4 {
  text-shadow: 2px 2px 4px #000000;
  color:white;
}

h5 {
  text-shadow: 2px 2px 4px #000000;
  color:white;
}

h6 {
  text-shadow: 2px 2px 4px #000000;
  color:white;
}

p {
  text-shadow: 2px 2px 4px #000000;
  color:white;
}

.text-slider-items { 
        display: none; 
    } 

div.a {
  text-align: center;
  colour: white;
}

.footer{ 
       position: fixed;     
       text-align: left;    
       bottom: 0px; 
       width: 100%;
   }  

.monospace {
  font-family: "Lucida Console", Courier, monospace;
}

.button {
  display: inline-block;
  padding: 6px 10px;
  font-size: 8pt;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #fff;
  background-color: #4CAF50;
  border: none;
  border-radius: 0.5px;
  box-shadow: 0 0.5px #999;
}

.button:hover {background-color: #3e8e41}

.button:active {
  background-color: #3e8e41;
  box-shadow: 0 0.5px #666;
  transform: translateY(4px);
}

#university {
  background: url(ntuwhite.png) top left no-repeat;
  background-size: contain;
  padding: 15px;
}

table, th, td {
  border: 1px solid black;
  color: white;
  font-size:12px;
}

table.center {
  margin-left: auto; 
  margin-right: auto;
}

div.parent{
border: solid black 1px;
display: table;
padding: 5px;
width: 100%;
margin: 5px 0;
}

div.text{
vertical-align: middle;
display: table-cell;
text-align: right;
}

div.parent .img{
vertical-align: middle;
display: table-cell;
padding-right: 0px;
width: 20%;
}

div.img img{
width: 100%;
height:auto;
vertical-align: middle;
}