@import url("../../../../_Fonts/barlow/barlow.css");

body {
    font-family: 'Barlow', sans-serif;
}

p.align-left,
h1.align-left,
h2.align-left,
h3.align-left,
h4.align-left,
h5.align-left,
h6.align-left,
td.align-left,
input[type=text],
input[type=checkbox],
#nav li ul li a {
    text-align: left;
}


p.align-center,
h1.align-center,
h2.align-center,
h3.align-center,
h4.align-center,
h5.align-center,
h6.align-center,
td.align-center,
.info-button-small,
a.info-button-small,
li a.info-button-small,
p a.info-button-small,
.phone-lead-bottom,
.phone-lead-bottom p,
.lead-form input[type=checkbox],
.input-1, .input-2,
.select-1,
.conversion-form-1 select,
nav .col_12,
.teaser-box-4 .teaser-content,
.conversion-box-1,
.conversion-form-1,
.eventfact-icon,
.ts-skin tbody td .lead-button-big,
.center {
    text-align: center;
}

p.align-right,
h1.align-right,
h2.align-right,
h3.align-right,
h4.align-right,
h5.align-right,
h6.align-right,
td.align-right,
.header-navi {
    text-align: right;
}

p.align-justify,
h1.align-justify,
h2.align-justify,
h3.align-justify,
h4.align-justify,
h5.align-justify,
h6.align-justify,
td.align-justify {
    text-align: justify;
}

#breadcrumb-nav li,
footer li,
footer .standorte li,
.soforthilfe .soforthilfe-form li,
#rwform li,
.header-navi li,
.language-navi li,
nav li,
.conversion-form-1 ul li,
.page-navigation li,
.news-prev a,
.news-back a,
.news-next a {
    list-style-type: none;
}

h1, h2, h3, h4, h5, h6 {
    padding: 0 0 15px 0;

}

h1 {
    font-size: 38px;
    line-height: 44px;
    font-weight: 700;
}

h2 {
    font-size: 28px;
    line-height: 36px;
    font-weight: 500;
}

h3 {
    font-size: 24px;
    line-height: 30px;
    font-weight: 400;
}

h4 {
    font-size: 22px;
    line-height: 26px;
    font-weight: 400;
}

h5 {
    font-size: 18px;
    line-height: 22px;
    font-weight: 400;
}

h6 {
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
}

.box-content p,
.teaser-content p {
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    padding: 0 0 15px 0;
}

.box-content li {
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    padding: 5px 0;
}


li h6,
li h5,
li h4,
li h3,
li h2,
li h1{
    padding: 0;
}

.box-content ul, .box-content ol {
    margin: 0 0 0 25px;
}

/*ul li, ol li {
    margin: 5px 0;
}

.box-content ul li {
    margin: 0 0 7px 0;
}*/

b, strong, a {
    font-weight: 700;
}

a {
    text-decoration: none;
}

/* -------------------  Standard Type Size  ---------------------*/
.big-button,
.info-button-big,
.info-button-big-hback,
.lead-button-big,
.prime-btn,
.lead-button-big-hback,
a.button, a.button-1,
.button-file,
nav li,
#nav > ul > li > a,
#nav li ul a,
.eventfact-name h4,
.ts-skin tbody td,
.eventfact-name p,
.ts-skin thead th,
.news .content-box-1 p,
.col_03 .teaser-box-2 .teaser-content h5,
.col_04 .teaser-box-2 .teaser-content p,
footer h2 {
    font-size: 14px;
}

.big-button,
.info-button-big,
.info-button-big-hback,
.lead-button-big,
.lead-button-big-hback{
    font-size: 16px;
}

/* ------------------- 16 px Type Size ---------------------*/
.phone-lead-bottom .phone-number,
.phone-lead-bottom p .phone-number,
.soforthilfe .soforthilfe-flag .textrotate,
.lead-button,
.section .headline,
.info-box-content h2,
.pageheader-copy p,
.rwslider .slider-copy p,
.col_04 .teaser-box-2 .teaser-content h5 {
    font-size: 16px;
}

