/*
Theme Name: Custom theme for Hidden Park
Theme URI: http://www.thehiddenpark.com
Description: Custom theme made for Bulpadok by <a href="http://www.conducthq.com" target="_blank">Conduct</a>
Version: 0.1
Author: Simon Krambousanos
Author URI: http://www.conducthq.com
Tags: hiddenpark
*/



/* ----- RESET ----- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}
/* ----- BODY ----- */
html, body  {color: #333;background:#fff;text-align: center;font: normal 12px arial, helvetica, sans-serif;padding-bottom:20px;background: #ecf2bd url(cssimg/bg-body.png) repeat-x;text-align:left;}

/* conduct tag */
.credits #conduct  {float:right;margin:5px 10px 0 0; display:block;background:url(http://www.conducthq.com/credits/cssimg/WHITE-and-BLUE_conduct.gif) no-repeat;width:26px;height:26px; }
.credits #conduct:hover {background-position:0 -26px; }
.credits #conduct span {display:none; }


/* ----- COMMON ----- */
li {list-style:none; }
.clear {clear:both;}
a {text-decoration: underline;padding: 1px;}
a:hover {text-decoration: none;}
a img {border: 0;}
a, a strong {color: #2173af;text-decoration: none;}
p {margin:10px 0 0px 0; text-align:left;}
p img {float:left;margin:1.5em 1.5em 1.5em 0;padding:0;}
p img.right {float:right;margin:1.5em 0 1.5em 1.5em;}
h2{
color: #4b8468;
font-family: Arial,sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
line-height: 27px;
font-size-adjust: none;
font-stretch: normal;
-x-system-font: none;
margin-top: 10px;
margin-right: 0pt;
margin-bottom: 18px;
margin-left: 0pt;
padding-top: 0pt;
padding-right: 0pt;
padding-bottom: 0pt;
padding-left: 0pt;
font-size: 20px;
}
.downloads {margin:20px 0 20px 60px;  }
.downloads li {float:left; margin:0 20px 0 0; }
h3{color:#000;font:normal 18px/27px Arial, sans-serif;margin:0 0 5px 0;padding:0}
h5{color:#3e434a;font:bold 13px/18px Arial,sans-serif;margin:0;padding:0}
hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:.1em;margin:0 0 1.45em;border:none;}
hr.space {background:#fff;color:#fff;}
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 {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}
em, dfn {font-style:italic;}
p {font-size: 1.2em;}
p.large {line-height: 1.5;font-size: 1.5em;}
em {font-style: normal;color: #686c70;}
.left-align {float:left;margin:0 5px 2px 0; }
.left-align img {padding:3px; border:solid 1px #dfdfdf;background:#fdfdfd; margin:2px 5px 0 2px;}
blockquote {margin: 15px 30px 0 10px;padding-left: 20px;border-left: 5px solid #ddd;}
blockquote cite {margin: 5px 0 0;display: block;}
blockquote {color: #777;}
.middle {margin:0 0 0 15px; }
.spotlight {margin:10px 10px;font-size:18px; color:#666666; }

/* ----- PAGE DEFAULT ----- */
#page {width:100%;margin:0 auto;}

/* ----- PAGE HOME ----- */
div.border {padding-right:4px;margin-right:5px;border-right:1px solid #eee;}
div.colborder {padding-right:24px;margin-right:25px;border-right:1px solid #eee;}
.block p, #links p {margin-bottom: 0;}
.block {margin-bottom: 1.3em;}
div.span-1, div.span-2, div.span-3, div.span-4, div.span-5, div.span-6, div.span-7, div.span-8, div.span-9, div.span-10, div.span-11, div.span-12, div.span-13, div.span-14, div.span-15, div.span-16, div.span-17, div.span-18, div.span-19, div.span-20, div.span-21, div.span-22, div.span-23, div.span-24 {float:left;margin-right:10px;}
div.last {margin-right:0;}
.span-8 {width:310px;}
.last {border-right: 0;}
.last {margin-right:0;padding-right:0;}
h3.blue {color: #6b7b95;}
#links a {font-size: 13px;	}
#links p {font-size: 11px;color:#686c70; margin:2px 0 ;}

/* ----- HEADER ----- */
#page #header {width:960px; margin:0 auto; }
 #page .headerwrap, #mainNav {background-color:#fff;}
.headerwrap {background: url(cssimg/header-bg.png) repeat-x right bottom;width:100%;}
#header {width:100%;font-size:12px;line-height:normal;text-align: left;}
.lineWhite {/*position:absolute;top:132px; height:1px;background:#fff url(cssimg/clr.gif) no-repeat top right;width: 100%;*/}
#header h1 {color: #fff;font: bold 24px arial, helvetica, sans-serif;padding: 20px 0 22px 5px;line-height: 26px;}
#header h1.image {color: #fff;font: bold 24px arial, helvetica, sans-serif;padding: 15px 0 0px 0;}
#tag {position:absolute;top:60px;}
#tag span { color: #9fd6f5;font: bold 14px arial, helvetica, sans-serif;padding: 0 0 0 3px;}
.masthead {width:100%;  }

/* ----- BLOCKS ----- */
#content {padding: 15px 18px 25px 15px;position: relative;/* Give content layout to fix IE7 bug with 100% width tables  */zoom: 1.0;}
.onecol{width:960px;margin:0 auto; }
.twocol {width:960px;margin:0 auto;background:#fff url(cssimg/2col.png) no-repeat right bottom;}
.twocol #content,.onecol #content {background:url(cssimg/body-bg.png) repeat-y;margin: 0 auto;width:960px right top;}
#maincol {padding:0 30px; }
.twocol-home {margin:0 20px; }
#leftcol {float:left; width:680px;padding:0 0 0 30px;}
#rightcol {margin:0 0 0 740px;width: 200px;padding: 40px 0 0 0;}
#rightcol a {padding: 0;}
#mainNav {background: #ecf2bd url(cssimg/nav-bg.png) repeat-x;height:90px;text-align:center; }
#body {background:url(cssimg/body-bg.png) repeat-y;margin: 0 auto;width:960px;}
.headerbreak {background:url(cssimg/grassybreak.png) repeat-x;margin: 5px 0;height:10px;}

.leftcontent-col {float:left;width:450px; }
.rightcontent-col {margin: 0 0 0 480px;  }
.rightcontent-col p,.leftcontent-col p {margin:0;padding:0; }
/* ----- MENU ----- */
ul#topNav {clear: both;float: left;list-style: none;position: relative;}
ul#topNav li {float: left;margin:0 0 0 20px;}
ul#topNav li a {color: #fff;text-decoration: none;font-weight: bold;text-align: center;height: 28px;padding: 30px 20px 0 0 ;width: 80px;display: block;font-size:14px;}
ul#topNav li a:hover, ul#menu li a:active {color:#000031;}
ul#topNav .current_page_item a,ul#menu .current_page_item a:hover {color:#000031;}

/* ----- FOOTER ----- */
#footerWrap {text-align: center;font-size: 0.75em;background:url(cssimg/footer-bg.png) repeat-x;height:25px; }
#foot{background:url(cssimg/footer-strap.png) no-repeat;height:25px;margin: 0 auto;width:960px;}
.footer-content{width:960px;margin:0 auto; }

/* Begin Images */
p img{padding:0; max-width:100%}

/*Using 'class="alignright"' on an image will (who would've
thought?!) align the image to the right. And using 'class="centered', 
will of course center the image. This is much better than using
align="center", being much more futureproof (and valid) */
img.centered{display:block; margin-left:auto; margin-right:auto}
img.alignright{padding:4px; margin:0 0 2px 7px; display:inline}
img.alignleft{padding:4px; margin:0 7px 10px 0; display:inline; clear:both;}
.alignright{float:right}
.alignleft{float:left}
/* End Images */


/* footer */
#footer-nav {width:900px;margin:0 auto;}
#footer-nav p {float:right; color:#63b17f;}
ul#menu-footer {clear: both;float: right;list-style: none;position: relative;margin:10px 0 0 0;}
ul#menu-footer li {float: left;}
ul#menu-footer li a {color: #63b17f;text-decoration: none;font-weight: bold;text-align: center;width: 70px;height: 15px;padding: 5px 0; display: block;font-size:10px;}
ul#menu-footer li a:hover, ul#menu li a:active {color:#03a524;}

