
/**Stylesheet for On The Rocks.*/
@font-face{
  font-family: icomoon;
  src: url('../Fonts/icomoon.woff') format('woff'),
     url('../Fonts/icomoon.ttf') format('truetype');
  font-display: swap;  
}

@font-face{
  font-family: gloock;
  src: url('../Fonts/gloock.woff2') format('woff2'),
     url('../Fonts/gloock.ttf') format('truetype');
  font-display: swap;  
}

@font-face{
  font-family: prata;
  src: url('../Fonts/prata.woff2') format('woff2'),
     url('../Fonts/prata.ttf') format('truetype');
  font-display: swap;  
}

@font-face{
  font-family: outfit;
  src: url('../Fonts/outfit-light.woff2') format('woff2'),
     url('../Fonts/outfit-light.ttf') format('truetype');
  font-display: swap;  
}

@font-face{
  font-family: outfitsb;
  src: url('../Fonts/outfit-semibold.woff2') format('woff2'),
     url('../Fonts/outfit-semibold.ttf') format('truetype');
  font-display: swap;  
}

@font-face{
  font-family: pantelleria;
  src: url('../Fonts/Pantelleria.woff2') format('woff2'),
     url('../Fonts/Pantelleria.ttf') format('truetype');
  font-display: swap;  
}

html, body {
	height: 100%;
}

body{
	display: flex;
	flex-direction: column;
	padding: 0;
	margin: 0;
	font-family: outfit, sans-serif;
	background: var(--bright);
}


/**Basic Styles*/
:root {
  --primary: #473A32; 
  --bright: #FEFCFB;
  --secondary: #D7C9BC;
  --tertiary: #998C81;
  --dark: #2F2721;
}

.basket:before{
  font-family: icomoon;
  content: "\e902";
}

.tripadvisorreview:before{
  font-family: icomoon;
  font-size: .9em;
  content: "\e911";
}

.googlereview:before{
  font-family: icomoon;
  font-size: .9em;
  content: "\ea88";
}

.calendar:before{
  font-family: icomoon;
  font-size: .9em;
  content: "\e90d";
}

.email:before{
  font-family: icomoon;
  content: "\e901";
}

.phone:before{
  font-family: icomoon;
  content: "\e900";
}

.location:before{
  font-family: icomoon;
  content: "\e905";
}

.clock:before{
  font-family: icomoon;
  content: "\e90c";
}

.peop,e:before{
  font-family: icomoon;
  content: "\e90b";
}

.price:before{
  font-family: icomoon;
  content: "\e90a";
}

.menu-toggle-inactive:before{
  font-family: icomoon;
  content: "\e909";
  font-size: .9em;
}

.menu-toggle-active:before{
  font-family: icomoon;
  content: "\e903";
  color: var(--bright);
}

.sun:before{
  font-family: icomoon;
  content: "\e910";
}

.arrow:before{
  font-family: icomoon;
  content: "\e904";
}

.star:before{
  font-family: icomoon;
  content: "\e907";
}

.dots:before{
  font-family: icomoon;
  content: "\e908";
}

.quote:before{
  font-family: icomoon;
  content: "\e906";
}

#wrapper{
  position: relative;
  box-sizing: border-box;
}

section{
  position: relative;
  padding: 2em 0em;
  box-sizing: border-box;
}

.margins{
  position: relative;
  padding: 0em 1em;
  box-sizing: border-box;
}

.headers_dark h1, .headers_dark h2{
  color: var(--bright) !important;
  margin: 0em 0em .4em 0em;
}

.headers h1, .headers h2{
  font-family: prata, sans-serif;
  font-size: 2em;
  color: var(--primary);
  text-align: center;
  line-height: 1.2em;
  margin: 0em 0em .4em 0em;
}

.headers span{
  display: block;
  font-family: outfit, sans-serif;
  font-size: .5em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: .3em;
}




/**Call To Action*/
.cta_block{
    display: flex;
    flex-wrap: wrap;
}

.cta_block_left{
    justify-content: left;
    gap: 1.5em;
}

.cta_block_left a{
    border-radius: 5px;
}

.cta_block a{
    position: relative;
    font-family: outfitsb, sans-serif;
    text-transform: uppercase;
    text-decoration: none;
    padding: 1em;
    color: var(--bright);
    box-sizing: border-box;
}

.cta_fill{
  color: var(--primary) !important;
  border: 2px solid var(--secondary);
  background: var(--secondary);
}

