:root {
  --theme-red: #c04f4c;
  --theme-yellow: #ffc107;
  --theme-BGreen: #009B3A;
}

body {
  width: 100%; /* Set the width to 100% */
  margin: 0; /* Remove any default margin */
  padding: 0; /* Remove any default padding */
}

p {
  font-size: larger;
}

/* #region Utility */
.error-message {
  color: red;
}

@font-face {
  font-family: "Bahama";
  src: url(/bahama-slim/BahamaSlim.ttf) format("truetype");
}

h2.Bahama, h3.Bahama { 
  font-family: "Bahama", Verdana, Tahoma;
}

.Bahama.title {
  font-size: calc(2.325rem + 0.9vw);
  margin: 0px;
  color: var(--theme-red);
  font-weight: 700;
  -webkit-text-stroke: 1px var(--theme-yellow);
}

.Bahama.titleRed {
  font-size: calc(2.325rem + 0.9vw);
  margin: 0px;
  color: var(--theme-yellow);
  font-weight: 700;
  -webkit-text-stroke: 1px var(--theme-red);
}

.Bahama.heading {
  color: black;
  -webkit-text-stroke: 1px var(--theme-red);
}

.Bahama.text {
  -webkit-text-stroke: 1px white;
}

/* Jamaican-themed Paragraph Font */
.jamaican-paragraph {
  font-family: 'Cabin Sketch', cursive;
  /* font-size: 20px; Adjust the font size as needed */
  line-height: 1.5;
  color: black; /* Adjust the color as needed */
}

.jamaican-paragraph.bold {
  /* font-size: 20px; Adjust the font size as needed */
  line-height: 1.5;
  font-weight: bold;
  -webkit-text-stroke: 0.5px black;
}

.jamaican-paragraph.white {
  color: White; /* Adjust the color as needed */
  /* font-size: 40px; */
}

.jamaican-paragraph.gold {
  color: #a78e68; /* Adjust the color as needed */
  /* font-size: 30px; */
  -webkit-text-stroke: 0.5px #a78e68;
}

.jamaican-paragraph.gold.title {
  color: #a78e68; /* Adjust the color as needed */
  /* font-size: 38px; */
  -webkit-text-stroke: 0.5px #ffffff;
}

/* Jamaican-themed H3 Font */
.jamaican-h3 {
  font-family: 'Cabin Sketch', cursive;
  /* font-size: 48px; Adjust the font size as needed */
  font-weight: bold;
  color: var(--theme-red); /* Adjust the color as needed */
  margin-bottom: 20px; /* Adjust the margin as needed */
}

.btn {
  background-color: #ffc107; /* Button background color */
  color: #000000; /* Button text color */
  border: none;
  cursor: pointer;
  transition: background-color 0.1s, color 0.1s;
  font-family: 'Cabin Sketch', cursive;
    /* font-size: 20px; Adjust the font size as needed */
    line-height: 1.5;
    -webkit-text-stroke: 0.5px black;
    
}

.btn-secondary {
  background-color: #ccc;
}

.btn-primary:active {
  background-color: var(--theme-red) !important;
}


a:hover {
  text-decoration: none;
}

.btn-primary:hover {
  background-color: #ffce3c; /* Button background color on hover */
  color: #fff; /* Button text color on hover */
  font-weight: bold;
    -webkit-text-stroke: 0.5px white;
}

.btn-secondary:hover {
  background-color: #e4e4e4;
}

.cuisine-image {
  max-width: 30%; /* Ensure the image doesn't exceed the container width */
  margin-bottom: 30px;
}

footer {
  background-color: var(--theme-BGreen);
  color: #fff;
  text-align: center;
  padding: 1em 0;
  position: ab;
  border-top: 1em solid var(--theme-yellow);
  height: 350px;
  overflow: hidden;
}

footer a {
  color: white;
}

footer.catering  {
  background-color: #333;
  border-top: 1em solid;
}

nav.cateringbg {
  background-color: #333;
  border-bottom: 2px solid;
}

nav.cateringbg .bar {
  background-color: #fff;
}

