html { overflow-y: scroll; }

html,
body {
	margin:0;
	padding:0;
	height:100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}

body {
	background-image: url(../images/template/bg_body.png);
	background-repeat: repeat-x;
	background-position: center 15px;
	background-color: #fff;
}

@font-face {
    font-family: "ArialNarrowRegular";
    src: url(../fonts/ArialNarrowRegular/ArialNarrowRegular.woff) format("woff");
    font-style: normal;
    font-weight: normal;
}
/* font-family: "ArialNarrowBold"; */
@font-face {
    font-family: "ArialNarrowBold";
    src: url(../fonts/ArialNarrowBold/ArialNarrowBold.woff) format("woff");
    font-style: normal;
    font-weight: normal;
}
/* font-family: "ArialNarrowItalic"; */
@font-face {
    font-family: "ArialNarrowItalic";
    src: url(../fonts/ArialNarrowItalic/ArialNarrowItalic.woff) format("woff");
    font-style: normal;
    font-weight: normal;
}
/* font-family: "ArialNarrowBoldItalic"; */
@font-face {
    font-family: "ArialNarrowBoldItalic";
    src: url(../fonts/ArialNarrowBoldItalic/ArialNarrowBoldItalic.woff) format("woff");
    font-style: normal;
    font-weight: normal;
}

#container {
	position:relative;
	height:auto !important; /* real browsers */
	height:100%; /* IE6: treaded as min-height*/
	min-height:100%; /* real browsers */
	background-image: url(../images/template/bg_linie.png);
	background-repeat: repeat-y;
	background-position: center top;
	z-index:1;
}

#wrapper {
	position:relative;
	width:826px; /*960*/
	margin:0px auto;	
	z-index:2;
}

h1, h2 {
	font-size: 26px;
	line-height: 1.2em;
	color: #077cc1;
	font-family: "ArialNarrowRegular", Arial, Helvetica, sans-serif;
	font-weight:lighter;
	margin-top:0px;
	margin-bottom:22px; /*25px*/
}

h2 { margin-bottom:18px; }
/*h2 { font-size: 22px; margin: 0.8em 0 1.0em 0; color: #004f9d; }*/
h3 { font-size: 16px; color: #077cc1; margin-top:25px; /*margin-bottom:20px;*/ }
h4 { font-size: 14px; }
h5 { font-size: 12px; }

img, 
a img { border:0; }

a { color: #0076be; text-decoration:none; }
a:hover { text-decoration:underline; }

.content a { color: #077cc1; }
.content   { color:#4b4a4d; line-height: 18px; /*1.5em*/}

p { margin: 0 0 18px 0; }

.content ul {
	margin: 0px 0px 18px 15px;
	padding: 0px 0px 10px 0px;
	/*list-style-type:none;*/
}
/*.content li {	list-style-image: url(../images/template/icon_square.png); } */

table td { vertical-align:top; }
table { font-size:12px; margin-bottom: 18px; }

#top-area {
	position:relative;
	width:100%;
	height:110px;
	background-color:#FFFFFF;
	/* Cover the container's side lines at fractional browser zoom levels. */
	box-shadow: 1px 0 0 #fff, -1px 0 0 #fff;
}

#logo {
	position:absolute;
	left: 0px;
	top: 16px;
}

#logo img {
	width:154px;
	height:auto;
	display:block;
}

#nav-image-area{
	position:relative;
	width:826px;
	height:213px;
	background-color:#FFFFFF;
}

#nav-image-area .image_right {
	position:absolute;
	right:1px;
	width:624px;
	height:213px;
}

#content-area {
	position:relative;
	/*float:left;*/  /*Problem !!*/
	width:100%; /*825px - 199*/
	height:auto;

	padding-bottom:93px;	/* footer höhe*/
}

/* Reserve the 96px desktop footer plus 32px of clear space below content. */
@media (min-width: 846px) {
    #content-area {
        padding-bottom: 128px;
    }
}

.content {
	position:relative;
	width:590px;
	margin-left:201px;
	margin-top:30px;
}

#slogan {
	position:absolute;
	right:644px;
	top:62px; /*39*/
	width:165px;
	height:auto;
	/*font-family: "Arial Narrow", Arial, Helvetica, sans-serif;*/
	color:#707173;
	font-size:10px;
	z-index:4;
}	
#slogan i { 
	font-family: "ArialNarrowRegular", Arial, Helvetica, sans-serif; 
	font-size:16px;
}	
	
