<style type="text/css">

.contactform{
width: 50%;
font-size: 16px; /* Primary font size of form. Contained elements' font size are all relative to this setting */

margin: 0 auto;


}


.contactform input, .contactform textarea{
width: 100%;
border-radius: 5px;
border: 1px solid gray;
font: normal 1.5em auto; /* 24px, or 16px x 1.5 */
padding: 0.4166666666666667em; /* 10px, or 24px x 0.4166666666666667 */
box-shadow: 0 0 10px #fff inset;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.contactform textarea{
resize:vertical; /* allow vertical resize of textarea */
height: 150px;
}


.contactform input:focus, .contactform textarea:focus{
box-shadow: 0 0 10px green inset;
}


.contactform input[type="radio"], .contactform input[type="checkbox"]{
padding: 0;
width: auto;
height: auto;
border-radius: 0;
}

.contactform select{
/*
width: 80%;
font-size: 1.5em;
border: 2px solid #eee;
*/

width: 100%;
border-radius: 5px;
border: 1px solid gray;
font: normal 1.5em auto; /* 24px, or 16px x 1.5 */
padding: 0.4166666666666667em; /* 10px, or 24px x 0.4166666666666667 */
box-shadow: 0 0 10px #fff inset;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
height:50px;

}

.contactform .formcolumn{ /* column div inside form */
width: 49%;
float: left;
margin-bottom:15px;


}



.contactform .formcolumn:first-of-type{
margin-right: 2%; /* 2% margin after first column */
}

.contactform .formcolumn label, #contactform .formcolumn fieldset{
font: bold 0.8em Verdana; /* font size is 12.8px, or 16 x 0.8 */
text-transform: camelcase;
display: block;
margin-top: 2em;
margin-bottom: -20px;
}



label{
font: bold 0.8em Verdana; /* font size is 12.8px, or 16 x 0.8 */
text-transform: camelcase;
display: block;
margin-top: 2em;
margin-bottom: -20px;
}

fieldset {
  border: 2px solid #000;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  -moz-box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
 background: rgb(30, 50, 230);
  
  background: -moz-linear-gradient(270deg, rgb(242,230,255) 7%, rgb(242,230,255) 99%);
  background: -webkit-linear-gradient(270deg, rgb(242,230,255) 7%, rgb(242,230,255) 99%);
  background: -o-linear-gradient(270deg, rgb(242,230,255) 7%, rgb(242,230,255) 99%);
  background: -ms-linear-gradient(270deg, rgb(242,230,255) 7%, rgb(242,230,255) 99%);
  background: linear-gradient(270deg, rgb(242,230,255) 7%, rgb(242,230,255) 99%); 
}

legend {
  /*text-shadow: 2px 2px 3px rgba(150, 150, 150, 0.75);*/
  font-family:Verdana, Geneva, sans-serif;
  font-size:1.4em;
  color:rgb(255,255,255);
  border-top: 2px solid #000;
  border-left: 2px solid #000;
  border-right:  2px solid #000;
  border-radius: 10px;
  -webkit-box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  -moz-box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  padding: 3px;
  background: rgb(30, 50, 230);
  background: -moz-linear-gradient(270deg, rgb(111,32,121) 7%, rgb(111,32,121) 99%);
  background: -webkit-linear-gradient(270deg, rgb(111,32,121) 7%, rgb(111,32,121) 99%);
  background: -o-linear-gradient(270deg, rgb(111,32,121) 7%, rgb(111,32,121) 99%);
  background: -ms-linear-gradient(270deg, rgb(111,32,121) 7%, rgb(111,32,121) 99%);
  background: linear-gradient(270deg, rgb(111,32,121) 7%, rgb(111,32,121) 99%); 
}


