html {
    height: 100%;
    position: relative
}

body {
    position: relative;
    font-size: 14px;
    line-height: 18px;
    font-family: Arial, Helvetica, sans-serif;
    color: #454545;
    background-color: #fff;
    margin: 0;
    height: 99%;
    overflow-x: hidden
}

table, tr, td {
    padding: 0
}

section {
    width: 100%;
    margin: 10px auto
}

p {
    margin: 0;
    padding: 3px 0 3px 5px
}

a {
    text-decoration: none;
    color: #454545
}

strong, b {
    font-weight: 700
}

ul {
    list-style-type: none;
    padding: 0;
    margin: 0
}

h1 {
    font-size: 20px;
    font-weight: 700;
    margin: 15px 0;
    text-align: center
}

h2 {
    color: #DB3C15;
    font-size: 18px;
    font-weight: 700;
    line-height: 18px;
    margin: 0;
    padding: 3px 0 3px 5px
}

h3 {
    color: #FF2C2C;
    font-size: 18px;
    font-weight: 700;
    margin: 15px 0
}

h4 {
    font-size: 18px
}

h5 {
    margin: 0;
    padding: 0;
    display: none
}

h6 {
    font-size: 22px;
    margin: 0
}

label {
    cursor: pointer
}

img {
    border: 0
}

img.left {
    float: left;
    margin: 0 12px 0 0
}

img.right {
    float: right;
    margin: 5px 10px 0
}

img.shadow {
    border: 4px solid #fff;
    box-shadow: 0 3px 4px 0 silver
}

h3.h_green {
    color: #9ccc16;
    font-size: 20px;
    font-weight: 700;
    padding-top: 10px
}

ul.style1 {
    margin: 5px 0 0 20px
}

ul.style1 li {
    background: url(../images/check1.png) no-repeat left top;
    padding: 2px 0 10px 27px
}

ul.style2 {
    margin: 5px 0 0 20px
}

ul.style2 li {
    background: url(../images/arrow_blue.png) no-repeat left top;
    padding: 0 0 10px 27px
}

.bold {
    font-weight: 700
}

.t-normal {
    font-weight: 400
}

.t-left {
    text-align: left
}

.t-center {
    text-align: center
}

.t-right {
    text-align: right
}

.t-justify {
    text-align: justify
}

.italic {
    font-style: italic
}

.under-line {
    text-decoration: underline
}

.over-line {
    text-decoration: line-through
}

.t-shadow {
    text-shadow: 1px 1px #656565
}

.h-grey {
    background: #e6e6e6;
    padding: 8px;
    font-weight: 700;
    margin: 0 3px 5px 0;
    font-size: 16px;
    border-radius: 2px 2px 2px 2px
}

.cross {
    position: relative;
    display: inline-block
}

.cross::before, .cross::after {
    content: '';
    width: 100%;
    position: absolute;
    right: 0;
    top: 50%
}

.cross::before {
    border-bottom: 1px solid #454545;
    -webkit-transform: skewY(-18deg);
    transform: skewY(-18deg)
}

.cross::after {
    border-bottom: 1px solid #454545;
    -webkit-transform: skewY(18deg);
    transform: skewY(18deg)
}

.black {
    color: #000
}

.black2 {
    color: #454545
}

.grey {
    color: #737a7f
}

.white {
    color: #fff
}

.red {
    color: red
}

.claret {
    color: #DB3C15
}

.red2 {
    color: #941919
}

.blue {
    color: #3f71ad
}

.blue2 {
    color: #0076a3
}

.blue3 {
    color: #0671AD
}

.green {
    color: #390
}

.green1 {
    color: #9ccc16
}

.green2 {
    color: #390
}

.green3 {
    color: #1e9e47
}

.orange {
    color: #f90
}

.orange1 {
    color: #f0c338
}

.aqua {
    color: #12a0ab
}

.pink {
    color: #e20074
}

.price {
    width: 65px;
    background: #00CB0D;
    border-radius: 3px;
    color: #FFF;
    font-weight: 700;
    text-align: center;
    padding: 3px;
    float: right;
    height: 19px
}

.price-left {
    width: 65px;
    background: #00CB0D;
    border-radius: 3px;
    color: #FFF;
    font-weight: 700;
    text-align: center;
    padding: 3px 14px;
    height: 19px
}

.price2 {
    width: 65px;
    background: #00CB0D;
    border-radius: 3px;
    color: #FFF;
    font-weight: 700;
    text-align: center;
    padding: 3px;
    float: left;
    margin-right: 5px
}