.cta_opaque{
  color: var(--secondary) !important;
  border: 2px solid var(--secondary);
  background: rgba(71, 58, 50, .4);
}

.cta_opaque_bright{
  color: var(--tertiary) !important;
  border: 2px solid var(--tertiary);
}

.cta_block a .arrow{
  display: inline-block;
  transform: rotate(-45deg);
  transition: transform .5s;
}

.cta_block a:hover .arrow{
  transform: rotate(0deg);
}


.cta_fill:hover{
  border: 2px solid var(--tertiary);
  background: var(--tertiary);
}

.cta_opaque:hover{
  color: var(--tertiary) !important;
  border: 2px solid var(--tertiary);
  background: rgba(71, 58, 50, .4);
}

.cta_opaque_bright:hover{
  color: var(--primary) !important;
  border: 2px solid var(--primary);
}






/**Masthead Styles*/
#masthead{
  position: fixed;
  top: 0em;
  left: 0em;
  width: 100%;
  background: var(--bright);
  height: 6.5em;
  border-bottom: 1px solid #A0A0A0;
  box-sizing: border-box;
  z-index: 3;
}

#top_bar{
  position: absolute;
  top: 0em;
  left: 0em;
  width: 100%;
  height: 2.6em;
  display: flex;
  flex-wrap: wrap;
  justify-content: right;
  align-items: center;
  font-family: outfit, sans-serif;
  font-size: .9em;
  color: var(--bright);
  padding: .3em 1em;
  background: var(--primary);
}

.top_bar_item{
  position: relative;
  padding: 0em 2em;
  box-sizing: border-box;
}

#top_bar a{
  text-decoration: none;
  color: var(--bright);
}

#top_bar a:hover{
  color: var(--secondary);
}

#top_bar_email{
  display: none;
  position: relative;
  padding-left: 2em;
}

.top_bar_item:nth-child(1), .top_bar_item:nth-child(2){
    border-right: 1px solid var(--bright);
}

.top_bar_item:nth-child(2){
    display: none;
}


#header_social a{
  font-size: 1.2em;
  margin-right: 1em;
}

#header_social a:last-child{
  margin-right: 0em;
}

#logo{
  position: absolute;
  top: 3em;
  left: 1em;
  width: 10em;
}

#logo img{
  width: 100%
  height: auto;
}



/**Cart Stylrs*/
#cart_header{
  position: absolute;
  top: 1.3em;
  right: 3em;
  font-size: 2.2em;
  color: var(--primary);
  text-decoration: none;
}

.cart-customlocation{
  position: absolute;
  top: .7em;
  right: -.7em;
  font-family: sans-serif;
  font-size: .35em;
  color: var(--bright);
  padding: 0em .3em;
  text-decoration: none;
  border-radius: .5em;
  background-color: var(--primary);
}



/**Navigation Styles*/
#desktop_navigation{
  display: none;
}

#menu-toggle{
  position: fixed;
  top: 1.07em;
  right: .5em;
  font-size: 2.5em;
  color: var(--primary);
  z-index: 12;
}

#cart_header:hover, #menu-toggle:hover{
  cursor: pointer;
  color: var(--tertiary);  
}

.menu-toggle-active:hover::before, #navigation a:hover, #nav_social a:hover, #nav_contact a:hover{
  color: var(--tertiary);
}






#navigation_modal{
  display: none;
  position: fixed;
  top: 0em;
  left: 0em;
  width: 100%;
  height: 100%;
  height: 100vh;
  padding: 2em 0em;
  background: var(--dark);
  background: linear-gradient(45deg, var(--primary), var(--dark));
  z-index: 11;
  box-sizing: border-box;
}

#navigation{
  margin-top: 5em;
  width: 100%;
  height: 100vh;
  padding-bottom: 10em;
  overflow: scroll;
}

#navigation ul{
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
  padding: 0em 2em;
  padding-bottom: 4em;
}

#navigation li{
  margin: 0em 0em 1em 0em;
}

#navigation a{
  font-family: prata, sans-serif;
  font-size: 2em;
  color: var(--bright);
  margin: .2em 0em;
  text-decoration: none;
  text-transform: uppercase;
}


#nav_logo, #nav_contact{
  display: none;
}

#nav_social{
  padding: 1em 0em 0em 2em;
}

#nav_social a{
  font-size: 1.8em;
  margin-right: 1em;
  color: var(--bright);
  text-decoration: none;
}

