/*
-----------------------------------------------------
Cue The Sun advanced style sheet for screen media
created: 19th May 2007
by: ben ryan 
last updated: 19th May 2007.
by: ben ryan 

Still a lot of working code in this one - to be refined after everything goes up.
-----------------------------------------------------
*/

@import url("base.css");

/*
-- Generic declarations 
-----------------------------------------------------------------------*/


body { background: #000000 url('../common/night_bg.jpg') fixed bottom left repeat-x; /**/ }
* html body { /**/}

a { color: #ffffff; }

a:focus { outline: 2px solid #fc0; }




h1,h2,h3,h4,h5,h6 { color: #94cc5d; }

p.first { background-color: #EFF1D7; border: 1px dotted #D6D8BC; }

p.toTop { border-top: 1px dotted #40651B;  }

/*
--- Structural elements
----------------------------------------------------------------------- */




/* The masthead and navigation
-----------------------------------------------------------------------*/

html>body h1#title a { background: transparent url('../common/logo.png') 0 0 no-repeat; }
html>body h1#title a:hover { background: transparent url('../common/logo_on.png') 0 0 no-repeat; }



/*
-- Primary Navigation ----------------*/

div#primaryNav ul li a { color: #ffcc00; /**/ }
div#primaryNav ul li a:hover { color: #fff; /*background: #fc0; */ }



/*
-- Secondary Navigation ----------------*/

div#secondaryNav ul li a { color: #ffcc00; /*border: 1px solid #fc0; margin: 0 .2em 0 0; */ }
div#secondaryNav ul li a:hover { color: #fff; }

div#secondaryNav ul li#hiCon { display: none; }


div#secondaryNav ul li#fontUp a { background: transparent url('../nav/fontUp.gif') 0 0 no-repeat; /**/  }
div#secondaryNav ul li#fontDown a { background: transparent url('../nav/fontDown.gif') 0 0 no-repeat; /**/  }
div#secondaryNav ul li#hiCon a { background: transparent url('../nav/hiCon.gif') 0 2px no-repeat; /**/  }
div#secondaryNav ul li#loCon a { background: transparent url('../nav/loCon.gif') 0 2px no-repeat; /**/  }
div#secondaryNav ul li#en a { background: transparent url('../nav/enLang.gif') 0 0 no-repeat; /**/  }
div#secondaryNav ul li#es a { background: transparent url('../nav/esLang.gif') 0 0 no-repeat; /**/  }
div#secondaryNav ul li#webcore a, div#secondaryNav ul li#sym a { color: #ADE0FD; /**/  }


div#secondaryNav ul li#fontDown a:hover { background: transparent url('../nav/fontDown.gif') 0 -14px no-repeat; /**/  }
div#secondaryNav ul li#hiCon a:hover { background: transparent url('../nav/hiCon.gif') 0 -12px no-repeat /**/  }
div#secondaryNav ul li#loCon a:hover { background: transparent url('../nav/loCon.gif') 0 -12px no-repeat; /**/  }
div#secondaryNav ul li#en a:hover { background: transparent url('../nav/enLang.gif') 0 -14px no-repeat; /**/  }
div#secondaryNav ul li#es a:hover { background: transparent url('../nav/esLang.gif') 0 -14px no-repeat; /**/  }
div#secondaryNav ul li#webcore a:hover, div#secondaryNav ul li#sym a:hover { color: #ffffff; }


/* 
-- The content proper -------------------------------------------------

-- Breadcrumb----------------*/

div#bc { color: #94cc5d; background: transparent url('../common/top_corner_hicon.png') 100% 0 no-repeat; /**/ }
div#bc ul { background: #000000; /**/ }




/*
-- General and/or universal declarations */

div#contentWrapper { background: url('../common/content_right_side_hicon.png') 100% 0 repeat-y; color: #e9cc8e; /**/ }



div#top { background: #000000; border-top: 5px solid #2083aa; border-bottom: 5px solid #4a5e3b; /**/ }

div#bottom { background: #000000; border-top: 5px solid #4a5e3b; border-bottom: 5px solid #2083aa; }



div.entry h3, div.entry h4 { color: #5a7c39; }
div.sidebar h3, div.sidebar h4, div.sidebar p { color: #2083aa; }
div.sidebar ul { list-style-image: url('../common/arrow_bullet.png'); }

div#map { border: 1px solid #866A4B; /**/ }



/*
-- Front page specific ----------------*/


div#viewport li.hori div { background: url('../shutterbug/horiMask.png') no-repeat; }
div#viewport li.vert div { background: url('../shutterbug/vertMask.png') no-repeat; }

div#viewport li.current div div.info { background: url('../shutterbug/photo_info_bg.png') bottom left repeat-x; }


/*
-- About, contact, legals etc ----------------*/
h2#about { background: url('../en/colonophon_headtext.png') top left no-repeat; }
h2#contact { background: url('../en/contact_headtext.png') top left no-repeat; }


/*
-- Transmissions from the last place on earth - the weblog ----------------*/
h2#ttlpoe { background: url('../en/ttlpoe_headtext.png') top left no-repeat; }






/*
-- Work folio ----------------*/
h2#working-life { background: url('../en/workinglife_headtext.png') top left no-repeat; }

dt.pdf { background: url('../common/pdf.gif') 0% 0% no-repeat; }
dt.weblink { background: url('../common/weblink.gif') 0% 0% no-repeat; }


/*
-- Wordsworth ----------------*/
h2#wordsworth { background: url('../en/wordsworth_headtext.png') top left no-repeat; }


body.wordsworth div.sidebar ul { list-style-image: url('../common/arrow_bullet.png'); }





/*
-- comments stuff ----------------*/
a.comments span { background: url('../common/logo_comments_open_hicon.png') 50% 0% no-repeat; color: #ffffff; }
a.comments span.closed { background: url('../common/logo_comments_closed_hicon.png') 50% 0% no-repeat; }


div.comments { }
div.comments div { border-top: 1px solid #faf9f4; }
div.comments div.ben { color: #FE7E00; background: #0D123A url('../common/dawn_bg.jpg') fixed bottom left repeat-x; }
div.comments div.alt { background: url('../common/comment_bg.png') top left repeat-x; border-top: 1px solid #faf8e7; }
div.comments div.yelluh { color: #ffcc00; background: url('../common/yelluh_bg.gif') top left repeat; border-left: 6px solid #ffec9e; border-top: none; }

form.comments { border-top: 1px solid #e8e8e8; }
form.comments fieldset { border: none; }
form.comments fieldset.radio {  }
form.comments fieldset.radio legend {  }
div.comments div.section { background: none; border-bottom: 1px solid #CDCDCD; border-top: none; }



/*
-- Shutterbug -------------------------------------------------------
The "gallery" div is the horizontal bar that feeds images to the top area. The "galleries" div is the mass of thumbnails at the bottom where the activate a gallery.
*/
h2#shutterbug { background: url('../en/shutterbug_headtext.png') top left no-repeat; }


body.shutterbug div.galleries li div, body.shutterbug div#gallery li div { background: url('../shutterbug/gallery_frame_sm.png') no-repeat; }
body.shutterbug div.galleries li.vert div, body.shutterbug div#gallery li.vert div { background: url('../shutterbug/gallery_frame_sm_vert.png') no-repeat; }





/*
-- Australian dawn ------------------------------------------------*/

div#footer { margin: 0; padding: 0; width: 100%; height: 145px; position: fixed; bottom: 0; z-index: 1100; /**/ }
html>body div#footer { background: transparent url('../common/night_content_overlay.png') 50% 0 no-repeat; /**/ }

div#footerInner { position: fixed; bottom: 0; left: 0; margin: 0; padding: 0; height: 100px; width: 100%; z-index: 1100; /**/ }
html>body div#footerInner { background: transparent url('../spain/aqueduct.png') 0% 103% fixed repeat-x; /**/ }






div#contentUnderlay { background: url('../common/content_bottom_hicon.png') 0% 0% repeat-x; /**/ }

div#underlayOverlay { background: url('../common/content_right_side_sm_hicon.png') 100% 0% repeat-y; /**/ }



div#footerOne { position: fixed; left: 20%; bottom: -20px; height: 270px; width: 236px; z-index: 1100; background: url('../spain/lamancha_windmill.gif') no-repeat; /**/ }
html>body div#footerOne { background: url('../spain/lamancha_windmill.png') no-repeat; /**/ }

div#footerTwo { position: fixed; right: 30%; bottom: 0; height: 162px; width: 85px; z-index: 1100; background: url('../spain/wind_turbine_sm.gif') no-repeat; /**/ }
html>body div#footerTwo { background: url('../spain/wind_turbine_sm.png') no-repeat; /**/ }

div#footerThree { position: fixed; right: 22%; bottom: 0; height: 203px; width: 122px; z-index: 1100; background: url('../spain/wind_turbine_med.gif') no-repeat; /**/ }
html>body div#footerThree { background: url('../spain/wind_turbine_med.png') no-repeat; /**/ }

div#footerFour { position: fixed; right: 17%; bottom: 0; height: 240px; width: 150px; z-index: 1100; background: url('../spain/wind_turbine_lg.gif') no-repeat; /**/ }
html>body div#footerFour { background: url('../spain/wind_turbine_lg.png') no-repeat; /**/ }


div#sideShowLeft { position: fixed; bottom: 0; left: -400px; height: 300px; width: 935px; z-index: 1200; /**/ }
html>body div#sideShowLeft { background: transparent url('../spain/torre_de_hercules_hicon.png') no-repeat; /**/ }

div#sideShowCentre { position: fixed; bottom: 0; left: 40%; height: 183px; width: 189px; z-index: 1; /**/ }
html>body div#sideShowCentre { background: url('../spain/alcazar_de_segovia.png') no-repeat top right; /**/ }

div#sideShowRight { position: fixed; bottom: 0; right: -40px; height: 333px; width: 271px; z-index: 1200; /**/ }
html>body div#sideShowRight { background: url('../spain/la_sagrada_familia.png') 100% 20% no-repeat; /**/ }



html>body div#randomFooterOne { position: fixed; bottom: 0; right: 15%; height: 182px; width: 450px; background: url('../common/moon_rising.png') no-repeat; z-index: 100;/**/ }

div#moonLow { position: fixed; top: 20%; left: 10%; height: 169px; width: 265px; z-index: 0;/**/ }
html>body div#moonLow { display: none; /**/ }



div#southernCross { position: fixed; top: 10px; right: 5%; height: 378px; width: 310px; z-index: 1; /**/ }







div#starsOne { position: fixed; top: 20%; right: 50%; height: 29px; width: 127px; z-index: 1; /**/ }
html>body div#starsOne { background: url('../common/star_cluster_001.png') no-repeat; /**/ }

div#starsTwo { position: fixed; top: 40%; left: 17%; height: 10px; width: 14px; z-index: 1; /**/ }
html>body div#starsTwo { background: url('../common/star_cluster_002.png') no-repeat; /**/ }

div#starsThree { position: fixed; top: 5%; left: 75%; height: 75px; width: 122px; z-index: 1; /**/ }
html>body div#starsThree { background: url('../common/star_cluster_003.png') no-repeat; /**/ }

div#starsFour { position: fixed; top: 40%; left: 40%; height: 19px; width: 13px; z-index: 1; /**/ }
html>body div#starsFour { background: url('../common/star_cluster_004.png') no-repeat; /**/ }

div#starsFive { position: fixed; top: 5%; left: 10%; height: 22px; width: 10px; z-index: 1; /**/ }
html>body div#starsFive { background: url('../common/star_cluster_005.png') no-repeat; /**/ }

div#starsMars { position: fixed; top: 50%; left: 10%; height: 17px; width: 14px; z-index: 1; /**/ }
html>body div#starsMars { background: url('../common/mars.png') no-repeat; /**/ }

div#starsMilkyWay { position: fixed; top: 0%; left: 40%; /**/ }