body,html{
  padding:0;
  margin:0;
}
body{
  /*background-image:url(https://www.ravinia.org/content/images/WavyBg.jpg);*/
  background-color:#50a744;

  background-image: url("../img/DiningBG600.jpg");



}
p,a,span, h1,h2,h3,h4,h5,h6,strong,ul,li{
  font-family:futura-pt, sans-serif; 
}
p{
  padding:0;
  margin:0;
}

p.cashless{
  font-size:1.25rem !important;
}

  hr{
        height: 1px;
        background-color: #e5e5e5;
        border: none;
    }


a.alertButton{
  clear:both;
  border-radius:6px; font-size:16px;
  padding:3px 6px;
  color:#000; background:white; text-align:center; text-decoration:none;
  
}
/* block styling for menu section */
#menu, #menu2, #menu3, #menu3 img{
  text-align:center;
}
#menu a, #menu2 a, #menu3 a{
 color:#444444;
}

.largeMenu{
  width:75%;
  max-width:800px;
  border:solid 2px #aaa;
}
#backToRavinia{
  width:300px;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
  text-transform:uppercase;
  position:fixed;
  bottom:0px;
  right:0px;
  left:0px;
  background:#ddd;
 


  border-radius:12px 12px 0px 0px;

  font-family:futura;
  letter-spacing:2px;
  font-size:14px;
  padding:5px 0px;
  text-align:center;
  opacity:1;
  box-shadow:2px 3px 5px #666;
}
#backToRavinia a {
  color:white; color:#222222;
  text-decoration:none;
  width:100%;
  display:block;
  overflow:hidden;
}
#backToRavinia img{
  width:20px;
  display:block;
  float:left;
  margin-right:10px;
  margin-left:35px;
  margin-top:4px;filter: invert(1);
}
#backToRavinia span{
  margin-left:6px;
  display:block;
  float:left;
  line-height:30px;
  margin-bottom:5px;
}
#wrap{
  margin:10px auto 60px auto;
  padding:0;
  overflow:hidden;
  width:100%;
  max-width:900px;

  background:#fff;

  border-radius:16px 16px 0px 0px;
}
#about p, #about2 p, #about3 p{
  width:100%;
  margin-left:auto;
  margin-right:auto;
  float:none;
}
/* ---------- market about paragraph ------------ */
#tab-four #about4 {
  padding-bottom:40px;
}
#tab-four #about4 p{
  font-size:24px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
  float:none;
  line-height:1.75em;
}
.contentSection{
  color:#444;
  padding:40px;
  padding-bottom:40px;
  padding-top:40px;
  font-size:24px;
  clear:both;
  overflow:hidden;
  position:relative;
  text-align:left;
  border-bottom:solid 1px #ccc;
}
.contentSection p{
  width:100%;
  float:left;
  display:block;
  margin-right:20px;
  line-height:1.75em;
}
.contentSection.marketOption p{
font-size:20px;
line-height:1.5em !important;}

#tab-four .contentSection{
  padding-bottom:80px;
}
#about4.contentSection p{
  width:100%;
}
p#top{
  display:none;
}
.backToTopLink{
  background:#eee;
  padding:4px;
  font-size:12px;
  text-decoration:none;
  border-radius:6px 6px 0px 0px;
  margin-bottom:20px;
  border:solid 1px #666;
  border-bottom:none;
  position:absolute;
  bottom:-20px;
  right:20px;
  opacity:.5;
}
a.backToTopLink{
  color:#666;
}
#logo-holder{
  width:25%;
  float:left;
  padding-top:10px;
  padding-left:10px;
  box-sizing:border-box;
  border-bottom:solid 1px #999;
  padding-bottom:2px;
  overflow:hidden;
  height:60px;
}
#logo-holder img{
  float:left;
  max-height:46px;

}
.tabs-nav-wrap {
  
  padding:0px 0px;
  text-align: center;
  margin-bottom:20px;
  padding-bottom:15px;
}
.tabs-nav-wrap ul {
  list-style: none;
}
.tabs-nav-wrap ul li {
  list-style: none;
  margin:0 0px;
}
ul.tabs-nav{
  margin:0;
  padding:0;
  width:75%;
  float:left;
  height:60px;
  box-sizing:border-box;
}
.tabs-nav{
  border-left:solid 1px #999;
}
.tabs-nav li {
  float:left;
  list-style: none;
  display: block;
  padding:0px 0px;
  background: #ddd;
  font-size: 14px;
  font-weight: 300;
  cursor: pointer;
  color: #999;
  text-align: center;
  letter-spacing:.1em;
  text-decoration: none;
  width:25%;
  box-sizing:border-box;
  text-transform:uppercase;
  height:60px;
  line-height:60px;
  border-right:solid 1px #999;
  border-bottom:solid 1px #999;
}



