* {padding: 0; margin: 0;}
body {background: #EFEBEF; margin: 0; padding: 0; text-align: center; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 1em;}
.hide {display: none;}
a {color:#0078cc;}

#wrap {background: #CBDFEA url(../img/wrap_bg.gif) repeat-y; margin:0px auto; padding:0 10px; width:760px; text-align:left;}
#header {background:#F7A900 url(../img/header.gif) no-repeat top left; height:77px; width:760px;}

#login {width:310px; height:73px; float:right; border-left:1px solid #fff; margin:2px 0 0 0;}
#login h2 {font-size:0.7em; margin:2px 0 2px 4px;}
#login p {font-size:0.7em; line-height:1.1em; margin:0 0 3px 0;}
#login a {color:#000;}
#login label {float:left; width:55px; height: 14px; font-size:0.7em; margin:0 0 0 5px;}
#login input {border:0; width:125px; vertical-align:top; margin:0 0 2px 0; padding:2px;}
#login .logininputwrap {width:195px;}
#login #loginlinks {width:105px; float:right; margin:2px 2px 0 0; font-size:0.9em;}
#login #login_login {margin:7px 0 0 0; width:35px;}
#login #loggedinwelcome p {float:left; margin:0 3px 0 4px;}
#login #loggedinwelcome a {float:right; width:43px; height:17px; position:relative; display:block; overflow:hidden; font-size:0.5em; margin:0 3px 2px 0;}
#login #loggedinwelcome span { background:url(../img/btn_logout.gif) no-repeat; position:absolute; width:100%; height:100%;}
#login #loggedinlinks {width:200px; clear:both; margin:2px 2px 0 110px;}
#login .column1 {width:50%; float:left;}

#promo {background: #F7A900 url(../img/instructor_header.jpg) no-repeat top right; color:#953008; text-align:right;}
#promo .caption {position:relative; float:left; height:232px; width:185px; background:#fff; text-align:left;}
#promo .caption_valign {position:absolute; bottom:0%; margin:0 5px 10px 10px;}
#promo h2 {font-size:0.8em;}
#promo h3 {font-size:0.7em; margin:10px 0;}
#promo p {font-size:0.7em; font-weight:900;}
#promo select {margin:7px; width:195px;}

#menu {height: 25px; width: 760px; background: url(../img/menu_spacer.gif) repeat top;}
#menu em {visibility:hidden;}
#menu ul {margin:0 0 0 10px;}
#menu li {list-style:none; display:block; float:left; margin-right:12px; height:25px}
#menu a {text-decoration:none; font-size: 10pt; color:#193539; font-weight: bold; font-stretch: condensed;}
a.menu_home {width:52px; background: url(../img/menu_home.gif) no-repeat top;}
a.menu_styles {width: 48px; background: url(../img/menu_styles.gif) no-repeat top;}
a.menu_clubs {width: 48px;background: url(../img/menu_clubs.gif) no-repeat top;}
a.menu_instructors {width: 79px; background: url(../img/menu_instructors.gif) no-repeat top;}
a.menu_students {width: 65px; background: url(../img/menu_students.gif) no-repeat top;}
a.menu_faq {width: 41px; background: url(../img/menu_faq.gif) no-repeat top;}
a.menu_calendar {width: 62px; background: url(../img/menu_calendar.gif) no-repeat top;}
a.menu_contactus {width: 77px; background: url(../img/menu_contactus.gif) no-repeat top;}
a.menu_mailto {width: 187px; background: url(../img/menu_mailto.gif) no-repeat top; dispay:block; float:right; height:25px;}
a.menu_gallery {width: 79px; background: url(../img/menu_gallery.gif) no-repeat top;}

#adminmenu {margin:-15px 0 20px -20px; height: 25px;}
#adminmenu ul {margin:0 0 0 5px;}
#adminmenu li {margin:0 10px 0 0; list-style:none; float:left; font-size:0.9em;}

#content {float:left; background:url(../img/c_bg.gif) repeat-x; width:538px; padding:20px 25px 0 12px;}
/* Width for content area when no right column */
#content.fullsize {width:723px;}

#content h2 {font-size:1.5em; margin:0 0 10px 0;}
#content h3 {font-size:1.1em; margin:1.3em 0 0 0;}
#content h4 {font-size:1em;}
#content p {font-size:0.9em; margin:0 0 1.3em 0;}
#content ul {font-size:0.9em; margin:0 0 10px 20px; }
#content ol {font-size:0.9em; margin:0 0 1.3em 20px;}
#content .list-large ul {margin:-10px 0 1.3em 20px;}
#content dl {font-size:.8em;}
#content dt {margin:0 3px -2px 0; float:left;}
#content dd {margin:0 0 8px 0;}
#content img {float:right; margin:2px 0 10px 10px;}
#content .abstract {font-size:0.8em; margin:-10px 0 15px 0;}

#content .list-large { margin-top:5px;}

#calendar h2 {border-bottom:1px #b5c6d0 solid; margin-bottom:40px;}
#calendar h3 {margin-top:20px; border-bottom:1px #f7a900 solid; margin-bottom:10px;}
#calendar dl {margin:0 0 0 100px; font-size:1em;}
#calendar dt {font-weight:bold;}
#calendar dd {margin:0 0 0 50px; border-bottom:1px #b5c6d0 solid;}
#calendar .endmonth {font-size:0.7em; font-weight:normal;}

#search h2 {border-bottom:1px #b5c6d0 solid; margin-bottom:40px;}
#search h3 {margin-top:25px; border-bottom:1px #f7a900 solid; margin-bottom:10px;}
#search dl {margin:0 0 0 50px; font-size:1em;}
#search dt {font-weight:bold; line-height:1em; padding-top:5px;}
#search dd {margin:0 0 0 80px; border-bottom:1px #b5c6d0 solid; padding:2px 0;}
#search .advanced dd {margin-left:130px;}
#search .searchbtn { float:right; margin-top:5px;}

#instructorslist img {float:left; margin:20px 20px 0 10px; border:2px #f7a900 solid;}
#instructorslist h3 {margin-top:40px; margin-bottom:10px; border-bottom:1px #f7a900 solid;}
#instructorslist h4 {margin-top:25px; margin-left:85px;}
#instructorslist h5 {margin-top:3px; margin-left:85px;}
#instructorslist ul {margin-top:8px; margin-left:50px;}
#instructorslist li {margin-left:50px;}
#instructorslist .type {font-size:0.9em; font-weight:normal;} 

#listing h3 {margin-top:30px; margin-bottom:10px; border-bottom:1px #f7a900 solid;}
#listing h4 {margin-top:20px; margin-left:20px;}
#listing ul {margin-left:40px;}
#listing .type {font-size:0.9em; font-weight:normal;} 

#content table {border-collapse:collapse; table-layout:fixed;}
#content th {font-weight:bold; font-size:1em; border-bottom:1px #f7a900 solid;}
#content table .c1 {width:10%;}
#content table .c2 {width:35%;}
#content table .c3 {width:25%;}
#content table .c4 {width:30%;}
#content table .date {font-weight:bold; font-size:1em;}
#content table td {padding:15px 5px 5px 0; vertical-align: top; border-bottom:1px #b5c6d0 solid; font-size:0.9em;}
#content table table td {padding:0 2px 5px 2px; margin:0; border:0;}

#content #timeschedule {clear:both;}

#related {display:block; float:right; width:190px; display:inline; margin:0 -20px 10px 10px;}
#related h1 {font-size:1.1em; margin:5px 0 0 0; line-height:1.1em;}
#related h2 {font-size:1em; margin:5px 0 0 0; line-height:1em;}
#related h3 {font-size:.9em; margin:5px 0 -4px 0;}
#related h4 {font-size:.8em; margin:5px 0 -4px 0;}
#related a, #related p {font-size:.7em;}
#related p a {font-size:1em;}
#related p {margin:0 0 1em 0;}
#related dl {font-size:.8em;}
#related dt {margin:0 3px -2px 0; float:left;}
#related dd {margin:0 0 8px 0;}
#related dt a, #related dd a {font-size:1em;}
#related img {margin:0 0 5px 0; float:none;}
#related hr {margin-top:3px; margin-bottom:5px;}
#related h1 a {font-weight: bold; font-size:0.9em;}

/* Need the negative margin to make border between insets 8px but keep the 5px border at top/bottom 
   IE struggles to render the bottom inset unless there is a height specify, hence the 1% height 
   IE Need a 8px bottom border as the negative margin is taken of the border
   the > selector buts it back to 5px in all other browsers */
#related .inset {background:#fff; border:5px #f7a900 solid; margin:0 0 -3px 0; padding:7px 5px; height:1%;}
#related .inset {border-bottom:8px #f7a900 solid;}
html>body #related .inset {border-bottom:5px #f7a900 solid;}
#related .inset p {margin:10px 0 -5px 0;}

#related .insetsolid {background:#fbba2c; margin:0 0 0 0; padding:0; height:1%;}
#related .insetsolid div {margin:5px; padding:0 0 15px 0;}
#related .insetsolid p {margin-top:5px;}
#related .insetsolid h2 {font-size:1.1em; font-weight:normal; height:22px; color:#fff; margin:5px 0 0 0; padding:5px; line-height:1em; background:#f7a900;}
#related .insetsolid h3 a {font-size:1.1em; color:#014488;}
#related .insetsolid h3, #related .insetsolid h4 {margin-top:10px;}
#related .insetsolid dt {padding:0 0 0 18px; background:url(../img/ico_articles.gif) no-repeat 0 3px; float:none;}
#related .insetsolid dd {font-size:0.7em; margin:0 0 10px 18px;}
#related .insetsolid dt a {font-size:1.1em; line-height:1.2em; font-weight:bold; text-decoration:none; display:block; color:#000;}
#related .insetsolid dt a:hover {text-decoration:underline;}


#rightcol {background: #F7A900; display:block; float:left; width:185px; margin:0; font-size:11px;}
#rightcol div{margin:0 5px; width:165px;}
#rightcol .head {height: 113px; border:5px solid #fff;}
#rightcol .body {background:#fff; padding: 0 0 10px 0; margin-bottom:5px; border:5px solid #fff;}
#rightcol #camp_head { background: url(../img/camps.jpg) top left no-repeat;}
#rightcol #camp_body { }
#rightcol .camp_date {font-weight: bold; width:40px; vertical-align:top;}
#rightcol .camp_desc { width:120px;}
#rightcol #kids_head { background: url(../img/kids.jpg) top left no-repeat;}
#rightcol #kids_body { }

#rightcol #china_head { background: url(../img/China_2010.jpg) top left no-repeat;}
#rightcol #china_body { font-size: 11px;}
#rightcol #china_body dt { font-weight: bolder;}
#rightcol #china_body dd { padding-bottom: 10px;}

#rightcol #anatomy_head { background: url(../img/anatomy.jpg) top left no-repeat;}
#rightcol #anatomy_body { font-size: 11px;}
#rightcol #anatomy_body dt { font-weight: bolder;}
#rightcol #anatomy_body dd { padding-bottom: 10px;}

#rightcol #latest_news_head { background: url(../img/Latest_News.jpg) top left no-repeat;}
#rightcol #latest_news_body { font-size: 11px;}
#rightcol #latest_news_body dt { font-weight: bolder;}
#rightcol #latest_news_body dd { padding-bottom: 10px;}

#rightcol #sahara_2011_head { background: url(../img/Sahara_2011_Nav.jpg) top left no-repeat;}
#rightcol #sahara_2011_body { font-size: 11px;}
#rightcol #sahara_2011_body dt { font-weight: bolder;}
#rightcol #sahara_2011_body dd { padding-bottom: 10px;}

#rightcol #crete_head { background: url(../img/crete_2010.jpg) top left no-repeat;}
#rightcol #crete_body { font-size: 11px;}
#rightcol #crete_body dt { font-weight: bolder;}
#rightcol #crete_body dd { padding-bottom: 10px;}

#rightcol #crete_2011_head { background: url(../img/Crete_2011.jpg) top left no-repeat;}
#rightcol #crete_2011_body { font-size: 11px;}
#rightcol #crete_2011_body dt { font-weight: bolder;}
#rightcol #crete_2011_body dd { padding-bottom: 10px;}

#rightcol #bulgaria_head { background: url(../img/bulgaria.jpg) top left no-repeat;}
#rightcol #bulgaria_body { font-size: 11px;}
#rightcol #bulgaria_body dt { font-weight: bolder;}
#rightcol #bulgaria_body dd { padding-bottom: 10px;}

#rightcol #wudang_head { background: url(../img/wudang_camp.gif) top left no-repeat;}
#rightcol #wudang_body { font-size: 11px;}
#rightcol #wudang_body dt { font-weight: bolder;}
#rightcol #wudang_body dd { padding-bottom: 10px;}

#footer { height:22px; clear:both; background: url(../img/bg_footer.gif) no-repeat; margin:15px 0 0 0; padding:3px 10px 0 12px;}
#footer p {font-size:0.9em;}

.grad_NEW_RESULTS { font-weight:bold; font-size:large; font-style: italic;}
.res_A { color:green; font-weigh:bold; }
.res_Y { color:green; font-weigh:bold; }
.res_D { color:green; font-weigh:bold; }
.res_N { color:brown;}
.res_X { color:brown;}
#gradingResultsHistory table {width:550px;}
#gradingResultsHistory td.indent {width:45px;}
#gradingResultsHistory td.newResult { background: url(../img/ico_new.gif) bottom left no-repeat;}
#gradingResultsHistory td.grad_date {width:65px;}
#gradingResultsHistory .congratulations {margin-top: 15px; padding-left:50px; font-weight:bold; font-style: italic;}

#content table.clubClasses {width:100%;}
#content table.clubClasses table {width:100%;}
#content table.clubClasses a {font-size: 1.1em;}

#content table.grading_open h2 {margin:0; font-size: 1.3em;}
#content table.grading_closed h2 {margin:0; font-size: 1.3em;}
#content table.grading_released h2 {margin:0; font-size: 1.5em;}

.clearfix:after {content:"*"; display:block; height:0; clear:both; visibility:hidden;}
.clearfix {display:inline-block;}
* html .clearfix {height:1%;}
.clearfix {display:block;}
div.clearer {clear: both; line-height: 0; height: 0; margin:0; padding:0}

#gallery { margin:0; padding:5px; background-color:#ECECEC; text-align:left;}
#gallery .photoLists {margin:0; padding:0;}
#gallery .photoList  {background-color:#ECECEC;}
#gallery .photoList   .header {background-color:white; color: black; }
#gallery .photoList   .header a {color: black;}
#gallery .photoList   .header .title {float:left; font-weight: bold;}
#gallery .photoList   .header .pager {float:right; height:1em;}
#gallery .photoList   .footer {text-align: center;}
#gallery .photoList   .footer input {font-size: 1.5em; font-weight: bold;}
#gallery .photoList   .photos { margin-top:5px; padding:1px;}
#gallery .photoList   .photos ul { margin:0; background-color:black; color:white; list-style-image:none; list-style-position:outside; list-style-type:none; overflow:hidden;}
#gallery .photoList   .photos ul li { display:block; float:left; padding:4px; background-color:black; color:white;}
#gallery .size_small  .photos ul li {height:148px;}
#gallery .size_medium .photos ul li .photo { border-bottom: 4px solid #ECECEC; margin-bottom: 5px; }
#gallery .photoList   .photos ul li .photo .controlPanel { color:white; float:left; margin-left:10px; width:250px;}
#gallery .photoList   .photos ul li .photo .controlPanel .buttons img {border:0; float:none; margin:0; vertical-align:text-top;}
#gallery .photoList   .photos ul li .photo .controlPanel .buttons a {margin:0 0 0 10px;}
#gallery .photoList   .photos ul li .photo .controlPanel .photoProcessing {display: none; width:32px; height:32px; padding:0; margin:1px; border:0; background:url(../img/ico_loading.gif) no-repeat center;}
#gallery .photoList   .photos ul li .photo .title p {margin-bottom: 3px;}
#gallery .photoList   .photos ul li .photo .photoText {float: none; clear: both; text-align: left; color: white; margin-left:0;}
#gallery .photoList   .photos ul li .photo .photoImage {float: left;}
#gallery .photoList   .photos ul li .photo .photoImage img { float:none; padding:0; margin:0; background:black url(../img/ico_crane.jpg) no-repeat center;}
#gallery .photoList   .photos ul li .photo .photoImage_small_horizontal  img { border-top: 4px solid white; border-right: 2px solid white; border-bottom: 10px solid white; border-left: 2px solid white;}
#gallery .photoList   .photos ul li .photo .photoImage_small_vertical    img { border-top: 2px solid white; border-right: 6px solid white; border-bottom:  2px solid white; border-left: 6px solid white;}
#gallery .photoList   .photos ul li .photo .photoImage_medium_horizontal img { border-top: 8px solid white; border-right: 4px solid white; border-bottom: 20px solid white; border-left: 4px solid white;}
#gallery .photoList   .photos ul li .photo .photoImage_medium_vertical   img { border-top: 4px solid white; border-right:12px solid white; border-bottom:  4px solid white; border-left:12px solid white;}
#gallery .size_medium .photos ul li .photo .photoImage .photoRefused { display: none; position:absolute; height: 80px; background-color: white; color: red; font-weight: bold; font-size: 2em; cursor: pointer; opacity: 0.60; filter: alpha(opacity:60); MozOpacity: 0.60;  KHTMLOpacity: 0.60;}
#gallery .photoList   .photos ul li .photo .photoImage_medium_horizontal .photoRefused { 
	 margin-left:4px; /* should be equal to .photoImage_medium_horizontal img  border-left property */
	 margin-top:8px; /* should be equal to .photoImage_medium_horizontal img  border-top property */
}
#gallery .photoList   .photos ul li .photo .photoImage_medium_vertical .photoRefused { 
	 margin-left:12px; /* should be equal to .photoImage_medium_vertical img  border-left property */
	 margin-top:4px; /* should be equal to .photoImage_medium_vertical img  border-top property */
}

