@charset "utf-8"; /**************************** DECOMPRESSED VERSION http://www.wunschformat.de/css/screen_styles.css ****************************/ /**************************** RESET THE CSS ****************************/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent} body{line-height:1} ol, ul{list-style:none} blockquote, q{quotes:none} blockquote:before, blockquote:after, q:before, q:after{content:''; content:none} :focus{outline:0} ins{text-decoration:none} del{text-decoration:line-through} table{border-collapse:collapse; border-spacing:0} /**************************** GENERAL ****************************/ /**************************** SPECIAL COLORS USED IN THIS CSS wunschformat-blue - #1990ff dark-grey - #333 ****************************/ body{font-size:1em; background-color:#333; background-image:url(../images/background_stripes.png); background-repeat:repeat} /**************************** HEADER ****************************/ #header_frame{width:auto; height:5.63em; background:#333 url(../images/header_gradience.gif) repeat-x} #header_navigation_frame{width:43.14em; height:auto; margin:auto; padding:0 0.63em 0 0.63em} #header_navigation_frame img{float:left} #header_navigation_buttons{} #header_navigation_buttons ul{list-style:none} #header_navigation_buttons ul li{float:left; margin-top:3.7em} #header_navigation_buttons a{font-family:Geneva,Arial,Helvetica,sans-serif; font-size:0.8em; font-weight:bold; color:#fff; text-transform:uppercase; margin:0 0.1em 0 0.1em; padding:0.2em 0.5em 0.2em 0.5em; text-decoration:none} #header_navigation_buttons a:hover{background-color:#1990ff} /**************************** CONTENT ****************************/ #content_frame{width:44.4em; height:auto; margin:auto; padding:2em 0 2em 0; overflow:hidden; background:url(../images/background_gradience.jpg) repeat-y} /**************************** CONTENT FONTS ****************************/ #content_frame h1{font-family:Geneva,Arial,Helvetica,sans-serif; font-size:2.38em; font-weight:bold; color:#333; letter-spacing:-0.07em; text-transform:uppercase; margin:0 0.63em 0 0.63em} #content_frame h1 b{color:#1990ff} #content_frame h2{font-family:Geneva,Arial,Helvetica,sans-serif; font-size:1.50em; font-weight:normal; color:#333; letter-spacing:-0.03em; text-transform:uppercase; margin:0.63em 1em 1em 1em} #content_frame h2 b{color:#1990ff; font-weight:normal} #content_frame h3{font-family:Geneva,Arial,Helvetica,sans-serif; font-size:1em; font-weight:bold; color:#000; text-transform:uppercase; margin:0.63em 0.63em 0.31em 0.63em} #content_frame h3 b{color:#1990ff} #content_frame p{font-family:Geneva,Arial,Helvetica,sans-serif; font-size:0.81em; font-weight:normal; color:#000; margin:0.63em 0.8em 0 0.8em} #content_frame p b{color:#fff; font-weight:normal} #content_frame a{font-family:Geneva,Arial,Helvetica,sans-serif; font-weight:bold; text-decoration:none} /**************************** CONTENT VERTICAL ****************************/ .vert_content_box{width:12.50em; height:23.75em; background-color:#c8c8c8; margin-left:1.25em; float:left; border:0.35em solid #333} .vert_content_box img{border-bottom:0.2em solid #333} .vert_content_box a{font-size:1em; color:#1990ff} /**************************** CONTENT HORIZONTAL ****************************/ .hor_content_box{width:41em; height:auto; background-color:#c8c8c8; background:url(../images/background_ornaments.jpg) repeat; margin:0 0 1em 1.25em; border:0.35em solid #333; overflow:hidden} .hor_content_box img{border-right:0.2em solid #333; float:left; margin-right:0.75em} .hor_content_box a{font-size:0.85em; padding:0 0.4em 0 0.4em; color:#1990ff; line-height:3em} .hor_content_box a:hover{background-color:#1990ff; color:#FFF} /**************************** CONTACT FORM ****************************/ .contact_form_frame{width:29em; height:auto; overflow:hidden; float:left; margin-top:1em; font-family:Geneva,Arial,Helvetica,sans-serif; font-size:0.81em; font-weight:normal; color:#fff; font-weight:normal} #contact_succesfull{text-transform:uppercase; background:url(../images/contact_logo.png) center top no-repeat; padding:4em 0 2em 0; margin-top:1em} #contact_succesfull p{color:#FFF} .contact_form_frame fieldset ol{list-style:none} .contact_form_frame fieldset li{padding-bottom:0.5em} .contact_form_frame fieldset label{float:left; width:6em; margin-right:0.7em; padding-top:0.4em; text-align:right} .contact_form_frame em{float:right} .contact_form_frame fieldset img{border:none; margin:0.1em 0 0 0.3em} .contact_form_frame fieldset input{width:20em} .contact_form_frame fieldset textarea{width:20em; height:8em} .error_message{line-height:1.8em; display:none} .error_message img{padding:0.3em 0.5em 0 6.5em} #contact_info_frame{height:10em; width:17em; float:right; margin-top:1em; background:url(../images/contact_logo.png) center top no-repeat; padding-top:3em} #contact_info_frame p{margin-left:3em; color:#FFF; text-transform:uppercase; line-height:1.2em} #contact_info_frame a{margin-left:2.4em} /**************************** FOOTER ****************************/ #footer_frame{width:auto; height:auto; background:#333 url(../images/footer_gradience.gif) repeat-x} #footer_content{width:44.4em; height:auto; margin:auto; background:url(../images/logo_footer.jpg) no-repeat; overflow:hidden} #footer_information{width:auto; height:auto; float:right; padding:1em 1em 2em 0} #footer_information p{font-family:Geneva,Arial,Helvetica,sans-serif; font-size:0.75em; font-weight:normal; text-transform:uppercase; line-height:1.2em; color:#fff; margin:0.63em 0.8em 0 0.8em} #footer_information p a{font-size:1em; text-decoration:none; color:#fff; padding:0 0.4em 0 0.4em; margin-left:-0.4em} #footer_information p a:hover{background-color:#1990ff} /**************************** TRY ANOTHER BROWSER ****************************/ #new_browser_frame{width:41em; margin-left:auto; margin-right:auto; margin-bottom:1em; height:auto; border:0.35em solid #333; padding:0.5em 0 0.8em 0; background:#333 url(../images/background_ornaments.jpg) repeat; overflow:hidden} #new_browser_frame img{float:left} #new_browser_frame a:hover{color:#fff; background-color:#1990ff} /**************************** JQUERY POPUP ****************************/ #backgroundPopup{display:none; position:fixed; _position:absolute; /* hack for internet explorer 6*/height:100%; width:100%; top:0; left:0; background:#000; z-index:1} #popupContact{display:none; position:fixed; _position:absolute; /* hack for internet explorer 6*/height:auto; width:40em; background:#FFF url(../images/background_gradience_datenschutzhinweis.jpg) repeat-y; border:0.35em solid #333; z-index:2; padding:1em} #popupContact p{font:Geneva,Arial,Helvetica,sans-serif; font-size:0.8em; font-weight:normal; text-decoration:none; color:#000; padding:0 0.4em 0 0.4em; cursor:pointer; text-align:justify; margin-bottom:1em; text-transform:none} #popupContact p b{font-size:1.2em; font-weight:bold; text-transform:uppercase; color:#1990ff} #popupContactClose{font:Geneva,Arial,Helvetica,sans-serif; font-size:0.8em; font-weight:bold; text-decoration:none; text-transform:uppercase; color:#333; padding:0 0.4em 0 0.4em; cursor:pointer; margin-left:17em} #popupContactClose:hover{background-color:#1990ff; color:#FFF}