/* Global Styles
-------------------------------------------------- */
html { min-height: 100%; border:0; margin:0; padding:0; outline:0; }
body { font-family: 'Raleway', sans-serif; color:#000;padding:0; margin:0; border:0; width:100%; }
*:focus { outline: none; }
* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
ul { margin:0; padding:0 }
.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand { margin-left: 0; }

nav.navbar, nav.navbar .social, nav .navbar-brand, nav .navbar-nav, nav .navbar-nav > li { -webkit-transition: all 0.4s ease; transition: all 0.4s ease; -moz-transition:all 0.4s ease; -o-transition:all 0.4s ease; }
.navbar-brand { text-indent:-9999px; width:107px; height: 100px; background: url(../img/garden-format-logo.png) no-repeat; background-size: 107px 100px; margin:20px 0 35px 15px; }
.navbar-default .navbar-nav > li > a { font-size:15px; padding:0; text-transform:uppercase; color:#333; font-weight:600;  }
.navbar-default .navbar-nav > li > a:hover { color:#000;  }
.navbar-default .navbar-nav > li.active a, .navbar-default .navbar-nav > li.active a:hover, .navbar-default .navbar-nav > li.active a:active, .navbar-default .navbar-nav > li.active a:focus { background-color:transparent; color:3px solid #557c2c; }
.navbar-nav > li.active, .navbar-nav > li.active:hover { border-bottom:3px solid #557c2c; transition:none !important;     }
.navbar-nav > li:hover { border-bottom:3px solid #ccc; transition:none !important; }
.navbar-nav > li { margin-right:40px; padding-bottom:5px }
.navbar-nav > li:last-child { margin-right:0; }
.navbar { height:140px; background-color:#fff; border:none; border-bottom:1px solid #ebebeb; border-radius:0; opacity: 0.9;}
.navbar-nav { margin:50px 0 0 0;  }

.social { margin-top:35px; display:block; height:20px; text-align:right; font-size:13px; color:#999}
.social i { margin-right:10px; font-size:16px; text-decoration:none }
.social a { text-decoration:underline; color:#999}

.footer { width: 100%; min-height: 95px; background-color: #000;}
section h1, section h2, header h1, header h2 { font-size:36px; font-weight:600 }
section, header { padding: 0}
.hrsmall { height:2px; background-color:#fff; color:#fff; width:30px; border:none; margin:30px 0 28px 0}
.hrsmallwhite { height:2px; background-color:#fff; color:#fff; width:30px; border:none; margin:25px 0 }
.button { text-transform:uppercase; font-size:14px; letter-spacing:3px; color:#000; border:1px solid #999; text-decoration:none; padding:15px 30px; background-color:#fff; font-weight:700; }


nav.navbar.shrink { -webkit-box-shadow: 0px 5px 25px -6px rgba(0,0,0,0.7); -moz-box-shadow: 0px 5px 25px -6px rgba(0,0,0,0.7); box-shadow: 0px 5px 25px -6px rgba(0,0,0,0.7); border:none; height: 70px !important; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; -moz-transition:all 0.4s ease; -o-transition:all 0.4s ease;}
nav.navbar.shrink .social { margin-top:5px !important; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; -moz-transition:all 0.4s ease; -o-transition:all 0.4s ease;}
nav.shrink .navbar-brand { width:53px; height: 49px; background-size: 53px 49px; margin-top:10px; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; -moz-transition:all 0.4s ease; -o-transition:all 0.4s ease;}
nav.shrink .navbar-nav { margin-top:20px; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; -moz-transition:all 0.4s easet; -o-transition:all 0.4s ease;}
nav.shrink .navbar-nav > li { padding-bottom:5px }

.angle-black { width: 0; height: 0; border-style: solid; border-width: 0 0 100px 800px; border-color: transparent transparent #000000 transparent; }
.angle-white { width: 0; height: 0; border-style: solid; border-width: 0 0 100px 800px; border-color: transparent transparent #ffffff transparent; }

/* Custom CSS
-------------------------------------------------- */
span.mail a, #contact .web { text-decoration:underline; color:#999  }

#home { background:url(../img/background2.jpg) center no-repeat ; background-size:cover;}
#home > .container { height:500px; padding: 180px 15px 0; }
#home h1 { color: #fff; text-shadow: 2px 2px 5px #000; max-width:600px; margin-top: 0; font-size: 42px; font-weight: 800;}
#home .container h1 + span { font-size:26px; font-weight:600; color: #fff; text-shadow: 2px 2px 5px #000; max-width:600px; display:inline-block}
#home p { font-size:18px; margin-top:20px; max-width:600px; color:#fff; text-shadow: 2px 2px 5px #000; }


#gardenformat { background-color:#547b2a;}
#gardenformat h2 { color:#fff; text-align:center; margin:40px 0 40px 0; color:#fff }
#gardenformat h3 { color:#000; font-size:24px; font-weight:600; margin-bottom:30px; color:#fff }
#gardenformat h3 span { font-weight:300; display:block; color:#fff }
#gardenformat .panel { border-radius:0; border:none; background-color:transparent; color:#fff; box-shadow: none; padding: 0; margin: 0;}

#moebel a:hover { text-decoration:none; }
#moebel { background-color:#FFF; line-height:30px; padding-bottom:50px }
#moebel h2 { color:#000; text-align:center; margin:40px 0 75px 0 }
#moebel h3 { color:#000; font-size:16px;  height:40px; margin-top:0px; }
#moebel #ajaxcontent li { list-style: none; margin-bottom:20px}
#moebel #ajaxbottom { margin-top:20px; font-size: 16px;  font-weight: normal; display: block; text-align:center}
#moebel li .border { border: 1px solid #fff; }
#moebel li .border:hover { border: 1px solid #cdcdcd; }
#moebel li .border:hover .panel { background-color:#cdcdcd; }
#moebel .panel { border-radius:0; border:none; background-color:transparent; color:#000; box-shadow: none; padding: 0; margin: 0;}
#moebel .panel-thumbnail {padding-top:10px; height: 160px;} 
#moebel .panel-thumbnail .instock {position: absolute; right: 20px; color: #000; font-size: 12px; line-height: 18px; font-weight: 400; }
#moebel .panel-thumbnail .instock:before { background-color: #36b136; content: ''; display: inline-block; width: 10px; height: 10px; -moz-border-radius: 7.5px; -webkit-border-radius: 7.5px; border-radius: 7.5px; margin-right:5px }
#moebel .panel-thumbnail .img-responsive { max-height:300px; margin: 0 auto;}
#moebel .panel-body {padding:10px 10px 0 10px;}
#moebel .panel-body .name:hover, #moebel .panel-body .black:hover { text-decoration:none; }
#moebel .panel-body .name { color:#000; font-size:16px;  line-height:18px; height:55px; margin-top:0px; overflow: hidden;}
#moebel .panel-body .red {font-size:17px; font-weight:600; color:#C33; float: left; display:block; width:50%; white-space: nowrap;}
#moebel .panel-body .black {font-size:17px; font-weight:600; color:#000; text-decoration:none }
#moebel .panel-body .oldprice { font-size:14px; color:#333; text-decoration:line-through; display:block; width:50%; float:right; text-align: right;}
#moebel .panel-body p { line-height:24px; font-size:18px; font-weight:600;height: 30px;}
#moebel .nav-pills { background-color:#e7e7e7; margin-bottom: 20px; text-align:center; border-radius: 5px; margin-right: 15px;}
#moebel .nav-pills a { color:#000; font-size:16px; border-radius:0px; }
#moebel .nav-pills li { display: inline-block; float: none;}
#moebel .nav-pills li.active a { color:#fff;  background-color: #000; }
#moebel #loader { display:none; height: 500px; width: 100%; opacity: 0.8; position: absolute; z-index: 100;}


#about { background-color:#547b2a; color:#fff; }
#about h2 { text-align:center; margin:40px 0 50px 0 }
#about h3 { margin-top:20px; font-size:18px; font-weight:600 }
#about p { line-height:24px; margin-bottom: 55px; }
#about #terrassentische p, #about #terrassenstuehle p { font-size:13px; }
#about #abouttext { padding-right:60px; }


#contact { background-color:#FFF; line-height:30px; padding-bottom:90px  }
#contact h2 { color:#000; text-align:center; margin:40px 0 90px 0 }
#contact i { text-decoration:none; color:#999; font-size:18px; margin-right:5px }
#contact .row { margin:0 0 35px 0}
#contact .form-control  { border-radius:0; background-color:#e6e6e6; box-shadow:none; border-color:#dadada}
#contact #anfrage { height:160px; }
#contact #zustimmung { float: left; width: 30px; height:30px; display: block; margin-top: 0px !important; }
#contact label { font-size:15px; font-weight:400; margin-bottom:0; width: 100%;}
#contact p { margin:20px 0; }
#contact button { margin-top:30px; background-color:#000; border-radius:0; border:1px solid #000; width:75%; color:#fff; text-transform:uppercase; font-weight:600}

footer .container { font-weight:700; font-size:12px; color:#999; text-transform:uppercase }
footer .container > div { margin: 35px 0 0 0; padding:0; }
footer a, footer a:active, footer a:visited, footer a:hover, footer a:focus{ color:#999; border:none; outline:none; }
footer li { margin-right:15px; }

.modal-body { overflow-y:scroll !important; height:500px; }
.modal-body p { margin-bottom:40px; font-size:13px; }

.imprint-headline { font-size:14px; font-weight:600;}



@media (max-width: 767px) { 
#home > .container { padding: 0 15px; background:none }
#home h1 > span { display:block}
.navbar-default .navbar-collapse { position: absolute; width: 100%; z-index: 10;    margin-top: -65px;}
.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand { margin-left: 15px; }
.navbar > .container { background-color:#fff; border-bottom:1px solid #ebebeb; border-radius:0; height:140px; }
.navbar-toggle { margin-top:80px; position: absolute !important; right: 0 !important; z-index: 1000 !important; float:none !important; }
.navbar-collapse { border:none; margin-top:-110px; padding-right:0; padding-left:0; }
.navbar-default .navbar-nav > li.active a, .navbar-default .navbar-nav > li.active a:hover { background-color:#e7e7e7; }
.navbar-nav { background-color:#e7e7e7; padding:0 15px }
.navbar-nav > li { margin:10px 0 }
.navbar-nav li.active, .navbar-nav li:hover, .navbar-nav li.active:hover { border:none; background-color:#e7e7e7 }

footer .list-inline > li { display:block; }
footer .list-inline > li { display:block; }
footer .list-inline { padding-bottom:30px; }

.angle-black { border-width: 0 0 50px 800px; }
.angle-white { border-width: 0 0 50px 800px; }

}

@media (max-width: 785px) { 
body { padding-top:0; }
}