.palm-branch-icon-left,
.palm-branch-icon-right {
  width: 400px; /* Adjust size as needed */
  height: auto;
  position: relative;
  top: 10px; /* Adjust position to overflow off the corner */
  overflow: hidden;
}

.palm-branch-icon-left {
  left: -50px; /* Adjust position to overflow off the left corner */
  opacity: 0.3;
}

.palm-branch-icon-right {
  right: -50px; /* Adjust position to overflow off the right corner */
  opacity: 0.3;
}


.social-icon {
  width: 50px; /* Adjust size as needed */
  height: 30px; /* Adjust size as needed */
  margin: 0 5px; /* Adjust spacing between icons */
}

.contact-info {
  margin-top: 10px; /* Adjust spacing as needed */
}


body {
  font-family: 'Arial', sans-serif;
  margin: 0;
  padding: 0;
  padding-top: 80px;
  background-color: #f4f4f4;
  color: #333;
}

section.banner {
  padding: 50px 0;
}

section.green.banner {
  background: url('/images/greenwood3.png') center/cover;
}

section.yellow.banner {
  background: url('/images/island.png') center/cover;
}

section.red.banner {
  background: url('/images/redwood3.png') center/cover;
}

h2 {
  /* font-size: 2em; */
  margin-bottom: 1em;
  color: #fff; /* Set text color to white on the header */
}

nav, nav.catering {
  background-color: #009B3A;
  border-bottom: 5px solid #ffc107;
  color: #fff;
  text-align: center;
  height: 80px;
  position: fixed;
  width: 100%;
  z-index: 1000;
  display: flex;
  align-items: center;
  margin: 0 auto;
  top: 0;
}

nav a.logo {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 150px;
  height: auto;
}

nav a.logo img {
  width: 75%;
  height: auto;
}

nav a {
  color: #fff;
  text-decoration: none;
  padding: 1em;
  margin: 0 1em;
  position: relative;
}

nav a.navOption:hover {
  border-bottom: 2px solid #ffc107;
}

nav a.active {
  border-bottom: 2px solid red;
}

.navOption {
    font-family: 'Cabin Sketch', cursive;
    /* font-size: 20px; Adjust the font size as needed */
    line-height: 1.5;
    color: white; /* Adjust the color as needed */
    font-weight: bold;
    -webkit-text-stroke: 0.5px white;
    padding: 0;
}

.order-btn {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}

.white-divider {
  height: 8px;
  background-color: #333;
}

span i {
  width: 10px;
  height: auto;
  padding: 0px 25px 15px 10px;
}

.facebook-icon:hover,
.instagram-icon:hover,
.tiktok-icon:hover {
-webkit-text-stroke: 1px #ffffff; /* Change stroke width to 1px and color to white on hover */
}

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

.sideItems .col-md-12 {
  margin-bottom: 20px;
}
/* #endregion */
/****************************************************************************************************************/

/* #region Home CSS */
header.home {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.header-title {
  display: flex;
  align-items: center;
  color: white;
  text-shadow: -5px -5px 0 black,
                5px -5px 0 black,
                -5px 5px 0 black,
                5px 5px 0 black;
  font-family: 'JamaicanFont', sans-serif;
  /* font-size: 5em; */
}

.buttons {
  padding: 0px 50px;
}

video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(169, 169, 169, 0.3); /* Grey overlay with 0.5 opacity */
  z-index: -1;
}

.header-image {
  width: 800px; /* Ensure the image doesn't exceed the container width */
  margin-bottom: 10px; /* Adjust the margin as needed */
  margin-top: 60px;
  padding: 20px;
}

section.header {
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Add custom styling for controlling image size */
#imageCarousel img {
  max-height: 400px; /* Adjust the max height as needed */
  width: auto;
  margin: auto;
  position: relative;
  overflow: hidden;
}

#imageCarousel img::before {
  content: '';
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  border: 5px solid #fff; /* Adjust the border size and color as needed */
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.carousel-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.carousel-item {
  position: relative;
  width: 100%;
  height: 100%;
  opacity: 0.5; /* Initial transparency */
  transform: translateX(0%); /* Initial position */
  transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; /* Add smooth transition effects */
}

.carousel-item.active {
  opacity: 1; /* Fully visible on active */
  transform: translateX(0%); /* Active position */
}

