html {margin:0; padding:0; overflow:auto;}
body {margin:0; padding:0; color:#000; background:#FFF url(../images/hotback.jpg) repeat-x top; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
h1, h2, h3, h4 {color:#CC0000; font-family:Georgia, "Times New Roman", Times, serif; font-variant:small-caps; font-weight:normal; margin:0; margin-bottom:8px; padding:0;}
h1 {font-size:40px; letter-spacing:-1px;}
h2 {font-size:24px;}
h3 {color:#FFF; font-size:24px; margin-bottom:20px;}
h4 {color:#000; font-size:24px;}
p {line-height:22px; margin:0; padding:0;}
a {color:#CC0000; text-decoration:none;}
ul li {margin-left:25px; font-size:12px; margin-bottom:3px;}
.clear {clear:both;}
.footercontact {font-size:12px; color:#FFF; line-height:16px;}
.redletters {color:#CC0000 !important;}
.white {color:#FFF !important;}
.stafftitle {font-family:Georgia, "Times New Roman", Times, serif; font-size:38px; color:#CC0000; margin:0; padding-top:6px; line-height:34px !important;}
.contact {font-size:18px !important; color:#FFF !important; font-weight:bold;}
.videoinfo {line-height:16px;}
.description {margin-top:12px; padding:0;}
.nomargin {margin:0 !important;}
/*--------------------------------------
MAIN COMPONENTS
--------------------------------------*/
#header {width:100%; height:140px; background:#E0E1E4 url(../images/hothead.jpg) repeat-x top;}
#logoWrapper {position:relative; width:960px; height:auto; margin:0 auto;}
#navBar {width:100%; height:30px; background:url(../images/navBarback.png) repeat;}
#menuWrapper {width:960px; height:30px; margin:0 auto;}
#menu {width:100%; height:24px; padding-top:4px; padding-left:10px;}
#menu ul {margin:0; padding:0; list-style-type:none; text-indent:0;}
#menu li {margin:0; font-family:"Century Gothic", "Gill Sans MT", Arial, sans-serif; font-size:13px; color:#FFF; margin-left:6px; margin-right:22px; display:inline;}
#menu a {color: #CCC; padding:4px 0 5px 0;} #menu a:hover {color:#FFF;}
#menu a.welcomevid{color:#FF3300;}
#footer {width:100%; height:320px; background:#484848 url(../images/footershadow.jpg) repeat-x; border-top:solid #999 1px; padding:60px 0 20px 0; clear:both;}
#footer p {color:#CCC; font-size:12px;}
#footerWrapper {position:relative; width:960px; height:220px; margin:0 auto;}
.footerBox {float:left; width:200px; height:160px; padding:0 38px; border-right:solid #666 1px;}
.footernewsBox {float:left; width:220px; padding:0 0 0 38px; border:0;}
#footer ul {color:#FFF; margin:0; padding:0; font-size:12px;}
#footer a {color:#FF3333;} #footer a:hover {color:#FFF;}
.footerContact {float:left; text-align:right; width:940px; height:auto; margin-top:80px; clear:both;}
.copyright {color:#999; font-size:10px !important;}
#mainContainer1, #mainContainer2, #mainContainer3, #mainContainer4 {float:left; width:184px; height:479px; margin-right:3px; background-position:top;}
#mainContainer1 {background:url(../images/dance.png) left; width:300px;} #mainContainer1:hover {background-position:-300px -21px;}
#mainContainer2 {background:url(../images/sing.png) left;} #mainContainer2:hover {background-position:-185px 0px;}
#mainContainer3 {background:url(../images/act.png) left; margin-right:2px;} #mainContainer3:hover {background-position:-183px 0px;}
#mainContainer4 {float:right; height:520px; width:240px; padding:0 15px;} #mainContainer4 p {line-height:18px;}
#sideContainers {width:100%; height:auto; margin:10px 0 50px 0; z-index:900;}
#mainContainer4 img {margin-bottom:6px;}
#mainBody {position:relative; background:url(../images/footerback.png) repeat; width:960px; height:auto; margin:0 auto;}
#pageTitle {float:left; width:900px; margin:30px; padding:20px 0; display:inline;}
#mainContent {float:left; width:600px; height:auto; margin-bottom:40px; padding:0 30px;}
#leftBody {float:left; width:500px; height:auto; margin-bottom:40px; padding:0 34px 0 30px; border-right:solid #CCC 1px;}
#rightBody {float:left; height:auto; width:300px; padding:0 15px 0 40px;}
/*--------------------------------------
OTHER
--------------------------------------*/
#lessonLinks {margin:0; padding:0 10px;}
#lessonLinks ul {float:left; margin:0; padding:0;}
#lessonLinks li {list-style-type:none; text-indent:0; margin:0; padding:0; color:#000; font-size:16px; font-weight:bold; width:160px; border-bottom:solid #CCC 1px;}
#lessonLinks a {display:block; color:#000; padding:4px; font-size:16px; font-weight:bold;} #lessonLinks a:hover {background-color:#EEE;}
#lessonLinks .staff a {font-size:12px; font-weight:normal; border:none;} #lessonLinks .staff a:hover {background-color:none;}
#cIcons {float:left; height:32px; width:32px; margin-right:10px;}
#sblogright {float:right; width:120px; height:auto;}
#sblogleft {float:left; width:168px; height:auto;}
/* FORM ELEMENTS */
span {color: red;}
form label {font-family:Georgia, "Times New Roman", Times, serif;}
form label.error {color:#CC0000; font-family: Georgia; font-weight: normal; font-size: 12px; display: block;}
div.contact-form-element {padding: 0 0 8px 0; margin-bottom:8px; margin-left:30px; width:240px;}
form div.contact-form-element label {font: bold;}
label#remove-details {font-size: 12px;}
form div.contact-form-element input {font-size: 14px; height:25px; width:194px; margin-top:4px; padding:4px 0 0 4px; border:solid #CCC 1px;} div.contact-form-element input:focus {border:solid #CC0000 1px;}
textarea#message {padding:4px; width:400px; height:100px; margin-top:4px; border:solid #CCC 1px;} textarea#message:focus {border:solid #CC0000 1px;}
div textarea {font-size:12px;}
input.send-button {font-size:14px; text-align:center; color:#FFF; margin-left:30px; background:#CC0000; border:solid #CCC 1px; padding:5px;} input.send-button:hover {background:#FF0000;}
input.reset-button {font:14px; text-align:center; background:#CCC; border:solid #CCC 1px; padding:5px;} input.reset-button:hover {background: #FFF;}
.success {font-weight: bolder; color: green;}
p.error {font-weight: bold; color:#CC0000;}
select#reason{font-size:14px; width:auto; height:25px; margin-top:4px; padding:2px; font-weight:normal; border:solid #999 1px;}
select#select{font-size:30px; width:auto; height:40px; margin-top:4px; padding:2px; font-weight:normal; border:solid #999 1px;}
input#signname {margin-left:11px;} input#signpass {margin-left:4px;} input#sendlist {margin-left:55px;}
/* MAIN IMAGES */
#studiopics {position:absolute; top:0px; left:414px; height:372px; width:578px; background:url(../images/hotstudiopics.png) no-repeat}
#dancepics {position:absolute; top:-360px; left:-33px; height:363px; width:1049px; background:url(../images/dancepics.png) no-repeat;}
#singerpics {position:absolute; background:url(../images/singerspics.png) no-repeat; height:399px; width:338px; left: 628px; top: -460px;}
#actingpics {position:absolute; background:url(../images/actingpics.png) no-repeat; width:578px; height:299px; left: 189px; top:-360px;}
#hottickets {
position:absolute;
left:687px;
top:1px;
z-index:9;
width: 197px;
height: 114px;
}
#hotshowcase {position:absolute; left:780px; top:-8px; z-index:8;}
#staffblog {position:absolute; left:660px; top:-8px; z-index:10;}
#shoes {position:absolute; left:638px; width:370px; height:322px; background:url(../images/danceshoes.png) no-repeat; top: 454px; z-index:5;}
#voice {position:absolute; top:886px; left:661px; height:83px; width:83px; background:url(../images/pitchpipe.png) no-repeat; z-index:4;}
#music {position:absolute; top:635px; left:651px; height:406px; width:347px; background:url(../images/sheetmusic.png) no-repeat; z-index:3;}
.instrumentpics {position:absolute; top:20px; left:540px; height:197px; width:382px; background:url(../images/instrument.png);"}
/* INSTRUCTORS PAGE */
#headshot {float:left; margin-right:20px; height:210px; width:189px;}
#bioWrapper {padding:20px; width:460px; height:500px; overflow-x:hidden;}
#bioWrapper p {line-height:18px;}
#bioWrapper h4 {line-height:24px;}
.stafflinks a {padding:5px 5px 5px 0 !important;}
/* VIDEO */
#videoDiv {float:left; width:250px; height:240px;}
/* HOTTV */
#hottv {float:left; padding:35px; padding-top:130px; width:400px; margin-top:60px; text-align:center;} #hottv p {font-size:11px; color:#666;}
/* SHOWCASE */
.category {font-size:28px; color:#CC0000}
.showcaseinfo {width:900px; height:auto; padding:20px 30px; clear:both;}
.spotlightPic {float:left; height:auto; width:auto; margin:0 16px 10px 0 !important; padding:2px; border:solid #CCC 1px; background-color:#FFF;}
.previewBox {float:left; clear:both; margin-bottom:5px;}
.previewBox img {float:left; margin-right:8px;}
.photo-h {height:auto; width:360px; float:left; padding:5px; margin-right:40px; margin-bottom:10px; border:solid #CCC 1px; background-color:#FFF; display:inline; overflow:hidden;}
.photo-v {height:auto; width:auto; float:left; padding:5px; margin-left:25px; margin-bottom:10px; border:solid #CCC 1px; background-color:#FFF; display:inline; overflow:hidden;}
.studentheader {text-align:center; border-bottom:dashed #CCC 1px;}
.sidebox {float:left; width:350px; height:auto; padding:10px; margin-top:30px;}
.gallerybox {margin-top:10px !important; border:solid #FFF 1px;}
.gallerybox h2 {margin-bottom:20px;}
.galleryphoto {float:left; display:inline; margin-right:8px; height:auto; width:auto; overflow:hidden;}