/*##################################
	Eingebundene Webfonts
####################################*/


@font-face {
    font-family: 'sarabunextrabold';
    src: url('../ttf/sarabun-extrabold-webfont.woff2') format('woff2'),
         url('../ttf/sarabun-extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/*##################################
	Generelle Einstellungen
####################################*/
 
    html{
        max-width: 100%;
        min-height: 100vh;
    }
    
    body{
        display: block;
        width: inherit;
        z-index: 0;
        background: #F23B3F;
        /* background: radial-gradient(circle, rgba(234,61,45,1) 0%, rgba(255,238,2,1) 41%, rgba(249,169,30,1) 74%, rgba(242,59,63,1) 100%); */
        align-items: center;
        justify-content: center;
        padding-bottom:0.5vw;    
        padding-top:0.25vw;
        overflow-x: hidden;
    }

    #backgroundContainer {
        display: block;
        position: fixed;
        width: 99.7vw;
        height: 100%;
        overflow: hidden;
        z-index: -1;
        background-image: url('../img/icons/backgroundWeb.png');
        background-repeat: repeat-y;
        background-size: 200%;
    }

    #success{
        display: grid;
        width: 86vw;
        height: 100vw;
        background-color: #F23B3F;
        margin-left: auto;
        margin-right: auto;
    }

    #Meldung{
        display:block;
        position: relative;
        width: 86vw;
        left: -2vw;
        justify-content: center;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        margin-top: auto;
        margin-bottom: auto;
        color: #ffffff;
        text-decoration: none;
        font-family: 'sarabunextrabold';
        font-size: 8vw;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        padding-top: 4vw;
        padding-bottom: 4vw;
        padding-right: 2vw;
        padding-left: 2vw;
    }

    /*
    ####################################
    Header
    ####################################
    */

    #navigationsleiste{
        width: 100vw;
        max-width: 100vw;
        position: relative;
        z-index: 20;
        grid-template-columns: 1% 16% 73%;
        grid-template-rows: 100%;
        left: -10vw;
        margin-top: 1vw;
        padding-left: 5vw;
        padding-right: 5vw;
        height: 20vw;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        display: grid;
        margin-left: auto;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    #burgerMenue{
        display:grid;
        grid-row-start: 1;
        grid-column-start: 3;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        grid-auto-rows: 18vw;
        grid-auto-flow: dense;
        width: 80vw;
        grid-gap: 1vw;
        z-index: 10;
        height: fit-content;
        min-height: 10vw;
        position: absolute;
        align-items:center;
        justify-content: right;
        background-image: url(../img/icons/burgerMenue.png);
        background-repeat: no-repeat;
        background-position: right center;
        background-size: 16vw;
        cursor: pointer;
        
    }

    #welcome{
        display: block;
        grid-column-start: 2;
        grid-row-start:1 ;
        width: 40vw;
        height: auto;
        position: absolute;
        left: 30vw;
        text-align: center;
        font-family: 'sarabunextrabold';
        font-size: 7vw;
        color: #ffffff;
        white-space: pre-line;
    }

    .burger-menu > * {
        display: none;
      }
      
      .burger-menu.active > * {
        display: block;
    }
    
    #navItem_01{
        display: none;
        position:relative;
        top: -8vw;
        height: 10vw;
        padding-right: 2vw;
        grid-row-start: 8;
        text-decoration: none;
        text-align: right;
        font-family: 'sarabunextrabold';
        font-size: 10vw;
        padding-top: 4vw;
        padding-bottom: 4vw;
        color: #ffffff;
    }

    #navItem_02{
        display: none;
        position:relative;
        top: -6vw;
        height: 10vw;
        padding-right: 2vw;
        grid-row-start: 9;
        text-decoration: none;
        text-align: right;
        font-family: 'sarabunextrabold';
        font-size: 10vw;
        padding-top: 4vw;
        padding-bottom: 4vw;
        color: #ffffff;
    }

    #navItem_04{
        display: none;
        position:relative;
        top: -4vw;
        height: 10vw;
        padding-right: 2vw;
        grid-row-start: 10;
        text-decoration: none;
        text-align: right;
        font-family: 'sarabunextrabold';
        font-size: 10vw;
        padding-top: 4vw;
        padding-bottom: 4vw;
        color: #ffffff;
    }

    #navItem_05{
        display: none;
        position:relative;
        top: -2vw;
        height: 10vw;
        padding-right: 2vw;
        grid-row-start: 11;
        text-decoration: none;
        text-align: right;
        font-family: 'sarabunextrabold';
        font-size: 10vw;
        padding-top: 4vw;
        padding-bottom: 4vw;
        color: #ffffff;
    }

    #navItem_03{
        z-index: 3;
        display: block;
        position: absolute;
        text-decoration: none;
        margin-right: auto;
        margin-top: auto;
        margin-bottom: auto;
        grid-column-start: 2;
        grid-row-start: 1;
        justify-content: center;
    }

    #nav_logo{
        display: inherit ;
        z-index: 3;
        width: 20vw;
        height: 20vw;
    }

    /*
    ####################################
    Footer
    ####################################
    */

    #footer{
        width: 100vw;
        max-width: 100vw;
        height: 20vw;
        position:relative;
        z-index: 1;
        margin-bottom: auto;
        display: grid;
        grid-template-rows: 100%;
        grid-template-columns: 50% 50%;
        overflow: hidden;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        padding-left: 5vw;
        padding-right: 5vw;
        margin-left: auto;
        left: -10vw;
        justify-content: center;
        align-items: center;
    }

    #footerHome, #footerVerein, #footerGalerie, #footerKontakt{
        display: none;
        pointer-events: none;
    }

    #footerImpressum{
        display: block;
        z-index: 3;
        width: 10vw;
        position: absolute;
        left: 7vw;
        top: 6vw;
        height: 13vw;
        grid-column-start: 1;
        grid-row-start: 1;
        text-decoration: none;
        text-align: left;
        font-family: 'sarabunextrabold';
        font-size: 9vw;
        color: #ffffff;
        text-decoration: none;
        margin-top: auto;
        margin-bottom: auto;
    }

    #footerAdmin{
        display: none;
    }

    #LoginSymbol{
        display: block;
        z-index: 3;
        position: absolute;
        right: 4vw;
        width: 15vw;
        height: 15vw;
        grid-column-start: 3;
        background-image: url("../img/icons/schloss.png");
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        cursor: pointer;
    }

    #footerLoginContainer{
        display: none;
        grid-template-rows: 50% 50%;
        grid-template-columns: 80% 20%;;
        width: inherit;
        height: 20vw;
        position: absolute;
        top: 1.5vw;
        z-index: 3;
        left: 5vw;
        grid-column-start: 2;
        justify-content: center;
        align-items: flex-start;
        pointer-events: none    ;
    }

    #footerLogin1{
        display: block;
        z-index: 4;
        position: absolute;
        left: 1vw;
        margin-bottom: auto;
        width: 75vw;
        height: 7vw;
        grid-column-start: 1;
        grid-row-start: 1;
        pointer-events: none;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #000000;
        pointer-events: all;
    }
    
    #footerLogin2{
        z-index: 4;
        display: block;
        position:absolute;
        left: 1vw;
        width: 75vw;
        height: 7vw;
        pointer-events: none;
        grid-column-start: 1;
        grid-row-start: 2;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #000000;
        background-size: cover;
        pointer-events: all;
    }

    #footerLogin3{
        display: block;  
        position: absolute;
        top: 1vw;
        width: 15vw;
        height: 15vw;
        z-index: 4;
        pointer-events: none;
        grid-column-start: 2;
        grid-row-start: 1;
        grid-row-end: 3;
        pointer-events: all;
        background-color: transparent;
        background-image: url("../img/icons/sendIcon.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        border: none;
        cursor: pointer;
    }

    #footerLogin5{
        display: none;
        z-index: 3;
        position: absolute;
        right: 1vw;
        width: 15vw;
        height: 15vw;
        grid-column-start: 3;
        background-color: transparent;
        border: none;
        background-image: url("../img/icons/logout.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

    #footerConfirmDelete{
        display: grid;
        position: absolute;
        left: 10vw;
        width: inherit;
        height: inherit;
        grid-template-columns: 42% 29% 29%;
        grid-template-rows: 100%;
        align-items: center;
        justify-content: center;

    }


    #footerLogin6{
        display: none;
        z-index: 3;
        width: auto;
        position: absolute;
        height: 15vw;
        grid-column-start: 1;
        grid-row-start: 1;
        text-decoration: none;
        text-align: center;
        white-space: pre-line;
        font-family: 'sarabunextrabold';
        font-size: 6vw;
        color: #ffffff;
        margin-top: auto;
        margin-bottom: auto;
        padding-left: 4vw;
    }
    
    #footerLogin7{    
        display: none;
        width: 18vw;
        height: 18vw;
        position: absolute;
        grid-column-start: 2;
        background-color: transparent;
        border: none;
        background-image: url("../img/icons/tick.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        cursor: pointer;
         
    }
    #footerLogin8{    
        display: none;
        width: 18vw;
        height: 18vw;
        position: absolute;
        grid-column-start: 3;
        background-color: transparent;
        border: none;
        background-image: url("../img/icons/cross.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        cursor: pointer;
    }
    /*
    ####################################
    Footere
    ####################################
    */

    #mainIndex{
        display: grid;
        position: relative;
        left: -1.5vw;
        z-index: 5;
        margin-top: 5vw;
        margin-bottom: 5vw;
        grid-template-columns: 80% 20%;
        grid-template-rows: 2.4% 97%;
        width: 100%;
        height: auto;
        min-height: 80vh;
    }

    #Willkommensbanner{
        display: none;
    }

    #welcomeDesktop{
        display: none;
    }

    /*
    Blog     
    ####################################
    */

    #blog{
        display: grid;
        position: relative;
        grid-template-columns: 100%;
        grid-template-rows: 22vw 22vw auto;
        z-index: 2;
        width: 75vw;
        height: auto;
        grid-column-start: 1;
        grid-row-start: 2;
        margin-left: auto;
        margin-right: auto;
        justify-content: center;
        align-items: center;
        margin-bottom: 5vw;
    }

    #BlogContainer{
        display: none;
        grid-row-start: 3;
    }

    .blogpost{
        grid-row-start: 3;
        grid-column-start: 1;
        display:grid;
        position: relative;
        width: 98vw;
        height: fit-content;
        margin-bottom: auto;
        margin-left: auto;
        margin-right: auto;
        grid-template-columns: 21% 79%;
        grid-template-rows: auto auto 18vw 18vw auto;
        justify-content: center;
        padding-top: 3vw;
    }

    .blogdate{
        display:block;
        position: inherit;
        grid-column-start: 1;
        grid-row-start: 1;
        width: 10vw;
        height: 10vw;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        font-family: 'sarabunextrabold';
        color: #ffffff;
        font-size: 5vw;
        text-align: center;
        padding: 3vw;
        margin-left: 1vw;
        margin-right: auto;
        margin-bottom: auto;
        margin-top: auto;
    }

.blogSeperator{
    display: block;
    width:inherit;
    border: 0.5vw solid #ffee02;
    grid-row-start: 2;
    grid-column-start: 1;
}

