/**
 * Stylesheet for Sigchi
 *
 * @media	screen, projection
 * @copyright	Netlash <http://www.netlash.com>
 * @author	Bram Van Damme <bramus@netlash.com>
 */

/**
 * = Clearfix
 * ----------------------------------------------------------
 */

	.clearfix:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}


/**
 * = 1. Primary Selectors (Font-sizes & Colors)
 * ----------------------------------------------------------
 */

	body {
		font: 400 12px Verdana, Arial, Helvetica, sans-serif;
		background: #fff url(../images/headerstrip.gif) repeat-x 0 0;
		padding: 0 0 20px 0;
		color: #000;
	}

	.mceContentBody { /* Undo piece of the above in Tiny :) */
		padding: 0;
		background: #fff;
	}

	h1, h2, h3, h4, h5, h6 {
		color: #ee820f;
		font-weight: 700;
		line-height: 1;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		margin-bottom: 5px;
	}

	h1 {	font-size: 24px; }
	h2 {	font-size: 22px; margin-bottom: 12px; }
	h3 {	font-size: 18px; }
	h4 {	font-size: 16px; }
	h5 {	font-size: 14px; }

	hr.hidden {
		display: none;
	}

	img.floatLeft {
		display: block;
		float: left;
		margin: 0 25px 25px 0;
	}

	img.floatRight {
		display: block;
		float: right;
		margin: 0 0 25px 25px;
	}

/**
 * = 2. Primary Selectors
 * ----------------------------------------------------------
 */

 	ul, ol {
		padding: 0 0 0 20px;
	}

	ul {
		list-style: square;
	}

	ol {
		list-style: decimal;
	}

	strong, b {
		font-weight: 700;
	}

	em, i {
		font-style: italic;
	}

	sub {
		vertical-align: sub;
	}

	sup {
		vertical-align: super;
	}
/**
 * = 3. General Positioning
 * ----------------------------------------------------------
 */

 	#wrapper {
		width: 900px;
		margin: 0 auto 0;
		padding: 0;
		position: relative;
	}

	#main {
		background: url(../images/fauxcols.gif) repeat-y 0 0;
		padding: 0;

		position: relative;
		z-index: 10;
	}

/**
 * = 4. Header
 * ----------------------------------------------------------
 */

	#header {
		width: 900px;
		height: 168px;
		overflow: visible;
		position: relative;
	}

	/**
	 * = 4.1 Logo
	 * ------------------------------------------------------
	 */

		#header h1 {
			display: block;
			width: 175px;
			height: 46px;
			position: absolute;
			top: 52px;
			left: 0px;
		}

		#header h1 a {
			display: block;
			width: 175px;
			height: 46px;
			text-indent: -9999px;
			background: transparent url(../images/logo.gif) no-repeat 0 0;
		}

	/**
	 * = 4.2 Tagline
	 * ------------------------------------------------------
	 */

		#header h2 {
			display: block;
			width: 312px;
			height: 19px;
			position: absolute;
			top: 105px;
			left: 26px;
		}

		#header h2 a {
			display: block;
			width: 312px;
			height: 19px;
			text-indent: -9999px;
			background: transparent url(../images/tagline.gif) no-repeat 0 0;
		}

	/**
	 * = 4.1 Postit
	 * ------------------------------------------------------
	 */

	 	p#postit {
			display: block;
			width: 236px;
			height: 236px;
			margin: 0;
			padding: 0;

			position: absolute;
			right: 0;
			top: 0;

			text-indent: -9999px;
			background: transparent url(../images/postit.gif) no-repeat 0 0;

			z-index: 5;
		}


		#home p#postit {
			/*background-image: url(../images/postit_home.gif);*/
			z-index: 10000;
		}




