/**************************************************************
   AUTHOR:  Pat Heard (fullahead.org)
   DATE:    Created 2007.05.20
   PURPOSE: Controls the layout of the site elements
 **************************************************************/


/**************************************************************
   Dead center gallery cover page
 **************************************************************/

#horizon {
  text-align: center; 
  position: absolute;
  top: 50%;
  left: 0px;	
  width: 100%;
  height: 1px;
  
  overflow: visible;
  visibility: visible;
  display: block   
}

#horizon #center {	
  position: absolute;
  left: 50%;
  
  visibility: visible;  
  background-repeat: no-repeat;
  background-position: top left;  
}

#horizon #center #overlay {
  position: absolute;
  top: 20px;
  left: 20px;
  width: 270px;
  
  background: url(../img/bg/cover.png) repeat-x top left;
}

#horizon #center #overlay .title {
  display: block;
  margin: 20px 20px 17px;
  padding: 0 0 17px 0;
  
  text-decoration: none;
  text-align: left;
  font-size: 1.4em;
}

#horizon #center #overlay .desc {
  display: block;
  margin: 0 20px;
  
  line-height: 150%;
  text-align: left;  
}

#horizon #center #overlay .links {  
  display: block;
  margin: 20px;
  text-align: left;
}
	
#horizon #center #overlay .links a {
  margin: 0 5px 0 0;
  padding: 0 12px 0 0;
}

#horizon #center #overlay .links a.last {
  margin: 0;
  padding: 0;
  border: 0;
}



/**************************************************************
   #container: holds everything and centers content
 **************************************************************/

#container {
  min-height: 100%;

  width: 1000px;
  margin: 0 auto;
}



/**************************************************************
   #topbar: holds the global template navigation
 **************************************************************/
 
#topbar {
  min-width: 980px;
  padding: 10px;
  text-align: left;
}
 
#topbar a {
  text-decoration: none;
  font-size: 0.9em;
}

#topbar ul {
  float: right;
  padding: 0;
  margin: 0;
  list-style: none;
}

#topbar ul li {
  display: inline;
  padding: 0;
  margin: 0;
}

#topbar ul li a {
  padding-left: 30px;
}


/**************************************************************
   #header: holds site title, breadcrumbs and right side nav
 **************************************************************/

#header {
  padding: 1em 1.5em;  
}


/* Left side title and breadcrumbs */
#header #meta {
  float: left;
  width: 65%;
}

#header #nav {
  float: right;
  text-align: right;
  width: 35%; 
}

#header #meta h1 {
  display: inline;
  margin: 0 0 .2em 0;
  padding: 0 0 .25em 0;
  
  font: normal 1.25em arial, sans-serif;
}

#header #meta h1.item {
  display: block;
  margin-bottom: -.35em;
}

#header #meta h1 span {
  float: right;
}

#header #meta h1 span.sold {
  padding: .1em 20px 0 0;
  
  font-size: .8em;
  text-transform: uppercase;
}

#header #meta ul {
  margin: 1em 0;
  padding: 0;
  list-style: none;
}

#header #meta ul li {
  display: inline;
  margin: 0;
  padding: 0;
}

#header #meta ul li a {
  float: left;
  margin: 0 .5em 0 0;
  padding: 0 .5em 0 0; 
}

#header #meta ul li span {
  float: left;
  padding: 0 0 .2em 0;
}

/* Right side nav */
#header #nav p {
  margin: 0;
  padding: 0.55em 0;
}

#header #nav p span {
  padding: 0 .2em;
  font-size: 1.1em;
}

#header #nav .count {
  float: right;
  padding: 2px 0 0 0;
  font-size: 1.2em;
}

/**************************************************************
   #content: holds page content.  Padding must be set by child
             elements because of problems with setting 100% 
             width and adding horizontal padding.
 **************************************************************/

#content {
  float: left;
  width: 100%;
  clear: both;
  margin: 2em 0;
}

#item {
  float: left;
  width: 700px;
}

#item .summary {
  margin: 1.5em;
  line-height: 150%;
}

#item .summary p {
  margin: 1em 0;
  padding: 0;
}



/**************************************************************
   #footer: holds page content
 **************************************************************/

#footer {
  float: left;
  width: 100%;
  min-height: 200px;
  clear: both;
  margin: 2em 0 0 0;
  
  font-size: .8em;
  text-align: center;
}

#footer .paging {
  float: right;
  padding: 0;
  margin: 1.5em !important;
  margin: 1.5em 1em;
  font-size: 1.3em;
}

#footer p span {
  padding: 0 .2em;
  font-size: 1.1em;
}

#footer #copyright {
  clear: both;
  padding: 1em 1.5em 3em 1.5em;
  line-height: 180%;
}




/**************************************************************
   .thumbs & .views: unordered list for thumbnail links
 **************************************************************/
 
ul.thumbs,
ul.views,
ul.actions {
  margin: 0;
  padding: 0;
  list-style: none;
}

