body { background:#1e1f20; font-family: 'Roboto Slab', serif; line-height:normal; font-size:14px; }
body.light { background:#ffffff; }
body.menuactive { overflow:hidden; }
html, body.fullpage { width:100%; height:100%; }

p { font-family: 'Roboto Slab', serif; line-height: 2em; font-size: 1.1em; font-weight: 100; color:#5f5f5f; }
ul.bullet li { font-family: 'Roboto Slab', serif; line-height: 2em; font-size: 1em; font-weight: 100; color:#5f5f5f; }
h1,h2,h3,h4,h5,h6,.venue-frame .inside-frame a, #menu ul li a { font-family: 'Cantata One', serif; color:#4e9b9d;}

/*#fullpage { height:100%; background:url(../images/pattern.png) repeat 0 0 #303032; background-attachment:fixed; position:relative; padding:63px 0; }*/
#fullpage { height:100%; background:url(../images/background.jpg) repeat 0 0 #000; background-attachment:fixed; position:relative; padding:63px 0;background-size:cover;background-position:center; }
#fullpage .hero, #fullpage .row, #fullpage .col-sm-6 { height:100%; }
#fullpage .table { display:table; }
#fullpage .table .col-sm-6 { display:table-cell; float:none; vertical-align: middle; padding:0 3em; }
.issue-caption { max-width:350px; text-align:center; margin:0 auto; }
.issue-caption p { font-size: 2em; color: #FFF; line-height: normal; margin: 0; text-shadow: 2px 1px #000000}

.page-border { /*background: url(../images/pattern-border.jpg) repeat 0 0 #1e1f20;*/ width:100%; position:absolute; }
.page-border.top { top:0; }
.page-border.bottom { bottom:0; }

.menu-wrapper { display:none; }
.menu-wrapper.active { display:block; position:fixed; z-index:50; background:#337ab7; top:0; bottom:0; right:0; left:0; overflow-y:auto; padding:5em; }

#menu ul { margin:0; padding:0; list-style:none; }
#menu ul li { padding:0 1.5em 1.5em;}
#menu ul li a { font-size: 2.5em; color: #fff; font-weight: 300; text-decoration:none; position:relative; }
#menu ul li:hover a:after { content: ''; position: absolute; height: 1px; background: #ffffff; right: -15px; left: -15px; top: 50%; margin-top: .5px; }
#menu-button {
  display: block;
  position: fixed;
  right: 30px;
  top: 30px;
  width: 48px; height:48px;
  z-index: 999;
  /*-webkit-border-radius: 0%; */
  -moz-border-radius: 50%;
  /* border-radius: 0%;*/
  box-shadow: inset 0 0 0 0 rgba(200,95,66, 0.4), inset 0 0 0 24px rgba(0,0,0,0.6), 0 0 0 rgba(0,0,0,0.1);
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
  padding:10px;
  cursor:pointer;
  border:none solid rgba(255,255,255,0.6);
  z-index:99;
}
#menu-button:hover { box-shadow: inset 0 0 0 110px rgba(255,255,255, 0.4), inset 0 0 0 25px rgba(255,255,255,0.9), 0 1px 2px rgba(255,255,255,0.1); }
#menu-button:hover span { background:#000000; }
#menu-button span {
  display:block;
  backface-visibility: hidden;
  background: #ffffff;
  height: 2px;
  margin: 6px auto;
  transition: all 0.3s ease 0s;
}
#menu-button.on .one {
  -webkit-transform: rotate(45deg) translate(6px, 5px);
  -moz-transform: rotate(45deg) translate(6px, 5px);
  -ms-transform: rotate(45deg) translate(6px, 5px);
  -o-transform: rotate(45deg) translate(6px, 5px);
  transform: rotate(45deg) translate(6px, 5px)
}
#menu-button.on .two {
  opacity: 0
}
#menu-button.on .three {
  -webkit-transform: rotate(-45deg) translate(6px, -6px);
  -moz-transform: rotate(-45deg) translate(6px, -6px);
  -ms-transform: rotate(-45deg) translate(6px, -6px);
  -o-transform: rotate(-45deg) translate(6px, -6px);
  transform: rotate(-45deg) translate(6px, -6px);
}

#content { padding-top:2.5em; }

ul.bullet { padding-left: 22px; list-style:circle; }

.arabic-eat { position:relative; display:inline-block; margin:30px 0 45px; min-width:150px; text-align:center; text-transform:uppercase; }
.arabic-eat span { font-size: .4em; display: block; text-transform:none; font-style: italic; font-weight: 300; }
.arabic-eat.bottom-line-only:before { display:none; }
.arabic-eat:before { top:-30px; content:''; background:url(../images/heading-top-pattern.png) no-repeat 0 0; }
.arabic-eat:after { bottom:-30px; content:''; background:url(../images/heading-bottom-pattern.png) no-repeat 0 0;  }
.arabic-eat:before, .arabic-eat:after { position:absolute; width:150px; height:26px; left:50%; margin-left:-75px; }

.venue-frame { /*border:2px solid #929292; padding:2px;*/ position:relative; margin:25px 0; background-image:url(../images/frame.png);}
.venue-frame .inside-frame { /*border:1px solid #b6b6b7;*/ display: table; width: 100%; min-height: 116px; }
.venue-frame .inside-frame a { padding: 35px; text-align: center; font-size: 1.1em; display:block; text-decoration:none; color:#333; text-transform:uppercase; height: 100%; display: table-cell; width: 100%; vertical-align: middle; }
.venue-frame .inside-frame .corner { height:25px; width:25px; position:absolute; background-position:0 0; background-repeat:no-repeat; }
/*
.venue-frame .inside-frame .corner.top-right { top:-2px; right:-2px; background-image:url(../images/frame-corner-top-right.png); }
.venue-frame .inside-frame .corner.bottom-right { bottom:-2px; right:-2px; background-image:url(../images/frame-corner-bottom-right.png); }
.venue-frame .inside-frame .corner.top-left { top:-2px; left:-2px; background-image:url(../images/frame-corner-top-left.png); }
.venue-frame .inside-frame .corner.bottom-left { bottom:-2px; left:-2px; background-image:url(../images/frame-corner-bottom-left.png); }
*/
.needtoknow { border:2px solid #929292; padding:2px; position:relative; margin-top: 35px; }
.needtoknow p { font-size:1em; line-height:1.5em; }
.needtoknow .inside-wrapper { border:1px solid #b6b6b7; padding:30px; }
.needtoknow .corner { height:25px; width:25px; position:absolute; background-position:0 0; background-repeat:no-repeat; }
.needtoknow .corner.top-right { top:-2px; right:-2px; background-image:url(../images/frame-corner-top-right.png); }
.needtoknow .corner.bottom-right { bottom:-2px; right:-2px; background-image:url(../images/frame-corner-bottom-right.png); }
.needtoknow .corner.top-left { top:-2px; left:-2px; background-image:url(../images/frame-corner-top-left.png); }
.needtoknow .corner.bottom-left { bottom:-2px; left:-2px; background-image:url(../images/frame-corner-bottom-left.png); }
.needtoknow h3.main { color:#4e9b9d; text-transform:uppercase; margin-top:0; padding-bottom: 8px; border-bottom: 1px dotted #231f20; margin-bottom:18px }
.needtoknow .times, .needtoknow .prices, .booknow, .getintouch { margin-bottom:22px; }

#footer { padding: 2em 0; color: #888888; font-size: 16px; text-align: center; background: #1e1f20; /* margin-top: 4em; */ }
.copyright { font-size:.8em; font-weight:100; }

.retro-button-wrapper { position:relative; min-height: 37px; margin-top: 25px; }
.button.retro {
  background:#4e9b9d; position:relative; color: #FFF; font-size: 19px; padding: 9px 18px; z-index:2; position:absolute; width:100%; left:0;
}
/*.ui-animate-3d { outline: 1px solid transparent; background-color: #FFF;position: absolute;
-webkit-transform: perspective(200px) rotateY(9deg) rotateX(-3deg) translateX(6%) translateZ(-10px) scale(1.05);
  transform: perspective(200px) rotateY(9deg) rotateX(-3deg) translateX(6%) translateZ(-10px) scale(1.05); left:-15px; right:-15px; top: -6px; bottom: -8px; z-index:1;
} */
/*.retro-button-wrapper:hover .ui-animate-3d {
  -webkit-transform: perspective(200px) rotateY(-5deg) rotateX(-3deg) translateX(-5%) translateY(2%) translateZ(-20px) scale(1.1);
  transform: perspective(200px) rotateY(-5deg) rotateX(-3deg) translateX(-5%) translateY(2%) translateZ(-20px) scale(1.1); } */
.ui-animate-300-cubic {
  -webkit-transition: all 0.3s cubic-bezier(0.16, 0.53, 0.15, 0.99) 0s;
  -moz-transition: all 0.3s cubic-bezier(0.16, 0.53, 0.15, 0.99) 0s;
  -ms-transition: all 0.3s cubic-bezier(0.16, 0.53, 0.15, 0.99) 0s;
  -o-transition: all 0.3s cubic-bezier(0.16, 0.53, 0.15, 0.99) 0s;
  transition: all 0.3s cubic-bezier(0.16, 0.53, 0.15, 0.99) 0s; }
  .collage { max-width: 300px; width: 100%; padding: 5px; background: #212121; float: left; margin-top: 25px; list-style:none; }
  .collage ul { padding:0; margin:0; }
  .collage ul li { float:left; width:50%; padding:5px; }
  .collage ul li img { float:left; }



  /* ----------- iPad mini ----------- */

  /* Portrait and Landscape */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {

  }

  /* Portrait */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {

  }

  /* Landscape */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {

  }

  /* ----------- iPad 1 and 2 ----------- */
  /* Portrait and Landscape */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {

  }

  /* Portrait */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {

  }

  /* Landscape */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {

  }

  /* ----------- iPad 3 and 4 ----------- */
  /* Portrait and Landscape */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) {

  }

  /* Portrait */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {

  }

  /* Landscape */
  @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {

  }



  /* ----------- iPhone 4 and 4S ----------- */

  /* Portrait and Landscape */
  @media only screen and (min-device-width: 320px) and (max-device-width: 480px)and (-webkit-min-device-pixel-ratio: 2) {
    
    .collage{ max-width: 100%;}
    #fullpage .table{ margin:auto; }
    #fullpage .table .col-sm-6 { display:block !important;height:auto;padding:2em; }
    #fullpage .table .col-sm-6 img{ display:inline-block;text-align:center; }
    #fullpage { height:auto; }
    .needtoknow{text-align:center;}
    .venue-frame .inside-frame a{padding:0;}
  }

  /* Portrait */
  @media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
  }

  /* Landscape */
  @media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {

  }

  /* ----------- iPhone 5 and 5S ----------- */

  /* Portrait and Landscape */
  @media only screen and (min-device-width: 320px) and (max-device-width: 568px)and (-webkit-min-device-pixel-ratio: 2) {

  }

  /* Portrait */
  @media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
  }

  /* Landscape */
  @media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {

  }

  /* ----------- iPhone 6 ----------- */

  /* Portrait and Landscape */
  @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) { 

  }

  /* Portrait */
  @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) { 

  }

  /* Landscape */
  @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) { 

  }

  /* ----------- iPhone 6+ ----------- */

  /* Portrait and Landscape */
  @media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) { 

  }

  /* Portrait */
  @media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: portrait) { 

  }

  /* Landscape */
  @media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: landscape) { 

  }