html{
	overflow:hidden;
    height: 100%;
    /* -webkit-text-size-adjust: 100%; */
}
body{
	font-family: 'europa';
	font-weight: 350;
	font-style: normal;
	font-size: 19.5px;
    line-height:1.5;
    letter-spacing: 0.03em;
	background-color: #281662;
	padding:25px;
    height: 100%;
}

body * { -webkit-text-size-adjust: none; }

#mond,#mondpic{
    position:absolute;
    top:50%;
    left:50%;
    z-index:300;
}
#mondpic{ display:none; }

.nav_active{ border-bottom:4px solid #FFFFFF; }
.nav_black_active{ border-bottom:4px solid #000000; }
.nav_black { color: #000000; }
.nav_black:hover{ border-bottom:4px solid #000000; }
.nav_white { color: #FFFFFF; }
.nav_white:hover{ border-bottom:4px solid #FFFFFF; }

.dnav{
    position:fixed;
    font-size:45px;
    font-weight:500;
    z-index:600;
    cursor:pointer;
    letter-spacing:2px;
    cursor:pointer;
    line-height:50px;
    /*transition: all ease 0.4s; */
}
.dnav.karte{
    position:fixed;
    text-transform:uppercase;
    right:15px;
    bottom:11px;
    margin-bottom:4px;
}

.dnav.projekt{
    text-transform:uppercase;
    right:15px;
    top:15px;
}


.dnav.karte.nav_active:hover{
    margin-bottom:4px;
}

.karte:hover{
	margin-bottom:0px;
}

.dnav.monde13{
    text-transform:uppercase;
    left:15px;
    top:15px;
    display:none;
}

#monde13intro{
    text-transform:uppercase;
    position:absolute;
    font-size:120px;
    font-weight:350;
    z-index:600;
    cursor:pointer;
    letter-spacing:2px;
    cursor:pointer;
    color:#FFFFFF;
    line-height:0.9;
    transition: all ease 0.4s;
}

#map{
    position:absolute;
    width:100%;
    height:100%;
    left:0px;
    top:0px;
    visibility:hidden;
}

.fliesstext{
    font-size: 19.5px;
    line-height:1.5;
    letter-spacing: 0.03em;    
}
.fliesstext>p{
	margin-top:0px;
	margin-bottom:15px;    
}

.headline,.headline2{
    font-size:36px;
    letter-spacing: 0.04em;
    margin-bottom: 10px;
    padding-bottom:10px;
    text-decoration: underline; 
    text-underline-offset: 0.2em; 
    text-decoration-thickness:2px; 
}
.headline2{ font-size:34px; }

a.iplink:link,a.iplink:visited,a.iplink:active,a.iplink:hover{
	color:#FFFFFF;
	text-decoration:none;
}
.listort:hover .iplink{ color: hwb(73 38% 3%); }



.dnav.impressum{
    left:30px;
    bottom:20px;
    font-size:15px;
    /*writing-mode:sideways-lr;*/
    /* transform: rotate(-90deg); transform-origin: bottom right; */
    transform: rotate(-90deg); transform-origin: bottom left;
    color: #FFFFFF;
    font-weight: 350;
    line-height:20px;
}


/*
.dnav.impressum{
    left:15px;
    top:50%;
    font-size:15px;
    writing-mode:sideways-lr;
    color: #FFFFFF;
    font-weight: 350;
    line-height:20px;
    text-align:center;
    height:220px;
    margin-top:-110px;
}
    */

.impressum:hover{
    //border-right:1px solid white;
    text-decoration: underline; 
    text-underline-offset: 0.2em;
    text-decoration-thickness:1px; 
}
.dnav.impressum_active{ color:#8a37f7; }

.mapboxgl-ctrl-bottom-left,.mapboxgl-ctrl-attrib-inner,.mapboxgl-ctrl-bottom-right,.mapboxgl-ctrl-bottom,.mapboxgl-ctrl-top,.mapboxgl-control-container{ display:none !important; }

.trans{ transition: all ease 0.4s; }
.ort { display:none; }

.gradient{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background: #1D0A65;
    background: linear-gradient(180deg,rgba(29, 10, 101, 1) 0%, rgba(39, 12, 97, 1) 18%, rgb(90, 37, 141) 45%, rgba(87, 19, 160, 0.86) 55%, rgba(111, 23, 170, 0.86) 65%, rgba(123, 34, 182, 0.86) 75%, rgba(202, 140, 214, 0.803) 90%,  rgb(238, 248, 148) 100%); 
    background-repeat: no-repeat;
    background-size: cover; 
    z-index: 299;
    transition: all ease 0.4s;
}

#map{ transition: all ease 1,4s; }

#contentholder{
	position:absolute;
	right:0px;
	top:0px;
	width:0px;
	z-index:350;
	background-color:#FFFFFF;
	overflow:hidden;
	transition: all 0.5s ease-out;
}

#close{
	position:absolute;
	right:20px;
	top:0px;
	cursor:pointer;
	font-size:40px;
	z-index:200;
	color: #000000;
}
#close:hover{ color: #0099ff; }

.violet{
	font-weight:unset;
	color:#4c0fe0;
}

.routelink{
    color:#000000;
    text-decoration:none;
}
.routelink:hover{ color:#4c0fe0; }

.arrleft{
    width:20px;
    height:20px;
    border-left:2px solid #4c0fe0;
    border-bottom:2px solid #4c0fe0;
    transform: rotate(45deg);
    cursor:pointer;
}

.arrright{
    width:20px;
    height:20px;
    border-right:2px solid #000000;
    border-top:2px solid #000000;
    transform: rotate(45deg);
    cursor:pointer;
}

.arrleft:hover{
    border-left:2px solid #4c0fe0; 
    border-bottom:2px solid #4c0fe0; 
}

.arrright:hover{
    border-right:2px solid #4c0fe0; 
    border-top:2px solid #4c0fe0;     
}

.vcircle{
    width:40px;
    height:40px;
    border:2px solid #4c0fe0; 
    border-radius:40px;
    display:inline-block;
    margin-top:-40px;
}
.vcircleinner{
    font-size:22px;
    font-weight: 400;
    text-align:center;
    width:30px;
    height:30px;
    margin:5px;
    margin-top:3px;
}

.arwrap{ float:right; }
.alwrap{ float:left; }
.alwrap,.arwrap{ padding-top:2px; }

#projekt{
    position:absolute;
    width:60%;
    height:75%;
    left:50%;
    top:15%;
    margin-left:-30%;
    z-index:500;
    color:#FFFFFF;
    display:none;
    overflow:hidden;
    scrollbar-color: hwb(76 38% 3%) transparent;
    scrollbar-width: thin;
    padding-right:unset;
    overflow:auto;
}

.pcontent{
    padding-right:10px;
    letter-spacing: 0.03em;
    scrollbar-color: #FFFFFF transparent;
    scrollbar-width: thin;
	padding-top:0px;
	margin-top:0px;
}

.lnum,.lort{ display:inline-block; }
.lnum{ width:30px; text-align: right; padding-right: 12px;}
.listort{ margin-bottom:5px; }

#impressum{
    position:absolute;
    left:0px;
    top:0px;
    height:100%;
    z-index:500;
    background-color:#FFFFFF;
    display:none;
}

.iwrapper{
    position:absolute;
    width:70%;
    height:75%;
    top:15%;
    left:50%;
    margin-left:-35%;
    overflow:auto;
    padding-right:40px;
    scrollbar-color: #DDDDDD #DDDDDD;
    scrollbar-width: thin;
    mask-image: linear-gradient(to top, rgba(255,255,255,0), #fff 90px);
    mask-repeat: no-repeat;
    mask-position: bottom;
}

.link{ color:#000000; }

/*
.mapboxgl-popup-close-button{ display: none; }
.mapboxgl-popup-content{
    font: 300 15px/22px 'europa', Sans-serif;
    padding: 0;
    width: 200px;
}
.mapboxgl-popup-content-wrapper{ padding: 1%; }
*/

#cwrapper{
    position:absolute;
    margin-top:unset;
}

#ititle{ width:100%; }
#bkm{ width:250px; }

#content{
	margin-top:20px;
	overflow:auto;
	width:100%;
	padding-right:20px;
	transition: all 0.5s ease-out;
    margin-bottom:25px;
    scrollbar-color: #DDDDDD #DDDDDD;
    scrollbar-width: thin;
    mask-image: linear-gradient(to top, rgba(255,255,255,0), #fff 90px);
    mask-repeat: no-repeat;
    mask-position: bottom;
}

/* Route */
#route{
    width:100%;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
    padding-top:6px;
    padding-bottom:6px;
    margin-top:0px;
}
#routeinner{
    width:90%;
    margin-left:5%;
    text-align:center;
    font-size:18px;
    letter-spacing:0.03em;
}

/* vor-zurück-Navigation */
#navigation{
    margin-left:0px;
    align-self:center;
    margin-top:30px;
    width:100%;
    height:50px;
    text-align:center;
}

