/* CSS Document */

/*

Farben

#fff weiß

#000 schwarz

#4ae blau (Fläche)



#79c blau (Fläche Hover)

#28c blau (Schrift)

#58b blau (Schrift Hover)

#8ac hellblau

 */



body { font-family:'Open Sans', sans-serif, Arial, Tahoma; color:#333; }



/* ------------------------------

Allgemeine Definitionen

------------------------------ */

/* Farbe der Textmarkierung */

::selection { background:#4ae; color:#fff; }

::-moz-selection { background-color:#4ae; color:#fff; }



/* Schrift-Layout */

h1, h2, h3, h4, h5, h6 { font-family:'Archivo Narrow', Arial, Tahoma; }

h1, h2 { color:#666; }

h3, h4, h5, h6 { color:#333; font-weight:normal; }









/* ------------------------------

Links

------------------------------ */

/* Links */

a.o_href { padding:0; color:#28c; text-decoration:none; }

a.o_href:hover { text-decoration:underline; color:#58b; }

a.o_inline { padding:0 .4em; color:#28c; text-decoration:none; }

a.o_inline:hover { color:#fff; background-color:#4ae; }

a.o_marked { display:inline-block; margin:0; padding:.1em .4em; white-space:nowrap; text-decoration:none; color:#fff; font-size:.9em; background-color:#4ae; }

a.o_marked:hover { color:#fff; background-color:#79c; }



a.o_scroll_trigger { position:absolute; top:20px; right:10%; width:2em; height:2em; z-index:300; font-size:2em; text-decoration:none; text-align:center; line-height:2em; color:#fff; border:1px solid #fff; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; background-color:#fc0; }

a.o_scroll_trigger:hover { text-decoration:none; background-color:#4ae; }

a.o_scroll_trigger.o_top { top:-1.6em; }



a.o_qtip_click, a.o_qtip_over { margin:0; padding:0 .1em; text-decoration:none; color:#28c; font-size:.9em; border-bottom:1px dotted #28c; }

a.o_qtip_click:hover, a.o_qtip_over:hover { text-decoration:none; color:#000; border-bottom:1px solid #039; }

a.o_qtip_click:after { content:url(../img/ico-info.png); padding-left:5px; }

a.o_qtip_over:after { content:url(../img/ico-tip.png); padding-left:5px; }





/* ------------------------------

Framework

------------------------------ */

.o_top { display:block; height:5em; }

.o_framework { padding:1em 0; background-color:#fff; }

.o_framework_header { position:fixed!important; height:5em; z-index:10000; border-bottom:.6em solid #4ae; background-color:#eee; }

.o_framework_light { color:#666; background-color:#eee; }

.o_framework_light h1, .o_framework_light h2 { color:#999; }

.o_framework_dark { color:#333; background-color:#ccc; }

.o_framework_dark h1, .o_framework_dark h2 { color:#666; }

.o_framework_blue { color:#cde; background-color:#369; }

.o_framework_blue h1, .o_framework_blue h2 { color:#abd; }

.o_framework_blue .o_href { color:#fff; }

.o_framework_blue .o_href:hover { color:#000; }

.o_framework_blue_2 { color:#def; background-color:#69c; }

.o_framework_blue_2 h1, .o_framework_blue_2 h2 { color:#fff; }

.o_framework_blue_2 .o_href { color:#fff; }

.o_framework_blue_2 .o_href:hover { color:#000; }

.o_framework_blue_3 { color:#369; background-color:#abc; }

.o_framework_blue_3 h1, .o_framework_blue_3 h2 { color:#258; }

.o_framework_green { color:#761; background-color:#dc3; }

.o_framework_green h1, .o_framework_green h2 { color:#551; }

.o_framework_green_2 { color:#872; background-color:#ed6; }

.o_framework_green_2 h1, .o_framework_green_2 h2 { color:#772; }

.o_framework_green_3 { color:#983; background-color:#e8dd99; }

.o_framework_green_3 h1, .o_framework_green_3 h2 { color:#993; }

.o_framework_green_4 { color:#983; background-color:#f8eeaa; }

.o_framework_green_4 h1, .o_framework_green_4 h2 { color:#bb5; }

.o_framework_green_5 { color:#983; background-color:#f8f8cc; }

.o_framework_green_5 h1, .o_framework_green_5 h2 { color:#bb5; }

.o_framework_red { color:#fff; background-color:#300; }

.o_framework_black { color:#fff; background-color:#333; }









/* ------------------------------

Menu

------------------------------ */

nav .o_navtoggle, [id^=mn] { display:none; }

nav { margin:0; padding:0; }

nav:after { display:table; content:""; clear:both; }

nav ul { position:relative; float:left; margin:0; padding:0; list-style:none; }

nav ul li { display:inline-block; float:left; margin:0px; border-right:1px dashed #ccc; }

nav ul a { display:block; padding:1em .8em; color:#333; line-height:2.9em; text-decoration:none; font-size:.9em; background-color:#eee; }

/*

nav ul li ul li:hover { color:#fff; background-color:#4ae; }

*/

nav ul a:hover { color:#fff; background-color:#4ae; }

nav ul ul { display:none; position:absolute; top:100%; }

nav ul li:hover > ul { display:block; }

nav ul ul li { position:relative; float:none; display:block; width:20em; white-space:nowrap; border-bottom:1px solid #ccc; }

nav ul ul ul li { position:relative; top:-3em; left:20em; border-bottom:1px solid #ccc; }

nav ul ul a { background-color:#ddd; }

nav ul ul a:hover { color:#fff; background-color:#4ae; }

/*

nav li > a:after { content: '+'; }

nav li > a:only-child:after { content:''; }

*/



@media all and (max-width:960px) {

nav { margin:0; }

nav [id^=mn]:checked + ul { display:block; }

nav .o_navtoggle + a, .o_menu { display:none; }

nav .o_navtoggle { display:block; padding:1.6em; text-decoration:none; color:#fff; font-size:1em; border:none; background-color:#333; }

nav .o_navtoggle:hover { background-color:#4ae; }

nav ul li { display:block; width:100%; }

nav ul a { padding:1em 2em; color:#fff; font-size:1em; background-color:#666; }

nav ul a:hover { background-color:#4ae; }

nav ul ul { position:static; float:none; color:#fff; }

nav ul ul li { display:block; width:100%; }

nav ul ul li .o_navtoggle { padding:1em 4em; color:#fff; }

nav ul ul .o_navtoggle { padding:1em 4em; }

nav ul ul a { padding:1em 4em; color:#fff; background-color:#666; }

nav ul ul li .o_navtoggle {  }

nav ul ul li:hover > ul, nav ul li:hover > ul { display:none; }

nav ul ul ul a { background-color:#666; padding:1em 6em; }

nav ul ul ul li { position:static; }

}



@media all and (max-width :330px) {

nav ul li { display:block; width:94%; }

}







/* ------------------------------

Seitenbereich

------------------------------ */

.o_section { padding:1em 1%; }

.o_section_highlight { padding:1em 1% 1em 1%; }

.o_section_light { background-color:#eee; }

.o_section_header {  }

.o_section_footer { padding:0 1%; color:#fff; }



/* Footer */

.o_footer { padding:.2em 0; color:#ddd; font-family:'Archivo Narrow', Arial, Tahoma; font-size:.8em; border-top:.8em solid #4ae; background-color:#333; }

.o_footer a { color:#ccc; text-decoration:none; }

.o_footer a:hover { color:#fff; text-decoration:underline; }

.o_footer h3 { color:#eee; }









/* ------------------------------

Branding

------------------------------ */

figure.o_branding { position:absolute; top:10%; right:3em; }

figure.o_branding img { display:block; width:auto; height:3.8em; }





/* ------------------------------

Top-Image

------------------------------ */

.o_topimage { position:relative; display:block; width:100%; overflow:hidden; }

.o_topimage .o_topmain { display:block; width:100%; height:auto; }

.o_topimage .o_topbow { position:absolute; display:block; bottom:0; width:100%; height:auto; }

.o_topimage .o_logo_geist { position:absolute; bottom:0; left:6em; width:8em; height:auto; }







/* ------------------------------

Article

------------------------------ */

article[class*="o_article"] { line-height:1.6em; text-align:justify; }

article[class*="o_article"] header { padding-bottom:1em; }



article.o_article_split {  }

article.o_article_right {  }



.o_paragraph { float:left; display:inline-block; margin-left:-.6em; margin-right:.3em; padding:.3em; width:1.9em; height:1.3em; text-align:right; font-size:2em; font-weight:bold; color:#fff; background-color:#47b; }





/* ------------------------------

Right Side

------------------------------ */

.o_sideinfo { margin-bottom:2em; line-height:1.2em; font-size:.9em; }

.o_sideinfo h3 { padding:.4em; text-align:center; color:#666; background-color:#ddd; }

.o_sideinfo img { display:block; width:100%; height:auto; }





/* ------------------------------

Image-Slider

------------------------------ */

.o_imgslider { position:relative; margin:0 auto; width:100%; }





/* ------------------------------

Image

------------------------------ */

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

img.o_zoom { display:block; width:100%; height:auto; -webkit-transform:scaleY(1); -moz-transform:scaleY(1); -o-transform:scaleY(1); -ms-transform:scaleY(1); transform:scaleY(1); -webkit-transition:all 0.6s ease-in-out; -moz-transition:all 0.6s ease-in-out; -o-transition:all 0.6s ease-in-out; -ms-transition:all 0.6s ease-in-out; transition:all 0.6s ease-in-out; }

img.o_zoom:hover { -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -o-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2); }



figure[class*="o_space"].o_light { padding:1em; background:url(../img/back/bg-img-light.png) repeat; }

figure[class*="o_space"].o_dark { padding:1em; background:url(../img/back/bg-img-dark.png) repeat; }



[class*="o_listimg"].o_light { padding:0 1em; background:url(../img/back/bg-img-light.png) repeat; }

[class*="o_listimg"].o_dark { padding:0 1em; background:url(../img/back/bg-img-dark.png) repeat; }



img.o_play { position:absolute; width:125px!important; height:auto; top:50%; left:50%; margin-top:-62px!important; margin-left:-62px!important; }

video.o_video { display:block; width:100%; height:auto; }



/* ------------------------------

Preview

------------------------------ */

/* Previw Small */

.o_prev_s { display:block; position:relative; padding:2em 0; }

.o_prev_s figure { display:block; position:relative; overflow:hidden; }

.o_prev_s figure img { display:block; width:100%; height:auto; }

.o_prev_s a h4 { position:absolute; left:0; bottom:0; padding:.8em 1.2em; color:#333; opacity:0.8; background-color:#fff; }

.o_prev_s a:hover h4 { color:#fff; background-color:#47b; }

.o_prev_s p { font-size:.9em; }



/* Previw Medium */

.o_prev_m { display:block; position:relative; padding:2em 0; }

.o_prev_m figure { display:block; overflow:hidden; }

.o_prev_m figure img { display:block; width:100%; height:auto; -webkit-transform:scaleY(1); -moz-transform:scaleY(1); -o-transform:scaleY(1); -ms-transform:scaleY(1); transform:scaleY(1); -webkit-transition:all 0.6s ease-in-out; -moz-transition:all 0.6s ease-in-out; -o-transition:all 0.6s ease-in-out; -ms-transition:all 0.6s ease-in-out; transition:all 0.6s ease-in-out; }

.o_prev_m figure:hover img { -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -o-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2); }

.o_prev_m h4 { padding:.8em 0 .4em 0; color:#333; }



/* Previw Large */

.o_prev_l aside { display:block; position:relative; }

.o_prev_l figure { display:block; overflow:hidden; }









.o_prev_l figure img { display:block; position:relative; width:100%; height:auto; -webkit-transform:scaleY(1); -moz-transform:scaleY(1); -o-transform:scaleY(1); -ms-transform:scaleY(1); transform:scaleY(1); -webkit-transition:all 0.6s ease-in-out; -moz-transition:all 0.6s ease-in-out; -o-transition:all 0.6s ease-in-out; -ms-transition:all 0.6s ease-in-out; transition:all 0.6s ease-in-out; }

.o_prev_l figure:hover img { -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -o-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2); }

.o_prev_l figure a { text-decoration:none; }



.o_prev_l div { display:block; position:relative; }

.o_prev_l h4 { padding:.8em .4em; color:#333; background-color:#f5f5f5; }





/* Preview Case */

.o_prev_case { display:block; position:relative; clear:both; background-color:#cb2; }

.o_prev_case img { float:left; display:inline-block; width:48%; margin:1%; }





/* ------------------------------

Wegweiser

------------------------------ */

ul.o_topmarker { position:absolute; top:0; right:0; padding:.4em; list-style:none; }

ul.o_topmarker li { list-style:none; text-align:right; }

ul.o_topmarker li:first-child { padding-bottom:.2em; border-bottom:1px dotted #ccc; }

ul.o_topmarker li:last-child { padding-top:.2em; }

ul.o_topmarker li a { font-size:.85em; text-decoration:none; color:#999; }

ul.o_topmarker li a:hover { color:#28c; }





/* ------------------------------

Tabellen

------------------------------ */

table[class*="o_table"] { margin:1em 0; width:100%; border-spacing:0; empty-cells:show; border-collapse:separate; }

table[class*="o_table"] th { padding:.8em .4em .4em .4em; overflow:hidden; color:#28c; vertical-align:bottom; background-color:#f5f5f5; }

table[class*="o_table"] th.subheadline { padding:.4em; color:#fff; text-align:left; background-color:#ddd; }

table[class*="o_table"] th a { color:#000; text-decoration:none; }

table[class*="o_table"] th a:hover { text-decoration:underline; }

table[class*="o_table"] th i { color:#999; } /* Symbol für Sortierung */

table[class*="o_table"] td { padding:.4em .4em .2em .4em; vertical-align:top; overflow:hidden; font-size:.9em; }



table[class*="o_table"] td.o_caption { color:#000; background-color:#eee; }

table[class*="o_table"] td.o_text { padding:.8em 1%; }



/* Standardtabelle */

table.o_table th { border-top:1px solid #ccc; border-left:1px solid #ccc; }

table.o_table th:first-child { border-left:0; }

table.o_table td:first-child { border-left:0; }

table.o_table th.subheadline { border-left:1px solid #ccc; border-top:1px solid #ccc; }

table.o_table th.subheadline:last-child { border-right:1px solid #333; }

table.o_table td { border-left:1px solid #ccc; border-top:1px solid #ccc; }



/* Tabelle light */

table.o_table_light th { text-align:left; border-bottom:1px solid #ccc; }

table.o_table_light th.subheadline { border-bottom:1px solid #ccc; }

table.o_table_light td { border-bottom:1px solid #ccc; }



/* Tabelle mit abgerundeten Ecken */

table.o_table_r th { border-top:1px solid #ccc; border-left:1px solid #ccc; }

table.o_table_r th.subheadline { border-left:1px solid #ccc; border-top:1px solid #ccc; }

table.o_table_r th.subheadline:last-child { border-right:1px solid #333; }

table.o_table_r td { border-left:1px solid #ccc; border-top:1px solid #ccc; }

table.o_table_r tr:last-child th, table.o_table_r tr:last-child td { border-bottom:1px solid #ccc; }

table.o_table_r th:last-child, table.o_table_r td:last-child { border-right:1px solid #ccc; }

table.o_table_r tr:last-child td:first-child { border-bottom-left-radius:10px; }

table.o_table_r tr:last-child td:last-child { border-bottom-right-radius:10px; }

table.o_table_r tr:first-child th:first-child, table.o_table_r tr:first-child td:first-child { border-top-left-radius:10px; }

table.o_table_r tr:first-child th:last-child, table.o_table_r tr:first-child td:last-child { border-top-right-radius:10px; }

table.o_table_r tr:first-child th, table.o_table_r tr:first-child td { border-top:1px solid #ccc; }







/* ------------------------------

Formulare

------------------------------ */

form.o_form .o_line { margin:.4em 0; clear:both; }

form.o_form label { float:left; padding:.4em 1em .4em 0; width:25%; text-align:left; }

form.o_form label sup { font-size:.8em; }

form.o_form input[type="text"],

form.o_form input[type="email"],

form.o_form input[type="url"],

form.o_form input[type="password"],

form.o_form textarea,

form.o_form select { padding:.4em; width:75%; color:#28c; border:1px solid #ccc; }

form.o_form input[type="text"]:focus,

form.o_form input[type="email"]:focus,

form.o_form input[type="url"]:focus,

form.o_form input[type="password"]:focus,

form.o_form textarea:focus,

form.o_form select:focus { outline:0; color:#000; background:#f5f5f5; }

form.o_form input[type="text"].o_number, form.o_form input[type="text"].o_date, form.o_form input[type="text"].o_time { width:30%; }

form.o_form textarea { height:10em; }

form.o_form textarea.o_full, form.o_form input[type="text"].o_full, form.o_form select.o_full  { width:100%; }



/* Fieldset */

form.o_form fieldset { margin:.4em 0; border:1px solid #ccc; }

form.o_form fieldset legend { padding:0 .4em; font-size:.9em; line-height:1.1em; color:#28c; }

form.o_form fieldset.o_horizontal label { display:inline-block; margin:0 .8em 0 .4em; width:auto; }

form.o_form fieldset.o_vertical label { display:block; margin:0 .8em 0 .4em; width:auto; }

form.o_form fieldset.o_btn_bar { margin-left:25%; padding:0; border:0; }



/* Error-Markierung von Formular_Elementen */

input.o_error, textarea.o_error, select.o_error { border:1px solid #c00; background-color:#fdd; }

form.o_form .o_error_msg { color:#c00; font-size:.85em;}



/* im Formular soll dieser Bereich mit Feldern nicht angezeigt werden. Die Felder sind leer bzw. werden beim Absenden über die Submit-Schaltfläche geleert.

Der normale Nutzer kann diese Felder nicht sehen und damit auch nicht füllen. Sollten die Felder trotzdem gefüllt sein, wurden diese wohlmöglich automatisch gefüllt */

.dontsee { margin:0; padding:0; height:0px; display:block; overflow:hidden;	}

.dontsee input { display:none; border:none; }









/* ------------------------------

Schaltflächen

------------------------------ */

[class*="o_btn_def"] { display:inline-block; white-space:nowrap; cursor:pointer; text-decoration:none; text-align:center; font-family:'Archivo Narrow', Arial, Tahoma; cursor:pointer; box-shadow:none; }

[class*="o_btn_def"]:hover { text-decoration:none; }

[class*="o_btn_def"] i {  }

/* Größe Small */

.o_btn_def_s, .o_btn_def_sh, .o_btn_def_sd { margin:0 .2em; padding:0 .4em; line-height:1.4em; font-size:.9em; }

/* Größe Normal */

.o_btn_def, .o_btn_def_h, .o_btn_def_d { margin:0 .4em; padding:0 1.4em; line-height:2em; font-size:1em; }



/* normale Schaltflächen */

.o_btn_def, .o_btn_def_s { color:#333; border:1px solid #999; background-color:#f5f5f5; }

.o_btn_def:hover, .o_btn_def_s:hover { color:#000; background-color:#ccc; }

/* hervorgehobene Schaltflächen */

.o_btn_def_h, .o_btn_def_sh { color:#fff; border:1px solid #666; background-color:#4ae; }

.o_btn_def_h:hover, .o_btn_def_sh:hover { color:#fff; background-color:#48b; }

/* deaktive Schaltflächen */

.o_btn_def_d, .o_btn_def_sd { cursor:default; color:#999; border:1px solid #eee; background-color:#fff; }

.o_btn_def_d:hover, .o_btn_def_sd:hover { background-color:#fff; }





/* Schaltfläche mit Beschreibung */

[class*="o_btn_desc"] { display:inline-block; margin:.2em; padding:.4em 1em; cursor:pointer; text-align:center; text-decoration:none; font-family:'Archivo Narrow', Arial, Tahoma; font-weight:normal; font-size:.9em; }

[class*="o_btn_desc"] span { display:block; text-transform:uppercase; font-size:1.2em; }

[class*="o_btn_desc"] i { display:block; font-size:1.6em; }

.o_btn_desc { color:#333; border:1px solid #999; background-color:#f5f5f5; }

.o_btn_desc span { color:#999; }

.o_btn_desc:hover { background-color:#ccc; }

.o_btn_desc_attend { color:#fff; background-color:#4ae; }

.o_btn_desc_attend span { color:#723; }

.o_btn_desc_attend:hover { background-color:#48b; }







/* ------------------------------

Nachrichten

------------------------------ */

.o_msg_info, .o_msg_okay, .o_msg_error { padding:.8em; border:1px solid; }

.o_msg_info { color:#960; background-color:#eee; border-color:#C90; }

.o_msg_okay { color:#090; background-color:#eee; border-color:#090; }

.o_msg_error { color:#900; background-color:#fdd; border-color:#c00; }

.o_msg_info h2, .o_msg_okay h2, .o_msg_error h2 { padding:.4em 0; font-size:1.1em; }





/* ------------------------------

Google

------------------------------ */

.o_google_route { display:block; width:100%; }

#o_google_map { display:block; margin-top:1em; width:100%; height:40em; background-color:#fff; border:1px solid #999; }

#o_google_map .o_content { min-width:200px; line-height:1.2em; text-align:center; }

#o_google_map .o_content h2 { display:block; padding:.4em 0; width:100%; text-align:center; color:#28c; font-weight:normal; font-size:1.1em; }

#o_google_map .o_content h2 img { display:block; margin:.4em auto; width:auto; height:100px; }

#o_google_map .o_content a { color:#ccc; text-decoration:none; }

#o_google_map .o_content a:hover { color:#fff; text-decoration:underline; }





/* ------------------------------

Mitglieder

------------------------------ */

img.o_member_portrait_q { display:block; width:100%; height:auto; }

img.o_member_portrait_h { display:block; margin:0 auto; width:60%; height:auto; }



#o_member_map { display:block; margin-top:1em; width:100%; height:30em; }



/* Liste */

.o_member_list .o_tab_col1 { width:20%; }

.o_member_list .o_tab_col2 { width:40%; }

.o_member_list .o_tab_col3 { width:40%; }





/* Suche / Google Maps */

.o_search_member { display:block; margin-top:1em; width:100%; }

.o_sm_option { display:table; width:100%; min-height:60px; }

.o_sm_option .o_icon { display:table-cell; width:60px; text-align:center; vertical-align:middle; background-color:#47b; }

.o_sm_option .o_icon i { color:#fff; font-size:3em; }

.o_sm_option .o_form { display:table-cell; padding:0 0 0 1em; }

.o_sm_option .o_form p { padding:.2em 0; }

.o_sm_option .o_form label { display:inline-block; width:20%; min-width:60px; }

.o_sm_option .o_form input {  }

.o_sm_option .o_form select { max-width:150px; }

.o_sm_option .o_form button { margin:.2em 0; }



#o_search_map { display:block; width:100%; height:40em; }

.o_sm_content { min-width:200px; line-height:1.2em; text-align:center; }

.o_sm_content h2 { display:block; padding:.4em 0; width:100%; text-align:center; color:#28c; font-weight:normal; font-size:1.1em; }

.o_sm_content h2 img { display:block; margin:.4em auto; width:auto; height:100px; }

.o_sm_content div { padding:.2em 0; width:100%; color:#fff; background-color:#666; }

.o_sm_content div a { color:#ccc; text-decoration:none; }

.o_sm_content div a:hover { color:#fff; text-decoration:underline; }





/* ------------------------------

ABC

------------------------------ */

.o_abc_register { display:block; margin-bottom:2em; }

.o_abc_register a, .o_abc_register span { float:left; display:inline-block; margin-bottom:.4em; margin-right:1.68%; padding:.2em; width:6%; height:6%; text-align:center; text-transform:uppercase; text-decoration:none; font-size:1.2em; }

.o_abc_register a { color:#333; border:1px solid #999; background-color:#fff; }

.o_abc_register a:hover { color:#fff; background-color:#47b; }

.o_abc_register span { color:#ccc; border:1px solid #eee; background-color:#fff; }

.o_abc_paragraph { display:block; margin:2em 0 .4em 0; padding:.4em; width:1.6em; height:1.6em; text-align:center; text-transform:uppercase; color:#fff; font-size:2em; font-weight:bold; background-color:#47b; }







/* ------------------------------

Slider

------------------------------ */

/* Top Slider */

.o_slider_top { position:relative; width:100%; padding-bottom:29%; /* 16:9 (100/16*9=56.25) */ overflow:hidden; }

.o_slider_top .o_tab { position:absolute; left:50%; top:50%; height:100%; width:100%; opacity:0; transform:translate(-50%,-50%); -webkit-transition:all 1s ease-out; -moz-transition:all 1s ease-out; -o-transition:all 1s ease-out; -ms-transition:all 1s ease-out; }

.o_slider_top .o_tab img { width:100%; height:auto; -webkit-transform:scale(1.2); -moz-transform:scale(1.2); -o-transform:scale(1.2); -ms-transform:scale(1.2); transform:scale(1.2); -webkit-transition:all 1s ease-out; -moz-transition:all 1s ease-out; -o-transition:all 1s ease-out; -ms-transition:all 1s ease-out; }

.o_slider_top .o_in { opacity:1; }

.o_slider_top .o_in img { width:100%; height:auto; -webkit-transform:scale(1); -moz-transform:scale(1); -o-transform:scale(1); -ms-transform:scale(1); transform:scale(1); }

.o_slider_top .o_next, .o_slider_top .o_prev { position:absolute; top:50%; opacity:0; color:#fff; font-size:3em; cursor:pointer; transition:0.5s; transform:translate(-50%,-50%); }

.o_slider_top:hover .o_next, .o_slider_top:hover .o_prev { opacity:1; }

.o_slider_top .o_next { right:0em; }

.o_slider_top .o_prev { left:1em; }



.o_slider_top .o_topbow { position:absolute; display:block; bottom:0; width:100%; height:auto; z-index:10; }







/* ------------------------------

Swiper Content-Slider



------------------------------ */

.swiper-container { width:100%; height:auto; }

.swiper-slide { height:100%; overflow:hidden; font-size:.9em; }

.swiper-container [class*="slide"] { height:100%; padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }

.swiper-container [class*="slide"] h3 { font-size:1.2em; font-weight:bold; }

.swiper-container .slide-white, .swiper-container .slide-light { margin:0 auto; padding:0 2em; width:50%; min-width:320px; color:#000; }

.swiper-container .slide-white h3, .swiper-container .slide-light h3 { color:#000; }

.swiper-container .slide-green h3, .swiper-container .slide-red h3, .swiper-container .slide-blue h3, .swiper-container .slide-grey h3 { color:#000; }

.swiper-container .slide-white { color:#666; background:#fff; }

.swiper-container .slide-green { color:#360; background:#ce7; }

.swiper-container .slide-red { color:#600; background:#c44; }

.swiper-container .slide-blue { color:#036; background:#69c; }

.swiper-container .slide-light {  }

.swiper-container .slide-grey { color:#fff; background:#666; }

.pagination { position:absolute; z-index:20; left:45%; bottom:0; }

.swiper-pagination-switch { display:inline-block; margin-right:8px; opacity:0.8; width:8px; height:8px; cursor:pointer; border:1px solid #fff; border-radius:8px; background:#ccc; }

.swiper-visible-switch { background:#900; }

.swiper-active-switch { background:#333; }







/* ------------------------------

Royal Slider

------------------------------ */

#royal_slider { padding:1em; width:100%; border:1px solid #551; }



#royal_slider,

#royal_slider .rsOverflow,

#royal_slider .rsSlide,

#royal_slider .rsVideoFrameHolder,

#royal_slider .rsThumbs {

	color:#220;

  background:none;

}



.o_content_slider { margin-top:1em; }

.o_content_slider .o_nav_left, .o_content_slider .o_nav_right { margin-top:4em; cursor:pointer; }

.o_content_slider .o_nav_left { float:left; }

.o_content_slider .o_nav_right { float:right; }









/* ------------------------------

Hover-Info

unterstützt von Javascript

------------------------------ */

.o_hi_inline { display:inline-block; position:relative; padding:0 .4em; overflow:hidden; vertical-align:bottom; color:#000; text-decoration:none; cursor:pointer; background-color:#f5f5f5; }

.o_hi_inline > span { position:absolute; padding:0 .4em; left:0; top:100%; width:100%; height:100%; white-space:nowrap; color:#fff; background-color:#47b; }



.o_hi_img { position:relative; display:block; width:100%; overflow:hidden; cursor:pointer; }

.o_hi_img img { display:block; width:100%; height:auto; }

.o_hi_img > div { position:absolute; padding:20% .8em; width:100%; height:100%; left:0; top:100%; text-align:center; color:#fff; font-family:'Archivo Narrow', Arial, Tahoma; background-color:#47b; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }

.o_hi_img > div span { display:block; text-transform:uppercase; color:#cde; font-size:1.4em; }



.o_hi_fade { position:relative; display:block; overflow:hidden; cursor:pointer; }

.o_hi_fade img { display:block; width:100%; height:auto; }

.o_hi_fade > div { position:absolute; padding:20% .4em; width:100%; height:100%; left:0; top:100%; text-align:center; color:#fff; font-family:'Archivo Narrow', Arial, Tahoma; background-color:#47b; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }

.o_hi_fade > div span { display:block; text-transform:uppercase; color:#cde; font-size:1.2em; }



.o_hi_under { position:relative; display:block; overflow:hidden; cursor:pointer; }

.o_hi_under img { display:block; width:100%; height:auto; }

.o_hi_under > div { position:absolute; padding:.4em; width:100%; left:0; bottom:0; text-align:center; color:#333; font-family:'Archivo Narrow', Arial, Tahoma; background-color:#fff; }

.o_hi_under > div span { display:block; text-transform:uppercase; font-size:1.2em; }



.o_hi_undermore { position:relative; display:block; overflow:hidden; cursor:pointer; }

.o_hi_undermore img { display:block; width:100%; height:auto; height:auto; }

.o_hi_undermore > div { position:absolute; padding:.4em; width:100%; height:100%; left:0; text-align:center; color:#333; font-family:'Archivo Narrow', Arial, Tahoma; background-color:#fff; }

.o_hi_undermore > div h4 { display:block; padding:.4em 0; height:40%; text-transform:uppercase; white-space:nowrap; color:#333; font-size:1.2em; }









.o_faq ul[class*="o_label"] li > *:first-child { color:#000; font-family:'Archivo Narrow', Arial, Tahoma; font-size:.9em; }

.o_faq .o_toggle_faq { color:#000; font-size:.9em; }







/* ------------------------------

Help-Box

------------------------------ */

.o_helpbox { position:fixed; top:12em; width:240px; left:-244px; z-index:999; background-color:rgba(204, 0, 0, 0.7); }

.o_helpbox header { position:absolute; right:-5.2em; padding-top:1em; width:5.2em; height:6em; line-height:1.1em; text-align:center; font-size:0.8em; color:#fff; background-color:rgba(204, 0, 0, 0.7); }

.o_helpbox header i { font-size:2.8em; }



.o_helpbox .o_linklist { width:220px; margin:10px; padding:0; background-color:#f5f5f5; }

.o_helpbox .o_linklist p { padding:5px 10px; }

.o_helpbox .o_linklist a { color:#300; font-size:14px; text-decoration:none; }

.o_helpbox .o_linklist a:hover { color:#c00; }

.o_helpbox .o_linklist i { font-size:18px; }





/* ------------------------------

Info-Box

------------------------------ */

.o_infobox { position:fixed; top:17.2em; width:240px; left:-244px; z-index:998; background-color:rgba(54, 153, 0, 0.7); }

.o_infobox header { position:absolute; right:-5.2em; padding-top:1em; width:5.2em; height:6em; line-height:1.1em; text-align:center; font-size:0.8em; color:#fff; background-color:rgba(54, 153, 0, 0.7); }

.o_infobox header i { font-size:2.8em; }



.o_infobox .o_linklist { width:220px; margin:10px; padding:0; background-color:#f5f5f5; }

.o_infobox .o_linklist p { padding:5px 10px; }

.o_infobox .o_linklist a { color:#300; font-size:14px; text-decoration:none; }

.o_infobox .o_linklist a:hover { color:#c00; }

.o_infobox .o_linklist i { font-size:18px; }





/* ------------------------------

Infoline

------------------------------ */

.o_infoline { display:block; margin:.8em 0; border:1px solid #4ae; }

.o_infoline h2 { display:block; padding:.4em;; color:#fff; text-transform:uppercase; font-stretch:expanded; background-color:#4ae; }

.o_infoline h3 { padding:.4em 0 .2em 0; }

.o_infoline [class*="o_col"] { padding:.4em; line-height:1.2em; }







/* ------------------------------

Acordeon



Beispiel 1: open multiple

<div class="o_accordion">

<div class="o_tab">

	<input id="ppTAB1" type="checkbox" checked="checked" name="tabs">

	<label for="ppTAB1">Überschrift 1</label>

	<div class="o_content">

		<p>Das ist der Text für den 1. Tab.</p>

	</div>

</div>

<div class="o_tab">

	<input id="ppTAB2" type="checkbox" name="tabs">

	<label for="ppTAB2">Label Two</label>

	<div class="o_content">

		<p>Das ist der Text für den 2. Tab.</p>

	</div>

</div>

<div class="o_tab">

	<input id="ppTAB3" type="checkbox" name="tabs">

	<label for="ppTAB3">Label Three</label>

	<div class="o_content">

		<p>Das ist der Text für den 3. Tab.</p>

	</div>

</div>

</div>



Beispiel 2: open one

<div class="o_accordion">

<div class="o_tab">

	<input id="ppTAB1" type="radio" name="tab">

	<label for="ppTAB1">Überschrift 1</label>

	<div class="o_content">

		<p>Das ist der Text für den 1. Tab.</p>

	</div>

</div>

<div class="o_tab">

	<input id="ppTAB2" type="radio" name="tab">

	<label for="ppTAB2">Überschrift 2</label>

	<div class="o_content">

		<p>Das ist der Text für den 2. Tab.</p>

	</div>

</div>

<div class="o_tab">

	<input id="ppTAB3" type="radio" name="tab">

	<label for="ppTAB3">Überschrift 3</label>

	<div class="o_content">

		<p>Das ist der Text für den 3. Tab.</p>

	</div>

</div>

</div>

------------------------------ */

.o_accordion {  }

.o_accordion .o_tab { position:relative; margin-bottom:1px; width:100%; overflow:hidden; color:#333; }

.o_accordion input { position:absolute; opacity:0; z-index:-1; }

.o_accordion label { display:block; position:relative; padding:1em 3em 1em 1em; cursor:pointer; line-height:1.1em; font-weight:bold; border-bottom:1px solid #ccc; background:#eee; }

.o_accordion .o_content { max-height:0; overflow:hidden; background:#f5f5f5; -webkit-transition:max-height .35s; -o-transition:max-height .35s; transition:max-height .35s; }

.o_accordion .o_content .o_abody { padding:1em; }

/* :checked */

.o_accordion input:checked ~ .o_content { max-height:40em; }

/* Icon */

.o_accordion label::after { display:block; position:absolute; top:0; right:0; width:3em; height:3em; line-height:3; text-align:center; -webkit-transition:all .35s; -o-transition:all .35s; transition:all .35s; }

.o_accordion input[type=checkbox] + label::after { content:"+"; }

.o_accordion input[type=radio] + label::after { content:"\25BC"; }

.o_accordion input[type=checkbox]:checked + label::after { transform:rotate(315deg); }

.o_accordion input[type=radio]:checked + label::after { transform:rotateX(180deg); }







/* ------------------------------

Videos

------------------------------ */

.o_frame_16_9, .o_frame_4_3 { display:block; position:relative; padding-top:30px; 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 iframe, .o_frame_4_3 iframe { position:absolute; top:0; left:0; width:100%; height:100%; border:0; }





/* ------------------------------

Sonstiges

------------------------------ */

.o_highlight { color:#28c; font-family:'Archivo Narrow', Arial, Tahoma; font-weight:bold; font-size:1.2em; font-style:italic; }

.o_no_circle { display:inline-block; width:1.6em; height:1.6em; line-height:1.6em; color:#fff; text-align:center; font-size:1.6em; border-radius:100%; -webkit-border-radius:100%; -moz-border-radius:100%; -khtml-border-radius:100%; border:1px solid #fff; background-color:#4ae; }





/* ------------------------------

Tooltip

------------------------------ */

.o_tooltip { position:relative; cursor:pointer; }

.o_tooltip .o_tooltiptext { visibility:hidden; position:absolute; top:-4em; padding:.4em; width:auto; z-index:1; color:#666; text-align:center; border-radius:6px; background-color:#f8f8f8; }

.o_tooltip:hover .o_tooltiptext { visibility:visible; }



/* ------------------------------

Box Sizing

------------------------------ */

* { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }







/* ------------------------------

Clearfix

------------------------------ */

.o_article_split,

.o_article_right,

figure.o_branding,

.o_prev_s,

.o_prev_m,

.o_prev_l aside,

.o_prev_case,

.o_abc_register,

.swiper-container

{ zoom:1; }

.o_article_split:before,

.o_article_right:before,

figure.o_branding:before,

.o_prev_s:before,

.o_prev_m:before,

.o_prev_l aside:before,

.o_prev_case:before,

.o_abc_register:before,

.swiper-container:before

{ display:table; content:""; }

.o_article_split:after,

.o_article_right:after,

figure.o_branding:after,

.o_prev_s:after,

.o_prev_m:after,

.o_prev_l aside:after,

.o_prev_case:after,

.o_abc_register:after,

.swiper-container:after

{ display:table; clear:both; content:""; }





/* ------------------------------

Radius

------------------------------ */

.o_paragraph,

figure[class*="o_space"].o_light,

figure[class*="o_space"].o_dark,

[class*="o_listimg"].o_light,

[class*="o_listimg"].o_dark,

[class*="o_btn_desc"],

[class*="o_btn_def"],

#royal_slider

{ border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; }





/* ------------------------------

Shadow

------------------------------ */



/*[class*="o_btn_def"]

{ -moz-box-shadow:5px 5px 10px 0px rgba(0, 0, 0, 0.75); -webkit-box-shadow:5px 5px 10px 0px rgba(0, 0, 0, 0.75); box-shadow:5px 5px 10px 0px rgba(0, 0, 0, 0.75); }

*/



/* ------------------------------

Transition

------------------------------ */

/* Color */

/*

{ -webkit-transition:color .5s; -moz-transition:color .5s; -o-transition:color .5s; -ms-transition:color .5s; }

*/

/* Background */

[class*="o_btn_desc"], [class*="o_btn_desc"]:hover,

a.o_scroll_trigger, a.o_scroll_trigger:hover

{ -webkit-transition:background-color 1s; -moz-transition:background-color 1s; -o-transition:background-color 1s; -ms-transition:background-color 1s; }



/* Width */

/*

.o_nav_framework

{ -webkit-transition:width  .5s; -moz-transition:width  .5s; -o-transition:width  .5s; -ms-transition:width  .5s; }

.o_nav_framework:hover

{ -webkit-transition:width  .5s; -moz-transition:width  .5s; -o-transition:width  .5s; -ms-transition:width  .5s; }

*/

/* Opacity */

/*

[class*="o_btn"] { -webkit-transition:opacity 1s; -moz-transition:opacity 1s; -o-transition:opacity 1s; -ms-transition:opacity 1s; }

[class*="o_btn"]:hover { -webkit-transition:opacity 1s; -moz-transition:opacity 1s; -o-transition:opacity 1s; -ms-transition:opacity 1s; }

*/



/* All */

a.o_href, a.o_href:hover,

.o_marked,

[class*="o_btn_def"], [class*="o_btn_def"]:hover,

.o_abc_register a, .o_abc_register a:hover span,

.o_prev_s a h4, .o_prev_s a:hover h4

{ -webkit-transition:all .5s ease-out; -moz-transition:all .5s ease-out; -o-transition:all .5s ease-out; -ms-transition:all .5s ease-out; }



/* None */

/*

#o_nav ul li a { -webkit-transition:none; -moz-transition:none; -o-transition:none; -ms-transition:none; }

#o_nav ul li a:hover { -webkit-transition:none; -moz-transition:none; -o-transition:none; -ms-transition:none; }

*/

/*

#o_nav li a:hover { -webkit-transition:all .5s; -moz-transition:all .5s; -o-transition:all .5s; -ms-transition:all .5s; }



#o_nav li a { -webkit-transition:all .5s; -moz-transition:all .5s; -o-transition:all .5s; -ms-transition:all .5s; }

*/







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



/* ------------------------------

Article

------------------------------ */

article.o_article_split { margin-right:40%; }

article.o_article_right { float:right; width:40%; }



/* ------------------------------

Right Side

------------------------------ */

.o_sideinfo { margin-left:1em; padding-left:1em; border-left:1px solid #ccc; }





}







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





/* ------------------------------

Preview

------------------------------ */

.o_prev_l figure { float:left; width:30%; }

.o_prev_l div { float:right; width:68%; }



/* ------------------------------

Suche Mitglieder

------------------------------ */

.o_sm_option .o_icon { width:200px; }



}







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



/* ------------------------------

Seitenbereich

------------------------------ */

.o_section { padding:1em 1%; }







/* ------------------------------

Article

------------------------------ */

article.o_article_split { margin-right:30%; }

article.o_article_right { float:right; width:30%; }







}







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







}







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





/* ------------------------------

Article

------------------------------ */

article.o_article_split { margin-right:20%; }

article.o_article_right { float:right; width:20%; }





}







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





}







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





}