body { color: #000000; font-family: Verdana, "lucida grande", arial, sans-serif; background-color: #f4f4f4; text-align: center; margin: 0; padding: 0; }
#page {font-size: 100%; line-height: 1.5; background-color: white; text-align: left; border: solid 1px #6e7276; max-width: 1220px; margin: 15px auto 50px; }

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++ Kopf +++++++++++++++++++++++++++++++++++++++++++++++++++++ */

#head { background-image: url(../media/PCM_bg-25.jpg); background-repeat: no-repeat; background-size: cover; aspect-ratio: 11/1;}




#head_left img {width: 200px; margin-left: 20px; margin-top: 25px;}
#head_right p {margin-left: 20px; margin-top:10px;  font-size: 1.2em; color: #000000; }

@media only screen and (min-width:768px) {

#head_left { width: 300px; height: 125px; float: left; }
#head_left img {width: 200px; margin-left: 50px; margin-top: 25px;}

#head_right { height: 125px; float: left; }
#head_right p {margin-left: 0px;  margin-top: 80px;  }

}


#head_1_left { background-color: #8a9ade; height: 20px; width: 56%; float: left; }
#head_1_right { background-color: #6e1d3e; height: 20px; text-align: right; width: 44%; float: right; }


#head_1_right  a {text-decoration: none; color: white;}





/* +++++++++++++++++++++++++++++++++++++++++++++++++++++ Kopf +++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++ Content +++++++++++++++++++++++++++++++++++++++++++++++++++++ */

div { margin:0; padding:0; }


div.textbox {margin-left: 20px; margin-right: 25px;}

@media only screen and (min-width:768px) {
.content_left { width: 60%; float: left;}
.content_right { text-align:left; width:40%; float: left;}

div.textbox {margin-left: 50px; }
}

#content .textbox a{text-decoration: underline;}


/* +++++++++++++++++++++++++++++++++++++++++++++++++++++ Content aktuell +++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.aktuell { background-color: #eff4fb; width: 565px; float: left; margin-bottom: 1em; margin-top: 1em; padding: 0.5em; }

#content .textbox .aktuell a {text-decoration: none;}
#content .textbox .aktuell a:hover {
	text-decoration: underline;
}

/* ++++++++++++++++++++++++++++++ ausgelesene Artikel +++++++++++++++++++++++++++++++++++ */
#artikel { width:100%; float: left; margin-top: 1em;}
.datum {
margin-left: 5px;    
  float:left;
  width: 20%;
  border-top: 1px solid #da004d;
  font-size: 0.8em;
   
}
.titel {  
  float:left;
  width: 80%;
  border-top: 1px solid #da004d;
  font-size: 0.8em;

  margin-bottom: 0.7em;
}

.title a:hover {
	text-decoration: underline;
}

/* ++++++++++++++++++++++++++++++ Content Tags +++++++++++++++++++++++++++++++++++ */

a {text-decoration: underline; color: #0047bb; padding-top: 16px; padding-bottom:16px;}
#content a.line {text-decoration: underline;}

#content .infobox a {text-decoration: underline;}


/* ++++++++++++++++++++++++++++++ Liste mit Pfeilen +++++++++++++++++++++++++++++++++++ */


.liste {margin-bottom: 1.4em;}

ul.arrows
{
list-style-type: none;
padding: 0;
margin: 0 0 50px 0;
}


li 
{
    list-style-type: none;
    background-image: url(../media/pfeil.gif);
    background-repeat: no-repeat;
    background-position: 0 .2em;
    padding-left: .8em;
    font-size: 1em; 

	margin-bottom: 0.7em;
	} 





/* ++++++++++++++++++++++++++++++ Ende Liste mit Pfeilen +++++++++++++++++++++++++++++++++++ */


p, h3, h4 {margin:0; padding:0; }
p { font-size: 1em; line-height: 1.5; margin-bottom: 0.7em;}

h1 { font-size: 1.4em; line-height: 1.5; margin-top: 2.5em; margin-bottom: 0.8em; }
h2{ color: #0047bb; font-size: 1.3em; line-height: 1.6em; margin-top: 2.5em;   margin-bottom: 0.8em; }
h3, .h3 {font-size: 1.2em;  margin-top: 1.5em;  }
h4, .h4 {font-size: 1em;}

.content_left .aktuell p, .content_left .aktuell h3, .content_left .aktuell h4 { margin-right: 10px; margin-bottom: 0.7em; margin-left: 5px; }
.content_left .aktuell p { margin-top: 4px; }
.content_left h4 { padding-top: 2em; }
.content_left .aktuell h4 { padding-top: 0.4em;}

.content_right p { margin-bottom: 0.6em; }
.datum { width: 7em; float: left; display: block; }

#head_1_left p, #head_1_right p { color: white; font-size: 0.7em; line-height: 0.8em;  margin-right: 2em; padding-top: 0.4em; padding-bottom: 0.4em;}

.nobr { white-space: nowrap; }

/* ++++++++++++++++++++++++++++++ Rechte Spalte +++++++++++++++++++++++++++++++++++ */


.kontaktbox { max-width: 370px; background-color: #faf5f6; text-align: left;  margin-top: 2.5em; margin-left: 20px; margin-right: 20px; padding-bottom: 0.7em; border: solid 1px #6e7276; }



.infobox .headline { color: white; background-color: #6e1d3e; margin-bottom: 0.4em; }

.kontaktbox .headline { color: white; background-color: #6e1d3e; margin-bottom: 0.4em; }

.content_right .headline h3 { font-size: 1em; font-weight: normal; text-transform: uppercase; margin-top: 0; margin-right: 10px; margin-left: 10px; padding-top: 0.4em; padding-bottom: 0.4em; }
.content_right p { font-size: 1em; margin-right: 10px; margin-left: 10px; }


/* ++++++++++++++++++++++++++++++ Fuss? +++++++++++++++++++++++++++++++++++ */


.clear { line-height: 1px; height: 1px; clear: both; }



.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  z-index: 100;
  background: #fff;
  color: #000;
  padding: 0.5em 1em;
  text-decoration: none;
}
.skip-link:focus,
.skip-link:active {
  left: 0;
  top: 0;
  width: auto;
  height: auto;
  overflow: visible;
  outline: 2px solid #000;
}