#navinner{
    display:inline-block;
    width:160px;
    text-align:center;
}

.langchange{
    position:fixed;
    top:50%;
    right:25px;
    text-align:center;
    z-index:500;
    /* writing-mode:sideways-lr; */
    transform: rotate(-90deg); transform-origin: bottom right;
    
    height:20px;
    width:80px;
    margin-top:-40px;
}

.langchange_sm{
     position:fixed;   
     bottom:10px;
     left:50%;
     width:80px;
     margin-left:-40px;
    text-align:center;
    z-index:5000000000;
}

#en,#de,#en>a,#de>a{
    display:inline-block;
    cursor:pointer;
    color:#fefefe;
    font-weight:500;
    text-decoration:none;
}

#en.lang_active_white,#de.lang_active_white,#en.lang_active_white_underline>a,#de.lang_active_white_underline>a{
    color:#FFFFFF !important;
     text-decoration: underline; 
    text-underline-offset: 0.2em;
    text-decoration-thickness:1px; 
    cursor:default;
}

#en.lang_active_white_underline,#de.lang_active_white_underline,#de.lang_active_white_italic,#en.lang_active_white_underline>a,#de.lang_active_white_underline>a{
    color:#fcfbfd !important;
    text-decoration: underline; 
    text-underline-offset: 0.2em;
    text-decoration-thickness:1.5px; 
    cursor:default;  
}