/* -----------------------------------------------------------------------

	Project Name: Hidden Park
	Description: Interface styles and layout for The Hidden Park project
	Version: 0.1
	Author: SImon Krambousanos
	Author URI: http://www.conducthq.com/

----------------------------------------------------------------------- */

/* reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}

/* typography */
html,body {font-size:75%;font-family: Georgia, "Times New Roman", Times, serif;padding: 0;background:#A5E9F9;}
h1, h2, h3, h4, h5, h6 {font-weight:normal;color:#111;}
h1 {font-size:3em;line-height:1;margin-bottom:0.5em;}
h2 {font-size:2em;margin-bottom:0.35em;}
h3 {font-size:1.7em;line-height:1;margin-bottom:0.35m;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}
p {margin:0 0 1.5em;}
p img.left {float:left;margin:3px 12px 3px 0;padding:0;}
p img.right {float:right;margin:3px 0 3px 12px;}
.right {float:right; border:1px solid #9BD1FA; padding:0px 5px 0px 5px; text-align:center;background:#58a0d6;}
.right img {border:1px solid #9BD1FA; }
.right span {font-size:13px; font-weight:bold;line-height:25px;color:#fff;}
a:focus, a:hover {color:#333;}
a {color:#009;text-decoration:underline;}
blockquote {margin:1.5em;color:#666;font-style:italic;}
strong {font-weight:bold;}
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
abbr, acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre, code, tt {font:1em 'andale mono', 'lucida console', monospace;line-height:1.5;}
li ul, li ol {margin:0 1.5em;}
ul, ol {margin:0 1.5em 1.5em 1.5em;}
ul {list-style-type:disc;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}
table {margin-bottom:1.4em;width:100%;}
th {font-weight:bold;}
hr {color:#FFF; }
thead th {background:#c3d9ff;}
th, td, caption {padding:4px 10px 4px 5px;}
tr.even td {background:#e5ecf9;}
tfoot {font-style:italic;}
caption {background:#eee;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {display:none;}
.quiet {color:#666;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last, ul.content-list .last  {border:none;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}
.centre {text-align:center;}


/* grid */
#popup {background-color:none; }

div#content,.content {margin:10px; }
div#content p,.content p {color:#000;font: 16px/23px Georgia, "Times New Roman", Times, serif;margin:15px 0 15px 0; }

/* headers */
div#header {padding:0;background:#F4D600;height:70px;}
#header h1 {height:65px; }
#header h1 span {display:none; }
/* images in headers */
#mainmenu #header h1 {background:url(../images/headers/mainmenu.png) no-repeat center;}
#instructions #header h1 {background:url(../images/headers/instructions.png) no-repeat center;}
#credits #header h1 {background:url(../images/headers/credits.png) no-repeat center;}
#printphotos #header h1 {background:url(../images/headers/printphotos.png) no-repeat center;}
#examples #header h1 {background:url(../images/headers/examples.png) no-repeat center;}


/* standard header on body */
div#header + h1, ul + h1 {color:#000;font: bold 18px Helvetica;text-shadow: #fff 0 1px 0;margin: 0;  }

/* standard paragraph on body */
ul + p, ul.data + p + p, ul.form + p + p {color:#000;font: 14px Helvetica;text-align: left;text-shadow: white 0 1px 0;margin: 0;}

/* icons */
p img.sub-left{float:left;margin:-1px 12px 3px 0;padding:0; }
p img.left-spot{float:left;margin:-5px 12px 3px 0;padding:0; }


/***** List (base) ******/
ul{color:#fff; background:#fff;  font:bold 17px Georgia, "Times New Roman", Times, serif; padding:0;  margin:10px; }
ul li{color:#fff;list-style-type:none; padding:10px 10px 10px 10px;background:#3DCDD8;border-bottom:1px #fff solid;}


/* when you have a first LI item on any list */
li:first-child{border-top:0;}
li:last-child{border-bottom:0; }

/* universal arrows */
ul li.arrow{background-image:url(../images/default-icons/chevron.png); background-position:right center; background-repeat:no-repeat}

.safari-icon {list-style:none;}
.safari-icon li, .safari-icon {background:url(../images/default-icons/safari_icon.png) no-repeat 5px 8px; background-color:#3DCDD8;}
.safari-icon li p {padding:0 0 0 33px; margin:2px 0 0 0;}

/* universal list in content */
div#content ul,.content ul {border:none; background:none;margin:15px 0 17px 0px;}
div#content ul li,.content ul li {font-size:13px;margin:0;padding:4px 0 0 20px;background-color:none;color:#000;border:none;font-weight:normal;}

/* universal links on list */
ul li a, li.img a+a{color:#fff; text-decoration:none;  display:block; padding:5px 30px 0px 0px;font: 16px/18px Georgia, "Times New Roman", Times, serif;}
ul li.img a+a{margin:-10px 10px -20px -5px; font-size:17px; font-weight:bold}
ul li.img a+a+a{font-size:14px; font-weight:normal; margin-left:-10px; margin-bottom:-10px; margin-top:0}
ul li.img a+small+a{margin-left:-5px}
ul li.img a+small+a+a{margin-left:-10px; margin-top:-20px; margin-bottom:-10px; font-size:14px; font-weight:normal}
ul li.img a+small+a+a+a{margin-left:0px !important; margin-bottom:0}
ul li a+a{color:#fff; font:14px Helvetica; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; display:block; margin:0; padding:0}
ul li a+a+a, ul li.img a+a+a+a, ul li.img a+small+a+a+a{color:#666; font:13px Helvetica; margin:0; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; display:block; padding:0}
.img-centre {text-align:center; }

ul p,ul span {font-size:12px; color:#000 }
ul p span {font-size:16px;line-height:25px;}

/***** BUTTONS *****/

.button {color: #666;font: bold 20px/46px Helvetica;text-decoration: none;text-align: center;display: block;margin: 10px 0;}
#backButton{ background:url(../images/buttons/btn-back.png) no-repeat left;  padding:0;width:34px; height:37px; margin:-4px 0 0 -18px;}

.fairyhunting {background:url(../images/buttons/letsgetfairyhunting.png) no-repeat center 0 ;height:65px;background-position:50% 0;}
.fairyhunting:hover {background:url(../images/buttons/letsgetfairyhunting-down.png) no-repeat center 0 ;height:65px;background-position:50% 0;}

.printphotos { background:url(../images/buttons/printyourphotosonline.png) no-repeat center 0 ;height:65px;background-position:50% 0;}
.printphotos a {-webkit-border-image:url background:url(../images/buttons/printyourphotosonline-down.png) no-repeat center 0 ;height:65px;background-position:50% 0;}

.thecredits { background:url(../images/buttons/credits.png) no-repeat center 0 ;height:65px;background-position:50% 0;}
.thecredits:hover {background:url(../images/buttons/credits-down.png) no-repeat center 0 ;height:65px;} 

.instructions { background:url(../images/buttons/instructions.png) no-repeat center 0 ;height:65px;background-position:50% 0;}
.instructions:hover {background:url(../images/buttons/instructions-down.png) no-repeat center 0 ;height:65px;} 



.fairyhunting span,.printphotos span,.thecredits span,.instructions span {display:none; }
#header #backButton {position:absolute; top:19px;left: 20px;right: auto;padding: 0;max-width: 55px;}

/***** Spotlights *****/
#spotlight{background: #9BD1FA;padding:10px;}
.spotlight-alt{background: #0b8e98;padding:10px; }
#content #spotlight p{font-weight:bold;font-size:20px;line-height:22px; margin:10px 0 10px 0; }
.content .spotlight-alt p {font-weight:bold;font-size:16px;line-height:18px;color:#FFFFFF;margin:10px 0 10px 0;}