/********************************************************Theme Name:    localhyTheme URI:     files/themes/localhyDescription:Author:        Mario Assmann - mario.assmann@acs-it.deLicense:       none (public domain)Tags:          CSS Reset und Organisation, responsive********************************************************/
/*******************************    Reset    INITIALISIEREN    Farben    Header    Content - Intro********************************/
/*******************************FARBENHintergrund              #FFFFFFBlau                     #0094C8Rot                      #B45845Grün                     #B3CE36Orange                   #DFA827********************************/
	/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin-ext');
	@charset "utf-8";
*\
/*------------------------------------*\                RESET     \*------------------------------------*/
/*! minireset.css v0.0.3 | MIT License | github.com/jgthms/minireset.css */
html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, legend, textarea, pre, iframe, hr, h1, h2, h3, h4, h5, h6, button {
	margin: 0;
	padding: 0
}
h1, h2, h3, h4, h5, h6 {
	/*font-size: 100%;
font-weight: normal*/
}
ul {
	list-style: none
}
button, input, select, textarea {
	margin: 0
}
html {
	box-sizing: border-box
}
*, *:before, *:after {
	box-sizing: inherit
}
img, embed, object, audio, video {
	height: auto;
	max-width: 100%
}
iframe {
	border: 0
}
table {
	border-collapse: collapse;
	border-spacing: 0
}
td, th {
	padding: 0;
	text-align: left
}

/*------------------------------------*\
                INITIALISIEREN
\*------------------------------------*/
html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	animation-duration: 3s;
	animation-name: slidein;
	color: #A3ADB7;
}
@keyframes slidein {
from {
	filter: alpha(opacity=0);
	opacity: 0;
}
to {
	filter: alpha(opacity=100);
	opacity: 100;
}
}
body {
	margin: 0;
	font-size: 100.1%;
	font-family: Rawson-Regular;
	background-color: #f5fad7;
	scroll-behavior: smooth;
}
h1, h2 , h3, h4, h5, h6 {
	font-family: Rawson-Bold;
	color: #32bebe;
}
h2 {
	width: 100%;
	text-align: center;
}
a, li {
	font-size: 1.125rem;
	text-decoration: none;
	color: #A3ADB7;
}
p {
	font-size: 1.125rem;
	line-height: 1.5;
}
p, li {
	margin-bottom: 1.125rem;
}
/*------------------------------------*\
                Module     
\*------------------------------------*/

.toggler {
	font-size: 1.125em;
	text-decoration: none;
	color: #A3ADB7;
	line-height: 1.5;
	margin-bottom: 1.125em;
  outline: none;
}
section {
position: relative;
margin-bottom: 2.5em;
}
.accordion{

padding-bottom: 2.5em;
}
.ui-accordion-header-active .ui-icon {

	position: absolute;
	bottom: 0;
	left: 50%;
	z-index: 10000;
	border-radius: 5px;
	border-top: 10px solid #A3ADB7;
	border-right: 10px solid #A3ADB7;
	height: 20px;
	width: 20px;
	transform: rotate(-45deg);
	transition: 1s ease-in;
	opacity: 0.5;
	filter: alpha(opacity=50);
	display: block;
	visibility: visible;
}

.ui-accordion-header-active {
	visibility: hidden;
}

.mod_article ul {
	list-style: disc;
	margin-left: 1.2rem;
}
.ce_gallery ul {
	list-style: none;

}

.slider-control .slider-menu {
	top: -1.5rem;
	font-size: 4rem;
}

.responsive-video {
position: relative;
padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
padding-top: 0px;
height: 0;
overflow: hidden;
}

