@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:400,300,600,300italic,400italic,600italic);
@import url(https://fonts.googleapis.com/css?family=Merriweather:400,300,300italic,400italic,700,700italic);
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,300italic,400italic,700,700italic);

@font-face {
  font-family: 'icomoon';
  src:  url('/RioCinema/fonts/icomoon.eot?gwf7el');
  src:  url('/RioCinema/fonts/icomoon.eot?gwf7el#iefix') format('embedded-opentype'),
    url('/RioCinema/fonts/icomoon.ttf?gwf7el') format('truetype'),
    url('/RioCinema/fonts/icomoon.woff?gwf7el') format('woff'),
    url('/RioCinema/fonts/icomoon.svg?gwf7el#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-home:before {
  content: "\e900";
}
.icon-home2:before {
  content: "\e901";
}
.icon-home3:before {
  content: "\e902";
}
.icon-pencil:before {
  content: "\e905";
}
.icon-pencil2:before {
  content: "\e906";
}
.icon-quill:before {
  content: "\e907";
}
.icon-droplet:before {
  content: "\e90b";
}
.icon-paint-format:before {
  content: "\e90c";
}
.icon-image:before {
  content: "\e90d";
}
.icon-camera:before {
  content: "\e90f";
}
.icon-headphones:before {
  content: "\e910";
}
.icon-music:before {
  content: "\e911";
}
.icon-play:before {
  content: "\e912";
}
.icon-film:before {
  content: "\e913";
}
.icon-video-camera:before {
  content: "\e914";
}
.icon-dice:before {
  content: "\e915";
}
.icon-pacman:before {
  content: "\e916";
}
.icon-spades:before {
  content: "\e917";
}
.icon-clubs:before {
  content: "\e918";
}
.icon-diamonds:before {
  content: "\e919";
}
.icon-bullhorn:before {
  content: "\e91a";
}
.icon-connection:before {
  content: "\e91b";
}
.icon-book:before {
  content: "\e91f";
}
.icon-books:before {
  content: "\e920";
}
.icon-library:before {
  content: "\e921";
}
.icon-paste:before {
  content: "\e92d";
}
.icon-price-tag:before {
  content: "\e935";
}
.icon-price-tags:before {
  content: "\e936";
}
.icon-ticket:before {
  content: "\e939";
}
.icon-cart:before {
  content: "\e93a";
}
.icon-coin-pound:before {
  content: "\e93d";
}
.icon-credit-card:before {
  content: "\e93f";
}
.icon-phone:before {
  content: "\e942";
}
.icon-phone-hang-up:before {
  content: "\e943";
}
.icon-address-book:before {
  content: "\e944";
}
.icon-envelop:before {
  content: "\e945";
}
.icon-pushpin:before {
  content: "\e946";
}
.icon-location:before {
  content: "\e947";
}
.icon-compass:before {
  content: "\e949";
}
.icon-clock2:before {
  content: "\e94f";
}
.icon-alarm:before {
  content: "\e950";
}
.icon-calendar:before {
  content: "\e953";
}
.icon-printer:before {
  content: "\e954";
}
.icon-keyboard:before {
  content: "\e955";
}
.icon-display:before {
  content: "\e956";
}
.icon-laptop:before {
  content: "\e957";
}
.icon-mobile:before {
  content: "\e958";
}
.icon-mobile2:before {
  content: "\e959";
}
.icon-undo2:before {
  content: "\e967";
}
.icon-redo2:before {
  content: "\e968";
}
.icon-bubble:before {
  content: "\e96b";
}
.icon-bubbles:before {
  content: "\e96c";
}
.icon-bubbles2:before {
  content: "\e96d";
}
.icon-bubble2:before {
  content: "\e96e";
}
.icon-bubbles3:before {
  content: "\e96f";
}
.icon-bubbles4:before {
  content: "\e970";
}
.icon-user:before {
  content: "\e971";
}
.icon-users:before {
  content: "\e972";
}
.icon-quotes-left:before {
  content: "\e977";
}
.icon-quotes-right:before {
  content: "\e978";
}
.icon-spinner:before {
  content: "\e97a";
}
.icon-spinner3:before {
  content: "\e97c";
}
.icon-spinner4:before {
  content: "\e97d";
}
.icon-spinner6:before {
  content: "\e97f";
}
.icon-spinner7:before {
  content: "\e980";
}
.icon-binoculars:before {
  content: "\e985";
}
.icon-zoom-in:before {
  content: "\e987";
}
.icon-zoom-out:before {
  content: "\e988";
}
.icon-enlarge2:before {
  content: "\e98b";
}
.icon-shrink2:before {
  content: "\e98c";
}
.icon-key:before {
  content: "\e98d";
}
.icon-key2:before {
  content: "\e98e";
}
.icon-hammer:before {
  content: "\e996";
}
.icon-pie-chart:before {
  content: "\e99a";
}
.icon-stats-dots:before {
  content: "\e99b";
}
.icon-stats-bars:before {
  content: "\e99c";
}
.icon-trophy:before {
  content: "\e99e";
}
.icon-gift:before {
  content: "\e99f";
}
.icon-glass:before {
  content: "\e9a0";
}
.icon-glass2:before {
  content: "\e9a1";
}
.icon-mug:before {
  content: "\e9a2";
}
.icon-spoon-knife:before {
  content: "\e9a3";
}
.icon-leaf:before {
  content: "\e9a4";
}
.icon-fire:before {
  content: "\e9a9";
}
.icon-lab:before {
  content: "\e9aa";
}
.icon-magnet:before {
  content: "\e9ab";
}
.icon-bin:before {
  content: "\e9ac";
}
.icon-airplane:before {
  content: "\e9af";
}
.icon-attachment:before {
  content: "\e9cd";
}
.icon-eye:before {
  content: "\e9ce";
}
.icon-star-empty:before {
  content: "\e9d7";
}
.icon-star-half:before {
  content: "\e9d8";
}
.icon-star-full:before {
  content: "\e9d9";
}
.icon-heart:before {
  content: "\e9da";
}
.icon-heart-broken:before {
  content: "\e9db";
}
.icon-man:before {
  content: "\e9dc";
}
.icon-man-woman:before {
  content: "\e9de";
}
.icon-happy:before {
  content: "\e9df";
}
.icon-smile:before {
  content: "\e9e1";
}
.icon-cool:before {
  content: "\e9eb";
}
.icon-plus:before {
  content: "\ea0a";
}
.icon-minus:before {
  content: "\ea0b";
}
.icon-volume-high:before {
  content: "\ea26";
}
.icon-volume-medium:before {
  content: "\ea27";
}
.icon-volume-low:before {
  content: "\ea28";
}
.icon-volume-mute:before {
  content: "\ea29";
}
.icon-volume-mute2:before {
  content: "\ea2a";
}
.icon-volume-increase:before {
  content: "\ea2b";
}
.icon-loop2:before {
  content: "\ea2e";
}
.icon-table:before {
  content: "\ea70";
}
.icon-share2:before {
  content: "\ea82";
}
.icon-google:before {
  content: "\ea87";
}
.icon-google-plus:before {
  content: "\ea88";
}
.icon-google-plus2:before {
  content: "\ea89";
}
.icon-google-plus3:before {
  content: "\ea8a";
}
.icon-facebook:before {
  content: "\ea8c";
}
.icon-facebook2:before {
  content: "\ea8d";
}
.icon-facebook3:before {
  content: "\ea8e";
}
.icon-instagram:before {
  content: "\ea90";
}
.icon-twitter:before {
  content: "\ea91";
}
.icon-twitter2:before {
  content: "\ea92";
}
.icon-twitter3:before {
  content: "\ea93";
}
.icon-feed2:before {
  content: "\ea94";
}
.icon-feed3:before {
  content: "\ea95";
}
.icon-feed4:before {
  content: "\ea96";
}
.icon-youtube:before {
  content: "\ea97";
}
.icon-youtube2:before {
  content: "\ea98";
}
.icon-youtube3:before {
  content: "\ea99";
}
.icon-youtube4:before {
  content: "\ea9a";
}
.icon-vimeo:before {
  content: "\ea9c";
}
.icon-vimeo2:before {
  content: "\ea9d";
}
.icon-vimeo3:before {
  content: "\ea9e";
}
.icon-lanyrd:before {
  content: "\ea9f";
}
.icon-flickr:before {
  content: "\eaa0";
}
.icon-flickr2:before {
  content: "\eaa1";
}
.icon-tumblr:before {
  content: "\eabb";
}
.icon-tumblr2:before {
  content: "\eabc";
}
.icon-linkedin:before {
  content: "\eac8";
}
.icon-linkedin2:before {
  content: "\eac9";
}
.icon-pinterest:before {
  content: "\ead0";
}
.icon-pinterest2:before {
  content: "\ead1";
}
.icon-svg:before {
  content: "\eae3";
}


*, *:after, *:before { border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }
 
.container {
padding-left: 20px;
padding-right: 20px;
}

.row, #WizardSteps, #Content {
width: 100%;
margin: 0 auto;
/*overflow: hidden;*/
}

.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol {
margin-right: 3.8%;
float: left;
min-height: 1px;
}

.onecol {
width: 4.85%;
}

.twocol {
width: 13.45%;
}

.threecol{
width: 22.05%;
}

.fourcol {
width: 30.75%;
}

.fivecol {
width: 39.45%;
}

.sixcol {
width: 48%;
}

.sevencol {
width: 56.75%;
}

.eightcol {
width: 65.4%;
}

.ninecol{
width: 74.05%;
}

.tencol {
width: 82.7%;
}

.elevencol {
width: 91.35%;
}

.twelvecol {
width: 100%;
float: left;
}

.last {
margin-right: 0px;
}

img, object, embed {
max-width: 100%;
}

img {
height: auto;
}

.hidden{
display: none;
}
/* Smaller screens */

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

body {
font-size: 0.8em;
line-height: 1em;
width: 100%;
overflow-x: hidden;
}

.row, body, .container {
width: 100%;
min-width: 0;
margin-left: 0px;
margin-right: 0px;
padding-left: 0px;
padding-right: 0px;
}

}


/* Mobile */

@media handheld, only screen and (max-width: 767px) {

body {
font-size: 16px;
-webkit-text-size-adjust: none;
}

.row, body, .container, #WizardSteps, #Content  {
width: 100%;
min-width: 0;
margin-left: 0px;
margin-right: 0px;
padding-left: 0px;
padding-right: 0px;
}

.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol, .twelvecol {
width: auto;
float: none;
margin-left: 0px;
margin-right: 0px;
padding-left: 0px;
padding-right: 0px;
}

.hide-for-small{
  display: none;
}
}

/* -------------------------------- 

Primary style

-------------------------------- */
*, *::after, *::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

body {
  font-size: 1.6rem;
  font-family: 'Lato', 'Merriweather', sans-serif;
  color: #242424;
  background-color: #EDEDED;
  line-height: 1.5em;
}

@media only screen and (max-width: 1023px) {
  body.nav-on-left.overflow-hidden {
    overflow: hidden;
  }
}

a {
  color: #212437;
  text-decoration: none;
}

img {
  /* make images responsive */
  max-width: 100%;
}

input {
  font:normal 15px 'Lato', 'Merriweather',sans-serif;
  font-size: 1.6rem;
}

input[type="search"]::-ms-clear {
  /* removes close icon - IE */
  display: none;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none;
}

/* -------------------------------- 

COMMON ELEMENTS

-------------------------------- */
h2, h3, h4, .eventsCalendar-subtitle, .DetailHeading{
  margin: 0;
    display: block;
    border-bottom: 1px solid #666;
    color: #242424;
    font-weight: 500;
    text-transform: uppercase;
    font-family: 'Lato', 'Merriweather', sans-serif;
}
h2.subtitle, .eventsCalendar-subtitle, .DetailHeading{
  padding: 0 0 10px 0px;
  margin-top: 40px;
  margin-bottom: 15px;
  font-size: 1.4em;
}

