/*
 * Bright - Extended CSS
 * Author: http://www.volatilestudios.com
 *
 * 
 */

/* ------------------- Step 3 ---------------- */

.border_none {
  border: none;
}

.container{
    max-width: 1440px;
    margin: auto;
}

/* Career Grid */
.career_row{
    display: grid;
    margin-top: .3rem !important;
    padding: 0rem .3rem;
    gap: .3rem;
    grid-template-columns: repeat(6, 1fr);
}

.career_row img{
    width: 100%;
}

.btn_view_listings:hover {
    background-color:#209BDE;
}

/* Join Team */
.join_team{
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.content_left{
    position: relative;
}

.content_left img{
    width: 100%;
}

.content_left .video_text{
    position: absolute;
    top: 10%;
    text-align: center;
    width: 70%;
    right: 50%;
    transform: translate(50%);
    font-weight: 700;
    color: white;
}

.content_left .video_text h1,
.content_left .video_text p {
    font-size: 40px;
    font-weight: 800;
}

.content_left .play-button{
    position: absolute;
    top: 50%;
    text-align: center;
    width: 10%;
    right: 50%;
    transform: translate(50%);
}

.join_team .content_right h3 {
    font-size:30px;
    font-weight:normal;
    color:#209bde;
    margin-bottom:20px;
    text-align: center;
    font-weight: 800;
}

/* Benefits */
.benefits{
    padding: 2rem 0rem;
}

.benefits h2{
    color: #209bde;
    font-size: 25px;
}

.benefits p{
    margin: 1rem 0rem;
}

.benefits_grid{
    display: grid;
    gap: .5rem;
    grid-template-columns: repeat(5, 1fr);
}

.benefits_grid img{
    width: 100%;
}

.benefits .benefit-item{
    padding: 50%;
    background-repeat: no-repeat;
    background-position: center 32%;
    box-sizing: border-box;
    background-size: 40%;
    position: relative;

}

.benefits .benefit-item p{
    display: block;
    position: absolute;
    width: 90%;
    top: 77%;
    right: 50%;
    transform: translate(50%, -50%);
    text-align: center;
    font-size: 20px;
    color: #fff;
    font-size: 15px;
    margin: 0;
}

.benefits .medical{
    background-color: #330170;
}
.benefits .vacation{
    background-color: #CC073C;
}
.benefits .pay-increase{
    background-color: #FD671A;
}
.benefits .insurance{
    background-color: #E61A95;
}
.benefits .ico-benefits{
    background-color: #95D60A;
}

/* About */
.about{
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 2rem 0rem;
}

.about_text{
    width: 90%;
    font-size: 25px;
}

.about_text p{
    padding: 1rem 0rem;
    font-size: 15px; 
    line-height: 25px;
}

.about h2{
    color: #209bde;
    font-size: 25px;
}

.quotes{
    background-color: #CE23B0;
    color: white;
    padding: 3rem;
}

.quotes blockquote{
    position: relative;
    font-size: 18px;
    line-height: 27px;
    padding-bottom: 2rem;
}

.quotes blockquote:before {
    display: block;
    padding-left: 10px;
    content: "\201C";
    font-size: 80px;
    position: absolute;
    left: -49px;
    top: -7px;
    color: white;
}

.quotes .ceo_row{
    display: flex;
}

.quotes .ceo_row ul{
    list-style: none;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 2rem;
}

.ceo_row img{
    width: 170px;
    height: 170px;
    object-fit: cover;
    border-radius: 50%;
    display: block;
    position: relative;
    border: 3px solid white;
}

.about button{
    background-color: #01B3E3;
    padding: 1rem 2.5rem;
    font-size: 15px;
    font-weight: 700;
    border: none;
    color: white;
    margin: auto;
    display: flex;
}

/* Bright Way */
.bright_way{
    display: grid;
    gap: .5rem;
    grid-template-columns: repeat(2, 1fr);
}

.bright_way h2{
    color: #209bde;
    font-size: 25px;
    margin-bottom: 1rem;
}

/* Values */
.values{
    margin: auto;
    width: 50%;
    padding: 3rem 0rem;
}

.values p{
    margin: 1rem 0rem;
    font-size: 15px; 
    line-height: 25px;
}

.values h2{
    color: #209bde;
    font-size: 25px;
}

/* Tagline grid */
.tagline_tile_container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .5rem;
}

