/* KMI Template Base: Version 1.3 */

/*************************************************
* Reset & Basics
*************************************************/

html {
  height:100%;
  font-size:16px;
}
body {
  height:100%;
  color:#333;
  font-family:Arial, Helvetica, sans-serif;
  font-weight:300;
  font-size:0.8em;
  line-height:1.5em;
}
html, body, div, span, applet, object, iframe, input,
h1, h2, h3, h4, h5, h6, hr, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	vertical-align:baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display:block;
}
address {font-style: normal;}
table {
	border-collapse:collapse;
  border-spacing:0;}
ol, ul {
	list-style:none;
  list-style-image:none;
  list-style-type:none;
  list-style-position:inside;
}
strong, b {font-weight:700;}
em, i {font-style:italic;}
img {line-height:0;}

.clearfix:after {
  content:".";
  display:block;
  clear:both;
  visibility:hidden;
  line-height:0;
  height:0;}
.clearfix {display:inline-block;}
html[xmlns] .clearfix {display:block;}
* html .clearfix {height:1%;}

/*************************************************
* Typography
*************************************************/

/* Titles */
h1 {
  font-weight:700;
  font-size:2em;
  line-height:1.25em;
  margin:0 0 1em 0;}
h2 {
  font-weight:700;
  font-size:1.5em;
  line-height:1.25em;
  margin:0 0 1em 0;
}
/* img + h2, p + h2, table + h2, ol + h2, ul + h2, form + h2 {margin:2em 0 1em 0;} */

.ruler-after + div h2 {margin:1.4em 0 1em 0;}
.ruler-before + div h2 {margin:1.4em 0 1em 0;}
h3 {
  font-weight:700;
  font-size:1.3em;
  line-height:1.25em;
  margin-bottom: 0.25em;
}
/* img + h3, p + h3, table + h3, ol + h3, ul + h3, form + h3 {margin:2em 0 1em 0;}
h3 {margin:1.4em 0 1em 0;}
.frame-ruler-after + div h3 {margin:1.4em 0 1em 0;}
.frame-ruler-before + div h3 {margin:1.4em 0 1em 0;} */

/* Text */
p {margin:0 0 1em 0;}
sup {
   font-size:0.75em;
   position: relative;
   top: -0.4em;
}
sub {
  font-size:0.75em;
  position: relative;
  top: 0.4em;
}

