/*------------------------------------------------------------
Style Sheet - screen

version:	3.1
client:		Project Contemporary Artspace
author:		Stephen Grabner
email:		public!removethis!@pronkingantelope.net
website:	http:pronkingantelope.net

notes: 		This version is the same as v3.0, but rewritten for
			clarity and better structure.			
------------------------------------------------------------*/
/*
	
CONTENTS ----------

1.BODY
2.DEFAULT STYLING
3.HEADINGS
4.LINKS
5.IMAGES
6.LAYOUT
7.BRANDING/MASTHEAD
8.NAVIGATION
	8.1 Main navigation
	8.2 Exhibition navigation buttons
	8.3 Guide-specific navigation
9.SITEINFO/FOOTER
10.GLOBAL ELEMENTS

11.HOMEPAGE
	11.1 CONTENT PRIMARY
	11.2 CONTENT SECONDARY
	11.3 CONTENT TERTIARY
	
*/



@import url(resetstyles.css); /* RESET CSS */



/* 1.BODY
---------------------------------------------------------------------- */

body {
	font-size: 62.5%;
	background-color: #808080;
	/*background: url(../images/general/bodybg.jpg) repeat-x;*/
}



/* 2.DEFAULT STYLING
---------------------------------------------------------------------- */

p { margin: 0.5em 0 0.5em 0; }
strong { font-weight: bold;}
.hilight {color: #bb0000;}
em { font-style:italic; }

hr { height:0; border:none; background:none; border-top:1px dotted #ccc; }

ul { list-style:square; }
ul li { margin-left:15px; }
ol { list-style:decimal; }
ol li { margin-left:30px; }

ul.list {list-style-type: none;}
.list li {margin-top: 3px; margin-bottom: 3px;}

/* for FancyZoom */
td {vertical-align: middle;}

/*
table { border-top:1px solid #ccc; }
table a { color:#000; }
table a:hover,
table a:focus { color:#000; text-decoration:underline; }
table td { border-bottom:1px solid #ccc; background:#f4f6de; padding:5px 0; }
table tr.alt td { background:#fff; }
*/

img, a img, :link img, :visited img {border: 0;}
-moz-any-link:focus {outline: none;}



/* 3.HEADINGS
---------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: bold;
	line-height: 1em;
}

#upcoming h4, #upcoming h5 {
	font-family: "Helvetica Neue", Arial, sans-serif;
}


h1 {
	font-size: 2em;
	margin: 0 0 0 -5000px;
	line-height: 0px;
}

h2 {
	text-transform: uppercase;
	color: black;
	padding: 0;
	margin: 20px 0 8px 0;
	padding-top: 0px;
	font-weight: normal;
	font-size: 2em;
}

h3 {
	font-size: 1.8em; /* for titles */
	margin: 0 0 1.5em 0px;
	padding: 0;
	color: #325f6d;
	text-transform: lowercase;
	font-weight: normal;
}


/* For small wall heading */
.sw_block h3 {
	margin-bottom: 1em;
}
	
h4 { /* for major headings */
	font-size: 1.5em;
	margin: 2em 0 0.9em 0;
	padding: 0;
	color: #7cab0a;
	/* color:#1e90ff; */
	/* color: #336699; */
	text-transform: lowercase;
	font-weight: normal;
}


h5 {
	text-transform: lowercase;
	font-size: 1.3em;
	margin: 1.5em 0 0.5em 0;
	padding: 0;
	font-weight: normal;
}

h6 {
	font-weight: bold;
	font-size: 1.1em;
	margin: 1.5em 0 0.5em 0;
	text-transform: lowercase;
}


/* Main Gallery Headings */

#mg_content h1 {
	
}

#mg_content h2 {
	
}

#mg_content h3 {
	
}

#mg_content h4 {
	
}

#mg_content h5 {
	
}

/* Small Wall Gallery Headings */


#sw_content h1 {
	
}

#sw_content h2 {
	
}

#sw_content h3 {
	margin-top: 60px;
	margin-bottom: 1em;
}

#sw_content h4 {
	
}

#sw_content h5 {
	
}



