/**
 * @license
 * MyFonts Webfont Build ID 2976964, 2015-02-21T18:30:56-0500
 *
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are
 * explicitly restricted from using the Licensed Webfonts(s).
 *
 * You may obtain a valid license at the URLs below.
 *
 * Webfont: MTTMilano-UltraBold by MTT
 * URL: http://www.myfonts.com/fonts/mtt/milano/ultra-bold/
 * Copyright: Copyright © 2013 by Mattia Bonanomi. All rights reserved.
 * Licensed pageviews: 10,000
 *
 *
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=2976964
 *
 * © 2015 MyFonts Inc
*/

/* @import must be at top of file, otherwise CSS will not work */
@import url("//hello.myfonts.net/count/2d6cc4");

@font-face {
  font-family: "MTTMilano-UltraBold";
  src: url("webfonts/2D6CC4_0_0.eot");
  src: url("webfonts/2D6CC4_0_0.eot?#iefix") format("embedded-opentype"),
    url("webfonts/2D6CC4_0_0.woff2") format("woff2"),
    url("webfonts/2D6CC4_0_0.woff") format("woff"),
    url("webfonts/2D6CC4_0_0.ttf") format("truetype");
}

/*
@font-face {
  font-family: "MTTMilano-UltraBold";
  src: url("webfonts/2D6CC4_0_0.eot");
  src: url("webfonts/2D6CC4_0_0.eot?#iefix") format("embedded-opentype"),
    url("webfonts/2D6CC4_0_0.woff2") format("woff2"),
    url("webfonts/2D6CC4_0_0.woff") format("woff"),
    url("webfonts/2D6CC4_0_0.ttf") format("truetype");
  src: url("webfonts/brandon_bld-webfont.svg") format("svg");
}
*/

@font-face {
  font-family: "Tiempos";
  src: url("../fonts/TiemposHeadlineWeb-RegularItalic.eot");
  src: url("../fonts/TiemposHeadlineWeb-RegularItalic.woff") format("woff");
  font-style: normal;
  font-weight: normal;
}

@font-face {
  font-family: "BrandonGrotesqueMedium";
  src: url("../fonts/brandon_med-webfont.eot");
  src: url("../fonts/brandon_med-webfont.eot?#iefix") format("embedded-opentype"),
    url("../fonts/brandon_med-webfont.woff") format("woff"),
    url("../fonts/brandon_med-webfont.ttf") format("truetype"),
    url("../fonts/brandon_med-webfont.svg#BrandonGrotesqueMedium") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "BrandonGrotesqueBold";
  src: url("../fonts/brandon_bld-webfont.eot");
  src: url("../fonts/brandon_bld-webfont.eot?#iefix") format("embedded-opentype"),
    url("../fonts/brandon_bld-webfont.woff") format("woff"),
    url("../fonts/brandon_bld-webfont.ttf") format("truetype"),
    url("../fonts/brandon_bld-webfont.svg#BrandonGrotesqueBold") format("svg");
  font-weight: normal;
  font-style: normal;
}

@charset "UTF-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/
*/

img,
object,
embed,
video {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

a {
  cursor: pointer;
}

/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
  width: 100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		8;
	dw-num-cols-tablet:		11;
	dw-num-cols-desktop:	14;
	dw-gutter-percentage:	25;

	Inspiration from "Responsive Web Design" by Ethan Marcotte
	http://www.alistapart.com/articles/responsive-web-design

	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

.fluid {
  clear: both;
  margin-left: 0;
  width: 100%;
  float: left;
  display: block;
}

.fluidList {
  list-style: none;
  list-style-image: none;
  margin: 0;
  padding: 0;
}

/* Mobile Layout: 480px and below. */

.gridContainer {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding-left: 1.1375%;
  padding-right: 1.1375%;
  clear: none;
  float: none;
  z-index: 200;
}

body {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  box-sizing: border-box;
}

.content_wrap::before {
  content: "";
  width: 0.5em;
  height: calc(100vh);
  background-color: #fff;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 0;
}


.content_wrap::after{
  content: "";
  width: 0.5em;
  height: calc(100vh);
  background-color: #fff;
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 0;
}

#headWrapper {
  display: flex;
  flex-direction: column-reverse;
  /*position: fixed;*/
  position: relative;
  top: 0;
  left: 0;
  width: 100vw;
  z-index: 1000;
  background-color: #fff;
}

#headWrapper>* {
  width: 100%;
}

#topLogo {
  width: 100%;
}

#topLogo img {
  width: calc(100vw - 1em);
}

#group1 {
  width: 74.3589%;
  margin-left: 12.8205%;
  margin-top: 12%;
}

#group2 {
  width: 74.3589%;
  margin-left: 12.8205%;
  clear: both;
}

#group3 {
  width: 74.3589%;
  margin-left: 12.8205%;
  clear: both;
  padding-bottom: 10%;
}

#verDivider1 {
  position: relative;
  width: 5.7971%;
  clear: none;
  margin-left: 1.4492%;
  display: none;
  background-image: url(../images/dotted-line@2x.png);
  background-size: 2px auto;
  background-repeat: no-repeat;
  background-position: center top;
  height: calc(100%);
}

#verDivider2 {
  position: relative;
  width: 5.7971%;
  clear: none;
  margin-left: 1.4492%;
  display: none;
  background-image: url(../images/dotted-line@2x.png);
  background-size: 2px auto;
  background-repeat: no-repeat;
  background-position: center top;
  height: calc(100%);
}

div.section {
  width: 100%;
  margin: 5% 0;
  box-sizing: border-box;
  overflow: hidden;
}

/*
div.section:hover {
	background-color: rgba(255, 255, 255, .98);
}
*/
.section.news,
.section.news:hover {
  background-position: 0.4em 0.65em;
  background-repeat: no-repeat;
  background-size: 90%;
  min-height: 3em;
}