.blogcontent{
    display: grid;
    grid-row-start: 2;
    grid-column-start: 1;
    grid-template-columns: 100%;
    grid-template-rows: auto auto auto auto auto;
    position: relative;
    z-index: 1;
    width: 86vw;
    height: fit-content;
    margin-left: 1vw;
    margin-right: auto;
    margin-top: 3vw;
    padding: 5vw;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    font-size: 5vw;
    white-space: pre-wrap;
    text-align: center;
}


    .updateImageForm{
        display: none;
        position: relative;
    }


    .showImagesBN{
        display: block;
        width: inherit;
        height: 8vw;
        text-decoration: underline;
        grid-row-start: 4;
        grid-column-start: 1;
    }


    .blogImageGrid_small_06{
        display: none;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        grid-gap: 2.5vw;
        width: inherit;
        height: fit-content;
      }
    
    .blogImageGrid_small_04{
        display: none;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        grid-gap: 2.5vw;
        width: inherit;
        height: fit-content;
      }
    
      .blogImageGrid_small_03{
        display: none;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        grid-gap: 2.5vw;
        width: inherit;
        height: fit-content;
      }
      
      .blogImageGrid_medium_02{
        display: none;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        grid-gap: 2.5vw;
        width: inherit;
        height: fit-content;
      }
    
      .blogImageGrid_medium_04{
        display: none;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        grid-gap: 2.5vw;
        width: inherit;
        height: fit-content;
      }
    
    
      .blogImageGrid_large{
        display: none;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        grid-gap: 2.5vw;
        width: inherit;
        height: fit-content;
      }

      .blogGridItem{
        display: grid;
        width: auto;
        height: auto;
        max-width: inherit;
        grid-template-columns: 100%;
        grid-template-rows: auto fit-content;
        align-items:center;
        position: relative;
        z-index: 7;
        justify-content: center;
        margin: 0;
        margin-bottom: 2vw;
      }
      
      .blogGridImage{
        display: block;
        grid-row-start: 1;
        grid-column-start: 1;
        position: relative;
        z-index: 7;
        padding: 0;
        width: 100%;
        height: auto; 
        object-fit: contain;
        margin: auto;
        cursor: url('../img//icons/zoomIn.png'), zoom-in;
      }

    #ShowBlogFormBN{
        display: none;
        position: relative;
        grid-row-start: 2;
        grid-column-start: 1;
        z-index: 4;
        width: 96vw;
        height: auto;
        padding-top:5vw;
        padding-bottom:5vw;
        margin-left: 2vw;
        margin-right: auto;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
        text-align: center;
    }

    #addBlogEntry{
        display: none;
        position: relative;
        left: -1vw;
        top: 4vw;
        grid-row-start: 3;
        grid-template-rows:auto;
        margin-left: auto;
        margin-right: auto;
        grid-gap: 4vw;
        width: 94vw;
        height: auto;
        font-family: 'sarabunextrabold';
        font-size: 1.2vw;
        color: #ffffff;
    }
    
    #BlogTitleInput{
        display: block;
        position: relative;
        width: inherit;
        height: 12vw;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        border: none;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
        padding:1vw;
        margin-left: auto;
        margin-right: auto;
        
    }
    
    #BlogContentInput{
        display: block;
        width: inherit;
        position: relative;
        height: 42vw;
        line-height: 1.2;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        border: none;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
        resize: none;
        padding:1vw;
        margin-left: auto;
        margin-right: auto;
        
    }

    .blogdeleteiconForm{
        display: grid;
        position: relative;
        grid-column-start: 1;
        grid-column-end: 3;
        grid-row-start: 5;
        z-index: 7;
        grid-template-columns: 50% 25% 25%;
        grid-template-rows: 100%;
        width: 96vw;
        height: 15vw;
        align-items: center;
        margin-left:auto;
        margin-right: auto;
        margin-top: 3vw;
        justify-content: center;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
    }
    
    .blogdeleteicon{
        display: block;
        position: relative;
        z-index: 7;
        width:  inherit;
        grid-column-start: 1;
        margin-top: auto;
        margin-bottom: auto;
        height: 7.5vw;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
        outline: none;
        border: none;
        background: transparent;
        background-repeat: no-repeat;
        background-size: contain;
        text-decoration: underline;
        text-align: center;
    }

    .blogDeleteConfirm{
        display: none;
        position: relative;
        z-index: 7;
        width: 30vw;
        height: 15;
        cursor: none;
        pointer-events: none;
        color: #ffffff;
        text-decoration: none;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        text-align: center;
    }
    .blogDeleteConfirmYes{
        display: none;
        width: 15vw;
        height: 15vw;
        outline: none;
        border: none;
        background: transparent;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../img//icons/tick.png");
        cursor: pointer;
        pointer-events: all;
    }
    
    .blogDeleteConfirmNo{
        display: none; 
        width: 15vw;
        height: 15vw;
        outline: none;
        border: none;
        background: transparent;
        background-repeat: no-repeat;
        background-size: contain;
        background-image: url("../img/icons/cross.png");
        cursor: pointer;
        pointer-events: all;
    }
    
    .blogTitle{
        display:block;
        position: relative;
        z-index: 6;
        width: 86vw;
        height: fit-content;
        text-align: center;
        grid-row-start: 1;
        grid-column-start: 1;
        margin-left: auto;
        margin-right: auto;
    }

    .blogChangeTitleBN{
        display: none;
        position: absolute;
        width: inherit;
        grid-row-start: 5;
        grid-column-start: 1;
        height: 8vw;
        padding-top: 3.5vw;
        padding-bottom: 3.5vw;
        top: 3vw;
        left: -5vw;
        padding-left: 5vw;
        padding-right: 5vw;
        z-index: 7;
        border: none;
        cursor: pointer;
        overflow: hidden;
        outline: none;
        background: #001a99;
        outline: 0.75vw solid #ffee02;
        background-image: none;
        text-decoration: underline;
    }
    
    .blogChangeTitleForm{
        display: none;
        grid-row-start: 1;
        grid-column-start: 1;
        position: relative;
        top:-1vw;
        width: 86vw;
        height: auto;
        grid-template-columns: 50% 50%;
        grid-template-rows: auto;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 2vw;
        justify-content: center;
        align-items: center;
    }
    
    .blogChangeTitleInput{
        display: block;
        position: relative;
        width: 86vw;
        height: fit-content;
        text-align: center;
        grid-column-start: 1;
        grid-column-end: 1;
        color: #000000;
        text-decoration: none;
        text-align: center;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
    }
    
    .blogChangeTitleSubmit{
        display: block;
        position: absolute;
        width: 15vw;
        grid-column-start: 1;
        grid-row-start: 2;
        height: 15vw;
        padding-top: 3.5vw;
        padding-bottom: 3.5vw;
        top: 3vw;
        padding-left: 5vw;
        padding-right: 5vw;
        z-index: 7;
        position: relative;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: none;
        cursor: pointer;
        overflow: hidden;
        outline: none;
        background-color: transparent;
        padding: 1vw;
        background-image: url("../img/icons/sendIcon.png");
        margin-left: auto;
        margin-right: auto;
    }
    
    .blogChangeTitleAbort{
        display: block;
        position: absolute;
        width: 15vw;
        grid-column-start: 2;
        grid-row-start: 2;
        height: 15vw;
        padding-top: 3.5vw;
        padding-bottom: 3.5vw;
        top: 3vw;
        padding-left: 5vw;
        padding-right: 5vw;
        z-index: 7;
        position: relative;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: none;
        cursor: pointer;
        overflow: hidden;
        outline: none;
        background-color: transparent;
        padding: 1vw;
        background-image: url("../img/icons/resetIcon.png");
        margin-left: auto;
        margin-right: auto;
    }

    .blogContent{
        display:block;
        position: relative;
        z-index: 6;
        width: 86vw;
        text-align: center;
        grid-row-start: 3;
        grid-column-start: 1;
        margin-left: auto;
        margin-right: auto;
    }

    .blogChangeContentBN{
        display: none;
        position: absolute;
        width: inherit;
        grid-row-start: 5;
        grid-column-start: 1;
        height: 8vw;
        padding-top: 3.5vw;
        padding-bottom: 3.5vw;
        top: 21vw;
        left: -5vw;
        padding-left: 5vw;
        padding-right: 5vw;
        text-decoration: underline;
        z-index: 7;
        border: none;
        cursor: pointer;
        overflow: hidden;
        outline: none;
        background: #001a99;
        outline: 0.75vw solid #ffee02;
        background-image: none;
    }
    
    .blogChangeContentForm{
        display: none;
        grid-row-start: 3;
        grid-column-start: 1;
        position: relative;
        top:-1vw;
        width: 86vw;
        height: auto;
        grid-template-columns: 50% 50%;
        grid-template-rows: auto;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 8vw;
        margin-top: 2vw;
        justify-content: center;
        align-items: center;
    }
    
    .blogChangeContentInput{
        display: block;
        position: relative;
        width: 86vw;
        text-align: center;
        grid-column-start: 1;
        grid-column-end: 1;
        color: #000000;
        text-decoration: none;
        text-align: center;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        white-space: pre-wrap;
    }
    
    .blogChangeContentSubmit{
        display: block;
        position: absolute;
        width: 15vw;
        grid-column-start: 1;
        grid-row-start: 2;
        height: 15vw;
        padding-top: 3.5vw;
        padding-bottom: 3.5vw;
        top: 3vw;
        padding-left: 5vw;
        padding-right: 5vw;
        z-index: 7;
        position: relative;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: none;
        cursor: pointer;
        overflow: hidden;
        outline: none;
        background-color: transparent;
        padding: 1vw;
        background-image: url("../img/icons/sendIcon.png");
        margin-left: auto;
        margin-right: auto;
    }

    .blogChangeContentAbort{
        display: block;
        position: absolute;
        width: 15vw;
        grid-column-start: 2;
        grid-row-start: 2;
        height: 15vw;
        padding-top: 3.5vw;
        padding-bottom: 3.5vw;
        top: 3vw;
        padding-left: 5vw;
        padding-right: 5vw;
        z-index: 7;
        position: relative;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: none;
        cursor: pointer;
        overflow: hidden;
        outline: none;
        background-color: transparent;
        padding: 1vw;
        background-image: url("../img/icons/resetIcon.png");
        margin-left: auto;
        margin-right: auto;
    }
    
    .blogEditImage{
        display: none;
        position: relative;
        width: 75vw;
        grid-column-start: 1;
        grid-column-end: 2;
        grid-row-start: 2;
        height: 8vw;
        padding-top: 3.5vw;
        padding-bottom: 3.5vw;
        padding-left: 5vw;
        padding-right: 5vw;
        z-index: 7;
        border: none;
        cursor: pointer;
        outline: none;
        background-color: #0000008a;
        background-image: none;
        text-decoration: underline;
        margin-left: auto;
        margin-right: auto;
  }

.updateImageForm{
    grid-row-start: 2;
    grid-column-start: 1;
    display:none;
    grid-gap: 0.5vw;
    width: 86vw;
    height: auto;
    position: relative;
    z-index: 8;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    margin-top: 3vw;
}

.changeBlogImageFileInput{
display: block;
grid-column-start: 1;
width: 80vw;
height: auto;
font-size: 5vw;
color: #ffffff;
padding-bottom:3vw;
padding-top: 3vw;
padding-right:3vw;
padding-left: 3vw;
margin-bottom: 2vw;
cursor: pointer;
background-color: #0000008a;
}

.changeBlogImageFileInput::-webkit-file-upload-button, .changeBlogImageFileInput::file-selector-button{
    width: 15vw;
    height: 15vw;
    background-color: transparent;
    background-image: url("../img//icons/imageFile.png");
    background-repeat: no-repeat;
    background-size:15vw;
    background-position: center;
    border: none;
    font-family: 'sarabunextrabold';
    color:#ffffff00;
    cursor: pointer;
}

.blogChangeImageSubmit{
    display: block;
    position: relative;    
    grid-row-start: 2;
    grid-column-start: 1;
    width: inherit;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-bottom: 2vw;
}

.blogDeleteImageSubmit{
    display: block;
    position: relative;    
    grid-row-start: 3;
    grid-column-start: 1;
    width: inherit;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-bottom: 2vw;
}


.blogAbortImageChange{
    display: block;
    position: relative;    
    grid-row-start: 4;
    grid-column-start: 1;
    width: inherit;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-bottom: 2vw;
    margin-top: 0vw;
}

