/******************/
/* General Elements */
/******************/

h1, h2, h3 {
    color: #573344;
}

blockquote {
    padding-left: 2em;
    border-left: 6px solid #573344;
}  

/******************/
/* General Classes */
/******************/

.alt-orange {
	color: #F39B3E !important;
}

/* classes added by Quill editor */
.ql-editor {
    min-height: 264px;
    overflow-y: scroll;
  resize: vertical;
}

.ql-align-center {
    text-align: center;
}

.ql-align-right {
    text-align: right;
}

.rtl, .ql-direction-rtl {
    direction: rtl; 
}

.ql-size-small {
  font-size: .8em;
}

.ql-size-large {
  font-size: 1.2em;
}

.ql-size-huge {
  font-size: 1.4em;
}

.trunccontent {
  max-height: 600px;
  overflow: hidden;
}
.trunccontent100 {
  max-height: 100px;
  overflow: hidden;
}
.showmore {
  margin-top: 1.3em;
}
.showmorelink {
  padding: 8px;
  border: 1px solid #CCC;
}
.showmorelink:hover {
  font-weight: bold;
}

/******************/
/* Page Sections */
/******************/


.banner {
    height: 60px; 
    margin: 0px; 
    transform: translateY(0px); 
    left: 300px; 
    right: 0px;
}

.bannercontainer {
  background-image: url("/images/topsky.jpg");
  background-color: #000000;
  background-size: cover;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}

.banner1 {
  height: 120px;
  padding-top: 12px;
  flex-wrap: nowrap;
}

.banner1item {
  text-align: center;
  margin-left: 12px;
}
.donatebutton {
  background-color: rgb(0, 184, 245)
}
.banner1item .v-btn {
  text-transform: inherit;
  font-weight: bold;
}
.banner1item:hover {
    font-weight: bold;
    opacity: .9;
}
.banner1item span.v-btn__content {
  font-size: 1.4em;
}

#banner2 {
    padding-top: 12px;
}

.banner2item {

}
.banner2item:hover {
    font-weight: bold;
    opacity: .9;
}
.banner2item span.v-btn__content {
  font-size: 1.4em;
}

.activebanneritem {
    border-bottom: 4px solid #f5b882;
}

#sitelogo {
  z-index: 0;
}
#sitelogo:hover {
    cursor: pointer;
}

.v-sheet.v-footer {
    left: 0px;
    right: 0px;
    bottom: 0px;
    padding-top: 12px;
    padding-bottom: 12px;
  background-color: rgba(87, 51, 68, 0.99) !important;
}

.appBanner .selectlang {
    margin-right: 8px;
    margin-left: 8px;
    color: white;
}
.selectlang:hover {
  font-weight: bold;
  cursor: pointer;
}
a.bannerlink {
    font-size: 1.2em;
    color: white;
    font-weight: bold;
}
.bannerlink:visited { color: white; }

.v-toolbar__items {
    padding-top:10px;
}
.footer {
    left: 0px;
    right: 0px;
    bottom: 0px;
    height: 60px;
    padding-top: 12px;
    padding-bottom: 12px;
}
.v-footer a, .v-footer a:visited {
  color: #DAD6C9 !important;
  text-decoration: none;
}
.v-footer a:hover {
  font-weight: bold;
  text-decoration: none;
  color: #FFF;
}
.footer span { 
  color: #DAD6C9;
}
.footeraddress span { 
  color: #DAD6C9;
  display: inline-block;
  vertical-align: middle;
}
.foottitle {
  font-weight: bold;
  font-size: 1.1em;
}
.footeraddress > div, .footerabout > div, .footercta > div {
  padding-bottom: 12px;
}
.footersocial  {
  margin-left: 0 !important;  
  margin-right: 6px !important;

}

.footersocial i {
  width: 24px;
}
.footersocial a {
  margin-right: 24px;
}

.socialicon {
  width: 30px;
  height: 30px;
  margin-right: 12px;
}

.pagetop {
    background-size: cover;
}

