/* Haar und Vital.de



//$background='#f3f0ec';	// Hinergrund
//$h3='#b4a389;';		// Überschrift

   <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

"league_gothicregular"
{
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 93.75%;
    line-height: 1.5em;
    color: #333333;
}
*/


/* for IE */
@font-face{  
font-family:sans2; 
src:url(../css/fonts/OpenSans-Regular.eot); 
} 

/* for non-IE */
@font-face {
font-family: 'sans2';
src: url('../css/fonts/OpenSans-Regular.ttf') format('truetype');
}     

@font-face {
  font-family: "sans";
  src: url("../css/fonts/OpenSans-Regular.eot"); /* IE9 Compat Modes */
  src: url("../css/fonts/OpenSans-Regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("../css/fonts/OpenSans-Regular.ttf") format("truetype"); /* Safari, Android, iOS */
    /*url("..css//fonts/OpenSans-Regular.woff") format("woff"),*/ /* Modern Browsers */
    /*url("../css/fonts/OpenSans-Regular.woff2") format("woff2"); */ /* Modern Browsers */
  font-weight: normal;
  font-style: normal;
}


/* for IE */
@font-face{  
font-family:gothic; 
src:url(../css/fonts/League_Gothic-webfont.eot); 
} 
 
/* for non-IE */
@font-face {
font-family: 'gothic';
src: url('../css/fonts/League_Gothic-webfont.ttf') format('truetype');
}     

  

@charset "utf-8";
* {
    box-sizing: border-box;
}

html, body {
    margin:0;
    padding:0;
	margin-top:2px; 
    margin-bottom: 3px;
    font-family:  arial, verdana, Helvetica, sans-serif;
  	font-size: 14px;
	line-height: 1.8;
	color: #555;
    background: linear-gradient(to bottom, #F0F0F0 0%,#FFFFFF 100%) fixed;  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

#page-header{
	display: block;
	max-width: 914px;
	margin: auto;
}

img.logo {
    display: inline-block;
    margin-left: auto;
    margin-right: auto; 
}

.rot{
color:#de1818;
}

.logos{
float:right;
}

div.page-slider{
	display: block;
	height: auto;
	max-width: 914px;
	margin: auto;
	margin-top:10px;
	background:  #fff;
	padding-top: 0px;
}

div.page-body{
	display: block;
	height: auto;
	max-width: 914px;
	margin: auto;
	margin-top:10px;
	background:  #fff;
	padding-top: 0px;
}

div.page-text{
	display:block;
}

.page-text a {
	color:  #de1818;
    text-decoration: none;
}

.page-text a:hover {
	color:  #de1818;
    text-decoration: underline;
}

.bilder-anfrage {
	width: 40%;
	padding :10px; 
	background-color: #eee; 
	border-radius: 14px; 
	text-align: center;
}

.bilder-anfrage a {
	color:  #de1818;
}

.bilder-anfrage a:hover {
	color:  #de1818;
	font-weight: bold;
}

.page-galerie{
	width: 48%;
	float:right;
	/*text-align: left;*/
	/*background: url("../logos/bg-slider.jpg") no-repeat;*/
	/*border: 1px solid #33a;*/
}

div.kleinbild {
	float: left;
   width: 144px;
   height: 144px;
   overflow: hidden;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
}

div.kleinbild img { 
height: 144px;
border:0; 
} 

div.hslider {
	float: left;
   width: 470px;
   height: 302px;
   	background: url("../bildergalerie/bg-slider.jpg") no-repeat;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
}


#inhalt-galerie {
	height: 600px;
    width: 600px;
    float: left;
    margin-left: 66px;
}


/* Artikelüberschrift */
h2{
  font-family:  'gothic', 'Arial Narrow',  Verdana, Sans-serif;
  /*font-size: 26px;*/
  font-size: 24px;
  text-transform: uppercase;
  font-weight: lighter;
  /*color: #de1818;*/
  color: #b4a389;
}

/* Seitenüberschrift */
h3{
margin: 0px;
  font-family:  Arial,  Verdana, Sans-serif;
  font-size: 28px;

  font-weight: bold;
  color: #b4a389;
  	text-shadow: 2px 2px 5px #aaa;
}
h4{
margin: 0px;
  font-family:  Verdana, Sans-serif;
  font-size: 18px;

  font-weight: bold;
  color: #777;
  	
}

img {
	max-width: 100%;
	height: auto;
}

hr{
	height:0; 
  	border:0;
  	margin-top: 20px; 
  	border-top:1px solid #dddddd; 
	clear: both;
}


/* Navigations Leiste oben mit Grafik */
.liniemenu {
	max-width: 1244px;
	display: block;
    margin-left: auto;
    margin-right: auto; 
		clear: both;
}
.navigation {
	max-width: 944px;
	margin-top: 3px;
	margin-bottom: 0px;
   display: block;
    margin-left: auto;
    margin-right: auto; 
}

.navi a {
	font-family:  Arial, verdana, Sans-serif;
	font-size: 15px;
	color: #666;
	/*font-weight: bold;
	background: #ffffff url('/images/navig.jpg'); */
	text-decoration: none;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 2px;
	padding-bottom: 2px;
	margin-right: 4px;
	/* border: 1px solid #cecece; */
}

.navi a:hover {
	color: #222;
	text-shadow: 2px 2px 8px #888;
	text-decoration: underline;
}

.navia {
	font-family:  Arial, verdana, Sans-serif;
	font-size: 15px;
	color: #000;
	/*font-weight: bold;*/
	background: #ffffff; 
	text-decoration: none;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 2px;
	padding-bottom: 3px;
	margin-right: 4px;
	text-shadow: 2px 2px 8px #888;
	/*border-left: 1px solid #cecece;
	border-top: 1px solid #cecece;
	border-right: 1px solid #cecece;
	*/
}

.navia a:hover {
	color: #000033;
	text-decoration: none;
}
/* Ende Navigations Leiste oben mit Grafik */


.fuss{
	display: block;
	background: #f3f0ec; 
}

.fuss h5 {
    font-family:  'sans', Arial, Helvetica, sans-serif;
  	font-size: 14px;
	font-weight: bold;
	color: #555;
	margin-bottom: 5px;
}


.fuss-menu {
	max-width: 914px;
	display: block;
	margin: auto;
}

.fuss-menu-l {
	width: 38%;
	/*float: left;*/
	display: inline-block;
	background: #fff; 
}
.halblogo {
	display: inline-block;
	margin-right: 2%;
}

.fuss-menu-text {
	display: inline-block;
}
.fuss-menu-r {
	width: 58%;
	display: inline-block;
	padding-left: 3%;
}

#fuss-menu a{
		display: inline-block;
  line-height: 1;
}