.section.news h3 {
  width: 38%;
  float: right;
  clear: both;
  margin: 0.5em 0.5em 0 0;
  padding: 0;
}

.section.news p {
  color: #404040;
  width: 38%;
  float: right;
  clear: both;
  margin: 0 0.5em 0 0;
  padding: 0;
  text-transform: none;
}

.section.news p a:link {
  color: #404040;
  text-decoration: underline;
}

.section.news p a:hover {
  color: #404040;
  text-decoration: underline;
}

.section.news em,
.section.events em,
.section.jobs em {
  text-transform: none;
}

.section.events,
.section.events:hover {
  background-position: 0.5em 0.65em;
  background-repeat: no-repeat;
  background-size: 90%;
  min-height: 3em;
}

.section.events h3 {
  width: 25%;
  float: right;
  clear: both;
  margin: 1.25em 0.5em 0 0;
  padding: 0;
  line-height: 2em;
  clear: none;
}

.section.jobs .jobsLink {
  width: 50%;
  height: 3em;
  float: left;
}

.section.jobs,
.section.jobs:hover {
  background-image: url(../images/jobs@2x.png);
  background-position: 0.75em 0.65em;
  background-repeat: no-repeat;
  background-size: 90%;
  min-height: 3em;
}

.section.jobs h3 {
  width: 46%;
  float: right;
  clear: both;
  margin: 1.25em 0.5em 0 0;
  padding: 0;
  line-height: 2em;
  clear: none;
}

.section.jobs p {
  width: 50%;
  float: right;
  clear: both;
  margin: 0 0.5em 0.65em 0;
  padding: 0;
  text-transform: none;
}

.section p.address {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 10px;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0.5em 0 0 0;
  padding: 0.25em 9px 10px 9px;
  background: none;
  color: #272424;
  text-rendering: optimizeLegibility;
}

.section p.address {
  margin-top: 15px;
}

p.address a:link,
p.address a:visited {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 10px;
  text-decoration: underline;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0;
  margin: 0;
  padding: 0;
  background: none;
  color: #404040;
  text-rendering: optimizeLegibility;
}

.section h1 a:hover {
  color: #1eb1dd;
  cursor: pointer;
  margin: 0;
  padding: 0;
  text-rendering: optimizeLegibility;
}

.section h2 {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 80%;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0.5em 0 0 0;
  padding: 0.5em 9px 0.05em 9px;
  background: none;
  color: #272424;
  text-rendering: optimizeLegibility;
}

.section h2 em {
  text-transform: none;
}

.section h2 a:link,
.section h2 a:visited {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  color: #404040;
  text-decoration: none;
  text-rendering: optimizeLegibility;
}

.section h2 a:hover {
  color: #1eb1dd;
  cursor: pointer;
  text-decoration: none;
}

.section h3 {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 70%;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0.5em 0 0 0;
  padding: 0.75em 9px 0.05em 9px;
  background: none;
  color: #272424;
  text-rendering: optimizeLegibility;
}

.section h3 a:link,
.section h3 a:visited {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  color: #404040;
  text-decoration: none;
  text-rendering: optimizeLegibility;
}

.section h3 a:hover {
  color: #1eb1dd;
  text-decoration: none;
  cursor: pointer;
}

.section p {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 70%;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
  padding: 0.25em 9px 1.5em 9px;
  background: none;
  color: #404040;
  text-rendering: optimizeLegibility;
}

.section em {
  font-family: "Tiempos", serif;
  font-size: 101%;
  letter-spacing: 0.065em;
  font-weight: 300;
  text-transform: capitalize;
  margin: 0;
  background: none;
  color: #404040;
  text-rendering: optimizeLegibility;
}

h3 em {
  font-family: "Tiempos", serif;
  font-size: 101%;
  letter-spacing: 0.065em;
  font-weight: 300;
  text-transform: capitalize;
  margin: 0;
  background: none;
  color: #404040;
  text-rendering: optimizeLegibility;
}

.section em:hover {
  color: #404040;
  text-decoration: none;
}

.section a em:link {
  font-family: "Tiempos", serif;
  font-size: 90%;
  letter-spacing: 0;
  font-weight: 300;
  text-transform: capitalize;
  margin: 0;
  background: none;
  color: #404040;
  text-rendering: optimizeLegibility;
}

.section a em:hover {
  color: #1eb1dd;
  text-decoration: none;
  cursor: pointer;
}

.section sup {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 65%;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
  padding: 0;
  color: #404040;
  vertical-align: text-top;
  text-rendering: optimizeLegibility;
}

.zeroMargin_mobile {
  margin-left: 0;
}