#nav_social a:last-child{
  margin-right: 0em;
}





/**Badge Ratings*/
.badge_link{
  display: inline-flex; 
  flex-wrap: wrap;
  justify-content: flex-start;
  text-decoration: none;
  padding: .5em 1em;
}

.badge_rating_image{
  position: relative;
  font-size: 3em;
  line-height: 1em;
  padding-top: .05em;
  padding-right: .2em;
}


.badge_star_holder span{
  font-size: 1.2em;
}






/**Landing Styles*/
#landing{
  position: relative;
  width: 100%;
  height: 100%;
  height: 98.5vh;
  min-height: 51em;
  background-image: url("http://er.inksplat.dev/wp-content/uploads/2026/03/bg.jpg");
  background-size: cover;
  background-position: bottom center;
  box-sizing: border-box;
}

#landing_overlay{
  position: absolute;
  top: 0em;
  left: 0em;
  width: 100%;
  height: 100%;
  height: 98.5vh;
  min-height: 51em;
  background: rgba(71, 58, 50, .6);
  background: rgba(0, 0, 0, .5);
}


#landing_center{
  position: relative;
  top: calc(50% + 4em);
  width: 90%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#landing_content h1{
  font-family: prata, sans-serif;
  font-size: 2.1em;
  color: var(--bright);
  text-align: center;
  line-height: 1.2em;
  margin: 0em 0em .5em 0em;
  text-shadow: 1px 1px 2px var(--dark);
}

#landing_content h2{
  font-family: outfitsb, sans-serif;
  font-size: 1.3em;
  color: var(--bright);
  text-align: center;
  line-height: 1.2em;
  margin: 0em 0em 1em 0em;
  text-shadow: 1px 1px 2px var(--dark);
}

#landing_content p{
  font-size: 1.1em;
  line-height: 1.5em;
  color: var(--bright);
  text-align: center;
  margin: 0em 0em 0em;
  text-shadow: 1px 1px 2px var(--dark);
}

#landing_content .cta_block{
  padding-top: 2.5em;
}

#landing_content .cta_block{
  justify-content: center;
}

#landing_content  .cta_block_left a{
    color: var(--primary);
    margin: 0em 1em;
}


#landing_reviews{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-size: .8em;
  padding-top: 3.5em;
}

#landing_reviews a{
  color: var(--secondary);
}

#landing_corner{
  position: absolute;
  right: 0em;
  bottom: 0em;
  height: 1em;
  width: calc(15vw - 1.5em);
  background: var(--primary);
}

#landing_corner svg{
  position: relative;
  left: -1.5em;
  width: auto;
  height: 100%;
  fill: var(--primary);
}






/**Home Packages*/
#home_packages{
  position: relative;
  background: var(--primary);
  padding-top: 3.5em !important;
  box-sizing: border-box;
}





/**Intro About Styles*/
#about_grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 2em;
  align-items: center;
  box-sizing: border-box;
}

#about_left h2{
  font-family: prata, sans-serif;
  font-size: 2.5em;
  line-height: 1.2em;
  margin: 0em 0em .7em 0em;
}

#about_right{
  position: relative;
}

#about_images, #how_images{
  position: relative;
  left: 50%;
  width: 100%;
  max-width: 35em;
  padding: 2em 1em;
  overflow: auto;
  transform: translateX(-50%);
  background: repeating-linear-gradient(45deg, var(--secondary), var(--secondary) 2px, var(--bright) 2px, var(--bright) 20px);
}

#about_image_1, #how_image_1{
  position: relative;
  width: 90%; 
  max-width: 30em;
}

#about_image_2, #how_image_2{ 
  position: relative;
  width: 90%; 
  max-width: 25em;
  float: right;
  margin-top: -5em;
  border: 1px solid var(--bright);
}


#about_image_1 img, #about_image_2 img, #how_image_1 img, #how_image_2 img{
  display: block;
  width: 100%;
  height: auto;
}




/**Why Us Styles*/
#why_choose_us{
  position: relative;
  background: var(--tertiary);
  box-sizing: border-box;
}

#why_us_holder{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5em;
  padding-top: 1.5em;
  box-sizing: border-box;
}

.why_us_block{
    position: relative;
    width: 14em;
}

.why_us_icon{
  position: relative;
  left: 50%;
  width: 90%;
  max-width: 9em;
  transform: translateX(-50%);
  box-sizing: border-box;
}

