/*layout style*/
body{
  margin:0px;
  background: url(./docs/bg_grad3.jpg) fixed;
  background-repeat:repeat-x;
}
div.top{
  margin: auto;
  width:70%;
  border-bottom: solid 1px;
  background-color: #ffffff;
  overflow: auto;
}
div.side{
  margin-top:1%;
  margin-left:1%;
  width:20%; 
  float:left;
}
div.center{
  padding-top: 1em;
  padding-bottom:1em;
  margin: auto;
  width:70%;
  background-color: #ffffff;
}

/*header and footer style*/
div.title{
  margin-top:5px;
  height:60%;
}
div.button{ 
  float:left;
  padding-left: 3px;
  padding-right: 3px;
}
div.footer{
  font-size:70%;
  width:100%;
  clear:both;
  margin-top:1em;
  border-top:solid 1px;
}


/*navigation*/ 
div.nav{
  margin: auto;
  width:70%;
  background-color: #FFA500;
  border-bottom: solid 1px;
  padding: 0;
overflow: auto;
}
ul.nav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  float: left;
}
li.nav, .dropdown {
  float: left;
  border-right: 1px solid black;
}
a.nav:link,a.nav:visited
{
  display:block;
  padding:10px;
  text-decoration:none;
  color: white;
  font-family: Arial, Helvetica, sans-serif;
}
a.nav:hover, .dropdown-content a:hover
{
  background-color:#F0E68C;
  color: black;
}

/*navigation for dropdown menu*/ 
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
}
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
}
.dropdown:hover .dropdown-content {
  display: block;
}


/*boxes*/
div.info-box{
  width:98%;
  margin-top:1%;
  margin-bottom:1%;
  margin-left:1%;
  margin-right:1%;
  border: solid 1px;
}
div.index-box{
  width:98%;
  margin-top:1%;
  margin-bottom:1%;
  margin-left:1%;
  margin-right:1%;
  border: solid 1px;
  background-color: #FFFFCC;
}

/*text style*/
h1{
  margin-left:5px;
  margin-bottom:0.5em;
  margin-top:0.5em;
  font-size:150%;
  font-family:sans-serif;
}
h1.header{
  font-size: 150%;
  float: left;
  padding-right: 5%;
  font-family: sans-serif;
}
h2{
  margin-top:0;
  padding-top:2px;
  margin-bottom:3px;
  margin-left:5px;
  margin-right:3px;
  font-size:100%;
  font-family: san-serif;
}
h2.box{
  margin-top:0;
  padding-top:2px;
  margin-bottom:3px;
  margin-left:5px;
  margin-right:3px;
  font-size:100%;
  font-family: sans-serif;
  color: #FFFFFF;
}
p{
  margin:5px;
  margin-left:10px;
  font-family:sans-serif;
}
p.center{
  margin:5px;
  margin-left:10px;
  font-family:sans-serif;
  text-align:center;
}
p.right{
  margin:5px;
  margin-left:10px;
  font-family:sans-serif;
  text-align:right;
}
p.language{
  margin:5px;
  margin-left:10px;
  font-size:80%;
  font-family:sans-serif;
}
a{
  color:#0000cc;
  text-decoration:none;
}
a:hover{
  text-decoration: underline;
}
.help{
  color:black;
  font-weight:bold;
}

/*image style*/
img.logo{
  float:right;
}