
/* ONAGI by Hank Martin + Changes by Isabelle Seemann*/ 
/* This CSS resource incorporates links to font software which is the valuable copyrighted property of Monotype and/or its suppliers. You may not attempt to copy, install, redistribute, convert, modify or reverse engineer this font software. Please contact Monotype with any questions regarding Web Fonts: http://www.fontshop.com */
#example-five {
  position: relative;
}
#example-five-checkbox {
  display: none;
}
#example-five-checkbox:checked + #example-five:after {
  content: "Hide";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: white;
  }



#cookie_banner-wrapper {
  margin-left: auto;
  margin-right: auto;
  z-index: 9001;
  position: fixed;
        bottom: 0;
			  align-items: center;
			  text-align: center;
			   width: 100%;
}

#cookie_banner-wrapper @-webkit-keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(20px);
      transform: translateX(20px);
    }
    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }

#cookie_banner-wrapper @keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(20px);
      -ms-transform: translateX(20px);
      transform: translateX(20px);
    }
    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
    }
  }

  .cookie_container {
    padding-left: auto;
	padding-right: auto;
  padding: 20px;
 color: white;
	  background-color: #222;  
	  width: 100%;
    }
	
	  .cookie_container a{
	  font-weight: bold;
	  font-style: italic;
 color: lightgrey; 
	  }

	
    .cookie_btn {
		  	 margin-left: auto;
			 margin-right: auto;
      background-color: black;
      color: white;
      border-radius: 5px;
      border: 1px solid transparent;
      padding: 6px 12px;
      text-align: center;
      cursor: pointer;
	  
      width: auto;
}
      .cookie_btn:hover {
        background-color: grey;
      }
    

    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.8s;
    -moz-animation-duration: 0.8s;
    -o-animation-duration: 0.8s;
    animation-duration: 0.8s;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight

  }
}



* hyphens */
   -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; 
   
   
font-family: 'Clan W04 Narrow Book', sans-serif;



.bildverweis p{
font-size:12px; 
color: white; 
background-color: rgba(90,90,90, .7);  
display: run-in;  
padding-left: 4px; 
position: absolute; 
bottom: 0; 
left: 0; 
z-index: 1
}

.bildplatzhalter{
	background-color: yellow;
	display: grid;
	height: 100%;
	width: 100%;
}
	

/* Clear floats */
form.suche::after {
  content: "";
  clear: both;
  display: table;
  }


