﻿/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* Hauptwerte                                                                                          */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

:root {
    --h1: #FCF2C0;
    --m1: #C19D61;
    --d1: #53441B;
    --h2: #FeF6CD;
    --m2: #C09C60;
    --d2: #614D22;
    --h3: #F9DEA4;
    --m3: #D2B48C;
    --d3: #463929;

    --dswMittel: var(--m3);
    --dswHell: var(--h2);
    --dswDunkel: var(--d2);

    --scrollbarBG: var(--dswDunkel);
    --thumbBG: var(--dswHell);

    --menuPfeil: "›";
    --menuHamburger: "≡";
    --menuClose: "✕"
}

html {
    box-sizing: border-box
}

*, *:before, *:after {
    box-sizing: inherit
}

html {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    color: var(--d3);
/*    font-size: initial;*/
    font-size: 14px;
    font-family: "Times New Roman", Times, serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0;
    border: 0;
    text-align: center;
    background-image: url(main.png);
    background-repeat: repeat;

    scrollbar-width: thin;
    scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}

body::-webkit-scrollbar {
     width: 11px;
}


body::-webkit-scrollbar-track {
    background: var(--scrollbarBG);
}

body::-webkit-scrollbar-thumb {
    background-color: var(--thumbBG);
    border-radius: 6px;
    border: 3px solid var(--scrollbarBG);
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*																													  */
/* globale Definitionen					  																			  */
/*																													  */
/*--------------------------------------------------------------------------------------------------------------------*/

ul, li {
    list-style-type: none;
    margin: 0 !important;
    padding: 0 !important;
}

button {
    color: var(--d3);
}

table {
    border-collapse: collapse;
    border: 1px solid var(--dswDunkel);
}

th, td {
    padding: 15px;
    text-align: left;
    border: 1px solid var(--dswDunkel);
}

a {
    color: var(--d3);
    text-decoration: none;
    outline: 0;
}

a:visited {
    outline: 0;
}

a:hover {
    outline: 0;
}

a:active {
    outline: 0;
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*																													  */
/* Farben,Schriften	usw.			      																			  */
/*																													  */
/*--------------------------------------------------------------------------------------------------------------------*/

.dsw_dunkel_bg {
    background-color: var(--dswDunkel);
}

.dsw_mittel_bg {
    background-color: var(--dswMittel);
}

.dsw_hell_bg {
    background-color: var(--dswHell);
}

.dsw_dunkel_fg {
    color: var(--dswDunkel);
}

.dsw_mittel_fg {
    color: var(--dswMittel);
}

.dsw_hell_fg {
    color: var(--dswHell);
}

.shadow_dsw {
    border: 0px solid;
    box-shadow: 0 0 0 4px var(--dswHell), 0 0 0 8px var(--dswMittel), 0 0 0 12px var(--dswDunkel);
}

.shadow_1 {
    border: 0px solid;
    box-shadow: 0 0 0 4px var(--h1), 0 0 0 8px var(--m1), 0 0 0 12px var(--d1);
}

.shadow_1_small {
    border: 0px solid;
    box-shadow: 0 0 0 2px var(--h1), 0 0 0 4px var(--m1), 0 0 0 6px var(--d1);
}

.shadow_2 {
    border: 0px solid;
    box-shadow: 0 0 0 4px var(--h2), 0 0 0 8px var(--m2), 0 0 0 12px var(--d2);
}

.shadow_2_small {
    border: 0px solid;
    box-shadow: 0 0 0 2px var(--h2), 0 0 0 4px var(--m2), 0 0 0 6px var(--d2);
}


.shadow_3 {
    border: 0px solid;
    box-shadow: 0 0 0 4px var(--h3), 0 0 0 8px var(--m3), 0 0 0 12px var(--d3);
}

.shadow_3_small {
    border: 0px solid;
    box-shadow: 0 0 0 2px var(--h3), 0 0 0 4px var(--m3), 0 0 0 6px var(--d3);
}

.rw_font_bold {
    font-weight: bold;
}


.rw_font_0_8 {
    font-size: 0.9em;
}

.rw_font_0_9 {
    font-size: 0.9em;
}

.rw_font_1_0 {
    font-size: 1.0em;
}

.rw_font_1_1 {
    font-size: 1.1em;
}

.rw_font_1_2 {
    font-size: 1.2em;
}

.rw_font_1_3 {
    font-size: 1.3em;
}

.rw_font_1_4 {
    font-size: 1.4em;
}

.rw_font_1_5 {
    font-size: 1.5em;
}

.rw_font_1_6 {
    font-size: 1.6em;
}

.rw_font_1_7 {
    font-size: 1.7em;
}

.rw_font_1_8 {
    font-size: 1.8em;
}

.rw_font_1_9 {
    font-size: 1.9em;
}

.rw_font_2_0 {
    font-size: 2.0em;
}

.rw_rotate_90 {
    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg);
}

.rw_rotate_180 {
    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari */
    transform: rotate(180deg);
}

.rw_rotate_270 {
    -ms-transform: rotate(270deg); /* IE 9 */
    -webkit-transform: rotate(270deg); /* Safari */
    transform: rotate(270deg);
}

.rw_linear_bg_hell {
    background: rgb(210,180,140);
    background: -moz-linear-gradient(180deg, rgba(210,180,140,1) 0%, rgba(249,222,164,1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(210,180,140,1) 0%, rgba(249,222,164,1) 100%);
    background: linear-gradient(180deg, rgba(210,180,140,1) 0%, rgba(249,222,164,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d2b48c",endColorstr="#f9dea4",GradientType=1);
}
.rw_circle_bg_hell {
    background: rgb(210,180,140);
    background: -moz-radial-gradient(circle, rgba(210,180,140,1) 0%, rgba(249,222,164,1) 35%, rgba(180,145,98,1) 100%);
    background: -webkit-radial-gradient(circle, rgba(210,180,140,1) 0%, rgba(249,222,164,1) 35%, rgba(180,145,98,1) 100%);
    background: radial-gradient(circle, rgba(210,180,140,1) 0%, rgba(249,222,164,1) 35%, rgba(180,145,98,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d2b48c",endColorstr="#b49162",GradientType=1);
}

.rw-display-left {
    position: absolute;
    top: 50%;
    left: 20px;
}

.rw-display-right {
    position: absolute;
    top: 50%;
    right: 20px;
}

.rw-display-topmiddle {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%,0%);
    -ms-transform: translate(-50%,0%)
}

.rw-display-bottommiddle {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%,0%);
    -ms-transform: translate(-50%,0%)
}
.rw_div_left {
    text-align:left;
}
.rw_div_center {
	margin:0 auto;
    text-align:center;
}

.rw_div_right {
    text-align:right;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* info_table                                                                                             */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/


.info_container {
    margin: 0 auto;
    width: 98%;
    min-height: 98%;
}

.info_ueberschrift {
    text-align: center;
    font: bold 1.4em 'Comic Sans Ms', Arial, sans-serif;
    background: transparent;
    color: var(--dswDunkel);
    width: 100%;
}

.info_table {
    width: 100%;
    height: 100%;
    min-width: 100%;
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: auto auto auto auto auto auto auto auto auto;
    grid-gap: 0px;
    align-items:flex-start;
    justify-content: flex-start;
}


.info_table div {
    text-align: left;
    padding: 0px 5px 0px 5px;
    margin-bottom: -1px;
}

.info_ausgabe {
    grid-column: 1;
    border:1px solid black;
}

.info_typ {
    grid-column: 2;
    border: 1px solid black;
    margin-left:-1px;
}

.info_pfad {
    grid-column: 3;
    border: 1px solid black;
    margin-left: -1px;
}

.info_infoausgabe {
    grid-column: 4;
    border: 1px solid black;
    margin-left: -1px;
}

.info_valid {
    grid-column: 5;
    border: 1px solid black;
    margin-left: -1px;
}

.info_level {
    grid-column: 6;
    border: 1px solid black;
    margin-left: -1px;
}

.info_NaviText {
    grid-column: 7;
    border: 1px solid black;
    margin-left: -1px;
}

.info_ID {
    grid-column: 8;
    border: 1px solid black;
    margin-left: -1px;
}

.info_ParentID {
    grid-column: 9;
    border: 1px solid black;
    margin-left: -1px;
}


/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* content                                                                                             */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

#toplink {
    position: fixed;
    bottom: 50px;
    right: 50px;
    border: 4px solid var(--dswDunkel);
    background-color: var(--dswHell);
    color: var(--dswDunkel);
    padding: 10px;
    display: none;
    text-align: center;
    z-index: 3;
}

.main_container {
/*
    position:relative;
    z-index:2;
*/
}

.header {
    position: fixed;
    top: 5px;
    left: 5px;
    width: 99%;
    overflow: hidden;
    border-color: var(--dswDunkel);
    border-width: 2px;
    border-style: none none none none;
/*
    background-image: url(h1.png);
    background-repeat: no-repeat;
*/
}

.fixed_helper {
    position: fixed;
    top: 0px;
    left: 5px;
    margin-top: 110px;
    height: inherit;
    min-height: inherit;
    bottom: 20px;
    overflow: auto;
    z-index: 2;
/*    clear: both;*/
    border-color: var(--dswDunkel);
    border-width: 2px;
    border-style: solid solid solid solid;
}

#content_container {
    width: inherit;
    min-width: inherit;
    right: 11px;
    margin-left: 365px;
    padding: 10px;
    transition: 0.5s;
}

#menu_container {
    width: 360px;
    transition: 0.5s;
    /*
    background-image: url(image_menu.png);
    background-repeat: no-repeat;
    */
}

#home_container {
    top: 0px;
    left: 0px;
    width: 100%;
    height: 98%;
    overflow: hidden;
    background-image: url(mainback.jpg);
    background-repeat: no-repeat;
}


.trenner {
    border-top: 2px solid var(--dswDunkel);
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*																													  */
/* Header    	        			      																			  */
/*																													  */
/*--------------------------------------------------------------------------------------------------------------------*/

.header_content {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-rows: 20px 50px 30px;
    grid-template-columns: 40px 40px 150px auto;
    grid-gap: 0px;
    border-bottom: 2px solid var(--dswDunkel);
}

.header_impressum {
    grid-column: 4;
    grid-row: 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 10px;
    padding-left: 20px;
    font: bold 1.0em , Arial, sans-serif;
    /*font-size: 0.9em; */
}


.header_intro {
    grid-column: 1 / span 4;
    grid-row: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    /*    justify-content: flex-end;*/
    padding-right: 20px;
    font: bold 2.0em 'Comic Sans Ms', Arial, sans-serif;
}

.header_back_container {
    grid-column: 1 / span 4;
    grid-row: 3;
}

.header_col_left {
    grid-column: 1;
    grid-row: 3;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header_col_Home {
    grid-column: 1;
    grid-row: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header_col_image {
    grid-column: 3;
    grid-row: 3;
}

.header_col_right {
    grid-column: 4;
    grid-row: 3;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 10px;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* Footer                                                                                              */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

.footer {
    position: fixed;
    bottom: 0;
    left: 5px;
    width: 99%;
    height: 2px;
    margin-right: 10px;
    background-color:black;
    z-index:2;
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*																													  */
/* TreeView	              			      																			  */
/*																													  */
/*--------------------------------------------------------------------------------------------------------------------*/

.caret {
    cursor: pointer;
    -webkit-user-select: none; /* Safari 3.1+ */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none;
}

.caret::before {
    content: var(--menuPfeil);
    display: inline;
    padding-right: 8px;
    text-align: center;
    font-size: 1.2em !important;
    font-weight: bold;
}

.non_caret {
}

.non_caret::before {
    content: var(--menuPfeil);
    color: transparent;
    display: inline;
    padding-right: 8px;
    text-align: center;
    font-size: 1.2em !important;
    font-weight: bold;
}


.caret-down::before {
    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg);
}

.nested {
    display: none;
}

.active {
    display: block;
}


.nav_item {
    border: none;
    background-color: transparent;
    width: 100%;
    text-align: left;
    font-size: 1.0em;
    /*
    font-weight: bold;
    */
}


/*--------------------------------------------------------------------------------------------------------------------*/
/*																													  */
/* Navigation	        			      																			  */
/*																													  */
/*--------------------------------------------------------------------------------------------------------------------*/

#home {
    cursor: pointer;
    background-color: transparent;
    border: none;
    font-size: 1.3em;
}

#closenav {
    cursor: pointer;
    background-color: transparent;
    font-size: 1.4em;
    font-weight: bold;
}

#closenav::before {
    content: var(--menuClose);
}

#closenav:hover {
    text-decoration: none;
    outline: 0;
}

#opennav {
    cursor: pointer;
    background-color: transparent;
    border: none;
    display: none;
    content: var(--menuHamburger);
    font-size: 1.4em;
    font-weight: bold;
}

