/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

html,
button,
input,
select,
textarea {
  color: #222;
}

html {
  font-size: 1em;
  line-height: 1.4;
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

audio,
canvas,
img,
video {
  vertical-align: middle;
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: vertical;
}

.browsehappy {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

.PNthin {
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 100;
}

.PNthinItalic {
  font-family: "proxima-nova", sans-serif;
  font-style: italic;
  font-weight: 100;
}

.PNlight {
  font-family: "proxima-nova", "courier";
  font-style: normal;
  font-weight: 300;
}

.PNlightItalic {
  font-family: "proxima-nova", sans-serif;
  font-style: italic;
  font-weight: 300;
}

.PNregular {
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 400;
}

.PNregularItalic {
  font-family: "proxima-nova", sans-serif;
  font-style: italic;
  font-weight: 400;
}

.PNmedium {
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 500;
}

.PNmediumItalic {
  font-family: "proxima-nova", sans-serif;
  font-style: italic;
  font-weight: 500;
}

.PNsemibold {
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 600;
}

.PNsemiboldItalic {
  font-family: "proxima-nova", sans-serif;
  font-style: italic;
  font-weight: 600;
}

.PNbold {
  font-family: "proxima-nova", sans-serif;
  font-style: normal;
  font-weight: 700;
}

.itemstack {
  font-size: 20px;
  margin: 0.25em 0 -0.5em 0 !important;
  text-transform: uppercase;
}

.caps {
  text-transform: uppercase;
}

html,
body {
  background: #f3f3f3;
  width: 100%;
  min-width: 960px;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
li {
  color: #545351;
}

ul {
  list-style: none;
  list-style-type: none;
  padding: 0;
}

ul.bevItemList li {
  margin: 0;
  padding: 0;
  line-height: 1;
}

ul.bevItemList li span:first-child {
  width: 250px;
  display: inline-block;
}

ul.bevItemList li span.price {
  float: right;
}

li {
  list-style: none;
  padding: 0;
  text-align: left;
}

div.row {
  display: inline-block;
  float: left;
}

div.col {
  display: block;
  float: none;
}

div.vertDivider {
  width: 20px;
  height: 30px;
  background: url(../img/dots_lg-V.svg) center bottom no-repeat;
  float: left;
  margin-top: 10px;
}

div.vertDividerSm {
  width: 20px;
  height: 30px;
  background: url(../img/dots_sm-V.svg) 73% bottom no-repeat;
  float: left;
  margin-top: 10px;
}

div.vertDivider-noDots {
  width: 20px;
  height: 30px;
  background: none;
  float: left;
  margin-top: 10px;
}

div.fish_icon {
  width: 100px;
  float: left;
  margin-right: 20px;
  margin-top: 20px;
}

div.fish_icon img {
  width: 100%;
  height: auto;
}

div.header_logo {
  width: 497px;
  float: left;
  margin-top: 20px;
}

div.header_logo img {
  width: 100%;
  height: auto;
}

.hide-me {
  display:none;
}

h1,
.h1 {
  font-size: 2rem;
  margin: 0;
}

h2,
.h2 {
  font-size: 3rem;
  margin: 0;
  line-height: 3rem;
}

h3,
.h3 {
  font-size: 2.3rem;
  margin: 0;
  line-height: 2.3rem;
}

h4,
.h4 {
  font-size: 1.7rem;
  margin: 5px 0 0 0;
  line-height: 1.7rem;
}

h5,
.h5 {
  font-size: 1.4rem;
  margin: 0;
  line-height: 1.4rem;
}

h6,
.h6 {
  font-size: 1rem;
  margin: 0;
  line-height: 1rem;
}

p {
  margin: 0;
}

section#content {
  width: 100%;
}

#titleBar {
  width: 100%;
  max-width: 920px;
  margin: 0 auto;
  padding: 55px 0 50px 0;
}

#titleBar #logo {
  /* 	max-width:500px; */
  /* 	float: left; */
  margin-right: 35px;
}

#titleBar #logo img {
  width: 100%;
  height: auto;
}
#titleBar #rockplaza_plug {
  text-align: center;
  background-color: #b4343b;
  padding: 22px 18px 28px 18px;
  margin-top: 20px;
  float: right;
}

#titleBar #rockplaza_plug h4 {
  color: #ffffff;
  font-size: 1.5rem;
  text-transform: uppercase;
  line-height: 1.4rem;
}

#titleBar #rockplaza_plug h4 span {
  font-size: 1.3rem;
}