.section-centered{
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.aktuelletagesfahrten-box .button{
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 28%;
   font-weight: 400;
   font-family: 'Clan W04 Narrow Bold', sans-serif;
      letter-spacing: 0.03em;
}

.aktuelletagesfahrten-box{
background-color: rgba(240, 241, 166,0.5);
font-family: 'Clan W04 Narrow Bold', sans-serif;
padding: 25px;
padding-top: 5px;
}

.aktuelletagesfahrten h2{
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	font-size: 1.4rem;
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
color: #273583;
background-color: rgba(240, 241, 166,0.5);
width: 35%;
padding-left: 20px;
padding-top: 20px;
font-size: 1.3rem;
font-weight: 600;
text-transform: uppercase;
}




/*SUCHE*/
/* Style the search field */
form.example input[type=text] {
  padding: 10px;
  font-size: 17px;
  border: 1px solid grey;
  float: left;
  width: 80%;
  background: #f1f1f1;
}

/* Style the submit button */
form.example button {
  float: left;
  width: 20%;
  padding: 10px;
  background: #2196F3;
  color: white;
  font-size: 17px;
  border: 1px solid grey;
  border-left: none; /* Prevent double borders */
  cursor: pointer;
}

form.example button:hover {
  background: red;
}

/* Clear floats */
form.example::after {
  content: "";
  clear: both;
  display: table;
}
  
/*SUCHE ENDE*/

.centered {
	margin-left: auto;
	margin-right: auto;
	position: absolute;

	}
	
.card-image :hover{
	background-color: rgba(50, 115, 220, 0.0);
	}
	
.card-image :hover{
	background-color: rgba(50, 115, 220, 0.0);
}

.card-image :hover p {
	border: 3px solid rgba(0, 0, 0, 0.0);
	background-color: #d3d800;
	}
	

/* Reiseinfobox */

.infobox {
	width: 100%;
	
	background-color: white;
	color: #273583;
	font-family: 'Clan W04 Narrow Book', sans-serif;
	letter-spacing: 0.03rem;
	line-height: 1.1rem;
}
	
	
.infobox h3{
	color: #273583;
	margin: 0;
	padding: 20px;
	margin-bottom: 0.2rem;	
	font-family: 'Clan W04 Narrow Book', sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.04rem;
	font-size: 1.3rem;
	font-weight: 900;
}

.infobox p{
	margin: 0;
	margin-top: 10px;
	padding: 0;
	font-family: 'Clan W04 Narrow Book', sans-serif;
		font-size: 1.1rem;
}

.infoboxbox {
	display: box;
	width: 100%;
	height: auto;
	float: right;
	padding: 0;
}

.reisetermin {
	width: 70%;
	float: left;
	background-color: #d3d800;
	color: darkblue;
	padding-left: 20px;
	padding-top: 20px;
	align-items: center;
	padding-bottom: 16px;
	height: 100%;
}

.reisetermin h3{
	padding: 0;
	margin-top: 10px;
	margin: 0;
	color: #26327C;
	font-family: 'Clan W04 Narrow Bold', sans-serif;

}
.reisetermin p{
	color: white;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
}

.tage {
	width: 27%;
	min-width: 25%;
	float: right;
	background-color: #0cbaf0;
	color: white;
	height: 100%;
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
	

}
.tage h3{
	padding: 0;
	padding-top: 5px;
	line-height: -16px;
	margin: 0;
	color: white;
	font-size: 2rem;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
}
.tage p{
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	color: white;
	font-weight: 1000;
	font-family: 'Clan W04 Narrow Bold', sans-serif;

}

.reisestatus{
	background-color: #aae7fa;
	float: none;
	padding-left: 15px;
	padding-bottom: 10px;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
}

.reisestatus h3{
		color: #26327C;
		margin-top: 10px;
		padding-bottom: 0px;
		padding-left: 8px;
		font-family: 'Clan W04 Narrow Bold', sans-serif;
}

.reisestatus p{
	padding-left: 8px;
		padding-bottom: 5px;
			font-family: 'Clan W04 Narrow Bold', sans-serif;
		}

.kondition{
	margin-top: 10px;
	background-color: #f0f1a6;	
	padding-bottom: 10px;
	padding-top: 10px;
	padding-left: -2px;
}

.kondition h3{
	color: #8C9925;
	padding-top: 10px;
	padding-bottom: 0px;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
}

.kondition p{
	padding-left: 19px;
	padding-bottom: 5px;
	}
	
	
	

.leistungen {
	background-color: rgba(230, 231, 131,0.3);
		font-family: 'Clan W04 Narrow Bold', sans-serif;
		font-size: 1.1rem;
		line-height: 1.3;
		height: 100%;
		margin-top: 10px;
		padding-bottom: 10px;
		padding-left: 10px;
		padding-right: 15px;
		
}

.leistungen p {
		padding-left: 10px;
		font-family: 'Clan W04 Narrow Bold', sans-serif;
		color: #26327C;
		}

.leistungen h3{
	margin-bottom: 10px;
	padding-left: 10px;
	padding-bottom: 0px;
	color: #D3D800;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
}

.leistung ul{
	padding-right: 10px;
	padding-bottom: 30px;

	
}

.leistungen li{
	list-style: disc;
	padding-bottom: 0.4rem;
    padding-left: -15px;
    margin-left: 32px;
	margin-top: 3px;
	padding-right: 3px;
}


.preis{

	background-color: rgba(12, 186, 240, 0.7);
	color: white;
	padding-bottom: 10px;
	margin-bottom: 20px;
	margin-top: 10px;
}

.preis h3{
	color: white;	
	padding-bottom: 0px;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	}
	
.preis p{
	padding-left: 21px;
	padding-bottom: 5px;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	}

/* MARGIN ANS PADDING */

.mt0 {
    margin-top: 0;
}

.mt1 {
    margin-top: 1rem;
}

.mb0 {
    margin-bottom: 0;
}

.mb1 {
    margin-bottom: 1rem;
}

.pt0 {
    padding-top: 0;
}

.pb0 {
    padding-bottom: 0;
}

.pt1-5 {
    padding-top: 1.5rem;
}

.pb1-5 {
    padding-bottom: 1.5rem;
}

/* TYPO */

html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body,
span {
    font-family: 'Clan W04 Narrow Book', sans-serif;
	font-size: 1.1rem;
}


button
{
    font-family: 'Clan W04 Narrow Bold', sans-serif;
	font-size: 1.3rem;
	margin-top: 2px;
	}

/* Headlines */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Clan W04 Narrow Bold', sans-serif;
	font-weight: 400;
	color: #26327C;
	
}