#BlogFooter{
    display: block;
    position: relative;
    width: 42vw;
    height: 20vw;
    padding: 23vw;
    margin-left: auto;
    margin-right: auto;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    text-align: center;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: 6vw;
}


    /*
    ADD Blog Image
    ##################################
    */
    
    #addImageContainer_01, #addImageContainer_02, #addImageContainer_03, #addImageContainer_04, #addImageContainer_05, #addImageContainer_06, #addImageContainer_07, #addImageContainer_08, #addImageContainer_09, #addImageContainer_10{
        display: none;
        width: 97vw;
        height: 20vw;
        grid-template-columns: 20% 70% 10%;
        align-items: center;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        padding-left:1vw;
    }
    
    .BlogBildNR{
        display: block;
        width: 20vw;
        position: relative;
        grid-column-start: 1;
        font-size: 5vw;
        text-align: left;
        
    }
    
    .AddBlogImageInputField{
        display: block;
        width: 80vw;
        grid-column-start: 2;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
    }

    .AddBlogImageInputField::-webkit-file-upload-button, .AddBlogImageInputField::file-selector-button{
        width: 20vw;
        height: 20vw;
        background-color: transparent;
        background-image: url("../img//icons/imageFile.png");
        background-repeat: no-repeat;
        background-size:15vw;
        background-position: center;
        border: none;
        font-family: 'sarabunextrabold';
        color:#ffffff00;
    }
    
    #blogImage_01_Preview, #blogImage_02_Preview, #blogImage_03_Preview, #blogImage_04_Preview, #blogImage_05_Preview, #blogImage_06_Preview, #blogImage_07_Preview, #blogImage_08_Preview, #blogImage_09_Preview, #blogImage_10_Preview{
        display:none;
        z-index: 4;
        grid-row-start: 1;
        grid-column-start: 2;
        width: auto;
        height: auto;
        max-width: 36vw;
        max-height: 18vw;
        position: relative;
        align-items: center;
        z-index: 5;
        grid-column-start: 2;
        grid-template-rows: 1;    
    }
    
    .clearBlogimageBN{
        display: none;
        grid-row-start: 1;
        grid-column-start: 2;
        opacity: 100%;
        margin-top: auto;
        margin-bottom: auto;
        margin-left: auto;
        z-index: 5;
        left: -11.8vw;
        position: relative;  
        width: 18vw;
        height: 18vw;
        pointer-events: inherit;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        border: none;
        cursor: pointer;
        overflow: hidden; 
        outline: none;
        background-color: transparent;
        background-image: url("../img//icons/removeSignRotSemiTransparent.png");
    }
    
    .AddBlogImageBN{
    display: none;
    width: 18vw;
    height: 18vw;
    position: relative;
    left: -9vw;
    margin-left: auto;
    grid-row-start: 1;
    grid-column-start: 3;
    background-image: url("../img/icons/addFile.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
    
    
    #blogSubmitBN{
        display:block;
        position: relative;
        top: -10vw;
        margin-right: auto;
        width: 20vw;
        border: none;   
        cursor: pointer;
        height: 20vw;
        background-image: url("../img/icons/tick.png");
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 15vw;
    }

    #blogResetBN{
        display:block;
        position: relative;        
        top: -34vw;
        right: -24vw;
        margin-right: auto;
        width: 20vw;
        border: none;   
        cursor: pointer;
        height: 20vw;
        background-image: url("../img/icons/cross.png");
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 15vw;
    }
    
    #ShowInput_01{
        display:block;
        width: 100%;
        position: relative;
        top: -5vw;
        font-family: 'sarabunextrabold';
        font-size: 6vw;
        color: #ffffff;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        border: none;   
        text-align: center;
        cursor: pointer;
        height: 14vw;
        padding-top: 6vw;
    }

    #ShowInput_10{
        display: none;
        font-family: 'sarabunextrabold';
        font-size: 6vw;
        color: #ffffff;
    }
    
    #closeBlogForm{
        display:block ;
        width: 6vw;
        margin-left: auto;
        position: relative;
        font-family: 'sarabunextrabold';
        font-size: 1.2vw;
        color: #ffffff;
        background-color: #001a99;
        outline: 0.25vw solid #ffee02;
        border: none;   
        text-align: center;
        cursor: pointer;
        height: 1.8vw;
        padding: 0.5vw;
        top:1.2vw;
    }

    #blogButton{
        display: none;
        position: relative;
        grid-column-start: 1;
        grid-row-start: 3;
        z-index: 4;
        width: 96vw;
        height: auto;
        padding-top:5vw;
        padding-bottom:5vw;
        margin-top: 3vw;
        margin-left: 2vw;
        margin-right: auto;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
        text-align: center;
    }

        /*
    Termine Panel 
    ####################################
    */

    #termineMobilContainer{
        display: none;
        grid-row-start: 2;
        grid-column-start: 1;
    }

    #termineButton{
        display: none;
        position: relative;
        grid-column-start: 1;
        grid-row-start: 2;
        z-index: 4;
        width: 96vw;
        height: auto;
        padding-top:5vw;
        padding-bottom:5vw;
        margin-left: 2vw;
        margin-right: auto;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
        text-align: center;
    }

    #TerminEintragen{
        grid-row-start: 4;
        display: none;
        position: relative;
        z-index: 2;
        width: 95vw;
        height: 90vw;
        margin-top: 2vw;
        outline: 0.75vw solid #ffee02;
        background-color: #001a99;
        padding: 2vw;
    }

    #addDateForm{
        display: grid;
        position: relative;
        z-index: 3;
        width: inherit;
        height: auto;
        grid-template-columns: 33% 33% 33%;
        grid-template-rows: auto;
    }

    #addDate{
        display:block;
        width: 94vw;
        height: 12vw;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 1;
        margin-bottom: 4vw;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #000000;
    }

    #addPlace{
        display:block;
        width: 93.3vw;
        height: 12vw;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 2;
        margin-bottom: 4vw;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #000000;
    }

    #addReason{
        display:block;
        width: 93.3vw;
        height: 12vw;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 3;
        margin-bottom: 4vw;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #000000;
    }

    #addTime{
        display:block;
        width: 94vw;
        height: 12vw;
        grid-column-start: 1;
        grid-column-end: 4;
        grid-row-start: 4;
        margin-bottom: 4vw;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #000000;
    }

    #submitBN{
        display: block;
        position: absolute;
        grid-column-start: 1;
        grid-row-start: 5;
        width: 20vw;
        height: 20vw;
        margin-left: auto;
        margin-right: auto;
        background: transparent;
        border: none;
        background-image: url("../img/icons/tick.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }
    
    #resetBN{
        display: block;
        position: absolute;
        grid-column-start: 2;
        grid-row-start: 5;
        width: 20vw;
        height: 20vw;
        margin-left: auto;
        margin-right: auto;
        background: transparent;
        border: none;
        background-image: url("../img/icons/cross.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    #deleteDateBN{
        display: block;
        position: absolute;
        bottom: 3.5vw;
        left: 71vw;
        z-index: 10;
        width: 20vw;
        height: 20vw;
        margin-left: auto;
        margin-right: auto;
        background: transparent;
        border: none;
        background-image: url("../img/icons/deleteTermine.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    #dateAskForDelete{
        display: none;
        bottom: -110vw;
        left: 6vw;
        position: absolute;
        z-index: 5;
        width: 27vw;
        height: 27vw;
        text-align: center;
        font-family: 'sarabunextrabold';
        font-size: 6vw;
        color: #ffffff;
    }

    #selectAllDates{
        display: none;
        position: relative;
        grid-row-start: 4;
        grid-column-start: 1;
        width: 87vw;
        height: auto;
        font-family: 'sarabunextrabold';
        color: #ffffff;
        text-align: center;
        text-decoration: underline;
        font-size: 5vw;
        background-color: #0000008a;
        outline: none;
        border: none;
        padding-top: 6vw;
        padding-bottom: 6vw;
        margin-left: 5vw;
        margin-right: auto;
        margin-bottom: 7vw;
        margin-top: 0vw;
    }
    
    
    #deselectAllDates{
        display: none;
        position: relative;
        grid-row-start: 4;
        grid-column-start: 1;
        width: 87vw;
        height: auto;
        font-family: 'sarabunextrabold';
        color: #ffffff;
        text-align: center;
        text-decoration: underline;
        font-size: 5vw;
        background-color: #0000008a;
        outline: none;
        border: none;
        padding-top: 6vw;
        padding-bottom: 6vw;
        margin-left: 5vw;
        margin-right: auto;
        margin-bottom: 7vw;
        margin-top: 0vw;
    }

    #DeleteConfirm{
        display: none;
        position: absolute;
        bottom: -95vw;
        left: 40vw;
        width: 20vw;
        height:20vw;
        background: transparent;
        border: none;
        background-image: url("../img/icons/tick.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;

    }

    #deleteDateAbort{
        display: none;
        position: absolute;
        bottom: -101vw;
        left: 69vw;
        width: 20vw;
        height:20vw;
        background: transparent;
        border: none;
        background-image: url("../img/icons/cross.png");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    #terminePanel{
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: auto;
        position: relative;
        margin-top: 3vw;
        margin-bottom: 3vw;
        z-index: 3;
        width: 96vw;
        margin-left: 2.5vw;
        margin-right: auto;
        height: auto;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        padding-bottom: 3vw;
        grid-row-start: 3;
    }

    #TitelContainer{
        display:block;
        position: relative;
        width: 99vw;
        grid-row-start: 1;
        margin-left: auto;
        margin-right: auto;
    }

    #TermineHeadline{
        display: block;
        text-align: center;
        text-decoration: none;
        color: #ffffff;
        font-family: 'sarabunextrabold';
        font-size: 8vw;
    }

    #editbutton{
        display: none;
        position: relative;    
        grid-row-start: 4;
        grid-column-start: 1;
        width: 87vw;  
        height: auto;
        font-family: 'sarabunextrabold';
        color:#ffffff;
        text-align: center;
        text-decoration: underline;
        font-size: 5vw;
        background-color: #0000008a;
        outline: none;
        border: none;
        padding-top: 6vw;
        padding-bottom: 6vw;
        margin-left: 5vw;
        margin-right: auto;
        margin-bottom: 7vw;
        margin-top: 0vw;
    }

    #ChangeTermineForm{
        grid-row-start: 1;
        display: none;
        width: inherit;
        height: auto;
        position: relative;
        pointer-events: inherit;
        margin-left: auto;
        margin-right: auto;
        margin-top: 6vw;
        margin-bottom: 6vw
    }
    
    #terminBearbeitenInputFeld{
        grid-row-start: 1;
        grid-column-start: 1;
        display: block;
        width: 90vw;
        height: 14vw;
        text-align: center;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #000000;
        margin-left: 2.5vw;
        margin-right: auto;
    }
    
    #submitTermineTitleChange{
        display: block;
        width: 90vw;
        height: 8vw;
        grid-row-start: 2;
        grid-column-start: 1;
        pointer-events: inherit;
        text-decoration: underline;
        text-align: center;
        border: none;
        outline: none;
        background-color: #0000008a;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
        margin-left: auto;
        margin-right: auto;
        margin-top: 4vw;
        padding-top: 5vw;
        padding-bottom: 12vw;
    }
    
    #resetTermineTitleChange{
        display: block;
        width: 90vw;
        height: 8vw;
        grid-row-start: 3;
        text-decoration: underline;
        text-align: center;
        grid-column-start: 1;
        pointer-events: inherit;
        border: none;
        outline: none;
        background-color: #0000008a;
        font-family: 'sarabunextrabold';
        font-size: 5vw;
        color: #ffffff;
        margin-left: auto;
        margin-right: auto;
        margin-top: 4vw;
        padding-top: 5vw;
        padding-bottom: 4vw;;
    }

    .Termin{
        display: grid;
        z-index: 3;
        margin-left: 0vw;
        top:-10vw;
        position: relative;
        width: 96vw;
        height: fit-content;
        font-family: 'sarabunextrabold';
        color: #ffffff;
        font-size: 6vw;
        align-items: center;
        grid-template-columns: 2vw 25vw 69vw;
        text-align: center;
        margin-bottom: 5vw;
        pointer-events: none;
    }

    .nextAppointment {
        color: #ffee02;
        text-decoration:underline dotted;
    }

    .DeleteBN{
        display: none;
        width: 12vw;
        height: 12vw;
        position: absolute;
        left: -4vw;
        top: 1.2vw;
        pointer-events: all;
    }

    .hiddenID{
        display: block;
        position: relative;
        width: 1.5vw;
        height: 1.5vw;
        grid-column-start: 1;
        grid-row-start: 1;
        text-align: left;
    }
    
    .TerminDate{
        display: block;
        position: relative;
        grid-column-start: 2;
        grid-row-start: 1;
        text-align: center;
    }
    
    .TerminPlace{
        display: block;
        position: relative;
        grid-column-start: 2;
        grid-column-end: 4;
        grid-row-start: 2;
        text-align: left;
    }
    
    .TerminReason{
        display: block;
        position: relative;
        grid-column-start: 2;
        grid-column-end: 4;
        grid-row-start: 3;
        text-align: left;
    }
    
    .TerminTime{
        display: block;
        position: relative;
        grid-column-start: 3;
        grid-row-start: 1;
        text-align: left;
        margin-left: 10vw;
    }

    /*
    Index Sidebar    
    ####################################
    */

    #Indexsidebar{
        display: none;
        grid-template-columns: 25% 25% 25% 25%;
        grid-template-rows: 100%;
        grid-gap: 3vw;
        position: absolute;
        width: 83vw;
        height: 0vw;
        z-index: 2;
        grid-column-start: 2;
        margin-left: -71vw;
        margin-right: auto;
    }

    #facebookLink{
        grid-column-start: 4;
        display: block;
        width: 15vw;
        height: 15vw;
        position: absolute;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        z-index: 4;
        background-image: url("../img/icons/facebook.png");
        background-repeat: no-repeat;
        background-size: 15vw;
        background-position: center;
        padding: 1vw;
    }
    
    #instagramLink{
        grid-column-start: 3;
        display: block;
        width: 15vw;
        height: 15vw;
        position: absolute;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        z-index: 4;
        background-image: url("../img/icons/instagram.png");
        background-repeat: no-repeat;
        background-size: 15vw;
        background-position: center;
        padding: 1vw;
    }

    #AnfragenContainer{
        grid-column-start: 1;
        display: block;
        width: 15vw;
        height: 15vw;
        position: absolute;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        z-index: 4;
        background-image: url("../img/icons/mail.png");
        background-repeat: no-repeat;
        background-size: 15vw;
        background-position: center;
        padding: 1vw;
    }

    #ButtonAnfrage{
        display: block;
        position: absolute;
        width: inherit;
        height: inherit;
    }

    #MitgliedContainer{
        grid-column-start: 2;
        display: block;
        width: 15vw;
        height: 15vw;
        position: absolute;
        background-color: #001a99;
        outline: 0.75vw solid #ffee02;
        z-index: 4;
        background-image: url("../img/icons/mitglied.png");
        background-repeat: no-repeat;
        background-size: 15vw;
        background-position: center;
        padding: 1vw;
    }

    #ButtonMitglied{
        display: block;
        position: absolute;
        width: inherit;
        height: inherit;
    }