.responsive-video iframe  {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/*------------------------------------*\
                Elemente Startseite     
\*------------------------------------*/
main {
	padding-top: 4.5rem;
}
#headline {
	visibility: hidden;
	height: 0;
}
.slider {
	position: relative;
	overflow: hidden;
}
#navigation-line {
	position: fixed;
	left: 0;
	top: 0;
	height: 4.5rem;
	background-color: #fff;
	width: 100%;
	z-index: 100;
}
#navigation-line .inner {
	position: relative;
	height: 100%;
}
#navigation-line .logo-no-claim {
	position: absolute;
	top: 1rem;
	right: 1rem;
}
#navigation-line .logo-no-claim img {
	max-width: 150px;
}
nav button {
	padding: 1.3rem 1rem;
}
#navigation {
	visibility: hidden;
	height: 0;
}
#navigation a {
	font-family: Rawson-SemiBold;
	font-size: 1.6rem;
}
#navigation.visibility {
	visibility: visible;
	background-color: #fff;
	/*height: ;*/
}
#navigation.visibility ul {
	padding: 0;
	text-align: center;
  background-color: #fff;
}
#navigation.visibility li {
	margin: 0;
	padding: 10px 0;
/*	width: 100%;*/
}
span.hamburger-inner, span.hamburger-inner::before, span.hamburger-inner::after {
	background-color: #A3ADB7;
}
main .mod_article {
	padding: 1.5rem 1rem;
}
main .mod_article h2 {
	margin-bottom: 1.5rem;
}
#intro {
	background-color: white;
}
#puzzle .puzzle-content,
#statements .ce_text,
#tagebuch .layout_full {
	color: #A3ADB7;
	background-color: #FFF;
	border-radius: 25px;
	margin-bottom: 1em;
	overflow: hidden;
}
#puzzle .puzzle-content figure,
#statements .ce_text figure,
#tagebuch .ce_image figure
 {
	background-color: #32bebe;
	padding: 1em;
	margin-bottom: 1em;
	text-align: center;
}
#intro .image_container {
	text-align: center;
}
#intro  img {
/*	width: 70%; */
}

#puzzle .puzzle-content figure img {
	width: 25%;
}
#puzzle .puzzle-content p,
#puzzle .puzzle-content section,
#statements .ce_text p,
#statements .ce_text h3,
#tagebuch .ce_text {
	padding: 0 1em;
}
#statements .ce_text figure,
#tagebuch .ce_image figure {
	background-color: #FFF;
	padding: 0;
}
#statements .ce_text figure img,
#tagebuch .layout_full img {
	width: 100%;
}
#technik figure.image_container,
#partner figure.image_container,
#medien,
#video   {
	text-align: center;
}

  #technik.mod_article figure img {
	width: 80%;
	margin: 0 auto;
  text-align: center;
}


footer {
	background-color: #32bebe;
	color: #fff;
	text-align: center;
	padding: 2em;
}
footer a {
	color: #fff;
}
 
 
@media only screen  and (min-width: 480px) {
#puzzle .puzzle-content,
#statements .ce_text {
	position: relative;
	min-height: 24vw;
}
#puzzle .puzzle-content figure,
#statements figure {
	position: absolute;
	width: 30%;
	height: 100%;
	top: 0;
	left: 0;
}
#puzzle .puzzle-content p,
#puzzle .puzzle-content section,
#statements .ce_text p,
#statements .ce_text h3 {
	margin-left: 30%;
	margin-top: 1rem;
}
#puzzle .puzzle-content figure img {
	margin-top: 0.5rem;
  width: 80%;
}

  #technik.mod_article figure img {
	width: 50%;
}

}

@media only screen and (min-width: 48rem) {
main {
	padding-top: 0;
}

#navigation.visibility li {
	padding: 0;
}

.mod_article,
.inner
 {
  max-width: 60rem;
  margin: 0 auto;
}


 .slider {
  text-align: right;
	  max-width: 75em;
    width: 100%\0;
	  margin: 3.125em auto;
  }
 

 
  #headline .inner {
 	max-width: 65em;
 }   

 #intro,
 #puzzle,
 #statements,
 #technik,
 #tagebuch,
 #partner,
 #medien,
 #video,
 footer {padding: 3rem ;} 
  
#puzzle .puzzle-content,
#statements .ce_text {
	min-height: 16rem;
}  



.dummy.sticky {
width: 100%;
height:72px;
}
.logo-no-claim, .hamburger {
	display: none;
}
nav {
	padding: 1rem;
	visibility: visible;
}
#navigation-line {
	/*position: relative;   wegen IE Explorer*/
	position: relative;
}
#navigation-line .inner{
padding: 0 2rem;
}

