/* Website by Digital Garden 
   Author: Cristiane Andretta 
*/
@import "forms.css";
@import "styles.css";

/*** base.css --- styles that standardise the browser environment across different browsers and platforms as well as some generic utility styles ***/

/* Browser Reset ****************************/
*			{padding:0; margin:0; border:0;}

/* Fonts ****************************/
html 		{font-size:1.25em;}
body 		{font:50% arial, sans-serif; }
html > body {font-size:12px;}
h1 			{font-size:1.3em;}
h2 			{font-size:1.2em;}
h3 			{font-size:1em;}
h4 			{font-size:1em;}
h5 			{font-size:0.9em;}
h6 			{font-size:0.8em;}
table, td, input, textarea, select {font:1em arial, sans-serif;}

/* Main Selectors ****************************/
body 		{background:#FFF; color:#000; line-height:1.5em; text-align:left;}
p       	{margin:1em 0;}
strong  	{font-weight:bold;}

/* Headings ****************************/
h1,h2,h3,h4,h5,h6 	{margin:1em 0; color:#000;}

/* Lists ****************************/
ul, ol         {margin:1em 0 1em 3em;}
li             {margin:0 0 0.3em 0;}
ul.unstyled    {list-style-type:none;}
ul.unstyled li {float:left;}

/* Utility Classes ****************************/
.clear     {clear:both; font-size:0; line-height:0em;}
.indent    {margin-left:2em;}
.right     {text-align:right;}
.top       {vertical-align:top;}
.center    {text-align:center;}
.middle    {vertical-align:middle;}
.error     {color:#AA0000; margin:0 0 1em 0;}
.hide      {display:none;}
.show      {display:block;}
.img-right {float:right; margin:0 0 1em 1em;}
.img-left  {float:left; margin:0 1em 1em 0;}
.break     {padding:0.5em 0; clear:both;}


/* Forms */
input.text_small			{ width: 150px; padding: 3px; background-color: #242424; border: #666 1px solid; margin-top: 5px; color: #fff;}
input.submit				{ width: 22px; height: 22px; color: #999; font-size: 11px; background-color: #666;}

.home input.submit:hover		{ cursor: pointer; color: #fff;}
.features input.submit:hover	{ cursor: pointer; color: #cdba4c;}
.images input.submit:hover		{ cursor: pointer; color: #f36c90;}
.contributors input.submit:hover{ cursor: pointer; color: #ff7a23;}
.search input.submit:hover		{ cursor: pointer; color: #ff486a;}
.info input.submit:hover		{ cursor: pointer; color: #92c131;}
.lightbox input.submit:hover	{ cursor: pointer; color: #c1ae69;}
.account input.submit:hover		{ cursor: pointer; color: #5ac9d6;}
.contact input.submit:hover		{ cursor: pointer; color: #9dcfe1;}


.homesearch label				{ color: #fff;}
.homesearch input.text			{ background-color: #fff; filter:alpha(opacity=65);-moz-opacity:.65;opacity:.65; width: 190px; border: #666 1px solid; color: #000;}
.homesearch input.text:focus	{ border: #000 1px solid;}
.homesearch input.submit		{ width: 22px; height: 22px; font-size: 11px; background-color: #353535; border: #666 1px solid;}

/* global formatting */
html 						{height:100%; background-color: #444;}
body 						{margin:0; padding:0; height:100%; color: #fff; }

/* layout containers */
#container 					{width:100%; min-width: 980px; margin:0 auto; min-height:100%; position:relative; z-index: 1;}
* html #container 			{height:100%;}
#wrap		 				{padding-bottom:30px; width: 100%;}
#wrap:after 				{content:" "; display:block; clear:both; }
* html #wrap 				{height:1px;}
#header 					{padding:10px 10px 10px 240px; position: relative; z-index: 999; }
#navigation 				{padding:10px; width: 750px; position: absolute; right:10px; top:-5px;}
#contentwrap				{position: relative; padding: 0 0 0 260px; top:0px;}
#content 					{width:100%; padding:10px 0; min-height:500px; height:auto !important; height:500px; position: relative; left: 0; min-width: 750px !important; z-index: 999;}
#sidebar 					{width:220px; padding:10px 20px; position: absolute; top:149px; z-index: 999;}
#footer 					{clear:both; position:absolute; bottom:0; height:30px; background-color: #333333; width:100%; z-index: 999;}

.homepage					{ padding: 0 !important; height: 100%;}

/* backgrounds and colors */
#container 					{background:#282828;}
#header 					{background:#343434;}
#wrap 						{background:#282828;}
#footer 					{background:#000;}

a, a:link					{ color: #fff; text-decoration: none; outline: none;}
.search a:hover				{ color: #ff486a;}
.search li.active a			{ color: #ff486a;}/* makes all active links have color pink - search page */

.info a:hover				{ color: #92c131;}
.info li.active a			{ color: #92c131;}/* makes all active links have color blue - info */

.home a:hover				{ color: #92c131;}

.features a:hover			{ color: #cdba4c;}
.features li.active a		{ color: #cdba4c;}/* makes all active links have color yellow - features */

.images a:hover				{ color: #f36c90;}
.images li.active a			{ color: #f36c90;}/* makes all active links have color teal - images */

.contributors a:hover		{ color: #ff7a23;}
.contributors li.active a	{ color: #ff7a23;}/* makes all active links have color orange - contributors */

.account a:hover			{ color: #5ac9d6;}/* makes all active links have color lilac - register */
.account li.active a		{ color: #5ac9d6;}

.lightbox a:hover			{ color: #c1ae69;}
.lightbox li.active a		{ color: #c1ae69;}/* makes all active links have color teal - images */

.contact a:hover			{ color: #9dcfe1;}
.contact li.active a		{ color: #9dcfe1;}/* makes all active links have color blue - images */


/* Breadcrumbs */
#content ul#breadcrumbs					{ list-style: none; padding: 0; margin: 15px 0 0; width: 800px; float:left; height:20px;}
#content ul#breadcrumbs li				{ text-transform: lowercase; float: left; padding-right: 5px; display: block; color: #fff;}
#content ul#breadcrumbs li a     		{ text-transform: lowercase; display: block; padding-right: 5px;}
#content ul#breadcrumbs li a.last       { text-transform: lowercase; display: block; padding-right: 5px;}
#content ul#breadcrumbs li a span		{ padding-right: 5px;}
#content ul#breadcrumbs li a:hover span	{ color: #fff;}

.info #content ul#breadcrumbs li			{ color: #92c131;}
.features #content ul#breadcrumbs li		{ color: #cdba4c;}
.images #content ul#breadcrumbs li			{ color: #f36c90;}
.contributors #content ul#breadcrumbs li	{ color: #ff7a23;}
.account #content ul#breadcrumbs li			{ color: #5ac9d6;}
.search #content ul#breadcrumbs li			{ color: #ff486a;}
.lightbox #content ul#breadcrumbs li		{ color: #c1ae69;}
.contact #content ul#breadcrumbs li			{ color: #9dcfe1;}


/* general stuff */

ul#top_nav							{ list-style: none; margin: 0; padding: 0; float: right; height: 20px; }
ul#top_nav li						{ float: left; padding-right: 10px; color: #999; height: 13px;}
ul#top_nav li a						{ text-decoration: none; padding-right: 10px; color: #999;}
ul#top_nav li.lightbox a 			{ padding: 0 20px 0 10px; background: url(../images/plus_normal.gif) no-repeat right top; margin-right: 5px;}
ul#top_nav li.lightbox a:hover		{ background: url(../images/plus_over.gif) no-repeat right top;}
ul#top_nav li a:hover				{ color: #fff;}
ul#top_nav li.logout a 				{ padding: 0 5px 0 0;}
		
ul#main_nav							{ list-style: none; margin-top: 80px; padding: 0; float: right; clear: right;}
ul#main_nav li						{ float: left; padding-right: 10px;}
ul#main_nav li a					{ text-decoration: none; padding-right: 10px; font-weight: bold; font-size: 16px;}
ul#main_nav li a:hover 				{ color: #24c1ff;}
ul#main_nav li.active 				{ color: #24c1ff;}


ul#main_nav li a.images:hover 			{ color: #f36c90;}
ul#main_nav li.active a.images 			{ color: #f36c90;}

ul#main_nav li a.features:hover 		{ color: #cdba4c;}
ul#main_nav li.active a.features 		{ color: #cdba4c;}

ul#main_nav li a.contributors:hover 	{ color: #ff7a23;}
ul#main_nav li.active a.contributors 	{ color: #ff7a23;}

ul#main_nav li a.info:hover 			{ color: #92c131;}
ul#main_nav li.active a.info 			{ color: #92c131;}

ul#main_nav li a.contact:hover 			{ color: #9dcfe1;}
ul#main_nav li.active a.contact 		{ color: #9dcfe1;}


#footer ul						{ margin: -5px 20px 0 0; padding: 0; float: right; list-style: none;}
#footer ul li					{ float: left; padding: 10px 10px 0 0; color: #999; font-size: 11px;}
#footer ul li a					{ padding-right: 10px; text-decoration: none; color: #999; font-size: 11px;}
#footer ul li a:hover			{ color: #fff;}


ul#sidenav						{ list-style: none; margin: 20px 0 0; padding: 0;}
ul#sidenav li					{ height: 30px;}
ul#sidenav li a					{ font-size: 14px; font-weight: bold;}


/* HOMEPAGE */
#background 					{ position:absolute; top:0px; left:0px; height:100%; width:100%; z-index: 10; }

#sidebar h2						{ color: #fff; font-size: 18px;}
.homesearch						{ border-bottom: none !important; position: absolute; margin-left: 130px; top: 290px; width: 250px !important; }
.homesearch	form				{ width: 250px !important;}


#top_mask						{ height: 200px; margin-top: 20px;}
#bottom_mask					{ height: 70px; margin-top: 290px;}

.transparent					{ background: #000; padding: 20px; filter:alpha(opacity=65);-moz-opacity:.65;opacity:.65; position: absolute; width: 240px; left: 120px;}
#sidecontent					{ margin-top: 0; padding: 20px; filter:alpha(opacity=100);-moz-opacity:1;opacity:1; color: #fff; position: absolute; left: 120px; top: 25px;}

.side_width						{  width: 250px;}

/* search page */

#search_box						{ width: 186px; border-bottom: #666 1px solid; padding-bottom: 30px; margin-top:38px;}
#search_box form				{ padding-bottom: 20px;width: 184px;}


div.page						{ float: right; width: 150px;}
.page p							{ float: left; padding-right: 10px;}
div.page select					{ background-color: #353535; border: #666 1px solid; color: #fff; width: 60px; margin-top: 10px;}

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

/* images */

div#collections					{ margin: 60px 0 0; height: 210px; display:block; overflow: hidden; position: absolute; left: 0;}

div.collections_all				{ height: 1000px !important; clear:left;}

.album							{ width: 240px; height: 190px; float: left; position: relative; display: block; margin: 0 40px 40px 0;}
.album a.link					{ display: block; background: #424242; width: 240px; height: 190px; padding: 10px; cursor: pointer;}
.album a.link:hover				{ background-color: #666;}
.album a.link:hover span		{ color: #fff;}
span.main						{ display:block; float:left; height:155px; width:155px; }
span.small						{ display:block; float:left; margin-left:10px;height:72px; width:75px; }
.album span.text				{ clear:both; display:block; color:#9a9a9a; padding-top: 5px;}
span.text strong				{ font-size: 12px;}

span.text						{ clear:both; display:block; color:#9a9a9a; padding-top: 15px; text-transform: lowercase;}

a.text							{ position:relative; /*this is the key*/  z-index:24; background: url(../images/plus_normal.gif) no-repeat top left; display: block; height: 13px; width:13px; text-indent: -2000px; }

a.text:hover					{z-index:25; background: url(../images/plus_over.gif) no-repeat top left;}

a.text span						{display: none}

a.text:hover span				{ /*the span will display just on :hover state*/ display:block; position:absolute; top:-6px;left:-135px; width:130px; height: 40px; background: url(../images/balloon.png) no-repeat; color: #fff; text-indent: 20px; padding-top: 5px;}



img.lightbox					{ position: absolute; left: 235px; top:190px; z-index: 999; }
	

div.morefeatures				{ width:120px; margin:290px 0 20px 0; background: url(../images/bg_btn.gif) no-repeat; color:#fff;  }
div.morefeatures p				{ margin:0; padding:5px 20px; font-size: 12px;}

div#morefeatures				{ width:120px; margin:0px 0 20px 0; background: url(../images/bg_btn.gif) no-repeat; color:#fff;  }
div#morefeatures p				{ margin:0; padding:5px 20px; font-size: 12px;}

div#moreimages					{ width:120px; background: url(../images/bg_btn.gif) no-repeat; color:#FFF; position: relative; top: 10px;}
div#moreimages p				{ margin:0; padding:5px 20px; font-size: 12px;}


div.back_btn					{ width:120px; background: url(../images/bg_btn.gif) no-repeat; color:#FFF; position: relative; top: 10px; float: left;;}
div.back_btn p					{ margin:0; padding:5px 20px; font-size: 12px; text-align: center;}


/* individual images */
				
.features #individuals			{ margin-top: 60px;}
.images #individuals          	{ margin-top: 60px;}

div#individuals					{ margin-bottom: 40px; top: 10px; width: 96%;}
ul.image						{ list-style: none; margin: 0; padding: 0;}
ul.image li						{ width: 155px; height: 190px; padding: 10px 20px 10px 0; position: relative; float: left; margin: 0 20px 20px 0; z-index: 1;}

ul.image li a.single			{width: 155px; height: 190px; background-color: #424242; padding: 10px; display: block;}
ul.image li a.single:hover		{ background: #666;}
ul.image li a.text:hover span	{ top:2px;left:-132px;}

.image a:hover span				{ color: #fff;}

/*	Search Results	*/
p.no_matches					{ clear:left; margin-top: 55px;}


/* features */

#caja 							{ width:70%; display: none; padding:5px; border-bottom:1px solid #666; float: right; margin: -25px 160px 0 220px;}

#caja a.close					{ display:block; margin-top: 0px; visibility: hidden;}

#display						{ display:block; width:50%; height: 26px; background: url(../images/btn_textoutline.gif) no-repeat right top; overflow:hidden; text-indent:-2000px; float: right; margin-right: 160px;position: relative; z-index: 999; margin-top: -20px;}
#display:hover					{ background-position: right -26px;}
#display.active					{ background-position: right -26px;}



#individuals ul.thumbs					{ margin: 0px 0 0; padding: 0; list-style: none;}
#individuals ul.thumbs li				{ float:left; padding:0 10px 10px 0;}
#individuals ul.thumbs li a				{ width: 260px; height: 190px; display: block; cursor: pointer; margin-bottom: 30px;}
#individuals ul.thumbs span				{ height: 20px; background: #424242; width: 240px; display: block; position: relative; top:190px; padding: 5px 10px; color:#9a9a9a;}
#individuals ul.thumbs li a:hover span	{ background: #666; color: #fff;}


/*	safari fix	*/
html[xmlns*=""] body:last-child #individuals ul.thumbs		{ margin: -4px 0 0; }

/* account */
div.blurb						{ font-size: 12px; font-weight: normal; border: none; float: right; width: 500px; }
p.small span					{ color: #5ac9d6;}
p.small							{ color: #a2a2a2;}


/* info	*/
p#sub-hd						{ border-bottom:#666 1px solid; width:800px; margin-top:37px; padding-bottom:5px;}

*:first-child+html p#sub-hd		{ margin-top:7px;}

p.slim							{ width: 250px; float:left; padding-right: 25px;}
div.slim						{ width: 250px; float:left; padding-right: 25px;}


/*	contributors	*/
div#photographers								{ float: left; width:150px; margin-top:25px;}

.contributors #content div#stylists				{ float: left; width:150px; margin-top:25px;}
.contributors #content div#writers				{ float: left; width:150px; margin-top:25px;}				

.contributors ul.list							{ list-style: none; margin: 20px 0 0; padding: 0; }

.contributors #content p.text					{ position: absolute; top:106px; left: 470px; padding-right: 180px; max-width: 600px; min-width: 300px;}


/* single image */
#content p#img_title				{ padding-top:15px;}
#single_img							{ margin: 10px 0 0 0px; float: left;}

table#img_info						{ padding-left:20px; position: relative;}
table#img_info td.title				{ width: 140px; float: left; font-weight: bold; padding: 5px 0;}
table#img_info td.img_blurb			{ padding: 5px 0; max-width: 400px;}

ul#options							{ list-style: none; float: left; margin: 100px 0 0 15px; padding: 0;}
ul#options li						{ float: left; padding-right: 10px;}
ul#options li a						{ text-decoration: none; padding-right: 10px; color: #999;}
ul#options li.lightbox a 			{ padding: 0 20px 0 10px; background: url(../images/plus_normal.gif) no-repeat right top; margin-right: 5px;}
ul#options li.lightbox a:hover		{ background: url(../images/plus_over.gif) no-repeat right top;}
ul#options li a:hover				{ color: #fff;}


/*	lightbox	*/

.lightbox a.text					{ background: url(../images/trashcan_normal.png) no-repeat top left; height: 18px; margin-top: -3px; }

.lightbox a.text:hover				{background: url(../images/trashcan_over.png) no-repeat top left;}

.lightbox div#collections			{ margin: 60px 0 0;}

.lightbox p.clickhere				{ clear: left; padding-top: 20px; width: 500px; float: left;}
.lightbox p.clickhere a				{ text-decoration: underline;}
.lightbox p.clickhere a:hover		{ text-decoration: none;}
.lightbox p.clear_btn				{ width: 120px; float: left; padding-top: 15px;}
.lightbox p.clear_btn a				{ background: url(../images/bg_btn.gif) no-repeat top left; display: block; padding: 4px 0 0 20px; height: 30px; width: 120px;}

p.checkedout						{ clear: left; margin-top: 55px;}




/* IE7 fix */
*:first-child+html .lightbox div#collections							{ margin: 49px 0 0;}
*:first-child+html .album span.text										{ position: absolute; bottom: -13px;}
*:first-child+html input.submit											{ height: 23px;}
*:first-child+html div#photographers									{ margin-top:0px;}
*:first-child+html .contributors #content div#stylists					{ margin-top:0px;}
*:first-child+html .contributors #content div#writers					{ margin-top:0px;}
*:first-child+html .contributors #content p.text						{ top:91px;}
*:first-child+html #content p#img_title									{ padding-top:0px;}
*:first-child+html p.no_matches											{ margin-top: 20px;}
*:first-child+html table#img_info td.title								{ padding: 5px 0 5px 25px;}
*:first-child+html p.checkedout											{ clear: left; margin-top: 25px;}
*:first-child+html .search div#collections								{ margin: 55px 0 0;}
*:first-child+html div#collections										{ margin: 15px 0 0;}
*:first-child+html div#individulas										{ margin: 15px 0 0;}
*:first-child+html p#sub-hd												{ margin-top:-8px;}


/*	Safari Fix	*/
html[xmlns*=""] body:last-child p	{ background: none !important; color: #fff;}
html[xmlns*=""] body:last-child h2	{ background: none !important; color: #fff;}