#footer-area {
	position:absolute;
	width:100%;
	bottom:0;
	height:96px;
	background-color:#f4f7f9;
	border-top:1px solid #d8e2ea;
	z-index:6;
}


#copyright {
	position:absolute;
	right:16px;
	top:31px;
	width:auto;
	text-align:right;
}

#copyright a { color:#003f7d; text-decoration:none; }
#copyright a:hover {text-decoration:underline; }


.flagge{
	position:absolute;
	top:2px;
}



/* ======= Für allgemeine Bilder mit Text links oder rechts ======= */

.picleft,
.picright {
	max-width:270px;
	margin-top:3px;
	margin-bottom:15px;
}
.picleft { float:left; margin-right:15px; }
.picright { float:right; margin-left:10px; }

.piclegend{
	margin-top:10px;
	width:auto;
	font-style: italic;
}

.c1, .c2 { 
	/*height:109px;*/ 
	height:auto;
	width:100%;
	display:table;
	margin-bottom:18px;
}

.c2 {	
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #58585a;
	padding-bottom: 16px;
}

/* Wenn Bild innerhalb vom div kasten links*/
.c1_picleft {
	float:left;
	margin-top:3px;
	margin-right:15px;
}

.c3 {
	position:relative;
	float:left;
	width:180px;
	min-height:100px;
	margin-right:10px;
	margin-bottom:18px;
}
.c3_text { margin-top:3px; margin-bottom:0px; }
.c3 img { width:180px; }

/*für Team Einzeldarstellung*/
.c4 { 
	position:relative; 
	display:table; 
	width:100%; 
	height:auto;
}

.c4_texttop, 
.c4_textbottom { 
	position:absolute;
	left: 290px;
}

.c4_texttop { top:0px; }
.c4_textbottom { bottom:0px;}