.why_us_icon img{
  display: block;
  width: 100%;
  height: auto;
}

.why_us_block h5{
  font-family: outfitsb, sans-serif;
  font-size: 1.3em;
  color: var(--primary);
  text-align: center;
  text-transform: uppercase;
  line-height: 1.1em;
  margin: 1em 0em 0em 0em;
}







/**How Styles*/
#how_grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 2em;
  align-items: center;
  box-sizing: border-box;
}

#how_right ul{
  margin: 0;
  padding: 0;
}

#how_right li{
  padding-bottom: 1.5em;
}

#how_right strong{
  font-family: outfitsb, sans-serif;
  font-size: 1.1em;
}








/**Testimonial Styles*/
#testimonials{
  position: relative;
  background: var(--primary);
  box-sizing: border-box;
}

#review_stats{
  position: relative;
  color: var(--bright);
  text-align: center;
  padding: 1em 0em 3em 0em;
  box-sizing: border-box;
}

#review_stats a{
  color: var(--tertiary);
}

#testimonials_desktop{
  display: none;
}

.wptww-avtar-image, .wptww-testimonial-content h4, .fa-quote-left, .wptww-testimonials-text p em:before, .wptww-testimonials-text p em:after{
  display: none;
}

.wptww-testimonials-text p em:before{
    content: '⭑⭑⭑⭑⭑';
    display: block;
    font-size: 1.7em;
    color: var(--secondary);
    text-align: left;
    padding-bottom: 1em;
}

.wptww-testimonials-slidelist.design-1 .wptww-testimonials-text p, .wptww-testimonials-list.design-1 .wptww-testimonials-text p, .wptww-testimonials-slide-widget.design-1 .wptww-testimonials-text p {
    text-align: left !important;
    padding: 0em 1em;
}

.wptww-testimonials-text p em{
  font-family: outfit, sans-serif;
  font-size: 1em;
  color: var(--bright);
  font-style: normal;
  line-height: 1.7em;
  text-align: left !important;
  padding: 0em 1em 0em 1em;
}

.wptww-testimonial-client{
  font-family: outfitsb, sans-serif;
  font-size: 1.2em;
  color: var(--bright);
  text-align: left !important;
  padding-top: .8em;
  padding-left: .8em;
}







/**End Page CTA*/
#final_cta{
  position: relative;
  background: linear-gradient(to bottom, var(--bright) 50%, var(--dark) 50.1%);
  box-sizing: border-box;
}

#cta_footer_block{
  position: relative;
  left: 50%;
  width: 90%;
  max-width: 64em;
  padding: 2em;
  border-radius: 5px;
  background: var(--secondary);
  transform: translateX(-50%);
  box-sizing: border-box;
}


/**Footer Styles*/
#colophon{
  position: relative;
  padding: 4em 2em .5em 2em;
  background: var(--dark);
  box-sizing: border-box;
}

#footer_top{
  position: relative;
  grid-template-columns: 1fr;
  gap: 2em;
  text-align: center;
  padding-bottom: 2em;
  box-sizing: border-box;
}

.footer_block{
  padding: 1em 0em;
}

#footer_logo{
  position: relative;
  left: 50%;
  width: 90%;
  max-width: 25em;
  transform: translateX(-50%);
}

#footer_logo img{
  width: 100%;
  height: auto;
}

#footer_social{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

#footer_social a{
  font-size: 1.3em;
  margin: 0em .5em;
}

.footer_block h4{
  font-family: prata, sans-serif;
  font-size: 1.5em;
  color: var(--tertiary);
  margin: 0em 0em .3em 0em;
}

#footer_social a:hover, .footer_block a:hover, #footer_bottom a{
  color: var(--secondary);
} 

#footer_links ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

#footer_links li{
  margin: .5em;
}

.footer_block, .footer_block a{
  color: var(--bright);
  text-decoration: none;
}

#footer_reviews{
  padding-top: 1em;
  text-align: center;
}

#footer_reviews a{
  color: var(--bright);
}

#footer_bottom{
  font-family: outfit, sans-serif;
  font-size: .9em;
  color: var(--bright);
}

#footer_bottom nav ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  list-style: none;
  padding: 0em 0em 1em 0em;
  margin: 0em;
}

#footer_bottom nav li{
  margin: 0em 1em;
}

#footer_bottom a{
  color: var(--bright);
  text-decoration: none;
  text-align: center;
}

