@charset "utf-8";
/* CSS Document */

/* =============================================
	Kalibrierung/Reset 
================================================ */

* {
	margin: 0;
	padding: 0;
}

html {
 	overflow-y: scroll;	
	/* Mobile Styles, text-size adjustments für Mobile soll nicht angepasst werden (resp. bleibt 100%),
	   es gibt: none (keine Anpassung), auto (Browser kann bestimmen), %value (x% vergrössern/vrkleinern) */
	-webkit-text-size-adjust: 100%; 
	-ms-text-size-adjust: 100%;
}

body {
	background-color: #CCC;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 18px; /* 130%, wird unterschiedlich dargestellt */
}

/* =============================================
	Allgemeine Styles 
================================================ */

h1, h2 {
	font-weight: bold;
	color: #000;
}

h1 {
	font-size: 24px;
	padding: 10px 0 20px 0;	
}

h2 {
	font-size: 18px;
	padding: 10px 0;	
}

h3 {
	font-size: 12px;
	padding-left: 195px;
}

h4 {
	font-size: 14px;
	font-weight: bold;
}

/*für Ati 40*/
h5 {
	font-size: 24px;
	font-weight: bold;
	padding-bottom: 0px;
	color: #000;
}

p {
	padding-bottom: 10px;
}

img {
	border: 0px; /* auch wenn das Bild ein Link ist: kein Rand */
}

strong {
	font-size: 14px;
	color: #cc0000;
}

/* Aylin is born */
p.wichtig {
	padding: 10px 0;
	font-size: 16px;
	line-height: 22px;
}

p.aylin {
	padding: 15px 0 10px 0;
	font-size: 24px;
}

p.datum {
	font-size: 16px;
}

/* Links */

a:link,
a:visited {
	color: #cc0000;
	text-decoration: none;	
}

a.wohnung:link,
a.wohnung:visited {
	color: #060;
	text-decoration: none;	
}

a.wohnung:hover, 
a.wohnung:active {
	text-decoration: underline;
}

a:hover, 
a:active {
	text-decoration: underline;
}

a.button:link,
a.button:visited {
	display: inline-block;
	padding: 5px;
	text-align: center;
	text-decoration: none;
	background-image: url('../../images/design/navi_level1_90.png'); /* leicht transparenter roter Hintergrund */
	color: #fff;
	margin-top: 10px;	
}

a.button:hover,
a.button:active {
	background-image: none;
	background-color: #666666;
}

.feedback {
	margin-top: 20px;
	font-style: italic;
	padding: 5px;
	background-color: #eee;	
}

a:focus {
	outline: none; /* kleiner Ramen verschwindet */
}

/* =============================================
	Layout Styles 
================================================ */

#wrapper {
	width: 980px;
	height: auto;
	background-color: #FFF;
	/* more background properties */
	margin: 20px auto 0 auto;	
}

#header {
	height: 200px; 
	position: relative;	
}

#header a,
#header a:visited {
	padding: 100px 145px 100px 100px; /* mit diesem padding ist das ganze Navigtions-Bild anklickbar */
}

a.aylin {
	background-image: url("../../images/design/aylin_sw.jpg");
	background-repeat: no-repeat; /* Hintergrundbild soll nicht dupliziert werden */
	position: absolute;
	top: 0px;
	left: 0px;
}

a.aylin:hover,
a.aylin:active {
	background-image: url("../../images/design/aylin_farbe.jpg");
}

a.dorine {
	background-image: url("../../images/design/dorine_sw.jpg");
	background-repeat: no-repeat; /* Hintergrundbild soll nicht dupliziert werden */
	position: absolute;
	top: 0px;
	left: 245px;
}

a.dorine:hover,
a.dorine:active {
	background-image: url("../../images/design/dorine_farbe.jpg");
}

a.noemi {
	background-image: url("../../images/design/noemi_sw.jpg");
	background-repeat: no-repeat; /* Hintergrundbild soll nicht dupliziert werden */
	position: absolute;
	top: 0px;
	left: 490px;
}

a.noemi:hover,
a.noemi:active {
	background-image: url("../../images/design/noemi_farbe.jpg");
}

a.atilla {
	background-image: url("../../images/design/atilla_sw.jpg");
	background-repeat: no-repeat; /* Hintergrundbild soll nicht dupliziert werden */
	position: absolute;
	top: 0px;
	left: 735px;
}

a.atilla:hover,
a.atilla:active {
	background-image: url("../../images/design/atilla_farbe.jpg");
}


#content {
	padding: 20px;	
	position: relative;
	min-height: 400px;
}

#maincontent {
	width: 600px;
	margin-top: 0px;	
}

#maincontent.neujahr {
	text-align: center;	
}

#maincontent.aylin_born {
	
	width: 370px; /* maincontent und sidecontent anders im aylin born */
	min-height: 532px;
}

#sidecontent {
	position: absolute;
	text-align: center;
	top: 20px;
	right: 20px;
	width: 300px; 
}

#sidecontent.aylin_born {
	width: 530px;	/* maincontent und sidecontent anders im aylin born */
}

#sidecontent img{
	padding-bottom: 10px;
}

#footer {
	background-image: url('../../images/design/navi_level0_bg.png'); 
	background-repeat: repeat-x;
	background-position: left top;	
}

#footer p {
	padding: 10px;	
}

#footer a,
#footer a:visited {
	color: #000;
	text-decoration: none;	
}

#footer a:hover,
#footer a:active {
	color: #000;
	text-decoration: underline;	
}

/* Navigation */

#navigation {
	background-image: url('../../images/design/navi_level0_bg.png');
	background-repeat: repeat-x;
	background-position: left top;
	height: 42px; 
	position: relative;
	z-index: 100;
}