.tabs-nav .tab-nav-link{
  -webkit-transition: background 0.3s ease-out ;
  -moz-transition: background 0.3s ease-out;
  -o-transition: background 0.3s ease-out;
}
.tabs-nav .tab-nav-link.current{
  border-bottom:none;
  color:#222;

  background:white;
}
.tabs-nav .tab-nav-link.current#marketbutton{
  border-right:none;
}
.tabs-nav .tab-nav-link#marketbutton{
  border-right:none;
}
.tabs-nav .tab-nav-link:hover {
  background: #ddd;
  color:#666;

}
.tabs-nav .tab-nav-link.current:hover{
  background:white;
  color:#666;
}
.tab-content {
  padding:0px 0px;
  text-align:center;

  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
}
.tab-inner{
  position:relative;
  /* for opentable widget sliding */
}
/*
.tab-content.sticky {
  margin-top:100px;
}*/
/* sticky header that holds restaurant buttons */
.header-wrapper{
  position:relative;
  z-index:10000;
  background:#fff;
}
.tabs-nav-wrap{
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  position: static;
  top: -100px;
  padding: 0px;
  margin:0s;
  width:100%;
}
.tabs-nav-wrap.sticky {
  background: #fff;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.5);
}
/* ---------------- Market Section ----------------- */
.marketlogo{
  float:left;
  max-width:180px;
  margin-right:20px;
  margin-bottom:20px;
  border-radius:16px;
}

.cashlessLogo{
    float:left;
  max-width:120px;
  margin-right:20px;
  margin-bottom:20px;
  border-radius:16px;
}
#tab-four .contentSection p{
  width:45%;
  float:left;
  margin-right:20px;
  line-height:2em;
}
.market-thumb{
  max-width:150px;
  float:none;
  text-align:center;
}
.food-photo{
  float:right;
  text-align:center;
  border:solid 1px #ddd;
  border-radius:4px;
  position:absolute;
  top:30px;
  right:20px;
  padding:10px;
}
.signature{
  width:100%;
  font-size:12px;
  margin-bottom:4px;
  text-align:center;
  text-transform:uppercase;
  letter-spacing:.25em;
  color:#333;
}
.food-photo a {
  clear:both;
  text-decoration:none;
}
img.mLogo{
  float:left;
  width:38%;
  margin-right:40px;
}
/* ---------------- Common Styles ----------------- */
.img-capture{
  border:solid 4px white;
  box-shadow: 1px 1px 4px #ddd;
}
span.caption{
  font-size:.6em;
  clear:both;
  opacity:.7;
  text-decoration:none;
}
/* --------------- 2nd NAV ---------------*/
.second-nav{
  width:100%;
  margin-bottom:0px;
}
.second-nav a {
  width:25%;
  box-sizing:border-box;
  text-align:center;
  text-decoration:none;
  height:40px;
  line-height:40px;
  background:#333;
  color:white;
  display:inline-block;
  margin:0;
  border-right:solid 1px #000;
  -webkit-transition: background 0.3s ease-out ;
  -moz-transition: background 0.3s ease-out;
  -o-transition: background 0.3s ease-out;
}
.second-nav a:hover{
  background:#777;
}
/* --------------- 3nd NAV ---------------*/
.third-nav{
  width:100%;
  margin-bottom:20px;
  margin-top:-20px;
}
.third-nav a {
  width:25%;
  box-sizing:border-box;
  text-align:center;
  text-decoration:none;
  height:40px;
  line-height:40px;
  background:#333;
  color:white;
  display:inline-block;
  margin:0;
  border-right:solid 1px #000;
  -webkit-transition: background 0.3s ease-out ;
  -moz-transition: background 0.3s ease-out;
  -o-transition: background 0.3s ease-out;
}
.third-nav a:hover{
  background:#777;
}
h3.contentHeading{
  font-size:1.75em;
  text-align:center;
  font-weight:bold;
  text-transform:uppercase;
  margin-top:0;
  line-height:1em;

}
h3 span{
  font-size:.5em;
  font-weight:normal;
  opacity:.55;
}
/* --------------- food gallery---------------*/
.gallery{
  background:#eee;
  padding:10px;
  padding-top:20px;
  padding-bottom:40px;
  /*background-image:url(https://www.ravinia.org/content/images/WavyBg.jpg);*/

}
.galleryHolder{
  padding:10px;
  padding-left:25px;
  box-sizing:border-box;
  width:auto;
  display:inline-block;
  width:100%;
  overflow:hidden;
}
.galleryHolder img{
  width:30%;
  float:left;
  margin-right:3.3%;
  box-sizing:border-box;
  border:solid 4px white;
  border-radius:20px;
  box-shadow:1px 1px 4px #999;
}
#contact, #contact2, #contact3{
  text-align:center;
  background:#eee;
  background-image:url(https://www.ravinia.org/content/images/WavyBg.jpg);
}

