/* CSS Document */
:root {
/*
  --color-text:hsl(207, 49%, 52%);
  --color-link:hsl(207, 49%, 36%);
  --color-hover:hsl(209, 49%, 68%);
  --color-line:hsl(207, 49%, 52%);
  --color-area:hsl(207, 49%, 52%);
  --color-light:hsl(210, 11%, 96%);
*/
  --color-text:#222;
  --color-link:#368;
  --color-hover:#69b;
  --color-line:#666;
  --color-dark:#444;
  --color-normal:#888;
  --color-bright:#ccc;
  --color-light:#eee;
  --color-black:#000;
  --color-white:#fff;
  --color-green:#ad9;
  --shadow-small:0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  --shadow-medium:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-large:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}


@font-face { font-family:'FiraSansBlack'; font-style: normal; font-weight: 400; src: local('FiraSansBlack'), url(../fonts/FiraSans-Black.ttf) format('truetype'), url(../fonts/FiraSans-Black.woff) format('woff'); }
@font-face { font-family:'FiraSansExtraBold'; font-style: normal; font-weight: 400; src: local('FiraSansExtraBold'), url(../fonts/FiraSans-ExtraBold.ttf) format('truetype'), url(../fonts/FiraSans-ExtraBold.woff) format('woff'); }
@font-face { font-family:'FiraSansBold'; font-style: normal; font-weight: 400; src: local('FiraSansBold'), url(../fonts/FiraSans-Bold.ttf) format('truetype'), url(../fonts/FiraSans-Bold.woff) format('woff'); }
@font-face { font-family:'FiraSansRegular'; font-style: normal; font-weight: 400; src: local('FiraSansRegular'), url(../fonts/FiraSans-Regular.ttf) format('truetype'), url(../fonts/FiraSans-Regular.woff) format('woff'); }
@font-face { font-family:'FiraSansThin'; font-style: normal; font-weight: 400; src: local('FiraSansThin'), url(../fonts/FiraSans-Thin.ttf) format('truetype'), url(../fonts/FiraSans-Thin.woff) format('woff'); }
@font-face { font-family:'FiraSansLight'; font-style: normal; font-weight: 400; src: local('FiraSansLight'), url(../fonts/FiraSans-Light.ttf) format('truetype'), url(../fonts/FiraSans-Light.woff) format('woff'); }
@font-face { font-family:'FiraSansExtraLight'; font-style: normal; font-weight: 400; src: local('FiraSansExtraLight'), url(../fonts/FiraSans-ExtraLight.ttf) format('truetype'), url(../fonts/FiraSans-ExtraLight.woff) format('woff'); }


@keyframes fadein{ from { opacity:0; } to { opacity:1; } } @-moz-keyframes fadein { from { opacity:0; } to { opacity:1; } } @-webkit-keyframes fadein { from { opacity:0; } to { opacity:1; } } @-o-keyframes fadein { from { opacity:0; } to { opacity:1; } }


