@charset "utf-8";
@import url('font.css');

* { margin: 0; padding: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-text-size-adjust: none; }


img { border:none; max-width: 100%; height: auto; }


html, body { font-family: 'Roboto Slab', serif; font-weight: 400; height: 100%; }
html { overflow-y: scroll; }


:focus { outline: none; }
h1, h2, h3, h4, h5 { font-weight: 400; }
fieldset { border: none; }
iframe { max-width: 100%; }


select { border-radius: 0; }
textarea,input[type="text"],input[type="submit"] { -webkit-appearance: none; border-radius: 0; }
::-webkit-input-placeholder { color: #000000; } .parsley-error::-webkit-input-placeholder { color: red; }
:-moz-placeholder { color: #000000; opacity: 1; } .parsley-error:-moz-placeholder { color: red; opacity: 1; }
::-moz-placeholder { color: #000000; opacity: 1; } .parsley-error::-moz-placeholder { color: red; opacity: 1; }
:-ms-input-placeholder { color: #000000; } .parsley-error:-ms-input-placeholder { color: red; }


b, strong { font-weight: 700; }


hr { height: 1px; border-width: 1px 0 0 0; border-style: solid; border-color: #000000; }


a { color: inherit; text-decoration: none; }

.text-left, .ce-headline-left { text-align: left; }
.text-right, .ce-headline-right { text-align: right; }
.text-center, .ce-headline-center { text-align: center; }
.text-justify { text-align: justify; }


/* buttons */
.button { display: inline-block; padding: 10px 20px; }
.button:hover {  }
.button:after { content:''; font-family: Verdana, Arial, sans-serif; } /* safari line-height hack */


/* displays */
main, header, footer, nav, section, article { display: block; }


/* limiters */
.inner, .inner-1280 { max-width: 1280px; margin: 0 auto; }
.inner-1740 { max-width: 1740px; margin: 0 auto; }


/* clearer */
.clear { line-height: 0; font-size: 0; height: 0; text-indent: -999px; clear: both; }
.footer:after,
.row:after { clear: both; content: ''; display: table; }
#naviFooter ul { list-style: none; }


/* floatings */
.float-left { float: left; }
.float-right { float: right; }
.float-none { float: none; }


/* effects */
#naviMain > ul > li > a,
.effect { -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }


/* font-sizes */
.size-14, #naviFooter a, #naviFooter li { font-size: 14px; }
.size-18, html, body, h3 { font-size: 18px; }
.size-20, footer p { font-size: 20px; }
.size-28, h2 { font-size: 28px; }
.size-38, h1 { font-size: 38px; }
.size-26, .home h2 { font-size: 26px; }
.size-60, .home h1 { font-size: 60px; }


/* line-heights */
.line-height-28, .content p, .content ul li { line-height: 28px; }


/* colors */
.color.white, .home .content { color: #FFF; }
.color.grey, html, body, .button { color: #2e2d2c; }


/* background-colors */
.background.white, .button { background-color: #FFF; }


/* margins */
.margin-28, .content p, .content ul, .content ol, .content hr { margin-bottom: 28px; }


/* header */
.header { border-bottom: 1px solid #e6223d; }
.header .inner-1740 { display: flex; align-items: center; padding-top: 25px; padding-bottom: 25px; }
.header .logo { width: 50%; }
.header .logo a { display: block; line-height: 0; font-size: 0; }
.header .logo a img { max-width: 300px; }
.header .contact-button { margin-left: auto; }
.header .contact-button a.button { padding: 9px 70px; border: 1px solid #e6223d; font-weight: 600; text-transform: uppercase; }


/* content */
.home .content { padding-top: 0; display: flex; flex-direction: column; justify-content: center; min-height: 840px; background-image: url(../images/es-personaldienstleistungen-logistik-produktion.jpg); background-size: cover; background-repeat: no-repeat; }
.home .content .inner {  }
.content { padding-top: 110px; margin-bottom: 40px; }
.home .content h1 { line-height: 80px; margin-bottom: 30px; font-weight: 600; }
.home .content h2 { line-height: 40px; margin-bottom: 40px; font-weight: 600; }
.content h1 { line-height: 28px; margin-bottom: 30px; }
.content h2 { line-height: 28px; margin-bottom: 0; }
.content h3 { margin-bottom: 28px; line-height: 28px; }
.content ul, .content ol { margin-left: 18px; }
.content ul { text-align: left; }


/* footer */
.home footer { padding-top: 0; }
footer { padding-top: 80px; padding-bottom: 20px; }
footer .bildmarke { max-width: 90px; margin: 0 auto; padding-bottom: 30px; }
footer p { margin-bottom: 60px; text-align: center; line-height: 40px; }

#naviFooter { text-align: center; }
#naviFooter > ul > li { display: inline-block; padding: 0 10px; }
#naviFooter > ul > li.active > a,
#naviFooter > ul > li > a:hover { text-decoration: underline; }


@media ( max-width : 1780px ) {
    .inner-1740 { margin: 0 20px; }
}

@media ( max-width : 1200px ) {
    .inner { margin: 0 20px; }
}

@media ( max-width : 1024px ) {
    .home .content h1 { line-height: 60px; font-size: 40px; }
    .home .content h2 { line-height: 36px; font-size: 22px; }
}

@media ( max-width : 800px ) {
    .size-28, h2 { font-size: 22px; }
    .size-36, h1 { font-size: 32px; }
}

@media ( max-width : 700px ) {
    footer p { font-size: 16px; }
}

@media ( max-width : 600px ) {
    .home .content h1 { line-height: 50px; font-size: 30px; }
    .home .content h2 { line-height: 34px; font-size: 20px; }
    .header .contact-button a.button { padding: 9px 30px; }
    .size-28, h2 { font-size: 20px; }
    .size-36, h1 { font-size: 30px; }
}

@media ( max-width : 450px ) {
    .header .contact-button a.button { padding: 4px 15px; }
}