body,
h1,
h2,
h3,
h4,
h5,
h6,
p {
    font-family: NettoWeb, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.facebook,
.nav>li>a,
.navbar,
body {
    position: relative
}

.glyphicon,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
strong {
    -moz-osx-font-smoothing: grayscale
}

#leistungen h6,
#team h5,
.panel-title a,
h1,
h2,
h3,
h4,
h5,
h6 {
    text-transform: uppercase
}

@font-face {
    font-family: NettoWeb;
    src: url(NettoWeb.woff) format('woff')
}

@font-face {
    font-family: NettoWeb-Bold;
    src: url(NettoWeb-Bold.woff) format('woff')
}

body {
    padding-top: 0;
    background: #532409;
    color: #fff;
    font-size: 16px;
    -webkit-font-smoothing: antialiased!important
}

@media (min-width:768px) {
    body {
        padding-top: 0
    }
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    -webkit-font-smoothing: antialiased!important
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 1.8rem
}

strong {
    font-family: NettoWeb-Bold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased!important
}

.marketing p+p {
    line-height: .5rem
}

.impressum p+p {
    line-height: 2.2rem
}

a,
a:focus,
a:hover {
    color: #532409;
    text-decoration: underline
}

.navbar-nav a,
.navbar-nav a:hover,
.panel-title a {
    text-decoration: none
}

ul {
    display: block;
    list-style-type: disc;
    margin: 0 .4em .4em -1.6em;
    -webkit-margin-before: .4em;
    -webkit-margin-after: .4em;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    -webkit-padding-start: 16px
}

.navbar-header {
    float: left;
    padding: 15px;
    text-align: center;
    width: 100%
}

.navbar-brand {
    float: none
}

.navbar-header a {
    background-image: url(../img/haarwerk-nuernberg-logo.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 167px 24px;
    text-indent: -9999px
}

@media(min-width:767px) {
    .navbar-header a {
        background-size: 250px 36px
    }
    .navbar-brand img,
    .navbar-brand-daten img {
        top: 30%;
        height: 36px;
        width: 250px
    }
    .small .navbar-brand img,
    .small .navbar-brand-daten img {
        top: 30%;
        height: 26px;
        width: 168.5px
    }
}

.navbar {
    padding: .5rem 0 0
}

.navbar .row {
    margin-right: 0;
    margin-left: 0
}

.navbar .container {
    padding-right: 0!important;
    padding-left: 0!important
}

.large logo,
.logo,
.small logo {
    width: 100%;
    padding: .5rem 0;
    display: block
}

@media (min-width:768px) {
    .logo {
        padding: 0 0 .6rem
    }
    .small .logo {
        width: 100%;
        padding: .5rem 0 .2rem;
        display: block
    }
}

.navbar-brand,
.navbar-brand-daten {
    float: none;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 1.25rem;
    text-align: center;
    margin: 0 auto;
    height: 2.5rem;
    display: block
}

.mainNav {
    float: none;
    width: 100%;
    text-align: center
}

.navbar .navbar-nav {
    display: inline-block;
    float: none;
    vertical-align: top
}

.navbar-nav .nav-item {
    float: left
}

.navbar-light .navbar-nav .active>.nav-link,
.navbar-light .navbar-nav .active>.nav-link-daten,
.navbar-light .navbar-nav .nav-link,
.navbar-light .navbar-nav .nav-link-daten {
    color: #fff;
    font-size: 1.5rem;
    letter-spacing: 0;
    border-bottom: 2px solid #532409
}

.navbar-light .navbar-nav .active>.nav-link,
.navbar-light .navbar-nav .active>.nav-link-daten,
.navbar-light .navbar-nav .active>.nav-link-daten:hover,
.navbar-light .navbar-nav .active>.nav-link:hover,
.navbar-light .navbar-nav .nav-link-daten.active,
.navbar-light .navbar-nav .nav-link-daten:focus,
.navbar-light .navbar-nav .nav-link-daten:hover,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
    border-bottom: 2px solid #fff;
    color: #fff!important;
    font-size: 1.5rem;
    letter-spacing: 0
}

.nav>li>a {
    display: block;
    padding: 0
}

.navbar-nav .nav-link,
.navbar-nav .nav-link-daten {
    display: block;
    padding-top: 0;
    padding-bottom: 0
}

.navbar-nav .nav-item+.nav-item {
    margin-left: 1rem
}

.nav>li>a:focus,
.nav>li>a:hover {
    text-decoration: none;
    background-color: transparent
}

.hidden-sm-up {
    display: none!important
}

.navbar .collapse {
    display: block
}

.facebook {
    top: -5rem;
    text-align: right;
    width: 80px;
    right: -75%;
}
.facebook a {
    display: inline-block;
    margin-left: 12px;
}

@media(min-width:767px) {
    .navbar-light .navbar-nav .active>.nav-link,
    .navbar-light .navbar-nav .active>.nav-link-daten,
    .navbar-light .navbar-nav .active>.nav-link-daten:hover,
    .navbar-light .navbar-nav .active>.nav-link:hover,
    .navbar-light .navbar-nav .nav-link,
    .navbar-light .navbar-nav .nav-link-daten,
    .navbar-light .navbar-nav .nav-link-daten.active,
    .navbar-light .navbar-nav .nav-link-daten:focus,
    .navbar-light .navbar-nav .nav-link-daten:hover,
    .navbar-light .navbar-nav .nav-link.active,
    .navbar-light .navbar-nav .nav-link:focus,
    .navbar-light .navbar-nav .nav-link:hover {
        font-size: 1.8rem;
        letter-spacing: .2rem
    }
    .navbar-nav .nav-item+.nav-item {
        margin-left: 3.438rem
    }
    .facebook {
        position: relative;
        top: -2rem;
        width: 80px;
        text-align: right;
         right: -89%;
    }
}


@media (min-width:1200px) {
 .facebook {
        position: relative;
        top: -2rem;
        width: 80px;
        text-align: right;
         right: -93%;
    }
}

.container.heroHome {
    padding-left: 0!important;
    padding-right: 0!important
}

@media (min-width:768px) {
    .navbar-brand,
    .navbar-brand-daten {
        height: 3.75rem
    }
    .small .navbar-brand,
    .small .navbar-brand-daten {
        height: 2.5rem
    }
    .container.heroHome {
        padding-left: 0!important;
        padding-right: 0!important
    }
}

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

.carousel-control.right {
    right: 10px
}

@media (min-width:544px) {
    .navbar {
        border-radius: 0
    }
    .carousel-indicators {
        display: block
    }
}

.carousel-indicators li {
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 1px;
    text-indent: -999px;
    cursor: pointer;
    border: 3px solid #532409;
    border-radius: 50%;
    background: #532409
}

.carousel-indicators .active {
    width: 15px;
    height: 15px;
    margin: 0;
    background: #fff;
    border: 3px solid #532409
}

.carousel-indicators {
    bottom: 0
}

.carousel-control {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 10%;
    font-size: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
    opacity: .5
}

.carousel-control .icon-next,
.carousel-control .icon-prev {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;
    width: 30px;
    height: 30px;
    margin-top: -10px;
    font-family: serif;
    line-height: 2.2rem;
    background: #532409;
    border-radius: 50%
}

.card,
.glyphicon {
    position: relative
}

.carousel-inner>.item>a>img,
.carousel-inner>.item>img,
.img-fluid {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto
}

.marketing {
    background: #fff;
    color: #532409;
    padding: 2.375rem 0 1.5rem
}

.marketing .row {
    margin-left: 0;
    margin-right: 0
}

@media (min-width:768px) {
    .marketing {
        padding: 3.375rem 0 1.8rem
    }
}

@media (min-width:992px) {
    .marketing {
        padding: 4.375rem 0 2.188rem
    }
    .marketing .row {
        margin-left: -15px;
        margin-right: -15px
    }
}

@media (min-width:1200px) {
    .marketing .row {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -moz-flex;
        display: -webkit-flex;
        display: flex
    }
}

.marketing h1,
.marketing h2,
.marketing h3 {
    font-size: 1.8rem;
    text-transform: uppercase;
    border-bottom: 2px solid #5c2f16;
    padding-bottom: 5px
}

.marketingLine p {
    display: none
}

.marketing .adresse,
.marketing .oeffnungszeiten {
    padding-top: 1rem
}

@media (min-width:1200px) {
    .marketingLine p {
        border-bottom: 2px solid #5c2f16;
        top: -5px;
        position: relative;
        display: block
    }
    .marketing .adresse,
    .marketing .oeffnungszeiten {
        padding-top: 0
    }
}

.table td,
.table th {
    padding: 0;
    line-height: 1.5;
    vertical-align: top;
    border-top: 0 solid #eceeef
}

#productLogos {
    padding: 2.375rem 0
}

