/*Custom index style*/
@import "https://zap-arbeitsschutz.de/css/roboto.css?family=Poppins:400,700";
body {
    font-family: "Poppins", sans-serif;
    color: #394b52;
}
.navbar-nav .nav-link {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
}
.dv-header {
    background: #f7f7f7 url("/images/background.png") no-repeat;
    background-size: cover;
    background-position: center top;
    padding: 50px 15vw;
}
.dv-header .row:first-child h1 {
    font-size: 2rem;
}
.dv-header .price img {
    max-width: 100%;
}
.dv-header a {
    color: #394b52;
}
.dv-advanc {
    background: #f7f7f7 url("/images/background_Ihre Vorteile.png") no-repeat;
    background-size: cover;
    background-position: right;
    padding: 50px 15vw;
}
.dv-advanc .row:nth-child(2) [class^="col-"],
.dv-advanc .row:nth-child(3) [class^="col-"] {
    padding: 0;
}
.dv-advanc .row:nth-child(2) [class^="col-"] .inner,
.dv-advanc .row:nth-child(3) [class^="col-"] .inner {
    background-color: #f8f9fbd4;
    height: 100%;
    margin: 0 10px;
    padding: 20px 0;
}
.dv-advanc .row:nth-child(2) [class^="col-"] .inner span,
.dv-advanc .row:nth-child(3) [class^="col-"] .inner span {
    margin: 0 16px;
    display: block;
}

.dv-yellow {
    background-color: #ffed00;
    padding: 50px 15vw;
    font-size: 1.2rem;
}
.dv-yellow .row:nth-child(2) .img-flex {
    display: flex;
    justify-content: center;
    height: 50px;
}
.dv-yellow .row:nth-child(2) img {
    max-width: 45px;
    object-fit: contain;
}
.dv-cer {
    background: #f7f7f7 url("/images/background-3.png") no-repeat;
    background-size: cover;
    background-position: left top;
}
.dv-cer .row .cer-txt {
    padding: 3em;
    background-color: #f8f9fbd4;
}
.dv-cer .row h1 {
    font-weight: bold;
}
.dv-cer .cer-img {
    display: block;
    margin: auto;
    max-width: 100%;
}
.dv-cer .cer-text-img div:first-child {
    width: 70%;
    display: inline-block;
}
.dv-cer .cer-text-img div:last-child {
    position: relative;
    display: inline-block;
    width: 30%;
}
.dv-gray {
    background-color: #f5f7fa;
    padding: 50px 15vw;
}
.dv-yellow-bt {
    background-color: #ffed00;
}
.dv-yellow-bt .carousel-inner .row {
    padding: 50px 15vw;
}
.dv-yellow-bt h1 {
    font-weight: bold;
}
.dv-contact {
    padding: 50px 15vw;
    background: #394a52 url("/images/bg_Kontakt.png") no-repeat;
    background-size: cover;
    background-position: left bottom;
    color: #fff;
}
.dv-contact h1,
.dv-contact h4 {
    font-weight: bold;
}

.dv-contact h4 a  {
    color: #fff!important;}

.dv-gray-footer {
    background-color: #f5f7fa;
    padding: 20px 15vw;
    font-size: 0.9em;
}
.scrollToTop {
    display: none;
    position: fixed;
    right: 20px;
    bottom: 20px;
}
.btn-warning {
    background-color: #feed01 !important;
    border-color: #feed01 !important;
    white-space: initial;
}

/*less than medium*/
@media only screen and (max-width: 767px) {
    h4 {
        font-size: 1rem;
    }
    .dv-header .price {
        margin: auto;
        width: 100px;
        height: 100px;
    }
    .dv-cer {
        padding: 50px 5vw;
    }
    .navbar-nav .nav-link.nav-active {
        background: #feed01;
        border-radius: 10px;
        padding: 15px;
    }
    .dv-cer .cer-text-img div:first-child, .dv-cer .cer-text-img div:last-child {
        width: 100%;
    }
}
/*medium and more*/
@media only screen and (min-width: 768px) {
    .dv-header .price img {
        position: absolute;
        right: -15vw;
        top: -3em;
    }
    .dv-header .row:first-child h1 {
        font-size: 3em;
    }
    .dv-header .row:nth-child(2) [class^="col-"]:first-child {
        padding: 0 5em;
    }
    .dv-yellow .row:nth-child(2) .col-md-2:not(:last-child):before {
        top: 95px;
        left: 7vw;
        width: 9vw;
        height: 1px;
        position: absolute;
        content: " ";
        background-color: #000;
    }
    .dv-cer {
        padding: 50px 15vw;
    }
}

@media only screen and (min-width: 1200px) {
    .dv-cer .cer-img {
        position: absolute;
        top: -8em;
        right: -5em;
    }
    .dv-header .price img {
        position: absolute;
        right: -14vw;
        top: -3em;
    }
}
@media only screen and (min-width: 1600px) {
    .dv-header .price img {
        position: absolute;
        right: -2vw;
        top: -3em;
    }
}