/* Text Elements */

h1.heading-7 {
  float: none;
  clear: none;
  margin-top: 7px;
  margin-bottom: 0;
  padding-right: 10px;
  padding-left: 10px;
  background-color: transparent;
  color: #187aa3;
  text-transform: none;
  letter-spacing: 1px;
  font-size: 35px;

  -webkit-order: 1;
     -moz-order: 1;
      -ms-order: 1;
       -o-order: 1;
          order: 1;
  -webkit-flex: 1 60%;
     -moz-flex: 1 60%;
      -ms-flex: 1 60%;
       -o-flex: 1 60%;
          flex: 1 60%;
}

h2.h2-body {
  color: #167aa1;
  text-decoration: underline;
  text-transform: capitalize;
}

h2.landing-h2 {
  margin-top: -4px;
  margin-bottom: 0;
  padding-left: 10px;
  background-color: transparent;
  color: #187aa3;
  letter-spacing: 1px;
  font-size: 27px;
  line-height: 1.2;

  -webkit-order: 2;
     -moz-order: 2;
      -ms-order: 2;
       -o-order: 2;
          order: 2;
  -webkit-flex: 1 50%;
     -moz-flex: 1 50%;
      -ms-flex: 1 50%;
       -o-flex: 1 50%;
          flex: 1 50%;
}

h2#heading-1 {
  color: #757a7c;
  font-size: 34px;
}

h2#heading-2 {
  margin-top: 4px;
}

h2#heading-3 {
  margin-top: 4px;
}

h2.heading-2 {
  padding-right: 5px;
  padding-left: 10px;
  color: #187aa3;
  font-size: 26px;
}

h2 span.heading-text-3 {
  font-size: 17px;
}

h3.h3-main-container {
  padding-right: 5px;
  padding-left: 5px;
  background-color: transparent;
  color: #167aa1;
  text-transform: capitalize;
  letter-spacing: 0;
  font-size: 29px;

  -webkit-order: 1;
     -moz-order: 1;
      -ms-order: 1;
       -o-order: 1;
          order: 1;
  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
}

h3.h3-webcam-container {
  margin: 6px auto 0 0;
  padding-left: 10px;
  background-color: #fff;
  color: #167aa1;
  text-align: left;
}

h3.heading-1 {
  padding-right: 5px;
  padding-left: 5px;
  color: #167aa1;
}

h3 a.h3-link {
  color: #167aa1;
  text-decoration: none;
}

p.paragraph span.bold {
  font-weight: 700;
}

p.paragraph.para-main-container {
  float: right;
  margin-top: 0;
  margin-bottom: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px;
  max-width: 600px;
  letter-spacing: 0;
  font-size: 16px;

  -webkit-order: 2;
     -moz-order: 2;
      -ms-order: 2;
       -o-order: 2;
          order: 2;
  -webkit-flex: 1 53%;
     -moz-flex: 1 53%;
      -ms-flex: 1 53%;
       -o-flex: 1 53%;
          flex: 1 53%;
}

p.paragraph.para-amenities-main-container {
  margin-top: 0;
  margin-bottom: 0;
  padding-right: 5px;
  padding-bottom: 0;
  padding-left: 5px;
  max-width: none;
  width: 45%;
  color: #1e1e1e;
  text-align: left;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
  font-size: 16px;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

  -webkit-order: 3;
     -moz-order: 3;
      -ms-order: 3;
       -o-order: 3;
          order: 3;
  -webkit-flex: 1 45%;
     -moz-flex: 1 45%;
      -ms-flex: 1 45%;
       -o-flex: 1 45%;
          flex: 1 45%;
}

p.paragraph.hours-of-operation {
  margin-top: 5px;
  margin-bottom: 0;
  padding: 0 5px;
  color: #1e1e1e;
  text-transform: none;
  letter-spacing: 0;
  font-size: 17px;

  -webkit-order: 5;
     -moz-order: 5;
      -ms-order: 5;
       -o-order: 5;
          order: 5;
  -webkit-flex: 1 66%;
     -moz-flex: 1 66%;
      -ms-flex: 1 66%;
       -o-flex: 1 66%;
          flex: 1 66%;
}

p.paragraph a.link-text-blue {
  color: #167aa1;
  text-decoration: none;
  font-weight: 700;
}

p.paragraph.index-para {
  margin-right: 0;
  margin-left: 0;
  padding-right: 10px;
  padding-left: 10px;
  background-color: transparent;
  font-size: 17px;

  -webkit-order: 0;
     -moz-order: 0;
      -ms-order: 0;
       -o-order: 0;
          order: 0;
  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
}

p.paragraph.index-1-para {
  margin-right: 0;
  margin-left: 0;
  padding-right: 10px;
  padding-left: 10px;
  background-color: transparent;
  font-size: 17px;

  -webkit-order: -2;
     -moz-order: -2;
      -ms-order: -2;
       -o-order: -2;
          order: -2;
  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
}

p.paragraph.shopping-paragraph {
  float: left;
  margin: 3px 0 2px;
  padding-right: 10px;
  padding-left: 10px;
  width: 100%;
  background-color: #fff;
  font-size: 16px;
  line-height: 1.5;

  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
  -webkit-order: 3;
     -moz-order: 3;
      -ms-order: 3;
       -o-order: 3;
          order: 3;
}

p.paragraph.paragraph-1 {
  float: none;
  margin-top: 0;
  margin-bottom: 0;
  padding-right: 10px;
  padding-left: 0;
  width: 90%;
  background-color: #fff;
  text-align: left;
  white-space: normal;
  font-size: 16px;
  line-height: 1.5;

  -webkit-align-self: auto;
     -moz-align-self: auto;
      -ms-align-self: auto;
       -o-align-self: auto;
          align-self: auto;
}

p.paragraph.webcam-link {
  margin-left: 3%;

  -webkit-order: 7;
     -moz-order: 7;
      -ms-order: 7;
       -o-order: 7;
          order: 7;
}

p.paragraph.paragraph-2 {
  margin: 0;
  padding: 0 10px;
  width: 49%;
  text-align: left;
  text-indent: 0;
  font-size: 17px;

  -webkit-flex: 1 1 49%;
     -moz-flex: 1 1 49%;
      -ms-flex: 1 1 49%;
       -o-flex: 1 1 49%;
          flex: 1 1 49%;
  -webkit-order: 3;
     -moz-order: 3;
      -ms-order: 3;
       -o-order: 3;
          order: 3;
}

p.paragraph span.paragraph-text-1 {
  font-weight: 700;
  font-size: 16px;
}

p.paragraph span.paragraph-text-2 {
  font-weight: 600;
}

p.paragraph span.paragraph-text-3 {
  font-weight: 600;
}

p.paragraph span.paragraph-text-4 {
  font-weight: 400;
  font-size: 17px;
  line-height: 1.65;
}

p.paragraph.paragraph-3 {
  margin-top: 3px;
  margin-bottom: 3px;
  padding-right: 10px;
  padding-left: 10px;
  font-size: 17px;
}

p.paragraph.paragraph-4 {
  margin-left: 0;
  padding-right: 10px;
  padding-left: 10px;
  width: 50%;
  font-size: 16px;

  -webkit-flex: 1 50%;
     -moz-flex: 1 50%;
      -ms-flex: 1 50%;
       -o-flex: 1 50%;
          flex: 1 50%;
}

p.paragraph span.paragraph-text-5 {
  font-weight: 800;
}

p.paragraph.paragraph-5 {
  text-align: center;

  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
}

