html {
    font-size: 62.5%;
}

html,
body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    background-color: rgba(244, 227, 123, 0.52);
}

figure,
ul,
p {
    margin: 0;
    padding: 0
}

figure + p,
figcaption {
	margin-top: 0.5rem;
}

img {
    border: none;
    display: block;
    width: 100%;
    height: auto;
}

li {
    list-style: none;
}

a,
a:hover,
a:active,
a:focus,
a:visited {
    text-decoration: none;
    color: rgb(0, 0, 0);
    display: block;
}

p > a,
p > a:hover,
p > a:active,
p > a:focus,
p > a:visited{
	display: inline;
}

h1,
h2,
h3 {
    font-family: 'crimsonbold', Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-style: normal;
    margin: 0;
    padding: 0;
}

h1 {
    font-size: 4rem;
    line-height: 1.1;
    color: rgb(30, 30, 30);
    margin-top: 0;
    margin-bottom: 0.8rem;
}

h2 {
    font-size: 3.0rem;
    line-height: 1.1;
    margin-top: 0;
    margin-bottom: 0.8rem;
}

h3 {
    margin-top: 0.6rem;
    margin-bottom: 0;
    font-size: 2.0rem;
    line-height: 1.1;
}

.content_text h3:first-child {
	margin-top: 0;
}

h4,
strong {
    font-family: 'Fira Sans', Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-style: normal;
    color: rgb(0, 0, 0);
    margin: 0;
    padding: 0;
    width: 100%;
}

li > strong {
    color: rgba(245, 245, 245, 1);
    letter-spacing: 0.1rem;

}


em {
    font-family: 'Fira Sans', Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-style: italic;
}

