/*---------------------------------------------------------------------------------------
  
                        Website: Slim Jims
                        Author: Bitmedia
                        Created: October 2008
  
---------------------------------------------------------------------------------------*/


/*
    Basics
    Navigation
    Layout
    Content
    Typography
    Form Styles
    Misc
*/



/*---------------------------------------------------------------------------------------
   Basics
---------------------------------------------------------------------------------------*/

/* Default and Common CSS styles */
@import "default.css";
@import "common.css";


/* Body */
body { background: url('../images/montage.jpg') repeat-x top center #000;}





/*---------------------------------------------------------------------------------------
   Navigation
---------------------------------------------------------------------------------------*/

/* Main Nav */
ul#mainNav { position: absolute; top: 0px; left: 350px; margin: 38px 0 0 0; padding: 0; list-style: none; width: 640px;}
ul#mainNav li { float: left; display: inline; margin: 0; padding: 0;}
ul#mainNav li a { float: left; display: block; height: 36px; text-indent: -9999px; outline: 0; color: #fff;}
ul#mainNav li a.homeNav { background: url('../images/homeNav.png'); width: 79px;}
ul#mainNav li a.aboutNav { background: url('../images/aboutNav.png'); width: 86px;}
ul#mainNav li a.whatsonNav { background: url('../images/whatsonNav.png'); width:116px;}
ul#mainNav li a.locationNav { background: url('../images/locationNav.png'); width: 113px;}
ul#mainNav li a.galleryNav { background: url('../images/galleryNav.png'); width: 111px;}
ul#mainNav li a.contactNav { background: url('../images/contactNav.png'); width: 112px;}


ul#mainNav li a:hover { background-position: 0 -36px;}
ul#mainNav li a.currentPage { background-position: 0 -72px !important;}

/* Minor Nav */
ul#minorNav { float: right; margin: 0; padding: 0; list-style: none;}
ul#minorNav li { float: left; display: inline; margin: 0; padding: 0;}
ul#minorNav li a { float: left; padding: 0 7px 0 5px ; background: url('../images/minorNavDivider.jpg') no-repeat center right; text-decoration: none;}
ul#minorNav li a:hover { color: #fff;}
ul#minorNav li a.currentPage { color: #fff; text-decoration: underline;}





/*---------------------------------------------------------------------------------------
   Layout
---------------------------------------------------------------------------------------*/
#outerContainer { width: 100%; background: url('../images/redGrungeBg.jpg') repeat-x top center;}
#pageContainer { position: relative; width: 994px; margin: 0 auto;}
#mainColumn { width: 623px; float: right; margin-top: 120px;}
body.homePage #mainColumn { margin-top: 70px;}
#sideColumn { width: 371px; float: left; text-align: center;}
#contentText { padding-right: 50px;}
#footerContainer { width: 100%; min-height: 40px; height: auto; min-width: 994px; margin-top: 25px; background: url('../images/greyGrungeBg.jpg') no-repeat top center;}
* html #footerContainer { height: 40px;}
#footer { width: 944px; margin: 0 auto; padding-top: 20px;}

#contentTextAdditional { float:left; width: 100%;}

/*---------------------------------------------------------------------------------------
   Content
---------------------------------------------------------------------------------------*/
/* Side Column */
#logo { margin: 40px 0 0 0px;}
#goodtimesStamp { margin: 40px 0 30px 0px;}
#barImage { margin: 0 0 0 20px;}
address { width: 100%; margin-top: 15px; text-align: center; font-style: normal; font-size: 1.2em; color: #eda956;}

/* Gallery */
#galleryContainer a img { margin: 0 5px 5px 0; border: 1px solid #710020;}
#galleryContainer a:hover img { border: 1px solid #c38a38;}





/* footer */
#valid { float: left;}
#valid a { padding: 0 7px 0 3px; background: url('../images/minorNavDivider.jpg') no-repeat center right; text-decoration: none;}
#valid a:hover { color: #fff;}
#copyright { float: left; margin-left: 7px;}
#s4 { float: right; padding: 0 7px 0 5px; text-decoration: none;}
a#s4:hover { color: #fff; }
#facebook { float: left; padding-left: 120px;}
#facebook span { float: left;}
#facebook a { display: block; float: left; width:84px; height: 15px; margin-left: 5px; background: url('../images/facebook.png') no-repeat; text-indent: -9999px; outline: 0;}
#facebook a:hover { background-position: top right;}




/*---------------------------------------------------------------------------------------
   Page Groups
---------------------------------------------------------------------------------------*/

/* Features Page Group */
#featuresPageGroup { margin-top: 20px;}
.feature { float: left; width: 284px; margin-right: 10px;}
.featureImage { float: left; width: 113px; padding-left: 11px; margin-top: 12px;}
.featureAbstract { float: right; width: 140px; min-height: 95px; height: auto; margin-top: 20px; padding: 0 10px; line-height: 1.3em;}
* html .featureAbstract { height: 95px;}
.featureImage img { background: url('../images/featureImageBg.jpg') no-repeat; padding: 5px 6px 6px;}
.featureLink { float: right; width: 140px; padding: 0 10px; margin-top: 10px;}
.featureLink a { display: block; width: 96px; height: 22px; background: url('../images/moreInfoButton.jpg') no-repeat; text-indent: -9999px; outline: 0;}
.featureLink a:hover { background-position: 0 -22px;}

/* Events PageGroup */
#eventsPageGroup { width: 570px; padding: 0 0 0 5px; margin-top: 35px; }
.event { float: left; border-bottom: 1px solid #413437; padding-bottom: 20px; margin-bottom: 20px;}
.event strong { color: #eca525; margin-right: 5px;}
.eventImage { float: left; width: 95px; margin-right: 15px;}
.eventImage img { border: 1px solid #eca525;}
.eventHeader { float: left; width: 460px; color: #eca525; font-size: 1.4em; margin-bottom: 10px;}
.eventDate { float: left; width: 460px; margin-bottom: 5px;}
.eventTime { float: left; width: 460px; margin-bottom: 5px;}
.eventInfo { float: left; width: 460px; line-height: 1.3em;}

.eventAlt strong { color: #c63157;}
.eventAlt .eventImage img { border: 1px solid #c63157;}
.eventAlt .eventHeader { color: #c63157;}


/*---------------------------------------------------------------------------------------
   Typography
---------------------------------------------------------------------------------------*/

/* Links */
a { color: #ea8d15; text-decoration: none;}
a:hover { text-decoration: underline;}

/* Normal Type */
body { font: 62.5% arial, tahoma, arial, helvetica; color: #F6E5AD;}
#pageContainer { font-size: 1.2em; line-height: 1.6em; text-align: left;}
p { margin-bottom: 1.2em;}
#mainColumn p { padding: 0 5px;}


#footerContainer { font-size: 1.1em; line-height: 1.4em; text-align: left;}
#footer, #footer a { color: #787878;}


/* Headers */
#mainColumn h1 { margin-bottom: 20px; padding: 0 5px;}
#featuresPageGroup h3 { width: 284px; height: 36px; text-indent: -9999px; outline: 0;}
#featuresPageGroup .musicFeatureHeader { background: url('../images/musicFeatureHeader.jpg') no-repeat; }
#featuresPageGroup .anotherFeatureHeader { background: url('../images/anotherFeatureHeader.jpg') no-repeat; }



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

/* Default Form Style */
#contactForm { width: 500px; margin-top: 20px; padding-left: 5px;}
.formRow { width: 100%; float: left; margin-bottom: 10px;}
.formLeft { width: 130px; float: left;}
.formRight { float: left;}
.formRight input, .formRight textarea { margin-right: 5px;}
input.input { border: 1px solid #710020; background: #fffff1; color: #000;}
textarea.textarea { border: 1px solid #710020; background: #fffff1;}
select.select { border: 1px solid #710020; background: #fffff1; color: #000;}
select.select option {background: #fffff1; color: #000;}
input.submit { }
input.submit:hover { }

.submit { display: block; width: 56px; height: 27px; margin-left: 130px; line-height: 27px !important; border: 0; cursor: pointer; text-decoration: none; color: #000; text-align: center; background: url('../images/button1.gif') no-repeat; }
.submit:hover { background-position: top right;}




/*---------------------------------------------------------------------------------------
   Misc.
---------------------------------------------------------------------------------------*/

/* Error Page */
p#errorMessage { padding: 40px 0 0; }
body.errorPage #pageContainer { text-align: center; min-width: 400px; width: auto;}
* html body.errorPage #pageContainer { width: 400px;}
body.errorPage #logo { float: none; margin: 30px 0 0;}

/* Float Image Right */
.imageRight { float: right; margin: 0 0 5px 5px; border: 1px solid #eca525;}