/* Main CSS */
html, body { margin: 0; padding: 0; background: url('../images/background.bmp'); }
.container { top: 0; background: url('../images/bgContent.png') repeat-y; }
.nomargin { margin: 0; }

/* User Information Bar */
.userMenu { position: fixed; margin: 0 20px; z-index: 1; }
.userMenu table { margin: 0; height: 25px; width: 940px; border-collapse: collapse; opacity: 0.6; filter: alpha(opacity=60); }
.userMenu table tr, .userMenu table td { padding: 0; }
.userMenu table td.left { width: 20px; padding: 0; background: url('../images/bgUserMenu-left.png') no-repeat; }
.userMenu table td.center { width: 900px; padding: 0; background: url('../images/bgUserMenu.png') repeat-x; text-align: right; }
.userMenu table td.right { width: 20px; padding: 0; background: url('../images/bgUserMenu-right.png') no-repeat; }
.userMenu p { margin: 3px 0; color: white; }
.userMenu p.left { float: left; }
.userMenu a { color: white; }

/* Main Display */
.display { padding: 40px 40px 0px 40px; }

/* Header Display */
#header { margin: 0 0 20px 0; }
#chapter { margin-left: 80px; }

/* Navigation Display */
.navMenu { margin: 10px 0; border: 0; padding: 0 20px; width: 860px; height: 20px; text-align: center; }
.nav { margin: 0; font-family: Trebuchet MS; color: #888; }
.nav li { border-right: 1px solid #222; height: 25px; list-style: none; display: inline; }
.nav li.last { border: 0; }
.nav li.active { background: url('../images/bgActiveNav.png') repeat-x; }
.nav li a { padding: 0px 25px; font-size: 13px; color: #888; text-decoration: none; }
.nav li a:hover { color: #fff; }

/* Content Display */
body { font-family: Verdana; }
#myBanner { border: 1px solid #222; padding: 4px; }
.content { margin: 20px 0; padding: 20px; background: #181818; }
#loadingContent { float: right; display: none; }
.text { padding: 0 20px; }
.text input[type=button] { border: 1px solid #333; padding: 4px; float: right; background: #222; color: #ccc; font-size: 11px; font-family: Verdana; overflow: visible; }
.text input[type=button]:hover { border: 1px solid #fff; }
.post { margin-bottom: 5px; padding: 10px; }
.news .pictures { text-align: center; }
.news .pictures a { border: 0; }
.news img { margin: 0 20px 15px 25px; padding: 4px; border: 1px solid #333; }
.news img:hover { border: 1px solid #888; }
.post table { margin: 10px 40px; border-collapse: collapse; width: 600px; }
.post table td { padding: 0 20px 0 0; font-family: Verdana; font-size: 11px; color: #ccc; vertical-align: center; }
.post table td a { border: 0; color: #ccc; text-decoration: none; }
#displayList, #displayClass, #displayUser, #displayGallery { float: left; }
#displayList { margin: 0 15px 0 10px; }
#displayList h4 { margin: 0 0 10px; }
#displayList a { margin: 0; border: 0; color: #ccc; font-size: 11px; }
#displayList a:hover { color: #fff; }
#displayUser { margin-left: 15px; }
#displayUser a { border: 0; }
#displayUser h3 { margin: 0; font-size: 1.75em; width: auto; }
#displayUser img { border: 1px solid #333; padding: 5px; }
#displayUser img:hover { border: 1px solid #888; }
#displayUser table { width: 510px; }
#displayUser table td { padding: 0; vertical-align: top; }
#displayUser table td.image { padding: 0 30px 0 0; width: 190px; }
#displayGallery { width: 660px; }
.pictureList { margin: 0 40px 10px; }
.content .pictureList a { border: 0; }
.pictureList img { border: 1px solid #333; padding: 5px; }
.pictureList img:hover { border: 1px solid #888; }
.modalForm { margin: 0 15px; width: 370px; }
.modalForm td { vertical-align: top; padding: 4px 10px 4px 10px; }
.modalForm td.field { width: 20%; }
.modalForm td.fieldbox { padding-left: 0px; width: 5%; }
.modalForm td.input { width: 80%; }
.modalForm td.inputbox { padding-top: 15px; }
.modalForm input, .modalForm textarea { border: 1px solid #333; padding: 4px; background: #181818; color: #ccc; font-size: 11px; font-family: Verdana; }
.modalForm input[type=text], .modalForm input[type=password] { width: 100%; }
.modalForm input[type=checkbox] { margin: 2px 0; }
.modalForm input:focus, .modalForm textarea:focus { border: 1px solid #666; background: #222; }
.modalForm textarea { margin: 0; height: 100px; width: 100%; overflow: auto; }
.editProfile { width: 100%; }
.photoUpload img { border: 1px solid #333; padding: 5px; }
.photoUpload button { border: 1px solid #333; padding: 4px; text-decoration: none; background: #181818; color: #ccc; font-size: 11px; font-family: Verdana; }
.form { margin: 0 15px; width: 100%; }
.form td { vertical-align: top; padding: 4px 10px 4px 0px; }
.form td.field { width: 20%; }
.form td.input { width: 30%; }
.form td.photoUpload { padding: 0 15px; text-align: center; }
.form input, .form textarea, .form select { border: 1px solid #333; padding: 4px; background: #181818; color: #ccc; font-size: 11px; font-family: Verdana; }
.form select { margin: 0; }
.form input[type=text], .form input[type=password], .form textarea { width: 100%; }
.form input:focus, .form textarea:focus { border: 1px solid #666; background: #222; }
.form textarea { margin: 0; height: 100px; overflow: auto; }
.contacts td { width: 33%; }

/* Footer Display */
.footer { margin: 0 auto; border-bottom: 2px solid #222; width: 940px; text-align: right; }
.footer p { margin: 0; padding: 0 20px 10px 0; font-size: 10px; }
.footer p.left { float: left; margin: 0; padding: 0 0 10px 20px; font-size: 10px; }

/* Typography */
h1, h2, h3, h4, h5, h6 { border-bottom: 1px solid #333; padding-bottom: 4px; font-family: Trajan Pro, Verdana, Times New Roman; font-weight: bold; color: #fff; }
p { font-size: 11px; }
.content a { padding-bottom: 0; border-bottom: 1px solid #888; color: #888; text-decoration: none; }
.content a:hover { color: #fff; }
.mapContainer #map div a { border: 0; color: #00f; }
.mapContainer #map div a:hover { color: #00f; text-decoration: underline; }
.text h4 { margin: 0 0 10px 15px; }
.post h2, h3, h4, h5, h6 { margin: 0 0 0 5px; padding: 0; border: 0; }
.post h5, p { font-family: Verdana; color: #ccc; }
.post p { margin: 0; padding: 10px 5px; text-align: justify; }
.news { background: url('../images/bgPost.png') no-repeat; }
.news p { margin: 0; padding: 15px 25px; }
.news ul { margin: 0 0 5px 60px; }
ul { margin: 0 0 0 30px; font-family: Verdana; }
li { color: #ccc; font-size: 11px; }
hr { margin: 0 auto 15px; width: 80%; text-align: center; color: #222; background-color: #333; height: 1px; }
.errorMessage { color: #f00; font-weight: bold; font-size: 11px; font-family: Verdana; }

/* Administration */
.management { margin: 0 auto; border: 1px solid #222; border-collapse: collapse; background: #181818; font-size: 11px; color: #fff; }
.management tr { border: 1px solid #222; }
.management td input { margin: 0; }
.management td input[type="button"] { float: none; }
.management td.command { text-align: center; width: 20%; }
.management td.smallWidth { width: 10%; }
.management button { border: 1px solid #333; padding: 4px; text-decoration: none; background: #222; color: #ccc; font-size: 11px; font-family: Verdana; }

/* Google Maps */
.mapContainer { margin: 0 auto 25px auto; border: 1px solid #333; padding: 4px; width: 680px; height: 400px; }
#map { width: 680px; height: 400px; text-align: center; }
#map a.load { border: 0; font-family: Trajan Pro, Verdana, Times New Roman; font-weight: bold; font-size: 24px; line-height: 400px; vertical-align: center;}

/* jQuery */
.ui-tabs-hide { display: none; }
.jqmWindow { display: none; position: fixed; top: 17%; left: 50%; margin-left: -200px; width: 400px; background-color: #181818; border: 1px solid #666; padding: 12px; text-align: left; z-index: 1000; }
.jqmOverlay { background-color: #000; }
* iframe.jqm {position:absolute;top:0;left:0;z-index:-1;width: expression(this.parentNode.offsetWidth+'px');height: expression(this.parentNode.offsetHeight+'px');}
* html .jqmWindow { position: absolute; top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px'); }

/* Font Setup */
@font-face { font-family: Trajan Pro; src: url('../styles/TrajanPro-Regular.otf'); }
@font-face { font-family: Trajan Pro; font-weight: bold; src: url('../styles/TrajanPro-Bold.otf'); }