@charset "UTF-8";
/* CSS Document */

/*----- BODY & OUTER WRAPPER -----*/
html {
font: small Verdana, Geneva, Helvetica, Arial, sans-serif;
}

body {
margin: 0;
padding: 0;
}

#wrapper {
text-align: left;
width: 780px;
margin-left: auto;
margin-right: auto;
background-color: #ffffff;
color:#5b1400;
padding: 10px;
}

.italic {
	margin: 0;
	font-size: 96%;
	line-height: 145%;
	font-style: italic;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-align: justify;
}

/*----- HEADER -----*/
#header {
margin: 0 9px 40px 10px;
padding: 0;
}

/* spry menu */
/* tried to adjust the menu's centering, but no success.
the other css link for the spry menu probably has more control options*/
#navMenu {
margin-top: 10px;
padding-bottom: 8px;
/*width: 780px;*/
margin-left: auto;
margin-right: auto;
}
/* end spry menu */


div.addthis_toolbox.addthis_default_style {
	position:relative;
	margin-top:-20px;
	margin-left:28px;
	padding-bottom:6px;
}

/*----- MAIN CONTENT -----*/
#main {
position: relative;
margin: 0 9px 20px 10px;
}

#main h1 {
font-size:12px;
font-weight: 600;
}

#main a {
color: #5b1400;
text-decoration: none;
}

/*---------------------- begin column 3 far right column --------------------*/
#column3 {
float: right;
width: 280px;
height: 366px;
border: 0;
background-color: #ffffff;
margin: 0 0 10px 0;
}
/* begin upcoming events bkt */
#upcoming_events_bkt {
/*background-color:#FFFFFF; */
width: 280px;
height: 366px;
margin: 0 0 10px 0; 
/* padding: 0; */
}

/* this makes the top part of upcoming evetns bucket (only) have one round corner*/
#headerUpcomingEventsRoundedCorner {
background-image: url(http://www.mobudancestudio.com/home/graphics/bucket_tr_corner280x30.gif);
background-repeat: no-repeat;
background-color:#ffffff;
margin: 0;
padding: 0;
}

#upcoming_events_bkt h1{
letter-spacing: 1px; /*provides tracking for the heaer*/
width: 280px;
height: 30px;
margin: 0 0 -6px 0;
padding: 6px 0 0 15px;
}

.upcomingEventsSubHead a:hover {
border-bottom: 1px #5b1400 solid;
}

#upcomingEventsCopy {
font-size: 100%;
line-height: 1.4em;
margin: 0px 5px 0 15px;
padding: 0;
/* padding: 10px 5px 0 10px; */
}

.upcomingEventsSubHead {
font-size: 106%;
line-height: 1.5em;
font-weight:600;
}

.upcomingEventsCTA {
font-size: 95%;
line-height: 1.5em;
color: #eb6e1f;
text-decoration: underline;
}

#upcoming_events_bg {
background-image: 
url(http://www.mobudancestudio.com/home/graphics/upcoming_events_bg300x350.jpg);
background-repeat: no-repeat;
border-style: solid;
border-color: #dcddde;
border-width: 1px;
width: 278px; /* 2 pixels less than total width for buck to take in consideration
1 px borders on each side */
height: 336px;
position:relative; /*allows for 'more info' button to be positioned absolute*/
}

#upcoming_events_bg .btnUpcomingEventsMoreInfo {
position:absolute; /*positioned in context of 'dancesteem_bg' id, which is set to absolute*/
top: 313px; /*from the top of 'dancesteem_bg */
right: 8px; /*from the right of 'dancesteem_bg */
}

/* upcoming events "more info" button rollover using one image*/
.btnUpcomingEventsMoreInfo {
width: 68px;
height: 18px;
text-decoration:none;
background-repeat:no-repeat;
background-image:url(http://www.mobudancestudio.com/home/graphics/more_info_btn.gif);
float: right;
/*margin: 27px 10px 10px 0;*/
padding: 0;
}
.btnUpcomingEventsMoreInfo:hover {
background-position: 0 -20px;
}

/*--------------------------------------------*/
/* end upcoming events bkt */

/*-------- column 1 / bucket 1 and 2 on left side of main content area -------*/

#column1 {
float:left;
width: 240px; /* extra 20px for left/right margin */
}

