body {
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;

	background-color: #737373;

	background-image: url("wsts_bkgnd.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;

	min-height: 300px;
}


/* background window */
div#hicon {
	position: fixed;
	width: 100%;
	height: 100%;
}

/* background window */
div#himain {
	position: relative;
	margin: auto;
	/*min-width: 500px;*/
	width: 1000px;
	height: 100%;
	/*z-index: 9999;*/
	/*background-color: #777777c0;*/
	background-color: rgb(119,119,119);
	opacity: 0.90;
	/*border: 1px solid red;*/
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}


/* annonse window */
div#annonse {
	position: fixed;
	z-index: 10;
	margin: auto;
	/*min-width: 500px;*/
	width: 100%;
	height: 80px;
	background-color: rgba(214, 234, 227);
	opacity: 0.5;
	top: 60px;
	box-shadow:  0px 0px 26px 10px rgb(136, 65, 225);
}

img#aimg {
    position: relative;
    /*left: 0px;*/
    /*top: 0px;*/
	margin: auto;
    /*z-index: -1;*/
	/*box-shadow:  0px 0px 6px 0px rgba(0, 0, 0, 0.3);*/ /*image shadow*/
}

/* main frame - set min height */
div#container {
	/* position: fixed;*/
	width: 100%;
	height: 100%;
	margin: 0;
	/*z-index: 9999;*/
	min-height: 300px;
}



div#main {
	position: relative;
	margin: auto;
	/*width: 70%;*/
	min-width: 500px;
	width: 1000px;
	/*height: 100%;*/
	/*top: 0px;*/
	/*bottom: 0px;*/


	/*min-height: 300px;*/
	/*min-height: 300px;*/
	/*background-color: #777777c0;*/
	/*background-color: rgb(119,119,119);*/
	/*opacity: 0.90;*/

	/*border: 1px solid red;*/
	/*box-shadow:  0px 0px 16px 0px rgba(0, 0, 0, 0.3);*/
}





/* caption >>>> */

div#topwin {
     width: 100%;
     height: 266px;
	 /*border: 1px solid red;*/
}


.cap_t {
     width: 100%;
     height: 30%;
	 /*background-color: #1DA9E066;*/
	 background-color: #1DA9E0;
	 opacity: 0.4;
}


.cap_l {
	 position: relative;
	 float: left;
     width: 40%;
     height: 70%;
	 z-index: 100;
	 /*background-color: #082A3F66;*/
	 
	 background-color: #082A3F;
	 opacity: 0.7;
}

.cap_r {
	 position: relative;
	 float: right;
	 width: 60%;
     height: 70%;
	 /*background-color: #FC970099;*/
	 
	 
	 background-color: #FC9700;
	 opacity: 0.6;
	 
}

.cap_r_text {
	position: relative;
	padding-top: 50px;
	
	
}

.cap_r_text label {
	/*width: 170px;*/
	/*background: #02271D4D;*/
	/*overflow-x: hidden;*/
	/*overflow-y: hidden;*/
	
	display: inline-block;
	/*margin-left: 20px;*/
	/*margin-top: 10px;*/
	margin-right: 20px;
	
	position: relative;
	width: 150px;
	height: 45px;
	text-align: center;
	color: rgb(255, 255, 255);
	font-family: "MyriadPro";
	font-size: 18px;
	line-height: 45px;
	text-decoration: none;
	
	z-index: 16;
	
	font-weight: bold;
	/*box-shadow:  0px 0px 16px 0px rgba(0, 0, 0, 0.3);*/
}

#text_main_head {
	
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 40px;
	
	
	text-align: left;
	font-style: italic;
	
	position: relative;
	/*width: 150px;*/
	/*height: 45px;*/
	color: #082A3F;
	font-family: "MyriadPro";
	font-size: 24px;
	line-height: 120%;
	text-decoration: none;
	letter-spacing: 3px;
	/*word-spacing: 10px;*/
	text-shadow: 2px 1px #6955b999;
	font-weight: bolder; 
	
	box-shadow:  0px 0px 16px 0px rgba(0, 0, 0, 0.3);
}

