@import '../fonts/font-awesome.css';
@import 'jquery-ui-1.10.3.custom.css';
@import 'photoswipe.css';
@import 'tm3DCircleCarousel.css';
@import 'tmMultimediaGallery.css';
@import 'superfish.css';
/*@import url(//fonts.googleapis.com/css?family=Yesteryear);*/
/*@import url(//fonts.googleapis.com/css?family=Asap:400,700);*/

/* yesteryear-regular - latin */
@font-face {
  font-family: 'Yesteryear';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/yesteryear-v6-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Yesteryear'), local('Yesteryear-Regular'),
       url('../fonts/yesteryear-v6-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/yesteryear-v6-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/yesteryear-v6-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/yesteryear-v6-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/yesteryear-v6-latin-regular.svg#Yesteryear') format('svg'); /* Legacy iOS */
}

/* asap-regular - latin */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/asap-v7-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Asap Regular'), local('Asap-Regular'),
       url('../fonts/asap-v7-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       /*url('../fonts/asap-v7-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       /* Line commented out by seitenmacher.net. There seems to be some problem with the 'woff2'
	  files. That causes the following warnings:

		(index):1 Failed to decode downloaded font: http://www.galerie-derendorf.eu/fonts/asap-v7-latin-regular.woff2
		(index):1 OTS parsing error: invalid version tag

	   But the other formats are sufficient to display the site correctly. Though much research has been done,
 	   no solution could be found so far.
	*/
       url('../fonts/asap-v7-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/asap-v7-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/asap-v7-latin-regular.svg#Asap') format('svg'); /* Legacy iOS */
}
/* asap-700 - latin */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/asap-v7-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Asap Bold'), local('Asap-Bold'),
       url('../fonts/asap-v7-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       /* url('../fonts/asap-v7-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       /* Line commented out by seitenmacher.net. There seems to be some problem with the 'woff2'
	  files. That causes the following warnings:

		(index):1 Failed to decode downloaded font: http://www.galerie-derendorf.eu/fonts/asap-v7-latin-700.woff2
		(index):1 OTS parsing error: invalid version tag

	   But the other formats are sufficient to display the site correctly. Though much research has been done,
 	   no solution could be found so far.
	*/
       url('../fonts/asap-v7-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/asap-v7-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/asap-v7-latin-700.svg#Asap') format('svg'); /* Legacy iOS */
}