.contactform fieldset{
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.contactform .formcolumn label:first-child, .contactform .formcolumn fieldset:first-child{
margin-top: 25px; /* first label or fieldset within each column should not no top margin */
}

.contactform fieldset ul{
list-type: none;
margin: 0;
padding: 0;
}

.contactform fieldset ul li{
display: inline-block;
margin-bottom: 5px;
margin-right: 1em;
}

.contactform div.buttons{
clear: both;
text-align: center;
}

.contactform input.button{
margin-top: 1.5EM;
width: 50%;
box-shadow: 0 0 10px gray;
text-transform: uppercase;
cursor: pointer;
min-width: 100px;
max-width: 600px;
color: white;
font-weight: bold;
letter-spacing: 7px;
text-shadow: 0 -2px 1px #8a8a8a;
background: rgb(169,3,41);
background: -moz-linear-gradient(top,  rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(169,3,41,1)), color-stop(44%,rgba(143,2,34,1)), color-stop(100%,rgba(109,0,25,1)));
background: -webkit-linear-gradient(top,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%);
background: -o-linear-gradient(top,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%);
background: -ms-linear-gradient(top,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%);
background: linear-gradient(to bottom,  rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 );
}

.contactform input.button:active{
text-shadow: 0 0 1px #8a8a8a;
background: rgb(109,0,25);
background: -moz-linear-gradient(top,  rgba(109,0,25,1) 0%, rgba(143,2,34,1) 56%, rgba(169,3,41,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(109,0,25,1)), color-stop(56%,rgba(143,2,34,1)), color-stop(100%,rgba(169,3,41,1)));
background: -webkit-linear-gradient(top,  rgba(109,0,25,1) 0%,rgba(143,2,34,1) 56%,rgba(169,3,41,1) 100%);
background: -o-linear-gradient(top,  rgba(109,0,25,1) 0%,rgba(143,2,34,1) 56%,rgba(169,3,41,1) 100%);
background: -ms-linear-gradient(top,  rgba(109,0,25,1) 0%,rgba(143,2,34,1) 56%,rgba(169,3,41,1) 100%);
background: linear-gradient(to bottom,  rgba(109,0,25,1) 0%,rgba(143,2,34,1) 56%,rgba(169,3,41,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d0019', endColorstr='#a90329',GradientType=0 );
}


div.clsloading {
    height: 10em;
    position: relative }
div.clsloading img {
    margin: 0;
    background: yellow;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%) }

@media screen and (max-width: 480px){ /* responsive form settings, when window width is 480px or less */

	.contactform{
	width: 100%;	
	font-size: 14px; /* decrease form font size */
	}
	
	.contactform .formcolumn{
	width: 100%;
	float: none;
	}
	
	.contactform .formcolumn:first-of-type{
	margin-right: 0; /* remove right margin from first form column */
	}

	.contactform .formcolumn:nth-of-type(2){
	padding-top: 1em; /* add padding to top of 2nd form column, so there is a gap between the 1st and 2nd column */
	}

	.contactform select{
	width: 100%;
	}	

}


#tblclassresults{ 
  width: 99%; 
  padding:0;
  border-collapse: separate;
}


.tblclass{ 
  width: 100%; 
  padding:0;
  border-collapse: separate;  
}

.tblclass th { 
  background: #780A97; 
  color: white; 
  font-size: 10pt;
  font-weight: bold; 
  border: 1px solid #fff;
}

.tblclassupdate th { 
  background: #780A97; 
  color: white; 
  font-size: 10pt;
  font-weight: bold; 
  border: 1px solid #fff;
}

.tblupdate{ 
  width: 100%; 
  padding:0;
  border-collapse: separate;  
}

.tblupdate th { 
  background: #F7F8E0; 
  color: white; 
  font-size: 10pt;
  font-weight: bold; 
  border: 1px solid #fff;
}

#tbltimetable th { 
  background: #780A97; 
  color: white; 
  font-size: 10pt;
  font-weight: bold; 
  border: 1px solid #fff;
}


.tbltimetable{ 
  width: 100%; 
  padding:0;
  border-collapse: separate;
  

}