#text_fuss_notes {
	padding-left: 60px;	
	color: #cfe6b6;
	text-align: left;
	font-style: italic;
	line-height: 120%;
	font-size: 14px;
}


.fuss_notes a {
	color: #cfe6b6;
};



img#wsimg {
    position: absolute;
    left: -19px;
    top: -5px;
    z-index: 100;
	/*box-shadow:  0px 0px 6px 0px rgba(0, 0, 0, 0.3);*/ /*image shadow*/
}



/* <<<< caption */



/* main info space >>>> */
div#info {
	position: relative;	
	width:100%;
	/*background-color: #dff9e966;*/
	
	//background-color: #a8b7b0;
	//opacity: 0.9;
	
	/*border: 1px solid black;*/
	/*overflow-x: hidden;*/
	/*overflow-y: hidden;*/
}

.cssSlider {
	position: relative;	
	/*margin: 5px;*/
	margin-right: 2%;
    margin-left: 2%;
	
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	
    /*overflow-x: hidden;*/
    /*overflow-y: hidden;*/
	/*border: 1px solid red;*/
}


.sliderControls {
	position: relative;
	width: 100%;
	
	/*margin:0 auto;*/
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	
	padding-top: 50px;
	padding-right: 0px;
	padding-bottom: 20px;
	padding-left: 0px;
}

/* Controls nebeneinander bringen */
.sliderControls li {
    display: inline-block;
}


.sliderControls label {
	/*width: 170px;*/
	/*background: #02271D4D;*/
	/*overflow-x: hidden;*/
	/*overflow-y: hidden;*/
	
	display: inline-block;
	/*margin-left: 20px;*/
	margin-top: 10px;
	margin-right: 20px;
	
	position: relative;
	width: 163px;
	height: 45px;
	text-align: center;
	color: rgb(255, 255, 255);
	font-family: "MyriadPro";
	font-size: 18px;
	line-height: 45px;
	text-decoration: none;
	
	z-index: 16;
	
	font-weight: bold;
	
	background-color: rgb(153, 153, 153);
	opacity: 1;
	box-shadow:  0px 0px 16px 0px rgba(0, 0, 0, 0.3);
}


.sliderControls label:hover {
	/*background-color: rgba(144, 190, 194, 0.79);*/
	/*background-color: rgba(218, 239, 233, 0.62);*/
	background-color: rgb(139, 150, 147);
	cursor: pointer; 
}


#iconimg {
    z-index: 100;
	vertical-align:middle;
	height: 75%;
	width: auto;
	/*alt: "";*/
}



/* info frame */
.mainFrame {
	position: relative;	
	/*width: 100%;*/
	
	display: inline-block;
	
	
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;
	
	
	overflow-x: hidden;
    overflow-y: hidden;
	
	/*border: 1px solid red;*/
	/*background-color: rgba(218, 239, 233, 0.62);*/
	/*background-color: rgba(144, 190, 194, 0.79);*/
	
	background-color: rgba(219, 229, 230, 0.8);
	opacity: 0.90;
	box-shadow:  0px 0px 16px 0px rgba(0, 0, 0, 0.3);
}

.main_view {
	position: relative;	
	/*width: 100%;*/
	
	display: inline-block;
	
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	
	
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	
	
	/*overflow-x: hidden;*/
    /*overflow-y: hidden;*/
	
	/*background-color: rgba(157, 195, 201, 0.8);*/
}

.sliderElements {
	margin: 0;
    list-style: none;
    position: relative;
    left: 0;
    width: 1000%;   /* Summe der Einzelbreiten der Slides */  /* 4 grops je 100% */
    margin-bottom: .8em;
    padding: 0;
	
    -webkit-transition: left .8s ease-in-out;
    -moz-transition: left .8s ease-in-out;
    -o-transition: left .8s ease-in-out;
    transition: left .8s ease-in-out;
}

