* {
  box-sizing: border-box;
}

html {
  font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body {
  margin: 0;
}

nav {
  border-bottom: 1px solid #D7DDE3;
  padding: 12px;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgb(128, 128, 128);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: rgb(169, 169, 169);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgb(87, 87, 87);
}

input:not([type="checkbox"]):not([type="color"]):not([type="range"]),
select {
  height: 2rem;
  padding: 0 15px;
  border-radius: 3px;
  color: #131F26;
  font: 600 16px "Source Sans Pro", sans-serif;
  border: 1px solid #CED5D9;
  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}

select {
  padding: 0 35px 0 15px;
  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxOCAxNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik00LjQyMi4yNmMtLjIzMy0uMzM3LS42MS0uMzM3LS44NDQgMEwuMTc1IDUuMTdDLS4xNDIgNS42MjguMDQ4IDYgLjYxIDZoNi43OGMuNTU4IDAgLjc1NC0uMzcuNDM1LS44M0w0LjQyMi4yNnptLjAyIDEzLjQ3Yy0uMjM2LjM0Mi0uNjE4LjM0Ny0uODUuMDFMLjE2NyA4LjgxOEMtLjE0NiA4LjM2Ny4wNDggOCAuNjA4IDhoNi43ODNjLjU1OCAwIC43NTUuMzcuNDM3LjgzbC0zLjM4NSA0Ljl6IiBmaWxsPSIjMTMxRjI2Ii8+PC9nPjwvc3ZnPg==) right center no-repeat #fff;
}

input[type="color"],
input[type="color"]:focus {
  padding: 0;
  height: 2rem;
}

input:not([type="checkbox"]):not([type="color"]):not([type="range"]):focus,
select:focus {
  padding: 14px;
  outline: 0;
  border: 2px solid #1a9fff;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .16);
}

select:focus {
  padding: 0 34px 0 14px;
}

label {
  display: block;
  margin-right: 5px;
}

input:disabled,
select:disabled {
  opacity: 0.5;
  pointer-events: none;
}

@media screen and (max-width : 480px) {
  input:not([type="checkbox"]):not([type="color"]):not([type="range"]) {
      padding: 0 12px;
  }

  select {
      padding: 0 24px 0 12px;
  }

  input:not([type="checkbox"]):not([type="color"]):not([type="range"]):focus {
      padding: 0 11px;
  }

  select:focus {
      padding: 0 23px 0 11px;
  }
}