.tblhalftable{ 
  width: 100%; 
  padding:0;
  border-collapse: separate;
  

}

.tbltimetable th { 
  background: #780A97; 
  color: white; 
  font-size: 10pt;
  font-weight: bold; 
  border: 1px solid #fff;
}

th.tblclash { 
  background: red; 
  color: white; 
  font-size: 10pt;
  font-weight: bold; 
  border: 1px solid #fff;
}


td.timetable_data
{
	text-align: center;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;
	background-color: #C6C5C5;
	padding-top:0px;
	padding-bottom:0px;  
	border: 1px solid #fff;

	
}

td.timetable_data_updated
{
	text-align: center;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;
	background-color: #FF0000;
	padding-top:0px;
	padding-bottom:0px;  
	border: 1px solid #fff;	
}

td.main_row
{
	text-align: left;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;
	background-color: #959393;
	//white-space:nowrap;
	padding-top:0px;
	padding-bottom:0px;  
	border: 1px solid #fff;

	
}


td.default_data
{
	text-align: left;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;
	background-color: #C6C5C5;
	padding-top:0px;
	padding-bottom:0px;  
	border: 1px solid #fff;
	
}


td.update_data
{
	text-align: left;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;
	background-color: #F7F8E0;
	padding-top:0px;
	padding-bottom:0px;  
	border: 1px solid #BDBDBD;
	
}

td.defaultcentereddata
{
	text-align: center;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;
	background-color: #C6C5C5;
	padding-top:0px;
	padding-bottom:0px;  
	border: 1px solid #fff;
	
}

td.published_data
{
	text-align: left;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;
	background-color: #46a229;
	padding-top:0px;
	padding-bottom:0px;  
	border: 1px solid #fff;  
}

#filters 
{
	border: 0px solid #e3e3e3;
	text-align: left;
	background-color: #cea6d9;
	border: 1px groove #44036f;
	height: 65px;
	width:100%;
	-moz-border-radius:4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	border-radius: 4px;
	padding-top:0px;
	padding-bottom:0px;	  
	  
	  
}

#filters td
{
	text-align: left;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;
	background-color: #C6C5C5;
	border: 1px solid #fff;
	padding-top:0px;
	padding-bottom:0px;	
	
}

@media only screen and (max-width:620px)
{
	#tblclassresults{ 
		display:none;
	}
}


    ul#navmenu ul
    {
    display:none;
   
     position:absolute;
    left:0;
    top:20px;
    }
    ul#menu li
    {
    display:block;
     
    }
    ul#navmenu li:hover ul {
    display: block;
    width:150px;
    
    }

    ul#navmenu li:hover ul li a{
    display: block;
    color:red;
    }


.row {
	width: 100%;
	text-align: left;
}

.block {
	width: 130px;
	display: inline-block;
	zoom: 1;
}

#result{
	margin-left:5px;
}

#passwordchange .short{
	color:#FF0000;
}

#passwordchange .weak{
	color:#E66C2C;
}

#passwordchange .good{
	color:#2D98F3;
}

#passwordchange .strong{
	color:#006400;
}


#forgotresult{
	margin-left:5px;
}

#dvforgotpassword .short{
	color:#FF0000;
}

#dvforgotpassword .weak{
	color:#E66C2C;
}

#dvforgotpassword .good{
	color:#2D98F3;
}

#dvforgotpassword .strong{
	color:#006400;
}

.exam_rules_ul {
    margin: 0 0 1em 0;
    padding: 0 0 0 1em; /* make space for li's :before */
    list-style: none;
}

.custom-counter {
    margin-left: 0;
    padding-right: 0;
    list-style: alpha inside none;
}
.exam_rules_li {
    position: relative;
    list-style: alpha;
    padding-left: 1.5em; /* text distance to icon */
    
	text-align: left;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;    
	

}
.exam_rules_typea {
    position: relative;
    list-style: lower-alpha;
    
    padding-left: 1.5em; /* text distance to icon */
    
	text-align: left;
	font-size: 10pt;
	color: #000000;
	font-family: Tahoma, sans-serif;    
}

