@import url(https://fonts.googleapis.com/css?family=Michroma);
@import url(https://fonts.googleapis.com/css?family=Poppins);
@import url(https://fonts.googleapis.com/css?family=Staatliches);
@import url(https://fonts.googleapis.com/css?family=Bebas+Neue);



/* nice background colors: #f9fafb, #e9ecef, #dee4ee, #f9fbfd, rgb(235, 235, 235) */

html {
  background-color: #f9fafb;
}

body {
  font-family: 'Poppins', 'sans-serif';
}


/* Spacing Utilities */
.ml-1 {
  margin-left: 5px;
}
.ml-2 {
  margin-left: 10px;
}
.ml-3 {
  margin-left: 15px;
}
.mr-1 {
  margin-right: 5px;
}
.mr-2 {
  margin-right: 10px;
}
.mr-3 {
  margin-right: 15px;
}
.mt-1 {
  margin-top: 5px;
}
.mt-2 {
  margin-top: 10px;
}
.mt-3 {
  margin-top: 15px;
}
.mb-1 {
  margin-bottom: 5px;
}
.mb-2 {
  margin-bottom: 10px;
}
.mb-3 {
  margin-bottom: 15px;
}

/* additional colors */
.button.is-tertiary {
  background-color: #f3f3f3;
  border: 1px solid #f3f3f3;
}

.button.is-tertiary:hover {
  background-color: #e9e9e9;
  border-color: #e9e9e9;
}

.button.is-docs {
  background-color: #eeeeee;
  border: 0;
}

.button.is-docs:hover {
  background-color: #e0e2db;
}

.has-background-alabaster {
  background-color: #e0e2db;
}

.has-text-alabaster {
  color: #e0e2db;
}

.tag.is-alabaster {
  background-color: #e0e2db;
}

.button.is-alabaster {
  background-color: #e0e2db;
  border-color: #e0e2db;
}

.button.is-alabaster:hover { 
  background-color: #dddfce !important;
  border-color: #dddfce !important;
}

.has-text-frontage-danger { 
  color: #613318;
}

.has-text-frontage-warning {
  color: #dbca69;
}

.has-background-frontage-warning {
  background-color: #dbca69;
}

.tag.is-frontage-warning {
  background-color: #dbca69;
}

.button.is-frontage-warning {
  background-color: #dbca69;
}

.has-background-slate-light {
  background-color: #a3adb8;
}

.has-text-slate-light {
  color: #a3adb8;
}

.tag.is-slate-light {
  background-color: #a3adb8;
  color: #4e6172;
}

.button.is-slate-light {
  background-color: #a3adb8;
}

.has-text-slate-dark {
  color: #4e6172;
}

.has-background-light-green {
  background-color: #bdd09f;
}

.has-text-light-green {
  color: #bdd09f;
}

.tag.is-light-green {
  background-color: #bdd09f;
}

.button.is-light-green {
  background-color: #bdd09f;
  color: #ffffff;
}

.button.is-light-green:hover {
  background-color: #668d3c;
}

.has-background-med-green {
  background-color: #668d3c;
}

.has-text-med-green {
  color: #668d3c;
}

.tag.is-med-green {
  background-color: #668d3c;
  color: #ffffff;
}

.button.is-med-green {
  background-color: #668d3c;
}

.has-background-earth {
  background-color: #a9a18c;
}

.has-text-earth {
  color: #a9a18c;
}

.tag.is-earth {
  background-color: #a9a18c;
  color: #613318;
  font-weight: 700 !important;
}

.button.is-earth {
  background-color: #613318;
}

.has-background-slate {
  background-color: #5f7d99;
}

.has-text-slate {
  color: #5f7d99;
}

.tag.is-slate {
  background-color: #5f7d99;
  color: #ffffff;
}

.button.is-slate {
  background-color: #5f7d99;
  color: #ffffff;
}

.button.is-slate:hover {
  background-color: #778591;
}

/* Loan Officer Purchase Profile Tables */
table.lo-purchase-profile-table {
  width: 100%;
}

table.lo-purchase-profile-table td {
  border: 0;
}

/* Purchase Profile Tables */
.table.is-purchase-profile td {
  border: 0;
}

.table.is-purchase-profile th {
  /*color: #a3adb8 !important; */
  border: 0;
}

/* Notifications */
.has-active-notifications {
  animation: tada;
  animation-duration: 1s;
}

.notification { 
  bottom: 0;
  right: 10px;
  position: absolute;
  z-index: 1;
}

/* General Bulma Style Tweaks */
.column-label {
  padding-top: calc(0.375rem + 1px);
  padding-bottom: calc(0.375rem + 1px);
  margin-bottom: 0;
}

a:hover,a:focus {
  text-decoration:none;
}

nav {
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  -o-user-select:none;
  user-select:none;
}

nav ul,nav li {
  outline:0;
  margin:0;
  padding:0;
}

section.section.is-title-bar {
  padding-top: 1.5rem;
  padding-bottom: 0;
}

section.section { 
  padding: 1.5rem 1.5rem;
}

a.box:hover {
  background-color: #f9fafb;
  box-shadow: 0 .5em 1em -.125em rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.02);
}

ul.panel {
  background-color: #fff;
}

ul.panel > .panel-block:hover {
  background-color: #f9fafb;
}

.box.has-table {
  padding: 0;
}

.breadcrumb-level {
  margin-bottom: 0 !important;
  min-height: 2.5rem;
}

.list-header-level {
  margin-bottom: 0 !important;
}

.list-view-table.is-hoverable tbody tr:not(.is-selected):hover {
  background-color: #f9fafb;
}

.list-view-table > thead {
  background-color: #f9fafb;
}

.list-view-table > tbody > tr {
  cursor: pointer;
}

.list-view-table td {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

a.row-link {
  text-decoration: none;
  color: #363636;
}

.dropdown-item.not-selected {
  padding-left: 2.7em;
}

.dropdown-item.is-selected {
}

/* Forms */
.select, select {
  width: 100%;
}

.field-label {
  /*text-align: left;*/
}


/* Main Div Area */
.max-size-main {
  margin-left: 60px;
}

.min-size-main {
  margin-left: 250px;
}


/* Sidebar ("Main" Nav) */
#sidebarToggle {
  height: 56px;
  width: 250px;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  background-color: rgb(249, 250, 251);
  font-size: 12px;
  cursor: pointer;
}

.sidebar-icon {
  position: relative;
  display: table-cell !important;
  width: 60px;
  height: 36px;
  text-align: center;
  vertical-align: middle;
  font-size:20px;
}

.main-menu:hover,nav.main-menu.expanded,.main-menu-expanded {
  overflow:hidden;
}

.main-menu-collapsed {
  width: 60px;
}

.main-menu {
  background-color: #fff;
  border-right: 1px solid hsla(0,0%,85.9%,.25);
  position:fixed;  /* originally position: absolute; */
  top:0;
  bottom:0;
  height:100%;
  left:0;
  overflow:hidden;
  -webkit-transition:width .05s linear;
  transition:width .05s linear;
  -webkit-transform:translateZ(0) scale(1,1);
  z-index:1000;
}

.main-menu li {
  position:relative;
  display:block;
  width:250px;
}

.main-menu li>a {
  position:relative;
  display:table;
  border-collapse:collapse;
  border-spacing:0;
  color: #4a4a4a;
  font-family: arial;
  font-size: 14px;
  text-decoration:none;
  -webkit-transform:translateZ(0) scale(1,1);
  -webkit-transition:all .1s linear;
  transition:all .1s linear;
}

.main-menu .nav-icon {
  position:relative;
  display:table-cell;
  width:60px;
  height:36px;
  text-align:center;
  vertical-align:middle;
  font-size:18px;
}

.main-menu .nav-text {
  position:relative;
  display:table-cell;
  vertical-align:middle;
  width:190px;
  font-size: 14px;
  font-family: 'Poppins', 'sans-serif';
}

.main-menu>ul.logout {
  position:absolute;
  left:0;
  bottom:0;
}

.main-menu li>a {
  height: 48px;
}

.main-menu li:hover>a {
/*  background-color: #f9fafb; */
  background-color: #efefef;
}

nav.main-menu li.active>a {
  color: #4a4a4a !important;
  border-left: 2px solid #4a4a4a;
/*  background-color: #f9fafb;*/
}

nav.main-menu ul > li:first-child {
/*  margin-top: 56px;*/
}


/* Top Navbar */
#topNav {
  border-bottom: 1px solid hsla(0,0%,85.9%,.25);
}

#topNav input {
  font-family: 'Poppins', 'sans-serif';
}

a.navbar-link:hover, a.navbar-item:hover {
  color: rgb(74, 74, 74);
}

.navbar-item-block {
  padding-right: 1.5rem;
  padding-left: 1.5rem;
}

#navbarBrandContainer {
  font-family: 'Michroma', 'sans-serif';
}

