body  {
	/*overflow-y:scroll;*/
	font-family:Arial, Helvetica, sans-serif;
	text-align: center;
	color:#000000;
}

#head { height:20px}

#wrap {
    background: #FFFFFF;
	margin: 0 auto;
    text-align: left;
}


/*::::::::::::::::::QUERIES:::::::::::::::::*/


/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575px) {
    #wrap {width: 100%;min-width:320px}
    .sn.text .showcase {margin:35px 10px 0 10px}
    .sn #title p {padding:0 0 0 0}
    .leaflet-control-container {display:none;}
}
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) {
    #wrap {	width: 100%}
    .sn.text .showcase {margin:35px 50px 0 50px}
    .sn #title p {padding:0 0 0 0}
    .leaflet-control-container {display:none;}
}
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
    #wrap {max-width: 752px}
    .sn.text .showcase {margin:35px 50px 0 50px}
    .sn #title p {padding:0 1.5em 0 0}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {
    #wrap {max-width: 752px}
    .sn.text .showcase {margin:35px 50px 0 50px}
    .sn #title p {padding:0 3.5em 0 0}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    #wrap {max-width: 752px}
    .sn.text .showcase {margin:35px 50px 0 50px}
    .sn #title p {padding:0 3.5em 0 0}
}


/*::::::::::::::::::NAVIGATION:::::::::::::::::*/


.sn #navigation {
	margin:20px 0 0 0;
	height:20px;

    display: -webkit-box!important;
    display: -webkit-flex!important;
    display: -ms-flexbox!important;
    display: flex!important;

    -webkit-box-pack: end!important;
    -webkit-justify-content: flex-end!important;
    -ms-flex-pack: end!important;
    justify-content: flex-end!important;
	}

.sn .sven, .sn .sven_active {
    margin-right: auto!important;
	line-height:23px;
	padding:0;
	}

.sn a {
	text-decoration:none;
	font-size:12px;
	font-weight:bold;
	color:#666;}

.sn li {
	text-decoration:none;
	font-size:12px;
	font-weight:bold;
	color:#ccc;}

.sn a:hover {
	color:#CCC;}

.sn #navi {

	line-height:20px;
	padding:0;
	margin:0;
}

.sn #navi li { display: inline; line-height:20px; }

.sn #navi li a {

	padding:0;
	margin:0;
	color:#666;
	font-size:12px;
	text-decoration: none;
	}

.sn #navi li a:hover {
	color:#CCC;
	}