.LoginPrompt > p > a{
  font-size: 1.2em;
  text-decoration: underline;
}

@media (min-width: 1023px) {
  h2.subtitle.first, .DetailHeading{
    margin-top: 0;
  }
}
h2.subtitle.first.orange{
}
h2.film-title{
  font-size: 1.4em;
  font-weight: 600;
  margin-top: 0;
}
h2 > small{
  font-size: 0.8em;
}
h3{
  padding: 0 0 2px 0;
  font-size: 0.8em;
}

p{
  font-weight: 300;
  font-size: 0.8em;
}

p > img{
  width: 100%;
}

#Detail.PerformanceList img{
  width: auto !important;
}

p > a > img{
  width: 100%;
}

.main-content{
  background: #fff;
  padding: 20px;
  box-shadow: 5px 5px 5px grey;
}

img.rating{
display: inline-block !important;
line-height: 1em;
height: 1em;
margin-left: 5px;
width: auto !important;}

/* -------------------------------- 

BUTTONS AND LINKS

-------------------------------- */
a {
  color: #212437;
  text-decoration: none;
}

.button, .Button{
  background: #212437 !important;
  color: #EDEDED !important;
  border: none;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  padding: 0.4em 0.2em;
  cursor: pointer;
  font-weight: 600;
  position: relative;
}
.button.baby{
  background: #6FCE72 !important;
}
.button.kids{
  background: #936fce !important;
}
.button.silver{
  background: #2890a5 !important;
}
.button.HOH{
  background: #009900 !important;
}
.button.supportive{
  background: #20b26c !important;
}
.film-times .button span{
  margin-right: 5px;
}
#Detail .Button{
  margin: 1em 0;
}

.ToolTip {
visibility:hidden;
opacity:0; /* http://www.greywyvern.com/?post=337 */
-webkit-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
-moz-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
-ms-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
-o-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
transition:visibility 0s linear 0.3s,opacity 0.3s linear;
opacity:0;
visibility:hidden;
position: absolute;
background: #333;
color: #EDEDED;
font-size: 10px;
border-radius: 5px;
padding: 5px;
width: 160px;
margin: 10px 0 0 3px;
z-index: 9;
line-height: 2em;
}
.ToolTip:before {
 border:5px solid transparent;
 border-right-color:#333;
 content:"";
 display:block;
 width:0;
 height:0;
 position:absolute;
 top:3px;
 left:-10px;
 z-index:2;
}
 .Tooltip{
visibility:hidden;
opacity:0; /* http://www.greywyvern.com/?post=337 */
-webkit-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
-moz-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
-ms-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
-o-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
transition:visibility 0s linear 0.3s,opacity 0.3s linear;
opacity:0;
visibility:hidden;
position: absolute;
background: #333;
color: #EDEDED;
font-size: 10px;
border-radius: 5px;
padding: 5px;
width: 200px;
margin: 10px 0 0 3px;
z-index: 9;
line-height: 2em;
}
 .ToolTip:before {
 border:5px solid transparent;
 border-right-color:#333;
 content:"";
 display:block;
 width:0;
 height:0;
 position:absolute;
 top:3px;
 left:-10px;
 z-index:2;
}
 .ToolTip{
margin-bottom: 20px;
}
.button:hover + .ToolTip {
visibility:visible;
opacity:1;
-webkit-transition-delay:0s;
-moz-transition-delay:0s;
-ms-transition-delay:0s;
-o-transition-delay:0s;
transition-delay:0s;
}
/* LINKS */
.link a:hover,
.link a:focus {
  outline: none;
}
.link a{
  position: relative;
  display: inline-block;
  outline: none;
  text-decoration: none;
  text-transform: uppercase;
}
.link.cl-effect-3 a::after{
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 2px;
  background: #212437;
  content: '';
  opacity: 0;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  -moz-transition: opacity 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  -webkit-transform: translateY(10px);
  -moz-transform: translateY(10px);
  transform: translateY(10px);
}

.link.cl-effect-3 a:hover::after,
.link.cl-effect-3 a:focus::after, .cl-effect-3 a.current::after {
  opacity: 1;
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  transform: translateY(0px);
}
.PrevNext{
  float: left;
  margin-top: 20px;
  width: 100%;
}
.PrevNext .BackButton{
  float: left;
}
.PrevNext .ContinueButton{
  float: right;
}

.view-all .button{
 float:right;
 margin: 0;
}
@media (max-width: 767px) {
 .view-all .button{
   width: 100%;
   display: block;
 }
}
/* -------------------------------- 
  FORM ELEMENTS
-------------------------------- */
.phoenix-secondary-nav section{
  float: left;
}
div.newsletter{
  margin-top: 20px;
  margin-bottom: 13px;
}
#banner div.newsletter{

}
.newsletter input.email{
  display: block;
  padding: 0.5em 1em;
  width: 100%;
  margin: 0.5em 0 0.5em 0;
}
.newsletter input.subscribe, .quick-book input.book{
  display: block;
  width: 98%;
  text-transform: none;
  font-weight: 300;
  margin:1%;
}
.button.submit{
  width: 100%;
  text-transform: none;
}
.input {
  position: relative;
  z-index: 1;
  display: inline-block;
  margin: 0 0 10px 0;
  width: calc(100%);
  vertical-align: top;
}

.input__field {
  position: relative;
  display: block;
  float: right;
  padding: 0.8em;
  width: 60%;
  border: none;
  border-radius: 0;
  background: #f0f0f0;
  color: #aaa;
  font-weight: 400;
  font-family: "Josefin Sans",sans-serif;
  -webkit-appearance: none; /* for box shadows to show on iOS */
}

.input__field:focus {
  outline: none;
}

.input__label {
  display: inline-block;
  float: right;
  padding: 0 1em;
  width: 40%;
  color: #696969;
  font-weight: bold;
  font-size: 70.25%;
  -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.input__label-content {
  position: relative;
  display: block;
  padding: 1.6em 0;
  width: 100%;
}

.input--chisato {
  padding-top: 1em;
}

.input__field--chisato {
  width: 100%;
  padding: 0.8em 0.5em;
  background: transparent;
  border: 1px solid;
  color: #000;
  -webkit-transition: border-color 0.25s;
  transition: border-color 0.25s;
}

.input__label--chisato {
  width: 100%;
  position: absolute;
  top: 0;
  text-align: left;
  overflow: hidden;
  padding: 0;
  pointer-events: none;
  -webkit-transform: translate3d(0, 3em, 0);
  transform: translate3d(0, 3em, 0);
}

.input__label-content--chisato {
  padding: 0 1em;
  font-weight: 400;
  color: #b5b5b5;
}

.input__label-content--chisato::after {
  content: attr(data-content);
  position: absolute;
  top: -200%;
  left: 0;
  color: #212437;
  font-weight: 800;
}

.input__field--chisato:focus,
.input--filled .input__field--chisato {
  border-color: #212437;
}

.input__field--chisato:focus + .input__label--chisato,
.input--filled .input__label--chisato {
  -webkit-animation: anim-chisato-1 0.25s forwards;
  animation: anim-chisato-1 0.25s forwards;
}

.input__field--chisato:focus + .input__label--chisato .input__label-content--chisato,
.input--filled .input__label-content--chisato {
  -webkit-animation: anim-chisato-2 0.25s forwards ease-in;
  animation: anim-chisato-2 0.25s forwards ease-in;
}

.input select{
  position: relative;
  display: block;
  float: left;
  padding: 0.8em;
  width: 100%;
  border: none;
  border-radius: 0;
  background: #EDEDED;
  color: #aaa;
  font-weight: 400;
  border: solid 1px #CCC;
  font-family: "Josefin Sans",sans-serif;
  -webkit-appearance: none; /* for box shadows to show on iOS */
}
@-webkit-keyframes anim-chisato-1 {
  0%, 70% {
    -webkit-transform: translate3d(0, 3em, 0);
    transform: translate3d(0, 3em, 0);
  }
  71%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes anim-chisato-2 {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  70%, 71% {
    -webkit-transform: translate3d(0, 125%, 0);
    transform: translate3d(0, 125%, 0);
    opacity: 0;
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    color: transparent;
    -webkit-transform: translate3d(0, 200%, 0);
    transform: translate3d(0, 200%, 0);
  }
}

@keyframes anim-chisato-1 {
  0%, 70% {
    -webkit-transform: translate3d(0, 3em, 0);
    transform: translate3d(0, 3em, 0);
  }
  71%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes anim-chisato-2 {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  70%, 71% {
    -webkit-transform: translate3d(0, 125%, 0);
    transform: translate3d(0, 125%, 0);
    opacity: 0;
    -webkit-animation-timing-function: ease-out;
  }
  100% {
    color: transparent;
    -webkit-transform: translate3d(0, 200%, 0);
    transform: translate3d(0, 200%, 0);
  }
}

.newsletter  input[type="text"], .newsletter  input[type="email"]{
  margin: 1%;
  padding: 2%;
}
.newsletter  input#Forename, .newsletter input#Surname {
  width: 48%;
  float: left;
}
.newsletter  input#EmailAddress {
  width: 98%;
}

/* ---------------------------------------------------------
  OSCAR FORM ELEMENTS
----------------------------------------------------------*/
@media (min-width: 1023px) {
  #Detail{
     min-height: 600px;
  }
}

#Detail input[type=text], #Detail input[type=password], #Detail input[type=email]{
  position: relative;
  z-index: 1;
  display: inline-block;
  margin: 5px 0;
  width: 100%;
  vertical-align: top;
  background: #F0F0F0;
  border: solid 1px #CCC;;
  padding: 0.5em;
}
#Detail input[type=text]:focus, input[type=password]:focus, input[type=email]:focus{
  border: solid 1px #2672EC;
  background: #EFEFEF;
}
#Detail select{
  position: relative;
  z-index: 1;
  display: inline-block;
  margin: 5px 0;
  width: 100%;
  vertical-align: top;
  background: #F0F0F0;
  border: solid 1px #CCC;;
  padding: 0.5em;
}
#Detail ::-webkit-input-placeholder, #Detail input:-moz-placeholder, #Detail ::-moz-placeholder, #Detail :-ms-input-placeholder {
  color:#CCC;
  font-style: italic;
}
#Detail label.SelectLabel, #Detail label.TextLabel {
  display: block;
  padding: 0;
  width: 100%;
  color: #696969;
  font-weight: bold;
  font-size: 70.25%;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
#Detail .PersonType select{
  width: 100%;
  max-width: 100px;
}
#Detail .DetailSubHeading, #Detail .EditPatronHeading{
  clear: both;
  display: block;
  padding-bottom: 10px;
  font-style: normal;
  line-height: 1.17em;
  margin: 5px 0px 10px;
  font-size: 0.8em;
  text-transform: uppercase;
  font-weight: 400;
  margin-top: 20px;
}
#Detail .EditPatronHeading{
  margin-top: 40px;
}
#Detail .InlineValidationMessage{
  font-size: 0.8em;
  color: #EDEDED;
  background: #990000;
  width: 100%;
  position: relative;
  top: -5px;
  padding: 3px;
}
@media (max-width: 767px) {
  #Detail label.SelectLabel, #Detail label.TextLabel {
    text-align: right;
    font-size: 1.2em;
    line-height: 2.5em;
    margin-right: 10px;
  }
#Detail #CardMMYY .sixcol{
  float: left; width: 45%;
}
#Detail #CardMMYY .sixcol.last{
  float: right; width: 45%;
}
}