#navbarSearchBox {
  border: 0;
  box-shadow: none;
  background: transparent;
  width: 100%;
}

#userOptions {
  margin-right: 1.5rem;
}

.navbar-dropdown a.navbar-item.desktop-nav-only { 
  padding-right: 0;
  min-width: 11rem;
}


/* Object details */
.object-details-title {
  /*font-family: 'Bebas Neue', 'sans-serif';*/
  margin-bottom: 0 !important;
  text-transform: uppercase;
}

.object-details-table th {
  border-bottom: 0;
  min-width: 20%;
}

.object-details-table td {
  border-bottom: 0;
}

/* Toggle Switches */
.toggle-switch {
  position: relative;
  display: inline-block;
}

.toggle-switch-input {
  display: None;
}

.toggle-switch-label {
  display: block;
  width: 48px;
  height: 24px;
  text-indent: -150%;
  clip: rect(0 0 0 0);
  color: transparent;
  user-select: none;
}

.toggle-switch {
  position: relative;
  display: inline-block;
}

.toggle-switch-input {
  display: None;
}

.toggle-switch-label {
  display: block;
  width: 48px;
  height: 24px;
  text-indent: -150%;
  clip: rect(0 0 0 0);
  color: transparent;
  user-select: none;
}

.toggle-switch-label::before,
.toggle-switch-label::after {
  content: "";
  display: block;
  position: absolute;
  cursor: pointer;
}

.toggle-switch-label::before {
  width: 100%;
  height: 100%;
  background-color: #dedede;
  border-radius: 9999em;
  -webkit-transition: background-color 0.25s ease;
  transition: background-color 0.25s ease;
}

.toggle-switch-label::before,
.toggle-switch-label::after {
  content: "";
  display: block;
  position: absolute;
  cursor: pointer;
}

.toggle-switch-label::before {
  width: 100%;
  height: 100%;
  background-color: #dedede;
  border-radius: 9999em;
  -webkit-transition: background-color 0.25s ease;
  transition: background-color 0.25s ease;
}

.toggle-switch-label::after {
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.45);
  -webkit-transition: left 0.25s ease;
  transition: left 0.25s ease;
}

.toggle-switch-input:checked + .toggle-switch-label::before {
  background-color: #89c12d;
}

.toggle-switch-input:checked + .toggle-switch-label::after {
  left: 24px;
}

/* Task app controls */
.is-checkbox {
  margin-right: 8px;
}

.task-item-box {
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 5px !important;
}

.is-high-priority-task {
  border-left: 1px solid #ff0000;
}

.is-low-priority-task {
  border-left: 1px solid #ffffff;
}


/* Styles for > 1024px Viewports */
@media (min-width: 1024px) {
  .navbar-callout {
    display: none;
  }
  .mobile-nav-only {
    display: none;
  }
  .desktop-nav-only {
    display: flex;
  }
}


/* Styles for < 1024px Viewports */
@media (max-width: 1024px) {
  #sidebarNav {
    display: none;
  }

  #main {
    margin-left: 0px;
  }

  .mobile-nav-only {
    display: flex;
  }
  .desktop-nav-only {
    display: none;
  }

  #navbarSearchBox {
    background-color: rgb(235, 235, 235);
  }

  .object-details-table th {
    min-width: 50%;
  }

  .task-item-box {
    padding-right: 5px;
    padding-left: 15px;
  }

  .task-description-container {
    max-width: 600px;
  }

  .is-checkbox {
    margin-right: 0;
  }
}

/* Styles that are mobile only (< 768px Viewports) */
@media (max-width: 768px) {
  .is-aligned-left-mobile {
    text-align: left;
  }

  .is-full-width-mobile {
    width: 100%;
  }

  .object-details-table {
    font-size: 10px;
  }

  .task-description-container {
    max-width: 200px;
  }
}