html { height:100%; scroll-behavior:smooth; }
body { height:100%; font-family:"FiraSansLight"; color:#000; font-size:12px; background-color:#f8f8f8; animation:fadein 1.0s; -moz-animation:fadein 1.0s; -webkit-animation:fadein 1.0s; }

* { margin:0; padding:0; }
* { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; } /* Box Sizing */

/* clearfix */
.cf{ overflow:auto; }
.cf::after { content:""; clear:both; display:table; }


/* Farbe der Textmarkierung */
::selection { background:var(--color-dark); color:#fff; }
::-moz-selection { background-color:var(--color-dark); color:#fff; }

/* Tags mit dem Attribut onclick und data-url als Link anzeigen */
[onclick], [data-url] { cursor:pointer; }


/* Schrift-Layout */
h1, h2, h3, h4, h5, h6 { margin:0; padding:0; line-height:1.1em; }
h1 { font-size:2.4em; }
h2 { font-size:2em; }
h3 { font-size:1.1em; }
h4 { font-size:1em; }
h5 { font-size:.9em; }
h6 { font-size:.8em; }

h1 span, h2 span, h3 span, h4 span, h5 span, h6 span { font-size:.8em; font-weight:normal; }


/* Links */
.o_href { padding:0; cursor:pointer; color:var(--color-link); text-decoration:none; border-bottom:1px transparent; transition:all .3s ease-in-out; }
.o_href:hover { color:var(--color-hover); border-bottom: 1px dotted #569; }


/* text-align */
.o_tal { text-align:left; }
.o_tar { text-align:right; }
.o_tac { text-align:center; }
.o_taj { text-align:justify; }

/* vertical-align */
.o_vat { vertical-align:top; }
.o_vam { vertical-align:middle; }
.o_vab { vertical-align:bottom; }

/* float */
.o_fr { float:right; }
.o_fl { float:left; }
.o_cb { clear:both; }
.o_cl { clear:left; }
.o_cr { clear:right; }

/* font-size */
.o_fss { font-size:.8em !important; line-height:1.2em; }
.o_fsm { font-size:.9em !important; line-height:1.2em; }
.o_fsl { font-size:1.2em !important; }
.o_fsxl { font-size:2em !important; }
.o_fsxxl { font-size:4em !important; }

/* position */
.o_pa { position:absolute; }
.o_pr { position:relative; }
.o_pf { position:fixed; }
.o_ps { position:static; }

/* display */
.o_db { display:block; }
.o_di { display:inline; }
.o_dib { display:inline-block; }
.o_dn { display:none!important; }

/* width */
.o_w0 { width:0%; }
.o_w5 { width:5%; }
.o_w10 { width:10%; }
.o_w15 { width:15%; }
.o_w20 { width:20%; }
.o_w25 { width:25%; }
.o_w30 { width:30%; }
.o_w35 { width:35%; }
.o_w40 { width:40%; }
.o_w45 { width:45%; }
.o_w50 { width:50%; }
.o_w55 { width:55%; }
.o_w60 { width:60%; }
.o_w65 { width:65%; }
.o_w70 { width:70%; }
.o_w75 { width:75%; }
.o_w80 { width:80%; }
.o_w85 { width:85%; }
.o_w90 { width:90%; }
.o_w95 { width:95%; }
.o_w100 { width:100%; }

/* Trennbereiche */
hr[class*="o_hr"] { height:1px; border:0; }
.o_hr_xs { margin:.4em 0; }
.o_hr_s { margin:.8em 0; }
.o_hr_m { margin:2em 0; }
.o_hr_l { margin:4em 0; }
.o_hr_xl { margin:8em 0; }

hr[class*="o_line"] { height:1px; border:0; background:#ccc; }
.o_line_xs { margin:.4em 0; }
.o_line_s { margin:.8em 0; }
.o_line_m { margin:2em 0; }
.o_line_l { margin:4em 0; }


/* Absatz */
p { padding:.4em 0; }


/* Padding */
.o_padding04 { padding:.4em; }
.o_padding1 { padding:1em; }
.o_padding2 { padding:2em; }


/* Farbe */
.o_co_black { color:var(--color-black); }
.o_co_white { color:var(--color-white); }
.o_co_dark { color:var(--color-dark); }
.o_co_normal { color:var(--color-normal); }
.o_co_bright { color:var(--color-bright); }
.o_co_light { color:var(--color-white); }


/* Hintergrundfarbe */
.o_bc_light { color:#444; background-color:var(--color-light); }
.o_bc_dark { color:#fff; background-color:#222; }
.o_bc_none { color:#000; border:1px solid #ccc; background-color:none; }


/* Strukturierung */
.o_grid { display:block; position:relative; width:100%; }
.o_grid:before, .o_grid:after { content:""; display:table; }
.o_grid:after { clear:both; }
.o_grid { zoom:1; }

.o_grid [class*="o_col"] { float:left; }
.o_grid .o_col0 { width:0%; }
.o_grid .o_col5 { width:5%; }
.o_grid .o_col10 { width:10%; }
.o_grid .o_col15 { width:15%; }
.o_grid .o_col20 { width:20%; }
.o_grid .o_col25 { width:25%; }
.o_grid .o_col30 { width:30%; }
.o_grid .o_col33 { width:33.3333333333%; }
.o_grid .o_col35 { width:35%; }
.o_grid .o_col40 { width:40%; }
.o_grid .o_col45 { width:45%; }
.o_grid .o_col50 { width:50%; }
.o_grid .o_col55 { width:55%; }
.o_grid .o_col60 { width:60%; }
.o_grid .o_col65 { width:65%; }
.o_grid .o_col70 { width:70%; }
.o_grid .o_col75 { width:75%; }
.o_grid .o_col80 { width:80%; }
.o_grid .o_col85 { width:85%; }
.o_grid .o_col90 { width:90%; }
.o_grid .o_col95 { width:95%; }
.o_grid .o_col100 { width:100%; }

.o_grid .o_content { padding:1em; display: flex; flex-direction: column; justify-content:center; }


/* ------------------------------
Anzeige in verschiedenen Media Queries
------------------------------ */
[class*="o_mq_show"] { display:none!important; }


/* ------------------------------
Content Cols 1-12 (o_col)
skalierbare Spalten in 12er-Teilung auf der Basis von 1220px Breite
------------------------------ */
/* 
|20|                                          1180                                              |20|
|20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20|

o_col1 = 80/1180*100 = 6.779661016949153% und 80/12 = 6.66666667%
o_col2 = ((80*2)+(20*1))/1180*100 = 15.25423728813559% und ((80*2)+(20*1))/12 = 15%
o_col3 = ((80*3)+(20*2))/1180*100 = 23.72881355932203% und ((80*3)+(20*2))/12 = 18.33333333%
o_col4 = ((80*4)+(20*3))/1180*100 = 32.20338983050847% und ((80*4)+(20*3))/12 = 30%
usw. */
/* Zusammenfassung mehrerer Spalten in einer Zeile (o_row) */
.o_row { display:block; position:relative; }
.o_row:before, .o_row:after { content:""; display:table; }
.o_row:after { clear:both; }
.o_row { zoom:1; }

/* Spalten 1-12 (o_col) */
.o_row [class*="o_col"] { display:block; position:relative; margin-bottom:1em; width:100%; *width:98.33333333333333%; }



/* Framework */
[class*="o_framework"] { position:relative; display:block; }


/* Header */
.o_header { position:fixed; display:block; top:0; left:0; right:0; width:100%; height:8.0rem; padding:0; z-index:100; border-bottom:1px solid #ccc; background:var(--color-white); transition:all .3s ease-in-out; }
[class*="o_header"] .o_logo { display:block; padding:0em; transition:all .3s ease-in-out; }
[class*="o_header"] .o_logo img { display:block; width:auto; height:100%; }
.o_header .o_logo { height:6.0rem; padding:.2rem 0; }

.o_header_dock { position:fixed; display:block; top:0; left:0; width:100%; height:2.8rem; margin:0 auto; padding:0; z-index:100; background:var(--color-white); transition:all .3s ease-in-out; }
.o_header_dock .o_logo { height:2.2rem; padding:.2rem 0; }
.o_header_dock .o_logo img { filter:gray; -webkit-filter:grayscale(1); }


/* Footer */
.o_footer { display:block; padding:0; width:100%; height:auto; background-color:#444; border-top:1em solid var(--color-dark); }
.o_footer .o_content { margin:0 auto; padding:4em 1em; width:100%; max-width:2000px; color:#fff; }
.o_footer a { text-decoration:none; color:#fff;}
.o_footer a:hover { text-decoration:underline; color:#fff;}
.o_footer h4 { position:relative; margin-bottom:.8em; color:#fff; text-transform:uppercase; font-family:"FiraSansThin"; font-size:1.4em; font-weight:normal; }
.o_footer .o_icon { display:inline-block; margin-right:.8em; width:3em; height:3em; -webkit-border-radius:50%; -moz-border-radius:50%; -khtml-border-radius:50%; border-radius:50%; transition:all .3s ease-in-out; }
.o_footer .o_icon:hover { background-color:#666; }
.o_footer .o_icon:hover img { opacity:1; }
.o_footer .o_icon img { display:block; width:100%; height:auto; opacity:.6; }
.o_footer .o_valuation { display:inline-block; margin-right:.4em; width:5em; }
.o_footer .o_valuation img { display:block; width:100%; height:auto; }
.o_footer .o_valuation div { position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:10000; background-color:rgba(0, 0, 0, .6); -webkit-animation-name:fadeIn; -webkit-animation-duration:0.4s; animation-name:fadeIn; animation-duration:0.4s; }


/*
figure.o_img_hover { position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:10000; text-align: center; background-color:rgba(0, 0, 0, .6);  }
figure.o_img_hover img { position:relative; top:50%; width:16em; height:auto; max-height:96%; overflow-y:auto; -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); }
*/




/* Sectionen */
[class*="o_section"] { display:block; width:100%; margin:0 ; padding:0; overflow-x:hidden; }
[class*="o_section"] .o_content50 { margin:0 auto; width:50%; line-height:1.6em; }
[class*="o_section"] .o_content70 { margin:0 auto; width:70%; line-height:1.6em; }

.o_section1 { position:relative; padding:0; overflow:hidden; background-color:#fff; }
.o_section2 { position:relative; color:var(--color-dark); background-color:var(--color-light); }
.o_section3 { position:relative; padding:0; }
.o_section4 { position:relative; padding:2em 0; line-height:1.6em; }

.o_section5 { position:relative; color:#fff; background-attachment:fixed; background-position:center; background-repeat:no-repeat; background-size:cover; }
.o_section6 { position:relative; height:40em; color:#fff; background-image:url(../img/back/bg2.jpg); background-attachment:fixed; background-position:center; background-repeat:no-repeat; background-size:cover; }
.o_section6 figure { display:block; width:100%; margin-top:5em;text-align:center; }
.o_section6 figure img { display:inline-block; width:90%; height:auto; }
.o_section7, .o_section7_index { position:relative; padding:1em 0; line-height:1.6em; color:#fff; background-color:var(--color-dark); }


/* Seitenbereiche */
hr.o_top { height:5.2em; border:0; }

.o_article { position:relative; display:block; width:100%; margin:0 auto; padding:1em; border:1px solid transparent; -webkit-border-radius:.4em; -moz-border-radius:.4em; -khtml-border-radius:.4em; border-radius:.4em; background-color:var(--color-white); transition:all .3s ease-in-out; }
.o_article:hover { border:1px solid #ccc; }
.o_width_1600 { position:relative; display:block; width:100%; max-width:1600px; margin:0 auto; padding:1em; color:#000; background-color:var(--color-white); }
.o_width_1200 { position:relative; display:block; width:100%; max-width:1200px; margin:0 auto; padding:1em; color:#000; background-color:var(--color-white); }
.o_width_800 { position:relative; display:block; width:100%; max-width:800px; margin:0 auto; padding:1em; color:#000; background-color:var(--color-white); }
.o_width_600 { position:relative; display:block; width:100%; max-width:600px; margin:0 auto; padding:1em; color:#000; background-color:var(--color-white); }

/* Überschriften */
h1.o_headline { position:absolute; display:block; left:0; bottom:2em; padding:.6em 2em .6em 5em; color:#fff; text-align:center; text-transform:uppercase; font-size:1.8em; font-weight:bold; background-color:var(--color-dark); border-bottom-right-radius:.2em; border-top-right-radius:.2em; }
h2.o_headline { position:relative; padding-bottom:.8em; color:var(--color-dark); text-align:left; font-family:"FiraSansBold"; font-size:1.6em; font-weight:bold; }
h3.o_headline { position:relative; padding-bottom:.6em; color:#000; text-align:left; font-family:"FiraSansRegular"; font-size:1.3em; font-weight:bold; }
h4.o_headline { position:relative; padding-bottom:.2em; color:#000; text-align:left; font-family:"FiraSansRegular"; font-size:1.1em; font-weight:normal; }
.o_headline span { font-size:.7em; }

/* Image overlay */
figure.o_img_overlay { position:relative; display:block; width:100%; height:auto; }
figure.o_img_overlay .o_element { position:absolute; line-height:1.6em; }


/* Top Image */
/*
figure.o_top { position:relative; display:block; width:100%; height:36em; overflow:hidden; background-color:var(--color-white); }
figure.o_top_index { position:relative; display:block; width:100%; height:60em; overflow:hidden; background-color:var(--color-white); }
figure.o_top img, figure.o_top_index img  { position:absolute; top:0; left:-100%; right:-100%; bottom:0; margin:auto; }
*/
figure.o_top { position:relative; display:block; width:100%; padding-top:4.2rem; background-color:var(--color-white); }
figure.o_top img { position:relative; width:100%; height:auto; }
.o_scroll_gray { opacity:.4; filter:gray; -webkit-filter:grayscale(1); transition:all 3s ease-in-out!important; transition-delay:1.5s!important; }
.o_scroll_gray_visible { opacity:1; filter:none; -webkit-filter:grayscale(0); }

figure[class*="o_top"] .o_title { position:relative; width:80%; max-width:1200px; height:auto; left:0; right:0; top:0; margin:0 auto; padding:0 0 0 1rem; }
figure[class*="o_top"] .o_title .o_wrapper { display:inline-block; padding:1em; background-color:rgba(0, 0, 0, .4); }
figure[class*="o_top"] .o_title h1.o_white { color:var(--color-white); font-family:"FiraSansBold"; font-size:2em; font-weight:bold; }
figure[class*="o_top"] .o_title p.o_white { color:var(--color-white); font-family:"FiraSansRegular"; font-size:1em; }

/* Überschrift */
.o_top_title { position:relative; width:80%; max-width:1200px; margin:0 auto; padding:0; text-align:center; }
.o_top_title .o_wrapper { display:inline-block; padding:1em; background-color:transparent; }
.o_top_title h1.o_white { color:var(--color-white); font-family:"FiraSansBold"; font-size:2em; font-weight:bold; }
.o_top_title p.o_white { color:var(--color-white); font-family:"FiraSansRegular"; font-size:1em; }






/* Submenü */
/*
.o_submenu { margin:2em auto; width:16em; line-height:1.4em; border-top:1px solid #ccc; }
.o_submenu h3 { margin:0; padding:.4em 0; float:left; opacity:.4; text-transform:uppercase; }
.o_submenu ul { padding:0 4em; list-style:none; }
.o_submenu ul li { padding:0; }
.o_submenu ul li a { display:block; padding:.4em; color:#fff; text-decoration:none; transition:.3s; }
.o_submenu ul li a:hover { color:var(--color-text); background-color:#fff; }
*/


/* Submenü */
.o_submenu { margin:.8em auto; width:50%; line-height:1.4em; }
.o_submenu table { width:100%; border-spacing:0; empty-cells:show; border-collapse:separate; }
.o_submenu table td { padding:0; overflow:hidden; vertical-align:top; border-right:1px solid var(--color-light); }
.o_submenu table td:last-child td { border-right:none; }
.o_submenu table td a { display:block; padding:.4em .8em; color:var(--color-text); text-decoration:none; transition:.3s; }
.o_submenu table td a:hover { color:var(--color-text); background-color:#fff; }
.o_submenu h3 { margin:0; padding:.4em .8em; opacity:.4; text-transform:uppercase; }



/* List */
/* nummerierte Aufzählung */
ol[class*="o_list"] { padding:.4em 2em; }
ol[class*="o_list"] li { padding:.2em 0; }
/* unsortierte Aufzählung */
ul[class*="o_list"] { padding:.4em 2em; }
ul[class*="o_list"] li { padding:.2em 0; }
/* Aufzählungszeichen */
ul.o_listblank { list-style:none; }
ul.o_listdisc { list-style:disc; }
ul.o_listcircle { list-style:circle; }
ul.o_listsquare { list-style:square; }
ul.o_listcheck { list-style-image:url(../img/list-check.png); }
ul.o_listnet { list-style-image:url(../img/list-net.png); }
ul.o_arrow { list-style:none; }
ul.o_arrow li { display:grid; grid-template-columns:20px auto; justify-content:start; }
ul.o_arrow li::before { content:">"; font-size:.9em; color:#999; }



/* Tabellen */
table[class*="o_table"] { width:100%; border-spacing:0; empty-cells:show; border-collapse:separate; }
table[class*="o_table"] th { padding:.6em .4em; overflow:hidden; vertical-align:bottom; line-height:1em; white-space:nowrap; color:#000; font-size:.9em; font-weight:bold; border-top:1px solid #ccc; border-left:1px solid #ccc; background-color:#f5f5f5; }
table[class*="o_table"] th:first-child { border-left:0; }
table[class*="o_table"] td { padding:.6em .4em; overflow:hidden; vertical-align:top; border-top:1px solid #ccc; border-left:1px solid #ccc; border-bottom:1px solid #eee; }
table[class*="o_table"] tr:last-child td { border-bottom:1px solid #ccc; }
table[class*="o_table"] td:first-child { border-left:0; }
table[class*="o_table"] td.o_link { cursor:pointer; text-align:center; vertical-align:middle; }
table[class*="o_table"] td.o_link:hover { background-color:#eee; }
table[class*="o_table"] td.o_link a { display:block; width:100%; text-decoration:none; color:var(--color-text); }
table[class*="o_table"] td.o_link a:hover { text-decoration:none; }

table[class*="o_table"] tr.o_select:hover { cursor:pointer; background-color:#eef; }
table[class*="o_table"] tr.o_mark_1 { color:#fff; background-color:var(--color-dark); }
table[class*="o_table"] td.o_caption { padding-top:.8em; line-height:1em; color:#000; font-size:.9em; font-weight:bold; }
table[class*="o_table"] tr.o_select { background-color:#f8ffcc; }
table[class*="o_table"] tr.o_select:hover { cursor:pointer; background-color:#ffd; }
table[class*="o_table"] tr.o_delete { color:#900; text-decoration:line-through; background-color:#f99; }
table[class*="o_table"] tr.o_disabled { color:#ccc!important; }
table[class*="o_table"] td.o_push { padding:0; cursor:pointer; vertical-align:middle; text-align:center; font-size:1.4em; color:var(--color-text); }
table[class*="o_table"] td.o_push:hover { color:#fff; background-color:var(--color-dark); }
table[class*="o_table"] td.o_push a { text-decoration:none; color:var(--color-text); }
table[class*="o_table"] td.o_push:hover a { color:#fff; background-color:var(--color-dark); }
table[class*="o_table"] tr[onclick] { cursor:pointer; transition:all .3s ease-out; }
table[class*="o_table"] tr[onclick]:hover { background-color:#eee; }



/* Flex Box */
.o_flex_row { display:flex; width:100%; max-width:100%; flex-direction:row; flex-wrap:wrap; }

/* Items horizontal positionieren */
.o_jcfs { justify-content:flex-start; } /* links */
.o_jcfe { justify-content:flex-end; } /* rechts */
.o_jcc { justify-content:center; } /* mittig */
.o_jcsb { justify-content:space-between; } /* gleichmäßige Verteilung mit Abständen */
.o_jcsa { justify-content:space-around; } /* gleichmäßige Verteilung auch mit Abstand am Anfang und Ende */
.o_jcsa { justify-content:space-evenly; } /* wie space-araound, nur mit gleichmäßigen Abständen */

/* Items vertikal positionieren */
.o_aifs { align-items:flex-start; } /* oben */
.o_aife { align-items:flex-end; } /* unten */
.o_aic { align-items:center; } /* mittig */
.o_aib { align-items:baseline; } /* alle Items auf der Grundlinie */
.o_ais { align-items:stretch; } /* alle Items gleich hoch */

/* flex-grow: Wachstumsfaktor (1=normalgroßes Element, 2=doppelt so groß wie andere Elemente, 3=etc. */
.o_flex_row .o_grow0 { flex-grow:0; }
.o_flex_row .o_grow1 { flex-grow:1; }
.o_flex_row .o_grow2 { flex-grow:2; }
.o_flex_row .o_grow3 { flex-grow:3; }
.o_flex_row .o_grow4 { flex-grow:4; }
.o_flex_row .o_grow5 { flex-grow:5; }
/* flex-basis: Mindestbreite, wenn kleiner, dann Umbruch des Elements */
.o_flex_row .o_basisauto { flex-basis:auto; }
.o_flex_row .o_basis100 { flex-basis:100px; }
.o_flex_row .o_basis150 { flex-basis:150px; }
.o_flex_row .o_basis200 { flex-basis:200px; }
.o_flex_row .o_basis250 { flex-basis:250px; }
.o_flex_row .o_basis300 { flex-basis:300px; }
.o_flex_row .o_basis350 { flex-basis:350px; }
.o_flex_row .o_basis400 { flex-basis:400px; }

/*
.o_flex .o_col { padding:2em; }
.o_flex .o_col h2 { margin:.75rem 0 .5rem; padding:0 1.2rem; font-size:1.4em; }
.o_flex .o_col img { display:block; width:100%; height:auto; } 
.o_flex .o_col p { margin:0; padding:0 1.2rem 1.2rem 1.2rem; }
*/



/* Vorschau Info */
.o_flex_preview { display:flex; flex-wrap:wrap; gap:1em 1em; }
.o_flex_preview [class*="o_item"] { position:relative; width:340px; flex:1 1 auto; border:1px solid #ccc; }
.o_flex_preview [class*="o_item"] h3 { display:block; padding:1em 1em 0 1em; height:5em; text-align:center; color:#fff; font-size:1.1em; background:#69c; }
.o_flex_preview [class*="o_item"] h3 span { display:block; font-size:.8em; }
.o_flex_preview [class*="o_item"] figure.o_img { display:block; width:100%; }
.o_flex_preview [class*="o_item"] figure.o_img img { display:block; width:100%; height:auto; }
.o_flex_preview [class*="o_item"] .o_content { display:block; padding:1em; color:#444; }

.o_flex_preview [class*="o_item"] .o_control_distance { display:block; height:3em; }
.o_flex_preview [class*="o_item"] .o_control { position:absolute; bottom:0; width:100%; padding:1em; text-align:center; }


/* Icons */
.o_flex_icon { display:flex; flex-wrap:wrap; gap:1em 1em; }
.o_flex_icon .o_item { position:relative; width:160px; flex:1 1 auto; text-decoration:none; }
.o_flex_icon .o_item .o_icon { display:block; margin:0 auto; padding:.3em 0; width:1.8em; height:1.8em; color:var(--color-white); text-align:center; font-size:6em; background-color:var(--color-normal); -webkit-border-radius:50%; -moz-border-radius:50%; -khtml-border-radius:50%; border-radius:50%; transition:all .3s ease-in-out; }
.o_flex_icon .o_item:hover .o_icon { background-color:var(--color-hover); }
.o_flex_icon .o_item h3 { display:block; padding:1em 1em 0 1em; height:5em; text-align:center; color:var(--color-black); font-size:1.4em; }


/* step by step */
.o_step_by_step { display:flex; margin:auto; width:100%; max-width:100%; flex-wrap:wrap; justify-content:center; }
.o_step_by_step .o_col { display:flex; margin:1em 0.5em; flex-direction:column; flex:1 1  300px; color:#fff; background:var(--color-dark); box-shadow:0 1px 6px rgba(0,0,0,.1); }
.o_step_by_step .o_col h2 { margin:.75rem 0 .5rem; padding:0 1.2rem; text-align:center; font-size:1.4rem; }
.o_step_by_step .o_col img { display:block; width:100%; height:auto; } 
.o_step_by_step .o_col p { margin:0; padding:0 1.2rem 1.2rem 1.2rem; text-align:center; font-size:1em; }


/* Flex-Container */
.o_flex_container { display:-webkit-flex; display:-ms-flex; display:flex; -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; }
.o_flex_container .o_hover { padding:.4em; color:#fff; background-color:var(--color-dark); }

/* Cols */
.o_flex_container [class*="o_cols"] { display:block; margin:1em 1%; padding:0; text-align:justify; }
.o_flex_container [class*="o_cols"] h2 { text-align:center; font-size:1.2em; }
.o_flex_container [class*="o_cols"] figure.o_icon { display:block; margin:.4em auto; width:6em; height:6em; padding:.4em 0;  }
.o_flex_container [class*="o_cols"] figure.o_icon img { display:block; width:100%; height:auto; }
.o_flex_container [class*="o_cols"]:hover figure.o_icon {  }
.o_flex_container a[class*="o_cols"] { color:#000; text-decoration:none; border:.1em solid #ccc; transition:all .3s ease-in-out; }
.o_flex_container a[class*="o_cols"]:hover { border:.1em solid #4ae; }

.o_flex_container .o_cols25 { width:23%; float:left; }
.o_flex_container .o_cols30 { width:28%; float:left; }
.o_flex_container .o_cols33 { width:31.33333333%; float:left; }
.o_flex_container .o_cols50 { width:48%; float:left; }
.o_flex_container .o_cols66 { width:64%; float:left; }
.o_flex_container .o_cols70 { width:68%; float:left; }
.o_flex_container .o_cols100 { width:98%;  }
.o_flex_container [class*="o_cols"] .o_content { padding:1em; }


/* Panel */
.o_flex_container [class*="o_panel"] { position:relative; display:block; padding:0; float:left; color:#666; background-color:#fff; }
.o_flex_container .o_panel2 { width:98%; margin:1em 1%; }
.o_flex_container .o_panel3 { width:98%; margin:1em 1%; }
.o_flex_container .o_panel4 { width:98%; margin:1em 1%; }
/* Image Standard */
.o_flex_container [class*="o_panel"] figure.o_default { display:block; width:100%; height:auto; }
.o_flex_container [class*="o_panel"] figure.o_default img { display:block; width:100%; height:auto; }
/* Image Link */
.o_flex_container [class*="o_panel"] figure.o_link { display:block; width:100%; height:auto; }
.o_flex_container [class*="o_panel"] figure.o_link img { display:block; width:100%; height:auto; }
/* Image Zoom */
.o_flex_container [class*="o_panel"] figure.o_zoom { display:block; width:100%; overflow: hidden; }
.o_flex_container [class*="o_panel"] figure.o_zoom img { display:block; width:100%; height:auto; transition:all 1s ease; filter:gray; -webkit-filter:grayscale(1); }
.o_flex_container [class*="o_panel"] figure.o_zoom:hover img { transform:scale(2); filter:none; -webkit-filter:grayscale(0); }

.o_flex_container [class*="o_panel"] .o_content { position:relative; display:block; padding:1em; line-height:1.1em; font-size:.9em; }
.o_flex_container [class*="o_panel"] .o_content h2 { padding-bottom:1em; color:#000; text-align:center; font-size:1.2em; }

.o_flex_container a[class*="o_panel"] { text-decoration:none; transition:all .3s ease-in-out; }
.o_flex_container a[class*="o_panel"]:hover { border:1px solid rgba(170, 68, 85, 1); }

.o_flex_container [class*="o_panel"] .o_content .o_icon { margin:-1.2em 0 0 .4em; width:2em; height:2em; padding:.4em 0; color:#fff; text-align:center; font-size:2em; background-color:var(--color-dark); border:.1em solid #fff; -webkit-border-radius:50%; -moz-border-radius:50%; -khtml-border-radius:50%; border-radius:50%; transition:all .3s ease-in-out; }
.o_flex_container a[class*="o_panel"]:hover .o_content .o_icon { margin:-1.2em 0 0 2em; }

.o_flex_container [class*="o_panel"] .o_compensation { position:relative; display:block; width:100%; height:3em; }
.o_flex_container [class*="o_panel"] .o_button { position:absolute!important; left:50%; bottom:0; margin-left:-7em; width:14em; }

/*
.o_flex_container [class*="o_panel"] .o_btn { position:absolute; display:inline-block; bottom:0; padding:.2em 1em; cursor:pointer; text-decoration:none; -webkit-border-radius:.8em; -moz-border-radius:.8em; -khtml-border-radius:.8em; border-radius:.8em; transition:all .3s ease-in-out; }
.o_flex_container [class*="o_panel"] .o_btn span { display:inline-block; width:2em; margin-left:-1em; padding-left:0em; transition:all .3s ease-in-out; }
.o_flex_container [class*="o_panel"] .o_btn:hover span { padding-left:1.4em; }
*/

/* Statement */
.o_flex_container [class*="o_statement"] { position:relative; display:block; margin:1em 1%; padding:0; float:left; color:#666; }
.o_flex_container .o_statement2 { width:48%; }
.o_flex_container .o_statement3 { width:31.33333333%; }
.o_flex_container .o_statement4 { width:23%; }
.o_flex_container [class*="o_statement"] .o_icon { position:absolute; color:var(--color-text); font-size:3em; font-weight:bold; }
.o_flex_container [class*="o_statement"] h2 { color:#333; line-height:1em; font-size:1.2em; }
.o_flex_container [class*="o_statement"] .o_content { display:block; padding:1em; text-align:justify; }

.o_flex_container .o_statement2:nth-child(odd) .o_icon { left:0; }
.o_flex_container .o_statement2:nth-child(even) .o_icon { right:0; }

.o_flex_container .o_statement2:nth-child(odd) h2 { margin:0 0 0 4em; text-align:left; }
.o_flex_container .o_statement2:nth-child(even) h2 { margin:0 4em 0 0; text-align:right; }
.o_flex_container .o_statement3 h2 { margin:0 0 0 4em; text-align:left; }

.o_flex_container .o_statement2:nth-child(odd) .o_content { margin:0 0 0 4em; }
.o_flex_container .o_statement2:nth-child(even) .o_content { margin:0 4em 0 0; }
.o_flex_container .o_statement3 .o_content { margin:0 0 0 4em; }



/* erweiterbare Bereiche */
.o_expand {  }
.o_expand .o_tab { position:relative; margin-bottom:1em; width:100%; overflow:hidden; border:1px solid #ccc; -webkit-border-radius:.8em; -moz-border-radius:.8em; -khtml-border-radius:.8em; border-radius:.8em; transition:all .3s ease-in-out; }
.o_expand input { position:absolute; opacity:0; z-index:-1; }
.o_expand label { display:block; position:relative; padding:1em 3em 1em 1em; cursor:pointer; line-height:1.1em; font-weight:bold; }
.o_expand .o_content { max-height:0; overflow:hidden; background:#fff; -webkit-transition:max-height .35s; -o-transition:max-height .35s; transition:max-height .35s; }
.o_expand .o_content .o_body { padding:1em 1em 4em 1em; }
.o_expand input:checked ~ .o_content { max-height:40em; }
/*
.o_expand input[type=checkbox] + label::after { content:"+"; }
.o_expand input[type=checkbox]:checked + label::after { transform:rotate(315deg); }
.o_expand input[type=radio] + label::after { content:"+"; }
.o_expand input[type=radio]:checked + label::after { transform:rotateX(315deg); }
*/
.o_expand input[type=radio]:checked + label { background-color:#eee; }
.o_expand input[type=radio] + label span { float:right; color:#999; transition:all .3s ease-in-out; }
.o_expand input[type=radio]:checked + label span { color:#000; transform: rotate(90deg); }



/* Schaltfläche */
.o_button { display:inline-block; margin:.4em auto .4em auto; padding:0.5rem 1rem 0.5rem; color:var(--color-white); letter-spacing:1px; align-self:flex-start; text-decoration:none; text-transform:uppercase; font-size:.9em; font-weight:bold; border-radius:.4em; background:var(--color-dark); transition:all .3s ease-in-out; }
.o_button:hover { color:var(--color-white); background:var(--color-hover); }

.o_button_circle { display:inline-block; padding:.4em 0; width:5em; height:5em; cursor:pointer; color:#666; text-decoration:none; text-align:center; border:2px solid #999; background-color:rgba(255, 255, 255, .6); -webkit-border-radius:50%; -moz-border-radius:50%; -khtml-border-radius:50%; border-radius:50%; transition:all .3s ease-in-out; }
.o_button_circle:hover { color:#000; border:2px solid #000; }
.o_button_circle i { font-size:3em; }
.o_button_circle img { width:3em; height:auto; }





/* Text */
/*
.o_headline { position:relative; display:block; padding:.2em 0; text-align:center; font-family:'Hind', sans-serif; }

.o_text { overflow:auto; background-color: cadetblue; }
.o_text::after { content:""; clear:both; display:table; }
.o_text h2 { display:block; position:relative; padding:.2em 1em; width:100%; text-align:center; }
.o_text .o_content { display:block; width:100%; padding:.4em 1em; text-align:justify; }
*/




/* Image */
img.o_img { display:block; width:100%; height:auto; }

figure.o_zoom { display:block; width:100%; overflow: hidden; }
figure.o_zoom img { display:block; width:100%; height:auto; transition:all 1s ease; filter:gray; -webkit-filter:grayscale(1); }
figure.o_zoom:hover img { transform:scale(2); filter:none; -webkit-filter:grayscale(0); }

/*
figure.o_center { position:relative; display:block; margin:0 auto; height:auto; }
figure.o_center img { display:block; width:100%; height:auto; }
*/
figure.o_center { position:relative; height:20em; max-width:100%; overflow:hidden; border:1px solid #ccc; }
figure.o_center img { margin:0 auto; width:auto; height:100%; }

/* Bilder mit Text, Bild im Ausschnitt zentrieren */
.o_img_text { display:block; margin:4em 0; overflow:auto; background-color: chocolate; }
.o_img_text::after { content:""; clear:both; display:table; }
.o_img_text figure { display:block; position:relative; width:100%; }
.o_img_text figure img { object-fit:cover; width:100%; height:auto; }
.o_img_text figure .o_overlay { position:absolute; width:100%; height:100%; top:0; left:0; }
.o_img_text .o_content { display:block; width:100%; padding:.4em 1em; }
.o_img_text .o_content div { width:100%; text-align:center; }
.o_img_text .o_content div h2 { text-align:center; }


/*
Bild im Hintergrund (parallax)
*/
.o_img_perspective { background-position:bottom center; background-repeat:no-repeat; background-size:cover; background-attachment:fixed; }


/* Statement */
.o_statement { position:relative; display:block; width:40%; max-width:400px; margin:0 auto; padding:2em 1em; text-decoration:none; color:var(--color-text); border:1px solid #ccc; -webkit-border-radius:.4em; -moz-border-radius:.4em; -khtml-border-radius:.4em; border-radius:.4em; }
.o_statement:hover .o_button { color:var(--color-white); background:var(--color-hover); }



/* Video */
figure.o_video { display:block; position:relative; width:100%; height:auto; }
figure.o_video img.o_play { position:absolute; width:125px!important; height:auto; top:50%; left:50%; margin-top:-62px!important; margin-left:-62px!important; }
figure.o_video video { display:block; width:100%; height:auto; }
figure.o_video .o_timeline { display:block; left:0; bottom:0; width:100%; }
figure.o_video .o_timeline em { display:block; width:100%; height:8px; overflow:hidden; cursor:pointer; background-color:#444; }
figure.o_video .o_timeline em span { display:block; width:0%; height:100%; background-color:#dc0; transition:all 1s ease; }
figure.o_video .o_timeline .o_start { float:left; padding:.2em 1em .2em 0; cursor:pointer; }
figure.o_video .o_timeline .o_current { float:left; padding:.2em 1em .2em 0; }
figure.o_video .o_timeline .o_duration { float:right; padding:.2em 0 .2em 1em; }

video.o_video { display:block; width:100%; height:auto; }
.o_frame_cover { position:fixed; display:flex; top:0; left:0; width:100%; height:100%; z-index:9999; align-items:center; justify-content:center; background-color:rgba(170, 68, 85, .6); }
.o_frame { width:80%; max-width:50em; height:auto; z-index:9999; background-color:var(--color-dark); }

.o_frame_16_9, .o_frame_4_3 { display:block; position:relative; height:0; width:100%; overflow:hidden; }
.o_frame_16_9 { padding-bottom:56.25%; }
.o_frame_4_3 { padding-bottom:75%; }
.o_frame_16_9 div, .o_frame_4_3 div { position:absolute; top:0; left:0; width:100%; height:100%; border:0; background-color: #4ae; }



/* Swiper */
/*
.swiper { width:100%; height:40%; overflow: visible; }
.swiper-slide { padding:2em; width:30%; text-align:center; font-size:1em; display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:center; -ms-flex-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -ms-flex-align:center; -webkit-align-items:center; opacity:.6; align-items:center; background:#fff; transition:all .5s ease-in-out; }
.swiper-slide img { display:block; width:100%; height:100%; object-fit:cover; }
.swiper-slide-active { padding:0; opacity:1; }
.swiper-slide-active img { border:.3em solid var(--color-dark); }
.swiper-button-prev, .swiper-button-next { color:var(--color-dark); }
.swiper-pagination-bullet { width:.8em; height:.8em; opacity:.6; color:#000; text-align:center; line-height:1.2em; font-size:.9em; background:#fff; }
.swiper-pagination-bullet-active { background:var(--color-dark); }
*/

/* Overlays */
#olCENTER { position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:10000; background-color:rgba(255, 255, 255, .6); -webkit-animation-name:fadeIn; -webkit-animation-duration:0.4s; animation-name:fadeIn; animation-duration:0.4s;  }
#olCENTER_WIN { position:relative; top:50%; width:96%; max-width:50em; height:auto; max-height:96%; margin:0 auto; overflow-y:auto; border:1px solid #999; -webkit-border-radius:.4em; -moz-border-radius:.4em; -khtml-border-radius:.4em; border-radius:.4em; -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); }
#olCENTER_WIN header { display:block; width:100%; padding:1em; overflow:hidden; color:#fff; border-bottom:1px solid #999; background-color:var(--color-dark); }
#olCENTER_WIN header h1 { width:100%; margin:0; padding:0 5em 0 .4em; white-space:nowrap; overflow:hidden; font-size:1em; }
#olCENTER_WIN header a, #olCENTER_WIN header span { text-decoration:none; }
#olCENTER_WIN header .o_close { position:absolute; right:1em; top:.5em; padding:0em; font-size:1.4em; cursor:pointer; }
#olCENTER_WIN article { position:relative; display:block; width:100%; margin:0; padding:1em; background-color:#fff; }
#olCENTER_WIN footer { display:block; width:100%; height:2em; padding:.5em; overflow:hidden; color:#fff; font-size:.8em; background-color:#f8f8f8; }




@media screen and (min-width:320px) {

body { font-size:12px; }

}



@media screen and (min-width:480px) {

/* Anzeige in verschiedenen Media Queries */
.o_mq_show480 { display:inherit!important; }

.o_flex_container .o_panel2 { width:48%; }
.o_flex_container .o_panel3 { width:48%; }
.o_flex_container .o_panel4 { width:48%; }

body { font-size:13px; }

}



@media screen and (min-width:620px) {

body { font-size:14px; }

/* Anzeige in verschiedenen Media Queries */
.o_mq_show620 { display:inline!important; }

/* Content Cols 1-12 (o_col) */


/* ------------------------------
Content Cols 1-12 (o_col)
skalierbare Spalten in 12er-Teilung auf der Basis von 1220px Breite
------------------------------ */
/* 
|20|                                          1180                                              |20|
|20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20| 80 |20|

o_col1 = 80/1180*100 = 6.779661016949153% und 80/12 = 6.66666667%
o_col2 = ((80*2)+(20*1))/1180*100 = 15.25423728813559% und ((80*2)+(20*1))/12 = 15%
o_col3 = ((80*3)+(20*2))/1180*100 = 23.72881355932203% und ((80*3)+(20*2))/12 = 18.33333333%
o_col4 = ((80*4)+(20*3))/1180*100 = 32.20338983050847% und ((80*4)+(20*3))/12 = 30%
*/


.o_row [class*="o_col"] { margin-left:3.448275862%; margin-bottom:0; }
.o_row [class*="o_col"]:first-child { margin-left:0; }
.o_row .o_col1 { float:left; width:5.172413793%; *width:5%; }
.o_row .o_col2 { float:left; width:13.79310345%; *width:13.33333333%; }
.o_row .o_col3 { float:left; width:22.4137931%; *width:21.666666667%; }
.o_row .o_col4 { float:left; width:31.03448276%; *width:30%; }
.o_row .o_col5 { float:left; width:39.65517241%; *width:38.33333333%; }
.o_row .o_col6 { float:left; width:48.27586207%; *width:46.66666667%; }
.o_row .o_col7 { float:left; width:56.89655172%; *width:55%; }
.o_row .o_col8 { float:left; width:65.51724138%; *width:63.33333333%; }
.o_row .o_col9 { float:left; width:74.13793103%; *width:71.66666667%; }
.o_row .o_col10 { float:left; width:82.75862069%; *width:80%; }
.o_row .o_col11 { float:left; width:91.37931034%; *width:88.33333333%; }
.o_row .o_col { width:100%; *width:96.66666667%; }

}



@media screen and (min-width:800px) {

body { font-size:15px; }

/* Anzeige in verschiedenen Media Queries */
.o_mq_show800 { display:inherit!important; }

.o_flex_container .o_panel3 { width:31.33333333%; }
.o_flex_container .o_panel4 { width:31.33333333%; }

body { font-size:16px; }

}



@media screen and (min-width:960px) {

  body { font-size:16px; }

/* Anzeige in verschiedenen Media Queries */
.o_mq_show960 { display:inherit!important; }

/* Überschrift */
.o_section7 { position:relative; width:100%; height:16em; margin-top:-16em; padding:1em 0; line-height:1.6em; color:#fff; background-color:transparent; }
.o_section7_index { position:relative; width:100%; height:28em; margin-top:-28em; padding:2em 0; line-height:1.6em; color:#fff; background-color:transparent; }

.o_top_title { width:80%; max-width:1200px; height:auto; height:auto; left:0; right:0; top:0; margin:0 auto; padding:0 0 0 1rem; text-align:left; }
.o_top_title .o_wrapper { display:inline-block; padding:1em; width:50%; background-color:rgba(0, 0, 0, .4); }
.o_top_title h1.o_white { color:var(--color-white); font-family:"FiraSansBold"; font-size:2em; font-weight:bold; }
.o_top_title p.o_white { color:var(--color-white); font-family:"FiraSansRegular"; font-size:1em; }

/* Text */
.o_text h2 { float:left; width:30%; }
.o_text .o_content { float:right; width:70%; border-left:1px solid #ccc; }

/* Image */
.o_img_text { margin:0; }
.o_img_text figure { width:50%; height:540px; }
.o_img_text figure img { object-fit:cover; width:100%; height:100%; }
.o_img_text .o_content { width:50%; height:540px; display:flex; flex-direction:column; overflow:hidden; justify-content:center; text-align:center; }
.o_img_text .o_content div { width:80%; max-width:800px; margin:0 auto; }
.o_img_text .o_content div h2 { padding:.2em 1em; }

.o_flex_container .o_panel4 { width:23%; }

}


@media screen and (min-width:1200px) {

  .o_header { width:100%; }

}
  


@media screen and (min-width:1280px) {

body { font-size:18px; }

/* Anzeige in verschiedenen Media Queries */
.o_mq_show1280 { display:inherit!important; }

}



@media screen and (min-width:1600px) {

body { font-size:20px; }

/* Anzeige in verschiedenen Media Queries */
.o_mq_show1600 { display:inherit!important; }


}



@media screen and (min-width:1920px) {

body { font-size:22px; }

/* Anzeige in verschiedenen Media Queries */
.o_mq_show1500 { display:inherit!important; }

}