.tagline_tile_container .tagline{
    padding: 45%;
    background-repeat: no-repeat;
    background-position: center center;
    box-sizing: border-box;
    background-size: 50%;
    position: relative;

}

.tagline_tile_container .tagline p{
    display: block;
    width: 100%;
    position: absolute;
    top: 85%;
    right: 50%;
    transform: translate(50%, -50%);
    text-align: center;
    font-size: 20px;
    color: #fff;
    font-size: 18px;
    margin: 0;
}

.tagline_tile_container .innovate{
    background-color: #FC4236;
}
.tagline_tile_container .gratitude{
    background-color: #9ECD67;
}
.tagline_tile_container .giveback{
    background-color: #CE23B0;
}
.tagline_tile_container .quality{
    background-color: #01B3E3;
}
.tagline_tile_container .safety{
    background-color: #C3D600;
}

.bottom_text{
    width: 90%; 
    margin: auto;
    font-size: 15px;
    line-height: 25px;
    padding: 1rem;
}


@media screen and (max-width: 440px) {
    div#google_translate_element div.goog-te-gadget-simple a.goog-te-menu-value span, 
    .btn_view_listings {
        font-size: 11px !important;
    }
    .goog-te-gadget-simple .goog-te-menu-value{
        line-height: 26px;
    }
}
@media screen and (max-width: 550px) {
    .btn_view_listings{
        width: 70% !important;
    }   
}

@media screen and (max-width: 767px) {
    .btn_view_listings{
        margin: 0 auto !important;
    }   
    .benefits .benefit-item p{
        font-size: 10px !important;
    }
    .join_team{
        display: flex;
        flex-flow: column;
    }
    .content_right{order: 1;}
    .content_left{order: 2;}

    .about_text p{
        font-size: 20px;
    }

    .quotes blockquote{
        font-size: 25px;
    }
    .tagline_tile_container p{
        font-size: 12px !important;
    }
    .values{
       width: 100%;
       padding: 3rem 1rem;
    }
    .btn_listings_container{
        display: grid;
        width: 100%;
        gap: .5rem;
        grid-template-columns: repeat(2, 1fr);
    }
   .tenting_page .big_image img{
     margin-bottom: .7rem;
   }

   .tent_banner_container .tent_text{
      height: 300px !important;
    }
   .tent_banner_container img{
      height: 300px !important;
   }
 
}

@media screen and (max-width: 992px) {
    .about{
        display: block;
    }
    .about_text{
        width: unset;
        padding-bottom: 2rem;
    }
    .bright_way{
        display: block;
    }
    .bright_way div, 
    .about_text,
    .benefits{
        padding: 1rem;
    }
    .benefits_grid{
        grid-template-columns: repeat(3, 1fr);
    }
    
    .benefits .benefit-item p{
        font-size: 12px;
    }

}

@media screen and (max-width: 1200px) {
    .content_left .video_text h1, 
    .content_left .video_text p {
        font-size: 20px;
    }
}


/* New CSS Edit Profile */
 .form-control{
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.account_body .account_block .block_cell{
    border: none !important;
}
 
.account_block .make_payment{
    border: none;
    background-color: #209BDE;
    color: white;
    padding: 1rem 2rem;
}

.account_row{
    display: flex;
    width: 100%;
}

.account_column{
    width: 50%;
}

.account_body .switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
    margin-top: .8rem;
  }
  
 .account_body .switch input { 
    opacity: 0;
    width: 0;
    height: 0;
  }
  
.account_body .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
.account_body .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
.account_body input:checked + .slider {
    background-color: #2196F3;
  }
  
.account_body input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
  }
  
