/* General Style */
body {
background:#fff;
font-size:100%;
margin:0em;
padding:0em;
}

h1 {
font-family: 'scada', sans-serif;
font-size: 1.5em;
color: #999;
font-weight: normal;
margin:0em;
}

h2 {
font-family: 'scada', sans-serif;
font-size: 1.25em;
color: #999;
font-weight: normal;
margin: 0em;
padding: 1.25em;
text-align: center;
}

.logo	{
font-family: 'scada', sans-serif;
font-size: 2em;
color: #ffffff;
font-weight: normal;
font-style: italic;
line-height: normal;
padding-left: 1em;
}

.headlogo_box	{
font-family: 'scada', sans-serif;
font-size: 2em;
color: #cccccc;
font-weight: normal;
line-height: normal;
}

p {
font-family: 'scada', sans-serif;
font-size: 1em;
color: #999;
font-weight: normal;
margin:0em;
padding:1.25em;
text-align:left;
}

ul {
margin:0px;
padding:0px;
}

li {
list-style:square;
font-family: 'scada', sans-serif;
font-weight:100;
color:#2F2D2C;
line-height:1.25em;
margin:0em;
padding:0em;
margin:0.313em 0em 0.313em 0em;
}

img {
	width: 25%;
	height: auto;
	max-width: 100%;
}

.graphic {
height: 10em;
width: 10em;
height: auto;
display: block;
margin-right: auto;
margin-left: auto;
}

a {
font-family: 'scada', "sans-serif;";
font-size: 1em;
color: #666;
}

.copy {
	font-family: 'scada', "sans-serif;";
	font-size: 0.7em;
	color: #999;
}

.impressum {
font-family: 'scada', "sans-serif;";
font-size: 0.75em;
color: #999;
}

/* On Top Bar */

#menubar {
display:block;
background:#FFFFFF;
height: 2.2em;
} 

#menubar ul {
display:block;
width:2em;
padding:0.9em;
}

#menubar ul li {
display:inline;
}

#menubar ul li a.menubutton {
display:none;
}

/* Hafi-Header */ 

header {
display: block;
background: #9fad1c;
text-align: left;
height: 2.75em;
}

/* Navigation */ 

nav {
display:block;
height:2.5em;
background:#FFFFFF;
text-align:left;
padding-left: 2em;
}

nav ul {
display:block;
}

nav ul li {
display:inline;
margin:0em 0.188em 0em 0.188em;
}

nav ul li a {
color:#999999;
font-size: 1em;
line-height:2.5em;
transition:background 0.2s;
-webkit-transition:background 0.2s;
padding:0.563em 0.938em 0.375em 0.983em;
}

nav ul li a:hover {
background:#e8e8e8;
}

nav ul li a.active {
}

/* Hafi-Easy-Nav */

a {
font-family: scada, "sans-serif;";
}

a:link {
text-decoration: none;
}

a:visited {
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

a:active {
text-decoration: none;
}

/* Hafi-Content-Area */

#main {
display:block;
width:100%;
max-width:100%;
padding:0em;
margin: 0em;
height: auto;
}

#main article {
display:inline-block; 
width:100%; 
background:#FFFFFF;
vertical-align: top;
margin:0em;
padding:0em;
text-align:center;
}

#main article img {
max-width:100%;	
}

/* Hafi-Box */ 

#container {
width: 40%;
height: auto;
background: #ffffff;
display: -webkit-flex;
display: flex;
margin-top: 3em;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}

#box1 {
background: ffffff;
width: 50%;
border-top-width: thin;
border-top-style: solid;
border-top-color: #CCC;
margin-right: 0.5em;
}

#box3 {
background: ffffff;
width: 50%;
border-top-width: thin;
border-top-style: solid;
border-top-color: #CCC;
margin-left: 0.5em;
}

#box4 {
background: ffffff;
width: 33.3%;
border-top-width: thin;
border-top-style: solid;
border-top-color: #CCC;
}

/* Footer */ 

footer {
display:block;
text-align:left;
background-color: #666;
}

footer ul {
display:block;
width:100%;

/* [disabled]max-width:980px; */

margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}

footer ul li {
display:inline;
font-size:0.8em;
line-height:2.8em;
color:#E2DBDB;
padding:0em 0.625em 0em 0.625em;
}

footer ul li a {
color:#E2DBDB;
}

/* Hafi-Mobile-Style */

@media screen and (max-width:800px) {
body {
font-size:75%;
}
}

@media screen and (max-width:600px) {
#container {
width:100%;
display:block;
margin:0.625em 0em 0.625em 0em;
}
}

@media screen and (min-width:550px) {
nav.nav {
display:block !important;
}	
}

@media screen and (max-width:550px) {
body {
font-size:75%;
}

#menubar ul li a.menubutton {
display:block;
}	
nav {
display:none;
height:auto;
}
nav ul li {
display:block;
margin:0.3em 0em 0.3em 0em;
}
}