.bildrahmen { border: 1px solid #999999; }


/* ======= Formular Layout ======= */

.textarea {
	width:475px; /*380*/
	height:100px;
}

.form {
	position:relative;
	height:auto;
	margin-bottom:5px;
}

.form-ta {
	position:relative;
	height: 55px;
	margin-bottom:5px;
}

.form-ta textarea {
	position:absolute;
	left: 180px;
	width:300px;
}

.form input{
	position:absolute;
	left: 180px;
	width:300px;
}

.form_submit {
	margin-top:15px;
	margin-left:180px;
}

.button {
	border: 1px solid #b1b4b8;
	background-color:#dde0e2;
	padding:1px;
}



/* KIBO 2026 refresh */
html,
body {
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #34363a;
}

h1,
h2 {
    font-family: "Segoe UI", Roboto, Arial, Helvetica, sans-serif;
    font-weight: 400;
    letter-spacing: 0;
    color: #077cc1;
}

h3 {
    font-weight: 600;
}

.content {
    color: #34363a;
    line-height: 1.58;
}

.content p,
.content li,
table {
    font-size: 13px;
}

.form input,
.form-ta textarea,
textarea.textarea,
input[type="text"] {
    border: 1px solid #cfd8df;
    border-radius: 3px;
    padding: 6px 8px;
    box-sizing: border-box;
}

input.button,
input.button.contact-submit,
.messe-button {
    border: 0;
    border-radius: 4px;
    background: #077cc1;
    color: #fff !important;
    padding: 8px 16px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
}

input.button:hover,
input.button.contact-submit:hover,
.messe-button:hover {
    background: #005f98;
    text-decoration: none;
}

/* KIBO contact form layout */
.contact-form-box {
    background-color:#f7f7f7;
    border:1px solid #dddddd;
    padding:18px;
    margin:18px 0 28px 0;
}

.form-intro {
    background-color:#f4f9fd;
    border-left:4px solid #077cc1;
    padding:12px 14px;
    margin-bottom:18px;
}

.form-subheadline {
    color:#077cc1;
    font-weight:bold;
    margin:18px 0 12px 0;
}

.form-field {
    margin-bottom:10px;
    overflow:hidden;
}

.form-field label {
    float:left;
    width:105px;
    line-height:25px;
    font-weight:bold;
}

.form-field input {
    float:left;
    width:360px;
    height:25px;
    border:1px solid #b1b4b8;
    background-color:#ffffff;
    padding:3px 6px;
    box-sizing:border-box;
    font-family:"Segoe UI", Roboto, Arial, Helvetica, sans-serif;
    font-size:13px;
}

.form-field.full label {
    float:none;
    display:block;
    width:auto;
    margin-bottom:7px;
    line-height:18px;
}

.form-field.full textarea {
    width:100%;
    height:125px;
    border:1px solid #b1b4b8;
    background-color:#ffffff;
    padding:7px;
    box-sizing:border-box;
    font-family:"Segoe UI", Roboto, Arial, Helvetica, sans-serif;
    font-size:13px;
    line-height:18px;
}

.required-note {
    font-size:14px;
    margin:8px 0 14px 105px;
}

.privacy-check {
    background-color:#ffffff;
    border:1px solid #dddddd;
    padding:12px;
    margin:14px 0 16px 0;
    overflow:hidden;
}

.privacy-check input {
    float:left;
    margin:3px 8px 0 0;
}

.privacy-check label {
    display:block;
    margin-left:24px;
    line-height:18px;
    font-weight:normal;
}

.form-submit-new {
    margin-left:105px;
    margin-top:16px;
}

.form-error-box {
    background-color:#fff1f1;
    border:1px solid #d98c8c;
    color:#9a0000;
    padding:10px 12px;
    margin-bottom:16px;
}

.form-error-box p {
    margin:0 0 6px 0;
}

.form-error-box p:last-child {
    margin-bottom:0;
}

.form-success-box {
    background-color:#f4f9fd;
    border:1px solid #c8d8e5;
    color:#333333;
    padding:14px 16px;
    margin:18px 0 28px 0;
}

.form-success-box p {
    margin:0 0 6px 0;
}

.form-success-box p:last-child {
    margin-bottom:0;
}

/* KIBO enquiry form layout */
.enquiry-form-box h3 {
    margin-top:0;
    margin-bottom:18px;
}

.enquiry-form-box form > table {
    width:100% !important;
    background:#ffffff;
    border:1px solid #dddddd;
    border-collapse:collapse;
    margin:0 0 18px 0;
}

.enquiry-form-box form > table td {
    padding:6px 8px;
    border-bottom:1px solid #edf1f4;
}

.enquiry-form-box form > table tr:first-child td {
    color:#077cc1;
    font-weight:bold;
    background:#f4f9fd;
}

.enquiry-form-box .row {
    margin-left:0;
    margin-right:0 !important;
}

.enquiry-form-box form > .row {
    background:#ffffff;
    border:1px solid #dddddd;
    padding:14px 10px 0 10px;
    margin-bottom:16px;
}

.enquiry-form-box input[type="text"] {
    border:1px solid #b1b4b8;
    background:#ffffff;
    border-radius:3px;
    padding:4px 6px;
    box-sizing:border-box;
}

.enquiry-form-box input[type="checkbox"] {
    margin-right:6px;
}

.enquiry-form-box .form-ta {
    position:static;
    height:auto;
    margin-bottom:12px;
    font-weight:bold;
}

.enquiry-form-box .form-ta textarea {
    position:static;
    display:block;
    width:100% !important;
    height:82px;
    margin-top:6px;
    border:1px solid #b1b4b8;
    background:#ffffff;
    border-radius:3px;
    padding:7px;
    box-sizing:border-box;
    font-family:"Segoe UI", Roboto, Arial, Helvetica, sans-serif;
    font-weight:normal;
}

.enquiry-form-box .form {
    position:static;
    min-height:31px;
    height:auto;
    margin-bottom:8px;
    overflow:hidden;
    font-weight:bold;
}

.enquiry-form-box .form input {
    position:static;
    float:right;
    width:360px;
    height:25px;
    font-weight:normal;
}

.enquiry-form-box .form-submit-new {
    margin-left:105px;
    margin-top:16px;
}

.enquiry-form-box .privacy-check {
    clear:both;
}

/* KIBO home header slider */
.home-header-slider {
    position:relative;
    width:624px;
    height:213px;
    overflow:hidden;
    background:#f2f4f6;
}

.home-header-slide {
    position:absolute;
    inset:0;
    width:624px;
    height:213px;
    opacity:0;
    animation:kiboHeaderFade 24s infinite;
}

.home-header-slide.active,
.home-header-slide:nth-child(1) {
    opacity:1;
}

.home-header-slide:nth-child(1) { animation-delay:0s; }
.home-header-slide:nth-child(2) { animation-delay:4s; }
.home-header-slide:nth-child(3) { animation-delay:8s; }
.home-header-slide:nth-child(4) { animation-delay:12s; }
.home-header-slide:nth-child(5) { animation-delay:16s; }
.home-header-slide:nth-child(6) { animation-delay:20s; }

@keyframes kiboHeaderFade {
    0% { opacity:0; }
    5% { opacity:1; }
    16% { opacity:1; }
    22% { opacity:0; }
    100% { opacity:0; }
}

@media (prefers-reduced-motion: reduce) {
    .home-header-slide {
        animation:none;
        opacity:0;
    }

    .home-header-slide:first-child {
        opacity:1;
    }
}


/* News cards */
.news-item {
    border: 1px solid #d9dde1;
    background: #ffffff;
    padding: 18px;
    margin: 0 0 24px 0;
}

.news-item img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 0 14px 0;
}

