/* ###################################
Stylesheet Haus Rheingarten
Datum : 2010_10_27_09_57_WF_
Version : 01.Beta
####################################*/

/* ##################################
	1. Kalibrierung
###################################*/

* { padding:0; margin:0; }

h2, p, ul, ol { margin-bottom: 1em; }

ol ul { margin-bottom:0em; }

li { margin-left: 2em; }

/* ##################################
	2. Allgemeine Styles
###################################*/

body {
 background-color:#0B0B0B;
 width:100%;
 height: 100%;
}

html {  
width: 100%;
height: 100%; }
h1 { font-size: 150%; }
h2 { font-size: 130%; }

address {
}
/*

		HYPERLINKS

*/
a { 

}
a:link {  }
a:visited {  }
a:hover, a:focus {  }
a:active {
	
	
}

#skiplink {
     position: absolute;
	 top: -5000px;
	 left: -5000px;
	 width: 0;
	 height: 0; 
	 overflow: hidden;
	 display: inline;
}
/* ##################################
	3. Styles für Layoutbereiche
###################################*/
#wrapper {
   width:100%; 
   margin-left:auto;
   margin-right:auto;
   background-color:#FFFFFF;
}
#top {
	width:100%;
	height: 171px;
	background-image:url("../img/bg_top.png");
	background-repeat:repeat-x;
	background-color:#FFFFFF;
}
#top_ausgabe {
	width: 950px;
	height: 100%;
	margin-left:auto;
	margin-right:auto;
}	
	#logobereich {
	padding-top: 72px;
	float:left;
	}
	#hauptmenu {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		width:527px;
		height: 171px;
		float:left;
		
	}
		.menu_ziffern {
			padding-top:20px;
			padding-left: 30px;
			padding-bottom:0px;
			margin-bottom:10px;
		}
		.menu_ziffern li {
			display:inline;
			list-style-type: none;
			padding-right: 30px;
		}
		.menu_ziffern a {
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:48px;
			color:#333333;
			text-decoration:none;
		}
		.menu_ziffern span {
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:48px;
			color:#EFEFEF;
			text-decoration:none;
		}
		.menu_links {
			color:#FF9600;
			paddin-top:0px;
			margin-left: 30px;
		}
		.menu_links li {
			display:inline;
			list-style-type: none;
			padding-right: 2px;
			padding-left:0px;
			margin-right: 8px;
			margin-left:5px;
			
		}
		.menu_links a {
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:14px;
			color:#FF9600;
			text-decoration:none;
			padding-left:0px;
		}
		#side_center {
			width:850px;
			margin-left:auto;
			margin-right:auto;
			background-color:#FFFFFF;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			padding-left:50px;
			padding-right:50px;
		}

		#service_side {
			width:800px;
			background-color:#FFFFFF;
			height:100%;
		}
		#ss_menu {
			margin-top:20px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			color:#666666;
			width: 200px;
			text-align:right;
			padding-right: 10px;
			border-right:#FF6600 dotted 1px;
			margin-right:10px;
			height:100%;
			float:left;
			display:block;
		
		}
		#ss_text {
			display:block;
			margin-top: 20px;
			margin-bottom: 20px;
			float:left;
			background-color:#EFEFEF;
			width:480px;
			height: 400px;
			padding:25px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			margin:10px;
			border:#FF6600 solid 1px;
		}
			#ss_text h1 {
				font-size:18px;
				border-bottom:#FF6600 dotted 1px;
				margin-bottom: 10px;
			}
			#ss_menu ul {
				margin:0px;
				padding:0px;
			}
			#ss_menu li {
				list-style-type:none;
				margin:0px;
				padding:0px;
				padding-bottom: 5px;
				
			}
			#ss_menu a {
				color:#999999;
				font-size:12px;
				text-decoration:none;
			}
			#ss_menu a:hover,
			#ss_menu a:active,
			#ss_menu span {
				color:#FF9900;
				text-decoration:underline;
				font-weight:bold;
				font-size:12px;
				
			
			}
	


		.index_reiter {
			height: 27px;
			margin-top: 40px;
			margin-bottom: 0px;
			margin-left: 151px;
		}
		.m_inaktiv  {
			list-style-type:none;
			float:left;
			width:144px;
			height:19px;
			background-image:url("../img/reiter_inaktiv.png");
			text-align:left;
			padding-left: 5px;
			padding-top:8px;
			font-size:12px;
			margin-right: 1px;
			padding-right:0px;
			margin-left:0px;
			
		}
			.m_inaktiv a {
			color:#FFFFFF;
			text-decoration:none;
			}
		.m_aktiv {
			list-style-type:none;
			float:left;
			width:144px;
			height:19px;
			background-image:url("../img/reiter_aktiv.png");
			text-align:left;
			padding-left: 5px;
			padding-top:8px;
			font-size:12px;
			margin-right: 1px;
			padding-right:0px;
			margin-left:0px;			
		}
		.reiter_buehne {
			width:750px;
			height:201px;
			background-image:url("../img/bg_reiter_big.png");
			
			
		}
		.rb_bild {
		float:left;
		padding:10px;
		width:190px;
		}
		.rb_text {
		float:left;
		width: 500px;
		padding: 10px;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size: 14px;
		font-weight:100;
		color:#666666;
		text-align:justify;
		
		}
		.rb_text p {
		padding-bottom:0px;
		margin-bottom:5px;
		}
		.rb_text h1 {
			color:#666666;
			text-decoration:underline;
			font-size:16px;
			padding-bottom: 8px;
		}
		#feedline {
			clear:both;
			width:100%;
			margin-top:10px;
			background-color:#FFFFFF;
		}
			#feedline p {
				font-family:Verdana, Arial, Helvetica, sans-serif;
				color: #666666;
				padding-top:15px;
				font-size:12px;
				
			}
			
		#fl_left {
			width:270px;
			float:left;
		}
		#fl_center {
			width:270px;
			float: left;
		}
		#fl_right {
			width:270px;
			float:left;
		}
		#contact_line {
		clear:both;
		width:100%;
		background-color:#AAAAAA;
		height:132px;
		margin-top:8%;
		
		}
		#cl_ausgabe {
		width:850px;
		margin-left:auto;
		margin-right:auto;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		padding-left:50px;
		padding-right:50px;
		}
		#cl_left{
		width:260px;
		height: 120px;
		float:left;
		border-right:#FFFFFF solid 1px;
		border-left:#FFFFFF solid 1px;
		padding:5px;
		font-size:11px;
		color:#333333;
		}
			#cl_left img {
				padding-bottom:4px;
			}
			#cl_left a,
			#cl_left a:hover,
			#cl_left a:active {
			color:#FFFFFF;
			text-decoration:none;

			}
		#cl_center {
		width:260px;
		height: 120px;
		float:left;
		border-right:#FFFFFF solid 1px;
		padding:5px;
		font-size:11px;
		color:#FFFFFF;
		}
			#cl_center img {
				padding-bottom:4px;
			}
		#cl_right {
		width:230px;
		height: 120px;
		float:left;
		border-right:#FFFFFF solid 1px;
		padding:5px;
		}
			#cl_right img {
				padding-bottom:4px;
			}
		#fb-like-box {
		clear:both;
		}
		.weiterlesen {
		clear:both;
		width:100%;
		margin-right:10px;
		margin-left:auto;
		text-align:right;
		margin-top:0px;
		padding-top:0px;
		}
			.weiterlesen a {
				color:#0B0B0B;
				text-decoration:none;
			}
			.weiterlesen a:hover {
				color:#CC9900;
	
				text-decoration:underline;
			}
		#bottom {
		clear:both;
		width:100%;
		background-image:url("../img/bg_bottom.png");
		background-repeat:repeat-x;
		height:112px;
		margin-top:0px;
		
		}
		#bottom_text {
		width:850px;
		margin-left:auto;
		margin-right:auto;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-size:11px;
		color:#CCCCCC;
		padding-left:50px;
		padding-right:50px;
		}
		#bottom_text ul {
			padding-top: 12px;
			margin-left:0px;
			padding-left:0px;
			
		}
		#bottom_text li {
			display:inline;
			padding-left:0px;
			margin-left:0px;
		}
		#bottom_text a,
		#bottom_text a:hover,
		#bottom_text a:active {
			color:#CCCCCC;
			text-decoration:none;
		}
