body
{
  padding: 0px ;
  margin: 0px ;
  background-image: none ;
  background-color: #fefb80 ;
}

/********************************************************************/
/**  BEGINNING OF COVID-19 SPECIAL CODE                            **/
/********************************************************************/
#covid
{
  height: 90px ;
  border: solid 2px #0000b0 ;
  background-color: #a5feff ;
}

#inner_covid
{
  width: 800px ;
  text-align: center ;
  background-color: #ffffff ;
  margin: auto ;
}

#heart
{
  float: left ;
}

#covid_notice
{
  background-color:  #a5feff ;
  color: #0000b0 ;
  font-family: 'Wire One' ;
  font-size: 1.8em ;
  display: block ;
  padding-top: 10px ;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 15; /* Sit on top */
  padding-top: 10px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100% ; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgba(0,0,0,0.5); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #a5feff ;
  color: #0000b0 ;
  margin: auto ;
  border: 3px solid #0000b0 ;
  width: 80%;
}

#border_div
{
  border: 1px solid #0000b0 ;
  padding: 20px;
  margin: 2px ;
}

/* The Close Button */
.close {
  color: #0000b0 ;
  float: right ;
  font-size: 36px ;
  font-weight: bold ;
}

#covid:hover
{
  cursor: pointer;
}

