/****************************/
/* LOCAL CSS                */
/****************************/
/* Kopfzeile Hintergrund */
header#header {
  background: url("../images/palmen.jpg");
  border-bottom: #7c4702 solid 3px;

  /*solid 10px 0 #004669;*/
}
h1.site-name:hover {
  background-color: rgba(62, 57, 45, 0.35);
}

.ul-parent-account li {
  background-color: rgba(62, 57, 45, 0.35);
  a {
    color: #fff;
  }
}

/* Body
-------------------------------------------------------------- */
div.d8-fade .w3-mobile {
  display: flex;
  margin-left: auto;
  margin-right: auto;
}
/*
#main-container .main-box > div {
  background: url("../images/beachstrand2.jpg") no-repeat;
  width: 100%;
  min-height: 100%;
}
*/
/* Text elements
-------------------------------------------------------------- */
div.field__label {
  font-size: 1.5em;
}

#block-drupal8-w3css-subtheme-userlogin:hover,
a:hover,
.views-field-nothing h6:hover,
#block-userlogin h2:hover {
  color: #cc6600;
}
/* Standort Überschrift */
h6 {
  line-height: 1.2;
  margin: 2px 0;
}
h4 {
  line-height: 1;
  letter-spacing: 0.5px;
  margin: 2px 0 2px 1px;
}
h2 {
  font-weight: 700;
  font-size: 30px;
}
h1.page-title {
  font-weight: 700;
  font-size: 40px;
  padding: 10px 25px;
  margin: 10px 0;
}
span.views-field-field-privat {
  color: #fff;
}
/*
span.views-field-field-privat span:hover {
  color: #000;
}*/
div.sticks2,
div.sticks {
  a,
  h6 {
    color: #fff;
  }
  .button a {
    color: #000;
  }
  position: relative;
  .button1,
  .button {
    position: absolute;
  }
}

div.sticks2:hover,
div.sticks:hover {
  .views-field-field-privat span,
  a,
  h6 {
    color: #000;
  }
}

/* Header regions
-------------------------------------------------------------- */
#branding-wrapper {
  float: left;
  margin: 40px 0 25px 0;
}
/*
div.logo{
	margin:0 0 0 -20px;;
}
*/
h1.site-name a {
  text-transform: none;
}
.site-name {
  display: inline;
  font-family: "Rock Salt";
  /*font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
  font-weight: bold;*/
  font-size: 2.4em;
  margin: 12px 0 0 0;
  position: relative;
  font-style: normal;
  font-weight: bold;
}

.site-slogan {
  display: block;
  font-family: "Akaya Kanadaka";
  font-size: 1em;
  font-weight: bold;
  position: relative;
  font-style: normal;
  margin: 7px 0 0 5px;

  /*font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;*/
}

/* -- Eingabeeinstellung --------------------------------------*/
/* -- Fieldset --Zeitraum */
div.field--name-field-zeitraum {
  background-color: #cc6600;
  display: inline-block;
}

/* Fußzeile
-------------------------------------------------------------- */
#footer-menu {
  height: 100dvh;
}
#block-fusszeile-menu {
  color: #005a8c;
}

/* Button  ----------------------------------------------------------- */
.form--inline .form-actions {
  clear: none;
}

.button1,
.button {
  display: inline-block;
  padding: 0.5em;
  border: 1px solid #000;
  a {
    color: #000;
  }
  bottom: 1px;
  /*width: 10em;*/
  margin: 0.3em;
  font-size: 10px;
  font-weight: normal;
  background-color: #fff;
  text-align: center;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: inset 3px 3px 18px #aeafb7;
  box-shadow: inset 3px 3px 18px #aeafb7;
}
td.button {
  position: relative;
  top: 10px;
  margin: 0;
}
.button1 {
  width: 8em;
  height: 1.5em;
  font-size: 15px;
}
.button1:hover,
.button:hover {
  -moz-box-shadow: inset 3px 3px 18px #000;
  -webkit-box-shadow: inset 3px 3px 18px #000;
  box-shadow: inset 3px 3px 18px #000;
}
div.sticks .views-field-edit-node {
  align-items: flex-end;
}
/* Bilder
--------------------------------------------------------------*/
.bild-tub {
  width: 120px;
  border-spacing: 2px;
}

/* Border
-------------------------------------------------------------- */

