/* CSS Document */ /************************************************************************ Site: Chanette Paul Author: Sandra Barkhuizen [sandra@maxitec.co.za] Listing Order: ============== 1 - Universal 2 - Structure/Layout 3 - Main Navigation (Left) 4 - Images 5 - Footer/Labels 6 - Headings 7 - Forms 8 - Newsletter Scroller /*********************************************************************** 1 - UNIVERSAL STYLES ************************************************************************/ body { margin:0; padding:0; background:url(../images/back.gif) #a6a6cf repeat-x; font: 75%/1.25em Georgia, "Times New Roman", Times, serif; color: #492b27; line-height: 150%; } a { color:#558e88; } a:hover { color: #fff; text-decoration:none; } .clear { margin:0; clear:both; } /*********************************************************************** 2 - Structure/Layout ************************************************************************/ #wrapper { margin:0 auto; width:1014px; } #banner { background:url(../images/chanettePaulLogo.gif) no-repeat; height:158px; margin:0 0 0 36px; } #banner img { margin:0 0 0 664px;} #container {} #navigation { width:36px; float:left; display:block; } #navigation ul { margin:0; padding:0; } #navigation li { list-style:none;} #navigation #huis a { width:36px; height:116px; background:url(../images/tuisblad.gif) no-repeat top left; display:block;} #navigation #huis a:hover { width:36px; height:116px; background:url(../images/tuisblad_over.gif) no-repeat top left; display:block;} #navigation #kontak a { width:36px; height:116px; background:url(../images/kontakmy.gif) no-repeat top left; display:block;} #navigation #kontak a:hover { width:36px; height:116px; background:url(../images/kontakmy_over.gif) no-repeat top left; display:block;} #navigation #home a { width:36px; height:116px; background:url(../images/home.gif) no-repeat top left; display:block;} #navigation #home a:hover { background:url(../images/home_hover.gif) no-repeat top left; } #navigation #contact a { width:36px; height:116px; background:url(../images/contactMe.gif) no-repeat top left; display:block;} #navigation #contact a:hover { background:url(../images/contactMe_over.gif) no-repeat top left;} #content { width:948px; background:url(../images/pagBack.gif) repeat-y left top; float:left;} #image { width:889px; display:block; margin:0 88px 2em 88px;} #image img { border:0;} hr { background:url(../images/hr.gif); width:775px; height:8px; border:1px solid #fff; margin:0 auto;} .introImage { float:left; } .introImage img { border:10px solid #c1d0bc;} .introImage p { margin:.5em 0 2em 0; padding:0; text-align:center; font-size:10px;} #intro { width:770px; display:block; margin:2em 0 0 7.5em;} .introBox { width:513px; background:url(../images/welcomeBottom.gif) no-repeat bottom left #c8c9f4; float:right; } .introBox p { margin:0 3em 0 3em; padding:0 0 1.5em 0;} .introBox h1 { background:url(../images/welcomeTop.gif) no-repeat top left; margin:0; padding:1em 1em .5em 1.35em; font-size:2em; font-family:Geneva, Arial, Helvetica, sans-serif; color:#666699;} .introBox img { float:right; margin:0 1em 0 0; border:0;} .introBox h2 { margin:0 2em 0 2em; line-height:26px;} .introBox h3 { margin:1em 2em 0 2.75em; line-height:26px; color:#666;} .introBox ol { margin:0 0 0 0; padding:0 3em 0 6em;} .introBox li { margin:0 0 0 0; padding:0 0 2em 0; display:block;} .introBox ul { margin:0 0 0 0; padding:0 3em 0 6em;} .hyperLinks { background-color:#d3d4f6; width:80%; border:1px dashed #fff; margin:1em auto; padding:1em; } .hyperLinks ol { margin:0 0 0 0; padding:1em 3em 1em 0;} .hyperLinks ul { margin:0 0 0 0; padding:1em 3em 1em 2em;} .hyperLinks h2 { margin:0 1em 0 .75em; line-height:26px;} .hyperLinks li { margin:0 0 0 0; padding:0 0 0 0; display:block;} .hyperLinks p { margin:0 1em 0 1em; padding:0 0 1.5em 0;} #springgety { width:770px; display:block; margin:2em 0 0 7.5em;} .spIntroBox { width:513px; background:url(../images/springgety_boxBottom.gif) no-repeat bottom left #b7d5e5; float:right; } .spIntroBox p { margin:0 3em 0 3em; padding:0 0 1.5em 0;} .spIntroBox h1 { background:url(../images/springgety_boxTop.gif) no-repeat top left; margin:0; padding:1em 1em .5em 1.35em; font-size:2em; font-family:Geneva, Arial, Helvetica, sans-serif; color:#4e7d96;} .spIntroBox img { float:right; margin:0 1em 0 0; border:0;} .spIntroBox h2 { margin:0 2em 0 2em; line-height:26px;} .spIntroBox h3 { margin:1em 2em 0 2.75em; line-height:26px; color:#666;} #ddr { width:770px; display:block; margin:2em 0 0 7.5em;} .ddrIntroBox { width:513px; background:url(../images/ddr_bottom.gif) no-repeat bottom left #8d5167; float:right; } .ddrIntroBox p { margin:0 3em 0 3em; padding:0 0 1.5em 0; color:#FFF;} .ddrIntroBox h1 { background:url(../images/ddr_top.gif) no-repeat top left; margin:0; padding:1em 1em .5em 1.35em; font-size:2em; font-family:Geneva, Arial, Helvetica, sans-serif; color:#fff;} .ddrIntroBox img { float:right; margin:0 1em 0 0; border:0;} .ddrIntroBox h2 { margin:0 2em 0 2em; line-height:26px;} .ddrIntroBox h3 { margin:1em 2em 0 2.75em; line-height:26px; color:#666;} #coverBox { width:774px; background:url(../images/bookBottom.gif) no-repeat bottom left #b7d5e5; display:block; margin:2em 0 0 7.5em; } #coverBox #coverLeft { background:url(../images/backCover.gif) repeat-x; width:249px; float:left;} #coverBox #coverLeft img { margin: 5px 0 0 0;} #coverBox #coverLeft p {margin:1em 2em 0 2em; font-size:11px; padding:0 0 1em 0; } #coverBox #coverLeft_new { background:url(../images/backCover.gif) repeat-x; width:249px; float:left;} #coverBox #coverLeft_new img { margin: 5px 0 0 0;} #coverBox #coverLeft_new p {margin:1em 2em 0 2em; font-size:11px; padding:0 0 1em 0; } #coverBox #coverRight { float:right; width:524px; border-left:1px dashed #4e7d96;} #coverBox #coverRight h3 { background:url(../images/fortuin.gif) no-repeat; width:525px; height:76px; margin:0; padding:0;} #coverBox #coverRight p { margin:.25em 3em 0 3.25em; padding:0 0 1em 0;} #coverBox #coverRight_new { float:right; width:524px; border-left:1px dashed #4e7d96;} #coverBox #coverRight_new h3 { background:url(../images/boheem.gif) no-repeat; width:525px; height:76px; margin:0; padding:0;} #coverBox #coverRight_new p { margin:.25em 3em 0 3.25em; padding:0 0 1em 0;} #coverRight img { float:right; margin:0 1em 0 0; border:0; } #coverRight_new img { float:right; margin:0 1em 0 0; border:0; } #coverLeft .coverImg { border:10px solid #fff; display:block; margin:1em 0 0 2em; padding:0; width:155px; height:242px; } #coverLeft_new .coverImg { border:10px solid #fff; display:block; margin:1em 0 0 2em; padding:0; width:155px; height:242px; } #quoteBox { width:774px; background:url(../images/quoteBottom.gif) no-repeat bottom left #8d5167; display:block; margin:2em 0 0 7.5em; } #quoteBox #quoteLeft { background:url(../images/backQuote.gif) repeat-x; width:249px; float:left;} #quoteBox #quoteLeft img { margin: 5px 0 0 0;} #quoteBox #quoteLeft p { margin:1em 2em 0 2em; color:#FFF; font-size:11px; padding:0 0 1em 0;} #quoteBox #quoteLeft strong { color:#291723; font-weight:normal;} #quoteBox #quoteRight { float:right; width:524px; border-left:1px dashed #fff; } #quoteBox #quoteRight h3 { background:url(../images/springgetyHeading.gif) no-repeat; width:525px; height:76px; margin:0; padding:0;} #quoteBox #quoteRight p { margin:.75em 3em 0 3.25em; padding:0 0 1em 0; color:#FFF;} #quoteRight img { float:right; margin:1em 1em 1em 3em; border:10px solid #fff; } #quoteLeft .quoteImg { border:10px solid #fff; display:block; margin:1em 0 0 2em; padding:0; width:155px; height:242px; } #quoteBox #quoteRight a { color:#FFF;} #footer { text-align:center; color:#0191c8; } #footer img { border:0;} #quoteBox #quoteRight_stories h3 { background:url(../images/stories.gif) no-repeat; width:525px; height:76px; margin:0; padding:0;} #quoteBox #quoteRight_stories { float:right; width:524px; border-left:1px dashed #fff; } #quoteBox #quoteRight_stories p { margin:.75em 3em 0 3.25em; padding:0 0 1em 0; color:#FFF;} #quoteRight_stories img { float:right; margin:1em 1em 1em 3em; border:10px solid #fff; } #quoteRight_stories ul li a { color: #fff; } #quoteBox01 { width:774px; background: #8d5167; display:block; margin:2em 0 0 7.5em; } #quoteBox01 p { color:#FFF; font-size:12px; margin: 10px 10px 10px 25px; } #quoteBox01 img { float:right; margin:1em 1em 1em 3em; border:10px solid #fff; } #quoteBox01 ul li a { color: #fff; } #english { display:block; float:right; } #english ul { margin:0; padding:0; } #english li { list-style:none;} #english li a { background:url(../images/english.gif) no-repeat; width:39px; height:114px; display:block;} #english li a:hover { background:url(../images/english_over.gif);} #afrikaans { display:block; float:right; } #afrikaans ul { margin:0; padding:0; } #afrikaans li { list-style:none;} #afrikaans li a { background:url(../images/afrikaans.gif) no-repeat; width:39px; height:114px; display:block;} #afrikaans li a:hover { background:url(../images/afrikaans_over.gif);} #nav { margin:2em 5em 2em 7.5em; color:#999;} #nav ul { margin:0; padding:0;} #nav li { display: inline;} #nav a { text-decoration:none; color:#008caa; font-size:19px; } #nav a:hover { color:#8db1b9;}