#main p {
font-size: 92%;
line-height: 1.4em;
margin: 0px 5px 0 0;
padding: 10px 5px 0 0;
}

/* this colors every other word in the h1 heading to mobu orange */
.orangetxt {
color: #eb6e1f;
}

/* this orients the images to left so that copy wraps to the right */
.bucketImages {
float: left;
margin: 10px 10px 0 15px;
}

/* this makes the top part of each bucket have one round corner*/
#header_roundedcorner {
background-image: url(http://www.mobudancestudio.com/home/graphics/bucket_tr_corner220x30.gif);
background-repeat: no-repeat;
background-color:#FFFFFF;
margin: 0;
padding: 0;
}

/* begin dancesteem bkt */
#dancesteem_bkt {
/*background-color:#FFFFFF; */
width: 220px;
height: 178px;
margin: 0 0 10px 0; 
/* padding: 0; */
}

#dancesteem_bkt h1{
letter-spacing: 1px; /*provides tracking for the heaer*/
width: 220px;
height: 30px;
margin: 0 0 -6px 0;
padding: 6px 0 0 15px;
}

#dancesteem_bg {
background-image: 
url(http://www.mobudancestudio.com/home/graphics/dancesteem_bucket_bg250x200.jpg);
background-repeat: no-repeat;
border-style: solid;
border-color: #DCDDDE;
border-width: 1px;
width: 218px;
height: 148px;
padding: 0px;
margin: 0px;
position:relative; /*allows for 'more info' button to be positioned absolute*/
}

#dancesteem_bg .btnDancesteemMoreInfo {
position:absolute; /*positioned in context of 'dancesteem_bg' id, which is set to absolute*/
top: 125px; /*from the top of 'dancesteem_bg */
right: 8px; /*from the right of 'dancesteem_bg */
}

/* to make the button rollover using one image*/
.btnDancesteemMoreInfo {
width: 68px;
height: 18px;
text-decoration:none;
background-repeat:no-repeat;
background-image:url(http://www.mobudancestudio.com/home/graphics/more_info_btn.gif);
float: right;
/*margin: 30px 10px 10px 0;*/
padding: 0;
}
.btnDancesteemMoreInfo:hover {
background-position: 0 -20px;
}


/*--------------------------------------------*/
/* end dancesteem bucket */

/* begin studio rental bkt */
#studiorental_bkt {
/*background-color:#FFFFFF; */
width: 220px;
height: 178px;
margin: 0 0 10px 0;
background-color: #e8f4e5; 
/* padding: 0; */
}

#studiorental_bkt h1{
letter-spacing: 1px; /*provides tracking for the heaer*/
width: 220px;
height: 30px;
margin: 0 0 -6px 0;
padding: 6px 0 0 15px;
}

#studiorental_bg {
background-color: #e8f4e5;
border-style: solid;
border-color: #DCDDDE;
border-width: 1px;
width: 218px;
height: 148px;
padding: 0px;
margin: 0px;
position:relative; /*allows for 'more info' button to be positioned absolute*/
}

#studiorental_bg .btnStudioRentalMoreInfo {
position:absolute; /*positioned in context of 'dancesteem_bg' id, which is set to absolute*/
top: 125px; /*from the top of 'dancesteem_bg */
right: 8px; /*from the right of 'dancesteem_bg */
}

/* to make the studio rental "more info" button rollover using one image*/
.btnStudioRentalMoreInfo {
width: 68px;
height: 18px;
text-decoration:none;
background-repeat:no-repeat;
background-image:url(http://www.mobudancestudio.com/home/graphics/more_info_btn.gif);
float: right;
/*margin: 30px 10px 10px 0;*/
padding: 0;
}
.btnStudioRentalMoreInfo:hover {
background-position: 0 -20px;
}
/*--------------------------------------------*/
/* end studio rental bkt */

#content-wrapper {
margin: 0 280px 0 240px; /* this sets the middle column's left and right margins so
that column 1 (left) and 2 (right) buckets have space */ 
}