ul.views {
  float: right;
  width: 300px;
}

ul.actions {
  margin: 0 auto;
}
 
ul.thumbs li,
ul.views li,
ul.actions li {
  display: inline;
  margin: 0;
  padding: 0;
}
 
ul.thumbs li a,
ul.views li a,
ul.actions li a {
  float: left;  
  clear: both;
  width: 100%;
  margin: 1em 0;
   
  text-decoration: none;
  cursor: pointer;
}

/* .views specific */
ul.views li a {
  margin: .5em 0;
  text-align: right;
}

ul.views li a img {
  margin-right: 1.5em;
  padding-bottom: 1px;
}

/* .thumbs specific */
ul.thumbs li a .pad {
  display: block;
  padding: 1.5em;
}
 
ul.thumbs li a .thumb {
  float: left;
  width: 220px;
}

ul.thumbs li a .thumb img {
  padding-bottom: 1px;
}
 
ul.thumbs li a .details {
  float: right;
  width: 710px;
}

 
ul.thumbs li a .details .title {
  display: block;   
  margin: 0 0 .6em 0;
  padding: 0 0 .6em 0;
  
  font: bold 1.2em arial, sans-serif;
}

ul.thumbs li a .details .title .sold {
  float: right;
  padding: 0 20px 0 0;
  
  font-size: .8em;
  text-transform: uppercase;
}

ul.thumbs li a .details .title .price {
  float: right;
}

ul.thumbs li a .details .link {  
  text-decoration: underline;
}


/* .actions specific */
ul.actions li a {
  margin: 0;
  padding: 0;
}

ul.actions li a .title {
  float: left;
  padding: 1em 0 1em 34px;
  text-decoration: underline;
}

ul.actions li a .desc {
  float: right;
  padding: 1em 0;
  color: #FFF;
}


/* hover behaviour */
ul.thumbs li a:hover .thumb img,
ul.views li.here a img,
ul.views li a:hover img {
  padding-bottom: 0;
}

ul.actions li a:hover {
  background-color: #111;
}



/**************************************************************
   In-image rollovers
 **************************************************************/
 
#fullImage {
  margin: 0 auto;
}



/**************************************************************
   Slideshow
 **************************************************************/

body#slideshow #imageWrapper{
  position: absolute;
  top: 50%;
  left: 0px;
  width: 100%;
}

body#slideshow div img{
  margin: 0px auto 0px;
}

/* Controls for navigating through the slideshow */ 
#slideshow div.sgControls {
  padding: 0 3px 6px 3px;
  text-align: left;
}

#slideshow div.sgControls a {
  padding: 0px 7px;
  font-size: 14px;
}

#slideshow div.sgControls a:hover {
  text-decoration: none;
}

#slideshow div.sgControls a img {
  margin-right: 3px;
  border: 0;
}

#slideshow div.sgControls span {
  position: absolute;
  top: 2.5em;
  right: 10px;
  font-size: 14px;
}



/**************************************************************
   Credit Popup
 **************************************************************/
 
#credit {
  position: absolute;
  z-index: 100;  	
  top: -3000px;
  left: -3000px;
  padding: 15px;
  	
  font-size: 0.9em;
  text-align: right;
  
  border-width: 1px;
  border-style: solid;
}

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

#credit ul li {
  margin: 0;
  padding: 0;
  display: inline;
}

#credit ul li a {
  display: block;
  padding: 4px;
  margin: 5px 0;
  text-decoration: none;	
}

#credit ul li a .title {
  text-decoration: underline;
}

#credit ul li a .desc {
  display: block;
}

#credit h1 {
  margin: 0;
  padding: 0 3px .7em 3px;
  text-align: left;
  font-size: 1.4em;
  font-weight: normal;
}

a.closeIcon {
  padding: 3px 0 3px 20px;
}



/**************************************************************
   Generic classes
 **************************************************************/

.block {
  display: block;
}

.floatLeft {
  float: left;
}

.floatRight {
  float: right;
}

.alignCenter {
  text-align: center;
}

.alignRight {
  text-align: right;
}

.large {
  font-size: 1.25em;
}

.padded {
  padding: 0 3px;
}

/* Previous and next arrows */
.previous {
  padding: 0 0 2px 10px;
}

.next {
  padding: 0 10px 2px 0;
}

#nav .previous,
#nav .next {
  width: 27px;
  height: 22px;
  padding: 0;
  background-repeat: no-repeat;
  background-position: top left;
}

#nav .previous {  
  margin: .1em .8em 0 0;  
}

#nav .next {
  margin: .1em 0 0 .8em;  
  background-position: top right;
}

#nav a:hover.previous {
  background-position: bottom left;
}

#nav a:hover.next {
  background-position: bottom right; 
}

#lightbox-overlay {
  position: absolute;
  left: -5000px;
  top: -5000px;
  height: 39px;
  width: 39px;
  background: url(../img/icons/lightbox-overlay.png) no-repeat 0 0;
}