/*-------------------------------------------------------------------------------------------------------*/
/* CSS FOR BRIANBEASLEY.CO.UK Copyright Artwebs ltd. 2007. Ask us if you want to copy the content of this page!!*/
/*-------------------------------------------------------------------------------------------------------*/

/***************General Formatting*************/

body 				{margin: 10px 0; background: #ff6600;}

h1 					{margin: 5px 8px 8px 8px; padding: 5px 0 3px 0; font: bold 100% Arial, Helvetica, sans-serif; color: #333; text-align: left;}

/*container - change width setting to alter settings*/
#container			{width: 100%; background: #ff6600; margin: 0px;}
#header 			{width: 100%; height: 155px; background: #000;}
#brandBox			{width: 750px; height: 140px; background: url(../images/header/headerBg.jpg) no-repeat right;}

/*content - change width setting to alter settings*/
#content			{width: 752px; margin: 0px; background: #fff; border-right: solid 1px #000; border-bottom: solid 1px #000; border-left: solid 1px #000;}
#content p 			{margin: 4px 6px 8px 6px; font: 75% Arial, Helvetica, sans-serif; color: #333; vertical-align: top; text-align: justify;}
.center				{text-align: center !important;}

#column1			{width: 365px; margin: 3px;}
#column2			{width: 365px; margin: 3px; border-left: dotted 1px #000}
#column3			{width: 740px; margin: 3px;}
#column4			{width: 400px; margin: 3px; border-right: dotted 1px #000}
#column5			{width: 340px; margin: 3px;}
#contentGallery		{height: 575px; width: 750px;}

/*Brand Box rollovers*/
#brandBoxImages		{width: 390px;}
#brandBoxImages img	{padding: 0 10px 0 0;}
#brandBoxImages div	{width: 70px; height: 70px; margin: 20px 3px 0 3px; border: 1px solid #fff;}
#brandBoxImages a	{display: -moz-inline-block; display: inline-block;}
#brandBoxImages a:focus {-moz-outline: none;}
#brandBoxImages a:focus {outline: none;}
#square1 a:hover	{background: url(../images/header/square1over.jpg) no-repeat top left;}
#square2 a:hover	{background: url(../images/header/square2over.jpg) no-repeat top left;}
#square3 a:hover	{background: url(../images/header/square3over.jpg) no-repeat top left;}
#square4 a:hover	{background: url(../images/header/square4over.jpg) no-repeat top left;}
#square5 a:hover	{background: url(../images/header/square5over.jpg) no-repeat top left;}


/*NavBar*/
#navbar 			{width: 750px; background-color: #ccc; background: #000;}
#navbar a 			{display: block; text-align: center; font: bold 75% Arial, Helvetica, sans-serif; color: #333; padding: 2px 10px 2px 5px; background: #ff6600 url(../images/common/cornerTR.gif) no-repeat right top; border-bottom: solid 1px #000; border-left: solid 1px #000; border-right: solid 1px #000;}
#navbar a:link, 
a:visited 			{text-decoration: none; color: #333;}
#navbar a:hover 	{color: #000; background: #fff url(../images/common/cornerTR.gif) no-repeat right top; border-bottom: solid 1px #fff; border-left: solid 1px #000; border-right: solid 1px #000;}
#homeMain #home, 
#galleryMain #gallery, 
#aboutMain #about,
#showsMain #shows	{color: #000; background: #fff url(../images/common/cornerTR.gif) no-repeat right top; border-bottom: solid 1px #fff; border-left: solid 1px #fff;}		
#footer p			{font: bold 70% Arial, Helvetica, sans-serif; color: #000; width: 750px; text-align: center;}
#footer a 					{color: #000; text-decoration: underline; font-weight: bold;}
#footer a:hover				{color: #fff; text-decoration: underline; font-weight: bold;}


/*****************Images*****************/
.leftNb     			{float: left;}
.leftNbMarg    			{float: left; margin: 3px 6px 3px 6px;}
.rightNb    			{float: right; }
.rightB     			{float: right; margin: 5px 0px 5px 0px; border: solid 1px #333;}
.leftB					{float: left; margin: 5px 0px 5px 0px; border: solid 1px #333;}
.tableLb				{float: left;  margin: 2px 8px 8px 5px; border: solid 1px #333;}
.tableRb				{float: right;  margin: 0 8px 8px 8px; border: solid 1px #333;}
.blockBLb				{float: left; margin: 5px 0px 5px 5px; border: solid 1px #333;}
.blockBRb				{float: left; margin: 5px 0px 5px 5px; border: solid 1px #333;}
.tightB					{border: solid 1px #333;}
.tightNb				{margin: 2px;}
.tightNbR				{float: right; margin: 2px;}
.tightNbL				{float: left; margin: 2px;}

.perRight				{position: relative; top: 2px; left: 2px;}

/*Image Caption code*/
.image_boxL				{float:left;}/*"shrink wraps the box width to that of the widest content*/
.image_boxR				{float:right;}/*"shrink wraps the box width to that of the widest content*/ 
.captionR				{text-align: right !important; font-size:65% !important; color: blue !important; font-weight: bold; position: relative;top: -14px !important;}/*block level paragraph automatically fills container, so no width is needed*/ 
.captionL				{text-align: left !important; font-size:65% !important; color: blue !important; font-weight: bold; position: relative;top: -14px !important;}/*block level paragraph automatically fills container, so no width is needed*/ 
.tableB					{margin: 2px 8px 8px 8px; border: solid 1px #333;}
.tableNB				{margin: 2px 8px 8px 8px;}