#Detail .DateInputLabel {
  display: inline;
}
#Detail .PaymentPageSeparator {
  margin-bottom: 10px; clear: both;
}
@media (min-width: 767px) {
  #Detail .ToolTip {
    visibility:hidden;
    opacity:0; /* http://www.greywyvern.com/?post=337 */
    -webkit-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    -moz-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    -ms-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    -o-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    opacity:0;
    visibility:hidden;
    position: absolute;
    background: #333;
    color: #EDEDED;
    font-size: 10px;
    border-radius: 5px;
    padding: 5px;
    width: 160px;
    margin: 10px 0 0 3px;
    z-index: 9;
    line-height: 2em;
  }
  #Detail .ToolTip:before {
     border:5px solid transparent;
     border-right-color:#333;
     content:"";
     display:block;
     width:0;
     height:0;
     position:absolute;
     top:3px;
     left:-10px;
     z-index:2;
  }
  #Detail .ClickPayOnce{
    visibility:hidden;
    opacity:0; /* http://www.greywyvern.com/?post=337 */
    -webkit-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    -moz-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    -ms-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    -o-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    transition:visibility 0s linear 0.3s,opacity 0.3s linear;
    opacity:0;
    visibility:hidden;
    position: absolute;
    background: #333;
    color: #EDEDED;
    font-size: 10px;
    border-radius: 5px;
    padding: 5px;
    width: 200px;
    margin: 10px 0 0 3px;
    z-index: 9;
    line-height: 2em;
  }
  #Detail .ClickPayOnce:before {
     border:5px solid transparent;
     border-right-color:#333;
     content:"";
     display:block;
     width:0;
     height:0;
     position:absolute;
     top:3px;
     left:-10px;
     z-index:2;
  }
  #Detail .ConfirmAndPay{
    margin-bottom: 20px;
  }
/*  #Detail input#confirm:hover + .ClickPayOnce, #Detail input#confirm:active + .ClickPayOnce, #Detail input#confirm:focus + .ClickPayOnce, #Detail input:focus + .ToolTip {
    visibility:visible;
    opacity:1;
    -webkit-transition-delay:0s;
    -moz-transition-delay:0s;
    -ms-transition-delay:0s;
    -o-transition-delay:0s;
    transition-delay:0s;
  }
*/
}
@media (max-width: 766px) {
  #Detail .ToolTip {
    position: relative;
    background: #333;
    color: #EDEDED;
    font-size: 10px;
    border-radius: 0 0 5px 5px;
    padding: 5px;
    width: 100%;
    margin: -5px 0 10px 0;
    z-index: 9;
    line-height: 2em;
  }

  #Detail input:focus + .ToolTip {
    display: block;
  }

  #Detail .ClickPayOnce{
    display: block;
    position: relative;
    background: #333;
    color: #EDEDED;
    font-size: 10px;
    border-radius: 5px 5px;
    padding: 5px;
    width: 100%;
    margin: -5px 0 10px 0;
    z-index: 9;
    line-height: 2em;
  }
}
#Detail .MaestroSolo{
  background: #F0F0F0;
  padding: 10px;}
#Detail .MaestroSolo input{

}
@media (max-width: 767px) {
  #Detail label.SelectLabel, #Detail label.TextLabel {
    display: none;
  }
  #Detail .ToolTip {
    display: none;
  }
}
#Detail .PersonType select{
  max-width: 100px;
}
#Detail .PersonType .PersonTypeDescription{
  font-size: 1em;
  display: inline-block;
  width: 50%;
  line-height: 1.2em;
  margin-left: 10px;
  line-height: 3em;
}
@media (max-width: 767px) {
  #Detail .PersonType select{
    max-width: 100px;
  }
  #Detail .PersonType .PersonTypeDescription{
    font-size: 1em;
    display: inline-block;
    width: 50%;
    line-height: 1.2em;
  }
}
.EditPatronHeading:before, .clearfix:after { content: ''; display: table; }
.EditPatronHeading:after { clear: both; }

#Detail .checkbox:focus, #Detail .radio:focus, #Detail input[type="checkbox"]:focus, #Detail input[type="radio"]:focus { outline:1px dotted #36393b; }

DIV.ProgrammeLink{ font-size: 12pt; font-weight: bold; padding-top: 10px; }
SPAN.Rating{ font-size: 12pt; font-weight: bold; }

SPAN.PerformanceNotesSmall{
  font-size: 8pt;
  white-space: nowrap;
  display: block;
}

SPAN.PerformanceStatusSmall{
  font-size: 8pt;
  white-space: nowrap;
}

SPAN.ConditionsOfEntry{
  font-size: 8pt;
  white-space: nowrap;
}

DIV.PersonType{ padding-top: 6px; }
DIV.SeatType{ padding-top: 20px; font-size: 12pt; font-weight: bold; }

DIV.PerformanceDate { padding-top: 5px; font-size: 12pt; font-weight: bold; }
SPAN.PerformanceEndTime { font-size: 8pt; font-weight: normal; }
SPAN.PerformanceSection { font-size: 12pt; font-weight: bold; }
DIV.PerformanceStatus { padding-top: 15px; font-size: 12pt; font-weight: bold; }

DIV.SaleItem{ min-height: 30px; padding: 5px; }
TD.SaleItemDescription{ width: 150px; }
TD.SaleItemPromptText{ padding-right: 5px; width: 30px; text-align: right; }
TD.SaleItemInput{ padding-right: 5px; }
TD.SaleItemPriceText{ }

/* -------------------------------- 

Main components 

-------------------------------- */
.phoenix-main-content, .phoenix-main-header {
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  will-change: transform;
}

.phoenix-main-content, .phoenix-main-header {
  position: relative;
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}
ul.phoenix-header-social{
  position: absolute;
  top: 1.5em;
  right: 0;
}
ul.phoenix-header-social li{
  display: inline;
}
ul.phoenix-header-social li a span{
  padding: 0.5em;
  background: #212437;
  color: #EDEDED;
  margin-left: 3px;
}
@media only screen and (max-width: 1023px) {
  .phoenix-main-content.nav-is-visible, .phoenix-main-header.nav-is-visible {
    -webkit-transform: translateX(-260px);
    -moz-transform: translateX(-260px);
    -ms-transform: translateX(-260px);
    -o-transform: translateX(-260px);
    transform: translateX(-260px);
  }
  .nav-on-left .phoenix-main-content.nav-is-visible, .nav-on-left .phoenix-main-header.nav-is-visible {
    -webkit-transform: translateX(260px);
    -moz-transform: translateX(260px);
    -ms-transform: translateX(260px);
    -o-transform: translateX(260px);
    transform: translateX(260px);
  }
  ul.phoenix-header-social{
  top: 1em;
  right: 180px;
  }
}
@media (max-width: 480px) {
  ul.phoenix-header-social{
  display: none;
  }
}

.phoenix-main-content {
  z-index: 2;
  display: block;
  margin: 0 auto;
  max-width: 1140px;
  padding: 10px 0;
}

.phoenix-main-header {
  font-family: 'Lato', 'Josefin Sans',sans-serif;
  height: 50px;
  z-index: 3;
  max-width: 1140px;
  text-transform: uppercase;
}
.nav-is-fixed .phoenix-main-header {
  /* add .nav-is-fixed class to body if you want a fixed navigation on > 1024px */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}
@media only screen and (min-width: 1024px) {
  .phoenix-main-header {
    height: 140px;
  }
  .phoenix-main-header:after {
    content: "";
    display: table;
    clear: both;
  }
}

.phoenix-logo {
  position: absolute;
  top: 5px;
  left: 5%;
}
.phoenix-logo img {
  display: block;
  height: 50px;
}
@media only screen and (max-width: 1023px) {
  .nav-on-left .phoenix-logo {
    left: auto;
    right: 5%;
  }
}
@media only screen and (min-width: 1024px) {
  .phoenix-logo {
    top: 10px;
    left: 0px;
  }
  .phoenix-logo img {
    height: 120px;
  }
}

.phoenix-header-buttons {
  position: absolute;
  display: inline-block;
  top: 3px;
  right: 5%;
}
.phoenix-header-buttons li {
  display: inline-block;
}
@media only screen and (max-width: 1023px) {
  .nav-on-left .phoenix-header-buttons {
    right: auto;
    left: 5%;
  }
  .nav-on-left .phoenix-header-buttons li {
    float: right;
  }
}
@media only screen and (min-width: 1024px) {
  .phoenix-header-buttons {
    top: 100px;
    right: 0;
  }
}

.phoenix-search-trigger, .phoenix-nav-trigger, .phoenix-basket-trigger {
  position: relative;
  display: block;
  width: 44px;
  height: 44px;
  overflow: hidden;
  white-space: nowrap;
  /* hide text */
  color: transparent;
  z-index: 3;
}

