/* MOBILE STYLING */
@media screen and (max-width: 600px) {
  /* MOBILE NAVBAR STYLING */
  /* Hide Regular Nav */
  #navbar {
    display: none;
  }
  /* Show Mobile Nav */
  .alt-current {
    border-bottom: #124508 4px solid;
  }
  #alt-nav {
    display: block;
  }
  #alt-nav {
    width: 100vw;
    height: 20vh;
  }
  #upper-alt-nav {
    width: 100%;
    height: 45%;
    border-bottom: 2px #8df430 dotted;
  }
  #alt-nav-logo {
    width: 50%;
    margin: auto;
    margin-top: 5%;
  }
  #alt-nav-logo img {
    width: 100%;
  }
  #lower-alt-nav {
    height: 50%;
    display: flex;
    justify-content: space-around;
    border-bottom: #8df430 2px dotted;
  }
  #alt-weather-widget {
    width: 120px;
    height: 80%;
    background-image: linear-gradient(45deg,#62cb0b, #8df430, #bbf480);
    border-radius: 10px;
    text-align: center;
    padding: 2%;
    margin-top: 7.5%;
  }
  .alt-nav-hamburger {
    width: 12.5%;
    height: 45%;
    margin-top: 6%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .burgers {
    height: 22.5%;
    background: #8df430;
  }
  #alt-nav-navbar {
    display: none;
    position: fixed;
    top: 0;
    z-index: 10;
    height: 100vh;
    width: 100%;
    background-color: #fff;
  }
  #alt-navbar {
    width: 50%;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    margin: auto;
    margin-top: 25%;
    margin-bottom: 15%;
  }
  #alt-navbar li {
    margin-top: 5%;
  }
  #alt-nav-contact-info {
    height: 25%;
    width: 80%;
    margin: auto;
  }
  .alt-nav-contacts {
    display: flex;
    justify-content: space-around;
    font-weight: 500;
    width: 75%;
    margin: auto;
    align-items: center;
  }
  .alt-nav-icons {
    width: 15%;
    padding-bottom: 15%;
  }
  #alt-nav-facebook {
    width: 20%;
    padding-bottom: 20%;
    margin: auto;
    margin-top: 5%;
    background-position: 96.75% 50%;
    background-size: 500%;
  }
  #alt-nav-email-icon {
    background-position: 34.5% 50%;
    background-size: 500%;
  }
  #alt-nav-phone-icon {
    background-position: 65.75% 50%;
    background-size: 500%;
  }
  #alt-nav-facebook,
  .alt-nav-icons {
    background-image: url('/img/contactsprites.svg');
    background-repeat: no-repeat;
  }
  .alt-nav-close {
    position: absolute;
    top: 2.5%;
    right: 5%;
    width: 15%;
    height: 7%;
  }
  .close-btn {
    width: 100%;
    height: 15%;
    background: #8df430;
  }
  #x1 {
    transform: rotate(45deg);
    position: absolute;
    bottom: 50%;
  }
  #x2 {
    transform: rotate(135deg);
    position: absolute;
    bottom: 50%;
  }
  /* HOME PAGE HERO */
  #homepage h1 {
    line-height: 2.5rem;
  }
  .single_slide h1{
    top: 37.5%;
  }
  .hero-cta {
    top: 55%;
    left: 50%;
    transform: translate(-50%,0);
  }
  /* HOME PAGE ACTIVITIES */
  #home-park-activities {
    display: flex;
    flex-direction: column
  }
  #hm-act-info{
    width: 100%;
    margin-top: 35%;
    height: 45%;
  }
  #act-pics {
    width: 100%;
    height: 10%;
    position: relative;
  }
  .hm-act-square {
    width: 30%;
    padding-bottom: 30%;
  }
  #hm-act1 {
    left: 0;
    top: 10%;
  }
  #hm-act2 {
    left: 50%;
    top: 10%;
    transform: translate(-50%, 0);
  }
  #hm-act3 {
    left: 100%;
    top: 10%;
    transform: translate(-100%, 0);
  }
  
  /* HOME PAGE AMENITIES */
  #explore-rgv {
    height: 190vh;
    background-color: #ededed;
    display: flex;
    flex-direction: column;
  }
  #green {
    width: 100%;
    height: 100vh;
  }
  #amenities {
    width: 100%;
    height: 85vh;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, 1fr);
  }

  /* HOME GALLERY SECTION */
  #gallery {
    height: 50vh;
    position: relative;
  }
  #pictures-group {
    height: 70%;
  }
  .small-pictures {
    width: 25%;
    padding-bottom: 25%;
  }
  #large-picture {
    width: 35%;
    padding-bottom: 35%;
    top: 5%;
    left: 10%;
  }
  #small-picture1 {
    left: 27.5%;
    bottom: 7.5%;
  }
  #small-picture2 {
    left: 45%;
    top: 35%;
  }
  #small-picture3 {
    right: 7.5%;
    bottom: 10%;
  }
  #gallery h1 {
    left: 50%;
    top: 2.75%;
    width: 45%;
  }
  #gallery-cta {
    bottom: 10%;
  }
  
  /* ACTIVITIES PAGE */
  #act-head {
    height: 30vh;
  }
  #act-head h1 {
    width: 80%;
  }
  #activities-container {
    display: flex;
    flex-direction: column;
    padding: 5%;
    margin-bottom: 5%;
    position: relative;
  }
  #golfing {
    order: 1;
  } 
  #dinner {
    order: 2;
  }
  #games {
    order: 3;
    box-shadow: 5.5px 5.5px 7.5px #777;
  } 
  #swim {
    order: 4;
    box-shadow: -5.5px 5.5px 7.5px #777;
  }
  #crafts {
    order: 5;
  }
  #act-cta-tag {
    order: 6;
  }
  .activity {
    font-weight: normal;
    margin-top: 5%;
  }
  .activity p {
    padding: 5%;
  }

  /* PARK MAP PAGE */
  #park-map {
    height: 50vh;
    padding-top: 15%;
  }
  #park-map img {
    width: 80%;
  }
  #bg-el12 {
    top: 0;
  }
  
  /* PARK RATES PAGE */
  .table-image th {
    height: 20vh;
  }
  .table-title {
    width: 75%;
    line-height: 2.5rem;
    top: 20%;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 2;
  }

  /* GALLERY PAGE */
  #gallery-hero {
    height: 75vh;
  }
  #image-w-title {
    width: 95%;
    height: 100%;
  }
  #image-w-title img {
    width: 100%;
    height: 60%;
    top: 100%;
    transform: translate(0, -100%);
  }
  #gallery-blurb {
    width: 100%;
    height: 28.5%;
    top: 0;
    transform: translate(0, 0);
  }
  #gallery-facebook {
    width: 15%;
    padding-bottom: 15%;
  } 
  /* Gallery Slideshow */
  #gallery-sldeshow-section {
    height: 80vh;
    position: relative;
  }
  #gallery-slideshow figure {
    margin: 0 auto 15px;
  }
  .thumb-img-list {
    width: 100%;
    height: 12.5vh;
  }
  #bg-el18 {
    left: -17.5%;
  }

  /* REGISTRATION */
  #registration-form button {
    width: 50%;
  }
  
  /* FOOTER */
  /* Footer Contact */
  #contact {
    flex-direction: column;
  }
  #contact-form {
    width: 100%;
    height: 100%;
  }
  #footer-contact-form {
    height: 90%;
    transform: translate(0, 5%);
  }
  #foot-top-contact {
    width: 100%;
    height: 100%;
  }
  #foot-contact-icons {
    width: 75%;
  }
  #foot-contact-fb {
    transform: translate(-50%, 0);
  }
  #bg-elfoot {
    width: 100%;
    padding-bottom: 100%;
    right: 0;
    bottom: 0;
    opacity: 0.15;
  }
  #map {
    height: 45vh;
  }
  #foot {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #foot-links {
    display: flex;
    flex-direction: row;

    width: 100%;
    justify-content: space-around;
  }
  .foot-btn {
    transform: translate(-17.5%,0);
  }
  #foot-logo {
    width: 100%;
  }
  #foot-facebook {
    width: 25%;
    padding-bottom: 25%;
    margin-top: 5%;
  }
}

