browser: Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)  /* -webkit-box; */     /* OLD - iOS 6-, Safari 3.1-6 */
  /* display: -moz-box; */         /* OLD - Firefox 19- (buggy but mostly works) */
  /* display: -ms-flexbox; */     /* TWEENER - IE 10 */
  /* display: -webkit-flex; */     /* NEW - Chrome */
  /* display: flex; */             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  
  /* --- */
  
   /* kurzform für flex-direction und flex-wrap (wrap - mehrzeilig, nowrap - einzeilig) */
    /*
    -webkit-flex-flow: row wrap;
  -moz-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
    */
    
 /* --- */   
   
	/* -webkit-box-shadow: 0px 0px 5px 0px rgba(128, 127, 135, 1); */  /* WebKit */
	/* -moz-box-shadow: 0px 0px 5px 0px rgba(128, 127, 135, 1); */ /* Firefox */
	/* box-shadow: 0px 0px 5px 0px rgba(128, 127, 135, 1); */ /* Standard */
    
/* ---------------------------------------------------------------------------------- */  

.textschatten {
    color: #444;
    font-size: 24px;
    text-shadow: 2px 2px 3px #333;
}

/* fur IE 
filter:dropshadow(color=#999999, offx=1, offy=1); */

.boxschatten {
    background: #ddd; padding: 12px;
    -webkit-box-shadow: 3px 2px 5px #aaa;
    -moz-box-shadow: 3px 2px 5px #aaa;
    box-shadow: 3px 2px 5px #aaa;
}

.schattenrdEcken {
    background: #ddd; padding: 12px;
    -webkit-box-shadow: 3px 2px 5px #aaa;
    -moz-box-shadow: 3px 2px 5px #aaa;
    box-shadow: 3px 2px 5px #aaa;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
}

/*--------------------------------------------*/

* {margin:0; padding:0;
	/* damit das box modell funktioniert*/
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	/* */
	box-sizing: border-box;
	*behavior: url(h5/box-size/boxsizing.htc);
} 


