html, body {width: 100%;}
body, div	{margin: 0; padding: 0; cursor: default;}
img, a img	{border: 0; padding: 0; margin: 0;}
div {border: 0px solid #CF0;}

/*** LAY-OUT ***/

div.center	{margin: auto; width: 996px;}
div.side	{float: left; width: 200px; margin-left: 8px; display: inline;}
div.mainContainer	{float: left; width: 780px; background-color: #000; display: inline;}
div.main, div.mainPink, div.mainBlue, div.mainYellow, div.mainGreen {max-width: 765px; width: 765px; margin-left: 15px;}

div#header {}
div#header div.center {margin-top: 10px;}
div#header div.menuCol {float: left; margin-top: 5px; margin-right: 40px; display: inline;}
div#header div.menuColRight {float: right; width: 188px; margin-top: 4px; border: 1px dashed #00CAFF; text-align: right; padding: 5px; display: inline;}
div#header div.main {margin-bottom: 8px;}
div#homeButton {float: right; width: 60px; margin-top: 28px; display: inline;}

div#header_avatar {float: right; margin-left: 4px;}
div#header_usermenu {float: right; margin-top: 3px;}

div#content {}
div#content div.side {}
div#content.home div.side {background-color: transparent;}
div#content div.main, div.mainPink, div.mainBlue, div.mainYellow, div.mainGreen {background-color: #000; padding-bottom: 30px; min-height: 474px;}

div.subMainLeft {float: left; width: 180px; height: 100%; overflow: hidden;}
div.mainMainRight {float: right; width: 570px; overflow: hidden;}

div.mainMainLeft {float: left; width: 550px; overflow: hidden;}
div.subMainRight {float: right; width: 200px; overflow: hidden;}

div#subAnimator {}
div#subAnimator div {width: 180px; float: left; display: inline; margin-right: 0px;}

div.homeBanner {margin: 15px 0;}

div#footer {}
div#footer div.center {margin-bottom: 30px;}
div#footer div.footerCol {float: left; margin-right: 40px;}
div#footer div.footerColRight {float: right; width: 200px;}
div#footer img.sponsor {max-width: 40px; max-height: 40px;}

br.clear {clear: both;}

/*** MARK-UP ***/

body {background-color: #000; color: #E1E5D8; font-family: helvetica, arial; font-size: 12px;}
hr {height: 0; border:0; border-top: 1px solid #7D8078; margin: 16px 0; overflow: hidden;}
div.hr {height: 0; border-top: 1px solid #7D8078; margin: 16px 0; overflow: hidden;}
div.hr hr {display: none;}
.sub {font-size: 10px; color: #E1E5D8; font-weight: normal;}
form {padding: 0; margin: 0;}
table {padding: 0; border-collapse: collapse; margin: 0;}
td,th {font-size: 12px; font-weight: normal;}

th {text-align: right; padding-top: 6px; width: 200px; padding-right: 13px; vertical-align: top;}
img.loading_graphic {width: 15px; height: 15px; position: relative; top: 4px; margin-left: 4px; display: none;}

table.account_form {width: 100%;}
table.account_form input[type="text"],
table.account_form input[type="password"],
textarea {width: 288px;}
textarea {height: 80px;}

table.findpeople_form th {text-align: left;}
table.findpeople_form input[type="text"] {width: 288px;}

img.right {float: right; margin-left: 10px; margin-bottom: 10px; max-width: 60%;}

/* divs */

div.side	{color: #E1E5D8; font-size: 11px;}
div#header, div#header div.side {color: #FFFFFF; font-size: 12px;}
div#content {background-color: #000; background: url("../img/bg.gif") center top;}
div#content div.side, div#footer div.side, div#footer div.main {border-top: 3px solid #E1E5D8;}			
div#content div.main		{border-top: 3px solid #E1E5D8;}
div#content div.mainYellow	{border-top: 3px solid #FFFF00;}
div#content div.mainPink	{border-top: 3px solid #F6009A;}
div#content div.mainBlue	{border-top: 3px solid #00CAFF;}
div#content div.mainGreen	{border-top: 3px solid #3DDE0E;}
div#footer	{color: #E1E5D8; font-size: 10px;}

/* heading */

h1 		{font-size: 18px; margin: 15px 0;}
h2		{font-size: 15px; margin: 20px 0 10px 0;}
h3		{text-transform: uppercase; color: #E1E5D8;}
strong	{color: #FFF;}

div#header h1							{font-weight: normal; margin: 0; color: #7D8078; text-transform: uppercase;}
div.mainYellow h1, div.mainYellow h2	{color: #FFFF00;}
div.mainPink h1, div.mainPink h2		{color: #F6009A;}
div.mainBlue h1, div.mainBlue h2		{color: #00CAFF;}
div.mainGreen h1, div.mainGreen h2		{color: #3DDE0E;}
div.subMainLeft h1, div.subMainRight h1 {font-weight: normal;}
#content .side h1, #content .side h1 a	{font-size: 14px; color: #3DDE0E;}
div#footer h1							{font-weight: normal; font-size: 10px; color: #7D8078;}

/* body text */

p.intro {font-weight: bold;}
div.p {margin: 12px 0;}
div.p img {max-width: 100%;}
div.mainMainRight p, div.mainMainLeft p, div.p {width: 85%;}
div.p p, div.p div.p {width: 100%;}

/* hyperlinks */
a			{color: #FFF; text-decoration: underline;}
a:hover		{text-decoration: none;}

h1 a,
h2 a,
h3 a		{color: inherit; text-decoration: underline;}
h1 a:hover,
h2 a:hover,
h3 a:hover	{text-decoration: underline;}


a.page, a.page-active {border: 1px solid #7D8078; color: #E1E5D8; padding: 1px 3px; text-decoration: none;}
a.page:hover, a.page-active:hover {background-color: #E1E5D8; color: #000; border: 1px solid #E1E5D8;}
a.page-active {background-color: #7D8078; color: #000;}

div#homeButton a, div#header a			{font-weight: bold; color: #FFF; text-decoration: none; padding: 0 1px;}
div#homeButton a:hover,
div#homeButton a.active					{color: #000; background-color: #FFF;}
a#logolink								{padding: 0;}
div#footer a							{color: #E1E5D8;}

div#menu_about a:hover,
div#menu_about a.highlight:hover,
div#menu_about a.active					{color: #000; background-color: #FFFF00;}
div#menu_about a.highlight				{color: #FFFF00;}
div#menu_events a:hover,
div#menu_events a.highlight:hover,
div#menu_events a.active				{color: #000; background-color: #F6009A;}
div#menu_events a.highlight				{color: #F6009A;}
div#menu_community a:hover,
div#menu_community a.highlight:hover,
div#menu_community a.active,
div#header div.menuColRight a:hover,
div#header div.menuColRight a.higlight:hover,
div#header div.menuColRight a.active	{color: #000; background-color: #00CAFF;}
div#header .sub 						{color: #7D8078; font-weight: normal;}
div#menu_community a.highlight			{color: #00CAFF;}
div#header div.menuColRight a#my_name 	{color: #00CAFF; font-weight: normal; font-size: 15px;}
div#header div.menuColRight a#my_name:hover {color: #000; background-color: #00CAFF;}
div#header_avatar a 					{text-decoration: none; padding: 0;}
div#header_avatar a img					{border: 1px solid #000;}
div#header_avatar a:hover 				{background-color: transparent;}
div#header_avatar a:hover img			{border: 1px solid #00CAFF;}

a.button,
a.button_blue {
	background: transparent url('../img/button_bg_right.png') no-repeat scroll top right;
	color: #E1E5D8; font-size: 10px; text-decoration: none;
	height: 15px;
	padding: 1px 3px 2px 0;
	margin: 3px 0;
}
a.button span,
a.button_blue span {
	background: transparent url('../img/button_bg_left.png') no-repeat scroll;
	line-height: 12px;
	padding: 1px 3px 2px 6px;
}
a.button:active,
a.button_blue:active {
	background-position: bottom right;
	color: #7D8078;
	outline: none;
}
a.button:active span,
a.button_blue:active span {
	background-position: bottom left;
	padding: 1px 3px 2px 6px;
}
a.button span.cancel,
a.button_blue span.cancel {color: #7D8078;}

a.button_blue {background-image: url('../img/button_bg_blue_right.png');}
a.button_blue span {background-image: url('../img/button_bg_blue_left.png');}

div#header div.menuColRight a.button:hover,
div#header div.menuColRight a.button_blue:hover {background-color: transparent;}

div.rel {position: relative;}
a.feedlink	{display: block; position: absolute; top: 2px; right: 0;}

a.feed {display: block; text-indent: 17px; background: url("../img/feed.png") no-repeat left; text-decoration: none; margin: 5px 0;}
a.cal {display: block; text-indent: 17px; background: url("../img/icon_cal.gif") no-repeat left; text-decoration: none; margin: 5px 0;}
a.feed:hover, a.cal:hover {text-decoration: underline;}

a.function {border: 1px dashed #00CAFF; padding: 0 2px; text-decoration: none; margin: 3px 1px 3px 0; line-height: 20px;}
a.function:hover {color: #000; background-color: #00CAFF; border: 1px solid #00CAFF;}

/* lists */
ul {list-style-type: none; padding: 0; margin: 0;}
li {list-style-type: none; background: url("../img/arrow.png") no-repeat 0 0; text-indent: 17px; margin: 3px 0;}

.ac_results {background: #EEE; opacity: 1;}
.ac_results li {background-image: none; background-color: #FFF; color: #000; text-indent: 0; padding: 3px;}

/* colors cheat sheet */

.pink		{color: #F6009A;}
.blue		{color: #00CAFF;}
.yellow		{color: #FFFF00;}
.green		{color: #3DDE0E;}
.grey		{color: #E1E5D8;}
.darkgrey	{color: #7D8078;}

/* design elements */

span.home_payoff	{font-weight: normal; font-size: 19px; line-height: 19px; display: block; margin: 15px 0 40px 0;}
input#bgsearch		{background: url("../img/searchfield.png") center no-repeat transparent; width: 184px; height: 12px; padding: 5px 8px; border: 0px solid; color: #7D8078; margin: 0;}
input#bgsearch:focus, input#bgsearch:hover {color: #E1E5D8; outline: 0;}

span.award {color: #FFFF00; font-size: 9px; background:url("../img/star.png") no-repeat 0 0; text-indent:14px; display:block; padding: 2px 0; margin: 4px 0 0 0;}


span.date {width: 25px; display: block; color: #F6009A; border-right: 1px solid #7D8078; margin: 0 4px 0 0; padding: 0 1px 0 0;}
span.date span.month {font-size: 10px; text-align: center; width: 100%; display: block; text-transform: uppercase;}
span.date span.day {font-size: 15px; text-align: center; width: 100%; display: block;}

div.error {background: url("../img/error.png") no-repeat center; width: 9px; height: 15px; float: left; margin-right: 4px; display: none;}
div.error_message {background: url("../img/error.png") no-repeat left; padding-left: 20px; color: #F00; margin: 15px 0;}

#profile_picture {float: left; margin: 14px 10px 10px 0; width: 230px; height: 230px;}
a.thumb img {max-height: 100px; margin-right: 5px;}

div.event_page span.date {float: left; margin: 13px 5px 0 0; width: 25px;}
div.event_page span.info {float: left; width: 510px;}

/* - generic lists */

div.item_medium {border: 1px solid; margin-bottom: 4px; padding: 2px 4px;}
div.item_medium h3 {margin-top: 3px;}

/* - user lists */

div.user_small {float: left; padding: 1px; margin: 0 8px 8px 0;}
div.user_small a {display: block; width: 100%; font-size: 10px; color: #E1E5D8;}
div.user_small a:link,
div.user_small a:visited,
div.user_small a:hover {text-decoration: none;}
div.user_small img {float: left; width: 30px; height: 30px;}
div.user_small span.info {float: left; margin: 1px 0 0 2px; padding: 1px; width: 166px; overflow: hidden;}
div.user_small strong {font-size: 12px;}
div.user_small:hover {background-color: #00CAFF;}
div.user_small:hover strong {color: #000;}
div.user_small:hover span.info {color: #000;}

div.user_short {float: left; padding: 1px; margin: 0 8px 8px 0;}
div.user_short a {display: block; width: 100%; font-size: 12px; color: #E1E5D8;}
div.user_short a:link,
div.user_short a:visited,
div.user_short a:hover {text-decoration: none;}
div.user_short img {float: left; width: 50px;}
div.user_short span.info {float: left; border-top: 1px solid #7D8078; margin: 0 0 0 3px; padding: 4px; width: 204px; overflow: hidden;}
div.user_short:hover {background-color: #00CAFF;}
div.user_short:hover strong {color: #000;}
div.user_short:hover span.info {border-top: 1px solid #00CAFF; color: #000;}
div.user_short:hover span.blue {color: #7D8078;}

/* - tiling lists */

div.tile_team {float: left; margin: 0 10px 10px 0; font-size: 10px; display: inline; width: 110px;}
div.tile_team img {width: 110px; height: 110px;}
div.tile_team strong {font-weight: bold; font-size: 11px;}

/* - home dashboard */

div.news_short {padding: 1px; margin: 0 0 10px 0;}
div.news_short a {display: block; width: 100%;}
div.news_short a:link,
div.news_short a:visited,
div.news_short a:hover {text-decoration: none;}
div.news_short span.title {font-size: 14px; color: #FFFF00;}
div.news_short .sub {font-size: 9px; color: #7D8078;}
div.news_short:hover {background-color: #FFFF00;}
div.news_short:hover span.title,
div.news_short:hover a {color: #000;}

div.event_short, div.event_medium {padding: 1px; margin: 0 0 10px 0;}
div.event_short a {display: block; width: 100%; font-size: 10px; color: #E1E5D8;}
div.event_medium a {display: block; width: 100%; font-size: 11px; color: #E1E5D8;}
div.event_short a:link,
div.event_short a:visited,
div.event_short a:hover,
div.event_medium a:link,
div.event_medium a:visited,
div.event_medium a:hover {text-decoration: none;}
div.event_short span.date, div.event_medium span.date {float: left;}
div.event_short span.info {float: left; width: 166px; overflow: hidden;}
div.event_medium span.info {float: left; width: 85%; overflow: hidden;}
div.event_short span.info strong, div.event_medium span.info strong {color: #F6009A; font-size: 14px;}
div.event_short:hover, div.event_medium:hover {background-color: #F6009A;}
div.event_short:hover span.date,
div.event_short:hover span.info,
div.event_short:hover span.info strong, 
div.event_medium:hover span.date, 
div.event_medium:hover span.info, 
div.event_medium:hover span.info strong {color: #000;}

/* - cross link button */

div.crosslink, div.crosslink_festival, div.crosslink_nl {background-color: #000; border: 1px dashed #7D8078; margin: 10px 0; padding: 7px; padding-left: 40px;}
div.crosslink a, div.crosslink_festival a, div.crosslink_nl a {text-decoration: none; color: #E1E5D8; font-size: 15px;}
div.crosslink a:hover, div.crosslink_festival a:hover, div.crosslink_nl a:hover {color: #F6009A;}

/* - sub navigation */

div.subnavItem, div.subnavItem-active	{padding: 6px 0; margin: 0 0 8px 0; border-top: 1px dashed #000; border-bottom: 1px dashed #000;}
div.main div.subnavItem-active			{border-color: #E1E5D8;}
div.mainYellow div.subnavItem-active	{border-color: #FFFF00;}
div.mainPink div.subnavItem-active		{border-color: #F6009A;}
div.mainBlue div.subnavItem-active		{border-color: #00CAFF;}
div.mainGreen div.subnavItem-active		{border-color: #3DDE0E;}

/* hint popup */
#dialog {
	display: none; 
	position: fixed; top: 30px; left: 30px; z-index: 300; 
	border-top: 3px solid #F00;
	padding: 20px 20px 25px 20px; 
	background-color: #000;
	color: #F00;
	font-size: 16px;
	font-weight: bold;
	opacity: 0.9;
}
#dialogBG {
	display: none;
	position: fixed; top: 0; left: 0; z-index: 299;
	background-color: #000; width: 100%; height: 100%;
}

div#header div#forgotmenu {
	display: none;
}

div.subField {
	border: 1px solid #333;
	background-color: #111;
	padding: 6px 8px;
}
div.subField input[type=text] {
	width: 80%;
}
div.printOnly {
	display: none;
}