.account_body input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .account_body .slider.round {
    border-radius: 34px;
  }
  
  .account_body .slider.round:before {
    border-radius: 50%;
  }

  @media screen and (max-width: 767px) {
    .account_row{
        display: block;
    }
    .account_column{
        width: 100%;
    }
    .account_body .account_block .block_cell{
        width: 100%;
        max-width: unset;
    }
    .account_body input{
        max-width: 90%;
    }
  }

  .tbl_view_actions{
    border: none !important;
  }


  .tbl_view_actions button{
    padding: .5rem 1rem;
    border: none;
    color: white;
    border-radius: 5px;
  }


  #sortable_table tbody tr.even { 
    background: unset !important;
}

#sortable_table th{
    border-left: none !important;
    text-decoration: none !important;
}

#sortable_table .actions{
    font-size: 15px !important;
}

.page_sub_title a{
    background-color: #209BDE;
    color: white !important;
    border-radius: 5px;
    text-decoration: none !important;
    padding: .5rem 1rem;
}

#sortable_table th, #sortable_table .actions {
    background-color: #209BDE;
    color: white;
    vertical-align: middle;
    padding: .3rem;
    font-size: 12px;
}

#sortable_table tbody td{
    padding: .5rem !important;
}

.check_mark {
    display: inline-block;
    transform: rotate(45deg);
    height: 25px;
    width: 12px;
    margin-left: 46%;
    border-bottom: 7px solid #95d60a;
    border-right: 7px solid #95d60a;
    vertical-align: middle;
  }


  /* New Updates 9-12-2022 */

 .reviews_body_container h2{
    padding: 0rem 1rem;
 }

 @media screen and (max-width: 500px){
    #pnl_locations .store_list .store_tile{
      min-height: 320px;
    }
    .user-table table{
      width: 50rem !important;
    }
    .reviews_body_container .image_container{
      padding-right: 55px !important;
      padding-left: 55px !important;
    }
    #seated_dining,
    #ceremony_seating,
    #cocktail_party{
      width: 100% !important;
    }

    .cart_steps .step{
      width: 30% !important;
      height: 6rem !important;
    }
    
 }

 @media screen and (max-width: 736px){
   .instagram_right_arrow{
      margin-right: 4px;
   }
   .instagram_left_arrow{
      margin-left: 4px;
   }
   #content_area_bp .page_content p{
      margin: 30px 0px 45px 0px;
   }
   .mobile-app-container .col_1{
      width: 100% !important;
   }
   .mobile-app-container .col_2{
      width: 100% !important;
   }
   #txt_Message, #Request_Comment{
      width: 75% !important;
   }
   .contact_col_2 .single{
      width: 99% !important;
   }
   #pnl_availability div span input{
      width: 180px;
   }
   .cart_checkout .confirm_col{
     width: 49%;
   }
   .bp_body_container{
     padding: 10px !important;
   }
   #content_area_bp #change_form{
     line-height: 0px !important;
   }
   #content_area_bp .content_area_bp_body{
     line-height: 16px !important;
   }
   .reservation_item_list_container .reservation_item_list_row .col_category{
     padding: 1rem 0rem;
     margin-top: 1rem;
   }
   .reservation_item_list_row .btn_remove_item{
     margin-left: 1rem;
   }
   .reservation_item_list_container .reservation_item_list_row .col_image{
     width: 15% !important;
   }
   .page_sub_title {
     margin-bottom: 10px !important;
   }
   .cart_name,
   .cart_checkout .block_cell,
   .cart_checkout span, 
   .cart_checkout h2{
     line-height: 16px !important;
   }
 
   .content_area_bp_body h1{
      line-height: 30px !important;
   }

   .account_body .page_sub_title{
      line-height: 20px !important;
   }

   .save_changes_container .btn_save_changes{
     padding: 16px !important;
     line-height: 28px;
   }
   
}
 
 @media screen and (min-width: 736px){
   .contact_col_2 .single{
     width: 97.5% !important;
  }
}

 .content_area_bp_body .col_1 .product_description table{
    width: 100% !important;
 }
 .user-table{
   overflow-x: auto; 
   width: 100%; 
   margin-top: 2rem;
 }

 .contact_col_2 input[type="text"]{
    display: block;
    width: 90% !important;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.contact_col_2 textarea{
    padding: 10px;
    font-size: 15px;
    width: 90%;
    display: block;
    /* width: 100%; */
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.cart_steps .step{
    width: 25%;
    height: 5rem;
}

.cart_image{
   width: 20%;
}

.cart_row .block_2{
   width: 80%;
   padding: 0rem 1rem;
}

.cart_checkout input{
    /*width: 100% !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    background-clip: padding-box !important;
    border: 1px solid #ced4da !important;
    border-radius: 0.25rem !important;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out !important;*/
}


.cart_checkout .block_cell h3{
    margin-top: 1rem;
}

.confirm_col .block_cell{
   margin-bottom: 2rem;
}

.cart_sub_total .sub_total{
   font-size: 15px !important;
}

.reservation_item_list_row .col_image img{
   width: 100%;
}

.reservation_item_list_row .col_item{
   line-height: 16px;
}

/* Flipbook */

/* Small flipbook */
.container_landscape {
    height: 50vh !important;
}

    .container_landscape .page-wrapper {
        height: 25rem !important;
    }

    .container_landscape .shadow {
        height: 25rem !important;
    }

    .container_landscape .turn-page {
        height: 25rem !important;
    }

    .container_landscape .book-content {
        height: 25rem !important;
    }

        .container_landscape .book-content img {
            object-fit: contain;
            width: 100% !important;
            height: 25rem !important;
        }


.album-wrapper {
    align-items: center;
    display: flex;
    height: 60%;
    justify-content: center;
    margin: 2% 0%;
    width: 100%;
}
  
.album-aspect {
    padding-bottom: 70%;
    position: relative;
    width: 100%;
}
  
.album-aspect-inner {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
  
#album{
    margin: 5% auto;
    height: 85%;
    transition: margin-left 0.25s ease-out;
    width: 85%;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#album .page{
    background: rgb(240, 240, 240);
    height: 100%;
    width: 100%;
}

#album .page img{
    height: 100%;
    width: 100%;
}

#album .book-content{
    position: relative;
    height: 100%;
    width: 100%;
}