#copyright{
  text-align: center;
}












/**Media Queries*/

@media only screen and (min-width: 18.75em){


}


@media only screen and (min-width: 20em){

    
}


@media only screen and (min-width: 22em){


}
  

@media only screen and (min-width: 25.625em){

  /**Landing Styles*/
  #landing_corner{
    height: 2em;
    width: calc(15vw - 1.5em);
  }

  #landing_corner svg{
    left: -1em;
  }

}


@media only screen and (min-width: 28em){ 

  /**Masthead Styles*/
  .top_bar_item:nth-child(2){
      display: block;
  }

  /**Cart Stylrs*/
  #cart_header{
    right: 4em;
  }

  /**Navigation Styles*/
  #menu-toggle{
    right: 1em;
  }

  /**Landing Styles*/
  #landing_content h1{
    font-size: 2.4em;
  }

  #landing_content h2{
    font-size: 1.5em;
  }

}




@media only screen and (min-width: 30.313em){

  /**Landing Styles*/
  #landing, #landing_overlay{
    min-height: 45em;
  }

  #landing_reviews{
    padding-top: 4em;
  }
        
}


@media only screen and (min-width: 33.125em){



}






@media only screen and (min-width: 36.875em){

  /**Basic Styles*/
  .margins{
    padding: 0em 2em;
  }


  /**Navigation Styles*/
  #navigation ul{
    padding: 0em 5em;
  }

  #navigation a{
    font-size: 3em;
  }

  #nav_social{
    padding: 1em 0em 0em 5em;
  }





  /**Landing Styles*/
  #landing_corner{
    width: calc(30vw - 1.8em);
  }

  #landing_corner svg{
    left: -1em;
  }



  /**Footer Styles*/
  #footer_bottom{
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding-top: .5em;
    border-top: 1px solid var(--primary);
  }

  #footer_bottom nav{
    order: 2;
  }

  #footer_bottom nav ul{
    justify-content: right;
    padding: 0em;
  }

  #footer_bottom nav li{
    margin-right: 0em;
    margin-left: 1em;
  }

  #copyright{
    text-align: left;
    order: 1;
  }

  
}





@media only screen and (min-width: 38.5em){ 



}


@media only screen and (min-width: 42em){ 

  /**Landing Styles*/
  #landing, #landing_overlay{
    min-height: 40em;
  }

}


@media only screen and (min-width: 54em){

  /**Basic Styles.*/
  .headers h1, .headers h2{
    font-size: 2.5em;
  }

  section{
    padding: 3em 0em;
  }

  /**Home Packages*/
  #home_packages{
    padding-top: 4.5em !important;
  }



  /**Testimonial Styles*/
  #testimonials_desktop{
    display: block;
  }

  #testimonials_mobile{
    display: none;
  }
  
}


@media only screen and (min-width: 59em){

 


  /**Footer Styles*/
  #footer_top{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 2em;
    text-align: left;
  }

  .footer_block{
    padding: 0em;
  }

  #footer_logo{
    left: 0%;
    transform: translateX(-0%);
  }

  #footer_social{
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    padding-top: 1em;
  }

  #footer_social a{
    margin-left: 0em;
    margin-right: 1em;
  }

  #footer_links ul{
    display: block;
  }

  #footer_links li{
    margin: .5em 0em;
  }

  #footer_reviews{
    padding-top: 0em;
    text-align: left;
  }

  #footer_reviews a{
    color: var(--bright);
  }



}



@media only screen and (min-width: 64em){


  /**Intro About Styles*/
  #about_grid{
    grid-template-columns: 1fr 1fr;
  }

  #about_left h2{
    font-size: 3em;
    margin: 0em 0em .5em 0em;
  }

  /**How Styles*/
  #how_grid{
    grid-template-columns: 1fr 1fr;
  }
  
  #how_right{
    order: 2;
  }

  #how_left{
    order: 1;
  }

  #how_right ul{
    padding-left: 2.5em;
  }

} 



@media only screen and (min-width: 70em){



}




@media only screen and (min-width: 80em){
  
  /**Intro About Styles*/
  #about_grid{
    grid-template-columns: 55% 45%;
  }

  #about_left h2{
    font-size: 3.8em;
  }

  /**Intro About Styles*/
  #how_grid{
    grid-template-columns: 45% 55%;
  }
    
  
}


@media only screen and (min-width: 95em){


}

@media only screen and (min-width: 105em){

  
}

