/* cmsms stylesheet: Fields 2025 modified: Monday, May 26, 2025 1:32:18 PM */



html {background: #f9f9f9}
body {font-family: "Whitney A", "Whitney B", sans-serif; font-weight:500; font-size: 19px; line-height:140%; color: #111;
-webkit-font-smoothing:antialiased; -moz-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; font-smoothing:antialiased }

::-moz-selection { color: black; background:rgba(0,0,0,0.1) }
::selection { color: black; background:rgba(0,0,0,0.1) }

h1,h2,h3,h4 {color:#111; font-family: "Whitney A", "Whitney B", sans-serif; font-weight:normal}
h1 { font-size:3.2em; font-weight:300 }
h2 { font-size:1.5em; margin: 0;font-weight:400 }
h3 { font-size: 1.3em; font-weight:500 }

strong { font-weight:600 }

a:hover { text-decoration: none }
span.red {color:#d03232;}


.newsbutton { font-weight: 500; font-size:0.9em; line-height:130%; width:120px; height: 120px; color: white; background: #d03232; border-radius:50%; text-align: center; top: 150px; left: calc(50vw + 500px); 
rotate: 15deg; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.15) }
.buttontext { padding-top: 15px }

.headline-left { padding-left:118px }
.headline-right { display:block; padding-left:446px }



#container { max-width: 1160px }


/* Header */

header { padding: 30px 0 60px }

#logo {float:left;}
#logo img { width:90px; vertical-align: top; margin:24px 28px 0 0 }
#logo a {color:#111; text-decoration:none; }
#logotype:hover { text-decoration: none }
#logotype {display:inline-block; font-weight:600; padding:60px 0 0 0;}

#desktopnav {float:right; margin:50px 0 0 0;}
#desktopnav ul {list-style:none; margin:0; padding:0;}
#desktopnav ul li {display:inline-block; transition:all .1s ease-in-out }
#desktopnav ul li a {display:block; color:#111; font-weight:600; padding:10px 17px; text-decoration:none; transition: all .1s ease-in-out;}
#desktopnav ul li:last-child a { padding-right: 0 }
/* #desktopnav ul li a:hover, */ #desktopnav ul li a.currentpage, #desktopnav ul li a.activeparent {color:#d03232;}
#desktopnav ul ul { font-size:1em}
#desktopnav ul ul li {display:block; font-size:0.9em; line-height:130%; }
#desktopnav ul ul li a { font-weight:500 }
#desktopnav ul ul li:last-child a { padding:10px 17px }
/* #desktopnav ul ul li a:hover  {background:#d03232; color:#fff;} */
#desktopnav ul ul li a.currentpage { color: #d03232; font-weight:600 }
#desktopnav ul ul li a.currentpage:hover, #desktopnav ul ul li a.activeparent:hover {color:#d03232; background:transparent;}

#desktopnav .uk-dropdown {margin:0; padding:0; background:#fff; overflow:hidden;}

img.header_image {display:block; width:100%; }


/* Inhaltsbereich */


#titel { padding: 10px 0 40px }

#kacheln { margin-bottom: 40px }
.uk-card { background-image: url(/uploads/images/kacheln/pcb.jpg); background-size: cover; background-image:none }
.kachel { height: 30vh; min-height:250px; max-height: 300px }
.kacheltitel { margin: 10px; padding: 5px 0 }
.kacheltitel h2 { font-size: 1em; line-height:140%; }
.kacheltitel span { font-weight:600; color: #f9f9f9; color: black; background: #f9f9f9; background:white; padding: 4px 10px 5px 10px; -webkit-box-decoration-break: clone; box-decoration-break: clone }

.uk-card-body { font-size: 0.9em  }
.uk-card-body ul { margin: 0 0 0 10px; padding: 0 }
.uk-card-body ul li { color: #111 }
.projectlink { margin-top: 15px }
.projectlink a, .projectlink a:hover { color: #d03232 }
.projectlink a:after { content:"";background:url(/img/pfeil-rechts-rot.svg) no-repeat; display: inline-block; width: 10px; height:15px; margin: 0 0 -5px 8px; }


#content { padding:10px 120px 40px 120px;}
#content a {color:#d03232;}
#content img { margin:10px 0 }

.bigpic { max-width: 600px }

.partner { padding-bottom: 40px }
.partnerlogo { font-size: 0.9em; line-height: 120%; margin: 0 0 10px 0 }
.partnerlogo img { padding: 10px; margin: 0 !important }
.partnerlogo a { color: #111 !important }
.partnerlogo .legende { margin: 10px 0 0 10px }

.distributor { padding-bottom: 60px; max-width: 300px }
.distributorlogo { padding: 10px }
.distributor .legende { margin: 10px 0 0 10px }
.distributor .legende a:after { content:"";background:url(/img/pfeil-rechts-rot.svg) no-repeat; display: inline-block; width: 10px; height:15px; margin: 0 0 -5px 8px; }

footer { font-weight:500; padding:60px 0; text-align:center; font-size: 0.9em; line-height: 200% }
footer a, footer a:hover { color: #111 }









/* Responsive */

.mobile { display: none }

@media screen and (max-width:1279px) { .newsbutton { left: auto; right: 20px } }
@media screen and (max-width:1099px) { .headline-right { padding-left: 365px } }
@media screen and (max-width:1023px) { .headline-right { padding-left: 181px } }
@media screen and (max-width:959px) { .headline-right { padding-left: calc( 181px - 118px) } }



@media screen and (min-width:768px) {
#toggle,#mobilenav {display:none }
.bigpic { max-width:600px }
}

@media screen and (min-width:768px) and (max-width:859px) {
#desktopnav ul li a { padding:10px 8px }
}


@media screen and (max-width:767px) {
.desktop { display: none }
.mobile { display: block }
header { padding: 0 0 30px 0 }
#logo img {width:60px}
#logotype {display:inline-block; padding:41px 0 0 0;}

.headline-left { padding-left: 0 }
.headline-right { padding-left:0 }

.newsbutton { top: 100px; }

h1 { font-size: 2.4em }
h2 { font-size: 1.3em; line-height: 120% }

table { font-size: 0.8em }

.newsbutton { position: absolute; right: 10px }

#toggle {outline:none; position:absolute; z-index:999; top:30px; right:5px; font-size:1em; border:0; padding:10px 15px; color:#333; background:transparent;cursor:pointer;}

.uk-card { max-width: 400px; }
.kachel { height:240px }
#content {padding:15px 0; }
.bigpic { max-width:100% }

#desktopnav {display:none;}
#mobilenav { width: 100%; position: absolute; top: 90px }
#mobilenav ul {display:block; list-style:none; margin:0; padding: 20px 0 0 0 }
#mobilenav ul li {display:block;}
#mobilenav ul li a { text-align: center; display:block; padding:20px 0 10px 0; color:#111; font-size: 1.8em; line-height:130%; text-decoration:none; font-weight:300;}
#mobilenav ul li a.currentpage, #mobilenav ul li a.activeparent {color: #d03232;}

#mobilenav ul ul { padding-top: 0 }
#mobilenav ul ul li {border:none;}
#mobilenav ul ul li a {padding:0 0 10px 0; text-transform:none; letter-spacing:0; font-weight:400; font-size: 1.1em; line-height: 120% }

#mobilenav ul ul li a.currentpage {color: #d03232; font-weight:400; background:transparent;}

.overlay { padding: 10px }
.uk-slideshow-items { width: calc( 100% + 30px ); margin-left:-15px; height: 50vh }
.uk-slidenav { display: none }



@media screen and (min-width:480px) and (max-width:767px) {
#content {padding:20px 0 }
}

@media screen and (max-width:639px) {
h1 { font-size: 1.8em }
}

@media screen and (max-width:479px) {
.headline-left, .headline-right { font-size: 9vw }
.newsbutton { top: 200px; right:15px; z-index:10; }
}

@media screen and (max-width:279px) {
#logotype { display:none }
}