@font-face {
    font-family: 'amaranthregular';
    src: url('amaranth-regular-webfont.eot');
    src: url('amaranth-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('amaranth-regular-webfont.woff') format('woff'),
         url('amaranth-regular-webfont.ttf') format('truetype'),
         url('amaranth-regular-webfont.svg#amaranthregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'amaranthbold';
    src: url('amaranth-bold-webfont.eot');
    src: url('amaranth-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('amaranth-bold-webfont.woff') format('woff'),
         url('amaranth-bold-webfont.ttf') format('truetype'),
         url('amaranth-bold-webfont.svg#amaranthbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'perspective_sansregular';
    src: url('persans-webfont.eot');
    src: url('persans-webfont.eot?#iefix') format('embedded-opentype'),
         url('persans-webfont.woff') format('woff'),
         url('persans-webfont.ttf') format('truetype'),
         url('persans-webfont.svg#perspective_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'perspective_sansbold';
    src: url('persansb-webfont.eot');
    src: url('persansb-webfont.eot?#iefix') format('embedded-opentype'),
         url('persansb-webfont.woff') format('woff'),
         url('persansb-webfont.ttf') format('truetype'),
         url('persansb-webfont.svg#perspective_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'open_sanscondensed_light';
    src: url('OpenSans-CondLight-webfont.eot');
    src: url('OpenSans-CondLight-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-CondLight-webfont.woff') format('woff'),
         url('OpenSans-CondLight-webfont.ttf') format('truetype'),
         url('OpenSans-CondLight-webfont.svg#open_sanscondensed_light') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'm_1cregular';
    src: url('mplus-1c-regular-webfont.eot');
    src: url('mplus-1c-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('mplus-1c-regular-webfont.woff') format('woff'),
         url('mplus-1c-regular-webfont.ttf') format('truetype'),
         url('mplus-1c-regular-webfont.svg#m_1cregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


html {height: 100%;} /* im body WICHTIG!!! STRECKT ANZEIGENBEREICH AUF 100% */

body {

	font-family: "perspective_sansregular", "Calibri", sans-serif;
	/*font-size: 1.1em;*/
    
	color: #8c7a5c;
	margin:0;
	padding:0;
	height: 100%;
    line-height: 120%;
    
}	

.bo {
	font-family: "perspective_sansbold", "Calibri", sans-serif;
	color: #8c7a5c;
	}

h1 {font-family: "amaranthbold", "Calibri", sans-serif;}

#back {
	height:100%; /* Mindesthöhe für den IE */
	min-height: 100%; /* Mindesthöhe für moderne Browser */
	height:auto !important; /* Important Regel für moderne Browser */
	overflow: hidden !important; /* FF Scroll-leiste */
	
	width:100%;
	min-width: 100%;
	
	}

#wrap {
	margin: 0px auto;
	
	padding: 0px 0px 100px 0px; /* unten für den Fussbereich abziehen */
	max-width: 1000px;
    	
	display: -webkit-box;      
  display: -moz-box;      
  display: -ms-flexbox;      
  display: -webkit-flex;    
  display: flex;    /* -ms-flex-pack: start;*/
	-webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
	
}



/*-------------------------------------*/

#NaviOben {
	}

#NaviOben ul{
	font-family: "amaranthbold", "Calibri", sans-serif;
	line-height: 30px;
	/*max-width: 1000px;*/
	display: -webkit-box;      
  display: -moz-box;      
  display: -ms-flexbox;      
  display: -webkit-flex;    
  display: flex;	/* -webkit-flex-direction: row; */
	/* flex-direction: row; */ /* nicht notwendig, weil Standard-Einstellung? */
	
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
    -flex-wrap: wrap;   
    -webkit-box-pack: justify;
	-moz-box-pack: justify;
	-ms-flex-pack: justify; 
	-webkit-justify-content: space-between;
	justify-content: space-between;	
    
	margin-top: 30px;
    padding-bottom: 20px;
	list-style-type: square;
    list-style-position:inside;
	
}

#NaviOben li {
	 border-left: 1px solid #252525; /* */
    min-width: 150px;
    /*
    border-right-width: thin;
	border-right-style: solid;
	border-right-color: #666;
    */
            text-align: center;/* */
	cursor: pointer;
	}	

#NaviOben li a {
	text-decoration: none;
	color: #28789f;}

#NaviOben li a:hover {
	text-decoration: none;
	font-size: 1.08rem; /* color: #d6a306;*/
}
	
/*-------------------------------------------------*/ 

.line {
	width: 100%;
	color: #73685c;
	background-color: #8c7a5c;	height: 2px;
	}

#main {
	
	display: -webkit-box;      
  display: -moz-box;      
  display: -ms-flexbox;      
  display: -webkit-flex;    
  display: flex;	-webkit-box-pack: justify;
	-moz-box-pack: justify;
	-ms-flex-pack: justify; 
	-webkit-justify-content: space-between;
	justify-content: space-between;}

#main section {
	width: 70%;
    font-size: 0.9rem;
}

article {
	/*height: 300px;*/
    min-height: 150px;
    margin: 20px;
    padding: 10px 20px;
    border-left-width: thin;
	border-left-style: solid;
	border-left-color: #666;
}

article h3 {line-height:30px;}

.FL {float:  left; margin-right: 15px; marging-bottom:15px;}

.FR {float:  right; margin-left: 15px; marging-bottom:15px;}

.T105 {font-size: 1.05rem;}
.T103 {font-size: 1.03rem;}

/*
article img:hover{
	transform: rotate(-5deg);
}
*/


#colR {
	width: 25%;
	margin-right: 20px;
   	padding-left: 20px;
    border-left-width: thin;
	border-left-style: solid;
	border-left-color: #666;
    
    display: -webkit-box;      
  display: -moz-box;      
  display: -ms-flexbox;      
  display: -webkit-flex;    
  display: flex;    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
	-moz-box-pack: justify;
	-ms-flex-pack: justify; 
	-webkit-justify-content: space-between;
	justify-content: space-between;
}
/* */


.hoRu {
    min-height: 1px;
    clear:both; width:100%;
    border-bottom:1px solid #d1d1d1;
    height:1px; padding-top:5px;
    margin-top:5px;
    margin-bottom:5px;
}

