body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    color: #3e3e3e !important;
}
main {
    flex: 1 0 auto;
}
.logo {
    display: inline-block;
    height: 80%;
}
.logo>img {
    vertical-align: middle
}
#mf-logo {
    height: 55px;
}
nav {
    height: 80px;
    line-height: 80px;
}
nav i,
nav [class^="mdi-"],
nav [class*="mdi-"],
nav i.material-icons {
    height: 80px;
    line-height: 80px;
}
nav .button-collapse i {
    height: 80px;
    line-height: 80px;
}
nav li a {
    color: white !important;
}
.tabs-main .indicator {
    background-color: white;
}
.notes-tabs .indicator {
    background-color: #17b4d8;
}
.note-content {
    margin-top: 25px;
}
.admin-wrapper {
    background: #3e3e3e !important;
    color: white;
}
.admin-wrapper .btn {
    background: #17b4d8;
}
.admin-wrapper .btn:hover {
    background-color: #17b4d8;
}
.admin-wrapper .btn:active {
    background-color: #17b4d8;
}
.admin-wrapper .btn:focus {
    background-color: #17b4d8;
}
.admin-logout:hover {
  background-color: #a0d10d;
}
.admin-logout:focus {
  background-color: #a0d10d;
}
.admin-logout:active {
  background-color: #a0d10d;
}
.backend-wrapper {
    width: 70%;
    background-color: #3e3e3e;
    margin: 0 auto;
    border-radius: 2px;
    box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21);
    padding: 20px;
    color: white;
    margin-top: 50px;
    margin-bottom: 50px;
}
.backend-header {
    font-size: 24px;
    margin-left: 15px;
    margin-top: 75px;
}
.backend-header-top {
    margin-top: 0px !important;
}
.backend-top-text {
  font-size: 20px;
}
.backend-client-section {
    margin-top: 50px;
}
.backend-wrapper .collapsible-header {
    color: #3e3e3e !important;
}
.backend-wrapper .collapsible-body {
    text-align: left;
    background-color: white;
    color: #3e3e3e !important;
}
.backend-wrapper label {
  font-size: 15px;
  color: #3e3e3e;
}
.backend-wrapper .switch {
  color: #3e3e3e;
}
.backend-wrapper label input[type=checkbox]:checked+.lever {
  background-color: #a0d10d !important;
}
.backend-wrapper label input[type=checkbox]:checked+.lever:after {
  background-color: #a0d10d !important;
}
[type="checkbox"]:checked + span:not(.lever):before {
  border-right: 2px solid #a0d10d !important;
  border-bottom: 2px solid #a0d10d !important;
}
.backend-client-id {
  color: #a0d10d;
}
.client-icon {
  color: #3e3e3e;
}
.icon-watching {
  color: #a0d10d;
}
.delete-btn {
  float: right;
}
.admin-update-msg {
  color: #F44336;
  margin-top: 50px;
}
.client-settings-form {
  margin-top: 35px;
}
.align-right {
    text-align: left;
}
.backend-form {
    margin-top: 50px;
}
.backend-form label {
    color: white;
}
.backend-form i {
    margin-top: 10px;
    margin-left: -10px;
}
#add-client textarea:focus,
#add-user textarea:focus,
#delete-user textarea:focus,
#add-note textarea:focus,
#delete-note textarea:focus {
  border-bottom: 1px solid #17b4d8;
  -webkit-box-shadow: 0 1px 0 0 #17b4d8;
  -moz-box-shadow: 0 1px 0 0 #17b4d8;
  box-shadow: 0 1px 0 0 #17b4d8;
}
#add-client label[for="project-list"].active,
#add-user label[for="access-list"].active,
#delete-user label[for="access-list"].active,
#add-note label[for="note-header"].active,
#add-note label[for="note-content"].active,
#delete-note label[for="del-note-header"].active {
  color: #17b4d8 !important;
}
.green-divider {
  background-color: #a0d10d;
}
.remove-client-submit {
  background-color: #f44336 !important;
}
#add {
  border-top: 1px solid #a0d10d;
}
#delete {
  border-top: 1px solid #f44336;
}
#add-notiz {
  border-top: 1px solid #a0d10d;
}
#delete-notiz {
  border-top: 1px solid #f44336;
}
.backend-tab {
  /*border-bottom: 1px solid white;*/
}
.backend-tab ul {
  background-color: transparent;
}
.backend-tab ul a {
  text-align: right;
  color: white !important;
  font-size: 24px !important;
  text-transform: none;
}
.backend-tab .indicator {
  background-color: transparent !important;
  font-size: 1px;
}
.backend-tab .first-tab {
  text-align: left;
}
.add-user-radio {
    text-align: left !important;
}
.add-user-radio [type="radio"]:checked + label:after {
  border: 2px solid #a0d10d;
}