.price_tag {
    position: absolute;
    bottom: 21px;
    right: 12px;
    width: 40px;
    background: url(../images/content/price_tag.png) no-repeat right center;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    text-align: right;
    padding: 6px 36px 7px 5px;
    float: right;
    margin-top: 5px
}

.price_tag_3 {
    width: 60px;
    background: url(../images/bg/price_tag_3.png) no-repeat right center;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    text-align: right;
    padding: 7px 60px 7px 5px;
    float: right;
    margin-top: 5px
}

.span1 {
    margin: 10px 10px 0 0;
    padding: 10px;
    background: #ABCF38;
    font-size: 12px;
    font-weight: 700;
    display: inline-block
}

.anleitung-box {
    height: 63px
}

.f11 {
    font-size: 11px
}

.f12 {
    font-size: 12px
}

.f14 {
    font-size: 14px
}

.f16 {
    font-size: 16px
}

.f18 {
    font-size: 18px
}

.f20 {
    font-size: 20px
}

.f22 {
    font-size: 22px
}

.f24 {
    font-size: 24px
}

.f26 {
    font-size: 26px
}

.f30 {
    font-size: 30px
}

.l-height32 {
    line-height: 32px
}

.indent0 {
    padding-left: 0;
    margin-left: 0
}

.indent5 {
    margin-left: 5px
}

.indent10 {
    margin-left: 10px
}

.indent15 {
    margin-left: 15px
}

.indent20 {
    margin-left: 20px
}

.indent30 {
    margin-left: 30px
}

.indent40 {
    margin-left: 40px
}

.indent50 {
    margin-left: 50px
}

.indent60 {
    margin-left: 60px
}

.radius5 {
    border-radius: 5px
}

.radius10 {
    border-radius: 10px
}

.m-top {
    margin-top: 10px
}

.d_center {
    margin: 0 auto
}

.center {
    text-align: center
}

.f_left {
    float: left;
    position: relative
}

.f_right {
    float: right;
    position: relative
}

#player-small {
    width: 320px;
    margin-left: 10px
}

#player-big {
    width: 620px;
    margin-left: 10px
}

.side-wrap {
    float: left
}
.top-banner{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    background: url(../images/banner.jpg) no-repeat center;
    width: 100%;
    height: 434px;

}
.top-banner1{    
    margin: 0 40px;
    font-style: italic;
    font-size: 124%;
    line-height: 124%;
    background: url(../images/check1.png) no-repeat 0 0;
    padding: 0px 0px 0px 20px;
    color: #333;

}
.top-banner2{    
    margin: 0 40px;
    font-style: italic;
    font-size: 124%;
    line-height: 124%;
    background: url(../images/check1.png) no-repeat 0 0;
    padding: 0px 0px 0px 20px;
    color: #000;

}
.top-banner3{    
    font-style: italic;
    font-weight: 600;
    font-size: 62%;
    line-height: 124%;
    padding: 0px 0px 0px 20px;
    color: #fff;

}

.ortung1{
   position: relative;
    top: 48%;
    left: 44%;
    width: 7%;
    text-align: center;
    font-style: italic;
    font-size: 124%;
    font-weight: bold;
    line-height: 100%;
   
    color: #fff;
}
.ortung2{
   position: relative;
    top: 36%;
    left: 52%;
    width: 7%;
    text-align: center;
    font-style: italic;
    font-size: 124%;
    font-weight: bold;
    line-height: 100%;
    
    color: #fff;
}

.ortung3{
   position: relative;
    top: 28%;
    left: 61%;
    width: 7%;
    text-align: center;
    font-style: italic;
    font-size: 124%;
    font-weight: bold;
    line-height: 100%;
   
    color: #fff;
}

.ortung4{
   position: relative;
    top: 20%;
    left: 69%;
    width: 8%;
    text-align: center;
    font-style: italic;
    font-size: 124%;
    font-weight: bold;
    line-height: 100%;
    
    color: #fff;
}







.wrapper {
    width: 940px;
    margin: 0 auto;
    padding: 5px
}

.clearfix:after {
    content: " ";
    visibility: hidden;
    display: block;
    height: 0;
    clear: both
}

.line {
    border: 1px solid #f4f4f4;
    margin-bottom: 5px
}

.no-cursor {
    cursor: default
}

.telefon {
    position: relative;
    width: 120px;
    height: 75px;
    padding: 5px;
    margin: 0 auto
}