#contact a, #contact2 a, #contact3 a{
  color:#444;
}







/* --------------- OPENTABLE ---------------*/
.opentable-widget{
  background:#444;
  width:340px;
  margin:0;
  padding:0;
}
#panel,#panel2{
  padding-top:10px;
  position:absolute;
  top:0;
  left:-350px;
  z-index:4000;
  -webkit-transition: left 0.3s ease-out ;
  -moz-transition: left 0.3s ease-out;
  -o-transition: left 0.3s ease-out;
  opacity:100;
  height:340px;
  border:solid 1px #666;
  border-right:none;
  border-left:none;
}
#panel.active,#panel2.active{
  left:0px;
  opacity:100;
  border-right:solid 1px #666;
}
#trigger,#trigger2{
  border:none;
  background:#da3743;
  border:solid 1px #666;
  border-bottom:none;
  color:#fff;
  font-size:18px;
  text-transform:uppercase;
  font-family:futura-pt, sans-serif; 
  letter-spacing:4px;
  transform: rotate(-90deg);
  transform-origin: left top 0;
  position:absolute;
  width:200px;
  top:200px;
  left:0px;
  text-align:center;
  z-index:500;
  padding:10px 0;
  -webkit-transition: left 0.3s ease-out;
  -moz-transition: left 0.3s ease-out;
  -o-transition: left 0.3s ease-out;
  border-radius:0px 0px 12px 12px;
}
#trigger.active,#trigger2.active{
  left:340px;
}
/*---------------------SLIDER CSS-------------------------------------------------- */
#photos3.contentSection{
 background:#ededed;
}

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  box-sizing:border-box;
}
.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
}
.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
}
.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
}
.slider-container{
  position:relative;
}
a.prev, a.next{
  visibility:hidden;
}
a.prev::before{
  content: "<";
  position:absolute;
  bottom:22px;
  left:0px;
  z-index:400;
  background:rgba(255,255,255,1);
  color:#999;
  padding:5px;
  font-size:20px;
width:50%;
text-align:center;
  visibility:visible;
  display:block;
  border:solid 1px #999;
}
a.next::before{
  content: ">";
  border:solid 1px #999;
  position:absolute;
  bottom:22px;
  right:0px;
  z-index:400;
  background:rgba(255,255,255,1);
  color:#999;
  padding:5px;
  padding-right:;
  font-size:20px;
  width:50%;padding:5px;
  text-align:center;
  visibility:visible;
  display:block;
}
a.next{
  right:0;
  left:auto;
  z-index:501;
}


#tab-four a.prev::before{
  content: "<";
  position:absolute;
  bottom:22px;
  left:0px;
  z-index:400;
  background:rgba(255,255,255,.95);
  color:#999;
  padding:5px;
  font-size:20px;

text-align:center;
  visibility:visible;
  display:block;
  border:solid 1px #999;

  width:30px;

}
#tab-four a.next::before{
  content: ">";
  border:solid 1px #999;
  position:absolute;
  bottom:22px;
  right:0px;
  z-index:400;
  background:rgba(255,255,255,.95);
  color:#999;
  padding:5px;
  padding-right:;
  font-size:20px;
  width:30px;padding:5px;
  text-align:center;
  visibility:visible;
  display:block;
}











/*-----------------Availability---------------------*/

#availability3 a{
  color:#50a744;
  text-decoration:none;
}

#availability3 a:hover{
text-decoration:underline;
}


