﻿@charset "utf-8";
/* CSS Document */
/*******************************************************************/
/*Copyright 2011 Stefan Schmid-Gaiser ******************************/
/*******************************************************************/
/*E-MAIL SPAMSCHUTZ*/
p.spamPro {
	unicode-bidi:bidi-override;
	direction:rtl;
	text-align:inherit;
}
span.spamPro:after {
	content:"\40";
}

* {
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
}
body {
	font-family: Arial, Helvetica, sans-serif;
	background-image:url(../Bilder/Stylesheet/bg_body2.jpg);
	background-repeat:repeat;	
}
h6 {
	margin-top: 12px;
	margin-bottom: 8px;
	text-decoration: underline;
	font-size:14px;
}
a {
  text-decoration: none; 
  outline: none;  /*Unterstreichung entfernen...*/
}
a:link {
	color: black;
}
a:visited {
  color:#666; 
}
a:hover, a:focus {
  color: #666;
}
a:active  {
  color: #666; 
}
/*Kein Symbol externer Link, wenn Link auf eigene Seite führt (bei Absoluter verlinkung nötig)*/
#inhalt-textfeld a[href^="http://www.schmid-gaiser.com"], #inhalt-textfeld a[href^="http://schmid-gaiser.com"]{
  background-image: none;
  padding-right: 0;
}
/*fügt Symbol für extere Links hinzu*/
#inhalt-textfeld a[href^="http:"], #inhalt-textfeld a[href^="https:"] {
  background: url(../Bilder/Stylesheet/externer_Link.gif) no-repeat right;
  padding-right: 18px;
}
/*fügt Symbol für Webmail hinzu*/
#inhalt-textfeld a[href^="http://webmail.schmid-gaiser.com"], #inhalt-textfeld a[href^="mailto:"] {
  background: url(../Bilder/Stylesheet/e-mail_Link.jpg) no-repeat right;
  padding-right: 30px;
}
#computer-rahmen {
	position: absolute;
	top:0px;
	left:50%;
	margin-left:-512px; /*um die ganze Box in die Mitte zu setzen muss die Hälfte der Beite als negativer Außenabstand angegeben werden. (margin-left) */	
	width: 1024px;
	height: 935px;
	background-image: url(../Bilder/Stylesheet/Rechner_NEU_iStock_000013319494Medium.png);
	background-repeat:no-repeat;
}
.power-button {
	position: absolute;
	display: block;
	top: 635px;
	left: 50%;
	width: 40px;
	height: 40px;
	margin-left: -15px;
	background: url(../Bilder/Stylesheet/power-button.png) 0px -40px no-repeat;
	text-indent: -999999px;
	color: #fff;
	z-index: 99;
}
.power-button:hover {
	background: url(../Bilder/Stylesheet/power-button.png) 0px 0px no-repeat;
}
#bildausschnitt {
	position:relative; /*relativ zum umschließenden !!positionierten Element der Seite. Oder Platz im Textfluss, an dem das Element wäre bleibt belegt. Das element wird nur relativ anders positioniert.*/
	top: 40px;
	left: 41px;
	width: 945px; /*Eigentliche Seite hat so nur 824px*/
	height: 532px;
	background-image: url(../Bilder/Stylesheet/Background_PC2.jpg);
	background-repeat: no-repeat;
	color: #000;
	overflow: hidden;
}
/*Bodenseeplan*/
#bildausschnitt.bodensee {
	background-image:url(../Bilder/Stylesheet/Background_bodensee.jpg);
}
/*Fotoalben*/
#bildausschnitt.fotoalbum {
	background-color: #000;
	background-image: none;
}
/*FEHLERSIETEN*/
#bildausschnitt.fehler {
	background-image:none;
	background-color: #00F;
	color: #ffffff;
	width: 935px;
	height: 523px;
	padding: 5px;
}
a.fehler {
	color: #ffffff;
	background-color: #cacaca;
	border: 1px solid #000;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 3px;
	padding-bottom: 5px;
	-moz-border-radius: 5px;	/*Firefox*/
	-khtml-border-radius: 5px;	/*Konquer*/
	-webkit-border-radius: 5px;	/*Safari, Chrome */
	border-radius:5px;			/* CSS 3*/
}
a.fehler:hover {
	background-color:#999;
}
/*LOGINSIETE*/
#bildausschnitt.login {
	background: #000;
}
#login1, #login2 {
	position: absolute;
	width: 100px;
	height: 220px;
	background-repeat:no-repeat;
	background-position: bottom;
	text-indent: -999999px;
	z-index: 99;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 	/*Internet Explorer IE8*/
	filter: alpha(opacity=50); 											/*für Internet Explorer 5-7*/
	-moz-opacity:0.50;													/*für Mozilla*/
	opacity:0.50;														/*CSS3*/
}
#login1:hover, #login2:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 	/*Internet Explorer IE8*/
	filter: alpha(opacity=100); 										/*für Internet Explorer 5-7*/
	-moz-opacity:1.0;													/*für Mozilla*/
	opacity:1.0;														/*CSS3*/
	text-indent: 0px;
	text-align: center;
	color: #FFF;
	font-size: 18px;
	font-family: 'Lobster', cursive;
}
#login1 {
	top: 180px;
	left: 50%;
	margin-left: -150px;
	background-image:url(../Bilder/Stylesheet/Login.jpg);
	background-position: 0px 40px;
}
#login2 {
	top: 180px;
	left: 50%;
	margin-left: 50px;
	background-image:url(../Bilder/Stylesheet/Login.jpg);
	background-position: -100px 40px;
}
/*TESTFELD*/
#textfeld, #textfeld-formular {
	margin-left:auto;
	margin-right:auto;
	margin-bottom:0px;
	padding: 0;	
	background-color: white;
	border: 1px solid #000;
	-moz-border-radius-topleft: 5px;		/*Firefox*/
	-moz-border-radius-topright: 5px;		/*Firefox*/
	-khtml-border-radius-topleft: 5px;		/*Konquer*/
	-khtml-border-radius-topright: 5px;		/*Konquer*/
	-webkit-border-top-right-radius: 5px;	/*Safari, Chrome*/
	-webkit-border-top-left-radius: 5px;	/*Safari Chrome*/
	border-top-left-radius: 5px;			/* CSS 3 */
	border-top-right-radius: 5px;			/* CSS 3 */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";	
	filter: alpha(opacity=85); 											
	-moz-opacity:0.85;													
	opacity:0.85;
	z-index: 0;
	-webkit-box-shadow: 0px 2px 10px 0px #000;
	-moz-box-shadow: 0px 2px 10px 0px #000;
	box-shadow: 0px 2px 10px 0px #000;
}
#textfeld {
	background-color: white;
}
#textfeld-formular {
	background-color: #cacaca;
}
#textfeld.vollbild, #textfeld-formular.vollbild { width: 945px; height: 512px; margin-top: 0px;}
#textfeld.default { width: 550px; height: 350px; margin-top: 40px;}
#textfeld-formular.default {width: 550px; height: 430px; margin-top: 10px;}
#textfeld.minimiert, #textfeld-formular.minimiert {display: none;}
/*KOPFZEILE TEXTFELDER*/
#kopfzeile-textfeld {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
	margin-top: 0px;
	padding-top: 1px;
	padding-left: 5px;
	height: 20px;
	text-align: center;
	background-color: #cacaca;
	color: #000;
	-moz-border-radius-topleft: 5px;		/*Firefox*/
	-moz-border-radius-topright: 5px;		/*Firefox*/
	-khtml-border-radius-topleft: 5px;		/*Konquer*/
	-khtml-border-radius-topright: 5px;		/*Konquer*/
	-webkit-border-top-right-radius: 5px;	/*Safari, Chrome*/
	-webkit-border-top-left-radius: 5px;	/*Safari Chrome*/
	border-top-left-radius: 5px;			/* CSS 3 */
	border-top-right-radius: 5px;			/* CSS 3 */
	/* alte webkit-basierte Browser (Safari, Chrome, etc.) */
	background: -webkit-gradient(linear, left top, left bottom, from(#cacaca), to(#999));
	/* neue webkit-basierte Browser(Safari, Chrome, etc.) */
	background: -webkit-linear-gradient(top, #cacaca, #999);
	/* Mozilla/Gecko (Firefox, Flock, etc) */
	background: -moz-linear-gradient(top, #cacaca, #999);
	/* Für Presto (Opera ab Version 11.1) */
	background: -o-linear-gradient(top, #cacaca, #999);
	/* IE10 Pre-Beta */
	background: -ms-linear-gradient(top, #cacaca, #999);
	/* aktueller W3C working draft */
	background: linear-gradient(top, #cacaca, #999);
}
#kopfzeile-textfeld:hover {
	/* alte webkit-basierte Browser (Safari, Chrome, etc.) */
	background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#cacaca));
	/* neue webkit-basierte Browser(Safari, Chrome, etc.) */
	background: -webkit-linear-gradient(top, #999, #cacaca);
	/* Mozilla/Gecko (Firefox, Flock, etc) */
	background: -moz-linear-gradient(top, #999, #cacaca);
	/* Für Presto (Opera ab Version 11.1) */
	background: -o-linear-gradient(top, #999, #cacaca);
	/* IE10 Pre-Beta */
	background: -ms-linear-gradient(top, #999, #cacaca);
	/* aktueller W3C working draft */
	background: linear-gradient(top, #999, #cacaca);
}
/*Text Kopfzeile*/
#kopfzeile-textfeld span {
	margin-left: -60px; /*Korrektur von Formularfeld links*/
	font-size:12px;
	text-shadow: 1px 1px 1px #ffffff;
	filter: dropshadow(color=#ffffff, offx=1, offy=1);
}
/*Symbol oben rechts*/
#kopfzeile-textfeld img {
	float:right;
	padding-right: 5px;
}
/*INHALT TEXTFELDER*/
#inhalt-textfeld.default { height: 309px;}
#inhalt-formular.default  { height: 389px;}
#inhalt-textfeld.vollbild, #inhalt-formular.vollbild {height: 471px;}

#inhalt-textfeld, #inhalt-formular{
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	padding: 10px 10px 10px 10px;
	overflow: auto;
	font-size: 14px;
	background: transparent;
}
#inhalt-textfeld li {
	list-style-type:none;
}
#inhalt-formular {
	margin-left: auto;
	margin-right: auto;
	padding-top: 0;
}
.newsBox {
	background-color: #ffffff;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 40px;
	margin-top: 10px;
	padding: 10px;
	-webkit-box-shadow: inset 2px 2px 8px 0px #000000;
	-moz-box-shadow: inset 2px 2px 8px 0px #000000;
	box-shadow: inset 2px 2px 8px 0px #000000;
	-moz-border-radiust: 10px;		/*Firefox*/
	-khtml-border-radius: 10px;		/*Konquer*/
	-webkit-border-radius: 10px;	/*Safari, Chrome*/
	border-radius: 10px;			/* CSS 3 */
}
.dateBox {
	position:relative;
	float:left;
	background-image:url(../Bilder/Stylesheet/kalender_symbol.png);
	background-repeat:no-repeat;
	width: 100px;
	height: 88px;
}
.day {
	position:absolute;
	top: 14px;
	left: 26px;
	font-size: 40px;
	font-weight:bold;
}
.month {
	position:absolute;
	bottom: 11px;
	left: 12px;
	font-size:12px;
	font-weight:bold;
	color:#FFF;
}
h2.newsHeadline {
	margin-top: 10px;
	font-size: 22px;	
}
.newsText {
	display:block;
	clear:both;
	margin-left:10px;
}
#kalender {
	width:910px;
	height: 450px;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	background-color: transparent;
	text-align:center;
	overflow: auto;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; 	/*Internet Explorer IE8*/	
	filter: alpha(opacity=90); 											/*für Internet Explorer 5-7*/
	-moz-opacity:0.90;													/*für Mozilla*/
	opacity:0.90;														/*für alle übrigen Browser*/
}
/*Wetter Widget ist 176px Breit und 259px Hoch generiert auf http://www.daswetter.net */
#wetter {
	position: absolute;
	top:30px;
	left: 5px;
	-moz-border-radiust: 10px;		/*Firefox*/
	-khtml-border-radius: 10px;		/*Konquer*/
	-webkit-border-radius: 10px;	/*Safari, Chrome*/
	border-radius: 10px;			/* CSS 3 */
	background-image:url(../Bilder/Stylesheet/background_wetter.png);
	background-repeat:repeat;
	height: 200px;
	width: 176px;
	overflow: hidden;
}

#wetter a {
	color: #000;
	font-weight: bold;
}
#menu {
	position:absolute;
	bottom: -5px; /*so werden die Symbole gleich angeordnet wie mit activiertem Javas Sript*/
	left: 0px;
	width: 945px;
	text-align:center; /*damit Symbole in der Mitte zentriert sind, falls script nicht geladen wird.*/
    overflow: visible;
	z-index: 99;
}
#menu div.jqDockWrap {margin:5px auto;} /*...das Dock zentrieren... margin 5px nötig um Position gleich wie ohne Java Script anzuordnen*/
#menu div.jqDock {cursor:pointer;} /*den Cursor setzen, für jqDock erforderlich*/
#menu div.jqDockLabelText{
	color:#fff;
	font-size:10px;
	background-color:#000;
	padding-left: 3px;
	padding-right: 3px;
	margin-bottom: 2px;
	-moz-border-radius: 10px;		/*Firefox*/
	-khtml-border-radius: 10px;		/*Konquer*/
	-webkit-border-radius: 10px;	/*Safari, Chrome*/
	border-radius: 10px;			/* CSS 3 */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; 	/*Internet Explorer IE8*/	
	filter: alpha(opacity=70); 											/*für Internet Explorer 5-7*/
	-moz-opacity:0.70;													/*für Mozilla*/
	opacity:0.70;														/*für alle übrigen Browser*/
}
#navigation-dock {
	position: absolute;
	bottom: 0px;
	left: 0px;
	text-align:center;
	width: 945px;
	height: 30px;
}
#postit {
	position:absolute;
	font-family: 'Devonshire', Arial, Helvetica, sans-serif;
	font-weight:400;
	font-size: 20px;
	color: #03F;
	top: 600px;
	right: 25px;
	width: 160px;
	height: 160px;
	background-image: url(../Bilder/Stylesheet/postit.png);
	background-repeat: no-repeat;
	padding: 20px;
	overflow:hidden;
	-webkit-transform:rotate(7deg);
	-moz-transform:rotate(7deg);
	transform:rotate(7deg);
	-webkit-animation-name: slidingPostit;
	-webkit-animation-duration: 2s;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction: normal;
	-moz-animation-name: slidingPostit;
	-moz-animation-duration: 2s;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction: normal;
}
@-webkit-keyframes slidingPostit {
	from {top:600px;right:-1000px;}
	to {top:600px; right:25px;}
}
@-moz-keyframes slidingPostit {
	from {top:600px;right:-1000px;}
	to {top:600px; right:25px;}
}
#postit a {
	color:#03F;
}
#postit a:hover, #postit a:visited {
	font-weight:bold;
}
#postit li {
	list-style-type:none;
	padding-left: 15px;
}