@font-face 
{ 
  font-family: DejaVuSans; 
  src: url('../fonts/DejaVuSans.ttf');
}
@font-face 
{ 
  font-family: DejaVuSansBold; 
  src: url('../fonts/DejaVuSans-Bold.ttf');
}
@font-face 
{ 
  font-family: DejaVuSansCondensedBold; 
  src: url('../fonts/DejaVuSansCondensed-Bold.ttf');
}
body 
{ 
  color: #fff;
  margin: 0;
  padding: 0;
  background-color: #645552;
  font-family: 'DejaVuSans', sans-serif;
}

img{ width: 100%; }

.wrapper{
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 20px;
  width: 100%;
}

main section{
  padding: 75px 0;
}
main section.innerPage{ 
  font-size: 14px;
  margin-top: 85px; 
}
main section.dark{ background-color: #443f3e; }
main section h2 {
  text-align: center;
  text-transform: uppercase;
  font-family: DejaVuSansBold, sans-serif;
  font-weight: bold;
  font-size: 24px;
  letter-spacing: 1px;
  transform: scaleX(0.9) scaleY(1.15);
}
section .line
{
  margin: 10px auto 55px;
  position: relative;
  width: 125px;
  height: 3px;
  background-color: #ffff00;  
}

 #topBar 
 {   
   padding: 5px;   
   text-align: center;
   width: 100%;
 }

.menuButton 
{
  display: inline-block;
  vertical-align: top;
  width: 165px;
  float: left;
  text-align: left;
}

.menuButton img
{ 
  max-width:54px;
  cursor: pointer;
}

.menuButtonMobile
{   
  width: 100%;
  text-align: center;
  background-color: #443f3e;
  border-top: 3px solid #333333;
  border-bottom: 3px solid #333333;
  display: none;
}

.menuButtonMobile img
{ 
  max-width: 54px;
  cursor: pointer;
}

.socialButtons, .socialButtonsTop
{
  display: inline-block;
  vertical-align: top;
  width: 165px;
  float: right;
  text-align: right;
}
.socialButtons a img, .socialButtonsTop a img
{
  padding: 0px;
  border: 0px none;
}
.socialButtons a:hover, .socialButtonsTop a:hover
{
  opacity: 0.7;
}

.logo
{
  margin:0 auto; 
  display: inline-block;
  margin-top: 25px;
}

.logo img 
{
  max-width:210px;
}
.socialButtons img, .socialButtonsTop img
{
  max-width:53px;
}

#navigationContainer
{
  margin-top: 25px;
  width: 100%;
  text-align: center;
}

.navigationContainer
{
  display: block;
}

.navigation
{
  margin: 0 auto;
  max-width: 940px;
  border-top: 1px solid #584d4a;
  border-bottom: 1px solid #584d4a;
  padding: 0px;
  padding-top: 8px;
  padding-bottom: 1px;  
}

.navigation .list-group
{
  background-color: #645552;  
  white-space: nowrap;
  list-style-type: none;
  margin: 0px;
  padding: 0;
  overflow: hidden;
  flex-direction: inherit;
  display: inline-block;
  margin-top: 2px;
  padding-top: 9px;
}
.navigation .list-group-item:first-child {
  border-top-left-radius: 0rem;
  border-top-right-radius: 0rem;
}
.navigation .list-group .list-group-item {    
  position: relative;
  display: inline-block;  
  background-color: #645552;
  border: 0px none;
  text-transform: uppercase;
  color: #ffffff;
  font-family: DejaVuSansBold, sans-serif;
  font-weight: bold;
  font-size: 19px;
  line-height: 0cm;
  letter-spacing: 1px;
  height: 14px;
  transform: scaleX(0.85) scaleY(1.22);
  margin:0 5px 5px 0;
  padding: 0px;
  padding-left: 0px;
  padding-right: 0px;
}
.navigation .list-group .list-group-item a
{
  color: #ffffff;
  text-decoration: none;
  padding-bottom: 2px;
}
.navigation .list-group .list-group-item .selected
{
  color: #ffffff;
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 4px solid #ffff00;
}

.navigation .list-group .list-group-item a:hover
{
  color: #ffffff;
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 4px solid #ffff00;
}

ul
{
  margin: 0px;
  padding: 0px;
  margin-block-start: 0em;
  margin-block-end: 0em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 0px;
}

.imageMenuItem
{
  width: 300px;
  height: 300px;
  background-color: #584d4a;
  padding: 3px;  
  display: inline-block;
  position: relative;
}

.imageMenuItem img
{
  margin-top: 1px;
  width: 100%;
  height: 100%;
}

#imageMenuItemParent
{  
  width: 100%;
  text-align: center;
}

#imageMenuItemContainer
{
  margin-top: 50px;
  position: relative;  
}

.imageMenuButton
{ 
  background: rgba(0, 0, 0, 0.53);
  display: inline-block;
  position: absolute;
  height: 45%;
  width: 232px;
  top: 35%;
  left: 14%;
  text-align: center;  
  padding: 10px;
  cursor: default;
}

.imageMenuButtonHover
{
  background: rgba(0, 0, 0, 0.73);
  display: inline-block;
  position: absolute;
  height: 45%;
  width: 232px;
  top: 35%;
  left: 14%;
  text-align: center;  
  padding: 10px;
  cursor: pointer;
}

.imageMenuButtonText
{
  display: inline-block;
  text-transform: uppercase;
  color: #ffffff;
  font-family: DejaVuSansBold, sans-serif;
  font-weight: bold;
  font-size: 18px;  
  letter-spacing: 1px;
  text-align: left;
  transform: scaleX(0.9) scaleY(1.15);
  line-height: 1;
}

.imageMenuButtonTextHover
{
  display: inline-block;
  text-transform: uppercase;
  color: #cccccc;
  font-family: DejaVuSansBold, sans-serif;
  font-weight: bold;
  font-size: 19px;  
  letter-spacing: 1px;
  text-align: left;
  transform: scaleX(0.9) scaleY(1.15);
  line-height: 1;
}

.text0
{
  margin-top: 20px;
}

.text1
{
  margin-top: 30px;
  margin-left: -7px;
}

.text2
{
  margin-top: 30px;
  margin-left: 5px;
}

.imageMenuButtonImg
{
  position: absolute;
  width: calc(100% - 7px);
  height: calc(100% - 7px)
}

.imageMenuButtonArrow
{
  position: absolute;
  bottom: 5px;
  right: 10px;
}

.imageMenuButtonArrow img 
{
  width: 5px;
  height: 7px;  
}

.imageMenuButtonFrame
{
  position: absolute;
  width: 260px;
  height: 260px;
  text-align: center;  
}

.separator
{
  position: relative;
  width: 100%;
  text-align: center;  
}

.separator h2
{
  text-transform: uppercase;
  color: #ffffff;
  font-family: DejaVuSansBold, sans-serif;
  font-weight: bold;
  font-size: 24px;  
  letter-spacing: 1px;
  transform: scaleX(0.9) scaleY(1.15);
}


#ContactAddress .cText0
{
  color: #ffffff;
  font-family: DejaVuSansBold, sans-serif;
  font-size: 24px;
  padding-left: 10px;
  margin-left: 0px;
}

#ContactAddress .cText1
{
  color: #f8c600;
  font-family: DejaVuSansBold, sans-serif;
  font-size: 20px;
  text-transform: uppercase;
  padding-left: 10px;
  margin-left: 0px;
}

#ContactAddress .cText2
{
  color: #dfdfdf;
  font-family: DejaVuSans, sans-serif;
  font-size: 14px;  
  padding-left: 10px;
  margin-left: 0px;
}

#ContactAddress .cText3
{
  color: #dfdfdf;
  font-family: DejaVuSans, sans-serif;
  font-size: 14px;  
  margin-left: 0px;
  display: inline-block;
}

#ContactAddress .cImgText .cImg
{
  display: inline-block;
  margin-left: 0px;
  text-align: left;
}

#ContactAddress .cImgText .cImg img
{
  width: 38px;  
}

#ContactAddress .cText4
{
  color: #dfdfdf;
  font-family: DejaVuSans, sans-serif;
  font-size: 14px;  
  transform: scaleX(0.9) scaleY(1.0);
  margin-left: 0px;
  display: inline-block;
}

#ContactAddress .cText5
{
  color: #dfdfdf;
  font-family: DejaVuSans, sans-serif;
  font-size: 14px;  
  transform: scaleX(0.9) scaleY(1.0);
  margin-left: -5px;
  display: inline-block;
}

#ContactAddress 
{
  line-height: 1.2;
}

#emailAddress 
{
  margin-top: 10px;
}

#faxNumber
{
  margin-top: -10px;
}

#Contact .subTitle
{
  font-family: DejaVuSans, sans-serif;
  font-weight: normal;
  font-size: 14px;  
  letter-spacing: 1px;
  transform: scaleX(0.9) scaleY(1.15);
  text-align: center;
}
#Contact form{
  max-width: 365px;
  margin: 0 auto;
}