/* ---für div oben und unten von navi - damit dort eine dezente linie gezeigt wird--- */

#li1 {
	height: 5px;
	padding-top: 5px;
	
    border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #069;
}

#li2 {
	height: 5px;
	padding-bottom: 5px;
	
    border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #069;
}
/* */

#NaviR {
	font-family: "amaranthbold", "Calibri", sans-serif;
	/*width: 25%;*/
    max-width: 250px;
	margin-top: 20px;
    /*
    border-left-width: thin;
	border-left-style: solid;
	border-left-color: #666;
   */
}


#NaviR ul{ 
    padding-top: 15px;
	padding-right: 15px;
	padding-bottom: 15px;
	padding-left: 25px;
	list-style-type: square;
    list-style-position:inside;
}

#NaviR li a {
	text-decoration: none;
	color: #28789f;}

#NaviR li a:hover {
	text-decoration: none;
	font-size: 1.08rem; 
}



aside {
	margin-bottom: 20px;
}

#it {text-align:center;}

#pu {padding-left: 3px;}

footer {
	/*position:absolute;
	bottom: 0; */
	width: 100%;
	height: 100px;
	margin-top:-100px;
    padding-top: 20px;
    font-size: 0.9rem;
	
	display: -webkit-box;      
  display: -moz-box;      
  display: -ms-flexbox;      
  display: -webkit-flex;    
  display: flex;    -webkit-box-pack: justify;
	-moz-box-pack: justify;
	-ms-flex-pack: distribute; 
	-webkit-justify-content: space-around;
	justify-content: space-around;   
	/*
	clear:left;
    
	height:150px;
    */
}



footer a {
	text-decoration: none;
	color: #bacbd9; 
}

footer a:hover {
	text-decoration: none;
	font-size: 1.08rem; /* color: #d6a306;*/
}

.clear {
	clear: both;
	}

/* basic styles ------------------------------------------------------------------ */

#back {
	
	background-image: -webkit-linear-gradient(#e4dfd2 35%, #73685c 100%); 
	background-image: -moz-linear-gradient(#e4dfd2 35%, #73685c 300%); 
	background-image: -o-linear-gradient(#e4dfd2 35%, #73685c 100%); 
	background-image: linear-gradient(#e4dfd2 35%, #73685c 100%);
	
}


#bildS1 {

	background-repeat: repeat-x;
	background-image: url(../Bilder/casahintenS1s.jpg);

}

#bildSff {
	background-repeat: repeat-x;
	background-image: url(Bilder/casahintenSff.jpg);
	/*background-color:#00CCCC;*/
}

#wrap{
	background-color: #e4dfd2;    
}

#main {
	margin: 10px;
    /*
	background-image: url(../Bilder/sandr.jpg);
	background-repeat: repeat;
    */
    /*
    border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #8c7a5c; 
    border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #8c7a5c;    */
}

#colR {
   ´/*background-color: rgba(208, 203, 192, 0.7);
	background-color: rgb(208, 203, 192); */
    background-color: #dad5c9;
}

article {
    background-color: #f4efe1; /*  $bgcolor_weiss; */
	}


/*
article img
*/

#ibg {
	background-color: #e4dfd2;    }


    
#NaviR {
	background-color: #bacbd9;    }    
/*
aside {
	background-color: #FF9;
}
*/

footer {
	background-color: #28789f;    color: #bacbd9; 
    }



/* dynamic styles ------------------------------------------------------------------ */

@media screen and (max-width:768px) {
		body {
        font-size: 0.90rem;
        }
    
    	        
        
		article {font-size: 0.80rem;}

}


@media screen and (max-width:480px) {
	
    	body {
        font-size: 0.80rem;
        }
    
        
        #main {
            display: -webkit-box;      
  display: -moz-box;      
  display: -ms-flexbox;      
  display: -webkit-flex;    
  display: flex;        	-webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
        }
        
        section {
        	min-width: 100%;
            width:100%;
        }
        
        article {font-size: 0.70rem;}
        
        article img {
        	width: 40%;
            height: 40%;
        	max-width: 150px;
            max-height: 150px;
        }
	 
	}