h1,
.content h1,
.content .is-1 {
    font-size: 3rem;
	color: #26327C;
	
	
}

h2,
.content h2{
    font-size: 2.5rem;
	color: #26327C;
}

h3,
.content h3{
    font-size: 1.75rem;
	color: #26327C;
}


	

.media-content h3 {
    font-size: 1.5rem;
	color: #26327C;
	line-height: 1.8rem;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	font-weight: bold;
	padding-bottom: 0.5rem;
	padding-top: 0.25rem;
		letter-spacing: 0.0rem;


	}
	
	.media-content {
    font-size: 0.9rem;
	padding-bottom: 0.25rem;
	letter-spacing: 0.05rem;
	font-family: 'Clan W04 Narrow Book', sans-serif;
	color: grey;
	}
	
.media-content .title{
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	font-weight: 400;
	padding-top: 5px;
	color: #26327C;
	letter-spacing: 0.03rem;
	}
	

h4 {
    font-size: 1.5rem;
	
}

h5 {
    font-size: 1.25rem;
}

.hero-body .container h1 {
    font-size: 5.5rem;
	line-height: 4.5rem;
	padding-top: 20rem;
	color: white;
}

.hero-body .container h2 {
	font-size: 1.75rem;
	line-height: 2.5rem;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	letter-spacing: 0.15rem;
	color: white;
	}

.content ul ul {
    margin-left: 1em;
}