/* ------------------- 12 px Type Size ---------------------*/
footer .box-content p,
footer label,
footer .content-box-1 .col_03 p,
footer .content-box-1 .col_02 p b,
.phone-lead-bottom .phone-number-text,
.phone-lead-bottom p .phone-number-text,
.soforthilfe .soforthilfe-form p,
.teaser-category-flag,
.teaser-date-flag,
.teaser-box-1 .teaser-content,
.teaser-box-2 .teaser-content,
.teaser-box-3 .teaser-content,
.teaser-box-4 .teaser-content,
.teaser-box-6 .teaser-content,
.page-navigation,
.page-navigation li,
.news-prev a,
.news-back a,
.news-next a,
.ts-skin tbody td .lead-button-big,
.header-navi ul li a,
#breadcrumb-nav li a {
    font-size: 14px;
    line-height: 20px;
}

/* ------------------- 10 px Type Size ---------------------*/
.small-button,
.info-button-small,
.info-button-small-hback,
a.info-button-small-hback,
a.info-button-small,
li a.info-button-small,
.lead-button-small,
a.lead-button-small,
.lead-button-small-hback,
a.lead-button-small-hback,
li a.lead-button-small,
.col_03 .teaser-box-2 .teaser-content p {
    font-size: 10px;
}

/* -------------------  Uppercase  ---------------------*/
.big-button,
.info-button-big,
.info-button-big-hback,
.lead-button-big,
.lead-button-big-hback,
a.button, a.button-1,
.button-file,
.soforthilfe .soforthilfe-flag .textrotate,
.lead-image-header-content h1,
.lead-form-header h2,
.lead-button,
.section .headline,
nav li a,
.pageheader .pageheader-headline,
.rwslider .slider-headline,
    /*.teaser-content h5,*/
.teaser-category-flag,
.eventfact-name h4,
.ts-skin thead th {
    text-transform: uppercase;
}

/* -------------------  Font Weight 700  ---------------------*/
.big-button,
.info-button-big,
.info-button-big-hback,
.lead-button-big,
.lead-button-big-hback,
a.button, a.button-1,
.button-file,
.small-button,
.info-button-small,
.info-button-small-hback,
a.info-button-small-hback,
a.info-button-small,
li a.info-button-small,
.lead-button-small,
a.lead-button-small,
.lead-button-small-hback,
a.lead-button-small-hback,
li a.lead-button-small,
.phone-lead-bottom .phone-number,
.phone-lead-bottom p .phone-number,
.soforthilfe .soforthilfe-flag .textrotate,
.lead-image-header-content h1,
.lead-form-header h2,
.lead-button,
.section .headline,
#nav ul li,
.pageheader .pageheader-headline,
.pageheader .pageheader-subheadline,
.rwslider .slider-headline,
.rwslider .slider-subheadline,
.eventfact-name h4,
.ts-skin thead th {
    font-weight: 700;
}

.box-content ul li {
    list-style-position: outside;
}

.box-content ul li{
    list-style-type: none;
    list-style-position: outside;
    position: relative;
}

.box-content ul li::before{
    content: ' ';
    display: inline-block;
    width: 15px;
    height: 15px;
    position: absolute;
    top: 9px;
    left: -24px;
  /*  background: white;*/
    margin-right: 0.5em;
    /*background: url('../Images/icon_plus.png') no-repeat;*/
    transition: background 0.2s;
}

nav ul li.level1::before{
    content: ' ';
    display: inline-block;
    width: 15px;
    height: 15px;
    position: absolute;
    top: 4px;
    left: -1px;
    background: white;
    margin-right: 0.5em;
    /*background: url('../Images/icon_plus.png') no-repeat;*/
    transition: background 0.2s;
}

.box-content ol li::before{
    content: ' ';
    display: inline-block;
    width: 15px;
    height: 15px;
    position: absolute;
    top: 9px;
    left: -24px;
    background: white;
    margin-right: 0.5em;
    /*background: url('../Images/checkmark-blue.png') no-repeat;*/
    transition: background 0.2s;
}


footer .content-box-1 .col_02 p {
    font-size: 9px;
}