@media screen and (min-width: 600px) and (max-width: 1000px) {
  #nav-logo a {
    transform: translate(10%,-50%);
  }
  #weather-widget {
    width: 55%;
    height: 80%;
  }
  #homepage h1 {
    line-height: 2.5rem;
  }
  #act-pics {
    width: 50%;
  }
  .hm-act-square {
    width: 50%;
    padding-bottom: 50%;
  }
  #hm-act1 {
    left: 85%;
    top: 15%;
  }
  #hm-act2 {
    left: 25%;
    top: 20%;
  }
  #hm-act3 {
    left: 60%;
    bottom: 5%;
  }
  #hm-act-info .cta-button {
    margin-top: 5%;
  }

  #green {
    width: 50%;
    height: 100%;
    background-color: #8df430;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 1fr);
  }

  #gallery {
    height: 100vh;
  }
  #pictures-group {
    height: 87.5%;
  }
  .small-pictures {
    width: 25%;
    padding-bottom: 25%;
  }
  #large-picture {
    width: 35%;
    padding-bottom: 35%;
    top: 5%;
    left: 10%;
  }
  #small-picture1 {
    left: 27.5%;
    bottom: 7.5%;
  }
  #small-picture2 {
    left: 45%;
    top: 35%;
  }
  #small-picture3 {
    right: 7.5%;
    bottom: 10%;
  }
  #gallery h1 {
    left: 50%;
    top: 10%;
    width: 45%;
  }
  #gallery-cta {
    bottom: 5%;
  }

  .activity p {
    padding: 1%;
  }

  #park-map {
    height: 60vh;
  }

  .table-image th {
    height: 30vh;
  }
  .table-title {
    width: 75%;
    line-height: 3rem;
    top: 20%;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 2;
  }
  #gallery-blurb {
    height: 40%;
  }
  #gallery-facebook {
    width: 15%;
    padding-bottom: 15%;
  }
  .thumb-img-list {
    width: 60%;
  }

  #registration-form button {
    width: 30%;
  }
}