.hide_mobile {
  display: none;
}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {
  .gridContainer {
    width: 91.309%;
    padding-left: 5vw;
    padding-right: 5vw;
    clear: none;
    float: none;
    margin-left: auto;
  }

  #group1 {
    width: 44.4444%;
    margin-left: 0;
    margin-top: 12%;
  }

  #group2 {
    width: 44.4444%;
    clear: none;
    margin-left: 11.1111%;
    margin-top: 12%;
  }

  #group3 {
    width: 44.4444%;
    clear: both;
    margin-left: 0;
  }

  #verDivider1 {
    width: 5.7971%;
    clear: none;
    margin-left: 1.4492%;
    display: none;
    background-image: url(../images/dotted-line@2x.png);
    background-size: 2px auto;
    background-repeat: no-repeat;
    background-position: center top;
    height: calc(100%);
  }

  #verDivider2 {
    width: 5.7971%;
    clear: none;
    margin-left: 1.4492%;
    display: none;
    background-image: url(../images/dotted-line@2x.png);
    background-size: 2px auto;
    background-repeat: no-repeat;
    background-position: center top;
    height: calc(100%);
  }

  .gridContainer {
    background-image: url(../images/dotted-line@2x.png);
    background-size: 2px auto;
    background-repeat: no-repeat;
    background-position: center top;
  }

  .hide_tablet {
    display: none;
  }

  .zeroMargin_tablet {
    margin-left: 0;
  }
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {
  .gridContainer {
    width: 88.7142%;
    max-width: 1232px;
    margin: auto;
    clear: none;
    float: none;
    margin-left: auto;
    background: none;
  }

  #group1 {
    width: 27.5362%;
    margin-left: 0;
    margin-top: 20%;
  }

  #group2 {
    width: 27.5362%;
    clear: none;
    margin-left: .5%;
    margin-top: 20%;
  }

  #group3 {
    width: 27.5362%;
    clear: none;
    margin-left: 1.4492%;
    margin-top: 20%;
  }

  #verDivider1 {
    width: 5.7971%;
    clear: none;
    margin-left: 1.4492%;
    display: block;
    background-image: url(../images/dotted-line@2x.png);
    background-size: 2px auto;
    background-repeat: no-repeat;
    background-position: center top;
    height: calc(100%);
  }

  #verDivider2 {
    width: 5.7971%;
    clear: none;
    margin-left: 1.4492%;
    display: block;
    background-image: url(../images/dotted-line@2x.png);
    background-size: 2px auto;
    background-repeat: no-repeat;
    background-position: center top;
    height: calc(100%);
  }

  .zeroMargin_desktop {
    margin-left: 0;
  }

  .hide_desktop {
    display: none;
  }
}

/*  PT CHANGEA  */

p.cafeHours {
  padding: 0.25em 0 0 1em;
}

#menuLink a {
  color: #404040;
}

#menuLink a:hover {
  color: #1eb1dd;
}

sup.addSup {
  font-size: 65%;
}

.ext {
  font-size: 75%;
}

.museum p {
  padding: 0.25em 9px 0 9px;
}

@media only screen and (min-width: 1024px) {

  .section h1,
  p.address {
    font-size: 11px;
    padding: 0 0 0 11px;
  }
}

@media only screen and (min-width: 1085px) {

  .section h1,
  p.address {
    font-size: 12px;
    padding: 0 0 0 11px;
  }
}

@media only screen and (min-width: 1185px) {

  .section h1,
  p.address {
    font-size: 13px;
    padding: 0 0 0 11px;
  }
}

#news_modal {
  display: block;
  padding: 0;
  margin: 0;
  background-color: transparent;
  border: none;
  box-shadow: none;
  text-shadow: none;
  font-family: 'MTTMilano-UltraBold', BrandonGrotesqueBold, sans-serif;
  font-size: 12px;
  letter-spacing: .095em;
  text-transform: uppercase;
  color: #272424;
  opacity: .6;
  text-align: left;
}

button#news_modal:hover {
  opacity: 1;
}

.hidden {
  display: none;
}

#mc_embed_signup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(255, 255, 255, 0.75);
  display: flex;
  align-items: center;
  box-sizing: border-box;
  font-family: "MTTMilano-UltraBold", "BrandonGrotesqueBold", sans-serif;
  color: #404040;
  z-index: 5000;
}

#mc_embed_signup form {
  position: relative;
  width: 90vw;
  margin: 0 auto;
  padding: 10px;
  background-color: #fff;
  box-sizing: border-box;
}

input#mce-EMAIL,
input#mc-embedded-subscribe,
#close_button {
  padding: 15px;
  font-family: "MTTMilano-UltraBold", "BrandonGrotesqueBold", sans-serif;
  color: #404040;
  text-transform: uppercase;
  background-color: transparent;
  border-radius: 0;
  box-shadow: none;
  box-sizing: border-box;
  border: none;
}

input#mce-EMAIL {
  width: 100%;
  max-width: 430px;
  margin: 0 auto 10px auto;
  border: 1px solid #404040;
}

input#mc-embedded-subscribe {
  background-color: #999;
  color: #fff;
}

input#mc-embedded-subscribe:hover,
input#mc-embedded-subscribe:focus {
  background-color: #404040;
}

#close_button {
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: 14px;
  color: #39bbea;
}

#close_button:hover,
#close_button:focus {
  opacity: 0.75;
  outline: none;
}

@media only screen and (min-width: 500px) {
  #mc_embed_signup form {
    max-width: 490px;
    padding: 10vw;
    background-color: #fff;
    box-sizing: border-box;
  }

  #close_button {
    top: 0;
    bottom: 100%;
  }
}

@media only screen and (min-width: 900px) {
  #mc_embed_signup form {
    padding: 100px;
  }
}

/* Added by PT aug 25 */
header h1 {
  position: fixed;
  left: -99999px;
  height: 0 !important;
}

.rotator_img {
  /*
    position: fixed;
  */
  z-index: 0;
  width: 100vw;
  height: 100vh;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.rotator_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}


/*
#img_zero {
  background-image: url("../images/table-spread.jpg");
  background-position: top center;
}

#img_two {
  background-image: url("../images/table-spread.jpg");
  background-position: top center;
}

#img_three {
  background-image: url("../images/bg-highholidays.jpg");
  background-position: top center;
}

#img_four {
  background-image: url("../images/bg-05.jpg");
  background-position: top center;
}

#img_five {
  background-image: url("../images/bg-00.jpg");
  background-position: top center;
}

#img_six {
  background-image: url("../images/bg-02.jpg");
  background-position: top center;
}
*/



@media only screen and (min-width: 900px) {
  #topLogo {
    top: -4vw;
  }
}

@media only screen and (min-width: 1400px) {
  #topLogo {
    top: -4.5vw;
  }
}

/*

Styles Adjusted by PT

*/




/* Added by PT redesign Oct 16,2018 */


.section p {
  padding: .25em 9px 0 9px;
}

div.section .formrow>figure {
  padding: 10px 20px 17px 20px;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.95);
}