#availability , #availability2 , #availability3{
  background:#eee;
}
#availability p, #availability2 p, #availability3 p{
  margin-bottom:2em;
  width:80%;
  margin-left:auto;
  margin-right:auto;
  float:none;
  padding-bottom:40px;
  border-bottom:solid 2px #333;
}
#availability strong, #availability2 strong, #availability3 strong{
  text-transform:uppercase;
}
/*-----------------Footer---------------------*/
.footer{
  overflow:hidden;
  background:#333;
  font-family:futura-pt, sans-serif; 
  padding-bottom:00px;
}
#leftFooter{
  width:40%;
  float:left;
  background:#333;
  color:#ccc;
  padding:20px;
  text-align:center;
  box-sizing:border-box;
  padding-top:40px;
}
#leftFooter strong{
  font-size:1.25em;
  font-weight:bold;
}
#rightFooter{
  width:60%;
  float:left;
  background:#333 ;
  color:white;
  box-sizing:border-box;
  padding:20px;
  padding-right:60px;
}
/*------------------ newsletter sign up---------------*/
#newsletter{
  padding-top:6px;
  width:100%;
  font-family:futura-pt, sans-serif; 
  background:#444;
  padding-bottom:20px;
  border:solid 1px #333;
  padding-left:20px;
  padding-right:20px;
  border-radius:6px;
}
#newsletter form{
  padding:20px;

    text-align:center;
}
#newsletter label{
font-weight:bold;
padding:0 !important;
  display:block;
  color:#ccc;
  margin-bottom:10px;


}
input.input-sm {
  font-size:16px;
  clear:both;
  border-radius:0px;
  padding:5px;
  color:#000;
}
button.btn-sm{

  padding:5px;
}





















@media only screen and (max-width: 850px){


  .contentSection{
    color:#444;
    padding:10px;
    padding-bottom:40px;
    padding-top:20px;
    font-size:20px;
    clear:both;
    overflow:hidden;
    position:relative;
    text-align:left;
    border-bottom:solid 1px #ccc;
  }
  .contentSection p{
    width:100%;
    margin-right:20px;
    line-height:1.75em;
    font-size:20px;
  }
  #about, #about2, #about3{
    padding:20px 0px;
  }
  #about p, #about2 p, #about3 p, #about4 p{
    width:90%;
  }
  /* -------------LOGO -----------------*/
  #logo-holder{
    width:100%;
    height:60px;
    margin-left:auto;
    margin-right:auto;
    float:none;
    overflow:hidden;
    text-align:center;
    margin-top:0;
    border-bottom:solid 1px #999;
  }
  #logo-holder img{
    float:none;
    max-width:100%;
  }
  ul.tabs-nav{
    margin:0;
    padding:0;
    width:100%;
    float:left;
    height:30px;
  }
  .tabs-nav li {
    width:25%;
    font-size:.7em;
    height:60px;
    line-height:60px;
    box-sizing:border-box;
  }
  #availability p, #availability2 p, #availability3 p{
    margin-bottom:1em;
    width:90%;
    margin-left:auto;
    margin-right:auto;
    float:none;
    padding-bottom:20px;
    border-bottom:solid 1px #333;
  }
  .gallery{
    background:#eee;
    padding:10px;
    padding-bottom:40px;
    background-image:url(https://www.ravinia.org/content/images/WavyBg.jpg);
  }
  .galleryHolder{
    padding:10px;
    padding-left:25px;
    box-sizing:border-box;
    width:auto;
    display:inline-block;
    width:100%;
    overflow:hidden;
  }
  .galleryHolder img{
    width:31%;
    float:left;
    margin-right:2%;
    box-sizing:border-box;
    border:solid 3px white;
    border-radius:10px;
    box-shadow:1px 1px 4px #999;
  }
  /* ---------------- MARKET SECTION -----------------*/
  .signature{
    font-size:10px;
    color:#333;
  }
  .signature::before {
    content: "View ";
  }
  img.mLogo{
    float:none;
    margin-left:0px;
    margin-right:20px;
    width:40% !important;
    margin-bottom:10px;
  }
  .food-photo{
    background:#ccc;
    border-radius:10px;
    width:50%;
    display:inline-block;
    float:none;
    position:static;
    margin-left:auto;
    margin-right:auto;
    margin-top:20px;
    clear:both;
  }
  .food-photo br {
    display:none;
  }
  .food-photo img{
    display:none;
  }
  .food-photo .caption{
    display:none;
  }
  #tab-four .contentSection p{
    width:100%;
    float:none;
    display:block;
    margin-right:20px;
    line-height:1.5em;
  }
  #tab-four .contentSection{
    padding-bottom:20px;
  }
  #tab-four #about4{
    padding:20px;
    padding-top:0px;
  }
  #tab-four #about4 p{
    font-size:20px;
    width:100%;
    margin-left:auto;
    margin-right:auto;
    float:none;
    line-height:1.5em;
  }
  .second-nav{
    display:none;
  }
  .third-nav{
    display:none;
  }
  /* -------- OPEN TABLE -------------*/
  #trigger,#trigger2{
    font-size:12px;
    text-transform:uppercase;
    font-family:futura-pt, sans-serif; 
    letter-spacing:4px;
    transform: rotate(0deg);
    transform-origin: left top 0;
    position:static;
    text-align:center;
    z-index:4001;
    padding:10px 0;
    top:-300px;
    border-radius:0px;
    display:block;
    margin-top:0px;
    -webkit-transition: top 0.3s ease-out;
    -moz-transition: top 0.3s ease-out;
    -o-transition: top 0.3s ease-out;
    width:100%;
    background:#da3743;;
    border:solid 1px #333;
    color:#fff;
  }
  #trigger.active, #trigger2.active{
    z-index:4001;
    position:absolute;
    top:300px;
    left:0px;
  }
  #panel,#panel2{
    position:absolute;
    top:-400px;
    right:0px;
    width:100%;
    -webkit-transition: top 0.3s ease-out;
    -moz-transition: top 0.3s ease-out;
    -o-transition: top 0.3s ease-out;
    opacity:0;
  }
  #panel.active, #panel2.active{
    top:0px;
  }
  .backToTopLink{
    display:none;
    background:#eee;
    padding:4px;
    font-size:12px;
    text-decoration:none;
    border-radius:6px 6px 0px 0px;
    margin-bottom:20px;
    border:solid 1px #666;
    border-bottom:none;
    position:absolute;
    bottom:-20px;
    left:10%;
    text-align:center;
    width:80%;
    opacity:.5;
  }
  a.backToTopLink{
    color:#666;
  }
  /*------------------ newsletter sign up---------------*/
  #rightFooter{
    padding:10px;
  }
  #newsletter{
    padding-top:6px;
    width:100%;
    font-family:futura-pt, sans-serif; 
    padding-bottom:20px;
    border:solid 1px #333;
    padding-left:20px;
    border-radius:6px;
    text-align:center;
    box-sizing:border-box;
  }
  form{
    padding:10px;
    box-sizing:border-box;
  }
  #newsletter label{
    font-size:16px;
    margin-bottom:10px;
    padding-bottom:10px;
    
    width:100%;
    box-sizing:border-box;
  }
  input.input-sm {
    border:solid 1px white;
    font-size:12px;
    clear:both;
    border-radius:10px;
    padding:5px;
    width:80%;
    box-sizing:border-box;
    text-align:center;
    margin-bottom:10px;
  }
  button.btn-sm{
  
    padding:3px;
    box-sizing:border-box;
  }
}



