/* ================================================================================================================================================ Title: CSS - All Pages File: general.css Version: 1.0 Author: Roman Leinwather E-mail: roman.leinwather@gmail.com Website: Kings Road Dental Clinic URI: http:/ Updated: 16 March. 2009 ================================================================================================================================================ TABLE OF CONTENT I. Yahoo Reset CSS II. Body III. Default Elements IV. Headings V. Links VI. Media VII. Layout VIII. Branding VIX. Navigation VX. Footer X. Extra ================================================================================================================================================ */ /* I. Yahoo Reset CSS ================================================================================================================================================ */ @import url(http://yui.yahooapis.com/2.6.0/build/reset/reset-min.css); :focus {-moz-outline-style:none;} /* does not validate */ /* No Internet Connection Testing Enviroment */ * {padding:0px; margin:0px;} li{list-style: none;} /* II. Body ================================================================================================================================================ */ html {background-color:#000; color:#aaa;} body {font-family: Arial, Verdana, sans-serif; font-size:12px;} /* III. Default Elements ================================================================================================================================================ */ p,ul,dl,ol {padding-bottom:20px; line-height:1.4em;} ul { } ol { } hr { } blockquote { } blockquote p { } blockquote cite { } abbr { } abbr:hover { } del { } strong { font-weight:bold; } em { font-style:italic; } .float_left { float: left; } .float_right { float: right; } .hide_text { text-indent: -99999px; } .hide_all { display: none; } /* IV. Headings ================================================================================================================================================ */ h1 { } h2 { } h3 { } h4 { } /* V. Links ================================================================================================================================================ */ a:link, a:visited {color:#beb16d; text-decoration:none;} a:hover, a:focus {color:#d6bf44; border-bottom:1px dotted #d6bf44;} /* VI. Media ================================================================================================================================================ */ img { } /* VII. Layout ================================================================================================================================================ */ #wrapp {width:984px;} #page {float:left; width:974px; margin-left:5px;} #header {float:left; width:974px; height:391px; background: url(../media/images/header.jpg) bottom left no-repeat;} #header #top {float:left; width:974px; height:100px; background: #161616 url(../media/images/footer_bg.png) 0 0 repeat-y;} #content {float:left; clear:both; width:974px; padding-top:40px; background: #2c2c2c url(../media/images/side_bar_bg.png) 0 0 repeat-y;} #secondary_navigation {float:left; width:225px; padding-left:15px;} #main_content {float:left; width:714px; padding-left: 20px;} #main_primary {float:left; width:429px; padding-right:35px; _width:394px;} #main_secondary {float:left; width:230px; padding-right:20px; _width:210px;} #footer {float:left; clera:both; width:974px; height:140px; background: #161616 url(../media/images/footer_bg.png) 0 0 repeat-y;} /* VIII. Branding ================================================================================================================================================ */ #top h1 {width:491px; height:56px; margin:37px 0 0 263px; position:absolute;} #top h1 a {display:block; width:491px; height:56px; background: url(../media/images/logo.png) 0 0 no-repeat;} #top h1 a:hover {border-bottom:none;} /* VIX. Navigation ================================================================================================================================================ */ #navigation {position:absolute; top:340px; left:265px; width:500px; height:100px;} #navigation li {float:left; width:100px; height:100px;} #navigation li a {display:block; float:left; height:100px; width:100px;} #navigation li a:hover {border-bottom:none !important;} #navigation li a:active {border-bottom:none !important;} #navigation li a#home_mn {background: url(../media/images/navigation_sprite.png) -27px 0 no-repeat;} #navigation li a#home_mn:hover {background: url(../media/images/navigation_sprite.png) -27px -135px no-repeat;} #navigation li a#services_mn {background: url(../media/images/navigation_sprite.png) -146px 0 no-repeat;} #navigation li a#services_mn:hover {background: url(../media/images/navigation_sprite.png) -146px -135px no-repeat;} #navigation li a#hours_mn {background: url(../media/images/navigation_sprite.png) -272px 0 no-repeat;} #navigation li a#hours_mn:hover {background: url(../media/images/navigation_sprite.png) -272px -135px no-repeat;} #navigation li a#about_mn {background: url(../media/images/navigation_sprite.png) -393px 0 no-repeat;} #navigation li a#about_mn:hover {background: url(../media/images/navigation_sprite.png) -391px -134px no-repeat;} /* Secondary Navigation */ #secondary_navigation ul {float:left; padding-top:23px; width:215px;} #secondary_navigation li {float:left; clear:both; width:215px; height:42px; background: url(../media/images/sec_nav_bg.png) 0 0 no-repeat;} #secondary_navigation li a {float:left; display:block; margin:15px 0 0 18px; width:132px; height:14px; text-indent:-99999px;} #secondary_navigation li a:hover {border-bottom:none !important;} #secondary_navigation li a:active {border-bottom:none !important;} #secondary_navigation h2 {background:url(../media/images/side_bar_sprite.png) 0 0px no-repeat; width:102px !important; height:17px !important; padding-bottom:0px !important; margin-left:5px;} #secondary_navigation li#consultation_nav a {background:url(../media/images/side_bar_sprite.png) 0 -18px no-repeat;} #secondary_navigation li#hygienist_visit_nav a {background:url(../media/images/side_bar_sprite.png) 0 -35px no-repeat;} #secondary_navigation li#fillings_nav a {background:url(../media/images/side_bar_sprite.png) 0 -54px no-repeat;} #secondary_navigation li#crowns_nav a {background:url(../media/images/side_bar_sprite.png) 0 -74px no-repeat;} #secondary_navigation li#bridges_nav a {background:url(../media/images/side_bar_sprite.png) 0 -91px no-repeat;} #secondary_navigation li#veneers_nav a {background:url(../media/images/side_bar_sprite.png) 0 -112px no-repeat;} #secondary_navigation li#extractions_nav a {background:url(../media/images/side_bar_sprite.png) 0 -132px no-repeat;} #secondary_navigation li#whitening_nav a {background:url(../media/images/side_bar_sprite.png) 0 -151px no-repeat;} #secondary_navigation li#implants a {background:url(../media/images/side_bar_sprite.png) 0 -170px no-repeat;} #secondary_navigation li#sedation a {background:url(../media/images/side_bar_sprite.png) 0 -189px no-repeat;} #secondary_navigation li#root a {background:url(../media/images/side_bar_sprite.png) 0 -208px no-repeat;} /*Javascript Top Messages*/ #header_message_1 {width:500px; height:80px; background: url(../media/images/header_message_1.png) 0 0 no-repeat; position:relative; z-index:10; top:157px; left:279px; display:block;} #header_message_2 {width:500px; height:80px; background: url(../media/images/header_message_2.png) 0 0 no-repeat; position:relative; z-index:10; top:157px; left:279px; display:block;} #header_message_3 {width:500px; height:120px; background: url(../media/images/header_message_3.png) 0 0 no-repeat; position:relative; z-index:10; top:157px; left:279px; display:block;} #header_message_4 {width:500px; height:120px; background: url(../media/images/header_message_4.png) 0 0 no-repeat; position:relative; z-index:10; top:157px; left:279px; display:block;} /*Javacsript Nav Popups*/ #home_nav_popup {width:182px; height:82px; position:absolute; margin-top:259px; left:180px; z-index:10; background: url(../media/images/navigation_popups.png) 0 -283px no-repeat;} #services_nav_popup {width:182px; height:82px; background: url(../media/images/navigation_popups.png) 0 -149px no-repeat; position:absolute; margin-top:264px; left:280px; z-index:10;} #contact_nav_popup {width:182px; height:82px; background: url(../media/images/navigation_popups.png) 0 -10px no-repeat; position:absolute; margin-top:259px; left:386px; z-index:10;} #about_nav_popup {width:182px; height:82px; background: url(../media/images/navigation_popups.png) 0 -406px no-repeat; position:absolute; margin-top:259px; left:482px; z-index:10;} /* X. Footer ================================================================================================================================================ */ #footer p {padding-bottom:2px; font-size: 11px;} #footer #copyright_info {float:left; width: 200px; margin-left:260px; padding-top:20px;} #footer #copyright_info p {float:left; width:200px; clear:both;} #footer #contact_details {float:left; width:233px; padding-top:20px;} #footer #contact_details p {float:left; width:233px; clear:both; text-align:right;} #footer #design_credits {float:left; width 130px; margin-left:185px; padding-top:20px; text-align:right;} #footer #design_credits a {font-size:11px; text-decoration:none; color:#666;} #footer #design_credits a:hover {color:#999; border-bottom: 1px dotted #999;} /* XI. Extra ================================================================================================================================================ */ #extractions_nav {display:none;} #header_contact {margin-left:600px; color:#beb16d; margin:5px 0 0 850px;}