#titleBar #order {
  width: 50%;
  text-align: right;
}

/*
a#orderBtn {
	text-align: center;
	width:320px;
	height:55px;
	background: #BF333A;
	padding:27px 0 0 0;
	display: inline-block;
	margin-top:1px;
	color:#FFFFFF;
	text-decoration: none;
	font-size: 1.3rem;
}
*/

a.deliveryBtn,
a.cateringBtn {
  text-align: center;
  height: 43px;
  background: #b4343b;
  padding: 12px 10px 0px 10px;
  display: inline-block;
  margin-top: 0px;
  color: #ffffff;
  text-decoration: none;
  font-size: 1.3rem;
  border: none !important;
  cursor: default;
  line-height: 1.2rem;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
  cursor: pointer;
  box-sizing: border-box;
}

a.deliveryBtn span,
a.cateringBtn span {
  font-size: 10px;
}

a.deliveryBtn.caviar {
  width: 110px;
  margin-right: 10px;
}

a.cateringBtn.menu-download {
  width: 180px;
  margin-right: 10px;
}

a.cateringBtn.ez-cater {
  width: 180px;
  margin-right: 10px;
}

a.deliveryBtn.caviar.long {
  padding: 0 100px;
}

a.deliveryBtn.grubHub {
  width: 110px;
  margin-right: 10px;
}

a.deliveryBtn.seamless {
  width: 110px;
}

a.deliveryBtn.coming_soon {
  height: 30px;
  margin: 0;
  padding-top: 14px;
  width: 92%;
}

a.deliveryBtn:hover {
  background: #9c282e;
  border: none !important;
}
a.deliveryBtn:active,
a.deliveryBtn:focus,
a.deliveryBtn:visited {
  border: none !important;
}

a span.hidden {
  display: none;
}

.rounded {
  -moz-border-radius: 9px;
  -webkit-border-radius: 9px;
  border-radius: 9px;
}

.shadowed {
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
}

nav {
  width: 100%;
  border-top: 2px solid #62615e;
  border-bottom: 2px solid #62615e;
  background: url(../img/woodBmapPatt.png) repeat 50% -1px;
}

nav ul {
  width: 960px;
  margin: 0 auto;
  /*
	border-left: 2px solid #62615E;
	border-right: 2px solid #62615E;
*/
}

nav ul a {
  display: block;
  border-left: 2px solid #62615e;
  font-size: 1.2rem;
  padding: 22px 0 0 0;
  float: left;
  text-decoration: none;
  height: 48px;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  transition: 0.3s;
}

nav ul li a {
  text-align: center;
  width: 24.7%;
}

nav ul li a span img {
  /* 	margin:-6px 0 0 0px; */
}

nav ul a:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

nav ul a#to-go-menu {
}

/* Hamburger menu button - hidden on desktop */
.hamburger {
  display: none;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 15px 15px 21px 15px;
  margin: 0 auto;
  width: 50px;
  height: 56px;
  position: relative;
}

.hamburger-line {
  display: block;
  width: 25px;
  height: 3px;
  background-color: #62615e;
  margin: 5px auto;
  transition: all 0.3s ease;
  border-radius: 2px;
}

/* Hamburger animation when open */
.hamburger.open .hamburger-line:nth-child(1) {
  transform: rotate(45deg) translate(5px, 6px);
}

.hamburger.open .hamburger-line:nth-child(2) {
  opacity: 0;
}

.hamburger.open .hamburger-line:nth-child(3) {
  transform: rotate(-45deg) translate(6px, -7px);
}

nav ul li#sushi-bar-menu {
}

nav ul li#catering-menu {
}

nav ul a#location {
}

nav ul a#locations {
  border-right: 2px solid #62615e;
}

.sectionDivider {
  /* width:100%; */
  height: 20px;
  border-top: 2px solid #62615e;
  border-bottom: 2px solid #62615e;
  background: url(../img/woodBmapPatt.png) 50% -1px;
  display: block;
}

.sectionDivider ul {
  width: 960px;
  margin: 0 auto;
  list-style: none;
}

.sectionDivider ul li {
  border-left: 2px solid #62615e;
  display: block;
  float: left;
  height: 20px;
}

.sectionDivider ul li.one {
  width: 24.7%;
}

.sectionDivider ul li.two {
  width: 24.7%;
}

.sectionDivider ul li.three {
  width: 24.7%;
}

.sectionDivider ul li.four {
  width: 24.7%;
  border-right: 2px solid #62615e;
}

.sectionDivider.footer {
}