#gallery .photoList .footer {	background-color:#FFFFFF; padding:5px;}
#gallery a { color:#CCCCCC;}

#galleryHomePage img.randomPhoto { float:none; margin:10px 2px 2px 250px; position:absolute;}
#galleryHomePage #gallery {margin-top: 100px}
#galleryHomePage #gallery .controlPanel {display: none}
#galleryHomePage #gallery {width: 543px; margin-left: 100px}

#galleryAdminStaging #gallery .photoList   .photos ul li .photo .controlPanel {width: 170px;}

#popup .photoList .header {background-color:black; color: white; padding-bottom:10px;}
#popup .photoList .header a {color: #CCCCCC}
#XXpopup .photoList .header .pager { width:300px;}
#popup .photoList .photos ul li {float: none;}
#popup .photoList .photos ul li .photo {border: 0}
#popup .photoList .photos {margin: 2px 0 0 0; padding:0}

#popupBackground {
	 display: none;
	 position:fixed;
	 width:100%;
	 height:100%;
	 z-index:90; 
	 background-color: black;
	 filter: alpha(opacity:80);
	 KHTMLOpacity: 0.80;
	 MozOpacity: 0.80;
	 opacity: 0.80;
	 z-index:10;
	 top:0;
	 left:0;
	 padding:10px;
	 cursor: pointer;
}

