/*
	THE DRIFT <thedrift.ca>
	
	COLOURS:
	Body Text		#444
	Light Text		#777
	Heading			#444
	Sub-Heading		#fa012b
	Link			#f03
*/



/* Structure
------------------------------------*/
*									{ margin: 0; padding: 0; }

body								{ color: #444; background: #fff url('template/body-bg.gif'); font: 12px/20px lucida grande, lucida sans unicode, verdana, sans-serif; position: relative; }
div#container						{ width: 905px; margin: 0 auto; text-align: left; }
div#sub-container					{ float: left; background: url('template/container-bg.gif'); }
div#sidebar-container				{ width: 225px; padding-top: 75px; float: left; background: url('template/sidebar-top.gif') no-repeat; }
div#sidebar							{ width: 140px; margin: 5px 0 0 55px; }
div#header h1						{ float: left; margin: 0; width: 225px; height: 115px; background: url('template/logo.gif') no-repeat;  }
div#header h1 a						{ display: block; width: 225px; height: 115px; text-indent: -9999px; }
div#main							{ width: 680px; float: left; border-top: solid 1px #fa012b; }

div#content div.prop				{ height: 450px; width: 1px; float:right; }
div#content-short div.prop			{ height: 409px; width: 1px; float:right; }
div#container div.propclear			{ clear: both; height: 1px; overflow: hidden; }



/* Header
------------------------------------*/
div#artist-login					{ float: left; padding-top: 15px; }
div#artist-login a					{ display: block; width: 105px; height: 20px; margin-left: 490px; color: #fff; background: #fa012b url('template/artist-login.gif') no-repeat; font-size: 9px; text-decoration: none; text-align: center; }
div#nav-global						{ height: 40px; float: left; background: url('template/nav-global-bg.gif') no-repeat; }
div#nav-global ul					{ width: 680px; float: left; margin-top: 12px; list-style: none; }
div#nav-global ul li				{ float: left; padding-right: 17px; margin-right: 10px; background: url('template/nav-bullet.gif') no-repeat center right; }
div#nav-global ul li.last			{ padding: 0; background: none; margin: 0; }
div#nav-global ul li a				{ color: #666; font-size: 13px; text-decoration: none; }
div#nav-global ul li a:hover		{ color: #222; }
div#nav-global ul li a.current		{ color: #000; }
div#search							{ width: 680px; height: 40px; float: left; background: url('template/search-bg.gif') no-repeat; }
div#content,
div#content-short					{ width: 679px; float: left; background: #fff; }



/* Sidebar
------------------------------------*/
div ul#browse						{ border-top: solid 1px #fa012b; margin-top: 5px; padding: 5px 0; background: url('template/sidebar/browse-bg.gif'); list-style: none; }
ul#browse li						{ margin-left: 10px; padding: 5px 0; }
ul#browse li a						{ display: block; padding-left: 35px; color: #444; background: url('template/sidebar/bullet.gif') no-repeat 0px 5px; font-size: 14px; text-decoration: none; }
ul#browse li a strong				{ color: #999; font-weight: normal; text-transform: uppercase; }
ul#browse li a:hover				{ color: #000; background: url('template/sidebar/bullet.gif') no-repeat 0px -47px; }
ul#browse li a:hover strong			{ color: #444; }
ul#browse li.current a				{ color: #000; background: url('template/sidebar/bullet.gif') no-repeat 0px -47px;  }
ul#browse li.current a strong		{ color: #444; }
div#join							{ border-top: solid 1px #fa012b; padding: 10px 0; background: url('template/sidebar/join-bg.gif'); }
div#another-artist					{ border-top: solid 1px #fa012b; border-bottom: solid 1px #fa012b; padding: 10px 0 5px; }



/* Main
------------------------------------*/
div div.column						{ float: left; }
div div.content						{ width: 235px; margin-right: 25px; }
div div.narrow						{ width: 240px; }
div div.wide						{ width: 390px; }
div div.wide-content				{ width: 390px; margin-right: 25px; }
div div.full						{ width: 650px; }
div div.half						{ width: 313px; margin-right: 24px; }

div div#event-map					{ background: url('/template/map.gif') no-repeat; height: 440px; }



/* Footer
------------------------------------*/
div#footer							{  }
div#nav-footer						{ height: 30px; position: relative; clear: both; margin-left: 55px; padding-top: 35px; color: #999; background: url('template/footer-bg.gif') no-repeat; font-size: 10px; text-align: center; }
div#nav-footer a					{ color: #777; text-decoration: none; }
div#nav-footer a:hover				{ color: #222; }



/* General Typography
------------------------------------*/
p									{ margin-bottom: 18px; }

ul									{ list-style: none; }
div.narrow ul li a,
div.half ul li a					{ display: block; padding-left: 15px; font-weight: bold; background: url('template/larr.gif') no-repeat center left; }
div.narrow ul li a:hover,
div.half ul li a:hover				{ background: url('template/larr-hover.gif') no-repeat center left; }
div.narrow ul li.current a			{ text-decoration: none; color: #000; display: block; padding-left: 15px; font-weight: bold; background: url('template/larr-hover.gif') no-repeat center left; }

h1									{ margin: 30px 0 9px; font-size: 24px; font-weight: normal; line-height: 36px; }
h2									{ margin-bottom: 9px; font-weight: normal; line-height: normal; }
h3									{ margin-bottom: 9px; font-size: 16px; font-weight: normal; }
h4									{ margin-bottom: 18px; }
h5									{ margin-bottom: 18px; font-size: 13px; font-weight: normal; }

h2 a								{ color: #222; text-decoration: none; }
h2 a:hover, h2 a:visited			{ color: #222; text-decoration: none; }

a:link								{ color: #f03; outline: none; }
a:visited							{ color: #777; outline: none; }
a:hover								{ color: #222; outline: none; }
a img								{ border: none; }

hr									{ border: none; height: 1px; background: #fa012b; }

blockquote { padding: 20px 20px 1px; background: #fdd; }



/* Specific Typography
------------------------------------*/
div#main h2							{ margin-top: 30px; font-size: 18px; }
div#sidebar h2						{ margin: 0 10px; font-size: 16px; }
div#main div.narrow h2,
div#main div.half h2				{ font-size: 14px; }
div#main div.article h2				{ margin: 0 0 5px 0; }
div#search h2						{ width: 364px; height: 13px; margin: 14px 0 0 0; background: url('template/dates.gif') no-repeat; text-indent: -9999px; }

h5#nav-section						{ margin-top: 5px; color: #999; }
h5#nav-section strong				{ color: #222; font-weight: normal; text-transform: uppercase; }

div h1.browse						{ margin-top: 0; margin-bottom: 30px; width: 183px; padding: 4px 0 10px; color: #fff; background: #fa012b url('template/tab.gif') no-repeat bottom left; font-size: 16px; text-align: center; }

form h3								{ font-size: 13px; font-weight: bold; margin: 10px 0; }

div td.question						{ width: 50px; color: #fa012b; font-weight: bold; }

div div.error						{ color: #fff; background: #fa012b; padding: 5px; margin-top: 10px; } 
div div.info						{ color: #fff; background: #390; padding: 5px; margin-top: 10px; }

div#mssHolder						{ margin-top: 30px; }

div#search h2						{ float: left; }
div p.searchform					{ display: inline; float: right; margin: 10px 25px 0; }

p#logos								{ float: left; display: relative; margin: 25px 0 0; }
p#logos img							{ margin-right: 15px; }

div#another-artist h5				{ text-align: center; font-size: 11px; margin-bottom: 10px; }
div#another-artist p				{ text-align: center; font-size: 10px; margin-bottom: 5px; font-weight: bold; }

div a.feature-sponsor				{ float: left; display: block; width: 200px; height: 85px; text-align: center; margin-right: 25px; margin-bottom: 25px; text-decoration: none; }
a.feature-sponsor:hover				{ width: 200px; height: 85px; text-align: center; text-decoration: none; }
a.feature-sponsor img				{  }

div.sponsors						{ float: left; margin: 10px 10px 20px 0; width: 290px; }
div.sponsors h4 { margin-bottom: 5px; }

hr.clear							{ clear: left; height: 0; width: 0; margin: 0; padding: 0; border: none; background: transparent; }

p.fieldinfo							{ color: #666; font-style: italic; }

div.performance						{ margin-top: 30px; }
div.performance img					{ float: left; margin-right: 10px; }
div.performance-details				{ float: left; width: 203px; }

div.medium-checkboxes				{ float: left; width: 125px; margin-bottom: 9px; }



/* Articles/Events
------------------------------------*/
div.article h3						{ margin: 0 0 10px 0; font-size: 14px; }
div.article p.meta					{ margin: 0; }
div.article p.summary				{ margin: 0; font-size: 12px; font-style: italic; }
div.article div.body				{ margin-top: 0px; }
div.article img						{ float: left; }
div.article div.article-content 	{ float: left; width: 390px; margin-left: 10px; }



/* Artists
------------------------------------*/
ul#mediums							{ float: left; list-style: none; }
ul#mediums li						{ margin-bottom: 30px; }
div li.medium						{ float: left; width: 162px; }
li.medium strong					{ font-size: 16px; font-weight: normal; }
li.medium div						{ padding-left: 45px; background: no-repeat center left; padding-bottom: 1px; }
div#current-medium					{ float: left; width: 162px; }
div#current-medium div				{ padding-left: 45px; background: no-repeat center left; padding-bottom: 1px; }
div#current-medium strong			{ font-size: 16px; font-weight: normal; text-decoration: underline; }
div ul.names						{ float: left; width: 130px; list-style: none; }
ul.names li a						{ color: #222; }
ul.names li strong					{ color: #fa012b; }
ul#artists							{ width: 486px; float: left; list-style: none; }
ul#artists li						{ margin-bottom: 30px; }
div .artist							{ float: left; width: 243px; background: no-repeat center left; }
.artist strong						{ font-size: 14px; font-weight: normal; }
.artist img							{ vertical-align: middle; margin-right: 5px; }



/* Mapping
------------------------------------*/
div#map								{ width: 388px; height: 388px; border: solid 1px #999; }
div.map h3							{ margin: 0 0 5px 0; font-size: 14px; font-weight: bold; }
div.map p							{ margin: 0 0 5px 0; line-height: normal; font-size: 12px; }
span.redpin							{ color: #e00; font-weight: bold; }
span.bluepin						{ color: #0be; font-weight: bold; }



/* Buttons
------------------------------------*/
a.button:link,
a.button:visited,
a.button:hover						{ display: block; text-indent: -9999px; }
a#b-get-started						{ width: 109px; height: 26px; margin: 10px 0 0 10px; background: url('template/buttons/b-get-started.gif'); } 
a#b-join-artist						{ width: 210px; height: 26px; margin: 30px 0 15px 0; background: url('template/buttons/b-join-artist.gif'); } 
a#b-join-retailer					{ width: 210px; height: 26px; margin: 0 0 15px 0; background: url('template/buttons/b-join-retailer.gif'); } 
a#b-join-sponsor					{ width: 210px; height: 26px; margin: 0 0 15px 0; background: url('template/buttons/b-join-sponsor.gif'); } 
a#b-join-volunteer					{ width: 210px; height: 26px; margin: 0 0 15px 0; background: url('template/buttons/b-join-volunteer.gif'); } 
a#b-join-performer					{ width: 210px; height: 26px; margin: 0 0 15px 0; background: url('template/buttons/b-join-performer.gif'); } 
a#b-newsletter						{ width: 210px; height: 26px; margin: 0 0 0 0; background: url('template/buttons/b-newsletter.gif'); } 
a#b-events							{ width: 210px; height: 26px; margin: 0 0 15px 0; background: url('template/buttons/b-events.gif'); } 
a#b-back							{ width: 76px; height: 22px; margin: 0; background: url('template/back.gif'); } 
a#b-back:hover						{ width: 76px; height: 22px; margin: 0; background-position: 0px 22px; } 



/* News/Event Navigation
------------------------------------*/
div.nav								{ margin-top: 20px; }
div.nav .navitem					{ padding-bottom: 4px; }
div.nav .navitem.month				{ padding-left: 15px; }
div.nav .navitem.post				{ padding: 0 0 7px 30px; line-height: 14px; }
div.nav .arrowlink					{ padding-left: 15px; background: url('/template/larr.gif') no-repeat left center; }
div.nav .arrowlinkdown				{ padding-left: 15px; background: url('/template/darr.gif') no-repeat left center; }



/* Tables
------------------------------------*/
table { width: 100%; border-collapse: collapse; }

table td							{ vertical-align: top; }

table#partners						{ width: 100%; border-collapse: collapse; padding: 0; margin: 0; margin-top: 30px; border: solid 1px #fff; font-size: 11px; line-height: 18px; }
table#partners th					{ border: solid 1px #fff; padding: 3px 5px; text-align: left; vertical-align: top; }
table#partners td					{ border: solid 1px #fff; background: #eee; padding: 3px 5px; text-align: left; vertical-align: top; }

table#events						{ margin-top: 30px; border: solid 1px #fff; width: 100%; border-collapse: collapse; padding: 0; margin: 0; font-size: 11px; line-height: 18px; }
table#events th						{ border: solid 1px #fff; padding: 3px 5px; text-align: left; vertical-align: top; }
table#events td						{ border: solid 1px #fff; background: #eee; padding: 3px 5px; text-align: left; vertical-align: top; }

div table#calendar					{ padding: 10px; border: none; min-height: 500px; width: 100%; border-collapse: collapse; padding: 0; margin: 0; font-size: 11px; line-height: 18px; }
table#calendar th					{ padding: 3px 5px; border: solid 1px #fff; background: #fff; font-size: 11px; text-align: center; color: #666; }
table#calendar td					{ padding: 3px 5px; border: solid 1px #fff; background: #ddd; vertical-align: top; height: 80px; width: 14%; }
table#calendar td.empty				{ background: #f6f6f6; }
table#calendar caption				{ padding: 2px 0 5px; margin-top: 10px; font-size: 13px; font-weight: bold; }
table#calendar td.calendar-event	{ padding: 0; }
table#calendar td.event				{ padding: 3px 5px; background: #fdd; }


div table#calendar span.calendar-prev,
div table#calendar span.calendar-next { color: #ddd; }

div table#small-calendar			{ width: 190px; width: 100%; border-collapse: collapse; padding: 0; margin: 0; font-size: 11px; line-height: 18px; }
table#small-calendar caption		{ color: #666; font-weight: bold; margin-top: 30px; }
table#small-calendar caption a,
table#calendar caption a			{ color: #333; font-weight: normal; text-decoration: none; }
table#small-calendar th				{ border: solid 1px #fff; color: #999; font-size: 10px; font-weight: normal; text-align: center; }
table#small-calendar td				{ border: solid 1px #fff; color: #666; background: #ddd; text-align: center; width: 14%; }
table#small-calendar td	strong		{ color: #000; }
table#small-calendar td.empty		{ border: solid 1px #fff; background: #f9f9f9; text-align: center; }

div th.map-column, td.map-column	{ text-align: center; }



/* Forms
------------------------------------*/
form								{ margin-bottom: 20px; }
form p								{ margin-bottom: 10px; }
div table.form						{ border: none; width: 100%; border-collapse: collapse; }
table.form th, table.form td		{ border: none; border-bottom: solid 1px #ccc; padding: 0 5px; }
table.form td.last					{ border: none; }
table.form p						{ margin: 5px 0 10px 0; }
div input.text						{ width: 100%; border: solid 1px #ddd; background: #f6f6f6; font: 14px/18px lucida grande, lucida sans unicode, verdana, sans-serif; }
div input.narrow-text				{ width: 100px; border: solid 1px #ddd; background: #f6f6f6; font: 14px/18px lucida grande, lucida sans unicode, verdana, sans-serif; }
select								{ width: 100%; border: solid 1px #ddd; background: #f6f6f6; font: 14px/18px lucida grande, lucida sans unicode, verdana, sans-serif; }
optgroup							{ margin: 10px 0 5px; font: 12px/18px lucida grande, lucida sans unicode, verdana, sans-serif; font-weight: bold; }
optgroup option						{ font: 14px/18px lucida grande, lucida sans unicode, verdana, sans-serif; }
textarea							{ width: 99%; border: solid 1px #ddd; background: #f6f6f6; color: #333; font: 11px/14px lucida grande, lucida sans unicode, verdana, sans-serif; padding: 3px; }
div textarea.bio					{ width: 100%; border: solid 1px #ddd; background: #f6f6f6; color: #000; font: 12px/14px lucida grande, lucida sans unicode, verdana, sans-serif; }
div select.required					{ border: solid 1px #daa; background: #fee; color: #903; }
div table.form input.required		{ border: solid 1px #daa; background: #fee; color: #903; }
div input.form-button				{ font: 14px/18px lucida grande, lucida sans unicode, verdana, sans-serif; padding: 3px; }
div#search input 					{ vertical-align: middle; }



/* Autosuggest
------------------------------------*/
div.autosuggest						{ position: absolute; padding: 10px 0 0 0; z-index: 9000; }
div.autosuggest ul					{ overflow: hidden; margin: 0 0 -4px 0; padding: 0; background-color: #f6f6f6; border: solid 1px #ddd; list-style: none; }
div.autosuggest ul li				{ color: #444; text-align: left; }
div.autosuggest ul li a				{ display: block; position: relative; padding: 3px 5px; color: #666; text-decoration: none; }
div.autosuggest ul li a:hover		{ background-color: #ccc; color: #666; }
div.autosuggest ul li a:hover em	{ color: #000; }
div.autosuggest ul li a span small	{ color: #999; font-weight: normal; }
div.autosuggest ul li.as_highlight a span small { color: #ccc; }
div.autosuggest ul li.as_warning	{ font-weight: bold; text-align: center; }
div.autosuggest ul em				{ color: #000; font-weight: bold; }
div .asholder						{ position: relative; }
div #asdiv							{ z-index:9000; }



/* Calendar
------------------------------------*/
div div.calendar					{ display: none; position: relative; border: 1px solid; border-color: #fff #000 #000 #fff; cursor: default; color: WindowText; background: Window; z-index: 300; }
div.calendar table					{ width: auto; border: 1px solid; border-color: #fff #000 #000 #fff; cursor: default; color: WindowText; background: Window; }

div.calendar .button				{ padding: 1px; border: 1px solid; border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight; background: ButtonFace; text-align: center; }
div.calendar .nav					{ background: ButtonFace url(menuarrow.gif) no-repeat 100% 100%; }

div.calendar thead .title			{ padding: 1px; border: 1px solid #000; font-weight: bold; color: CaptionText; background: ActiveCaption; text-align: center; }
div.calendar thead .name			{ padding: 2px; border-bottom: 1px solid ButtonShadow; text-align: center; background: ButtonFace; color: ButtonText; }
div.calendar thead .weekend			{ color: #f00; }
div.calendar thead .hilite			{ padding: 0px; border: 2px solid; border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight; }
div.calendar thead .active			{ padding: 2px 0px 0px 2px; border-width: 1px; border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow; }

div.calendar tbody .day				{ width: 2em; padding: 2px 4px 2px 2px; text-align: right; }
div.calendar tbody .day.othermonth	{ color: #aaa; font-size: 80%; }
div.calendar tbody .day.othermonth.oweekend { color: #faa; }

div.calendar table .wn				{ padding: 2px 3px 2px 2px; border-right: 1px solid ButtonShadow; background: ButtonFace; color: ButtonText; }
div.calendar tbody .rowhilite td	{ background: Highlight; color: HighlightText; }
div.calendar tbody td.hilite		{ padding: 1px 3px 1px 1px; border-top: 1px solid #fff; border-right: 1px solid #000; border-bottom: 1px solid #000; border-left: 1px solid #fff; }
div.calendar tbody td.active		{ padding: 2px 2px 0px 2px; border: 1px solid; border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow; }
div.calendar tbody td.selected		{ padding: 2px 2px 0px 2px; border: 1px solid; border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow; color: ButtonText; background: ButtonFace; font-weight: bold; }
div.calendar tbody td.weekend		{ color: #f00; }
div.calendar tbody td.today			{ color: #00f; font-weight: bold; }
div.calendar tbody td.disabled		{ color: GrayText; }
div.calendar tbody .emptycell		{ visibility: hidden; }
div.calendar tbody .emptyrow		{ display: none; }

div.calendar tfoot .ttip			{ padding: 1px; border: 1px solid; border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow; color: ButtonText; background: ButtonFace; text-align: center; }
div.calendar tfoot .hilite			{ padding: 1px; border-top: 1px solid #fff; border-right: 1px solid #000; border-bottom: 1px solid #000; border-left: 1px solid #fff; background: #e4e0d8; }
div.calendar tfoot .active			{ padding: 2px 0px 0px 2px; border-top: 1px solid #000; border-right: 1px solid #fff; border-bottom: 1px solid #fff; border-left: 1px solid #000; }

div.calendar .combo					{ display: none; position: absolute; width: 4em; top: 0px; left: 0px; cursor: default; padding: 1px; border: 1px solid; border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight; background: Menu; color: MenuText; font-size: 90%; z-index: 100; }
div.calendar .combo .label,
div.calendar .combo .label-IEfix	{ padding: 1px; text-align: center; }
div.calendar .combo .label-IEfix	{ width: 4em; }
div.calendar .combo .active			{ padding: 0px; border: 1px solid #000; }
div.calendar .combo .hilite			{ background: Highlight; color: HighlightText; }

div#search_container				{ width: 650px; }