/************************************************************************/ /********* G E N E R E L L E D E F I N I T I O N E N ********/ /************************************************************************/ /* GOOGLE FONTS: Roboto ------- Light 300 Normal 400 Normal 400 Italic Medium 500 Bold 700 Roboto Slab ------------ Bold 700 Roboto Condensed ----------------- Normal 400 Bold 700 */ /* ################## -> siehe auch Inline-Styles ################## */ p {margin-bottom:25px; /* Korrekte Silbentrennung, funktioniert nur mit */ -moz-hyphens: auto;-o-hyphens: auto;-webkit-hyphens: auto;-ms-hyphens: auto;hyphens: auto;} a {color:#006fa7; text-decoration:none;} b {font-weight:700;} i {font-weight:400; font-style:italic;} strong a {font-weight:700;} a:hover {text-decoration:underline;} /* ################## -> siehe auch Inline-Styles ################## */ a img, p a img {border:none;} input[placeholder], [placeholder], *[placeholder] {color: #aabbca;opacity: 1 !important;} ::-webkit-input-placeholder {color: #aabbca;opacity: 1 !important;} :-moz-placeholder {color: #aabbca;opacity: 1 !important;} ::-moz-placeholder {color: #aabbca;opacity: 1 !important;} :-ms-input-placeholder {color: #aabbca;opacity: 1 !important;} /************************************************************************/ /********* G L O B A L E L A Y O U T B O X E N **********/ /************************************************************************/ #container {} @media \0screen {#container {margin:0 0px 0 -10px;} } /* IE8 ohne horz. Scrollbar bei 1280 px Breite */ /* ################## -> siehe auch Inline-Styles ################## */ #bg-grafik { height:auto; width:100%; z-index:-1; position:absolute; left:0; top:0; } #bg-grafik img {height:auto; width:100%;} #footer { height:350px; clear:both; padding:0; text-align:left; margin:0 0 0 0px; background:#9c9c9d; } /************************************************************************/ /********* E I N Z E L N E L A Y O U T B O X E N **********/ /************************************************************************/ #logo img { width:424px; height:auto;} .small #logo {margin:10px 0 0 31px;} .small #logo img {width:320px; height:62px;} #logo-print {display:none;} #content .link-teilnahme a, .link-teilnahme a { width:208px; height:140px; position:fixed; right:0; bottom:50px; background:#57aa0c url(images/bg_link_teilnahme.png) repeat-x 0 0; box-shadow: 0 5px 11px 0 rgba(50, 50, 50, 0.4); -moz-box-shadow: 0 5px 11px 0 rgba(50, 50, 50, 0.4); -webkit-box-shadow: 0 5px 11px 0 rgba(50, 50, 50, 0.4); z-index:3; border-radius: 20px 0 0 20px; -moz-border-radius: 20px 0 0 20px; -webkit-border-radius: 20px 0 0 20px; -o-border-radius: 20px 0 0 20px; -ms-border-radius: 20px 0 0 20px; font: 400 22px/32px 'Roboto Condensed',Arial,sans-serif; color:#fff; text-align:right; opacity: 0.92; -moz-opacity: 0.92; filter: alpha(opacity=92); behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ clear:both; } .link-teilnahme a span { display:block; margin:20px 19px 0 0; background:url(images/pfeil_link_teilnahme.png) 20px 28px no-repeat; } #content .link-teilnahme a:hover, .link-teilnahme a:hover { text-decoration:none; background-position:0 -20px; opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } .breadcrumb {padding:20px 20px 38px 0; font:15px/28px 'Roboto',Arial,sans-serif;} .breadcrumb ol, .breadcrumb li {padding:0;margin:0 0 0 -4px;} .breadcrumb a {padding:2px 5px 3px 4px; color: #828282; background:#ebebeb;} .breadcrumb a.act {color: #333;background:#fff;} .pfeil-breadcrumb {background:url(images/pfeil_breadcrumb.png) 0 center no-repeat;padding:2px 15px 3px 0px;} .pfeil-breadcrumb-re{background:url(images/pfeil_breadcrumb_re.png) 0 center no-repeat;padding:2px 15px 3px 0px;} .left-breadcrumb {background:#ebebeb; margin-left:-5px; padding:2px 5px 3px 0px;} a.totop { position:fixed; width:70px; height:50px; background:#fff; border-radius: 15px 15px 0px 0px ; -moz-border-radius: 15px 15px 0px 0px ; -webkit-border-radius: 15px 15px 0px 0px ; -o-border-radius: 15px 15px 0px 0px ; -ms-border-radius: 15px 15px 0px 0px ; opacity: 0.90; -moz-opacity: 0.90; filter: alpha(opacity=90); behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ z-index:11; display:block; bottom:0px; left: 0; right: 0; margin: 0 auto; box-shadow: 0 0 9px 0 rgba(50,50,50,0.30); -moz-box-shadow: 0 0 9px 0 rgba(50,50,50,0.30); -webkit-box-shadow: 0 0 9px 0 rgba(50,50,50,0.30); } a.totop span { display:block; width:30px; height:30px; margin:20px 0 0 22px; background:url(images/pfeil_nach_oben.png) no-repeat 0px 0px; /* IE < 9 */ background:url(images/pfeil_nach_oben.svg) no-repeat 0px 0px, none; /* alle anderen */ } a.totop:hover { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } /*******************************************************/ /********************* F O O T E R *********************/ /*******************************************************/ .footer-wrapper {float:right;} .footer-box { float:left; color:#fff; font:300 18px/22px 'Roboto',Arial,sans-serif; padding:48px 0 0 0; } .footer-box.box-links { float:none; position:absolute; width:270px; margin:4px 0 0 0px; padding-left:30px; } .footer-box.box-1 {width:285px; margin:0 30px 0 0;} .footer-box.box-2 {width:240px; margin:0 30px 0 0;} .footer-box.box-3 {width:158px; margin:0 70px 0 0;} .ft-text { margin:118px 0 16px 1px; padding:0; font:300 16px/19px 'Roboto', Arial, sans-serif; } .footer-box ul {margin:0 0 5px 0;list-style:none;} .footer-box ul li {margin-bottom:15px;} .footer-box a { background: url(images/pfeil_link_footer.png) no-repeat 10px 8px; /* IE < 9 */ background: url(images/pfeil_link_footer.svg) no-repeat 10px 8px, none; /* alle anderen */ display:block; color: #fff; padding:4px 4px 4px 27px; } .footer-box a:hover { text-decoration:none; background-color:#b0b0b1; } /*******************************************************/ /*** N A V I G A T I O N E B E N E 1 **************/ /*******************************************************/ .small #navigation {margin:27px 0 0 0;} .small #navigation ul li {height:29px;} #navigation a.act, #navigation a.act:hover { cursor:pointer; border-bottom:4px solid #006fa7; /*blau*/ } #navigation a:hover { cursor:pointer; border-bottom:4px solid #91c858; /*gruen*/ } /********************************************************************/ /*** N A V I G A T I O N O B E N E B E N E 2 **************/ /********************************************************************/ #navigation ul.nav-menu li ul { /* padding + overflow:hidden; schneidet den oberen Schatten ab */ position: absolute; clear:left; margin:36px 0 0 -42px; z-index:10; display:none; } .small #navigation ul.nav-menu li ul {margin-top:36px;} .nav-wrapper-outer { margin:29px 0 0 0; overflow:hidden; padding:0 10px 10px 10px; } .small .nav-wrapper-outer {margin: 17px 0 0;} .nav-wrapper { min-width:174px; margin:0px 0 0 0; padding:15px 0px 20px 0px; clear:left; float:right; /* Fallback for web browsers that doesn't support RGBa */ background: rgb(255, 255, 255); /* RGBa with 0.6 opacity */ background: rgba(255, 255, 255, 0.95); box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.60); -moz-box-shadow: 0 0 12px 0 rgba(50, 50, 50, 0.60); -webkit-box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.60); border-radius: 0px 0px 10px 10px; -moz-border-radius: 0px 0px 10px 10px; -webkit-border-radius: 0px 0px 10px 10px; -o-border-radius: 0px 0px 10px 10px; -ms-border-radius: 0px 0px 10px 10px; } #navigation .nav-wrapper {border:1px solid #ccc\9;} /*IE8*/ :root #navigation .nav-wrapper {border:none\0/IE9;} /* IE9 + IE10pp4 */ #navigation ul.nav-menu li:hover ul {display:block;} #navigation ul.nav-menu li ul li { float:none; margin:0 0 0px 0; padding:0px 0px 0px 0px; height:auto; display:block; border-bottom:none; /*max-width:290px;*/ max-width:400px; } #navigation ul.nav-menu li ul li { width:290px\9\0;/*Only works in IE9*/ } #navigation ul.nav-menu li ul li a, #navigation ul.nav-menu li.act ul li a { display:block; float:none; height:auto; border:none; background:url(images/pfeil_nav_2.png) no-repeat 18px 11px; /* IE < 9 */ background:url(images/pfeil_nav_2.svg) no-repeat 18px 11px, none; /* alle anderen */ padding:5px 25px 5px 35px; font:300 18px/28px 'Roboto', Arial, sans-serif; color:#333; } #navigation ul.nav-menu li ul li a.uebersicht { background:url(images/pfeil_nav_2_gruen.png) no-repeat 18px 11px; /* IE < 9 */ background:url(images/pfeil_nav_2_gruen.svg) no-repeat 18px 11px, none; /* alle anderen */ font:500 18px/28px 'Roboto', Arial, sans-serif; color:#62b111; } #navigation ul.nav-menu li ul li:hover {background-color:#a7db73;} #navigation ul.nav-menu li ul li a:hover { background:url(images/pfeil_nav_2_mo.png) no-repeat 18px 11px; /* IE < 9 */ background:url(images/pfeil_nav_2_mo.svg) no-repeat 18px 11px, none; /* alle anderen */ color:#333; } /*** NAV 2 - zweispaltig ***/ /*** NAV 2 - dreispaltig ***/ #navigation ul.nav-menu li ul.zweispalten {margin-left:-322px;} #navigation ul.nav-menu li ul.dreispalten {margin-left:-602px;} #navigation ul.nav-menu li ul.last {margin-left:-143px;} #navigation ul.nav-menu li ul.zweispalten .nav-wrapper {width:560px;} #navigation ul.nav-menu li ul.dreispalten .nav-wrapper {width:840px;} #navigation ul.nav-menu li ul.zweispalten li, #navigation ul.nav-menu li ul.dreispalten li { float:left; height:auto; width:280px; } #navigation ul.nav-menu li ul li .kat-nav { margin:-3px 0 0px 0; padding:0px 25px 5px 35px; font: 300 13px/18px "Roboto",Arial,sans-serif; display:block; } #navigation ul.nav-menu li ul li .kat-nav a, #navigation ul.nav-menu li.act ul li .kat-nav a { background:none; padding:0px 0px 0px 0px; font: 300 14px/18px "Roboto",Arial,sans-serif;f; color:#006fa7; display:inline; } #navigation ul.nav-menu li ul li .kat-nav a:hover, #navigation ul.nav-menu li.act ul li .kat-nav a:hover {text-decoration:underline;} /*******************************************************/ /***************** C O N T E N T *********************/ /*******************************************************/ /* BUTTONS */ a.button-blau, #content a.button-blau, .button-blau, #content .button-blau { display:inline-block; font:500 22px/27px 'Roboto',Arial,sans-serif; color:#fff; text-align:center; margin:0px 0px px 0px; padding:12px 0 13px 0; background:#006fa7 url(images/bg_button_blau.png) repeat-x 0 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; behavior: url(media/PIE.htc); position: relative; cursor:pointer; } .button-blau span { padding:0 30px 0 0; margin:0 17px 0 30px; background: url(images/pfeil_button_blau.png) no-repeat right 5px; /* IE < 9 */ background: url(images/pfeil_button_blau.svg) no-repeat right 5px, none; /* alle anderen */ cursor:pointer; display:block; } a.button-blau:hover, #content a.button-blau:hover, .button-blau:hover, #content .button-blau:hover { text-decoration:none; background-position:0 -150px; background-color:#00689c; } .button-blau.no-arrow span { background: none; margin: 0 38px; padding: 0; } a.button-blau.zurueck, #content a.button-blau.zurueck, .button-blau.zurueck, #content .button-blau.zurueck { margin:0 20px 20px 0; } .button-blau.zurueck span { padding:0 0px 0 30px; margin:0 30px 0 17px; background: url(images/pfeil_button_blau_zurueck.png) no-repeat 0 5px; /* IE < 9 */ background: url(images/pfeil_button_blau_zurueck.svg) no-repeat 0 5px, none; /* alle anderen */ } a.button-blau.inactive, #content a.button-blau.inactive, .button-blau.inactive, #content .button-blau.inactive { color:#fff; background:#006fa7 url(images/bg_button_blau.png) repeat-x 0 0; cursor:unset; opacity:0.5; -moz-opacity: 0.5; filter: alpha(opacity=50); } .button-blau.inactive span { cursor:default; } /* BUTTON OUTLINE */ a.button-outline, #content a.button-outline, .button-outline, #content .button-outline { display:inline-block; font:500 22px/27px 'Roboto',Arial,sans-serif; color:#fff; text-align:center; margin:0px 0px 0px 0px; padding:10px 0 11px 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; behavior: url(media/PIE.htc); position: relative; cursor:pointer; border:2px solid #59a2c6; text-align: center; color:#006fa7; } .button-outline span { padding:0 30px 0 0; margin:0 15px 0 28px; background: url(images/pfeil_button_outline.png) no-repeat right 5px; /* IE < 9 */ background: url(images/pfeil_button_outline.svg) no-repeat right 5px, none; /* alle anderen */ cursor:pointer; display:block; } .button-outline.mehr span, .button-outline.weniger span { padding:0 32px 0 0; margin:0 13px 0 28px; background: url(images/pfeil_profil_kontakt.png) no-repeat right 8px; } .button-outline.weniger span { background-position: right -143px; } .button-outline.weniger {background:#eff6fa;} a.button-outline:hover, #content a.button-outline:hover, .button-outline:hover, #content .button-outline:hover {background:#eff6fa;} /* BUTTON BLAU SMALL*/ a.button-blau-small, #content a.button-blau-small, .button-blau-small, #content .button-blau-small { display:inline-block; font:500 18px/22px 'Roboto',Arial,sans-serif; color:#fff; text-align:center; margin:10px 0px 20px 0px; padding:6px 20px 7px 20px; background:#006fa7 url(images/bg_button_blau.png) repeat-x 0 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; behavior: url(media/PIE.htc); position: relative; cursor:pointer; } a.button-blau-small:hover, #content a.button-blau-small:hover, .button-blau-small:hover, #content .button-blau-small:hover { text-decoration:none; background-position:0 -150px; background-color:#00689c; } a.button-blau-small.down span, #content a.button-blau-small.down span, .button-blau-small.down span, #content .button-blau-small.down span { padding:0 30px 0 0; background: url(images/pfeil_down_up_weiss.png) no-repeat right 5px; } /* BUTTON OUTLINE SMALL */ a.button-outline-small, #content a.button-outline-small, .button-outline-small, #content .button-outline-small { display:inline-block; font:500 18px/23px 'Roboto',Arial,sans-serif; text-align:center; padding:7px 0 8px 0; margin:10px 0 10px 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; behavior: url(media/PIE.htc); position: relative; cursor:pointer; border:2px solid #59a2c6; text-align: center; color:#006fa7; } .button-outline-small span { padding:0 30px 0 0; margin:0 15px 0 28px; background: url(images/pfeil_button_outline.png) no-repeat right 3px; /* IE < 9 */ background: url(images/pfeil_button_outline.svg) no-repeat right 3px, none; /* alle anderen */ cursor:pointer; display:block; } a.button-outline-small:hover, #content a.button-outline-small:hover, .button-outline-small:hover, #content .button-outline-small:hover {background:#eff6fa;text-decoration:none;} /* Button LINK PFEIL */ .link-pfeil { box-sizing:border-box; display: block; float: left; width: 49.2%; background:url(images/pfeil_link_re_blau.png) no-repeat 13px 10px; /* IE < 9 */ background:url(images/pfeil_link_re_blau.svg) no-repeat 13px 10px, none; /* alle anderen */ display:block; font: 700 18px/25px "Roboto",Arial,sans-serif; margin: 0 0.8% 3px 0; padding: 3px 0px 3px 30px; color:#006fa7; cursor:pointer; } .link-pfeil:hover { background-color:#dfeef5; text-decoration:none; } /* CONTENT ALLG */ #content p {margin-bottom:25px;} #content a {font-weight:700;} #content ul { margin:0 0 25px 0; list-style:none; } #content ul li { padding:0 0 0 33px; margin-bottom:7px; background: url(images/listpoint.png) 9px 8px no-repeat; } .mehr-text, .weniger-text { display: block; padding:1px 0 5px 40px; margin-bottom: 25px; color: #006fa7; cursor: pointer; background: url(images/mehr_weniger.png) no-repeat scroll 1px 0px; } .weniger-text {background-position:1px -90px;} .mehr-text:hover,.weniger-text:hover {text-decoration:underline;} .kategorie { margin:7px 0 10px 0; font:400 15px/18px 'Roboto',Arial,sans-serif; } #content .kategorie a {font:400 15px/18px 'Roboto',Arial,sans-serif;} #content .kategorie a:hover {text-decoration:underline; border:none;} .zusatzinfo { font:18px/28px 'Roboto',Arial,sans-serif; margin:-17px 0 22px 0; color:#666; } .bild-exptipp { float:left; margin:6px 25px 15px 0; position:relative; } img.bild-exptipp { width:300px; height:auto; } .anwalt span.bild-exptipp { /* runde aeuessere Box */ float:left; margin:6px 25px 15px 0px; width:155px; height:155px; border-radius: 155px; -moz-border-radius: 155px; -webkit-border-radius: 155px; -o-border-radius: 155px; -ms-border-radius: 155px; overflow:hidden; } .anwalt span.bild-exptipp img {width:155px;height:auto;margin-top:-13px;} .caption-exptipp { display:block; clear:left; float:left; margin:-2px 25px 10px 0; width:300px; color:#999; font: 300 15px/18px 'Roboto',Arial,sans-serif; } .ft-socialmedia {margin:0 0 20px 0;} .bewertung { padding:25px 30px 20px 30px ; background:#f0f0f0; margin:0; } .bewertung img {width:23px;height:23px;margin:0 2px -5px 0;} img#sterne1,img#sterne2,img#sterne3,img#sterne4,img#sterne5 { margin: 0 2px -5px 0; cursor:pointer; } .social-likes {margin:40px 0 0 0;} div.fb-like.fb_iframe_widget span {vertical-align:top !important;} .social-likes .twitter {margin-left:-15px !important;} .trennlinie { clear:both; height:32px; margin-bottom:4px; background: url(images/bg_schattentrenner.png) 0 7px no-repeat; background-size:100%; } /* ÜBERSICHT EXPERTENTIPPS */ .box-exptipp {clear:both;padding:0;margin-bottom:20px;} #content .box-artikelinfo a {font-weight:400;} .box-artikelinfo em { text-emphasis:none; font-style:normal; } .box-exptipp .box-artikelhead { font: 700 26px/32px 'Roboto Slab',Arial,sans-serif; color:#006fa7; margin:0 0 9px 0; padding-bottom:0; word-wrap: break-word; /*word-break: break-all;*/ } .redaktion .box-artikelbild img { float:left; margin:3px 15px 20px 0; width:125px; height:auto; } .anwalt .box-artikelbild span { /* runde aeuessere Box */ float:right; margin:3px 0 20px 15px; width:100px; height:100px; border-radius: 100px; -moz-border-radius: 100px; -webkit-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; overflow:hidden; } .anwalt .box-artikelbild img {width:100px;height:auto;margin-top:-10px;} .caption-box-exptipp { display:block; clear:left; float:left; margin:-11px 21px 6px 0; width:125px; color:#7a7a7a; font: 400 12px/15px 'Roboto',Arial,sans-serif; } /*.redaktion .box-artikeltext {margin:0 0 0 145px;}*/ /* temp ohne red. Bilder */ .redaktion .box-artikeltext {margin:0 0 0 0px;} .anwalt .box-artikeltext {margin:0 100px 0 0;} #content .box-artikeltext p {margin-bottom: 15px;} .box-artikelbody .sterne img {width:23px;height:23px;margin: 0 2px -5px 0;} .box-artikelbody .sterne { font:13px/17px 'Roboto',Arial,sans-serif; color: #666666; margin: 0 0px 7px 0; } /* WEITERE TEILNEHMER UNTEN */ .box-teilnehmer {clear:both;padding:0;margin:10px 0 0px 0;} .tn-text {margin: 0 0 0 120px;} .tn-name a {font: 700 22px/27px 'Roboto Slab',Arial,sans-serif;margin:0 0 9px 0;} .tn-gelistet {font: 400 15px/18px 'Roboto',Arial,sans-serif;margin-top:10px;} #content .tn-gelistet a {font-weight: 400;} .tn-bild span { /* runde aeuessere Box */ float:left; margin:-6px 15px 20px 0; width:100px; height:100px; border-radius: 100px; -moz-border-radius: 100px; -webkit-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; overflow:hidden; } .tn-bild img {width:100px;height:auto;margin-top:-10px;} /*.teilnehmer {clear:left;}*/ /*******************************************************/ /***************** R I G H T *********************/ /*******************************************************/ #right, #right table #right p {} #right p {margin-bottom:12px;} /* BOX RECHTS */ .box-rechts { /* Breite 395px */ margin:0 0 50px 0; clear: both; } .box-rechts a { background:url(images/pfeil_link_re_blau.png) no-repeat 30px 11px; /* IE < 9 */ background:url(images/pfeil_link_re_blau.svg) no-repeat 30px 11px, none; /* alle anderen */ display:block; font: 400 18px/25px "Roboto",Arial,sans-serif; margin: 0 0 0px 0; padding: 5px 20px 5px 50px; } .box-rechts a:hover { text-decoration:none; background-color:#fff; display:block; } .headline-box-re { display:block; color:#93c1dc; font: 400 30px/33px 'Roboto Condensed',Arial,sans-serif; margin:0 0 15px 0; padding:0; text-transform:uppercase; } .content-box-re { display:block; margin:0; padding:25px 0px 23px 0px; background:#dfeef5; overflow:hidden; transition: max-height 0.3s; -moz-transition: max-height 0.3s; -o-transition: max-height 0.3s; -webkit-transition: max-height 0.3s; -ms-transition: max-height 0.3s; border-radius: 0px 0px 20px 20px; -moz-border-radius: 0px 0px 20px 20px; -webkit-border-radius: 0px 0px 20px 20px; -o-border-radius: 0px 0px 20px 20px; -ms-border-radius: 0px 0px 20px 20px; behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ position: relative; /* CSS3-Effekte im IE8*/ } .klappbox .content-box-re { max-height:348px; padding:25px 0px 0px 0px; border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px; -o-border-radius: 0px; -ms-border-radius: 0px; } .klappbox .show-box-re { max-height:1400px; /* muss größer sein als erwartete Gesamthöhe */ transition: max-height 0.9s; -moz-transition: max-height 0.9s; -o-transition: max-height 0.9s; -webkit-transition: max-height 0.9s; -ms-transition: max-height 0.9s; } /*.content-box-re {height:420px\9;}*/ /*IE8*/ .show-box-re {height:auto\9;} /*IE8*/ .abstand-box-re { height:23px; background:#dfeef5; } .gradient-box-re { position:absolute; height:42px; width:100%; background:url(images/gradient_box_re.png) repeat-x 0 0; margin:-42px 0 0 0; } .plus-box-re, .minus-box-re { height:30px; text-align:center; font: 500 22px/30px "Roboto",Arial,sans-serif; color: #fff; padding: 9px 0 11px 0; background:#a2cbe0; border-radius: 0px 0px 20px 20px; -moz-border-radius: 0px 0px 20px 20px; -webkit-border-radius: 0px 0px 20px 20px; -o-border-radius: 0px 0px 20px 20px; -ms-border-radius: 0px 0px 20px 20px; behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ position: relative; /* CSS3-Effekte im IE8*/ cursor: pointer; transition: 0.15s; -moz-transition: 0.15s; -ms-transition: 0.15s; -o-transition: 0.15s; -webkit-transition: 0.15s; } .plus-box-re span { padding: 0 0 0 43px; background:url(images/pfeil_unten_box_re.png) no-repeat 0px 6px; /* IE < 9 */ background:url(images/pfeil_unten_box_re.svg) no-repeat 0px 6px, none; /* alle anderen */ } .minus-box-re span { padding: 0 0 0 43px; background:url(images/pfeil_oben_box_re.png) no-repeat 0px 6px; /* IE < 9 */ background:url(images/pfeil_oben_box_re.svg) no-repeat 0px 6px, none; /* alle anderen */ } .plus-box-re:hover, .minus-box-re:hover {background:#006fa7;} .box-rechts .button-box-re { text-align:center; font: 500 19px/25px "Roboto",Arial,sans-serif; margin: 20px 25px 0px 25px; padding: 7px 10px 8px 0px; background:#a2cbe0; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ position: relative; /* CSS3-Effekte im IE8*/ transition: 0.15s; -moz-transition: 0.15s; -ms-transition: 0.15s; -o-transition: 0.15s; -webkit-transition: 0.15s; } .box-rechts .button-box-re a { display:inline; color: #fff; font: 500 19px/25px "Roboto",Arial,sans-serif; padding: 7px 0px 8px 20px; background:url(images/pfeil_button_re.png) no-repeat 0px 11px; /* IE < 9 */ background:url(images/pfeil_button_re.svg) no-repeat 0px 11px, none; /* alle anderen */ } .box-rechts .button-box-re:hover {background:#006fa7;} /* BOX RECHTS EXPTIPP KURZPROFIL */ .kurzprofil .headline-box-re {color:#c4c4c4;} .kurzprofil .content-box-re { background:#ececec; padding:25px 30px 25px 30px; height:auto; /*IE8*/ } .box-rechts.kurzprofil a { background:none; font:400 18px/28px 'Roboto',Arial,sans-serif; padding:0; } .box-rechts.kurzprofil a:hover { text-decoration:underline; background-color:none; /*display:inline;*/ } .box-rechts .kp-name a {font:700 28px/33px 'Roboto Slab',Arial,sans-serif;} .kurzprofil b {font:700 18px/28px 'Roboto Slab',Arial,sans-serif;} .kp-text-klein {font:400 16px/24px 'Roboto',Arial,sans-serif;margin:10px 0 0 0;} .kurzprofil .kp-text-klein b {font:700 16px/24px 'Roboto',Arial,sans-serif;} .box-rechts.kurzprofil .plus-inner {padding:0 0 10px 40px;} .box-rechts.kurzprofil .hidden a, .box-rechts.kurzprofil .plus-inner a { background:url(images/pfeil_link_re_blau.png) no-repeat 2px 10px; /* IE < 9 */ background:url(images/pfeil_link_re_blau.svg) no-repeat 2px 10px, none; /* alle anderen */ display:block; font: 400 18px/25px "Roboto",Arial,sans-serif; margin: 0 0 0px 0; padding: 5px 0px 5px 22px; } .plus, .minus { display: block; font:700 18px/22px 'Roboto Slab',Arial,sans-serif; padding:3px 0 5px 40px; margin-bottom:10px; color: #006fa7; cursor: pointer; background: url(images/plusminus.png) no-repeat scroll 1px 0px; } .minus {background-position:1px -90px;margin-bottom:0;} .box-rechts.kurzprofil li { background:url(images/listpoint_klein_re.png) no-repeat 3px 13px; display:block; font: 400 18px/25px "Roboto",Arial,sans-serif; margin: 0 0 0px 0; padding: 5px 0px 5px 22px; } /* KONTAKTFORM EXPTIPP KURZPROFIL */ .box-kontaktform .form-row { width:100%; float:left; margin:0; } .box-kontaktform label {font: 400 18px/22px "Roboto",Arial,sans-serif;} .box-kontaktform input.text { box-sizing:border-box; position: relative; width: 100%; padding:8px 7px 7px 7px; margin:3px 0px 7px 0px; border:2px solid #59a2c6; font: 400 18px/22px "Roboto",Arial,sans-serif; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; background:#fff; } .box-kontaktform input.text:focus, .box-kontaktform input.text:hover {border-color:#fff;} .box-kontaktform .form-row.kp-captcha {width:50%;margin:0;} .box-kontaktform .form-row.kp-captcha img {padding-top:23px;width:100%;height:auto;} .box-kontaktform .form-row.kp-code { width:46%; float:left; margin:0 0 0 4%; } .box-kontaktform .kp-code label {font-size:15px;} .box-kontaktform input#bt_submit { box-sizing:border-box; display:block; width:100%; clear:both; font:500 22px/27px 'Roboto',Arial,sans-serif; border:1px solid #fff; color:#fff; margin:20px 0px 0px 0px; padding:8px 0 9px 0; background:#006fa7 url(images/bg_button_blau.png) repeat-x 0 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; behavior: url(media/PIE.htc); position: relative; cursor:pointer; } .box-kontaktform input#bt_submit:hover { text-decoration:none; background-position:0 -150px; background-color:#00689c; } .box-rechts.kurzprofil .hidden .kp-close a { background:url(images/kp_close.png) no-repeat right 4px; display:block; font: 400 16px/20px "Roboto",Arial,sans-serif; margin: 0 0 0px 0; padding: 1px 20px 1px 0px; float:right; } /* SUCHBOX RECHTS */ .suchbox-rechts { display:block; margin:0 0 50px 0; padding:25px 30px 25px 30px; background:#67b224 url(images/bg_suchbox_rechts.png) repeat-x 0px 0px; border-radius: 0px 0px 20px 20px; -moz-border-radius: 0px 0px 20px 20px; -webkit-border-radius: 0px 0px 20px 20px; -o-border-radius: 0px 0px 20px 20px; -ms-border-radius: 0px 0px 20px 20px; behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ position: absolute; /* CSS3-Effekte im IE8*/ box-sizing: border-box; right: -465px; top: 7px; width: 395px; z-index: 1; } .suchbox-rechts .headline { display:block; color:#fff; font: 400 30px/33px 'Roboto Condensed',Arial,sans-serif; margin:0 0 31px 0; padding:0; text-transform:uppercase; } .form-suchbox-re label { font:400 13px/17px 'Roboto',Arial,sans-serif; } /* Suchfeld */ .form-suchbox-re input.text { width:100%; box-sizing:border-box; padding:17px 10px 16px 20px; margin:3px 0px 4px 0px; border:1px solid #69af22; font:400 18px/22px 'Roboto',Arial,sans-serif; color:#333; background:#fff; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; box-shadow: inset 0px 0px 5px #ccc; -moz-box-shadow: inset 0px 0px 5px #ccc; -webkit-box-shadow: inset 0px 0px 5px #ccc; behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ position: relative; /* CSS3-Effekte im IE8*/ } .form-suchbox-re input.text:hover {border-color:#fff;} .form-suchbox-re input.text:focus {border-color:#fff;} /* Submit-Button*/ .form-suchbox-re input#bt-submit { display:block; clear:left; width:100%; box-sizing:border-box; border:1px solid #fff; box-shadow: 0px 0px 0px 1px transparent; color:#fff; height:58px; margin:20px 0px 10px 0px; padding:10px 10px 14px 10px; font:700 28px/33px 'Roboto',Arial,sans-serif; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; position: relative; cursor:pointer; -moz-appearance:normal; background:#006fa7 url(images/bg_button_blau.png) center 0 repeat-x; behavior: url(media/PIE.htc); } .form-suchbox-re input#bt-submit:hover, .form-suchbox-re.was-wo input#bt-submit:hover {background-position:center -150px;background-color:#00689c;} .form-suchbox-re .was-wo { display:block; font:600 17px/26px 'Roboto',Arial,sans-serif; color:#006fa7; margin:8px 0 3px 0; padding-left:3px; } .form-suchbox-re .was-wo b { font:700 22px/22px 'Roboto',Arial,sans-serif; color:#006fa7; } /* SUCHBOX RECHTS EXPTIPPS*/ .suchbox-rechts.exptipp { background:#d8d8d8 url(images/bg_suchbox_rechts_exptipp.png) repeat-x 0px 0px; } .suchbox-rechts.exptipp .headline { color:#006fa7; } .exptipp .form-suchbox-re input.text { border:1px solid #b1b1b1; } .exptipp .form-suchbox-re input.text:hover {border-color:#fff;} .exptipp .form-suchbox-re input.text:focus {border-color:#fff;} .info-text-re {padding:0 30px;} /* SUCHBOX RECHTS WAS-WO*/ .suchbox-rechts .was-wo .headline { font: 400 30px/33px 'Roboto Slab',Arial,sans-serif; margin:0 0 7px 0; padding:0; text-transform:none; } .form-suchbox-re.was-wo input.text {margin:3px 0px 24px 0px;} .form-suchbox-re.was-wo input#bt-submit { background:#006fa7 url(images/bg_button_suche_re.png) center 0 no-repeat; padding: 10px 10px 14px 50px; } /* - - - - - - - - - - ### PROFIL ### - - - - - - - - - - - */ /* PROFIL RECHTE SPALTE */ .profil #right {padding-bottom:50px;} .profil .box-rechts {margin: 0 0 20px;} .profil .kurzprofil .content-box-re {background:none;padding:0px 30px 25px 30px;overflow:auto;overflow:visible;} .flag { padding:5px 20px 10px 40px; display:inline-block; } .en {background: url(images/flag_en.png) no-repeat 0px 0px;} .fr {background: url(images/flag_fr.png) no-repeat 0px 0px;} .ar {background: url(images/flag_ar.png) no-repeat 0px 0px;} .de {background: url(images/flag_de.png) no-repeat 0px 0px;} .in {background: url(images/flag_in.png) no-repeat 0px 0px;} .id {background: url(images/flag_id.png) no-repeat 0px 0px;} .it {background: url(images/flag_it.png) no-repeat 0px 0px;} .kanton {background: url(images/flag_kanton.png) no-repeat 0px 0px;} .hr {background: url(images/flag_hr.png) no-repeat 0px 0px;} .kurd {background: url(images/flag_kurd.png) no-repeat 0px 0px;} .lv {background: url(images/flag_lv.png) no-repeat 0px 0px;} .mandarin {background: url(images/flag_mandarin.png) no-repeat 0px 0px;} .nl {background: url(images/flag_nl.png) no-repeat 0px 0px;} .pers {background: url(images/flag_pers.png) no-repeat 0px 0px;} .pl {background: url(images/flag_pl.png) no-repeat 0px 0px;} .pt {background: url(images/flag_pt.png) no-repeat 0px 0px;} .ru {background: url(images/flag_ru.png) no-repeat 0px 0px;} .sv {background: url(images/flag_sv.png) no-repeat 0px 0px;} .sr {background: url(images/flag_sr.png) no-repeat 0px 0px;} .es {background: url(images/flag_es.png) no-repeat 0px 0px;} .cs {background: url(images/flag_cs.png) no-repeat 0px 0px;} .tr {background: url(images/flag_tr.png) no-repeat 0px 0px;} .ro {background: url(images/flag_ro.png) no-repeat 0px 0px;} .lat {background: url(images/flag_lat.png) no-repeat 0px 0px;} .box-rechts.kurzprofil a.social { height:48px; width:48px; padding:0; margin:0 6% 15px 0; float:left; opacity:0.7; -moz-opacity: 0.7; filter: alpha(opacity=70); } .box-rechts.kurzprofil a.social.last {margin:0;} .box-rechts.kurzprofil a.social:hover { opacity:1; -moz-opacity: 1; filter: alpha(opacity=100); } a.facebook {background: url(images/ic_facebook.png) no-repeat 0px 0px !important;} a.twitter {background: url(images/ic_twitter.png) no-repeat 0px 0px !important;} a.gplus {background: url(images/ic_gplus.png) no-repeat 0px 0px !important;} a.xing {background: url(images/ic_xing.png) no-repeat 0px 0px !important;} a.linkedin {background: url(images/ic_linkedin.png) no-repeat 0px 0px !important;} .plus.anbieterkennzeichnung {background: url(images/anbieterkennzeichnung.png) no-repeat scroll 1px 0px;} img.fortbildungszertifikat { float:left; clear:left; padding:8px 20px 10px 0; } .profil .box-rechts.kurzprofil { padding: 25px 0 0px 0; margin: 0px 0 0px 0; } .profil .box-rechts.kurzprofil.kontakt {margin: 0px 0 15px 0;} .profil .box-rechts.kurzprofil.kontakt.open { background:#c0dcea; width: 100%; padding: 25px 30px 10px 0; } .profil .box-rechts.kurzprofil .content-box-re {background:none;padding:0px 30px 5px 30px;overflow:auto;overflow:visible;} .kontaktformular_oeffner, .kontaktformular_schliesser { display:inline-block; width:100%; box-sizing:border-box; margin:0px 0px px 0px; padding:13px 15px 12px 0; border:2px solid #59a2c6; font:500 18px/23px 'Roboto',Arial,sans-serif; text-transform:uppercase; text-align: center; color:#006fa7; background:#fff; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; behavior: url(media/PIE.htc); position: relative; cursor:pointer; } .kontaktformular_oeffner span, .kontaktformular_schliesser span { padding:0 30px 0 0; margin:0 0px 0 15px; background: url(images/pfeil_profil_kontakt.png) no-repeat right 5px; cursor:pointer; } .kontaktformular_schliesser span {background-position:right -145px;} .kontaktformular_oeffner:hover, .kontaktformular_schliesser:hover {border:2px solid #006fa7;} .gmap_typ1 .gmap {height:450px} .funktionen { position:absolute; width: 415px; height:158px; padding:30px 0px 10px 10px; margin: 5px 0 0 835px; background: #006fa7 url(images/bg_funktionen.png) repeat-x 0 0; z-index: 1; } .funktionen a.fktn { width:20%; color:#fff; float:left; margin: 0px 0 0px 9.1%; padding:98px 0px 0px 0px; font: 400 16px/18px 'Roboto',Arial,sans-serif; text-align:center; opacity:1; -moz-opacity:1; filter: alpha(opacity=100); } .funktionen a.drucken {background:url(images/ic_drucken.png) no-repeat center 4px;} .funktionen a.visitenkarte {background:url(images/ic_visitenkarte.png) no-repeat center 4px;} .funktionen a.qrcode {background:url(images/ic_qrcode.png) no-repeat center 4px;} .funktionen a.merken {background:url(images/ic_merken.png) no-repeat center 4px;} .funktionen a:hover { opacity:0.92; -moz-opacity:0.92; filter: alpha(opacity=92); text-decoration:none; } /*.funktionen iframe#qrcode { width:160px; height:228px; margin:6px 0px 0px 44px; border:none; } */ .routenplaner { box-sizing:border-box; position:absolute; width: 515px; height:88px; padding:17px 0px 0px 33px; margin: 5px 0 0 0px; /* Fallback for web browsers that doesn't support RGBa */ background:#fff; /* RGBa with 0.6 opacity */ background: rgba(255, 255, 255, 0.80); z-index: 1; } .rp-headline { font:700 18px/22px 'Roboto Slab',Arial,sans-serif; margin:14px 30px 15px 0; float:left; } .routenplaner input.text { box-sizing:border-box; float:left; width:298px; padding:13px 60px 13px 15px; margin:0px 0px 4px 0px; border:3px solid #62b111; font: 400 18px/22px "Roboto",Arial,sans-serif; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; background:#fff; color:#aabbca; } .routenplaner input.bt-submit { float:left; display:block; width: 33px; height:33px; border:none; text-align:left; padding:3px 0px 2px 14px; margin:10px 0 0 -50px; background:0px center url(images/ic_routenplaner.png) no-repeat; cursor:pointer; z-index:2; } .routenplaner:hover {background: rgba(255, 255, 255, 1.00);} .galerie {margin:20px 0 20px 0 ;overflow:hidden;} .gl-bild img{float:left;width:190px;max-width: 30%;height:auto;margin: 0 3.3% 3.3% 0;} /* - - - - - - - - - - ### TEASER RG ORTE ### - - - - - - - - - - - */ /* AUSGEWÄHLTE PROFILE RECHTS */ .box-rechts-profile {clear: both;margin: 0 0 50px;} .box-rechts-profile .content-box-re { margin:0; padding:25px 30px 23px 30px; } .box-rechts-profile .tn-text {margin: 0 0 0 100px;font:17px/25px 'Roboto',Arial,sans-serif;} .box-rechts-profile .tn-name a {font: 700 20px/23px 'Roboto Slab',Arial,sans-serif;margin:0 0 10px 0;} .box-rechts-profile .tn-gelistet {font: 400 14px/18px 'Roboto',Arial,sans-serif;margin-top:5px;} .box-rechts-profile .tn-bild span { /* runde aeuessere Box */ float:left; margin:0px 15px 20px 0; width:80px; height:80px; border-radius: 80px; -moz-border-radius: 80px; -webkit-border-radius: 80px; -o-border-radius: 80px; -ms-border-radius: 80px; overflow:hidden; } .box-rechts-profile .tn-bild img {width:80px;height:auto;margin-top:-8px;} .box-rechts-profile .trennlinie { height:2px; margin:20px 0 20px 0; background: #fff; } .headline-26px.ort {padding:9px 0 14px 65px;background:url(images/ic_ort_ort.png) 0 0 no-repeat;} .headline-26px.rechtsgebiet {padding:9px 0 14px 65px;background:url(images/ic_ort_rg.png) 0 0 no-repeat;} .headline-26px.info {padding:9px 0 14px 65px;background:url(images/ic_ort_info.png) 0 0 no-repeat;} #content a.umkreis {display:block;float:left;box-sizing:border-box;width:48%;padding:24px 0px 30px 93px;margin:0 0 20px -10px;font-weight:400;} #content a.km20 {margin-right:4%;background:url(images/ic_umkreis_20km.png) 0 0 no-repeat;} #content a.km50 {background:url(images/ic_umkreis_50km.png) 0 0 no-repeat;} /* - - - - - - - - - - ### VERTEILERSEITE RG ORTE ### - - - - - - - - - - - */ /**** Verteilerseiten ANFANG *****/ /*** ABC Verteiler ANFANG *****/ .abc_verteiler a { font-size: 17px; font-weight: bold; margin: 4px 8px 4px 0px; padding: 4px 6px 4px 6px; width: 14px; display: block; float: left; text-align: center; border:2px solid #9bc7dd; font:500 18px/23px 'Roboto',Arial,sans-serif; text-transform:uppercase; text-align: center; color:#006fa7; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; /*behavior: url(media/PIE.htc);*/ transition: 0.15s; -moz-transition: 0.15s; -ms-transition: 0.15s; -o-transition: 0.15s; -webkit-transition: 0.15s; } .abc_verteiler a:hover { text-decoration:none; background:#006fa7; border-color:#006fa7; color:#fff; } .verteiler_liste .abc_liste .anfangsbuchstabe { font:700 22px/28px 'Roboto Slab',Arial,sans-serif; color:#898989; margin: -60px 0 5px 0 !important; padding-top: 80px; } .abc_liste .anfangsbuchstabe { display: block; font:700 22px/28px 'Roboto Slab',Arial,sans-serif; color:#898989; margin: -40px 0 15px 0 !important; padding-top: 80px; } .verteilerseite .verteiler_top_rechtsgebiete{ text-align: center; } #content a.orts_link, #content a.rechtsgebiets_link { box-sizing:border-box; display: block; float: left; /*width: 19.2%;*/ width: 24.2%; background:url(images/pfeil_link_re_blau.png) no-repeat 13px 10px; /* IE < 9 */ background:url(images/pfeil_link_re_blau.svg) no-repeat 13px 10px, none; /* alle anderen */ display:block; font: 400 18px/25px "Roboto",Arial,sans-serif; margin: 0 0.8% 3px 0; padding: 3px 0px 3px 30px; } #content a.rechtsgebiets_link { width: 24.2%; } #content a.orts_link:hover, #content a.rechtsgebiets_link:hover { background-color:#dfeef5; text-decoration:none; } #content a.rechtsgebiets_link.normalort { width: 49.2%; font-weight:700; } #content a.rechtsgebiets_link.top { width: 32.3%; height:60px; background:none; margin: 0px 0.8% 20px 0; /*padding: 18px 0 18px 80px;*/ padding: 18px 0 0 0; background-repeat:no-repeat; background-position:0 0; } #content a.rechtsgebiets_link.top:hover {text-decoration:underline;} #content a.rechtsgebiets_link.top img { margin: -18px 10px 0 0; /*vertical-align: middle;*/ width: 60px; float:left; } #content a.azc { box-sizing:border-box; display: block; float: left; width: 49.2%; background:url(images/pfeil_link_re_blau.png) no-repeat 13px 10px; /* IE < 9 */ background:url(images/pfeil_link_re_blau.svg) no-repeat 13px 10px, none; /* alle anderen */ display:block; font: 400 16px/24px "Roboto",Arial,sans-serif; margin: 0 0.8% 2px 0; padding: 3px 0px 3px 30px; } #content a.azc:hover { background-color:#dfeef5; text-decoration:none; } .verteiler .ueberschrift { cursor: pointer; font-weight: bold; font-size: 14px; color: black; margin-bottom: 10px; vertical-align: top; } .verteiler .ueberschrift img { display: block; float: left; } .verteiler.verteiler_liste { display: none; } /* - - - - - - - - - - ### TEASER BALLUNGSRAUM ### - - - - - - - - - - - */ .tea_box_teilnehmer { margin-bottom: 20px; } .tea_box_teilnehmer a { background: none !important; } .tea_box_teilnehmer .tea_img_teilnehmer { float: left; max-width: 20%; } .tea_box_teilnehmer .tea_img_teilnehmer img{ vertical-align: top; width: 100px; } .tea_box_teilnehmer .tea_img_teilnehmer span { border-radius: 100px; float: right; height: 100px; margin: 3px 0 20px 15px; overflow: hidden; width: 100px; } .tea_box_teilnehmer .tea_box_teilnehmer_info{ width: 80%; float: right; } .tea_box_teilnehmer .tea_box_teilnehmer_info .tea_box_teilnehmer_ueberschrift { font-size: 16px; font-weight: bold; } .tea_box_teilnehmer .tea_box_teilnehmer_info .tea_box_teilnehmer_schwerpunkt { font-size: 12px; } /* - - - - - - - - - - ### SEITE ### - - - - - - - - - - - */ /* START PROFILE */ #exp-start {background:#fff;} #profile-start { background:#e7e7e7 url(images/bg_profile_start.png) repeat-x 0 0; margin: 0 0 0px 0; } .wrapper-profile {width: 1200px;} .profile-outer { width:970px; /*IE8*/ margin-left:130px; /*IE8*/ overflow:hidden; } .bt-profile-zurueck, .bt-profile-weiter { margin:45px 0 0 10px; /*IE8*/ position:absolute; width:55px; height:101px; cursor:pointer; background:url(images/bt_profile_zurueck.png) no-repeat 0 0; } .bt-profile-weiter { margin-left:1150px; /*IE8*/ text-align:right; background:url(images/bt_profile_weiter.png) no-repeat 0 0; } .bt-profile-zurueck:hover, .bt-profile-weiter:hover {background-position:0 -150px;} .teilnehmer-mini { text-align: center; float: left; width: 220px; font: 400 16px/25px Roboto,Arial,sans-serif; padding:0 10px 0 10px; } .tn-bild-mini span { float: left; margin: 3px 17px 20px 17px; border: 15px solid #fff; } .tn-bild-mini span, .tn-bild-mini span a { /* a wichtig fuer Safari */ display:block; border-radius: 120px; -moz-border-radius: 120px; -webkit-border-radius: 120px; -o-border-radius: 120px; -ms-border-radius: 120px; width: 155px; height: 155px; overflow: hidden; } .tn-bild-mini span:hover {border-color:#ccc;} .tn-bild-mini img { height: auto; margin-top: -15px; width: 155px; } .ra-titel {font: 400 16px/20px 'Roboto',Arial,sans-serif;} .teilnehmer-mini a {font: 700 20px/25px 'Roboto Slab',Arial,sans-serif;} /* TOOLS */ #tools {background:#006fa7;} .toolbox-outer {margin-right: -2%;} .toolbox { width:23%; float:left; margin:0 2% 0 0; font: 400 16px/20px 'Roboto',Arial,sans-serif; color:#fff; box-sizing:border-box; padding:0 0 0 115px; display:block; } .hd-tools { color:#fff; font:400 22px/28px 'Roboto',Arial,sans-serif; margin: 0 0 15px 0; display:block; } .hd-tools:hover { text-decoration:underline;} .toolbox:hover { opacity:0.89; -moz-opacity:0.89; filter: alpha(opacity=89); } .toolbox.kr-anwalt {background: url(images/ic_kr_anwalt.png) 0 0px no-repeat;} .toolbox.kr-prozess {background: url(images/ic_kr_prozess.png) 0 0px no-repeat;} .toolbox.kr-gericht {background: url(images/ic_kr_gericht.png) 0 0px no-repeat;} .toolbox.impressum-gen {background: url(images/ic_impressum_gen.png) 0 0px no-repeat;} /* TOP THEMEN*/ #top-themen {background:#ededee;} .top-outer {margin-right: -2%;} .top-div { float:left; width: 23%; margin:0 2% 0 0; font: 400 16px/24px 'Roboto',Arial,sans-serif; box-sizing:border-box; padding:0; } .headline-top { font:400 26px/32px 'Roboto Condensed',Arial,sans-serif; text-transform: uppercase; color:#bcbcbd; padding-top: 40px; margin: 0 0 15px 0; } .top-div .button-outline-small a:hover {text-decoration:none;} .start a.button-outline-small, .start #content a.button-outline-small, .start .button-outline-small, .start #content .button-outline-small {margin:0;font:400 18px/23px 'Roboto',Arial,sans-serif;} .start a.button-outline-small:hover, .start #content a.button-outline-small:hover, .start .button-outline-small:hover, .start #content .button-outline-small:hover {background:#fff;text-decoration:none;} /* TEILNAHME START FÜR ANWÄLTE*/ .half-column {float:left;width:49%;margin-bottom:10px;} .half-column.right {margin:0 0 -80px 2%;} .headline-36px.tn-start {color:#006fa7;margin-top: -20px;} #fuer-anwaelte ul li { font:400 22px/28px 'Roboto',Arial,sans-serif; padding:9px 0 11px 70px; margin-bottom:5px; background: url(images/lipo_tn_start.png) 0px 0px no-repeat; } #fuer-anwaelte img {width:100%;height:auto;} a.button-blau.gruen { font:500 22px/27px 'Roboto',Arial,sans-serif; margin:0px 0px 20px 0px; padding:12px 0 13px 0; background:#58aa0c url(images/bg_button_gruen.png) repeat-x 0 0; } a.button-blau.gruen:hover { background-position:0 -150px;} /* - - - - - - - - - - ### TEILNAHME SEITE ### - - - - - - - - - - - */ .tn-indent {margin: 0 0 0 120px;padding-bottom:10px;} .tn-pikt img {float:left; margin: 0 15px 0 0px;} #content h2.tn-h2 {clear:none;color:#006fa7;} .kurztext {font:400 21px/28px 'Roboto',Arial,sans-serif;margin:0 0 20px 0;} .langtext {padding-top:5px;} table.grau { background:#f0f0f0; text-align:left; margin: 40px 0 0 0; padding: 20px 25px 20px 25px; width:100%; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; -o-border-radius: 20px; } table.grau td {padding-bottom:7px;vertical-align:top;} table.grau a { background: url(images/tn-lupe.png) no-repeat 0px 0px; padding: 1px 0 0px 35px; /*margin-bottom:5px;*/ display:block; } .tn-screen img {width:98%;margin-right:2%;} .text-normal .content-box-re { padding:25px 30px 25px 30px; } .box-rechts.text-normal ul.auf-einen-blick {margin-top:10px;} .box-rechts.text-normal ul.auf-einen-blick li { padding:0px 0 5px 45px; margin-bottom:7px; background: url(images/lipo_tn_rechts.png) 4px 0px no-repeat; } .box-rechts.text-normal b {font: 700 18px/28px "Roboto Slab",Arial,sans-serif;} .box-rechts.text-normal a { background:url(images/pfeil_link_re_blau.png) no-repeat 0px 6px; /* IE < 9 */ background:url(images/pfeil_link_re_blau.svg) no-repeat 0px 6px, none; /* alle anderen */ display:block; padding: 0px 0px 0px 20px; } .box-rechts.text-normal a:hover { text-decoration:underline; background-color:none; } .box-rechts.text-normal a.mail { background:url(images/ic_mail.png) no-repeat 0px 6px; /* IE < 9 */ padding: 0px 0px 0px 34px; } .reiter { width:51%; float:left; margin:0; border-radius: 20px 20px 0px 0px; -moz-border-radius: 20px 20px 0px 0px; -webkit-border-radius: 20px 20px 0px 0px; -o-border-radius: 20px 20px 0px 0px; -ms-border-radius: 20px 20px 0px 0px; behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ position: relative; /* CSS3-Effekte im IE8*/ font: 700 18px/24px "Roboto",Arial,sans-serif; color:#006fa7; padding:9px 0px 0px 22%; box-sizing:border-box; background:#f5fafc no-repeat 19% 11px; /* hell inaktiv */ cursor:pointer; height:64px; z-index:1; } .reiter.eins {background-image:url(images/ic_rueckruf.png);} .reiter.zwei {margin-left:-2%;background-image:url(images/ic_angebot.png);} .reiter.eins.act, .reiter.zwei.act { background-color:#dfeef5; z-index:2; cursor:default; } .ct-rueck {display:none;} .ct-ang {display:block;} /* - - - - - - - - - - ### PARTNERSEITE ### - - - - - - - - - - - */ .headline-26px.partner {color: #898989;} #content a.button-blau-small.partner span {padding:0 37px 0 0;background-position:right 0px;background-repeat:no-repeat;} #content a.button-blau-small.info span {background-image:url(images/ic_prt_info.png);} #content a.button-blau-small.position span {background-image:url(images/ic_prt_position.png);} #content a.button-blau-small.profil span {background-image:url(images/ic_prt_profil.png);} /**********************************************************/ /**************** FORMULARE NORMALE SEITE *****************/ /**********************************************************/ /*.box-kontaktform .form-row { width:100%; float:left; margin:0; }*/ .form-kontakt label { font: 700 18px/22px "Roboto slab",Arial,sans-serif; } .form-kontakt .text, .form-kontakt .textarea { box-sizing:border-box; position: relative; width: 100%; padding:12px 7px 11px 7px; margin:3px 0px 10px 0px; border:2px solid #93c1dc; font: 400 18px/22px "Roboto",Arial,sans-serif; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; background:#fff; color:#333; } .form-kontakt input.text:focus, .form-kontakt input.text:hover {border-color:#2e9ad0;} .form-kontakt .textarea { height: 300px; } .form-kontakt input#bt-submit { box-sizing:border-box; display:block; width:100%; clear:both; font:500 22px/27px 'Roboto',Arial,sans-serif; color:#fff; margin:20px 0px 0px 0px; padding:8px 0 9px 0; background:#006fa7 url(images/bg_button_blau.png) repeat-x 0 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; behavior: url(media/PIE.htc); position: relative; cursor:pointer; } .form-kontakt input#bt-submit:hover { text-decoration:none; background-position:0 -150px; background-color:#00689c; } /* Modales Fenster*/ #overlay { background-color: #959ea4; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 90; opacity: 0.6; -moz-opacity: 0.6; filter: alpha(opacity=60); display:none; } #modal-window { background-color: #fff; position: absolute; left: 50%; top:50%; width:50%; max-width:600px; margin: -300px 0 0 -25%; z-index: 100; padding:27px 30px 13px 30px; -moz-box-shadow:0 0 5px 0 rgba(50, 50, 50, 0.45); -webkit-box-shadow:0 0 5px 0 rgba(50, 50, 50, 0.45); box-shadow:0 0 5px 0 rgba(50, 50, 50, 0.45); text-align:left; border-radius: 20px 20px 20px 20px; -moz-border-radius: 20px 20px 20px 20px; -webkit-border-radius: 20px 20px 20px 20px; -o-border-radius: 20px 20px 20px 20px; -ms-border-radius: 20px 20px 20px 20px; behavior: url(media/PIE.htc); /* CSS3-Effekte im IE8*/ display:none; } #modal-inner { max-height:400px; margin-bottom:13px; overflow: auto; } #modal-inner, #modal-inner p {font: 400 16px/24px 'Roboto',Arial,sans-serif;} #modal-inner img { margin: 0 0 0 -150px; padding-left: 50%;} #modal-window .headline { font: 700 18px/24px 'Roboto',Arial,sans-serif; color: #006fa7; margin:0px 0 15px 0; } #modal-window .bt-schliessen { clear: both; color: #006fa7; cursor: pointer; display: block; margin: 0; background:url(images/kp_close.png) no-repeat right 4px; font: 400 16px/20px "Roboto",Arial,sans-serif; margin: 0 0 0px 0; padding: 1px 20px 1px 0px; float:right; } /* SUCHE VORSCHLAGSTOOL */ .vorschlag { position: absolute; background-color: white; display: none; z-index: 5; border: 1px solid #ccc; overflow: hidden; margin:-24px 0px 0px 0px; height:auto; max-height: 320px; padding: 15px 0px 15px 0px; opacity: 0.97; -moz-opacity: 0.97; filter: alpha(opacity=97); border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -moz-box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.15); -webkit-box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.15); box-shadow: 0 0 5px 0 rgba(50, 50, 50, 0.15); overflow-x: hidden; overflow-y: auto; } .start .vorschlag {margin-top:-16px;} .opt { position: relative; margin: 0; padding: 4px 10px 4px 20px; cursor: pointer; min-height: 0; list-style-image:none; font: 700 15px/22px 'Roboto',Arial,sans-serif; text-align:left; color:#808080; } .opt.sub { padding-left: 40px; font-weight: 400; } .opt.sel { border:none; background:#e8e8e8; color: #333; font-weight: 700; } .opt.sub.sel {font-weight: 400;} .hinweis {margin-bottom: 4px;} .err {background-color: darkred;color: white;} /****************************************************************/ /********************** SILBENTRENNUNG **********************/ /****************************************************************/ .exptipp-nav, .box-rechts.kurzprofil .plus-inner, .box-rechts-profile, #content a.orts_link, #content a.rechtsgebiets_link, #content a.azc, .toolbox { -moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } p span.flag { -moz-hyphens:none; -o-hyphens: none; -webkit-hyphens: none; -ms-hyphens: none; hyphens:none; } @media only screen and (max-width:1150px) { .box-rechts-profile { -moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } } @media only screen and (max-width:767px) { #exp-start .box-exptipp .box-artikelhead { -moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } } @media only screen and (max-width:479px) { /* Silbentrennung AN*/ #content, #content p { -moz-hyphens: auto; -o-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } /* KEINE SILBENTRENNUNG */ .link-teilnahme a span, .button-blau, .headline-26px.partner, #content a.button-blau-small { -moz-hyphens:none; -o-hyphens: none; -webkit-hyphens: none; -ms-hyphens: none; hyphens:none; } } /****************************************************************/ /************************ TRANSITIONS ***********************/ /****************************************************************/ /*** TRANSITION 0.1s all ***/ #logo img, .link-teilnahme a, .footer-box a:hover, #navigation, #navigation ul.nav-menu li ul, #navigation ul.nav-menu li ul li:hover, #navigation ul.nav-menu li ul li a:hover, #navigation ul.nav-menu li.act ul li a:hover, .box-rechts a:hover, #content a.orts_link:hover, #content a.rechtsgebiets_link:hover, .toolbox { transition: 0.1s; -moz-transition: 0.1s; -ms-transition: 0.1s; -o-transition: 0.1s; -webkit-transition: 0.1s; } /*** TRANSITION 0.4s Background ***/ .footer-box a, .box-rechts a, .routenplaner { transition: background-color 0.4s; -moz-transition: background-color 0.4s; -ms-transition: background-color 0.4s; -o-transition: background-color 0.4s; -webkit-transition: background-color 0.4s; } /*** TRANSITION 0.4s all ***/ #navigation a { transition: 0.4s; -moz-transition: 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s; } /*** TRANSITION 0.2s all ***/ #navigation a:hover, #navigation ul.nav-menu li ul li, #navigation ul.nav-menu li ul li a, #navigation ul.nav-menu li.act ul li a, .box-kontaktform input.text, #content a.orts_link, #content a.rechtsgebiets_link, .form-suchbox-start input.text { transition: 0.2s; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; } /*** TRANSITION 0.2s opacity ***/ .box-rechts.kurzprofil a.social, .funktionen a { transition: opacity 0.2s; -moz-transition: opacity 0.2s; -ms-transition: opacity 0.2s; -o-transition: opacity 0.2s; -webkit-transition: opacity 0.2s; } /*** TRANSITION 0.2s border-color ***/ .tn-bild-mini span, .form-suchbox-re input.text, .form-kontakt .text, .form-kontakt .textarea { transition: border-color 0.2s; -moz-transition: border-color 0.2s; -ms-transition: border-color 0.2s; -o-transition: border-color 0.2s; -webkit-transition: border-color 0.2s; } /************************************************************************************************************************************************************************************************/ /****************************************************************/ /******************** RESPONSIVE STYLES *********************/ /****************************************************************/ @media only screen and (min-width: 769px) { /* nur fuer Groessen ueber 768 PX! */ /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .exp-zeile {clear:both;} .exp-zeile .box-exptipp { clear:none; width:48.1%; box-sizing:border-box; } .exp-zeile .box-exptipp.redaktion {float:left;} .exp-zeile .box-exptipp.anwalt {float:right;} .exp-zeile .box-exptipp.thema-links {float:left;} .exp-zeile .box-exptipp.thema-rechts {float:right;} #exp-start .trennlinie { margin-bottom:14px; background: url(images/bg_schattentrenner_start.png) 0 7px no-repeat; background-size:100% 35%; } #exp-start .redaktion .box-artikelbild img, #exp-start .anwalt .box-artikelbild img {margin-bottom:10px;} #exp-start .anwalt .box-artikelbild span {float: left;margin: 3px 20px 15px 0;} #exp-start .redaktion .box-artikeltext, #exp-start .anwalt .box-artikeltext {margin:0;} } /* moderne Browser */ @media only screen and (min-width:320px) { /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .profile-outer {width: 1200px;margin-left:0} .bt-profile-zurueck {margin-left:-85px;} .bt-profile-weiter {margin-left:1230px;} } @media only screen and (min-width:2000px) { #content .link-teilnahme a, #content .link-teilnahme.unten a, .link-teilnahme a, .link-teilnahme.unten a { right:auto; bottom:0px; margin-left:1340px; border-radius: 20px 20px 0 0; -moz-border-radius: 20px 20px 0 0; -webkit-border-radius: 20px 20px 0 0; -o-border-radius: 20px 20px 0 0; -ms-border-radius: 20px 20px 0 0; } } /* ENDE 2000px */ @media only screen and (max-width:1650px) { #content .link-teilnahme.unten a, .link-teilnahme.unten a {bottom:390px;} } /* ENDE 1650px */ @media only screen and (max-width:1400px) { /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .wrapper-profile { width: 100%; padding:0 50px 0px 50px; box-sizing:border-box; margin:0; } .profile-outer {width: 100%;} .bt-profile-weiter {margin-left:1130px;} .start #profile-start .headline-cond-36px {left:20px;} } /* ENDE 1400 PX */ @media only screen and (max-width:1310px) { /* - - - - - - - - - - ### PROFIL ### - - - - - - - - - - - */ .profil .box-rechts.kurzprofil.kontakt.open { margin: 0 0 0px 0; background:#c0dcea; width: 100%; padding: 25px 0px 10px 0; } .funktionen-outer { position:absolute; width: 33.8%; height:198px; overflow:hidden; right:30px; } .funktionen { width:100%; right:auto; padding: 30px 20px 10px 10px; margin: 5px 0 0 20px; } .funktionen a.fktn {margin: 0px 0 0px 7.7%;} .suchbox-rechts { margin-right: 60px; right: -69.5%; top: 7px; width: 52.5%; } .suchbox-rechts .headline { font: 400 21px/26px "Roboto Condensed",Arial,sans-serif; margin: 0 0 20px; } /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .bt-profile-weiter {margin-left:0;right:25px;} } /* ENDE 1310px */ @media only screen and (max-width:1280px) { /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ suchbox-start { width: 450px; margin:0px 0 50px 30px; padding:136px 50px 30px 50px; } .suchbox-start .headline { font: 400 30px/45px 'Roboto Slab',Arial,sans-serif; margin:0 0 7px 0; color:#fff; } .form-suchbox-start input#bt-submit { height:58px; margin:32px 0px 10px 0px; padding:10px 10px 14px 68px; background-position:center -8px; } .form-suchbox-start input#bt-submit:hover {background-position:center -158px;} .bt-profile-zurueck,.bt-profile-weiter {margin-top:30px;} .teilnehmer-mini {width: 190px;} .tn-bild-mini span {margin: 3px 18px 20px 18px;border: 13px solid #fff;} .tn-bild-mini span, .tn-bild-mini span a {width: 130px;height: 130px;} .tn-bild-mini img {margin-top: -13px;width: 130px;} } @media only screen and (max-width:1279px) { .breadcrumb {padding:20px 20px 30px 0; font:13px/28px 'Roboto',Arial,sans-serif;} .breadcrumb div, .breadcrumb ol {padding:0 0 2px 5px;} #logo {margin:10px 0 0 31px;} #logo img {width:320px; height:62px;} /****************** N A V I G A T I O N ******************/ #navigation {margin:27px 0 0 0;} #navigation ul li {margin: 0 0 0 18px;} #navigation a {font:300 18px/20px Roboto,Arial,sans-serif;} #navigation ul.nav-menu li ul {margin-top:36px;} .nav-wrapper-outer {margin: 17px 0 0;} /********************* F O O T E R *********************/ .footer-box.box-1 {width:200px; margin:0 20px 0 0;} .footer-box.box-2 {width:230px; margin:0 20px 0 0;} .footer-box.box-3 {width:140px; margin:0 50px 0 0;} /***************** C O N T E N T *********************/ .box-exptipp .box-artikelhead { font: 700 23px/28px 'Roboto Slab',Arial,sans-serif; margin:0 0 9px 0; } .bild-exptipp { max-width:40%; height:auto; margin:6px 4% 1.5% 0; } img.bild-exptipp { width:300px; height:auto; } .caption-exptipp { margin:-1px 4% 1.5% 0; max-width:40%; font: 300 13px/16px 'Roboto',Arial,sans-serif; } /******************** R I G H T *********************/ .box-rechts a { background-position: 30px 8px; /* alle anderen */ font: 400 17px/23px "Roboto",Arial,sans-serif; padding: 4px 20px 4px 50px; } .headline-box-re { font: 400 28px/30px 'Roboto Condensed',Arial,sans-serif; margin:0 0 15px 0; } .plus-box-re, .minus-box-re { font: 500 20px/27px "Roboto",Arial,sans-serif; padding: 9px 0 11px 0; } .plus-box-re span { padding: 0 0 0 43px; background:url(images/pfeil_unten_box_re.png) no-repeat 0px 6px; /* IE < 9 */ background:url(images/pfeil_unten_box_re.svg) no-repeat 0px 6px; /* alle anderen */ } .minus-box-re span { padding: 0 0 0 43px; background:url(images/pfeil_oben_box_re.png) no-repeat 0px 6px; /* IE < 9 */ background:url(images/pfeil_oben_box_re.svg) no-repeat 0px 6px; /* alle anderen */ } #content a.orts_link, #content a.rechtsgebiets_link { /*width: 24.2%;*/ width: 32.3%; background-position:13px 9px; font: 400 16px/24px "Roboto",Arial,sans-serif; margin: 0 0.8% 2px 0; } #content a.rechtsgebiets_link.top { padding: 18px 0 0 0; } .link-pfeil{ background-position:13px 9px; font: 700 16px/24px "Roboto",Arial,sans-serif; margin: 0 0.8% 2px 0; } .form-suchbox-re.was-wo input#bt-submit { padding:10px 10px 14px 50px; font:700 24px/28px 'Roboto',Arial,sans-serif; background-position: -138px 0; } .form-suchbox-re.was-wo input#bt-submit:hover {background-position:-138px -150px;} /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .suchbox-start {padding:110px 50px 30px 50px;} .toolbox-outer {margin-right: -4%;} .toolbox { width:46%; margin:0 4% 0 0; padding:0 0 30px 115px; } .toolbox span span {display:none;} .top-outer {margin-right: -4%;} .top-div {width:46%;margin:0 4% 0 0;} /* - - - - - - - - - - ### TEILNAHME SEITE ### - - - - - - - - - - - */ .kurztext {font:400 19px/26px 'Roboto',Arial,sans-serif;} } /* ENDE 1279px */ @media only screen and (max-width:1150px) { /* - - - - - - - - - - ### PROFIL ### - - - - - - - - - - - */ .funktionen {height:128px;} .funktionen a.fktn { padding-top:80px; font: 400 14px/18px 'Roboto',Arial,sans-serif; background-size:90%; margin: 0px 0 0px 7%; } .gmap_typ1 .gmap {height:370px} .box-rechts-profile {clear: both;margin: 0 0 50px;} .box-rechts-profile .content-box-re {padding:25px 20px 23px 20px;} .box-rechts-profile .tn-gelistet a {display:block;} .box-rechts-profile .tn-bild span { /* runde aeuessere Box */ float:left; margin:0px 15px 20px 0; width:80px; height:80px; border-radius: 80px; -moz-border-radius: 80px; -webkit-border-radius: 80px; -o-border-radius: 80px; -ms-border-radius: 80px; overflow:hidden; } .box-rechts-profile .tn-bild img {width:80px;height:auto;margin-top:-8px;} } /* ENDE 1150px */ @media only screen and (max-width:1024px) { /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .suchbox-start { width: 400px; margin:0px 0 50px 30px; padding:100px 30px 30px 30px; } .form-suchbox-start input#bt-submit { height:58px; margin:30px 0px 10px 0px; padding:10px 10px 14px 68px; background-position:center -8px; } .start .headline-cond-36px {padding-top: 20px;margin-bottom:15px;} .bt-profile-zurueck,.bt-profile-weiter {margin-top:17px;} .teilnehmer-mini {width: 145px;font: 400 14px/22px Roboto,Arial,sans-serif;} .tn-bild-mini span {margin: 3px 10px 20px 10px;border: 11px solid #fff;} .tn-bild-mini span, .tn-bild-mini span a {width: 100px;height: 100px;} .tn-bild-mini img {margin-top: -10px;width: 100px;} .ra-titel {font: 400 14px/18px 'Roboto',Arial,sans-serif;} .teilnehmer-mini a {font: 700 18px/22px 'Roboto Slab',Arial,sans-serif;} .toolbox span span {display:inline;} .top-div {margin-bottom:20px;} .headline-top {padding-top: 20px;} } /* ENDE 1024 PX */ @media only screen and (max-width:1023px) { .mobile-hidden-1023 {display:none !important;} .mobile-show-1023 {display:block;} a.totop { opacity: 0.7; -moz-opacity: 0.7; filter: alpha(opacity=70); } /******************** SUCHBOX RECHTS MOBILE ***********************/ .suchbox-rechts.mobile {display:block;} .suchbox-rechts { box-sizing:border-box; margin:0 0 30px 0; padding:25px 30px 25px 30px; border-radius: 20px 20px 20px 20px; -moz-border-radius: 20px 20px 20px 20px; -webkit-border-radius: 20px 20px 20px 20px; -o-border-radius: 20px 20px 20px 20px; -ms-border-radius: 20px 20px 20px 20px; position:relative; right:auto; top:auto; width:auto; } .suchbox-rechts.exptipp { background:url(images/bg_suchbox_rechts_exptipp.png) repeat-x 0px 0px; } .suchbox-rechts .headline {font: 400 27px/33px "Roboto Condensed",Arial,sans-serif;} .suchbox-rechts .was-wo .headline {width: 50%;} .form-suchbox-re .form-row {float:left;width:46.7%;} .form-suchbox-re .form-row.submit {margin:0 0 0 30px;} .form-suchbox-re input.text, .exptipp .form-suchbox-re input.text {border:1px solid #fff;} .form-suchbox-re input#bt-submit {margin: 3px 0 4px;} /* KONTAKTFORM EXPTIPP KURZPROFIL */ #content .box-rechts p {margin-bottom:12px;} #content .box-rechts a {font: 400 16px/24px "Roboto",Arial,sans-serif;} #content .box-rechts .kp-name a { font: 700 24px/30px "Roboto Slab",Arial,sans-serif; } .content-box-re { border-radius: 20px 20px 20px 20px; -moz-border-radius: 20px 20px 20px 20px; -webkit-border-radius: 20px 20px 20px 20px; -o-border-radius: 20px 20px 20px 20px; -ms-border-radius: 20px 20px 20px 20px; } /* - - - - - - - - - - ### PROFIL ### - - - - - - - - - - - */ .routenplaner {margin:0;} .box-kontaktform .form-row.kp-captcha img {width: 140px;} /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .half-column {float:none;width:100%;} .half-column.right {margin:0 0 0 0;} .headline-36px.tn-start {margin-top: 0px;} /* - - - - - - - - - - ### TEILNAHME SEITE ### - - - - - - - - - - - */ #right.teilnahme {display:block;width:auto;margin-right: 0;} .reiterbox .content-box-re { border-radius: 0px 0px 20px 20px; -moz-border-radius: 0px 0px 20px 20px; -webkit-border-radius: 0px 0px 20px 20px; -o-border-radius: 0px 0px 20px 20px; -ms-border-radius: 0px 0px 20px 20px; } } /* ENDE 1023px */ @media only screen and (max-width:960px) { /* Nur wichtig fuer Header/Navigation*/ .mobile-hidden-960 {display:none;} #logo, .small #logo {margin:17px 0 0 11px;} #logo img, .small #logo img {width:240px; height:46px;} /* ################## -> siehe auch Inline-Styles ################## */ .breadcrumb {padding:20px 20px 20px 0; font:12px/26px 'Roboto',Arial,sans-serif;} /****************** N A V I G A T I O N ******************/ #navigation {margin:27px 0 0 0;} #navigation ul {margin:0 0 0 0} #navigation ul li {margin: 0 0 0 12px;} #navigation a {font:300 16px/18px Roboto,Arial,sans-serif;} #navigation ul.nav-menu li ul {margin-top:36px;} #navigation ul.nav-menu li ul li a, #navigation ul.nav-menu li.act ul li a, #navigation ul.nav-menu li ul li a.uebersicht { padding:5px 25px 5px 35px; font-size:16px; line-height:25px; } #navigation ul.nav-menu li ul.dreispalten, #navigation ul.nav-menu li ul.zweispalten {margin-left:-302px;} #navigation ul.nav-menu li ul.last {margin-left:-155px;} #navigation ul.nav-menu li ul.zweispalten .nav-wrapper, #navigation ul.nav-menu li ul.dreispalten .nav-wrapper {width:520px;} #navigation ul.nav-menu li ul.zweispalten .nav-wrapper li, #navigation ul.nav-menu li ul.dreispalten .nav-wrapper li {width:260px;} /********************* F O O T E R *********************/ .footer-box.box-1 {width:280px; margin:0 15px 0 0;} .footer-box.box-3 {margin: 0 30px 0 0;} #content a.rechtsgebiets_link.top {width: 49.2%;} } /* ENDE 960px */ @media only screen and (max-width:767px) { #footer { width: 100%; transition: 0.4s; -moz-transition: 0.4s; -ms-transition: 0.4s; -o-transition: 0.4s; -webkit-transition: 0.4s; -webkit-transition: 0.4s; position: relative; right:0; } .mob-nav-open #footer { margin: 0 0 0 -63px; right: -100%; position:relative; } #navigation, .small #navigation { float:none; width:auto; /* height:100%;*/ margin:0; padding:0 0px 0 80px; background:#777779; right:100px; } .mob-nav-open #navigation, .mob-nav-open .small #navigation { /*margin:0 63px 0 0;*/ } #navigation ul { float: none; list-style: none; margin: 20px 20px 20px 0; } #navigation ul li, .small #navigation ul li { display: block; float: none; height: auto; margin: 0; padding:0; } #navigation a, #navigation a.act, #navigation .no-submenu a.act:hover, #navigation .no-submenu a:hover, #navigation .sfHover a { display: block; float: none; height:auto; padding: 5px 0px 5px 25px; margin: 13px 0 5px 0; text-decoration: none; color: #fff; font: 300 20px/20px Roboto,Arial,sans-serif; position: relative; z-index: 2; border:none; background: url(images/pfeil_nav1_mobil.svg) no-repeat 3px 7px; transition:none; } #navigation a.act:hover, #navigation a:hover { cursor:pointer; border-bottom:none; color:#7fc31f; /* gruen */ font-weight:700; /*background: url(images/pfeil_nav1_mobil.svg) no-repeat 3px -18px;*/ background: url(images/pfeil_nav1_mobil_mo.svg) no-repeat 3px 7px; cursor:pointer; border-bottom:none; transition:none; } #navigation li.nav-anwaelte, .small #navigation li.nav-anwaelte { background:#62b111; text-align:left; margin: 40px 25px 0px -8px; padding: 7px 10px 6px 8px; width:220px; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; } #navigation li.nav-anwaelte a { color: #fff; font: 300 20px/20px Roboto,Arial,sans-serif; background: url(images/pfeil_nav1_mobil_weiss.svg) no-repeat 3px 4px; display:inline; padding: 0 0 0 25px; } /**************** N A V I G A T I O N E B E N E 2 **************/ #navigation ul.nav-menu li ul, .small #navigation ul.nav-menu li ul, #navigation ul.nav-menu li ul.zweispalten, #navigation ul.nav-menu li ul.dreispalten, #navigation ul.nav-menu li ul.last { position: relative; margin:0; overflow:auto; padding:0; display:none; } .nav-wrapper-outer { margin:0; overflow:hidden; padding:0; } .nav-wrapper, #navigation ul.nav-menu li ul.zweispalten .nav-wrapper, #navigation ul.nav-menu li ul.dreispalten .nav-wrapper { min-width:auto; width:auto; margin:0; padding:0; clear:left; background: none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; float:none; } #navigation ul.nav-menu li:hover ul {display:block;} #navigation ul.nav-menu li ul li, #navigation ul.nav-menu li ul.zweispalten .nav-wrapper li, #navigation ul.nav-menu li ul.dreispalten .nav-wrapper li { margin:0; padding:0; width:auto; max-width:none; float:none; font: 300 18px/28px "Roboto",Arial,sans-serif; } #navigation ul.nav-menu li ul li a, #navigation ul.nav-menu li.act ul li a, #navigation ul.nav-menu li ul li a.uebersicht { background:none; padding:0 0 0 25px; color:#fff; margin:5px 0 10px 0; } #navigation ul.nav-menu li ul li a.uebersicht {color:#7fc31f;} #navigation ul.nav-menu li ul li:hover, #navigation ul.nav-menu li ul li a:hover {background:none; color:#fff;} #navigation ul.nav-menu li ul li .kat-nav { margin:-7px 0 0px 0; padding:0px 25px 5px 25px; font: 300 13px/21px "Roboto",Arial,sans-serif; display:block; color:#fff; } #navigation ul.nav-menu li ul li .kat-nav a, #navigation ul.nav-menu li.act ul li .kat-nav a { background:none; padding:0px 0px 0px 0px; font: 300 14px/18px "Roboto",Arial,sans-serif; color:#7fc31f; display:inline; } #navigation ul.nav-menu li ul li .kat-nav a:hover, #navigation ul.nav-menu li.act ul li .kat-nav a:hover {text-decoration:underline;} /********************* F O O T E R *********************/ #footer {height:auto;padding:0;background:#9c9c9d} .footer-wrapper {float:none} .footer-box {float:none;color:#fff;font:400 18px/22px Roboto,Arial,sans-serif} .footer-box.box-1 {width:auto;height:auto;margin:0;padding:18px 0 8px 15px} .footer-box.box-1 ul li {float:left;margin:0 6% 10px 0;padding:0;text-align:center} .footer-box.box-3 {clear:left;width:auto;margin:0;padding:14px 0 15px 15px;background:#8d8d8e} .footer-box.box-3 ul li {float:left;margin:0 9% 0 0;padding:0;text-align:left} .footer-box ul {margin:0;} .footer-box a { background: url(images/pfeil_link_footer.png) no-repeat 0px 7px; /* IE < 9 */ background: url(images/pfeil_link_footer.svg) no-repeat 0px 7px, none; /* alle anderen */ display:inline-block; color: #fff; padding:4px 0 4px 14px; } .footer-box a:hover {background-color:transparent;} .footer-box .anwaelte-ft a { background: url(images/pfeil_link_footer_gruen.png) no-repeat 0px 7px; /* IE < 9 */ background: url(images/pfeil_link_footer_gruen.svg) no-repeat 0px 7px, none; /* alle anderen */ color: #99fa35; font-weight:700; } .footer-logo-mobile {height:105px;background:#777779;} .footer-logo-mobile span { display:block; width:270px; margin:0px auto 0 auto; padding-top:4px; } .ft-text-mobile { float:left; padding:16px 0 0 0; margin:0; color:#fff; font:400 12px/16px 'Roboto', Arial, sans-serif; } .logo-ovs-mobile {float:right;margin:9px 0 0 0;} .logo-ovs-mobile img {width:120px;height:auto;} /***************** C O N T E N T *********************/ a.button-blau-small, #content a.button-blau-small, .button-blau-small, #content .button-blau-small { font:500 15px/22px 'Roboto',Arial,sans-serif; margin:7px 0px 10px 0px; padding:5px 20px 6px 20px; } .box-artikelhead { font: 700 23px/28px 'Roboto Slab',Arial,sans-serif; margin:0 0 9px 0; } /*.box-artikelinfo {margin:0 0 0px 90px;}*/ /* temp ohne red. Bilder */ .box-artikelinfo {margin:0 0 0px 0px;} .box-artikeltext {display:none;} /*.box-exptipp .box-artikelhead { font: 700 20px/25px 'Roboto Slab',Arial,sans-serif; margin:0 0 9px 90px; }*/ /* temp ohne red. Bilder */ .box-exptipp .box-artikelhead { font: 700 20px/25px 'Roboto Slab',Arial,sans-serif; margin:0 0 9px 0px; } .redaktion .box-artikelbild img, .anwalt .box-artikelbild span { /* runde aeuessere Box */ float:left; margin:1px 10px 14px 0; width:80px; height:80px; } .anwalt .box-artikelbild img { width:80px; height:auto; margin-top:-8px; } /* WEITERE TEILNEHMER UNTEN */ .box-teilnehmer {margin:5px 0 0px 0;} .tn-text {margin: 0 0 0 90px;} .tn-name a {font: 700 20px/27px 'Roboto Slab',Arial,sans-serif;margin:0 0 9px 0;} .tn-gelistet {font: 400 13px/16px 'Roboto',Arial,sans-serif;margin-top:7px;} .tn-bild span {margin:0px 10px 10px 0;width:80px;height:80px;} .tn-bild img {width:80px;height:auto;margin-top:-8px;} #content .link-teilnahme a, .link-teilnahme a { width:auto; height:auto; position:relative; right:auto; bottom:auto; display:block; background:#57aa0c url(images/bg_link_teilnahme.png) repeat-x 0 0; background-size:contain; z-index:auto; border-radius: 20px 20px 20px 20px; -moz-border-radius: 20px 20px 20px 20px; -webkit-border-radius: 20px 20px 20px 20px; -o-border-radius: 20px 20px 20px 20px; -ms-border-radius: 20px 20px 20px 20px; /*font: 400 22px/32px 'Roboto Condensed',Arial,sans-serif;*/ font: 400 26px/32px 'Roboto Condensed',Arial,sans-serif; margin-bottom:30px; } #content .link-teilnahme.unten a, .link-teilnahme.unten a {bottom:auto;} .start .link-teilnahme {display:none;} .link-teilnahme br {display:none;} /*.link-teilnahme br.firstbreak {display:inline;}*/ .link-teilnahme a span { display:block; margin:20px 19px 0 0; padding:12px 0 14px 65px; background-position:20px center; background-size:18px 30px; text-align:center; } /* - - - - - - - - - - ### PROFIL ### - - - - - - - - - - - */ .gmap_typ1 .gmap {height:300px} .profil .box-rechts.kurzprofil .content-box-re {padding:0px 10px 5px 10px;} #content a.orts_link, #content a.rechtsgebiets_link {width: 225px;} #modal-inner {max-height:260px;} #modal-inner, #modal-inner p {font: 400 15px/22px 'Roboto',Arial,sans-serif;} /* - - - - - - - - - - ### TEASER RG ORTE ### - - - - - - - - - - - */ #content a.umkreis {margin-left:0;padding-left:83px;} /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .suchbox-start { background:#67b224 url(images/bg_suchbox_rechts.png) repeat-x 0px 0px; margin:0 10px 20px 10px; padding:25px 30px 25px 30px; border-radius: 20px 20px 20px 20px; -moz-border-radius: 20px 20px 20px 20px; -webkit-border-radius: 20px 20px 20px 20px; -o-border-radius: 20px 20px 20px 20px; -ms-border-radius: 20px 20px 20px 20px; position:relative; width:auto; } .suchbox-start .headline {float: left; width: 24%;padding: 7px 0 0;} .form-suchbox-start input.text {float: left;width: 76%;margin-bottom:25px;border: 1px solid #fff;} .form-suchbox-start .form-row.submit {clear:left;padding:10px 0 0 0;} .form-suchbox-start input#bt-submit {margin:0px 0px 10px 0px;} .wrapper-profile {padding:0 55px;} .bt-profile-zurueck,.bt-profile-weiter {width: 40px;background-size:cover;background-position:0 10px;} .bt-profile-zurueck {margin-left:0;left:10px;} .bt-profile-weiter {right:10px;} .bt-profile-zurueck:hover,.bt-profile-weiter:hover {background-position:0 -99px;} .teilnehmer-mini {width: 130px;} .toolbox {padding:0 0 30px 95px;background-size:80px !important;} .top-div {font: 400 15px/22px 'Roboto',Arial,sans-serif;} /* - - - - - - - - - - ### TEILNAHME SEITE ### - - - - - - - - - - - */ .tn-indent {padding-bottom: 0;} #right.teilnahme {margin:0 10px;padding: 0px 0 10px;} /* - - - - - - - - - - ### PARTNERSEITE ### - - - - - - - - - - - */ #content a.button-blau-small.partner span {background-size:18px;} } /* ENDE 767px */ @media only screen and (max-width:600px) { a.button-blau, #content a.button-blau, .button-blau, #content .button-blau { width:100%; text-align:center; } . span {display: block;} .trennlinie { height:22px; margin-bottom:4px; background-position:0 6px; background-size:100% 9px; } /* - - - - - - - - - - ### PROFIL ### - - - - - - - - - - - */ .profil .button-blau {margin: 20px 0;} /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ #fuer-anwaelte ul li { font:400 19px/25px 'Roboto',Arial,sans-serif; padding:9px 0 7px 50px; margin-bottom:0px; background-position:0px 3px; background-size:35px; } } /* ENDE 600px */ @media only screen and (max-width:568px) { } /* ENDE 568px */ @media only screen and (max-width:567px) { /******************** SUCHBOX RECHTS MOBILE ***********************/ .suchbox-rechts { margin:0 0 30px 0; padding:25px 30px 25px 30px; } .suchbox-rechts .headline { color:#fff; font: 400 21px/26px "Roboto Condensed",Arial,sans-serif; margin: 0 0 20px; } .form-suchbox-re .form-row { float:none; width:auto; } .form-suchbox-re .form-row.submit {margin:0;} .form-suchbox-re input#bt-submit {margin:20px 0px 10px 0px; } #content a.umkreis {padding:24px 0 30px 93px;width:100%;} #content a.rechtsgebiets_link.top {width: 100%;} /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .toolbox { padding:0 0 30px 0px; background-size:65px !important; } .hd-tools { font:400 20px/26px 'Roboto',Arial,sans-serif; padding-left:80px; margin-bottom:26px; } } /* ENDE 567px */ @media only screen and (max-width:480px) { #content .link-teilnahme a, .link-teilnahme a {font: 400 22px/32px 'Roboto Condensed',Arial,sans-serif;} .link-teilnahme a span {background-size:auto;text-align:left;} .box-exptipp .box-artikelhead {font: 700 18px/24px "Roboto Slab",Arial,sans-serif;} .footer-box.box-3 {font:400 16px/20px 'Roboto',Arial,sans-serif;} .footer-box.box-3 a {background-position:0px 6px;} .anwalt span.bild-exptipp { /* runde aeuessere Box */ margin:6px 4% 1.5% 0; width:120px; height:120px; } .anwalt span.bild-exptipp img {width:120px;margin-top:-13px;} .social-likes {margin-left:-5px !important;} .facebook {margin-left:5px !important;} .googleplus {margin-bottom:7px !important;} .twitter {margin-bottom:7px !important;} .xing {margin-left:5px !important;margin-bottom:7px !important;} /* WEITERE TEILNEHMER UNTEN */ .box-teilnehmer {margin:15px 0 10px 0;} .tn-name a {font: 700 18px/24px 'Roboto Slab',Arial,sans-serif;margin:0 0 9px 0;} .tn-gelistet {display:none;} .tn-gelistet.kontaktaufnahme {display:inline-block;} .tn-bild span {margin:-10px 10px 10px 0;} .tn-text {font:14px/18px "Roboto",Arial,sans-serif;} /* - - - - - - - - - - ### PROFIL ### - - - - - - - - - - - */ .routenplaner { width: 100%; height:auto; padding:0px 10px 15px 10px; } .rp-headline {font:700 18px/22px 'Roboto Slab',Arial,sans-serif;} .routenplaner input.text {width:100%;} .profil #right {padding-bottom:20px;} /* - - - - - - - - - - ### TEILNAHME SEITE ### - - - - - - - - - - - */ .kurztext {font:400 18px/25px 'Roboto',Arial,sans-serif;} /* - - - - - - - - - - ### TEILNAHME SEITE ### - - - - - - - - - - - */ /* topopt */ .top-div a {margin-bottom: 10px; display: block;} .top-div .top-sep {display: none;} .kat-box-exptipp {margin: 5px 0px 5px 0px;; display: block;} .top-div .button-outline-small a {margin-bottom: 0;} } /* ENDE 480px */ @media only screen and (max-width:479px) { .mobile-hidden-479 {display:none;} /******************** SUCHBOX RECHTS MOBILE ***********************/ .suchbox-rechts.mobile {padding:25px 20px 25px 20px;} .box-artikelinfo span, .box-artikelinfo i {display: none;} .box-artikelinfo em { text-emphasis:none; font-style:normal; display:block; } #modal-window { left: 20px; right:20px; width:auto; top:50%; /* per JS zu berechnen*/ position: absolute; margin: -200px 0 0 0; z-index: 100; padding:17px 20px 13px 20px; } #modal-inner {max-height:200px;} #content a.orts_link, #content a.rechtsgebiets_link, #content a.azc, #content a.rechtsgebiets_link.normalort {width: 100%;} .link-pfeil {width: 100%;} .abc_verteiler a {padding: 4px 8px 4px 8px;} .kurzprofil .content-box-re {padding: 25px 15px;} .sterne .text-15px {display:block;margin-top:8px;} .bewertung .hd-eigene-bew {display:block;margin:0 0 5px 0;} /* - - - - - - - - - - ### PROFIL ### - - - - - - - - - - - */ .box-rechts.kurzprofil a.social {margin: 0 4.7% 15px 0;} .ra-logo {margin: -60px 0 30px;} .ra-logo img {width: 100%;} /* - - - - - - - - - - ### STARTSEITE ### - - - - - - - - - - - */ .suchbox-start .headline {/*float: none;*/width: 100%;padding:0;line-height:33px;} .form-suchbox-start input.text {float: none;width: 100%;margin-bottom:24px;} .form-suchbox-start .form-row.submit {clear:left;padding: 0} .form-suchbox-start input#bt-submit {margin:20px 0px 10px 0px; padding:10px 10px 14px 50px; font:700 24px/28px 'Roboto',Arial,sans-serif; background:#006fa7 url(images/bg_button_suche_re.png) -138px 0; } .form-suchbox-start input#bt-submit:hover {background-position:-138px -150px;} #exp-start .box-exptipp.anwalt .box-artikelhead {margin-left: 90px;} .toolbox { width:auto; padding:0 0 30px 80px; background-size:65px !important; } .hd-tools {padding-left:0px; margin-bottom:12px;} .top-div {width:auto;} /* - - - - - - - - - - ### TEILNAHME SEITE ### - - - - - - - - - - - */ .tn-indent {margin:0;} table.grau td {display:inline;} .text-normal .content-box-re {padding: 25px 15px;} .reiter {background-position:12% 11px;} /* - - - - - - - - - - ### PARTNERSEITE ### - - - - - - - - - - - */ #content a.button-blau-small.partner {width:100%;box-sizing:border-box;} a.button-outline-small.teaser, #content a.button-outline-small.teaser, .button-outline-small.teaser, #content .button-outline-small.teaser {width:100%;box-sizing:border-box;} }