.pagetop h1 {
	font-family: "poppins", sans-serif;
    font-size: 3.3rem;
    font-weight: 700;
    line-height: unset;
    letter-spacing: unset;
    color: #FFF;
}
.pagetop .pagelead {
    font-family: "Lato", sans-serif;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: unset;
    letter-spacing: unset;
    color: #FFF;
    width: 100%;
}

.pagetop {
	background-color: #777;
}

@media(max-width: 960px){
  .pagetop h1 {
    font-size:2.25rem
  }
}

.EditorActionBar {
  margin-top: 36px;
}

.feature {
    font-size: 20px;
}

.navsidebar {
    padding: 12px 12px;
    border-right: 3px #ccc;
  top: 0 !important;
}

.navlesson {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.navprepend {
  background-image: url("/images/topsky.jpg");
  background-color: #000000;
  background-size: cover;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;  
  height: 168px;
  padding-top: 12px;
  padding-left: 12px;
  padding-right: 6px;
  margin: -12px; 
  position: relative;
}

.navprepend img {
  margin-top: 24px;
  margin-left: 52px;
}

.prependbtn {
  position: absolute !important;
  right: 12px;
  bottom: 12px;
}

.v-navigation-drawer__content {
  padding-top: 10px;
}

.materialoptional {
  color: rgba(0,0,0, .6);
}

.v-list-item__icon {
  margin-right: 0 !important;
}

#alertcontainer {
    position: absolute;
    top: 80px;
    z-index: 10;
    width: 60%;
    max-width: 600px;
}

.isLoading {
  min-height: 400px;
}

/******************/
/* Module Specific Elements */
/******************/

.contentblock {

}
.contentblock img {
  margin: 12px;
}
.contentcard {
  max-width: 498px !important;
}
.contentcard .videocontainer {
  text-align: center;  
}
.contentcardstitle {
  text-align: center;
}

.videocontainer, .imagecontainer {
  text-align: center;
}

.courselead .videocontainer, .courselead .imagecontainer {
  min-width: 300px;
  min-height: 180px;
}
.courseenrollbtn {
  margin-top: -20px;
}
.courseenrollbtn .v-btn__content {
  font-size: 1.3em;
}
.courselistingtitle {
  display: block !important;
  padding-top: 46px;
  text-align: center;
}

.coursedescription {
    padding-right: 20px;
    font-size: 1.4rem;
    line-height: 24px;
    padding-top: 12px;
}

.coursesummary {
  font-size: 1.4rem;
  padding-top: 12px;
}

.CourseLinkList {
  	line-height: 2em;
}

.coursestats {
  background-color: #333;
  color: #FFF;
  font-weight: bold;
  font-size: 1.4em;
  padding-bottom: 8px;
  margin-bottom: 24px;
}
.coursestats .v-icon {
    color: white !important;
    margin-right: 6px;
}

.navlessonvisited {
  color: #000;
}
.navlessonquizzed {
  color: #363 !important;
}
.navlessoncurrent {
  font-weight: bold;
}

.quizdescription, .examdescription {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 1.3em !important;
    border-bottom: 1px solid #ccc;
}

.quizquestionwrapper, .examquestionwrapper {
  margin: 0 !important;
  padding: .8em;
  border-bottom: 1px solid #ccc;
}

.quizquestion, .examquestion {
  display: block;
}

.quizanswer, .examanswer {
  tab-size: 4;
}

.User .pagetop {
	background: 60% 66% / 100% url("/images/luca-bravo-_WiRAWxAhtg-unsplash.jpg") no-repeat
}
.User .profilelabel {
  max-width: 260px;
  font-weight: bold;
}
.edituserprofile {
    width: 90%;
}
.User .profilevalue {
	min-width: 260px;
}
.User .profilefield {
	min-width: 260px;
}

.discussioncard {
  max-width: 800px !important;
  min-width: 60%;
}

.discussionhighlight {
  background-color: #EEE !important;
}

.discussionquestion  {
  font-size: 1.2em;
  font-weight: bold;
  max-width: 800px !important;
  border-top: 1px solid #ccc;
  color: #573344;
  padding-top: 16px !important;
}

#button-reg-clear {
  display: none;
}
  