/* 4.LINKS
---------------------------------------------------------------------- */

/* home link at top of every page, covering the project header */
a.home {
	display: block;
	position: absolute;
	top: 0; left: 0;
	width: 600px;
	height: 180px;
	text-indent: -5000px;
	border: none;
}

a.home:hover {
	border: none;
}

/* Generic links site-wide */
a {
	color: #0e64c9;
	text-decoration: none;
	font-weight: normal;
}

a:hover {
	text-decoration: underline;
}

a:active {
  border:none;
}


/* Remove link styling for images in float boxes */
/* Assumption here that images are only displayed in float boxes... */
/*
.floatRight a, .floatRight a:hover, .floatLeft a, .floatLeft a:hover {
	border: none;
}
*/

a[href$=jpg], a[href$=jpeg] {
	border: 0 none;
}


/* AVAILABLE red colouring */
#cal .available a, #upcoming .available a {
	color: #bb0000;
}

#cal .available a:hover, #upcoming .available a:hover {
	color: red;
}

.available {
	color: #bb0000;
}

.main .textblock a:hover {
	text-decoration: underline;
}


/* 5.IMAGES
---------------------------------------------------------------------- */





/* 6.LAYOUT
---------------------------------------------------------------------- */

#wrapper {
	font-family: Helvetica, "Helvetica Neue",  "Lucida Sans" , Tahoma, Geneva, Arial, sans-serif;
	font-size: 10pt;
	background-color: #fff;
	/* background: url(../images/general/floor.jpg) repeat; */
	color: #454545;
	text-align: left;
	width: 900px;
	margin: 0px auto;
	border: solid 1px #777; /* basic borders for IE */
	position: relative;
 }
 
#header {
	margin: 0 0 -100px 0;
	padding: 0;
	background: url(../images/general/header6.jpg);
	background-repeat: no-repeat;
	height: 400px;
	}


/* info box in header (named Lucy after my favourite cat :) -------------- */
#lucy {
	position: absolute;
	top: 190px; left: 60px;
	font-size: 0.9em;
}

#lucy span {color: black;}

/* Search box containing search function */
#search {
	position: absolute;
	top: 30px;
	right: 20px;
}

/* margin-shift Main to right to accomodate Sidebar */
#main {
	position: relative;
	margin: 0 0 0 240px;
	padding: 0 40px 0 20px;
}

/* left-float Sidebar next to Main */
#sidebar {
	float: left;
	width: 195px;
	margin-right: 50px;
	margin-top: -20px;
	padding: 0 0px 30px 0px;
	font-size: 0.9em;
	background-color: /* #dff3ff; */ #f2f8fb;
	-moz-border-top-right-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
}	
	
/* Footer block */
#footer {
	clear: both;
	font-size: 0.9em;
	margin: 90px 0 0 0;
	padding: 15px 0;
	background: url(../images/general/footer_bg7.jpg) repeat-x;
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgb(178,199,217)), color-stop(0.34, rgb(242,247,252)));
	background-image: -moz-linear-gradient(center top, rgb(178,199,217) 0%, rgb(242,247,252) 34%);
	text-align: center;
}

#menu {
	margin-top: 13px;
	margin-right: 5px;
	padding: 0px 0px 0px 0px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 1em;
	text-align: right;
	}




/* 7.BRANDING/MASTHEAD
---------------------------------------------------------------------- */




/* 8.NAVIGATION
---------------------------------------------------------------------- */

/* 8.1 Main navigation box left of content */

#menu {
	margin-top: 13px;
	margin-right: 5px;
	padding: 0px 0px 0px 0px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 1em;
	text-align: right;
	}

#menu ul, #menu li {
	padding: 0;
	margin: 0;
	list-style-type: none;
	}

#menu ul {
  border-bottom: 1px #ccc solid;
}

#menu ul + ul { margin-top: 10px; margin-bottom: 10px;}

#menu li {
	padding: 0px 15px 0px 0px; position: relative;
}

#menu li:hover {
 	background: url(../images/general/menu_mark.png) center right no-repeat;
}

