/*///// Site Specific Styles
------------------------------------------------- */

#wrap{width: 960px; margin: 0 auto;}

.hdr, .ftr{float: left; width: 50%; background: url(/img/bg-hdrtl.gif) #4B3D34 no-repeat top left;}
.topright{background: url(/img/bg-hdrtr.gif) #4B3D34 no-repeat top right; text-align: right;}

.ftr{width: 31%; background: url(/img/bg-ftrbl.gif) #fff no-repeat bottom left; padding: 27px 0 6px 1%; *padding: 28px 0 5px 9px;}
.btmright{width: 66%; background: url(/img/bg-ftrbr.gif) #fff no-repeat bottom right; padding: 19px 2% 13px 0; *padding: 20px 2% 13px 0; text-align: right;}

.hdr img.logo{margin: 30px 5px;}
.hdr img.aba{margin: 25px 25px 30px 25px;}

#content{background: url(/img/bg-content.gif) #fff repeat-x top left; padding-bottom: 5%;}

#searchbar{float: right; width: 35%; background: url(/img/bg-searchbar.gif) no-repeat top right; *background-image: url(/img/bg-searchbar-ie.gif); height: 37px; padding-top: 9px;}

#nav{float: left; width: 20%; border-right: 1px #D7D6D4 dashed; padding: 0 2% 0 1%;}

.main{float: left; width: 50%; padding: 0 2%;}
.full{width: 72%; padding: 0 2%;} /*add to main div to remove sidebar*/

#sidebar{float: right; width: 22%; font-size: 90%;}


/*///// Text, Images, Links Etc
------------------------------------------------- */

a{padding: 0; margin: 0;}
#nav ul li{list-style: none; margin: 7px 0; padding: 0;}
#nav ul li a{display: block; font-family: Calibri; font-size: 115%; text-decoration: none; padding-left: 16px; *padding-left: 8px; background: url(/img/bg-nav.gif) no-repeat 0 5px;}
#nav ul li a:hover, #nav ul li a.on{color: #D15724; background: url(/img/bg-nav-on.gif) no-repeat 0 5px;}
#nav ul li a.nolink{color: #555; background: url(/img/bg-nav.gif); font-weight: bold;}

img.inset{float: left; margin: 0 10px 10px 0;}
img.insetright{float: right; margin: 0px 0 10px 10px;}
img.home{border: 3px #F2E3CC solid;}

#sidebar .feature{padding: 1px 15px 0 15px; background: url(/img/bg-sidebaritem.gif) #fff repeat-x;}
img.sidebar{border: 3px #fff solid; margin: 5px 0 0 0;}

.ftr a{color: #666; font-size: 90%; margin: 0 5px;}

#orderStageHolder{width: 100%;}

.orderStage1,
.orderStage2,
.orderStage3,
.orderStage4,
.orderStage1Active,
.orderStage2Active,
.orderStage3Active,
.orderStage4Active
{
	display: block;
	background-color: #BFB0A7;
	float: left;
	padding: 3px;
	font-size: 80%;
	color: #000; 
	width: 110px;
	border-right: 1px #fff solid;
}
.orderStage4 {border-right: none;}
.orderStage1Active, .orderStage2Active, .orderStage3Active, .orderStage4Active {border-right: 1px #fff solid; background-color: #735c4e; color: #fff; font-weight: bold;}
.orderStage4Active {border-right: none;}

ul.alphaList{padding: 0; margin: 0; list-style: none;}
ul.alphaList li{margin: 0; padding: 0; list-style: none;}
ul.alphaList a{border: 1px #ccc solid; text-decoration: none; padding: 0; margin: 0;}

div.letterholder{width: 145px; margin: 30px auto;}
p.letterholder-caption{font-family: Calibri;}
div.atozletter, div.atozselect, div.noletter
{
    float: left;
    width: 17px;
    height: 16px;
    line-height: 16px;
    font-size: 85%;
    text-align: center;
    border: 1px #c1c1c1 solid;
    margin: 1px;
    cursor: pointer;
    text-decoration: none;
}

div.letterholder div.atozletter, div.letterholder div.atozselect, div.letterholder div.noletter{width: 20px; height: 19px; margin: 1px; line-height: 20px;}
div.atozletter:hover{background: #F6EED1;}
div.atozselect{color: #fff; font-weight: bold; background: #4A3C33;}
div.noletter{cursor: default; background: #f1f1f1; color: #d1d1d1;}


/*///// Form Styles
------------------------------------------------- */

#searchbar form label{font-size: 110%; font-weight: bold; padding: 0 8px 0 5px;}
#searchbar form input{width: 36%; border: 1px #444 solid; margin-right: 5px;}
#searchbar form input.submit{width:60px; background: #4B3D32; color: #E76332; font-weight: bold; font-size: 90%; padding: 2px 1px 1px 2px;}

form.contact fieldset{border: 1px #4B3D34 dashed; padding: 20px;}
form.contact legend, form.contact input#submit{border: 1px #4B3D34 solid; background: #4B3D34; color: #fff; padding: 1px 3px; font-weight: bold;}
form.contact label{float: left; width: 120px;}
form.contact label.min{width: 60px; margin-bottom: 16px;}
form.contact input, form.contact textarea{float: left; width: 200px; border: 1px #ccc solid; margin-bottom: 2px;}
form.contact input.radio{border: 0; width: 15px; margin-right: 20px;}
form.contact textarea{float: left; width: 400px; height: 120px;}
form.contact input#submit{width: 70px; font-size: 90%; font-family: Georgia; border: 1px #000 solid;}

div#error
{
    background: #f3f3f3;
    border: 1px #ccc dashed;
    padding: 10px;
    font-size: 90%;
}
div#error h2{color: #FF4454;}
div#error h2.success{color: #26CF6D;}
div#error ul li{list-style: url(/img/errorbullet.gif);}

/*///// Table Styles
------------------------------------------------- */

table.searchResults{width: 100%;}
table.searchResults tr th{background: #4B3D34; color: #fff; font-weight: bold; border: 0;}
table.searchResults tr td{border: 1px #ccc solid; border-width: 1px 0; padding: 3px 0;}



/*///// Grid styles - { color: #333b39; }
------------------------------------------------- */

.gridView { width: 691px; }
.gridView .categoryTitle { background: #9f816d; padding: 5px 10px; margin: 0 0 10px; color: #fff; font-weight: bold; }

.gridView ul { margin: 0 0 10px; padding: 0; list-style: none; width: 691px; display: inline-block; }
.gridView ul li { margin: 15px; padding: 0; width: 197px; min-height: 350px; float: left; }
.gridView ul li img { background: #4b3d34; border: 1px solid #fff; padding: 10px; }
.gridView ul li img:hover { background: #312721; }
.gridView ul li h2 { text-align: center; margin: 0 0 10px; color: #333; }
.gridView ul li h2 a { font-size: 14px; }
.gridView ul li p { text-align: center; margin: 0; }
.gridView ul li span { font-weight: bold; }
.gridView ul li .bookPrice { margin: 10px 0 0; }

.gridView .bookPrice img { background: none; border: 0; padding: 0; margin: 0; float: none; }

.viewTemplate { width: 691px; }
.viewTemplate h1 { margin: 5px 0 30px; }
.viewTemplate .viewImage img { background: #4b3d34; border: 1px solid #fff; padding: 10px; float: left; margin: 0 0 10px; }
.viewTemplate .viewImage img:hover { background: #312721; }