#navigation ul.level0 li{
	list-style: none;
	float: left;
	border-right: 1px solid #333;
	position: relative;
}

#navigation ul.level0 li a:hover {
	background-image: url('../../images/design/navi_level0_bg_hell.png');
}

#navigation ul.level0 li a:link,
#navigation ul.level0 li a:visited {
	color: #fff;
	font-size: 16px;
	text-decoration: none;
	display: block;
	padding: 12px 10px 14px 10px;
	line-height: 16px;
	height: 16px;
}

#navigation ul.level1 {
	position: absolute;
	left: 0px;
	top: 42px;
	display: none;
}

#navigation ul.level0 li:hover ul.level1 {
	display: block;
}

#navigation ul.level0 li ul.level1 li {
	/* float: none; */ /* herausgenommen wegen IE7 */
	background-image: url('../../images/design/navi_level1_90.png'); /* leicht transparenter roter Hintergrund */
	/* background-color: #cc0000; /* rote Hintergrundfarbe */
	width: 120px;
	border-right: none;
	border-bottom: 1px solid #333;
}

#navigation ul.level1 li a:hover {
	color: #000;
	background-image: none;
}

.current {
	color: #000000 !important;
}

.zitat {
	margin-top: 55px;
	font-style: italic;
	font-size: 12px;
	text-align: center;
	padding: 10px;
	background-color: #eee;
}

.abstand {
	padding-top: 5px;
}


/* ------- Formular ------- */

form.content-form {
	padding-top: 10px;
	padding-right: 20px;
}

form.content-form fieldset {
	padding: 10px;
	margin-bottom: 10px;
	background-color: #eee;
	border: 1px solid #000;
}

form.content-form legend {
	border: 1px solid #cc0000;
	padding: 3px;
	background-color: #FFF;
}

form.content-form dt {
	float: left;	
}

form.content-form dt label {
	cursor: pointer;	
}

form.content-form dd {
	margin-left: 110px;
	margin-bottom: 5px;
}

form.content-form dd input:focus,
form.content-form dd textarea:focus {
	background-color: #e0e0e0;
}

form.content-form input[type=submit] {
	cursor: pointer;
	padding: 2px 5px;	
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 13px;
}

form.content-form input[type=submit]:hover {
	background-color: #fff;
	color: #cc0000;
}

/* ------- Links ------- */

.links p {
	float: left;
}

.links p.krippe {
	padding-left: 65px;
	padding-top: 25px;
}

.links img.krippe {
	padding-left: 0px;
}

.links p.spielgruppe {
	padding-left: 81px;
	padding-top: 25px;
}

.links img.spielgruppe {
	padding-left: 15px;
}

.links p.atipower {
	padding-left: 111px;
	padding-top: 25px;
}

.links img.atipower {
	padding-left: 45px;
}



/* =============================================
	Sonstige Styles 
================================================ */

/* Clearfix */
.clearfix:before, .clearfix:after {
	content: "\0020"; 
	display: block; 
	height: 0; 
	visibility: hidden;	
}
 
.clearfix:after { 
	clear: both; 
}

.clearfix { 
	zoom: 1; 
}

/* BeginOAWidget_Instance_2141542: #ImageSlideShow */

#ImageSlideShow.ImageSlideShow {
	width: 300px;
	height: 400px;
	border: solid 1px transparent;
}

#ImageSlideShow .ISSClip {
	background-color: #ffffff;
}
    
/* EndOAWidget_Instance_2141542 */

/******************** ATI 40 Slide Show *************************/

/* BeginOAWidget_Instance_2141543: #Ati40SlideShow */
#Ati40SlideShow {
	width: 700px;
	margin: 40px 0px 0px 0px;
	border: solid 0px #AAAAAA;
	background-color: #FFFFFF;
	padding-top: 10px;
}

#Ati40SlideShow .ISSName {
	top: -20px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 18px;
	text-transform: none;
	color: #cc0000;
}

#Ati40SlideShow .ISSSlideTitle {
	top: -10px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 12px;
	overflow: hidden;
	color: #666666;
	text-transform: none;
}

#Ati40SlideShow .ISSClip {
	height: 450px;
	margin: 0;
	border: solid 0px transparent;
	background-color: #ffffff;
}

#Ati40SlideShow .ISSControls {
	top: 11px;
	height: 450px;
}

#Ati40SlideShow .FilmStrip {
	height: 80px;
	background-color: transparent;
}

#Ati40SlideShow .FilmStripPreviousButton, #Ati40SlideShow .FilmStripNextButton {
	width: 25px;
	height: 80px;
}

#Ati40SlideShow .FilmStripTrack {
	height: 80px;
}

#Ati40SlideShow .FilmStripContainer {
	height: 80px;
}

#Ati40SlideShow .FilmStripPanel {
	height: 80px;
	padding-left: 10px;
	margin-right: 0px;
}

#Ati40SlideShow .FilmStripPanel .ISSSlideLink {
	margin-top: 10px;
	border: solid 1px #cccccc;
	background-color: #FFFFFF;
}

#Ati40SlideShow .FilmStripPanel .ISSSlideLinkRight {
	border: solid 1px transparent;
	width: 58px;
	height: 47px;
	margin: 4px 4px 4px 4px;
}

#Ati40SlideShow .FilmStripCurrentPanel .ISSSlideLink {
	background-color: #FFFFFF;
	border-color: #cc0000;
}

#Ati40SlideShow .FilmStripCurrentPanel .ISSSlideLinkRight {
	border-color: transparent;
}
/* EndOAWidget_Instance_2141543 */