.news-item h3,
.news-item h4 {
    color: #077cc1;
    margin-top: 0;
    margin-bottom: 12px;
    line-height: 1.3;
}

.news-item h3 {
    font-size: 22px;
}

.news-item h4 {
    font-size: 20px;
}

.news-item p {
    margin: 0 0 14px 0;
}

.news-item p:last-child {
    margin-bottom: 0;
}

.news-actions {
    margin-top: 14px;
}

.btn-link {
    display: inline-block;
    padding: 7px 14px;
    margin: 0 8px 8px 0;
    background: #077cc1;
    color: #ffffff !important;
    border-radius: 20px;
    text-decoration: none !important;
    font-size: 14px;
    line-height: 1.4;
}

.btn-link:hover {
    background: #055f95;
    color: #ffffff !important;
    text-decoration: none !important;
}

.news-divider {
    margin: 0 0 24px 0;
    border: 0;
    border-top: 1px solid #d9dde1;
}
/* Komfort: dezenter Sprung zurueck nach oben auf langen Seiten */
.back-to-top {
    position: fixed;
    right: 28px;
    bottom: 28px;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #1c80c8;
    color: #fff;
    font-size: 22px;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
    z-index: 80;
    transition: background 160ms ease, transform 160ms ease;
}

.back-to-top:hover {
    background: #166aa8;
    color: #fff;
    text-decoration: none;
    transform: translateY(-2px);
}

#footer-content,
#footer-content a,
#copyright {
    font-size:14px;
    line-height:22px;
}
.site-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 34px;
    background: rgba(12, 18, 24, 0.84);
    box-sizing: border-box;
}

.site-lightbox.is-open {
    display: flex;
}

.site-lightbox__frame {
    position: relative;
    max-width: min(92vw, 1100px);
    max-height: 88vh;
}

.site-lightbox__image {
    display: block;
    max-width: 100%;
    max-height: 82vh;
    width: auto;
    height: auto;
    background: #fff;
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.35);
}

.site-lightbox__caption {
    margin-top: 10px;
    color: #fff;
    font-size: 14px;
    line-height: 1.4;
    text-align: center;
}

.site-lightbox__button {
    position: absolute;
    border: 0;
    background: #077cc1;
    color: #fff;
    cursor: pointer;
    font: 600 18px/1 Arial, Helvetica, sans-serif;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
}

.site-lightbox__button:hover,
.site-lightbox__button:focus {
    background: #096ea8;
    outline: none;
}

.site-lightbox__close {
    top: -18px;
    right: -18px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
}

.site-lightbox__nav {
    top: 50%;
    width: 42px;
    height: 54px;
    margin-top: -27px;
    border-radius: 4px;
}

.site-lightbox__prev {
    left: -58px;
}

.site-lightbox__next {
    right: -58px;
}

.site-lightbox__nav[hidden] {
    display: none;
}

@media (max-width: 760px) {
    .site-lightbox {
        padding: 18px;
    }

    .site-lightbox__prev {
        left: 8px;
    }

    .site-lightbox__next {
        right: 8px;
    }
}


/* Modern news page treatment */
.news-page {
    display: block;
}

.news-page > hr,
.news-page > br {
    display: none;
}

.news-page > p,
.news-page > div:not(.news-section-title):not(.news-actions) {
    border: 1px solid #d9dde1;
    background: #ffffff;
    padding: 18px;
    margin: 0 0 24px 0;
    box-sizing: border-box;
}

.news-page > div:empty {
    display: none;
}

.news-page > p:first-of-type,
.news-page > .news-highlight {
    background: #f4f9fd;
    border-left: 4px solid #077cc1;
}

.news-page .news-section-title {
    border: 0;
    background: transparent;
    padding: 0;
    margin: 26px 0 12px 0;
}

