/** 
 *  Holz Gestaltet Leben CSS 
 *  ----------------------------------------------------------------------------
 *  
 *  dark blue = #021E3A
 *  light grey = #E5E4E5
 *  violet = #BDC0D1
 *  
**/

@font-face {
  font-family: "Oxygen";
  font-weight: 400;
  src('../fonts/Oxygen/Oxygen-Regular.ttf');
}

@font-face {
  font-family: "Oxygen";
  font-weight: 700;
  src('../fonts/Oxygen/Oxygen-Bold.ttf');
}

@font-face {
  font-family: ;
  font-weight: 400;
  src('../fonts/Josefin_Slab/JosefinSlab-Regular.ttf');
}

@font-face {
  font-family: ;
  font-weight: 700;
  src('../fonts/Josefin_Slab/JosefinSlab-Bold.ttf');
}

body {
  font-family: "Courier New", "Courier", "Josefin Slab", Serif;
  font-size: 18px;
  font-weight: 400;
  background: #BDC0D1;
  color: #000;
}

/* Parallax backgrounds */
#bg-parallax-1 {
  position: absolute;
  left: 0;
  top: 1200px;
}

.parallax-window {
    min-height: 400px;
    background: transparent;
}


h1 {} 

a,
a:link,
a:visited {
  color: #ccc;
  transition: all linear .3s;
}

a:hover,
a:active {
  color: #ddd;
  text-decoration: none;
}

.btn-aglae {
  display: inline-block;
  padding: 4px 20px;
  font-size: 1.1em;
  background: #021E3A;
  color: #fff;
  border: solid 1px #021E3A;
  text-decoration: none;
  transition: all linear .3s;
}

.btn-aglae:hover {
  background: #BDC0D1;
  color: #021E3A;
  text-decoration: none;
}

img {
  max-width: 100%;
}

.bg-dark {
  background-color: #021E3A;
}



/* Bootstrap container */
.container {
  padding-left: 0;        /* Nachbessern der Aussenabstände bei Mobile !!!! */
  padding-right: 0;
  background: #fff; 
}

@media (min-width: 1200px) {
  .container {
    width: 1100px;
  }
}





/* Navbar */
.navbar-logo {
  text-align: center;
  background: #021E3A;
  padding: 10px 20px;
}

.navbar-logo img {
  height: 140px;
  width: auto;
}

@media only screen and (max-width:768px) {
  .navbar-logo img {
    height: 80px;
    width: auto;
  }
}

/* re-format navbar-inverse */
.navbar {
  border-radius: 0;
  -moz-border-radius: 0;
  min-height: 22px;  
}

.navbar-inverse,
.navbar-inverse .navbar-collapse, 
.navbar-inverse .navbar-form {
  background: #021E3A; 
  border: none;
}

.navbar-nav {
  float: none;
  width: 78%;
  margin-left: auto;
  margin-right: auto;
}

.navbar-nav > li > a {
  padding: 4px 46px;
  text-align: center;
  letter-spacing: 1px;
}




/* Carousel slider */
.carousel {
  position: relative;
  margin-top: 0;
}

.carousel-caption {
  bottom: 20%;
}

.carousel-caption h1 {
  font-size: 4em;
}

.carousel-caption h1 > span {
  display: inline-block;
  border-right: solid 2px #fff;
  background: transparent;
  width: 2px;
  margin-left: 12px;
  margin-right: 12px;
}

.carousel-caption h3 {
  font-size: 2.25em;
}

.carousel-control.left,
.carousel-control.right {
  background: none;
}

.carousel-control .arrow-left,
.carousel-control .arrow-right {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: inline-block;
  margin-top: -10px;
}
.carousel-control .icon-prev,
.carousel-control .arrow-left {
  left: 0;
  margin-left: 0;
  transition: all linear .3s;
}

.carousel-control .arrow-left:hover {
  margin-left: 10px;
}

.carousel-control .icon-next,
.carousel-control .arrow-right {
  right: 0;
  margin-right: 0;
  transition: all linear .3s;
}

.carousel-control .arrow-right:hover {
  margin-right: 10px;
}



/* Home content panels */
.home-panel {
  padding: 50px auto;
}

.document-panel,
.product-panel {
  padding-left: 60px;
  padding-right: 60px;
}




/* Home topics */
.home-products {
  margin: 30px 0;
}

.home-products .product {
  background: #BDC0D1;
  padding: 8px;
  border: solid 30px #fff;
  cursor: pointer;
}

.home-products .center-product {}

.home-products .product .product-image-wrapper {
  width: 100%;
  background: #fff;
  border: none;
}

.home-products .product h4 {
  line-height: 20px;
  text-align: center;
  margin-bottom: 0;
  color: #fff;
}

.home-gallery-link {
  padding: 0 10px 20px;
  text-align: center;
}