.title_image_pt {
  display: block;
  /*
  padding: 2% 2% 15px 2%;
  border-bottom: 1.5px dotted #c7c6c5;
  */
  width: 100%;
  margin: 0 !important;
  box-sizing: border-box;

}

.loc_info_wrapper {
  position: relative;
}

#order_wrapper .loc_info_wrapper a,
#about_wrapper .loc_info_wrapper a,
.section_nav>p {
  display: block;
  width: 95%;
  font-family: "MTTMilano-UltraBold", "BrandonGrotesqueBold", sans-serif;
  font-size: 12px;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: .095em;
  background: none;
  color: #272424;
  text-rendering: optimizeLegibility;
  text-decoration: none;
  box-sizing: border-box;
  opacity: .60;

}

.section_nav,
.section_nav>p {
  width: 100%;
}

.spacer_dot {
  display: inline;
  font-family: "MTTMilano-UltraBold", "BrandonGrotesqueBold", sans-serif;
  font-size: 12px;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: .095em;
  background: none;
  color: #272424;
  text-rendering: optimizeLegibility;
  text-decoration: none;
  box-sizing: border-box;
  opacity: .60;
}

#order_wrapper .loc_info_wrapper a {
  display: inline;
}

#loc_nav #loc_nav_ul .loc_info_wrapper:last-of-type,
#order_wrapper .loc_info_wrapper ul li:last-of-type a,
#about_wrapper .loc_info_wrapper ul li:last-of-type a {
  border-bottom: none;
}

div.section .loc_info_wrapper a.section_nav:hover,
#order_wrapper .loc_info_wrapper a:hover,
#about_wrapper .loc_info_wrapper a:hover,
a.section_nav:hover>p {
  opacity: 1;
}

div.section .loc_info_wrapper a.section_nav span,
.section_nav>p span {
  font-family: "Tiempos", serif;
  font-size: 101%;
  letter-spacing: 0.065em;
  font-weight: 300;
  text-transform: none;
  margin: 0;
  background: none;
  color: #404040;
  text-rendering: optimizeLegibility;
}

div>.itallic_pt,
a>span.itallic_pt {
  font-family: "Tiempos", serif;
  letter-spacing: 0.035em;
  font-weight: 300;
  text-transform: none;
  margin: 0;
  background: none;
  color: #404040;
  text-rendering: optimizeLegibility;
  font-size: 11px;
  opacity: .6;
}

a>span.itallic_pt {
  opacity: 1;
}

.info_pt {
  display: none;
  flex-wrap: wrap;
  align-items: flex-start;
  position: absolute;
  top: 0;
  left: 85px;
  width: 280px;
  background-color: #fff;
  opacity: 0;
  z-index: -1000;
}

#jm_info_pt {
  left: 175px;
  top: auto;
  bottom: 0;
}

#bny_info_pt {
  left: 220px;
  top: auto;
  bottom: 0;
}

svg.arrow {
  position: absolute;
  width: 22px;
  height: 22px;
  margin: 0 0 0 -18px;
  padding: 10px 0;
}

#jm_info_pt svg.arrow,
#bny_info_pt svg.arrow {
  position: absolute;
  left: 0;
  bottom: 0;
}

.loc_address_wrapper,
.info_pt img {
  width: 50%;
  display: block;
  box-sizing: border-box;

}

.loc_address_wrapper em {
  /*color:  #abaaaa;*/
  opacity: .75;
}

.info_pt .iframe_wrapper {
  margin: 0 auto;
  padding: 0 10px 10px 10px;
  box-sizing: border-box;
}

.info_pt img {
  padding: 10px;
}

.loc_info_wrapper h1 span {
  display: block;
}

a {
  text-decoration: none;
}

p.blue {
  color: #39bbea !important;
}

div#group1 {
  margin-top: 20%;
}

div#group2,
div#group3 {
  margin-top: 5%;
}

#group3 {
  padding-bottom: 0;
}

div#loc_nav,
div#group2 nav,
div#group3 nav,
div#group1 nav {
  height: calc(100% - 89.95px);
}

div#loc_nav_ul,
div#group2 nav ul,
div#group3 nav ul,
div#group1 nav ul {
  height: calc(100%);
}

div#loc_nav_ul>div,
div#group2 nav ul>li,
div#group3 nav ul>li,
div#group1 nav ul>li,
.dropdown {
  height: calc(100% / 6);
  padding: 0;
  display: flex;
  align-items: center;
}

div#group2 nav ul>li>div,
div#group3 nav ul>li>div,
div#group1 nav ul>li>div,
.dropdown {
  width: 100%;
}

#loc_nav_ul div,
#order_wrapper nav ul li,
#about_wrapper nav ul li,
.dropdown {
  border-bottom: 1px dotted #c7c6c5;
}

div.section .loc_info_wrapper a.section_nav span,
#order_wrapper nav ul li a,
#about_wrapper nav ul li a,
.section_nav>p,
.dropdown {
  padding: 0;
}

#order_wrapper nav ul li:last-of-type,
#about_wrapper nav ul li:last-of-type {
  border: none;
}

#order_wrapper nav ul li:nth-of-type(3) a,
#order_wrapper nav ul li:last-of-type a {
  display: inline;
  padding: 0;
}

@media only screen and (min-width: 480px) {
  /* 
	div.section{
		 height: 275px;
	}
  */
  div#group1,
  div#group2,
  div#group3 {
    margin-top: 20%;
  }

  div#loc_nav_ul>div,
  div#group2 nav ul>li,
  div#group3 nav ul>li,
  div#group1 nav ul>li {
    padding: 0;
  }

  #group2 div.section img {
    width: auto;
    max-height: 85.5px;
    margin-left: 0;
    padding-left: 0;
  }

  #group2 div.section #loc_nav_ul img {
    width: 50%;
    height: auto !important;
    max-height: 2000px !important;
  }
}

