body {background-color: black; color: #AAAAAA; font-family: Helvetica;}
h2 { font-weight: normal; font-size: 1.3em;}
label, p.label { font-size: 0.8em; display: block; margin-bottom: 3px;}
label.error { color: red; margin-top: 5px; }
a, a:visited { color: #AAAAAA; text-decoration: none;}
a:hover, a:focus { text-decoration: underline; }

.messages { background:transparent url('/assets/lib/static/graphics/messages.png') no-repeat; border: 1px solid; margin-bottom:18px; min-height: 50px; padding:18px 18px 8px 60px; -moz-border-radius:5px; -webkit-border-radius:5px; -khtml-border-radius:5px; border-radius:5px; line-height: 16px; width: 95%; max-width: 950px; }
.errorParagraph {display: inline-block; padding: 0px; margin-bottom: .6em; color: #444444;}
.messages.alert{background-position:-985px 10px;background-color:#f7f2dc;border-color:#AAAAAA;}
.messages.error{background-position:15px 10px;background-color:#fbeadb;border-color:#AAAAAA;}
.messages.info{background-position:-1985px 10px;background-color:#e5ece4;border-color:#AAAAAA;}
.messages ul{margin:0px 0px 5px 15px; list-style: none}
.messages li{padding:2px 0;}

input {background-color: #3B3B3B; border: 1px solid #3B3B3B; border-radius: 5px; color: #AAAAAA; font-size: 1.2em; padding: 4px 6px; width: 100%;}
input.button { 
	border: 2px solid #AAAAAA;
	padding: 4px 8px;
	background: #5b5b5b; /* Old browsers */
	background: -moz-linear-gradient(top,  #5b5b5b 0%, #303030 50%, #0d0d0d 51%, #000000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5b5b5b), color-stop(50%,#303030), color-stop(51%,#0d0d0d), color-stop(100%,#000000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b5b5b', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
	cursor: pointer;
}

#newExamchartButton {
	width: 40px;
	background: url('/assets/implementation/graphics/iconStats.png') center no-repeat, -moz-linear-gradient(top,  #5b5b5b 0%, #303030 50%, #0d0d0d 51%, #000000 100%); /* FF3.6+ */
	background: url('/assets/implementation/graphics/iconStats.png') center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5b5b5b), color-stop(50%,#303030), color-stop(51%,#0d0d0d), color-stop(100%,#000000)); /* Chrome,Safari4+ */
	background: url('/assets/implementation/graphics/iconStats.png') center no-repeat, -webkit-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* Chrome10+,Safari5.1+ */
	background: url('/assets/implementation/graphics/iconStats.png') center no-repeat, -o-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* Opera 11.10+ */
	background: url('/assets/implementation/graphics/iconStats.png') center no-repeat, -ms-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* IE10+ */
	background: url('/assets/implementation/graphics/iconStats.png') center no-repeat, linear-gradient(to bottom,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* W3C */
	filter: url('/assets/implementation/graphics/iconStats.png') center no-repeat, progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b5b5b', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}

#newExamchartButton.loading {
	background: url('/assets/implementation/graphics/loader.gif') center no-repeat, -moz-linear-gradient(top,  #5b5b5b 0%, #303030 50%, #0d0d0d 51%, #000000 100%); /* FF3.6+ */
	background: url('/assets/implementation/graphics/loader.gif') center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5b5b5b), color-stop(50%,#303030), color-stop(51%,#0d0d0d), color-stop(100%,#000000)); /* Chrome,Safari4+ */
	background: url('/assets/implementation/graphics/loader.gif') center no-repeat, -webkit-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* Chrome10+,Safari5.1+ */
	background: url('/assets/implementation/graphics/loader.gif') center no-repeat, -o-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* Opera 11.10+ */
	background: url('/assets/implementation/graphics/loader.gif') center no-repeat, -ms-linear-gradient(top,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* IE10+ */
	background: url('/assets/implementation/graphics/loader.gif') center no-repeat, linear-gradient(to bottom,  #5b5b5b 0%,#303030 50%,#0d0d0d 51%,#000000 100%); /* W3C */
	filter: url('/assets/implementation/graphics/loader.gif') center no-repeat, progid:DXImageTransform.Microsoft.gradient( startColorstr='#5b5b5b', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}

.styledSelectWide select, .styledSelectNarrow select {
   background: transparent;
   padding: 4px 6px; 
   font-size: 1.2em; 
   line-height: 1;
   border: 0;
   border-radius: 0;
   height: 34px;
   color: #AAAAAA; 
   -webkit-appearance: none;
   }
.styledSelectWide select { width: 110%; }
.styledSelectNarrow select { width: 130%; }


.styledSelectWide, .styledSelectNarrow { height: 34px; overflow: hidden; background-color: #3B3B3B; border: 1px solid #3B3B3B; border-radius: 5px;  display: inline-block; width: 100%; }
.styledSelectNarrow { max-width: 300px; }
.styledSelectWide { max-width: 450px;}
 	


/*.grid { border: 1px solid white;}*/
.logo {background: url('/assets/implementation/graphics/logo.jpg') top left no-repeat; height: 90px;}
.logo p.title { padding-left: 150px; padding-top: 10px; margin-bottom: 10px;}
.logo p.byline { font-size: 0.75em; margin-top: 0px;}
.redText { color: red; }
.clearAbove { clear: both; }
#userLoginWrapper input, #userSetPasswordWrapper input { max-width: 95%; }

p.floatLeft { float: left; }
.marginLeft10 { margin-left: 10px; }

.formRow { min-height: 63px; }
form p {margin-top: 0; margin-bomttom: 10px;}
p.examDate { width: 48%; max-width: 300px; }
p.examTime { width: 35%; max-width: 200px; }
p.physicianID { width: 20%; max-width: 100px; }
p.selectWide { width: 75%; max-width: 400px; }
p.selectNarrow { width: 40%; max-width: 200px; }
p.medicalNumber { width: 55%; max-width: 400px;  }
#newExamtimeIcon { width: 30px; height: 30px; float: left; margin-top: 23px; margin-left: 10px; margin-bottom: 10px; background: url('/assets/implementation/graphics/iconClock.png') top left no-repeat; cursor: pointer; }

.examHeader, .examAreas, .examComponents, .userStats { width: 97%; }
.examHeader th { font-weight: normal; font-size: 0.8em; text-align: left; padding: 3px 0px 3px 6px;}
.examHeader td span.input { display: inline-block; background-color: #3B3B3B; border: 1px solid #3B3B3B; border-radius: 5px; color: #AAAAAA; font-size: 1.2em; padding: 4px 6px; width: 100%; }
.examHeader td { padding: 3px;}

.examAreas tr, .studies tr { cursor: pointer;}
.examAreas td { padding: 5px 0px;}
.examAreas td.title{ font-size: 1.5em; font-weight: bold; }
.examAreas td.img, .examComponents td.img {text-align: center;}

.examComponents td.title { font-size: 1.4em; }
.examComponents td { padding: 5px 0px;}
.examComponents span.box { background-color: #3B3B3B; border: 1px solid #3B3B3B; border-radius: 5px; display: inline-block; width: 50px; height: 50px; }
.examComponents span.checked { background: url('/assets/implementation/graphics/iconCross.png') top 3px left 3px no-repeat #3B3B3B;}
 
 .userStats td.count {text-align: center; }
 .userStats tr.second > td { padding-bottom: 1em; }
 
 .studies { width: 100%; border-collapse: collapse; }
 .studies td { border-bottom: 1px solid #7A7A7A; }
 .studies td { padding: 15px 5px;} 
 
html, body {
	/*height: 100%;*/
}

.header { position: fixed; top: 0px; background-color: black; height: 110px;}

.content {
	margin-top: 110px;
}
.study {
	margin-bottom: 60px; /* auto -160px; the bottom margin is the negative value of the footer's height */
}

.footer { position: fixed; bottom: 0px; background-color: #333333; height: 60px; }

.buttonCancel { width: 100px;}
.footer p { margin: 0px 10px 0px 0px;}

input.buttonGreen { 
	background: #39985c; /* Old browsers */
	background: -moz-linear-gradient(top,  #39985c 0%, #408e50 50%, #386d43 51%, #1d511b 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#39985c), color-stop(50%,#408e50), color-stop(51%,#386d43), color-stop(100%,#1d511b)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #39985c 0%,#408e50 50%,#386d43 51%,#1d511b 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #39985c 0%,#408e50 50%,#386d43 51%,#1d511b 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #39985c 0%,#408e50 50%,#386d43 51%,#1d511b 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #39985c 0%,#408e50 50%,#386d43 51%,#1d511b 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#39985c', endColorstr='#1d511b',GradientType=0 ); /* IE6-9 */
}
input.buttonMore, p.studyHeader {
	background: #7db9e8; /* Old browsers */
background: -moz-linear-gradient(top,  #7db9e8 0%, #207cca 49%, #2989d8 50%, #1e5799 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7db9e8), color-stop(49%,#207cca), color-stop(50%,#2989d8), color-stop(100%,#1e5799)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #7db9e8 0%,#207cca 49%,#2989d8 50%,#1e5799 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #7db9e8 0%,#207cca 49%,#2989d8 50%,#1e5799 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #7db9e8 0%,#207cca 49%,#2989d8 50%,#1e5799 100%); /* IE10+ */
background: linear-gradient(to bottom,  #7db9e8 0%,#207cca 49%,#2989d8 50%,#1e5799 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 ); /* IE6-9 */
}

.track { display: inline-block; border-radius: 10px; height: 16px; margin-top: 0px; text-align: left; background-color: #999EAC; } /*width: 100%; */
.complete, .certified, .progress {display: inline-block; border-radius: 10px; height: 16px; vertical-align: top; }
.certified { background-color: #4AAC35; }
.complete { background-color: #ffff00; }
.progress { background-color: #ff0000; }

.studyHeader { color: white; font-weight: bold; margin: 0px; padding: 5px;  }
span.studyTitle { display: inline-block; width: 95%; font-size: 1.3em; font-weight: bold; }
span.studyDates { font-size: 0.75em;}

p.studyArrow { float: right; width: 10%; margin: 8px 0 0; cursor: pointer;}
p.studyTitle { float: left; width: 89%; background: url('/assets/implementation/graphics/iconClipboard.png') top 3px left 3px no-repeat; padding-left: 30px;  margin: 4px 0 0;  font-size: 1.4em; font-weight: bold; height: 35px; padding-top: 8px; cursor: pointer;}

table.studyQuestions td { padding: 10px 0 15px 0;}
table.studyQuestions label { font-size: 1.3em; }
.imbusRadio { width: 50px;}
.inlineLabel { display: inline-block; }

input[type=date], input[type=time] { -webkit-appearance: none; height: 34px;}
.statsLoading { text-align: center; margin-right: 10px;}