/* basic CSS for samplecity.de */

* { margin:0; padding:0; border:0; font-size:100%; }
html { height:100%; margin-bottom:1px; }
body { margin:0; padding:0; border:0; background:#333333; color:#ffffff; font-size:75%; font-family: Arial, Verdana, Helvetica, sans-serif; text-align:center; }
div, p, ul, li, img, a { margin:0; padding:0; border:0; }
a, a:focus, a:hover, a:active { color:#ffffff; text-decoration: underline; }
strong { font-weight:bold; }

#wrapper_outer { width:960px; margin:10px auto 0 auto; }
#wrapper_inner { width:956px; text-align:left; border:2px solid #ffffff; background:#000000; }

#header { width:956px; height:48px; background:#666666 url(../images/header_bg.png) top left repeat-x; }
#logo { float:left; padding:15px 0 0 48px; font-size:1.66em; font-weight:bold; text-shadow: 1px 1px 1px #000000; }
#logo span { font-weight:normal; color:#999999; }
#logo span.smallnavi { font-size:0.7em; color:#999999; text-shadow: 0px 0px 0px #000000; }
#logo span.smallnavi_active { font-size:0.7em; color:#ffffff; text-decoration:underline; text-shadow: 0px 0px 0px #000000; }

#logo a, #logo a:focus, #logo a:hover, #logo a:active { padding:0 50px 0 0; color:#ffffff; text-decoration: none; }
#logo span.smallnavi a, #logo span.smallnavi a:focus, #logo span.smallnavi a:active { padding:0 0 0 0; color:#999999; text-decoration: none; }
#logo span.smallnavi a:hover { padding:0 0 0 0; color:#ffffff; text-decoration: underline; }
#logo span.smallnavi_active a, #logo span.smallnavi_active a:focus, #logo span.smallnavi_active a:active { padding:0 0 0 0; color:#ffffff; text-decoration: underline; }
#logo span.smallnavi_active a:hover { padding:0 0 0 0; color:#ffffff; text-decoration: underline; }

#navigation { float:right; padding:5px 48px 0 0; }
#navigation ul { list-style:none; }
#navigation ul li { display:inline; padding:0 0 0 10px; }

#content { width:956px; background:#000000 url(../images/content_bg.png) top left repeat-y; border-top:2px solid #ffffff; }
#content.home { height:550px; }
#content_padding { padding:0 48px 0 48px; }

#content_left { float:left; width:560px; }
#content_left h1 { margin:22px 0 30px 0; padding:15px 10px 15px 10px; font-size:4em; line-height:1em; font-weight:bold;  color:#999999; background:url(../images/headline_bg.png) top left repeat; border-top: 1px dotted #ffffff; border-bottom: 1px dotted #ffffff; text-shadow: 1px 1px 1px #000000; }
#content_left h1 strong { color:#ffffff; }
#content_left h2 { margin:0 0 15px 0; font-size:2em; line-height:1em; font-weight:bold; color:#ffffff; text-shadow: 1px 1px 1px #000000; }

#content_left #accordion { width: 560px; margin:0 0 0 0; padding:0 0 0 0; background:url(../images/headline_bg.png) top left repeat; border-bottom: 1px dotted #ffffff; }
#content_left #accordion h2 { margin:0 0 0 0; padding:10px 10px 10px 10px; color:#999999; background: url(../images/arrow-square.gif) no-repeat right -50px; border-top:1px dotted #ffffff; cursor: pointer; }
#content_left #accordion h2:hover { margin:0 0 0 0; padding:10px 10px 10px 10px; color: #ffffff; }
#content_left #accordion h2.active { margin:0 0 0 0; padding:10px 10px 10px 10px; color: #ffffff; background-position: right 5px; }
#content_left #accordion p { margin:0 0 0 0; padding:0 10px 10px 10px; }

#content_left p { margin:0 0 10px 0; }
#content_left p strong { margin:0 0 5px 0; font-size:1.16em; font-weight:bold; }
#content_left p span { font-size:0.83em; }
#content_left p.border_bottom { margin:0 0 15px 0; padding:0 0 15px 0; border-bottom:1px dotted #ffffff; }
#content_left p.noborder_bottom { padding:0 0 15px 0; }

#content_right { float:right; width:250px; }

#contact_detail { position:relative; display:none; width:220px; height:185px; margin:20px 0 0 0; padding:15px 15px 15px 15px; font-size:0.83em; background:url(../images/email_bg.png) top left no-repeat; overflow:hidden; }
#contact_detail #close_button { position:absolute; top:6px; right:10px; width:16px; height:16px; z-index:2; }
#contact_detail img { float:left; margin:0 10px 0 0; }
#contact_detail p { float:left; width:105px; padding:5px 0 0 0; color:#000000; overflow:hidden; }
#contact_detail strong { font-weight:bold; font-size:1.2em; color:#000000; }
#contact_detail em { font-style:normal; color:#666666; }
#contact_detail a, #contact_detail a:focus, #contact_detail a:hover, #contact_detail a:active { font-weight:bold; font-size:1.2em; color:#000000; text-decoration: underline; }

#footer { width:960px; margin:0 0 0 0; padding:5px 0 10px 0; text-align:left; font-size:0.83em; color:#666666; }
#footer a, #footer a:focus, #footer a:hover, #footer a:active { color:#666666; text-decoration: underline; }

.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display:block; }