.close:hover,
.close:focus
{
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.intro
{
  font-family: 'Wire One', sans-serif ;
  font-size: 2.5em ;
  font-weight: 900 ;
  color: #0000b0 ;
}

.procedure
{
  font-family: 'Oswald', sans-serif ;
  color: #0000b0 ;
}

@media only screen and (max-width: 800px)
{
  #covid_notice
  {
    font-size: 1.4em ;
    padding-top: 10px ;
  }

  #inner_covid
  {
    width: 100% ;
  }

  #heart
  {
    width: 70px ;
    padding-top: 10px ;
  }
}

@media only screen and (max-width: 550px)
{
  #covid
  {
    height: 70px ;
  }
  
  #covid_notice
  {
    font-size: 1.2em ;
    padding-top: 10px ;
  }

  #inner_covid
  {
    width: 100% ;
  }

  #heart
  {
    width: 60px ;
    padding-top: 5px ;
  }
}

@media only screen and (max-width: 450px)
{
  #covid
  {
    height: 60px ;
  }
  
  #covid_notice
  {
    font-size: 1em ;
    padding-top: 10px ;
  }

  #inner_covid
  {
    width: 100% ;
  }

  #heart
  {
    width: 50px ;
    padding-top: 5px ;
  }
}

@media only screen and (max-width: 380px)
{
  #covid
  {
    height: 60px ;
  }
  
  #covid_notice
  {
    font-size: .9em ;
    padding-top: 10px ;
  }

  #inner_covid
  {
    width: 100% ;
  }

  #heart
  {
    width: 40px ;
    padding-top: 10px ;
  }
}

/********************************************************************/
/**  END OF COVID-19 SPECIAL CODE                                  **/
/********************************************************************/

#header
{
  height: 129px;
  background-color: #fefb80;
  border: 2px solid #000000;
}

h1
{
  font-family: Handlee; color:black; font-size:2.2em;
  height: "120";
  padding-left: 180px;
  text-align: center ;
}

#menu_logo
{
  position: relative ;
  right: 25px ;
  top: -8px ;
  width: 99px ;
  height: 70px ;
}

#home_menu
{
  background-color: #fefb80;
  width: 100% ;
}

#home_button
{
  background-color: #fefb80 ;
  border-width: 0px 2px ;
  border-style: solid ;
  border-color: #000000 ;
  color: #000000;
  padding: 8px 25px;
  text-align: left ;
  cursor: pointer;
  width: 100% ;
  font-size: 2.5em ;
  outline: none ;
  height: 70px ;
}

#button_text
{
  font-family: Handlee;
  font-weight: 700 ;
  position: relative ;
  top: 2px ;
}

@media only screen and (max-width: 810px)
{
  #home_button
  {
    font-size: 2em ;
  }
  
  #button_text
  {
    top: 8px ;
  }
}

@media only screen and (max-width: 700px)
{
  #home_button
  {
    font-size: 1.7em ;
  }
  
  #button_text
  {
    top: 10px ;
  }
}

@media only screen and (max-width: 620px)
{
  #home_button
  {
    font-size: 1.5em ;
  }

  .my_fa_bars
  {
    font-size: 1.8em ;
  }
}

@media only screen and (max-width: 570px)
{
  #home_button
  {
    font-size: 1.2em ;
  }
}

@media only screen and (min-width: 435px) and (max-width: 455px)
{
  #button_text
  {
    left: -8px ;
  }

  .my_fa_bars
  {
    font-size: 1.3em ;
  }
}

@media only screen and (max-width: 440px)
{
  #button_text
  {
    top: 2px ;
  }
}

#destination
{
  font-family: Handlee ;
  font-size: 2.5em ;
  background-color: #82fdfc ;
  padding-left: 5px ;
}

@media only screen and (max-width: 430px)
{
  #destination
  {
    text-align: center ;
  }
}

#destination2
{
  font-family: Handlee ;
  font-size: 2.0em ;
  text-align: center ;
  background-color: #82fdfc ;
}

/* Style the navigation menu */
.topnav
{
  overflow: hidden;
  background-color: #fefb80;
  position: relative;
  font-family: Handlee;
}

/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks
{
  display: none;
}

/* Style navigation menu links */
.topnav a
{
  color: black;
  padding-top: 18px ;
  padding-bottom: 12px;
  padding-left: 25px ;
  padding-right: 16px;
  text-decoration: none;
  text-align: center ;
  font-size: 1.8em;
  font-weight: 700 ;
  display: block;
  border-width: 0px 2px ;
  border-style: solid ;
  border-color: #000000 ;
}

/* Style the hamburger menu */
.hamburger
{
  background: #fefb80;
  display: block;
  position: absolute ;
  right: 0 ;
  padding-right: 10px ;
  padding-top: 10px ;
  font-size: 1.2em ;
  border-width: 0px 2px 0px 0px ;
  margin-right: 2px ;
  top: 0;
}

.topnav a:hover
{
  background-color: #aaaaaa;
}

a.gradient
{
  background-image: -webkit-radial-gradient(ellipse, #fefb80 0%, #fefb80 60%, #ffffff 100%);
  border-top: 1px ;
  border-top-color: #cccccc ;
  border-top-style: solid ;
}


a.make_reservation
{
  color: #25368d ;
  border-width: 3px ;
  border-style: solid ;
/* Border color: red, background color:  orange
  border-color: #dd3213 ;
  background-color: #FFAE62 ;
  Style the hamburger menu */
  border-color: #25368d ;
  background-color: #dddddd ;
  font-weight: 100 ;
}

.book_it
{
  font-family: serif ;
  text-align: center ;
  font-size: 1.2em ;
  padding: 0px ;
  margin: 0px ;
}

.availability
{
  font-family: serif ;
  text-align: center ;
  font-size: 0.8em ;
  padding: 0px ;
  margin: 0px ;
}

@media only screen and (max-width: 500px)
{
  .book_it
  {
    font-size: 1em ;
    padding: 0px ;
    margin: 0px ;
  }

  .availability
  {
    font-size: .6em ;
    padding: 0px ;
    margin: 0px ;
  }

  #destination
  {
    font-size: 1.4em ;
  }

  #destination2
  {
    font-size: 1.2em ;
  }
}

#changing_image_frame
{
  width: 800px ;
  height: 450px ;
  margin: auto ;
  position: relative ;
  display: block ;
}

#changing_photo1
{
  width: auto ;
  height: auto ;
  position: absolute ;
  top: 0 ;
  left: 0 ;
  z-index: 10 ;
}

#changing_photo2
{
  width: auto ;
  height: auto ;
  position: absolute ;
  top: 0 ;
  left: 0 ;
  z-index: 5 ;
}

#award
{
  width: auto ;
  height: auto ;
  display: block ;
  margin: auto ;
}

#main_photo
{
  width: auto ;
  height: auto ;
  display: block ;
  margin: auto ;
}

@media only screen and (max-width: 800px)
{
  #award
  {
    width: 25%;
  }
  #main_photo
  {
    width: 100%;
    height: 100%;
  }

  #changing_image_frame
  {
    width: auto ;
    height: auto;
  }

  #changing_photo1
  {
    width: 100% ;
  }

  #changing_photo2
  {
    width: 100% ;
    top: 0 ;
    left: 0 ;
  }

  #destination
  {
    font-size: 1.8em ;
  }

  #destination2
  {
    font-size: 1.5em ;
  }
}

/* Style the active link (or home/logo) */
.active
{
  background-color: #fefb80 ;
  color: white;
}

img.logo
{
  float: left;
}

.temp_menu
{
  font-family: Handlee ;
  font-size: 1em ;
  text-decoration: none ;
  color: #ffffff ;
  padding: 0px ;
}

/***************************************************/
/* BLACK LIVES MATTER CODE BEGIN                   */
/***************************************************/

#width_frame
{
  font-family: Roboto ;
  font-size: 2em ;
  font-weight: 900 ;
  width: 100% ;
  height: 60px ;
  background-color: black ;
  color: yellow ;
  border: none ;
  text-align: center ;
}

@media only screen and (max-width: 390px)
{
  #width_frame
  {
    font-size: 1.6em ;
    padding-top: 5px ;
    height: 55px ;
  }
}

.black_lives
{
  display: inline-block ;
}

.yellow_line
{
  width: 100% ;
  height: 2px ;
  background-color: yellow ;
}

.black_line
{
  width: 100% ;
  height: 4px ;
  background-color: black ;
}

.black_lives:hover
{
  background-color: yellow ;
  color: black ;
}

/***************************************************/
/* BLACK LIVES MATTER CODE END                     */
/***************************************************/

.mobile_blurb
{
  padding-left: 10px;
  padding-right: 10px;
  margin-left: 10px;
  margin-right: 10px;
  width: auto ;
}

#month_list
{
  font-family: Handlee ;
  font-size: 2.5em ;
  width: 100% ;
  padding-top: 0px ;
  background-image: url("../images/Mobile/seasons.jpg") ;
  background-size: 100% 100% ;
  margin-bottom: 50px ;
}

.month_link
{
  text-decoration: none ;
}

.top_month_box
{
  width: 480px ;
  height: 100px ;
  margin-left: auto ;
  margin-right: auto ;
  margin-top: 0px ;
  border: 1px solid black ;
  box-shadow: 0px 6px 10px #222222 ;
}

.month_box
{
  width: 480px ;
  height: 100px ;
  margin-left: auto ;
  margin-right: auto ;
  margin-top: 30px ;
  border: 1px solid black ;
  box-shadow: 0px 6px 10px #222222 ;
}

@media only screen and (max-width: 500px)
{
  .top_month_box
  {
    width: 90% ;
  }
  
  .month_box
  {
    width: 90% ;
  }
}

.centering_frame
{
/*  text-align: center ; */
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center ;
  height: 80px ; /* Adjust the height as needed */
}

.month
{
  width: 100px ;
  height: 100px ;

}

.month_name
{
  text-decoration: none ;
  color: black ;
  position: relative ;
  top: -40px ;
  left: 10px ;
}

.image_link
{
  text-align: center ;
}

.image_block
{
/*  position: relative ; */
  width 100% ;
  height: 60px ;
  display: block ;
}

.framed_image_link
{
  text-align: center ;
  display: inline-block ;
  border: 1px solid black ;
  box-shadow: 0px 4px 8px #222222 ;
}

.framed_social_media_link
{
/*  text-align: center ;
  display: inline-block ;
  height: 60px ; */
  position: relative ;
  border: 1px solid black ;
  box-shadow: 0px 4px 8px #222222 ;
}

.social_media_text
{
  position: absolute ;
/*  vertical-align: top ; */
  top: 50% ;
  left: 50% ;
  transform: translate(-50%, -50%);
  font-family: Helvetica ;
  font-size: 1.2em ;
  color: white ;
}

#mobile_credit_cards
{
  position: relative ;
  text-align: center ;
}

#mobile_cc_wrapper
{
  display: inline ;
  margin-right: 10px ;
}


/***************************/
/* Common page styles      */
/***************************/

.picture_box
{
  width: 100% ;
  height: 100px ;
  position: relative ;
/*  border: 1px solid orange ; */
}

.left_frame
{
  width: 50% ;
  height: auto ;
  float: left ;
/*  border: 1px solid red ; */
}

.right_frame
{
  width: 50% ;
  height: auto ;
  float: right ;
/*  border: 1px solid blue ; */
}

.single_unit
{
  height: 30px ;
  width: auto ;
}

.double_unit
{
  height: 60px ;
  width: auto ;
}

.triple_unit
{
  height: 90px ;
  width: auto ;
}

footer
{
  font-family: "Times", serif ;
  font-weight: 500 ;
  text-align: center ;
}

.site_links
{
  font-size: 1.2em ;
  display: inline-block ;
  height: 40px ;
}


@media only screen and (max-width: 430px)
{
  .site_links
  {
    font-size: 0.9em ;
  }
}

.information
{
  font-family: "Times", serif ;
  font-style: italic ;
  font-size: 1.2em ;
}

#links
{
  font-family: "Oswald", sans-serif ;
  font-weight: 500 ;
  width: 80% ;
  height: auto ;
  display: inline-block ;
}

.column1
{
  float: left ;
  width: 50% ;
}

.column2
{
  float: left ;
  width: 50% ;
}


/****************************/
/* Tabbed page styles       */
/****************************/

#table_frame
{
  background-color: transparent ;
  margin: 0 auto ;
}

#mobile_table
{
  font-family: Overlock ;
  background-color: white ;
  margin: 0 auto ;
  border: 1px solid black ;
  width: 480px ;
}

@media only screen and (max-width: 600px)
{
  #mobile_table
  {
    width: 80% ;
  }
}

.sub_bullets
{
  margin-top: 0px ;
  margin-bottom: 0px ;
}

img.bullet
{
  width:25px;
  height:25px;
  background:url('../images/Logo_icon.jpg') 0 0;
}

img.blank
{
  width:25px;
  height:25px;
  background:url('../images/Logo_icon.jpg') 0 25;
}

#first_col
{
  width:35px;
}

.mobile_tab_header
{
  font-family: Handlee;
  font-size: 2em;
  font-weight: 700;
  text-align: center;
}

.tab_header_logo
{
  position: relative ;
  top: 20px ;
  padding-right: 20px ;
}

.tabs_frame
{
  width: 100% ;
  background-color: #333333
  border: 2px solid green;
  align-content: center ;
}

.tab_text
{
  margin: 10px ;
  font-family: Overlock ; 
  font-size: 1.2em ;
}


/***************************/
/* Your Room page styles   */
/***************************/

#room_name
{
  font-family: Handlee ;
  font-size: 1.5em ;
  font-weight: 700;
  text-align: center;
  padding-top: 50px ;
}

@media only screen and (max-width: 800px)
{
  .left_room_photos
  {
    width: 100%;
    height: 100%;
    border-top-style: ridge ;
    border-bottom-style: ridge ;
  }

  .right_room_photos
  {
    width: 100%;
    height: 100%;
    border-top-style: ridge ;
    border-bottom-style: ridge ;
  }
}

@media only screen and (min-width: 801px)
{
  .left_room_photos
  {
    width: auto ;
    height: auto ;
    display: block ;
    border-top-style: ridge ;
    border-bottom-style: ridge ;
  }
  
  .right_room_photos
  {
    width: auto ;
    height: auto ;
    display: block ;
    float: right ;
    border-top-style: ridge ;
    border-bottom-style: ridge ;
  }
  
  .tab_text
  {
    width: 700px ;
    margin: 0 auto ;
  }
}

@media only screen and (min-width: 810px)
{
  .left_room_photos
  {
    width: auto ;
    height: auto ;
    display: block ;
    border-style: ridge ;
  }
  
  .right_room_photos
  {
    width: auto ;
    height: auto ;
    display: block ;
    float: right ;
    border-style: ridge ;
  }
}

/******************************/
/* Bon Appétit! page styles   */
/******************************/

#knife_text
{
  position: absolute ;
  font-family: Handlee ;
  font-size: 1.4em ;
  color: black ;
  left: 20px ;
  padding-top: 18px ;
}


@media only screen and (max-width: 450px)
{
  #knife_text
  {
    font-size: 1.2em ;
    left: 5px ;
  }

  .framed_image_link
  {
    width: 90% ;
  }

  .knife_wrapper
  {
    width: 90% ;
    max-width: 100% ;
    max-height: 100% ;
  }
}

@media only screen and (max-width: 425px)
{
  #knife_text
  {
    font-size: 1em ;
    left: 15px ;
  }
}

@media only screen and (max-width: 370px)
{
  #knife_text
  {
    font-size: 1em ;
    left: 5px ;
  }
}

@media only screen and (max-width: 350px)
{
  #knife_text
  {
    font-size: .9em ;
    left: 10px ;
  }
}

#gallery_frame
{
  width: 950px ;
  margin: auto ;
}

@media only screen and (max-width: 950px)
{
  #gallery_frame
  {
    width: 100% ;
  }
}


/*****************************/
/* Policies page styles      */
/*****************************/

ul.a
{
  list-style-type: circle ;
  word-break: break-all ;
  
}

/****************************/
/* Directions page styles   */
/****************************/


/****************************/
/* Contact Us page styles   */
/****************************/