p,
h1,
h2,
h3 {
    overflow-wrap: break-word;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

.invisible {
	display: none;
}

.container {
    width: 100%;
    height: auto;
    margin: 0 auto;
    margin-top: -6.5rem;
    xposition: relative;

    xbackground-color: rgb(25, 255, 25);
    font-family: 'Fira Sans', Arial, Helvetica, sans-serif;
    font-style: 400;
    font-weight: normal;
    font-size: 1.5rem;
    line-height: 1.4;
    position: relative;
    z-index: 100;
}



.page_header,
.page_content,
.page_footer {
    width: 100%;
    max-width: 102.4rem;
    margin: 0 auto;
}

.page_header,
.page_navigation .level_1,
.page_content,
.page_footer {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}


/* ##########################################  */

/* ####### HEADER ######  */

/* ##########################################  */

.page_header {
    xbackground-color: rgb(247, 239, 180);
    xpadding: 2rem;

    font-family: 'Fira Sans', Arial, Helvetica, sans-serif;
    font-size: 1.5rem;
    font-style: 400;
    font-weight: normal;
    line-height: 1.4;

    xheight: 13rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;

    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    width: 100%;
    xborder-bottom: 2px solid rgba(247, 239, 180, .5);
    position: relative;
    z-index: 1000;
    padding: 0 2rem;
    box-sizing: border-box;
}

.page_header_line {
    height: 3rem;
    xbackground-color: rgba(155, 196, 61, 0.75);
    background-color: rgba(175, 208, 100, 1);

    width: 100%;
    position: relative;
    z-index: 600;
    top: 10.4rem;
}



/* ##########################################  */

/* ####### BANNER ######  */

/* ##########################################  */

.page_banner {
    width: 100%;
    height: 50%;
    xmargin-top: 5rem;
    min-height: 10rem;
    max-height: 60rem;
    xbackground-color: rgb(208, 168, 245);
    overflow-y: hidden;
}

.page_banner figure {
    padding: 0;
    height: 66.6%;
}




/* ##########################################  */

/* ####### LOGO ######  */

/* ##########################################  */

.logo_container_link {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 20rem;
    -ms-flex: 0 1 20rem;
    flex: 0 1 20rem;
}

.logo_container {
    xheight: 6.8rem;
    xbackground-color: rgba(25, 255, 255, 1);
    xpadding: 0.6rem;
    xmargin-right: 2rem;
    xpadding: 0 4rem;
    width: 20rem;

}


/* ##########################################  */

/* ####### NAVIGATION ######  */

/* ##########################################  */

.page_navigation {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    margin-bottom: 1.2rem;
    margin-left: 4rem;
    height: 3rem;
}

.page_navigation .level_1 {
    xmargin-right: 2rem;
    margin: 0 auto;
}

.page_navigation .level_1 li {
    margin-right: 2rem;
}

.page_navigation .level_1 li:last-child {
    margin-right: 1.4rem;
}

.page_navigation a:hover {
    color: rgba(245, 245, 245, 1);
    font-family: 'Fira Sans', Arial, Helvetica, sans-serif;
    font-style: normal;
    font-weight: normal;
    xbackground-color: rgb(182, 182, 182);
    xpadding: 0.5rem 1rem;
}

.page_navigation li .level_2 {
	position: absolute;
	z-index: 1000;
	display: none;
}

.page_navigation .level_1 li:hover .level_2  {
	display: flex;
	flex-direction: column;
	padding: 0 1rem 1rem 1rem;
	xmargin-top: 0.5rem;
    background-color: rgba(175, 208, 100, 1);

}

.page_navigation .level_2 li {
    margin-top: 1rem;

}



/* ##########################################  */

/* ####### HEADLINE ######  */

/* ##########################################  */

.page_headline {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    xbackground-color: rgb(247, 147, 212);
}



/* ##########################################  */

/* ####### CONTENT ######  */

/* ##########################################  */

.page_content {
    xbackground-color: rgba(155, 196, 61, 1);
    background-color: rgba(175, 208, 100, 1);

    xbox-shadow: 2px 2px 20px 10px rgba(247, 239, 180, 0.1);
    border: 8px solid rgba(247, 239, 180, 0.75);
    border-radius: 2px;
	margin-top: -7%;
    height: auto;
    padding: 3rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display:flex;
    justify-content: space-between;
    position: relative;
	z-index: 1000;
}

.content_container {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 100%;
    -ms-flex: 0 1 100%;
    flex: 0 1 100%;
    xbackground-color: rgb(109, 212, 169);
    xmargin-right: 2rem;
    height: auto;
}

.content_headline {
    xwidth: 75%;
    margin-bottom: 2rem;
}

.news_container {
    -webkit-box-flex: 0;
    -webkit-flex: 0 1 30rem;
    -ms-flex: 0 1 30rem;
    flex: 0 1 30rem;
    background-color: rgb(132, 173, 156);
    xpadding: 1rem;
    x-webkit-box-sizing: border-box;
    xbox-sizing: border-box;
}

.content_galerie {
	width: 100%;
	margin-top: 2rem;
}

.content_galerie ul {
	display: flex;
}

.content_galerie image_container .cboxElement {
	width: 200px;
}

/* ##########################################  */

/* ####### Mobile Menu ######  */

/* ##########################################  */


.mobile_menu_switch {
    display: none;
    }	
    
    
    
.mobile_menu_switch {
    height: 3rem;
    xbackground-color: rgba(255, 224, 0, 0.5);
    flex: 0 1 3rem;
    right: 3rem;
    top: 7.8rem;
    position: absolute;
    z-index: 20000;
}

.mobile_menu_switch span {
    width: 3.2rem;
    height: 0.4rem;
    position: relative;
    display: block;
    margin-bottom: 5px;
    vertical-align: top;
    text-align: right;
    background-color: rgb(64, 64, 64);
    margin-bottom: 5px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    z-index: 1;
    -webkit-transform-origin: 4px 0px;
    -ms-transform-origin: 4px 0px;
    transform-origin: 4px 0px;
    -webkit-transition: background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
    transition: background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
    -o-transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.55s ease;
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.55s ease;
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.55s ease, -webkit-transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
}

.menu_mobile_active .mobile_menu_switch span:nth-child(1) {
    background-color: rgb(64, 64, 64);
    opacity: 1;
    -webkit-transform: rotate(45deg) translate(0px, 0px);
    -ms-transform: rotate(45deg) translate(0px, 0px);
    transform: rotate(45deg) translate(0px, 0px);
}

.menu_mobile_active .mobile_menu_switch span:nth-child(2) {
    opacity: 0;
}

.menu_mobile_active .mobile_menu_switch span:nth-child(3) {
    background-color: rgb(64, 64, 64);
    opacity: 1;
    -webkit-transform: rotate(-45deg) translate(-1px, -2px);
    -ms-transform: rotate(-45deg) translate(-1px, -2px);
    transform: rotate(-45deg) translate(-1px, -2px);
}   

/* ##########################################  */

/* ####### content ######  */

/* ##########################################  */
.content_article {
    display: flex;
    xflex-direction: column;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: space-between;
    
}

.content_article_headline {
    flex: 0 1 100%;
}

.content_article_image_container {
    margin-bottom: 2rem;
        flex: 0 1 63%;

}

.content_article_text {
    flex: 0 1 22%;
}

/* ##########################################  */

/* ####### GAlerie ######  */

/* ##########################################  */


.galerie {
	width: 100%;
	background-color:green;
}

.slick-list {
    margin: 0 30px 0 30px;
}

.slick-track {
 background-color: red;
     height: 15rem;
position: relative;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -moz-box;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    -moz-box-pack: justify;
    justify-content: space-between;

}


.slick-slide {

    height: 100%;
    min-height: 1px;
    	max-width: 200px;
}


/* ##########################################  */

/* ####### FOOTER ######  */

/* ##########################################  */

.page_footer {
    xbackground-color: rgb(255, 247, 196);
    height: auto;
    font-size: 1.4rem;
    padding: 3rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}



@media (max-width: 1280px) {

.page_content {
	margin-top: -10%;
}
}

@media (max-width: 640px) {
	
	.page_header {
		top: -10px;
	}
	
	.page_header_line {
		top: 9.4rem;
	}
	
	.page_banner {
		max-height: 70rem;
	}
    .page_content {
        flex-direction: column;
        padding: 1.5rem;
 
            border: 4px solid rgba(247, 239, 180, 0.75);

    }
    .page_footer {
    	padding: 1.5rem;
    }
    
    .content_headline {
    	font-size: 3rem;
    }
    
    h2 {
    	font-size: 2.3rem;
    }
    
    .page_navigation {
        position: relative;
    }
    
    .page_navigation .level_1 {
    display: none;
    z-index: 1000;
        position: absolute;
        right: 0;
        top: 2.3rem;
        background-color: rgba(255, 221, 80, 0.72);
        padding: 2rem
            
}
    
        .page_navigation .level_1 li {
   margin-bottom: 2rem;
            
}
            .page_navigation .level_1 li:last-child {
   margin-bottom: 0;
            
}
    .page_navigation li .level_2 {
    	position: relative;
    }
    
    .page_navigation .level_2 li {
    margin-top: 0rem;

}

    
    .menu_mobile_active .page_navigation .level_1 {
    display: block;
    xbackground-color: rgba(155, 196, 61, 0.75);
    background-color: rgba(175, 208, 100, 1);
    top:3.4rem;

        
}
    
    .mobile_menu_switch {
    display: block;
    }	
    
    .page_footer {
        flex-direction: column;
        height: auto;
    }
}


