/* border:1px solid green;*/

/* -- shell -----------------------------------*/
* { margin:0; padding:0;}
body  { background:#320404; font-family:Arial, Helvetica, sans-serif;}

#contentFixedBack   { background:#ff9100 url(../images/back-fixedGrad.jpg) repeat-x; margin:0 auto;}
#contentFixedShell  { width:990px; height:630px; margin:0 auto; position:relative; padding:0; z-index:200;}
#contentShell       { width:990px; margin:0 auto; position:relative;}
#contentSiteAdmin   {
	width:990px;
	position:relative;
	background-color: #ffda99;
	background-repeat: repeat-y;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	top: 50px;
}

#footerLine  { height:3px; background-color:#FFFFFF; clear:both; font-size:1px;}
#footerBack  { background:#320404 url(../images/back-footer2.jpg) center no-repeat;}
#footerShell { width:990px; height:192px; margin:0 auto;}

#logo   { position:absolute; width:276px; height:275px; top:33px; left:0; z-index:10;}
#logo a { display:block; width:276px; height:275px; background:url(../images/logo-Great-South-Bay-Brewery.png) no-repeat;}


/* -- footer styles -----------------------------------*/
#footerShell p { text-align:center; padding:30px 40px 0 40px; color:#FFFFFF;}
#footerShell p a:link, #footerShell p a:visited { color:#ffda00; text-decoration:none;}
#footerShell p a:hover, #footerShell p a:active { color:#ffda00; text-decoration:underline;}
p.small { color:#ffda00 !important; padding-top:20px !important; font-size:10px;}


/* -- global styles -----------------------------------*/
* { margin:0; padding:0; outline:none;}
.moveToFront {position:relative; z-index:50;}
.clearAll { clear:both; font-size:1px; line-height:1px; height:.01em;}

input, textarea { font-family:Arial, Helvetica, sans-serif; color:#414141; font-size:11px; line-height:13px; padding:2px;}

p, ul { font-size:12px; line-height:20px; margin-bottom:16px; color:#492d10; }
p a:link, p a:visited { color:#0d356f;}
p a:hover, p a:active { color:#4070bf;}


h1           { font-size:24px; line-height:26px; color:#c4222c; margin-bottom:16px;}
h1 span      { font-size:18px; color:#492d10;}
h2, p span   { font-size:18px; line-height:20px; color:#23308b; font-weight:bold; margin-bottom:6px;}
h3           { font-size:14px; line-height:18px; color:#23308b; font-weight:bold;}
h4           { font-size:36px; line-height:38px; color:#303030; margin-bottom:12px;}
.brown       { color:#492d10;}
.blue        { color:#23308b;}
.red         { color:#c4222c;}

ul {margin:0 0 16px 0;} 
li { margin:2px 0 3px 20px; font-weight:bold;}
.photo-BotLeft { float:left; position:absolute; bottom:-30px; left:60px; background-repeat:no-repeat;}
.photo-topRt { float:right; position:absolute; top:-53px; right:-10px; background-repeat:no-repeat;}




/* -- style for More button, use in any span tag with a link ------------------*/
span a       { display:inline-block; width:47px; height:15px; background:url(../images/btn-more.png) 0 0 no-repeat; vertical-align:-3px; font-size:1px;}
span a:hover { background:url(../images/btn-more.png) 0 -15px no-repeat;}


/* -- topnav -----------------------------------*/
#topnav          { width:620px; height:54px; position:absolute; top:0; right:95px;}
#topnav a        { display:block; float:right; height:54px; background-position: 0 0; background-repeat:no-repeat;}
#topnav a:hover  { background-position: 0 -54px;}

/*   old nav   */
/*#link-baystore   { background-image:url(../images/nav-BayStore.png); width:88px;}
#link-bayway     { background-image:url(../images/nav-BayWay.png); width:92px;}
#link-brews      { background-image:url(../images/nav-bayBrews.png); width:84px;}
#link-guys       { background-image:url(../images/nav-bayGuys.png); width:85px;}
#link-finder     { background-image:url(../images/nav-bayFinder.png); width:91px;}
#link-happenings { background-image:url(../images/nav-bayEvents.png); width:85px;}*/


/*   new nav not used yet   */
#link-bayway     { background-image:url(../images/nav-BayWay.png); width:66px;}
#link-brews      { background-image:url(../images/nav-bayBrews.png); width:66px;}
#link-guys       { background-image:url(../images/nav-bayGuys.png); width:66px;}
#link-finder     { background-image:url(../images/nav-bayFinder.png); width:66px;}
#link-happenings { background-image:url(../images/nav-bayEvents.png); width:66px;}
#link-press      { background-image:url(../images/nav-bayNews.png); width:66px;}
#link-baystore   { background-image:url(../images/nav-BayStore.png); width:66px;}
#link-logout   { background-image:url(../images/nav-logout.png); width:66px;}
#mail-list       { background-image:url(../images/nav-mail.png); width:87px;}



#buzzCap         { position:absolute; top:10px; right:20px; z-index:30;}
#buzzCap a       { background:url(../images/btn-cap-giveBuzz.png) 0 0 no-repeat; display:block; width:75px; height:74px;}
#buzzCap a:hover { background:url(../images/btn-cap-giveBuzz.png) 0 -74px no-repeat;}         


/* -- home page -----------------------------------*/
#hero       { width:810px; height:465px; position:absolute; top:57px; right:0; z-index:3;}
#message    { position:absolute; top:220px; right:20px; width:200px; height:120px; background:url(../images/ico-carrotLeft.png) no-repeat; padding:0 0 0 20px;}
#message h1 { color:#c4222c; font-size:24px;}
#message p  { font-size:14px; line-height:18px; padding-top:6px;}

#bottom  { padding:0 0 0 50px; width:940px;/* height:190px;*/ position:absolute; top:414px; left:0px; z-index:20; background:url(../images/ico-bar.png) no-repeat;}
.botBox  { margin:30px 0 80px 0; padding:0 24px; height:150px; width:200px; float:left; background:url(../images/ico-Dot.png) repeat-y; position:relative;}
#bayMen  { position:absolute; width:150px; height:167px; background:url(../images/home-Rick.png) no-repeat; bottom:-36px; left:190px; z-index:8;}

#bottom .botBox p { margin-bottom:4px; padding:0;}
#bottom h3 a           { margin:0; padding:2px 0px 2px 14px; color:#492d10; text-decoration:none; display:block; background: url(../images/ico-carrotRt.png) 4px 6px no-repeat;}
#bottom h3 a:hover     { color:#23308b; text-decoration:none;}
.homeNews              { }
.homeNews p            { line-height:14px; padding:0px 0px 0px 14px !important;}

#social          { position:absolute; width:220px; top: 300px; left:50px; z-index:8;}
.btnCaps a       { float:left; width:63px; height:62px; background-position:0 0; background-repeat:no-repeat; margin-right:5px;}
.btnCaps a:hover { background-position:0 -61px;}
.twitter         { background-image:url(../images/btn-cap-twitter.png);}
.facebook        { background-image:url(../images/btn-cap-facebook.png);}
.blogger         { background-image:url(../images/btn-cap-blogger.png);}




/* -- 1 collumn page -----------------------------------*/
#hero2       { width:810px; height:190px; position:absolute; top:57px; right:0; background-repeat:no-repeat; z-index:5; background-position:right;}
#col-full    { width:580px; min-height:400px; float:right; margin:300px 60px 30px 0; padding:0 0 10px 60px; background:url(../images/ico-Dot.png) repeat-y; position:relative; display:inline;}

/*#sidebar          { position:absolute; width:220px; top: 430px; left:50px; z-index:8;}*/
#sidebar { width:220px; float:left; margin:440px 0 30px 50px; padding:0; position:relative; display:inline;}


#col-full img.fl  { float:left; margin:0 10px 5px 0;}
#col-full img.fr  { float:right; margin:0 0 5px 10px;}
#col-bottom       { position:absolute; width:220px; bottom:0; left:-250px;}

.repeat         { margin:10px 0; padding:6px 20px 8px 10px; border-bottom:1px solid #FFFFCC;}
.repeat h2      { text-transform:capitalize; font-size:14px; line-height:15px;}
.repeat p       { line-height:14px; margin-bottom:10px;}
.repeat b       {color:#c4222c;}
.repeat a:link, .repeat a:visited {color:#23308b !important; text-decoration:none;}
.repeat a:hover, .repeat a:active {color:#c4222c !important; text-decoration:underline;}
.repeat img     { border:none;}
.repeat i       { color:#666;}


/* -- plain page -----------------------------------*/
#logo-center  { position:absolute; width:276px; height:275px; top:33px; left:357px; z-index:10; background:url(../images/logo-Great-South-Bay-Brewery.png) no-repeat;}
#col-center   { width:980px; height:340px; margin:0px; padding:300px 0 0 0; background: url(../images/bay-backdrop-Rays.jpg) 225px 247px no-repeat; text-align:center;}
/*.indexTitle { padding:150px 0 0 404px; width:640px; float:left; display:inline;}*/
.indexTitle   { position:absolute; top:450px; left:402px; width:300px; height:40px;}


/* -- flip content -----------------------------------*/
#flipContent              { position:relative; margin:60px 0 0 0;}
#flipContent #image       { position:absolute; z-index:1; width:679px; height:304px; top:-219px; left:0; background-repeat:no-repeat;}
#flipContent .btn         { position:absolute; top:-105px; height:106px; width:100px; z-index:2; text-align:center;}
#flipContent .btn a       { float:left; width:66px; height:106px; background-repeat:no-repeat; background-position:0 0; position:absolute; bottom:0; left:16px;}
#flipContent .btn:hover a { background-position:0 -106px;}
#flipContent .copy        { position:relative; z-index:4; padding:20px 0 0 0;}


/* -- used on Brew page -----------------------------------*/
#bottleNav         { position:absolute; top:140px; left:-240px; width:240px; height:250px;}
#bottleNav a       { width:76px; height:250px; float:left; display:inline; background-position: 0 -278px; background-repeat:no-repeat;}
#bottleNav a:hover { background-position: 0 0; cursor:pointer;}

#sideFade .copy { background-repeat:no-repeat; padding-left:250px; min-height:400px;}

.table .left, .table .right {padding:3px 6px; margin:3px 0;}
.table .left { text-align:right; float:left; width:110px; border-right:1px solid white;}
.table .right { float:left; width:210px;}
.table { font-size:12px; line-height:13px; color:#492d10;}
.table .on { background:#fcb223;}




/* -- form pages -----------------------------------*/
.submit        { 
background:url(../images/btn-blueBack-carrot.png) -4px 0 no-repeat !important; padding:3px 8px 3px 25px !important; color:#FFFFFF; margin:3px 0 0 0;
 font-size:16px; float:left; border:1px solid #999999; height:31px}
 
.submit:hover  { background:url(../images/btn-blueBack-carrot.png) -4px -31px no-repeat !important; cursor:pointer;}
.form          {}
.form div.row      { width:400px;}
.form div p    { width:100px; float:left; text-align:right; padding:1px 10px 0 0;}
.form div span { width:200px; float:left; display:block;}
.form input, .form textarea, .fields input, .fields textarea { border:1px solid #999999; background:#FFF url(../images/form-back.png) repeat-x; padding:4px; margin:0;}
.form input    { width:180px;}
.form textarea { width:220px;}

.fields   { text-align:left; float:left; margin:20px 30px 0 0;}
.fields p { margin:0; padding:0;}
.fields input, .fields textarea { font-size:16px; color:#666666; width:100%;}


/* -- button -----------------------------------*/
.btn-main         { float:left;}
.btn-main a       { background:url(../images/btn-blueBack-carrot.png) -4px 0 no-repeat; padding:5px 15px 6px 30px; margin:3px 16px 0 0; color:#FFFFFF !important; font-size:14px !important; float:left; border:1px solid #999999; text-decoration:none;}
.btn-main a:hover { background:url(../images/btn-blueBack-carrot.png) -4px -31px no-repeat !important; cursor:pointer;}

/* -- events -----------------------------------*/

.eventLogo {
	margin-right: 10px;
	border: 1px solid #333333;
}

.AdminEventLogo {
	height: 100px;
	width: 100px;
	margin-right: 10px;
	border: 1px solid #333333;
}
#contentAdminLogin {
	width:800px;
	position:relative;
	background-color: #ffda99;
	top: 100px;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
}
.Login {
	position: relative;
	top: 20px;
	left: 20px;
}
table {
  border: 0px;
  cell-spacing: 0px;
  padding: 0px;
  margin: 0px;
  border-collapse: collapse;
}
td {
	padding: 3px;
}
td.tablehead {
  background-color: #212856;
  color: #ffffff;
  padding: 2px;
  border:none;
}

td.tablelight {
  background-color: #cccccc;
  color: #000000;
  padding: 2px;
}

td.tabledark {
  background-color: #999999;
  color: #000000;
  padding: 2px;
}

.messages {
  color: #FF0000;
}
.required {
  color: #FF0000;
}