.top05 { margin-top: 0.5%; }
.top1 { margin-top: 1%; }
.top2 { margin-top: 2%; }
.top3 { margin-top: 3%; }
.top4 { margin-top: 4%; }
.top5 { margin-top: 5%; }
.top6 { margin-top: 6%; }
.top7 { margin-top: 7%; }
.top8 { margin-top: 8%; }
.top9 { margin-top: 9%; }
.top10 { margin-top: 10%; }
.top15 { margin-top: 15%; }
.top17 { margin-top: 17%; }
.top30 { margin-top: 30%; }

.bottom05 { margin-bottom: 0.5%; }
.bottom1 { margin-bottom: 1%; }
.bottom2 { margin-bottom: 2%; }
.bottom3 { margin-bottom: 3%; }
.bottom4 { margin-bottom: 4%; }
.bottom5 { margin-bottom: 5%; }
.bottom6 { margin-bottom: 6%; }
.bottom7 { margin-bottom: 7%; }
.bottom8 { margin-bottom: 8%; }
.bottom9 { margin-bottom: 9%; }
.bottom10 { margin-bottom: 10%; }
.bottom15 { margin-bottom: 15%; }
.bottom17 { margin-bottom: 17%; }
.bottom30 { margin-bottom: 30%; }

.vam {
    vertical-align: middle !important;
}

.text-justify {
    text-align: justify;
}

.text-small-75 {
    font-size: 75%;
}

.text-small-80 {
    font-size: 80%;
}

.text-small-85 {
    font-size: 85%;
}

.text-small-90 {
    font-size: 90%;
}

.text-small-95 {
    font-size: 95%;
}

.text-big-105 {
    font-size: 105%;
}

.text-big-110 {
    font-size: 110%;
}

.text-big-115 {
    font-size: 115%;
}

.text-big-120 {
    font-size: 120%;
}

.text-big-125 {
    font-size: 125%;
}

.text-big-130 {
    font-size: 130%;
}

.text-big-140 {
    font-size: 140%;
}

.text-big-150 {
    font-size: 150%;
}

.text-big-200 {
    font-size: 200%;
}


.indent-margin5 { 
    margin-left: 5px; 
}

.indent-margin10 { 
    margin-left: 10px; 
}

.indent-margin20 { 
    margin-left: 20px; 
}

.indent-r-margin5 { 
    margin-right: 5px; 
}

.indent-r-margin10 { 
    margin-right: 10px; 
}

.indent-r-margin20 { 
    margin-right: 20px; 
}

.no-wrap {
    white-space: nowrap;
}

.no-topmargin {
    margin-top: 0px;
}

.no-bottommargin {
    margin-bottom: 0px;
}

.no-padding {
    padding: 0px !important;
}

.no-toppadding {
    padding-top: 0px !important;
}

.no-bottompadding {
    padding-bottom: 0px !important;
}

.password-short, .password-invalid {
    background-color: red;
}

.password-weak {
    background-color: orange;
}

.password-medium {
    background-color: green;
}

.password-strong {
    background-color: green;
}

.bs-center-block {
    margin: 0 auto;
}

.red {
    color: red;
}

.yellow {
    color: #f39c12 !important;
}


.launch-electa-holder {
    text-align: center;
    margin-top: 0px;
}

    .launch-electa-holder .container {
        margin-top: 0px; 
        padding: 10px; 
        line-height: 18px; 
        font-size: 14px;        
    }

    .launch-electa-holder .item {
        margin-top: 40px;        
    }
    /*
        .launch-electa-holder .item a {
            color: blue;
        }
        */

    .launch-electa-holder .need-help {
        margin-top: 40px;        
    }

    .launch-electa-holder .need-help .help-icon {
        font-size: 250%;
    }


.dont-break-out {
  /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
}

@supports (-webkit-appearance:none) {
    .dont-break-out {
        word-break: break-word;
    }
}

video#v-player {
    max-width: 100%;
}

.pn-module {
    border-radius: 0px; 
    width: auto; 
    margin-left: -15px; 
    margin-right: -15px; 
    border-left: 0px !important; 
    border-right: 0px !important;
}

.pn-module .panel-heading, 
.pn-module .box-header {
    border-radius: 0px;
}

img.discussion-avatar {
    border-radius: 50%;
    width: 64px;
    height: 64px;
}

.tour-backdrop {
    opacity: 0.5 !important;
}

.popover.right > .arrow::after {
    border-right-color: #f3961c;
}
.popover.left > .arrow::after {
    border-left-color: #f3961c;
}
.popover.top > .arrow::after {
    border-top-color: #f3961c;    
}
.popover.bottom > .arrow::after {
    border-top-color: #f3961c;
    border-bottom-color: #f3961c;
}

.tour.popover {
    color: #fff;
    background-color: #f3961c;
    /*font-family: "Roboto",sans-serif !important;*/
    font-family: "Source Sans Pro","Helvetica Neue",Helvetica,Arial,sans-serif;
    max-width: 100%;
    /*width: 30vw;*/
}

.popover-title {
    padding: 30px 30px 15px 30px;
    background-color: transparent;
    border-bottom: none;
    font-weight: bolder;
    font-size: 120%;
}

.popover-content {
    padding: 15px 30px 30px 30px;
    font-weight: normal;
}

.popover-navigation {    
    padding: 15px 30px 20px 30px !important;
}

.img-profile-avatar {
    width: 96px;
    border-radius: 50%;
}

.courseimage {
    margin: auto;
    width: 100%;
}

.quizimage {
    margin: auto;
    width: 100%;
}


.monthly-calendar-event {
    height: 24px;
    line-height: 19px;
    background-color: #808080;
    color: white;
    white-space: nowrap;
    overflow: hidden;
    margin: 2px;
    padding: 2px;
    border-radius: 3px;
    font-size: 85%;
}
    .monthly-calendar-event.cancelled {        
        background-color: #e85a5a;
    }

.monthly-calendar-see-more-lnk {
    margin-right: 4px;
}
.red-arrow {
    background-image: url("/images/homework_moved.png");
    background-position: 0% 0%;
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: no-repeat;
    box-sizing: border-box;
    color: rgb(51, 51, 51);
    font-family: "Open Sans", "Roboto", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    font-size: 13px;
    font-weight: 400;
    height: 100%;
    line-height: 20px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    background-size: cover;
    top: 0px;
    width: 100%
}

.modal {
    overflow: auto !important;
}