/* Links */
a {
  color:#333;
  text-decoration:underline;
  font-weight:bold;
}
a:hover,
a:focus,
a.activ {
  color:#111;
  text-decoration:none;
}
a:visited {color:#666;}

/* Tables */
table {
  margin:0 0 1em 0;
  vertical-align:top;
  font-size:1em; /* Bugfix RTE */
  }
th {font-weight:700;}
th, td {
  vertical-align:top;
  padding:0 1em 1em 0;
  }
th:last-child, td:last-child {padding:0 0 1em 0;}
td p:last-child {margin:0;}
caption {
  margin:0 0 1em 0;
  font-weight:700;
  }
table.border img {display:block;}
table.border th,
table.border td {
  padding:0.3em 0.6em;
  border:1px solid #666;
}
table.border th.no-padding,
table.border td.no-padding {padding:0;}

/* Lists Ordered */
ol {
  list-style-type:decimal;
  margin:0 0 1em 1.4em;}
ol li {text-indent:-1.4em;}
ol ol {margin:0 0 0 1.4em;}
td > ol {margin:-1.2em 0 -1.2em 1.5em;} /*necessary in frontend but buggy in rte*/

/* Lists Unordered - Special Symbol */
.content ul {margin:0 0 1em 1.5em;}
.content ul li {text-indent:-1.5em;}
.content ul li:before {content:"•"; padding:0 1em 0 0;}
.content ul ul {margin:0 0 0 1.5em;}
.content td > ul {margin:-1.2em 0 -1.2em 1.5em;} /*necessary in frontend but buggy in rte*/

/* line */
hr {
  border:none;
  border-bottom:1px solid #666;
  margin:2em 0 2em 0;
}


/*************************************************
* RTE Configuration (class definition has to be in styles.css)
*************************************************/
/* Align Classes for RTE*/
h1.align-left,
h2.align-left,
h3.align-left,
p.align-left,
img.align-left,
th.align-left,
td.align-left,
caption.align-left {text-align:left;}
h1.align-center,
h2.align-center,
h3.align-center,
p.align-center,
img.align-center,
th.align-center,
caption.align-center,
td.align-center {text-align:center;}
h1.align-right,
h2.align-right,
h3.align-right,
p.align-right,
img.align-right,
th.align-right,
caption.align-right,
td.align-right {text-align:right;}
h1.align-justify,
h2.align-justify,
h3.align-justify,
p.align-justify,
img.align-justify,
th.align-justify,
td.align-justify,
caption.align-justify {text-align:justify;}

/* Color Classes for RTE */
span.rot {color:#ff0000;}
span.gruen {color:#00ff00;}
span.blau {color:#3492da;}

/*************************************************
* Recordtyp
*************************************************/

/* Ruler After */
.ruler-after {
  border:none;
  border-bottom:1px solid #666;
  margin: 0 0 1.3em;
  padding: 0 0 0.5em;
}
/* Ruler Before */
.ruler-before {
  border:none;
  border-top:1px solid #666;
  margin:3em 0 0 0;
  padding:0.5em 0 0 0;
}

/* Floating Box */
.floating-box {
  width:100%;
  margin:0 0 1em 0;
}
.floating-box .content-column-full .default{
  float:left;
  width:233px;
  margin:0 0 0 25px;

  border:none;
  border-top:3px solid #cacaca;
  padding:2em 0 0 0;
}
.floating-box:first-child .default {
  border:none;
  padding:0;
}
.floating-box .default:first-child{
  margin:0;
}
.floating-box .default + div h2,
.floating-box .default + div h3 {margin:0 0 1em 0;}

/* Akkordeon */
.akkordeon .textpic,
.akkordeon .text {
  border:none;
  border-bottom:1px solid #cacaca;
  margin:0 0 1em 1em;
}

.akkordeon .textpic .text {
	border-bottom:none;
}

.akkordeon header:before {
  content:"↓";
  float:left;
  padding:0 0.3em 0 0;
}

.akkordeon.opened header:before{
  content:"↑";
}

.akkordeon header *{
  font-size: 1em;
  margin:0 0 0.3em 0 !important;
  text-decoration: underline;
  color:#314474;
}
.akkordeon header:hover *{
  text-decoration:none;
}

/* Text mit Bild */
figcaption.textpic-caption {
  font-size:0.9em;
  text-align:justify;
  }

/* Image hover effect */
.ce-gallery a img{	
  -webkit-filter: brightness(100%); 
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;	
}
	
.ce-gallery a img:hover {
  -webkit-filter: brightness(65%); 
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

/* Textpic with border */
div.textpic-border div.ce-gallery img {border:1px solid #444444;}
div.textpic-border div.ce-gallery img.imgplus {border:none !important;}


/*************************************************
* Page
*************************************************/
body {
  width:100%;
  height:100%;}

#page-wrapper {
  width:100%;
  height:100%;}
#page {
  width:970px;
  margin:0 auto;
	background: #ffffff url('../img/page-background.gif') repeat-y;
	-moz-border-radius: 0px 0px 20px 20px;
	-webkit-border-radius: 0px 0px 20px 20px;
	-khtml-border-radius: 0px 0px 20px 20px;
	border-radius: 0px 0px 20px 20px;
	box-shadow: 5px 5px 10px #aaa;
	-webkit-box-shadow: 5px 5px 10px #aaa;
	-moz-box-shadow: 5px 5px 10px #aaa;
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=135, Strength=13);
	}


/*************************************************
* Header
*************************************************/
#header {
  position:relative;
  width:100%;
  /* padding-bottom: 35px; */
	background:#3492da;
}

/* Header Image */
#header-image {
  position:absolute;
  width:768px;
  height:180px;
  overflow:hidden;
	z-index:5;
}

/* Logo */
#logo {
	position:relative;
	float:right;
  width:330px;
  height:180px;
	z-index:10;
}

