@import url('https://fonts.googleapis.com/css2?family=KoHo:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&family=Merienda:wght@300;400;500;600;700;800;900&display=swap');

:root {
    --black: #000;
    --white: #fff;
    --col1: #221316;
    --col2: #431a16;
    --col3: #762e20;
    --col4: #b55628;
    --col5: #b07346;
    --col6: #edad70;
    --col7: #f3d6b8;
    --col8: #d0af9e;
    --col9: #daccc3;
    --col10: #f3ebe8;
    --col11: #fefefe;
    --font1: 'Merienda', cursive;
    --font2: 'KoHo', sans-serif;


}


body {
    background-color: var(--col10);
    color: var(--col2);
    margin: 0;
    padding: 0;
    font-family: var(--font2);
    font-size: 18px;
    line-height: 1.5;
}

/* Title - generally */

h1 {
    padding: 10px 0px 10px 0px;
    margin: 0px 0px 0px 0px;
    font-family: var(--font1);
    font-size: 35px;
    font-weight:bold;
}


h2 {
    padding: 10px 0px 10px 0px;
    font-family: var(--font1);
    font-size: 35px;
    font-weight:bold;

}

h3 {
    font-family: var(--font1);
    font-size: 28px;
}

h4 {
    font-family: var(--font1);
    font-size: 22px;
}

p {
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
}


a {
    color:var(--col4);
}

a:hover, a:visited, a:active {
    color:var(--col4);
    background-color:var(--col2);
    border-radius: 5px;
    
}

/* NAVBAR -  generally */

    .navbar .container-fluid, .navbar .container-fluid .collapse, .navbar-expand-lg .navbar-nav, .navbar-expand-lg .navbar-collapse  {
        flex-direction:column;
    }

    .navbar {
        z-index: 2000;
        padding: 0;
    }

    .navbar-toggler {
        background-color: var(--col10);
    }    

    .navbar, .container-fluid .navcontainer, .container-fluid .collapse, .container-fluid .navSocialMedia {
        color: var(--col9);
     }

     .container-fluid {
        background-color: var(--col2);
     }

     .navbar a {
        color: var(--col9);
        text-decoration-line:none;
     }

     .navbar .collapse a:hover , .navbar .collapse a:active {
        color: var(--col5);
        padding: 0 0 0 5px;
        text-decoration-line:none;
        width: 100%;

     }


     .navbar .collapse ul {
        padding: 10px;
        margin: 10px 0px 50px 0px;
        border: solid 1px var(--col5);
        border-radius: 10px;
        
     }

     .navbar .collapse ul, li {
       list-style-type: none;
     }



/* Content - first page - generally */

.welcomeText {
    padding: 20px 20px 20px 40px;
}

.welcomeText h1 {
    font-size: 28px;
}


.welcomeText h2 {
    font-size: 22px;

}

.welcomeText h3 {
    font-size: 20px;
}

.pageLogo {
    min-height: 10%;
}

.pageTitel {
    padding-top: 20px;
}

.welcomeImage {
    /*background-color: #762e20;*/
    padding: 0px;
}


.welcomeImage img, .carousel-item img  {
    min-width: 100%;
    object-fit: cover; 
    object-position: 50% 50%;
    height: 100vh;
}


/* Image Slider - general */

.carousel-item  {
    /*width: auto;*/
    max-width: 100%;
    max-height: 100vh;
    overflow: hidden;
    align-items: center;
    justify-content: center;
  }

  
.carousel-control-next-icon, 
.carousel-control-prev-icon {
    background-color: var(--col2);
    padding: 10px;
    border-radius: 25px;
    width: 50px;
    height: 50px;
}

.content .fullScreen   {
    /*background-color: yellow;*/
    height: 100vh;
}


carousel {
    width: 100%;
}

/* Content - generally */


.paddingText{
    padding: 30px 40px 20px 40px;
}

.inhaltAfterHeader {
    background-color: #d0af9e;
    background-image: linear-gradient(180deg, #431a16 0.5%, transparent 1.5%, transparent 98.5%, #431a16 100%);
}