.phoenix-search-trigger::before, .phoenix-search-trigger::after, .phoenix-search-trigger::after  {
  /* search icon */
  content: '';
  position: absolute;
  -webkit-transition: opacity 0.3s;
  -moz-transition: opacity 0.3s;
  transition: opacity 0.3s;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.phoenix-search-trigger::before, .phoenix-basket-trigger::before {
  /* lens */
  top: 11px;
  left: 11px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 3px solid #212437;
}
.phoenix-search-trigger::after, .phoenix-basket-trigger::after {
  /* handle */
  height: 3px;
  width: 8px;
  background: #212437;
  bottom: 14px;
  right: 11px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.phoenix-search-trigger span, .phoenix-basket-trigger span {
  /* container for the X icon */
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
.phoenix-search-trigger span::before, .phoenix-search-trigger span::after , .phoenix-basket-trigger span::after {
  /* close icon */
  content: '';
  position: absolute;
  display: inline-block;
  height: 3px;
  width: 22px;
  top: 50%;
  margin-top: -2px;
  left: 50%;
  margin-left: -11px;
  background: #FFF;
  opacity: 0;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  -moz-transition: opacity 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
}
.phoenix-basket-trigger{
  text-align: center;
}
.phoenix-basket-trigger span{
  color: #EDEDED;
  font-size: 1.4em;
  line-height: 2em;
}
.phoenix-search-trigger span::before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.phoenix-search-trigger span::after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.phoenix-search-trigger.search-is-visible::before, .phoenix-search-trigger.search-is-visible::after {
  /* hide search icon */
  opacity: 0;
}
.phoenix-search-trigger.search-is-visible span::before, .phoenix-search-trigger.search-is-visible span::after {
  /* show close icon */
  opacity: 1;
}
.phoenix-search-trigger.search-is-visible span::before {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}
.phoenix-search-trigger.search-is-visible span::after {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.phoenix-nav-trigger span, .phoenix-nav-trigger span::before, .phoenix-nav-trigger span::after {
  /* hamburger icon in CSS */
  position: absolute;
  display: inline-block;
  height: 3px;
  width: 24px;
  background: #000;
}
.phoenix-nav-trigger span {
  /* line in the center */
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -2px;
  -webkit-transition: background 0.3s 0.3s;
  -moz-transition: background 0.3s 0.3s;
  transition: background 0.3s 0.3s;
}
.phoenix-nav-trigger span::before, .phoenix-nav-trigger span::after {
  /* other 2 lines */
  content: '';
  right: 0;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-origin: 0% 50%;
  -moz-transform-origin: 0% 50%;
  -ms-transform-origin: 0% 50%;
  -o-transform-origin: 0% 50%;
  transform-origin: 0% 50%;
  -webkit-transition: -webkit-transform 0.3s 0.3s;
  -moz-transition: -moz-transform 0.3s 0.3s;
  transition: transform 0.3s 0.3s;
}
.phoenix-nav-trigger span::before {
  /* menu icon top line */
  top: -6px;
}
.phoenix-nav-trigger span::after {
  /* menu icon bottom line */
  top: 6px;
}
.phoenix-nav-trigger.nav-is-visible span {
  /* hide line in the center */
  background: rgba(46, 50, 51, 0);
}
.phoenix-nav-trigger.nav-is-visible span::before, .phoenix-nav-trigger.nav-is-visible span::after {
  /* keep visible other 2 lines */
  background: #EDEDED;
}
.phoenix-nav-trigger.nav-is-visible span::before {
  -webkit-transform: translateX(4px) translateY(-3px) rotate(45deg);
  -moz-transform: translateX(4px) translateY(-3px) rotate(45deg);
  -ms-transform: translateX(4px) translateY(-3px) rotate(45deg);
  -o-transform: translateX(4px) translateY(-3px) rotate(45deg);
  transform: translateX(4px) translateY(-3px) rotate(45deg);
}
.phoenix-nav-trigger.nav-is-visible span::after {
  -webkit-transform: translateX(4px) translateY(2px) rotate(-45deg);
  -moz-transform: translateX(4px) translateY(2px) rotate(-45deg);
  -ms-transform: translateX(4px) translateY(2px) rotate(-45deg);
  -o-transform: translateX(4px) translateY(2px) rotate(-45deg);
  transform: translateX(4px) translateY(2px) rotate(-45deg);
}
@media only screen and (min-width: 1024px) {
  .phoenix-nav-trigger {
    display: none;
  }
}

.phoenix-primary-nav, .phoenix-primary-nav ul {
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: 260px;
  background: #242424;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  z-index: 2;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}
.phoenix-primary-nav a, .phoenix-primary-nav ul a {
  display: block;
  height: 50px;
  line-height: 50px;
  padding: 0 20px;
  color: #EDEDED;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-bottom: 1px solid #3a3f40;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  will-change: transform, opacity;
  -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
  -moz-transition: -moz-transform 0.3s, opacity 0.3s;
  transition: transform 0.3s, opacity 0.3s;
}
.phoenix-primary-nav.is-hidden, .phoenix-primary-nav ul.is-hidden {
  /* secondary navigations hidden by default */
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
}
.phoenix-primary-nav.moves-out > li > a, .phoenix-primary-nav ul.moves-out > li > a {
  /* push the navigation items to the left - and lower down opacity - when secondary nav slides in */
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  transform: translateX(-100%);
  opacity: 0;
}

@media only screen and (max-width: 1023px) {
  .nav-on-left .phoenix-primary-nav, .nav-on-left .phoenix-primary-nav ul {
    right: auto;
    left: 0;
  }
}
.phoenix-primary-nav .see-all a {
  /* different style for the See all button on mobile and tablet */
  color: #212437;
}
.phoenix-primary-nav .phoenix-nav-gallery .phoenix-nav-item, .phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item {
  /* items with picture (or icon) and title */
  height: 100px;
  line-height: 100px;
}
.phoenix-primary-nav .phoenix-nav-gallery .phoenix-nav-item h3, .phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item h3 {
  overflow: hidden;
  text-overflow: ellipsis;
}
.phoenix-primary-nav .phoenix-nav-gallery .phoenix-nav-item {
  padding-left: 90px;
}
.phoenix-primary-nav .phoenix-nav-gallery .phoenix-nav-item img {
  position: absolute;
  display: block;
  height: 40px;
  width: auto;
  left: 20px;
  top: 50%;
  margin-top: -20px;
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item {
  padding-left: 75px;
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item p {
  color: #242424;
  font-size: 1.3rem;
  /* hide description on small devices */
  display: none;
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item::before {
  /* item icon */
  content: '';
  display: block;
  position: absolute;
  left: 20px;
  top: 50%;
  margin-top: -20px;
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 40px 40px;
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item.item-1::before {
  background-image: url("../img/line-icon-1.svg");
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item.item-2::before {
  background-image: url("../img/line-icon-2.svg");
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item.item-3::before {
  background-image: url("../img/line-icon-3.svg");
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item.item-4::before {
  background-image: url("../img/line-icon-4.svg");
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item.item-5::before {
  background-image: url("../img/line-icon-5.svg");
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item.item-6::before {
  background-image: url("../img/line-icon-6.svg");
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item.item-7::before {
  background-image: url("../img/line-icon-7.svg");
}
.phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item.item-8::before {
  background-image: url("../img/line-icon-8.svg");
}
@media only screen and (max-width: 1023px) {
  .phoenix-primary-nav {
    /* by default .phoenix-primary-nav is hidden - trick for iOS devices where you can see the navigation if you pull down */
    visibility: hidden;
    -webkit-transition: visibility 0s 0.3s;
    -moz-transition: visibility 0s 0.3s;
    transition: visibility 0s 0.3s;
  }
  .phoenix-primary-nav.nav-is-visible {
    visibility: visible;
    -webkit-transition: visibility 0s 0s;
    -moz-transition: visibility 0s 0s;
    transition: visibility 0s 0s;
  }
}

@media only screen and (min-width: 1024px) {
  .phoenix-primary-nav {
  position: static;
  padding: 0px 2em 0px 2em;
  float: right;
  overflow: visible;
  max-width: 1140px;
  margin-top: 140px;
  height: 50px;
  background: rgb(33, 36, 55) none repeat scroll 0% 0%;
  width: 100%;
  }
  .phoenix-primary-nav:after {
    content: "";
    display: table;
    clear: both;
  }
  .phoenix-primary-nav.moves-out > li > a {
    /* reset mobile style */
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  .phoenix-primary-nav ul {
    position: static;
    height: auto;
    width: auto;
    background: transparent;
    overflow: visible;
    z-index: 3;
  }
  .phoenix-primary-nav ul.is-hidden {
    /* reset mobile style */
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
  .phoenix-primary-nav ul.moves-out > li > a {
    /* reset mobile style */
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  .phoenix-primary-nav > li {
    float: left;
    /*margin-left: 1em;*/
  }
  .phoenix-primary-nav > li > a {
    /* main navigation buttons style */
    position: relative;
    display: inline-block;
    height: 50px;
    line-height: 50px;
  padding: 0 25px;
    color: #EDEDED;
    overflow: visible;
    border-bottom: none;
    -webkit-transition: color 0.3s, box-shadow 0.3s;
    -moz-transition: color 0.3s, box-shadow 0.3s;
    transition: color 0.3s, box-shadow 0.3s;
  }
  .phoenix-primary-nav > li > a:hover, .phoenix-primary-nav > li > a.active {
    background: #EDEDED;
    color: #212437;
  }
  .phoenix-primary-nav > li > a.selected {
    background: #EDEDED;
    color: #212437;
  }
  .phoenix-primary-nav .go-back, .phoenix-primary-nav .see-all {
    display: none;
  }
  .phoenix-primary-nav .phoenix-secondary-nav, .phoenix-primary-nav .phoenix-nav-gallery, .phoenix-primary-nav .phoenix-nav-icons {
    /* dropdown menu style */
    position: absolute;
    top: 50px;
    width: 100vw;
  max-width: 1140px;
    background: #EDEDED;
    padding: 48px 64px 130px;
    box-shadow: inset 0 1px 0 #212437, 0 3px 6px rgba(0, 0, 0, 0.05);
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: opacity .3s 0s, visibility 0s 0s;
    -moz-transition: opacity .3s 0s, visibility 0s 0s;
    transition: opacity .3s 0s, visibility 0s 0s;
  }
  .phoenix-primary-nav .phoenix-secondary-nav:after, .phoenix-primary-nav .phoenix-nav-gallery:after, .phoenix-primary-nav .phoenix-nav-icons:after {
    content: "";
    display: table;
    clear: both;
  }
  .phoenix-primary-nav .phoenix-secondary-nav.is-hidden, .phoenix-primary-nav .phoenix-nav-gallery.is-hidden, .phoenix-primary-nav .phoenix-nav-icons.is-hidden {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity .3s 0s, visibility 0s .3s;
    -moz-transition: opacity .3s 0s, visibility 0s .3s;
    transition: opacity .3s 0s, visibility 0s .3s;
  }
  .phoenix-primary-nav .phoenix-secondary-nav > .see-all, .phoenix-primary-nav .phoenix-nav-gallery > .see-all, .phoenix-primary-nav .phoenix-nav-icons > .see-all {
    /* this is the BIG See all button at the bottom of the dropdown menu */
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 100px;
    width: 100%;
    overflow: hidden;
    /* reset some inherited style */
    margin: 0;
    padding: 0;
  }
  .phoenix-primary-nav .phoenix-secondary-nav > .see-all a, .phoenix-primary-nav .phoenix-nav-gallery > .see-all a, .phoenix-primary-nav .phoenix-nav-icons > .see-all a {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    font-size: 2.2rem;
    font-weight: bold;
    text-align: center;
    line-height: 100px;
    border-top: 1px solid #212437;
    /* reset some inherited style */
    border-bottom: none;
    margin: 0;
    padding: 0;
    -webkit-transition: color 0.2s, background 0.2s, border 0.2s;
    -moz-transition: color 0.2s, background 0.2s, border 0.2s;
    transition: color 0.2s, background 0.2s, border 0.2s;
  }
  .phoenix-primary-nav .phoenix-secondary-nav > .see-all a:hover, .phoenix-primary-nav .phoenix-nav-gallery > .see-all a:hover, .phoenix-primary-nav .phoenix-nav-icons > .see-all a:hover {
    background: #cdc8cc;
    border-color: #cdc8cc;
    color: #EDEDED;
  }
  .phoenix-primary-nav .phoenix-secondary-nav > li {
    /* change the height according to your needs - you can even set height: auto */
    height: auto;
    /* here you set the number of columns - use width percentage */
    width: 23%;
    float: left;
    margin-right: 2.66%;
    border-right: 1px solid #212437;
    overflow: hidden;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .phoenix-primary-nav .phoenix-secondary-nav > li:nth-child(4n+2) {
    /* +2 because we have 2 list items with display:none */
    margin-right: 0;
    border-right: none;
  }
  .phoenix-primary-nav .phoenix-secondary-nav > li > a {
    /* secondary nav title */
    color: #212437;
    font-weight: bold;
    font-size: 1.6rem;
    margin-bottom: .6em;
  }
  .phoenix-primary-nav .phoenix-secondary-nav a {
    height: 30px;
    line-height: 30px;
    padding: 0 18% 0 0;
    color: #242424;
    border-bottom: none;
    font-size: 1.4rem;
  }
  .phoenix-primary-nav .phoenix-secondary-nav a:hover {
    color: #212437;
  }
  .phoenix-primary-nav .phoenix-secondary-nav ul {
    /* Force Hardware Acceleration in WebKit */
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
  }
  .phoenix-primary-nav .phoenix-secondary-nav ul ul {
    /* tertiary navigation */
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
  }
  .phoenix-primary-nav .phoenix-secondary-nav ul ul.is-hidden {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
  }
  .phoenix-primary-nav .phoenix-secondary-nav ul ul .go-back {
    display: block;
  }
  .phoenix-primary-nav .phoenix-secondary-nav ul ul .go-back a {
    color: transparent;
  }
  .phoenix-primary-nav .phoenix-secondary-nav ul ul .see-all {
    display: block;
  }
  .phoenix-primary-nav .phoenix-secondary-nav .moves-out > li > a {
    /* push the navigation items to the left - and lower down opacity - when tertiary nav slides in */
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  .phoenix-primary-nav .phoenix-nav-gallery li {
    /* set here number of columns - use width percentage */
    width: 22%;
    float: left;
    margin: 0 4% 40px 0;
  }
  .phoenix-primary-nav .phoenix-nav-gallery li:nth-child(4n+2) {
    /* +2 because we have two additional list items with display:none */
    margin-right: 0;
  }
  .phoenix-primary-nav .phoenix-nav-gallery .phoenix-nav-item {
    border-bottom: none;
    padding: 0;
    height: auto;
    line-height: 1.2;
  }
  .phoenix-primary-nav .phoenix-nav-gallery .phoenix-nav-item img {
    position: static;
    margin-top: 0;
    height: auto;
    width: 100%;
    margin-bottom: .6em;
  }
  .phoenix-primary-nav .phoenix-nav-gallery .phoenix-nav-item h3 {
    color: #212437;
    font-weight: bold;
    padding: 0 .4em;
  }
  .phoenix-primary-nav .phoenix-nav-icons li {
    /* set here number of columns - use width percentage */
    width: 32%;
    float: left;
    margin: 0 2% 20px 0;
  }
  .phoenix-primary-nav .phoenix-nav-icons li:nth-child(3n+2) {
    /* +2 because we have two additional list items with display:none */
    margin-right: 0;
  }
  .phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item {
    border-bottom: none;
    height: 100px;
    line-height: 1.2;
    padding: 24px 0 0 85px;
  }
  .phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item:hover {
    background: #f6f6f5;
  }
  .phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item h3 {
    color: #212437;
    font-weight: bold;
  }
  .phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item p {
    display: block;
  }
  .phoenix-primary-nav .phoenix-nav-icons .phoenix-nav-item::before {
    left: 25px;
  }
}
.has-children > a, .go-back a {
  position: relative;
}
.has-children > a::before, .has-children > a::after, .go-back a::before, .go-back a::after {
  /* arrow icon in CSS - for element with nested unordered lists */
  content: '';
  position: absolute;
  top: 50%;
  margin-top: -1px;
  display: inline-block;
  height: 2px;
  width: 10px;
  background: #212437;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.has-children > a::before, .go-back a::before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.has-children > a::after, .go-back a::after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
@media only screen and (min-width: 1024px) {
  .has-children > a::before, .has-children > a::after, .go-back a::before, .go-back a::after {
    background: #EDEDED;
  }
  .has-children > a:hover::before, .has-children > a:hover::after, .go-back a:hover::before, .go-back a:hover::after {
    background: #212437;
  }
}

.has-children > a {
  padding-right: 40px;
}
.has-children > a::before, .has-children > a::after {
  /* arrow goes on the right side - children navigation */
  right: 20px;
  -webkit-transform-origin: 9px 50%;
  -moz-transform-origin: 9px 50%;
  -ms-transform-origin: 9px 50%;
  -o-transform-origin: 9px 50%;
  transform-origin: 9px 50%;
}

.phoenix-primary-nav .go-back a {
  padding-left: 40px;
}
.phoenix-primary-nav .go-back a::before, .phoenix-primary-nav .go-back a::after {
  /* arrow goes on the left side - go back button */
  left: 20px;
  -webkit-transform-origin: 1px 50%;
  -moz-transform-origin: 1px 50%;
  -ms-transform-origin: 1px 50%;
  -o-transform-origin: 1px 50%;
  transform-origin: 1px 50%;
}

@media only screen and (min-width: 1024px) {
  .has-children > a::before, .has-children > a::after {
    right: 15%;
  }

  .phoenix-primary-nav > .has-children > a {
    /* main navigation arrows on larger devices */
  }
  .phoenix-primary-nav > .has-children > a::before, .phoenix-primary-nav > .has-children > a::after {
    width: 9px;
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    background: #c9cbc4;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: width 0.3s, -webkit-transform 0.3s;
    -moz-transition: width 0.3s, -moz-transform 0.3s;
    transition: width 0.3s, transform 0.3s;
  }
  .phoenix-primary-nav > .has-children > a::before {
    right: 12px;
    display: none;
  }
  .phoenix-primary-nav > .has-children > a::after {
    right: 7px;
    display: none;
  }
  .phoenix-primary-nav > .has-children > a.selected::before, .phoenix-primary-nav > .has-children > a.selected::after {
    width: 14px;
  }
  .phoenix-primary-nav > .has-children > a.selected::before {
    -webkit-transform: translateX(5px) rotate(-45deg);
    -moz-transform: translateX(5px) rotate(-45deg);
    -ms-transform: translateX(5px) rotate(-45deg);
    -o-transform: translateX(5px) rotate(-45deg);
    transform: translateX(5px) rotate(-45deg);
  }
  .phoenix-primary-nav > .has-children > a.selected::after {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  .phoenix-secondary-nav > .has-children > a::before, .phoenix-secondary-nav > .has-children > a::after {
    /* remove arrows on secondary nav titles */
    display: none;
  }

  .phoenix-primary-nav .go-back a {
    padding-left: 20px;
  }
  .phoenix-primary-nav .go-back a::before, .phoenix-primary-nav .go-back a::after {
    left: 1px;
  }
}
.phoenix-search {
  position: absolute;
  height: 50px;
  width: 100%;
  margin: 0 auto;
  top: 50px;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  z-index: 3;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
}
.phoenix-search form {
  height: 100%;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
}
.phoenix-search input {
  border-radius: 0;
  border: none;
  background: #ffffff;
  height: 100%;
  width: 100%;
  padding: 0 5%;
  box-shadow: inset 0 1px 0 #212437, 0 3px 6px rgba(0, 0, 0, 0.05);
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
}
.phoenix-search input::-webkit-input-placeholder {
  color: #c9cbc4;
}
.phoenix-search input::-moz-placeholder {
  color: #c9cbc4;
}
.phoenix-search input:-moz-placeholder {
  color: #c9cbc4;
}
.phoenix-search input:-ms-input-placeholder {
  color: #c9cbc4;
}
.phoenix-search input:focus {
  outline: none;
}
.phoenix-search.is-visible {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.nav-is-fixed .phoenix-search {
  position: fixed;
}
@media only screen and (min-width: 1024px) {
  .phoenix-search {
    height: 120px;
    top: 140px;
  }
  .phoenix-search input {
    padding: 0 2em;
    font-size: 3.2rem;
    font-weight: 300;
  }
}

.phoenix-overlay {
  /* shadow layer visible when navigation is active */
  position: fixed;
  z-index: 2;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.6);
  visibility: hidden;
  opacity: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s, -webkit-transform 0.3s 0s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s, -moz-transform 0.3s 0s;
  transition: opacity 0.3s 0s, visibility 0s 0.3s, transform 0.3s 0s;
}
.phoenix-overlay.is-visible {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.3s 0s, visibility 0s 0s, -webkit-transform 0.3s 0s;
  -moz-transition: opacity 0.3s 0s, visibility 0s 0s, -moz-transform 0.3s 0s;
  transition: opacity 0.3s 0s, visibility 0s 0s, transform 0.3s 0s;
}
@media only screen and (max-width: 1023px) {
  .phoenix-overlay.is-visible {
    -webkit-transform: translateX(-260px);
    -moz-transform: translateX(-260px);
    -ms-transform: translateX(-260px);
    -o-transform: translateX(-260px);
    transform: translateX(-260px);
  }
  .nav-on-left .phoenix-overlay.is-visible {
    -webkit-transform: translateX(260px);
    -moz-transform: translateX(260px);
    -ms-transform: translateX(260px);
    -o-transform: translateX(260px);
    transform: translateX(260px);
  }
  .phoenix-overlay.is-visible.search-is-visible, .nav-on-left .phoenix-overlay.is-visible.search-is-visible {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}

/* -------------------------------- 

support for no js 

-------------------------------- */
.no-js .phoenix-primary-nav {
  position: relative;
  height: auto;
  width: 100%;
  overflow: visible;
  visibility: visible;
  z-index: 2;
}

.no-js .phoenix-search {
  position: relative;
  top: 0;
  opacity: 1;
  visibility: visible;
}

@media only screen and (min-width: 1024px) {
  .no-js .phoenix-primary-nav {
    position: absolute;
    z-index: 3;
    display: inline-block;
    width: auto;
    top: 0;
    right: 150px;
    padding: 0;
  }

  .no-js .nav-is-fixed .phoenix-primary-nav {
    position: fixed;
  }
}

/* -------------------------------- 

HOME CAROUSEL 1
-------------------------------- */

#home-carousel{
  margin: 0;
}

#home-carousel .item img.show-image{
  display: block;
  width: 100%;
  height: auto;
}
#bar{
  width: 0%;
  max-width: 100%;
  height: 4px;
  background: #212437;
}
#progressBar{
  width: 100%;
  background: #EDEDED;
}
#home-carousel .grid.large figure {
  max-height: 360px;
  width: 100%;
}
.grid.large figure.effect-julia p {
  transform: none;
  clear: both;
}
#home-carousel figcaption{
  height: 30%;
  bottom: 20%;
}

/* -------------------------------- 

  BOX GRID
-------------------------------- */

.grid {
  position: relative;
  clear: both;
  padding: 0;
  max-width: 1000px;
  list-style: none;
  text-align: center;
}

/* Common style all left displays */
.grid figure {
  position: relative;
  float: left;
  overflow: hidden;
  height: auto;
  background: #3085a3;
  text-align: left;
}

/* upcoming events */
.grid.small figure {
  max-height: 350px;
  width: 99%;
  margin-left: 0.5%;
  margin-right: 0.5%;
  margin-bottom: 5px;
}
.grid.single-column figure{
  margin-right: 0;
  width: 100%;
}

.grid figure.last{
  margin-right: 0;
}

.grid figure img.show-image {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  opacity: 0.8;
}

/* All labels */
.grid figure figcaption {
  padding: 1em 0;
  color: #fff;
  text-transform: uppercase;
  font-size: 1em;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
/* Main film title Carousel */
.grid figure figcaption h2{
  color: #000;
  border: none;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
  pointer-events: none;
}

.grid figure figcaption {
  position: absolute;
  width: 100%;
}
.grid.small figure figcaption, .grid.single-column figure figcaption{
  top: 0;
  left: 0;
  height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure h2 {
    font-weight: 500;
    text-transform: uppercase;
  font-family: 'Lato', "Josefin Sans",sans-serif;

}

.grid figure h2 span {
  font-weight: 300;
}

.grid figure h2,
.grid figure a {
  margin: 0;
}

.grid figure a {
  letter-spacing: 1px;
  font-size: 68.5%;
}

/* Individual effects */

/*---------------*/
/***** Julia *****/
/*---------------*/

figure.effect-julia {
  background: #fff;
}

figure.effect-julia img.show-image {
  opacity: 1;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: scale(1.15);
  transform: scale(1.15);
}
figure.effect-julia img.show-image:hover {
  opacity: 0.8;
  -webkit-transform: scale(1);
  transform: scale(1);
}

figure.effect-julia figcaption {
  text-align: left;
}

figure.effect-julia h2 {
  position: relative;
  padding: 10px;
  background: #FFF none repeat scroll 0% 0%;
  display: inline-block;
  clear: both;
  margin: 3px 0;
}
figure.effect-julia figcaption > div:first-child > a:first-child{
 background: #FFF !important;
 padding: 0 10px;
font-size: 1.2em;
}
#content .effect-julia h2{
  font-size: 0.8em;
  background: #FFF;
  padding: 5px;
}
/* links underneath titles */
figure.effect-julia a {
  display: inline-block;
  margin: 0 0 0.15em;
  padding: 3px;
  background: rgb(33, 36, 55);
  color: #FFF;
  text-transform: none;
  font-weight: 600;
  font-size: 75%;
  text-transform: uppercase;
  font-family: 'Lato', "Josefin Sans", sans-serif;
  font-weight: bold;
  /*
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-360px,0,0);
  transform: translate3d(-360px,0,0);*/
}
#content .effect-julia a{

}

#content .effect-julia a.button{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}

figure.effect-julia a.transition-on {
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-360px,0,0);
  transform: translate3d(-360px,0,0);
}
.grid.single-column figure.effect-julia p {
  transform: none;
}

figure.effect-julia a:first-child {
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s;
}

figure.effect-julia a:nth-of-type(2) {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}

figure.effect-julia a:nth-of-type(3) {
  -webkit-transition-delay: 0.05s;
  transition-delay: 0.05s;
}

figure.effect-julia:hover a:first-child {
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

figure.effect-julia:hover a:nth-of-type(2) {
  -webkit-transition-delay: 0.05s;
  transition-delay: 0.05s;
}

figure.effect-julia:hover a:nth-of-type(3) {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}

figure.effect-julia:hover img.show-image {
  opacity: 0.4;
  -webkit-transform: scale3d(1.1,1.1,1);
  transform: scale3d(1.1,1.1,1);
}

figure.effect-julia:hover a {
  opacity: 1;
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.main-content .grid.small:first-child figure.effect-julia{    
  width: 32.333%;
}
.main-content .grid.small:first-child figure.effect-julia a{    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    opacity: 0;
}

/* Media queries */
@media screen and (max-width: 50em) {
  .content {
    padding: 0;
    text-align: left;
  }
  .grid.small figure {
    display: inline-block;
    float: none;
    margin: 5px auto;
    width: 100%;
  }
  .grid figure figcaption{
    font-size: 0.8em;
    top: 0.1em;
    padding: 0;
    height: 100%;
    bottom: 0;
  }
  .main-content .grid.small:first-child figure.effect-julia{    
  width: 100%;
  }
}

/* -------------------------------- 
  SIDEBAR
-------------------------------- */
.banner{

}
#AdvancedCinemaTemplateRow4.sidebar{
  background: #CDC8CC;
  padding: 10px 10px 0 10px;
}
#AdvancedCinemaTemplateRow4 section{height: 0; overflow: hidden;}
.sidebar{

}
.sidebar .news{
  font-size: 1em;
}

#SideBar{
  margin: 0 auto;
  max-width: 1140px;
  width: 100%;
  text-align: right;
  padding: 0px;
  font-size: 0.8em;
}

#SideBarHeader, .SideBarFirstHeading, .SideBarHeading{
  display: none;
}
.SideBarMenu {
  display: inline-block; padding: 0; margin: 0;
} 
.SideBarItem {
  display: inline-block; 
  margin: 0 0 0 10px;
  padding: 3px 0;
}  
.SideBarItem a{
  line-height: 1.4em; text-decoration: underline;
  color: #212437;
} 
#SideBarToggleMenu{
  display: none;
}
ul.sub-menu{
  margin-bottom: 10px;
}
ul.sub-menu li{
  border-bottom: solid 1px #ccc;
}
ul.sub-menu li a{
  display: block;
  padding: 5px 0;
}
ul.sub-menu li a:hover{
  background: #2f3238;
  color: #FFF;
}

/* -------------------------------- 
  CALENDAR/NEWS LIST/BLOGS
-------------------------------- */
#eventCalendarInBanner{
  display: none !important;  
}
.eventsCalendar-subtitle { 
  padding: 0 0 10px 0; 
  margin: 10px 0px; 
  display: block; 
  border-bottom: solid 1px #666;
  color: #242424;
}

.eventsCalendar-list-wrap {
  min-height:100px;
  position:relative;
}
.eventsCalendar-list-content.scrollable {

  height:240px;
  overflow-y:auto;
  margin:0 5px 5px 0;
}
.eventsCalendar-list {
  margin:0; padding:0; list-style-type:none;
}
.eventsCalendar-list li {
  position: relative;
  padding:15px 0 15px 60px;
  margin: 5px 0;
  clear:both;
  border-bottom: solid 1px #666;
}
.eventsCalendar-list.Blog li{
  color: #EDEDED;
  border: none;
}
.eventsCalendar-list.Blog li a{
  color: #EDEDED !important;
}
.eventsCalendar-list li img {
  position: absolute;
  left: 0;
  height: 30px;
}
.eventsCalendar-list li time {
  line-height: 1.2em;
}
.eventsCalendar-list li time em {
  float:left;
  font-style:normal;
}
.eventsCalendar-list li time small {
  float:left;
  background-color:#212437;
  color:#EDEDED;
  padding:0 0 0 5px;
  margin:0 0 0 3px;
}
.eventsCalendar-list li time small a{
  color: #EDEDED;
}
.eventsCalendar-list li .eventTitle {
  display:block;
  clear:both;
  font-weight: 300;
  text-decoration:none;
}
.eventsCalendar-list li a.eventTitle {
  color:#212437;
  font-weight: 500;
  text-transform: uppercase;
  font-family: "Josefin Sans",sans-serif;
}
.eventsCalendar-list li a.eventTitle:hover {
    text-decoration:underline;
}
.eventsCalendar-list li .eventDesc {
  clear: both;
  margin:0 0 5px 0;
  font-size:80%;
  line-height:1.2em;

}
.eventsCalendar-list .eventsCalendar-noEvents {
  font-size:120%;
  margin:5px;
  padding:5px;
  background-color:#666;
  color:#fff;
  text-align:center;
  font-weight:bold;
}

.bt {
  font-size:12px;
  display:block;
  clear:both;
  text-align: center;
  margin-top:10px;
  padding: 9px 34px 11px;
  text-decoration: none;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
  background-color: #242424;

  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);

  -webkit-transition: 0.1s linear all;
  -moz-transition: 0.1s linear all;
  -ms-transition: 0.1s linear all;
  -o-transition: 0.1s linear all;
  transition: 0.1s linear all;
}
.bt:hover {
    background-color: #212437;
    text-decoration: none;
  }
.eventsCalendar-list-wrap {
  display: none;
}

#this-week{
  padding: 5px 10px;
  background: #CDC8CC;
  font-size: 0.8em;
}

#this-week h2, #this-week a{
  color: #212437;
  border-color: #212437;
  text-align: left;
  font-weight: bold;
  font-size: 1.2em;
}
#sidebar-list .eventTitle{
  text-align: left;
  position: relative;
}

#sidebar-list.eventsCalendar-list li {
    position: relative;
    padding: 5px 0px;
    margin: 0;
    clear: both;
    border-bottom: none;
}
#sidebar-list.eventsCalendar-list li{
    height: 4em;
}
#sidebar-list.eventsCalendar-list li time small {
  float: left;
  color: #FFF;
  background-color: #212437;
  padding: 2px 5px 2px 4px;
  margin: 0px 0px 0px 3px;
}
/* -------------------------------- 
  SOCIAL MENU
-------------------------------- */

ul.social-menu{
  margin-bottom: 20px;
  padding: 0 0 10px 0;
}
ul.social-menu li{
  display: inline;
  text-transform: uppercase;
  font-size: 1em;
  line-height: 1.3em;
  font-weight: 300;
}
ul.social-menu li span{
  margin: 0 5px;
  float: right;
}

/* -------------------------------- 
  FOOTER
-------------------------------- */

#footer{
  color: #242424;
  background: #CDC8CC;
  max-width: auto;
  padding: 0 10px;
}

#footer h2.subtitle{
  color: #212437;
  border-color: #212437;
  font-size: 0.8em;
  margin: 20px 0;
}

#footer .copyright{
  margin-top: 10px;
  border-top: solid 1px #FFF;
  padding: 10px 0;
  color: #242424;
}

#footer .savoy{
  text-align: right;
}

#footer .savoy a{
  color: #242424;
}
@media (max-width: 767px) {
  ul#ft_gallery li.fourcol{
    width: 30.75% !important;
    margin-right: 3.8% !important;
    float: left !important;
  }
  ul#ft_gallery li.fourcol.last{
    margin-right: 0 !important;
  }
}
/* -------------------------------- 
  WHAT'S ON LIST
-------------------------------- */
.whats-on-list .film{
  margin-bottom: 20px;
  background: #CDC8CC;
  padding: 10px;
}
.whats-on-list .film > h2.date{
  display: none;
}
.whats-on-list .film > h2{
  display: block;
  margin-top: 0px;
  margin-bottom: 10px;
}
.whats-on-list ul{
  margin-top: 10px;
  width: 100%;
}
.whats-on-list ul li{
  line-height: 1.6em;
}
.whats-on-list p.synopsis{
  height: 6em;
  overflow: hidden;
  margin-bottom: 1em;
}
.whats-on-list .show-times{
  float: left;
  font-size: 80%;
  text-align: right;
}
.whats-on-list .show-times .button{
  
}
.whats-on-list.comments{
  background: #EFEFEF;
  padding: 0 20px 20px 20px;
  float: left;
  margin-bottom: 40px;
  width: 100%;
}
/* -------------------------------- 
  CATEGORY PICKER
-------------------------------- */
ul#CategoryPicker{
  width: 100%;
  text-align: center;
  text-transform: uppercase;
  padding-bottom: 20px;
  border-bottom: solid 1px #666;
  margin-bottom: 10px;
}
ul#CategoryPicker li{
  display: inline-block;
  padding: 0;
  margin: 0;
}
ul#CategoryPicker li a{
  padding: 0 1em;
}
ul#CategoryPicker li.last a{
  margin-right: 0;
}
.filter-item, p.filter-item{
  display: none;
}
.filter-item.Today{
  display: inline-block;
}

