/*General
--------------------------------------------------------------------------*/

* { border: 0; margin: 0; padding: 0;  font-family: Helvetica, Arial, sans-serif; }	
a { text-decoration: none; }
a:link { color: #e31329; }
a:visited { color: #e31329; }
a:hover{ color: #e31329;  text-decoration: underline; }
a:active { color: #e31329; }

p { margin: 15px 0; font-size: 0.9em; }
.content ul, .content  ol { padding: 0 0 0 35px !important; }	
.content li { padding: 0 0 5px 15px !important; font-size: 0.9em; }	
label { font-size: 0.9em; }
.heading {  }
.heading p { font-size: 1.4em; }
.heading p span.leader { font-weight:bold; }
input, select, textarea { border: 1px solid #e6e7e8;  background: #e6e7e8; }
input.submit { background: #e31329; color: #fff; font-weight: bold; padding: 2px 3px; border: 0;}

body { color: #58595b; }

/*Floating menu/logo
--------------------------------------------------------------------------*/			
#dottlogo { z-index: 2; position: fixed; top: -25px; left: -25px; background: url('/images/dott_275.png') 0 0 no-repeat; width: 275px; color: #f00; padding:275px 0 0 0; overflow:hidden; height:0 !important; height /**/:275px; }
#dottlogo-t { z-index: 4; position: fixed; top: -25px; left: -25px; background: url('/images/dott_275_t_50.png') 0 0 no-repeat; width: 275px; color: #f00; padding:275px 0 0 0; overflow:hidden; height:0 !important; height /**/:275px; }

#menu { z-index: 5; position: fixed; top: 195px; left: 63px; width: 155px; }	
	#menu ul { list-style: none; margin:0; padding:0; }
	#menu-go { cursor: pointer; font-size: 0.7em; font-weight: bold; color: #fff; background: url('/images/menu-go.png') 0 0 no-repeat; padding: 4px 0 0 6px; width: 149px; height: 22px; }
	/*.menugoclosed { background: url('/images/menu-go.png') 0 -27px no-repeat !important;}	*/
	#menu-links { position: relative; top: 0px; left: 0; }
		#menu-links li { margin: 0; padding: 0; float:left; display: inline-block; background: url('/images/menu-link.png') 0 0 repeat-y; }
			#menu-links li.first { background: url('/images/menu-link-first.png') 0 0 no-repeat !important; }
			#menu-links li.last { background: url('/images/menu-link-last.png') 0 100% no-repeat !important; }		
				#menu-links a { font-size: 0.7em; display:block; color: #fff; padding: 2px 0 0 6px; margin: 0; text-decoration: none; border: 0; width: 149px; }						
					#menu-links a:hover { background: url('/images/menu-arrow.gif') 130px 3px no-repeat; }
					#menu-links li.first a:hover { background: url('/images/menu-arrow.gif') 130px 6px no-repeat; }					
				#menu-links span { font-size: 0.7em; display:block; }
				#menu-links li.label span { overflow: auto !important; color: #777; padding: 2px 0 0 6px; width: 149px; height: 15px; }
				#menu-links li.spacer span { overflow: hidden; height: 9px; width: 155px; padding: 0;}
				#menu-links li.hr { overflow: hidden; width: 155px; padding: 0; background: url('/images/menu-link-hr-2-2.png') 0 center no-repeat; height: 9px; }
				#menu-links li.first a {  padding: 4px 0 0 6px; height: 15px; }		
				#menu-links li.last a {  padding: 2px 0 0 6px; height: 25px; }

/*Twitter
--------------------------------------------------------------------------*/	
#twitter { z-index: 5; position: fixed; top: 0px; right: 150px; width: 230px; }	
	#twitter ul { list-style: none; margin:0; padding:0; }
	#twitter-go { cursor: pointer; font-size: 0.7em; font-weight: bold; color: #fff; background: url('/images/menu-link-wide.png') 0 0 no-repeat; padding: 2px 0 0 6px; margin: 0; width: 224px;}	
	#twitter-go.closed { background: url('/images/menu-link-last-wide.png') 100% 100% no-repeat; height: 25px; }
	#twitter-statuses { position: relative; top: 0px; left: 0; }
	#twitter-statuses li { float:left;  font-size: 0.7em; display: inline-block; background: url('/images/menu-link-wide.png') 0 0 repeat-y; color: #fff; padding: 7px 9px 5px 6px; margin: 0; text-decoration: none; border: 0; width: 215px; }

	#twitter-statuses span { display:block; color: #808080; }
	#twitter-statuses li.last { background: url('/images/menu-link-last-wide.png') 100% 100% no-repeat; padding: 2px 9px 0 6px; height: 25px; }										


/*Content positioning
--------------------------------------------------------------------------*/	
.region { width:  1650px; height: 1650px; position: absolute; }

	.position-1-1, .position-1-2, .position-1-3, .position-1-4, .position-1-5,
	.position-2-1, .position-2-2, .position-2-3, .position-2-4, .position-2-5,
	.position-3-1, .position-3-2, .position-3-3, .position-3-4, .position-3-5,
	.position-4-1, .position-4-2, .position-4-3, .position-4-4, .position-4-5,
	.position-5-1, .position-5-2, .position-5-3, .position-5-4, .position-5-5
	{ position: absolute; }	
		
	.position-1-1 { top: 0px; left: 0px; }
	.position-1-2 { top: 0px; left: 1650px; }
	.position-1-3 { top: 0px; left: 3300px; }
	.position-1-4 { top: 0px; left: 4950px; }
	.position-1-5 { top: 0px; left: 6600px; }	
	
	.position-2-1 { top: 1650px; left: 0px; }
	.position-2-2 { top: 1650px; left: 1650px; }
	.position-2-3 { top: 1650px; left: 3300px; }
	.position-2-4 { top: 1650px; left: 4950px; }
	.position-2-5 { top: 1650px; left: 6600px; }	
	
	.position-3-1 { top: 3300px; left: 0px; }
	.position-3-2 { top: 3300px; left: 1650px; }
	.position-3-3 { top: 3300px; left: 3300px; }
	.position-3-4 { top: 3300px; left: 4950px; }
	.position-3-5 { top: 3300px; left: 6600px; }	
	
	.position-4-1 { top: 4950px; left: 0px; }
	.position-4-2 { top: 4950px; left: 1650px; }
	.position-4-3 { top: 4950px; left: 3300px; }
	.position-4-4 { top: 4950px; left: 4950px; }
	.position-4-5 { top: 4950px; left: 6600px; }	
	
	.position-5-1 { top: 6600px; left: 0px; }
	.position-5-2 { top: 6600px; left: 1650px; }
	.position-5-3 { top: 6600px; left: 3300px; }
	.position-5-4 { top: 6600px; left: 4950px; }
	.position-5-5 { top: 6600px; left: 6600px; }
	
	img.arrows { margin-top: -34px; }					

/*Content styling
--------------------------------------------------------------------------*/	
				
	.region a { padding: 0; margin: 0; }
	/* .region .positioner { position: relative; } */
	.region .content { position:relative; z-index: 1; width: 600px; padding-left: 300px; padding-top: 150px; }				
	.region .flickr { position:relative; z-index: 3; padding-top: 65px; width: 1275px; }																
		.region .flickr div { width: 75px; height: 75px; display: inline-block; float: left; }
		.region .flickr div a { display: block; width: 75px; height: 75px; /*background: url('/images/ajax-loader.gif') center center no-repeat;*/ }

/*Titles
--------------------------------------------------------------------------*/
	.region .content h2 { margin-bottom: 0px !important; width: 600px; background-color: #ff0; padding:193px 0 0 0; overflow:hidden; height:0 !important; height /**/:193px; }
	#aboutdott h2 { background: url('/images/title-about.png') 0 0 no-repeat; }
	#dottpeople h2 { background: url('/images/title-people.png') 0 0 no-repeat; }
	#dottprojects h2 { background: url('/images/title-projects.png') 0 0 no-repeat; }
	#dottshots-about h2 { background: url('/images/title-dottshot.png') 0 0 no-repeat; }
	#dottshots-design h2 { background: url('/images/title-design.png') 0 0 no-repeat; }
	#dottshots-places h2 { background: url('/images/title-places.png') 0 0 no-repeat; }
	#dottshots-talent h2 { background: url('/images/title-talent.png') 0 0 no-repeat; }
	#dottshots-prizes h2 { background: url('/images/title-prizes.png') 0 0 no-repeat; }
	#contact h2 { background: url('/images/title-contact.png') 0 0 no-repeat; }
	#whywedoit h2 { background: url('/images/title-why.png') 0 0 no-repeat; }	
	#dotthome h2 { background: url('/images/title-hello.png') 0 0 no-repeat; }											
	#dottshots-upload h2 { background: url('/images/title-upload.png') 0 0 no-repeat; }												
	#dottshots-lives h2 { background: url('/images/title-lives.png') 0 0 no-repeat; }
	#dottshots-work h2 { background: url('/images/title-work.png') 0 0 no-repeat; }
	#dottshots-green h2 { background: url('/images/title-green.png') 0 0 no-repeat; width: 750px;}
	#dottshots-dottinaction h2 { background: url('/images/title-dottinaction.png') 0 0 no-repeat; width: 750px; }
	#getinvolved h2 { background: url('/images/title-get-involved.png') 0 0 no-repeat; }
	.region .content h2.short { margin-bottom: -39px !important; }
	
/* Tabs
--------------------------------------------------------------------------*/
	.tabs {  }
		.tabs .tab-headings { display: block; width: 100%; height: 20px; }
		.tabs .tab-headings ul { list-style: none; background: url('/images/tab-bg.png') 0 0 repeat-x; margin: 0 0 10px 0; padding: 0 !important;}
		.tabs .tab-headings li { display: inline; padding: 0; margin: 0;}
		.tabs .tab-headings a { margin-top: -1px; font-size: 0.75em; color: #4281cb; display: inline-block; width: 84px; height: 17px; padding: 3px 0 0 6px; margin: 0 0 0 5px; }				
		.tabs .tab-headings a.tab-heading-active { color: #ed1c24; background: url('/images/tab-active.png') 0 0 no-repeat; position:relative; top: -1px; }		
		
		.tabs .tab-page { margin: 15px 0 10px 0; }
	
/* Forms
--------------------------------------------------------------------------*/
	
	label { display: block; width: 450px; margin-bottom: 5px; text-align: left; vertical-align: top; }
		label span { display: inline-block; width: 105px; vertical-align: top; height: 100%; padding-right: 15px; }
		label span.asterix { background: url('/images/form-asterix.png') 100% 8px no-repeat; }
		label select { background: #e6e7e8; display: inline-block; vertical-align: top; }
		label input, label textarea { border: 0; background: #e6e7e8; padding: 3px; display: inline-block; vertical-align: top; }
		label input.full, label textarea.full {  width: 295px; }
		label input.full { height: 16px; }
		label textarea.full { height: 48px; }
		form p { margin-left: 120px; width: 300px; margin-bottom: 5px; }
		p.feedback, p.warning { font-size: 0.8em; margin-top: 0px; margin-bottom: 5px; }
		p.warning { color: #f36369; }
		p.feedback { background: #e10019; color: #fff; padding: 15px; margin: 15px 0; }
		strong.itip { position:relative; top: 0; right:0; width: 12px; height: 12px; padding: 0; margin: 5px 0 0 5px; display: inline; }
		div.upload-progress { position: relative; top: 0; left: 0; }
		#uploadprogress { display: none; position: absolute; top: 0; left: 0; background: url('/images/ajax-upload.gif') 50% 50% no-repeat; }
		#uploadprogress p { position: relative; top: 50%; left: 50%; width: 300px; margin-left: -150px; margin-top: -35px; text-align: center; }
		
/* Resets
--------------------------------------------------------------------------*/
input.nonstyle { background: 0; padding: 0; height: auto; width: auto; }


.view-image { display: inline-block; float:left; width: 758px !important; height: 400px !important; padding: 5px; overflow: auto !important;}
.view-image * { color: #58595b; }
	.view-image .image-block { display: inline-block; float:left; margin: 0px 15px 0px 0px; height: 400px; width: 400px; overflow: hidden; }
	.view-image .text-block { display: inline-block; float:left; margin: 0px 0px 0px 0px; width: 250px; height: 400px; }
	.view-image .wide-text-block { width: 675px !important; height: 400px !important; }	
	.view-image .close-bar { display: block; vertical-align: top; text-align: right; margin: 0 0 10px 0; padding: 0; }
	
		.view-image .text-block h3 { width: auto; margin: 0; padding: 0; }
		.view-image .text-block h3 u { display: block; font-size: 0.8em; }
		.view-image .text-block p span { display: block; font-size: 0.7em; color: #999; }
		.view-image .text-block ul, .view-image .text-block ol { padding: 0 0 0 35px !important; }	
		.view-image .text-block li { padding: 0 0 5px 15px !important;font-size: 0.9em; }	
	

		.text-block form p { margin-left: 0; width: auto; margin-bottom: 5px; }	
		.text-block form p.feedback, form p.warning { font-size: 0.8em; margin-top: 0px; margin-bottom: 5px; }
		.text-blockform p.warning { color: #f36369; }	
	
#sponsors { position:relative;top:0;left:0;width:800px; height: 60px; margin: 30px 0 15px 0; }
#sponsors img { margin-right: 15px; }

/* Recaptcha
 * ----------*/
recaptcha_widget_div { display: inline-block !important; width: 368px; }

/* Extras
--------------------------------------------------------------------------*/
.newsletters { margin: 10px 0; }
	.newsletters ul { margin: 0; padding: 0px 0px 0px 0;  }
	.newsletters li { margin: 0; padding: 0px; }