#fuss-menu > ul >li {
  display: inline-block;
  position: relative;
  /*float: left;*/
}

#fuss-menu > ul > li a{
  display: block;
  position: relative;
  list-style: inside none;
  padding: 8px;
  text-align: center;
  text-decoration: none;
  color:#555;
}

#fuss-menu > ul > li a:hover{
color:#de1818;
text-decoration: underline;
}




/*  Kontakt-Formular */

.k_feld {
	text-align: right;	
	float: left;
	width: 20%;
	height: 30px;
	padding: 5px;
	font-size: 13px;
	padding-right: 12px;
}
.k_feld select {
	float: left;
	height: 30px;
	border: 1px solid #cecece;
	font-size: 13px;
	width: 90%;
}
.kontakt input {
	float: left;
	height: 30px;
	padding: 3px;
	border: 1px solid #cecece;
	font-size: 13px;
	width: 70%;
}


.k_select select {
	float: left;
	height: 30px;
	border: 1px solid #cecece;
	font-size: 13px;
	width: 250px;
}
.k_news {
	float: left;
	height: 30px;
	font-size: 13px;
	padding: 3px;
	padding-top: 10px;
	width: 70%;
}

.k_notiz textarea  {
	height: 135px;
	width: 95%;
	border: 1px solid #cecece;
	font-size: 13px;
	margin-left: 2px;
}
.k_guttext textarea  {
	height: 115px;
	width: 70%;
	border: 1px solid #cecece;
	font-size: 13px;
	margin-left: 2px;
}

.k_button input {
	width: 47%;
	height: 30px;
	border: 1px solid #cecece;
	font-size: 13px;
	background-color: #ffffff;
	margin-left: 2px;
}
.kontaktok {
	/*display: inline-block;*/
	float: left;
	height: 32px;
	padding: 3px;
	border: 1px solid #cecece;
	/*font-weight: bold;*/
	width: 70%;
	background-color: #eee;
}

.kontaktoknot {
	float: left;
	height: 135px;
	padding: 3px;
	border: 1px solid #cecece;
	width: 95%;
	background-color: #eee;
}


.zweispalten {
    -webkit-column-count: 2;
    column-count:         2;
}