body{
margin:0;
background-color:#0f2d47;
font-family: Garamond, serif;
font-size:20px;

}


/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}

/* Modal Content buttons */
.modal-content btnType1{
   background-color: #6ea787;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
	width:100%;
}


/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}



.top_title{
background-color:#1d3a5e;
font-size: 24px;
padding: 5px 0 5px 0;
color:#ffffff;
margin: 0;

}



.PageTitle{
margin: 10px 0 0 0;
text-align:center;
color:#ffffff;
font-size: 24px;
}
.news{
text-align:center;
color:white;
font-size: 26px;
}
.profile{
text-align:right;
color:white;
font-size: 22px;
}



.top_text{text-align:center;	}
.top_title img {
margin: 0 0 0 10px;
}

.steps{
text-align:center;
}

.audio{
width:100%;
}


table, th, td {
    border: 1px solid white;
    border-collapse: collapse;
}
th, td {
    padding: 10px;
}
table{
width:100%;
}

#menu {
  position: fixed;
    right: 0;
    top: 60%;
    width: 4em;
    margin: -2.5em 0 10px 0;
    z-index: 5;
    background: black;
    color: white;
    font-weight: bold;
    font-size: medium;
    text-align: left;
    border: solid white;
    border-right: none;
    padding: 0.5em 0.5em 0.5em 2.5em;
    box-shadow: 0 1px 3px black;
    border-radius: 3em 0.5em 0.5em 3em;
	transition: 0.5s;
}

#menu a:hover{
font-size: large;
}
#menu a:visited{
color:white;
}





/* Remove margins and padding from the list, and add a blue background color */
ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #1d3a5e;
	color: white;
	font-size: 17px;
	
	
	
	
	/*<Sets the menu to stay at the top >
	  position: fixed; <Set the navbar to fixed position >
     top: 0; 
	width: 100%; /*<Full width >*/
	
	
}

/* Float the list items side by side */
ul.topnav li {float: left;

}

/* Style the links inside the list items */
ul.topnav li a {
    display: inline-block;
    color: #f2f2f2;
text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}

/* Change background color of links on hover */
ul.topnav li a:hover {
/*background-color: #6ea787;*/
color:white;}

/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.topnav li.icon {display: none;}


ul.topnav li.selected a { 
/*color: #6ea787; */

} 

a:hover {
/*background-color: #6ea787;*/
color:white;}
a{
color:white;
}

.maincontent{
/*height:90%;*/
padding-bottom:60%;
}


.row{
clear:both;
margin: auto;
width: 95%;
padding: .3% .3% .3% .3%;

}
.row2{
clear:both;
margin: 1%;
width: 95%;
padding: 1%;

}

.col_login{
background: #1d3a5e;
border-radius: 5px;
color: white;
padding: 10px 5px;
margin: .5%;
width:95%;
height:190px;
float: left;

}



.col_big{
background: #1d3a5e;
border-radius: 5px;
color: white;
padding: 10px 12px;
width:95%;
height:25%;
float: left;
margin: .5% .5% 5% .5%;

}
.col_update{
width:96.82%;
height:18%;
float: left;
margin: .5%;
background: #1d3a5e;
border-radius: 5px;
color: white;
padding: 10px 12px;
}


.col_big p{
padding: 0 5px;
}


.col_big h3{
clear:both;
background: #6ea787;
color:white;
margin:.5% 0 5px 0;
text-align:center;
font-size:22px;
}
.col_big h2{
clear:both;
text-align:center;
}

.col_big h4{
text-align:left;
color:white;
font-size:24px;
margin-bottom:0;
margin-top:5px;
padding: 5px 5px;
text-decoration: underline;
}

.col_big h5{
clear:both;
font-size:24px;
text-decoration: underline;
padding: 0 0 0 10px ;
}


.div_right{
	float: right;
	width:60%;
}
.div_right input[type=button]{
	width:40%;
	float:right;
}


/*
.col_big p{
clear:both;
margin: 0;
width:95%;
padding: 5px;
}

*/

.col{
background: #1d3a5e;
border-radius: 5px;
color: white;
padding: 10px 5px;
margin: .5%;
width:48%;
height:20%;
float: left;

}

.leftcolumn {	
border-radius: 5px;
color: white;
/*padding: 10px 5px;
margin: .5%;*/
width:75%;
float: left;	
}
.rightcolumn {
padding-left: 20px;
width:23%;
float: left;
	
}
.content_area{
padding: 12px;
margin-top: 10px;
margin-bottom: 20px;
background: #1d3a5e;
color:white;
}

.content_area h4 {
text-align:left;
color:white;
font-size:24px;
margin-bottom:10px;
margin-top:0px;
padding: .2% .5%;
text-decoration: underline;
background-color:#6ea787;
}
.content_area h3{
clear:both;
color:#FFFFFF;
margin:.5% 0 5px 0;	
border-bottom: 4px double #FFFFFF;
font-size:24px;
}
.content_area p {
padding:1%;

}




