body {

        }
        /* Default link styling */
        a:link    { color:#8786CC;
                   text-decoration: none
                  }
        a:visited { color:#ddd; }
        a:hover, 
        a:focus   { color:#ccc; }
        a:active  { color:#ccc; }

{
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
 vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section
{
display: block;
}

/*        BODY MIT HINTERGRUND-FOTO */

body {
        background-color: #333;
        
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-position: left top;
        background-size: cover;
        line-height: 1;
        font-size: 62.5%; /* BASIS-GRÖSSE (62,5% = 10PX) */
        }


h1, h2, h3 {
        color: #999;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-weight: 200;
        padding: 0 4%;

        }

h1 {
        font-size: 180%; /* IN BEZUG AUF BASIS-GRÖSSE (700% = 70PX) */
        letter-spacing: 1px;
        text-transform: uppercase;
        margin: 3% 0 10px 0;
        word-wrap: break-word;
        }

h2 {
        text-transform: uppercase;
        font-size: 100%;
        letter-spacing: 1px;
        }

h3 {    position: relative;
        width: 90%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 100%;
        line-height: 1.0em;

        }

hr {

        position: relative;
        width: 90%;
        max-width: 90%;
        color: #888;
        margin: 1px 5%;

        }

#map { width: 100%; height: 640px; }

		.fullscreen-icon { background-image: "https://www.q222.de/php/images/icon-fullscreen-2x.png"); }
		/* on selector per rule as explained here : http://www.sitepoint.com/html5-full-screen-api/ */
		#map:-webkit-full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
		#map:-moz-full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
		#map:full-screen { width: 100% !important; height: 100% !important; z-index: 99999; }
		.leaflet-pseudo-fullscreen { position: fixed !important; width: 100% !important; height: 100% !important; top: 0px !important; left: 0px !important; z-index: 99999;
        }



#space {position: relative;
        width: 90%;
        max-width: 90%;
        margin: 25px 5% 0 5%;
        
        }

#spaltentext  {

         position: relative;
        width: 360px;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 120%;
        line-height: 1.4em;
        margin: 10px 5% 0 5%;

        }

#spaltentext_links  {

         position: relative;
        width: 100%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 100%;
        line-height: 1.4em;
        margin: 0 1.5% 0 2%;

        }

#text {

        position: relative;
        width: 90%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 100%;
        line-height: 1.0em;
        margin: 10px 5% 0 5%;

        }
#text1 {

        position: relative;
        width: 90%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 100%;
        line-height: 1.5em;
        margin: 10px 5% 0 5%;

        }
#text2 {

        position: relative;
        width: 100%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 105%;
        line-height: 1.0em;
        margin: 0px 1% 0 1%;
        text-transform: none;
        }

#text_galerie {

        position: relative;
        width: 100%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;

        font-size: 100%;

        line-height: 1.4em;
        padding: 2%;

        text-transform: none;
        }



#links {

        position: relative;
        width: 90%;
        max-width: 300px;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 100%;
        line-height: 1.0em;
        margin: 1px 5% 1px 5%;
        padding: 20px;
        z-index: 2;
        letter-spacing: 1px;
        text-transform: uppercase;
        word-wrap: break-word;
        }

#links2 {

        position: relative;
        width: 90%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 100%;
        line-height: 1.6em;
        margin: 20px 5% 0 5%;
        z-index: 2;
        text-transform: uppercase;
        word-wrap: break-word;
        }

#links3 {

        position: relative;
        width: 90%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 110%;
        line-height: 0.6em;
        margin: 0 0 0 6%;

        z-index: 2;
        text-transform: uppercase;
        word-wrap: break-word;
        }

#links4 {

        position: relative;
        width: 90%;
        max-width: 90px;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 100%;
        line-height: 1.6em;

        z-index: 2;
        text-transform: uppercase;
        word-wrap: break-word;
        }

/*Fotorama custom HTML-Seite */
#links_fotorama {
        position: relative;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 120%;
        line-height: 1.6em;

        margin: 1% 2% 0% 2%;
        text-transform: uppercase;

        }
#text_fotorama {

        position: relative;
        width: 100%;
        max-width: 90%;
        color: #888;
        font-family: "Arial", "Arial Narrow", Sans-Serif;
        font-size: 160%;
        line-height: 1.4em;
        padding: 2%;
        text-transform: none;
        }

.fotorama .any {
        color:  rgba(255, 255, 255, .6);
		height: 100%;
        width: 100%;
		padding-top: 10px;
		padding-left: 10px;
		padding-bottom: 10px;
		padding-right: 10px;
	}


/*Formular- Textfeld */
label { padding: 0; marign: 0; display: block; }
textarea {
    width: 490px;
    border: 1px solid #888;
    padding: 5px;
    background-color: #333;
    font-size: 150%;
    font-family: "Arial", "Arial Narrow", Sans-Serif;
    color: #999;
}

#chatbox1 {
	text-align:left;
    font-family: "Arial", "Arial Narrow", Sans-Serif;
    font-size: 120%;
    line-height: 1.2em;
    color:#999;

    margin: 4px 2px 0px 0px;

    margin-bottom:5px;
	padding:4px;
	background:#333;
	height:80px;
	width:481px;
	border:1px solid #888;
	overflow:auto; }

/* Chat - CSS */

input { font:12px arial; }
#chatbox {
	text-align:left;
    color:#888;
	margin:0 auto;
	margin-bottom:5px;
	padding:0px;
	background:#333;
	height:300px;
	width:100%;
	border:1px solid #888;
	overflow:auto; }

#usermsg {
	width:100%;
    margin:0px 0px 4px 0px;
	border:0px solid #333; }

.error { color: #ff0000; }
.msgln { margin:2px 4px 2px 4px; }