#mnavbtn{
	display:none;
}

/* Top Navigation */
#topnav {
	/* position:absolute; */
    /* width:auto; */
	/* height:40px;
	top:175px;
	left:250px; */
	z-index:10;
}

#topnav li:before {content:none;}

#topnav li {float:left;}

#topnav a {
    display:block;
    text-align:center;
    text-decoration:underline;
	color:#ffffff;
	padding:5px 10px 0 10px;
	line-height:35px;
	font-size:1.25em;
	font-weight:normal;
}

#topnav a:hover {
    background:#aed3f0;
	color:#3492da;
    text-decoration:none;
}
#topnav .active a {
    text-decoration:none;
    background:#ffffff;
	color:#3492da;
	-webkit-box-shadow:2px -2px 3px 0px rgba(50, 50, 50, 0.64);
	-moz-box-shadow:2px -2px 3px 0px rgba(50, 50, 50, 0.64);
	box-shadow:2px -2px 3px 0px rgba(50, 50, 50, 0.64);
}

/* Länderwahl */
#flags {
    /* height: 35px;
    position: absolute;
    top: 189px; */
}

#flags img{
	margin-left:15px;
}

#flags > a {
    border: 1px solid #000000;
    display: inline-block;
    height: 18px;
    margin: 0 0 0 6px;
}

#langnav li {
	float: left;
}
#langnav a {
	color: #fff;
}
#langnav .first {
		margin-right: 6px;
    border-right: 1px solid #fff;
    padding-right: 6px;
}

/*************************************************
* Main
*************************************************/
#content-container {
  width:100%;
  margin-top: 35px;
}

/* Sub Navigation */
#subnav-wrapper{
  float:left;
  width:230px;
  }
#subnav , #subnavfirst {
width:100%;
}

#subnav ul , #subnavfirst ul {
  margin:0;}
#subnav ul li ,#subnavfirst ul li {
  text-indent:0;
  margin:0 0 0 0;
  position:relative;
  }
#subnav li:before , #subnavfirst li:before{content:none;}
#subnav ul ul li a, #subnavfirst ul ul li a {
  margin:0;
  padding:0.25em 0 0.25em 2em;
  }
#subnav a , #subnavfirst a{
  display:block;
  color:#000;
  text-decoration:none;
  padding:0.25em 2px 0.25em 1em;
  }

.schnarchspange #subnav li.m2 a,	
.schlafapnoe #subnav li.m1 a,
.schnarchspange #subnavfirst li.m2 a,	
.schlafapnoe #subnavfirst li.m1 a
{
	padding:0.5em 2px 0.5em 1em;
	border-top:1px solid #cdcdcd;
	border-bottom:1px solid #cdcdcd;
	margin:5px 0;
}
	
.schnarchspange #subnav li.m2 a.current,	
.schlafapnoe #subnav li.m1 a.current,
.schnarchspange #subnavfirst li.m2 a.current,	
.schlafapnoe #subnavfirst li.m1 a.current
{
	color:#000000;
}
	
.schnarchspange #subnav li.m2 a:before,
.schlafapnoe #subnav li.m1 a:before ,
.schnarchspange #subnavfirst li.m2 a:before,
.schlafapnoe #subnavfirst li.m1 a:before {
  content: url('../img/kalender-icon.png');
	padding-right:8px;
	position:relative;
	top:2px;
}

.schnarchspange #subnav li.m2.active,
.schlafapnoe #subnav li.m1.active,
.schnarchspange #subnavfirst li.m2.active,
.schlafapnoe #subnavfirst li.m1.active
{
	background:#eeeeee;
	border-top:none;
}

#subnav a:hover , #subnavfirst a:hover{background:#aed3f0; color:#ffffff;}
#subnav a.current, #subnavfirst a.current {background:#aed3f0; color:#ffffff;}

#subnav li.active , #subnavfirst li.active{
	border-top:1px solid #ccc;
	background:#ffffff;
}