.carousel-item.next {
  transform: translateX(100%); /* Push effect for next slide */
}

.carousel-item.prev {
  transform: translateX(-100%); /* Push effect for previous slide */
}

.black-col {
  width: 100%;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.7); /* Set your transparent dark background color */
  border-radius: 10px; /* Set your rounded corner radius */
}

.background-imageR {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: url('/images/redwood2.png');
  background-size: cover;
  z-index: -1; /* Place the background behind the content */
}
.bordered-div {
position: relative;
overflow: hidden; /* Hide overflowing content from the pseudo-element */
padding: 15px;
border-radius: 10px;
}
.custom-column {
      border: 5px solid black;
      border-radius: 10px;
      margin: 10px;
      padding: 20px;
      text-align: center;
      background-color: rgba(255, 255, 255, 0.8); /* Set your transparent dark background color */
      transition: transform 0.5s;
  }

  .custom-column:hover {
      transform: scale(1.05); /* Enlarge the column by 5% when hovered over */
      /* font-size: 20px; Adjust the font size as needed */
      line-height: 1.5;
      font-weight: bold;
      -webkit-text-stroke: 0.5px black;
  }

  .circle-image {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      overflow: hidden;
      margin: 0 auto 10px;
  }

  .circle-image img {
      width: 100%;
      height: auto;
  }
/* #endregion */
/****************************************************************************************************************/