.navbar {
    transition: transform 1s;
	background-image: linear-gradient(to right, #D3D800 , #a2bc0c);
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	font-size: 1.1rem;
}

.navbar-hidden {
    -ms-transform: translate(0, -100%);
    -webkit-transform: translate(0, -100%);
    transform: translate(0, -100%);
}

.navbar-item,
.navbar-link {
    color: white;
	text-transform: uppercase;
	
}

a.navbar-item:hover,
a.navbar-item.is-active,
.navbar-link:hover,
.navbar-link.is-active {
    color: #26327C;
}

a.navbar-item.is-active {
}

.menu-list a.button {
    padding-bottom: calc(0.375em - 1px);
    padding-left: 0.75em;
    padding-right: 0.75em;
    padding-top: calc(0.375em - 1px);
}

a.tagcloud {
    transition: background-color 0.5s ease;
	font-size: 1.2rem;
}

a.tagcloud:hover {
    background-color: hsl(0, 0%, 71%) !important;
	font-size: 1.2rem;
}


/* HERO */
/*.hero-body {background-color: green;}*/

.hero-body .container {
    margin-top: -20rem;
}

.hero.is-logo .hero-body {
  align-items: center;
}

.hero.is-logo .hero-body > .container {
  flex-grow: 0;
  flex-shrink: 0;
}

.hero.is-logo {
 min-height: 5vh;
 width: 100%;
 padding-left: 2%;
 padding-right: 2%;
}

.hero.is-logo {
	margin-bottom: -6rem;
	}

.herologo-img img {
 display: block;
  margin-left: auto;
  margin-right: auto;
 align-items: center;
 width: 100%;
 max-width: 760px;
 padding-left: 3%;
 padding-right: 2%;
 margin-bottom: 3.25rem;
 margin-top: 3.5rem;
 }
/* CARD */
.card .level {
		background-color: #d3d800;
		color: #26327C;
		font-family: 'Clan W04 Narrow Bold', sans-serif;
		font-size: 0.9rem;
		font-weight: 400;
		padding-left: 8px;
		padding-top: 2px;
	}

.card .level {
    margin-bottom: 0;
}

.level-left {
    padding-left: 0.2em;
}

.card-content {
    padding: 0.4em 0.5em 0.3em 0.5em;
	font-family: 'Clan W04 Narrow Book', sans-serif;
	
}

.is-shadowless {
border: 1px solid #d3d800;}

/* .card h3 {text-decoration: underline;} */

.card h2 {
    padding: 3rem 0.75rem 1rem 0;
}

.card span {
    margin-bottom: 2rem;
}

.card .content {
    padding: 0rem 1rem 0.5rem 1rem;
}

.card .content ul {
    list-style: square;
}

/* BLOG */

.entry-link,
.button,
a,
a i {
    color: #4a4a4a;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.button, a
a i {
color: white;
font-weight: 600;
font-size: 1.2rem;
	border: 0px;
    background-color: #26327C;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
	border-radius: 2rem;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	font-weight: 400;
	letter-spacing: 0.03em;
	}

.entry-link:hover {
    box-shadow: 0 1px 25px 1px rgba(211, 216,0, 0.5);
    -webkit-transform: scale(1.01);
    -ms-transform: scale(1.01);
    transform: scale(1.01);
}

.pt-active {
    box-shadow: 0 1px 25px 1px rgba(211, 216,0, 0.5) !important;
}

.button:hover,
a.tag:hover {
    background-color: #d3d800 !important;
    border-color: transparent !important;
    color: white !important;
    text-decoration: none;

}


.fa,
.fab,
.fal,
.far,
.fas {
    padding: 0 0.25rem 0;
}

a i.fa-facebook:hover {
    color: #3b5998;
}

a i.fa-twitter:hover {
    color: #1da1f2;
}

a i.fa-google-plus:hover {
    color: #db4437;
}

a i.fa-pinterest:hover {
    color: #BD081C;
}

a i.fa-snapchat:hover {
    color: #fffc00;
}

a i.fa-instagram:hover {
    color: #c32aa3;
}

a i.fa-linkedin:hover {
    color: #007bb5;
}

a i.fa-youtube:hover {
    color: #ff0000;
}

a i.fa-pinterest:hover {
    color: #bd081c;
}

a i.fa-whatsapp:hover {
    color: #25d366;
}

a i.fa-tumblr:hover {
    color: #35465d;
}

a i.fa-reddit:hover {
    color: #ff4500;
}

a i.fa-spotify:hover {
    color: #1ed760;
}

a i.fa-vimeo:hover {
    color: #1ab7ea;
}

a i.fa-flickr:hover {
    color: #f40083;
}

a i.fa-soundcloud:hover {
    color: #ff5500;
}

a i.fa-500px:hover {
    color: #0099e5;
}

/* FOOTER */

.footer {
    background-color: #d3d800;
    padding: 3rem;
	padding-bottom: 4rem;
	font-size: 1.1rem;
	
}

.honeypot {
    position: absolute;
    left: -9999px;
}

.media-content h3{
font-size: 1.4rem;
font-weight: 400;
}

.media-content {
font-family: 'Clan W04 Narrow Book', sans-serif;
font-size: 1rem;

}



.grid {
  display: grid;
  list-style: none;
  grid-gap: 1rem;
  line-height: 0;
  grid-template-columns: repeat(1, 1fr);
  grid-auto-flow: dense;
  
}

.grid li {
  position: relative;
  --cols: 1;
  --rows: 1;
  background: #000;
  line-height: 0;
      display: inline;
	  height: 16rem;
  
  
}


	
.grid li:first-child {
  --cols: 2;
  --rows: 2;
  height: 33rem;
}
.grid li:nth-child(5) {
  --cols: 2;
}
.grid li:nth-child(6) {
  --rows: 2;
}
.grid li:nth-child(7) {
  --cols: 2;
}

  
.grid img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all .3s;
  
}


.grid figcaption {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  color: #fff;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  line-height: 1;
  text-align: center;
  background: rgba(0,0,0, .5);
  text-transform: uppercase;
  font-size: .875rem;
  letter-spacing: .125em;
  font-weight: 600;
  
}



.bildtitelklein {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  color: #fff;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  background: rgba(0,0,0, .4);
  text-transform: uppercase;
  font-size: 1.3rem;
  letter-spacing: .03em;
  font-family: 'Clan W04 Narrow Bold', sans-serif;
  font-weight: 400;
  }
  
 .bildtitelklein p{
 border: 3px solid rgba(0,0,0,0);
 
  }
  
.containerreisen {
  position: relative;
  width: 50%;
  font-family: 'Clan W04 Narrow Book', sans-serif;
  }  
  
  

@media screen and (min-width: 45em) {

.column is-one-fifth-desktop{
display: table-cell;
}

.columns is-multiline{
  display: table; /* Make the container element behave like a table */
  width: 100%; 
  }
  
  .grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid li {
    grid-column-start: span var(--cols);
    grid-row-start: span var(--rows);
  }
  
  .grid a {
    padding-bottom: 52.65%;
  }
  .bildtitelklein {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  color: #fff;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  line-height: 1;
  text-align: center;
  background: rgba(0,0,0, .4);
  text-transform: uppercase;
  font-size: 1.7rem;
  letter-spacing: .04em;
  font-weight: 400;
  }
  
  .infobox {
	width: 41%;
	
	float: right;
	margin: 0;
	margin-left: 0px;
	margin-top: -10px;
	background-color: white;	
	color: #273583;
		font-family: 'Open Sans Condensed', sans-serif;
		letter-spacing: 0.01rem;
	line-height: 1.3rem;
	}
	
  .artikeltext {
	width: 56%;
	font-size: 1.1rem;
	margin: 0;
	margin-left: -1px;
	margin-top: -30px;	
	color: black;
		letter-spacing: 0.01rem;

	}
	
	  .artikeltext content{
	  
	color: #273583;
	
	}
	
	  .artikeltext h1,h2,h3,h4,h5,h6{
	color: #273583;
		
	}
}


#page-container {
  position: relative;
  min-height: 100vh;
}

#content-wrap {
  padding-bottom: 2.5rem;    /* Footer height */
}

#footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 2.5rem;            /* Footer height */
  }
  
  
 /* __________________Navi */  

.navbar-item,
.navbar-link {
  color: #4a4a4a;
  
}


a.navbar-item:hover, a.navbar-item.is-active,
.navbar-link:hover,
.navbar-link.is-active {
  background-color: rgba(151,176,36,0.3);
  color: #3273dc;
}


@media screen and (max-width: 768px) {  

.artikeltext {
	width: 100%;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	margin-top: 0px;	

	}

.infobox {
	width: 100%;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	margin-top: -40px;
}
		



  .cookie_container {
  font-size: 0.9rem;
    }
	
    .cookie_btn {
	font-size: 0.9rem;
	  }
	  
  .aktuelletagesfahrten-box .button{
  min-width: 100%;
  font-weight: 200;
   letter-spacing: 0.03em;
  
}

.aktuelletagesfahrten-box{

padding: 25px;
padding-top: 5px;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
	 font-weight: 200;
	
}

.aktuelletagesfahrten h2{

width: 100%;
min-width: 100%;
padding-left: 5px;
padding-top: 5px;
	font-family: 'Clan W04 Narrow Bold', sans-serif;
font-size: 1.3rem;
}

.bildplatzhalter{
	display: none;
	}
}



@media screen and (max-width: 1087px) {

.artikeltext {
	padding-left: 1.5rem;	

	}
	
  .navbar-menu {
    background-color: #d3d800;
    box-shadow: 0 8px 16px rgba(10, 10, 10, 0.1);
    padding: 0.5rem 0;
  }
  .section-centered{
  width: 100%;
  margin-left: 5px;
  margin-right: 5px;
  }
  
  .aktuelletagesfahrten-box .button{
  max-width: 50%;
  font-weight: 400;
  font-family: 'Clan W04 Narrow Bold', sans-serif;
     letter-spacing: 0.03em;
}



.aktuelletagesfahrten h2{
width: 50%;
 font-weight: 600;
}
  .column .is-one-fifth-desktop{
display: table-cell;
}

.columns .is-multiline{
  display: table; /* Make the container element behave like a table */
  width: 100%; 
  }
}

@media screen and (min-width: 1088px) {
  .navbar,
  .navbar-menu,
  .navbar-start,
  .navbar-end {
    align-items: stretch;
    display: flex;
  }
  
  
  }
  a.navbar-item.is-active,
  .navbar-link.is-active {
    color: #273583;
  }
  
 

  }
  