/* main css */ 
    body {
      font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
      color: #000;
    }

    h2 {
      font-size: 1.4rem;
    }

    h3 {
      font-size: 1.2rem;
    }


    /* overrides */
    .form-control {
      border-radius: 0px;
    }


    .form-control:focus {  
      border-color: #80bdff;      
      box-shadow: none;
    }

    .btn, input {
      border-radius: 0px;
    }

    .container-fluid {
      padding-left: 0px;
      padding-right: 0px;
    }


    .error-text {
        color: #d32f2f !important;     
    }

/* modal forms */
.modal-form .form-group label {
  font-weight: bold;
  margin-bottom: 2px;
}

.FieldIdentifier label {
    margin-left: 10px;
}

    /* colors */
    .logo-blue {
      color: #325eb4;
    }

    .dark-gray {
      color: #616161;
    }

    .color-red {
      color: #d32f2f;
    }


    .color-green {
      color: #048d14;
    }

    .color-lightblue {
        color: #03a9f4;
    }

    /* buttons */

    .btn-wrap {
      white-space: normal;
    }

    .btn-blue {
      color: #fff;
      background-color: #325eb4;
      border-color: #325eb4; 
    }

    .btn-blue:hover {
      color: #fff;
      background-color: #2a509a;
      border-color: #2a509a;
    }

    .btn-blue:not(:disabled):not(.disabled).active, .btn-blue:not(:disabled):not(.disabled):active, .show>.btn-blue.dropdown-toggle {
      color: #fff;
      background-color: #325eb4;
      border-color: #325eb4;
    }    

    .btn-blue.focus, .btn-blue:focus {      
      box-shadow: none !important;
    }

/* Home Page - Modules */

  .section-box.module {
    padding-bottom: 5px;
    padding-top: 10px;
    margin-bottom: 10px;
  }

  .col-module {
    margin-bottom: 10px;    
  }

  .module-1 .e-blue {
    color: #325eb4 !important;
  }

  .module-1 .e-mod-btn {
    background-color: #325eb4 !important;
    border-color: #325eb4 !important;
  }

    .module-1 .e-mod-btn.focus, .module-1 .e-mod-btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.5);
  }

  .module-1 .e-mod-btn:not(:disabled):not(.disabled).active:focus,.module-1 .e-mod-btn:not(:disabled):not(.disabled):active:focus, .module-1 .show>.e-mod-btn.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.5);
  }  

  .e-orange {
    color: #ff9820 !important;
  }

  .module-2 .e-mod-btn {
    background-color: #ff9820 !important;
    border-color: #ff9820 !important;
  }  

  .module-2 .e-mod-btn.focus, .module-2 .e-mod-btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(255, 170, 66, 0.64);
  }

  .module-2 .e-mod-btn:not(:disabled):not(.disabled).active:focus,.module-2 .e-mod-btn:not(:disabled):not(.disabled):active:focus, .module-2 .show>.e-mod-btn.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(255, 170, 66, 0.64);
  }  
    
  .e-green {
    color: #388E3C !important;
  }

  .module-3 .e-mod-btn {
    background-color: #388E3C !important;
    border-color: #388E3C !important;
  }  


  .module-3 .e-mod-btn.focus, .module-3 .e-mod-btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(40,167,69,.5);
  }

  .module-3 .e-mod-btn:not(:disabled):not(.disabled).active:focus, .module-3 .e-mod-btn:not(:disabled):not(.disabled):active:focus, .module-3 .show>.e-mod-btn.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(40,167,69,.5);
}


  .e-purple {
    color: #8b268e !important;
  }

  .module-4 .e-mod-btn {
    background-color: #8b268e !important;
    border-color: #8b268e !important;
  }  

  .module-4 .e-mod-btn.focus, .module-4 .e-mod-btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(139, 38, 142, 0.53);
  }

  .module-4 .e-mod-btn:not(:disabled):not(.disabled).active:focus, .module-4 .e-mod-btn:not(:disabled):not(.disabled):active:focus,.module-4 .show>.e-mod-btn.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(139, 38, 142, 0.53);
}


  .e-darkgray-btn {
    background-color: #757575 !important;
    border-color: #757575 !important;
  }  

  .e-darkgray-btn.focus, .e-darkgray-btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(144, 142, 144, 0.53);
  }

  .e-darkgray-btn:not(:disabled):not(.disabled).active:focus, .e-darkgray-btn:not(:disabled):not(.disabled):active:focus, .show>.e-darkgray-btn.dropdown-toggle:focus {
     box-shadow: 0 0 0 0.2rem rgba(144, 142, 144, 0.53);
  }






  .module-info {
    line-height: 1.1;
    font-size: .9em;
  }

  .module-title {
    font-size: 1.3em !important;
    font-weight: 400;
    margin-bottom: 5px;    
  }

  .module-grade {
    font-size: 1.3em;    
    padding: 2px 5px;
    border-radius: 2px;
    display: inline-block;
    margin-top: 1px;
    color: #fff !important;
    padding-bottom: 0px;
    margin-bottom: 5px;
  }

  .module-sub {
    font-weight: 300;
    font-size: .9em;
    color: #9e9e9e;

  }

  .module-lesson {
    font-size: 1.1em;
    color: #111 !important;    
  }

  .module-class {
    line-height: 1.3; 
    color: #111;
  }

  .module-rpt-btn {
    border: solid #ccc 1px;
  }

  .module-border-1 {
    border-right: solid #ccc 1px;
  }

  .module-border-2 {
    border-right: solid #ccc 1px;
  }

  .module-1 .module-grade {
    background-color: #5278c1;
  }

  .module-1 a {
    color: #325eb4 !important;
  }

  .module-1 a:hover {
    text-decoration: none;
    color: #051c34;
  }


  .module-2 .module-grade {
    background-color: #ff9820;
  }

  .module-2 a {
    color: #f77d00 !important;
  }

  .module-2 a:hover {
    text-decoration: none;
    color: #051c34;
  }


  .module-3 .module-grade {
    background-color: #388E3C;
  }

  .module-3 a {
    color: #388E3C !important;
  }

  .module-3 a:hover {
    text-decoration: none;
    color: #051c34;
  }


  .module-4 .module-grade {
    background-color: #8b268e;
  }

  .module-4 a {
    color: #8b268e !important;
  }

  .module-4 a:hover {
    text-decoration: none;
    color: #051c34;
  }




  .module-more {
    margin-bottom: 8px;
    font-size: .8em;
    line-height: 1.3;
    color: #9e9e9ee0;
    display: none;
    border-bottom: dotted #ccc 1px;
    padding-bottom: 8px;
  }

  .module-more a {
    font-size: 1.4em;
  }