/*
@media only screen and (min-width: 545px){
	div.section{
		 height: 285px;
	}
}

@media only screen and (min-width: 545px){
	div.section{
		 height: 275px;
	}
}

@media only screen and (min-width: 545px){
	div.section{
		 height: 260px;
	}
}
*/

@media only screen and (min-width: 770px) {

  div#group1,
  div#group2,
  div#group3 {
    position: relative;
    height: calc(100%);
    margin-top: 0;
    box-sizing: border-box;
  }

  div#loc_nav,
  div#group2 nav,
  div#group3 nav,
  div#group1 nav {
    height: calc(100%);
  }

  div.section {
    position: absolute;
    bottom: 0;
  }

  .info_pt {
    display: flex;
  }

  .loc_info_wrapper a:hover div.info_pt,
  .loc_info_wrapper a:focus div.info_pt {
    opacity: 1;
    z-index: 1000;
    transition: opacity .5s;
  }
}

/* Oprah Announcement */
header#topLogo * {
  box-sizing: border-box;
}

header#topLogo {
  top: 0;
}

div#mainNav li {
  font-size: 10em;
}

header#topLogo p,
div#mainNav p,
div#mainNav p a {
  width: 100%;
  padding: 10px;
  margin: 0;
  color: #fff;
  font-size: 1px;
  letter-spacing: .1em;
  text-align: center;
  font-family: "MTTMilano-UltraBold", "BrandonGrotesqueBold", sans-serif;
  text-transform: uppercase;
  background-color: #000;
}

header#topLogo p a,
div#mainNav p a {
  color: red;


}

header#topLogo img {
  padding: .25em 0;
}

@media only screen and (min-width: 480px) {
  .gridContainer {
    padding-top: 5vw;
  }
}

@media only screen and (min-width: 572px) {

  header#topLogo p,
  div#mainNav p {
    font-size: 1rem;
    letter-spacing: .15rem;
  }
}

@media only screen and (min-width: 770px) {

  header#topLogo p,
  div#mainNav p {
    padding: 10px;
  }

  header#topLogo img {
    padding: .5vw 0;
  }

  .gridContainer {
    padding-top: 0;
  }
}

/* IFRAME FIXES */
.loc_address_wrapper iframe {
  width: 100%;
  max-height: 0;
  padding: 0 9px;
  border-bottom: none !important;
}

.loc_address_wrapper {
  border: none !important;
}

/* Hiddien Info */
.boxTitle {
  position: absolute;
  left: -99999px;
}

a:focus {
  outline: 2px solid #1eb1dd;
  box-shadow: 2px 2px 10px #1eb1dd;
}

/* Jewish Meseum Style Updates */

#jm_info_pt {
  border: none !important;
  width: 470px;
}

#jm_info_pt img {
  max-width: 140px;
  height: auto;
  margin: 0;
}

#jm_info_pt .loc_address_wrapper {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  width: calc(100% - 140px);
}

#jm_info_pt p.address {
  width: 100%;
}

.museumHours {
  width: 50%;
  border: none !important;
}

.museumHours h3 {
  padding: 0.25em 9px 0.75em 9px;
}

/* Adding news letter button */
#about_wrapper .loc_info_wrapper a.w_spc_dt {
  width: auto;
}

@media only screen and (min-width: 350px) {
  .spacer_dot {
    padding: 0 2.5px;
  }

  .itallic_pt {
    padding: 0 5px 0 0 !important;
  }
}

#access_button {
  display: inline-block;
  padding: 0;
  margin: 0 0 0 auto;
  text-align: center;
  font-size: 10px;
  font-family: "BrandonGrotesqueMedium", sans-serif;
  color: #222;
  opacity: .50;
  border-bottom: 1px dotted #c7c6c5;
}

a#access_button:hover {
  cursor: pointer;
  opacity: 1;
}

@media only screen and (min-width: 1024px) {
  #access_button {
    position: absolute;
    right: 20px;
  }
}

/* PT - Updates 07252020

.disp_blk_pt{
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

 */

.disp_blk_pt div>.itallic_pt {
  display: block;
}

@media only screen and (min-width: 450px) {
  .disp_blk_pt div>.itallic_pt {
    display: inline;
  }
}

