/* navbar */
.skin-blue .main-header .navbar {
    background-color: #3F51B5;
}

.skin-blue .main-header .logo {
    background-color: #3F51B5;
}


.skin-blue .main-header .logo:hover {
    background-color: #3F51B5;
}

.skin-blue .main-header .navbar .sidebar-toggle:hover {
    background-color: #3F51B5;
}

.sidebar {
  position: fixed;
  white-space: nowrap;
  overflow: visible;
}

.main-header {
  position: fixed;
  width:100%;
}

.icon-widget {
    font-weight: 600;
}

/* Managing header so that it does not hide
content when reducing screen width */

@media screen and (min-width: 768px) and (max-width: 4000px) {
     .content-wrapper {
        padding-top: 20px; 
    }
}


@media screen and (min-width: 0px) and (max-width: 768px) {
     .content-wrapper {
        padding-top: 40px;
    }
}

@media screen and (min-width: 768px) and (max-width: 4000px) {
     .tab-content {
        padding-top: 30px; 
    }
}


@media screen and (min-width: 0px) and (max-width: 768px) {
     .tab-content {
        padding-top: 50px; 
    }
}


/* Section Titles */
h2 {
  font-weight: bold; 
  font-size: 30px; 
  color: #FDFEFE;
  background-color: #3F51B5;
  padding: 0.3em;
}

h3 {
  font-weight: bold; 
  font-size: 20px; 
  color: #3F51B5;
}

/* Buttons */
.btn-proactive {
  color: #660066; 
  background-color: #fff; 
  border-color: #660066;
  padding: 12px;
  margin-bottom: 10px;
}

.btn-proactive:hover {
  color: #fff; 
  background-color: #3F51B5; 
  border-color: #3F51B5;
  padding: 12px;
  margin-bottom: 10px;
}

.btn-report {
  color: white; 
  background-color: #4CAF50;
  border-color: white;
  padding: 12px;
  margin-bottom: 10px;
}

.btn-report:hover {
  color: #fff;
  background-color: #3F51B5;
  border-color: #3F51B5; 
  padding: 12px;
  margin-bottom: 10px;
}

.btn-demo {
  color: #3F51B5; 
  background-color: #fff; 
  border-color: #3F51B5;
  padding: 9px;
  margin-bottom: 10px;
}

.btn-demo:hover {
  color: #fff; 
  background-color: #3F51B5; 
  border-color: #3F51B5;
  padding: 9px;
  margin-bottom: 10px;
}

.btn-return {
  color: #3F51B5; 
  background-color: #fff; 
  border-color: #3F51B5;
  padding: 12px;
  margin-bottom: 10px;
}

.btn-return:hover {
  color: #fff; 
  background-color: #3F51B5; 
  border-color: #3F51B5;
  padding: 12px;
  margin-bottom: 10px;
}

.btn-control-add {
  color: #3F51B5; 
  font-size: 27px;
  background-color: #fff; 
  border-color: #3F51B5;
  padding-top: 0px;
  padding-bottom: 30px;
  padding-right: 8px;
  padding-left: 8px;
  height: 35px;
  width: 35px;
  position: relative;
  margin-top: 0%;
  margin-bottom: 10%;
}

.btn-control-add:hover {
  color: #fff; 
  font-size: 27px;
  background-color: #3F51B5; 
  border-color: #3F51B5;
  padding-top: 0px;
  padding-bottom: 30px;
  padding-right: 8px;
  padding-left: 8px;
  height: 35px;
  width: 35px;
  position: relative;
  margin-top: 0%;
  margin-bottom: 10%;
}

.btn-control-rem {
  color: #3F51B5; 
  font-size: 27px;
  background-color: #fff; 
  border-color: #3F51B5;
  padding-top: 0px;
  padding-bottom: 30px;
  padding-right: 8px;
  padding-left: 8px;
  height: 35px;
  width: 35px;
  position: relative;
  margin-top: 0%;
  margin-bottom: 10%;
}

.btn-control-rem:hover {
  color: #fff; 
  font-size: 27px;
  background-color: #3F51B5; 
  border-color: #3F51B5;
  padding-top: 0px;
  padding-bottom: 30px;
  padding-right: 8px;
  padding-left: 8px;
  height: 35px;
  width: 35px;
  position: relative;
  margin-top: 0%;
  margin-bottom: 10%;
}

.btn-fullscreen {
  color: #fff; 
  background-color: #3F51B5;
  border-color: #3F51B5;
  padding: 12px;
  padding-top: 15px; 
  padding-bottom: 15px; 
  padding-right: 15px;
  border-radius: 0%;
}

.btn-fullscreen:hover {
  color: #fff; 
  background-color: #00CEF1; 
  border-color: #00CEF1;
  padding: 12px;
  padding-top: 15px; 
  padding-bottom: 15px; 
  padding-right: 15px;
  border-radius: 0%;
}

.btn-refresh {
  color: #fff; 
  background-color: #3F51B5;
  border-color: #3F51B5;
  padding: 12px;
  padding-top: 15px; 
  padding-bottom: 15px; 
  padding-right: 15px;
  border-radius: 0%;
}

.btn-refresh:hover {
  color: #fff; 
  background-color: red;
  border-color: red;
  padding: 12px;
  padding-top: 15px; 
  padding-bottom: 15px; 
  padding-right: 15px;
  border-radius: 0%;
}

.btn-guide {
  color: #3F51B5; 
  background-color: #fff; 
  border-color: #3F51B5;
  padding: 12px;
  margin-bottom: 10px;
}

.btn-guide:hover {
  color: #fff; 
  background-color: #3F51B5; 
  border-color: #3F51B5;
  padding: 12px;
  margin-bottom: 10px;
}


.btn-secondary {
  color: #4CAF50; 
  background-color: #fff;
  border-color: #4CAF50; 
  padding: 12px;
  margin-bottom: 10px;
}

.btn-secondary:hover {
  color: #fff; 
  background-color: #3F51B5; 
  border-color: #3F51B5;
  padding: 12px;
  margin-bottom: 10px;
}

.btn-validate {
  color: white; 
  background-color: #4CAF50;
  border-color: white;
  padding: 12px;
  margin-bottom: 10px;
}

.btn-validate:hover {
  color: #fff; 
  background-color: #3F51B5; 
  border-color: #3F51B5;
  padding: 12px;
  margin-bottom: 10px;
}

/* Warning message */
.warn-message{
    font-size: 15px;
    color: darkslategrey;
    display: block;
    font-weight: bold;
    border-color: orange;
    padding: 10px;
    background: antiquewhite;
}

/* Well Boxes */
.well{
  border-color: #3F51B5;
}

/* Tab Panels Titles */
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    color: #fff;
    cursor: default;
    background-color: #3F51B5;
    border: 1px solid #3F51B5;
    border-bottom-color: transparent;
    font-weight: bold;
}

a {
  color: #3F51B5;
}

.control-label {
  color: #3F51B5;
  font-weight: bold;
  width: width: 100%;
}


/* Tab cutpoints */
@media screen and (min-width: 768px) and (max-width: 4000px) {
     .tab_cutpoints {
        margin-top: -30px;
    }
}


@media screen and (min-width: 0px) and (max-width: 768px) {
     .tab_cutpoints {
        margin-top: -50px; 
    }
}

/* Footer */
.main-footer {
      background-color: #ECEFF1;
      color: #3F51B5;
}