/*------ template stylization ------*/
body {
  color: #383838;
  font: 13px/20px Arial, Helvetica, sans-serif;
  height: 100vh; /* 
                    Added by seitenmacher.net
		    To prevent the carousell from
		    jumping up while the zoom into
		    an image takes place, the page
		    (gallery) needs to have the same
		    size as the zoomed in image page.
		    Since these are always filling the
		    screen, the size we need here is
		    100% of the visible space (vh =
		    viewport height). Original value:
		    100%
		 */
  position: static;
  overflow-y: scroll; /*
                         Added by seitenmacher.net.
			 Removing the scrollbar causes
			 the image caroussell to "jump"
			 to the right.
		      */
  min-width: 0 !important;
  background: url(../img/bg_body.png) 0 0 repeat #efefef !important;
}
p {
  margin-bottom: 19px;
}
address {
  margin-bottom: 16px;
}
* {
  -webkit-text-size-adjust: none;
}
a,
a:focus,
a:active {
  text-decoration: none;
  outline: none;
}
a {
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  color: inherit;
}
a:hover {
  text-decoration: none;
  color: #af1f74;
}
.color1 {
  color: #af1f74;
}
.color1:hover a {
  color: #383838;
}
a.color1:hover {
  color: #383838;
}
a[href^="tel:"] {
  color: inherit;
  text-decoration: none;
}
#webSiteLoader {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 9999;
  background: url(../img//base/site_loader.gif) 50% 50% no-repeat #ffffff;
}
/*------------- LISTS ---------------------------------------------------------- */
ul,
ol {
  list-style: none;
  padding: 0;
  margin: 0;
}
/*------------- HEADS ---------------------------------------------------------- */
h1,
h2,
h3,
h4,
h5 {
  padding: 0 !important;
  margin: 0 !important;
  font-family: 'Yesteryear', cursive;
  color: #383838;
}
h2 {
  font-size: 66px;
  margin-top: 0px !important;
  line-height: 62px;
  margin-bottom: 20px !important;
}
h2 span {
  display: block;
  font-size: 43px;
  margin-top: -4px;
  padding-bottom: 5px;
}
h4 {
  font: 12px/18px 'Asap', sans-serif;
}
/*------------- HEADER ---------------------------------------------------------- */
header {
  position: relative;
  z-index: 900;
  margin-bottom: 0px;
}
header .brand {
  text-align: center;
}
header .brand a {
  display: inline-block;
}
.h_wrapp {
  height: 841px;
  position: relative;
  z-index: 999;
}
/*---------------- HEADER end ------------------------------------------------*/
/*-------------- FOOTER ---------------------------------------------------- */
footer {
  width: 100%;
  padding: 33px 0 19px;
  text-align: center;
  color: #716f6f;
  position: relative;
  z-index: 990;
  font: 12px/18px 'Asap', sans-serif;
}
.follow-links {
  margin-bottom: 11px;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  position: relative;
}
.follow-links li {
  display: inline-block;
}
.follow-links li + li {
  margin-left: 7px;
}
.follow-links li + li a {
  background-position: -31px 0;
}
.follow-links li + li + li a {
  background-position: -63px 0;
}
.follow-links li a {
  display: block;
  background: url(../img/socials.png) 0 0 no-repeat;
  width: 24px;
  height: 24px;
}
.follow-links li a:hover {
  opacity: 0.5;
}
/*-----------  FOOTER END  ------------------------------------------------------*/
/*-----------  MENU  ------------------------------------------------------------*/
/*-----------  menu end  --------------------------------------------------------*/
/*----------- classes -----------------------------------------------------------*/
.extra_wrapper {
  overflow: hidden;
}
.mb0 {
  margin-bottom: 0 !important;
}
.p1 {
  margin-bottom: 22px;
}
.clear {
  clear: both;
  overflow: hidden;
}
/*----------- Gallery ------------------------------------------------------------*/
#gallery {
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
  z-index: 999;
  background: url(../img/bg_body.png) 0 0 repeat;
}
/*-----------  CONTENT HOLDER  --------------------------------------------------*/
#glob-wrap {
  width: 100%;
  height: 100%;
  overflow: none; /* adapted by seitenmacher.net | original value: hidden */
  position: relative;
}
#content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: auto !important;
}
#content > div {
  display: block !important;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.splashHolder {
  position: relative;
  z-index: 0 !important;
}
.padding1 {
  position: relative;
  padding: 58px 100px 53px;
}
.padding1.padding2 {
  padding-bottom: 68px;
}
.padding1.padding3 {
  padding-bottom: 56px;
}
.pageBg {
  background-color: #fff;
  color: #383838;
  font: 13px/19px 'Asap', sans-serif;
}
#gallery {
  z-index: 999;
}
#other_pages {
  display: block;
  left: 0;
  position: static;
  min-height: 65%; /* adapted by seitenmacher.net | original value: 650px */
  width: 100%;
  padding-top: 38px;
}
#other_pages > div {
  width: 100%;
  position: relative;
  display: none;
}
.activeSubPage {
  /*z-index: 998;*/
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.textAlignCenter {
  text-align: center;
}
.textAlignJustify {
  text-align: justify;
  text-justify: inter-word;
}
.imageStyle1 {
  margin-bottom: 34px;
  max-width: 100%;
}
#ajax-overlay {
  width: 100%;
  height: 100%;
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  right: 0;
  background: url(../img/base/TMpreviewLoader.gif) 0 0 repeat-x;
}
.closeIcon {
  position: absolute;
  top: 0px;
  right: -50px;
  cursor: pointer;
  width: 72px;
  height: 72px;
  overflow: hidden;
  z-index: 999 !important;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
.closeIcon.closeIconGallery {
  top: auto;
  right: 20%;
  bottom: 10px; /* adapted by seitenmacher.net | original value: 31px */
  border-radius: 500px;
  background-color: #af1f74;
  width: 59px;
  height: 59px;
}
.closeIcon.closeIconGallery:after {
  text-align: center;
  content: 'Ende';
  position: absolute;
  width: 100%;
  color: #000;
  height: 100%;
  top: 0;
  background: none;
  left: 0;
  font: bold 18px/57px 'Asap', sans-serif;
}
.closeIcon.closeIconGallery:hover:after {
  background: #ffffff;
  color: #000000;
}
.closeIcon.closeIconGallery:hover {
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}
.closeIcon:after {
  content: '';
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background: url(../img/close_icon.png) left top no-repeat #000000;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
.closeIcon:hover {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  text-decoration: none;
}
.closeIcon:hover:after {
  background: url(../img/close_icon.png) right top no-repeat #000000;
}
.pageBg .closeIcon {
  right: 0;
  top: 0;
  border-radius: 0 !important;
}
.pageBg .closeIcon:after {
  width: 100%;
  height: 100%;
}
.pageBg .closeIcon:hover {
  opacity: 0.5;
}
/*-------------------------- Map ----------------------------*/
.map figure {
  display: block;
  width: 100%;
  height: 230px;
  margin-bottom: 34px;
}
.map figure iframe {
  border: 0;
  width: 100%;
  height: 100%;
}
.map .address1 {
  float: left;
  margin-bottom: 0;
}
.map .address1 dl {
  margin-bottom: 0 !important;
}
.map .address1 dl,
.map .address1 dt,
.map .address1 dd {
  line-height: 19px;
}
.map .address1 dt {
  font-weight: normal;
}
.map .address1 dd span {
  display: inline-block;
  min-width: 70px;
}
.map .address1 + .address1 {
  margin-left: 68px;
}
/*--------------------------Blocks--------------------------*/
.block1 {
  overflow: hidden;
  float: left;
  width: 270px;
}
.block1 .fa {
  color: #fff;
  border-radius: 500px;
  background-color: #af1f74;
  float: left;
  width: 96px;
  height: 96px;
  text-align: center;
  line-height: 96px;
  font-size: 53px;
  margin-right: 15px;
}
.block1 + .block1 {
  margin-left: 29px;
}
.block1 .extra_wrapper {
  padding-top: 1px;
}
.block1 .p1 {
  margin-bottom: 20px;
}
.block1 + .clear {
  height: 28px;
}
/*-------------------------- End Map ----------------------------*/
/*-------------------------- 404 ----------------------------*/
.pnf {
  width: 300px;
  float: left;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  color: #383838;
  font: 43px/45px 'Yesteryear', cursive;
  padding: 99px 0 0;
  position: relative;
}
.pnf .color1 {
  padding-top: 72px;
  font-size: 153px;
  display: block;
  margin-bottom: 60px;
}
.err h2 {
  padding-top: 44px !important;
}
#search {
  margin-top: 24px;
  position: relative;
  top: 6px;
}
#search input {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font: 13px/20px 'Asap', sans-serif;
  color: #383838 !important;
  width: 100%;
  height: 38px;
  border: 1px solid #ebebeb;
  padding: 9px 16px 9px;
  overflow: none !important;
}
#search input:focus {
  outline: none;
}
#search a {
  display: block;
  float: left;
  margin-top: 4px;
  color: #383838;
  font: 30px/30px 'Yesteryear', cursive;
}
#search a:hover {
  color: #af1f74;
}
.search {
  font: 12px/18px 'Asap', sans-serif;
  font-weight: bold;
  color: #af1f74;
}
.search_list {
  list-style: decimal;
}
.search_result {
  color: #af1f74;
}
/*-------------------------- End 404 ----------------------------*/
@media (min-width: 1221px) {
  .container {
    padding-left: 0px;
    padding-right: 0px;
    margin-top: 12px; /* added by seitenmacher.net */
  }
}
@media only screen and (max-width: 991px) {
  .block1 {
    float: none;
    width: auto;
    margin-bottom: 20px;
    margin-left: 0 !important;
  }
  .block1 + .clear {
    height: auto;
  }
}
@media only screen and (max-width: 767px) {
  .map .address1 {
    float: none;
    margin-left: 0 !important;
  }
  .map .address1 + .address1 {
    margin-top: 20px;
  }
  .padding1 {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media screen and (max-height: 768px) {
  .splashHolder {
    -webkit-transform: scale(0.6, 0.6);
    -ms-transform: scale(0.6, 0.6);
    transform: scale(0.6, 0.6);
    top: 100px;
  }
  .fullscr-btn {
    right: 27%; /* adapted by seitenmacher.net | original value: 25% */
  }
  #galleryDescription li p {
    margin: 29px 38px 0px 145px;
  }
  #other_pages {
    /* min-height: 400px; | removed by seitenmacher.net. Causes image caroussell
                           to move up and down when menus with different heights
                           are selected (ajax pages with different heights).
    */  
  }
}
/*-------------------------- tablet styles ----------------------------*/
html.tablet #prevButton {
  left: 10px;
}
html.tablet #nextButton {
  left: 15px;
}
html.tablet .fullscr-btn {
  display: none !important;
  visibility: hidden;
}
html.tablet .closeIcon.closeIconGallery {
  right: 10px;
  bottom: 110px; /* adapted by seitenmacher.net | original value: 10px */
}
html.tablet #galleryDescription {
  height: 85px !important; /* adapted by seitenmacher.net | original value: 110px */
}
html.tablet #galleryDescription li {
  right: 0;
}
html.tablet #galleryDescription li p {
  margin-left: 30px !important;
  font-size: 14px;
  margin-right: 100px !important;
}
@media screen and (orientation: landscape) {
  html.tablet .splashHolder {
    top: 80px;
  }
  html.tablet .brand {
    -webkit-transform: scale(0.6, 0.6);
    -ms-transform: scale(0.6, 0.6);
    transform: scale(0.6, 0.6);
  }
}
html.tablet #galleryDescription li p {
  margin-left: 0px !important;
}
@media screen and (orientation: portrait) {
  .splashHolder {
    -webkit-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    top: 70px;
  }
  .brand {
    -webkit-transform: scale(0.8, 0.8);
    -ms-transform: scale(0.8, 0.8);
    transform: scale(0.8, 0.8);
  }
  #other_pages {
    min-height: 65%; /*| removed by seitenmacher.net. This causes the image
			   caroussell to move up and down when menus with
			   different heights are selected (ajax pages with
			   different heights).*/
    
  }

  #galleryContainer #galleryDescription li {
    right: 0;
  }
  #galleryContainer #galleryDescription li p {
    position: relative;
    top: -10px;
    margin-left: 40px !important;
    margin-right: 70px !important;
  }
}
@media screen and (orientation: portrait) {
  html.tablet.android header #galleryDescription li p {
    padding-left: 3330px !important;
    margin-right: 70px !important;
  }
}
/*-------------------------- end tablet styles ----------------------------*/
/*-------------------------- mobile styles ----------------------------*/
html.mobile #mobile-wrap #mobile-header {
  padding: 20px 0;
}
html.mobile #mobile-wrap #mobile-header #mobile-navigation {
  width: 90%;
  margin: 20px auto;
  display: block;
  font-size: 16px;
}
html.mobile #mobile-wrap #mobile-content > div {
  display: block;
}
html.mobile #mobile-wrap #mobile-footer {
  text-align: center;
  color: #716F6F;
  padding: 20px 0;
}
html.mobile .brand {
  -webkit-transform: scale(0.6, 0.6);
  -ms-transform: scale(0.6, 0.6);
  transform: scale(0.6, 0.6);
}
html.mobile .splashHolder {
  position: static;
  -webkit-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  transform: scale(1, 1);
}
html.mobile .splashHolder .splashControls {
  display: none;
}
html.mobile .splashHolder .splash {
  position: static;
  height: auto;
}
html.mobile .splashHolder .splash li {
  margin-left: 0px;
  text-align: center;
  position: static;
  padding: 5px;
}
html.mobile .splashHolder .splash li a {
  position: static;
  background: none;
}
html.mobile .splashHolder .splash li img {
  max-width: 90%;
  opacity: 1;
  display: inline-block;
  width: auto !important;
  height: auto !important;
}
.ie10 .fullscr-btn {
  display: none !important;
}
/*-------------------------- end mobile styles ----------------------------*/
/*Core variables and mixins*/