/*
##################################
	Unser Verein
##################################
*/

#UnserVereinMain{
    z-index: 3;
    display:grid;
    position: relative;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    width: 98vw;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
}

#UnserVereinSidebar{
    z-index: 3;
    display: block;
    position: relative;
    grid-row-start: 1;
    width: inherit;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

#UnserVereinLinks{
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: 33% 33% 33%;
    width: inherit;
    height: 64vw;
    position: relative;
    grid-column-start: 1;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 7vw;
    text-align: center;
    justify-content: center;
    align-items: center;
}

#geschichteButton{
    display: block;
    position: relative;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    grid-row-start: 1;
    z-index: 3;
    width: 80vw;
    height: 5vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #001a99;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    outline: 0.75vw solid #ffee02;
}

#vorstandButton{
    display: block;
    position: relative;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    grid-row-start: 2;
    z-index: 3;
    width: 80vw;
    height: 5vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #001a99;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    outline: 0.75vw solid #ffee02;
}

#mitgliederButton{
    display: block;
    position: relative;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    grid-row-start: 3;
    z-index: 3;
    width: 80vw;
    height: 5vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #001a99;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    outline: 0.75vw solid #ffee02;
}

#Vereinsinhalte{
    display: grid;
    position: relative;
    top:0.5vw;
}


/*
Vereinsgeschichte 
############################################################
*/

#Vereinsgeschichte{
    display: grid;
    grid-template-columns: 100%;
    position: relative;
    width: 98vw;
    height: auto;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 7vw;
    padding-bottom: 1.3vw;
    align-items: baseline;
}

#vereinsgeschichteUeberschrift{
    display: block;
    grid-row-start: 1;
    grid-column-start: 1;
    position: relative;
    z-index: 4;
    width: inherit;
    height: auto;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    text-align: center;
    text-decoration: none; 
    margin-left: auto;
    margin-right: auto;   
}

#vereinsgeschichteEditTitleBN{
    display: none;
    position: relative;    
    grid-row-start: 4;
    grid-column-start: 1;
    width: 87vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}

#vereinsgeschichteChangeTitleForm{
    grid-row-start: 1;
    display: none;
    width: inherit;
    height: auto;
    position: relative;
    z-index: 5;
    pointer-events: inherit;
    margin-left: auto;
    margin-right: auto;
    margin-top: 6vw;
    margin-bottom: 6vw
}

#vereinsgeschichteChangeTitleInput{
    grid-row-start: 1;
    grid-column-start: 1;
    display: block;
    position: relative;
    z-index: 5;
    width: 90vw;
    height: 14vw;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #000000;
    margin-left: 2.5vw;
    margin-right: auto;
}

#vereinsgeschichteChangeTitelSubmit{
    display: block;
    width: 90vw;
    height: 8vw;
    grid-row-start: 2;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#vereinsgeschichteAbortChangeTitel{
    display: block;
    width: 90vw;
    height: 8vw;
    grid-row-start: 3;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#vereinsgeschichteTextblock{
    display: none;
    grid-row-start: 2;
    grid-column-start: 1;
    position: relative;
    z-index: 4;
    width: 80vw;
    height: auto;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    line-height: 1.2;
    white-space: pre-wrap;
    color: #ffffff;
    text-align: center;
    text-decoration: none; 
    margin-left: auto;
    margin-right: auto;   
}

#vereinsgeschichteEditTextblockBN{
    display: none;
    position: relative;    
    grid-row-start: 5;
    grid-column-start: 1;
    width: 87vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}

#vereinsgeschichteChangeTextblockForm{
    display: none;
    grid-row-start: 3;
    grid-column-start: 1;
    position: relative;
    top:-1vw;
    width: 86vw;
    height: auto;
    grid-template-columns: 50% 50%;
    grid-template-rows: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 8vw;
    margin-top: 2vw;
    justify-content: center;
    align-items: center;
}

#vereinsgeschichteChangeTextblockInput{
    display: block;
    position: relative;
    width: 86vw;
    text-align: center;
    grid-column-start: 1;
    grid-column-end: 1;
    color: #000000;
    text-decoration: none;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    white-space: pre-wrap;
}

#vereinsgeschichteChangeTextblockSubmit{
    display: block;
    width: inherit;
    height: 8vw;
    grid-row-start: 2;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#vereinsgeschichteAbortChangeTextblock{
    display: block;
    width: inherit;
    height: 8vw;
    grid-row-start: 3;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

/*
Vorstandsblock
#########################################
*/

#vorstand{
    display: none;
    position: relative;
    grid-template-columns: 50% 50%;
    width: 96vw;
    height: auto;
    grid-column-start: 2;
    grid-row-start: 2;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: auto;
    margin-right: auto;
    align-items: baseline;
    padding-bottom: 7vw;
    margin-bottom: 7vw;
}

/*
Vorstand Titel
*/

#vorstandUeberschrift{
    display:block;
    width: 100%;
    height: auto;
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    text-decoration: none;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 7vw;
    margin-bottom:7vw;
    padding-top: 1vw;
    padding-bottom: 1vw;
}

#vorstandEditTitleBN{
    display: none;
    position: relative;    
    grid-row-start: 1;
    grid-column-start: 1;
    width: 87vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 20vw;
    margin-top: 0vw;
    top: 17vw;
}

#vorstandChangeTitleForm{
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    display: none;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    align-content: center;
    justify-content: center;
    width: inherit;
    height:auto;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 7vw;
    margin-bottom: 7vw;
    grid-gap:0.5vw;
    padding-top: 1vw;

}

#vorstandChangeTitleInput{
    display: block;
    position: relative;
    grid-column-start: 1;
    grid-row-start: 1;
    width: 90vw;
    height: 15vw;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    margin-left: auto;
    margin-right: auto;
}

#vorstandChangeTitelSubmit{
    display: block;
    width: 90vw;
    height: 8vw;
    grid-row-start: 2;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#vorstandAbortChangeTitel{
    display: block;
    width: 90vw;
    height: 8vw;
    grid-row-start: 3;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

/*
Vorstand Textblock Links
*/

#vorstandTextblockLinks{
    grid-column-start: 1;
    grid-row-start: 3;
    display: block;
    position:relative;
    z-index: 7;
    width: 42vw;
    height:auto;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-bottom: auto;
    margin-left:auto;
    margin-right: auto;
    white-space: pre-wrap;
}

#vorstandEditTextblockLinksBN{
    display: none;
    position: relative;    
    grid-row-start: 3;
    grid-column-start: 1;
    width: 36vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-top: 105vw;
}

#vorstandChangeTextblockLinksForm{
    display: none;
    grid-column-start: 1;
    grid-row-start: 3;
    grid-template-rows: auto;
    position: relative;
    z-index: 8;
    width: 42vw;
    height:auto;
    margin-left:auto;
    margin-right:auto;
    margin-bottom: auto;
}

#vorstandChangeTextblockLinksInput{
    display: block;
    position: relative;
    width: 42vw;
    text-align: center;
    grid-column-start: 1;
    grid-column-end: 1;
    color: #000000;
    text-decoration: none;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    white-space: pre-wrap;
}

#vorstandChangeTextblockLinksSubmit{
    display: block;
    width: inherit;
    height: 8vw;
    grid-row-start: 2;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#vorstandAbortChangeTextblockLinks{
    display: block;
    width: inherit;
    height: 8vw;
    grid-row-start: 3;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

/*
Vorstand Textblock Rechts
*/

#vorstandTextblockRechts{
    grid-column-start: 2;
    grid-row-start: 3;
    display: block;
    position:relative;
    z-index: 7;
    width: 42vw;
    height:auto;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-bottom: auto;
    margin-left:auto;
    margin-right: auto;
    white-space: pre-wrap;
}

#vorstandEditTextblockRechtsBN{
    display: none;
    position: relative;    
    grid-row-start: 3;
    grid-column-start: 2;
    width: 36vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-top: 105vw;
}

#vorstandChangeTextblockRechtsForm{
    display: none;
    grid-column-start: 2;
    grid-row-start: 3;
    grid-template-rows: auto;
    position: relative;
    z-index: 8;
    width: 42vw;
    height:auto;
    margin-left:auto;
    margin-right:auto;
    margin-bottom: auto;
}

#vorstandChangeTextblockRechtsInput{
    display: block;
    position: relative;
    width: 42vw;
    text-align: center;
    grid-column-start: 1;
    grid-column-end: 1;
    color: #000000;
    text-decoration: none;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    white-space: pre-wrap;
}

#vorstandChangeTextblockRechtsSubmit{
    display: block;
    width: inherit;
    height: 8vw;
    grid-row-start: 2;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#vorstandAbortChangeTextblockRechts{
    display: block;
    width: inherit;
    height: 8vw;
    grid-row-start: 3;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

/*
Vorstand Bild
*/

#vorstandImage{
    display: block;
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 2;
    width: 95%;
    margin-left: auto;
    margin-right: auto;
    height: auto;
    position: relative;
    z-index: 7;
    cursor: url('../img//icons/zoomIn.png'), zoom-in;
}

#vorstandImageEditBN{
    display: none;
    position: relative;    
    grid-row-start: 2;
    grid-column-start: 1;
    width: 87vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 20vw;
    margin-top: 0vw;
    top: 17vw;
}

#vorstandChangeImageForm{
    grid-row-start: 2;
    grid-column-start: 1;
    grid-column-end: 3;
    display:none;
    grid-gap: 0.5vw;
    width: 86vw;
    height: auto;
    position: relative;
    top: 15vw;
    z-index: 8;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 20vw;
}