@media (min-width:992px) {
    #productLogos {
        padding: 4.375rem 0
    }
}

#productLogos .img-fluid {
    background-color: #532409
}

#leistungen,
#team {
    background: #fff;
    color: #532409
}

#team .teamFlex {
    display: flex;
    display: -webkit-flex;
    -webkit-flex: 1;
    flex: 1;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

#team h5 {
    padding: 2.188rem 0 1.5rem;
    font-size: 2.8rem;
    margin-left: -.9375rem
}

.card {
    display: block;
    margin-bottom: .75rem;
    background-color: #fff;
    border: 0 solid #e5e5e5;
    border-radius: 0
}

.cardAll {
    border-bottom: 2px #532409 solid;
    padding-right: 0;
    padding-left: 0;
    margin-left: 0;
    margin-right: .937rem;
    margin-bottom: 2.188rem
}

.card-img-top {
    width: 100%;
    height: auto;
    border-radius: 0
}

.card-block {
    padding: 0 0 .5rem
}

.card-title {
    margin-top: 1rem;
    margin-bottom: .5rem;
    font-weight: 700
}

.card-title span {
    font-size: 14px;
    font-weight: 100
}

.card-text {
    margin-bottom: -.3rem
}

@media (min-width:544px) {
    #team .col-sm-6 {
        width: 46.7%
    }
}

