html,
body, #__nexxt {
  height: 100%;
  margin: 0;
  font-size: 1em !important; }

.down_arrow {
  display: none !important; }

.base_container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: 60px 1fr 1fr;
  grid-template-areas: "n n" "m i" "m i";
  font-size: 1em;
  width: 100vw;
  height: 100vh; }

.navbar {
  grid-area: n;
  z-index: 100;
  box-shadow: 0px 1px 10px -1px rgba(0, 0, 0, 0.75) !important;
  background-color: #e9ecef !important;
  margin-bottom: 0 !important; }
  .navbar .dropdown.right {
    margin: auto !important;
    margin-right: 20px !important; }
    .navbar .dropdown.right .header {
      width: 200px;
      text-transform: capitalize !important;
      font-size: 1em !important;
      padding: 0 !important;
      margin: 8px 0 0 8px !important; }
      .navbar .dropdown.right .header span {
        margin: 0 8px !important; }
    .navbar .dropdown.right .button {
      padding: 8px !important;
      float: right;
      margin: 0 8px 8px 0 !important;
      font-size: 0.9em; }

.map_container {
  grid-area: m;
  z-index: 80; }
  .map_container .map {
    height: calc(100vh - 60px); }

.issues_container {
  grid-area: i;
  z-index: 90;
  box-shadow: -3px 0 10px -5px rgba(0, 0, 0, 0.75); }
  .issues_container .issues_cards {
    height: calc(83.8vh - 60px);
    overflow-y: auto;
    margin: 0 !important;
    max-width: 50vw; }
    .issues_container .issues_cards .card {
      margin: 5px 10px !important;
      max-height: 250px; }
      .issues_container .issues_cards .card .description {
        word-break: break-all;
        overflow-y: auto;
        max-height: 105px; }
      .issues_container .issues_cards .card img {
        height: 35px !important;
        object-fit: fill; }
      .issues_container .issues_cards .card .content .header:hover {
        color: blue;
        cursor: pointer; }
    .issues_container .issues_cards .card:first-of-type {
      margin-top: 10px !important; }
    .issues_container .issues_cards .card:last-of-type {
      margin-bottom: 10px !important; }
  .issues_container .issues_header {
    margin-top: 10px; }
    .issues_container .issues_header .header {
      margin-left: 15px; }
  .issues_container .resolved_text {
    color: #17AB39; }

.landing_container {
  background-color: #e9ecef;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: Lato, Helvetica Neue, Arial, Helvetica, sans-serif; }
  .landing_container .landing_title {
    font-size: 4.5rem;
    font-weight: 300; }
  .landing_container .landing_subtitle {
    font-size: 1.25rem;
    font-weight: 100;
    margin: 0; }
  .landing_container hr {
    width: 250px;
    margin: 20px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1); }

.landing_button {
  font-weight: 400 !important;
  background-color: #007bff !important;
  border-color: #007bff !important;
  padding: 10px 40px !important;
  border-radius: 3px !important;
  color: white !important; }

.landing_button:hover {
  background-color: #0069d9 !important;
  border-color: #0062cc !important; }

.login_container,
.signup_container {
  background-color: white;
  width: 400px;
  max-width: 98vw;
  height: auto;
  border-radius: 10px;
  box-shadow: 0px 0px 20px -4px rgba(0, 0, 0, 0.75);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
  .login_container .login_form,
  .login_container .signup_form,
  .signup_container .login_form,
  .signup_container .signup_form {
    width: 90%; }
  .login_container .form:first-child,
  .signup_container .form:first-child {
    margin-top: 10px !important; }
  .login_container button,
  .signup_container button {
    margin: 10px 0 !important;
    float: right; }

.signup_container {
  width: 500px !important;
  min-height: 400px !important; }

.issues_modal .disabled {
  opacity: unset !important; }
  .issues_modal .disabled label {
    opacity: unset !important; }

.map_tip {
  position: absolute !important;
  top: 120px;
  margin: 0 15px !important; }

.bottom.attached.message {
  margin: 0 20px 10px 20px !important;
  border-radius: 5px !important; }

input.file {
  height: 0;
  width: 0;
  opacity: 0; }

label.file {
  font-size: .8em;
  font-weight: 200;
  padding: 0 5px;
  background-color: #007bff !important;
  border-color: #007bff !important;
  border-radius: 3px !important;
  color: white !important;
  width: 93px; }

label.file:hover {
  background-color: #0069d9 !important;
  border-color: #0062cc !important; }

.menu > .header {
  display: flex;
  justify-content: space-between;
  align-items: center; }
  .menu > .header img {
    height: 5em !important;
    width: 5em !important;
    border-radius: 5px !important;
    box-shadow: -2px -2px 10px -4px rgba(0, 0, 0, 0.75); }

.right_flex {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  margin-right: 10px;
  width: 93px;
  height: 80px; }
  .right_flex span {
    text-align: center;
    font-size: 1.3em; }

@media (max-width: 890px) {
  .issues_cards {
    max-width: 100vw !important; }
  .base_container {
    grid-template-areas: "n n" "m m" "i i"; }
  .down_arrow {
    display: block !important;
    position: absolute;
    bottom: 15px;
    right: 40%; }
  .down_arrow:focus {
    outline: none !important; }
  .issues_cards {
    max-height: 70vh !important; }
  .landing_title,
  .landing_subtitle {
    padding: 0 10px !important;
    text-align: center; }
  .landing_title {
    line-height: 1;
    font-size: 4em !important; } }