@import url('../fonts/Edwardian_script/stylesheet.css');
html {
  scroll-behavior: smooth;
}
body {
  padding-top: 50px;
  color: #353505;
}
hr.faded-grey {
    background-image: linear-gradient(to right, rgba(255,0,0,0), rgba(0, 0, 0, 0.527), rgba(255,0,0,0));
  }
/* Navbar transition... */
@media only screen and (max-width: 1023px) {
    .navbar-menu {
		display: block;
        opacity: 1;
        position: fixed; 
        left: 0;
        right: 0;
		z-index: -1;

        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
        pointer-events: none;
    }

    .navbar-menu.is-active {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
		z-index: 60;
        pointer-events: auto;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }
}

/* HERO (carousel classes first - hidden for the time being)
.hero.has-background {
    max-height: 100%;
  }
.hero.has-background .is-background {
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center center;
  object-position: center center;
  height: 100%;
  width: 100%;
}
.hero.hero-body {
  margin: 0 3rem;
  z-index: 10;
}
*/
.script-title-font {
  font-family: 'Edwardian script', cursive;
  font-size: 5rem;
  font-weight: 400;
  }
.script-font {
    font-family: 'Edwardian script', cursive;
    font-weight: 400;
    }
.fixed-background-250 {
  position: relative;
  overflow: hidden;
  height: 250px;
}
.has-background {
  position: relative;
  overflow: hidden;
  min-height: 150px;
}
.hero-background {
  position: absolute;
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 100%;
}
.hero-fit-background {
  position: absolute;
  object-fit: contain;
  object-position: center center;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.hero.is-hoverable {
  opacity: inherit;
  cursor: auto;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.hero.is-hoverable:hover {
  opacity: 70%;
  cursor: pointer;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

/* Opacity/transparency shortcut */
.is-transparent-10 {
  opacity: 0.9;        
}
.is-transparent-20 {
  opacity: 0.8;        
}
.is-transparent-30 {
  opacity: 0.7;        
}
.is-transparent-40 {
  opacity: 0.6;        
}
.is-transparent-50 {
  opacity: 0.5;        
}
.is-transparent-60 {
  opacity: 0.4;        
}
.is-transparent-70 {
  opacity: 0.3;        
}
.is-transparent-80 {
  opacity: 0.2;        
}

/* Colors */
.background-darkblue {
  background-color: darkblue;
}
.background-beige {
  background-color: #f5f5dc;
}
.background-midbeige {
  background-color: #e7e7ca;
}
.background-darkbeige {
  background-color: #B1B17A;
}
.background-grey {
  background-color: grey;
}
.background-lightgrey {
  background-color: lightgrey;
}
.background-white {
  background-color: white;
}
.background-sunny {
  background-color: rgb(252, 236, 202);
}
.text-darkbrown {
  color: #353505;
}

.info-button {
  color: #209cee;
}
.info-button:hover {
  opacity: 0.6;
  cursor: pointer;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

/* TOOLTIP */
/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
}

/* Tooltip text */
.tooltip .tooltiptext-right {
  visibility: hidden;
  width: 180px;
  background-color: #209ceea8;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  left: 115%;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 0.3s;
}

/* Tooltip arrow */
.tooltip .tooltiptext-right::after {
  content: " ";
  position: absolute;
  top: 50%;
  right: 100%; /* To the left of the tooltip */
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent #209ceea8 transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext-right {
  visibility: visible;
  opacity: 1;
}

ul li {
  list-style-type: none;
  list-style-position: outside;
}
.gap-right {
  padding-right: 1em;
}
.dropped-64 {
  margin-bottom: -64px;
  opacity: 1;
  z-index: 2;
}
.top-spaced-60 {
  margin-top: 60px;
}
.border-1 {
  border: 1px solid #000;
}

/* MAP STYLES */
.mapouter {
  position:relative;
  text-align:right;
  max-height:500px;
  width:100%;
}
.gmap_canvas {
  overflow:hidden;
  background:none!important;
  max-height:500px;
  width:100%;
}
.JV-text {
  opacity: 0.6;
  font-style: italic;
  background-color: rgba(255, 0, 0, 0.164);
}
.centered-logo {
  justify-content: center;
}
.clickable:hover {
  cursor: pointer;
}
.v-margin-5 {
  margin-top: 5rem;
}
.v-margin-6 {
  margin-top: 6rem;
}
figure.is-hoverable {
  opacity: 60%;
  cursor: auto;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
figure.is-hoverable:hover {
  opacity: 100%;
  cursor: pointer;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