.noteText
{
  font-family: DejaVuSans, sans-serif;
  font-size: 11px;  
  letter-spacing: 1px;
  transform: scaleX(0.9) scaleY(1.15);
  text-align: center;
  margin-top: 70px;
}

#contactContainer
{
  margin:0 auto;
  width: 100%;
  text-align: center;
}

#contactContainer .container .form
{
  max-width: 400px;
}

#Impressum{
  text-align: center;
  font-size: 14px;
}

#Footer
{  
  padding: 40px 0;
  background-color: #443f3e;
  font-family: DejaVuSans, sans-serif;
  font-weight: normal;
  font-size: 14px;
  line-height: 1.6;
  text-align: center;
}

#Footer .socialButtons
{
  position: relative;
  display: block;
  vertical-align: top;
  width: 165px;
  float: none;
  text-align: center;
  margin: 0 auto;
  margin-top: 18px;
}

#Footer a
{
  text-transform: uppercase;
  color: #ffffff;
  font-family: DejaVuSansBold, sans-serif;
  font-weight: bold;
  font-size: 14px;  
  letter-spacing: 0px;
  transform: scaleX(0.9) scaleY(1.15);
}

#Footer a:hover
{
  text-transform: uppercase;
  color: #ffffff;
  font-family: DejaVuSansBold, sans-serif;
  font-weight: bold;
  font-size: 14px;  
  letter-spacing: 0px;
  transform: scaleX(0.9) scaleY(1.15);
  border-bottom: 2px solid #ffff00;
  text-decoration: none;
}