.sn .trenner {margin-left:3px; color:#666; font-weight:400; font-size:12px; font-family:Verdana, Geneva, sans-serif;}


/*::::::::::::::::::BUTTONS SHOWCASE:::::::::::::::::*/





/*::::::::::::::::::SHOWCASE:::::::::::::::::*/


.sn .showcase {
    margin:0 auto;
    padding-top:35px;
    max-width:650px;
	}

.sn img {
	border:0;
	width:100%;
    height:auto}

/*::::::::::::::SHOWCASE - GROSS:::::::::::::::::*/

.big h1 {margin:20px 0 0 0; padding:0; text-align:center;color:#666;font-size:0.75em}

.large.xxl {
    margin: 1.5em 0 0 0;
    /*overflow-y: scroll;*/	  
}

.large.xxl #navbar {
	overflow: hidden;
	background-color: #fff;
	position: fixed;
	top: 0;
	width: 100%;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 20px;
}

.large.xxl button {
    border:1px solid #ddd;		
    font-size:1em;	
	outline:0;
}    

.large.xxl button:hover{
    cursor: pointer;
	}	

.img_container{
    min-height:0;
}



/*:::::::Zoom:::::::*/

 a.zurueck, .zurueck {
            display:block;
            position:absolute;
            height:15px;
            font-family:Arial, Helvetica, sans-serif;
            font-size:12px;
            text-align: center;
            font-weight:bold;
            color:#666;
            text-decoration: none;
            top:20px;
            left:45px;}

 
/*:::::::Impressum:::::::*/

.sn .sven_active {
	float: left;
	line-height:20px;
	margin:0;
	padding:0;
	font-size:12px;
	font-weight:bold;
	color:#ccc;
	}

.sn h1{
	margin:0 0 20px 0;
	padding:0;
	font-size:12px;
	font-weight:bold;
	color:#666;
	}
.sn h2{
	margin:20px 0 20px 0;
	padding:0;
	font-size:12px;
	font-weight:bold;
	color:#666;
	}

.sn p {
	margin:0;
	padding:0;
	font-size:12px;
	font-weight:400;
	color:#666;
}
/*:::::::Texte:::::::*/

.sn.text .showcase {
	padding:0;
	}

.sn.text .showcase p {
	text-align:justify;
	margin:0;
	line-height:16px;
	padding:0;
	font-size:12px;
	font-weight:400;
	color:#666;
	}
.sn.text .showcase span {
	margin:0 0 0 550px;
	font-style:italic;}

/*:::::::Vita:::::::*/

.sn.vita .showcase {
	/* width:660px;
	padding:0;
	margin:35px 35px 0 50px; */
	}

.sn.vita h1 {
	margin:0 0 20px 0;
	padding:0;
	font-size:12px;
	font-weight:bold;
	color:#666;
	border-bottom:1px solid #ccc;
	}

.sn.vita h2 {
	margin:20px 0 20px 0;
	padding:0;
	font-size:12px;
	font-weight:bold;
	color:#666;
	border-bottom:1px solid #ccc;
	}



/*::::::::::::::::::Bildunterschrift:::::::::::::::::*/

.sn #title {
	margin:10px 0 10px 0;
	height:10px;
	}

.sn #title p {
	float:right;
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	color:#ccc;
	}



/*::::::::::::::::::Skip:::::::::::::::::*/
.sn #skip {
	height:25px;
	margin:0 0 10px 0;
	padding:0;
	}

.sn #skipper {
	display:flex;
	height:25px;
    width:70px;
    margin:0 auto;
	}

/*.sn #skipdown{float:left; margin:0; padding:0; background-image:url(skip_down.jpg)}
.sn #skipup{float:left; padding:0; margin:0 0 0 15px; background-image:url(skip_up.jpg)}*/

.sn a.skipdown{
	margin:0 7px 0 0;
	padding:0;
	width: 35px;
	height: 25px;
	-webkit-transform:rotate(360deg);
	border-style: solid;
	border-width: 12.5px 21.7px 12.5px 0;
	border-color: transparent #dddddd transparent transparent;
}

.sn a.skipup{
	padding:0;
	margin:0 0 0 7px;
	width: 35px;
	height: 25px;
	-webkit-transform:rotate(360deg);
	border-style: solid;
	border-width: 12.5px 0 12.5px 21.7px;
	border-color: transparent transparent transparent #dddddd;}



/*::::::::::::::::::Thumbs:::::::::::::::::*/

.sn #thumbs {
    display:flex;
    justify-content: flex-start;
    border:1px solid #ddd;
    margin:20px 0 20px 0;
    height:1.15em;
	}


.sn #thumbs > a {
    -ms-flex: 1 1 auto;
    flex-grow: 1;
    background:#FFF;
    border-right:1px solid #ddd;
    padding:0 1px;
    background:#fff;
	}

.sn #thumbs > div{
    -ms-flex: 1 1 auto;
    flex-grow: 1;
    background:#FFF;
    border-right:1px solid #ddd;
    padding:0 1px;
    background:#DDD;}


.sn #thumbs > a:hover{background:#DDD}
.sn #thumbs #active {background:#ddd;border:0;margin:0}
.sn #thumbs div.last, .sn #thumbs #fuenfzig {border-right:0}


/*:::::::::::::Footer::::::::::::::::::::::*/


.clearfloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}



