/** * Contents ** * 1. General Elements & Primary Structure * 2. Typography * 3. Header * 4. Navigation - Left Bar * 5. Content * 6. Footer * 7. Color Management * 8. Hacks */ /** * 1. General Elements & Primary Structure */ body { margin:0; padding:0; } img { border:0; } a { color:#ed1f24; } a span { display: none; } h1 { padding: 0; margin: 0; } .clear { clear: both; } .pp { font-weight: bold; } #main-wrapper { width:772px; background:url(/images/site_bg.gif) 0 0 repeat-x; } #header { height:107px; } #left-col { display:inline; float:left; margin-left:10px; margin-top:0; } #double-col { display:inline; width:582px; margin-left:34px; float:left; margin-bottom:20px; } #middle-col { display:inline; width:422px; margin-left:34px; float:left; margin-bottom:20px; } #right-col { display:inline; width:145px; margin-left:15px; float:left; margin-bottom:20px; } #footer { clear:both; background-color:#000; color:#fff; padding:5px 10px; height:13px; line-height:13px; font-style:italic; font-weight:bold; } #disclaimer { margin-left:10px; font-size:10px; padding:10px 0; font-style:italic; } /** * 2. Typography */ body { font-family:Times New Roman; font-size:13px; } /** * 3. Header */ #header a { background:url(/images/dream_fund_logo.gif); display:block; width:152px; height:78px; margin-left:5px; } #header ul { position:absolute; left:185px; top:0; list-style:none; margin:0; padding:0; width:587px; height:70px; } #header ul li { display:block; float:left; } #header ul li a { background:none; margin-left:0; display:block; width:0; height:0px; } #header ul li #nav1 { display:block; background:url(/images/nav.gif) 0 0 no-repeat; width:55px; height:70px; } #header ul li #nav2 { display:block; background:url(/images/nav.gif) -55px 0 no-repeat; width:110px; height:70px; } #header ul li #nav3 { display:block; background:url(/images/nav.gif) -165px 0 no-repeat; width:68px; height:70px; } #header ul li #nav4 { display:block; background:url(/images/nav.gif) -233px 0 no-repeat; width:57px; height:70px; } #header ul li #nav5 { display:block; background:url(/images/nav.gif) -290px 0 no-repeat; width:56px; height:70px; } #header ul li #nav6 { display:block; background:url(/images/nav.gif) -346px 0 no-repeat; width:78px; height:70px; } #header ul li #nav7 { display:block; background:url(/images/nav.gif) -424px 0 no-repeat; width:63px; height:70px; } #header ul li #nav8 { display:block; background:url(/images/nav.gif) -487px 0 no-repeat; width:98px; height:70px; } #header ul li #nav1:hover, #header ul li #nav1.selected { background:url(/images/nav.gif) 0 -71px no-repeat; } #header ul li #nav2:hover, #header ul li #nav2.selected { background:url(/images/nav.gif) -55px -71px no-repeat; } #header ul li #nav3:hover, #header ul li #nav3.selected { background:url(/images/nav.gif) -165px -71px no-repeat; } #header ul li #nav4:hover, #header ul li #nav4.selected { background:url(/images/nav.gif) -233px -71px no-repeat; } #header ul li #nav5:hover, #header ul li #nav5.selected { background:url(/images/nav.gif) -290px -71px no-repeat; } #header ul li #nav6:hover, #header ul li #nav6.selected { background:url(/images/nav.gif) -346px -71px no-repeat; } #header ul li #nav7:hover, #header ul li #nav7.selected { background:url(/images/nav.gif) -424px -71px no-repeat; } #header ul li #nav8:hover, #header ul li #nav8.selected { background:url(/images/nav.gif) -487px -71px no-repeat; } #locations ul { position:absolute; left:198px; font-size: 1px; top:75px; list-style:none; margin:0; padding:0; width:559px; height:10px; } #locations ul li { display:block; float:left; } #locations ul li a { background:none; margin-left:0; display:block; width:0; height:0; } #locations #cnav-0 { background: url(/images/chapters_locations.gif) 0 0 no-repeat; width:72px; height:10px; } #locations #cnav-1 { background: url(/images/chapters_locations.gif) -72px 0 no-repeat; width:48px; height:10px; } #locations #cnav-2 { background: url(/images/chapters_locations.gif) -120px 0 no-repeat; width:39px; height:10px; } #locations #cnav-3 { background: url(/images/chapters_locations.gif) -159px 0 no-repeat; width:56px; height:10px; } #locations #cnav-4 { background: url(/images/chapters_locations.gif) -215px 0 no-repeat; width:66px; height:10px; } #locations #cnav-5 { background: url(/images/chapters_locations.gif) -281px 0 no-repeat; width:77px; height:10px; } #locations #cnav-6 { background: url(/images/chapters_locations.gif) -358px 0 no-repeat; width:89px; height:10px; } #locations #cnav-7 { background: url(/images/chapters_locations.gif) -447px 0 no-repeat; width:77px; height:10px; } #locations #cnav-8 { background: url(/images/chapters_locations.gif) -524px 0 no-repeat; width:35px; height:10px; } #locations #cnav-0:hover, #locations ul li #cnav-0.selected { background: url(/images/chapters_locations.gif) 0 -12px no-repeat; } #locations #cnav-1:hover, #locations ul li #cnav-1.selected { background: url(/images/chapters_locations.gif) -72px -12px no-repeat; } #locations #cnav-2:hover, #locations ul li #cnav-2.selected { background: url(/images/chapters_locations.gif) -120px -12px no-repeat; } #locations #cnav-3:hover, #locations ul li #cnav-3.selected { background: url(/images/chapters_locations.gif) -159px -12px no-repeat; } #locations #cnav-4:hover, #locations ul li #cnav-4.selected { background: url(/images/chapters_locations.gif) -215px -12px no-repeat; } #locations #cnav-5:hover, #locations ul li #cnav-5.selected { background: url(/images/chapters_locations.gif) -281px -12px no-repeat; } #locations #cnav-6:hover, #locations ul li #cnav-6.selected { background: url(/images/chapters_locations.gif) -358px -12px no-repeat; } #locations #cnav-7:hover, #locations ul li #cnav-7.selected { background: url(/images/chapters_locations.gif) -447px -12px no-repeat; } #locations #cnav-8:hover, #locations ul li #cnav-8.selected { background: url(/images/chapters_locations.gif) -524px -12px no-repeat; } /** * 4. Navigation - Left Bar */ #left-col ul { list-style:none; margin:0; padding:0; } #left-col ul li { margin-bottom:14px; } #nav-dreams { display:block; background:url(/images/left-nav_dreams_off.gif) 0 0 no-repeat; width:142px; height:51px; } #nav-needs { display:block; background:url(/images/left-nav_needs_off.gif) 0 0 no-repeat; width:142px; height:50px; } #nav-donations { display:block; background:url(/images/left-nav_donations_off.gif) 0 0 no-repeat; width:142px; height:51px; } #nav-news { display:block; background:url(/images/left-nav_news.gif) 0 0 no-repeat; width:142px; height:50px; } #nav-dreams:hover, #nav-dreams.selected { background:url(/images/left-nav_dreams_on.gif) 0 0 no-repeat; } #nav-needs:hover, #nav-needs.selected { background:url(/images/left-nav_needs_on.gif) 0 0 no-repeat; } #nav-donations:hover, #nav-donations.selected { background:url(/images/left-nav_donations_on.gif) 0 0 no-repeat; } /** * 5. Content */ #double-col h3, #middle-col h3 { font-size:12px; margin-top:0px; padding:13px 15px; color:#ed1f24; font-weight:bold; border-top:solid 1px #c7c7c7; border-bottom:solid 1px #c7c7c7; } #double-col h3 img { margin-right:10px; } #double-col h3 ul { display:inline; list-style:none; margin:0; padding:0; } #double-col h3 ul li { display:inline; } #double-col h3 ul li a { display:inline; color:#777; text-decoration:none; font-style:italic; } #double-col h3 ul li a.selected { color:#ed1f24; } #double-col h2, #middle-col h2 { font-size:14px; margin-left:15px; letter-spacing:3px; font-style:italic; } #double-col h3 #names { display:block; position: absolute; top:126px; left: 460px; } #double-col h3 #names li { display:block; margin-bottom: 8px; } #content { margin-left:30px; font-weight:normal; font-style:italic; } * html #content { margin-top: 5px; } #content fieldset { border: none; margin: 0; padding: 0; } #content fieldset input { display:block; margin: 0 0 10px 0; padding: 0; } * html #content fieldset input { margin-left: -30px; } #content fieldset textarea { display:block; margin-bottom:10px; } #content fieldset legend { color:#ed1f24; display: none; } #content ul { margin-right: 150px; } #content li { margin-bottom: 10px; } #content fieldset input.r { display: inline; margin-bottom: 0; } * html #content fieldset input.r { margin-left: 0; } #content label.r { display: inline; } #content fieldset textarea { width: 300px; height: 100px; } * html #content fieldset textarea { margin-left: -30px; } #make_donation { display:block; margin:0; padding:0; width:142px; height:30px; background:url('/images/btn_make_a_donation.gif') top left no-repeat; text-indent:-9999px; } #find_facebook { display:block; margin:0; padding:0; width:142px; height:30px; background:url('/images/btn_facebook.gif') top left no-repeat; text-indent:-9999px; } #people { list-style:none; margin:0; padding:0; margin-left:15px; } #people li { float:left; } #people a { display:block; height:239px; } #person-dreams { width:181px; background:url(/images/person-dreams_off.jpg) 0 0 no-repeat; } #person-needs { width:181px; background:url(/images/person-needs_off.jpg) 0 0 no-repeat; } #person-donations { width:184px; background:url(/images/person-donations_off.jpg) 0 0 no-repeat; } #person-dreams:hover, #person-dreams.selected { background:url(/images/person-dreams_on.jpg) 0 0 no-repeat; } #person-needs:hover, #person-needs.selected { background:url(/images/person-needs_on.jpg) 0 0 no-repeat; } #person-donations:hover, #person-donations.selected { background:url(/images/person-donations_on.jpg) 0 0 no-repeat; } #events #content img { float: right; border: 3px solid #000; padding: 0; margin: 0; } #events #content p { margin-right: 150px; } #events #content h4 { margin-bottom: -12px; padding: 0; clear: both; color: #ed1f24; font-size:13px; font-weight: bold; } #events p.more { margin-top: -12px; text-align: right; } #events p.more.left { text-align:left; } #videos #content p { margin: 10px 160px 0 120px; padding-left: 0; } #videos #content p.regular { margin: 0; padding-left: 0; } #videos #content img { float: left; padding: 0; margin: -2px 0 0 0; } #videos #content h4 { margin: 0 200px -12px 120px; padding: 0; color:#ed1f24; } #videos #content p.types { margin-top: 0; margin-bottom: 20px; } #videos #getVideoPlayer { float: right; margin: -10px 0 0 0; padding: 0; } #videos #getVideoPlayer p { font-style: italic; text-align: right; } #videos #getVideoPlayer a { margin: 0; padding: 0; } #chapters #content #map { float: left; margin-left: 60px; } #chapters #locationtext { float: right; margin-right: 40px; } #chapters #locationtext a { color: #000; text-decoration: none; display: block; } #chapters #locationtext a span { color: #ed1f24; display: inline; } #chapters #locationtext a:hover, #chapters #locationtext a.selected { color: #ed1f24; text-decoration: none; } #chapters #locationtext { list-style: none; margin: 0 30px 60px 0; padding: 0; } #chapters #locationtext li { font-weight: bold; padding: 0; margin: 3px 0; } * html #chapters #locationtext { margin: 0; padding: 0; margin-right: 15px; } * html #chapters #locationtext li { margin: 0; padding: 0; line-height: 10px; } * html #chapters #locationtext li a { margin: 0; padding: 0; } #chapters h2 { margin-bottom: 0; padding-bottom: 0; } #chapters #text { float: left; margin: 0 0 0 16px; padding: 0; width: 300px; } *html #chapters #text { float: left; margin:0 0 0 6px !important; padding: 0; width: 300px; } #chapters #text p { margin: 0 0 20px 0; padding: 0; font-style: italic; } #chapters #address { clear: left; } #chapters #address p { font-style: normal; font-size: 120%; } #chapters #chapters_nm { position: absolute; top: 140px; left: 530px; padding: 0; margin: 0; } #chapters #chapters_tx { position: absolute; top: 140px; left: 520px; padding: 0; margin: 0; } #chapters #chapters_ar { position: absolute; top: 140px; left: 530px; padding: 0; margin: 0; } #chapters #chapters_la { position: absolute; top: 140px; left: 533px; padding: 0; margin: 0; } #chapters #chapters_ok { position: absolute; top: 140px; left: 520px; padding: 0; margin: 0; } #thanks #content ul { margin-left: 0; padding-left: 0; list-style-type: none; } #thanks #content ul li { font-weight: bold; margin: 0; padding: 0; } #thanks #content ul ul li { font-weight: normal; } #newsletter #content h4 { color: #ed1f24; } #newsletter #content ul { list-style-type: disc; } #newsletter #content ul li { margin: 0 auto; padding: 0; } #sitemap #content ul { margin-top: 10px; margin-right:0px !important; } /** * 5. Footer */ #footer ul { float:right; list-style:none; display:inline; margin:0; padding:0; } #footer ul li { display:block; float:left; margin-left:10px; } #footer p { margin: 0; padding: 0; } #footer p { margin-right: 0; } #disclaimer { font-style: normal; } /** * 6. Random Crap */ .red { color: #ed1f24; }