#vorstandChangeImageNewImageName{
    display: block;
    grid-column-start: 1;
    width: 80vw;
    height: auto;
    font-size: 5vw;
    color: #ffffff;
    padding-bottom:3vw;
    padding-top: 3vw;
    padding-right:3vw;
    padding-left: 3vw;
    margin-bottom: 2vw;
    cursor: pointer;
    background-color: #0000008a;
}
    
#vorstandChangeImageNewImageName::-webkit-file-upload-button, #vorstandChangeImageNewImageName::file-selector-button{
    width: 15vw;
    height: 15vw;
    background-color: transparent;
    background-image: url("../img//icons/imageFile.png");
    background-repeat: no-repeat;
    background-size:15vw;
    background-position: center;
    border: none;
    font-family: 'sarabunextrabold';
    color:#ffffff00;
    cursor: pointer;
}

#vorstandChangeImageSubmit{
    display: block;
    position: relative;    
    grid-row-start: 2;
    grid-column-start: 1;
    width: inherit;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-bottom: 2vw;
}

#vorstandDeleteImageSubmit{
    display: block;
    position: relative;    
    grid-row-start: 3;
    grid-column-start: 1;
    width: inherit;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-bottom: 2vw;
}

#vorstandAbortImageChange{
    display: block;
    position: relative;    
    grid-row-start: 4;
    grid-column-start: 1;
    width: inherit;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-decoration: underline;
    text-align: center;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-bottom: 2vw;
    margin-top: 0vw;
}


/*
Mitglied Hinzufügen
############################################################
*/


#mitgliedHinzufuegen{
    display: none;
    position: relative;
    width: 96vw;
    height: 20vw;
    grid-column-start: 1;
    grid-row-start: 1;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-bottom: 5vw;
    margin-top: 5vw;
    padding-top: 4vw;
    padding-bottom: 0vw;
    margin-left: auto;
    margin-right: auto;
    align-items: center;

}

#addNewMitgliedText1{
    display: block;
    position: relative;
    width: inherit;
    text-align: center;
    font-family: 'sarabunextrabold';
    text-decoration: underline;
    font-size: 7vw;;
    color:#ffffff;
    top:-2.4vw;
    cursor: pointer;
}

#addNewMitgliedText2{
    display: none;
    position: relative;
    width: inherit;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    text-decoration: none;
    color:#ffffff;
    top:-1vw;
}

#newMitgliedForm{
    display: none;
    align-items: center;
    grid-gap:2vw;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    width: inherit;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

.newMitgliedTextinput{
    grid-column-start: 1;
    display: inline-block;
    position: relative;
    width: 86vw;
    height: 20vw;
    font-family: 'sarabunextrabold';
    font-size: 7vw;;
    color:#000000;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

#addNewMitgliedImage{
    width: 80vw;
    height: auto;
    align-items: center;
    margin-left: 5vw;
    display: grid;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color:#ffffff;
    grid-column-start: 1;
    grid-row-start: 8;
}

#newMitgliedImage{
    display: inline-block;
    font-family: 'sarabunextrabold';
    font-size: 5vw;;
    color:#ffffff;
    grid-column-start: 1;
    width:inherit;
    height: auto;
    cursor: pointer;
}

#newMitgliedImage::-webkit-file-upload-button, #newMitgliedImage::file-selector-button{
    width: 15vw;
    height: 25vw; 
    background-color: transparent;
    background-image: url("../img//icons/imageFile.png");
    background-repeat: no-repeat;
    background-size:contain;
    background-position: center;
    border: none;
    font-family: 'sarabunextrabold';
    color:#ffffff00;
    grid-column-start: 1;
}

#newMitgliedImage_Preview{
    display:none;
    z-index: 4;
    grid-row-start: 9;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    position: relative;
    align-items: center;
    z-index: 5;
    padding-top: 1vw;
    padding-bottom: 1vw;
    margin-left: auto;
    margin-right: auto;

}

#clearNewMitgliedImageInputBN{
    display: none;
    position: relative;    
    grid-row-start: 10;
    grid-column-start: 1;
    width: 86vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}

#addNewMitgliedStatus{
    display: block;
    width: 50vw;
    text-align: center;
    margin-left: 5vw;
    height: auto;
    grid-row-start: 5;
    grid-column-start: 1;
    font-family: 'sarabunextrabold';
    font-size: 7vw;;
    color:#ffffff;

}

.newMitgliedStatusAktiv{
    display: block;
    width: 50vw;
    position: relative;
    margin-top: auto;
    margin-bottom: auto;
    grid-row-start: 6;
    grid-column-start: 1;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color:#ffffff;
    margin-left: 5vw;
}

#newMitgliedStatusAktiv{
    display: inline-block;
    position: relative;
    left: 40vw;
    top: 5vw;
    width: 15vw;
    height: 15vw;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
}

.newMitgliedStatusPassiv{
    display: block;
    width: 50vw;
    position: relative;
    grid-row-start: 7;
    grid-column-start: 1;
    font-family: 'sarabunextrabold';
    font-size: 7vw;;
    color:#ffffff;
    margin-left: 5vw;
}

#newMitgliedStatusPassiv{
    display: inline-block;
    position: relative;
    left: 38vw;
    top: 5vw;
    width: 15vw;
    height: 15vw;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    cursor: pointer;
}

#newMitgliedSubmit{
    display: block;
    position: relative;    
    grid-row-start: 11;
    grid-column-start: 1;
    width: 86vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}

#newMitgliedReset{
    display: block;
    position: relative;    
    grid-row-start: 12;
    grid-column-start: 1;
    width: 86vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}


/*
Mitglieder Text Panel
############################################################
*/

#mitgliederFliesstextblock{
    display: none;
    grid-template-columns: 100%;
    position: relative;
    grid-template-rows: auto;
    width: 96vw;
    left: auto;
    height: auto;
    grid-column-start: 1;
    grid-row-start: 2;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5vw;
    padding-bottom: 2vw;
    align-items: baseline;
}

#mitgliedUeberschrift{
    display: block;
    grid-row-start: 1;
    grid-column-start: 1;
    position: relative;
    z-index: 4;
    width: 80vw;
    height: auto;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    text-align: center;
    text-decoration: none; 
    margin-left: auto;
    margin-right: auto;   
}

#mitgliedEditTitleBN{
    display: none;
    position: relative;    
    grid-row-start: 4;
    grid-column-start: 1;
    width: 87vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}

#mitgliedChangeTitleForm{
    grid-row-start: 1;
    display: none;
    width: inherit;
    height: auto;
    position: relative;
    z-index: 5;
    pointer-events: inherit;
    margin-left: auto;
    margin-right: auto;
    margin-top: 6vw;
    margin-bottom: 6vw
}

#mitgliedChangeTitleInput{
    grid-row-start: 1;
    grid-column-start: 1;
    display: block;
    position: relative;
    z-index: 5;
    width: 90vw;
    height: 14vw;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #000000;
    margin-left: 2.5vw;
    margin-right: auto;
}

#mitgliedChangeTitelSubmit{
    display: block;
    width: 90vw;
    height: 8vw;
    grid-row-start: 2;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#mitgliedAbortChangeTitel{
    display: block;
    width: 90vw;
    height: 8vw;
    grid-row-start: 3;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#mitgliedTextblock{
    display: none;
    grid-row-start: 2;
    grid-column-start: 1;
    position: relative;
    z-index: 4;
    width: 80vw;
    height: auto;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    line-height: 1.2;
    white-space: pre-wrap;
    color: #ffffff;
    text-align: center;
    text-decoration: none; 
    margin-left: auto;
    margin-right: auto;   
}

#mitgliedEditTextblockBN{
    display: none;
    position: relative;    
    grid-row-start: 5;
    grid-column-start: 1;
    width: 87vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}

#mitgliedChangeTextblockForm{
    display: none;
    grid-row-start: 3;
    grid-column-start: 1;
    position: relative;
    top:-1vw;
    width: 86vw;
    height: auto;
    grid-template-columns: 50% 50%;
    grid-template-rows: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 8vw;
    margin-top: 2vw;
    justify-content: center;
    align-items: center;
}

#mitgliedChangeTextblockInput{
    display: block;
    position: relative;
    width: 86vw;
    text-align: center;
    grid-column-start: 1;
    grid-column-end: 1;
    color: #000000;
    text-decoration: none;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    white-space: pre-wrap;
}

#mitgliedChangeTextblockSubmit{
    display: block;
    width: 90vw;
    height: 8vw;
    grid-row-start: 2;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

#mitgliedAbortChangeTextblock{
    display: block;
    width: 90vw;
    height: 8vw;
    grid-row-start: 3;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 5vw;
    padding-bottom: 12vw;
}

/*
Mitglieder Auflistung
*/

#Mitglieder{
    display:none;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    grid-column-start: 1;
    grid-template-columns: 100%;
    grid-gap: 2vw;
    grid-template-rows: auto;
    width: 96vw;
    height: auto;
}


#mitgliederSortingForm{
    display: none;
    grid-template-rows: auto;
    grid-template-columns: 50% 50%;
    position: relative;
    grid-row-start: 4;
    grid-column-start: 1;
    width: 94vw;
    height: 36vw;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-bottom: 6vw;
    padding-left: 2vw;
    margin-left: auto;
    margin-right: auto;
    font-family: 'sarabunextrabold';
    font-size: 6vw;
    color: #ffffff;
    padding-top: 6vw;
    padding-bottom: 6vw;
    align-items: center;
}

#sort_option{
    text-align: center;
    display: block;
    width: 86vw;
    height: 15vw;
    grid-column-start: 1;
    grid-row-start: 2;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 6vw;
    color: #ffffff;
    border: none;
    cursor: pointer;
    text-decoration: underline;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
}


#mitgliederCount{
    display: block;
    width: 86vw;
    grid-column-start: 1;
    grid-row-start: 3;
}

.mitgliederSortoption{
    background-color: transparent;
    font-size: 10vw;
    
}

.mitgliedsblock{
    z-index: 3;
    display:grid;
    grid-template-columns: 100%;
    grid-template-rows: 100%;
    position: relative;
    width: 86vw;
    padding-top:5vw;
    padding-left:5vw;
    padding-right:5vw;
    padding-bottom: 5vw;
    margin-bottom: 5vw;
    height: fit-content;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: auto;
    margin-right: auto 
}

.mitgliedContainer{
    display: grid;
    width: 100%;
    height: inherit;
    opacity: 100%;
    grid-row-start: 1;
    grid-column-start: 1;
    grid-template-columns: auto;
    grid-template-rows: auto;
    position: relative;
    z-index: 3;
    align-items: center;
    align-items: center;

}

.mitgliedsBild{
    z-index: 3;
    display: block;
    position: relative;
    grid-column-start: 1;
    grid-row-start: 1;
    opacity: 100%;
    width: auto;
    height: auto;
    max-width: 86vw;
    max-height: 86vw;
    margin-left: auto;
    margin-right: auto;
}

.mitgliedsName{
    display: block;
    position: relative;
    grid-column-start: 1;
    grid-row-start: 2;
    width: inherit;
    height: 6vw;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    text-align: center;

}

.mitgliedsInstrument{
    display: block;
    position: relative;
    grid-column-start: 1;
    grid-row-start: 3;
    width: inherit;
    height: 6vw;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    text-align: center;

}

.mitgliedsPosition{
    display: block;
    position: relative;
    grid-column-start: 1;
    grid-row-start: 5;
    width: inherit;
    height: 6vw;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    text-align: center;
}

.mitgliedsStatus{
    display: block;
    width: inherit;
    position: relative;
    grid-column-start: 1;
    grid-row-start: 4;
    height: 6vw;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    text-align: center;
}

.showChangeMitgliedForm{
    display: none;
    position: relative; 
    margin-top: -17vw;
    margin-bottom: 20vw;
    top: -5vw;
    grid-row-start: 2;
    grid-column-start: 1;
    width: 86vw;  
    height: 10vw;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
}