.telefon a {
    background: url(../images/rollover.png) no-repeat left top;
    width: 120px;
    height: 70px;
    display: block;
    cursor: pointer
}

.telefon a:hover {
    background: url(../images/rollover.png) no-repeat 0 -82px
}

.telefon .number {
    position: absolute;
    left: 125px;
    top: 30px;
    font-weight: 700;
    font-size: 18px;
    color: #390
}

.telefon .hours {
    position: absolute;
    left: 30px;
    top: 6px;
    font-weight: 700;
    font-size: 13px;
    color: #000
}

.telefon .sie {
    position: absolute;
    top: 58px;
    left: 33px;
    font-size: 18px;
    font-weight: 700
}

.rate {
    background: url(../images/rate_bg.png) no-repeat;
    width: 125px;
    height: 90px;
    margin: 0 auto;
    font-size: 12px
}

.rate img {
    padding: 33px 0 0 26px
}

.rate p {
    text-align: center;
    padding: 0
}

.rate p.k {
    font-size: 11px;
    line-height: 10px
}

.rate span {
    font-weight: 700;
    color: #000
}

.software-box table {
    width: 52%;
    color: #333;
    font-family: sans-serif;
    font-size: .9em;
    font-weight: 300;
    text-align: left;
    line-height: 20px;
    border-spacing: 0;
    border: 1px solid #428bca;
    margin: 20px auto 5px;
    border-radius: 5px
}

.software-box table.style2 {
    border: 1px solid #ddd
}

.software-box table.maxi {
    width: 65%
}

.software-box thead tr {
    background: #428bca;
    color: #fff;
    border: none;
    font-size: 18px;
    height: 50px
}

.software-box table.style2 thead tr {
    background: #f9f9f9;
    color: #454545;
    border: none;
    font-size: 18px;
    height: 50px
}

.software-box th {
    font-weight: 700
}

.software-box th:first-child, td:first-child {
    padding: 5px 15px 5px 20px;
    max-width: 780px
}

.software-box thead tr:last-child th {
    border-bottom: 2px solid #ddd;
    vertical-align: middle
}

.software-box tbody tr:hover {
    background-color: #f0fbff
}

.software-box tbody tr:last-child td {
    border: none
}

.software-box tbody td {
    border-bottom: 1px solid #ddd;
    position: relative
}

.software-box td:last-child {
    text-align: right;
    padding-right: 10px;
    vertical-align: middle
}

.software-box .more {
    width: 52%;
    margin: 0 auto
}

.software-box .more button {
    width: 270px;
    height: 52px;
    background: url(../images/buttons/more_button.png) no-repeat;
    border: 0;
    padding: 0 0 14px 45px;
    color: #1274c0;
    font-weight: 700;
    cursor: pointer
}

.software-box ul {
    list-style-type: square
}

.software-box ul li {
    margin-left: 17px;
    padding: 2px 0
}

.software-box .list-head {
    font-size: 14px;
    color: #390;
    font-weight: 700
}

.software-box .jahre {
    font-size: 16px;
    color: #00a1e6;
    text-decoration: underline
}

.black-box-wrap {
    width: 65%;
    margin: 0 auto
}

.black-box-top {
    position: relative;
    background: url(../images/content/black-box-bg.png) center top no-repeat;
    height: 300px;
    font-size: 24px;
    line-height: 27px
}

.black-box-top .p1 {
    position: absolute;
    top: 36px;
    left: 28.5%;
    color: #fff;
    text-shadow: 1px 1px 2px rgba(97, 87, 87, 1);
    font-weight: 700
}

.black-box-top .p2 {
    position: absolute;
    top: 83px;
    left: 41%;
    color: #fe6700;
    text-shadow: 1px 1px 2px rgba(97, 87, 87, 1);
    text-align: center
}

.black-box-top .p3 {
    position: absolute;
    top: 188px;
    left: 34%;
    color: #555;
    text-shadow: 1px 1px 2px rgba(97, 87, 87, 1);
    text-align: center
}

.col-10 {
    width: 100%
}

.col-5 {
    width: 50%;
    float: left
}

.col-7 {
    width: 64%;
    float: left;
    margin-right: 2%
}

.col-3 {
    width: 28%;
    float: left;
    margin-right: 2%
}

.black-box-grids {
    width: 90%;
    margin: 0 auto
}

.black-box-image {
    position: relative;
    background: url(../images/ortungs/black-box.png) center center no-repeat;
    height: 210px;
    margin-top: 10px
}

