/* ------------------------------------------------------------ Logopädie Schulze, Stylesheet - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - .autor JANDA+ROSCHER (www.janda-roscher.de) .version 1.1 .url logopaedie-schulze.com .timestamp 28/05/2010 ------------------------------------------------------------- */ /* ------------------------------------------------------------- Logopädie Schulze, Inhaltsverzeichnis - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 1. IMPORTANWEISUNGEN, SCHRIFTEN, BODY, HTML 2. HELFERKLASSEN 2.1 clearfix 3. STRUKTUR 4. NAVIGATIONEN 4.1 navMain 4.2 navSub 4.3 navInfo 4.4 navStart 4.45 navSidebar 5. ELEMENTE ------------------------------------------------------------- */ /* ------------------------------------------------------------- 1. Importanweisungen, Schriften, body, html - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* ------ Reset part ------ */ /* Copyright (c) 2007, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.net/yui/license.txt version: 2.4.1 */ html{color:#000;background:#FFF;} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;} table{border-collapse:collapse;border-spacing:0;} fieldset,img{border:0;} address,caption,cite,code,dfn,th,var{font-style:normal;font-weight:normal;} li{list-style:none;} caption,th{text-align:left;} h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;} q:before,q:after{content:'';} abbr,acronym {border:0;font-variant:normal;} /* to preserve line-height and selector appearance */ sup {vertical-align:text-top;} sub {vertical-align:text-bottom;} input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;} /*because legend doesn't inherit in IE */ legend{color:#000;} html { overflow-y: scroll; background: #e1ded9; } body { font-family: arial, verdana, sans-serif; font-size: 12px; line-height: 16px; color: #64573b; } #wrap { position: relative; width: 960px; margin: 10px auto; padding-top: 156px; } a { color: #3c849a; text-decoration: none; } a:hover { text-decoration: underline; } /* ------------------------------------------------------------- 2. Helferklassen - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* 2.1 clearfix */ .clear:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; } .clear { display: inline-block; } /* Hide from IE Mac \*/ .clear { display: block; } /* End hide from IE Mac */ /* ------------------------------------------------------------- 3. Struktur - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #logo { position: absolute; width: 169px; height: 148px; top: 0px; right: 11px; background: url(../_img/logopaedie-schulze_logo.png) no-repeat; } #logo img { display: none; } #contentWrapper { width: 960px; padding-top: 96px; background: #fff url(../_img/footer_background.png) 0px bottom no-repeat; } #home #contentWrapper { /*padding-top: 84px;*/ padding-top: 42px; } #mainContent { width: 916px; min-height: 450px; margin-bottom: 11px; padding-left: 44px; background: url(../_img/mainContent_background.png) 477px 0px repeat-y; } #home #mainContent { width: 934px; margin-bottom: 15px; padding-left: 26px; background: none; } #mainContentLeft {float: left; /*width: 423px; */ width: 391px; } #mainContentRight {float: right; width: 480px; background: url(../_img/mainContentRight_background.png) 0px bottom repeat-x; } #footer { position: relative; width: 960px; height: 43px; padding-top: 9px; text-align: right; } #footerImage { position: absolute; right: 0px; bottom: 62px; } /* ------------------------------------------------------------- 4. Navigationen - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* 4.1 navMain */ #navMain { position: absolute; width: 210px; height: 168px; left: 26px; top: 0px; padding-top: 48px; padding-left: 33px; background: url(../_img/navMain_background.png) no-repeat; } #home #navMain { background-image: url(../_img/navMain_background_start.png); } #navMain li { margin-bottom: 12px; } #navMain li a { display: block; width: 142px; height: 12px; background: no-repeat 0px 0px; overflow: hidden; background: no-repeat; text-indent: 999em; white-space: nowrap; outline: none; } #navMain li a:hover, #navMain li.active a { background-position: 0px -15px; } /* 4.2 navSub */ #navSub { position: absolute; width: 179px; height: 162px; left: 263px; top: 0px; padding-top: 48px; padding-left: 39px; background: url(../_img/navSub_background.png) no-repeat; } #navSub li { margin-bottom: 12px; } #navSub li a { display: block; width: 142px; height: 12px; background: no-repeat 0px 0px; overflow: hidden; background: no-repeat; text-indent: 999em; white-space: nowrap; outline: none; } #navSub li a:hover, #navSub li.active a { background-position: 0px -12px; } /* 4.3 navInfo */ #navInfo { margin-top: 8px; padding-bottom: 8px; } #navInfo li { float: left; width: auto; margin-right: 8px; } #navInfo a { display: block; padding-right: 5px; background: url(../_img/navInfo_background.png) right 2px no-repeat; color: #64573b; font-size: 10px; line-height: 1; } #navInfo .last a { background: none; } #navInfo a:hover { color: #3c849a; text-decoration: none; } /* 4.4 navStart */ ul#navStart { position: relative; width: 910px; height: 313px; margin-top: 27px; } #navStart li { position: relative; float: left; width: 208px; height: 313px; overflow: hidden; margin-right: 26px; background: no-repeat right bottom; } #navStart li.navStartCol4 { margin-right: 0px; } #navStart li a { display: block; width: 208px; height: 313px; overflow: hidden; background: no-repeat; text-indent: 999em; white-space: nowrap; outline: none; } #navStart li.navStartCol1 a { background-image: url(../_img/navStart/schlucken.png); } #navStart li.navStartCol2 a { background-image: url(../_img/navStart/sprache.png); } #navStart li.navStartCol3 a { background-image: url(../_img/navStart/sprechen.png); } #navStart li.navStartCol4 a { background-image: url(../_img/navStart/stimme.png); margin-right: 0px; } #navStart li:hover a { background-position: 0px -313px; } #navStart li div { display: none; } #navStart li:hover div { display: block; position: absolute; width: 183px; height: 265px; overflow: hidden; top: 48px; left: 15px; margin: 0; line-height: 14px; } #navStart li:hover div a { width: 183px; height: 265px; margin: 0; padding: 0; background: none; font-size: 12px; line-height: 14px; color: #64573b; text-indent: 0; white-space:normal; outline: none; } #navStart li:hover div a:hover { color: #64573b; text-decoration: none; } /* 4.5 navSidebar */ #navSidebar, .csc-menu { margin-left: -2px; padding-bottom: 13px; } #navSidebar a, .csc-menu a { display: block; padding-left: 43px; font-size: 14px; line-height: 20px; background: url(../_img/weiter-pfeil.gif) 29px 4px no-repeat; } #navSidebar a:hover, .csc-menu-1 a:hover, .csc-menu-1 a.active, .csc-menu-1 li.active a { background: url(../_img/weiter-pfeil.gif) 29px -66px no-repeat #e0ddd8; text-decoration: none; color: #64573b; } /* ------------------------------------------------------------- 5. Elemente - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* Überschriften */ h1 { min-height: 25px; margin-bottom: 23px; font-size: 24px; line-height: 1; color: #bcbe00; } #home h1 { padding-left: 232px; } h2 { margin: 13px 0px 18px 0px; font-size: 16px; line-height: 1; } #mainContentRight h2 { margin: 6px 0px 10px 27px; font-size: 14px; line-height: 18px; font-weight: bold; color: #bcbe00; } h3 { margin: 16px 0px 3px 0px; font-size: 16px; line-height: 18px; } /* Absatz */ #mainContentLeft p { margin-bottom: 14px; } p.Schrift_gross { margin-bottom: 30px; font-size: 16px; line-height: 20px; } #home p { margin-bottom: 27px; padding-right: 24px; padding-left: 234px; } #mainContentRight p { margin: 18px 26px 21px 26px; } #footer p { margin: 0px 0px 0px 0px; padding-right: 18px; padding-left: 18px; color: #fff; font-size: 12px; line-height: 18px; } #footer span { margin-right: 4px; } /* Links */ a.mehr { margin-left: 1px; padding-right: 8px; background: url(../_img/mehr-pfeil.gif) right 5px no-repeat; } a.weiter { display: block; width: 100%; padding-right: 13px; background: url(../_img/weiter-pfeil.gif) right 5px no-repeat; font-size: 14px; line-height: 20px; text-align: right; } #footer a { color: #fff; } #footer a:hover { color: #deddd8; text-decoration: none; } /* Listen */ #mainContentLeft ul { margin-bottom: 14px; } #mainContentLeft ul li { background: url(../_img/bullet-level1.png) 0px 4px no-repeat; padding-left: 18px; } #mainContent ol { margin: 0px 0px 14px 2px; padding: 0px; } #mainContent ol li { margin-left: 14px; list-style-type: decimal; } /* img */ #mainContentRight img { margin-left: -2px; } .csc-textpic-lastcol img { margin-right: 0; } #mainContentRight DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image { margin-bottom: 0px; } #mainContentRight .csc-textpic-text { padding-top: 1px; } /* Sidebar: navBox */ .navBox { padding-top: 4px; padding-bottom: 10px; background: url(../_img/mainContentRight_background.png) 0px bottom repeat-x; } #mainContentRight .navBox h2 { margin-bottom: 0px; line-height: 1; } .navBox h2 a { display: block; padding-left: 14px; background: url(../_img/weiter-pfeil.gif) 0px 2px no-repeat; } .navBox h2 a:hover { background-position: 0px -68px; text-decoration: none; color: #64573b; } #mainContentRight .navBox p { margin: 6px 44px 0px 26px; } /* 2 Spalter */ .fce2column { width: 100%; } .fce2column .firstCol { float: left; width: 49%; } .fce2column .secondCol { float: right; width: 49%; } /* iframe */ #mainContentRight iframe { margin-left: -2px; }