/* blainedavis.com 1.0
 * by Jamie Wilkinson <jamie@tramchase.com>
*/


body, p, input, textarea {
  font-family: "Futura", "Lucida Grande", Verdana, sans-serif;
}

body {
  background-color: #161617;
  color: #f4f4f6;
  margin: 0;
}

input {
  color: black;
}

img {
  border: 0;
}

/******************************
*  Etc.
******************************/
.left       { text-align: left; }
.right      { text-align: right; }
.center     { text-align: center; }
.floatLeft  { float: left; }
.floatRight { float: right; }
.inline     { display: inline; }
.block      { display: block; }
.clear, .clearer  { clear: both; }
.hide, .hidden    { display: none; }
.invisible        { visibility: hidden; }


/******************************
*  Layout
******************************/


#container {
  background-color: #1a1a1c;  
  text-align: left;
  margin: 0 auto;
  padding: 0 0;
  width: 100%;
  min-height: 551px;
}
html>body #container {
  width: 100%;   /* ... */
} 


#header {
  /* 293248 */
  background-color: #1B2333;
  /* mozilla ignores */
  filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/grad-up.png',sizingMethod='scale'); 
}
/* IE ignores styles with [attributes], so it will skip the following. */
#header[id] {
  background: #1B2333 url(/images/grad-up.png) repeat-x top left;
}

#header h1 {
 font-size: 1.5em;
 padding-top: 5px;
 text-align: center; 
}

#header .site_links { /* about | contact */
  float: right;
  font-size: 1.2em;
  display: inline;
  margin: 0;
  padding: 0;
  position: relative;
  top: -8px;
  right: 20px;
}

#content {
  clear: both;
  padding: 0 10px;
}

#footer {
  font-family: sans-serif;
  font-size: 0.7em;
  text-align: center;
  padding-top: 4em;
  padding-bottom: 1em;
  clear: both;
  color: #eee;
}


/* prev/next */
#navigation {  
  float: right;
  font-size: 1.2em;
}

#previous, #next, 
.previous, .next {
  float: left;
  margin: 0 1em 1em 0;
  padding: 5px;  
  font-size: 10pt;

}

/* colors, also for 'people/tags' links */
#previous, #next, 
.previous, .next,
#browser_choices li a {
 background-color: #909890;
 border: 1px solid #aaa;
 color: #e7e7e9;
}
#previous:hover, #next:hover,
#browser_choices li a:hover {
  background-color: #293248;
  color: #f7f7f9;
  border: 1px solid #ccc;  
}


/******************************
*  HTML Elements
******************************/

h1 {
  margin: 0 0 10px 0;
  padding-bottom: 8px;
  border-bottom: 4px solid #000;
  font-weight: normal;
}

a, a:visited {
  color: #909890;
  text-decoration: none;
}
a:hover {
  background-color: #293248;
  color: white;
}

form {
  display: block;
  clear: both;
  text-align: center;
  padding: 1em;
}

input {
  font-size: 1.2em;
  padding: 0.2em;
  margin-right: 10px;
  margin-top: 5px;
}

small, small a, small a:visited {
  color: #cccccc;
}

div.description {
  text-align: left;
  width: 65%;
  margin: 0 auto;
  padding: 50px 0 10px 0;
  font-size: 12pt;
}

/* hackery */
#project_description_1 {
  margin-top: 50px;
  padding-right: 50px;
}


/******************************
*  Tools
******************************/

.toolbar { 
  background-color: #333333;
  opacity: .6;
/*  filter: alpha(opacity=60);*/
	padding-left: 10px;
	text-align: right;
}

.toolbar span {
  padding-right: 5px;
  font-variant: small-caps;
}

.toolbar span.handle {
  cursor: move;
}

/******************************
*  In Place Editor
******************************/

#metdata h4 {
 display: block;
clear: both;
}

.inplaceeditor-form {
  margin: 0; 
  padding: 0;
  display: inline;
  clear: none;
  float: left;
}
.inplaceeditor-form input { 
  font-size: 0.8em;
  padding: 0.1em;
  margin: 0;
}

.inplaceeditor-form input[type=text] { 

  
}
.inplaceeditor-form textarea { 
}
#metdata .inplaceeditor-form textarea {
/*   width: 100px; */
}
.inplaceeditor-form a { 
  font-size: 0.8em;
}



/******************************
*  Thumbnails
******************************/

#project_list,
.asset_list {
  list-style-type: none;
  margin: 0 auto;
  padding: 0;
  margin-top: 10px;
  width: 700px;
}

#project_list li, 
.asset_list li {
  float: left;
  padding: 8px;
  width: 216px;
  voice-family: "\"}\""; 
  voice-family:inherit;
  width: 200px;
}

a img,
a:visited img {
  border: 0;
/*  border-bottom: 2px solid white;  */
  border-bottom: 2px solid transparent;
}