.news-page .news-section-title span,
.news-page > div > font:first-child,
.news-page > div > p:first-child > font:first-child {
    display: block;
    color: #077cc1;
    font-size: 18px;
    line-height: 1.35;
    margin: 0 0 12px 0;
}

.news-page > div > hr:last-child,
.news-page > div > hr:first-child {
    display: none;
}

.news-page img.img-responsive,
.news-page > div img,
.news-page > p img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 0 14px 0;
}

.news-page .news-item {
    box-shadow: none;
}

.news-page a:not(.btn-link)[target="_blank"] {
    font-weight: 600;
}

.kibo-wizard {
    background:#ffffff;
    border:1px solid #dddddd;
    padding:16px;
    margin-bottom:16px;
}

.kibo-wizard-progress {
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:6px;
    list-style:none;
    padding:0;
    margin:0 0 18px 0;
}

.kibo-wizard-progress li {
    background:#edf1f4;
    color:#5f6b73;
    font-weight:bold;
    padding:8px 10px;
    font-size:12px;
}

.kibo-wizard-progress li span {
    display:inline-block;
    min-width:20px;
    height:20px;
    line-height:20px;
    text-align:center;
    margin-right:6px;
    background:#ffffff;
    color:#077cc1;
    border-radius:50%;
}

.kibo-wizard-progress li.active {
    background:#077cc1;
    color:#ffffff;
}

.kibo-wizard-step {
    display:none;
}

.kibo-wizard-step.active {
    display:block;
}

.kibo-product-position {
    padding:14px;
    margin-bottom:14px;
    background:#ffffff;
    border:1px solid #d9dde1;
    box-sizing:border-box;
}

.kibo-position-head {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:12px;
}

.kibo-position-head strong {
    color:#077cc1;
}

.kibo-position-fields {
    display:grid;
    grid-template-columns:27% 20% 23% 20%;
    gap:12px;
    align-items:end;
}

.kibo-product-field,
.kibo-option-group label,
.kibo-dimensions-row label {
    display:block;
    font-weight:bold;
    margin-bottom:0;
}

.kibo-product-field {
    font-weight:500;
}

.kibo-product-field span {
    display:block;
    margin-bottom:6px;
    color:#34363a;
}

.kibo-product-position select,
.kibo-product-position input,
.kibo-option-group input[type="text"],
.kibo-dimensions-row input {
    display:block;
    width:100%;
    margin-top:5px;
    border:1px solid #b1b4b8;
    background:#ffffff;
    border-radius:3px;
    padding:5px 6px;
    box-sizing:border-box;
    font-family:"Segoe UI", Roboto, Arial, Helvetica, sans-serif;
    font-size:13px;
}

.kibo-remove-position {
    border:1px solid #cfd8df;
    background:#f7f7f7;
    color:#5f6b73;
    font-size:12px;
    font-weight:bold;
    padding:5px 9px;
    cursor:pointer;
}

.kibo-secondary-button {
    border:1px solid #b1b4b8;
    background:#ffffff;
    color:#077cc1;
    padding:7px 12px;
    font-weight:bold;
    cursor:pointer;
}

.kibo-option-group {
    background:#f7f7f7;
    border:1px solid #dddddd;
    padding:14px;
    margin-bottom:14px;
}

.kibo-option-group h4 {
    margin:0 0 10px 0;
    color:#077cc1;
}

.kibo-option-group label {
    font-weight:normal;
    margin-bottom:8px;
}

.kibo-text-option {
    margin-top:12px;
}

.kibo-dimensions-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:10px;
}

.kibo-wizard-actions {
    margin-top:18px;
    text-align:right;
}

.kibo-wizard-actions .button {
    margin-left:8px;
}

.kibo-product-hidden-fields {
    display:none;
}

@media (max-width: 700px) {
    .kibo-wizard-progress {
        grid-template-columns:1fr 1fr;
    }

    .kibo-position-fields {
        grid-template-columns:1fr 1fr;
    }

    .kibo-dimensions-row {
        grid-template-columns:1fr;
    }

    .kibo-wizard-actions {
        text-align:left;
    }

    .kibo-wizard-actions .button {
        margin:0 8px 8px 0;
    }
}

@media (max-width: 480px) {
    .kibo-position-fields {
        grid-template-columns:1fr;
    }

    .kibo-position-head {
        display:block;
    }

    .kibo-remove-position {
        margin-top:8px;
    }
}