/* -------------------------------- 
  DROPDOWN PICKER
-------------------------------- */
.quick-book{
  margin-bottom: 10px;
}
#AdvancedCinemaTemplateRow4 > h2,
#AdvancedCinemaTemplateRow4 > p, 
#AdvancedCinemaTemplateRow4 > div.quick-book{
  background: #212437;
  padding: 0 10px;
  margin: 0;
  color: #FFF;
}
#AdvancedCinemaTemplateRow4 > h2{
  padding-top: 10px;
}
#AdvancedCinemaTemplateRow4 > p{
    padding-bottom: 10px;
    margin-bottom: 0;
    position: relative;
    top: -1px;
}
#AdvancedCinemaTemplateRow4 > div.quick-book{
  padding-bottom: 10px;
  top: -12px;
    position: relative;
}
.dropdown-lists{
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}
.cd-dropdown{
  border: solid 1px #212437;
}
.cd-dropdown,
.cd-select {
  position: relative;
  width: 100%;
  display: block;
  font-family: "Lato",sans-serif;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.cd-dropdown > span {
  width: 100%;
  height: 2em;
  line-height: 2em;
  color: #666;
  font-weight: 300;
  font-size: 1em;
  background: #fff;
  display: block;
  padding: 0 0.5em;
  position: relative;
  cursor: pointer;
}

.cd-dropdown > span:after {
  content: '\25BC';
  position: absolute;
  right: 0px;
  top: 15%;
  text-align: center;
  padding: 0.5em;
  height: 70%;
  line-height: 0.5em;
  border-left: 1px solid #666;
}

.cd-dropdown.cd-active > span:after {
  content: '\25B2';
}

.cd-dropdown ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: block;
  position: relative;
}

