/*
#header { background: green; }
#main { background: white; }
#menu { background: silver; }
#content { background: red; }
#footer { background: blue; }
#wrap { background: yellow; }
*/

/* https://google-webfonts-helper.herokuapp.com/fonts/open-sans?subsets=latin */
/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('/static/fonts/open-sans-v29-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/static/fonts/open-sans-v29-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/static/fonts/open-sans-v29-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/static/fonts/open-sans-v29-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/static/fonts/open-sans-v29-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/static/fonts/open-sans-v29-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}

* {margin:0;padding:0;} 

html, body {
    height: 100%;
    color:#656565;
    background:silver;

    font-family: 'Open Sans', sans-serif;
    font-size: 10pt;
}

#wrap { 
    position:relative;

    height: auto; 
    min-height: 100%;

    width: 1280px;
    margin: 0 auto;
    background:#fff;
}

#header {
    display: table;
    border-collapse: collapse;
}

#logo {
    display: table-cell;
    width: 337px;
    vertical-align: middle;
    text-align: center;
    border: 0;
}

#logo img {
    border: 0;
}

#topimage {
    display: table-cell;
    /* width:687px; */
}

#topimage img {
    display:block;
}

#main {
    padding-bottom: 111px; /* must be equal to footer height */
} 

#menu {
    width: 280px;
    float:left;
    margin-top:100px;
}

#divider {
    width:1px;
    position:absolute;
    left:305px;
    top:325px;
    bottom:129px; /* footer height + x */

    /* http://www.colorzilla.com/gradient-editor/#c95420+0,c95420+100&0+0,1+10;Custom */

    background: -moz-linear-gradient(top,  rgba(201,84,32,0) 0%,
				     rgba(201,84,32,1) 10%,
				     rgba(201,84,32,1) 100%);

    background: -webkit-gradient(linear, left top, left bottom,
				 color-stop(0%,rgba(201,84,32,0)),
				 color-stop(10%,rgba(201,84,32,1)),
				 color-stop(100%,rgba(201,84,32,1)));

    background: -webkit-linear-gradient(top,  rgba(201,84,32,0)
					0%,rgba(201,84,32,1)
					10%,rgba(201,84,32,1) 100%);

    background: -o-linear-gradient(top,  rgba(201,84,32,0)
				   0%,rgba(201,84,32,1)
				   10%,rgba(201,84,32,1) 100%);

    background: -ms-linear-gradient(top,  rgba(201,84,32,0)
				    0%,rgba(201,84,32,1)
				    10%,rgba(201,84,32,1) 100%);

    background: linear-gradient(to bottom,  rgba(201,84,32,0)
				0%,rgba(201,84,32,1) 10%,rgba(201,84,32,1)
				100%);

    filter: progid:DXImageTransform.Microsoft.gradient(
	startColorstr='#00c95420', endColorstr='#c95420',GradientType=0 );
}

#content {
    float:right;
    width:933px;
    padding:0 10px 10px 0;
}

#spacer {
    height:100px;
    clear:both;
}

#content p {
    margin:10px 0;
    line-height:1.5em;
}


#headline {
    display: table;
    height: 100px;
}

h1 {
    display: table-cell;
    vertical-align:middle;
    /* width top image = 657px  */
    width:630px;

    font-size: 12pt;
    color: #c95420;
    font-weight: normal;
    /* letter-spacing:5pt; */

}

h2 {
    font-size:10pt;
    color:#161616;
    font-weight: normal;
}

#col1, #col2, #col3 {
    float:left; 
    width:275px;
    margin:0 35px 0 0;
}

#col1 > *:first-child, 
#col2 > *:first-child,
#col3 > *:first-child {
    margin-top: 0;
}

#content ul {
    list-style: none;
    margin-left: 0;
    padding-left: 0.6em;
    text-indent: -0.6em;
}

#content ul li:before {
    content: "- ";
}

#content li {
    margin:0.25em 0;
}

#content li p {
    display:inline;
}

#footer {
    width:1280px;
    margin:0 auto;
    padding:0;

    position: relative;
    margin-top: -111px; /* must be negative value of footer heigth */
    height: 111px;
    clear:both;

    font-size: 8pt;

    color:#fff;
    background:#656565;
}

#footer div {
    padding:14px 0;
}

#footer p {
    margin:0.2em 0;
    padding:0;
}

#menu a:link    { font-weight:normal; color:#656565; text-decoration:none; }
#menu a:visited { font-weight:normal; color:#656565; text-decoration:none; }
#menu a:focus   { font-weight:normal; color:#c95420; text-decoration:none; }
#menu a:hover   { font-weight:normal; color:#c95420; text-decoration:none; }
#menu a:active  { font-weight:normal; color:#c95420; text-decoration:underline; }

#content a:link      { font-weight:normal; color:#656565; text-decoration:underline; }
#content a:visited   { font-weight:normal; color:#989898; text-decoration:underline; }
#content a:focus     { font-weight:normal; color:#c95420; text-decoration:underline; }
#content a:hover     { font-weight:normal; color:#c95420; text-decoration:underline; }
#content a:active    { font-weight:normal; color:#c95420; text-decoration:underline; }

#footer a:link    { font-weight:normal; color:#fff; text-decoration:none; }
#footer a:visited { font-weight:normal; color:#fff; text-decoration:none; }

#menu ul {
    font-size: 12pt;
    list-style-type:none;
    margin: 0 0 0 60px;
    padding:0;
}

#menu li {
    margin: 0.25em 0;
}

#menu li.selected {
    color:#c95420;
}

#menu li.bullet1 {
    list-style-image: url(../img/bullet1.png);
}

#menu li.bullet2 {
    list-style-image: url(../img/bullet2.png);
}

#menu li.bullet3 {
    list-style-image: url(../img/bullet3.png);
}

#menu li.bullet4 {
    list-style-image: url(../img/bullet4.png);
}


/* CLEAR FIX */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {display: inline-block;}

/* Bereich nicht für IE-mac Anfang \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* Bereich nicht für IE-mac Ende */