@media (max-width: 575.98px) { 

  .module-border-1 {
    border-right: none;
    border-bottom: none !important;

  }

  .module-border-2 {
    padding-bottom: 8px;
    border-bottom: 1px #ccc dotted;
  }

  .hide-module-info {
    display: none;
  }

  .module-more {
    display: block;
  }

}

@media (max-width: 767.98px) { 


  .module-border-1 {    
    border-bottom: 1px #ccc dotted;
  }

  .module-border-2 {
    border-right: none;
    border-bottom: 1px #ccc dotted;
  }

 }

 @media (min-width: 576px) { 

  .hide-module-info {
    display: block !important;
  }

 }


/* End Home Page - Modules  */



/* Assessments */

.assessment-title {
  font-size: 1.2em; 
  font-weight: bold; 
  margin-bottom: 5px; 
  margin-top: 5px; 
  text-transform: uppercase;
}

.assessment-box {
  padding: 5px; 
  border: solid #84d9ff 1px; 
  margin-top: 10px;
  margin-bottom: 10px;
}

.assessment-part {
  font-size: 1.1em; 
  font-weight: bold; 
  color: #fb8c00; 
  margin-top: 5px;
}

.assessment-dates {
  font-size: .85em; 
  line-height: 1.3em; 
  font-style: italic;
}

.assessment-sections {
  font-size: .8em; 
  margin-top: 4px; 
  margin-bottom: 10px;
  font-weight: bold
}

.assessment-status {
  font-weight: normal
}

.assessment-icon {
  margin-left: 6px;
}

/* End Assessments */


    /* sign in css */
    .sign-in-body {
        background-color: #efefef;
    }

    .sign-in-body a {
      color: #d32f2f;
    }

    .sign-in-error {
        color: #d32f2f;
        font-weight:bold;
    }

    a.btn {
        color: #fff;
    }

    .sign-in-left, .sign-in-right {
      position: relative;
      min-height: 100vh;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 30px;
    }

    .sign-in-right {
      background-color: #fff;
    }    

    .sign-in-box {
      width: 400px;
    }

    .sign-in-box h2 {
      font-weight: 300;
    }

    .sign-in-box h3 {
      font-weight: 300;
      color: #777;
      margin-bottom: 40px;
    }    


    .sign-in-logo {
      max-width: 200px;
    }

    .sign-in-letter {
      font-size: 1.3em;
    }




