html {height: 100%;}
body {font-family: helvetica, arial, sans-serif; height: 100%; }
a {color: #007DC3; text-decoration: none;}
body.account-login,
body.account-create,
body.account-forgotpassword {background: url(../images/hero_bg.jpg) no-repeat; background-size: cover;}
.clear {clear: both;}

h1 {font-size: 20px; padding-bottom: 20px; font-weight: bold; color:#007DC3}
h2 {font-size: 20px; padding-bottom: 20px; font-weight: bold; color:#007DC3}

.sep {border-bottom: 1px solid #CCC;}
.red {color: #b5433c !important;}

.spacer30{height: 30px;}

/*Buttons*/
.orange_button {display: block; background:#F89829; line-height: 34px; text-decoration: none; text-align: center; font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #FFF;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
.orange_button:hover {background:#cc7b1e;}

.green_button {display: block; background:#7fc639; line-height: 34px; text-decoration: none; text-align: center; font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #FFF;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
.green_button:hover {background:#609928;}
.green_button.small {font-size: 10px;}

.blue_button {display: block; background:#007DC3; line-height: 34px; text-decoration: none; text-align: center; font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #FFF;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
.blue_button:hover {background:#0995e4;}

.gray_button {display: block; background:#c2c2c2; line-height: 34px; text-decoration: none; text-align: center; font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #FFF;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
.gray_button:hover {background:#a4a3a3;}


.wrapper {width: 1000px; margin: 0 auto; position: relative;}


/* Error Styling */
.errorMessage {padding: 3px; font-size: 10px; background: #fdd9a0; border: 1px solid #fba824; margin: 0 0 10px; color: #704809;}
.errorSummary {padding: 3px; font-size: 10px; background: #fdd1d1; border: 1px solid #e42424; margin: 0 0 10px; color: #704809;}
.errorMessage h3 {font-size: 16px; font-weight: bold; padding: 0 0 10px;}

.single_course .errorMessage {padding: 10px; margin: 0 0 30px;}
.single_course .errorMessage p {margin: 0 !important; padding: 0;}

/*Flash Styling*/
.confirmation h3 {font-size: 16px; padding-bottom: 10px;}
.confirmation {padding: 7px; font-size: 12px; background: #bbe797; border: 1px solid #7ea75e; margin: 0 0 10px; color: #3b601d; line-height: 17px;}


#header {background-image: url(../images/header_bg.png), url(../images/default_header.jpg); background-size: contain, cover;}
#header .wrapper {height: 90px;}
#header .link {float: right; line-height: 88px; border-right: 1px solid #737169; padding: 0 30px; margin-top: 2px; display: block; color: #FFF; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; text-decoration: none;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
#header .link.admin {color:#7fc639 }
#header .link.first {border-left: 1px solid #737169;}
#header .link:hover {background: #F89829; color: #FFF}
#header #logo img {width: 270px; height: auto; top: 14px; left: 0; position: absolute;}

.account #footer {display: none;}

/*Account Form*/
.account_form#login_form {width: 300px; margin-top: 20%; }
.account_form#register_form {width: 400px; margin-top: 10%; }
.account_form {margin: 0 auto 0; padding: 30px 50px; background: #FFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.75);
-moz-box-shadow:    0px 0px 13px 0px rgba(0, 0, 0, 0.75);
box-shadow:         0px 0px 13px 0px rgba(0, 0, 0, 0.75);}
.account_form h1 {font-size: 20px; padding-bottom: 20px; font-weight: bold; color:#007DC3}
.account_form h2 {font-size: 16px; padding-bottom: 20px; font-weight: bold; color:#007DC3; font-weight: 100;}
.account_form .submit {width: 100%; cursor: pointer; background: #007dc3; border: none; line-height: 34px; font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #FFF;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
.account_form .submit:hover {background:#0995e4;color: #FFF }
.account_form .extralink {font-size: 12px; text-decoration: none; color: #F89829; line-height: 34px; margin: 30px 0 0; display: block; float: left;}
.account_form .orange_button {float: right; width: 170px; margin: 30px 0 0;}
.account_form .row.left {float: left; width: 48%;}
.account_form .row.right {float: right; width: 48%;}
.account_form .row label {font-size: 10px; display: block; text-transform: uppercase; font-weight: bold; color: #888; letter-spacing: 1px; padding-bottom: 2px;}
.account_form .row select {margin-bottom: 15px;}
.account_form .row.birthdate > div {float: left; margin-right: 10px; padding-bottom: 10px; max-width: 30%;}


/*Dashboard*/
.dashboard #header .link.first {color: #F89829; font-weight: bold;}
.dashboard #header .link.first:hover {color: #FFF;}
.dashboard h1 {font-size: 40px; font-weight: 100;}
.dashboard p {font-size: 12px; line-height: 18px;}
.dashboard .sep {margin:20px 0;}
.dashboard h2 {text-transform: uppercase; padding-bottom: 20px; font-weight: bold; color: #f89829; letter-spacing: 1px; font-size: 13px;}
.dashboard .course_list .entry {padding: 0 0 10px; margin-bottom: 10px;}
.dashboard .course_list .entry .course_status {font-size: 10px; line-height: 20px; float: right; padding: 0 5px; width: auto; margin-bottom: 0;}
.dashboard .course_list .entry a {font-size: 14px; color: #007DC3; font-weight: bold;}
.dashboard .course_list p em {color: #999;}
.dashboard .course_list h2 {color: #F89829}
.dashboard .course_list p em {color: #999;}

.dashboard #completed_courses.course_list .entry .course_status {border:2px solid #7FC639; color: #7FC639; margin: 0 0 0 15px;}
.dashboard #completed_courses.course_list .entry .course_status.warning {border: 2px solid #e89b2f; color: #e89b2f;} 

.dashboard #required_courses.course_list .entry .course_status {border:2px solid #b02e2b; color: #b02e2b}
.dashboard #page_content .blue_button {display: inline-block; padding:  0 15px; margin: 20px auto;}


.course_status {display: inline-block; margin-bottom: 20px; text-transform: uppercase; font-size: 12px; color: #F89829; letter-spacing: 1px; width: 226px; text-align: center; line-height: 30px; border:2px solid #F89829;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear}
.course_status.passed {border:2px solid #7FC639; color: #7FC639}

/*Sidebar*/

#sidebar {width: 230px; float: left;margin: 30px 0 0;}
#sidebar #course_categories {background: #EFEFEF; margin: 0 0 30px;}
#sidebar #course_categories li {padding: 10px 10px; font-weight: 100;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
#sidebar #course_categories li a {display: block;}
#sidebar #course_categories li:hover {background: #DDD;}
#sidebar #course_categories li.current {background: #f89829;}
#sidebar #course_categories li.current a {color:#FFF;}

#sidebar #course_info {background: #EFEFEF; margin-bottom: 50px;}
#sidebar #course_info li {padding: 15px 10px; font-weight: 100; border-bottom: 1px solid #CCC;}
#sidebar #course_info li h4 {font-weight: bold; text-transform: uppercase; font-size: 12px; letter-spacing: 1px; padding-bottom: 5px;}
#sidebar #course_info li.evaluation_method {font-size: 12px; line-height: 18px;}

#sidebar .module {background: #EFEFEF; margin-bottom: 50px;}
#sidebar .module li {padding: 15px 10px; font-weight: 100; border-bottom: 1px solid #CCC;}
#sidebar .module li h4 {font-weight: bold; text-transform: uppercase; font-size: 12px; letter-spacing: 1px; padding-bottom: 5px;}

#sidebar .module.registration li {margin: 0}
#sidebar .module.registration {font-size: 13px;}
#sidebar .module.registration p {margin: 0 0 10px;line-height: 18px; }

#page_content {width: 700px; float: right; margin: 30px 0 0; min-height: 700px; font-size: 14px; line-height: 22px;}
#page_content.fullwidth {width: 100%; float: none;}

#page_content .course_module {width: 23%; margin: 0 2.3% 30px 0; float: left; height: 260px; overflow: hidden; position: relative; padding-bottom: 40px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.35);
-moz-box-shadow:    0px 0px 13px 0px rgba(0, 0, 0, 0.35);
box-shadow:         0px 0px 13px 0px rgba(0, 0, 0, 0.35);}
#page_content .course_module:nth-child(4n) {margin-right: 0;}
#page_content .course_module img {width: 100%; height: auto; opacity: 0.6; display: none;}
#page_content .course_module .inner {padding: 10px 10px;}
#page_content .course_module h2 {font-size: 18px; line-height: 26px; background: #007DC3; width: 100% letter-spacing: 1px; display: block; padding: 10px; font-weight: bold; color: #FFF; text-shadow: 1px 1px 5px rgba(0, 0, 0, 1);}
#page_content .course_module .inner p {font-size: 12px; color: #444; line-height: 18px;}
#page_content .course_module .inner .orange_button,
#page_content .course_module .inner .green_button,
#page_content .course_module .inner .blue_button {position: absolute; bottom: 0; width: 100%; left: 0; border-radius: 0; font-size: 11px;}

#page_content li {font-size: 14px; line-height: 22px; margin-left: 30px; margin-bottom: 3px;}
#page_content ol li {list-style: decimal;}

.single_course #page_content ul li {list-style: disc}

.exam #page_content li {list-style: none;}

#page_content.error {text-align: center;}


/*Exam*/
.exam #page_content h1 {font-size: 30px;}
.exam #page_content h2 {font-size: 20px; font-weight: normal;}
.exam #page_content h3 {text-transform: uppercase; padding-bottom: 20px; font-weight: bold; color: #f89829; letter-spacing: 1px; font-size: 13px;}
.exam #page_content .sep {margin: 30px 0 30px;}
.exam #page_content p {font-size: 14px; line-height: 22px; color: #444}

.exam .question {width: 700px; margin: 0 auto; padding-bottom: 60px;}
.exam .question h4 {color: #007DC3; font-weight: bold; line-height: 25px; font-size: 15px; padding-bottom: 10px;}

.exam .option li {list-style: upper-alpha; font-weight: bold;}
.exam .option li span {font-weight: normal; color: #555;}

.exam .quest_num {margin:0px 0 0 -130px; float: left; font-weight: 100; font-size: 12px; color: #AAA}
.exam .quest_num span {display: inline-block; margin: 0 5px 0 0; background: #888; color: #FFF; width: 30px; text-align: center; line-height: 30px; font-size: 16px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;}

.exam .orange_button {border: none; width: 300px; margin: 0 auto; cursor: pointer;}

#post_test {width: 350px; padding: 30px;}
#post_test p {font-size: 14px; line-height: 22px; margin-bottom: 30px;}

/*Exam Review*/

.exam.review .quest_num span {background: #b2000c}
.exam.review .quest_num.correct span {background: #069b19}
.exam.review .option li.default,
.exam.review .option li.default span {color: #999;}

.exam.review .option li.incorrect,
.exam.review .option li.incorrect span {color: #b2000c; font-weight: bold;}

.exam.review .option li.correct,
.exam.review .option li.correct span {color: #7fc639; font-weight: bold;}


/*Single Course*/
.single_course #page_content h1 {font-size: 30px; padding-bottom: 20px; color: #007DC3}
.single_course #page_content h2 {text-transform: uppercase; padding-bottom: 20px; font-weight: bold; color: #f89829; letter-spacing: 1px; font-size: 13px;}
.single_course #page_content p {font-size: 14px; line-height: 22px; margin-bottom: 20px;}

.single_course.enrolled .orange_button.inline,
.single_course.enrolled .green_button.inline,
.single_course.enrolled .blue_button.inline,
.single_course.enrolled .gray_button.inline {display: inline-block; padding: 0 20px;}
.single_course.enrolled .sep {margin: 30px 0 30px;}
.single_course.enrolled .left {width: 50%; float: left;}
.single_course.enrolled .right {width: 50%; float: right;}
.single_course.enrolled .right p {color: #AAA;}
.single_course.enrolled #page_content .right li {padding: 0 5px; margin: 0 0 5px; background: #EEE; line-height: 24px; font-size: 10px; color: #666; text-transform: uppercase; font-weight: bold; letter-spacing: 1px; list-style: none}
.single_course.enrolled #page_content .right li a {font-weight: 100; padding-left: 10px; text-transform: capitalize;}
.single_course.enrolled #page_content .right li span {display: inline-block;float: right; color: red;}
.single_course.enrolled #page_content .right li span.passed {color: #7FC639}

.single_course.evaluation form {}
.single_course.evaluation form .row {}
.single_course.evaluation form .row > label {display: block; padding: 15px 0 3px;}
.single_course.evaluation form .row textarea {width: 80%; height: 120px; border: 1px solid #CCC; padding: 5px;}
.single_course.evaluation form .row input[type="text"] {padding: 5px;}
.single_course.evaluation form .row input[type="submit"] {
	width: 400px; margin:30px 0; cursor: pointer; background: #007dc3; border: none; line-height: 34px; font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #FFF;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	transition: all .2s linear;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	-o-transition: all .2s linear;
}

#pre_test {width: 350px; padding: 30px;}
#pre_test p {font-size: 14px; line-height: 22px; margin-bottom: 30px;}
#pre_test_essay {width: 350px; padding: 30px;}
#pre_test_essay p {font-size: 14px; line-height: 22px; margin-bottom: 30px;}




/*Top Menu*/
#top_menu {background: #007DC3}
#top_menu .wrapper {height: 40px;}
#top_menu span {display: block; float: left; line-height: 40px; font-size: 11px; color: #c6e1f0; text-transform: uppercase; letter-spacing: 1px; font-weight: bold; padding-right: 30px; border-right: 1px solid #1297e2}
#top_menu a {color: #FFF; display: block;float: left; padding: 0 30px; line-height: 40px; text-decoration: none; font-size: 12px; font-weight: 100; border-right: 1px solid #1297e2; border-left: 1px solid #0469a1;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
#top_menu a:first-child {border-left: none;}
#top_menu a.current {background: #055e90;}
#top_menu a:hover {background: #055e90}


input.text {width: 97%; height: 28px; padding: 0 1%; border: 1px solid #CCC;margin-bottom: 10px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;}



#footer {background: #005382; margin: 50px 0 0; padding: 30px 0; color: #d6d6d6; font-weight: 100; letter-spacing: 1px; font-size: 14px; line-height: 20px;}
#footer h4 {color: #FFF; font-size: 16px; letter-spacing: 1px;}
#footer .mod {width: 310px; float: left; cursor: pointer; position: relative;}
#footer .mod2 {margin: 0 15px;}
#footer .mod3 {float: right;}
#footer .mod1 img {width: 260px; }

/*Registration Lightbox*/

.registration_lightbox {width: 300px; padding: 30px;}
.registration_lightbox .submit {width: 100%; cursor: pointer; background: #007dc3; border: none; line-height: 34px; font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #FFF;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
transition: all .2s linear;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;}
.registration_lightbox h2 {padding: 0 0 10px; font-size: 22px; color: #007DC3; font-weight: bold;}
.registration_lightbox p strong {text-transform: uppercase; font-size: 12px; color: #333}
.registration_lightbox p {line-height: 30px; border-bottom: 1px solid #CCC; font-size: 14px; color: #888}
.registration_lightbox p.description {line-height: 24px; text-align: center; font-size: 13px; padding: 0 0 20px;}
.registration_lightbox form {margin: 10px 0 0;}
.registration_lightbox img {width: 200px; height: auto; margin: 30px auto 0; display: block;}



#confirmation_lightbox {width: 390px; padding: 30px;}
#confirmation_lightbox h2 {padding: 0 0 10px; font-size: 22px; color: #007DC3; font-weight: bold;}
#confirmation_lightbox p {margin-bottom: 20px;}
#confirmation_lightbox .green_button {width: 48%; float: left;}
#confirmation_lightbox .orange_button {width: 48%; float: right;}





/*Admin Forms*/

/*Account Form*/

.admin_form {margin: 0 auto 0; padding: 50px 0; width: 440px; float: left;}
.admin_form h1 {font-size: 20px; padding-bottom: 20px; font-weight: bold; color:#007DC3}
.admin_form h2 {font-size: 16px; padding-bottom: 20px; font-weight: bold; color:#007DC3; font-weight: 100;}
.admin_form p {font-size: 14px; padding: 30px 0; font-style: italic;}
.admin_form .orange_button {width: 170px; margin: 30px 0 0; border: none; cursor:pointer;}
.admin_form .row.left {float: left; width: 48%;}
.admin_form .row.right {float: right; width: 48%;}
.admin_form .row label {font-size: 10px; display: block; text-transform: uppercase; font-weight: bold; color: #888; letter-spacing: 1px; padding-bottom: 2px; margin: 15px 0 0;}
.admin_form .row input[type='text'] {border: 1px solid #CCC; padding: 3px; line-height: 20px;}
.admin_form .row textarea {border: 1px solid #CCC; padding: 3px; line-height: 16px; width: 430px;}
.admin_form .row .option {padding: 10px 0;}
.admin_form .row .option li {font-size: 12px; padding: 0 0 3px;}
.admin_form .row .listfile {font-size: 12px; padding: 10px 0 0 30px;}


#questions {width: 500px; float: right; padding: 50px 0 0;}

#question_add {width: 400px;}
#question_add label {font-size: 10px; display: block; text-transform: uppercase; font-weight: bold; color: #888; letter-spacing: 1px; padding-bottom: 2px; margin: 15px 0 0;}
#question_add #Question_content {width: 390px; height: 60px; border: 1px solid #CCC; padding: 3px; line-height: 16px; }
#question_add .row input[type='text'] {width: 390px; border: 1px solid #CCC; padding: 3px; line-height: 20px;}
#question_add .row input[type='radio'] {width: 18px; margin: 5px 0; display: inline;}
#question_add .row {font-size: 12px; color: #777}
#question_add .orange_button {width: 170px; margin: 30px 0 0; border: none; cursor:pointer;}

/*#question_add.edit {width: 400px; height: 645px; overflow: hidden;}*/

.orange_button.add {display: inline-block; padding: 0 20px; float: right;}
.green_button.add {display: inline-block; padding: 0 20px; float: right; margin-right: 20px;}



#report {padding: 40px 0;}
#report h3 {font-size: 16px; font-weight: bold;}
#report .entry {border-bottom: 1px solid #CCC; padding: 15px 0; font-size: 12px;}
#report .entry .completed {padding: 7px 0 0; font-weight: bold; color: #7FC639}
#report .entry .indent {padding: 0 0 0 50px; line-height: 18px;}

#report .entry .in_progress {padding: 15px 0 0; font-weight: bold; color: #F89829;}
#report .entry .student .name {width: 25%; display: inline-block;}
#report .entry .student .email {width: 25%; display: inline-block;}
#report .entry .student .date {width: 25%; display: inline-block; color: #999; font-style: italic;}
#report .entry  .blue_button {display: inline-block; padding: 0 10px; margin: 30px 0; line-height: 28px; height: 28px; font-size: 11px;}


/*TEMPORARY*/

#top_menu a.category_2 {display: none;}