@media (min-width:768px) {
    #team .col-sm-6 {
        width: 47.5%
    }
}

@media (min-width:992px) {
    #team .col-lg-4 {
        width: 31.4%
    }
}

@media (min-width:1200px) {
    #team .col-xl-4 {
        width: 23.4%
    }
}

#anfahrt.container {
    padding: 1rem .9375rem!important
}

#anfahrt .row {
    margin: 0
}

@media (min-width:992px) {
    #anfahrt .row {
        margin: 0 -15px
    }
}

#accordion,
#leistungen .zusatz,
#leistungen h6,
footer p {
    margin-left: -.9375rem
}

#map {
    width: 98%;
    height: 320px
}

@media (min-width:768px) {
    #anfahrt.container {
        padding: 1rem 0!important
    }
    #map {
        width: 100%;
        height: 420px
    }
}

#accordion {
    padding: 1rem 0
}

#leistungen h6 {
    padding-top: 2.188rem;
    font-size: 2.8rem
}

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url(../fonts/glyphicons-halflings-regular.eot);
    src: url(../fonts/glyphicons-halflings-regular.eot?#iefix) format('embedded-opentype'), url(../fonts/glyphicons-halflings-regular.woff2) format('woff2'), url(../fonts/glyphicons-halflings-regular.woff) format('woff'), url(../fonts/glyphicons-halflings-regular.ttf) format('truetype'), url(../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format('svg')
}

.glyphicon {
    font-size: 12px;
    top: -2px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased
}

.glyphicon-minus:before {
    content: "\2212"
}

.glyphicon-plus:before {
    content: "\002b"
}

.glyphicon-download:before {
    content: "\203a"
}

.preis {
    text-align: right
}

#leistungen .table td,
.table th {
    padding: 0;
    line-height: 2;
    vertical-align: top;
    border-bottom: 1px solid #532409
}

#leistungen .table td.noLine {
    border-bottom: 1px solid #fff
}

.rowOne {
    width: 55%
}

.rowTwo {
    width: 15%
}

.rowThree {
    width: 30%
}

@media (min-width:768px) {
    .rowOne {
        width: 76%
    }
    .rowThree,
    .rowTwo {
        width: 12%
    }
}

.panel-title {
    border-bottom: 2px solid #532409
}

.panel-title a {
    font-size: 2rem
}

footer {
    padding: 1rem 0 2rem
}

footer a,
footer a:active,
footer a:focus,
footer a:hover,
footer a:visited {
    color: #fff
}