.page-body-wrapper {
    /*margin-top: 10px;*/
    padding-top: 15px;
    border-top: solid #ccc 1px;
    min-height: calc(100vh - 150px);
    background: #eff3f5; /*alternate bg f7f6f3*/

}


.section-box {
  padding: 20px 20px;  
  border: solid #ccc 1px;
  background-color: #fff;
  margin-bottom: 30px;
  color: #616161;

}

.section-box h3 {
  font-size: 1em;
  color: #000;
}


.footer {
  background: #eff3f5;
  font-size: .8em;
}

/* nav items */

.page-header {
  font-size: 1.2em;
  font-weight: bold;  
  padding-bottom: 10px;
  padding-top: 5px;  
}

.page-header .icon {
    margin-right: 6px;
    color: #325eb4;
}


.navbar-nav {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}

.nav-item {
    flex: 1 1 auto;
    position: relative;

}

.nav-link {
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: .7px;
    font-weight: 500;
    color: #656d75;
    height: 46px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border: 1px #dee2e6 solid;    
    border-right-width: 0;
}

.nav-item:nth-last-child(2) .nav-link {
    border-right-width: 1px;
}

.navbar-toggler {
  border: 0px;
}    


.nav-link .icon {
    margin-right: 8px;
    color: #325eb4;
}

.nav-item.active .nav-link {
    background-color: #fff;
    background-image: linear-gradient(to right, #2196f3 0%, #325eb4 100%);
    background-repeat: repeat-x;
    border-width: 0;
    color: #fff !important;
}

.nav-item.active .nav-link .icon {    
    color: #fff;
}


.navbar-brand-wrapper {
    width: 380px;
    height: 70px;
}
.navbar-menu-wrapper {
    color: #fff;
    padding-left: 15px;
    width: calc(100% - 380px);

}

.nav-logo {
  max-width: 160px; margin-right: 20px;
}


.header-right {
  font-size: .9em;
  color: #656d75;
  font-weight: 300;
  flex-direction: row-reverse;
}

.header-right a {  
  color: #656d75;  
}

.header-right a:hover {  
  color: #325eb4;  
  text-decoration: none;
  font-weight: 500;
}

.header-right .icon {
    margin-right: 2px;
    color: #325eb4;
}

.nav-title {
  font-size: 22px; 
  padding-top: 4px; 
  font-weight: 400;
}

.nav-sign-out {
  display: none;
}

.navbar .width100 {
  width: 100%;
}

/* nav responsive */

/* lg */
@media (max-width: 991.98px) { 
  .nav-link .icon {
    display: none;
  }

  .navbar .say-hello {
    display: none;
  }
 }

/* md */
@media (max-width: 767.98px) {
  .nav-title {
    display: none;
  }

  .navbar-brand-wrapper {
    width: 180px;
    height: 50px;
  }
  .navbar-menu-wrapper {    
    padding-left: 15px;
    width: calc(100% - 180px);
  }

  .nav-logo {
    max-width: 140px; margin-right: 20px;
  }

  .header-right {
    display: none !important;
  }

  .page-body-wrapper {
    margin-top: 0px;
  }

  .nav-link {
     border-right-width: 1px;
     border-bottom-width: 0px;
  }

  .nav-item:last-child .nav-link {
    border-right-width: 1px;
    border-bottom-width: 1px; 
  }

  .nav-link .icon {
    display: block;
  }  

  .nav-sign-out {
    display: block;
  }

}
/* end nav */


/* forms */

.form-right .form-control-label {
    display: flex; align-items: center;
}

@media (min-width: 576px) {
  .form-right .form-control-label {
    justify-content: flex-end;
  }
}
/* accordian overrides */

  .gumpp-ol {
    margin-left: 8px;
    padding-left: 8px;
  }

  .gumpp-ol li {
    padding-bottom: 8px;
  }

  .e-accordian .card-header {
    padding: .5rem .25rem;    
    border-bottom: 0px;
    background-color: #2196f3;
    border-radius: 0px !important;
  }

  .e-accordian .card-header:first-child {
    border-radius: 0px !important;
  }

  .e-accordian .card {
    border-radius: 0;
    border: solid  #2196f3 1px;
    margin-bottom: 8px;
  }

  .e-accordian .btn-link {
    width: 100%;
    word-wrap: normal;
    text-decoration: none;
    font-weight: bold;
    white-space: normal;
    text-align: left;
    color: #fff;

  }

  .e-accordian .icon {
    margin-right: 4px;
  }

.embed-containerV { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-containerV iframe, .embed-containerV object, .embed-containerV embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }