@charset "utf-8";

* {
    box-sizing:border-box;

    margin: 0;
    padding: 0;
}

a:link, a:visited, a:active, a:focus {
    text-decoration: none;
    color: #7799ff;
}


a:hover {
    text-decoration: none;
    color: #aaccff;
}

h1, h2, h3 {
    text-align: center;
}

h4 {
	text-align: left;
	font-size: 1em;
}

h2, h3 {
    margin-top: 0.5em;
}

table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
th, td {
    padding: 5px;
}

strong {
    background: black;
    color: white;
}

.push {
    float: right;
}

p {
    padding-top: 10px;
}


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

.leftpic {
	width: 100%;
    padding-top: 1em;
    padding-bottom: 0.5em;
	float: left;
}

.leftpic img {
    float: left;
    border-color: #000000 black;
    border-style: solid;
    border-width: 2px;
    margin-right: 10px;
    margin-bottom: 5px;
}

.rightpic {
	width: 100%;
    padding-top: 1em;
    padding-bottom: 0.5em;
	float: right;
}

.rightpic img {
    float: right;
    border-color: #000000 black;
    border-style: solid;
    border-width: 2px;
    margin-left: 10px;
    margin-bottom: 5px;
}


.centerpic {
	width: 100%;
    text-align: center;
    margin: 0 auto;
    padding-top: 1em;
    padding-bottom: 0.5em;
    padding-left: 10px;
}

.centerpic img {
    border-color: #000000 black;
    border-style: solid;
    border-width: 2px;
}


.whitebox {
  background-color: white;
  border: 1px solid #aaaaaa;
  font-family: "Courier New", Courier, monospace;
  font-size: 1.1em;
  font-style: normal;
  color:#333;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  padding-left: 0.5em;
  margin-top: 0.5em;
}


.refbox {
  background-color: wihte;
  border: 1px solid #cccccc;
  padding: 4px;
  font-family: Arial, Helvetica, sans-serif;
}


.framepic {
  font-family: Arial, Helvetica, sans-serif;
  background: #f0f0f0;
  /*font-size: 10pt;*/
  font-style: normal;
/*  margin-left: 12px;
  margin-right: 8px;*/
  margin-top: 8px;
  margin-bottom: 8px;
  padding: 16px;
  border: 1px solid #555555;
}

.framepic img {
  float: right;
  border: 1px solid #0088aa;
  margin-top: 0px; margin-right: 4px; margin-bottom: 8px; margin-left: 8px;
}

.frametext {
  width: 572px;
  background-color: #e0eaf0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1pt; font-style: normal;
  margin-left: 8px;
  margin-right: 8px;
  margin-top: 0px;
  margin-bottom: 6px;
  padding: 0px;
  border: 1px solid #ffffff;
}

/* -------------- Struktur ------------------------- */

body {
    font: 100%/1.25 Arial, Helvetica, sans-serif;
    font-size: 1.0em;
    color: black;
    background-image: url(images/back04.png);
}

.container {
    max-width: 1260px;
    margin: 0 auto;
    background: #e0e0e0;
    margin-top: 0.5em;
    margin-bottom: 2em;;
}


header {
    height: 45px;
    background: #505050;
    padding-top: 5px;
    padding-left: 15px;
    padding-right: 105px;
}

header .logo {
    background-image: url("images/logo3.png");
    background-repeat: no-repeat;
    float: right;
    width: 100px;
    height: 35px;
}

/* --------------------- Navigationsleiste --------------------*/
.navbar1, .navbar2 {
    height: 41px;
    background: #404040;
    border-top: 1px solid #c0c0c0;
    border-bottom: 1px solid #666;
    padding-top: 7px;
}

.topnavi {
    padding-left:0px
}

.topnavi a {
    font-size: 1.0em;
    font-weight: bold;
	color: #7799ff;
  }

.topnavi a:hover {
  color: #aaccff;
}


.topnavi ul {
   float: left;
   list-style-type: none;
   font-size: 1.0em;
}

.topnavi ul li {
    display: inline-block;
    margin-right: 20px;
}

.topnavi .lastentry {
    font-weight: bold;
    color: #ffcc88;
}

/* --------------------- content ----------------------------------- */

article {
	float: right;
    padding-bottom: 10px;
    font: 100%/1.25 Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.0em;
}

.doublebox {
    width: 100%;
    float: left;
    padding-top: 10px;

}

article .left {
    width: 50%;
    float: left;
}

article .right {
    width: 50%;
    float: right;
}

.monobox {
    width: 100%;
    float: left;
    padding-top: 10px;
}


.small_monobox {
    width: 100%;
    float: left;
    padding-top: 10px;
    padding-left: 100px;
    padding-right: 100px;
}


.small_monobox a {
	color: blue;
}

.small_monobox a:hover {
	color: #6677ff;
}

.medium_monobox {
    width: 100%;
    float: left;
    padding-top: 10px;
    padding-left: 50px;
    padding-right: 50px;
}

.medium_monobox a {
	color: blue;
}

.medium_monobox a:hover {
	color: #6677ff;
}

/*  ---------------- Seitenleiste ---------------------*/

aside {
    float: left;
    padding-top: 10px;
    padding-bottom: 10px;
    width: 100%;
    background: #404040;
    color: #bbbbbb;

}

aside .sidenavpic {
  text-align: center;
}

aside .sidenavpic img {
  border: 2px solid #bbbbbb;
  margin-top: 20px;
  margin-bottom: 10px;
}

aside .sidepic {
  text-align: center;
}

aside .sidepic img {
  border: 2px solid #bbbbbb;
  margin-top: 20px;
  margin-bottom: 10px;
}

aside .side_navi {
    padding: 10px 5px 5px 5px;
    display: block;
    text-align: left;
}

aside .side_navi a {
  color: #7799ff;
}

aside .side_navi a:hover {
  color: #aaccff;
}

aside .side_navi2 {
    padding: 5px 5px 2px 40px;
    display: block;
    text-align: left;
}

aside .side_navi2 a {
  color: #7799ff;
}

aside .side_navi2 a:hover {
  color: #aaccff;
}

aside .side_centernavi {
    padding: 10px 5px 5px 5px;
    display: block;
    text-align: center;
}

aside .side_centernavi a {
  color: #7799ff;
}

aside .side_centernavi a:hover {
  color: #aaccff;
}

aside .sidetitle {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.0em;
  font-weight: bold;
  color: #ffcc88;
  padding-top: 8px; padding-right: 0px; padding-bottom: 0px; padding-left: 4px;
  text-align: center;
}

aside .sidetext {
  color: #77bb77;
  font-size: 0.9em;
  padding-top: 0px; padding-right: 8px; padding-bottom: 0px; padding-left: 40px;
  text-align: left;
}

aside .sidecentertext {
  color: #77bb77;
  font-size: 0.9em;
  padding-top: 0px;
  padding-bottom: 0px;
  text-align: center;
}

aside .sidetext2 {
  font-size: 0.9em;
  font-weight: bold;
  color: #77bb77;
  padding-top: 0px; padding-right: 8px; padding-bottom: 0px; padding-left: 40px;
  text-align: left;
}

aside .sidetext3 {
  font-size: 0.9em;
  color: #cccccc;
  padding-top: 0px; padding-right: 8px; padding-bottom: 0px; padding-left: 8px;
  text-align: center;
}

aside hr {
    height: 2px;
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 10px;
    background: #888888;
    border-width: 0;
}


footer {
    padding: 10px 0;
    background: #505050;
    position: relative;
    clear: both;
    height: 60px;
    border-top: 1px solid #666666;

}

footer .socialshit {
    margin-left: 10px;
    width: 300px;
    float: left;
}

footer .socialshit img{
    width: 40px;
    height: 40px;
}


footer li{
    display: inline-block;
    margin-right: 10px;
}

footer ul {
    padding: 0;
    margin: 0:
    list-style-type: none;
}

.footertext {
    color: #bbbbbb;
    font-size: 1.4em;
    padding-top: 8px;
    padding-right: 20px;
    text-align: right;
}


/* ---------------------- Raster --------------------- */

.columns {
    float: right;
    padding-left: 10px;
    padding-right: 10px;
}

.block {
    width: auto;
}

.block:before,
.block:after {
    content:'';
    display: table;
}

.block:after {
    clear: both;
}

.block .block {
    margin-left:-1em;
    margin-right:-1em;
}

/* =====================================================================*/
/*               Raster                                                 */
/* =====================================================================*/

@media screen and (max-width:600px) {
    .small-1 {
        width: 100%;
    }
    .navbar1 {
        display: none;
        background: green;
    }

    aside {
        border-top-style: solid;
        border-color: #773333;
        border-width: 1px;
    }
    article .left {
        width: 100%;
    }

    article .right {
        width: 100%;
    }

    .sidepic {
		display: none;
    }

    .side_navi {
        text-align: left;
          margin-left: 10px;
    }

    aside .side_navi {
        padding: 10px 5px 5px 5px;
        display: block;
        text-align: left;
    }

    aside .side_centernavi {
        text-align: left;
    }
    footer {
        height: 120px;
    }
    .footertext {
        padding-top: 60px;
        padding-left: 20px;
        text-align: left;
    }

    aside .sidepic {
          text-align: left;
    }

    .small_monobox {
        width: 100%;
        float: left;
        padding-top: 10px;
        padding-left: 0;
        padding-right: 0;
    }

    .medium_monobox {
        width: 100%;
        float: left;
        padding-top: 10px;
        padding-left: 0;
        padding-right: 0;
    }
}

@media screen and (min-width:600px) and (max-width:1000px) {
    .columns {
        float: left;
    }


    .medium-1 {
        width: 50%;
    }
    .medium-2 {
        width: 100%;
    }
    .navbar1 {
        display: none;
    }

    aside {
        border-top-style: solid;
        border-color: #773333;
        border-width: 1px;
    }

    .side_navi {
        text-align: left;
          margin-left: 10px;
    }


    .sidepic {
		display: none;
    }

    aricle .right {
        padding-left: 10px;
    }

    article .left {
        padding-right: 10px;
    }

    .small_monobox {
        width: 100%;
        float: left;
        padding-top: 10px;
        padding-left: 40px;
        padding-right: 40px;
    }

    .medium_monobox {
        width: 100%;
        float: left;
        padding-top: 10px;
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media screen and (min-width: 1000px) {
    .container {
        background-image: url("images/revbg_image.png");
        background-repeat: repeat-y;
        background-position: 25% 0;
        background-color: #e0e0e0;
    }

    .columns {
/*        float: left;*/
        padding-left: 1em;
        padding-right: 1em;
    }


    article {
        min-height: 600px;
        float: right;
    }

    .large-1 {
        width: 25%;
    }

    .large-2 {
        width: 50%;
    }

    .large-3 {
        width: 75%;
    }
    .large-4 {
        width: 100%;
    }
    .navbar2 {
        display: none;
    }

    article .right {
        padding-left: 10px;
    }

    article .left {
        padding-right: 10px;
    }
}