p.paragraph.paragraph-6 {
  margin-top: -3px;
  margin-bottom: -6px;
  padding-bottom: 0;
  padding-left: 14px;
}

p.paragraph#paragraph-1 {
  -webkit-order: 2;
     -moz-order: 2;
      -ms-order: 2;
       -o-order: 2;
          order: 2;
}

p.paragraph.paragraph-7 {
  margin-top: 0;
  margin-bottom: 0;
  padding-right: 10px;
  padding-bottom: 0;
  padding-left: 10px;
  max-width: none;
  width: 98%;
  color: #1e1e1e;
  font-size: 16px;

  -webkit-order: 3;
     -moz-order: 3;
      -ms-order: 3;
       -o-order: 3;
          order: 3;
}

p.paragraph.paragraph-8 {
  margin-top: -12px;
  margin-bottom: 0;
  padding-bottom: 0;
  background-color: transparent;
  color: #187aa3;
  text-align: center;
}

p.paragraph a.link-text-blue:hover {
  color: #f2b818;
}

ul.unorder-list.unordered-list-1 {
  padding-right: 0;
  padding-left: 19px;
  list-style-position: inside;
  list-style-type: none;
}

a.link-text {
  text-align: center;
  font-size: 14px;
}

a.link-text.footer-mobile-link {
  margin-bottom: 7px;
  padding: 5px;
  color: #fff;
  text-align: left;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.24;
}

a.link-text.footer-desktop-link {
  padding-top: 0;
  padding-right: 10px;
  padding-left: 10px;
  color: #fff;
  text-align: left;
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;

  -webkit-order: 0;
     -moz-order: 0;
      -ms-order: 0;
       -o-order: 0;
          order: 0;
}

a.link-text.footer-desktop-underline {
  margin-top: 7px;
  margin-bottom: 0;
  padding-top: 7px;
  padding-right: 5px;
  padding-left: 5px;
  color: #fff;
  text-align: left;
  text-decoration: underline;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 14px;
}

a.link-text#footer-center-links {
  padding-left: 32px;
  text-align: left;
}

a.link-text.text-link-main-container {
  display: none;
  text-align: center;

  -webkit-order: 7;
     -moz-order: 7;
      -ms-order: 7;
       -o-order: 7;
          order: 7;
  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
}

a.link-text span.flex-cont-text-link {
  color: #167aa1;
  text-decoration: underline;
}

a.link-text.flex-containter-link {
  background-color: transparent;
  text-decoration: none;
  font-size: 21px;
}

a.link-text#placestostaylanding {
  display: block;
}

a.link-text#placestostaylanding-copy-1 {
  display: block;
}

a.link-text#placestostaylanding-copy-2 {
  display: block;
}

a.link-text#placestostaylanding-copy-3 {
  display: block;
}

a.link-text.about-text-link {
  margin-top: 0;
  color: #167aa1;
  text-align: center;
  text-decoration: none;
  font-size: 17px;
}

a.link-text#footer-center-links-copy-1 {
  padding-left: 32px;
  text-align: left;
}

a.link-text#footer-center-links-copy-2 {
  padding-left: 32px;
  text-align: left;
}

a.link-text#footer-center-links-copy-4 {
  padding-left: 32px;
  text-align: left;
}

a.link-text#footer-center-links-copy-6 {
  padding-left: 32px;
  text-align: left;
}

a.link-text#footer-center-links-copy-7 {
  padding-left: 32px;
  text-align: left;
}

a.link-text#footer-center-links-copy-8 {
  padding-left: 32px;
  text-align: left;
}

a.link-text.footer-mobile-link:hover {
  color: #4fa7cc;
}

a.link-text.footer-desktop-link:hover {
  color: #ecae19;
}

a.link-text.footer-desktop-underline:hover {
  color: #f6ae0e;
}

/* Common Elements */

address.address-main-container {
  margin: 4px 0 0;
  padding-right: 3px;
  padding-left: 7px;

  -webkit-order: 6;
     -moz-order: 6;
      -ms-order: 6;
       -o-order: 6;
          order: 6;
  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
}

address.address-main-container p {
  text-align: left;
  text-decoration: none;
  text-transform: capitalize;
  letter-spacing: 0;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.45;
}

address.address-main-container a {
  text-align: left;
  text-decoration: none;
  text-transform: capitalize;
  letter-spacing: 0;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.45;
}

address span.address-text-link {
  color: #167aa1;
  text-decoration: none;
  font-size: 20px;
}

address a.address-text-1 {
  color: #000002;
}

address a.address-text-2 {
  color: #000;
}

address a.address-text-3 {
  color: #000;
}

address a.address-text-4 {
  color: #000;
}

address a.address-text-5 {
  color: #000;
}

address a.address-text-6 {
  color: #000;
}

address a.address-text-7 {
  color: #000;
}

address a.address-text-8 {
  color: #000;
}

address a.address-text-9 {
  color: #000;
}

address a.address-text-10 {
  color: #000;
}

address a.address-text-11 {
  color: #000;
}

address a.address-text-12 {
  color: #000;
}

address a.address-text-13 {
  color: #000;
}

address a.address-text-14 {
  color: #000;
}

address a.address-text-15 {
  color: #000;
}

address a.address-text-16 {
  color: #000;
}

address a.address-text-17 {
  color: #000;
}

address a.address-text-18 {
  color: #000;
}

address a.address-text-19 {
  color: #000;
}

address a.address-text-20 {
  color: #000;
}

address a.address-text-21 {
  color: #000;
}

address a.address-text-22 {
  color: #000;
}

address a.address-text-23 {
  color: #000;
}

address a.address-text-24 {
  color: #000;
}

address a.address-text-25 {
  color: #000;
}

address a.address-text-26 {
  color: #000;
}

address a.address-text-27 {
  color: #000;
}

address a.address-text-28 {
  color: #000;
}

address a.address-text-30 {
  color: #000;
}

address a.address-text-31 {
  color: #000;
}

address a.address-text-36 {
  color: #000;
}

address a.address-text-47 {
  color: #000;
}

address a.address-text-48 {
  color: #000;
}

address a.address-text-49 {
  color: #000;
}

address a.address-text-50 {
  color: #000;
}

address a.address-text-51 {
  color: #000;
}

address a.address-text-52 {
  color: #000;
}

address a.address-text-53 {
  color: #000;
}

address a.address-text-54 {
  color: #000;
}

address a.address-text-55 {
  color: #000;
}

address a.address-text-56 {
  color: #000;
}

address a.address-text-57 {
  color: #000;
}

address a.address-text-58 {
  color: #000;
}

address a.address-text-59 {
  color: #000;
}

address a.address-text-60 {
  color: #000;
}

address a.address-text-61 {
  color: #000;
}

address a.address-text-62 {
  color: #000;
}

address a.address-text-63 {
  color: #000;
}

address a.address-text-64 {
  color: #000;
}

address a.address-text-65 {
  color: #000;
}

address a.address-text-66 {
  color: #000;
}

address a.address-text-67 {
  color: #000;
}

address a.address-text-68 {
  color: #000;
}

address a.address-text-69 {
  color: #000;
}

address a.address-text-70 {
  color: #000;
}

address a.address-text-71 {
  color: #000;
}

address a.address-text-72 {
  color: #000;
}

address a.address-text-73 {
  color: #000;
}

address a.address-text-74 {
  color: #000;
}

address a.address-text-75 {
  color: #000;
}

address a.address-text-76 {
  color: #000;
}

address a.address-text-77 {
  color: #000;
}

address a.address-text-78 {
  color: #000;
}

