/* CSS for Esendionline.com (original site) Stuart Stansfield April 2007 First clear out all settings which may be inserted automatically by some browsers. Doing this gives us a clean start with no problems with the way different browsers interpret the XHTML and CSS code */ body, h1, h2, h3, h4, h5, h6, p, ol, ul, form, blockquote { padding: 0; margin: 0; } h1, h2, h3, h4, h5, h6, pre, code { font-size: 1em; } a { text-decoration: none; } a img { border: 0; } /* End of preliminary clear out */ /* General settings */ body { font-family: Arial, Verdana, Helvetica, sans-serif; background-color: #ffcc66; } /* Banner items >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/ #banner { margin: 0; padding: 0; background-color: #dbba77; border-top: 3px solid #cc9933; } /* #map, #pagetitle, #subtitle, #note, #back absolutely positioned within #banner */ #map { position: absolute; font-size: small; color: #894909; } #pagetitle { position: absolute; top: 0; left: 260px; } #subtitle { position: absolute; top: 32px; left: 260px; } #note { position: absolute; top: 7px; left: 610px; width: 160px; border: 1px solid #894909; padding: 3px; } #back { position: absolute; top: 30px; left: 610px; } #pagetitle p { font-size: x-large; font-weight: bold; color: white; } #subtitle p { font-size: medium; font-weight: bold; color: white; } #tagline { background: #ffcc66 url(backgrounds/hfade.jpg) repeat-y top left; } #tagline p { font-style: italic; font-family: Georgia, Times, serif; border-top: 3px solid #cc9933; border-bottom: 3px solid #cc9933; padding-top: .2em; padding-bottom: .2em; padding-left: .8em; margin: 0; } #note p { font-size: x-small; font-weight: normal; color: #894909; } h1 { font-size: x-large; color: #e3c280; padding-top: 2em; padding-bottom: .2em; padding-left: .4em; margin: 0; } h2 { color: #894909; font-size: 130%; font-weight: normal; padding-top: 15px; padding-bottom: 5px; margin-top: 15px; } /* General list (li) settings */ li { font-size: small; list-style-type: none; } /* General paragraph (p) settings */ p { padding-top: 1em; font-size: small; color: #894909; } /* bodycontent is default for rest of page under banner */ #bodycontent { margin: 0; padding: 0; position: relative; width: 780px; } /* Navigation sidebar >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */ #navigation { width: 160px; float: left; margin-right: 10px; } #nav1, #nav3 { height: 107px; background: #dbba77 url(backgrounds/indalo1.jpg) repeat-x; } #nav2 { height: 264px; background: #dbba77 url(backgrounds/button1.jpg) repeat-y; line-height: 33px; } ul.blok a { display: block; } #nav2 a { padding-left: 30px; color: #704d08; font-weight: bold; } #nav2 a:visited { } #nav2 a:hover { color: white; } #nav2 a:active { } ul.blok a#here { color: yellow; } #nav3 p { font-size: 75%; font-weight: bold; color: yellow; padding: 5px; } /* Right hand sidebar........................*/ #right { float: right; width: 250px; margin-left: 10px; border-left: 2px solid #c93; padding: 10px; } #secondary p { font-style: italic; font-size: 75%; line-height: 120%; } .hcol3 { font-weight: bold; text-decoration: underline; } /* Three column (after navigation bar) layout >>>>>>>>>*/ #one, #two, #three { float: left; width: 180px; padding-left: 20px; } .bold li { font-weight: bold; color: #704d08; } #one a, #two a, #three a { color: #704d08; font-weight: bold; } #one a:visited, #two a:visited, #three a:visited { color: #894909; } #one a:hover, #two a:hover, #three a:hover { text-decoration: none; color: white; } #one a:active, #two a:active, #three a:active { color: yellow; } #events { left: 180px; width: 600px; } #events p { font-size: small; } .month { font-size: small; font-weight: bold; text-decoration: underline; } /* Full page layout - no navigation bar */ #full p { padding-left: 15px; } /* Thumbnails */ #selector { line-height: 150%; margin-left: 190px; } #thumbs td.thumb { width: 100px; border-style: solid; border-color: #894909; border-width: 1px; vertical-align: middle; font-family: "Comic Sans MS", Arial, Verdana, Helvetica, sans-serif; font-size: 3em; color: white; text-align: center; padding: 5px; } #thumbs { margin-left: 50px; } .alpha { background: url(backgrounds/camera.gif) center center no-repeat; } /* Gallery - individual photos */ #descriptions { padding: 10px 5px 10px 5px; } div.ad { float: left; width: 130px; margin: 5px 10px 20px 10px; padding: 10px 5px 5px 5px; background: white; text-align: center; } p.adim { padding-top: 0; } p.adtag { padding-top: 10px; font-weight: bold; } p.xsm { font-size: x-small; font-weight: bold; } #fullphoto { width: 610px; float: left; margin-right: 10px; } #fullphoto img { border: 5px solid white; } /* Contact Us page */ #advert { float: left; border: 5px double #894909; padding-left: 10px; padding-right: 10px; padding-bottom: 15px; } /* picture floats */ #leftfloat { float: left; width: 48%; padding: 5px; margin-right: 20px; } #rightfloat { float: right; width: 48%; padding: 5px; margin-left: 10px; } /* General settings for LINKS (a) Including settings for different states NOTE! these must be specified in this order */ a { color: #704d08; font-weight: bold; } a:visited { color: #894909; } a:hover { text-decoration: none; color: white; } a:active { color: yellow; }