.container {
  background: #fff;
  max-width: 991px;
  margin: 5px auto;
  font-family: ptsw, arial;
}

.links {
  width: 266px;
  background: #fff;
  float: left;
  margin-right: 40px;
}

.mitterechts {
  width: 685px;
  background: #fff;
  float: left;
}

.mitte {
  width: 352px;
  background: #fff;
  float: left;
}

.abstandnav {
  height: 45px;
  background: #fff;
}

.navi {
  background-image: url("bilder/navi_top/striche_vertikal.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  height: 22px;
  }

.navi a {
  font-family: klavika, arial;
  font-size: 15px;
  text-decoration: none;
  color: rgb(77, 129, 149);
}

.navi a:hover {
  font-family: klavika, arial;
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
  color: rgb(77, 129, 149);
}

.navi a:visited {
  font-family: klavika, arial;
  font-size: 15px;
  text-decoration: none;
  color: rgb(77, 129, 149);
}

.navi a:active {
  font-family: klavika, arial;
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
  color: rgb(77, 129, 149);
}

.navi a:focus {
  font-family: klavika, arial;
  font-size: 15px;
  font-weight: bold;
  text-decoration: none;
  color: rgb(77, 129, 149);
}

.abstandmitte {
  height: 13px;
  background: #fff;
}

.contentpic {
  text-align: left;
  font-family: ptsw, arial;
  font-size: 12px;
}

.rechts {
  width: 293px;
  background: #fff;
  float: right;
  margin-left: 40px;
}

.abstandcont {
	height: 85px;
	background: #fff;
}

.content {
  text-align: left;
  font-family: ptsw, arial;
  font-size: 12px;
}

.content h1 {
  font-family: ptsw, arial;
  font-size: 12px;
  font-weight: bold;
}

.content strong {
  font-family: ptsw, arial;
  font-size: 12px;
  color: rgb(234, 76, 77);
}

.content td {
  font-family: ptsw, arial;
  font-size: 12px;
}

.content a {
  font-family: ptsw, arial;
  font-size: 12px;
  text-decoration: none;
  font-weight: bold;
  color: rgb(234, 76, 77);
}

.content a:hover {
  font-family: ptsw, arial;
  font-size: 12px;
  text-decoration: underline;
  font-weight: bold;
  color: rgb(234, 76, 77);
}

.content a:visited {
  font-family: ptsw, arial;
  font-size: 12px;
  text-decoration: none;
  font-weight: bold;
  color: rgb(234, 76, 77);
}

.content a:active {
  font-family: ptsw, arial;
  font-size: 12px;
  text-decoration: underline;
  font-weight: bold;
  color: rgb(234, 76, 77);
}

.content a:focus {
  font-family: ptsw, arial;
  font-size: 12px;
  text-decoration: underline;
  font-weight: bold;
  color: rgb(234, 76, 77);
}

a#linkblau {
  text-decoration: none;
  color: rgb(77, 129, 149); 
  font-weight: bold;
  font-style: italic;
}

.footer {
  background: #fff;
  margin-top: 20px;
  margin-bottom: 30px;
  height: 100%;
}

.footer a {
  font-family: klavika, arial;
  font-size: 12px;
  text-decoration: none;
  color: rgb(77, 129, 149);
}

.footer a:hover {
  font-family: klavika, arial;
  font-size: 12px;
  text-decoration: none;
  font-weight: bold;
  color: rgb(77, 129, 149);
}

.footer a:visited {
  font-family: klavika, arial;
  font-size: 12px;
  text-decoration: none;
  color: rgb(77, 129, 149);
}

.footer a:active {
  font-family: klavika, arial;
  font-size: 12px;
  text-decoration: bold;
  color: rgb(77, 129, 149);
}

.footer a:focus {
  font-family: klavika, arial;
  font-size: 12px;
  text-decoration: bold;
  color: rgb(77, 129, 149);
}

@media only screen and (max-width: 1030px) {
.container {width: 660px;}
.mitterechts {width: 352px;}
.mitte {width: 100%;}
.rechts {width: 100%; margin-left: 0px;}
.content {padding-left: 20px; padding-right: 20px;}
.abstandcont {height: 10px;}
.content {min-height: 0px;}
.footer {padding-left: 17px; padding-right: 17px;} 
}

@media only screen and (max-width: 710px) {
.container {max-width: 352px; width: 100%;}
.links {width: 100%; max-width: 266px; float: right; margin-left: 86px; margin-right: 0px}
.mitterechts {width: 100%;}
.mitte {width: 100%;}
.rechts {width: 100%; margin-left: 0px;}
.content {padding-left: 20px; padding-right: 20px;}
.abstandcont {height:10px;}
.abstandnav {height: 20px;} 
.content {min-height: 0px;}
.footer {padding-left: 17px; padding-right: 17px;} 
}

span#mail::after {
  content: "\40kokon-hannover.de";
}

span#mailww::after {
  content: "\40wort-wechsel.de";
}

@font-face {
  font-family: ptsw;
  src:url("fonts/text_font/ptsw.woff") format("woff");
}

@font-face {
  font-family: ptsw;
  src:url("fonts/text_font/ptsw_bold.woff") format("woff");
  font-weight: bold;
}

@font-face {
  font-family: ptsw;
  src:url("fonts/text_font/ptsw_italic.woff") format("woff");
  font-style: italic;
}

@font-face {
  font-family: ptsw;
  src:url("fonts/text_font/ptsw_bolditalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: klavika;
  src:url("fonts/navi_font/klavika.woff") format("woff");
}

@font-face {
  font-family: klavika;
  src:url("fonts/navi_font/klavika_bold.woff") format("woff");
  font-weight: bold;
}

@font-face {
  font-family: klavika;
  src:url("fonts/navi_font/klavika_italic.woff") format("woff");
  font-style: italic;
}

@font-face {
  font-family: klavika;
  src:url("fonts/navi_font/klavika_bolditalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
}