#subnav li.active a:hover ,#subnavfirst li.active a:hover {background:#3492da; color:#ffffff;}
#subnav li li.active, #subnavfirst li li.active {border-top:none;}

#content-left {
	width:190px;
	padding:0 20px 0 20px;
}

/* Regions Navigation */

#regionnav {
  float:left;
  width:230px;
	margin-top:50px;
	display:none;
	visibility:hidden;
}

#regionnav ul {
  margin:0;
	}
	
#regionnav ul li {
  text-indent:0;
  margin:0 0 0 0;
  position:relative;
  }

#regionnav a {
  display:block;
  color:#000;
  text-decoration:none;
  padding:0.25em 1em;
  }
#regionnav a:hover {background:#ffffff;}
#regionnav a.current {background:#30509c; color:#ffffff; }

/* Sidebar */
#sidebar-wrapper {
  /* float:right;
  width:180px; */
  width: 180px;
  }
	
#cut-logo img{
	padding-bottom:30px;
}
	
#sidebar {
  width:160px;
  padding:0 20px 0 0;
  }
  
#sidebar strong{
	font-size:1.5em;
}

/* Center */
#center-wrapper {
/*   margin:0px 200px 0 250px; */
  }
#center {min-height:350px;}

/* Page Title and Subtitle */
#title h1 .page-title {
  display:block;
  }
#title h1 .page-subtitle {
  display:block;
  font-size:0.7em;
  line-height:1.25em;
  }

/*************************************************
* Footer
*************************************************/
#footer {
  position:relative;
  width:100%;
  }


/* Meta Navigation */
#metanav {
  float:left;
	width:230px;
}
#metanav ul {margin:0 0 0 1em;}
#metanav li {
  text-indent:0;
  list-style-position:outside;
  float:left;
  border-right:1px solid #333;
  padding:0 10px 0 0;
  margin:0 10px 0 0;
	line-height:1em;
  }
#metanav li:before {content:none;}
#metanav li.last {
  border:none;
  padding:0;
  margin:0;
  }

/* Footer Address */
#footer-address {
	float:left;
	line-height:1em;
}
#footer-address p {margin:0;}

/* KMI Logo */
#kmi-logo {
  position:absolute;
  right:-20px;
  bottom:0;
  }

/*************************************************
* Powermail
*************************************************/
/* Resets */
.powermail_fieldset {clear:none;}

/* Font definieren */
div.tx-powermail {font-size:1em;}
div.tx-powermail * {
  font-family:Arial, Helvetica, sans-serif;
  color:inherit;
  font-size:1em;
  }

/* Breiten definieren */
div.tx-powermail {width:100%;}
.powermail_label {width:33%;}
.powermail_field,
.powermail_check_outer,
.powermail_radio_outer {width:65%;}
.powermail_select,
.powermail_submit {width:67%;}

/* Page Title */
.powermail_legend {display:none;}

/* Rahmen und Hintergrund */
.powermail_fieldset {
  background-color:transparent;
  border:none;
  padding:0
  }
.powermail_radio_outer,
.powermail_captcha_outer,
.powermail_check_outer {
  background-color:transparent;
  border:none;
  }
.powermail_create {
  background-color:transparent;
  margin:0;
  padding:0;
  }

/* Positionierung Checkboxes & Radios */
.powermail_check_inner,
.powermail_radio_inner {
  float:left;
  width:100%; /*buggy in IE7*/
  }
.powermail_check_inner .powermail_checkbox,
.powermail_radio_inner .powermail_radio {
  margin:0 0.2em 0.6em 0;
  }
.powermail_radio_outer,
.powermail_check_outer {
  padding:0;
  }

/* Submit Button */
.powermail_submit {
  float:none;
  margin:0 0 0 33%;
  color:#333;
  background:#eee;
  border:1px solid #ccc;
  transition:color 0.2s, background 0.2s;
  -moz-transition:color 0.2s, background 0.2s;
  -webkit-transition:color 0.2s, background 0.2s;
  -o-transition:color 0.2s, background 0.2s;
  }
.powermail_submit:hover,
.powermail_submit:focus {
  background:#ddd;
  color:#444;
  }