#Contact .btn-primary
{
  border: 0px none;
  border-radius: 0px;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
}


.btn-contact {
  color: #000000;
  background-color: #e0b410;
  width: 100%;
  text-transform: uppercase;
  font-family: DejaVuSansBold, sans-serif;
  font-weight: bold;
  font-size: 20px;  
  letter-spacing: 0px;
  transform: scaleX(1.0) scaleY(1.2);
  height: 54px;
  margin-top: 20px;
}

.btn-contact:hover, 
.btn-contact:active
{
  color: #000000 !important;
  background-color: #bbbbbb !important;
  border: 0px none !important;
  box-shadow: none !important;
}

.btn-contact:focus
{
  border: 0px none !important;
  box-shadow: none !important;
}

#Contact .form input[type=text], 
#Contact .input-group-prepend,
#Contact .input-group-text
{
  background-color: #4a4342 !important;
  color: #ffffff;
  font-family: DejaVuSans, sans-serif;
  font-weight: bold;
  font-size: 22px;  
  letter-spacing: 0px;
  transform: scaleX(1.0) scaleY(1.0);
  height: 75px;
  border: 0px none;
  border-radius: 0px;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  background-clip: none;
  border-bottom: 3px solid #333333;  
}

#Contact .input-group-prepend
{
  padding: 0px;
  margin: 0px;
  height: 20px;
}

#Contact .input-group-text
{
  background-color: #4a4342 !important;
  border: 0px none;
  border-radius: 0px;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-bottom: 3px solid #333333;    
}

#Contact .form input[type=text]:focus
{
  /*box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 255, 0, 0.6);*/
  box-shadow: none;  
  outline: 0 none;
}

.form #clientName
{
  margin-top: -10px;
}

.gallery-item{
  background-color: rgba(0, 0, 0, 0.3);
  margin-bottom: 20px;
  padding: 10px 10px 1px;
}
.gallery-item:hover{
  background-color: rgba(0, 0, 0, 0.2);
}
.gallery-item .subimages a{ display: none; }

.gallery-item h3{
  font-size: 12px;
  font-weight: 400;
  margin: 13px 0;
  font-family: DejaVuSans, sans-serif;
}
.gallery .buttons{
  display: flex;
  justify-content: center;
}

.sl-wrapper .sl-navigation button {
  color: #ffffff;
}

.sl-overlay {
  background-color: rgb(0, 0, 0, 0.95);
}

.sl-wrapper .sl-close, .sl-wrapper .sl-counter {
  color: #ffffff;
}

#lastGalleryPageBtn, #nextGalleryPageBtn
{
  border: 0px none;
  font-size: 36px;
  background-color: #645552;
  color: #ffffff;
  font-weight: bold;
  transform: scaleX(1.85) scaleY(1.22);
}

#lastGalleryPageBtn
{ 
  margin-right: 10px;
}

#nextGalleryPageBtn
{ 
  margin-left: 10px;
}

#lastGalleryPageBtn:focus, #nextGalleryPageBtn:focus
{
  border: 0px none;
  box-shadow: none;
  outline: 0 none;
}

#lastGalleryPageBtn:hover, #nextGalleryPageBtn:hover
{
  color: #ffff00;
}

#actionMessage
{
  position:absolute; 
  display:block;
  top:15px; 
  right:15px; 
  background: rgba(0, 0, 0, 0.75);
  font-size: 16px;
  font-weight: 600;
  color: #ffffff;
  float: left;
  transform: scaleX(0.95) scaleY(1.0);
  color: #ffffff; 
  padding: 25px;
  box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(255, 255, 0, 0.6);

}


@media(max-width: 480px) {
  main section{
    padding: 35px 0;
  }

  #ContactAddress #img1
  {
    margin-top: 40px;
    text-align: center;
  }  
  #Contact h2 { font-size: 1.5rem;}
}

@media(max-width: 768px) {
  main section{
    padding: 55px 0;
  }
  .socialButtonsTop { display: none; }
  .menuButton { display: none; }
  .menuButtonMobile { display: block; margin-top: 30px; }
  .navigationContainer { display: none; }

}

@media(max-width: 992px)
{
    #AboutUs .image{
      max-width: 600px;
      margin: 0 auto 30px;
    }
  main section{
    padding: 75px 0;
  }
  #AboutUs .container #img1
  {
    text-align: center;
    margin-bottom: 35px;
  }
  #ContactAddress #img1 img
  {
    width: 100%;
  }
}