/*.field--name-field-standort,*/
.down-up-standort,
.rahmen,
.down-up,
div.stickers,
div.sticks2,
div.sticks1,
div.sticks {
  padding: 2%;
  margin: 2% 0 3% 0;
  background: #3f3e3a;
  border: 2px solid #fff;
  -moz-border-radius: 10px; /*Firefox*/
  -webkit-border-radius: 10px; /*Safari, Chrome*/
  border-radius: 10px;
  -webkit-box-shadow: 0px 25px 26px -18px #1f1f1f;
  box-shadow: 0px 25px 26px -18px #1f1f1f;
}
.sticks2:hover,
.sticks1:hover,
.sticks:hover {
  -webkit-box-shadow: 0px 0px 0px 0px #fff;
  box-shadow: 0px 0px 0px 0px #fff;
  background-color: #ffda6d;
}
/* Rahmen
---------------------------------------------------------*/
/*div.mitte {
  display: flex;
  justify-content: center;
}*/
/*div.sticks { back
  float: left;
  width: 195px;
  height: 240px;
  margin: 10px 5px 0 0;
  padding: 5px;
}*/
div.sticks {
  float: left;
  width: 195px;
  height: 240px;
  margin: 10px 5px 0 0;
  padding: 5px;
}

div.sticks1 {
  float: left;
  width: 195px;
  height: 350px;

  margin: 20px 5px 0 0;
  padding: 5px;
}
div.sticks2 {
  float: left;
  width: 220px;
  height: 300px;
  margin: 20px 5px 0 0;
  padding: 5px;
}
div.stickers {
  float: right;
  margin: 10px 0 20px 0;
}
div.juicebox-parent,
.sliderform {
  /*float:left;*/
  /*width: 930px;*/
  padding: 5px;
  margin: 0 0 40px 0;
  /* height:500px;*/
  position: relative;
  z-index: 1;
  overflow: hidden;
  /*background-color:#f4f4f4;*/
}
div.juicebox-parent,
.sliderform {
  border: 2px solid #000;
  -moz-border-radius: 10px; /*Firefox*/
  -webkit-border-radius: 10px; /*Safari, Chrome*/
  border-radius: 10px;
  -webkit-box-shadow: 0px 25px 26px -18px #1f1f1f;
  box-shadow: 0px 25px 26px -18px #1f1f1f;
  -webkit-box-shadow: 0px 10px 13px -7px #000000,
    5px 5px 5px 5px rgba(0, 0, 0, 0), -3px 32px 35px 5px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 10px 13px -7px #000000, 5px 5px 5px 5px rgba(0, 0, 0, 0),
    -3px 32px 35px 5px rgba(0, 0, 0, 0.25);
}

.boxplatz {
  padding: 5px;
}
/*-------- Seitenleiste ---------

div.model-rechts{
	display:flex;
}
.model-rechts div.button{
	justify-content:center;
}

*/

/* Maps klein -groß
-------------------------------------------------------*/
.geo iframe {
  width: 200px;
  height: 150px;
}

.down-up {
  display: block;
  margin: 5px;
  padding: 3px;
  width: 205px;
  height: 160px;
  overflow-y: hidden;
  h6 {
    color: #fff;
  }
}
.down-up iframe {
  display: block;
  margin: auto;
  width: 100%;

  overflow-y: hidden;
  border: none;
}

@media (min-width: 989px) {
  div.down-up:hover {
    -moz-transform: translate(-400px, 0px);
    -webkit-transform: translate(-400px, 0px);
    -o-transform: translate(-400px, 0px);
    -ms-transform: translate(-400px, 0px);
    transform: translate(-400px, 0px);
    width: 600px;
    height: 480px;
    position: relative;
    z-index: 6000;
  }
  .down-up-standort {
    position: relative;
    float: right;
    margin: -10em 10em 0 0;
    padding: 1px;
    width: 30px;

    -moz-transform: scale(0.3);
    -webkit-transform: scale(0.3);
    -o-transform: scale(0.3);
    -ms-transform: scale(0.3);
    transform: scale(0.3);
    z-index: 5;
  }
}
@media (max-width: 988px) {
  .site-logo > img {
    display: none;
  }
  div.sticks {
    width: 150px;
  }
  div.element-container-wrapper div.view-frontpage div.view-content {
    text-align: center;
  }
  div.reisebeschreibung {
    text-align: left;
  }
  /* Maps ------------------------------*/
  .geo iframe {
    width: 200px;
    height: 150px;
  }

  .down-up {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    height: auto;
    overflow-y: hidden;
  }
  .down-up iframe {
    display: block;
    margin: auto;
    width: 100%;

    overflow-y: hidden;
    border: none;
  }
}
/*
.down-up iframe:hover{

	width: 100%;
	height:100%;	

}*/

