/* -------------------------- beinFushi.css -------------------------- */

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Title:		BEin and Fushi CSS Document
		http://beinfushi.com
Author:		Designed by PMT Advertising
		Bruce Etzcorn
Web Address:	www.pmtadvertising.com
Contact Info:	info@pmtads.com
Color Info:	#AEB1B7
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

* {
margin: 0;
padding: 0;
}

.clearer {
clear: both;
height: 0px;
line-height: 0px;
}

body {
font-size: 10px;
color: #C9C9C9;
background-color: #270000;
}

body#index {
background-color: #000000;
}

html,body, #centerContainer {
height: 100%;
margin: 0;
padding: 0;
text-align: center;
border: none;
}

#centerContainer {
width: 100%;
margin: 0 auto;
text-align: center;
vertical-align: middle;
}

#constraint {
width: 750px;
margin: 0 auto;
text-align: left;
vertical-align: bottom;
background-color: #000000;
border: 1px solid #414141;
}

body#index #constraint {
border: 0;
}

#navigation {
height: 125px;
z-index: 50;
}

#photoArea {
float: left;
width: 245px;
}

#contentArea {
float: right;
width: 480px;
height: 380px;
overflow: auto;
padding: 10px;
}

body#bein #contentArea {
height: 100%;
}

body#booksRecordings #mediaArea,
body#mediaAd #mediaArea {
width: 730px;
overflow: auto;
height: 380px;
padding: 10px;
}

body#mediaAd #contentArea {
width: 750px;
height: 380px;
width: 100%;
}

#mediaArea #contentArea {
overflow: visible;
height: auto;
padding: 0px;
width: 460px;
}

.photoLarge, .photoMedium, .photoSmall {
float: right;
padding-left: 10px;
text-align: left;
}

.photoLarge {
width: 275px;
}

.photoMedium {
width: 200px;
}

.photoSmall {
width: 130px;
}

/*#contentArea img {
float: right;
font-size: 1em;
padding-left: 10px;
font-family: Verdana, Arial, Tahoma, sans-serif;
}*/

#addressArea {
clear: both;
padding: 5px;
font-size: 1em;
color: #666666;
text-align: center;
font-family: Verdana, Arial, Tahoma, sans-serif;
border-top: 1px solid #414141;
}

#footer {
width: 750px;
clear: both;
margin: 0 auto;
font-family: Verdana, Arial, Tahoma, sans-serif;
}

#footer ul {
text-align: center;
list-style-type: none;
}

#footer ul li {
float: left;
width: 12%;
font-size: 1em;
}

#footer ul li a {
display: block;
padding: 5px;
text-decoration: none;
}

.pmtfooter {
display: block;
padding: 5px;
color: #750000;
text-align: center;
font-size: 1em;
font-family: Verdana, Arial, Tahoma, sans-serif;
}

.returnButton {
clear: both;
padding: 0px;
width: 480px;
text-align: right;
}

.harryBtn {
width: 460px;
height: 121px;
display: block;
background: url(images/harryBtn.jpg) no-repeat top left;
}

.harryBtn:hover {
background: url(images/harryBtnOver.jpg) no-repeat top left;
}

/* Tables
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

table.appraisalChart {
text-align: center;
margin-bottom: 10px;
border-collapse: collapse;
}

table.appraisalChart, .appraisalChart td, .appraisalChart thead th {
padding: 5px;
border-collapse: collapse;
border: 1px solid #414141;
}

/* Text
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

p, #contactForm, .appraisalChart, .caption  {
line-height: 1.7em;
color: #C9C9C9;
font-size: 1.2em;
font-family: Verdana, Arial, Tahoma, sans-serif;
padding-bottom: 1.2em;
}

body#mediaAd p {
padding: 10px;
}

h1, h2, h3, h4 {
clear: both;
font-weight: normal;
font-family: Palatino, Bookman, Times, serif;
}

h1 {
font-size: 2.2em;
color: #FFCC33;
padding-top: .5em;
padding-bottom: .5em;
}

body#contact h1 {
padding-bottom: 0;
}

#contactInfo h1 {
text-align: center;
}

h2 {
font-size: 1.8em;
color: #FFCC33;
}

h3 {
font-size: 1.7em;
}

h4 {
font-size: 1.7em;
font-style: italic;
color: #FFCC33;
}

.mediaInfoBlock {
text-align: center;
margin-bottom: 10px;
}

.price h1 {
display: block;
margin: 0 auto;
padding-top: .25em;
padding-bottom: .25em;
}

.orderPhone {
display: block;
font-size: 1.7em;
font-weight: bold;
}

.quote {
clear: both;
font-style: italic;
padding: 5px;
padding-top: 15px;
margin-bottom: 15px;
border-top: 1px solid #B8002B;
border-bottom: 1px solid #B8002B;
}

.quoter {
text-align: right;
padding-top: 5px;
padding-bottom: 10px;
}

.caption {
padding: 3px;
font-size: 10px;
line-height: 13px;
text-align: left;
}

body#fineInstruments h1 {
padding-top: .25em;
padding-bottom: .25em;
border-bottom: 1px solid #B8002B;
}

body#fineInstruments .linkArea h1 {
border: 0px;
}

body#fineInstruments h4 {
padding-top: 5px;
padding-bottom: 5px;
}

/* Links
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

a, a:hover {
color: #FFCC33;
}

#footer a, .pmtfooter a {
color: #750000;
text-decoration: none;
}

#footer a:hover, .pmtfooter a:hover {
color: #FFFFFF;
}

body#index #footer a, body#index .pmtfooter a, body#index .pmtfooter, body#index #addressArea, body#index #addressArea a {
color: #333333;
}

.linkArea a {
display: block;
font-size: 1.8em;
color: #CCCCCC;
padding-top: 5px;
text-decoration: none;
padding-bottom: 5px;
border-bottom: 1px solid #414141;
}

.linkArea a:hover {
color: #FFCC33;
}

body#contact #contentArea a {
font-size: 1.8em;
display: block;
color: #C9C9C9;
text-align: center;
padding-bottom: 5px;
text-decoration: none;
}

a img {
border: 0;
}

/* -------------------------- formStyles.css -------------------------- */

body#mediaAd #contactForm {
padding: 10px;
}


form {
/* styles the form tag. by default IE give the form tag a predefined margin */
margin: 0;
}

.formBlock {
/* container for form elements allows for easy break up */
float: left;
width: 40%;
padding: 10px;
}

.formRow {
/* container for one form element. Contains the label and field styles */
clear: both;
padding-bottom: 5px;
}

label {
/* styles the label tag */
display: block;
}

.field {
/* surrounds the type of field for data */
}

.required {
/* this class will color code and give a visual clue to the user what information is requied */
font-weight: normal;
color: #CC0000;
}

select {
/* styles the select boxes */
width: 150px;
}

div.submitBlock {
/* container for the submit and reset buttons */
clear: both;
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
}

input, textarea {
font-size: 100%;
font-family: Verdana, Arial, Tahoma, sans-serif;
}


/* -------------------------- lightbox.css -------------------------- */

#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	margin-top: 50px;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/lightbox2/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/lightbox2/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/lightbox2/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	color: #270000;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}