/* begin column 2 */
#column2 {
width: 240px; /* extra 20px for left/right margin */
}

/* begin mobu dance studio bkt */
#mobudancegroup_bkt {
/*background-color:#FFFFFF; */
width: 220px;
height: 178px;
margin: 0 0 10px 0; 
/* padding: 0; */
}

#mobudancegroup_bkt h1{
letter-spacing: 1px; /*provides tracking for the heaer*/
width: 220px;
height: 30px;
margin: 0 0 -6px 0;
padding: 6px 0 0 15px;
}

#mobudancegroup_bg {
background-image: 
url(http://www.mobudancestudio.com/home/graphics/mobu_dance_group_bg250x200.gif);
background-repeat: no-repeat;
border-style: solid;
border-color: #DCDDDE;
border-width: 1px;
width: 218px;
height: 148px;
padding: 0px;
margin: 0px;
position:relative; /*allows for 'more info' button to be positioned absolute*/
}

#mobudancegroup_bg .btnMobudancegroupMoreInfo {
position:absolute; /*positioned in context of 'dancesteem_bg' id, which is set to absolute*/
top: 125px; /*from the top of 'dancesteem_bg */
right: 8px; /*from the right of 'dancesteem_bg */
}

/* to make the mobu dance group "more info" button rollover using one image*/
.btnMobudancegroupMoreInfo {
width: 68px;
height: 18px;
text-decoration:none;
background-repeat:no-repeat;
background-image:url(http://www.mobudancestudio.com/home/graphics/more_info_btn.gif);
float: right;
/*margin: 48px 10px 10px 0;*/
padding: 0;
}
.btnMobudancegroupMoreInfo:hover {
background-position: 0 -20px;
}
/*--------------------------------------------*/
/* end Mobu Dance Group bkt */

/* begin classes open to the public bkt */
#classesPublic_bkt {
/*background-color:#FFFFFF; */
width: 220px;
height: 178px;
margin: 0 0 10px 0; 
/* padding: 0; */
}

#classesPublic_bkt h1{
letter-spacing: 1px; /*provides tracking for the heaer*/
width: 220px;
height: 30px;
margin: 0 0 -6px 0;
padding: 6px 0 0 15px;
}

#classesPublic_bg {
background-image: 
url(http://www.mobudancestudio.com/home/graphics/classes_public_bg250x300.gif);
background-repeat: no-repeat;
border-style: solid;
border-color: #DCDDDE;
border-width: 1px;
width: 218px;
height: 148px;
padding: 0px;
margin: 0px;
position:relative; /*allows for 'more info' button to be positioned absolute*/
}

#classesPublic_bg .btnclassesPublicMoreInfo {
position:absolute; /*positioned in context of 'dancesteem_bg' id, which is set to absolute*/
top: 125px; /*from the top of 'dancesteem_bg */
right: 8px; /*from the right of 'dancesteem_bg */
}

/* public classes "more info" button rollover using one image*/
.btnclassesPublicMoreInfo {
width: 68px;
height: 18px;
text-decoration:none;
background-repeat:no-repeat;
background-image:url(http://www.mobudancestudio.com/home/graphics/more_info_btn.gif);
float: right;
padding: 0;
}
.btnclassesPublicMoreInfo:hover {
background-position: 0 -20px;
}
/*--------------------------------------------*/
/* end studio rental bkt */


/*----- FOOTER -----*/
#footer {
clear: both;
width: 780px;
margin: 0 0 0 20px;
font-size: 75%;
}

#footer a {
color: #5b1400;
}

.footerGraphic {
padding: 0;
margin: 0;
}

.footerCopyLeft {
float: left;
padding-left: 6px;
/*margin-left: 20px;*/
}

.footerCopyRight {
text-align: right;
padding-right: 46px;
/*margin-right: 20px;*/
}