*
{
margin:0;
padding:0;
} 

html, body
{
	/*height:100%;*/
}

.site
{
	height: 100vh;
	width: 100%;
		
	display: grid;
	grid-template-columns: 1fr 980px 1fr;
	grid-template-rows: 150px 40px 1fr 40px;
	
	grid-template-areas: 
	'. header .'
	'. navbar .'
	'. main .'
	'footer footer footer';
	
	justify-content: center;
}

body 
{
background-color:white;
background-image: url('../images/background.png');
background-repeat:repeat-x;
font-family:Verdana, Geneva, sans-serif;
font-style:normal;
font-size:12px;
text-align:center;
text-decoration:none;
}

#header
{
background-color:transparent;
grid-area: header;
}

#titel
{
margin:15px;
position: relative;
float:left;
text-align:left;
}

#flags
{
position: relative;
float:right;
text-align:right;
}

#login
{
margin:15px;
position: relative;
float:right;
max-height: 120px;
width: 250px;
background-color:#ffffff;
opacity:0.7;
filter:alpha(opacity=70);
text-align:left;
}

#navbar
{
background-color:#003366;
background-image: url('../images/navbar.png');
background-repeat:repeat-x;
/*height:40px;*/
color:#ffffff;
font-size: 15px;
margin:0;
padding:0;
border:0;

grid-area: navbar;
}

#main
{
	grid-area: main;
	background-color:white;
	border: solid grey;
	border-width: 0px 1px;
}

#content
{
background-color:white;
/*float:left;*/
/*width: 980px;*/
}

#office
{
background-color:white;
/*position: relative;*/
float:left;
width: 740px;
}

#sidebar
{
background-color:yellow;
/*position: relative;*/
float:right;
top: 0px;
right: 0px;
width: 228px;
margin: 5px;
background-color:#ffcc33;
background-image: url('../images/navbaractive.png');
background-repeat:repeat-x;
border:1px solid grey;
}

#footer 
{
background-color:#003366;
background-image: url('../images/navbar.png');
background-repeat:repeat-x;
color:#ffffff;
text-align:center;

grid-area: footer;
} 

p, h1, h2, h3, h4, h5, h6, table, fieldset
{
padding:10px 15px;
}

h1
{
  font-size: 2em;
  font-weight: bold;
}

h2
{
  font-size: 1.5em;
  font-weight: bold;
}

h3
{
  font-size: 1.17em;
  font-weight: bold;
}

h4
{
  font-size: 1em;
	font-weight: bold;
}

h5
{
  font-size: 0.83em;
  font-weight: bold;
}

h6
{
  font-size: 0.67em;
  font-weight: bold;
}

.guide
{
margin:10px 15px;
padding:10px 15px;

border:1px solid grey;
border-collapse:collapse;
}
th.guide
{
padding:2px 5px;
background-color:#ffcc33;
background-image: url('../images/navbaractive.png');
background-repeat:repeat-x;
}

table , p
{
font-size:12px;
}

td
{
padding: 2px 1px;
}

.error
{
color:red;
}

/*NAVBAR START*/
ul.nav
{
list-style-type:none;
margin:0px;
padding:0px;
overflow:hidden;
}

li.nav, li.nav:hover
{
float:left;
width:auto;
heigt:40px;
}

a
{
color: #003366;
text-decoration:none;
}

a.nav
{
display:block;
heigt:40px;
position:relative;
padding:10px 20px;
margin:0px 0px;

text-align:center;
text-transform:uppercase;
text-decoration:underline;
font-weight: bold;
}

a.nav:link, a.nav:visited
{
background-color:transparant;
color:#ffffff;
}
a.nav:hover, a.nav:active
{
background-color:#ffcc33;
background-image: url('../images/navbaractive.png');
background-repeat:repeat-x;
color:#003366;
}
/*NAVBAR END*/

/*OFFICE NEWS START*/
div.news_box
{
margin:15px 15px;
padding:0px 0px;
border:1px solid grey;
}

p.news_box
{
padding:3px 5px;
}

h3.news_header
{
margin:0px 0px;
padding:2px 5px;
background-color:#ffcc33;
background-image: url('../images/navbaractive.png');
background-repeat:repeat-x;
border-bottom:1px solid grey;
}
/*OFFICE NEWS END*/