.black-box-image.basic {
    background: url(../images/ortungs/basic.png) center center no-repeat
}

.black-box-price {
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/price_tag_blue_2.png) no-repeat;
    width: 62px;
    height: 41px;
    padding: 86px 0 0;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: #fff
}

.black-box-grids .p1 {
    position: absolute;
    color: #941919;
    font-weight: 700;
    font-size: 19px;
    right: 7%;
    top: 70px
}

.black-box-grids .p2 {
    position: absolute;
    top: 131px;
    font-size: 12px;
    font-weight: 700
}

.expert-wrap {
    width: 100%
}

.expert-top {
    position: relative;
    background: url(../images/content/expert-bg.png) no-repeat;
    width: 645px;
    height: 390px;
    margin: 0 auto;
    font-size: 20px
}

.expert-top .p1 {
    position: absolute;
    top: 200px;
    left: 20px
}

.expert-top .p2 {
    position: absolute;
    top: 200px;
    left: 200px
}

.expert-mid {
    width: 645px;
    margin: 0 auto
}

.expert-mid span {
    font-weight: 700
}

.expert-mid .pins-1 {
    float: left;
    width: 50%;
    margin-left: 15px
}

.expert-mid .pins-2 {
    float: left;
    width: 47%
}

.handwerk-top {
    width: 100%;
    height: 340px;
    background: url(../images/content/handwerksbetriebe.png) center top no-repeat
}

.dienstleister-top {
    position: relative;
    width: 100%;
    height: 415px;
    background: url(../images/content/dienstleister-bg.png) center top no-repeat
}

.dienstleister-top ul {
    position: absolute;
    line-height: 20px;
    color: #A01F1F;
    top: 151px;
    left: 47%;
    font-weight: 700;
    list-style-type: disc
}

.dienstleister-top .p1 {
    position: absolute;
    top: 22px;
    left: 20%;
    color: #fff;
    font-size: 22px
}

.dienstleister-top .p2 {
    position: absolute;
    top: 70px;
    left: 44%;
    color: #fff;
    font-size: 22px;
    text-align: center;
    line-height: 22px
}

.spedition-top {
    position: relative;
    width: 100%;
    height: 415px;
    background: url(../images/content/spedition-logistik-bg.png) center top no-repeat
}

.spedition-top .p1 {
    color: #DB3C15;
    font-size: 22px;
    font-weight: 700;
    position: absolute;
    top: 17px;
    left: 21%
}

.spedition-top .p2 {
    width: 257px;
    position: absolute;
    top: 68px;
    left: 21%
}

.spedition-box {
    width: 29.3%;
    float: left;
    margin: 10px 2%;
    background: url(../images/logistik_box_shadow.png) center bottom no-repeat;
    padding-bottom: 22px
}

.spedition-box section {
    width: 95%;
    padding: 15px 10px 5px 15px;
    text-align: center;
    border: 1px solid #ccc
}

.spedition-box .content {
    width: 97.7%;
    height: 216px;
    background-color: #f4f4f4;
    border: 1px solid #CECBCB;
    padding-top: 15px
}

.spedition-box h1 {
    min-height: 50px;
    color: #1E7C7C;
    font-size: 16px;
    font-weight: 700
}

.gps-tank-box {
    width: 95%;
    margin: 0 auto
}

.gps-tank-box .top {
    border-bottom: 5px solid #d92e4d;
    padding: 1%
}

.gps-tank-box .top .p1 {
    font-size: 30px;
    color: #1c9c42;
    font-weight: 700
}

.gps-tank-box .top .p2 {
    font-size: 26px;
    color: #1c9c42;
    font-weight: 700
}

.gps-tank-box .top .p3 {
    font-size: 26px;
    color: #d92e4d;
    font-weight: 700;
    float: right;
    margin-bottom: 10px
}

.gps-tank-box .mid {
    position: relative;
    background: url(../images/content/gps-tank1.png) center bottom no-repeat;
    text-align: center;
    height: 350px;
    padding-top: 12px
}

.gps-tank-box .mid .p1 {
    top: 10px;
    font-size: 26px;
    color: #d92e4d
}

.gps-tank-box .mid .p2 {
    position: absolute;
    bottom: 20px;
    left: 33%;
    text-align: center;
    font-size: 28px;
    color: #256294
}

.gps-tank-box .bot {
    background: url(../images/content/gps-tank2.png) repeat-y;
    text-align: center;
    padding: 20px 0
}

.gps-tank-box .bot .p1 {
    font-size: 22px;
    color: #256294
}