/**
 * = 5. Sidebar
 * ----------------------------------------------------------
 */

	#sidebar {
		/* background: #f2efe9; */
		background: transparent url(../images/sidebartop.gif) no-repeat 0 0;
		width: 237px;
		float: left;
		margin-right: 22px;
		padding-top: 10px;
	}

	#sidebar ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	#sidebar ul li {
		margin: 0;
		padding: 0;
		list-style: none;
		min-height: 30px;
	}

	#sidebar ul li a {
		display: block;
		height: 30px;
		padding-left: 25px;
		font: 700 12px "Trebuchet MS", Trebuchet, Arial, Helvetica;
		line-height: 30px;
		color: #000;
		text-decoration: none;
		background: transparent url(../images/blank.gif) no-repeat 10px 50%;
	}

	#sidebar ul li.haschildren a {
		background: transparent url(../images/menu_off.gif) no-repeat 217px 50%; /* 10px 50% */
	}

	#sidebar ul li li a {
		padding-left: 40px;
	}

	#sidebar ul li.haschildren li a {
		background-image: none;
	}

	#sidebar ul li.haschildren li.haschildren a {
		padding-left: 40px;
		background-image: url(../images/menu_on.gif);
		background-position: 217px 50%; /* 25px 50% */
	}

	#sidebar ul li a:hover {
		background-color: #EFA659;
		color:#fff;
	}

	#sidebar ul li.haschildren a:hover {
		background-color: #EFA659;
		background-image: url(../images/menu_on.gif);
		color:#fff;
	}

	#sidebar ul li.haschildren li a:hover {
		background-color: #F2EFE9;
		background-image: none;
		color:#EFA659;
	}

	#sidebar ul li.haschildren li.haschildren a:hover {
		background-color: #F2EFE9;
		background-image: url(../images/menu_on.gif);
		color:#EFA659;
	}

	#sidebar ul li a.selected {
		background-color: #ee820f;
		color:#fff;
	}

	#sidebar ul li.haschildren a.selected {
		background-color: #ee820f;
		background-image: url(../images/menu_selected.gif);
		color:#fff;
	}

	#sidebar ul li.haschildren li a.selected {
		background-color: #F2EFE9;
		color: #ee820f;
		background-image: none;
		/*background-image: url(../images/menu_on.gif);*/
	}

	#sidebar ul li.haschildren li.haschildren a.selected {
		background-color: #F2EFE9;
		color: #ee820f;
		background-image: url(../images/menu_selected.gif);
	}

	#sidebar ul li.haschildren li.haschildren li a {
		padding-left: 60px;
		background-position: 40px 50%;
		background-image: none; /* third level links have no arrow! */
	}



	/* third level links have no arrow! */
	#sidebar ul li.haschildren li.haschildren li a:hover, #sidebar ul li.haschildren li.haschildren li a.selected {
		background-image: none;
	}


/**
 * = 6. Breadcrumbs
 * ----------------------------------------------------------
 */

 	#breadcrumbs {
		font: 700 11px "Trebuchet MS", Trebuchet, Arial, Helvetica;
		color: #000;
		padding: 40px 0 0 0;
		line-height: 11px;
	}

 	#breadcrumbs a, #breadcrumbs span {
		font-weight: 400;
		color: #000;
	}


