/* Extra small	xs	Small to large phone	< 600px
Small	sm	Small to medium tablet	600px > < 960px
Medium	md	Large tablet to laptop	960px > < 1264px*
Large	lg	Desktop	1264px > < 1904px*
Extra large	xl	4k and ultra-wide	> 1904px* */


[v-cloak] {
  display: none;
}

.v-application a { text-decoration: none;}
h2, h3 {margin-bottom: 1em; margin-top: 2em; } 
.v-application h1 { font-size: 22px; }

.v-application #searchdbInstr, .v-application #searchOSNamesInstr {
  position: relative;
  font-size: 14px;
}

a.topmenu {
  color: white!important; margin-left: 8px; padding: 8px;
}

.v-application footer a {
  color: #69b2fb;
  
}

.theme--light.v-input input::placeholder, .theme--light.v-input textarea::placeholder {
  color: black !important;
}

img {
  width: 100%;
  height: auto;
}

@media (min-width: 600px ) {
  .v-application p#heroheader { font-size: 64px!important; }
}

@media (min-width: 820px ) {
  .v-application #searchdbInstr, .v-application #searchOSNamesInstr {
    position: relative;
    font-size: 18px
  }
}

.v-application header.v-app-bar.v-app-bar--fixed {
  z-index: 2000!important; /* show above OS attributions */
}

.v-application .v-card__title { word-break: break-word; }

.ol-popup {
  position: absolute;
  background-color: rgba(250,250,250, 0.85);
  box-shadow: 0 1px 4px rgba(0,0,0,0.2);
  padding: 15px;
  border-radius: 10px;
  border: 1px solid #666;
  bottom: 12px;
  left: -50px;
  min-width: 280px;
}

.ol-popup.hidepopup { visibility: hidden !important; }

.ol-popup p {
  margin-bottom: 1px;
}
.ol-popup:after, .ol-popup:before {
  top: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.ol-popup:after {
  border-top-color: white;
  border-width: 10px;
  left: 48px;
  margin-left: -10px;
}
.ol-popup:before {
  border-top-color: #cccccc;
  border-width: 11px;
  left: 48px;
  margin-left: -11px;
}
.ol-popup-closer {
  text-decoration: none;
  position: absolute;
  top: 2px;
  right: 8px;
}
.ol-popup-closer:after {
  content: "✖";
}


.pageform {
  margin: 0;
  width: 90%;
  max-width: 30rem;
  padding: 1rem;
  border-radius: 12px;
  background-color: white;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.26);
}

button {
  cursor: pointer;
  padding: 0.5rem 1.5rem;
  border-radius: 6px;
  background-color: #1f0050;
  color: white;
  border: 1px solid #1f0050;
}

button:hover,
button:active {
  background-color: #320777;
  border-color: #320777;
}

.form-control {
  margin-bottom: 1rem;
}

.form-control input {
  font: inherit;
  padding: 0.25rem;
  border-radius: 4px;
  border: 1px solid #ccc;
  display: block;
  width: 15rem;
}

.form-control input:focus {
  border-color: #1f0050;
  outline: none;
  background-color: #f4eeff;
}

.form-control label {
  font-weight: bold;
  display: block;
  margin-bottom: 0.5rem;
}

.errorlist {
  list-style: none;
  margin: 0.5rem 0;
  padding: 0;
  color: #680000;
}

.errors input {
  border-color: #680000;
  background-color: #fde3e3;
}

.errors label {
  color: #680000;
}