@media only screen and (min-width: 480px) {
  .disp_blk_pt div>.itallic_pt {
    display: block;
  }

  .disp_blk_pt {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media only screen and (min-width: 700px) {
  .disp_blk_pt div>.itallic_pt {
    display: inline;
  }
}

@media only screen and (min-width: 768px) {
  .disp_blk_pt div>.itallic_pt {
    display: block;
  }
}

@media only screen and (min-width: 1300px) {
  .disp_blk_pt div>.itallic_pt {
    display: inline;
  }
}



/* Pulled Coed



	div#loc_nav, div#group2 nav, div#group3 nav, div#group1 nav{
		 height: calc(100% - 55px);
	}

*/

/* ------------------------------------------ */
/* ----- combobox / dropdown list styling     */
/* ------------------------------------------ */
.combobox {
  /* Border slightly darker than Chrome's <select>, slightly lighter than FireFox's */
  border: 1px solid #999;
  padding-right: 1.25em;
  /* leave room for ▾ */
}

.dropdown,
.combobox {
  /* "relative" and "inline-block" (or just "block") are needed
     here so that "absolute" works correctly in children */
  position: relative;
  display: inline-block;
}

.combobox>.downarrow,
.dropdown>.downarrow {
  /* ▾ Outside normal flow, relative to container */
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 1.25em;

  cursor: default;
  nav-index: -1;
  /* nonfunctional in most browsers */

  border-width: 0px;
  /* disable by default */
  border-style: inherit;
  /* copy parent border */
  border-color: inherit;
  /* copy parent border */
}

/* Add a divider before the ▾ down arrow in non-dropdown comboboxes */
.combobox:not(.dropdown)>.downarrow {
  border-left-width: 1px;
}

/* Auto-down-arrow if one is not provided */
.downarrow:empty::before {
  content: '▾';
}

.downarrow::before,
.downarrow>*:only-child {
  text-align: center;

  /* vertical centering trick */
  position: relative;
  top: 50%;
  display: block;
  /* transform requires block/inline-block */
  transform: translateY(-50%);
}

.combobox>input {
  border: 0
}

.dropdown>*:last-child,
.combobox>*:last-child {
  /* Using `display:block` here has two desirable effects:
     (1) Accessibility: it lets input widgets in the dropdown to
         be selected with the tab key when the dropdown is closed. 
     (2) It lets the opacity transition work.
     But it also makes the contents visible, which is undesirable 
     before the list drops down. To compensate, use `opacity: 0`
     and disable mouse pointer events. Another side effect is that
     the user can select and copy the contents of the hidden list,
     but don't worry, the selected content is invisible.
  display: block;
  opacity: 0;
  pointer-events: none;
  transition: 0.4s;
  position: absolute;
  left: 0;
  top: 100%;
  background-color: #fff;
  z-index: 9999;
  min-width: 100%;
  box-sizing: border-box;
   */
}

/* List of situations in which to show the dropdown list.
   - Focus dropdown or non-last child of it => show last-child
   - Focus .downarrow of combobox => show last-child
   - Stay open for focus in last child, unless .less-sticky
   - .sticky last child stays open on hover
   - .less-sticky stays open on hover, ignores focus in last-child
.dropdown:focus > *:last-child,
.dropdown > *:focus ~ *:last-child,
.combobox > .downarrow:focus ~ *:last-child,
.combobox > .sticky:last-child:hover,
.dropdown > .sticky:last-child:hover,
.combobox > .less-sticky:last-child:hover,
.dropdown > .less-sticky:last-child:hover,
.combobox > *:last-child:focus:not(.less-sticky),
.dropdown > *:last-child:focus:not(.less-sticky) {
  display: block;
  opacity: 1;
  transition: 0.15s;
  pointer-events: auto;
}
 */

/* focus-within not supported by Edge/IE. Unsupported selectors cause 
   the entire block to be ignored, so we must repeat all styles for 
   focus-within separately.
.combobox > *:last-child:focus-within:not(.less-sticky),
.dropdown > *:last-child:focus-within:not(.less-sticky) {
  display: block;
  opacity: 1;
  transition: 0.15s;
  pointer-events: auto;
}
 */
/* detect Edge/IE and behave if though less-sticky is on for all
   dropdowns (otherwise links won't be clickable)
@supports (-ms-ime-align:auto) {
  .dropdown > *:last-child:hover {
    display: block;
    opacity: 1;
    pointer-events: auto;
  }
}
 */
/* detect IE and do the same thing.
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .dropdown > *:last-child:hover {
    display: block;
    opacity: 1;
    pointer-events: auto;
  }
}
.dropdown:not(.sticky) > *:not(:last-child):focus,
.downarrow:focus, .dropdown:focus {
  pointer-events: none; 
}
.downarrow:focus {
  outline: 2px solid #8BF;
  outline: 2px solid #48F8;
}
 */
/* ------------------------------------------ */
/* ----- Optional extra styling for combobox / dropdown */
/* ------------------------------------------ */
*,
*:before,
*:after {
  /* See https://css-tricks.com/international-box-sizing-awareness-day/ */
  box-sizing: border-box;
}

.combobox>*:first-child {
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
}

/* `.combobox:focus-within { outline:...}` doesn't work properly 
   in Firefox because the focus box is expanded to include the 
   (possibly hidden) drop list. As a workaround, put focus box on 
   the focused child. It is barely-visible so that it doesn't look
   TOO ugly if the child isn't the same size as the parent. It
   may be uglier if the first child is not styled as width:100%
.combobox > *:not(:last-child):focus {
  outline: 2px solid #48F8;
}
.combobox {
  margin: 5px; 
}
 */
/* ------------------------------------------ */
/* ----- Styling for examples                 */
/* ------------------------------------------ */

select {
  font: inherit;
}

input {
  font: inherit;
  padding: 3px;
}

/*
.formrow {
  display: flex;
  align-items: center;
}
*/
.formrow>span:first-child,
.formrow>label>span:first-child {
  display: inline-block;
  width: calc(4em + 8%);
}

.combobox .color {
  width: 60px;
  display: inline-block;
}

.color:hover {
  outline: 2px solid #888;
  /* Edge/IE can't do outline transparency */
  outline: 3px solid #4448;
}

.colorlist {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.cb-item {
  display: block;
  margin: 0px;
  padding: 2px;
  color: #000;
}

/* ------------------------------------------
Added by PT
------------------------------------------ */
div.section {
  margin: 0;
}

.formrow {
  display: block;
}

.formrow:hover .dropdown,
.formrow:focus .dropdown {
  height: auto;
}

.dropdown {
  display: inline-block;
  width: 100%;
  height: 0;
  padding: 0;
  border-bottom: none;
  background-color: rgba(255, 255, 255, .75);
  overflow: hidden;
}

.dropdown>ul {
  position: relative;
  padding: 10px 20px;
  margin: 0;
  opacity: 1;
}

.section .less-sticky>li {
  border-bottom: 1.5px dotted #c7c6c5;
}

.section .less-sticky>li:last-of-type {
  border-bottom: none;
}

.section .less-sticky>li a {
  display: inline;
  width: 100%;
  padding: .25em 0;
  opacity: .6;
}

.section .less-sticky>li>.itallic_pt {
  display: block;
  font-family: "Tiempos", serif;
  letter-spacing: 0.035em;
  font-weight: 300;
  text-transform: none;
  margin: 0;
  background: none;
  color: #404040;
  text-rendering: optimizeLegibility;
  font-size: 11px;
  opacity: .6;
}

.section .less-sticky>li a.section_nav {
  display: inline;
  width: auto;
}

a:hover {
  cursor: pointer !important;
}

.section ul {
  list-style: none;
}

.section ul li > span{
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 11px;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #272424;
  text-rendering: optimizeLegibility;
  opacity: .6;
}

.section ul li a {
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 11px;
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0.5em 0 0 0;
  padding: 0.25em 9px 10px 9px;
  background: none;
  color: #272424;
  text-rendering: optimizeLegibility;
}

.section ul li a:hover {
  opacity: 1;
  color: #000;
  background-color: transparent;
}

.section .less-sticky:hover>li>.itallic_pt {
  color: #000;
  background-color: transparent;
}

/* Header Nav */
div#mainNav {
  width: 100%;
  padding: 0;
  margin: 0;
  color: #fff;
  font-size: 12px;
  font-family: "MTTMilano-UltraBold", "BrandonGrotesqueBold", sans-serif;
  text-transform: uppercase;
  background-color: #000;
}

div#mainNav ul {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 0 20px;
}

div#mainNav a {
  display: block;
  position: relative;
  font-size: 10px;
  letter-spacing: .1em;
  padding: 10px 1.5vw;
  color: #1eb1dd;
}