div#box{
	margin-top:15px;
}
.box-top{
	color:#fff;
	text-shadow:0px 1px #000;
	background-color:#fff;
	padding:5px;
	padding-left:15px;
	font-weight:300;
	border: 1px groove #fff;
  	-moz-border-radius:4px;
  	-webkit-border-radius: 4px;
  	-khtml-border-radius: 4px;
  	border-radius: 4px;		
}	

.box-panel{
	padding:15px;
	background-color:#fff;
}

a.main_menu:link {color:#0000ff;text-decoration:none;}
a.main_menu:visited {color:#0000ff;text-decoration:none;}
a.main_menu:hover {font-size:150%;}


.defined_paragraphs { 
  font-family:Verdana, Geneva, sans-serif;
  font-size:1.4em;
}
ol.d {list-style-type: lower-alpha;}

ol.d, ol.d > li { list-style-type: numeric; }


.dashboard {
  border: 2px solid #000;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  -moz-box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
 background: rgb(30, 50, 230);
  background: -moz-linear-gradient(270deg, rgb(255,255,204) 7%, rgb(255,255,204) 99%);
  background: -webkit-linear-gradient(270deg, rgb(255,255,204) 7%, rgb(255,255,204) 99%);
  background: -o-linear-gradient(270deg, rgb(255,255,204) 7%, rgb(255,255,204) 99%);
  background: -ms-linear-gradient(270deg, rgb(255,255,204) 7%, rgb(255,255,204) 99%);
  background: linear-gradient(270deg, rgb(255,255,204) 7%, rgb(255,255,204) 99%); 
 
}

.dashboardLegend {
  /*text-shadow: 2px 2px 3px rgba(150, 150, 150, 0.75);*/
  font-family:Verdana, Geneva, sans-serif;
  font-size:1.4em;
  color:#000;
  border-top: 2px solid #000;
  border-left: 2px solid #000;
  border-right:  2px solid #000;
  border-radius: 10px;
  -webkit-box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  -moz-box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  box-shadow: 4px 4px 5px rgba(50, 50, 50, 0.75);
  padding: 3px;
  background: rgb(30, 50, 230);
  background: -moz-linear-gradient(270deg, rgb(255,255,153) 7%, rgb(255,255,153) 99%);
  background: -webkit-linear-gradient(270deg, rgb(255,255,153) 7%, rgb(255,255,153) 99%);
  background: -o-linear-gradient(270deg, rgb(255,255,153) 7%, rgb(255,255,153) 99%);
  background: -ms-linear-gradient(270deg, rgb(255,255,153) 7%, rgb(255,255,153) 99%);
  background: linear-gradient(270deg, rgb(255,255,153) 7%, rgb(255,255,153) 99%); 
}



div.stars {
	width: 280px;
  	display: inline-block;	
}

input.star { display: none; }

label.star {
  float: right;
  padding: 10px;
  font-size: 36px;
  color: #444;
  transition: all .2s;
  margin: 0 0 0 0;
}

input.star:checked ~ label.star:before {
  content: '\f005';
  color: #FD4;
  transition: all .25s;
}

input.star-5:checked ~ label.star:before {
  color: #FE7;
  text-shadow: 0 0 20px #952;
}

input.star-1:checked ~ label.star:before { color: #F62; }

label.star:hover { transform: rotate(-15deg) scale(1.3); }

label.star:before {
  content: '\f006';
  font-family: FontAwesome;
}


/*
a {
    color:white;
    text-decoration:none;
} 


#child, #child2, #child3, #child4{
	position:absolute;
	display:none;
    top:200px;
	z-index:9;
	color:red;
}


table.coolTable td {
    background-color:purple;
    color:green;
}

table.coolTable td:hover {
    background-color:green;
    color:green;
}

td a {
    display:block;
    width:100%;
}
*/

</style>