.cd-dropdown ul li {
  display: block;
}

.cd-dropdown ul li span {
  width: 100%;
  background: #fff;
  padding: 0 0.5em;
  line-height: 3em;
  font-size: 0.8em;
  display: block;
  color: #333333;
  cursor: pointer;
  font-weight: 300;
  font-family: "Lato",sans-serif;
  text-transform: uppercase;
}

.cd-dropdown > span,
.cd-dropdown ul li span {
  -webkit-backface-visibility: hidden;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.cd-dropdown > span span[class^="icon-"],
.cd-dropdown > span span[class*=" icon-"]{
  padding: 0;
}

/* Select fallback styling */
.cd-select {
  border: 1px solid #666;
}
.cd-dropdown ul {
  position: absolute;
  top: 0px;
  width: 100%;
}

.cd-dropdown > span,
.cd-dropdown ul li {
  box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

.cd-dropdown ul li {
  position: absolute;
  width: 100%;
  pointer-events: none;
}

.cd-active.cd-dropdown > span {
  color: #212437;
}

.cd-active.cd-dropdown ul li {
  pointer-events: auto;
}

.cd-active.cd-dropdown ul li span {
  -webkit-transition: all 0.1s linear 0s;
  -moz-transition: all 0.1s linear 0s;
  -ms-transition: all 0.1s linear 0s;
  -o-transition: all 0.1s linear 0s;
  transition: all 0.1s linear 0s;
}

.cd-active.cd-dropdown ul li span:hover {
  background: #212437;
  color: #fff;
}

/* -------------------------------- 
  LIGHTBOX
-------------------------------- */
.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}
.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
}
.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  width: 100%;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}
.lightbox a img {
  border: none;
}
.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}
.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}
.lb-container {
  padding: 4px;
}
.lb-loader {
  position: absolute;
  top: 43%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}