#opennav::before {
    content: var(--menuHamburger);
}


#navi_info_text {
    font-size: 0.9em;
    font-weight: bold;
}

.sidepanel_div {
    text-align: left;
    vertical-align:top;
 /*   margin-top: -10px;*/
    margin-bottom: 10px;
    overflow-x: hidden;
}

.sidepanel_top {
    display: block;
    margin:0;
    text-align:right;
    width: 100%;
    padding-right:10px;
    border-bottom: 1px solid var(--dswDunkel);
    clear:both;
}

.sidepanel_button {
    cursor: pointer;
    background-color: transparent;
    border: none;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* Image-Slideshow                                                                                 	   */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

.gallery_button {
    color: var(--dswHell);
    background-color: var(--dswDunkel);
    padding: 5px 15px;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.3em;
    cursor: pointer;
    text-align: center;
    white-space: nowrap;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.gallery_button:hover {
    color: var(--h1);
    text-decoration: underline;
}


.rw_slider {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 70%;
}

.img_slider {
    display: none;
    max-width: 95%;
    max-height: 95%;
    min-width: 50%;
    min-height: 50%;
}


/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* Bildergalerie                                                                                       */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

.content_wrapper_center {
    margin: 0 auto;
    text-align: center;
    min-width: 100%;
    min-height: 95%;
}

.gallery_info {
    overflow: hidden;
    color: var(--dswDunkel);
    text-align: center;
    background: var(--dswHell);
    font: normal 1.0em 'Comic Sans Ms', Arial, sans-serif;
}

.gallery_quelle {
    overflow: hidden;
    margin-top: 2px;
    padding-left: 10px;
    color: var(--dswDunkel);
    background: var(--dswHell);
    font: normal 0.8em 'Comic Sans Ms', Arial, sans-serif;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* klein		                                                                                       */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/


.gallery_small {
    width: 200px;
    height: 180px;
    overflow: hidden;
}

.gallery_small img {
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: contain;
    width: 100%;
    height: 100%;
    max-height: 100%;
    max-width: 100%;
    padding: 5px 5px 5px 5px;
}

.gallery_wrapper_small {
    float: left;
    margin-left: 30px;
    margin-top: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background: var(--dswMittel);
    width: 205px;
    height: 185px;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* gross		                                                                                       */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

.gallery_big {
    width: 500px;
    height: 440px;
    overflow: hidden;
}

.gallery_big img {
    display: flex;
    justify-content: center;
    align-items: center;
    object-fit: contain;
    width: 100%;
    height: 100%;
    max-height: 100%;
    max-width: 100%;
    padding: 10px 10px 10px 10px;
}

.gallery_wrapper_big {
    margin: 0 auto;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 30px;
    padding-bottom:10px;
    width: 510px;
    background: var(--dswHell);
}


/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* lightbox                                                                                       	   */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

.rw_lightbox {
    position: fixed;
    z-index: 10;
    top: 0;
    left: 0;
    height: 0;
    width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.8);
    opacity: 0;
}

.rw_lightbox img {
    max-width: 85%;
    max-height: 85%;
    min-width: 30%;
    min-height: 30%;
    opacity: 0;
}

.rw_lightbox:target {
    outline: none;
    width: 100%;
    height: 100%;
    opacity: 1 !important;
}

.rw_lightbox:target img {
    opacity: 1;
    transition: all 0.6s ease-in;
    border: 0px solid;
 }


.btn-close {
    position: absolute;
    right: 2%;
    top: 2%;
    color: #fafafa;
    background-color: red;
    border: solid 5px white;
    padding: 10px 15px;
    border-radius: 1px;
    text-decoration: none;
}

.btn-close:hover {
    background-color: #740404;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* KartenFenster                                                                                       */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

#KartenFenster {
    position: fixed;
    left: 5px;
    top: 110px;
    bottom: 20px;
    right: 11px;
    z-index: 1;
    overflow: hidden;
    margin-right: 10px;
    margin-bottom: 100px;
    border: 2px solid black;
    font-size: small;
    display: none;
}

#KartenFenster_GUI {
    min-width:99%;
    min-height:99%;
    overflow: hidden;
    border: 2px solid black;
    font-size: small;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* Video                                                                                               */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

.video_div {
    margin: 0 auto;
    text-align: center;
    min-width: 90%;
    min-height: 90%;
    max-width: 90%;
    max-height: 90%;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* PDF-Ausgabe                                                                                         */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

.pdf {
    width: 99%;
    height: 99%;
    overflow: hidden;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* Dokumente		                                                                                   */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/

.doc_container {
    margin: 0 auto;
    width: 98%;
    min-height: 98%;
}

.doc_ueberschrift {
    text-align: center;
    font: bold 1.2em 'Comic Sans Ms', Arial, sans-serif;
    background: transparent;
    color: var(--dswDunkel);
    width: 100%;
}

.doc_content {
    width: 99%;
    height: 98%;
}

.doc_content img {
     display: block;
     margin-left: auto;
     margin-right: auto;
}

/*-----------------------------------------------------------------------------------------------------*/
/*                                                                                                     */
/* Animationen                                                                                   	   */
/*                                                                                                     */
/*-----------------------------------------------------------------------------------------------------*/


.rw-spin {
    animation: w3-spin 2s infinite linear
}

@keyframes rw-spin {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(359deg)
    }
}

.rw-animate-fading {
    animation: fading 2s infinite
}

@keyframes fading {
    0% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

.rw-animate-opacity {
    animation: opac 0.8s
}

@keyframes opac {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.rw-animate-top {
    position: relative;
    animation: animatetop 0.4s
}

@keyframes animatetop {
    from {
        top: -300px;
        opacity: 0
    }

    to {
        top: 0;
        opacity: 1
    }
}

.rw-animate-left {
    position: relative;
    animation: animateleft 0.4s
}

@keyframes animateleft {
    from {
        left: -300px;
        opacity: 0
    }

    to {
        left: 0;
        opacity: 1
    }
}

.rw-animate-right {
    position: relative;
    animation: animateright 0.4s
}

@keyframes animateright {
    from {
        right: -300px;
        opacity: 0
    }

    to {
        right: 0;
        opacity: 1
    }
}

.rw-animate-bottom {
    position: relative;
    animation: animatebottom 0.4s
}

@keyframes animatebottom {
    from {
        bottom: -300px;
        opacity: 0
    }

    to {
        bottom: 0;
        opacity: 1
    }
}

.rw-animate-zoom {
    animation: animatezoom 0.6s
}

@keyframes animatezoom {
    from {
        transform: scale(0)
    }

    to {
        transform: scale(1)
    }
}

.rw-animate-input {
    transition: width 0.4s ease-in-out
}

.w3-animate-input:focus {
    width: 100% !important
}

/*-----------------------------------------------------------------------------------------------------*/



