/*Main Gallery Layout*/

#gallery_scaffold {
  background: url(http://www.dragonflyoffice.co.uk/dfo_images/generic/greydient2.gif) repeat-x;
  background-position: -150px;
  width: 585px;
  float: left;
  font-size: .9em;
  text-align: justify;
}

#gallery_scaffold h1 {
  font-size: 1.5em;
  margin: 0;
  color: #333;
}

#crumbLine {
  margin: 1px 0 5px 0;
  padding: 4px;
  color: #999;
  background: transparent url(images/grad1.jpg) repeat-x bottom left;
  text-align: left;
}

#crumbLine p {
  margin: 0;
  font-size: .8em;
}

#crumbLine span {
  font-weight: bold;
  font-style: normal;
}

#crumbLine a {
  text-decoration: underlined;
  color: #999;
}

#crumbLine a:hover {
  text-decoration: none;
}

h1.office-chairs, h1.office-desks {
  width: 337px;
  height: 29px;
}

.sgGalleryThumb {
  float: left;
  border: none;
  margin: 0 10px 0 0;
}

a.sgGalleryLinkage {
  float: left;
  width: 574px;
  text-decoration: none;
  color: #656565;
  background: #f4f4f4;
  display: block;
  padding: 1px 10px 1px 1px;
  clear: both;
  margin-bottom: 10px;
  font-size: 0.9em;
}

a.sgGalleryLinkage:hover {
  background: #CECECE;
  color: #000;
}

a.sgGalleryLinkage span {
  margin: 4px 0 4px 0;
  display: block;
}

.galleryDivision {
  position: relative;
  clear: both;
  z-index: 2;
  margin-bottom: 10px;
}

.sgDetailsList {
  clear: both;
  margin-left: 4px;
}

.galleryTab {
  margin: 0 0 1em 4px;
  font-size: .7em;
}

/*Image-Replacement - Gallery Headers and Backgrounds*/

.albumHeader, .galleryHeader {
	width: 400px;
	height: 29px;
	position: relative;
	overflow: hidden;
	clear: both;
	margin: 0 0 0 135px;
	z-index: 1;
	color: #fff;
}

.albumHeader {
  margin: 0;
}

.albumHeader span, .galleryHeader span {
	position: absolute;
	width: 100%;
	height: 100%;
}

.OfficeChairs {
	background: url(images/headings/office-chairs.gif) no-repeat;
}

.OfficeDesks {
	background: url(images/headings/office-desks.gif) no-repeat;
}

.OfficeAccessories {
  background: url(images/headings/office-accessories.gif) no-repeat;
}

.ExecutiveChairs {
  background: url(images/headings/executive-chairs.gif) no-repeat;
}

.ExecutiveDesks {
  background: url(images/headings/executive-desks.gif) no-repeat;
}

.BreakoutSeating {
  background: url(images/headings/breakout-seating.gif) no-repeat;
}

.OfficeInteriors {
  background: url(images/headings/office-interiors.gif) no-repeat;
}

.CanteenAndMeetingChairs {
  background: url(images/headings/canteen-meeting-chairs.gif) no-repeat;
}

.CallCentres {
  background: url(images/headings/call-centres.gif) no-repeat;
}

.MassageAndRecliners {
  background: url(images/headings/massage-recliners.gif) no-repeat;
}

.MeetingRooms {
  background: url(images/headings/meeting-rooms.gif) no-repeat;
}

.OfficePartitioning {
  background: url(images/headings/office-partitioning.gif) no-repeat;
}

.Receptions {
  background: url(images/headings/receptions.gif) no-repeat;
}

.OfficeScreens {
  background: url(images/headings/office-screens.gif) no-repeat;
}

.SoftSeating {
  background: url(images/headings/soft-seating.gif) no-repeat;
}

.OfficeStorage {
  background: url(images/headings/office-storage.gif) no-repeat;
}

.OfficeTables {
  background: url(images/headings/office-tables.gif) no-repeat;
}

.VisitorsChairs {
  background: url(images/headings/visitors-chairs.gif) no-repeat;
}

.Boardrooms {
  background: url(images/headings/boardrooms.gif) no-repeat;
}
 
/* Album */

#album {
  margin: 0 0 0 18px;
  padding-left: 5px;
}

#album img {
  border: none;
}

#album a {
  width: 130px;
  height: 130px;
  display: block;
  float: left;
  margin: 0 5px 5px 0;
  border: 1px solid #cecece;
  background: #fff;
  text-align: center;
}

#album a:hover {
  border: 1px solid #666;
}

/*image*/

.imageNavBar {
  text-align: center;
  clear: both;
  width: 99px;
  margin: 0 auto 0 auto;
}

.imageNavBar img {
  border: none;
}

.sgImage {
  border: 1px solid #333;
  margin: 1px auto 1px auto;
  clear: left;
  display: block;
}

a.imagePrevLink, a.imageNextLink, a.imageParentLink {
  border: 1px solid #333;
  height: 26px;
  width: 26px;
  display: block;
  float: left;
  margin: 1px;
  background: url(images/img-button-bg.gif) top left;
}

a.imagePrevLink:hover, a.imageNextLink:hover, a.imageParentLink:hover {
  /*border: 1px solid #333;*/
  background-position: bottom left;
}

.sgPreviewThumbCurrent, .sgPreviewThumb {
  border: 1px solid #cecece;
  background: #fff;
  display: block;
  float: left;
}

.sgPreviewThumbCurrent:hover {
  border: 1px solid #666;
}

.sgPreviewThumb:hover {
  border: 1px solid #999;
}

.sgTitle {
  clear: both;
  margin: 10px;
  text-align: center;
}