.gps-tank-box .bot .p2 {
    font-size: 22px;
    color: #1c9c42
}

.gps-tank-box .bot .ul1 li {
    font-weight: 700;
    padding-bottom: 5px
}

.kunden-bewertung {
    background: url(../images/kunden-bewertung.png) no-repeat center center;
    width: 111px;
    height: 106px;
    position: absolute;
    left: 52%;
}

.kunden-login-box {
    position: relative;
    width: 940px;
    height: 691px;
    background: url(../images/kunden-login-bg.png) no-repeat center center;
    margin: 0 auto
}

.kunden-login-box .p1 {
    color: #fff;
    font-size: 20px;
    line-height: 25px;
    padding-top: 25px;
    font-weight: 700;
    padding-left: 22px;
    text-align: center;
    width: 659px
}

.kunden-login-box .p2 {
       position: absolute;
    top: 324px;
    right: 84px;
    font-weight: 700;
    color: #fff;
    font-size: 20px;
}

.kunden-login-box .p4-1 {
    color: #fff;
    width: 626px;
    text-align: center;
    padding-top: 30px;
    font-size: 20px;
    margin-bottom: 24px
}

.kunden-login-box .info {
    position: absolute;
    top: 170px;
    right: 71px
}

.kunden-login-box .login-form {
        position: absolute;
    top: 384px;
    right: 16px;
}

.kunden-login-box input.username {
    height: 18px;
    font-size: 12px;
    width: 174px;
    padding: 2px 2px 0 24px;
    border: 0 solid;
    margin-top: 10px
}

.kunden-login-box input.password {
    border: 0 solid;
    height: 18px;
    font-size: 12px;
    width: 174px;
    padding: 2px 2px 0 24px;
    margin-top: 5px
}

.kunden-login-box button.login {
    background: url(../images/spriteimage_home.png) no-repeat scroll -849px -321px transparent;
    padding-top: 5px;
    border: 0 none;
    border-radius: 0 0 0 0;
    height: 20px;
    width: 25px;
    z-index: 3;
    cursor: pointer;
    vertical-align: bottom
}

.kunden-login-box button.login:hover {
    background: url(../images/spriteimage_home.png) no-repeat scroll -849px -341px transparent
}

.kunden-login-box a.login {
    background: url(../images/spriteimage_home.png) no-repeat scroll -849px -321px transparent;
    padding-top: 5px;
    border: 0 none;
    border-radius: 0 0 0 0;
    height: 16px;
    width: 25px;
    z-index: 3;
    cursor: pointer;
    vertical-align: bottom;
    margin-top: 6px
}

.kunden-login-box .kunden-login-head4 {
   position: absolute;
    top: 130px;
    left: 636px;
    width: 244px;
    font-size: 24px;
    line-height: 26px;
    text-align: center;
    font-weight: 500;
}

.wrap ul > li {
    margin-top: 10px
}

@media only screen and (max-width: 1366px) and (min-width: 1280px) {
    .black-box-wrap {
        width: 78%
    }

    .view-seventh-wrap {
        width: 100%
    }

    .software-box table {
        width: 70%
    }

    .software-box .more {
        width: 70%
    }
}

@media only screen and (max-width: 1280px) and (min-width: 1024px) {
    .black-box-wrap {
        width: 89%
    }

    .black-box-top .p1 {
        left: 26%
    }

    .software-box table {
        width: 80%
    }

    .software-box .more {
        width: 80%
    }
}

@media only screen and (max-width: 1024px) and (min-width: 900px) {
    .black-box-wrap {
        width: 100%
    }

    .black-box-top {
        background-size: 100%;
        font-size: 20px
    }

    .black-box-top .p1 {
        top: 31px
    }

    .black-box-top .p2 {
        top: 66px
    }

    .black-box-top .p3 {
        top: 154px
    }

    .black-box-image {
        background-size: 55%
    }

    .black-box-image.basic {
        background-size: 55%
    }

    .software-box table {
        width: 90%
    }

    .software-box .more {
        width: 90%
    }
}

@media only screen and (max-width: 900px) and (min-width: 640px) {
    .top-banner1{    
        margin: 0 20px;
    }
    .top-banner2{    
        margin: 0 20px;
    }
    .col-5 {
        width: 100%
    }

    .col-7 {
        width: 100%;
        float: none
    }

    .black-box-wrap {
        width: 100%
    }

    .black-box-top {
        background-size: 100%;
        font-size: 15px;
        line-height: 19px;
        height: 200px
    }

    .black-box-top .p1 {
        top: 22px;
        left: 27.5%
    }

    .black-box-top .p2 {
        top: 51px
    }

    .black-box-top .p3 {
        top: 111px
    }

    .spedition-box {
        width: 45%
    }

    .software-box table {
        width: 90%
    }

    .software-box .more {
        width: 90%
    }
}

