/* Drupal 6 Framework - Created by Andre Griffin ------------------------------------------------ [Table of contents] 0.Reset 1.Global 2.Layout 3.Main 4.Sidebars 5.Header 6.Navigation 7.Nodes 8.Comments 9.Blocks 10.Footer 12.CSS Support [Font sizes - based on 75%/12px body font-size] 36px = 3em 30px = 2.5em 24px = 2em 18px = 1.5em 16px = 1.333333em 15px = 1.2em 14px = 1.1667em 12px = 1em 11px = .9167em 10px = .8333em Equation for font sizing: -Desired px ÷ Default (or parent) px = em size ------------------------------------------------*/ /** * 0.RESET */ @import "reset.css"; /** * 1.GLOBAL */ body { background: #fff; color: #555; /* RS: Schriftfarbe normaler Text! heller als schwarz (#000) gewählt! */ font-family: Lucida Grande, Verdana, Arial, sans-serif; font-size: 75%; line-height:1.5; margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6 { font-family: Helvetica, Helvetica Neue, Arial, sans-serif; font-weight: normal; } h1 { font-size: 3em; line-height: 1em; margin-bottom: .5em; } h2 { font-size: 2em; } h3 { font-size: 1.5em; line-height: 2em; } h4 { font-size: 1.2em; line-height: 1.25em; margin-bottom: 1.25em; } h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; } h6 { font-size: .8333em; font-weight: bold; line-height: 1.8em; margin-bottom: 1.8em; } h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin: 0; } p { margin: 0 0 1.5em 0; } p a:link { text-decoration: underline; } a:link, a:visited { color: #606080; /* Alle verlinkten Texte! color: #069; */ outline: none; text-decoration: none; } a:focus { outline: 1px dotted; } a:hover, a:active, li a.active , li.expanded ul li a { color: #069; outline: none; text-decoration: underline; } li.active-trail a{ color: red; } /** * 2.LAYOUT */ #wrapper { margin: 0 auto; padding: 0 5px; /* RS: padding: 0 10px; */ width: 940px; /* RS: width: 940px; */ } /* add this class to div#wrapper in page.tpl to show grid */ .showgrid { background: url(images/grid.gif) repeat-y; } /** * 3.MAIN */ /* 1 column: global values*/ #main { margin: 0 0 1.5em; position: relative; } /* 3 columns */ body.two-sidebars #main { float: left; margin: 0 20px 0 240px; padding: 0; width: 460px; } /* 2 columns: sidebar-first */ body.sidebar-left #main { float: right; margin: 0; padding: 0; width: 700px; } /* 2 columns: sidebar-second */ body.sidebar-right #main { float: left; margin: 0 20px 0 0; padding: 0; width: 700px; } /** * 4.SIDEBARS */ /* 3 columns: sidebar-first */ body.two-sidebars #sidebar-left { float: left; margin: 0 20px 0 -720px; padding: 0; width: 220px; } /* 3 columns: sidebar-second */ body.two-sidebars #sidebar-right { float: left; margin: 0; padding: 0px; width: 220px; } /* 2 columns: sidebar-first */ body.sidebar-left #sidebar-left { float: left; margin: 0 20px 0 0; padding: 0; width: 220px; } /* 2 columns: sidebar-second */ body.sidebar-right #sidebar-right { float: right; margin: 0; padding: 0; width: 220px; } /** * 5.HEADER */ #header { margin: 0 0 0em; /* RS: margin: 0 0 1.5em; */ padding: 0.5em 0 0; /* RS: padding: 1em 0 0; */ position: relative; color: #488 /* RS: neuer Eintr.! Schriftfarbe "Berufl. Schule des Wetteraukr. in Nidda" */ } #header #logo { float: left; margin: 0 1em 0 0; } #header #site-name-slogan { float: left; } #header #site-name { font-family: Helvetica, Helvetica Neue, Arial, sans-serif; font-size: 3em; font-weight: ; /* RS: font-weight: bold */ line-height: 1em; margin: 0; } #header #site-name a:hover { text-decoration: none; } #header #site-slogan { font-size: 1.5em; /* RS: neuer Eintrag */ margin: 0; } #search-theme-form { float: right; margin: 1em 0 0; } /* Hides "Search this site:" label from search forms */ div#edit-search-theme-form-1-wrapper label, div#edit-search-block-form-1-wrapper label { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); } /** * 6.NAVIGATION */ #navigation { margin: 0 0 0em; /* RS: margin: 0 0 1.5em; */ padding: 0; font-size: 1.2em; /* RS: neuer Eintrag */ } #navigation ul.primary-links { background: #ddd; margin: 0; padding: 0; } #navigation ul.primary-links li { float: left; margin: 0; padding: 0; } #navigation ul.primary-links li a { display: block; float: left; line-height: 1.7em; /* RS: 3em; */ padding: 0 1em; } #navigation ul.secondary-links { background: #eee; margin: 0; padding: 0; } #navigation ul.secondary-links li { margin: 0; padding: 0; } #navigation ul.secondary-links li a { display: block; float: left; line-height: 3em; padding: 0 1em; } #skip-link { position: absolute; } .breadcrumb { padding-bottom: 1.5em; } /* menus and item lists */ .item-list ul { margin: 0; padding: 0 0 0 1.5em; } .item-list ul li { margin: 0; padding: 0; } ul.menu li { margin: 0; padding: 0; } ul.inline { clear: both; } ul.inline li { margin: 0; padding: 0 1em 0 0; } /* admin tabs */ .tabs-wrapper { margin: 1px 0 1.5em; } ul.primary { margin: 0; padding: 1px 0 0; } ul.secondary { line-height: 3em; margin: 0 0 -1px; padding: 0; } ul.secondary a.active { border-bottom: none; } /** * 7.NODES */ #page-title { font-size: 1.5em; /* RS: 2em */ line-height: 1.5em; margin-bottom: 0; } .node { margin-bottom: 1.5em; } /* tags */ .terms { margin: 0 0 1.5em 0; } .terms span { font-weight: bold; /* */ } /* profile */ .profile { margin: 1.5em 0; } .profile h3 { border: none; } .profile dt { margin-bottom: 0; } .profile dd { margin-bottom: 1.5em; } /** * 8.COMMENTS */ #comments { clear: both; margin-top: 1.5em; } .comment { margin-bottom: 1.5em; } .comment .new { color: red; text-transform: capitalize; } /** * 9.BLOCKS */ .block { margin-bottom: 1.5em; position: relative; } /* login block */ #user-login-form { padding: 0; text-align: left; } #user-login-form .form-item { margin: 1em 0; } #user-login-form .item-list ul li { background: none; margin: 1em 0; padding: 0; } /* block configuration links */ section.block div.edit { background-color: #f5f5f5; border: 1px solid #ddd; display: none; font-size: 9px; margin: 0; overflow: hidden; padding: 2px 0 2px 10px; position: absolute; right: 0; top: 0; z-index: 40; } section.block:hover div.edit { display:block; } section.block div.edit a { color: #999; margin-right: 10px; } section.block div.edit:hover a { color: #000; } /* views configuration links */ div.view { position: relative; } div.view div.views-hide-hover, div.view:hover div.views-hide, div.view div.views-admin-links, div.view div.views-admin-links-hover, div.view div.views-admin-links:hover { background-color: #f5f5f5; border: 1px solid #ddd; font-size: 9px; margin-right: 0; margin-top: 0; padding: 0; padding-left: 10px; position: absolute; right: 0; top: 0; width: auto; } div.view div.views-admin-links li a { color: #999; } /** * 10.FOOTER */ #footer { clear: both; padding: 1.5em 0; position: relative; } #footer a.feed-icon { position: absolute; right: 0; top: 1.416667em; } /* support drupal */ #footer #block-system-0 { position: absolute; right: 25px; top: 1.5em; } /** * 11.CSS SUPPORT */ /** * Hide elements from all users. * * Used for elements which should not be immediately displayed to any user. An * example would be a collapsible fieldset that will be expanded with a click * from a user. */ .element-hidden { display: none; } /** * Hide elements visually, but keep them available for screen-readers. * * Used for information required for screen-reader users to understand and use * the site where visual display is undesirable. Information provided in this * manner should be kept concise, to avoid unnecessary burden on the user. * "!important" is used to prevent unintentional overrides. */ .element-invisible { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); } /** * The .element-focusable class extends the .element-invisible class to allow * the element to be focusable when navigated to via the keyboard. */ .element-invisible.element-focusable:active, .element-invisible.element-focusable:focus { position: static !important; clip: auto; } /** * Markup free clearing. * * @see http://perishablepress.com/press/2009/12/06/new-clearfix-hack */ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* IE6 */ * html .clearfix { height: 1%; } /* IE7 */ *:first-child + html .clearfix { min-height: 1%; }