/* The Grange Prize
	Design by Andrea Kreuger, Development by Marty Spellerberg 
	Art Gallery of Ontario
							*/

body {font-family: Arial, Helvetica, sans-serif; background-color: #424040; color: #363535; text-align: center; font-size: 13px;}

.canvas {width: 960px; text-align: right; margin: auto;}
.layout {background: #fff; border: 1px solid #fff; text-align: left;}

.nav { text-align: right;}
.nav ul {padding: 0; margin: 0;}
.nav li {display: inline; padding-left: 1em;}

a {color:#409286;text-decoration: none;}
a img {border: none;}

h2 {color: #666; margin: 0; padding: 10px 0px 10px 0px; font-size: 26px;}
h2 span {color:#999;font-size: 20px;}
h3 {color: #363535; font-size: 18px;}
h4 {color: #363535; font-size: 14px;margin-bottom:0;padding-bottom:0;}

.topPad {margin-top:0;padding-top:0;}

:focus{
-moz-outline-style: none;  /* removed dotted line on firefox links */
}

.clearthis {clear:both;float:none;visibility:hidden;height:1px;border:0;background-color:none;margin:0;padding:0;}

#languages {color: #000; margin: 0 0 .5em 0;}
#languages a {color: #fff; font-weight :normal;}
#languages a:hover {color: #fff; text-decoration: underline;}
#languages li {font-size:11px;border-left:1px solid #000;padding-left:.5em;padding-right:.5em;}
#languages li:first-child {border-left:0;}

.head-wrapper { border-bottom: 1px solid #fff;}

#header {background: #1e1e1e; padding: 22px 12px 27px 52px; overflow: auto; width: 894px;}
#header h1 {margin: 0; display: inline;}
#header h1 a { height: 118px; width: 532px; float: left; display: block;}

.en #header h1 a.y2010 { background: url(/assets/templates/grangeprize/gp2010-logo-en_grey.gif);}
.fr #header h1 a.y2010 { background: url(/assets/templates/grangeprize/gp2010-logo-fr_grey.gif);}
.es #header h1 a.y2010 { background: url(/assets/templates/grangeprize/gp2010-logo-es_grey.gif);}

.en #header h1 a.y2009 { background: url(/assets/templates/grangeprize/gp2009-logo-en_grey.gif);}
.fr #header h1 a.y2009 { background: url(/assets/templates/grangeprize/gp2009-logo-fr_grey.gif);}
.es #header h1 a.y2009 { background: url(/assets/templates/grangeprize/gp2009-logo-es_grey.gif);}

.en #header h1 a.y2008 { background: url(/assets/templates/grangeprize/gp2008-logo-en_grey.gif);}
.fr #header h1 a.y2008 { background: url(/assets/templates/grangeprize/gp2008-logo-fr_grey.gif);}
.es #header h1 a.y2008 { background: url(/assets/templates/grangeprize/gp2008-logo-es_grey.gif);}

#header h1 span {display: none;}
#header .partners {float: right; test-align: right; width: 200px; padding: 12px 0px;}
#header .partners a {padding: 20px; display: block; float: left;}
#header .partners span {display: none; }
/*
#nav-one {background: #373737;  clear: both; text-transform: lowercase; overflow: auto;  width: 958px;  font-size: 18px; color: #81c9be;}
#nav-one .artists {float: left; padding: 10px 20px; margin: 0 30px;}
#nav-one ul {padding: 10px 30px; }
#nav-one li {padding: 10px 20px;}
#nav-one a {color: #83c6bc;}
#nav-one a:active {color: #fff;}
#nav-one .active a {color: #fff;}

#nav-two {background: #4f4f4f; text-transform: lowercase;  overflow: auto;  width: 958px;}
#nav-two a {color: #81c9be; font-size: 14px;}
#nav-two a:active {color: #fff;}
#nav-two ul {padding: 10px 30px; }
#nav-two li {padding: 10px 20px;}
#nav-two .active a {color:  #fff;}

#subnav {background: #717171;  padding: 10px; color: #fff; text-transform: lowercase;  overflow: hidden; clear: both; font-size: 14px;}
#subnav ul {padding: 0px 20px; }
#subnav li {padding: 10px 15px;}
#subnav a {color: #81c9be; text-decoration:none;}
#subnav a:active {color: #fff;}

#subnav li.active a {color: #fff;}
*/
#content {padding: 40px 50px 40px 50px; border-top: 1px solid #1E1E1E; font-size: 14px; color: #363535; line-height: 24px;overflow:hidden;}
#content a, .copy a {font-weight:bold;} 
#content a:hover, .copy a:hover {color:#409286;text-decoration: none;}
#content h3 a {color: #363535; text-decoration:none;}

.sponsors {display:block;border-top: 1px solid #CCCCCC; margin-top:20px; padding: 22px 0 22px 50px;float:none;clear:both;overflow:auto;}
.sponsors .sponsorGroup {float:left;height:80px;border-right:1px solid #cccccc;padding:0 15px 0 25px;}
.sponsors h2 {font-size:11px;margin:0;padding:0;color:#000;margin-bottom:10px;}
.sponsors #supporting {padding-left:0;}
.sponsors img {margin-right:0;}
.sponsors img#globe {margin-top:10px;margin-right:30px;}
.sponsors img#bravo {margin-top:9px;}
.sponsors img#cc {margin-top:4px;margin-right:30px;}
.sponsors img#consulate {margin-top:8px;}
.sponsors .sponsorGroup img {float:left;}

#footer {background: #373737; border: 1px solid #373737; font-size: 11px; padding: 5px 50px; font-weight: bold;}
#footer a {color: #d4d4d4;text-decoration:none;}

/* Home Pages */
#homepageFlash {  border-bottom: 1px solid #fff; line-height: 0;}
#homepageFlash a { display: block; float: left;}

#home .copy {disply: block; clear: both; border-top: 1px solid #1E1E1E; padding: 50px;}
#home h2 {font-size:16px;padding:0;margin-bottom:1em;}
#home div.right img {padding:0;border:none;}
#home p {width:546px;}


/* BOXES, like on Artist landing page */
div#theartists,div#exhibitions {overflow:auto;float:none;clear:both;}
div.box {width:380px;border:1px solid #CCCCCC;margin-right:30px;margin-bottom:30px;float:left;padding:30px 0;overflow:hidden;}


div.box h3 {margin:0 40px;padding:0;}
div.box p {margin:0 40px .5em 40px;padding:0;}

#content #theartists div.box p a {font-size:12px;text-transform:uppercase;text-decoration:none;margin-right:1.5em;}
#theartists div.box img.bioImg {margin-left:40px;float:left;}
#theartists div.box ul {margin:0;padding:0;list-style:none;float:left;}
#theartists div.box li {padding-left:15px;height:75px;}

#exhibitions img {margin:0 40px;}
.credit {font-size:.8em;line-height:1em;color:#666666;}

.threecolumns {float: left; width: 30%; margin-right: 20px;}
.last {margin-right: 0;}

/* VOTE FORM 2010 */

div#vote-step1 {background:url(vote-steps-1.gif) 100% 0 no-repeat;}
div#vote-step2 {background:url(vote-steps-2.gif) 100% 0 no-repeat;padding-top:56px;}
div#vote-step3 {background:url(vote-steps-3.gif) 100% 0 no-repeat;padding-top:56px;}
div.vote-container h3 {margin:0;padding:0;width:188px;height:56px;text-indent:-4000em;background:url(vote-steps-title.gif)}
div.vote-container label {font-weight:bold;}

div.vote-container form, div.form-sub {border: 3px solid #cecece; padding: 20px 30px; overflow: auto; clear: both;text-align:left;}
div.form-sub {background:url(check-email-bg.gif) 49% 100px no-repeat;overflow:hidden;padding-top:60px;}

.errors {background: #d72a00; color: #fff; padding: 1em; margin-bottom: 25px; clear: both;}

fieldset {border:0;text-align:left;padding:20px 0 10px 0;margin:20px 0 30px 0;}
fieldset.artists, fieldset.your-info {padding-bottom:30px;border-bottom:1px solid #cecece;}
legend {font-size:13px;text-transform:uppercase;color:#000;font-weight:bold;float:none;clear:both;}

.input-radio {width: 120px;float: left; margin-right: 14px; text-align: center; font-weight: bold;}
div.input-radio label {
	display:block;
	padding-top:130px; 
	cursor:pointer;

}
label#label-artist-brand {background:url(vote-label-brand.jpg) 50% 0 no-repeat;}
label#label-artist-davey {background:url(vote-label-davey.jpg) 50% 0 no-repeat;}
label#label-artist-hewitt {background:url(vote-label-hewitt.jpg) 50% 0 no-repeat;}
label#label-artist-horton {background:url(vote-label-horton.jpg) 50% 0 no-repeat;}


div.input-email label, div.input-country label {
display:block;
width:170px;
float:left;
}

div.input-email, div.input-country {clear: both;float:none;overflow:hidden;padding-bottom:15px; }
div.input-email input, div.input-country input {width: 400px;float:left;}

.small {
font-size:10px;	
}
fieldset.fieldset-captcha p {margin-top:0;padding-top:0;}
.input-captcha, .input-captcha-subscribe {clear: both;}
.input-captcha img {float: left;}
.input-captcha label, .input-captcha input {margin-left: 25px;}
.button-vote {float:right;}
.button-vote input {background: #409286; padding:5px 15px; border:0; color: #fff; font-size: 30px; font-family: Arial, Helvetica, sans-serif;}


/* VOTE STEP 2 */
div.form-sub div.english {width:300px;float:left;}
div.form-sub div.french {width:300px;float:right;}

/* INLINE IMAGES */
div.right {float:right;padding-bottom:15px;padding-left:15px;text-align:right;}
div.img300 {width:300px;}
div.img200 {width:200px;}
div.right img {padding:3px;border:1px solid #ababab;}
div.right p {margin:0;padding:0;font-size:.8em;line-height:1em;color:#666666;}
div.noborder {width:200px;float:right;margin-left:15px;margin-bottom:15px;text-align:right;}
div.noborderSm {width:100px;float:right;margin-left:15px;margin-bottom:15px;text-align:right;}

/* ARTWORK LABELS */
p.artlabel {color:#000;line-height:15px;margin:0 0 2em 0;}

/* BLOG */

.narrowcolumn {width: 600px; float: left; padding-bottom: 30px;}
.widecolumn {width: 600px; margin: auto; text-align: left; padding-bottom: 30px;}

#sidebar {width: 250px; float: right; padding: 18px 0 30px 0;  text-align: left;}
#sidebar h2 {font-size: 14px; margin: 5px 0 0; padding: 9px 0 0; color: #000;}
#sidebar ul {margin: 5px 0 0 10px; padding: 0;}
#sidebar li {margin: 3px 0 0; padding:0; color: #999; font-size: 12px; list-style-image:none; list-style-type:none;}

#blog h2 {font-size: 24px; padding: 30px 0 0 0; margin: 0; clear: both;}
#blog h2 a {color: #666; text-decoration: none;}
#blog h2 a:hover {color: #409286; text-decoration: none;}

#comment {width: 100%; border: 1px solid #409286;}
#author, #email, #url {margin-right: 9px; width: 252px; border: 1px solid #409286;}
.commentlist {list-style: none; padding: 0;}
.commentlist .comment {border: 1px solid #ccc; margin: 18px 0; padding: 18px; font-size: 12px;}
.commentlist .even {background: #f2f2f2;}
.comment-author img {background:#fff; border:1px solid #ccc; float:right; padding: 2px;}
.comment-author cite {font-weight: bold; font-size: 13px;}
#submit {float: right;}

.narrowcolumn .postmetadata {text-align: center; clear: both; padding-top: 5px; color: #999;} 
.widecolumn .postmetadata {border-left: 1px solid #409286; font-size: 11px; padding: 9px 0 9px 18px; color: #666;}

/* Nav */

.gp-nav {background: #373737; width: 100%; overflow: hidden; font-size: 16px;overflow:hidden;}
.gp-nav a {padding: 0 1em;display:block;padding:14px 16px;}	
.gp-nav .active a {color: #fff;}
.gp-nav a:hover {color:#adadad;}

.gp-nav ul {list-style: none; padding: 0; margin: 0;}
/*.gp-nav li {display: block;}*/

.gp-nav .perennial {background: #2b2b2b; width: 298px; float: right; text-align: right; padding: 0;overflow:hidden;}
.gp-nav .perennial ul {margin-left:30px;overflow:hidden;text-align:right;} /*change left margin adjust alignment of perennial nav to the AGO logo*/
.gp-nav .perennial li {float:left;}
.gp-nav .perennial .active a {background:url(active-nav-arrow.gif) 50% 100% no-repeat;}

.gp-nav .current { width: 80px; float: left; padding: 0 0 0 40px; background: #2b2b2b url(/assets/templates/grangeprize/gp-year-arrow.gif) no-repeat right center;overflow:hidden;}
.gp-nav .current a {color: #fff; background: url(/assets/templates/grangeprize/whitearrow-down.gif) no-repeat left center; padding-left: 18px;}
.gp-nav .current li {float:left;}

.gp-nav .annual { padding: 0; width: 499px; float: left; overflow:hidden;}
.gp-nav .annual li {float:left;}
.gp-nav .annual .active a {background:url(active-nav-arrow.gif) 50% 100% no-repeat;}

.gp-nav .sub {background: #2b2b2b; clear: both; padding: 7px 0 7px 40px; text-align: center;font-size:13px; border-top:1px solid #fff;overflow:hidden;}
.gp-nav .sub li {display:inline;}
.gp-nav .sub a {display:inline;}

.gp-nav .years ul { margin: 0; padding: 0; position: absolute; visibility: hidden; border-bottom: 1px solid #424040; text-align: center;}
.gp-nav .years ul li {  display: block;float:none;clear:both;}
.gp-nav .years ul li a { width: 80px;  background: #adadad; color: #000; border-top: 1px solid #e2e2e2;  padding: 14px 0; display: block;}
.gp-nav .years ul li a:hover { background: #409286; color: #fff; }

.artists ul {list-style: none; padding: 0; margin: 0; text-align: right; }
.artists ul li {display: inline; padding: 0 1em;}
#content .artists ul li.active a {color: #666; text-decoration: none;}

/*ARTIST HUB PAGE*/

.artist-hub #content {padding: 40px 0;}
.artist-hub #content .hub-box {padding:20px 40px 0 40px;border-top:1px solid #d1d1d1;margin:0 0 40px 0;}
.artist-hub #content .hub-box:first-child, .artist-hub #content #first-hub-box {border-top:none;padding-top:0;}
.artist-hub h2 {margin-bottom:16px;}
.artist-hub div.video-box {width:276px;}
.artist-hub div.video-box p {color:#424040;font-size:12px;line-heght:15px;margin-top:0;padding-top:0;}


/* Slideshow */

.slideshow {width: 860px; overflow: hidden; color: #999; }
.slideshow a {font-size:10px;color:#c3c3c3;text-decoration:none;}
.slideshow .slide {width:860px; text-align: center; float: left; }
.slideshow .slide:hover {cursor: pointer;}
.slideshow .slide .caption {margin:30px 0; text-align: left;color:#000;font-size:12px;line-height:15px;}

.slideshow .slidecontrols {clear: both; text-align: center; width: 100%; overflow: hidden; margin: 15px 0;}

.slideshow .slidecontrols .arrow {float: left; display: block; width: 100px;height:30px;}
.slideshow .slidecontrols .arrow :hover {cursor: pointer;}
#content .slideshow .slidecontrols .arrow a {font-size:10px;color:#c3c3c3;text-decoration:none;font-weight:normal;}

/* 
Andrea - you can use images in the arrows if you want 

.slideshow .slidecontrols .arrow a span {display: none;}
.slideshow .slidecontrols #next a {background: url(/assets/templates/grangeprize/slide-arrow-right.gif); width:40px ; height:10px ;}
.slideshow .slidecontrols #prev a {background: url(/assets/templates/grangeprize/slide-arrow-left.gif); width:40px ; height:10px ;}
*/


.slideshow .slidecontrols .counter {list-style: none; margin: 0; padding: 0; overflow: hidden;}
.slideshow .slidecontrols .counter li {display: block; margin: 0; padding: 0; float: left; width: 13px; height:30px;background: url(/assets/templates/grangeprize/counter-off.gif) center 45% no-repeat;}
.slideshow .slidecontrols .counter li:hover {cursor: pointer;}
.slideshow .slidecontrols .counter li.selected {background: url(/assets/templates/grangeprize/counter-on.gif) center 45% no-repeat;}
.slideshow .slidecontrols .counter li span {display: none;}

/* IMAGE TOOL TIP */

div.image {text-align:right;}
div.image img {margin:0;}
div.image a.moreinfo {margin:0;font-size:9px;line-height:10px;color:#000;text-decoration:none;}