.home-gallery-link .link-gallery {
  display: inline-block;
  padding: 10px 50px 5px;
  font-size: 1.5em;
  background: #021E3A;
  border: solid 1px #021E3A;
  color: #fff;
  text-decoration: none;
  transition: all linear .3s;
}

.home-gallery-link .link-gallery:hover {
  background: #BDC0D1;
  color: #021E3A;
  text-decoration: none;
}

.home-philosophy {
  padding-top: 30px;
}

.philosophy {
  padding-top: 0px;
  margin-left: 0;
  margin-right: 0;
}

.home-philosophy .word-wrapper {
  background: #fff;
  padding: 8px;
  border-left: solid 60px #fff;
  border-right: solid 60px #fff;
  text-align: center;
}

@media only screen and (max-width:768px) {
  .home-philosophy .word-wrapper {
    border: none;
  }
}

.home-philosophy .word {
  background: #fff;
  border: solid 2px #9F9F9F;
  padding: 7px;
  cursor: pointer;  
}

.home-philosophy .word-wrapper h4 {
  line-height: 1em;
}

.home-about {
  background-color: #BDC0D1 !important;
  color: #021E3A;
  padding-top: 20px;  
  padding-bottom: 60px;
  font-size: .8em;
  line-height: 1.65em;
}

.home-about .info-box {
  padding-left: 50px;
  padding-right: 50px;  
}

.home-about .info-box h3 {
  /* border-bottom: solid 1px #fff; */
  padding-top: 30px;
  /* padding-bottom: 20px; */
}



/* Product list and detail views */
.product {
  position: relative;
}

.product .product-image {
  border: solid 3px #021E3A;
}

.product-image-thumbnails {
  padding-top: 10px;
}

.product-image-thumbnails .thumb-btn {
  cursor: pointer;
}

.product-image-thumbnails .thumb-btn img {}

@media only screen and (max-width:480px) {
  .product-image-thumbnails {
    display: none;
  }
}

/**
.product .carousel-indicators {
  position: relative;
  width: 100%;
  padding: 0;
  margin: 0;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  text-align: left;
}

.product .carousel-indicators li {
  display: inline-block;
  width: 120px;
  height: 65px;
  border: none;
}
**/

.product .product-description {
  padding-top: 20px;
  padding-bottom: 30px;
  /* margin-bottom: 30px; */
  /* border-bottom: solid 5px #9f9f9f; */
}

.product .next-product {
  display: block;
  width: 100%;
  text-align: right;
  padding: 10px 15px;
}

.product .next-product a {}




/* quick contact */
.quick-contact {
  padding-top: 20px;
  padding-bottom: 60px;
}

.quick-contact input,
.quick-contact textarea {
  border: solid 2px #021E3A;
  margin-right: 20px;
}

button[name="send-ajax-contact"] {
  display: none;
}

@media only screen and (max-width:768px) {
  
  .quick-contact input {
    margin-right: 0;
  }
  
}




footer {
  background: #021E3A !important;
  color: #021E3A;
  padding-top: 36px;
  font-size: .8em;
  line-height: 1.65em;
}

footer h3 {
  border-bottom: solid 1px #fff;
  padding-top: 30px;
  padding-bottom: 20px;
}

footer .social-media {
  position: relative;
  padding-bottom: 30px;
}

footer .social-media-btn {
  width: 46px;
  height: 46px;
  line-height: 40px;
  background: #fff;
  border-radius: 50%;
  -moz-border-radius: 50%;
  margin: 0 20px;
  display: inline-block;
}

footer .copyright {
  position: absolute;
  right: 40px;
  bottom: 0;
}

footer .sitemap {
  padding: 20px 20px 10px;
  border-top: solid 1px #BDC0D1;
  color: #fff;
  letter-spacing: 1px;
}


/* Small displays*/
@media only screen and (max-width:1200px) {  
  .navbar-nav {
    width: 70%;
  }   
}

/* Tablet */
@media only screen and (max-width:768px) {

  .carousel .item img {
    max-width: 100%;
    /** margin-left: -50%; center background image !! */
  }
  
  .carousel-caption {
    bottom: 50px;
  }
  
  .carousel-caption h1 {
    font-size: 2.5em;
  }
  
  .carousel-caption h3 {
    font-size: 1.25em;
  }
  
  .home-panel .topic-box { 
    position: absolute;
    z-index: 10;
    left: 30px;
    right: 30px;
    bottom: 30px;
  }


}

/* Smartphone */
@media only screen and (max-width:480px) {
  
  .carousel .item img {
    max-width: 100%;
  }
  
  .home-about {
    text-align: center;
  }

}


/* iPad Retina Displays */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 2) {
  
  .navbar-nav {
    width: 80%;
  }  
  
} 