.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(/RioCinema/img/loading.gif) no-repeat;
}
.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}
.lb-container > .nav {
  left: 0;
}
.lb-nav a {
  outline: none;
}
.lb-prev, .lb-next {
  width: 49%;
  height: 100%;
  cursor: pointer;
  /* Trick IE into showing hover */
  display: block;
}
.lb-prev {
  left: 0;
  float: left;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}
.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
  background: url(/RioCinema/img/prev.png) left 48% no-repeat;
}
.lb-next {
  right: 0;
  float: right;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}
.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
  background: url(/RioCinema/img/next.png) right 48% no-repeat;
}
.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}
.lb-data {
  padding: 0 4px;
  color: #bbbbbb;
}
.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}
.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}
.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}
.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(/RioCinema/img/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}
.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

/* -------------------------------- 
  FILM PAGE
-------------------------------- */
ul.film-times{

}
ul.film-times > li{
  display: inline-block;
  padding: 0.5em 0;
  border-bottom: solid 1px #666;
  width: 100%;
}
ul.film-times > li .button{
  float: left;
  margin: 0 0 5px 5px;
}
ul.film-times > li > span.date{
  margin-right: 1em;
  float: left;
  width: 20%;
}
ul.film-times > li > .notes{
  float: left;
  color: #990000;
  clear: both;
  margin: 1em 0 0 0;
  padding: 0.2em 0;
  font-size: 0.8em;
  width: 100%;
  text-align: center;
}
ul.film-times > li > a > span.icon{
  margin-right: 0.5em;
}
ul.share li{
  display: inline;
}
.video{
  position: relative;
}
.video .video-thumb-overlay{
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
}
.vimeo-wrapper {
  display: inline-block;
  position: relative;
  cursor: pointer;
  width: 100%;
  margin-bottom: 20px;
}
.vimeo-wrapper .play-icon {
  position: absolute;
  z-index: 1000;
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background: url(/RioCinema/icon-play.png) no-repeat center center;
}
.vimeo-wrapper img{
  width: 100%;
}
.vimeo-wrapper iframe{
  width: 100%;
}
#TheVideo{
  position: relative;
}
#TheVideo .play{
  display: block;
  top: 0px;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  background: url("/RioCinema/img/icon-play.png") no-repeat center center;
  z-index: 1;
  cursor: pointer;
}
/* -------------------------------- 
  FILM GALLERY PAGE
-------------------------------- */
.video-gallery .video{
  width: calc(50% - 5px);
  margin-right: 10px;
  float: left;
  background: #EFEFEF;
  margin-bottom: 40px;
  height: 320px;
  padding: 10px;
  position: relative;
}
.video-gallery .video.last{
  margin-right: 0;
}
.video-gallery .video .vimeo-wrapper img{
  width: 100%;
  height: 160px;  
}
/* -------------------------------- 
  SEARCH
-------------------------------- */
#FilmList li a{
  font-size: 2em;
  padding: 0.1em 0.5em;
  background: none repeat scroll 0% 0% rgb(239, 239, 239);
  border-bottom: solid 1px #242424;
  display: block;
}

/* -------------------------------
  OSCAR TEMPATES
---------------------------------*/
.programme {
  width: 100%;
  float: left;
  clear: both;
  margin-bottom: 20px;
}

.programme .image {
  width: 134px;
  float: left;
        margin: 10px;
}


.programme .image img {
  width: 100%;
}

.programme .image-big {
  float: left;
    margin: 10px;
}

.programme .image-big img{
  width: 100%;
}

.programme .title {
  width: 570px;
  padding: 10px 0;
  float: left;
}

.programme .title h2{
  margin: 0;
  padding: 0;
  font-weight: 300;
  /*text-transform: uppercase;*/
  font-size: 1.75em;
  font-weight: 400;
  letter-spacing: 0.2em;
  /*text-transform: uppercase;*/  
}

.programme .title h2 small{
  font-size: 0.4em;
  letter-spacing: 0.2em;
}

.programme .title h2 a{
  color: rgb(51, 51, 51) !important;
}

.programme .synopsis {
  width: 400px;
  float: left;
  margin-top: 10px;
}

.filmtimes{
  float: left;
  width: 100%;
}

.filmtimes tr{
  margin-bottom: 20px;
  float: left;
  display: block;
        clear: both;
}

.filmtimes .PeformanceListDate{
  width: 140px;
}

.filmtimes .StartTimeAndStatus{
  float: left;  
}

.filmtimes .StartTimeAndStatus a, .filmtimes .StartTimeAndStatus .PerformanceNotesSmall{
  float: left;  
  line-height: 20px;
  width: 80px;
  margin: 5px;
  padding: 5px 10px;
  text-align: center;
}

.filmtimes .StartTimeAndStatus a{
  background: #ffFFF3;
  float: left;  
  line-height: 20px;
  color: #EDEDED;
}
.filmtimes .StartTimeAndStatus .PerformanceNotesSmall{
  float: left;  
  font-size: 0.6em;
  text-align: left;
  padding: 5px 20px 5px 0px;
}

SPAN.WebTab{ font-weight: 300; padding-right: 15px; font-size: 1.2em; }
SPAN.WebTab a{ color: rgb(51, 51, 51); }
SPAN.WebTab a:hover{ color: #FFFFF3; }
SPAN.SelectedWebTab{  padding-right: 15px; font-weight: 400; font-size: 1.2em; }
SPAN.SelectedWebTab a{ color: rgb(51, 51, 51); }
SPAN.SelectedWebTab a:hover{ color: #FFFFF3; }

DIV.PersonType{ padding-top: 6px; } 
DIV.SeatType{ padding-top: 20px; font-size: 12pt; font-weight: bold; } 

DIV.PerformanceDate { padding-top: 5px; font-size: 12pt; font-weight: bold; } 
SPAN.PerformanceEndTime { font-size: 8pt; font-weight: normal; } 
SPAN.PerformanceSection { font-size: 12pt; font-weight: bold; } 
DIV.PerformanceStatus { padding-top: 15px; font-size: 12pt; font-weight: bold; } 

DIV.SaleItem{ min-height: 30px; padding: 5px; } 
TD.SaleItemDescription{ width: 0px; }
TD.SaleItemPromptText{ padding-right: 5px; width: 30px; text-align: right; } 
TD.SaleItemInput{ padding-right: 5px; width: 80px;}
TD.SaleItemPriceText{ } 

DIV.CalendarViewDays { padding-left: 110px; padding-top: 5px; } 
SPAN.CalendarViewDays { padding-right: 20px; } 
TD.NonDay { background: #9E022A; width: 20px; text-align: center; color: #EDEDED; }
TD.SelectedDay { background: black; text-align: center; width: 20px; } 
TD.Day { background: #9E022A; text-align: center; width: 20px; } 

TD.OrderItem { width: 90px; } 
TD.OrderItem a{ color: #F33; } 
TD.OrderDetails { width: 450px; } 
TD.OrderPriceToPay { width: 45px; } 
TD.OrderDelete { width: 45px; } 
TD.OrderDelete a{ color: #F33; } 
SPAN.DiscountDetail { color: red; } 

DIV.ConfirmationEmail { padding-top: 10px; } 
TABLE.MaestroSolo { background:rgb(204, 204, 204); border: 0; } 
TD.MaestroSolo { background:rgb(204, 204, 204); } 

DIV.RadioGroup{ }

DIV.Exception{ 
color: rgb(255, 0, 0);
font-size: 12pt;
font-weight: bold;
width: 100%;
display: block;
clear: both;
background: #990000;
color: #EDEDED;
padding: 20px;
margin-bottom: 20px;
font-size: 2em;
line-height: 1.2em;
/*text-transform: uppercase;*/
text-align: center;
-webkit-animation: bounce 1.2s ease-out;
-moz-animation: bounce 400ms ease-out;
-o-animation: bounce 400ms ease-out;
animation: bounce 1.2s ease-out;
} 
SPAN.TicketReservationsExpired{ color:#e55a45; font-weight: bold; } 

#SynopsisBody { background: #FFFFFF; color: #242424; font-family: Arial, Helvetica, sans-serif; font-style: normal; }
#Synopsis { background: #FFFFFF; color: #242424; height: 300px; padding: 10px; } 
DIV.SynopsisProgrammeTitle { font-size: 12pt; font-weight: bold; margin-bottom: 10px; } 
DIV.SynopsisRating { font-size: 12pt; font-weight: bold; margin-bottom: 10px; } 
DIV.SynopsisDetail { font-size: 10pt; font-weight: normal; } 
DIV.MembershipHistory { } 
TD.MembershipHistoryDescription { width: 150px; padding-right: 15px; } 
TD.MembershipHistoryValidity { width: 320px; } 
TD.MembershipHistoryRenew { } 
DIV.MembershipAvailableForActivation { font-size: 12pt; font-weight: bold; margin-top: 10px; margin-bottom: 5px; } 
DIV.MembershipActivation { } 
SPAN.MembershipActivationDescription { width: 80px; padding-right: 15px; } 
SPAN.MembershipActivationFromTo { width: 180px; padding-right: 15px; } 
SPAN.MembershipActivationValidationCodePrompt { width: 100px; padding-right: 15px; } 
SPAN.MembershipActivationValidationCode { width: 100px; padding-right: 15px; } 
SPAN.MembershipActivationActivate { } 
DIV.DeliveryOptionsHeader { margin-bottom: 10px; } 
DIV.DeliveryOptionSaleItem{ float: left; width: 250px; font-weight: bold; } 
DIV.DeliveryOptionPrompt{ float: left; width: 150px; text-align: right; padding-right: 10px; } 
DIV.DeliveryOptionInput{ float: left; width: 155px; } 
DIV.DeliveryOptionInput SELECT { width: 150px; } 
DIV.DeliveryOptionSelected{ float: left; width: 155px; font-weight: bold; } 
DIV.DeliveryOptionSeparator{ clear: both; margin-top: 10px; } 
DIV.DeliveryOptionsFooter{} 
DIV.TransactionViewDeliveryOption{ font-size: 8pt; color: red; } 
DIV.DeliverTo { margin-top: 5px; margin-bottom: 5px; font-weight: normal; } 
DIV.DeliveryNameAndAddress { margin-left: 50px; margin-bottom: 5px; font-weight: bold; } 
DIV.PaymentMethod { font-weight: bold; margin-top: 5px; margin-bottom: 10px; } 
DIV.PaymentMethodPasswordLabel { float: left; margin-left: 20px; width: 140px; } 
DIV.PaymentMethodPasswordInput { } 
DIV.PaymentMethodSeparator { clear: both; } 
TR.SeatAvailabilityGraph { display: none; } 
    /* ALLOCATED SEATING POPUP ---------------------------------------
    ----------------------------------------------------------------*/
    
    TR.SeatAvailabilityGraph {
    display: none; 
    }
    
    TD.SAGSold { 
    
    }
    
    TD.SAGReserved { 
    
    }
    TD.SAGAvailable { 
    
    }
    
    DIV.PriceGroup { 
      clear: both; 
      color: white;     
    }
    
    DIV.PriceGroupSeatType {
      background: #212437; 
      margin: 10px 0; 
      float: left;
      padding: 5px;
                        border: 2px solid black;
    }
    
    TD.PriceGroupSeatTypeHeading { 
      font-size: 14pt;     
    }
    
    TD.PriceGroupPersonTypeQuantity {
      font-size: 14pt; 
      background: black; 
      width: 12px; 
      height: 20px; 
    }
    
    TD.PriceGroupPersonTypeDescription {
      padding-left: 5px; 
      padding-right: 5px;   
    }
    
    TD.PriceGroupPersonTypePrice { 
      padding-left: 5px;    
    }
    
    DIV.SeatingPlanProtector { 
      background: black; 
      opacity: 0; 
      filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); 
    }
    
    DIV.SelectPersonTypeOverlay { 
      background: white; 
      width: 350px;
      padding: 10px; 
      border: 2px solid black; 
    }
    
    DIV.SelectPersonTypeOverlayPrompt { 
      color: black; 
      margin-top: 8px; 
      margin-bottom: 8px; 
    }
    
    DIV.SelectPersonTypeOverlaySeatNumber { 
      color: black; 
      font-size: 12pt; 
    }
    
    DIV.SelectPersonTypeOverlaySeatType { 
      color: black; 
      font-size: 14pt; 
    }
    
    DIV.PersonTypeOverlayPersonTypeAndPrice { 
      margin-top: 3px; 
      margin-bottom: 3px; 
    height: 20px;
    line-height: 1;
    }
    
      DIV.PersonTypeOverlayPersonTypeAndPrice a {
        display: block;
        width: 100%;
        font-size: 1em;
        padding: 3px 5px;
        text-decoration: none;
        float: left;
        color: rgb(255, 255, 255);
        margin-bottom: 2px;
        background: none repeat scroll 0% 0% rgb(153, 153, 153);
        cursor: pointer;
      }

    SPAN.PersonTypeOverlayConditionsOfEntry { 
      color: black; 
      font-size: 8pt; 
    float: left;
    display: block;
    }
    
    DIV.SelectPersonTypeOverlayCancel { 
      display: block;
      text-align: center; 
      text-decoration: none;
          position: absolute;
    top: 0px;
    right: 10px;
    }
    
      DIV.SelectPersonTypeOverlayCancel a { 
        display: block;
        text-align: center; 
        text-decoration: none;
        color: #EDEDED;
      }
      
    .PersonTypeOverlayPersonTypeAndPrice{
    
    }
      
    DIV.SelectedSeat { 
      background: black; 
      color: white; 
    }
    
    DIV.SelectedSeat SPAN {
      display: block; 
      margin-left: -1px; 
      text-align: center; 
    }
    
    @media (max-width: 767px) {      
      DIV.SelectPersonTypeOverlay { 
        font-size: 1.2em;
        line-height: 1.5em;
      }
      #SeatingPlanDiv{
        /*width: 100% !important;*/
      }
    }    
.performance-item {
    min-height: 140px !important;
}
.UnsubscribeFromENewsDescription {font-size: 10pt; font-weight: bold; margin-top: 16px; margin-bottom: 6px;}
.UnsubscribeFromENewsCheckBox {margin-bottom: 5px;}
.UnsubscribeFromENewsError {}
DIV.PatronGiftAidFormRow {font-weight: bold; margin-top: 3px; margin-bottom: 3px; float: left; clear: both;}
DIV.PatronGiftAidFormDescription {width: 250px; float: left;}
DIV.PatronGiftAidFormSignedDate {width: 150px; float: left;}
DIV.PatronGiftAidFormViewHideSign {width: 150px; float: left;}
DIV.SignedPatronGiftAidForm {width: 90%; border: 2px solid black; padding: 10px; margin-top: 5px; margin-bottom: 25px; clear: both;}
DIV.PatronGiftAidFormToSign {width: 90%; border: 2px solid black; padding: 10px; margin-top: 5px; margin-bottom: 25px; clear: both;}


/* ---------------------------------------------------------
  POPUP MESSAGES
----------------------------------------------------------*/

#PopupException, .PopupDialogBox {
    position: fixed;
    left: 0;
    right: 0;
    top: 120px;
  width: 95%;
    max-width: 500px;
    margin: auto;
    z-index: 10000;
  background: #F0F0F0;
  padding: 20px 20px 80px 20px;
  line-height: 1.5em;
  min-height: 180px;
}

#PopupException .Button.Close, .PopupDialogBox .Button.Close {
  position: absolute;
  bottom: 20px;
  left: 20px;
}

.PopupDialogHeading {
  font-weight: bold; margin-bottom: 2px;
}

@media (max-width: 767px) {
  #PopupException, .PopupDialogBox {
    top: 10%;
  }
}

#PopupException .EmailAddress{
  font-weight: 600;
  color: #333;
  font-size: 1.2em;
}
#PopupException .Login, #PopupException .PasswordReset{
  margin: 10px 0;
}
#PopupException .ExceptionMessage{
  margin: 10px 0;
  max-height: 10em;
  overflow: hidden; /* or scroll? */
  color: #990000;
}