/* #region Contact CSS */
header.contact {
  height: 35vh;
  background-image: url('/images/metal.jpg'); /* Set the background image path */
  background-size: cover;
  background-position: center;
  color: #fff; /* Set text color to white on the header */
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.contact-header {
  background: url('/images/metal.jpg') center/cover;

}

.formCard {
  padding: 40px;
}

.contact h2 {
  color: var(--theme-red);
}

body.contact {
  background-image: url('/images/redwood2L.png'); /* Set the background image path */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center; /* Set the vertical alignment to top and horizontal alignment to center */
  margin: 0; /* Remove default margin to ensure the image covers the entire body */
  height: 100%; /* Set the height of the body to 100% of the viewport height */
  
}
/* #endregion */
/****************************************************************************************************************/

/* #region Menu CSS*/
header.menu {
  height: 35vh;
  color: #fff; /* Set text color to white on the header */
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.menu h2 {
  color: var(--theme-red);
}

.menuSection {
  border-bottom: 1px solid #ddd;
  padding: 10px 0px;
}

.menuCard {
  padding: 25px;
}

.menuHeader {
  padding: 25px 0px;
}

.menuHeader p {
  text-align: center;
}

body .menuHeader h3 {
  text-align: center;
}

.menuOverlay img {
  max-width: 100%;
  max-height: 100%;
}

.menuOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

body.menu {
  background-image: url('/images/beachSand2.jpg'); /* Set the background image path */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center; /* Set the vertical alignment to top and horizontal alignment to center */
  margin: 0; /* Remove default margin to ensure the image covers the entire body */
  height: 100vh; /* Set the height of the body to 100% of the viewport height */
}

.card.orderNow {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  margin-bottom: 15px;
}

.card.orderNow img {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.orderNow .card-body {
  padding: 15px;
}

.menuCard {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.menuCard .card-body {
  padding: 15px;
}

.menuCard li {
  list-style: none;
  margin-bottom: 15px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.menuCard .price {
  color: green;
  font-weight: bold;
}
.bordered-div {
position: relative;
overflow: hidden; /* Hide overflowing content from the pseudo-element */
padding: 15px;
border-radius: 10px;
}

.background-imageG {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url('/images/greenwood2.png');
background-size: cover;
z-index: -1; /* Place the background behind the content */
}

.background-imageR {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url('/images/redwood2.png');
background-size: cover;
z-index: -1; /* Place the background behind the content */
}

.background-imageY {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url('/images/yellowwood3.png');
background-size: cover;
z-index: -1; /* Place the background behind the content */
}

li p {
padding-right: 25px;
}

/* #endregion */
/****************************************************************************************************************/

/* #region Services CSS */
body.services {
  background-image: url('/images/background_services3.jpg'); /* Set the background image path */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center; /* Set the vertical alignment to top and horizontal alignment to center */
  margin: 0; /* Remove default margin to ensure the image covers the entire body */
  height: 100%; /* Set the height of the body to 100% of the viewport height */
}

.column {
  width: 100%;
  padding: 20px;
  border-radius: 10px; /* Set your rounded corner radius */
  color: #fff; /* Set your text color */
}

.custom-column {
  border: 5px solid black;
  border-radius: 10px;
  margin: 10px;
  padding: 20px;
  text-align: center;
  background-color: rgba(255, 255, 255, 0.8); /* Set your transparent dark background color */
  transition: transform 0.5s;
}

.custom-column:hover {
  transform: scale(1.05); /* Enlarge the column by 5% when hovered over */
  /* font-size: 20px; Adjust the font size as needed */
  line-height: 1.5;
  font-weight: bold;
  -webkit-text-stroke: 0.5px black;
}

.circle-image {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 10px;
}

.circle-image img {
  width: 100%;
  height: auto;
}

/* #endregion */
/****************************************************************************************************************/

/* #region About CSS */
/* About CSS */
body.about {
  background-image: url('/images/greenwood2L.png'); /* Set the background image path */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center; /* Set the vertical alignment to top and horizontal alignment to center */
  margin: 0; /* Remove default margin to ensure the image covers the entire body */
  height: 100%; /* Set the height of the body to 100% of the viewport height */
}

body.about .container {
  text-align: center;

}

body.about .img-fluid {
  background-color: white;
  padding: 20px;
}



body.about .col-md-6.desc {
  align-self: center;
}

body.about .jamaican-paragraph {
  color: white;
}

body.about .photo {
  align-self: center;
}

/* #endregion */
/****************************************************************************************************************/

/* #region Catering CSS*/
.black.banner {
  background-image: url('/images/blackwood2L.png'); /* Set the background image path */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center; /* Set the vertical alignment to top and horizontal alignment to center */
  margin: 0; /* Remove default margin to ensure the image covers the entire body */
  height: 100%; /* Set the height of the body to 100% of the viewport height */
}

.catering.main button {
  width: 25%;
}

header.cateringHome {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.cateringHeader {
  display: flex;
  justify-content: center;
}

.cateringHeader img {
  width: 100%;
}

.catering {
  position: relative;
  width: 100%;
}
.catering.main {
  height: 300px; /* Set your desired height */
  background: url('/images/cateringFood.jpg') center/cover;
}
.catering.side {
  height: 300px; /* Set your desired height */
  background: url('/images/cateringsides.jpg') center/cover;
}
.catering.sweets {
  height: 150px; /* Set your desired height */
  background: url('/images/dessert.jpg') center/cover;
}
.catering.specials {
  height: 150px; /* Set your desired height */
  background: url('/images/pasta.jpg') center/cover;
}
.catering.beverages {
  height: 150px; /* Set your desired height */
  background: url('/images/drinks.jpg') center/cover;
}
.cateringblack-col {
  width: 50%;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.7); /* Set your transparent dark background color */
  border-radius: 10px; /* Set your rounded corner radius */
}
.no-background {
background-color: transparent !important;
border: none !important;
}

.custom-border {
  border: 5px solid #a78e68;
  border-radius: 15px;
  background-color: #f0ede3;
  padding: 20px 20px 20px 20px;
}

.b-box {
  width: 100%;
  height: 500px;
}

.m-box {
  width: 100%;
  height: 450px;
}

/* #endregion */
/****************************************************************************************************************/

/* Order Online*/

.container-iframe {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

iframe {
  width: 100%;
  height: 100%;
  border: none; /* Remove iframe border */
  padding: 20px 30px;
}
#fb-close-button {
  display: none !important; /* Hide the element with id fb-close-button */
}

/****************************************************************************************************************/

/* Modal Styling*/

.modal-header {
  background-color: var(--theme-yellow);
}

h4.modal-title {
  font-family: 'Cabin Sketch', cursive;
  /* font-size: 25px; Adjust the font size as needed */
  line-height: 1.5;
  color: black; /* Adjust the color as needed */
  -webkit-text-stroke: 0.5px black;
}

.modal-body h5 {
  margin-bottom: 15px;
  text-align: left;
} 

.modal-body {
  padding: 30px;
}

.modal-body .form-group {
  margin: 10px 0px 10px 0px;
}



/* Hamburger menu styles */
.hamburger-menu {
  display: none; /* Hide by default */
  cursor: pointer;
}

.bar {
  width: 25px;
  height: 3px;
  background-color: #333;
  margin: 5px auto;
  transition: background-color 0.3s ease;
}

.menu-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  display: none;
}

.sidemenu {
  position: fixed;
  top: 0;
  width: 250px;
  height: 100%;
  background-color: #0000009c;
  padding-top: 60px; /* Space for logo */
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  transition: left 0.3s ease;
}

.sidemenu .navOption {
  display: block;
  padding: 10px;
  color: #000;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.sidemenu .navOption:hover {
  background-color: var(--theme-BGreen);
}


/****************************************************************************************************************/
/****************************************************************************************************************/

/* Responsive Design*/
/* Adjust styles for smaller screens */
@media screen and (max-width: 865px) {
  .hamburger-menu {
      display: block; /* Show for smaller screens */
      padding: 15px
  }
  #navLinks {
      display: none; /* Hide the links by default */
  }

  nav a.logo {
    left: 39%;
  }

  .orderingApps {
    padding: 20px;
  }

  .order-md-2 {
    margin-top: 20px;
  }

  .order-md-1,
  .order-md-2 {
    width: 100%;
  }
}

/* Extra Small (XS) */
@media (max-width: 576px) {
  /* CSS styles for extra small screens */

  /*Utilities*/
  body{
    max-width: auto;
  }

  nav, nav.catering {
    max-width: auto;
  }

  nav a.logo {
    left: 33%;
  }

  .palm-branch-icon-left,
  .palm-branch-icon-right {
    display: none;
  }

  /* Home */

  .header-image {
    width: 576px;
  }

  .buttons .btn {
    /* font-size: 25px; */
  }

  .bordered-div {
    margin: 15px 0px;
  }

  .cuisine-image {
    max-width: 65%;
  }


  /* Menu */

  body.menu {
    background-size: auto;
  }

  header.menu {
    display: none;
  }

  /* Catering */
  .m-box {
    height: 500px;
  }

  .catering.main button {
    width: 40%;
  }

  /* Services*/

  .service-description {
    margin-top: 150px;
  }

  #service-section {
    padding: 15px;
  }

  /* About */
  body.about h3, body.about p {
    text-align: center;
  }

  body.about .img-fluid {
    margin-bottom: 10px;
  }
  /* Contact */

  /* Order */

}

/* Small (SM) */
@media (min-width: 576px) and (max-width: 768px) {
  /* CSS styles for small screens */

  /*Utilities*/
  body{
    max-width: auto;
  }

  nav, nav.catering {
    max-width: auto;
  }

  nav a.logo {
    left: 38%;
    align-self: center;
    display: flex;
  }

  .palm-branch-icon-left,
  .palm-branch-icon-right {
    display: none;
  }

  /* Home */

  
  .header-image {
    width: 576px;
  }

  .buttons .btn {
    /* font-size: 25px; */
    /* height: 80px; */
  }

  .bordered-div {
    margin: 15px 0px;
  }

  .cuisine-image {
    max-width: 65%;
  }

  .order-md-1,
    .order-md-2 {
        width: 100%;
    }

    .order-md-2 {
        margin-top: 20px; /* Adjust as needed */
    }

  footer {
    height: 370px;
  }


  /* Menu */

  body.menu {
    background-size: auto;
  }

  header.menu {
    display: none;
  }

  /* Catering */
  .m-box {
    height: 500px;
  }

  .catering.main button {
    width: 40%;
  }

  body.catering .col-md-6 {
    width: 100%;;
  }

  /* Services*/

  body.services .col-md-5 {
    width: 100%;
  }
  .service-description {
    margin-top: 230px;
  }

  #service-section {
    padding: 15px;
  }

  /* About */
  body.about h3, body.about p {
    text-align: center;
  }

  body.about .img-fluid {
    margin-bottom: 10px;
  }

  body.about .col-md-6 {
    width: 100%;;
  }

  /* Contact */

  body.contact .col-md-6 {
    width: 100%;
  }

  /* Order */
}

/* Medium (MD) */
@media (min-width: 768px) and (max-width: 992px) {
  /* CSS styles for medium screens */

  /* Catering */
  .m-box {
    height: auto;
  }

  body.catering .col-md-6 {
    width: 100%;
  }

  /* Services*/

  body.services .col-md-5 {
    width: 100%;
  }
  .service-description {
    margin-top: 150px;
  }

  #service-section {
    padding: 15px;
  }

  /* Contact */

  body.contact .col-md-6 {
    width: 80%;
  }

  /* Order */
  .container-iframe {
    padding: 60px;
  }
}