address a.address-text-79 {
  color: #000;
}

address a.address-text-80 {
  color: #000;
}

address a.address-text-83 {
  color: #000;
}

address a.address-text-86 {
  color: #000;
}

address a.address-text-88 {
  color: #000;
}

address a.address-text-93 {
  color: #000;
}

address a.address-text-94 {
  color: #000;
}

address a.address-text-95 {
  color: #000;
}

address a.address-text-96 {
  color: #000;
}

address a.address-text-97 {
  color: #000;
}

address a.address-text-98 {
  color: #000;
}

address a.address-text-99 {
  color: #000;
}

address a.address-text-100 {
  color: #000;
}

address a.address-text-101 {
  color: #000;
}

address a.address-text-102 {
  color: #000;
}

address a.address-text-103 {
  color: #000;
}

address a.address-text-104 {
  color: #000;
}

address a.address-text-105 {
  color: #000;
}

address a.address-text-107 {
  color: #000;
}

address a.address-text-45 {
  color: #000;
}

address.map-container-address {
  margin-right: auto;
  margin-left: auto;
  padding: 5px 5px 5px 12px;
}

address.map-container-address p {
  text-align: left;
  text-decoration: none;
}

address.map-container-address a {
  text-align: left;
  text-decoration: none;
}

address span.address-text-link:hover {
  text-decoration: none;
}

/* Layout Elements */

body.sanibel-island-responsive-grid {
  max-width: 1000px;
  background-color: #147599;
}

body > .row.Menu-row {
  max-width: 1000px;
}

body > .row > [class*='coffee-span-'].menu-column {
  float: none;
  margin-right: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
}

body > .row > [class*='coffee-span-'].header-column {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  float: none;
  margin-right: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
  background-color: #045e81;

  -webkit-justify-content: center;
     -moz-justify-content: center;
      -ms-justify-content: center;
       -o-justify-content: center;
          justify-content: center;
  -webkit-align-items: center;
     -moz-align-items: center;
      -ms-align-items: center;
       -o-align-items: center;
          align-items: center;
  -webkit-align-content: center;
     -moz-align-content: center;
      -ms-align-content: center;
       -o-align-content: center;
          align-content: center;
}

body > .row.header-row {
  max-width: 1000px;
  background-color: #05336f;
}

body > .row.footer-mobile-row {
  display: none;
  max-width: 1000px;
  background-color: #045e81;
}