#heroArea {
  height: 340px;
  /* 	background: url(../img/wallBoards2by.jpg) 50% -1px; */
}

#heroArea #heroSlideshow {
  width: 100%;
  height: 340px;
}

#heroArea #heroSlideshow img.rsImg {
  background-size: 50px;
}

#heroArea div#heroSlideshow .rsABlock {
  position: absolute;
  width: 100%;
  /* 	top:10px !important; */
  text-align: center;
  color: #fff;
  z-index: 1000;
}

#heroArea div#heroSlideshow .rsABlock span {
  position: relative;
  top: 300px;
  font-size: 1.2rem;
 // text-shadow: 1px 1px 0px black;
  background-color: #000;
  padding: 8px 10px;
}

#sushiSashimiSlideshow img {
  width: 100%;
}

#enormousSushiPlatter img {
  width: 100%;
}

#avocadoSpecialRoll img {
  width: 100%;
}

#hankoMass {
  height: 100%;
  margin: 0 auto;
  background: url(../img/hankoMass-seasons.png) no-repeat 50% 50%;
}

section#greeting {
  width: 920px;
  margin: 0 auto 90px auto;
  background: #f3f3f3;
}

section#eaterNY-plug {
  width: 920px;
  margin: 0 auto;
  padding: 60px 0;
}

section#eaterNY-plug .left-half {
  width: 50%;
  float: left;
}

section#eaterNY-plug .left-half h2 {
  padding-top: 20px;
  font-size: 1.8rem;
  line-height: 1.8rem;
}

section#eaterNY-plug .left-half h3 {
  padding-top: 10px;
  font-size: 1.6rem;
  line-height: 1.6rem;
}

section#eaterNY-plug .left-half h4 {
  padding-top: 10px;
  font-size: 0.8rem;
}

section#eaterNY-plug .right-half {
  width: 50%;
  float: left;
  text-align: right;
}



section#menuArea div#buildAbowlSlideshow .rsABlock,
section#menuArea div#sushiSlideshow .rsABlock {
  position: absolute;
  width: 320px;
  top: 10px !important;
  text-align: center;
  color: #333333;
}

section#greeting #sushiSlideshow .rsABlock em,
section#menuArea #buildAbowlSlideshow .rsABlock em {
  font-size: 0.8rem;
}

section#greeting #greetingMessage {
  width: 100%;
  margin: 80px 0 0 0;
  height: 230px;
}

section#greeting #accessibilityMessage {
  width: 100%;
  margin: 80px 0 0 0;
  height: 460px;
}

/* Reduce spacing after accessibility statement */
section#greeting:has(#accessibilityMessage) {
  margin-bottom: 40px;
}

section#greeting #greetingMessage h1,
section#greeting #accessibilityMessage h1 {
  margin-bottom: 8px;
  font-size: 3.2rem;
  line-height: 1;
}

section#greeting #greetingMessage p,
section#greeting #accessibilityMessage p {
  font-size: 1.4rem;
  line-height: 2.1rem;
  margin-top: 0;
  text-align: justify;
}

section#locations {
  width: 920px;
  margin: 30px auto 100px;
}

section#locations .locations-container {
  display: flex;
  flex-wrap: wrap;
  gap: 4%;
  width: 100%;
}

section#locations div#brookfield_location {
  flex: 1;
  min-width: 300px;
  padding-right: 20px;
}

section#locations div#rockplaza_location {
  flex: 1;
  min-width: 300px;
  padding-right: 20px;
}

section#locations div.restaurant_logo img {
  width: 100%;
  margin-bottom: 20px;
}

section#locations div.restaurant_logo .neighborhood-desc {
  font-size: 0.95rem;
  margin-top: 0;
  margin-bottom: 18px;
  color: #666;
}

section#locations div.hours {
  text-align: left;
  color: #696767;
  margin-bottom: 20px;
}

section#locations div.delivery_buttons {
  text-align: left;
  min-width: 125px;
  padding: 6px 0;
}

section#locations div.catering_buttons {
  text-align: left;
  min-width: 125px;
  padding: 10px 0;
}

section#photo {
  width: 100%;
  min-height: 365px;
}

section#aboutArea,
section#menuArea {
  min-height: 365px;
  width: 920px;
  margin: 40px auto;
  padding: 40px 0;
}

section#aboutArea p,
section#menuArea p {
  margin: 0 0 5px 0;
}

section#aboutArea h2,
section#menuArea h2,
.h2 {
  margin: 0.25em 0 0 0;
  text-transform: uppercase;
}