/* Large (LG) */
@media (min-width: 992px) and (max-width: 1200px) {
  /* CSS styles for large screens */

  /* CSS styles for medium screens */

  /* Catering */
  .m-box {
    height: auto;
  }

  body.catering .col-md-6 {
    width: 100%;
  }

  /* Services*/

  body.services .col-md-5 {
    width: 100%;
  }
  .service-description {
    margin-top: 150px;
  }

  #service-section {
    padding: 15px;
  }

  /* Contact */

  body.contact .col-md-6 {
    width: 80%;
  }

  /* Order */
  .container-iframe {
    padding: 60px;
  }
}

/* Extra Large (XL) */
@media (min-width: 1200px) {
  /* CSS styles for extra large screens */

  body.services .jamaican-paragraph.white {
    /* font-size: 30px; */
  }

  .service-description {
    margin-bottom: 55px;
  }
}

/****************************************************************************************************************/
/* Mobile Screens */

/* Media query for 360x800 */
@media (max-width: 360px) {
  /*Utilities*/
  body{
    max-width: auto;
  }

  nav, nav.catering {
    max-width: auto;
  }

  nav a.logo {
    left: 7%;
  }

  .palm-branch-icon-left,
  .palm-branch-icon-right {
    display: none;
  }

  body.Home .Bahama.titleRed {
    /* font-size: 2em; */
  }

  .orderingApps {
    padding: 20px;
  }

  /* Home */

  .header-image {
    width: 350px;
  }

  .buttons .btn {
    /* font-size: 25px; */
  }

  .bordered-div {
    margin: 15px 0px;
  }

  .cuisine-image {
    max-width: 65%;
  }

  body.Home .jamaican-paragraph.white {
    /* font-size: 30px; */
  }


  /* Menu */

  body.menu {
    background-size: auto;
  }

  header.menu {
    display: none;
  }

  /* Catering */
  .m-box {
    height: auto;
  }

  .catering.main button {
    width: 62%;
  }

  .jamaican-paragraph.gold.title {
    /* font-size: 30px; */
  }

  .cateringblack-col {
    width: 75%;
  }

  .cateringHeader img {
    width: 140%;
  }

  /* Services*/

  .service-description {
    margin-top: 193px;
  }

  #service-section {
    padding: 15px;
  }

  body.services .jamaican-paragraph.white {
    /* font-size: 20px; */
  }

  /* About */
  body.about h3, body.about p {
    text-align: center;
  }

  body.about .img-fluid {
    margin-bottom: 10px;
  }

  /* Contact */

  /* Order */
}