/**
 * = 7. Content
 * ----------------------------------------------------------
 */

	#content {
		width: 628px;
		float: right;

		font-size: 12px;
		line-height: 18px;
		font-family: Verdana, Arial, Helvetica, sans-serif;

		color: #000;
	}

	#content h1 {
		color: #11206b;
		font: 700 24px/24px "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif;
		line-height: 24px;
		padding-bottom: 12px;
	}

	#content h2 {
		color: #11206b;
		font: 700 16px/18px "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif;
		line-height: 18px;
		padding-top: 12px;
	}

	#content h3 {
		color: #EE820F;
		font: 700 14px/18px "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif;
		line-height: 18px;
		padding-top: 20px;
	}

	#content p, #content ul, #content ol, #content li {
		padding-bottom: 5px;
	}

	#content p {
		line-height: 20px;
	}

	#content ul {
		list-style-image: url(../images/li.gif);
	}

	#content ul ul, #content ol ol, #content ul ol, #content ol ul {
		padding-bottom: 0;
	}

	#content a {
		color: #ee820f;
		color: #EFA659;
	}

	#content .mceContentBody a { /* Undo piece of the above in Tiny :) */
		color: #EFA659 !important;
	}

	#content a:visited {
		color: #EFA659;
	}

	#content a:hover {
		color: #ee820f;
	}

	#content .mceContentBody a:hover { /* Undo piece of the above in Tiny :) */
		color: #ee820f !important;
	}

	/*
	#content p.special, #content p.special a {
		font-size: 14px;
		color: #11206b;
	}
	#content p.special a:hover {
		font-size: 14px;
		color: #ee820f;
	}
	*/

	/* 2DO : extra styles for images */

	/**
	 * = 7.1 Content : page Images
	 * ----------------------------------------------------------
	 */

		#content a.pageimage {
			display: block;
			float: right;
			background: #f2efe9;
			border: 1px solid #cbcbcb;
			padding: 4px 4px 0 4px;
			margin: 0 10px 10px 0;
			text-decoration: none;
		}

		#content a.pageimage img {
			display: block;
		}

		#content a.pageimage span {
			display: block;
			padding-left: 30px;
			height: 24px;
			background: transparent url(../images/enlarge.gif) no-repeat 0 50%;
			font: 400 12px/24px "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif;
			line-height: 24px;
			color: #595959;
			padding-top: 4px;
			cursor: pointer;
			_display: inline-block;
		}

	/**
	 * = 7.1 Content : homepage
	 * ----------------------------------------------------------
	 */

		/**
		 * = 7.1.1 Content : homepage : leaderboard --> changed to slideshow
		 * ----------------------------------------------------------
		 */

			#h_slideshow {
				background: #f2efe9;
				position: relative;
				width: 258px;
				height: 194px;
				margin-top: 70px;
			}

			#h_slideshow #leaderboardImage {
				width: 258px;
				height: 194px;
				display: block;
			}

			.rounded {
				position: relative;
			}

			.rounded .rc {
				display: block;
				width: 10px;
				height: 10px;
				background: transparent url(../images/rounded.png) no-repeat 50% 50%;
				z-index: 30;
				position: absolute;
				line-height: 1px;
				font-size: 1px;
			}

			.tl {	left: -5px;		top: -5px;		}
			.tr {	right: -5px;	top: -5px;		}
			.bl {	left: -5px;		bottom: -5px;	}
			.br {	right: -5px;	bottom: -5px;	}

		/**
		 * = 7.1.2 Content : homepage : content (news + text)
		 * ----------------------------------------------------------
		 */

		 	/*
			#h_wrapper {
				padding-top: 20px;
			}
			*/

			#h_sidebar {
				width: 258px;
				float: left;
			}

			#h_news {
				width: 228px;
				padding-right: 15px;
				padding-left: 15px;
				margin-top: 25px;
				background: #f2efe9;
			}

			#h_news h1 {
				color: #ee820f;
				font: 700 22px/36px "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif;
				line-height: 36px;
			}

			#h_news h2 {
				color: #ee820f;
				font: 700 22px/24px "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif;
				line-height: 24px;
			}

			#h_news h3 {
				font-size: 16px;
				margin-bottom: 0.5em;
			}

			#h_news ul {
				list-style: none;
				padding: 0;
				list-style-image: none;
			}

			#h_news ul li {
				padding-bottom: 8px;
				background: none;
			}

			#h_news ul strong {
				display: block;
				font: 700 10px/12px Verdana, Arial, Helvetica, sans-serif;
				color: #11206b;
				margin: 12px 0 0 0;
			}

			#h_news ul a.title {
				font: 400 12px/18px Verdana, Arial, Helvetica, sans-serif;
			}

			#h_content {
				width: 350px;
				padding: 0 20px 0 0;
				float: left;
			}

			#h_content p {
				line-height: 20px;
				margin-bottom: 1em;
			}


	/**
	 * = 7.2 Content : News
	 * ----------------------------------------------------------
	 */

	 	#news .newsarticle {
			background: #fdfdfc;
			margin-bottom: 20px;
			border-bottom: 1px solid #F2EFE9;
			padding: 10px 0;
		}

	 	#news .newsarticle h2 {
			padding: 0 0 4px 0;
			margin: 0;
			font-size: 18px;
		}

		#news .newsarticle h2 a {
			color: #11206B;
			text-decoration: none;
		}

		#news .newsarticle h2 a:hover {
			color: #EE820F;
			text-decoration: underline;
		}

	 	#news .newsarticle .date {
			font-size: 11px;
			color: #666;
			padding-bottom: 20px;
		}

		#newsdetail h1 {
			margin: 0;
			padding: 0;
		}

	 	#newsdetail {
			/* background: #fdfdfc; */
			margin-bottom: 20px;
			border-bottom: 1px solid #F2EFE9;
			padding: 10px 0;
		}

	 	#newsdetail .newsarticle .date {
			font-size: 11px;
			color: #666;
			padding-bottom: 20px;
		}

	/**
	 * = 7.3 Content : Pagination
	 * ----------------------------------------------------------
	 */

		.pagination-wrap {
			width: 100%;
			overflow: hidden;
		}

		.pagination {
			float: left;
			position: relative;
			left: 50%;
		}

		.pagination ul {
			padding: 18px 0;
			z-index: 2;
			overflow: hidden;
			position: relative;
			left: -50%;
		}

		.pagination li {
			float: left;
			list-style: none;
			margin: 0 5px 0 0;
			text-decoration: none;
			padding: 0;
			line-height: 15px;
			font-size: 12px;
			text-align: center;
		}

		.pagination li span {
			float: left;
			display: block;
			padding: 4px 5px;
			color: #000;
			min-width: 12px;
		}

		.pagination li.currentpage span {
			font-weight: 700;
			color: black;
		}

		.pagination li.selected span {
			padding: 4px 5px;
			font-weight: 700;
			color: black;
		}

		.pagination li a,
		.pagination li a:link,
		.pagination li a:visited {
			float: left;
			display: block;
			padding: 3px 4px;
			border: 1px solid #DDD;
			text-decoration: none;
			min-width: 12px;
			overflow: inherit;
			color: #000 !important;
		}

		li.ellipsis {
			margin: 0;
		}

		li.ellipsis span {
			color: black;
		}

		.pagination li a:hover,
		.pagination li a:active {
			background: #F8FCFC;
			border: 1px solid #EE820F;
			color: #333;
		}

		/* Next page and previous page buttons */
		.nextpage, .previouspage {
			font-size: 11px !important;
		}

		.pagination li.nextpage {
			margin-left: 10px;
		}

		.pagination li.previouspage {
			margin-right: 15px;
		}




