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

/* ============================================ HIRE INFORMATION BAR */
#infoBar{
width:798px;
height:80px;
background-color:rgba(255,255,255,0.5);
border:#d9d9d9 1px dashed;
position:relative;
top:0;
left:0;
margin:5px auto;
}

#info, #hint, #option1, #option2, #option3, #option4, #option5, #option6{
width:100px;
height:80px;	
cursor:pointer;
display:inline-block;
overflow:hidden;
font-size:18px;
position:absolute;
top:0
}

/* INFO TAB */
#info{
background:url(../images/hire-services/icon-sheet.png) -100px 0 no-repeat;
width:100px;
height:80px;
top:0px;
left:5px
}

#info:hover, #info.selected{
background-position:-100px -80px;
height:80px;
top:0px;
}

/* HINT TAB */
#hint{
cursor:default;
background:url(../images/icons/icon-Global.png) -130px -55px no-repeat;
width:130px;
height:55px;
top:-20px;
left:100px
}

/* OPTION 1 - PERFORMANCE */
#option1{
background:url(../images/hire-services/icon-sheet.png) -200px 0 no-repeat;
left:200px
}

#option1:hover, #option1.selected{
background-position:-200px -80px;
}

/* OPTION 2 - PERFORMANCE AND MINI LESSON */
#option2{
background:url(../images/hire-services/icon-sheet.png) -300px 0 no-repeat;
left:300px
}

#option2:hover, #option2.selected{
background-position:-300px -80px;
}

/* OPTION 3 - PARTIES */
#option3{
background:url(../images/hire-services/icon-sheet.png) -400px 0 no-repeat;
left:400px
}

#option3:hover, #option3.selected{
background-position:-400px -80px;
}

/* OPTION 4 - DANCE/FITNESS INSTRUCTOR */
#option4{
background:url(../images/hire-services/icon-sheet.png) -500px 0 no-repeat;
left:500px
}

#option4:hover, #option4.selected{
background-position:-500px -80px;
}

/* OPTION 5 - PR AND MEDIA */
#option5{
background:url(../images/hire-services/icon-sheet.png) -600px 0 no-repeat;
left:600px
}

#option5:hover, #option5.selected{
background-position:-600px -80px;
}

/* OPTION 6 - PHILANTHROPY */
#option6{
background:url(../images/hire-services/icon-sheet.png) -700px 0 no-repeat;
left:700px
}

#option6:hover, #option6.selected{
background-position:-700px -80px;
}


/* ============================================ AREA THAT HOLDS CHANGING CONTENT */
#optionDisplay{
width:960px;
height:500px; 
position:relative; 
top:0; 
left:-80px; 
overflow:hidden;
margin:0 auto;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}

#optionDisplay.option-selected{
min-height:1000px
}


/* ============================================ SWITCHABLE CONTENT */
#info-content, #hire1, #hire2, #hire3, #hire4, #hire5, #hire6{
width:798px;
position:absolute;
top:0;
right:-3333px
}

/* INFO */
.hireDescription{
width:778px;
padding:10px
}

.hireDescription h1{font-size:1.4em}

.hireDescription p{
font-size:15px;	
text-align:justify;
margin:12px 0
}

.hireDescription p.slogan{
font-family:Georgia, "Times New Roman", Times, serif;
font-size:22px;
font-style:italic;
color:#b90068;
text-align:right;
margin:18px 0
}

#hireIntro p{
font-size:12px;
font-style:italic;
font-weight:bold;
text-align:right;
margin:30px 0px
}