/* Media query for 390x844 */
@media (max-width: 390px) {
  /* Your CSS styles for this screen size */

  /*Utilities*/
  body{
    max-width: auto;
  }

  nav, nav.catering {
    max-width: auto;
  }

  nav a.logo {
    left: 7%;
  }

  .palm-branch-icon-left,
  .palm-branch-icon-right {
    display: none;
  }

  body.Home .Bahama.titleRed {
    /* font-size: 2em; */
  }

  .orderingApps {
    padding: 20px;
  }

  /* Home */

  .header-image {
    width: 375px;
  }

  .buttons .btn {
    /* font-size: 25px; */
  }

  .bordered-div {
    margin: 15px 0px;
  }

  .cuisine-image {
    max-width: 65%;
  }

  body.Home .jamaican-paragraph.white {
    /* font-size: 30px; */
  }


  /* Menu */

  body.menu {
    background-size: auto;
  }

  header.menu {
    display: none;
  }

  /* Catering */
  .m-box {
    height: auto;
  }

  .catering.main button {
    width: 62%;
  }

  .jamaican-paragraph.gold.title {
    /* font-size: 30px; */
  }

  .cateringblack-col {
    width: 75%;
  }

  .cateringHeader img {
    width: 140%;
  }

  /* Services*/

  .service-description {
    margin-top: 193px;
  }

  #service-section {
    padding: 15px;
  }

  body.services .jamaican-paragraph.white {
    /* font-size: 20px; */
  }

  /* About */
  body.about h3, body.about p {
    text-align: center;
  }

  body.about .img-fluid {
    margin-bottom: 10px;
  }

  /* Contact */

  /* Order */
}

