html, body { height: 100%; } 

body { margin: 0px; padding: 0px; background: #f7f7f7; font-family: arial, helvetica, verdana; color: #5f5f5f; } 

a { color: #003768; text-decoration: none; }
a:hover { color: #335c7c; text-decoration: underline; } 

#container { float: left; width: 100%; min-height: 100%; margin-bottom: -201px; } 
.push { float: left; width: 100%; height: 201px; } 

.container { margin: 0px auto; width: 1190px; } 
#header { float: left; width: 100%; height: 134px; background: url("../images/top-bg.png"); } 
#header .top-row { float: left; width: inherit; height: 64px; } 
#header .main-row { float: left; width: inherit; height: 54px; margin-top: 0px; } 

#footer { float: left; width: 100%; height: 201px; background: url("../images/footer-bg.jpg") } 
#footer .footer-content { margin: 0px auto; width: 1190px; } 
#footer .footer-content .footer-nav { float: left; margin-top: 90px; }
#footer .footer-content .footer-nav a { float: left; margin-right: 20px; font-size: 18px; color: #FFF;} 
#footer .footer-content .social-nav { float: right; margin-top: 90px; font-size: 18px; color: #FFF; } 
#footer .footer-content .copy { float: left; width: 1190px; font-size: 11px; color: #000; margin-top: 5px; } 
#footer .footer-content .copy span, #footer .footer-content .copy a { color: #000; margin-right: 20px; }

#user-info { float: left; font-size: 15px; padding-top: 5px; margin-left: 2px; } 
#user-info span, #user-info a { float: left; margin-right: 20px; color: #c6c6c6; } 
#user-info a.noright { margin-right: 3px; }
#user-info a.edit { text-transform: none; }
#user-info img { float: left; margin-top: 5px; } 
#user-info span { text-transform: uppercase; }
#user-info .alert-msg { float: left; }





#alert-msg { position: absolute; display: none; background: url("../images/overlay.png"); padding: 5px; margin-top: 12px; color: #FFF; font-size: 12px; width: 250px; }

#alert-msg .alert-item { float: left; width: 250px; margin: 0px; margin-bottom: 5px; border-bottom: 1px dashed #c6c6c6; padding-bottom: 5px; }
#alert-msg .alert-item2 { border: 0px; padding-bottom: 0px; }
#alert-msg .alert-item img { float: left; margin: 0px; width: 50px; }
#alert-msg .alert-item span { float: right; text-transform: none; width: 190px; margin: 0px; padding: 0px; }
#alert-msg .alert-item a { margin: 0px; color: #FFF; }
#alert-msg .alert-item i { color: #c6c6c6; }


#site-search { float: right; background: #ffe88e; margin-right: 15px; padding-top: 2px; }

#site-search .search-form { width: 231px; height: 39px; padding: 0px 0px 0px 0px; background: url("../images/search-bg.png"); background-repeat: no-repeat; background-position: center right; }
#site-search .search-form input.search { float: left; margin: 5px 0px 0px 18px; width: 158px; padding-left: 5px; line-height: 23px; border: 0px; background: none; }
#site-search .search-form img { float: right; margin-right: 2px; }


#logo { float: left; } 

div.button .left { float: left; width: 10px; height: 33px; background: url("../images/btn/btn-left-bg.png"); }
div.button a { float: left; height: 33px; line-height: 25px; background: url("../images/btn/btn-bg.png"); color: #808080; text-decoration: none; }
div.button .right { float: left; width: 10px; height: 33px; background: url("../images/btn/btn-right-bg.png"); }

div.button2 .left { float: left; width: 10px; height: 31px; background: url("../images/btn/btn-left-bg2.png"); }
div.button2 a { float: left; height: 31px; line-height: 25px; background: url("../images/btn/btn-bg2.png"); color: #808080; text-decoration: none; }
div.button2 .right { float: left; width: 10px; height: 31px; background: url("../images/btn/btn-right-bg2.png"); }

div.gbutton .left { float: left; width: 10px; height: 40px; background: url("../images/grad-btn/grad-btn-left-bg.png"); }
div.gbutton a { float: left; height: 40px; line-height: 37px; background: url("../images/grad-btn/grad-btn-bg.png"); color: #003768; font-size: 18px; text-decoration: none; }
div.gbutton span { float: left; height: 40px; line-height: 37px; background: url("../images/grad-btn/grad-btn-bg.png"); color: #999; font-size: 18px; text-decoration: none; }
div.gbutton .right { float: left; width: 10px; height: 40px; background: url("../images/grad-btn/grad-btn-right-bg.png"); }

div.gbutton2 .left { float: left; width: 9px; height: 34px; background: url("../images/grad-btn/grad-btn-left-bg2.png"); }
div.gbutton2 a { float: left; height: 34px; line-height: 31px; background: url("../images/grad-btn/grad-btn-bg2.png"); color: #003768; font-size: 18px; text-decoration: none; }
div.gbutton2 .right { float: left; width: 9px; height: 34px; background: url("../images/grad-btn/grad-btn-right-bg2.png"); }

div.bgbutton .left { float: left; width: 10px; height: 41px; background: url("../images/grad-btn/bgrad-btn-left-bg.png"); }
div.bgbutton a { float: left; height: 41px; line-height: 37px; background: url("../images/grad-btn/bgrad-btn-bg.png"); color: #FFF; font-size: 18px; text-decoration: none; }
div.bgbutton .right { float: left; width: 10px; height: 41px; background: url("../images/grad-btn/bgrad-btn-right-bg.png"); }

/* Main Navigation Styles */
#main-nav { float: right; margin-top: 15px; } 
#main-nav .nav-item { float: left; margin-right: 0px; } 
#main-nav .nav-item a { float: left; }
#main-nav .nav-item strong { display: none; } 

a#homeroom { width: 130px; height: 54px; background: url("../images/nav/homeroom.png"); } 
a#homeroom:hover { width: 130px; height: 54px; background: url("../images/nav/homeroom-over.png"); } 
a#homeroom-on { width: 130px; height: 54px; background: url("../images/nav/homeroom-on.png"); } 

a#gallery { width: 99px; height: 54px; background: url("../images/nav/gallery.png"); }
a#gallery:hover { width: 99px; height: 54px; background: url("../images/nav/gallery-over.png"); }
a#gallery-on { width: 99px; height: 54px; background: url("../images/nav/gallery-on.png"); }

a#classroom { width: 122px; height: 54px; background: url("../images/nav/classroom.png"); }
a#classroom:hover { width: 122px; height: 54px; background: url("../images/nav/classroom-over.png"); }
a#classroom-on { width: 122px; height: 54px; background: url("../images/nav/classroom-on.png"); }

a#forums { width: 97px; height: 54px; background: url("../images/nav/forums.png"); }
a#forums:hover { width: 97px; height: 54px; background: url("../images/nav/forums-over.png"); }
a#forums-on { width: 97px; height: 54px; background: url("../images/nav/forums-on.png"); }

a#chat { width: 73px; height: 54px; background: url("../images/nav/chat.png"); }
a#chat:hover { width: 73px; height: 54px; background: url("../images/nav/chat-over.png"); }
a#chat-on { width: 73px; height: 54px; background: url("../images/nav/chat-on.png"); }

a#clubs { width: 81px; height: 54px; background: url("../images/nav/clubs.png"); }
a#clubs:hover { width: 81px; height: 54px; background: url("../images/nav/clubs-over.png"); }
a#clubs-on { width: 81px; height: 54px; background: url("../images/nav/clubs-on.png"); }

a#students { width: 116px; height: 54px; background: url("../images/nav/students.png"); }
a#students:hover { width: 116px; height: 54px; background: url("../images/nav/students-over.png"); }
a#students-on { width: 116px; height: 54px; background: url("../images/nav/students-on.png"); }

a#store { width: 78px; height: 54px; background: url("../images/nav/store.png"); } 
/*  End Main Navigation Styles */

a.stars { float: left; width: 18px; height: 18px; background: url("../images/stars.png"); background-position: left; }
a.stars:hover { background: url("../images/stars.png"); background-position: right; } 
a.stars-on { float: left; width: 18px; height: 18px; background: url("../images/stars.png"); background-position: right; } 

a.stars2 { background: url("../images/stars.png"); background-position: left; background-repeat: no-repeat; }
a.stars2:hover { background: url("../images/stars.png"); background-position: right; } 
a.stars2-on { background: url("../images/stars.png"); background-position: right; background-repeat: no-repeat; } 



#main-content { float: left; width: 100%; margin-top: 20px; margin-bottom: 40px; } 
.form-row { float: left; width: inherit; margin-bottom: 10px; }
.form-row2 { margin-bottom: 0px; }
.form-row .label { float: left; width: 33%; }
.form-row .field { float: left; width: 66%; }
.form-row input.txt { float: left; width: 98%; border: 1px solid #999; padding: 2px; } 
.error { color: #F00; font-size: 12px; }

/* Login Box */ 
#login-box { float: left; margin: 30px 0px 0px 390px; border: 1px solid #CCC; width: 350px; font-size: 16px; background: #FFF; padding: 20px; -moz-border-radius: 10px; -webkit-border-radius: 10px;  } 
#login-box .form-row .label { float: left; width: inherit; }
#login-box .form-row .field { float: left; width: inherit; } 
/* End Login Box */

/* Overlay Styles for dialog boxes */

#overlay { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background: url("../images/overlay-white.png"); display: none; z-index: 50; }
#overlay2 { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background: url("../images/overlay.png"); display: none; z-index: 50; }
#overlay-white { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background: url("../images/overlay-white.png"); display: none; z-index: 50; } 

.overlay-panel { position: fixed; top: 50%; left: 50%; z-index: 51; display: none; width: 410px; height: 300px; margin-left: -225px; margin-top: -150px; -moz-box-shadow: 0px 0px 10px #666; -webkit-box-shadow: 0px 0px 10px #666; box-shadow: 0px 0px 10px #666; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666666')"; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666666'); } 
.overlay-panel .hdr { float: left; width: inherit;  height: 37px; background: url("../images/overlay/hdr-bg.png"); line-height: 34px; font-size: 24px; font-weight: bold; color: #003768; } 
.overlay-panel .hdr span { float: left; margin-left: 10px; }
.overlay-panel .panel-content { float: left; width: inherit; border: 0px solid; background: #FFF; } 
.overlay-panel .panel-content2 { margin-top: -19px; }
.overlay-panel .field { float: left; width: inherit; font-size: 14px; color: #000; margin-top: 10px; line-height: 20px; margin-left: 10px; }
.overlay-panel .center { text-align: center; margin-left: 0px; }
.overlay-panel .field .button { float: left; }
.overlay-panel .field input.txt { width: 90%; border: 1px solid #CCC;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; color: #666; }
.overlay-panel .field input.txt_sm { width: 40%; border: 1px solid #CCC;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; color: #666; }
.overlay-panel .field select { border: 1px solid #CCC;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; }
.overlay-panel .field select.txt { width: 95%; } 
.overlay-panel .field textarea { width: 95%; height: 200px; border: 1px solid #CCC;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; } 
.overlay-panel .field textarea.msg { width: 90%; height: 225px; border: 1px solid #CCC;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; } 
.overlay-panel .field textarea.twitter { width: 94%; height: 100px; font-size: 17px; border: 1px solid #CCC;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; } 
.overlay-panel .field textarea#video_description { height: 75px; } 
.overlay-panel .field input.btn { border: 1px solid #CCC; background: #DDD;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; font-size: 14px; } 
.overlay-panel .field2 { margin-bottom: 15px; } 
.overlay-panel .field3 { margin-top: -10px; margin-bottom: 5px;  } 
.overlay-panel .field4 { margin-top: 10px; margin-bottom: 5px;  } 

.overlay-panel2 { position: fixed; top: 50%; left: 50%; z-index: 51; padding: 20px; border: 1px solid #FFF;  -moz-border-radius: 5px; -webkit-border-radius: 5px; background: #FFF; display: none; width: 410px; height: 300px; margin-left: -225px; margin-top: -150px; }
.overlay-panel2 .hdr { float: left; width: inherit; font-size: 20px; font-weight: bold; color: #adadad; margin-bottom: 10px; }
.overlay-panel2 .field { float: left; width: 100%; font-size: 14px; color: #000; margin-top: 0px; line-height: 20px; }
.overlay-panel2 .field2 { margin-bottom: 10px; }
.overlay-panel2 .field input.txt { width: 95%; border: 1px solid #CCC;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; }
.overlay-panel2 .field textarea { width: 95%; height: 200px; border: 1px solid #CCC;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 5px; }
.overlay-panel2 .field input.btn { border: 1px solid #CCC; background: #DDD;  -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 7px; font-size: 14px; } 

.overlay-panel2 .field .button { float: left; margin-right: 5px; }


/* End overlay stles */

#debug { position: fixed; top: 0px; left: 0px; }