marvin/src/assets/css/styles.css

@import url('https://fonts.googleapis.com/css?family=Open+Sans');

a {
  color: #d5d5d5;
}

.active {
  display: block;
}

body {
  background-color: white ;
  color: #d5d5d5;
  font-family: 'Open Sans', sans-serif;
  font-size: 1rem;
}


.center {
  margin: 0 auto;
}

.checkup {
  transition: height 1s;
  height: 0;
}

.closed{
  height: 0px;
  overflow: hidden;
  position: relative;
}

.column {
  flex-direction: column;
}

.container {
  width: 300px;
  margin: 0 auto;
}
.cut {
  max-width: max-content;
}

div {
  padding: 0.5em;
}

.edit-button {
  background-color: #e30f27;
  color: #d5d5d5;
  font-family: "Open Sans", sans-serif;
  font-size: 1rem;
  border: unset;
  padding: 0 4px;
  height: 1.5rem;
}

.edit-input {
  border-radius: 0.4rem 0 0 0.4rem;
}

.flex {
  display: flex;
  }

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-full {
  flex: 1
}
.flex-wrap {
  display: flex;
  flex-wrap: wrap;
}

.full {
  width: 100%;
}

.green {
  background-color: darkgreen;
}

.inactive {
  display: none;
}

input {
  border-top: none;
  border-right: none;
  border-left: none;
  border-bottom: 2px solid  #e30f27;
  border-radius: 3px;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  color: black;
  width: 20px;
  height: 20px;
  border-width: thin;
}



input:focus {
background-color: #d5d5d5;
  color: #00152E;
  font-size: .9rem;
}

input.edit-input:not(:disabled) {
  background-color: #d5d5d5;
  color: #00152E;
}


.input-field {
  background-color: #f2f2f2 ;
  color: black;
  font-size: .9rem;
  font-family: roboto, sans-serif;
}



.justify-content-end {
  justify-content: end;
}

.justify-content-space-between {
  justify-content: space-between;
}

label {
  padding-right: 5px;
  color: #464646;
}
.loading-icon-canvas {
  position: absolute;
  height: 98%;
  width: 98%;
  left: 0%;
  top: 0%;
  background-color: #555555;
  opacity: .5;
}

.loading-icon
.log {
  font-size: 0.75em;
  height: 5em;
}

.nav-icon svg {
  fill: black;
}
.no-overflow {
  overflow: hidden;
  height: inherit;
}

.open {
  height: 500px;
}
p {
  margin: 0;
}

.position-absolute {
  position: absolute;
}

.position-relative {
  position: relative;
}

.red {
  background-color: #e30f27;
  color: white;
}

.round-box {
  border-radius: 6px;
}

select {
  border: none;
  font-size: medium;
  outline: none;

}

.send-button {
  background-color: #e30f27;
  color: white;
  font-family: "Open Sans", sans-serif;
  font-size: 1rem;
  border: unset;

}

.scroll-y {
  overflow-y: scroll;
}

.select-folder-field {
  background-color: #00152E ;
  color: #d5d5d5;
  width: 100%;
  font-size: .85rem;
}

.settings-div {
  background-color: #d5d5d5;
  color: black;
  width: 300px;
  border-top: none;
  border-right: none;
  border-left: none;
  border-bottom: 0.125rem solid #e30019;
  border-radius: 0.1875rem;
  overflow-x: scroll;
  white-space:nowrap;
}

.sticky-edit {
  display: flex;
  align-items: flex-start;
}
textarea, textarea:focus, input:focus{
  outline: none;
  font-size: .9rem;
;
}

textarea.select-folder-field, textarea.select-folder-field:focus, input.select-folder-field:focus {
  font-size: .85rem;
}

.top-distance {
  margin-top: 1em;
}

.v-distance {
  margin-top: 0.25em;
  margin-bottom: 0.25em;
}

/* width */
::-webkit-scrollbar {
  width: 10px;
  height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;

}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
  width: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}


.yellow{
  background-color: goldenrod;
}