@media only screen and (min-width: 115em){

  
}

  
@media only screen and (min-width: 41em){ 

  
  
  
}

@media only screen and (min-width: 46em){


      
}






@media only screen and (min-width: 48em){
  
  /**Landing Styles*/
  #landing, #landing_overlay{
    min-height: 45em;
  }

  #landing_center{
    position: absolute;
    top: auto;
    bottom: 1em;
    transform: translate(-50%, 0);
  }

  #landing_content{
    max-width: 50em;
  }

  #landing_content h1{
    font-size: 2.8em;
  }

  #landing_content h2{
    font-size: 1.5em;
  }

  #landing_content h1, #landing_content h2, #landing_content p{
    text-align: left;
  }

  #landing_content .cta_block, #landing_reviews{
    justify-content: left;
  }

  #landing_content  .cta_block_left a{
      margin: 0em 1em 0em 0em;
  }

  #landing_reviews{
    padding-top: 5em;
  }

 #landing_corner{
    width: calc(30vw - 3em);
    height: 3.5em;
  }

  #landing_corner svg{
    left: -2em;
  }


}


@media only screen and (min-width: 51em){


 /**Landing Styles*/
  #landing_reviews{
    padding-top: 7em;
  }

}




@media only screen and (min-width: 54em){

  /**Basic Styles*/
  .margins{
    left: 50%;
    width: 90%;
    padding: 0em;
    transform: translateX(-50%);
  }


  /**Navigation Styles*/
  #navigation_content{
    display: grid;
    grid-template-columns: 60% 40%;
    margin-top: 5em;
  }

  #navigation{
    margin-top: 0em;
    width: 100%;
    overflow: scroll;
    border-right: 1px solid var(--bright);
  }

  #navigation_right{
    padding: 0em 5em;
  }

  #nav_logo{
    display: block;
    width: 100%;
    max-width: 30em;
  }

  #nav_contact{
    display: block;
    font-family: raleway, sans-serif;
    color: var(--bright);
  }

  #nav_contact h2{
    font-family: prata, sans-serif;
    font-size: 1.7em;
    text-transform: uppercase;
    margin: 1em 0em .1em 0em;
  }

  #nav_contact a{
    text-decoration: none;
    color: var(--bright);
  }

  #nav_social{
    padding: 1em 0em 0em 0em;
  }

  #nav_social a{
    font-size: 1.3em;
  }


  
}

@media only screen and (min-width: 59em){

  /**Landing Styles*/
  #landing, #landing_overlay{
    min-height: 40em;
  }

  #landing_reviews{
    padding-top: 5em;
  }
}


@media only screen and (min-width: 64em){
  
  /**Navigation Styles*/
  #navigation_content{
    grid-template-columns: 1fr 1fr;
  } 
      
}



@media only screen and (min-width: 67em){

} 



@media only screen and (min-width: 70em){

  /**Cart Stylrs*/
  #cart_header{
    right: 1.5em;
  }



  /**Navigation Styles*/
  #menu-toggle{
    display: none;
  }

  #navigation_modal{
    display: none !important;
  }

  #desktop_navigation{
    display: block;
    position: fixed;
    top: 2.85em;
    right: 10em;
    width: 60em;
    z-index: 4;
  }

  #desktop_navigation ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: right;
    align-items: stretch;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  #desktop_navigation .menu-item{
      display: flex;
      margin: 0em 1em;
      padding: 0em;
  } 

  #desktop_navigation a{
    display: flex;
    align-items: center;
    font-family: outfitsb, sans-serif;
    font-size: 1em;
    color: var(--primary);
    text-decoration: none;
    text-transform: uppercase;
  } 

  #desktop_navigation a:hover{
    color: var(--tertiary);
  }

  .book_button a{
    background: var(--secondary);
    margin-left: 3em;
    padding: .8em 1.5em;
    border-radius: 5px;
  }

  .book_button a:hover{
    color: var(--primary)!important;
    background: var(--tertiary);
  }


    /**Landing Styles*/
  #landing, #landing_overlay{
    min-height: 42em;
  }

  #landing_content h1{
    font-size: 3.4em;
  }

  #landing_content h2{
    font-size: 1.5em;
  }

}



@media only screen and (min-width: 80em){
  

    
  
}


@media only screen and (min-width: 95em){


}

@media only screen and (min-width: 105em){

  
}

@media only screen and (min-width: 115em){

  
}
