.changeMitgliedPanelForm{
    display: none;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    grid-row-start: 1;
    grid-column-start: 1;
    position: relative;
    z-index: 6;
    align-items: center;
    justify-content: center;
    grid-gap:2vw;
    width: inherit  ;
    height: 100%;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

.changeMitgliedImageContainer{
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 1;
    grid-row-end: 1;    
    width:fit-content;
    margin-left: auto;
    margin-right: auto;
}


.changeMitgliedImage{
    display: none;
    width: 80vw;
    height: 15vw;
    position: relative;
    z-index: 7;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    cursor: pointer;
    padding-top: 20vw;
    padding-bottom: 20vw;
}

.changeMitgliedImage::-webkit-file-upload-button, .changeMitgliedImage::file-selector-button{
    width: 15vw;
    height: 15vw;
    background-color: transparent;
    background-image: url("../img//icons/imageFile.png");
    background-repeat: no-repeat;
    background-size:contain;
    background-position: center;
    border: none;
    font-family: 'sarabunextrabold';
    color:#ffffff00;
    cursor: pointer;
}

.changeMitgliedImage_Preview{
    display:flex;
    position: relative;
    z-index: 7;
    max-width: 80vw;
    height: auto;
    max-height: 80vw;
    margin-left:auto;
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
}

.clearChangeMitgliedImageInputBN{
    display: block;
    position: relative;    
    grid-row-start: 4;
    grid-column-start: 1;
    width: 80vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 2vw;
}


.changeMitgliedTextVorname{
    display:block;
    width: 86vw;
    height: 15vw;
    grid-row-start: 2;
    grid-column-start:1;
    position: relative;
    font-family: 'sarabunextrabold';
    color: #000000;
    font-size: 7vw;
    text-align: center;
}

.changeMitgliedTextNachname{
    display:block;
    width: 86vw;
    height: 15vw;
    grid-row-start: 3;
    grid-column-start:1;
    position: relative;
    font-family: 'sarabunextrabold';
    color: #000000;
    font-size: 7vw;
    text-align: center;
}

.changeMitgliedTextInstrument{
    display:block;
    width: 86vw;
    height: 15vw;
    grid-row-start: 4;
    grid-column-start:1;
    position: relative;
    font-family: 'sarabunextrabold';
    color: #000000;
    font-size: 7vw;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.changeMitgliedTextPosition{
    display:block;
    width: 86vw;
    height: 15vw;
    grid-row-start: 5;
    grid-column-start:1;
    position: relative;
    font-family: 'sarabunextrabold';
    color: #000000;
    font-size: 7vw;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.changeMitgliedStatusAktiv{
    display: block;
    position: relative;
    width: 86vw;
    height: auto;
    z-index: 8;
    grid-row-start: 6;
    grid-column-start: 1;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    font-size: 15vw;
}

.changeMitgliedStatusAktivCheckbox{
    display: flex;
    z-index: 8;
    position: relative;
    width: 18vw;
    height: 18vw;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    top: -18vw;
    margin-left:auto;
}

.changeMitgliedStatusPassivCheckbox{
    display: flex;
    position: relative;
    z-index: 8;
    width: 18vw;
    height: 18vw;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    top: -18vw;
    margin-left:auto;
}

.changeMitgliedStatusPassiv{
    display: block;
    position: relative;
    width: 86vw;
    height: auto;
    z-index: 8;
    grid-row-start: 6;
    grid-column-start: 1;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    font-size: 15vw;
    top: 30vw;
}

.changeMitgliedSubmit{
    display: block;
    position: relative;    
    grid-row-start: 7;
    grid-column-start: 1;
    width: 80vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vw;
}

.changeMitgliedReset{
    display: block;
    position: relative;    
    grid-row-start: 8;
    grid-column-start: 1;
    width: 80vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vw;
}

.showDeleteMitgliedForm{
    display: block;
    position: relative;    
    grid-row-start: 9;
    grid-column-start: 1;
    width: 80vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vw;
}

.deleteMitgliedForm{
    grid-row-start: 1;
    grid-column-start: 1;
    display: none;
    grid-template-columns: 100%;
    grid-template-rows: 100% ;
    margin-top: 100vw;
    margin-bottom: 100vw;
    width: 80vw;
    height: auto;
    position: relative;
    z-index: 10;
    margin-left: auto;
    margin-right: auto; 
}

.askDeleteMitgliedConfirm{
    display: block;
    grid-row-start: 1;
    grid-column-start: 1;
    margin-top: auto;
    margin-bottom: auto;
    width: inherit;
    height: auto;
    position: relative;
    z-index: 10;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    font-size: 14vw;
    text-align: center;
}

.deleteMitgliedConfirm{
    display: block;
    position: relative;    
    grid-row-start: 2;
    grid-column-start: 1;
    width: 80vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vw;
}

.deleteMitgliedAbort{
    display: block;
    position: relative;    
    grid-row-start: 3;
    grid-column-start: 1;
    width: 80vw;  
    height: auto;
    font-family: 'sarabunextrabold';
    color:#ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vw;
}

/*
##################################
	Kontakt
##################################
*/

#kontakteMain{
    z-index: 3;
    display: grid;
    position: relative;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    width: 94vw;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    left:-1vw;
}

#KontaktLinks{
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: 33% 33% 33%;
    width: 96vw;
    height: 64vw;
    position: relative;
    grid-column-start: 1;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 8vw;
    text-align: center;
    justify-content: center;
    align-items: center;
}

#BuchenButton{
    display: block;
    position: relative;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    grid-row-start: 1;
    z-index: 3;
    width: 80vw;
    height: 5vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #001a99;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    outline: 0.75vw solid #ffee02;
}

#AnfahrtButton{
    display: block;
    position: relative;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    grid-row-start: 2;
    z-index: 3;
    width: 80vw;
    height: 5vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #001a99;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    outline: 0.75vw solid #ffee02;
}

#MitgliedButton{
    display: block;
    position: relative;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    grid-row-start: 3;
    z-index: 3;
    width: 80vw;
    height: 5vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #001a99;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    outline: 0.75vw solid #ffee02;
}

#inhalt_buchen{
    z-index: 3;
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    position: relative;
    grid-row-start: 4;
    grid-column-start: 1;
    width: inherit;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    align-items: center;
    justify-content:end;
    margin-bottom: 4vw;
}

#Kontakt_01{
    display: grid;
    grid-template-columns: 100%;
    position: relative;
    width: 96vw;
    left: 1vw;
    height: auto;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 7vw;
    padding-bottom: 1.3vw;
    align-items: baseline;
}

#kontaktdaten{
    display: none;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    white-space: pre-wrap;
    width: 86vw;
    height: inherit;
    padding: 4vw;
    position: relative;
    z-index: 5;
    grid-row-start: 1;
    grid-column-start: 1;

}

#kontaktdatenEditTextblockBN{
    display: none;
    position: relative;
    grid-row-start: 5;
    grid-column-start: 1;
    width: 87vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: 5vw;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}

#kontaktdatenChangeTextblockForm{
    display: none;
    grid-template-columns: 100%;
    grid-row-start: 1;
    grid-column-start: 1;
    position: relative;
    z-index: 5;
    width: 86vw;
    height: auto;
    position: relative;
    margin-top: 4vw;
    margin-bottom: auto;
    margin-left: auto;
    margin-right: auto;
    grid-gap:0.5vw;
}

#kontaktdatenChangeTextblockInput{
    display: block;
    grid-column-start: 1;
    grid-row-start: 1;
    width: inherit;
    height: auto;
    resize: none;
    text-align: left;
    margin-right: auto;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    white-space: pre-wrap;
    line-height: 1.2;
    color: #000000;
}

#kontaktdatenChangeTextblockSubmit{
    display: block;
    position: relative;
    grid-row-start: 2;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4vw;
    margin-top: 4vw;
}

#kontaktdatenAbortChangeTextblock{
    display: block;
    position: relative;
    grid-row-start: 3;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4vw;
}

#Kontakt_02{
    display: grid;
    grid-template-columns: 100%;
    position: relative;
    width: 96vw;
    left: 1vw;
    height: auto;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 7vw;
    padding-bottom: 1.3vw;
    align-items: baseline;
}

#AnfrageFormular{
    display: grid;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2vw;
    margin-bottom: auto;
    grid-template-columns: 100%;
    grid-gap: 0.5vw;
    width: 86vw;
    height: auto;
}
#AnfrageName{
    display:block;
    position: relative;
    grid-row-start: 1;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #000000;
    width: inherit;
    height:auto;
    padding-top: 5vw;
    padding-bottom: 5vw;
    margin-top: 2vw;

}

#AnfrageEmail{
    display:block;
    position: relative;
    grid-row-start: 2;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #000000;
    width: inherit;
    height:auto;
    padding-top: 5vw;
    padding-bottom: 5vw;
    margin-top: 2vw;
}

#AnfrageBetreff{
    display:block;
    position: relative;
    grid-row-start: 3;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #000000;
    width: inherit;
    height:auto;
    padding-top: 5vw;
    padding-bottom: 5vw;
    margin-top: 2vw;
}

#AnfragenText{
    display:block;
    position: relative;
    grid-row-start: 4;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #000000;
    width: inherit;
    min-height:30vw;
    margin-top: 2vw;
}

#AnfrageSendenButton{
    display: block;
    width: inherit;
    height: 5vw;
    grid-row-start: 5;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4vw;
    padding-top: 8vw;
    padding-bottom: 12vw;
}

#AnfrageAbbrechenButton{
    display: block;
    width: inherit;
    height: 5vw;
    grid-row-start: 6;
    grid-column-start: 1;
    pointer-events: inherit;
    text-decoration: underline;
    text-align: center;
    border: none;
    outline: none;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4vw;
    margin-top: 4vw;
    padding-top: 8vw;
    padding-bottom: 12vw;
}

#AnfrageSuccess{
    display: block;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: auto;
    height: auto;
    padding-top: 6.4vw;
    padding-bottom: 6.4vw;
    font-family: 'sarabunextrabold';
    font-size: 1.5vw;
    color: #ffffff;
    text-align: center;
    justify-content: center;
    align-items: center;
}

#inhalt_anfahrt{
    display: none;
    grid-row-start: 4;
    grid-template-columns: 100%;
    position: relative;
    width: 96vw;
    left: 1vw;
    height: auto;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 7vw;
    padding-bottom: 1.3vw;
    align-items: baseline;
}

#anfahrt_anker{
    z-index: 3;
    display: block;
    width: 70vw;
    height: 0.1vw;
    grid-column-start: 2;
    top:0vw;
    margin-right: auto;
    margin-left: auto;
    margin-top: 7vw;
    font-family: 'sarabunextrabold';
    font-size: 1.5vw;
}


#anfahrt_adresse{
    width: 86vw;
    height: auto;
    grid-column-start: 1;
    grid-row-start: 1;
    margin-left: auto;
    margin-right: auto;
    display: block;
    position: relative;
    z-index: 4;
    text-align: center;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    padding-left:4vw;
    padding-right: 4vw;
    color: #ffffff;
    white-space: pre-wrap;
    line-height: 1.2;

}

#anfahrtEditTextblockBN{
    display: block;
    position: relative;
    grid-row-start: 2;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4vw;
    margin-top: 0vw;
}

#anfahrtChangeTextblockForm{
    display: none;
    grid-template-columns: 100%;
    grid-row-start: 1;
    grid-column-start: 1;
    position: relative;
    z-index: 5;
    width: inherit;
    height: 100%;
    position: relative;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 1vw;
    margin-right: auto;
    grid-gap:0.5vw;
    padding-top:1.5vw;
    padding-bottom:1.5vw;

}

#anfahrtChangeTextblockInput{
    display: block;
    grid-column-start: 1;
    grid-row-start: 1;
    width: 86vw;
    height: auto;
    resize: none;
    text-align: left;
    margin-right: auto;
    margin-left: auto;
    margin-top: 4vw;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    white-space: pre-wrap;
    line-height: 1.2;
    color: #000000;
}

#anfahrtChangeTextblockSubmit{
    display: block;
    position: relative;
    grid-row-start: 2;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4vw;
    margin-top: 4vw;
}