#album .page-wrapper {
    -webkit-perspective: 2000px;
    -moz-perspective: 2000px;
    -ms-perspective: 2000px;
    perspective: 2000px;
}

#album .shadow,
#album.shadow{
  -webkit-box-shadow: 0 4px 10px #666;
  -moz-box-shadow: 0 4px 10px #666;
  -ms-box-shadow: 0 4px 10px #666;
  -o-box-shadow: 0 4px 10px #666;
  box-shadow: 0 4px 10px #666;
}


.button{
    cursor: pointer;
}

.previous{
    position: absolute;
    top: 40%;
    left: 0%;
    transform: translate(0, -50%);
}

.next{
    position: absolute;
    top: 40%;
    right: 0%;
    transform: translate(0, -50%);
}

.previous img{
    width: 50px;
    height: 50px;
    transform: rotate(180deg);
}

.next img{
    width: 50px;
    height: 50px;
}

.product-link{
    position: absolute;
    width: 20px;
    height: 20px;
    filter: invert(1);
    border: 2px solid black;
    border-radius: 50%;
    padding: .5rem;
    transform: translate(-50%, 50%);
    opacity: 50%;
    filter: invert(0);
}

.product-link:hover{
    box-shadow: 1px 1px 10px black;
    opacity: 80%;
}

.product-link img{
    width: 100%;
    height: 100%;
}

.product1{
    left: 50%;
    top: 60%;
}