/*#project_list li a:hover img, 
.asset_list li a:hover img*/
a:hover img {
  background-color: black;
  border-bottom: 2px solid #293248;  
}

#project_list li a img, 
#project_list li a:visited img, 
.asset_list li a img, 
.asset_list li a:visited img {
  display: block;
  margin-bottom: 5px;
}

#project_list li small, 
.asset_list li small {
  display: block;
}



/***********************
  Layout take 2
************************/

#main {
  height: 550px; /* FIXME add IE js hack for min-height and change */
  margin-top: 15px;
  text-align: center;
}


#image_wrapper {
  text-align: center;
  width: 660px;
  float: left;
  height: 100%;
}

#image {
  border: 1px solid #333;
}


#loading {
  display: block;
/*  text-align: center; */
  text-align: right;
  position: relative;
  top: -500px;
  left: 270px;
  text-align: center;
  padding: 50px 0 0 0;
  z-index: 100;
  color: #999;
  background: transparent url('/images/spinner.gif') 50% 50% no-repeat;
  width: 900px;
}

#image_caption {
  background: #000 /*url(/images/tab-gray.jpg) 0 0 no-repeat*/;
  margin: 0 auto;
  position: relative;
  top: -100px;
/*  top: 3px;*/
  left: -104px;
  width: 644px;
  height: 90px;
  display: none;
  
  opacity: .6;
  filter: alpha(opacity=60);  
  z-index: 99;
  padding-top: 10px;
}

/*************
  Tag browser
**************/

#tag_browser {
/*  width: 300px;*/
  padding: 0;
  margin-right: 10px;
  font-size: 120%;  
  text-align: left;
  display: block;
  clear: both;
  height: 30px;
  
  /* same as minigrid, but we shift him down */
  position: absolute;
  right: 0;
  left: 690px;
  
  /* same as dropdown... kinda cool */
  background-color: #141416;
  border: 1px solid #3a3a3c;
  
}

#tag_browser ul {
  list-style-type: none;
  margin: 3px 0 0 0;
  padding: 0;
  
}

#tag_browser li {
  display: inline;
  margin-right: 15px;
}
#tag_browser li a {
/*  padding-left: 5px;
  border-left: 6px solid #606860; */
  padding: 1px 3px;
  text-transform: uppercase;
  font-size: 9pt;
}


/* removeme */
#tag_browser .tag {
  margin: 0;
  padding: 0;
  display: block;
  margin-top: 15px;
  text-align: center;
}
#tag_browser .tag img {
  padding: 0;
  margin: 0;
}

#tag_browser .tip {
  font-size: 7pt;
  text-align: left;
  margin-top: 0px;
  color: #c6c6c7;
  padding-left: 7px;
  text-transform: uppercase;
}


/* individual dropdowns */
.tag_browser_dropdown {
/*  height: 80px;*/
  z-index: 100;
  padding: 10px;
  border: 1px solid #3a3a3c;
  border-top: 0;
  background-color: #141416;
/*  opacity: 0.8;*/
  width: 88px;
  margin-left: -1px;
  margin-top: 6px;
}


/*************************
  Minigrid
*************************/
#minigrid {
/*  white-space: nowrap;
  overflow: auto; 
  height: 300px; */
  position: absolute;
  right: 0;
  left: 690px;
  height: 73%;
  overflow: auto;
  margin-top: 35px;  /* compensate for tag browser */
}

.minigrid_asset {
  display: inline;
}

.minigrid_asset a img {
  border: 2px solid #000;
  opacity: .4;
  filter: alpha(opacity=40);
}
.minigrid_asset .dimmed {
  opacity: .4;
  filter: alpha(opacity=40);  
}
.minigrid_asset .lit {
  opacity: 1;
  filter: alpha(opacity=1);
  border: 2px solid #fff;
}
.minigrid_asset a img.current {
  border: 2px solid #5c5;
  opacity: 1;
  filter: alpha(opacity=100);  
}
.minigrid_asset a:hover img {
  opacity: 1;
}

/* tag browser currently selected */
#tag_browser .minigrid_asset a img.current {
  border: 2px solid #c55;
  opacity: .7;
}  


/* actually for tag_browser */
.minigrid_asset .tag_name {
  display: block;
}


/* handy dandy guy, don't warp him though */
ul#browser_choices,
#viewing_photos_of {
  white-space: nowrap;
}

/* reposition viewing_photos_of... */
#viewing_photos_of {
  position: absolute;
  left: -6px;
  top: -28px;
}



 #image a, a #image,
 #image a:hover, a:hover #image {
   border: 0;
 }
 a img #image {
   border: 0;
 }


/*** new fro frontpage **/

.text {
  width: 600px;
  margin: 0 auto;
}

.read-more {
  text-align: center; 
  text-transform: uppercase; 
  font-weight: normal;
  color: #888; 
  margin: 0; 
  padding: 0;
}