@media only screen and (max-width: 640px) and (min-width: 480px) {
    .top-banner1{    
        margin: 0 20px;
    }
    .top-banner2{    
        margin: 0 20px;
    }
    .col-5 {
        width: 100%
    }

    .col-7 {
        width: 100%;
        float: none
    }

    .black-box-wrap {
        width: 100%
    }

    .black-box-top {
        background-size: 100%;
        font-size: 15px;
        line-height: 19px
    }

    .black-box-top .p1 {
        top: 22px;
        left: 27.5%
    }

    .black-box-top .p2 {
        top: 51px
    }

    .black-box-top .p3 {
        top: 111px
    }

    .spedition-box {
        width: 100%
    }

    .panel {
        width: 300px
    }

    .software-box table {
        width: 90%
    }

    .software-box .more {
        width: 90%
    }
}

@media only screen and (max-width: 480px) and (min-width: 320px) {
    .top-banner1{    
        margin: 0 20px;
    }
    .top-banner2{    
        margin: 0 20px;
    }
    .col-5 {
        width: 100%
    }

    .col-7 {
        width: 100%;
        float: none
    }

    .black-box-wrap {
        width: 100%
    }

    .black-box-top {
        display: none
    }

    .expert-top {
        background-size: 43%;
        height: 340px
    }

    .expert-top .p1 {
        top: 162px;
        left: 0;
        font-size: 14px;
        font-weight: 700
    }

    .expert-top .p2 {
        left: 0;
        font-size: 14px
    }

    .expert-mid {
        width: 100%
    }

    .expert-mid .pins-1 {
        width: 100%;
        margin-left: 0
    }

    .expert-mid .pins-2 {
        width: 100%
    }

    .spedition-box {
        width: 100%
    }

    .panel {
        width: 270px
    }

    .software-box table {
        width: 100%
    }

    .software-box .more {
        width: 100%
    }
}

@media only screen and (max-width: 320px) and (min-width: 240px) {
    .top-banner1{    
        margin: 0 20px;
    }
    .top-banner2{    
        margin: 0 20px;
    }
    .col-5 {
        width: 100%
    }

    .col-7 {
        width: 100%;
        float: none
    }

    .black-box-wrap {
        width: 100%
    }

    .black-box-top {
        display: none
    }

    .spedition-box {
        width: 100%
    }

    .panel {
        width: 240px
    }

    .software-box table {
        width: 100%
    }

    .software-box .more {
        width: 100%
    }
}


/* Start New CSS */

.title {
    margin: 0px 50px;
    font-size: 24px;
    font-weight: 700;
    font-style: italic;
    line-height: 30px;
    color: #f17f29;
    text-shadow: 2px 2px #000;
}

.sub-title {
    font-size: 20px;
    font-weight: 700;
    margin: 15px 0;
    text-align: center;
    min-height: 50px;
    color: #1E7C7C;
    font-size: 16px;
}

.banner-top {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    height: 90%;
}

.banner-bottom {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    height: 10%;
    align-self: end;
}

.home-branches {
    box-sizing: border-box;
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: flex-start;
    align-content: flex-start;
    height: auto;
    background: none;
}

.container-first {
    display: flex;
    width: 100%;
    height: auto;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.container-second {
    display: flex;
    width: 100%;
    height: auto;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
}

.countries {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    width: 50%;
    min-height: 168px;
    height: auto;
    padding-bottom: 5px;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 90% 100%;
}

.countries_wrapper {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto;
}

.free {
    float: none;
}

.video-title {
    color: #c4544b;font-size: 36px;line-height: 44px;font-weight: bold;margin-bottom: 20px;margin-top: 30px;
}

@media only screen and (max-width: 900px) and (min-width: 240px) {
    .container-second {
        flex-direction: column;
    }
    
}
.countries.holland {
    background-image: url(../images/branches-bg_01.png);

}
.countries.germany {
    background-image: url(../images/branches-bg_02.png);

    
}
.countries.osterreich {
    background-image: url(../images/branches-bg_03.png);

    
}
.countries.turkey {
    background-image: url(../images/branches-bg_04.png);

    
}

/* End New CSS */