section#aboutArea h2.tighten,
section#menuArea h2.tighten,
.h2.tighten {
  margin: 0.25em 0 -0.3em 0;
  text-transform: uppercase;
}

section#aboutArea h3,
section#menuArea h3,
.h3 {
  margin: 0.25em 0 0.1em 0;
  text-transform: uppercase;
}

section#aboutArea h3.tighten,
section#menuArea h3.tighten,
.h3.tighten {
  margin: 0.25em 0 -0.3em 0;
  text-transform: uppercase;
}

section#aboutArea h4,
section#menuArea h4,
.h4 {
  margin: 0.25em 0 0.1em 0;
  text-transform: uppercase;
}

section#aboutArea h4.tighten,
section#menuArea h4.tighten,
.h4.tighten {
  margin: 0.25em 0 -0.3em 0;
  text-transform: uppercase;
}

section#aboutArea h5,
section#menuArea h5,
.h5 {
  margin: 0.25em 0 0.1em 0;
  text-transform: uppercase;
}

section#aboutArea h6,
section#menuArea h6,
.h6 {
  /* 	margin:0.25em 0 0.1em 0; */
  text-transform: uppercase;
}

section#beverages {
  width: 920px;
  margin: 0 auto;
  /* 	padding:0 20px; */
}

#beveragesDessertSlideshow {
  width: 100%;
}

section#beverages img {
  width: 33.333333333333%;
}

.item {
  font-size: 1.2rem;
  font-style: normal;
  text-transform: none;
}

.itemDescr {
  font-size: 0.9rem;
  font-style: italic;
  text-transform: none;
  line-height: 1rem;
}

.item {
  line-height: 1.1rem;
}

span.subitem {
  margin-top: 5px;
  padding-left: 14px;
  font-size: 1rem;
  line-height: 1.2rem;
  text-transform: capitalize;
}

span.itemDescr,
.item span.itemDescr,
.subitem span.itemDescr {
  font-size: 0.9rem;
  font-style: italic;
  text-transform: none;
  padding-left: 12px;
  display: inline-block;
}

.itemDescr.small {
  font-size: 0.8rem;
}

span.price,
.item span.price {
  font-size: 16px;
  font-weight: bold;
  font-style: normal;
  margin: 0;
}

#SushiALaCarte li p {
  margin-right: 37px;
}

.GF::after {
  content: "GF";
  font-size: 1rem;
  color: #b3353b;
  padding-left: 14px;
}

.sushiRed {
  color: #b3353b;
}

section#menuArea {
  position: relative;
  min-height: 1000px;
}

#menuArea #buildAbowlSlideshow,
#menuArea #sushiSlideshow {
  width: 100%;
  height: 320px;
}

#menuArea #beverageDessertMenu {
  padding-top: 40px;
}

section a.goTop {
  width: 30px;
  height: 30px;
  background: url(../img/gotoHomeBtn.png) no-repeat;
  display: inline-block;
  margin-top: 10px;
  z-index: 1000;
}

/* FAQ Section */
section#faq {
  width: 90%;
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 20px;
  text-align: center;
}

section#faq h2 {
  margin-bottom: 10px;
  text-align: left;
}

section#faq .faq-container {
  text-align: left;
  margin-top: 30px;
}

section#faq .faq-item {
  margin-bottom: 25px;
  padding-bottom: 25px;
  border-bottom: 1px solid #ddd;
}

section#faq .faq-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

section#faq .faq-item h3 {
  font-size: 1.1rem;
  margin-bottom: 8px;
  color: #333;
}

section#faq .faq-item p {
  font-size: 1rem;
  line-height: 1.6;
  color: #555;
  margin: 0;
}

section#locationArea {
  width: 100%;
  height: 380px;
  display: block;
  position: relative; /* For loading indicator positioning */
}

/* Map loading indicator */
#map-loading {
  background: rgba(255, 255, 255, 0.95);
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

#map-loading p {
  margin: 0;
}

footer {
  width: 100%;
  min-height: 620px;
  background: url(../img/woodBmapDrkPatt_lt.png) 50% -2px;
  background-repeat: repeat;
}

footer section {
  width: 1120px;
  max-width: 100%;
  margin: 0 auto;
  padding: 25px 0 55px 0;
  overflow: hidden; /* Clear floats */
}

footer section h1,
footer section h2,
footer section h3,
footer section h4,
footer section h5,
footer section h6 {
  color: #545351;
}