.product2{
    left: 20%;
    top: 35%;
}
.product3{
    left: 25%;
    top: 70%;
}
.product4{
    left: 75%;
    top: 70%;
}
.product5{
    left: 50%;
    top: 25%;
}
.product6{
    left: 25%;
    top: 55%;
}
.product7{
    left: 73%;
    top: 65%;
}
.product8{
    left: 50%;
    top: 24%;
    filter: invert(1);
}
.product9{
    left: 77%;
    top: 74%;
    filter: invert(1);
}
.product10{
    left: 53%;
    top: 75%;
    filter: invert(1);
}
.product11{
    left: 25%;
    top: 60%;
    filter: invert(1);
}
.product12{
    left: 85%;
    top: 50%;
    filter: invert(1);
}
.product13{
    left: 60%;
    top: 35%;
    filter: invert(1);
    opacity: 60%;
}
.product14{
    left: 30%;
    top: 60%;
}
.product15{
    left: 75%;
    top: 60%;
}

@media screen and (max-width: 767px) {
    .next img,
    .previous img{
        width: 25px;
        height: 25px;
    }
}

/* ----------------- Location Page ---------------- */

.location_banner{
  position: relative;
  background-repeat: no-repeat;
  margin-bottom: 3rem;
  background-position: center center;
}

.location-row{
  display: flex;
  width: 100%;
}

.location-col{
  width: 50%;
}

.contain_less{
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.overtext{
  width: 50%;
  position: relative;
  top: 0;
  padding: 15px;
  background-color: #209BDE;
  text-align: center;
  color: #000;
}

.overtext h1{
  font-family: "Libre Franklin", Arial, sans-serif;
  visibility: inherit;
  opacity: 1;
  margin-bottom: 1.5rem;
  color: white !important;
  color: #209bde;
  font-weight: 700 !important;
  text-transform: uppercase;
  font-size: 30px !important;
  line-height: 2.5rem;
}

.overtext .btn_wrapper{
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-left: initial;
  margin-right: initial;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 975px;
  margin-left: auto;
  margin-right: auto;
}

.btn_wrapper a{
  width: 80%;
  font-family: "Libre Franklin", Arial, sans-serif;
  background-color: #01b3e3;
  padding: 15px 8px;
  color: #fff;
  font-size: 15px;
  display: inline-block;
  margin: 0 auto;
  text-align: center;
  text-decoration: none;
  font-weight: normal;
  text-transform: uppercase;
  vertical-align: top;
}

.pupbutton{
  font-size: 20px;
  margin-left: auto;
  margin-right: auto;
  background-color: #e4e1e1;
  padding: 15px 8px;
  display: block;
  width: 400px;
  font-family: "Libre Franklin", Arial, sans-serif;
  text-align: center;
  color: #000;
  border: none;
}

.overtext .above_fold{
  width: 100%;
  margin-top: 40px;
  padding-bottom: 40px;
  color: white !important;
}

.overtext .above_fold p{
  font-size: 1.2em;
}

@media (min-width: 1200px){
  .contain_less {
    width: 100%;
  }
}

/* Party Rental */
#party-rental {
  margin-top: 60px;
  margin-bottom: 15px;
} 
.grid_3-col{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  grid-gap: .5rem;
  clear: both;
}

.grid-col {
  display: flex;
  flex-direction: column;
}

#party_rental img {
  width: 100%;
  display: flex;
  align-self: center;
  object-fit: cover;
  height: 20rem;
}