.sliderElements > li {
    float: left;  /* lists <li .../li> horizontal positionieren (sonst die 4-re Groups werden vertikal dargestellt)  */
	width: 10%; /*25%;*/   /* 100 durch Anzahl der Slides */  /* 4 bilder (25x4=100%) in der zeile (was macht dann "sliderElements img width: 25%;" ??? ) */
    position: relative;
	
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	
} 
 
.sliderElements figure {
	/*border: 1px solid yellow;*/
	
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

 /* Bilder responsive */
 /* nebeneinander positionieren, je 4 bilder / group */
 /* width = 25% :  4 x 25% ==> 100% */
.sliderElements img {
	
	position: relative;
	float: left;
    /*width: 24%;*/
	/*margin-top: .1em;*/
	/*margin-bottom: .1em;*/
    /*height: auto;*/
	
	margin: .2em;
}

#gal_img {
	height: 150px;
	width: 24%;
	alt: "";
	
	opacity: 1;
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}



.sliderTxtElements {
    list-style: none;
	margin: 0;
    position: relative;
    left: 0;
    width: 1000%; /*400%;*/   /* Summe der Einzelbreiten der Slides */  /* 4 grops je 100% == 400*/
    margin-bottom: .8em;
    padding: 0;
	
    -webkit-transition: left .8s ease-in-out;
    -moz-transition: left .8s ease-in-out;
    -o-transition: left .8s ease-in-out;
    transition: left .8s ease-in-out;
}


.sliderTxtElements figure {
    margin: 0;
}

.sliderTxtElements > li {
    float: left;  /* lists <li .../li> horizontal positionieren (sonst die 4-re Groups werden vertikal dargestellt)  */
	width: 10%; /*25%;*/   /* 100 durch Anzahl der Slides */  /* 4 bilder (25x4=100%) in der zeile (was macht dann "sliderElements img width: 25%;" ??? ) */
    position: relative;
	
	
} 

.cssTxtSlider {
	position: relative;	
	/*margin: 5px;*/
	
	height: 400px;
	
	margin-top: 16px;
	margin-right: 0px;
	margin-left: 0px;
	margin-bottom: 0px;
	
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
	
    /*overflow-x: hidden;*/
    /*overflow-y: hidden;*/
	/*border: 1px solid blue;*/
}

#img_btm {
    /*position: absolute;	*/
	position: relative;	
	
    width: 100%;
    height: auto;
	margin-right: auto;
	/*margin-bottom: 5px;*/
    margin-left:  auto;
	
	bottom: 0px;
	
    /*border: 1px solid red;*/
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}

#img_rechts {
    float: right;
    width: auto;
    height: 100%; /*200px;*/
	margin-right: 5px;
	margin-bottom: 5px;
    margin-left: 20px;
    /*border: 1px solid red;*/
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}

#img_rechts_50 {
    float: right;
    width: auto;
    height: 50%; /*200px;*/
	margin-right: 5px;
	margin-bottom: 5px;
    margin-left: 20px;
    /*border: 1px solid red;*/
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}

#img_rechts_30 {
    float: right;
    width: auto;
    height: 30%; /*200px;*/
	margin-right: 5px;
	margin-bottom: 5px;
    margin-left: 20px;
    /*border: 1px solid red;*/
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}


#img_left {
    float: left;
    width: auto;
    height: 100%; /*200px;*/
    margin-right: 20px;
	margin-bottom: 5px;
    margin-left: 5px;
    /*border: 1px solid red;*/
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}

#img_left_50 {
    float: left;
    width: auto;
    height: 50%; /*200px;*/
    margin-right: 20px;
	margin-bottom: 5px;
    margin-left: 5px;
    /*border: 1px solid red;*/
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}

#img_left_30 {
    float: left;
    width: auto;
    height: 30%; /*200px;*/
    margin-right: 20px;
	margin-bottom: 5px;
    margin-left: 5px;
    /*border: 1px solid red;*/
	box-shadow:  0px 0px 26px 10px rgba(0, 0, 0, 0.3);
}




