﻿div.content
{
	background-image: url('../images/cabinWall.jpg');
	background-repeat: no-repeat;
}

div.menu
{
	width: 700px;
	height: 101px;
	display: inline;	
}

div#home
{
	width: 89px;
	height: 101px;
	background-image: url('../images/bucketHome.jpg');
	background-repeat: no-repeat;
	background-position: 0px 0px;
	overflow: hidden;	
	float: left;
}

div#about
{
	width: 90px;
	height: 101px;
	background-image: url('../images/bucketAbout.jpg');
	background-repeat: no-repeat;
	background-position: 0px 0px;
	overflow: hidden;	
	float: left;
}

div#portfolio
{
	width: 105px;
	height: 101px;
	background-image: url('../images/bucketPortfolio.jpg');
	background-repeat: no-repeat;
	background-position: 0px 0px;
	overflow: hidden;	
	float: left;
}

div#contact
{
	width: 100px;
	height: 101px;
	background-image: url('../images/bucketContact.jpg');
	background-repeat: no-repeat;
	background-position: 0px 0px;
	overflow: hidden;	
	float: left;
}

div#shelf
{
	width: 186px;
	height: 101px;
	background-image: url('../images/shelf.jpg');
	background-repeat: no-repeat;
	float: left;
}

a#sign
{
	width: 130px;
	height: 101px;
	float: left;
	background-image: url('../images/signAnimated.gif');
	background-repeat: no-repeat;
	background-position: 0px 0px;
	overflow: hidden;
}

a#sign:hover
{
	background-position: 0px -101px;
}

div.mainBody
{
	padding-top: 100px;
}

div.chalkboard
{
	padding-top: 1px;		/* This is needed in order to prevent collapsing margin for chalkboardContent. */
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
	width: 510px;
	height: 320px;
	background-image: url('../images/chalkboard.jpg');
	background-repeat: no-repeat;
}

div.chalkboardContent
{
	margin-top: 35px;
	margin-left: 35px;
	width: 440px;
	height: 250px;
}