div#navigation-line.sticky {
	position: fixed;
}

div#navigation-line.sticky nav {
	width: 75%;
}
div#navigation-line.sticky .logo-no-claim {
	display: block;
}
#navigation {
	visibility: visible;
}


#navigation ul {
	display: flex;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
#navigation ul li {
	display: inline;
	margin: 0;
}
#headline {
	visibility: visible;
/*	height: unset;*/
  height: 7.875rem;
	background-color: white;
	padding: 1rem;
}
#headline .logo {
	float: right;
}
#intro {
	background-color: #f5fad7;
}


#intro.mod_article
 {
	  max-width: 71rem;

    margin:0 auto;
}

#intro h2
 {
  max-width: 54rem;
  padding:4rem 4rem 0 4rem;
  margin: 5rem auto 0 auto;
  background-color: #fff;
  border-radius: 1.5rem 1.5rem 0  0;
  text-align: left;
}

#intro p {
  max-width: 54rem;
  background-color: #fff;
  margin: 0 auto;
  padding: 2rem 4rem 4rem 4rem;
  border-radius:  0  0 1.5rem 1.5rem;
} 

#intro figure {
max-width: 50%;
width: 100%;
float: right;
}

#intro figure img {
width: 100%;
}

.intro {
  max-width:80%;
  margin: 0 auto 1.5rem auto;
  text-align: center;
}
  #technik.mod_article,
  #medien.mod_article,
  #video.mod_article {
	max-width: 52rem;

	margin: 0 auto;
  text-align: center;
}
#technik p,
#medien p,
#video p {
margin-bottom: 2rem;
}

  #technik.mod_article figure img {
	width: 60%;
}
#technik nav.slider-control {
	position: absolute;
	bottom: 15rem;
	width: 100%;
	height: 0;
}
#technik .slider-menu {
	display: none;
}
#technik a.slider-prev {
	left: 3rem;
}
#technik a.slider-next {
	right: 3rem;
}
#technik i {
	border: solid #32bebe;
	border-width: 0 12px 12px 0;
	display: inline-block;
	padding: 20px;
	opacity: 0.5;
	filter: alpha(opacity=50);
}
#technik i:hover {
	transition: 0.5s ease-in;
	opacity: 1;
	filter: alpha(opacity=100);
}
#technik .right {
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
#technik .left {
	transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
}

  #partner.mod_article {
	max-width: 52rem;

	margin: 0 auto;
  text-align: center;
}

#partner nav.slider-control {
	position: absolute;
	bottom: 58%;
	width: 100%;
	height: 0;
}
#partner .slider-menu {
	display: none;
}
#partner a.slider-prev {
	left: 3rem;
}
#partner a.slider-next {
	right: 3rem;
}
#partner i {
	border: solid #32bebe;
	border-width: 0 12px 12px 0;
	display: inline-block;
	padding: 20px;
	opacity: 0.5;
	filter: alpha(opacity=50);
}
#partner i:hover {
	transition: 0.5s ease-in;
	opacity: 1;
	filter: alpha(opacity=100);
}
#partner .right {
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
#partner .left {
	transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
}


}

@media only screen and (min-width: 83rem) {

main::before {
position: absolute;
content: "";
bottom:0;
min-width: 900px;
z-index: -1;

top:0;
  left:50%;
  margin-left: -450px; 
  background-color: #F5FAD7;
   -moz-box-shadow:    0px 0px 20px 20px #F5FAD7;
   -webkit-box-shadow: 0px 0px 20px 20px #F5FAD7;
   box-shadow: 0px 0px 20px 20px #F5FAD7;
}

#intro {
-moz-box-shadow: 0px 0px 20px 20px #F5FAD7;
-webkit-box-shadow: 0px 0px 20px 20px #F5FAD7;
box-shadow: 0px 0px 20px 20px #F5FAD7;
}

.background-landscape {
position: absolute;
top:50rem;
left:0;
z-index: -2;
width: 100%;
text-align: center;
transition: all ease-out 1s;
background-image: url(/files/theme/localhy/localhy-bg-landscape-v3.svg);
background-repeat: repeat-x;
height: 4000px;

}

.background-landscape img {
width: 100%;
}

}