/**
 * = 8. Footer
 * ----------------------------------------------------------
 */

 	#footer {
		clear: both;
		background: transparent url(../images/sidebarbottom.gif) no-repeat 0 100%;
		padding-left: 259px;
		padding-top: 45px;
	}

	#footer ul {
		text-align: left;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	#footer ul li {
		margin: 0;
		padding: 0;
		list-style: none;
		display: inline;
		padding: 0 8px;
		color: #11206b;
		font: normal 12px "Trebuchet MS", Trebuchet, Arial, Helvetica;
	}

	#footer ul li a {
		color: #11206b;
		text-decoration: none;
	}

	#footer ul li a:hover {
		color: #ee820f;
		text-decoration: underline;
	}




/**
 * = 9. Form Shizzle
 * ----------------------------------------------------------
 */

 	span.form-error {
		font-weight: 700;
		color: #CC0000;
		display: block;
		padding-bottom: 15px;
	}

 	.form-success {
		font-weight: 700;
		color: #EE820F;
		display: block;
		padding: 5px;
		border: 2px solid #EFA659;
		margin-bottom: 15px;
	}

	.input-textarea, .input-textfield, .input-textarea-error, .input-textfield-error {
		border: 1px solid #11206B;
		font: normal 12px/12px Verdana, Arial, Helvetica, sans-serif;
		line-height: 12px;
		padding: 4px 2px;
	}

	.input-textarea-error, .input-textfield-error {
		border-color: #CC0000;
	}

	.input-textarea-error, .input-textarea {
		height: 120px;
		line-height: 20px;
		padding: 0 0 0 2px;
	}
	
	#address.input-textfield,
	#email.input-textfield {
		width: 196px;
	}

	label.float {
		display: block;
		float: left;
		position: relative;
		top: -18px;
		left: 26px;
		width: 560px;
	}
	
	dd.white {
		padding-bottom: 20px;
	}


/**
 * = Firefox Fixes
 * ----------------------------------------------------------
 */

	@-moz-document url-prefix() {

		/* enforce scrollbar */
		body {
			overflow: -moz-scrollbars-vertical;
		}

		/* Link outlines */
		*:-moz-any-link {
			overflow: hidden;
		}

		/* CSS disappearing caret fix */
		input[type="text"], input[type="password"], textarea {
			overflow: auto;
		}

	}