/*-- modal window */

.my-modal-content{

  font-size:18px;
  line-height:1.5em;
}

.my-modal-content ul li{
  margin-bottom:20px;
}

button#js-open{
  padding:5px;
  margin-left:10px;

}









@media only screen and (max-width: 520px){




    .tabs-nav .tab-nav-link#bmolink{
  font-size:9px;
}

}

/* ------------------------------------------ */
/* MOBILE DESIGN */
@media only screen and (max-width: 480px){



  h3.contentHeading{
    font-size:1em;
  }
  .marketlogo{
    width:100px;
    max-width:100px;
  }
  a.prev::before{
    font-size:11px;
    padding:4px;
  }
  a.next::before{
    font-size:11px;
    padding:4px;
  }
  #backToRavinia{
    font-size:12px;
    width:100%;
    text-align:center;
    padding:0;
  }
  #backToRavinia img{
    width:25px;
    float:none;
    display:inline-block;
    position:relative;
    top:6px;
    margin:0;
    margin-right:10px;
  }
  #backToRavinia span{
    float:none;
    margin:0;
    display:inline-block;
    line-height:40px;
    padding:0;
  }
  #backToRavinia a {
    color:white;
    text-decoration:none;
    width:100%;
    display:block;
  }
  .contentSection p{
    width:100%;
    margin-right:20px;
    line-height:1.5em;
    font-size:20px;
  }


  #rightFooter{
  padding:4px;
  padding-right:4px;
}
/*------------------ newsletter sign up---------------*/
#newsletter{
padding:0;
margin:0;
margin-top:20px;
  border-radius:6px;


}



}













/*----------------- market logo custom breakpoint ------------*/
@media only screen and (max-width: 380px){
  img.mLogo{
    float:left;
    margin-left:0px;
    margin-right:20px;
    width:30% !important;
    margin-bottom:10px;
  }
}
@media only screen and (max-width: 500px){
  .food-photo{
    display:block;
  }
}
@media only screen and (max-width: 750px){
  img.mLogo{
    float:left;
    width:50%;
    margin-bottom:10px;
  }
}