/* Antwortseite */
dl.powermail_all dt {clear:none;}
dl.powermail_all dt {width:33%;}
dl.powermail_all dd {width:65%;}

/* Message Box (Javascript Validation) */
.tx-powermail .formError {
  position:relative;
  margin:1px 0 0 39px !important;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)" !important;
  filter: alpha(opacity=100) !important;
  opacity: 1 !important;
  }
.tx-powermail .formErrorContent {
  border:1px solid #666;
  background-color:#666;
  font-size:0.8em !important;
  line-height:1.25em !important;
  }
.tx-powermail .formErrorArrow {
  display:none;
  }
.tx-powermail .formErrorContent:before {
  position:absolute;
  left:-1.2em;
	top:-2px;
  content:'';
	border-top:1.2em solid transparent;
	border-bottom:1.2em solid transparent;
  border-right:1.2em solid #666;
}
.tx-powermail .formErrorContent:after {
  position:absolute;
  right:0;
	top:-0.1em;
  content:'✗';
  font-size:1.4em;
}
.powermail_check_inner .formError {visibility:hidden;}
.powermail_check_inner_1 .formError,
.powermail_radio_inner .formError {
  visibility: visible;
  margin:-4px 0 0 38px !important;
  }

/*************************************************
* Abcourses
*************************************************/

.tx-abcourses-pi1 td {
	padding:0 0 0.5em 0;
}

.tx-abcourses-pi1 input {
	padding: 3px;
	border: 1px solid #ccc;
	margin-bottom:5px;
	width:200px;
}

.tx-abcourses-pi1 textarea {
	padding:0;
	width:200px;
}

.tx-abcourses-pi1 .radiobuttons input{
	width:30px;
}

.tx-abcourses-pi1 .submitbutton {
	margin-left:150px;
	padding: 3px;
}

.tx-html5video-pi1 {
	padding-bottom:10px;
}

/*************************************************
* News
*************************************************/

.news-list-view .bodytext{
	padding-top:1em;
}

.news .news-list-view .article h3{
	font-size:1.3em;
}

.news-list-view h3 a:hover{
	text-decoration:none;
}

.de-frontpage .news .article,
.ch-frontpage .news .article{
	padding-bottom:0;
}

.de-frontpage .news .news-list-view .article h3,
.ch-frontpage .news .news-list-view .article h3{
	font-size:1em;
}

.de-frontpage .news,
.ch-frontpage .news{
	position:relative;
	top:12px;
}

.de-frontpage #sidebar,
.ch-frontpage #sidebar{
	margin-top:9px;
}

.de-frontpage .news .teaser-text p,
.ch-frontpage .news .teaser-text p{
	margin:0 0 0.5em 0;
}

.intro #c2059 .ce-gallery a img:hover,
.intro #c2058 .ce-gallery a img:hover{
	-webkit-filter:brightness(100%);
}

.news .share,
.news .twitter{
	display:none;
}

.news-single .article .teaser-text{
	margin:15px 0 10px 0;
	font-weight:bold;
	color:#000;
	font-size:1em;
}

	
	.tx-sphkadrtts-pi1 input {
    border: 1px solid #ccc;
    padding: 3px;
	}
	.tx-sphkadrtts-pi1 tr.odd {
			background: none repeat scroll 0 0 #ffffff;
	}
	.tx-sphkadrtts-pi1 tr.even {
			background: none repeat scroll 0 0 #eeeeee;
	}
	.tx-sphkadrtts-pi1 tr th {
			background: none repeat scroll 0 0 #cccccc;
			padding: 0.5em 1em;
			text-align: left;
	}
	.tx-sphkadrtts-pi1 tr td {
			padding: 0.5em 1em;
	}


@media screen and (max-width: 1010px) {

	#kmi-logo{
		display:none;
	}
		
}