/* Media query for 414x896 */
@media (max-width: 414px) {
  /* Your CSS styles for this screen size */

  /*Utilities*/
  body{
    max-width: auto;
  }

  nav, nav.catering {
    max-width: auto;
  }

  nav a.logo {
    left: 7%;
  }

  .palm-branch-icon-left,
  .palm-branch-icon-right {
    display: none;
  }

  body.Home .Bahama.titleRed {
    /* font-size: 2em; */
  }

  .orderingApps {
    padding: 20px;
  }

  /* Home */

  .header-image {
    width: 375px;
  }

  .buttons .btn {
    /* font-size: 25px; */
  }

  .bordered-div {
    margin: 15px 0px;
  }

  .cuisine-image {
    max-width: 65%;
  }

  body.Home .jamaican-paragraph.white {
    /* font-size: 30px; */
  }


  /* Menu */

  body.menu {
    background-size: auto;
  }

  header.menu {
    display: none;
  }

  /* Catering */
  .m-box {
    height: auto;
  }

  .catering.main button {
    width: 62%;
  }

  .jamaican-paragraph.gold.title {
    /* font-size: 30px; */
  }

  .cateringblack-col {
    width: 75%;
  }

  .cateringHeader img {
    width: 140%;
  }

  /* Services*/

  .service-description {
    margin-top: 193px;
  }

  #service-section {
    padding: 15px;
  }

  body.services .jamaican-paragraph.white {
    /* font-size: 20px; */
  }

  /* About */
  body.about h3, body.about p {
    text-align: center;
  }

  body.about .img-fluid {
    margin-bottom: 10px;
  }

  /* Contact */

  /* Order */
}

/* Media query for 414x896 */
@media (max-width: 500px) {
  /* Your CSS styles for this screen size */

  /*Utilities*/
  body{
    max-width: auto;
  }

  nav, nav.catering {
    max-width: auto;
  }

  nav a.logo {
    left: 7%;
  }

  .palm-branch-icon-left,
  .palm-branch-icon-right {
    display: none;
  }

  body.Home .Bahama.titleRed {
    /* font-size: 2em; */
  }

  .orderingApps {
    padding: 20px;
  }

  /* Home */

  .header-image {
    width: 375px;
  }

  .buttons .btn {
    /* font-size: 25px; */
  }

  .bordered-div {
    margin: 15px 0px;
  }

  .cuisine-image {
    max-width: 65%;
  }

  body.Home .jamaican-paragraph.white {
    /* font-size: 30px; */
  }


  /* Menu */

  body.menu {
    background-size: auto;
  }

  header.menu {
    display: none;
  }

  /* Catering */
  .m-box {
    height: auto;
  }

  .catering.main button {
    width: 62%;
  }

  .jamaican-paragraph.gold.title {
    /* font-size: 30px; */
  }

  .cateringblack-col {
    width: 75%;
  }

  .cateringHeader img {
    width: 140%;
  }

  /* Services*/

  .service-description {
    margin-top: 193px;
  }

  #service-section {
    padding: 15px;
  }

  body.services .jamaican-paragraph.white {
    /* font-size: 20px; */
  }

  /* About */
  body.about h3, body.about p {
    text-align: center;
  }

  body.about .img-fluid {
    margin-bottom: 10px;
  }

  /* Contact */

  /* Order */
}