/* CSS Document */

body {
	background-attachment: fixed;
	 -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
	background-color: #996633;
	background-image: url('images/background.jpg');
	background-repeat: no repeat;
	background-position: left top;
	background-size: cover;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

a {
	color: #996600;
}

div#photo_img
{
border: 0px;
background-image: url('images/photo_arrangement.png');
width: 250px;
height: 386px;
position: fixed;
}

div#content_box
{
border: 2px solid black;
background-image: url('images/box_background.jpg');
top: 30px;
left: 210px;
z-index:4;
width: 900px;
height: auto;
padding: 5px 5px 5px 5px;
position: absolute;
box-shadow: 0px 0px 6px #000;
-webkit-box-shadow: 0px 0px 6px #000;
behavior: url(pie/PIE.htc);
}

div#books_box
{
	border: 2px solid black;
	background-color: #fff;
	width: 855px;
	height: auto;
	margin: 12px 0px 12px 10px;
	padding: 5px 5px 5px 5px;
	position: relative;
	box-shadow: 0px 0px 5px #000;
	-webkit-box-shadow: 0px 0px 5px #000;
	behavior: url(pie/PIE.htc);
}

#wraparound {
			position:relative;
			padding: 0px 10px;
			margin: 5px -15px 3px -15px;	/* 30 = 20 padding + 10 neg margin */
			
			border: 1px solid #000;
			background-image: url('images/menu_background.jpg');
			background-repeat: repeat;
			box-shadow:0 4px 4px rgba(0,0,0,0.3);
			behavior: url(pie/PIE.htc);
			}
			#wraparound:before,
			#wraparound:after {
				content:" ";
				border-top:10px solid #000;	/* Colour of the triangle. To flip the effect, use border-bottom. */
				position:absolute;
				bottom:-11px; /* +1 to compensate for the border */
				} 
				#wraparound:before {
					border-left:10px solid transparent;
					left:-1px;	/* Only required if the element has a border */
					}
				#wraparound:after {
					border-right:10px solid transparent;
					right:-1px;
					}
					
					
.menu {width:100%; height:60px; position: relative; padding: 0px;}
.menu ul, .menu li { float: left; list-style: none; display: inline; font-family: Book Antiqua, serif; font-weight: bold; font-size: 20px; text-shadow: 2px 2px black;}
.menu a { color: #fff; display: block; border: none; text-decoration: none; padding: 0px 15px;}
.menu a:hover { color: #ffff99; display: block; padding: 0px 15px;}

div#openbook_box
{
border: 0px;
background-image: url('images/openbook.png');
width: 842px;
height: 643px;
margin: 12px auto 12px auto;

}

div#iframewrapper {
  position: absolute;
  margin-left: 450px;
  margin-top: 65px;
  -webkit-overflow-scrolling: touch; 
  overflow: hidden;
  }
  
  #toast {
  background-image: url('images/toast.png');
  border: 0px;
  margin-left: 65px;
  margin-top: 100px;
  width: 300px; 
  height: 307px;
  float: left;
  }

div#contact_img
{
border: 0px;
padding: 0px;
background-image: url('images/cocktail_napkin.png');
width: 200px;
height: 177px;
position: fixed;
bottom: 150px; 
left: 0px; 
z-index:0;
-webkit-perspective:180px; /* Chrome, Safari, Opera */
-webkit-perspective-origin: 10% 5%; /* Chrome, Safari, Opera */
perspective:180px;
perspective-origin: 10% 5%;
behavior: url(pie/PIE.htc);
}

div#contact_text
{
padding: 80px 20px 100px 40px;
position: absolute;
font-family: 'Indie Flower', sans-serif;
font-size: 22px;
text-shadow: 0px 1px 2px #fff;
-webkit-transform: rotate(-25deg); /* Chrome, Safari, Opera */
transform: rotate(-25deg);
behavior: url(pie/PIE.htc);
} 

a#contact_text
{
text-decoration: none;
color: #00004c;
}

div#photo_img2
{
border: 0px;
width: 300px;
height: 230px;
position: fixed;
}

div#overdue
{
border: 0px;
background-image: url('images/OverdueBillNotice.png');
width: 300px;
height: 197px;
font-family: Courier New, Courier, monospace;
font-size: 14px;
position: relative;
}

div#social
{
border: 0px;
background-image: url('images/notebook_paper_torn.png');
width: 279px;
height: 180px;
padding: 0px;
position: relative;
}

.newsletterForm
{
    width: 266px;
    height: 220px;
	padding: 5px 0px 0px 30px;
    background-image: url('images/torn-paper.png');
    background-repeat: no-repeat;
	font-weight:bold;
    font-family: Courier New, Courier, monospace;
	font-size: 12px;
	position: relative;
}

.nameField
{
    top: 44px;
    height: 15px;
    background-image: url('images/field_name.jpg');
}
.emailField
{
    top: 90px;
    height: 15px;
    background-image: url('images/field_email.jpg');
}
.passField
{
    top: 133px;
    height: 15px;
    background-image: url('images/field_password1.jpg');
}
.sendButton
{
    position:absolute;
    top:170px;
    left:180px;
    width:60px;
    height:25px;
    border:solid 2px #000000;
    background-color:#7c6852;
    color:#e1cdae;
}