/*
.col img{
width:430px;
height:300px;
margin: 0;
}
*/

.col h3{
clear:both;
background: #6ea787;
color:white;
margin:.5% 0 5px 0;
text-align:center;
}
.col h4{
text-align:left;
color:white;
font-size:24px;
margin-bottom:0;
margin-top:5px;
padding: 0px 5px;
text-decoration: underline;
}


.col p{
clear:both;
margin: 0;
width:95%;
padding: 5px;
}

.listcontainer { 
border:2px solid #ccc; 
width:50%; 
height: 300px; 
overflow-y: scroll; 
text-align:left;
}

.form-class{
	padding: 1% 2%;
}

div.sticky {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  bottom: 0;
}


select{
    width: 100%;
    padding: 12px 20px;
    display: inline-block;
	margin-bottom:5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

input[type=text]{
    width: 100%;
    padding: 10px 10px;
    display: inline-block;
	margin-bottom:5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
	font-size:14pt;
}
input[type=number]{
    width: 100%;
    padding: 5px 5px;
    display: inline-block;
	margin-bottom:5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
	font-size:12pt;
}
input[type=password]{
    width: 100%;
    padding: 10px 10px;
    display: inline-block;
	margin-bottom:5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
	font-size:14pt;
}
input[type=email] {
    width: 100%;
    padding: 12px 20px;
    margin-bottom:5px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
textarea {
    width: 100%;
    height: 150px;
    padding: 12px 20px;
    box-sizing: border-box;
    border: 2px solid #ccc;
    border-radius: 4px;
    resize: none;
    margin-bottom:10px;
}

input[type=submit] {
    width: 100%;
    background-color: #6ea787;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
	min-height: 30px;
	-webkit-appearance: none;
}
input[type=button] {
    width: 50%;
    background-color: #6ea787;
    color: white;
    padding: 14px 20px;
    margin: 8px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
	min-height: 30px;
	-webkit-appearance: none;
	text-align: center;
    text-decoration: none;
}



input[type=button]:hover {
	background-color: #498061;
	
}
input[type=submit]:hover {
	background-color: #498061;
}
input[type=date]{
	font-size: 24px;
}







.btnType1{
    background-color: #6ea787;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;	
}


.dashboard_table{
	/*width:100%;*/
}




footer {
clear: both;
background-color: #1d3a5e;
color:white;
margin: 0 0 0 0;
width:99%;
margin-top:20px;

padding-top: 1%;
padding-right: .5%;
padding-bottom: 1%;
padding-left: .5%;

position: sticky;
 

}
footer a:hover{
	background-color:#305371;
}


/*
footer {
clear: both;
background-color: #1d3a5e;
color:white;
padding: .5% .5% 10px .5%;
margin: 0;
bottom:0;
width:99%;
}
*/




/* When the screen is less than 680 pixels wide, hide all list items, except for the first one ("Home"). Show the list item that contains the link to open and close the topnav (li.icon) */
@media screen and (max-width:1000px) {
  ul.topnav li:not(:first-child) {display: none;}
  ul.topnav li.icon {
    float: right;
    display: inline-block;
  }

  
/*
.col_big img{
clear:both;
margin: 0;
width: 100%;
padding: 0px;
}
*/

.dashboard_table{
	/*width:92%;*/
}

/*.row{
clear: both;
    margin: 0 0 0 0;
    width: 95%;
    padding-right: 3%;
    padding-bottom: 90%;
    padding-left: 1%;
    padding-top: 0;

}*/



  
.main_guide img {
clear:both;
margin: 0;
width: 100%;
padding: 0;
}

.audio{
width:50%;
}

.div_right{
	float: none;
	width:98%;
}
.div_right input[type=button]{
	width:98%;
	float:none;
}

.col{
background: #1d3a5e;
border-radius: 5px;
color: white;
padding: 10px 5px;
width:95%;
height:25%;
float: left;

}

iframe{
width:100%;
height:30%;
}
.news{
text-align:left;
color:white;
font-size: 12px;
}

input[type=button] {
    width: 96%;

}

.maincontent{
/*height:90%;*/
padding-bottom:520px;
}
footer{
	padding-top: 3%;
padding-right: .5%;
padding-bottom: 1%;
padding-left: .5%;
}


.leftcolumn{
width:100%;	
}
.rightcolumn{
padding-left:0px;
width:100%;
}

.content_area h4 {
text-align:left;
color:white;
font-size:18px;
margin-bottom:10px;
margin-top:0px;
padding: .2% .5%;
text-decoration: underline;
background-color:#6ea787;
}

body{
	font-size:15px;
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens */
}
/*@media screen and (max-width:680px) {
  ul.topnav.responsive {position: relative;}
  ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  ul.topnav.responsive li {
    float: none;
    display: inline;
  }
  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }


.col_big img{
clear:both;
margin: 0;
width: 100%;
padding: 0px;
}

}*/


/* Used for divs (border: 3px solid green;)