/* * * Green Goods CSS * */ /* -- Base Styles -- */ html, body { margin:0;padding:0; } body { background:url(/images/header_bg.jpg) repeat-x top left; font:12px/18px "Lucida Grande", Arial, Helvetica, sans-serif; color:#333; } h1, h2, h3, h4, h5, h6 { margin:0; padding:0; } p, ul, ol { margin:0 0 18px 0; } img, a img { display:block; border:none; outline:none; } a {color:#3A3A3A;outline:none;} a:hover {color:#A3A3A3;} strong { color:#666666; } .inline { display:inline; } h2 { font:44px "Futura", Helvetica, Arial, sans-serif; letter-spacing:-1px; color:#add036; } h3 { font-size:18px; padding:0; margin:0 0 8px 0; color:#add036; font-weight:lighter; } h4 { font-size:13px; padding:0; margin:0 0 6px 0; color:#adbb8c; } /* -- Default Layout -- */ #wrapper { width:900px; margin:0 auto; padding:0 12px; } #header { height:121px; margin-bottom:25px; overflow:hidden; } #header h1 { width:270px;height:100px;float:left;padding:0;margin:0; background:url(/images/gg_logo-trans.png) no-repeat top left; } #header h1 a { width:270px; height:100px;display:block;text-indent:-9999px; position:absolute;z-index:1000;} #header ul {margin:0;padding:0;} #header #header_nav {width:257px; height:42px; margin-right:-7px; overflow:hidden;background: url(/images/header_menu_bg-trans.png) no-repeat; float:right; } #header #header_nav li {float:left; list-style:none; margin:0; padding:0; } #header #header_nav li a {display:block;text-indent:-9999px; position:absolute;z-index:1000;} #header #header_nav li#green_benefits {width:101px; height:30px;margin-left:22px; _margin-left:12px; background:url(/images/header_menu_green_on.gif) no-repeat top left;} #header #header_nav li#green_benefits a { width:101px; height:30px;background:url(/images/header_menu_green.gif) no-repeat top left;} #header #header_nav li#green_benefits a:hover { width:101px; height:30px;background:url(/images/header_menu_green_on.gif) no-repeat top left;} #header #header_nav li#news {width:50px; height:30px;background:url(/images/header_menu_news_on.gif) no-repeat top left;} #header #header_nav li#news a { width:50px; height:30px;background:url(/images/header_menu_news.gif) no-repeat top left;} #header #header_nav li#news a:hover { width:50px; height:30px;background:url(/images/header_menu_news_on.gif) no-repeat top left;} #header #header_nav li#contact {width:65px; height:30px;background:url(/images/header_menu_contact_on.gif) no-repeat top left;} #header #header_nav li#contact a { width:65px; height:30px;background:url(/images/header_menu_contact.gif) no-repeat top left;} #header #header_nav li#contact a:hover { width:65px; height:30px;background:url(/images/header_menu_contact_on.gif) no-repeat top left;} #header #header_nav li#links {width:47px; height:30px;background:url(/images/header_menu_links_on.gif) no-repeat top left;} #header #header_nav li#links a { width:47px; height:30px;background:url(/images/header_menu_links.gif) no-repeat top left;} #header #header_nav li#links a:hover { width:47px; height:30px;background:url(/images/header_menu_links_on.gif) no-repeat top left;} #header p {width:350px; height:18px; background:url(/images/header_p-trans.png) no-repeat; text-indent:-9999px;float:right; margin:20px 0 0 0; clear:right;} #left {padding:0 0px;width:178px;float:left; overflow:hidden;} #main_nav {padding:0;margin:0 0 18px 0; overflow:hidden;} #main_nav li {width:177px; list-style:none;} #main_nav li#team_vision {width:177px; } #main_nav li a { text-indent:-9999px;width:177px;height:40px;display:block;} #main_nav li#team_vision a {height:41px;} #main_nav li#team_vision {background: url(/images/gg_menu_team_hover.gif) no-repeat top left;} #main_nav li#team_vision a {background: url(/images/gg_menu_team.gif) no-repeat top left;} #main_nav li#team_vision a:hover {background: url(/images/gg_menu_team_hover.gif) no-repeat top left;} #main_nav li#gallery {background: url(/images/gg_menu_gallery_hover.gif) no-repeat top left;} #main_nav li#gallery a {background: url(/images/gg_menu_gallery.gif) no-repeat top left;} #main_nav li#gallery a:hover {background: url(/images/gg_menu_gallery_hover.gif) no-repeat top left;} #main_nav li#services {background: url(/images/gg_menu_services_hover.gif) no-repeat top left;} #main_nav li#services a {background: url(/images/gg_menu_services.gif) no-repeat top left;} #main_nav li#services a:hover {background: url(/images/gg_menu_services_hover.gif) no-repeat top left;} #main_nav li#products {background: url(/images/gg_menu_products_hover.gif) no-repeat top left;} #main_nav li#products a {background: url(/images/gg_menu_products.gif) no-repeat top left;} #main_nav li#products a:hover {background: url(/images/gg_menu_products_hover.gif) no-repeat top left;} #main_nav li#bottom {height:15px;background:url(/images/gg_menu_bottom.gif) no-repeat top left;} #main_nav ul#subnav { display:none; margin:0; padding:10px 0 10px 25px; background:#393939; border-bottom:1px solid #545454;list-style:none;} #main_nav ul#subnav li a{background:none; height:auto; text-indent:0; font-size:11px; color:#AAAAAA;text-decoration:none;} #main_nav ul#subnav li a:hover {color:#FFFFFF; background:none;} #left p.contact { background:url(/images/gg_menu_contact.gif) no-repeat top left;display:block;width:178px;height:128px;} #left p.contact a {display:block;width:178px;height:128px;text-indent:-9999px;} p.bread_crumb {color:#A7A7A7;display:inline-block;width:450px;} p.bread_crumb a {color:#474747;} #right { padding-left:22px; width:700px; float:left; margin-bottom:25px; overflow:hidden; } #content_wrap {width:450px;float:left;} .product_list { list-style:none; margin-left:0; margin-top:16px; padding-left:0; width:280px; } .product_list li { padding:0; margin:0; } .product_list li a { padding:6px 0 6px 25px; margin-bottom:2px; color:#555555; display:block; background:#dddddd url(/images/prodList_bg2.gif) left center no-repeat; text-decoration:none; } .product_list li a:hover { color:#FFFFFF; background:#4a4a4a url(/images/prodList_bg2_hover.gif) left center no-repeat; } #env_benefits { width:206px; float:right; background:url(/images/didyou_know.gif) repeat-y; overflow:hidden; } #env_benefits p { padding:0 22px 0; margin-bottom:0; } #env_benefits p#env_benefits_top { background:url(/images/didyou_know_top.gif) no-repeat; padding-top:54px; } #env_benefits_bottom { height:49px; display:block; background:url(/images/didyou_know_bottom.gif) no-repeat; } #sidebar { width:216px; float:right; overflow:hidden; text-align:center; } #sidebar em { font:italic 13px Georgia, "New Times Roman", Times, serif; } #footer {clear:both; width:900px; font-size:11px; color:#414141; background: url(/images/footer_border.gif) no-repeat; padding-top:25px; padding-bottom:15px; margin-top:20px; overflow:hidden; } #footer p { padding:0; margin:0; } #footer p #copy_right { float:left; width:178px;} #footer p #footer_nav { width:700px; float:left; padding-left:22px; display:block;} #footer p #footer_nav a {color:#414141; text-decoration:none;} #footer p #footer_nav a:hover {color:#5F5F5F; text-decoration:underline;} /* -- Forms -- */ #contactInfo{float:right;width:38%;} #contactForm{display:block;float:left;width:58%;} #contactForm p{margin-bottom:5px;padding:5px;} #contactForm .light{background:#E7E7E7 none repeat 0 0;} #contactForm label{float:left;line-height:18px;padding:6px;width:70px;} #contactForm .textInput{background-color:#FFFFFF;border:1px solid #BBBBBB;margin-left:20px;padding:6px;width:273px;} #contactForm textarea.textInput{height:100px;} #contactForm .button{margin-left:20px;padding:0;} /* -- Home Page -- */ body#home{background:none repeat 0 0;padding-top:20px;} body#home #wrapper{width:887px;} body#home #header{background:url(/images/header_back.gif) repeat-x left top;height:40px;margin-bottom:10px;overflow:hidden;width:887px;} body#home #header h1{ background:none; float:left;height:40px;margin:0 0 10px;overflow:hidden;padding:0;text-indent:-9999px;width:350px;} body#home #header #header_nav{background:none repeat 0 0;float:left;height:40px;list-style-type:none;margin:0 0 0 300px;overflow:hidden;width:219px;} body#home #header #header_nav li{float:left;list-style-type:none;} body#home #header #header_nav li a{display:block;text-indent:-9999px;} body#home #header #header_nav li#green_benefits{background:url(/images/home_header_nav_green_on.gif) no-repeat left top;height:40px;margin-left:0;width:101px;} body#home #header #header_nav li#green_benefits a{background:url(/images/home_header_nav_green.gif) no-repeat left top;height:40px;width:101px;} body#home #header #header_nav li#green_benefits a:hover{background:url(/images/home_header_nav_green_on.gif) no-repeat left top;height:40px;width:101px;} body#home #header #header_nav li#news{background:url(/images/home_header_nav_news_on.gif) no-repeat left top;height:40px;width:48px;} body#home #header #header_nav li#news a{background:url(/images/home_header_nav_news.gif) no-repeat left top;height:40px;width:48px;} body#home #header #header_nav li#news a:hover{background:url(/images/home_header_nav_news_on.gif) no-repeat left top;height:40px;width:48px;} body#home #header #header_nav li#contact{background:url(/images/home_header_nav_contact_on.gif) no-repeat left top;height:40px;width:66px;} body#home #header #header_nav li#contact a{background:url(/images/home_header_nav_contact.gif) no-repeat left top;height:40px;width:66px;} body#home #header #header_nav li#contact a:hover{background:url(/images/home_header_nav_contact_on.gif) no-repeat left top;height:40px;width:66px;} body#home #header #header_nav li#links{background:url(/images/home_header_nav_links_on.gif) no-repeat left top;height:40px;width:44px;} body#home #header #header_nav li#links a{background:url(/images/home_header_nav_links.gif) no-repeat left top;height:40px;width:44px;} body#home #header #header_nav li#links a:hover{background:url(/images/home_header_nav_links_on.gif) no-repeat left top;height:40px;width:44px;} body#home #home_content { margin-top: 10px; height:512px; } /* adjust margin here for spacing btwn UPDATE div */ body#home #home_content ul{list-style-image:none;list-style-position:outside;list-style-type:none;margin:0;padding:0;width:887px; background:url(/images/gg_homepage_hover.jpg)} body#home #home_content ul li {float:left;list-style-type:none; margin:0; padding:0; background:url(/images/gg_homepage.jpg) top left no-repeat; } body#home #home_content li a {display:block;text-indent:-9999px;} body#home #home_content li#team_vision{height:256px;width:443px;} body#home #home_content li#team_vision a{background:url(/images/gg_homepage.jpg) top left no-repeat;height:256px;} body#home #home_content li#team_vision a:hover { background:url(/images/gg_homepage_hover.jpg) top left no-repeat; } body#home #home_content li#services{height:256px;width:444px;} body#home #home_content li#services a{background:url(/images/gg_homepage.jpg) top right no-repeat;height:256px;} body#home #home_content li#services a:hover { background:url(/images/gg_homepage_hover.jpg) top right no-repeat; } body#home #home_content li#gallery{height:256px;width:443px;} body#home #home_content li#gallery a{background:url(/images/gg_homepage.jpg) bottom left no-repeat;height:256px;} body#home #home_content li#gallery a:hover{background:url(/images/gg_homepage_hover.jpg) bottom left no-repeat;} body#home #home_content li#products{height:256px;width:444px;} body#home #home_content li#products a{background:url(/images/gg_homepage.jpg) bottom right no-repeat;height:256px;} body#home #home_content li#products a:hover{background:url(/images/gg_homepage_hover.jpg) bottom right no-repeat;} body#home #footer{background:none repeat 0 0;margin:0;padding:10px 0 0;width:887px;} body#home #footer a{color:#434343;text-decoration:none;} body#home #footer a:hover{text-decoration:underline;} body#home #footer p{margin:0 0 10px;text-align:center;} body#home #footer p.footer_first{background:url(/images/footer_bg.gif) left top;color:#A1A1A1;height:40px;width:887px;} body#home #footer p.footer_first #copy_right{margin-top:12px; margin-left:15px; float:left; width:250px;} body#home #footer p.footer_first #address{float:right; width:450px; text-align:right; margin-right:15px;margin-top:12px;} body#home #updates {background:url(../images/updates_bg.jpg) repeat-x left top; height:110px; padding:15px 50px 15px 15px; overflow:hidden; width:822px; color:#333333; } /* don't set padding here */ body#home #updates img {border:solid 1px #CCC; margin:0 25px 0 0;float:left;} body#home #updates p {margin:0;} body#home #updates h1 { font-size: 24px; color: #83b50b; text-transform:normal; padding-bottom: 5px; }