#Overlay{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
  background: #333;
  display: none;
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
  /* IE 5-7 */
  filter: alpha(opacity=90);
  /* Netscape */
  -moz-opacity: 0.9;
  /* Safari 1.x */
  -khtml-opacity: 0.9;
  /* Good browsers */
  opacity: 0.9;
}

/* ---------------------------------------------------------
  ADVERT
----------------------------------------------------------*/
.advert{
  width: 100%;
  border: solid 1px #BBB;
  padding: 5px;
  text-align: center;
}

@media(max-width: 766px){
 .advert{
   padding: 5px 0;
   border: none;
 }
}

#today{display: none;}

.vouchers td{
  vertical-align: middle;
}


/* ---------------------------------------------------------
  COOKIE BANNER
----------------------------------------------------------*/

#CookieBanner{
  display: none;
  width: 100%;
  position: fixed;
  top: 0;
  padding: 5px 0px;
  z-index: 99999999999999;
  text-align: center;
  background:#333;
  color: #fff;
  line-height: 2em;
}
#CookieBanner #Message{
  margin: 5px auto;
}
#CookieBanner .button{
  display: inline;
  cursor: pointer;
}
#CookieBanner .OK{
  background: #7daf3b;
}
#CookieBanner #ShowPolicy, #CookieBanner #ClosePolicy{
  display: inline;
  color: #FFF;
  text-decoration: underline;
  cursor: pointer;
}
#CookieBanner #Policy{
  text-align: left;
  max-width: 800px;
  padding: 2px 15px;
  border-radius: 10px;
  margin: 15px auto;
  background: #990000;
  display: none;
}
.important-info-input{
  display: none;
}
#SideBar > div:nth-child(4) > div:nth-child(3){
  display: none;
}

/* ---------------------------------------------------------
  Grid
----------------------------------------------------------*/

.og-grid {
  list-style: none;
  padding: 10px 0;
  margin: 0 auto;
  text-align: left;
  width: 100%;
  position: relative;
}

.og-grid li {
  display: inline-block;
  margin: 0 0 5px;
  vertical-align: top;
  width: calc(25% - 10px);
}

.og-grid li > a,
.og-grid li > a img {
  border: none;
  outline: none;
  display: block;
  position: relative;
}
.og-grid li > a img {
  width:100%;
}

.og-grid li.og-expanded > a::after {
  top: auto;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-bottom-color: #ddd;
  border-width: 15px;
  left: 50%;
  margin: -20px 0 0 -15px;
}

.og-expander {
  position: absolute;
  background: #ddd;
  top: auto;
  left: 0;
  width: 100%;
  margin-top: 10px;
  text-align: left;
  height: 0;
  overflow: hidden;
}

.og-expander-inner {
  padding: 50px 30px;
  height: 100%;
}

.og-close {
  position: absolute;
  width: 40px;
  height: 40px;
  top: 20px;
  right: 20px;
  cursor: pointer;
}

.og-close::before,
.og-close::after {
  content: '';
  position: absolute;
  width: 100%;
  top: 50%;
  height: 1px;
  background: #888;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}

.og-close::after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.og-close:hover::before,
.og-close:hover::after {
  background: #333;
}

.og-fullimg,
.og-details {
  width: 50%;
  float: left;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.og-details {
  padding: 0 40px 0 20px;
}

.og-fullimg {
  text-align: center;
}

.og-fullimg img {
  display: inline-block;
  max-height: 100%;
  max-width: 100%;
}

.og-details h3 {
  font-weight: 300;
  font-size: 52px;
  padding: 10px 0 5px;
  margin-bottom: 10px;
}

.og-details p {
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #999;
}

.og-details a {
  font-weight: 700;
  font-size: 16px;
  color: #333;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding: 10px 20px;
  border: 3px solid #333;
  display: inline-block;
  margin: 30px 0 0;
  outline: none;
}

.og-details a::before {
  content: '\2192';
  display: inline-block;
  margin-right: 10px;
}

.og-details a:hover {
  border-color: #999;
  color: #999;
}

.og-loading {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ddd;
  box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ccc;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -25px 0 0 -25px;
  -webkit-animation: loader 0.5s infinite ease-in-out both;
  -moz-animation: loader 0.5s infinite ease-in-out both;
  animation: loader 0.5s infinite ease-in-out both;
}

@-webkit-keyframes loader {
  0% { background: #ddd; }
  33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
  66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@-moz-keyframes loader {
  0% { background: #ddd; }
  33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
  66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

@keyframes loader {
  0% { background: #ddd; }
  33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; }
  66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; }
}

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

  .og-expander h3 { font-size: 32px; }
  .og-expander p { font-size: 13px; }
  .og-expander a { font-size: 12px; }

}

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

  .og-fullimg { display: none; }
  .og-details { float: none; width: 100%; }
  
}
/* ------- Homepage cleanup for mobile ----*/
@media (max-width: 767px) {
  div.SideBarMenu:nth-child(4),  /*hide newsletter, and unwanted links in sidebar */
  div.newsletter:nth-child(4){
    display: none;
  }
  .grid.small figure.effect-julia.twelvecol{
    width: 50% !important;
    float: left;
  }
  .phoenix-logo img{
    height: 70px;
  }
  .grid figure figcaption h2{
    font-size: 0.8em;
    padding: 5px;
  }
}

@media (max-width: 1023px) and (min-width: 767px){
  #main{
    padding: 0 10px;
  }
  div.newsletter:nth-child(4) > p:nth-child(2){
    display: none;
  }
  div.newsletter:nth-child(4){
    margin-top: 10px; 
  }
  div.newsletter h2.subtitle{
    margin-top: 0;
  }
  .grid.small:first-child figure.effect-julia{
    width: 49% !important;
  }
}
@media (max-width: 1023px){
  #main{
    padding: 0 10px;
  }
}

#Detail.PerformanceList > p > a{
 font-size: 1.5em;
 line-height: 2em;
 background: #212437;
 color: #FFF;
 padding: 3px 10px;
 font-weight: bold;
}
#Detail.PerformanceList .PerformanceStatus{
 color: #990000;
 font-weight: bold;
 font-size: 1.5em;
 line-height: 2em;
}

.programme.Festival .ninecol{display: none}