.bot-column {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.grid-col-con {
  padding: 3rem 0rem;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

.bot-column .pupbutton {
  background-color: #01b3e3;
  padding: 20px;
  color: #fff;
  font-size: 15px;
  display: inline-block;
  width: 200px;
  margin: 0 auto;
  text-align: center;
  text-decoration: none;
  font-weight: normal;
  text-transform: uppercase;
  vertical-align: top;
}

.hvr-overline-from-center {
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  position: relative;
  overflow: hidden;
  text-decoration: none;
}

.hvr-overline-from-center:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 51%;
  right: 51%;
  bottom: 0;
  background: #209BDE;
  height: 4px;
  -webkit-transition-property: left,right;
  transition-property: left,right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.hvr-overline-from-center:hover:before, .hvr-overline-from-center:focus:before, .hvr-overline-from-center:active:before {
  left: 0;
  right: 0;
}

/* Our Services */
.our_services {
  background-color: #efefef;
  padding: 3rem;
}

.our_services p {
  font-size: 15px;
  text-align: center;
}

.our_services img {
  width: 40%;
  margin: auto;
  display: flex;
}

.our_services h3{
  color: #209BDE;
  text-align: center;
  font-size: 1.3em;
}

.smaller_title{
  font-size: 2em !important;
  text-align: center;
  margin-top: 2rem;
  font-weight: 800 !important;
  text-transform: uppercase;
}

.service_title {
  font-size: 30px !important;
  font-weight: 800 !important;
  text-align: center;
  margin-top: 50px;
  margin-bottom: 40px;
  visibility: inherit;
  opacity: 1;
  margin-top: 1rem;
  margin-bottom: 1rem;
  line-height: 3rem;
  text-transform: uppercase;
}

.lil_dash {
  width: 30%;
  background-color: #209BDE;
  height: 2px;
  margin-top: 2rem;
  margin-bottom: 25px;
}

.center-lil-dash {
  margin-left: auto;
  margin-right: auto;
}

/* Lightbox Carousel */
img.hover-shadow {
  transition: all 0.3s;
}

.carousel-row--img {
  width: 100%;
  margin-bottom: 10px;
}
.carousel-row--img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  cursor: pointer;
  transition: 0.4s;
}
.carousel-row--img img:hover {
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.2),
    0 5px 10px 0 rgba(0, 0, 0, 0.19);
}

.column-box {
  white-space: nowrap;
  background-color: transparent;
  width: 100%;
  background: black;
  overflow: hidden;
}
.column-box .column {
  width: 20%;
  display: inline-block;
  transition: all 1s;
}
.column-box .column img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  cursor: pointer;
}

.glide__slide img{
  width: 100%;
}



/* Tent Info */
.tent_info{
  padding-top: 2rem;
  padding-bottom: 3rem;
}

.tent_info .left{
  background-color: #BD3FAA;
  color: white !important;
}

.tent_info .right{
  background-color: #209BDE;
  color: white !important;
}

.tent_info .right .pupbutton, 
.tent_info .left .pupbutton {
  color: black !important;
  background-color: white;
}

.tent_info h3{
  color: white !important;
}

@media (min-width: 1200px){
  .tent_info .tent_wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .tent_info .tent_wrapper .left {
    padding: 3rem;
    text-align: left;
  }

  .tent_info .tent_wrapper .right {
    padding: 3rem;
  }
}

.tent_info h3{
  font-size: 30px;
  line-height: 2.5rem;
  color: #01b3e3;
}

.tent_info p,
.tent_info li{
  font-size: 15px !important;
}

.tent_info_img{
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: 50% 50% !important;
  min-height: 200px;
}
.tent_info .pupbutton{ 
  font-size: 20px;
  width: 55%;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-top: 3rem;
  font-family: "Libre Franklin", Arial, sans-serif;
  background-color: #01b3e3;
  color: #fff;
  font-size: 15px;
  display: inline-block;
  margin: 0 auto;
  text-align: center;
  text-decoration: none;
  font-weight: normal;
  text-transform: uppercase;
  vertical-align: top;
}

@media screen and (max-width: 1200px) {
  .tent_info_img{
    margin-bottom: 3rem;
    min-height: 465px;
  }
  .tent_info .pupbutton{ 
    margin-bottom: 3rem;
  }
  .grid_3-col{
    display: block;
  }
}

@media screen and (max-width: 992px) {
  .location-row{
    display: block;
  }
  .location-col{
    width: 100%;
  }
  .btn_wrapper a {
    margin: 0.5rem 0rem;
  }
}

/* ------------------- location nav zoomed ---------------- */

@media screen and (min-width: 1536px) and (max-width: 1746px) {
   #location_finder_popup {
      overflow-y: auto;
      height: 41rem !important;
   }
}

.location_result_cell_1 p{
   margin-bottom: 0 !important;
}

@media screen and (width: 1536px){
  #location_finder_popup input[type="image"]{
   height: 26px;
  }
}