footer section div#rockplaza_address {
  float: left;
  padding-top: 30px;
  margin-right: 60px;
  width: 30%;
}

footer section div#brookfield_address {
  float: left;
  padding-top: 30px;
  margin-right: 60px;
  width: 30%;
}

footer section div#address_block {
  float: left;
  width: 100%;
  /*margin-top: 10px;*/
}

footer section div#lgFish {
  float: left;
  margin-top: 30px;
  margin-right: 0;
}

footer section div#accessibility {
  float: none;
  clear: both;
  text-align: center;
  margin: 40px auto 0 auto;
  width: 100%;
}

footer section p,
footer section h2 {
  margin: 0;
}

footer section div#locations_header {
  margin-bottom: 10px;
}

footer section .rule {
  width: 100%;
  border-bottom: 1px solid #000;
}

div#brookfield_popup_content,
div#rockefeller_popup_content {
  width: 300px;
  padding-bottom: 5px;
}
div#brookfield_popup_content h6#secondHeading,
div#rockefeller_popup_content h6#secondHeading {
  margin-bottom: 10px;
}

/*
.menu2Col {
	width: 434px;
	float:left;
}
*/

.dotsLg_horiz {
  display: block;
  width: 100%;
  height: 10px;
  background-image: url(../img/dots_lg-H.svg);
  background-image: linear-gradient(transparent, transparent),
    url(../img/dots_lg-H.svg);
  background-repeat: repeat-x;
  background-size: 1000px 10px;
  background-position-y: 50%;
}

/* Hide mobile-only dividers on desktop */
.mobile-only {
  display: none;
}

.dotsLg_vert {
  width: 10px;
  height: 338px;
  background-image: url(../img/dots_lg-V.png);
  background-image: linear-gradient(transparent, transparent),
    url(../img/dots_lg-V.svg);
  background-repeat: repeat-y;
  background-size: 10px 1000px;
  margin: 0 20px;
}

.dotsSm_horiz {
  float: none;
  display: block;
  width: 100%;
  height: 10px;
  background-image: url(../img/dots_sm-H.png);
  background-image: linear-gradient(transparent, transparent),
    url(../img/dots_sm-H.svg);
  background-repeat: repeat-x;
  background-size: 1000px 10px;
}

.dotsSm_vert {
  width: 10px;
  height: 100%;
  background-image: url(../img/dots_sm-V.png);
  background-image: linear-gradient(transparent, transparent),
    url(../img/dots_sm-V.svg);
  background-repeat: repeat-y;
  background-size: 10px 1000px;
  margin: 0 20px;
}

.dotsSm_vert_divider {
  display: inline-block;
  width: 10px;
  height: 46px;
  background-image: url(../img/dots_sm-V.png);
  background-image: linear-gradient(transparent, transparent),
    url(../img/dots_sm-V.svg);
  background-repeat: repeat-y;
  background-size: 10px 1000px;
  padding-right: 5px;
}

.right {
  float: right;
}

.center {
  text-align: center;
}

.icons {
  /* 	margin:0 -8px 0 0; */
  margin: 0 -2px 0 0;
  display: inline-block;
}

.spacer5 {
  padding-right: 5px;
}

.pad10_V {
  padding-bottom: 10px;
}

.pad20_V {
  padding-bottom: 20px;
}

.pad20_H {
  padding: 0 20px;
}

div#accessibility a {
  color: #111;
}

div#accessibility a p {
  color: #111;
}

div#home-link a {
  text-decoration: none !important;
}

div#home-link a p {
  font-size: 0.9rem !important;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 35em) {
}

@media print,
  (-o-min-device-pixel-ratio: 5/4),
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 120dpi) {
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
  background-color: transparent;
  border: 0;
  overflow: hidden;
  *text-indent: -9999px;
}

.ir:before {
  content: "";
  display: block;
  width: 0;
  height: 150%;
}

.hidden {
  display: none !important;
  visibility: hidden;
}

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