/*added by seitenmacher.net*/
div#table_container_image {
	width: 100%;
	height: 300px;
	overflow: auto;
}

div#table_container_privacy {
	width: 100%;
	height: 300px;
	overflow: auto;
}

div#table_container_music {
	width: 100%;
	height: 300px;
	overflow: auto;
}

div#table_container_services {
	width: 100%;
	height: 300px;
	overflow: auto;
}

div#table_container_cds {
	width: 100%;
	height: 300px;
	overflow: auto;
}

table#image_overview {
	width: 100%;
	border-collapse: separate;
	border-spacing: 5px;
}

table#music_overview {
	width: 100%;
	border-collapse: separate;
	border-spacing: 5px;
}

table#services_overview {
	width: 100%;
	border-collapse: separate;
	border-spacing: 5px;
}

table#image_overview td {
	text-align: center;
}

table#image_overview th {
	text-align: center;
	background-color: #dcdcdc;
}

table#cds {
	max-width:none;
	width: 100%;
	border-collapse: separate;
	border-spacing: 5px;
}

table#cds td {
	text-align: center;
}

table#cds th {
	text-align: center;
	background-color: #dcdcdc;
}

#services_overview tr:nth-child(even) {
	background-color: #dddddd;
}

.textAlignLeft {
	text-align: left;
}

.boldText {
	font-weight: bold;
}