/* --------------  smartphone portrait  ---------------------------------------------------- */
@media screen and (min-width: 0px) and (max-width: 480px) {

    h1 {
        font-size: 38px;
        line-height: 44px;
    }

    h2 {
        font-size: 28px;
        line-height: 36px;

    }

    h3 {
        font-size: 24px;
        line-height: 30px;
    }

    h4 {
        font-size: 22px;
        line-height: 26px;
    }

    h5 {
        font-size: 18px;
        line-height: 22px;
    }

    h6 {
        font-size: 16px;
        line-height: 20px;
    }


    .box-content p,
    .teaser-content p,
    li {
        font-size: 16px;
        line-height: 22px;
    }
}

/* -------------- smartphone landscape  ---------------------------------------------------- */
@media screen and (min-width: 481px) and (max-width: 720px) {

    h1 {
        font-size: 38px;
        line-height: 44px;
    }

    h2 {
        font-size: 28px;
        line-height: 36px;

    }

    h3 {
        font-size: 24px;
        line-height: 30px;
    }

    h4 {
        font-size: 22px;
        line-height: 26px;
    }

    h5 {
        font-size: 18px;
        line-height: 22px;
    }

    h6 {
        font-size: 16px;
        line-height: 20px;
    }


    .box-content p,
    .teaser-content p,
    li {
        font-size: 16px;
        line-height: 22px;
    }
}

/* -------------- tablet portrait  ---------------------------------------------------- */
@media screen and (min-width: 721px) and (max-width: 800px) {

}

/* --------------  Tablet landscape  ---------------------------------------------------- */
@media screen and (min-width: 801px) and (max-width: 1024px) {

}

/* --------------  small-Size Desktop  ---------------------------------------------------- */
@media screen and (min-width: 1025px) and (max-width: 1440px) {
    h1, h2 {
       /* letter-spacing: -1px;*/
    }

    h3, h4 {
        letter-spacing: -0.5px;
    }

    h1 {
        font-size: 38px;
        line-height: 44px;
    }

    h2 {
        font-size: 28px;
        line-height: 36px;

    }

    h3 {
        font-size: 24px;
        line-height: 30px;
    }

    h4 {
        font-size: 22px;
        line-height: 26px;
    }

    h5 {
        font-size: 18px;
        line-height: 22px;
    }

    h6 {
        font-size: 18px;
        line-height: 22px;
    }


    .box-content p,
    .teaser-content p,
    li{
        font-size: 16px;
        line-height: 22px;
    }

}

/* --------------  Mid-Size Desktop  ----------------------------------------------------  */
@media screen and (min-width: 1441px) and (max-width: 1920px) {
    /*Mid-Size Desktop*/
    h1, h2, h3, h4, h5, h6 {
        padding: 0 0 10px 0;
    }

    /*    h1 {
            font-size: 2.7rem;
            line-height: 2.7rem;
        }

        h2 {
            font-size: 1.9rem;
            line-height: 2rem;
        }

        h3 {
            font-size: 1.4rem;
            line-height: 1.5rem;
        }*/

    .box-content p,
    .teaser-content p,
    li{
        font-size: 18px;
        line-height: 22px;
    }
}

/* --------------  big-Size Desktop  ---------------------------------------------------- */
@media screen and (min-width: 1921px) and (max-width: 5200px) {
    /*big-Size Desktop*/
    h1, h2 {
        letter-spacing: -1px;
    }

    h3, h4 {
        letter-spacing: -0.5px;
    }

    h1 {
        font-size: 38px;
        line-height: 44px;
    }

    h2 {
        font-size: 28px;
        line-height: 36px;

    }

    h3 {
        font-size: 24px;
        line-height: 30px;
    }

    h4 {
        font-size: 22px;
        line-height: 26px;
    }

    h5 {
        font-size: 18px;
        line-height: 22px;
    }

    h6 {
        font-size: 18px;
        line-height: 20px;
    }


    .box-content p,
    .teaser-content p,
    li{
        font-size: 18px;
        line-height: 22px;
    }

}
