@charset "utf-8";
/* CSS Document */

/* ------- TABLE OF CONTENTS ---------------

Project:       Milk and Honey Music
Version:       1.0
Last change:   09/15/08 finished content
Assigned to:   Jonathan Hoppes
Primary use:   Custom Website
 
1. Import Reset and Global Styles
2. Structure Style Declarations 
3. Typography Style Declarations

---------- END TABLE OF CONTENTS ----------*/

/* ---------->>> 1. Import <<<-----------*/

@import url("/css/reset.css"); /* import the forbin reset style sheet - browser default styles */
@import url("/css/global.css"); /* import the forbin global style sheet - contains common styles */

/* ---------->>> END Import <<<----------*/

/* ---------->>> 2. Structure <<<-----------*/
/* BODY */
body {background: url(../images/bg_bodyTop.jpg) repeat-x black; font-size:11px; color:#e2ecf2;
	  font-family:'Tahoma', Verdana, Arial, Helvetica, sans-serif; }
#bodyContainer {width:996px; float: left;}
/* leftcolumn - rightcolumn */
#leftColumn { width:316px; background:url(/images/bg_flashContent.jpg) no-repeat;}
#rightColumn { width:680px;}
#leftColumn, #rightColumn {float:left;}
/* HEADER */
#header {height:141px;}
#header h1 {height:141px; width:541px; background:url(/images/bg_branding.jpg); float:left; }
.mp3 {height:141px; width:455px; background:url(/images/bg_mp3Player.jpg); float:left;}
/* NAVIGATION */ 
ul#navigation {height:10px; margin: 0; list-style: none; background:url(/images/bg_nav.jpg); padding:15px 10px 10px 10px; font-weight:bold;}
ul#navigation li {font-size:11px; text-transform:uppercase; display:inline; margin-right:12px;}
ul#navigation li a {text-decoration:none; color:#e2dfe2;}
ul#navigation li a:hover {text-decoration:none; color:#ffffff;}
ul#navigation li a.orange {color:#ff8100;}
ul#navigation li a.orange:hover {color:#ff8100;} 
ul#navigation li.menuRight {margin-left:30px;}
/* CONTENT */
/* HOMEPAGE */
#mainGraphic {height:229px;}
.mG_Left, .mG_Right {float:left;}
.mG_Left {height:189px; width:181px; background:url(/images/bg_listenNOW.jpg); padding:40px 0 0 44px;}
a.listenNow  {background:url(/images/btn_listenNOW.jpg); height:117px; width:136px; display:block; text-indent:-9999px;}
.mG_Right {width:455px; height:229px; background:url(/images/bg_maingraphic.jpg) no-repeat; text-indent:-9999px;}
a.moreDetails {background:url(/images/btn_details.jpg); height:16px; width:119px; margin:153px 36px 0 0; float:right;}
a.moreDetails:hover  {background-position:0 -16px;}
#content {height:336px; width:680px; background:url(/images/bg_homeContent.jpg);}
/* Tour Events */
.tourEvents {width:220px; padding:15px 3px; float:left;}
.tourEvents h2 {background:url(/images/h2_tourdates.jpg); height:32px; width:205px; margin-bottom:24px;}
.date {font-family:'kroeger 0855'; font-size:8px; margin:0 0 7px 0; display:block;}
.tourEvents p, .tourEvents .date {margin-left:9px; margin-right:9px;}
.tourEvents p {border-bottom:1px dotted #696b6d; padding-bottom:15px; margin-bottom:14px;}
.tourEvents p.last {border-bottom:none;}
a.readMore {background:url(/images/btn_more.jpg); width:64px; height:19px; text-indent:-9999px; 
			display:block; margin-left:24px;}
a.readMore:hover {background:url(/images/btn_more.jpg) 0 -19px;}
/* Hot Events */
.hotEvent {width:220px; padding:15px 3px; float:left;}
.hotEvent h2 {background:url(/images/h2_hotevent.jpg); height:32px; width:205px; margin-bottom:24px;}
.hotEvent p, .hotEvent .date, .hotEvent img {margin-left:9px; margin-right:9px;}
.hotEvent p {border-bottom:1px dotted #696b6d; padding-bottom:15px; margin-bottom:14px;}
/* Multimedia */
.multimedia {width:178px; float:left; height:295px; background:url(../images/bg_multimedia.jpg); margin:14px 0 0 5px;
			 padding:5px 20px 20px 20px;}
.soundtrack {font-size: xx-small; float:left; color:#9ea7b0; margin-right:5px;}
ul.soundtracks {border-bottom:1px solid #464646; padding: 0 0 20px; color:#9ea7b0; list-style: none; margin: 0;}
ul.soundtracks li {border-bottom:1px dotted #696b6d; border-top:none; line-height:24px; font-size:10px;}
ul.videos { list-style: none; margin: 0; padding: 0; float: left; }
ul.videos li {border-bottom:1px dotted #696b6d; border-top:none; margin-top:10px; font-size: xx-small; color:#9ea7b0;}
ul.videos img { margin:10px 10px 10px 0;}
ul.videos h3 { margin-bottom:0;}
ul.videos li.last { border-bottom:none;}
/* Our band */
.ourband {width:220px; padding:15px 6px 16px 7px; float:left;}
.ourband h2 {background:url(/images/h2_ourband.jpg); height:32px; width:205px; margin-bottom:14px;}
.ourband p {margin-left:9px; margin-right:9px;}
.bandMember {font-size:12px;}
.ourband p {border-bottom:1px dotted #696b6d; padding:15px 5px;}
.ourband p.last { border-bottom:none;}
.ourband p:hover {background:url(/images/Untitled-1.png); cursor:pointer;}
.bio {width:220px; padding:15px 3px; float:left;}
.history {padding:15px 3px; margin-left:230px;}
.history p { line-height:21px; padding-bottom:15px;}
.bio h2, .history h2 {background:url(/images/h2_bio.jpg); height:32px; width:205px; margin-bottom:24px;}
.bio p {margin-left:9px; margin-right:9px;}
ul.bios { color:#9ea7b0;font-size:smaller; margin-bottom:20px;}
ul.bios li { line-height:20px; border-bottom:1px dotted #696b6d;}
ul.bios li .title { color:white;  font-weight:bold;}
ul.bios li.last { border-bottom:none;}
.bandmemberImage {float:left;}
.bandmemberImage img { float:right;}
/* Gallery */
.photogallery {padding:15px 7px 16px 7px; float:left; font-size: xx-small; color:#9ea7b0;}
.photogallery h2 {background:url(/images/h2_photogallery.jpg); height:32px; width:260px; margin-bottom:24px;display:inline; float:left;}
#gallery { list-style: none; margin: 0; padding: 0;}
#gallery li {float:left;  margin:10px; height:100px;}
#gallery img {border:1px solid #616163;}

/* lightbox Gallery */
#lightbox{position: absolute;left: 0;width: 100%;z-index: 100;text-align: center;line-height: 0;}
#lightbox a img{ border: none; }
#outerImageContainer{position: relative;background-color: #fff;width: 250px;height: 250px;margin: 0 auto;}
#imageContainer{padding: 10px;}
#loading{position: absolute;top: 40%;left: 0%;height: 25%;width: 100%;text-align: center;line-height: 0;}
#hoverNav{position: absolute;top: 0;left: 0;height: 100%;width: 100%;z-index: 10;}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{width: 49%;height: 100%;background: transparent url(../images/blank.gif) no-repeat;display: block;}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{font-size: 10px;background-color: #fff;margin: 0 auto;line-height: 1.4em;overflow: auto;width: 100%	}
#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; overflow: hidden; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
#overlay{position: absolute;top: 0;left: 0;z-index: 90;width: 100%;height: 500px;background-color: #000;}

/* TourPage */
.TourPage {padding:15px 6px 16px 7px; float:left; font-size: xx-small; color:#9ea7b0;}
.TourPage h2 {background:url(/images/h2_tourdatespage.jpg); height:32px; width:205px; margin-bottom:24px; display:inline; float:left;}
.date {font-family:'kroeger 0855'; font-size:8px; margin:0 0 7px 0; display:block;}
.TourPage p, .TourPage .date, .photogallery p, .photogallery .date {margin-left:9px; margin-right:9px;}
.TourPage p, .photogallery p {border-bottom:1px dotted #696b6d; padding-bottom:15px; margin-bottom:14px;}
.TourPage p.last {border-bottom:none;}
.calendarControl {float:right;}
/* Calendar */
ul.calendar {float:right; list-style: none; margin: 0; padding: 0; }
ul.calendar li {float:left; width:92px; height:92px; margin:1px; filter:alpha(opacity=30);-moz-opacity:0.3;-khtml-opacity: 0.3;opacity: 0.3; background-color:#f7f7f7; color:#000000;}
ul.calendar li a {display:block; width:12px; height:12px; color:#000000; text-decoration:none; padding:80px 0 0 80px; bottom:5px;}
ul.calendar li:hover {/*filter:alpha(opacity=40);-moz-opacity:0.4;-khtml-opacity: 0.4;opacity: 0.4;*/}
ul.calendar li.weekend {filter:alpha(opacity=20);-moz-opacity:0.2;-khtml-opacity: 0.2;opacity: 0.2;}
ul.calendar li.weekend:hover {/*filter:alpha(opacity=40);-moz-opacity:0.4;-khtml-opacity: 0.4;opacity: 0.4;*/}
ul.calendar li.tourEvent {background-color:#ff6816; filter:alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity: 0.6;opacity: 0.6;}
ul.calendar li.tourEvent:hover {/*filter:alpha(opacity=70);-moz-opacity:0.7;-khtml-opacity: 0.7;opacity: 0.7;*/}
ul.calendar li.bigEvent {background-color:#5b0000; filter:alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity: 0.6;opacity: 0.6;}
ul.calendar li.bigEvent:hover {/*filter:alpha(opacity=70);-moz-opacity:0.7;-khtml-opacity: 0.7;opacity: 0.7*/}
ul.calendar li.nil {/*filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity: 0;opacity: 0;*/ cursor:default;}
ul.calendar li.day { height:15px; background:none; color:white; text-align:center;}
.calendarKey { margin-top:5px; display:inline; float:left;}
.calendarKey img { margin:-3px 5px 0 15px;}
a.prevMonth, a.nextMonth {width:64px; height:19px; display:block; float:left; text-indent:-9999px;}
a.prevMonth {background:url(/images/calendarPrev.gif);}
a.nextMonth {background:url(/images/calendarNext.gif);}
a.prevMonth:hover, a.nextMonth:hover { background-position:0 -19px;}
.calendarDate { float:left; padding:0 10px; color:#99effc; font-size:12px; font-family:Arial, Helvetica, sans-serif;}
/* Multimedia */
.multi {padding-top:15px; padding-left:7px;}
.multi h2 {background:url(/images/h2_multi.jpg); height:32px; width:205px;}
.multi p {width:660px; float:left; padding:15px; line-height:21px;}
a.launch {display:block; text-indent:-9999px; background:url(/images/launch.png) 0 -13px; width:13px; height:13px;}
a.launch:hover {background-position: 0 0;}
/* Store */
.store {padding:15px 6px 16px 7px; float:left; }
.store p { margin-left:110px;}
#gallery .storeTable { height:70px;}
.storeTable {padding-top:20px; margin-bottom:10px;}
.storeTable img { margin-top:-20px; margin-bottom:10px;}
.store h2 {background:url(/images/h2_store.jpg); height:32px; width:205px; margin-bottom:24px;}
ul.storeItems li { float:left; margin:10px 0px 0px 70px; text-align:center;}
/* Contact Us */
.contact {width:220px; padding:15px 6px 16px 7px; float:left;}
.contact h2 {background:url(/images/h2_contact.jpg); height:32px; width:205px; margin-bottom:24px;}
/* Book Us */
.request {width:220px; padding:15px 6px 16px 7px; float:left;}
.request h2 {background:url(/images/h2_request.jpg); height:32px; width:205px; margin-bottom:24px;}

/* Advertisements - wedding - party - special occasion */
ul.ads {height:117px; margin: 0; padding-top:4px; background:url(/images/bg_ulads.jpg);}
ul.ads li {height:88px; width:226px; float:left; background-color:#FF9933; margin-right:1px;}
ul.ads li.last {margin-right:0px;}
/* Subpage */
#subcontent {min-height:735px; background:url(../images/bg_subcontent.jpg) no-repeat;}
/* FOOTER */
#footer {height:68px; float: left; width: 100%; background:url(../images/bg_footer.jpg) repeat-x; padding-top:10px; color:#674f5d; line-height:18px; clear:both;}

#footer img { margin-left: 40px; }
#footer span.floatRight { margin-right: 40px; }
#footer a:link, #footer a:visited, #footer a:active, #footer a:hover {color:#ff8100;}
/* ---------->>> END Structure <<<----------*/

/* ---------->>> 3. Typography <<<----------*/
/* COLORS */
.orange {color:#ff8100;}
.blue {color:#7faee4;}
.bblue {color:#99effc;}
/* HEADERS */
h2.contactFrom { background:url(../images/h2_contact.jpg); width:260px; height:32px; text-indent:-9999px; display:block;}
.smaller {font-size:smaller;}
h1, h2 {text-indent:-9999px;}
h3 {text-transform:uppercase; font-weight:bold; font-family:'Arial Narrow'; font-size:16px; margin-bottom:10px;}
/* TABLES */
/* FORMs */
#contact { }
#contactForm {}
label.desc{line-height:150%;padding:0 0 5px 0;border:none;color:#7faee4;display:block;font-size:95%;font-weight:bold;}
.label {clear:both; display:block; font-size:9px; margin-bottom:10px;}
table#contactForm td span { float:left; margin-right:10px;}
table#contactForm tr.odd {}
.errMessage{color:#FF0000; font-weight:bold;}
/* LINKS */
a:link {color:#ff8100;}
.sountrack_links { float:right; margin-top:5px; margin-bottom:2px; display:block;}
a.listen {background:url(../images/gx_listen.png) 0 -10px; width:10px; height:10px; text-indent:-9999px; display:block; float:left;}
a.download { background:url(../images/gx_download.png) 0 -10px;; width:11px; height:10px; text-indent:-9999px; display:block; float:left; margin:5px; visibility:hidden;}
a.listen:hover, a.download:hover { background-position:0 0;}
a .date {font-family:'kroeger 0855'; font-size:8px; margin:0 0 7px 0; display:block; text-decoration:none; color:white;}
/* ---------->>> END Typography <<<---------*/

.formoutput {
  font-size        : 11px;
  font-family      : Arial, Helvetica, sans-serif;
  color            : #444444;
  border           : 1px #666666 solid;
  background-color : #f5fafe;
  font-weight			 :  bold;
  padding-left		 : 5px;
	padding-right		 : 5px;
}

a:visited { color:#CC6600;}