div#mainNav a:hover {
  color: #fff;
}

/* Header Dropdown Nav */
div#mainNav .main_dpdwn {
  display: none;
  position: absolute;
  padding: 0 10px;
  background-color: rgba(255, 255, 255, 0.95);
}

div#mainNav .main_dpdwn a,
div#mainNav .main_dpdwn li:last-of-type a {
  color: #272424;
}

div#mainNav li:hover .main_dpdwn,
div#mainNav li:focus .main_dpdwn,
div#mainNav li:focus-within .main_dpdwn {
  display: block;
  z-index: 1000;
}

/* LEFTSIDE Header Nav */
div#oprahInfo {
  width: 100%;
  padding: 0;
  margin: 0;
  color: red;
  font-size: 12px;
  font-family: "MTTMilano-UltraBold", "BrandonGrotesqueBold", sans-serif;
  text-transform: uppercase;
  background-color: #000;
}

div#oprahInfo ul {
  display: flex;
  align-items: flex-start;

}

div#oprahInfo a {
  display: block;
  position: relative;
  font-size: 10px;
  letter-spacing: .1em;

  padding: 10px 3vw 10px 1vw;
  color: #1eb1dd;
}

div#oprahInfov li:last-of-type a {
  padding: 10px 20px;
}

div#oprahInfo a:hover {
  color: #fff;
}

/* Header Dropdown Nav */
div#oprahInfo .main_dpdwn {
  display: none;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.95);
}

div#oprahInfov .main_dpdwn a,
div#oprahInfo .main_dpdwn li:last-of-type a {
  color: #272424;
}

div#oprahInfo li:hover .main_dpdwn {
  display: block;
  z-index: 1000;
}




.oprahInfo p {}

.oprahInfo a {
  display: block;
  position: relative;
  font-size: 10px;
  letter-spacing: .1em;

  padding: 10px 3vw 10px 1vw;
  color: #1eb1dd;
}


.oprahInfo a:hover {
  color: #fff;
}




/* FOOTER */
#footer {
  width: 100%;
  max-height: 162px;
  padding: 10px;
  padding-bottom: 20px;
  background-color: #fff;
  z-index: 100;

}

#footer a {
  display: block;
  width: 100%;
  padding: 5px 20px;
  text-align: center;
  color: #999;
  font-family: "Tiempos", serif !important;
  font-size: 1015;
  letter-spacing: 0.065em;
  font-weight: 300;
  text-rendering: optimizeLegibility;
  text-transform: initial;
  font-size: 10px;
}

#footer a:hover {

  color: #222;

}

#footer div:nth-of-type(2) {
  width: 195px;
  margin: 0 auto;
}

#footer div:nth-of-type(2) a {
  width: 100%;
  max-width: 150%;
}

#footer div:nth-of-type(2) a img {
  display: block;
  width: 100%;
  margin: 0 auto;
}

#access_button {
  position: fixed;
  width: auto;
  bottom: 0;
  right: 0;
  padding: 5px 30px 5px 5px;
  background-color: none;
  z-index: 100;
  opacity: 0.1;
}

.sub_li{
  padding: 0 5px;
}

@media only screen and (min-width: 480px) {
  div.section {
    min-height: 290px;
    margin: 0;
  }
}

@media only screen and (min-width: 900px) {
  div#mainNav a {
    font-size: 11px;
  }

  #footer {
    display: flex;
    align-items: center;
    width: 100%;
  }

  #footer div {
    display: flex;
    align-items: center;
    width: calc(50% - (195px / 2));
  }

  #footer div a {
    width: auto;
    max-width: 250px;
  }

  #footer div:first-of-type {
    justify-content: flex-start;
  }

  #footer div:last-of-type {
    justify-content: flex-end;
  }
}

/* Update 03082021 pt */
div#mainNav .right_nav_bar p,
div#mainNav .right_nav_bar p a {
  font-family: "Tiempos", serif !important;
  font-size: 101%;
  letter-spacing: 0.065em;
  font-weight: 300;
  text-rendering: optimizeLegibility;
  text-transform: initial;
  text-align: center;
  color: #fff;
  font-size: 1em;
  display: block;
}

div#mainNav .right_nav_bar p {
  width: 80%;
  margin: 0 auto;
}

div#mainNav .right_nav_bar p a {
  padding: 0;
  margin: 0;
  color: #1eb1dd;
  display: inline;
}

@media only screen and (min-width: 900px) {
  div#mainNav {
    display: flex;
    align-items: center
  }

  div#mainNav>* {
    width: 50%;
  }
}