/******************/
/* Admin Elements */
/******************/

.LMSAdmin h1 {
    font-size: 36px;
    color: #222;
}
.LMSAdmin h2 {
    font-size: 28px;
    color: #222;
}
.LMSAdmin h3 {
    font-size: 16px;
    color: #222;
}
.LMSAdmin h4 {
    font-size: 12px;
    color: #222;
}


.admintable {
    width: 100%;
}

.actionrow button {
    margin-left: 1rem;
}

.v-messages__message {
    margin-bottom: 12px;
}

.removeconfirmation {
    padding: 12px;
}

.removeconfirmation .label {
    width: 260px;
    font-weight: bold;
}

.removeconfirmation .row{
    margin-top: .6rem;
    margin-bottom: .6rem;
}

.infotab .row{
    margin-top: .6rem;
    margin-bottom: .6rem;
}
.infotab .label {
    width: 260px;
    font-weight: bold;
}
.infotab .v-card__text {
    margin: 0.8rem;
}

.coursecard {
    padding: 18px;
    max-width: 642px !important;
}

.coursecard .v-card__title {
  word-break: break-word;
}

.lessoncard {
    padding: 18px;
}

.lessoncard .v-card__title {
  white-space: normal;
  word-break: break-word;
  padding-left: 0;
  padding-bottom: 24px;
}

.coursesummarywrapper {
   background-color: #F8F7F4;
  font-size: 1.3em;
}
.lessonlistingparent, .courselessonblock {

  padding: 18px;
}
.lessonlisting {
  
}
.lessondescription2 {
  margin-left: 0;
  margin-right: 0;
}
.courselessonblock { 

  border: 1px solid #ccc;
  
}
.lessoncardparent {
  width: 100% !important;
}

.infotab .row{
    margin-top: .6rem;
    margin-bottom: .6rem;
}
.profileform .row{
    width: 90%;
}
.label {
    width: 260px;
    font-weight: bold;
}
.certificationscontainer {
  padding-top: 16px;
  margin-top: 16px;
  border-top: 1px solid #ccc;
}
.certificationscontainer, .enrollmentcontainer {
    border-bottom: 1px solid #ccc;
}
.enrollmentcontainer .label, .certificationscontainer .label {
    margin-left: 1rem;
}
.isinstructorcontainer {
    margin-left: 0;
    margin-top: 26px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 26px;
}
.classform .row {
    height: 50px;
}
.classform .label, .enrollmentcontainer h3, .certificationscontainer .label {
    padding-top: 12px;
}

.classform .v-text-field {
    padding: 0;
    margin: 0;
}

.addLabel {
    margin-top: 12px;
    font-size: 1.3em;
    padding-top: 8px;
}

.classrow, .certsrow {
   margin-left: 26px;
}

.classrow .v-card__title {
  padding-left: 0;
}

.enrollmentrow {
  margin-bottom: 32px;
}
.enrollmentrow .row {
  margin-left: 0;
}
.enrollmentrow .v-input {
  max-width: 300px;
}
.editEnrollmentButton {
 
}
.editEnrollmentButton button, .editCertificationButton button {
  margin-left: 12px;
}

.enrollmentcourse {
  margin-left: 0;
}

.note {
    margin-bottom: 12px;
}

.actionrow button {
    margin-left: 1rem;
}

.searchrow {
    margin-top: 0;
    margin-bottom: 1rem;
}


.manageusericons button, .managevcrmicons button {
    margin-left: 4px;
}

.manageusericons {
  white-space: nowrap;
}

.admintitlebar {
    margin-bottom: 24px;
}

.admintitlebar h1 {
    color: #444;
}
.admintitlebar button, .admintitlebar a {
    margin-left: .8rem;
    
}
#statusMessagesBar {
    height: 60px;
}
.adminactionsbar {
    max-width: 600px;
    /* max-width: 280px; */
    /* min-width: 25%; */
}

.dtableactionicon {
    display:inline-block;
    padding-left: 42px;
    text-align:right;
    cursor:pointer
}

.CodeMirror {
  resize: vertical;
      overflow-y: scroll;
}