#location_finder_popup input[type="text"]{
   width: 290px !important;
}

.instagram_arrow{
  z-index: 99 !important;
}

#location_finder_popup input[type="image"]{
   box-sizing: unset !important;
}



/* ------------------- Design Center Tool tip ---------------- */
 .tooltip {
      position: absolute;
      background-color: #C930AE;
      color: #fff;
      padding: 10px;
      border-radius: 5px;
      font-size: 14px;
      z-index: 9999;
      max-width: 330px;
      height: 8.7rem;
      /* Fixed width for consistent layout */
      text-align: left;
    }

    .tooltip p {
      margin-bottom: 0;
      line-height: 1.5;
    }

    .tooltip::after {
      content: " ";
      position: absolute;
      top: 100%;
      /* At the bottom of the tooltip */
      left: 10%;
      margin-left: -5px;
      border-width: 5px;
      border-style: solid;
      border-color: #C930AE transparent transparent transparent;
    }

    .tooltip-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.5);
      z-index: 9998;
    }

    .button {
      margin: 10px;
      padding: 5px 10px;
      background-color: #007bff;
      color: #fff;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }

    .next-button,
    .skip-tutorial-button {
      margin-top: 5px;
      padding: 5px 10px;
      color: #fff;
      border: none;
      border-radius: 5px;
      cursor: pointer;
    }

    .next-button {
      background-color: transparent;
      position: absolute;
      bottom: 10px;
      right: 10px;
    }

    .skip-tutorial-button {
      background-color: #FB4840;
      position: absolute;
      bottom: 10px;
    }

    .tutorial-counter {
      color: #fff;
      font-size: 12px;
      margin-bottom: 10px;
      margin-left: auto;
      display: flex;
    }


/* ------------------- LIGHTBOX ---------------- */
   .video_row {
      display: flex;
      width: 50%;
    }
    #fade,
    #fade2 {
      display: none;
      position: fixed;
      top: 0%;
      left: 0%;
      width: 100%;
      height: 100%;
      background-color: black;
      z-index: 1001;
      -moz-opacity: 0.8;
      opacity: .80;
      filter: alpha(opacity=80);
    }

    #light,
    #light2 {
      display: none;
      position: absolute;
      top: 15%;
      left: 50%;
      max-width: 500px;
      margin-left: -300px;
      margin-top: -180px;
      border: 2px solid #FFF;
      background: #FFF;
      z-index: 1002;
      overflow: visible;
    }

    #boxclose,
    #boxclose2 {
      cursor: pointer;
      color: #fff;
      font-size: 31px;
      font-weight: bold;
      display: inline-block;
      line-height: 0px;
      padding: 11px 3px;
      position: absolute;
      right: 2px;
      top: 2px;
      z-index: 1002;
      opacity: 0.9;
    }

  .lightbox_container {
      width: 16rem;
    }

    .lightbox_container2 {
      width: 16rem;
      margin: 0rem 3rem;
    }

    .boxclose:before,
    .boxclose2:before {
      content: "x";
    }

    #fade:hover~#boxclose,
    #fade2:hover~#boxclose2 {
      display: none;
    }



@media screen and (max-width: 736px) {
.video_row{
  display: block;
    width: 80%;
    margin: auto;
}

   .lightbox_container {
   margin: 3rem 0rem;
   width: 100%;
}

    .lightbox_container2 {
       margin: 0rem;
       width: 100%;
    }

    #light,
    #light2 {
transform: translate(33%, -15%);
}


}

@media only screen and (max-width: 600px) {
.mobile-app-container .col_2{
   width: 100% !important;
} 

.mobile-app-container .col_2 h5{
   line-height: 27px !important;
}

.btn-magenta{
   font-size: 13px !important;
   line-height: 21px !important;
   padding: .5rem 1rem !important;
}

}

@media only screen and (max-width: 400px) {
.btn-magenta{
   font-size: 11px !important;
}

.tenting_page .grid_item{
   margin: 1rem 0rem;
}

.tent_banner_container{
   display: block !important;
}

}