body > .row > [class*='coffee-span-'].footer-mobile-column {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-direction: row;
     -moz-flex-direction: row;
      -ms-flex-direction: row;
       -o-flex-direction: row;
          flex-direction: row;
  float: left;
  margin-right: 0;

  -webkit-justify-content: flex-start;
     -moz-justify-content: flex-start;
      -ms-justify-content: flex-start;
       -o-justify-content: flex-start;
          justify-content: flex-start;
  -webkit-align-items: flex-start;
     -moz-align-items: flex-start;
      -ms-align-items: flex-start;
       -o-align-items: flex-start;
          align-items: flex-start;
  -webkit-align-content: flex-start;
     -moz-align-content: flex-start;
      -ms-align-content: flex-start;
       -o-align-content: flex-start;
          align-content: flex-start;
  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

body > .row.footer-desktop-row {
  position: static;
  max-width: 1000px;
  background-color: #045e81;
}

body > .row > [class*='coffee-span-'].footer-desktop-column {
  padding-right: 5px;
  padding-left: 5px;
}

body > .row > [class*='coffee-span-'].footer-logo-mobile-column {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-direction: row;
     -moz-flex-direction: row;
      -ms-flex-direction: row;
       -o-flex-direction: row;
          flex-direction: row;
  float: left;
  margin-right: 0;

  -webkit-justify-content: flex-start;
     -moz-justify-content: flex-start;
      -ms-justify-content: flex-start;
       -o-justify-content: flex-start;
          justify-content: flex-start;
  -webkit-align-items: flex-start;
     -moz-align-items: flex-start;
      -ms-align-items: flex-start;
       -o-align-items: flex-start;
          align-items: flex-start;
  -webkit-align-content: flex-start;
     -moz-align-content: flex-start;
      -ms-align-content: flex-start;
       -o-align-content: flex-start;
          align-content: flex-start;
  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

body > .row.slideshow-row {
  max-width: 1000px;
}

body > .row > [class*='coffee-span-'].slideshow-column {
  display: block;
  float: none;
  margin-right: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
}

body > .row.weather-widget-row {
  max-width: 1000px;
  background-color: #fff;
}

body > .row.row-12 {
  max-width: 1000px;
  background-color: #045e81;
}

body > .row > [class*='coffee-span-'].column-20 {
  margin-top: 0;
}

body > .row > [class*='coffee-span-'].column-24 {
  float: right;
  margin-right: 0;
  margin-left: 0;
  padding-right: 0;
  padding-left: 0;
  background-color: #fff;
}

body > .row.body-landing-row1 {
  margin-right: auto;
  margin-left: auto;
  max-width: 1000px;
  background-color: #fff;
}

body > .row > [class*='coffee-span-'].column-19 {
  display: block;
  float: none;
  margin-right: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
  background-color: transparent;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

body > .row.map {
  max-width: 1000px;
  background-color: #fff;
}

body > .row > [class*='coffee-span-'].column-1 {
  float: none;
  margin-right: 0;
  margin-left: 0;
}

body > .row > [class*='coffee-span-'].flex-column {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  padding-right: 0;
  padding-left: 0;
  background-color: #fff;
  background-image: none;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

body > .row.row-1 {
  max-width: 1000px;
  background-color: #fff;
}

body > .row.row-2 {
  max-width: 1000px;
  background-color: #f6f6f6;
}

body > .row > [class*='coffee-span-'].column-23 {
  position: static;
  float: none;
  margin-right: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
  background-color: transparent;
}

body > .row > [class*='coffee-span-'].column-5 {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  float: left;
  padding-right: 0;
  padding-left: 0;
  background-color: #fff;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

body > .row.row-4 {
  max-width: 1000px;
  width: 100%;
  background-color: #fff;
}

body > .row#row-1 {
  background-color: #fff;
}

body > .row > [class*='coffee-span-'].column-2 {
  padding-right: 0;
  padding-left: 0;
}

.subgrid > .row > [class*='coffee-span-'].subgrid-column-1 {
  float: left;
  margin-top: -10px;
  margin-right: 0;
  margin-left: 0;
  padding-right: 0;
  padding-left: 0;
}

.subgrid > .row > [class*='coffee-span-'].subgrid-column-3 {
  margin-top: -12px;
}

.subgrid > .row > [class*='coffee-span-'].footer-subgrid-column {
  padding-right: 0;
  padding-left: 0;
}

.subgrid > .row.footer-subgrid-row {
  padding-left: 6px;
  max-width: 1200px;
}

.row > [class*='coffee-span-'] .html-element.menu-html-element {
  margin-right: auto;
  margin-left: auto;
  max-width: 1000px;
}

a.responsive-picture.header-logo-pic-link {
  margin-top: 0;
  margin-bottom: 0;
  max-width: none;
}

.row > [class*='coffee-span-'] .subgrid.subgrid-footer-desktop {
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
}

.row > [class*='coffee-span-'] .html-element.slideshow-html-element {
  margin-top: 0;
}

a.responsive-picture.footer-desktop-picture-link {
  float: none;
  margin-right: 0;
}

.row > [class*='coffee-span-'] > .container.landing-container {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  margin: 50px 0 50px 3%;
  padding: 15px 20px;
  max-width: none;
  width: 88%;
  border-top-left-radius: 15px 15px;
  border-top-right-radius: 15px 15px;
  border-bottom-right-radius: 15px 15px;
  border-bottom-left-radius: 15px 15px;
  background-color: #f0f0f0;
  box-shadow: #c0c0c0 4px 4px 10px 2px;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

div.responsive-picture.picture-main-container {
  margin: 0;
  padding: 5px;
  max-width: 400px;
  width: 45%;

  -webkit-order: 2;
     -moz-order: 2;
      -ms-order: 2;
       -o-order: 2;
          order: 2;
  -webkit-flex: 1 1 45%;
     -moz-flex: 1 1 45%;
      -ms-flex: 1 1 45%;
       -o-flex: 1 1 45%;
          flex: 1 1 45%;
}

.row > [class*='coffee-span-'] > .container.responsive-ad-container {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  float: none;
  margin: 5px auto;
  padding-top: 0;
  padding-bottom: 0;
  min-width: 50px;
  min-height: 50px;
  max-width: none;
  width: 95%;
  background-color: #fff;

  -webkit-order: 3;
     -moz-order: 3;
      -ms-order: 3;
       -o-order: 3;
          order: 3;
  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
  -webkit-align-items: center;
     -moz-align-items: center;
      -ms-align-items: center;
       -o-align-items: center;
          align-items: center;
  -webkit-align-content: center;
     -moz-align-content: center;
      -ms-align-content: center;
       -o-align-content: center;
          align-content: center;
  -webkit-justify-content: center;
     -moz-justify-content: center;
      -ms-justify-content: center;
       -o-justify-content: center;
          justify-content: center;
}

.row > [class*='coffee-span-'] > .container.business-location-container {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  margin: 30px 0 30px 3%;
  padding: 15px 20px;
  width: 88%;
  border-top-left-radius: 15px 15px;
  border-top-right-radius: 15px 15px;
  border-bottom-right-radius: 15px 15px;
  border-bottom-left-radius: 15px 15px;
  background-color: #f6f6f6;
  box-shadow: #c0c0c0 4px 4px 10px 2px;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

div.responsive-picture.picture-1 {
  margin-right: auto;
  margin-left: auto;
  max-width: none;
  width: 90%;
}

.row > [class*='coffee-span-'] .html-element.google-responsive-ad {
  float: none;
  margin-right: 0;
  margin-left: 0;
  padding: 0;
  width: 100%;

  -webkit-flex: 1 auto;
     -moz-flex: 1 auto;
      -ms-flex: 1 auto;
       -o-flex: 1 auto;
          flex: 1 auto;
}

.row > [class*='coffee-span-'] > .container.flex-container {
  margin: 10px 1%;
  padding: 10px;
  width: 31%;
  background-color: #f4f4f4;

  -webkit-flex: 1 31%;
     -moz-flex: 1 31%;
      -ms-flex: 1 31%;
       -o-flex: 1 31%;
          flex: 1 31%;
}

a.responsive-picture.flex-container-pic-link {
  margin: 0 auto;
  padding-right: 5px;
  padding-left: 5px;
  max-width: none;

  -webkit-flex: 1 33%;
     -moz-flex: 1 33%;
      -ms-flex: 1 33%;
       -o-flex: 1 33%;
          flex: 1 33%;
}

li span.bold {
  font-weight: 700;
}

.row > [class*='coffee-span-'] .html-element.desktop-google-ad {
  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
}

.row > [class*='coffee-span-'] > .container.mobile-responsive-ad {
  display: none;
  margin-right: auto;
  margin-left: auto;
  width: 99%;

  -webkit-order: 3;
     -moz-order: 3;
      -ms-order: 3;
       -o-order: 3;
          order: 3;
  -webkit-flex: 1 100%;
     -moz-flex: 1 100%;
      -ms-flex: 1 100%;
       -o-flex: 1 100%;
          flex: 1 100%;
}

div.responsive-picture.picture-2 {
  margin: 0 auto;
  padding: 5px;
  max-width: 400px;

  -webkit-flex: 50%;
     -moz-flex: 50%;
      -ms-flex: 50%;
       -o-flex: 50%;
          flex: 50%;
  -webkit-order: 0;
     -moz-order: 0;
      -ms-order: 0;
       -o-order: 0;
          order: 0;
}

.row > [class*='coffee-span-'] > .container.flex-pic-container {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  padding-right: 4px;
  padding-left: 4px;
  background-color: #f6f6f6;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

.row > [class*='coffee-span-'] > .container.about-us-link-container {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  margin-top: 0;
  margin-bottom: 0;
  width: 32%;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-flex: 1 1 31%;
     -moz-flex: 1 1 31%;
      -ms-flex: 1 1 31%;
       -o-flex: 1 1 31%;
          flex: 1 1 31%;
  -webkit-justify-content: center;
     -moz-justify-content: center;
      -ms-justify-content: center;
       -o-justify-content: center;
          justify-content: center;
}

div.responsive-picture.picture-3 {
  margin: 0 auto;
  padding: 10px;
  max-width: 300px;
}

.row > [class*='coffee-span-'] > .container.webcam-google-ad-bottom {
  margin-top: 7px;
  margin-right: auto;
  margin-left: auto;
  min-height: 50px;
  max-width: none;
  width: 90%;
}

.row > [class*='coffee-span-'] > .container.webcam-container {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-direction: column;
     -moz-flex-direction: column;
      -ms-flex-direction: column;
       -o-flex-direction: column;
          flex-direction: column;
  margin-right: auto;
  margin-bottom: 7px;
  margin-left: auto;
  max-width: none;
  background-color: #fff;

  -webkit-justify-content: center;
     -moz-justify-content: center;
      -ms-justify-content: center;
       -o-justify-content: center;
          justify-content: center;
  -webkit-align-items: center;
     -moz-align-items: center;
      -ms-align-items: center;
       -o-align-items: center;
          align-items: center;
  -webkit-align-content: center;
     -moz-align-content: center;
      -ms-align-content: center;
       -o-align-content: center;
          align-content: center;
}

.row > [class*='coffee-span-'] .html-element.webcam-desktop {
  margin-right: auto;
  margin-left: auto;
  width: 90%;
}

.row > [class*='coffee-span-'] .html-element.webcam-mobile {
  display: none;
}

.row > [class*='coffee-span-'] > .container.responsive-ad-desktop-body {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  float: none;
  margin: 0 0 0 3%;
  padding-right: 0;
  padding-left: 0;
  min-height: 50px;
  width: 90%;
  background-color: #fff;

  -webkit-align-items: center;
     -moz-align-items: center;
      -ms-align-items: center;
       -o-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
     -moz-justify-content: center;
      -ms-justify-content: center;
       -o-justify-content: center;
          justify-content: center;
  -webkit-align-content: center;
     -moz-align-content: center;
      -ms-align-content: center;
       -o-align-content: center;
          align-content: center;
  -webkit-flex: auto;
     -moz-flex: auto;
      -ms-flex: auto;
       -o-flex: auto;
          flex: auto;
}

div.responsive-picture.picture-4 {
  margin-top: 0;
  margin-bottom: 0;
  padding: 5px;
  min-width: 10px;
  max-width: none;
  width: 48%;

  -webkit-flex: 1 48%;
     -moz-flex: 1 48%;
      -ms-flex: 1 48%;
       -o-flex: 1 48%;
          flex: 1 48%;
  -webkit-order: 2;
     -moz-order: 2;
      -ms-order: 2;
       -o-order: 2;
          order: 2;
}

.row > [class*='coffee-span-'] > .container.container-1 {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  margin-bottom: 0;
  margin-left: 2%;
  padding: 15px 10px;
  width: 95%;
  border-top-left-radius: 10px 10px;
  border-top-right-radius: 10px 10px;
  border-bottom-right-radius: 10px 10px;
  border-bottom-left-radius: 10px 10px;
  background-color: #fff;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

div.responsive-picture.picture-5 {
  float: none;
  clear: none;
  max-width: none;
  width: 49%;

  -webkit-flex: 1 49%;
     -moz-flex: 1 49%;
      -ms-flex: 1 49%;
       -o-flex: 1 49%;
          flex: 1 49%;
}

div.responsive-picture.picture-6 {
  margin-right: auto;
  margin-left: auto;
  max-width: 400px;

  -webkit-flex: 1 48%;
     -moz-flex: 1 48%;
      -ms-flex: 1 48%;
       -o-flex: 1 48%;
          flex: 1 48%;
}

.row > [class*='coffee-span-'] > .container.container-2 {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

.row > [class*='coffee-span-'] > .container.container-3 {
  width: 44%;

  -webkit-flex: 1 44%;
     -moz-flex: 1 44%;
      -ms-flex: 1 44%;
       -o-flex: 1 44%;
          flex: 1 44%;
}

.row > [class*='coffee-span-'] > .container.shelling-ad-cont {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;
  -webkit-flex-direction: column;
     -moz-flex-direction: column;
      -ms-flex-direction: column;
       -o-flex-direction: column;
          flex-direction: column;
  margin: 7px 0 7px 3%;
  padding: 0;
  width: 90%;

  -webkit-flex: 1 55%;
     -moz-flex: 1 55%;
      -ms-flex: 1 55%;
       -o-flex: 1 55%;
          flex: 1 55%;
  -webkit-flex-wrap: nowrap;
     -moz-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
       -o-flex-wrap: nowrap;
          flex-wrap: nowrap;
  -webkit-justify-content: flex-start;
     -moz-justify-content: flex-start;
      -ms-justify-content: flex-start;
       -o-justify-content: flex-start;
          justify-content: flex-start;
  -webkit-align-items: flex-start;
     -moz-align-items: flex-start;
      -ms-align-items: flex-start;
       -o-align-items: flex-start;
          align-items: flex-start;
  -webkit-align-content: flex-start;
     -moz-align-content: flex-start;
      -ms-align-content: flex-start;
       -o-align-content: flex-start;
          align-content: flex-start;
}

.row > [class*='coffee-span-'] > .container#container-1 {
  min-height: 68px;
  width: 100%;
}

.row > [class*='coffee-span-'] .html-element.html-element-2 {
  float: none;
  margin-right: 0;
  margin-left: 0;
  width: 95%;
}

.row > [class*='coffee-span-'] .html-element#mucky-duck-cam {
  float: none;
  margin-right: auto;
  margin-left: auto;
  width: 88%;
}

.row > [class*='coffee-span-'] > .container.container-4 {
  margin: 0 auto;
  padding: 20px 0;
  width: 89%;
  border: 0 none #bcbcbc;
}

li a.list-item-text-3 {
  color: #167aa1;
  text-decoration: none;
}

div.responsive-picture.seaglass-pic {
  margin-right: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
  max-width: 300px;
  max-height: none;
  width: 49%;

  -webkit-order: 3;
     -moz-order: 3;
      -ms-order: 3;
       -o-order: 3;
          order: 3;
}

.row > [class*='coffee-span-'] > .container.seaglass-container {
  display: -webkit-flex;
  display:    -moz-flex;
  display:     -ms-flex;
  display:      -o-flex;
  display:         flex;

  -webkit-flex-wrap: wrap;
     -moz-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
       -o-flex-wrap: wrap;
          flex-wrap: wrap;
}

.row > [class*='coffee-span-'] .html-element.html-element-1 {
  width: 98%;
}

a.responsive-picture.picture-link-1 {
  max-width: 400px;
  width: 45%;

  -webkit-order: 2;
     -moz-order: 2;
      -ms-order: 2;
       -o-order: 2;
          order: 2;
}

.row > [class*='coffee-span-'] .html-element.html-element-3 {
  margin-right: auto;
  margin-left: auto;
  width: 96%;
}

.row > [class*='coffee-span-'] .html-element.html-element-4 {
  margin-right: auto;
  margin-left: auto;
  width: 97%;
}

.row > [class*='coffee-span-'] > .container.bg-white.flex-pic-container {
  background-color: #fff;
}

.row > [class*='coffee-span-'] > .container.container-5 {
  margin-left: 3%;
}

.row > [class*='coffee-span-'] > .container.container-6 {
  margin-right: auto;
  margin-left: auto;
  width: 70%;
  background-color: #f4f4f4;
}

a.responsive-picture.picture-link-2 {
  padding: 20px 20px 0;
  max-width: none;
}

@media screen and (max-width: 1369px) {
  /* Text Elements */

  h2.heading-2 {
    padding-right: 5px;
    padding-left: 10px;
    color: #187aa3;
    font-size: 25px;
  }

  .row > [class*='coffee-span-'] > .container.container-5 {
    margin-left: 3%;
  }

  .row > [class*='coffee-span-'] > .container.mobile-responsive-ad {
    display: block;
  }

  .row > [class*='coffee-span-'] > .container.responsive-ad-desktop-body {
    width: 90%;
    height: auto;
  }

  .row > [class*='coffee-span-'] > .container.responsive-ad-container {
    min-height: 200px;
  }

  .row > [class*='coffee-span-'] > .container.container-6 {
    margin-right: auto;
    margin-left: auto;
    width: 70%;
    background-color: #f4f4f4;
  }
}

@media screen and (max-width: 814px) {
  /* Text Elements */

  h1.heading-7 {
    float: none;
    clear: none;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    padding-right: 10px;
    padding-left: 10px;
    color: #187aa3;
    font-size: 34px;

    -webkit-order: 2;
       -moz-order: 2;
        -ms-order: 2;
         -o-order: 2;
            order: 2;
    -webkit-flex: 1 80%;
       -moz-flex: 1 80%;
        -ms-flex: 1 80%;
         -o-flex: 1 80%;
            flex: 1 80%;
  }

  h2.landing-h2 {
    font-size: 28px;
  }

  h2.h2-body {
    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  h2#heading-1 {
    font-size: 30px;
  }

  h2.heading-2 {
    padding-right: 5px;
    padding-left: 10px;
    color: #187aa3;
    font-size: 24px;
  }

  h3.h3-main-container {
    margin-top: 7px;
    margin-bottom: 7px;
    padding-bottom: 2px;
    text-decoration: none;
    font-size: 27px;

    -webkit-order: 1;
       -moz-order: 1;
        -ms-order: 1;
         -o-order: 1;
            order: 1;
  }

  h3.h3-webcam-container {
    margin-left: 1%;
    font-size: 30px;
  }

  p.paragraph span.bold {
    font-weight: 700;
  }

  p.paragraph.para-main-container {
    display: block;
    float: none;
    margin-top: 3px;
    margin-right: 3%;
    padding-right: 10px;
    padding-left: 3px;
    max-width: 570px;
    font-size: 17px;

    -webkit-flex: 1 51%;
       -moz-flex: 1 51%;
        -ms-flex: 1 51%;
         -o-flex: 1 51%;
            flex: 1 51%;
    -webkit-order: 4;
       -moz-order: 4;
        -ms-order: 4;
         -o-order: 4;
            order: 4;
  }

  p.paragraph.para-amenities-main-container {
    margin-right: 0;
    margin-left: 0;
    padding-right: 10px;
    padding-left: 3px;
    max-width: 500px;
    font-size: 17px;

    -webkit-flex: 1 50%;
       -moz-flex: 1 50%;
        -ms-flex: 1 50%;
         -o-flex: 1 50%;
            flex: 1 50%;
    -webkit-order: 4;
       -moz-order: 4;
        -ms-order: 4;
         -o-order: 4;
            order: 4;
  }

  p.paragraph.index-para {
    font-size: 17px;
  }

  p.paragraph.index-1-para {
    font-size: 17px;
  }

  p.paragraph.paragraph-1 {
    padding-right: 5px;
    padding-bottom: 0;
    padding-left: 5px;
    width: 96%;
  }

  p.paragraph.hours-of-operation {
    padding-left: 3px;

    -webkit-order: 4;
       -moz-order: 4;
        -ms-order: 4;
         -o-order: 4;
            order: 4;
    -webkit-flex: 1 62%;
       -moz-flex: 1 62%;
        -ms-flex: 1 62%;
         -o-flex: 1 62%;
            flex: 1 62%;
  }

  p.paragraph.paragraph-2 {
    -webkit-flex: 1 1 50%;
       -moz-flex: 1 1 50%;
        -ms-flex: 1 1 50%;
         -o-flex: 1 1 50%;
            flex: 1 1 50%;
  }

  p.paragraph.paragraph-5 {
    text-align: center;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  p.paragraph.webcam-link {
    margin-left: 2%;
  }

  p.paragraph.paragraph-7 {
    margin-right: auto;
    margin-left: auto;
    width: 100%;

    -webkit-order: 3;
       -moz-order: 3;
        -ms-order: 3;
         -o-order: 3;
            order: 3;
    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  p.paragraph.paragraph-8 {
    margin-top: -12px;
    color: #187aa3;
    text-align: center;
  }

  a.link-text.footer-mobile-link {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    font-size: 17px;
  }

  /* Common Elements */

  address.address-main-container {
    margin-left: 0;
    padding-left: 5px;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
    -webkit-align-self: auto;
       -moz-align-self: auto;
        -ms-align-self: auto;
         -o-align-self: auto;
            align-self: auto;
  }

  address.address-main-container p {
    text-align: left;
  }

  address.address-main-container a {
    text-align: left;
  }

  address span.address-text-link {
    text-decoration: none;
  }

  address a.address-text-1 {
    text-decoration: none;
  }

  address.map-container-address p {
    text-decoration: none;
  }

  address.map-container-address a {
    text-decoration: none;
  }

  /* Layout Elements */

  body > .row.footer-mobile-row {
    display: block;
  }

  body > .row.footer-desktop-row {
    display: none;
  }

  body > .row > [class*='coffee-span-'].footer-mobile-column {
    display: block;
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
    float: left;
    clear: none;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }

  body > .row > [class*='coffee-span-'].footer-logo-mobile-column {
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
    float: none;
    clear: none;
    margin-right: auto;
    margin-left: auto;
  }

  body > .row > [class*='coffee-span-'].slideshow-column {
    display: block;

    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
  }

  body > .row > [class*='coffee-span-'].column-19 {
    display: block;
    float: none;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;

    -webkit-justify-content: center;
       -moz-justify-content: center;
        -ms-justify-content: center;
         -o-justify-content: center;
            justify-content: center;
    -webkit-align-content: center;
       -moz-align-content: center;
        -ms-align-content: center;
         -o-align-content: center;
            align-content: center;
    -webkit-align-items: center;
       -moz-align-items: center;
        -ms-align-items: center;
         -o-align-items: center;
            align-items: center;
  }

  body > .row.row-12 {
    display: none;
  }

  body > .row > [class*='coffee-span-'].column-23 {
    display: block;
    float: none;
    margin-right: auto;
    margin-left: auto;
    padding-right: 5px;
    padding-left: 5px;

    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
  }

  body > .row > [class*='coffee-span-'].column-24 {
    display: none;
  }

  body > .row > [class*='coffee-span-'].flex-column {
    float: none;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }

  body > .row > [class*='coffee-span-'].column-5 {
    display: block;
    float: none;
    margin: 0;
    padding-right: 5px;
    padding-left: 5px;

    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
  }

  body > .row.row-1 {
    margin-top: 0;
    margin-bottom: 0;
    width: 100%;
  }

  body > .row > [class*='coffee-span-'].column-2 {
    float: none;
    padding-right: 0;
    padding-left: 0;
  }

  body > .row.body-landing-row1 {
    background-color: #fff;
  }

  body > .row.row-2 {
    background-color: #fff;
  }

  a.responsive-picture.footer-logo-mobile-link {
    margin: 5px auto 0;
    max-width: 242px;
  }

  .row > [class*='coffee-span-'] .html-element.slideshow-html-element {
    margin-top: 0;
  }

  .row > [class*='coffee-span-'] > .container.landing-container {
    display: -webkit-flex;
    display:    -moz-flex;
    display:     -ms-flex;
    display:      -o-flex;
    display:         flex;
    margin-right: 0;
    margin-left: 3%;
    max-width: none;
    width: 88%;

    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
  }

  div.responsive-picture.picture-main-container {
    float: none;
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
    max-width: 400px;
    width: 100%;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
    -webkit-order: 1;
       -moz-order: 1;
        -ms-order: 1;
         -o-order: 1;
            order: 1;
  }

  .row > [class*='coffee-span-'] > .container.flex-container {
    padding: 10px;
    width: 45%;

    -webkit-flex: 1 45%;
       -moz-flex: 1 45%;
        -ms-flex: 1 45%;
         -o-flex: 1 45%;
            flex: 1 45%;
  }

  .row > [class*='coffee-span-'] > .container.mobile-responsive-ad {
    display: block;
    float: left;
    margin-bottom: 7px;
    width: 50%;
  }

  div.responsive-picture.picture-2 {
    margin: 0 auto;
    padding: 5px;
    max-width: 325px;

    -webkit-flex: 50%;
       -moz-flex: 50%;
        -ms-flex: 50%;
         -o-flex: 50%;
            flex: 50%;
  }

  .row > [class*='coffee-span-'] > .container.about-us-link-container {
    margin-right: 1%;
    margin-left: 1%;
    padding: 5px;
    width: 30%;

    -webkit-flex: 1 30%;
       -moz-flex: 1 30%;
        -ms-flex: 1 30%;
         -o-flex: 1 30%;
            flex: 1 30%;
  }

  div.responsive-picture.picture-3 {
    max-width: 250px;
  }

  .row > [class*='coffee-span-'] > .container.responsive-ad-container {
    -webkit-order: 4;
       -moz-order: 4;
        -ms-order: 4;
         -o-order: 4;
            order: 4;
  }

  .row > [class*='coffee-span-'] .html-element.webcam-desktop {
    display: block;
    width: 96%;
  }

  .row > [class*='coffee-span-'] > .container.webcam-container {
    margin-top: 0;
  }

  .row > [class*='coffee-span-'] > .container.responsive-ad-desktop-body {
    float: none;
    margin-right: 0;
    margin-left: 3%;
    min-height: 80px;
    width: 90%;

    -webkit-justify-content: flex-start;
       -moz-justify-content: flex-start;
        -ms-justify-content: flex-start;
         -o-justify-content: flex-start;
            justify-content: flex-start;
    -webkit-align-items: flex-start;
       -moz-align-items: flex-start;
        -ms-align-items: flex-start;
         -o-align-items: flex-start;
            align-items: flex-start;
    -webkit-align-content: flex-start;
       -moz-align-content: flex-start;
        -ms-align-content: flex-start;
         -o-align-content: flex-start;
            align-content: flex-start;
  }

  .row > [class*='coffee-span-'] .html-element.google-responsive-ad {
    padding: 0;

    -webkit-flex: 1 auto;
       -moz-flex: 1 auto;
        -ms-flex: 1 auto;
         -o-flex: 1 auto;
            flex: 1 auto;
  }

  div.responsive-picture.picture-4 {
    margin-right: auto;
    margin-left: auto;
    padding: 0;
    max-width: 400px;
    width: 100%;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  .row > [class*='coffee-span-'] > .container.container-1 {
    border-top-left-radius: 10px 10px;
    border-top-right-radius: 10px 10px;
    border-bottom-right-radius: 10px 10px;
    border-bottom-left-radius: 10px 10px;

    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
  }

  div.responsive-picture.picture-5 {
    margin: 0 auto;
    max-width: 400px;
    width: 100%;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  .row > [class*='coffee-span-'] > .container.shelling-ad-cont {
    margin-right: 0;
    margin-left: 3%;
    width: 90%;

    -webkit-flex: 0 0 auto;
       -moz-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
         -o-flex: 0 0 auto;
            flex: 0 0 auto;
  }

  .row > [class*='coffee-span-'] > .container.container-3 {
    display: -webkit-flex;
    display:    -moz-flex;
    display:     -ms-flex;
    display:      -o-flex;
    display:         flex;
    margin-right: auto;
    margin-left: auto;
    max-width: none;
    width: 63%;

    -webkit-flex-wrap: wrap;
       -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
         -o-flex-wrap: wrap;
            flex-wrap: wrap;
    -webkit-align-content: center;
       -moz-align-content: center;
        -ms-align-content: center;
         -o-align-content: center;
            align-content: center;
    -webkit-align-items: center;
       -moz-align-items: center;
        -ms-align-items: center;
         -o-align-items: center;
            align-items: center;
    -webkit-justify-content: center;
       -moz-justify-content: center;
        -ms-justify-content: center;
         -o-justify-content: center;
            justify-content: center;
    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  div.responsive-picture.picture-6 {
    margin: 0 auto;
    max-width: 400px;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  .row > [class*='coffee-span-'] > .container#container-1 {
    min-height: 53px;
  }

  .row > [class*='coffee-span-'] .html-element#mucky-duck-cam {
    display: block;
    width: 95%;
  }

  .row > [class*='coffee-span-'] > .container.container-4 {
    width: 82%;
  }

  .row > [class*='coffee-span-'] > .container.webcam-google-ad-bottom {
    width: 60%;
  }

  .row > [class*='coffee-span-'] > .container.business-location-container {
    margin-right: 0;
    margin-left: 3%;
    width: 88%;
  }

  .row > [class*='coffee-span-'] .html-element.html-element-2 {
    width: 90%;
  }

  div.responsive-picture.seaglass-pic {
    float: left;
    margin: 0;
    padding-right: 0;
    padding-left: 0;
    max-height: none;
    width: 43%;
  }

  .row > [class*='coffee-span-'] > .container.seaglass-container {
    margin-right: auto;
    margin-left: auto;

    -webkit-align-items: center;
       -moz-align-items: center;
        -ms-align-items: center;
         -o-align-items: center;
            align-items: center;
    -webkit-align-content: space-between;
       -moz-align-content: space-between;
        -ms-align-content: space-between;
         -o-align-content: space-between;
            align-content: space-between;
    -webkit-justify-content: space-around;
       -moz-justify-content: space-around;
        -ms-justify-content: space-around;
         -o-justify-content: space-around;
            justify-content: space-around;
  }

  a.responsive-picture.picture-link-1 {
    width: 100%;
  }

  .row > [class*='coffee-span-'] > .container.container-5 {
    margin-left: 3%;
  }

  .row > [class*='coffee-span-'] > .container.container-6 {
    margin-right: auto;
    margin-left: auto;
    padding: 10px;
    width: 70%;
    background-color: #f4f4f4;
  }

  a.responsive-picture.picture-link-2 {
    padding-top: 0;
    padding-right: 5px;
    padding-left: 5px;
  }
}

@media screen and (max-width: 502px) {
  /* Text Elements */

  h1.heading-7 {
    padding-right: 5px;
    background-color: transparent;
    text-align: left;
    font-size: 26px;
    line-height: 1.06;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  h1 span.heading-text-1 {
    font-size: 23px;
  }

  h2.landing-h2 {
    margin-left: 1%;
    text-align: left;
    font-size: 21px;
    line-height: 1.27;

    -webkit-order: 3;
       -moz-order: 3;
        -ms-order: 3;
         -o-order: 3;
            order: 3;
  }

  h2#heading-1 {
    font-size: 23px;
  }

  h2.heading-2 {
    margin-right: auto;
    margin-left: 0;
    padding-right: 5px;
    padding-left: 10px;
    color: #187aa3;
    text-align: left;
    font-size: 20px;

    -webkit-order: 3;
       -moz-order: 3;
        -ms-order: 3;
         -o-order: 3;
            order: 3;
    -webkit-align-self: center;
       -moz-align-self: center;
        -ms-align-self: center;
         -o-align-self: center;
            align-self: center;
  }

  h3.h3-main-container {
    text-align: left;
    font-weight: 400;
    font-size: 22px;
  }

  h3.h3-webcam-container {
    margin: 4px auto 0 -2%;
    padding-right: 7px;
    padding-left: 7px;
    background-color: #f6f6f6;
    font-size: 19px;
  }

  h3.heading-1 {
    font-size: 25px;
  }

  p.paragraph span.bold {
    font-weight: 700;
  }

  p.paragraph.para-main-container {
    display: block;
    font-size: 16px;
  }

  p.paragraph.para-amenities-main-container {
    display: block;
    margin-right: auto;
    padding-left: 4px;
    max-width: none;
    text-align: left;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.64;

    -webkit-order: 4;
       -moz-order: 4;
        -ms-order: 4;
         -o-order: 4;
            order: 4;
    -webkit-flex: 1 53%;
       -moz-flex: 1 53%;
        -ms-flex: 1 53%;
         -o-flex: 1 53%;
            flex: 1 53%;
  }

  p.paragraph.hours-of-operation {
    margin-right: 0;
    margin-left: 0;
    padding-bottom: 0;
    padding-left: 4px;
    text-align: left;
    font-size: 16px;
  }

  p.paragraph.index-para {
    padding-right: 10px;
    padding-left: 10px;
    font-size: 17px;
  }

  p.paragraph.index-1-para {
    padding-right: 10px;
    padding-left: 10px;
    font-size: 16px;
    line-height: 1.5;

    -webkit-order: 2;
       -moz-order: 2;
        -ms-order: 2;
         -o-order: 2;
            order: 2;
  }

  p.paragraph.paragraph-1 {
    padding-right: 3px;
    padding-left: 3px;
  }

  p.paragraph.paragraph-7 {
    margin-left: auto;
    width: 100%;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  p.paragraph.paragraph-8 {
    margin-top: -12px;
    margin-bottom: 0;
    padding-bottom: 0;
    color: #187aa3;
    text-align: center;
    font-size: 16px;
  }

  a.link-text.footer-mobile-link {
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: center;
    line-height: 1.48;
  }

  a.link-text.text-link-main-container {
    display: none;
  }

  a.link-text.about-text-link {
    font-size: 16px;
  }

  /* Common Elements */

  address.address-main-container {
    margin-right: 5%;
    margin-left: 1%;
    padding: 5px;
  }

  address.address-main-container p {
    text-align: left;
    font-size: 16px;
  }

  address.address-main-container a {
    text-align: left;
    font-size: 16px;
  }

  address span.address-text-link {
    font-size: 20px;
  }

  /* Layout Elements */

  body > .row.footer-mobile-row {
    display: block;
    margin-top: 0;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  body > .row > [class*='coffee-span-'].footer-mobile-column {
    display: block;
    float: none;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }

  body > .row > [class*='coffee-span-'].footer-logo-mobile-column {
    display: block;
    float: none;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }

  body > .row > [class*='coffee-span-'].column-19 {
    display: -webkit-flex;
    display:    -moz-flex;
    display:     -ms-flex;
    display:      -o-flex;
    display:         flex;
    float: none;
    padding-right: 0;
    padding-left: 0;
  }

  body > .row > [class*='coffee-span-'].flex-column {
    float: none;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }

  body > .row > [class*='coffee-span-'].column-5 {
    float: none;
    margin-right: auto;
    margin-left: auto;
    background-color: #fff;
  }

  body > .row > [class*='coffee-span-'].column-23 {
    padding-right: 0;
    padding-left: 0;
  }

  body > .row.weather-widget-row {
    margin-top: 0;
  }

  body > .row > [class*='coffee-span-'].column-2 {
    padding-right: 0;
    padding-left: 0;
  }

  body > .row.row-2 {
    background-color: #fff;
  }

  body > .row.row-1 {
    background-color: #fff;
  }

  body > .row.body-landing-row1 {
    background-color: #fff;
  }

  a.responsive-picture.footer-logo-mobile-link {
    max-width: 150px;
  }

  .row > [class*='coffee-span-'] > .container.responsive-ad-container {
    margin-top: 5px;
    margin-bottom: 5px;
    padding-bottom: 0;
    width: 95%;

    -webkit-flex: 1 97%;
       -moz-flex: 1 97%;
        -ms-flex: 1 97%;
         -o-flex: 1 97%;
            flex: 1 97%;
  }

  div.responsive-picture.picture-main-container {
    padding-left: 0;

    -webkit-flex: 1 52%;
       -moz-flex: 1 52%;
        -ms-flex: 1 52%;
         -o-flex: 1 52%;
            flex: 1 52%;
    -webkit-order: 3;
       -moz-order: 3;
        -ms-order: 3;
         -o-order: 3;
            order: 3;
  }

  .row > [class*='coffee-span-'] > .container.flex-container {
    margin: 15px 4%;
    padding: 15px 10px;
    width: 45%;
    background-color: #f4f4f4;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  .row > [class*='coffee-span-'] > .container.mobile-responsive-ad {
    margin-top: 4px;
    margin-bottom: 4px;
    width: 95%;
  }

  div.responsive-picture.picture-2 {
    padding: 0 0 2px;
    max-width: 400px;

    -webkit-flex: 0 0 100%;
       -moz-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
         -o-flex: 0 0 100%;
            flex: 0 0 100%;
  }

  .row > [class*='coffee-span-'] > .container.about-us-link-container {
    width: 100%;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  div.responsive-picture.picture-3 {
    max-width: 200px;
  }

  .row > [class*='coffee-span-'] > .container.flex-pic-container {
    background-color: #fff;
  }

  .row > [class*='coffee-span-'] .html-element.webcam-desktop {
    display: block;
  }

  .row > [class*='coffee-span-'] .html-element.webcam-mobile {
    display: none;
    margin-top: 2px;
    margin-bottom: 2px;
  }

  .row > [class*='coffee-span-'] > .container.webcam-container {
    display: -webkit-flex;
    display:    -moz-flex;
    display:     -ms-flex;
    display:      -o-flex;
    display:         flex;
    -webkit-flex-direction: column;
       -moz-flex-direction: column;
        -ms-flex-direction: column;
         -o-flex-direction: column;
            flex-direction: column;
    margin: 1px auto 4px;
    padding-right: 0;
    padding-left: 0;
    max-width: 800px;
    width: 99%;

    -webkit-align-content: center;
       -moz-align-content: center;
        -ms-align-content: center;
         -o-align-content: center;
            align-content: center;
    -webkit-justify-content: center;
       -moz-justify-content: center;
        -ms-justify-content: center;
         -o-justify-content: center;
            justify-content: center;
    -webkit-align-items: center;
       -moz-align-items: center;
        -ms-align-items: center;
         -o-align-items: center;
            align-items: center;
  }

  .row > [class*='coffee-span-'] > .container.responsive-ad-desktop-body {
    float: none;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
    width: 90%;
  }

  .row > [class*='coffee-span-'] > .container.business-location-container {
    margin-right: auto;
    margin-bottom: 30px;
    margin-left: auto;
  }

  .row > [class*='coffee-span-'] .html-element.google-responsive-ad {
    margin-right: auto;
    margin-left: auto;
    width: 100%;

    -webkit-flex: 1 100%;
       -moz-flex: 1 100%;
        -ms-flex: 1 100%;
         -o-flex: 1 100%;
            flex: 1 100%;
  }

  .row > [class*='coffee-span-'] > .container.shelling-ad-cont {
    margin-top: 7px;
    margin-right: auto;
    margin-left: auto;
    padding: 10px 0;
    width: 100%;
  }

  .row > [class*='coffee-span-'] > .container#container-1 {
    min-height: 65px;
  }

  .row > [class*='coffee-span-'] > .container.container-4 {
    width: 95%;
  }

  .row > [class*='coffee-span-'] .html-element.html-element-2 {
    width: 96%;
  }

  .row > [class*='coffee-span-'] > .container.webcam-google-ad-bottom {
    margin-top: 0;
    margin-bottom: 0;
    width: 95%;
  }

  div.responsive-picture.seaglass-pic {
    float: none;
    margin-right: auto;
    margin-left: auto;
    max-height: none;
    width: 100%;
  }

  .row > [class*='coffee-span-'] > .container.container-3 {
    width: 61%;
  }

  .row > [class*='coffee-span-'] .html-element#html-element-8 {
    display: block;
    width: 100%;
  }

  .row > [class*='coffee-span-'] .html-element#html-element-9 {
    display: none;
  }

  .row > [class*='coffee-span-'] .html-element#html-element-9-copy-1 {
    display: none;
  }

  .row > [class*='coffee-span-'] .html-element#html-element-8-copy-1 {
    display: block;
    width: 100%;
  }

  .row > [class*='coffee-span-'] > .container.landing-container {
    margin-right: auto;
    margin-left: auto;
    padding-right: 20px;
    width: 91%;
  }

  .row > [class*='coffee-span-'] > .container.container-1 {
    width: 95%;
    border-top-left-radius: 10px 10px;
    border-top-right-radius: 10px 10px;
    border-bottom-right-radius: 10px 10px;
    border-bottom-left-radius: 10px 10px;
  }

  .row > [class*='coffee-span-'] > .container.container-6 {
    margin-right: auto;
    margin-left: auto;
    padding: 15px 10px;
    width: 92%;
    background-color: #f4f4f4;
  }

  a.responsive-picture.picture-link-2 {
    margin-top: 0;
    margin-bottom: 0;
    padding: 5px 5px 0;
  }
}