#anfahrtAbortChangeTextblock{
    display: block;
    position: relative;
    grid-row-start: 3;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 7vw;
    margin-top: 0vw;
}

#anfahrtskarte{
    display: block;
    position: relative;
    z-index: 7;
    margin-left: auto;
    margin-right: auto;
    width: 86vw;
    height: 212vw;
    border: none;
    grid-row-start: 2;
    grid-column-start: 1;
    margin-bottom: 4vw;
}

#mapsEmbeddedLinkEditBN{
    display: none;
    width: 86vw;
    height: 7vw;
    position: relative;
    z-index: 8;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    background-color: #0000008a;
    grid-row-start: 4;
    grid-column-start: 1;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding-top: 6vw;
    padding-bottom: 12vw;
    cursor: pointer;
    text-decoration: underline;
}

#mapsEmbeddedLinkEditForm{
    display: none;
    grid-template-columns: 100%;
    grid-row-start: auto;
    position: relative;
    width: 86vw;
    height: fit-content;
    grid-row-start: 4;
    grid-column-start: 1;
    margin-left: auto;
    margin-right: auto;
    align-items: center;
    justify-content: center;
    grid-gap: 0.5vw;
}

#mapsEmbeddedLinkTitle{
    display: block;
    position: relative;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    height: 5vw;
    color: #ffffff;
    grid-column-start: 1;
    grid-row-start: 1;
}
#mapsEmbeddedLinkTextInput{
    font-family: 'sarabunextrabold';
    display: block;
    position: relative;
    grid-column-start: 1;
    grid-row-start: 2;
    font-size: 5vw;
    height: fit-content;
    color: #000000;
    resize: none; 
    grid-column-start: 1;
    grid-row-start: 1;
}

#mapsEmbeddedLinkSubmit{
    display: block;
    width: 86vw;
    height: 7vw;
    position: relative;
    z-index: 8;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    background-color: #0000008a;
    grid-row-start: 3;
    grid-column-start: 1;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding-top: 6vw;
    padding-bottom: 12vw;
    cursor: pointer;
    border:none;
    margin-top: 6vw;
    text-decoration: underline;
}

#mapsEmbeddedLinkReset{
    display: block;
    width: 86vw;
    height: 7vw;
    position: relative;
    z-index: 8;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    background-color: #0000008a;
    grid-row-start: 4;
    grid-column-start: 1;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding-top: 6vw;
    padding-bottom: 6vw;
    cursor: pointer;
    text-decoration: underline;
}

#inhalt_mitglied{
    display: none;
    grid-row-start: 4;
    grid-template-columns: 100%;
    position: relative;
    width: 96vw;
    left: 1vw;
    height: auto;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 7vw;
    padding-bottom: 1.3vw;
    align-items: baseline;
}

#recruitmentUeberschrift{
    display: block;
    grid-row-start: 1;
    grid-column-start: 1;
    position: relative;
    z-index: 4;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    text-align: center;
    text-decoration: none; 
    margin-left: auto;
    margin-right: auto;
}

#recruitmentEditTitleBN{
    display: block;
    position: relative;
    grid-row-start: 3;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2vw;
    margin-top: 4vw;
}

#recruitmentChangeTitleForm{
    display: none;
    grid-row-start: 1;
    grid-column-start: 1;
    position: relative;
    z-index: 5;
    width: 86vw;
    height: auto;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    grid-gap:0.5vw;
    margin-top: 4vw;
}

#recruitmentChangeTitleInput{
    display: block;
    grid-row-start: 1;
    grid-column-start: 1;
    grid-column-end: 1;
    width: 86vw;
    height: auto;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #000000;
    padding-bottom: 2vw;
    padding-top: 2vw;
}

#recruitmentChangeTitelSubmit{
    display: block;
    position: relative;
    grid-row-start: 2;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0vw;
    margin-top: 4vw;
}

#recruitmentAbortChangeTitel{
    display: block;
    position: relative;
    grid-row-start: 3;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4vw;
    margin-top: 4vw;
}

#recruitmentTextblock{
    display: none;
    grid-row-start: 2;
    grid-column-start: 1;
    position: relative;
    z-index: 4;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    line-height: 1.2;
    white-space: pre-wrap;
    color: #ffffff;
    text-align: center;
    text-decoration: none; 
    margin-left: auto;
    margin-right: auto;  
    margin-bottom: 4vw; 
}

#recruitmentEditTextblockBN{
    display: block;
    position: relative;
    grid-row-start: 4;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4vw;
    margin-top: 4vw;
}

#recruitmentChangeTextblockForm{
    display: none;
    grid-template-columns: 100%;
    grid-row-start: 2;
    grid-column-start: 1;
    position: relative;
    z-index: 5;
    width: 86vw;
    height: auto;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    grid-gap:0.5vw;
}

#recruitmentChangeTextblockInput{
    display: block;
    grid-column-start: 1;
    grid-row-start: 1;
    width: 86vw;
    height: auto;
    resize: none;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    white-space: pre-wrap;
    line-height: 1.2;
    color: #000000;
    padding-bottom: 2vw;
}

#recruitmentChangeTextblockSubmit{
    display: block;
    position: relative;
    grid-row-start: 2;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0vw;
    margin-top: 4vw;
}

#recruitmentAbortChangeTextblock{
    display: block;
    position: relative;
    grid-row-start: 3;
    grid-column-start: 1;
    width: 86vw;
    height: auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: center;
    text-decoration: underline;
    font-size: 5vw;
    background-color: #0000008a;
    outline: none;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    margin-left: auto;

    margin-right: auto;
    margin-bottom: 4vw;
    margin-top: 4vw;
}

/*#######################################################
    Galerie
 ########################################################
*/
#mainGallerie{
    display: grid;
    width: 86vw;
    height: fit-content;
    grid-template-columns: 100%;
    grid-template-rows: 20vw auto;  
    grid-gap: 2vw;
    margin-top: 4vw;
    margin-left: auto;
    margin-right: auto;
    min-height: 168vw;
    align-items:flex-start;
    justify-content: center;
    padding-left: 6vw;
    padding-right: 7vw;
    margin-bottom: 7vw;
}

#noAlbumText{
    display: block;
    font-family: 'sarabunextrabold';
    font-size: vw;
    color: #ffffff;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    grid-column-start: 1;
    grid-column-end: 3;
}
/*
Auflistung der Alben
##################################
*/


#selectAlbumBN{
    display: block;
    position: relative;
    grid-row-start: 1;
    grid-column-start: 1;
    width: 86vw;
    height: 7vw;
    top: -5vw;
    margin-left: auto;
    margin-bottom: auto;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    text-align: center;
    padding-top: 5vw;
    padding-bottom: 5vw;
}


#auflistungAlbenBurgerMenue {
    display: none;
    grid-row-start: 2;
    grid-column-start: 1;
    position: relative;
    z-index: 10;
    grid-auto-rows: 28vw;
    grid-auto-flow: dense;
    width: 86vw;
    height: fit-content;
    outline: 0.75vw solid #ffee02;
    background-color: #001a99;
    margin-bottom: 2vw;
    padding-bottom: 6vw;
}

.albumListeElement{
    display: block; 
    width: 80vw;
    height: fit-content;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    text-align: center;
    text-decoration: underline;
    color: #ffffff;
    cursor: pointer;
    line-height: 1.2;
    background-color: #0000008a;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 7vw;
    padding-top: 7vw;
    
}


/*
Neue Gallerie erstellen
##################################
*/


#showCreateNewAlbumFormBN{
    display: none;
    position: relative;
    grid-row-start: 2;
    grid-column-start: 1;
    width: 86vw;
    height: 7vw;
    top: -5vw;
    margin-left: auto;
    margin-bottom: auto;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    text-align: center;
    padding-top: 5vw;
    padding-bottom: 5vw;
}

#createNewAlbumForm{
    display: none;
    position: relative;
    z-index: 2;
    grid-template-columns: 100%;
    grid-column-start: 1;
    grid-row-start: 2;
    margin-left: auto;
    margin-right: auto;
    width: 90vw;
    height: auto;
    background-color: #001a99;
    outline: 0.75vw solid #ffee02;
    padding: 2vw;
    left: -4vw;
    grid-gap: 2vw;
    margin-bottom: 2vw;
}

#createNewAlbumTitle{
    display: block;
    grid-column-start: 1;
    position: relative;
    grid-row-start: 1;
    width: inherit;
    height: 15vw;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #000000;
    text-align: center;
    cursor: text;
    left: -1vw;
}


#createNewAlbumImageInputText{
    display: block;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #ffffff;
    grid-row-start: 3;
}


#createNewAlbumImageInput{
    display: inline-block;
    font-family: 'sarabunextrabold';
    font-size: 6vw;
    color: #ffffff;
    grid-row-start: 4;
    grid-column-start: 1;
    text-decoration: underline;
    width: 86vw;
    height: 6vw;
    cursor: pointer;
    margin-bottom: 1vw;
    background-color: #0000008a;
    padding-top: 8vw;
    padding-bottom: 10vw;
    padding-left: 3vw;
}

#createNewAlbumImageInput::-webkit-file-upload-button, #createNewAlbumImageInput::file-selector-button{
    width: 10vw;
    height: 10vw; 
    background-color: transparent;
    background-image: url("../img//icons/imageFile.png");
    background-repeat: no-repeat;
    background-size:10vw;
    background-position: center;
    border: none;
    font-family: 'sarabunextrabold';
    color:#ffffff00;
    grid-row-start: 4;
    grid-column-start: 1;
    grid-column-end: 3;
    cursor: pointer;
}

.createNewAlbumImagePreview {
    grid-column-start: 1;
    grid-column-end: 1;
    grid-row-start: 5;
    display: grid;
    grid-template-columns: 100%;
    grid-auto-rows: auto;
    grid-gap: 0.5vw;
    margin-top: 1vw;
    justify-content: center;
    align-items: center;
    
}

.createNewAlbumImagePreview .createNewImagePreviewContainer {
    width: 86vw;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}
  
.createNewAlbumImagePreview img,
.createNewAlbumImagePreview video {
    width: 86vw;
    height: auto;
    object-fit: contain;
    margin: auto;
}

#createNewAlbumSubmit{
    display: block;
    width: 100%;
    height: 18vw;
    grid-column-start: 1;
    grid-row-start: 6;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #000000;
    text-align: center;
    cursor: pointer;
}

#createNewAlbumReset{
    display: block;
    width: 100%;
    height: 18vw;
    grid-column-start: 1;
    grid-row-start: 7;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    color: #000000;
    text-align: center;
    cursor: pointer;
}


/*

	Album
##################################
*/

#Album{
    display: grid;
    width: 92vw;
    height: fit-content;
    position: relative;
    left: -5vw;
    margin-left: auto;
    margin-right: auto;
    background-color: #001a99;
    padding: 2vw;
    outline: 0.75vw solid #ffee02;
    margin-bottom: 1vw;
    margin-top: 4vw;
    grid-template-columns: 100%;
    grid-template-rows: auto 24vw auto;
    align-items: center;
    justify-content: center;
}


#albumGrid{
    display: grid;
    grid-gap: 0.5vw;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    position: relative;
    width: inherit;
    height: fit-content;
    margin-left: auto;
    margin-bottom: auto;
    margin-right: auto;
    margin-top: auto;
}

#albumTitle{
    display: block;
    font-family: 'sarabunextrabold';
    position: relative;
    text-align: center;
    font-size: 7vw;
    color: #ffffff;
    grid-row-start: 1;
    grid-column-start: 1;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: auto;
    margin-right: auto;
    padding-top: 2vw;
}

#albumDate{
    display: block;
    text-align: center;
    font-family: 'sarabunextrabold';
    position:relative;
    top: 1vw;
    font-size: 5vw;;
    color:#ffffff;
    grid-row-start: 2;
    grid-column-start: 1;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: auto;
    margin-right: auto;
}

#albumMainImage{
    display: block;
    position: relative;
    object-fit: contain;
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    grid-row-start: 3;
    grid-column-start: 1;
    margin-top: 4vw;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4vw;
}