#menu a { color: #999; text-transform: uppercase; display: block; padding: 3px 0px 3px 0px;}

#menu a:hover { color: black; text-decoration: none;}

/* Take out border on last UL in menu */
#menu ul + ul + ul {
	border: none;
}

/* Current page hilighting in menu */
#calendar .calendar a, #about .about a, #committee .committee a, #contact .contact a, #downloads .downloads a, #exhibiting .exhibiting a, #homepage .homepage a, #mailinglist .mailinglist a, #membership .membership a, #maintenance .maintenance a, #news .news a, #projects .projects a, #siteinfo .siteinfo a  {
	color: black;
}


/* 8.2 Exhibition navigation buttons on each exhibition page. */
.exhibnav {
	position: absolute;
	right: 10px;
	top: -20px;
}
.exhibnav a {
	display: block;
	width: 22px;
	height: 15px;
}

.exhibnav a.nextexhib {
	background: url(../images/general/next.jpg) left top;
}

.exhibnav a.prev {
	background: url(../images/general/prev.jpg) left top;
}

.exhibnav a.nextexhib:hover {
	background: url(../images/general/next.jpg) right top;
}

.exhibnav a.prev:hover {
	background: url(../images/general/prev.jpg) right top;
}


/* 9.UPCOMING SHOWS
---------------------------------------------------------------------- */

#upcoming {
	margin-top: 60px;
	margin-bottom: 40px;
	text-align: right;
	padding-left: 15px;
	/* border-right: 3px #eee solid; */
	/* border-top: 1px #ccc solid; */
}

/*
#upcoming div {
	text-align: right;
	margin-top: 20px;
	padding-right: 20px;
}
*/

/* Heading of block */
#upcoming h4 {
	padding-right: 10px;
	font-size: 1.1em;
	text-align: right;
	text-transform: uppercase;
	color: black;
	margin-bottom: 20px;
}

#upcoming h5 {
	font-size: 1.0em;
	margin: 25px 0 0 0;
	padding-bottom: 1px;
	padding-right: 15px;
	text-transform: uppercase;
	/* border-top: 1px #ccc solid; */
	border-bottom: 1px #ccc solid;
}

/* Not currently used */
#upcoming h6 {
	text-transform: capitalize;
	font-size: 1.0em;
	margin: 10px 0 0 0;
	text-transform: uppercase;
}

#upcoming p {
	text-align: right;
	padding-top: 0px;
	padding-bottom: 10px;
	padding: 0 15px 0 0;
}

#upcoming p span {
	/* border: #555 solid 1px; */
	background-color: #555;
	color: white;
	font-size: 0.8em;
	padding-top: 0px;
	padding-bottom: 0px;
	vertical-align: baseline;
}

#upcoming a {
	border: none;
	color: #555;
	display: block;
}

#upcoming a:hover {
	text-decoration: underline;
	color: #555;
}

.subheading {
	margin-top: 30px;
	font-weight: bold;
}

.upcomingdate, .upcomingtitle, .upcomingartist {
	padding: 0 0 0 8px;
	margin: 0;
	}

.upcoming artist {
	font-style: italic;
}

.upcomingdate {
	font-weight: bold;
	margin: 0.5em 0 0 0;
	}



/* 9.SITEINFO/FOOTER
---------------------------------------------------------------------- */
/* =Footer block */
#footer {}





/* 10.GLOBAL ELEMENTS
---------------------------------------------------------------------- */

/* Email obsfucation */