@media screen and (min-width: 600px) and (max-width: 1000px) and (min-height: 1020px) {
  #hero {
    height: 50vh;
    position: relative;
  }
  #home-park-activities {
    display: flex;
    height: 40vh;
    position: relative;
  }
  #explore-rgv {
    height: 65vh;
    background-color: #ededed;
    display: flex;
  }
  #gallery {
    height: 60vh;
    position: relative;
  }
  #act-head {
    height: 40vh;
    position: relative;
    text-align: center;
  }
  #park-map {
    height: 32.5vh;
  }
  .table-image th {
    height: 15vh;
  }
  #gallery-hero {
    height: 60vh;
  }
  #gallery-blurb {
    height: 36%;
  }
  .thumb-img-list {
    width: 80%;
  }
  #bg-el26 {
    bottom: -7.5%;
  }
  #contact {
    height: 60vh;
    background-color: #ededed;
    display: flex;
  }
  #map {
    height: 60vh;
   }
   #foot-top-contact {
    height: 100%;
  }
  #foot-contact-icons  {
    width: 75%;
  }
}

@media screen and (min-width: 1000px) and (max-width: 1281px) {
  #nav-logo a {
    transform: translate(25%,-50%);
  }
  #home-park-activities {
    height: 50vh;
  }
  #explore-rgv {
    height: 110vh;
  }
  #gallery {
    height: 80vh;
    position: relative;
  }
  #pictures-group {
    position: relative;
    height: 85%;
  }
  #gallery h1 {
    position: absolute;
    right: 10%;
    top: 15%;
    width: 275px;
  }
  #park-map {
    height: 67.5vh;
  }
  #gallery-blurb h1 {
    line-height: 3.25rem;
  }
  #gallery-blurb {
    height: 27.5%;
  }
  #registration-form .cta-button {
    width: 20%;
  }
}
@media screen and (min-width: 1279px) and (max-width: 1281px) {
  #home-park-activities {
    height: 55vh;
  }
  #explore-rgv {
    height: 120vh;
  }
  #gallery {
    height: 90vh;
    position: relative;
  }
  #gallery h1 {
    position: absolute;
    right: 12.5%;
    top: 15%;
    width: 300px;
  }
  #park-map {
    height: 75vh;
  }
}
@media screen and (min-width: 1000px) and (max-width: 1281px) and (max-height: 700px) {
  #home-park-activities {
    height: 60vh;
  }
  #explore-rgv {
    height: 140vh;
  }
  #gallery {
    height: 100vh;
    position: relative;
  }
  #park-map {
    height: 75vh;
  }
  #gallery-blurb {
    height: 35%;
  }
}

@media screen and (max-height: 750px) and (max-width: 600px) {
  #explore-rgv {
    height: 200vh;
  }
  #green {
    width: 100%;
    height: 100vh;
  }
  #amenities {
    width: 100%;
    height: 100vh;
  }
  #gallery {
    height: 60vh;
    position: relative;
  }

  #footer-contact-form {
    height: 100%;
    transform: translate(0, 5%);
  }
  #foot-top-contact {
    height: 70%;
  }
  #foot-contact-fb {
    left: 50%;
    top: 10%;
  }
  #foot-contact-icons {
    position: absolute;
    top: 50%;
  }
  #bg-elfoot {
    right: 5%;
    bottom: -30%;

  }
}