.invisible {
  visibility: hidden;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
  * {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  img {
    max-width: 100% !important;
  }

  @page {
    margin: 0.5cm;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}

/* ==========================================================================
   Mobile-only elements
   ========================================================================== */

/* Hide fish school image on desktop, show only on mobile */
.fishSchool-mobile {
  display: none;
}

/* ==========================================================================
   Responsive Styles for Locations
   ========================================================================== */

/* Tablet and below - stack locations vertically */
@media screen and (max-width: 920px) {
  html,
  body {
    min-width: unset;
  }

  /* Make all fixed-width sections responsive */
  #titleBar,
  section#greeting,
  section#eaterNY-plug,
  section#aboutArea,
  section#menuArea,
  section#locations {
    width: 90% !important;
    max-width: 100% !important;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }

  section#greeting {
    margin-bottom: 60px;
  }

  section#greeting #greetingMessage {
    height: auto;
    min-height: 230px;
  }

  section#greeting #accessibilityMessage {
    height: auto;
    min-height: 280px;
  }

  /* Reset accessibility page spacing on tablet/mobile */
  section#greeting:has(#accessibilityMessage) {
    margin-bottom: 60px;
  }

  /* Center and stack titleBar logo elements */
  #titleBar #logo {
    text-align: center;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  div.fish_icon {
    float: none !important;
    width: 120px !important;
    margin: 0 auto 20px auto !important;
    display: block !important;
  }

  div.fish_icon img {
    width: 100% !important;
    height: auto !important;
    max-width: 120px !important;
  }

  div.header_logo {
    float: none !important;
    width: 100% !important;
    max-width: 400px !important;
    margin: 0 auto !important;
    display: block !important;
  }

  div.header_logo img {
    width: 100% !important;
    height: auto !important;
    max-width: 400px !important;
  }

  /* Center rockplaza_plug on tablet/mobile */
  #titleBar #rockplaza_plug {
    float: none !important;
    margin: 30px auto 0 auto !important;
    display: block !important;
    width: fit-content;
    max-width: 90%;
    padding: 17.6px 14.4px 22.4px 14.4px;
  }

  #titleBar #rockplaza_plug h4 {
    font-size: 1.2rem;
    line-height: 1.12rem;
  }

  #titleBar #rockplaza_plug h4 span {
    font-size: 1.04rem;
  }

  /* Show mobile-only dividers on tablet/mobile */
  .mobile-only {
    display: block !important;
  }

  /* Responsive map height for tablet */
  section#locationArea {
    height: 320px;
  }

  /* Make footer responsive */
  footer section {
    width: 90% !important;
    padding-left: 20px;
    padding-right: 20px;
  }

  footer section div#address_block {
    width: 100%;
    text-align: center;
  }

  footer section div#rockplaza_address,
  footer section div#brookfield_address {
    float: none;
    width: 90% !important;
    max-width: 500px;
    margin: 0 auto 30px auto;
    padding: 0;
    text-align: left;
    display: block;
  }

  footer section div#rockplaza_address {
    margin-top: 30px;
  }

  footer section div#lgFish {
    float: none;
    text-align: center;
    margin: 30px auto 0 auto;
  }

  footer section div#accessibility {
    float: none;
    text-align: center;
    margin: 30px auto 0 auto;
    clear: both;
  }

  /* Center image captions on mobile */
  section#menuArea div#buildAbowlSlideshow .rsABlock,
  section#menuArea div#sushiSlideshow .rsABlock {
    width: 100%;
    left: 0;
    right: 0;
  }

  /* Stack Sushi and Poke Bowls columns on mobile */
  section#STGmenu div.row {
    width: 100% !important;
    float: none;
    margin-bottom: 40px;
  }

  section#STGmenu .vertDivider {
    display: none;
  }

  /* Stack Sushi A La Carte columns on mobile */
  #SAC-left,
  #SAC-right {
    width: 100% !important;
    float: none;
  }

  #SAC-left {
    margin-bottom: 5px;
  }

  #SAC-right {
    margin-bottom: 30px;
  }

  /* Hide icons paragraph in SAC-right on mobile only */
  #SAC-right > p[style*="height:2.7rem"] {
    display: none;
  }

  #SAC-left + .vertDivider,
  #SAC-right + .vertDivider {
    display: none;
  }

  /* Stack sushiExtras columns on mobile */
  section#sushiExtras div.row {
    width: 100% !important;
    float: none;
    margin-bottom: 20px;
  }

  section#sushiExtras .vertDivider-noDots {
    display: none;
  }

  /* Stack Kitchen Appetizers, Sushi Bar Appetizers, and Donburi on mobile */
  section#SBmenu1 div.row {
    width: 100% !important;
    float: none;
    margin-bottom: 30px;
  }

  section#SBmenu1 .vertDivider-noDots {
    display: none;
  }

  /* Stack Platters, Hakozushi, and Specialty Rolls on mobile */
  section#SBmenu2 div.row {
    width: 100% !important;
    float: none;
    margin-bottom: 30px;
  }

  section#SBmenu2 .vertDivider-noDots {
    display: none;
  }

  /* Show fish school image on mobile */
  .fishSchool-mobile {
    display: block;
    margin-bottom: 30px;
  }

  /* eaterNY-plug responsive */
  section#eaterNY-plug .left-half,
  section#eaterNY-plug .right-half {
    width: 100%;
    float: none;
    text-align: center;
    margin-bottom: 30px;
  }

  section#eaterNY-plug .left-half img,
  section#eaterNY-plug .right-half img {
    max-width: 100%;
    height: auto;
  }

  section#locations {
    margin-top: 30px;
    padding: 0 20px;
  }

  section#locations .locations-container {
    flex-direction: column;
    gap: 40px;
  }

  section#locations div#brookfield_location,
  section#locations div#rockplaza_location {
    width: 100%;
    max-width: 100%;
    min-width: unset;
    padding-right: 0;
    box-sizing: border-box;
  }

  section#locations div.restaurant_logo img {
    max-width: 100%;
    height: auto;
  }

  section#locations .dotsSm_horiz,
  section#locations .dotsLg_horiz {
    max-width: 100%;
  }

  /* Hide vertical divider on mobile */
  section#locations .vertDivider {
    display: none;
  }

  /* Accessibility page - delivery section responsive (uses old IDs) */
  section#delivery {
    width: 90% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 20px !important;
    box-sizing: border-box;
  }

  section#delivery div#brookfield_delivery,
  section#delivery div#rockplaza_delivery {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 auto 30px auto !important;
    padding: 0 !important;
    display: block !important;
  }

  section#delivery .vertDivider {
    display: none !important;
  }

  section#delivery .restaurant_logo img {
    max-width: 100%;
    height: auto;
  }

  /* Hamburger menu button - visible on tablet/mobile */
  .hamburger {
    display: block !important;
  }

  /* Hide nav menu by default on tablet */
  nav#mainNav ul#nav-menu {
    display: none;
    width: 100% !important;
    max-width: 100%;
    flex-direction: column;
    align-items: center;
    background: #fff;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  }

  /* Show nav menu when open */
  nav#mainNav ul#nav-menu.open {
    display: flex;
  }

  nav#mainNav {
    position: relative;
  }

  nav ul li {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #eee;
    float: none;
  }

  nav ul li:last-child {
    border-bottom: none;
  }

  nav ul li a {
    width: 100% !important;
    display: block;
    padding: 15px 0;
    height: auto !important;
    line-height: 1.4 !important;
    float: none;
    border-left: none;
  }

  /* Fix section dividers - hide vertical bars on mobile, keep horizontal lines */
  .sectionDivider {
    height: 20px;
  }

  .sectionDivider ul {
    display: none;
  }

  /* Fix beverage images - make responsive */
  section#beverages {
    width: 90% !important;
    max-width: 100%;
  }

  #beveragesDessertSlideshow {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
  }

  #beveragesDessertSlideshow img {
    width: 30% !important;
    min-width: 150px;
    height: auto !important;
  }
}