@media screen and (max-width: 970px) {

	#page{
		width:100%;
	}
	
	#header{
		height:auto;
	}
	
	#header-image{
		width:100%;
		height:auto;
		position:relative;
		max-height:180px;
	}
	
	#header-image img{
		width:100%;
		height:auto;
        margin-bottom: 0;
	}
	
	#logo{
		position:absolute;
		right:0;
		top:0;
		width:43%;
		overflow:hidden;
	}
	
	#logo img{
		width:100%;
		height:auto;
	}
	
	#topnav{
		width:auto;
		height:auto;
		float:left;
		position:relative;
		right:0;
		top:0;
	}
	
	
	#center-wrapper{
		margin:35px 20px 0 250px
	}
	
	#center{
		min-height:50px;
	}
	
	#subnav-wrapper{
		margin-top:30px;
	}
	
	#sidebar-wrapper{
		float:inherit;
		width:auto;
		margin-left:250px;
	}
	
	#cut-logo img{
		padding-top:30px;
		padding-bottom:0;
	}
	
	.de-frontpage #sidebar, .ch-frontpage #sidebar {
		padding:0;
		width:98%;
		margin-top:30px;
	}

}

@media screen and (max-width: 790px) {

	#topnav a{
		padding:5px 5px 0 5px;
	}

	#footer-address{
		margin-left:250px;
		float:none;
	}

	#footer-address p{
		line-height:1.5em;
	}
	
}

@media screen and (max-width: 740px) {

	#topnav a{
		font-size:1.1em;
	}
	
	#flags,
	#langnav {
		top:180px;
	}
	
}

@media screen and (max-width: 969px) {

	h1{
		margin:0 0 0.5em 0;
	}

	#mnav-wrapper{
		position:absolute;
		z-index:100;
		background:#3492da;
	}

	#mnav-top{
		margin-top:60px;
	}
	
	#mnav-top a,
	#mnav-metanav a{
		font-size:1.3em;
		text-decoration:none;
		display:block;
		padding:3px 5%;
		color:#fff;
		font-weight:100;
	}
	
	#mnav-top a.current,
	#mnav-top a.:hover{
		background:#fff;
		color:#3492da;
	}
	
	#mnav-top a.current:before{
		content:">";
	}
	
	#mnav-top > ul > li.active > a{
		border-bottom:1px solid #fff;
		border-top:1px solid #fff;
	}
	
	#mnav-top > ul > li.active > ul{
		border-bottom:1px solid #fff;
	}
	
	#mnav-top > ul > li.last > a{
		margin-bottom:20px;
	}
		
	#mnav-top ul ul a{
		padding:3px 2% 3px 10%;
	}
	
	#mnav-top ul ul ul a{
		padding:3px 2% 3px 15%;
	}
	
	#mnav-metanav{
		padding-bottom:20px;
	}
	
	#page-wrapper{
		position:relative;
		left:0;
	}

	#page{
		background:none;
	}
	
	.lower-wrapper{
		width:100%;
/* 		position:absolute;
		top:0; */
	}
	
	.upper-wrapper{
		position: relative;
		/* top: 50px; */
	}

	#mnavbtn{
		display:block;
		float:left;
		position:relative;
		z-index:100;
	}
	
	img.respnav {
		padding: 0 200px 0 0;
		margin-left:2%;
		cursor:pointer;
	}
	
	#topnav{
		display:none;
	}

	
	#content-container{
		margin-top:50px;
	}
	
	#subnav-wrapper{
		display:none;
	}
	
	#sidebar-wrapper{
		margin-left:0;
		padding:0 2%;
	}

	#center-wrapper{
		margin:10px 0 0 0;
		padding:0 2%;
	}
	
	#footer{
		width:96%;
		padding:20px 2% 10px 2%;
		border-top:1px solid #666;
	}
	
	#footer #metanav{
		display:none;
	}
	
	#footer-address{
		margin-left:0;
	}
		
}

@media screen and (max-width: 470px) {

	.fb_iframe_widget iframe,
	.fb_iframe_widget span{
		width:auto !important;
	}

}

@media screen and (max-width: 440px) {

	div.ce-intext .ce-gallery{
		width:100%;
	}

	.powermail_field, 
	.powermail_check_outer, 
	.powermail_radio_outer{
		width:98%;
	}
	
	.powermail_submit{
		margin:0;
	}

}