#text_head {
	font-size: 18px;
	text-align: center;
	font-style: italic;
}

#text_text {
	font-size: 14px;
}



/* radiobuttons "inputs" aus dem Blickfeld schieben */
.cssSlider input {
    position: absolute;
    left: -99999px;
}



#slide01:checked ~ .sliderControls label[for="slide01"],
#slide02:checked ~ .sliderControls label[for="slide02"],
#slide03:checked ~ .sliderControls label[for="slide03"],
#slide04:checked ~ .sliderControls label[for="slide04"],
#slide05:checked ~ .sliderControls label[for="slide05"],
#slide06:checked ~ .sliderControls label[for="slide06"],
#slide07:checked ~ .sliderControls label[for="slide07"],
#slide08:checked ~ .sliderControls label[for="slide08"],
#slide09:checked ~ .sliderControls label[for="slide09"],
#slide10:checked ~ .sliderControls label[for="slide10"] {
	/*background-color: rgb(248, 105, 0); */
	/*background-color: rgba(218, 239, 233, 0.62);*/
	/*background-color: rgba(144, 190, 194, 0.79);*/
	background-color: rgba(219, 229, 230, 0.8);
	cursor: pointer; 
}

#slide02:checked ~ .mainFrame ul {
    left: -100%;
}
 
#slide03:checked ~ .mainFrame ul {
    left: -200%;
}
 
#slide04:checked ~ .mainFrame ul {
    left: -300%;
}

#slide05:checked ~ .mainFrame ul {
    left: -400%;
}

#slide06:checked ~ .mainFrame ul {
    left: -500%;
}

#slide07:checked ~ .mainFrame ul {
    left: -600%;
}

#slide08:checked ~ .mainFrame ul {
    left: -700%;
}


#slide09:checked ~ .mainFrame ul {
    left: -800%;
}


#slide10:checked ~ .mainFrame ul {
    left: -900%;
}

/* <<<<< main info space */



/* foot info space >>>>> */
/* foot info space >>>>> */
.fuss_notes {
	 /*position:absolute;*/
	 /*position: relative;*/
	 position: fixed;
	 /*position: static;*/
	 /*position: sticky;*/
	 
	 display: inline-block;
     width: 100%;
     /*height: 100%;*/
	 /*width: auto;*/
	 
	 /*padding: 30px 30px;*/
	 /*padding-top: 50px;
	 padding-right: 0px;
	 padding-bottom: 20px;
	 padding-left: 0px;*/
	 
	 
	 color: rgb(255,255,255);
	 
     /*background: #02271D4D;*/
	 /*background: #082A3F66;*/
	 /*background-color: #1DA9E066;*/
	 /*background-color: #082A3F66;*/
	 
	 background-color: rgb(8,42,63);
	 opacity: 0.55;
 
	 
	 /*margin: -10;*/
	 /*top: 0;*/
	 
	 
	 
	 bottom: 0;
	 min-height: 100px;
	 
     /*left: 0;*/
}


.fuss_notes_out {
	 /*position:absolute;*/
	 /*position: relative;*/
	 position: fixed;
	 /*position: static;*/
	 /*position: sticky;*/
	 
	 display: inline-block;
     width: 100%;
     /*height: 100%;*/
	 /*width: auto;*/
	 
	 /*padding: 30px 30px;*/
	 /*padding-top: 50px;
	 padding-right: 0px;
	 padding-bottom: 20px;
	 padding-left: 0px;*/
	 
	 
	 color: rgb(255,255,255);
	 
     /*background: #02271D4D;*/
	 /*background: #082A3F66;*/
	 /*background-color: #1DA9E066;*/
	 /*background-color: #082A3F66;*/
	 
	 background-color: rgb(8,42,63);
	 opacity: 0.55;
 
	 
	 /*margin: -10;*/
	 /*top: 0;*/
	 
	 
	 
	 bottom: 0;
	 min-height: 100px;
	 
     /*left: 0;*/
}


/* <<<<< foot info space*/