.add-user-radio [type="radio"]:checked + label:after {
  background-color: #a0d10d;
}
.backend-error-message {
    text-align: left;
    color: #f44336;
}
.backend-success-message {
    text-align: left;
    color: #a0d10d;
}
.backend-neutral-message {
  text-align: left;
  color: #ffc107;
}
.picker__date-display {
  background-color: #17b4d8;
}
.browse-btn {
    background-color: #17b4d8;
}
.browse-btn:hover {
    background-color: #17b4d8;
}
.browse-btn:active {
    background-color: #17b4d8;
}
.browse-btn:focus {
    background-color: #17b4d8;
}
.nav-container {
    margin-left: 7%;
    margin-right: 7%;
}
.username {
    min-width: 150px;
    text-align: center;
}
.flex {
    display: flex;
}
#account-dropdown {
    margin-top: 80px;
}
nav ul li #logout-btn:hover {
    background-color: #555050 !important;
}
.lang-btn {
    display: inline-block;
    position: relative;
    overflow: hidden;
    padding: 0;
    border-radius: 50%;
    -webkit-transition: .3s;
    transition: .3s;
    cursor: pointer;
    vertical-align: middle;
    margin-right: 165px;
}
.lang-btn-main {
    width: 55px;
    height: 55px;
    line-height: 55px;
}
.lang-btn-drop {
    width: 40px;
    height: 40px;
    line-height: 40px;
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}
#lang-dropdown {
    background-color: transparent;
    box-shadow: none;
    margin-top: 60px;
    margin-left: -7px;
}
#lang-dropdown li:hover {
    background-color: transparent !important;
}
.globe-icon {
    height: inherit !important;
    line-height: inherit !important;
    font-size: 27px !important;
}
.lang-icon {
    width: 30px;
    height: 30px;
    margin-left: -11px;
    margin-top: -9px;
}
.main-lang-icon {
    width: 35px;
    height: 35px;
    margin-left: 10px;
    margin-top: 10px;
}
.inactive {
    background-color: #DFDFDF !important;
}
.header1 {
    font-size: 2.5rem;
    vertical-align: middle;
}
#reporting-header {
    font-size: 3rem;
    text-align: center;
    margin-top: 115px;
}
#loadingDiv {
  position:fixed;
  top:0px;
  right:0px;
  width:100%;
  height:100%;
  background-color:#666;
  background-image:url('ajax-loader.gif');
  background-repeat:no-repeat;
  background-position:center;
  z-index:10000000;
  opacity: 0.4;
  filter: alpha(opacity=40); /* For IE8 and earlier */
}
.aligner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.btn-group {
  margin-bottom: 5px;
}
.btn-group button {
    background-color: #fff;
    border: 1px solid grey;
    border-radius: 0px;
    color: #555050;
    height: 30px;
    width: 30px !important;
    font-size: 0.75rem;
    float: right;
}
.btn-group .week {
  width: 110px !important;
  border-right: none;
}
.btn-group .week:hover {
  background-color: #fff;
  color: #3e3e3e;
}
.btn-group:after {
    content: "";
    clear: both;
    display: table;
}
.btn-group .next {
  border-right: none;
}
.first {
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}
.btn-group .last {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
}
.btn-group .selected {
  background-color: #17b4d8;
  color: #fff;
}
.btn-group button:hover {
    background-color: #17b4d8;
    color: #fff;
}
.date-divider {
    padding-left: 18px;
    margin-top: 4px;
}
.picker__date-display {
    background-color: #1ea4c7;
}
.picker__day.picker__day--infocus.picker__day--selected.picker__day--highlighted {
    background-color: #1ea4c7;
    color: white !important;
}
.picker__day.picker__day--infocus.picker__day--today.picker__day--highlighted,
.picker__day.picker__day--infocus.picker__day--today {
    color: #1ea4c7;
}
.btn-flat.picker__today.waves-effect {
    color: #1ea4c7;
}
.picker__nav--next:hover,
.picker__nav--prev:hover {
    background-color: rgba(30, 164, 199, 0.3);
}
.section-header {
    margin-top: 175px;
    font-size: 2em;
}
.row-2 {
    margin-top: 75px;
}
.comments {
    height: 500px;
    background-color: lightgrey;
    margin-top: 215px;
}
.overview-box-row {
    margin-top: 75px;
}
.overview-box {
    height: 150px;
    border: 1px solid #cccccc;
    border-radius: 10px;
}
.overview-text-wrapper {
    height: 150px;
    display: flex;
}
.valign {
    align-items: center;
    margin: 0 auto;
}
.overview-category {
    font-size: 1em;
}
.overview-value {
    font-size: 3em;
}
.chart-wrapper {
    height: 350px;
    margin-top: 45px;
}
.dataTables_wrapper {
    margin-top: 50px;
}
.graph-select {
    height: 13px;
    width: 13px;
    border-radius: 5px;
    margin: auto;
    cursor: pointer;
}
.top-select {
  height: 13px;
  width: 13px;
  border-radius: 5px;
  margin: auto;
  cursor: pointer;
  border: 2px solid grey !important;
  background-color: lightgrey;
}
li:focus {
    outline: none !important;
}
#overview-chart {
    margin-top: 75px;
}
.keyword-divider {
    margin-top: 50px !important;
}
#keyword-table_wrapper {
  margin-top: 120px;
}
#keyword-table_previous i {
    vertical-align: middle;
}
#keyword-table_next i {
    vertical-align: middle;
}
#keyword-table_previous.disabled {
    color: #999;
}
#keyword-table_next.disabled {
    color: #999;
}
#keyword-table_wrapper tr,
#keyword-table_wrapper td {
    background-color: white;
}
#keyword-table_filter {
    width: 200px;
    margin-bottom: 20px;
    float: left;
    margin-left: 50px;
}
#keyword-table_filter i.prefix {
    margin-left: -43px;
    margin-top: 15px;
}
#keyword-table_filter label.textlabel {
    margin-top: -15px;
    margin-left: 9px !important;
}
.btn-group .off{
  margin-top: 15px;
}
.deviation-badge {
    float: left !important;
}
.position {
    text-align: center;
}
.info-icon {
    color: #9e9e9e;
    font-size: 20px !important;
}
.tooltip {
    position: relative;
    display: inline-block;
}
.tooltip .tooltiptext {
    visibility: hidden;
    width: 300px;
    background-color: #757575;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    /* Position the tooltip */
    
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
    margin-left: -200px;
}
.tooltip:hover .tooltiptext {
    visibility: visible;
}
.select-wrapper {
    width: 60px;
}
ul.dropdown-content.select-dropdown li span {
    color: #17b4d8;
}
.dataTables_length label {
    display: flex;
    align-items: center;
}
.dataTables_length label div {
    padding-right: 10px;
}
/* label focus color */