/*
.down-up{ 
	display:block;	
	position: relative;  
	float: right ;
	margin:  -130px -200px -130px 0;
    padding: 5px;
	width: 600px;
	-moz-transform: scale(0.4);
	-webkit-transform: scale(0.4);
	-o-transform: scale(0.4);
	-ms-transform: scale(0.4);
	transform: scale(0.4);
	transition: width 2s;
	z-index: 5;

}
*/

/*
.standort-down-up{    
	margin:  -20px 0 0 0;
	-moz-transform: scale(0.6);
	-webkit-transform: scale(0.6);
	-o-transform: scale(0.6);
	-ms-transform: scale(0.6);
	transform: scale(0.6);

}
*/
.unsichtbar {
  display: none;
}
.unsichtbar:hover {
  display: inline;
}
/*
.down-up-standort:hover,
.down-up:hover{  
	display:block;	
	position: absolute;
	float:left;
	width:600px;
	-moz-transform: scale(1)translate(-350px, 100px);
	-webkit-transform: scale(1)translate(-350px, 100px);
	-o-transform: scale(1)translate(-350px, 100px);
	-ms-transform: scale(1)translate(-350px, 100px);
	transform: scale(1)translate(-350px, 100px);
	z-index: 20;
	/*transition-delay: (20s);
	
}
*/
/* Tabelle
-----------------------------------------------------------*/
td {
  display: table-cell;
  vertical-align: top;
}
.absolut-schwebend {
  position: relative;
  width: 920px;
}
/* Abstände und Anderes
-----------------------------------------------------------*/
h1.reisebeschreibung,
h1.views-label-comment {
  padding: 0;
  margin: 10px auto;
}
div#nav {
  float: none;
}

/* iframe Seitenverhältnisse ändern 9x16
-----------------------------------------------------------

.container-iframe{
	position: relative;
	overflow: hidden;
	width: 100%;
	padding-top: 56.25%;  16:9 Aspect Ratio (divide 9 by 16 = 0.5625) 
	
}

.container-iframe>iframe {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 100%;
} */

/* Rahmen */
/* Design */
div.view-grouping-content > h3,
div.ausgaben table caption,
div.view-grouping > div.view-grouping-header {
  /*Radius*/
  clear: left;
  border: 1px solid #808080;
  /*Safari, Chrome*/
  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -webkit-border-bottom-right-radius: 0px;
  -webkit-border-bottom-left-radius: 0px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  /*schrift Abst�nde */
  font-family: Arial;
  font-size: large;
  padding: 0.4em;
  margin-top: 1em;
}
/* 1. Gruppe */
div.ausgaben table caption,
div.view-grouping > div.view-grouping-header {
  /* Farbe*/
  background: rgb(255, 255, 189);
  background: transparent;
  background: rgba(255, 255, 189, 0.8); /* FF3+,Saf3+,Opera 10.10+,Chrome,IE9*/
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccFFFFBD,endColorstr=#ccFFFFBD); /*IE 5.5-7*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccFFFFBD,endColorstr=#ccFFFFBD)"; /*IE8*/
  zoom: 1;
}
/* 2. Gruppe */
div.view-grouping-content > h3 {
  /* Farbe*/
  background: rgb(233, 132, 28);
  background: transparent;
  background: rgba(233, 132, 28, 0.8); /* FF3+,Saf3+,Opera 10.10+,Chrome,IE9*/
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccE9841C,endColorstr=#ccE9841C); /*IE 5.5-7*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccE9841C,endColorstr=#ccE9841C)"; /*IE8*/
  zoom: 1;
  /*Radius*/
  -moz-border-radius: 0px; /*Firefox*/
  -webkit-border-radius: 0px; /*Safari, Chrome*/
  border-radius: 0px;
  margin-top: 0.3em;
  font-size: medium;
}
/* 3. Gruppe */
div.view-grouping-content
  > div.view-grouping
  > div.view-grouping-content
  > div.view-grouping
  > div.view-grouping-header {
  /* Farbe*/
  background: rgb(152, 245, 255);
  background: transparent;
  background: rgba(152, 245, 255, 0.8); /* FF3+,Saf3+,Opera 10.10+,Chrome,IE9*/
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccBEDCA7,endColorstr=#ccBEDCA7); /*IE 5.5-7*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccBEDCA7,endColorstr=#ccBEDCA7)"; /*IE8*/
  zoom: 1;
  /*Radius*/
  -moz-border-radius: 0px; /*Firefox*/
  -webkit-border-radius: 0px; /*Safari, Chrome*/
  border-radius: 0px;
  margin-top: 0.1em;
  font-size: medium;
}