#XXXpopupWrap {
	visibility: hidden;
	background-color: black;
	 filter: alpha(opacity:80);
	 KHTMLOpacity: 0.80;
	 MozOpacity: 0.80;
	 opacity: 0.80;
	 z-index:90; 
	 cursor:pointer;
}
#popup {
	 position:absolute;
	 display: block;
	  
	 /*border:2px solid white;*/ /*top: 0; left: 0; width: 100%; height: 100%; position: fixed; display: table;*/
	 background-color: black;
	 border-style: outset;
	 /*
	 margin-left: auto;
	 margin-right: auto;
	 */
	 z-index:91;
}
#popupBar {
	background-color:#0078CC;
	color:white;
	padding-bottom:3px;
	padding-right:10px;
	text-align:right;
}
#popupBar a { color: white;}

#popupContent {
	background-color:black;
	/* margin:10px; */
	padding:10px;
}
#popupContentBuffer {
	display: none;
}

.centeredOLD {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
} 

.centeredContainer {
	top: 0; left: 0; width: 100%; height: 100%;
    position: fixed;
    display: table;
 }
 
.centered {
  min-height: 500px;
  display: table-cell;
  vertical-align: top;
  /*position: fixed;*/
  
}
.percentageBarContainer {display: inline; margin-left: 20px;  z-index: 5;}
.percentageBarContainer .normal .percentageBarUsed {background-color: #30D0B0;} 
.percentageBarContainer .almostFull .percentageBarUsed {background-color: #FF8C00;} 
.percentageBarContainer .full .percentageBarUsed {background-color: #FF0000;} 

.percentageBar { display: inline-block; position: relative; top:3px; border: 1px solid black; width: 100px; margin:0; padding: 0; height: 1em; background-color: white;}
.percentageBar .percentageBarTooltip {display: none;}
.percentageBar:hover .percentageBarTooltip {     display:block;
    position:absolute;
    top:2em; left:2em; width:15em;
    border:1px solid #F7A900;
    background-color:#FBBA2C; color:#000;
    text-align: center;
    z-index: 50;
    }
.percentageBarUsed { display: block; border: 0; margin:0; padding: 0; height: 1em; }
.percentageBarLimitText {  }
.percentageBarValue { display:block; position:absolute; color: black; top:-3px; left: 45px;}