.input-field input:focus + label {
    color: #17b4d8 !important;
}
/* label underline focus color */

.input-field input:focus {
    border-bottom: 1px solid #17b4d8 !important;
    box-shadow: 0 1px 0 0 #17b4d8 !important
}
i.prefix.active {
    color: #17b4d8 !important;
}
.caret {
    color: #8c8c8c !important;
}
#notes {
    margin-top: 75px;
}
.notes-tabs {
    margin-top: -30px;
}
.notes-tabs li a {
    color: #3e3e3e !important;
}
.permanent {
    background-color: rgba(96, 125, 139, 0.3);
}
.page-footer {
    margin-top: 75px;
}
.contact-wrapper {
    display: flex;
    align-items: center;
    line-height: 1em;
}
.contact-img {
    max-height: 175px !important;
    padding: 6px;
    border: 2px solid #17b4d8;
    background-color: white;
}
.fullscreen-wrapper {
    height: 100vh;
    background-color: #17b4d8;
}
.login-wrapper {
    width: 300px;
    background-color: #fff;
    margin: 0 auto;
    border-radius: 2px;
    box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21);
    padding: 20px;
}
.image-login {
    height: 100px;
}
.login-form {
    margin-top: -20px;
}
.error-message {
    padding-left: 20px;
    padding-right: 20px;
    color: #F44336;
    text-align: center;
}
.submit-wrapper {
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
}
.login-submit {
    width: 100%;
    background-color: #a0d10d;
}
.login-submit:hover {
    background-color: #a0d10d;
}
.login-submit:active {
    background-color: #a0d10d;
}
.login-submit:focus {
    background-color: #a0d10d;
}
.back-btn {
    background-color: #a0d10d;
}
.back-btn:hover {
    background-color: #a0d10d;
}
.back-btn:active {
    background-color: #a0d10d;
}
.back-btn:focus {
    background-color: #a0d10d;
}
.error-icon {
    size: 50px;
}
.error-wrapper {
    width: 40% !important;
}
.sub-message {
    margin-top: -15px;
    font-size: 16px;
}
.card-container {
  width: 80%;
}
.card-wrapper {
  display: flex;
}
.card-offset {
  margin-left: 75px;
}
.card {
    /* Add shadows to create the "card" effect */
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    max-width: 450px;
}
/* On mouse-over, add a deeper shadow */
.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
.card-btn {
  width: 45px;
  height: 45px;
  float: right;
  margin-top: -48px;
  margin-left: 3px;
}
.card-btn:hover {
    background-color: #a0d10d;
}
.card-btn:active {
    background-color: #a0d10d;
}
.card-btn:focus {
    background-color: #a0d10d;
}
.card-btn i {
  margin-top: 3px;
}
.card-title {
  font-size: 20px !important;
}
.vis-hidden {
  visibility: hidden;
}
@media only screen and (min-width: 601px) {
    nav,
    nav .nav-wrapper i,
    nav a.button-collapse,
    nav a.button-collapse i {
        height: 80px;
        line-height: 80px;
    }
}
/* Colors */

.mf-lightblue {
    background-color: #17b4d8 !important;
}
.mf-lightgreen {
  background-color: #A0D10D;
}
.mf-lightblue-text {
    color: #1ea4c7 !important;
}
.mf-lightblue-layer {
    background-color: rgba(51, 51, 51, 0.08);
}