/* roboto-regular - vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/roboto/roboto-v30-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto/roboto-v30-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto/roboto-v30-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto/roboto-v30-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto/roboto-v30-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto/roboto-v30-vietnamese_latin-ext_latin_greek-ext_greek_cyrillic-ext_cyrillic-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* arvo-regular - latin */
@font-face {
  font-family: 'Arvo';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/arvo/arvo-v20-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/arvo/arvo-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/arvo/arvo-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/arvo/arvo-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/arvo/arvo-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/arvo/arvo-v20-latin-regular.svg#Arvo') format('svg'); /* Legacy iOS */
}


* {
  font-family: 'robotolight', sans-serif;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
  color: #777;
}
.footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 40px;
  line-height: 40px; /* Vertically center the text there */
  background-color: #d5e7e7;
}
  
  
/* Custom page CSS
  -------------------------------------------------- */
/* Not required for template or sticky footer method. */
body > .content {
  padding: 80px 15px 0;
}
.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

.showMouse {
	cursor: pointer;
}

/* Menü */
.navbar {
  margin: 0;
  padding: 0;
}
.nav-item {
  padding-top: 15px;
  margin: 0 50px 0 25px;
}
.nav-link {
  color: #777 !important;
}
.nav-item:hover,
.active {
  background: url(images/menu-aktiv.png) no-repeat 50% 0;
}

/* Toggler */
.navbar-toggler-rathaus {
  background-color: #7bb0af;
  margin: 15px;
}

/* Jumbotron */
.jumbotron-rathaus {
  padding: 20px 0; 
  background-color: #7bb0af;
}
.jumbotron-image-rathaus {
  position: absolute;
  width: 190px;
  top: 72px;
  right: 0;
  margin: 0;
  padding: 0;
}
.jumbotron-image-kreis {
  position: absolute;
  width: 190px;
  top: 120px;
  left: 25px;
  margin: 0;
  padding: 0;
}

/* Kontaktinfo */
.kontaktinfo {
  position: fixed; 
  bottom: 40px; 
  right: 20px;
}
h4 {
  font-family: 'robotomedium', sans-serif;
  display: flex;
  flex-direction: row-reverse;
  text-transform: uppercase;
}
h4:before, h1:after{
  content: "";
  flex: 1 1;
  border-bottom: 2px solid #df5a30;
  margin: auto;
}
h4:before {
  margin-right: 10px;
  margin-left: 20px;
}
h4:after {
  margin-left: 100px
}
.callme {
  font-family: 'robotomedium', sans-serif;
  color: #df5a30;
}
.mailme,
.ratversal {
  font-family: 'robotomedium', sans-serif;
  color: #000;
}


/* Bubble links */
.kreis {
  position: absolute;
  margin-left: -500px;
  margin-top: -100px;
}

/* Text */
.pageheader {
  font-size: 3rem;
  font-family: 'Arvo', sans-serif !important;
  color: #fff;
  margin: 0;
}
.pageheaderbold {
  font-size: 3rem;
  font-family: 'Arvo', sans-serif !important;
  font-weight: bold;
  margin: 0;
}
.pagetitle {
  color: #df5a30;
  font-family: 'Arvo', sans-serif !important;
  line-height: 1.4;
}
.pagetitlebold {
  font-family: 'Arvo', sans-serif !important;
  font-weight: bold;
}
.pagelead {
  font-size: 20px;
}
.pageleadbold {
  font-weight: bold;
}
.pagetextmiddle {
  color: #df5a30;
  font-family: 'Arvo', sans-serif !important;
  font-size: 18px;
  line-height: 1.25em;
}
.zitat {
  color: #df5a30;
  font-size: 18px;
  font-size: 0.9rem;

}

@media only screen and (max-width: 1680px) {
  .kontaktinfo {
    position: relative; 
    bottom: 0; 
    right: 0;
  }
}

@media only screen and (max-width: 768px) {
  .modal {
    display: none !important;
  }
  .modal-backdrop.show {
    opacity: 0 !important;
  }
}

@media only screen and (max-width: 640px) {
  .pageheader,
  .pageheaderbold {
    font-size: 1.6rem;
  }
  .pageheader {
    width: 150px;
  }
  .nav-item:hover,
  .active {
    background: none !important;
  }
  #impressumimage > img,
  #datenschutzimage > img,
  #anfahrtimage > img,
  #collapseBeratungImage > img,
  #collapseKinderImage > img,
  #collapseReflexeImage > img,
  #collapseKinderklangImage > img,
  #collapseEnergieMassageImage > img,
  #collapseRueckenDeluxeMessageImage > img,
  #collapseTahiFussmassageImage > img,
  #collapseHonigMassageImage > img,
  #collapseKraeuterstempelMassageImage > img,
  #collapseGesichtsMassageImage > img {
    visibility: hidden;
    width: 0px;
    height: 0px;
  }
}