/* ##################################
	4. Sonstige Styles
###################################*/

        
        /* Shared styles */
        
        .drop-shadow {
            position:relative;
            float:left;
            width:500px;    
			height: 350px;
            padding:1em; 
            margin:2em 10px 4em; 
            background:#fff;
            -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
               -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			text-align:justify;
			
        }
		.drop-shadow img {
			float:left;
			padding:10px;
		}
		.drop-shadow h1 {
			color:#666666;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:16px;
			padding-bottom: 5px;
			border-bottom:#FF6600 dotted 1px;
			margin-left: 183px;
			margin-bottom: 10px;
		}
		.drop-shadow p {
			color:#333333;
						
		}

        .drop-shadow:before,
        .drop-shadow:after {
            content:"";
            position:absolute; 
            z-index:-2;
        }
        
        .drop-shadow p {
            font-size:16px;
            font-weight:bold;
        }
        
        /* Lifted corners */

        .lifted {
            -moz-border-radius:4px; 
                 border-radius:4px;
        }
        
        .lifted:before,
        .lifted:after { 
            bottom:15px;
            left:10px;
            width:50%;
            height:20%;
            max-width:300px;
            -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);   
               -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
                    box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
            -webkit-transform:rotate(-3deg);    
               -moz-transform:rotate(-3deg);   
                -ms-transform:rotate(-3deg);   
                 -o-transform:rotate(-3deg);
                    transform:rotate(-3deg);
        }
        
        .lifted:after {
            right:10px; 
            left:auto;
            -webkit-transform:rotate(3deg);   
               -moz-transform:rotate(3deg);  
                -ms-transform:rotate(3deg);  
                 -o-transform:rotate(3deg);
                    transform:rotate(3deg);
        }
        
        /* Curled corners */

        .curled {
            border:1px solid #efefef; 
            -moz-border-radius:0 0 120px 120px / 0 0 6px 6px;    
                 border-radius:0 0 120px 120px / 0 0 6px 6px;
        }
      
        .curled:before,
        .curled:after {
            bottom:12px;
            left:10px;
            width:50%;
            height:55%;
            max-width:200px;
            -webkit-box-shadow:0 8px 12px rgba(0, 0, 0, 0.5); 
               -moz-box-shadow:0 8px 12px rgba(0, 0, 0, 0.5); 
                    box-shadow:0 8px 12px rgba(0, 0, 0, 0.5); 
            -webkit-transform:skew(-8deg) rotate(-3deg);
               -moz-transform:skew(-8deg) rotate(-3deg);
                -ms-transform:skew(-8deg) rotate(-3deg);
                 -o-transform:skew(-8deg) rotate(-3deg);
                    transform:skew(-8deg) rotate(-3deg);
        } 
      
        .curled:after { 
            right:10px; 
            left:auto;
            -webkit-transform:skew(8deg) rotate(3deg); 
               -moz-transform:skew(8deg) rotate(3deg);     
                -ms-transform:skew(8deg) rotate(3deg);     
                 -o-transform:skew(8deg) rotate(3deg); 
                    transform:skew(8deg) rotate(3deg);
        }
        
        /* Perspective */

        .perspective:before {
            left:80px;
            bottom:5px;
            width:50%;
            height:35%;
            max-width:200px;
            -webkit-box-shadow:-80px 0 8px rgba(0, 0, 0, 0.4);
               -moz-box-shadow:-80px 0 8px rgba(0, 0, 0, 0.4);
                    box-shadow:-80px 0 8px rgba(0, 0, 0, 0.4);
            -webkit-transform:skew(50deg);
               -moz-transform:skew(50deg);
                -ms-transform:skew(50deg);
                 -o-transform:skew(50deg);
                    transform:skew(50deg);
            -webkit-transform-origin:0 100%;
               -moz-transform-origin:0 100%;
                -ms-transform-origin:0 100%;
                 -o-transform-origin:0 100%;
                    transform-origin:0 100%;
        }
        
        .perspective:after {
            display:none;
        }
        
        /* Raised shadow - no pseudo-elements needed */
        
        .raised {
            -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
               -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
        }
        
        /* Curved shadows */

        .curved:before {
            top:10px;
            bottom:10px;
            left:0;
            right:50%;
            -webkit-box-shadow:0 0 15px rgba(0,0,0,0.6);
            -moz-box-shadow:0 0 15px rgba(0,0,0,0.6);
            box-shadow:0 0 15px rgba(0,0,0,0.6);
            -moz-border-radius:10px / 100px;
            border-radius:10px / 100px;
        }
        
        .curved-vt-2:before {
            right:0;
        }
        
        .curved-hz-1:before {
            top:50%;
            bottom:0;
            left:10px;
            right:10px;
            -moz-border-radius:100px / 10px;
            border-radius:100px / 10px;
        }

        .curved-hz-2:before {
            top:0;
            bottom:0;
            left:10px;
            right:10px;
            -moz-border-radius:100px / 10px;
            border-radius:100px / 10px;
        }
        
        /* Rotated box */
        
        .rotated {
            -webkit-box-shadow:none;
               -moz-box-shadow:none;
                    box-shadow:none;
            -webkit-transform:rotate(-3deg);    
               -moz-transform:rotate(-3deg);   
                -ms-transform:rotate(-3deg);
                 -o-transform:rotate(-3deg);
                    transform:rotate(-3deg);
        }
        
        .rotated > :first-child:before {
            content:"";
            position:absolute;
            z-index:-1;
            top:0;
            bottom:0;
            left:0;
            right:0;
            background:#fff;
            -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
               -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
        }
         .portfolio {
            position:relative;
            float:left;
            width:800px;    
			height: 200px;
            padding:1em; 
            margin:2em 10px 4em; 
            background:#fff;
            -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
               -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			text-align:justify;
			
        }
		.portfolio img {
			float:left;
			padding:10px;
		}
		.portfolio h1 {
			color:#666666;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:16px;
			padding-bottom: 5px;
			border-bottom:#FF6600 dotted 1px;
			margin-left: 183px;
			margin-bottom: 10px;
		}
		.portfolio p {
			color:#666666;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:10px;
			font-style:italic;
						
		}

        .portfolio:before,
        .portfolio:after {
            content:"";
            position:absolute; 
            z-index:-2;
        }
        
        .portfolio p {
            font-size:13px;
			font-style:normal;
        }
		
		.kontakt {
            position:relative;
            float:left;
            width:800px;    
			height: 650px;
            padding:1em; 
            margin:2em 10px 4em; 
            background:#fff;
            -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
               -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
                    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:12px;
			text-align:justify;
			
        }
		.kontakt a {
			text-decoration:none;
			color:#333333;
		}
		.kontakt img {
			float:left;
			padding:10px;
		}
		.kontakt h1 {
			color:#666666;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:16px;
			padding-bottom: 5px;
			border-bottom:#FF6600 dotted 1px;
			margin-left: 183px;
			margin-bottom: 10px;
		}
		.kontakt p {
			color:#666666;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			font-size:10px;
			font-style:italic;
						
		}

        .kontakt:before,
        .kontakt:after {
            content:"";
            position:absolute; 
            z-index:-2;
        }
        
        .kontakt p {
            font-size:12px;
			font-style:normal;
			
        }
		.textfeld {
			width:250px;
			background-color:#EFEFEF;
			color:#EF6600;
			padding: 5px;
			margin: 5px;
			border:#333333 dotted 1px;
		}
		.textfeld_err {
			width:250px;
			background-color:#F89496;
			color:#FF0000;
			padding: 5px;
			margin: 5px;
			border:#333333 dotted 1px;
		}
		.textarea{
			width:450px;
			height:150px;
			background-color:#EFEFEF;
			color:#EF6600;
			padding: 5px;
			
			border:#333333 dotted 1px;
		}
		.kontakt_table {
			border:#333333 dotted 1px;
		}
/* ##################################
	ENDE
###################################*/