#thumbnailContainer{
    grid-row-start: 4;
    grid-column-start: 1;
    display: grid;
    position: relative;
    width: 90vw;
    height: fit-content;
    grid-template-columns: repeat(3, 30vw);
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
    justify-items: center;
    align-items: center;
    grid-row-gap: 5vw;
}

#thumbnailContainer::-webkit-scrollbar{
    display: none;
  }

#thumbnailArrowUp{
    display: none;
}
#thumbnailArrowDown{
    display: none;
}

.albumThumbnailElement{
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: 100%;
}

.albumThumbnailImage{
    width: 25vw;
    height: 25vw;
    object-fit: cover;
    position: relative;
    z-index: 4;
    max-width: 25vw;
    max-height: 25vw;
    grid-column-start: 1;
    grid-row-start: 1;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
    overflow: hidden;
    cursor: pointer;
}

.albumImageDeleteBN{
    display: none;
    width: 10vw;
    height: 10vw;
    font-family: 'sarabunextrabold';
    font-size: 0.5vw;
    align-items: center;
    text-align: center;
    position: absolute;
    z-index: 5;
    grid-column-start: 1;
    grid-row-start: 1;
    margin-bottom: auto;
    margin-right: auto;
    color: white;
    border: none;
    cursor: pointer;
    outline: 0.15vw solid #ffee02;
    background-color: #001a99; 
}

#albumImageDeleteForm{
    display: grid;
    width: inherit;
    grid-template-rows: auto;
    grid-gap: 4vw;
}

#albumImageDeleteConfirm{
    display: none;
    position: relative;
    width: inherit;
    height: 7vw;
    grid-row-start: 2;
    font-family: 'sarabunextrabold';
    grid-column-start: 1;
    font-size: 7vw;
    color: #ffffff;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #0000008a;
    text-align: center;
    text-decoration: underline;
    cursor: pointer;
    margin-right: auto; 
}

#albumImageDeleteSelectAll{
    display: none;
    position: relative;
    width: inherit;
    grid-row-start: 3;
    font-family: 'sarabunextrabold';
    grid-column-start: 1;
    font-size: 7vw;
    color: #ffffff;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #0000008a;
    text-align: center;
    text-decoration: underline;
    cursor: pointer;
    margin-right: auto; 
    margin-top: -5vw;

}


#albumImageDeleteDeSelectAll{
    display: none;
    position: relative;
    width: inherit;
    grid-row-start: 3;
    font-family: 'sarabunextrabold';
    grid-column-start: 1;
    font-size: 7vw;
    color: #ffffff;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #0000008a;
    text-align: center;
    text-decoration: underline;
    cursor: pointer;
    margin-right: auto; 
    margin-top: -5vw;
}



#albumImageDeleteSubmit{
    display: none;
    position: relative;
    width: inherit;
    border: none;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    background-color: #0000008a;
    color: #ffffff;
    padding-top: 6vw;
    padding-bottom: 6vw;
}
#albumImageDeleteAbort{
    display: none;
    position: relative;
    width: inherit;
    border: none;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    background-color: #0000008a;
    color: #ffffff;
    padding-top: 6vw;
    padding-bottom: 6vw;
}

#showChangeAlbumFormBN{
    display: none;
    width: 86vw;
    height: 7vw;
    position: relative;
    z-index: 10;
    background-color: #0000008a;
    font-family: 'sarabunextrabold';
    font-size: 7vw;
    text-align: center;
    text-decoration: underline;
    left: 3vw;
    color: #ffffff;
    grid-row-start: 2;
    grid-column-start: 1;
    margin-top: 10vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
}

#changeAlbumForm{
    display: none;
    position: relative;
    z-index: 8;
    width: inherit;
    height: fit-content;
    margin-left: auto;
    margin-right: auto;
    grid-row-start: 3;
    grid-column-start: 1;
    grid-template-columns: 100%;
    grid-template-rows: auto;
    grid-gap: 4vw;
    align-items: center;
    margin-top: -17vw;
}

#albumChangeTitle{
    display: block;
    width: inherit;
    left: -1vw;
    height: 20vw;
    text-align: center;
    font-family: 'sarabunextrabold';
    position: relative;
    font-size: 7vw;
    color: #000000;
    grid-row-start: 1;
    grid-column-start: 1;
    margin-left: auto;
    margin-right: auto;
}

#albumLoadNewImageInputText{
    display: block;
    width: inherit;
    left: -1vw;
    height: 7vw;
    text-align: left;
    font-family: 'sarabunextrabold';
    position: relative;
    font-size: 7vw;
    color: #ffffff;
    grid-row-start: 2;
    grid-column-start: 1;
    margin-left: auto;
    margin-right: auto;
}

#albumLoadNewImageInput{
    display: inline-block;
    font-family: 'sarabunextrabold';
    position: relative;
    font-size: 5vw;;
    color:#ffffff;
    text-decoration: underline;
    grid-row-start: 3;
    grid-column-start: 1;
    width:inherit;
    height: 5vw;
    cursor: pointer;
    background-color: #0000008a;
    padding-top: 7vw;
    padding-bottom: 12vw;
}

#albumLoadNewImageInput::-webkit-file-upload-button, #albumLoadNewImageInput::file-selector-button{
    width: 10vw;
    height: 10vw; 
    background-color: transparent;
    background-image: url("../img//icons/imageFile.png");
    background-repeat: no-repeat;
    background-size:10vw;
    background-position: center;
    border: none;
    font-family: 'sarabunextrabold';
    color:#ffffff00;
    grid-row-start: 3;
    grid-column-start: 1;
    cursor: pointer;
}

.albumLoadImagePreview{
    grid-column-start: 1;
    grid-row-start: 4;
    display: grid;
    width: inherit;
    height: fit-content;
    grid-template-columns: repeat(3, 25vw);
    grid-auto-rows: auto;
    grid-gap: 0.5vw;
    margin-top: 1vw;
    justify-content: center;
    align-items: center;
}

.albumLoadImagePreview::-webkit-scrollbar{
    display: none;
  }

.albumLoadImagePreview .albumLoadImagePreviewContainer {
    width: 8vw;
    height: 8vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.albumLoadImagePreview img{
    width: 8vw;
    height: 8vw;
    object-fit: contain;
    margin: auto;
}

#changeAlbumSubmit{
    display:block;
    position: relative;
    width: inherit;
    grid-row-start: 5;
    font-family: 'sarabunextrabold';
    grid-column-start: 1;
    font-size: 7vw;
    color: #ffffff;
    border-radius: 0.1vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #0000008a;
    text-align: center;
    text-decoration: underline;
    cursor: pointer;
    border: none;
    margin-right: auto;
}

#changeAlbumAbort{
    display:block;
    position: relative;
    width: inherit;
    grid-row-start: 6;
    font-family: 'sarabunextrabold';
    grid-column-start: 1;
    font-size: 7vw;
    color: #ffffff;
    border-radius: 0.1vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #0000008a;
    text-align: center;
    text-decoration: underline;
    cursor: pointer;
    border: none;
    margin-right: auto;
}


#deleteAlbumConfirm{
    display:block;
    position: relative;
    width: inherit;
    grid-row-start: 7;
    font-family: 'sarabunextrabold';
    grid-column-start: 1;
    font-size: 7vw;
    color: #ffffff;
    border-radius: 0.1vw;
    padding-top: 6vw;
    padding-bottom: 6vw;
    background-color: #0000008a;
    text-align: center;
    text-decoration: underline;
    cursor: pointer;
    border: none;
    margin-right: auto;
}

#deleteAlbumSubmit{
    display: none;
    position: relative;
    width: inherit;
    grid-row-start: 8;
    font-family: 'sarabunextrabold';
    grid-column-start: 1;
    font-size: 7vw;
    color: #ffffff;
    text-decoration: underline;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    text-align: center;
    cursor: pointer;
    margin-right: auto;
    background-color: #0000008a;
}

#deleteAlbumAbort{
    display: none;
    position: relative;
    top:-9vw;
    width: inherit;
    grid-row-start: 9;
    font-family: 'sarabunextrabold';
    grid-column-start: 1;
    font-size: 7vw;
    color: #ffffff;
    text-decoration: underline;
    background-color: #0000008a;
    border: none;
    padding-top: 6vw;
    padding-bottom: 6vw;
    text-align: center;
    cursor: pointer;
    margin-right: auto;
}

/*
##################################
	Impressum
##################################
*/

#mainImpressum{
    display: block;
    background-color: #001a99;
    z-index: 3;
    position: relative;
    top: 4vw;
    left:1vw;
    outline: 0.25vw solid #ffee02;
    max-width: 93vw;
    padding: 3vw;
    margin-right: auto;
    margin-left: auto;
    height: auto;
    text-decoration: none;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    text-align: left;
    margin-bottom: 15vw;
}

.impressum{
    display: grid;
    position: relative;
    width: 86vw;
    height: auto;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    grid-template-columns: 50% 50%;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    font-size: 5vw;
    white-space: pre-wrap;
}

#impressumTitle{
    display: block;
    width: inherit;
    grid-row-start: 1;
}

#impressumText{
    display: block;
    width: inherit;
    position: relative;
    grid-row-start: 2;
}

#impressumTextEditBN{
    display:none;
    width: 86vw;
    height: 7vw;
    position: relative;
    grid-row-start: 3;
    grid-column-start: 1;
    z-index: 8;
    background-color: #0000008a;
    cursor:pointer;
    margin-top: auto;
    margin-bottom: auto;
    margin-left:auto;
    font-family: 'sarabunextrabold';
    color: #ffffff;
    font-size: 7vw;
    text-decoration: underline;
    padding-top: 6vw;
    padding-bottom: 6vw;
    
}

#impresumTextEditForm{
    display: none;
    width: inherit;
    height: auto;
    grid-row-start: 2;
    margin-left: auto;
    margin-right: auto;
    grid-column-start: 1;
    grid-column-end: 3;
    grid-gap: 4vw;
}

#impressumEditTextInput{
    width: inherit;
    height: 75vw;
    font-family: 'sarabunextrabold';
    color: #000000;
    font-size: 5vw;
    white-space: pre-wrap;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    resize: none;
}

#impressumEditTextSubmit{
    display:block;
    position: relative;
    z-index: 5;
    width: 86vw;
    height: 7vw;
    background-color: #0000008a;
    grid-row-start: 2;
    font-family: 'sarabunextrabold';
    font-size: 5vw;
    color: #ffffff;
    border: none;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    padding-top: 6vw;
    padding-bottom: 12vw;
    text-decoration: underline;
}

#impressumEditTextReset{
    display:block;
    position: relative;
    z-index: 5;
    width: 86vw;
    height: 7vw;
    background-color: #0000008a;
    grid-row-start: 3;
    font-family: 'sarabunextrabold';
    text-decoration: underline;
    font-size: 5vw;
    color: #ffffff;
    border: none;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    padding-top: 6vw;
    padding-bottom: 12vw;
}


/*##################################
    Firefox styles
####################################*/

@-moz-document url-prefix() {
    #mainIndex{
        display: block ruby;
        position: relative;
        left: -1.5vw;
        z-index: 5;
        margin-top: 26vw;
        margin-bottom: 5vw;
        width: 97vw;
        height: auto;
        min-height: 80vh;
    }

    #Indexsidebar {
        display: none;
        grid-template-columns: 25% 25% 25% 25%;
        grid-template-rows: 100%;
        grid-gap: 3vw;
        position: absolute;
        width: 83vw;
        height: 0vw;
        z-index: 2;
        margin-left: -71vw;
        margin-right: auto;
        margin-top: -32vw;
      }

      #footerImpressum {
        display: block;
        z-index: 3;
        width: 10vw;
        position: absolute;
        left: 7vw;
        top: 5vw;
        height: 13vw;
        grid-column-start: 1;
        grid-row-start: 1;
        text-decoration: none;
        text-align: left;
        font-family: 'sarabunextrabold';
        font-size: 9vw;
        color: #ffffff;
        text-decoration: none;
        margin-top: auto;
        margin-bottom: auto;
      }

      #navItem_01, #navItem_02, #navItem_04, #navItem_05{
        padding-top: 3vw;
        padding-bottom: 5vw;
      }
  }