html { overflow-y: scroll; }  /* prevent scrollbar appearing making page jump */
BODY { margin: 0; font-family: Arial, sans-serif; font-size: 12px; color: black; background: #1b2514; }
FORM { display: block; margin: 0; }
INPUT, SELECT, TEXTAREA { font-family: Arial, sans-serif; font-size: 12px; color: black; }
A IMG { border: none; }
LI { margin: 0 0 5px 0; }

BODY.mceContentBody { background-color: White; }

/* copy these to admin.css to make them work in the mceEditor */
H1 { font-size: 14px; font-weight: bold; color: #14733f; text-transform: uppercase; margin: 0; }
H2 { font-size: 10px; font-weight: bold; color: black; text-transform: uppercase; margin: 0 0 7px 0; padding: 0; line-height: 10px; }
H3 { font-size: 16px; font-weight: bold; color: #0072bd; margin: 0 0 1px 0; }
H4 { font-size: 12px; font-weight: bold; color: #4b4b4b; text-transform: uppercase; margin: 0 0 1px 0; }
.main P, .mceContentBody P { line-height: 18px; margin: 10px 0 10px 0; font-size: 13px; }
/*
TODO: create a class for text areas?

.main UL, .mceContentBody UL { list-style: square outside; margin: 0 0 10px 17px; padding: 0; }
.main OL, .mceContentBody OL { list-style: outside; margin: 2px 0 0 17px; padding: 0; }
.main LI, .mceContentBody LI { margin: 2px 0 4px 0; line-height: 20px;  }
*/
.main A, .mceContentBody A { color: #0072bd; text-decoration: none; border-bottom: dotted 1px black; }

.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }

/* headings */
H1.image, H2.image { text-indent: -9999px; }

H1.additional_bits { background: url("images/h1_additional_bits.png"); width: 142px; height: 17px; }
H1.all_photos { background: url("images/h1_all_photos.png"); width: 101px; height: 17px; }
H1.explore { background: url("images/h1_explore.png"); width: 81px; height: 17px; }
H1.friends_of_nature_valley { background: url("images/h1_friends_of_nature_valley.png"); width: 259px; height: 17px; }
H1.join_now { background: url("images/h1_join_now.png"); width: 93px; height: 17px; }
H1.key_competition_dates { background: url("images/h1_key_competition_dates.png"); width: 226px; height: 17px; }
H1.location { background: url("images/h1_location.png"); width: 79px; height: 17px; }
H1.logged_out { background: url("images/h1_logged_out.png"); width: 242px; height: 17px; }
H1.login { background: url("images/h1_login.png"); width: 50px; height: 17px; }
H1.monthly_winning_photo { background: url("images/h1_monthly_winning_photo.png"); width: 247px; height: 17px; }
H1.my_photos { background: url("images/h1_my_photos.png"); width: 97px; height: 17px; }
H1.photo_info { background: url("images/h1_photo_info.png"); width: 110px; height: 17px; }
H1.places { background: url("images/h1_places.png"); width: 65px; height: 17px; }
H1.profile { background: url("images/h1_profile.png"); width: 75px; height: 17px; }
H1.reset_password { background: url("images/h1_reset_password.png"); width: 138px; height: 17px; }
H1.site_map { background: url("images/h1_site_map.png"); width: 86px; height: 17px; }
H1.thanks { background: url("images/h1_thanks.png"); width: 72px; height: 17px; }
H1.upload_your_photo { background: url("images/h1_upload_your_photo.png");  width: 197px; height: 17px; }
H1.winning_criteria { background: url("images/h1_winning_criteria.png"); width: 158px; height: 17px; }

H2.view_all_photos { background: url("images/h2_view_all_photos.png"); width: 112px; height: 12px; }
H2.interactive_map { background: url("images/h2_interactive_map.png"); width: 108px; height: 12px; }
H2.prizes { background: url("images/h2_prizes.png"); width: 42px; height: 12px; }
H2.view_by { background: url("images/h2_view_by.png"); width: 47px; height: 10px; font-size: 8px; }


/* ------------------------------------------- */
/* stretchy background */
/* Remove margins from the 'html' and 'body' tags, and ensure the page takes up full screen height */
html, body {height:100%; margin:0; padding:0;}
/* Set the position and dimensions of the background image. */
#page-background {position:fixed; top:0; left:0; width:100%; height:100%;}
/* Specify the position and layering for the content that needs to appear in front of the background image. Must have a higher z-index value than the background image. Also add some padding to compensate for removing the margin from the 'html' and 'body' tags. */
#content {position:relative; z-index:1;}
/* ------------------------------------------- */

#content { width: 888px; margin: auto; min-height: 100%; background: url(images/bg_semi.gif) repeat; }

/* header */
.header { height: 136px; }
.header .logo { float: left; margin-top: 28px; margin-left: 30px; }
.header .main_navigation { float: left; margin-top: 18px; margin-left: 34px; background: url(images/nav_bg_left.png) no-repeat top left; width: 615px; height: 104px; }
.header .main_navigation .view_product_range { float: right; }

/* navigation */
.header UL { list-style: none; margin: 46px 0 0 20px; padding: 0; height: 18px; }
.header LI { padding: 0 27px 0 0; float: left; }
.header LI.last { padding: 0; }
.header LI A { display: block; height: 18px; }
.header .nav_explore { background: url(images/nav_explore.gif) left -18px; }
.header .nav_enter { background: url(images/nav_enter.gif) left -18px; }
.header .nav_prizes { background: url(images/nav_prizes.gif) left -18px; }
.header .nav_places { background: url(images/nav_places.gif) left -18px; }
.header .nav_loginjoin { background: url(images/nav_loginjoin.gif) left -18px; }
.header .nav_profile { background: url(images/nav_profile.gif) left -18px; }
.header .nav_logout { background: url(images/nav_logout.gif) left -18px; }
.header .end_link { margin-right: 12px; }
.header LI A:hover { background-position: left 0; }
.header LI A.selected { background-position: left -36px!important; }

/* footer */
.footer { padding: 0 0 20px 0; text-align: center; color: White; clear: both; }
.footer .top_padding { height: 60px; }
.footer A { color: White; }

.main { padding-left: 16px; }

/* boxes */
DIV.box_486 { width: 486px; float: left; margin: 0 0 16px 0; }
DIV.box_486 DIV.top { background: url(images/bg_486_top.gif) no-repeat top left; height: 15px; }
DIV.box_486 DIV.bottom { background: url(images/bg_486_bottom.gif) no-repeat bottom left; height: 15px; }
DIV.box_486 DIV.middle { background: #eaeae2 url(images/bg_486_middle.gif) repeat; }

DIV.box_353 { width: 353px; float: left; margin: 0 0 16px 16px; }
DIV.box_353 DIV.top { background: url(images/bg_353_top.gif) no-repeat top left; height: 15px; }
DIV.box_353 DIV.bottom { background: url(images/bg_353_bottom.gif) no-repeat bottom left; height: 15px; }
DIV.box_353 DIV.middle { background: #eaeae2 url(images/bg_353_middle.gif) repeat; }

DIV.box_855 { width: 855px; float: left; margin: 0 0 16px 0; }
DIV.box_855 DIV.top { background: url(images/bg_855_top.gif) no-repeat top left; height: 15px; }
DIV.box_855 DIV.bottom { background: url(images/bg_855_bottom.gif) no-repeat bottom left; height: 15px; }
DIV.box_855 DIV.middle { background: #eaeae2 url(images/bg_855_middle.gif) repeat; }

DIV.middle { padding: 0 16px; }
DIV.margin_fixer { height: 1px; font-size: 1px; }

DIV.box_203 { width: 183px; height: 346px; padding: 0 10px 0 10px; float: left; margin: 0 0 14px 16px; background: url(images/bg_203_v2.gif) no-repeat top left; }
DIV.box_394 { width: 374px; height: 337px; padding: 10px 10px 0 10px; float: left; margin: 0 0 0 16px; background: url(images/bg_394_v2.gif) no-repeat top left; }
DIV.box_614 { width: 574px; height: 155px; padding: 20px 20px 0 20px; float: left; margin: 0 0 16px 16px; background: url(images/bg_614_v2.gif) no-repeat top left; }

/* columns */
.col_486 { float: left; width: 486px; }
.col_353 { float: right; width: 369px; }
.col_353 .box_353 { margin-left: 0; }

/* forms */
.form_table { margin: 0; width: 100%; }
.form_table TD { border-top: solid 1px #c8c7bf; padding: 4px; }
.form_table TD.label { padding-top: 6px; vertical-align: top; }
.form_table TD.no_input { height: 24px; }
.form_table .text_input { background-color: #fceb60; }
.form_table .select_input { background-color: #fceb60; }
.form_table .validator_icon IMG { margin-top: 4px; }
.skinny_form .text_input {  width: 235px; }
.wide_form .text_input {  width: 260px; }
.form_table INPUT[type="file"] { background-color: #fceb60; width: 280px; }

/* home */
.home .left_column { float: left; width: 224px; height: 534px; background: url(images/stream_bg.gif) no-repeat top left; }
.home .left_column .frame { margin: 20px 0 0 20px; }
.home .left_column A { display: block; border: none; margin: 24px 0 0 19px; }
.home .wheres_yours P { margin: 0; padding: 3px 0 0 0; }
.home .winner P { font-size: 16px; font-weight: bold; color: #4b4b4b; width: 339px; line-height: 100%; padding-top: 8px; margin: 0; }
.home .winner A { border: none; }
.home .winner IMG { width: 375px; height: 280px; display: block; }
.home .links A { font-weight: bold; }
.home .links P { margin: 0; }
.home .links .link {  padding: 0 60px 0 0; color: #4b4b4b; }
.home .links .binoculars { background: url(images/binoculars.gif) no-repeat right top; margin-top: 13px; height: 79px; padding-top: 2px; }
.home .links .compass { background: url(images/compass.gif) no-repeat top right; margin-top: 19px; height: 78px; padding-top: 4px; }
.home .links .camera { background: url(images/camera.gif) no-repeat top right; margin-top: 21px; height: 77px; padding-top: 1px; }

/* featured photos */
.featured { clear: both; height: 164px; }
.featured .photo { background: url(images/featured_photo.gif) no-repeat; float: left; width: 163px; height: 163px; margin-right: 10px; }
.featured .photo A { display: block; margin: 8px 7px 7px 7px; border: none; }

/* explore page */
.explore_photos {  }
.explore_photos .search_results { height: 290px; padding-top: 12px; border-bottom: solid 1px #4b4b4b; }
.explore_photos .search_results .result { width: 148px; height: 278px; float: left; }
.explore_photos .search_results .result A { border: none; display: block; }
.explore_photos .search_results .result A IMG { border: none; display: block; }
.explore_photos .search_results .result .main_info { height: 63px; }
.explore_photos .search_results .result .main_info H3 { font-size: 15px; margin: 3px 0 1px 0; padding: 0; line-height: 16px; }
.explore_photos .search_results .result .main_info H2 { line-height: 12px; }
.explore_photos .search_results .result .details { border-top: dashed 1px #cac3b0; margin: 2px 0 0 0; padding: 5px 0 0 0; }
.explore_photos .search_results .splitter { width: 1px; height: 278px; float: left; background: #cccbc5; margin: 0 9px 0 10px; }
.explore_photos .pager { padding-top: 9px; font-size: 10px; }
.explore_photos .pager .next_previous { float: right; }
.explore_photos .pager .next_previous A {  font-weight: bold; }
.explore_photos .pager .next_previous INPUT { vertical-align: middle; margin-bottom: 2px; }
.explore_photos .pager .numbers { height: 20px; }
.explore_photos .pager .numbers A { border: none; display: block; float: left; margin: 0 3px; padding: 1px 2px 0 2px; }
.explore_photos .pager .numbers SPAN.label { border: none; display: block; font-weight: bold; float: left; margin: 0 4px 0 0; padding: 1px 0 0 0; }
.explore_photos .pager .numbers SPAN.current_page { border: solid 1px #9c9c98; display: block; float: left; padding: 0 4px; margin: 0 2px; }

/* explore tabs */
.explore_tabs { background: url(images/tab_bottom.gif) repeat-x left bottom; height: 29px; }
.explore_tabs H2 { float: left; margin: 12px 7px 0 0; }
.explore_tabs UL { list-style: none; margin: 0 0 0 0; padding: 5px 0 0 0; height: 24px; }
.explore_tabs LI { margin: 0 4px 0 0; padding: 0 0 0 0; float: left; }
.explore_tabs LI A { display: block; width: 67px; height: 24px; border: none; }
.explore_tabs .tab_latest { background: url(images/tab_latest.gif) left -24px; }
.explore_tabs .tab_rating { background: url(images/tab_rating.gif) left -24px; }
.explore_tabs .tab_location { background: url(images/tab_location.gif) left -24px; }
.explore_tabs .tab_title { background: url(images/tab_title.gif) left -24px; }
.explore_tabs .tab_views { background: url(images/tab_views.gif) left -24px; }
.explore_tabs LI A:hover { background-position: left 0; }
.explore_tabs LI A.selected { background-position: left -48px!important; }
.explore_tabs .search { float: right; }
.explore_tabs .search_field { width: 260px; background: #fceb60; vertical-align: bottom; }
.explore_tabs .search_icon { vertical-align: bottom; }

/* enter page */
.login_message { padding: 5px; margin-top: 10px; color: Red; }
.upload_description { margin: 28px 0 23px 0; }
.forgot_password { float: right; }
UL.sign_up_interests { list-style: none; margin: 0; padding: 0; }
UL.sign_up_interests LI { float: left; margin: 0; padding: 7px 0 0 0; width: 148px; }
.address_map A { border-bottom: none; }
#uploading_wait { display: none; }

/* upload your photo */
.photo_info_form .address_field { width: 210px; }
.photo_info_form .address_map { width: 319px; height: 250px; margin-left: -76px; border: solid 1px #c3c4ba; display: none; }
.photo_info_form .help_text { font-size: 12px; display: none; padding: 2px 0 4px 0; }
.photo_info_form .additional_help { font-size: 10px; line-height: 10px; margin: 0; }

/* places */
.places #theMap { height: 823px; margin-top: 10px; }
.places #theMap A { border-bottom: none; }

/* photo detail */
.photo_detail .photo_nav { padding: 0 0 15px 0; border-bottom: solid 1px black; margin: 0 0 8px 0; text-align: right; }
.photo_detail .photo_nav A { font-size: 11px; font-weight: bold; text-transform: uppercase; }
.photo_detail .photo_nav .back_link { float: left; }
.photo_detail H3 { margin-top: 6px; }
.photo_detail .share { text-align: right; padding: 6px 0 4px 0; margin: 0 0 4px 0; border-bottom: dashed 1px #cccab9; font-size: 11px; font-weight: bold; }
.photo_detail .share A { border: none; }
.photo_detail .share IMG { vertical-align: bottom; }
.photo_detail .rate_photo { float: right; }
.photo_detail .rate_photo .rate_stars { width: 65px; height: 14px; }
.photo_detail .rate_photo .rate_stars A { float: left; width: 13px; height: 14px; display: block; background: url(images/rating_off.png) no-repeat top left; border: none; cursor: hand; }
.photo_detail .rate_photo .rate_stars A.ison { background-image: url(images/rating_on.png); }
.photo_detail .details H3 { font-size: 15px; padding-bottom: 4px; margin-bottom: 5px; }
.photo_detail .details H3.comments { border-bottom: solid 1px black; padding-bottom: 4px; margin-bottom: 5px; }
.photo_detail .details H3.add_your_comment { padding-top: 15px; }
.photo_detail .details .comment { border-bottom: dashed 1px #cccab9; padding-bottom: 13px; margin-bottom: 5px; }
.photo_detail .details .comment P { color: Black; margin: 5px 0 2px 0;  }
.photo_detail .text_input { background: #fceb60; width: 446px; margin-bottom: 10px; }
.photo_detail #theMap { height: 252px; margin-top: 11px; }
.photo_detail #theMap A { border: none; }
.photo_detail .col_353 .box_353 { margin-bottom: 0; padding-bottom: 16px; }
.nearby_photos { width: 353px; height: 360px; margin: 0; }
.nearby_photos .photo { background: url(images/nearby_photos.gif) no-repeat; float: left; width: 163px; height: 163px; margin: 0 25px 15px 0; }
.nearby_photos .rightphoto { margin-right: 0; }
.nearby_photos .photo A { margin: 8px 7px 7px 7px; display: block; border: none; }

/* common photo details */
.details { font-size: 10px; font-weight: normal; color: #4b4b4b; }
.details .user { color: #0072bd; text-transform: uppercase; }

/* profile */
.profile_photos { font-size: 11px; }
.profile_photos .photo { float: left; margin-right: 7px; }
.profile_photos P { font-size: 10px; margin: 0; line-height: 12px; }
.profile_photos A { font-weight: bold; border: none; }
.profile_photos .description { height: 73px; }

/* prizes */
.prizes .details { margin-bottom: 10px; }
.prizes .prize_sponsor { display: block; float: right; margin: 5px 0 0 5px; border-bottom: none; }
.prizes .prize_sponsor IMG { border: none; }
.prizes .key_dates { width: 100%; border-top: solid 1px #c8c8c1; border-bottom: solid 1px #c8c8c1; margin-top: 10px; }
.prizes .key_dates TH { text-align: left; padding: 8px; border-right: dashed 1px #c8c8c1; font-size: 12px; }
.prizes .key_dates TD { padding: 8px; border-top: solid 1px #c8c8c1; border-right: dashed 1px #c8c8c1; }
.prizes .key_dates TD.right, .prizes .key_dates TH.right { border-right: none; }

/* friends of nature valley */
.friends_logos { text-align: center; padding-bottom: 50px; }
.friends_logos IMG { margin: 20px; vertical-align: middle; }