/* Updated 03092021 - PT Added Grid */
.content_wrap {
  display: grid;
  position: absolute;
  top: 0;
  grid-template-rows: auto auto 162px;
  align-items: start;
  width: 100%;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: scroll;
  box-sizing: border-box;
}

.gridContainer {
  width: 100%;
  height: calc(100%);
  box-sizing: border-box;
}

@media only screen and (min-width: 770px) {
  .content_wrap {
    grid-template-rows: auto 2fr 162px;
  }
}

@media only screen and (min-width: 900px) {
  .content_wrap {
    display: grid;
    grid-template-rows: auto 2fr 55px;
    width: 100vw;
    height: 100vh;
  }

  div#mainNav .right_nav_bar p {
    text-align: left;
    margin: 0 !important;
  }

  div#mainNav ul {
    justify-content: flex-end;
  }
}

@media only screen and (min-width: 1232px) {
  .gridContainer {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.bckgnd_img_link {
  /*
    position: fixed;
  */
  z-index: 0;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
}

.bckgnd_img_link:hover {
  cursor: pointer;
}

.bckgnd_img_link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
}

.bckgnd_img_link:hover {
  cursor: pointer;
}

.rotator_img a {
  position: fixed;
  top: 75px;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: calc(100vh - (75px + 160px));
  z-index: 200;
}

@media only screen and (min-width: 770px) {
  .content_wrap {
    z-index: 0;
  }

  .rotator_img a {
    height: 50vh;
  }
}

@media only screen and (min-width: 900px) {

  .rotator_img a {
    height: 50vh;
  }
}

@media only screen and (min-width: 1200px) {

  .rotator_img a {
    height: 60vh;
  }
}

@media only screen and (min-width: 4800px) {

  .rotator_img a {
    height: 70vh;
  }
}

/* Cafe Modal */
#modal_pt {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 5000;
  background-color: rgba(0, 0, 0, .5);
}

#modal_pt.hidden {
  top: -150vh;
}

.modal_inner_wrap {
  position: relative;
  width: 85vw;
  height: 85vh;
  max-width: 700px;
  max-height: 880px;
  background-color: #fff;
  overflow-x: hidden;
  overflow-y: scroll;
}

.modal_inner_wrap figure {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  background-color: #1eb1dd;
  overflow: hidden;
}

.modal_inner_wrap figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-color: #fff;
}

.modal_inner_wrap .modal_content {
  padding: 5% 10%;
}

.modal_inner_wrap h2 {
  font-family: "MTTMilano-UltraBold", "BrandonGrotesqueBold";
  text-transform: uppercase;
}

.modal_inner_wrap p a {
  color: #404040;
  opacity: .6;
}

.modal_inner_wrap p a:hover,
.modal_inner_wrap p a:focus {
  opacity: 1;
}

.modal_link {
  display: block;
  width: 200px;
  font-family: "BrandonGrotesqueMedium";
  text-align: center;
  text-transform: uppercase;
  padding: 20px 0;
  margin: 30px auto 0 auto;
  color: #fff;
  background-color: #000;
  border: 2px solid #000;
  transition: all .25s ease-in-out;
}

.modal_link:hover,
.modal_link:focus {
  color: #000;
  background-color: #fff;
  transition: all .25s ease-in-out;
}

.close_modal {
  display: block;
  position: absolute;
  top: 20px;
  right: 20px;
  width: 30px;
  height: 20px;
  background-color: transparent;
  border: none;
  box-shadow: none;
}

.close_modal::before,
.close_modal::after {
  content: '';
  position: absolute;
  left: 0;
  top: clac(50% - 1.5px);
  width: 100%;
  height: 3px;
  background-color: rgba(255, 255, 255, 0.75);
  border-radius: 1.5px;
  transition: all .25s ease-in-out;
}

.close_modal:hover::before,
.close_modal:focus::before,
.close_modal:hover::after,
.close_modal:focus::after {
  background-color: #888;
  transition: all .25s ease-in-out;
}

.close_modal::before {
  transform: rotate(45deg);
}

.close_modal::after {
  transform: rotate(-45deg);
}

.close_modal span {
  position: fixed;
  top: -150vh;
}

@media only screen and (min-width: 1024px) {

  .modal_inner_wrap p {
    font-size: 1rem;
  }

  .modal_link {
    font-size: 1.25rem;
  }
}

/* Cafe Modal - END */

/* Scrolling Banner */
.scrl_bnr {
  position: relative;
  width: 100vw;
  height: 85px;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.scrl_bnr p {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 24px;
}

.scrl_bnr p a {
  display: grid;
  align-items: center;
  position: relative;
  width: 100vw;
  height: 100%;
  padding: 0;
  margin: 0;
  font-family: MTTMilano-UltraBold, BrandonGrotesqueBold, sans-serif;
  font-size: 24px;
  /*background-color: #231f20;*/
  background-color: #000;
  transition: background-color .25s ease-in-out;
}

.scrl_bnr p a span{
  display: block;
  width: 625px;
  margin: 0 auto;
  color: #222;
  text-align: center;
  animation-name: scrolling_banner;
  animation-duration: 13s;
  animation-fill-mode: both;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  transition: color .25s ease-in-out;
}

.scrl_bnr p a:hover, .scrl_bnr p a:focus{
  /*background-color: #231f20;*/
  background-color: #000;
}

.scrl_bnr p a:hover span, .scrl_bnr p a:focus span{
  color: #fff;
}

@keyframes scrolling_banner {
  from {
    transform: translateX(100vw);
  }

  to {
    transform: translateX(calc(-175vw));
  }
}

@media only screen and (min-width: 1024px){
  .scrl_bnr p a span{
    animation-duration: 23s;
  }

  @keyframes scrolling_banner {
    from {
      transform: translateX(100vw);
    }

    to {
      transform: translateX(calc(-115vw));
    }
  }
}
/* Scrolling Banner - END */