/* Mobile - additional adjustments */
@media screen and (max-width: 480px) {
  /* Make all sections full width on mobile */
  #titleBar,
  section#greeting,
  section#eaterNY-plug,
  section#aboutArea,
  section#menuArea,
  section#locations {
    width: 100% !important;
    padding-left: 15px;
    padding-right: 15px;
  }

  section#greeting {
    margin-bottom: 40px;
  }

  section#greeting #greetingMessage {
    height: auto;
    min-height: 200px;
    margin-top: 60px;
  }

  section#greeting #accessibilityMessage {
    height: auto;
    min-height: 250px;
    margin-top: 60px;
  }

  /* Reset accessibility page spacing on mobile */
  section#greeting:has(#accessibilityMessage) {
    margin-bottom: 40px;
  }

  /* Improve readability of poke-bowl item text on mobile */
  #poke-bowls .itemDescr {
    line-height: 1.2 !important;
  }

  /* Responsive map height for mobile */
  section#locationArea {
    height: 280px;
  }

  /* Tighter spacing for footer on mobile */
  footer section {
    width: 100% !important;
    padding-left: 15px;
    padding-right: 15px;
  }

  footer section div#rockplaza_address,
  footer section div#brookfield_address {
    width: 95% !important;
    margin-bottom: 20px;
  }

  /* Smaller sizes for mobile phones */
  div.fish_icon {
    width: 80px !important;
    margin: 0 auto 15px auto !important;
  }

  div.fish_icon img {
    max-width: 80px !important;
  }

  div.header_logo {
    max-width: 280px !important;
  }

  div.header_logo img {
    max-width: 280px !important;
  }

  /* Center image captions on mobile */
  section#menuArea div#buildAbowlSlideshow .rsABlock,
  section#menuArea div#sushiSlideshow .rsABlock {
    width: 100%;
    left: 0;
    right: 0;
  }

  /* Stack Sushi and Poke Bowls columns on mobile */
  section#STGmenu div.row {
    width: 100% !important;
    float: none;
    margin-bottom: 30px;
  }

  section#STGmenu .vertDivider {
    display: none;
  }

  /* Stack Sushi A La Carte columns on mobile */
  #SAC-left,
  #SAC-right {
    width: 100% !important;
    float: none;
  }

  #SAC-left {
    margin-bottom: 5px;
  }

  #SAC-right {
    margin-bottom: 20px;
  }

  /* Hide icons paragraph in SAC-right on mobile only */
  #SAC-right > p[style*="height:2.7rem"] {
    display: none;
  }

  #SAC-left + .vertDivider,
  #SAC-right + .vertDivider {
    display: none;
  }

  /* Stack sushiExtras columns on mobile */
  section#sushiExtras div.row {
    width: 100% !important;
    float: none;
    margin-bottom: 15px;
  }

  section#sushiExtras .vertDivider-noDots {
    display: none;
  }

  /* Stack Kitchen Appetizers, Sushi Bar Appetizers, and Donburi on mobile */
  section#SBmenu1 div.row {
    width: 100% !important;
    float: none;
    margin-bottom: 20px;
  }

  section#SBmenu1 .vertDivider-noDots {
    display: none;
  }

  /* Stack Platters, Hakozushi, and Specialty Rolls on mobile */
  section#SBmenu2 div.row {
    width: 100% !important;
    float: none;
    margin-bottom: 20px;
  }

  section#SBmenu2 .vertDivider-noDots {
    display: none;
  }

  /* Show fish school image on mobile */
  .fishSchool-mobile {
    display: block;
    margin-bottom: 30px;
  }

  /* eaterNY-plug responsive for mobile */
  section#eaterNY-plug .left-half,
  section#eaterNY-plug .right-half {
    width: 100%;
    float: none;
    text-align: center;
    margin-bottom: 20px;
  }

  section#eaterNY-plug .left-half h2 br,
  section#eaterNY-plug .left-half h3 br {
    display: none;
  }

  section#eaterNY-plug .left-half h2 {
    font-size: 1.5rem;
    line-height: 1.6rem;
  }

  section#eaterNY-plug .left-half h3 {
    font-size: 1.3rem;
    line-height: 1.5rem;
  }

  section#locations {
    margin-top: 20px;
    padding: 0 15px;
  }

  section#locations .locations-container {
    gap: 30px;
    padding: 0 10px;
  }

  section#locations div#brookfield_location,
  section#locations div#rockplaza_location {
    padding: 0 10px;
  }

  /* Accessibility page - delivery section responsive (uses old IDs) */
  section#delivery {
    width: 100% !important;
    margin: 0 auto !important;
    padding: 15px !important;
  }

  section#delivery div#brookfield_delivery,
  section#delivery div#rockplaza_delivery {
    width: 100% !important;
    padding: 0 10px !important;
    margin: 0 auto 20px auto !important;
  }

  /* Hamburger menu button - visible on mobile */
  .hamburger {
    display: block !important;
  }

  /* Hide nav menu by default on mobile */
  nav#mainNav ul#nav-menu {
    display: none;
    width: 100% !important;
    flex-direction: column;
    align-items: center;
    background: #fff;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  }

  /* Show nav menu when open */
  nav#mainNav ul#nav-menu.open {
    display: flex;
  }

  nav#mainNav {
    position: relative;
  }

  nav ul li {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #eee;
  }

  nav ul li:last-child {
    border-bottom: none;
  }

  nav ul li a {
    width: 100% !important;
    display: block;
    padding: 15px 0;
    height: auto !important;
    line-height: 1.4 !important;
  }

  /* Fix section dividers - already hidden from 920px breakpoint */

  /* Fix beverage images - stack vertically on mobile */
  section#beverages {
    width: 100% !important;
  }

  #beveragesDessertSlideshow {
    flex-direction: column;
    align-items: center;
  }

  #beveragesDessertSlideshow img {
    width: 80% !important;
    max-width: 300px;
    margin-bottom: 15px;
  }
}