.mobile-app-container h4{
   margin-top: 40px !important;
}


/* ------------------- Bright On! ---------------- */

.bright_on_icons_container{
  display: flex;
  width: 100%;
  margin-top: 1.5rem;
}

.bright_on_icons{
  border-radius: 50%;
  width: 3rem;
  height: 3rem;
  position: relative;
}

.bright_on_desc{
  width: 90%;
  padding-left: 1rem;
}

.bright_on_desc h4{
  margin-top: 0 !important;
}

.bright_on_desc p{
  color: gray;
  font-size: 12px;
}

.bright_on_icons img{
  width: 52%;
  filter: invert(1);
  display: unset !important;
  position: absolute;
  right: 50%;
  top: 50%;
  transform: translate(50%, -50%);
}


.video_container .video_poster a{
    background-image: url(/assets/upload/2023-bright-rentals-san-francisco-shoot-133-0.jpg) !important;
}

.album-container .button{
  background-color: #209BDE !important;
  border-radius: 0px !important;
}

.album-container .button img{
  filter: invert(1) !important;
}

   /* ------------------- Tenting Page---------------- */
 .tenting_page {
      max-width: 1400px;
      margin: auto;
    }

    .tenting_page .grid_container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }


    .tenting_page h1 {
      font-size: 30px;
      color: #209BDE;
    }

    .tenting_page .big_image img {
      width: 100%;
      height: 660px;
      object-fit: cover;
      position: relative;
     
    }

    .tenting_page .small_images {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }

    .tenting_page .small_image {
      position: relative;
      height: 325px;
    }

    .tenting_page .small_image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .tenting_page .center_text {
      text-align: center;
      position: absolute;
      top: 50%;
      right: 50%;
      transform: translate(50%, -50%);
      color: white !important;
    }

    .tenting_page p {
      font-size: 15px;
      text-align: center;
    }

    .tenting_page .smaller_title {
      color: #209bde;
      text-align: center;
    }

    .big_image_overlay{
     background: rgba(255, 255, 255, 0.312);;
     position: absolute;
     height: 100%;
     width: 100%;
     z-index: 3;
    }

    .tent_banner_container {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
    }

    .tent_banner_container img {
      width: 50%;
      height: 100%;
      object-fit: cover;
    }

    .tent_banner_container .tent_text {
      width: 50%;
      text-align: left;
      color: white;
      height: 100%;
    }

    .tent_banner_container .tent_text p {
      text-align: left;
      color: white;
    }

    .tenting_page .grid_item {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 340px;
    }

 .big_image {
  position: relative;
}

.tent_img_content {
position: absolute;
    top: 1rem;
    right: 50%;
    transform: translate(50%, 8%);
    width: 85%;
    border: 3px solid #333399;
    padding: 1rem;
    z-index: 9;
}

.tent_img_content h1 {
  font-size: 30px !important;
  text-transform: uppercase;
  color: white !important;
  text-align: center;
  font-weight: 800 !important;
}

.tent_img_content h2 {
  color: #A4CE6F !important;
  text-align: center;
  font-size: 25px !important;
  font-weight: 700 !important;
}

.tent_img_content p {
  text-align: center;
  color: white;
  font-size: 15px;
  margin: .5rem 0rem !important;
}

    @media screen and (max-width: 767px) {
      .tenting_page .grid_container {
        display: block;
      }

      .tenting_page .grid_item {
        flex-direction: column;
        height: 100%;
      }

      .tenting_page .grid_item img {
        width: 100% !important;
      }

      .tent_text {
        width: 100% !important;
      }
    }

.tenting-page-btn{
padding: 20px;
    color: #fff;
    font-size: 15px;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    font-weight: normal;
    text-transform: uppercase;
    vertical-align: top;
    border: none;
    line-height: 32px;
    width: 100%;
    margin: .5rem 0;
cursor: pointer;
    position: relative;
    right: -51%;
    border-radius: 5px;
}

@media screen and (max-width: 736px) {
    #nav_play_mobile {
        display: none !important;
    }
}





















