@font-face {
  font-family: 'segoe';
  src: url('../font/segoepr.ttf') format('truetype'); 
}

*{
 margin:0;
 padding:0;
}
body{
 direction:ltr;
 font-family:arial;
}
#header{
 font-family:Arial;
 font-size:24pt;
 text-align:left;
 padding:0 5% 1% 10%;
 margin:0;
 color:#ff7f27;
}
#header h1{
font-family:'segoe';
font-weight:bold;
font-size:42pt;
display:inline-block;
}
#header h3{
font-size:16pt;
display:inline-block;
}
#header hr{
border-width:2px;
border-style:solid;
}
.icon{
 display:none;
}
.menu{
display:inline-block;
width:200px;
margin-left:10%;
background-color:#ffffff;
color:#333333;
border-right:1px solid #ff7f27;
vertical-align:top;
min-height:350px;
}
.menu a{
display:block;
color:#333333;
}
.menu li{
padding:10px 10px 10px 10px;
display:block;
cursor:pointer;
}
.menu li a{
color:inherit;
text-decoration:none;
padding:1px 1px 1px 1px;
}
.menu li:hover{
background-color:#aaaaaa;
}
.menu a:hover{
background-color:#aaaaaa;
color:#000;
}

#content{
 margin:0px 4% 0 0;
 background-color:#FFF;
 padding:0px 10px 0px 0;
 display:inline-block;
}
#content  table tr td{
padding:0 5px 0 5px;
vertical-align:top;
}
#footer {
text-align:center;
border-top:1px solid #ff7f27;
margin:2px 5% 2px 10%;
padding:10px 0 10px 0;
}
button {
padding: 2px 5px 2px 5px;
}
input , select {
font-size:14pt;
}
.context
{
	display:inline-block;
	vertical-align:top;
	font-size:14pt;
	line-height:25pt;
	padding-left:1%;
	margin-bottom:3%;
	max-width:600px;
	overflow:auto;
	max-height:450px;
}
.context ul{
	display:inline-block;
	padding-left:20px;
}
.logo{
	height:70px;
	margin-top:10px;
}
@media screen and (max-width: 600px) {
.logo{
	height:40px;
	margin-top:2px;
}
  #header{
   font-size:16pt;
   padding:0 1% 0 1%;
  }
  #header h1{
   font-size:24pt;
  }  
  #header hr{
   margin-right:0px;
   border-width:1px;
}  
  .icon{
  display:inline-block;
  position: absolute;
    right: 1%;
    top: 12pt;
	width:30px;
	height:30px;
 }
  .menu li{}
  .menu {
  display: none;
  margin-left:1%;
  }
  .menu li.icon {
    float: right;
    display: block;
  }
  .menu.responsive {
  display:inline-block;
  position: relative;
  margin-left: 1%;
  }
  .menu.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .menu.responsive li {
    float: none;
    display: block;
    text-align: left;
  }
  #footer {
	margin:2px 1% 2px 1%;
	padding:10px 0 10px 0;
}

.context
{
	display:inline-block;
	vertical-align:top;
	font-size:11pt;
	line-height:20pt;
	padding-left:1%;
}

}