span.email {color: inherit;}
span.email span { display: none; }
span.email:hover {color: #0e64c9 /* #1e90ff */;}


/* Useage: <span class="email">person<span>!remove!</span>@server.com.au</span> */
/* The extra word/symbol '!remove!' is hidden to people, but not to bots, making the email useless. Works surprisingly well. */


/* HONEY POT email test */
/* Used to determine the effectiveness of the simple email obsurification the site is using */
/* 'Open' and 'closed' addresses are respectively left open and obscured, and hidden using height and text-indent */
/* Only used on index page */

.honeypot {
	height: 0px;
	text-indent: -5000px;
}

.available {color: #bb0000;}

.clearer {clear:both; width: 100%; height: 1px;}



/* 11.EXHIBITION PAGES
---------------------------------------------------------------------- */

/* 11.1 CONTENT - EXHIBITION DETAILS BLOCK ------------ */

.exhibitionDetails {
	min-height: 160px;
	margin-bottom: 40px;
	font-family: Georgia, serif;
}


.exhibitionDetails .showid {
	padding: 0;
	margin-right:20px;
	margin-top: -15px;
	float: left;
}

.exhibitionDetails h2, .details_text p.title {
	color: #444;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.7em;
	margin: 20px 0 0 0;
}

/* select h2 sibling of floated id image to remove top margin that would affect the top-margin of main.  */
.exhibitionDetails img + h2 {
	margin-top: 0px;
}

/* compensate if no image used by using CSS3 first-child (won't work on ie6, unless using ie8.js) */
.exhibitionDetails h2:first-child {
	margin-top: 0px;
}

.exhibitionDetails p.artist, .exhibitionDetails p.subtitle {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.5em;
	text-transform: capitalize;
	color: #444;
	margin: 8px 0 0 0;
}

/* if there is no Show title, then remove Artist name top-margin */
.exhibitionDetails img + p.artist {
	margin-top: 0px;
}

/* compensate if no image used */
.exhibitionDetails p.artist:first-child {
	margin-top: 0px;
}

p.dates, p.opening, p.notes, p.lnk {
	font-size: 1.3em;
	color: #325f6d;
	padding: 0;
	margin: 0px;
	text-transform: capitalize;
}

.exhibitionDetails p.dates { margin-top: 27px; }

p.subtitle {
	padding-top: 0;
	padding-bottom: 1em;
}

.exhibitionDetails p.opening {
	margin-top: 5px;
	font-size: 1.1em;
	text-transform: lowercase;
}

/* Extra notes - eg Speaker, etc */
.exhibitionDetails p.notes {
	font-size: 1em;
	text-transform: none;
	margin-top: 15px;
}

.exhibitionDetails p.notes + p.notes {
	margin-top: 3px;
}


/* 11.2 CONTENT - EXHIBITION PAGES MAIN CONTENT */

/* TEXT box - text for each show (on the relevant exhibition page, but not homepage) */
.textblock {
	margin: 0;
	font-family: Georgia, serif;
}

/* in info pages, where there is no need to push the info block away from the exhibition details - it just sits under the title. */
/* .textblock:first-child { margin-top: 0; } */

/* Tables in textblock */
.textblock table {
	margin-bottom: 2em;
}

/* First heading - remove top margin */
.textblock h4:first-child {
	margin-top: 0px;
}


/* Images in the textblock descriptions for exhibitions have 10 px of padding around them (ie 20px total between) */	

.textblock img {
	padding: 10px;
}

.textblock p {
	line-height: 140%;
	font-size: 1em;
	margin-bottom: 1.3em;
	text-align: left;
}

.sw_block {
	background: url(../images/general/sw_bg.jpg) no-repeat top left;
	margin-top: 20px;
	padding-top: 60px;
}


/* Floats left and right for images & CAPTIONS underneath images of works in exhibition pages */

.floatRight, .imageThumbs {
	padding: 5px 10px 5px 20px;
	text-align: right;
}

.floatRight {
	float: right;
}

.floatLeft {
	float: left;
	padding: 5px 20px 5px 0;
	text-align: left;
}

p.caption {
	margin-bottom: 20px;
	padding-right: 20px;
	font-size: 0.9em;
	text-align: right;
	font-style: italic;
}

/* Textblock lists - used mostly in info pages */
.textblock ul {
	line-height: 1.4;
	list-style-type: none;
	text-indent: 8px;
	list-style-position: inside;
}


/* INFOBOX - used for any informative boxes floated to the left or right */
/* To float, include "floatLeft" or "floatRight" in the class */
/* Use a div to contain the info - margins are applied to it to keep the padding peace (see below) */

.infobox {
	float: right;
	text-align: left;
	max-width: 230px;
	min-width: 150px;
	margin: 0 0 10px 10px;
	padding: 15px;
	border: 1px solid #ccc;
	border-radius:10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	-o-border-radius: 10px;
	font-size: 0.9em;
	background-color: #efefef;
}

/* headings for infoboxes */

.infobox h5 {
	margin-top: 15px;
	padding-bottom: 5px;
	border-bottom: 1px solid #ccc;
}

.infobox h5:first-child {
	margin-top: 0px;
}


/* lists used in infoboxes */
.infobox ul {
	margin-left: 5px;
	padding: 0;
	text-indent: 0;
}

/* paragraphs used in infoboxes */

.infobox p {
	margin-left: 5px;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.infobox dl {
	margin-left: 5px;
}

.infobox dt {
	font-weight: bold;
	margin-top: 0.5em;
}

.infobox dd {
	margin-top: 0.2em;
}

/* Quote style, which isn't really used much */
.textblock p.quotes, .textblock p.quotes {margin-left: 70px;}


/* CONTACTS text box -------------------------------------------------------------*/
.textblock .contactdetail {
	margin-top: 0px;
	margin-bottom: 0px;
}


/* NOTICEBOX styling (for use with pages that need notices - within MAIN) */

.noticebox {
	position: relative;
	border: solid #777 1px;
	width: 400px;
	margin: 0 auto 100px auto;
	padding: 40px;
	display: block;
	}

.noticebox img {
	float: left;
	margin: 0px;
	padding: 0px 0px 0 0;
	}

.noticebox p {
	margin: 0 0 2em 0px;
	text-align: center;
	}

.noticebox p.heading {
	font-size: 2em;
	margin: 0px 0 0.5em 0px;
	}

.noticebox p.last {
	margin: 0 0 1.2em 0px;
	}




/* Works listing table - used in old pages - delete when updated...
 ----------------------------------------------------------*/

.workslisting table {
	margin-top: 20px;
	border-spacing: 0px;
	border-collapse: collapse;
}

.workslisting td {
	border-bottom: solid 1px gray;
	border-top: solid 1px gray;
	padding: 3px;
	padding-left: 5px;
	padding-right: 10px;
}

.workslisting td.t-artist {
	width: 25%;
}

.workslisting td.t-title {
	width: 35%;
}

.workslisting td.t-media {
	width: 25%;
}

.workslisting td.t-price {
	width: 15%;
	text-align: right;
	padding-right: 5px;
}

.workslisting tr.even {
	background-color: #f0f0f0;
}



/* 11.3 CALENDAR page styling (within MAIN) -------------------------------------------*/

table.calendartable {
	padding: 0 0 0 30px;
	border-collapse: collapse;
	width: 500px;
}
	
td.date, td.title, td.artist {vertical-align: text-top;}
td.date { width: 80px; border-top: solid 1px #ccc; padding: 2px 10px 0 0; text-align: right; font-weight: bold;}
td.title { width: 155px; border-top: solid 1px #ccc; font-weight: normal; padding: 2px 0 0 0; text-transform: uppercase;}
td.artist {width: 155px; padding: 0 0 2px 0;}

td.mth, td.mthtop {font-weight: bold; padding-top: 40px; font-size: 1.2em;}

/* top links */

.links {margin-top: 0px; }



/* 11.4 CONTENT NEWS/BLOG PAGE ------------------------ */

/* NEWS PAGE (blog) styling */

/* layout */
.blogentry {
	position: relative;
	background: url(../images/general/blogbg.jpg) no-repeat;
	padding: 15px 20px 0px 20px;
	margin-bottom: 30px;
	/*border-bottom: solid #d4d4d4 1px;*/
}
	
/* Month links */
.archives {
	position: relative;
	top: -2em;
	font-size: 0.9em;
}

/* Title */
.blogentry h4 {
	margin-top: 0;
}

/* Date */
.blogentry h5 {
	font-weight: bold;
	color: #777;
	font-size: 0.9em;
	margin-bottom: 20px;
	margin-top: -10px;
	padding-top: 0;
}


/* 11.3 CONTENT TERTIARY ------------ */