@font-face {
    font-family: "knockout 48 a";
    src: url("../fonts/Knockout-48.otf") format("opentype");
}
@font-face {
    font-family: "knockout 48 b";
    src: url("../fonts/Knockout-48.otf") format("opentype");
}

/* useful------------------------------------------------------------- */
body,
html {
  margin: 0px;
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}
#extraContent2Btn button { font-size: 0px;}
#invisBtn { background-color: #ffffff; }
#mainTimeline {
  opacity: 0;
}
#nojs {
  margin: 50px;
  text-align: center;
}
#loading {
  text-align: center;
  margin-top: 100px;
  position: fixed;
  width: 100%;
}
#loading #loadingCirc {
  opacity: 0;
  width: 400px;
  height: 400px;
  border-radius: 200px;
  background-color: #4ad5ff;
  position: absolute;
  left: -200px;
  top: -200px;
  position: relative;
  left: 0px;
  top: 0px;
  margin: 0px auto;
}
#loading #welcome {
  padding-top: 100px;
}
#loading #loadTxt {
  position: absolute;
  bottom: -90px;
  width: 100%;
}
#loading p {
  position: absolute;
  left: 40px;
  right: 40px;
  top: 180px;
  width: 320px;
  text-transform: none;
  font-size: 30px;
  line-height: 30px;
}
.csstransforms #nojs {
  display: none;
}
a {
  border: none;
}
a img {
  border: none;
}
.noTapHighlight {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  /* For some Androids */
  -ms-touch-action: manipulation;
  /* IE10  */
  touch-action: manipulation;
  /* IE11+ */
}
#visitAbout,
#exitAbout,
.concertLink,
#exitTickets {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  /* For some Androids */
  -ms-touch-action: manipulation;
  /* IE10  */
  touch-action: manipulation;
  /* IE11+ */
}
#bookTix:focus,
#btnAbout button:focus {
  outline: none !important;
  text-decoration: underline !important;
}
/* colours-----------------------*/
/* text-----------------------*/
.knockoutFont {
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.plain,
p {
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 300;
  color: #222222;
  margin: 10px 0px 0px 0px;
  font-size: 15px;
  line-height: 18px;
  text-transform: none;
}
.menuItems {
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 22px;
  color: #808080;
  text-decoration: none;
}
a,
a:visited {
  color: #808080;
  text-decoration: none;
}
a:hover {
  color: #ea5297;
}
header {
  outline: none !important;
}
.smallFontK {
  font-size: 22px;
  line-height: 19px;
}
.medFontK {
  font-size: 26px;
  line-height: 25px;
}
.medLgFontK {
  font-size: 40px;
  line-height: 38px;
}
.largeFontK {
  font-size: 50px;
  line-height: 46px;
}
.hideFocus {
  outline: none !important;
}
.indentTxt {
  padding-left: 80px;
}
.centerTxt {
  text-align: center;
}
.bolder {
  font-weight: bold;
  font-style: normal;
}
.ital {
  font-style: italic;
}
.whiteTxt {
  color: #ffffff;
}
.pinkTxt {
  color: #ea5297;
}
.orangeTxt {
  color: #ff9900;
}
.greyTxt {
  color: #808080;
}
.blueTxt {
  color: #4ad5ff;
}
.darkBlueTxt {
  color: #1e4b9b;
}
.blackTxt {
  color: #000000;
}
.nonCaps {
  text-transform: none;
}
.transpBG {
  background: rgba(0, 0, 0, 0) !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 0px;
}
h1 {
  font-size: 40px;
  color: #222222;
}
h2 {
  font-size: 65px;
  color: #b7b7b7;
  line-height: 52px;
}
h3 {
  font-size: 90px;
  line-height: 70px;
  color: #b7b7b7;
}
h4 {
  font-size: 30px;
  color: #222222;
}
h5 {
  font-size: 21px;
  line-height: 20px;
  color: #222222;
  text-transform: none;
}
h6 {
  font-size: 20px;
  line-height: 19px;
  color: #222222;
  letter-spacing: 0.06em;
}
#newsCF,
#rosCommLink1,
#rosCommLink2,
#ROSplayBtn {
  visibility: hidden;
}
/* layout & mixins-----------------------*/
.holderInner,
.holderOuter,
.holderTW {
  width: 1100px;
  margin: 0px auto;
  position: relative;
}
.holderOuter {
  width: 1180px;
}
.holderTW {
  width: 1340px;
}
.offscreen {
  position: absolute;
  left: -10000px;
  opacity: 0;
}
section {
  margin-top: 80px;
  min-height: 400px;
}
#sect_0 {
  margin-top: 20px;
}
#sect_2 {
  margin-top: 40px;
}
.menuUnderline {
  width: 100%;
  height: 2px;
  background-image: url(../img/dots1.png);
  background-repeat: repeat-x;
  background-size: 6px 2px;
}
.aboutQUnderline {
  width: 100%;
  height: 2px;
  background-image: url(../img/dotsQ.gif);
  background-repeat: repeat-x;
  background-size: 6px 2px;
  margin-top: 6px;
}
.doubleUnderline {
  width: 100%;
}
.doubleUnderline .ticketsUnderline {
  width: 100%;
  height: 4px;
  background-image: url(../img/dots_tickets_0.gif);
  background-repeat: repeat-x;
  width: 19.5%;
  float: left;
  margin-top: -0.5px;
  background-size: 10px 4px;
}
.floatLeft {
  float: left;
  margin-right: 25px;
}
.floatLeftinTxt {
  float: left;
  margin-right: 10px !important;
}
.noTop {
  margin-top: 0px;
  padding-top: 2px;
}
.noBottom {
  margin-bottom: 0px !important;
}
.halfBottom {
  margin-bottom: 45px !important;
}
.lower {
  display: block;
  margin-top: 8px;
}
.raise {
  display: block;
  margin-top: -13px !important;
}
.raiseMid {
  display: block;
  margin-top: 0px !important;
}
.raiseSlight {
  display: block;
  margin-top: 6px !important;
}
.clear {
  display: block;
  float: none;
  clear: both;
}
.padTop {
  padding-top: 17px;
}
.padTopExtra {
  padding-top: 40px;
}
.holderAbs {
  position: absolute;
  width: 100%;
}
.holderRel {
  position: relative;
  width: 100%;
}
.zItems {
  position: relative;
  z-index: 1;
}
.extraMarginBottom {
  margin-bottom: 80px !important;
}
.marginTop {
  margin-top: 60px;
}
.extraMarginTop {
  margin-top: 80px;
}
.marginBtm {
  margin-bottom: 60px;
}
.mobileOnly {
  display: none !important;
}
.twoThirds {
  max-width: 66%;
  margin-top: -25px;
}
.greyBlock {
  width: 100%;
  background-color: #f7f7f7;
  padding: 60px 0px;
}
.showSmall,
.showMed {
  display: none;
}
.whiteBg {
  background-color: #ffffff;
  z-index: 1;
  position: relative;
}
.whiteBgInline {
  background-color: #ffffff;
}
/* blocks-----------------------*/
/* full width image------------*/
.hugeImg {
  width: 100%;
  display: block;
  background-size: cover;
}
.credit {
  width: 100%;
  text-align: left;
  margin-bottom: 60px;
  font-size: 13px;
}
#veniceFullscreen {
  background-image: url(../img/venice_xl.jpg);
}
#LAFullscreen {
  background-image: url(../img/La_eveninglight_xl.jpg);
}
#endImgFullscreen {
  background-image: url(../img/end_xl.jpg);
}
/* quote------------*/
.quoteBlock {
  margin: 60px auto;
  width: 780px;
}
.quoteBlock .dividingLineQ {
  width: 100%;
  height: 3px;
  background-image: url(../img/dots2.gif);
  background-repeat: repeat-x;
  background-size: 8px 3px;
}
.quoteBlock p {
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #222222;
  font-size: 28px;
  line-height: 28px;
  text-align: center;
  margin: 15px 5px 18px 5px;
  text-transform: none;
}
.quoteBlock p.plain {
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 300;
  font-size: 15px;
  line-height: 18px;
}
#quoteCredit {
  margin-top: -10px !important;
}
/* map------------*/
.mapHolder {
  position: relative;
}
#mapQuote {
  position: absolute;
  top: 40px;
  left: 0px;
  width: 100%;
  z-index: 1;
  font-size: 30px;
  line-height: 32px;
}
#mapQuote .mapQInner {
  width: 380px;
}
/* year------------*/
.year {
  position: relative;
  margin-bottom: 60px;
  max-width: 50%;
  z-index: 1;
}
.year p {
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-transform: none;
}
.year p.plain {
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 300;
  color: #222222;
  margin: 10px 0px 0px 0px;
  font-size: 15px;
  line-height: 18px;
  text-transform: none;
}
.year .yearLine {
  width: 100%;
  height: 2px;
  background-image: url(../img/dots1.png);
  background-repeat: repeat-x;
  background-size: 6px 2px;
  position: absolute;
  top: 36px;
  width: 1000px;
  left: -1010px;
}
.year .worldEvent {
  min-height: 40px;
  margin-bottom: 10px;
}
.year .worldEvent p {
  font-size: 22px;
  line-height: 19px;
  color: #222222;
  padding-top: 13px;
}
.year .worldIco {
  width: 40px;
  float: left;
  margin-right: 15px;
}
.year h3 {
  position: relative;
  z-index: 1;
}
.year .yearEvents {
  position: relative;
}
.yearLonger {
  max-width: 67%;
}
.yearXl {
  max-width: 100% !important;
}
.yearLonger p.plain {
  margin-right: 60px;
}
#year30 {
  max-width: 38%;
}
/* text beats------------*/
.textBeats {
  position: absolute;
  top: 45px;
  left: -40px;
  height: 24px;
  width: 115px;
  background-image: url(../img/textBeats.png);
  background-size: cover;
}
.beatLineAcross {
  display: inline-block;
  height: 24px;
  margin-top: 6px;
  width: 700px;
  background-image: url(../img/lineAcross.gif);
  background-size: 700px;
}
#textBeats1 {
  background-position: 0px -24px;
}
#textBeats2 {
  background-position: 0px -48px;
  top: 8px;
}
#textBeats3 {
  background-position: 0px -72px;
}
/* end------------*/
.smallYear {
  margin-bottom: 20px;
  height: 70px;
}
.smallYear .yearEvents {
  height: 70px;
}
.closeYear {
  margin-bottom: 20px;
}
.wAlignBtm .worldEvent,
.wAlignTop .worldEvent,
.wAlignYear .worldEvent,
.wAlignMid .worldEvent {
  position: absolute;
  left: 130px;
  margin: 0px;
}
.wAlignBtm .worldEvent p,
.wAlignTop .worldEvent p,
.wAlignYear .worldEvent p,
.wAlignMid .worldEvent p {
  display: block;
  margin-left: 55px;
  padding-top: 3px;
}
.wAlignBtm .worldEventMgLeft,
.wAlignTop .worldEventMgLeft,
.wAlignYear .worldEventMgLeft,
.wAlignMid .worldEventMgLeft {
  left: 150px;
}
.wAlignBtm .worldEvent {
  bottom: 1px;
}
.wAlignTop .worldEvent {
  top: 6px;
}
.wAlignYear .worldEvent {
  top: -53px;
}
.wAlignMid .worldEvent {
  top: 15px;
}
#year8Holder {
  position: absolute;
  top: 60px;
  left: 0px;
  width: 100%;
}
#year8Holder .year p {
  width: 400px;
}
#year27 {
  margin-bottom: 60px;
}
/* premiere------------*/
.premiereDate {
  position: relative;
  width: 100%;
  top: -60px;
}
.premiereDate .premiereInner {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 21.5%;
}
.premiereDate .innerPosBottom {
  top: auto;
  bottom: 0px;
}
.premiereDate p {
  margin-top: 0px;
  font-size: 14px;
  clear: both;
}
.premiereDate button {
  margin-top: 0px;
  font-size: 14px;
}
.premiereDate .premierePoint {
  width: 16px;
  height: 16px;
  border-radius: 8px;
  background-color: #e0ff08;
  position: absolute;
  left: -8px;
  top: -8px;
  left: -22px;
  top: 0;
}
.premiereDate .plain {
  font-size: 14px;
}
.premiereDate h6 {
  float: left;
  margin-right: 20px;
  background-color: #fff;
  padding-right: 8px;
}
#premiere1 h6,
#premiere6 h6,
#premiere7 h6 {
  background-color: #f7f7f7;
}
.premiereLine {
  width: 100%;
  height: 2px;
  background-image: url(../img/dots1.png);
  background-repeat: repeat-x;
  background-size: 6px 2px;
  width: 800px;
  margin-top: 8px;
}
#premiere1 {
  top: 38px;
}
#premiere2,
#premiere3,
#premiere9 {
  top: 5px;
}
#premiere4 {
  top: -75px;
}
#premiere5,
#premiere15 {
  top: 0px;
}
#premiere6,
#premiere7 {
  top: -30px;
}
#premiere8 {
  top: -70px;
}
#premiere14 {
  top: 130px;
}
#premiere13 {
  top: 0px;
}
/* extra content------------*/
.extraContentBtn {
  width: 100%;
  background-color: #444444 !important;
  line-height: 0px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  /* For some Androids */
  -ms-touch-action: manipulation;
  /* IE10  */
  touch-action: manipulation;
  /* IE11+ */
}
.extraContentBtn button {
  width: 100%;
  line-height: 0px;
}
.extraContentBtn button .peekScreenshot {
  width: 66%;
  display: inline-block;
}
.extraContentBtn button .expandInstruction {
  float: right;
  width: 34%;
}
.extraContentBtn button .plusIco {
  width: 40px;
  display: block;
  margin-top: 35px;
  margin-left: 40px;
  float: left;
}
.extraContentBtn button p {
  display: block;
  text-align: left;
  color: #ffffff;
  margin: 28px 0px 0px 95px;
}
.inFlow {
  width: 30px;
  height: 30px;
  margin-top: 8px;
  border-radius: 15px;
  display: inline-block;
}
.inFlow button {
  width: 30px;
  height: 30px;
  padding: 0px;
  position: relative;
}
.inFlow button .plusIco {
  width: 20px;
  position: absolute;
  left: 5px;
  top: 5px;
  margin: 0px;
}
.holderExtraContent {
  clear: both;
  margin-bottom: 60px;
  position: relative;
  top: -118px;
  height: 0px;
  line-height: 0px;
  overflow: hidden;
}
.holderExtraContent .videoSecondary {
  margin-top: 0px;
}
#extraContent3 p,
#extraContent1 p {
  max-width: 450px;
}
#extraContent4 p,
#extraContent6 p,
#extraContent7 p,
#extraContent5 p {
  max-width: 550px;
}
#extraContent0 {
  margin-bottom: 0px;
}
#extraContent0Btn {
  margin-top: 25px;
}
#extraContent8Btn {
  margin-top: 4px;
}
#extraContent4Btn {
  position: absolute;
  top: -54px;
  left: 385px;
  z-index: 2;
}
#extraContent5Btn {
  margin-top: 16px;
}
.extraVidOption {
  width: 50%;
  float: left;
  margin-top: 30px;
}
.extraVidOption img {
  width: 160px;
  display: block;
  float: left;
}
.extraVidOption .extraVidInfo {
  margin: 20px 20px 0px 170px;
}
.extraVidOption .extraVidInfo a {
  display: block;
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 19px;
  text-align: left;
  margin-top: 10px;
  width: 160px;
  line-height: 22px;
}
#ritualsGrey {
  width: 190px;
  display: block;
  height: 95px;
  margin-left: 66%;
}
#ritualsGrey img {
  width: 100%;
  display: block;
  margin-left: -178px;
}
/* symbol------------*/
.symbolHolder {
  width: 140px;
  position: absolute;
  top: 100%;
  left: 100%;
  z-index: 1;
}
.symbolHolder .concertSymbol {
  width: 100%;
  margin-left: -50%;
  margin-top: -50%;
}
.symbolHolderTop {
  top: 0px;
}
/* circle images------------*/
.circImg {
  display: block;
  position: absolute;
  width: 272px;
  top: 10px;
  left: 66.67%;
  opacity: 0;
  z-index: 2;
}
.circImgLg {
  width: 358px;
  height: 358px;
  background-size: cover;
}
#circImgt1 {
  background-image: url(../img/circImgs/walkingWounded_lg.jpg);
}
#circImgt2 {
  top: 50px;
}
#circImgt3 {
  top: 350px;
  margin-left: -272px;
}
#circImgt4 {
  top: 260px;
  background-image: url(../img/circImgs/laLights_lg.jpg);
}
#circImgt5 {
  top: 600px;
  margin-left: -252px;
}
#circImgt6 {
  margin-left: -272px;
  top: 160px;
}
#circImgt7 {
  margin-left: -35px;
  top: 350px;
  background-image: url(../img/circImgs/Israel62_lg.png);
}
#circImgt8 {
  margin-left: -260px;
  top: 740px;
}
#deco0 {
  left: 66.6%;
  top: 460px;
  margin-left: -15px;
  position: absolute;
  z-index: 2;
}
#deco0 .circDecoration {
  width: 18px;
  height: 18px;
  border-radius: 9px;
  background-color: #06ffce;
  position: absolute;
  left: -9px;
  top: -9px;
  float: left;
  position: static;
}
/* side info------------*/
.sideInformation {
  position: absolute;
  right: 0px;
  width: 33.3%;
}
#children {
  bottom: 40px;
  text-align: center;
  opacity: 0;
}
#children .smallFontK {
  line-height: 23px;
}
#children .crown {
  width: 60px;
  margin-top: 15px;
}
#children .crown:last-child {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
/* image slider-----------------------*/
.slideshowHolder {
  background-color: #f4f4f4;
  position: relative;
  margin: 0px 80px 80px 80px;
  height: 700px;
  overflow: hidden;
}
.slideshowHolder .slider {
  position: absolute;
  left: 0px;
  height: 100%;
}
.slideshowHolder .slider .slide {
  float: left;
  height: 100%;
}
.slideshowHolder .slider .slide img {
  display: block;
  margin: 0px auto 0px auto;
}
.slideshowHolder .slider .slide .sliderImgV {
  height: 100%;
}
.slideshowHolder .sliderDescription {
  position: absolute;
  bottom: 0px;
  width: 100%;
  min-height: 40px;
  background: rgba(255, 255, 255, 0.7);
}
.slideshowHolder .sliderDescription p {
  text-align: center;
  color: #000;
  padding: 0px 60px 10px 60px;
}
.slideshowWhite {
  background-color: #ffffff;
}
.sliderBtn {
  width: 80px;
  height: 100%;
  position: absolute;
  top: 0px;
  background-color: #ffffff;
}
.sliderBtn img {
  width: 25px;
  margin: 100px auto;
}
.slideLeft {
  left: 0px;
  opacity: 0.3;
}
.slideLeft img {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.slideRight {
  right: 0px;
}
/* map block-----------------------*/
.mapBlock {
  position: relative;
  background-color: #cdcfcd;
  height: 402px;
  padding: 0px !important;
}
.mapBlock .mapLeft,
.mapBlock .mapRight {
  position: absolute;
  width: 400px;
  top: 0px;
}
.mapBlock .mapLeft img,
.mapBlock .mapRight img {
  display: block;
}
.mapBlock .mapLeft {
  left: -400px;
}
.mapBlock .mapRight {
  right: -400px;
}
.mapBlock .mapMain {
  position: relative;
}
.mapBlock .mapMain .mapImg {
  display: block;
  position: relative;
}
.mapBlock .mapMain .mapPointHolder {
  position: absolute;
  opacity: 0;
}
.mapBlock .mapMain .mapPointHolder .mapPoint {
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #ea5297;
  position: absolute;
  left: -5px;
  top: -5px;
}
.mapBlock .mapMain .mapPointHolder .mapRadialOuter {
  width: 6px;
  height: 6px;
  border-radius: 3px;
  background-color: #ea5297;
  position: absolute;
  left: -3px;
  top: -3px;
}
.mapBlock .mapMain .mapPointHolder .mapRadialInner {
  width: 4px;
  height: 4px;
  border-radius: 2px;
  background-color: #ffffff;
  position: absolute;
  left: -2px;
  top: -2px;
}
.mapBlock .mapMain .mapPointHolder .pointLabel p {
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-transform: none;
  font-size: 20px;
}
.mapBlock .mapMain .mapPointHolder .labelRight,
.mapBlock .mapMain .mapPointHolder .labelLeft {
  position: absolute;
  top: -17px;
  width: 120px;
}
.mapBlock .mapMain .mapPointHolder .labelRight {
  left: 15px;
}
.mapBlock .mapMain .mapPointHolder .labelLeft {
  left: -135px;
  text-align: right;
}
.mapBlock .mapMain .mapPathsArea {
  width: 1180px;
  height: 402px;
  position: absolute;
  top: 0px;
  left: 0px;
}
/* legacy-----------------------*/
#philProjects {
  width: 100%;
  position: relative;
  margin-bottom: 60px;
}
#philProjects h2 {
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  position: absolute;
  bottom: 105px;
  left: -95px;
}
#philProjects h4 {
  font-size: 26px;
  padding-top: 15px;
}
#philProjects .projectImg {
  float: left;
  margin-right: 40px;
  margin-left: 145px;
}
#philProjects a {
  display: block;
  margin-top: 12px;
  position: relative;
}
#philProjects a:hover {
  color: #000;
}
#philProjects .linkArrow {
  width: 8px;
  position: relative;
  top: 5px;
  left: 2px;
}
.project {
  display: inline-block;
  width: 100%;
  margin-bottom: 20px;
}
.project:last-child {
  margin-bottom: 0px;
}
#endQuotes p {
  text-align: center;
}
#endQuotes .plain {
  font-size: 13px;
}
#quotesLine {
  width: 400px;
  display: block;
  margin: 30px auto;
}
#philConcertDesc p {
  display: block;
  width: 67%;
  margin-top: 20px;
}
/* resources-----------------------*/
#resourcesList {
  display: inline-block;
}
#resourcesList h4 {
  margin-bottom: 25px;
  margin-left: 32px;
}
#resourcesList ul {
  margin: 10px 20px 18px 20px;
  padding: 0px;
  list-style: none;
}
#resourcesList p {
  margin: 10px 20px 0px 20px;
}
#resourcesList a {
  color: #333333;
}
#resourcesList a:hover {
  color: #ea5297;
}
#resourcesList .listIco {
  position: absolute;
  width: 20px;
  left: 8px;
  top: 13px;
}
.third {
  float: left;
  width: 33.3%;
  position: relative;
}
#firebird {
  display: block;
  width: 300px;
  margin: 20px auto 60px auto;
}
/* footer-----------------------*/
#philLogoFoot {
  width: 300px;
  display: block;
  margin: 0px auto 0px auto;
}
#EPSsigFoot {
  width: 200px;
  display: block;
  margin: 10px auto 40px auto;
}
#mainFooter {
  padding-top: 45px;
  padding-bottom: 60px;
}
#mainFooter p {
  text-align: center;
  margin-top: 40px;
}
#mainFooter #supportedBy {
  margin-top: 20px !important;
  margin-bottom: 40px !important;
}
#mainFooter #logosHolderOuter {
  width: 719px;
  margin: 0px auto;
}
#mainFooter #mainLogosHolder {
  display: inline-block;
}
#mainFooter .logosHolderInner {
  float: left;
  display: inline-block;
}
#mainFooter #logosHolderInner1 {
  margin-right: 40px;
}
#mainFooter #logosHolderInner2 {
  margin-top: 55px;
}
#mainFooter .mainlogo {
  height: 65px;
  margin-right: 40px;
}
#mainFooter .mainlogo:last-child {
  margin-right: 0px;
}
#mainFooter #RCMLogoM {
  height: 120px;
}
#mainFooter #southbankCenterLogoM {
  height: 58px;
}
#mainFooter button {
  font-size: 22px;
  letter-spacing: 0.06em;
}
#mainFooter button:hover {
  color: #ea5297;
}
/* svg blocks-----------------------*/
.illustrationArea {
  width: 1100px;
  height: 242px;
  position: relative;
}
.curvingPath {
  width: auto;
  position: absolute;
}
#iPathsArea1 {
  height: 60px;
  width: 43px;
}
#iPathsArea2 {
  height: 550px;
  width: 257px;
  top: -90px;
  left: 54%;
}
#iPathsArea3 {
  height: 452px;
  width: 629px;
  bottom: -80px;
  right: 0px;
}
#iPathsArea5 {
  height: 660px;
  width: 226px;
  top: -60px;
  right: 170px;
}
#iPathsArea6 {
  display: none;
}
#iPathsArea7 {
  height: 1270px;
  width: 344px;
  top: 180px;
  left: 43%;
}
#iPathsArea8 {
  height: 312px;
}
#iPathsArea9 {
  height: 286px;
  width: 225px;
  top: 450px;
  right: 25%;
}
#iPathsArea10 {
  height: 890px;
  width: 293px;
  top: -80px;
  left: 32%;
}
#iPathsArea11 {
  height: 316px;
  width: 273px;
  top: 5px;
  right: 128px;
}
#iPathsArea12 {
  height: 839px;
  width: 274px;
  top: 12px;
  right: 264px;
}
.trigEndImg#trig_img8 {
  position: relative;
  top: 100px;
}
#starImg {
  position: absolute;
  right: 85px;
  top: 16px;
  width: 273px;
  z-index: 0;
}
/* tickets (TO MOVE) -----------------------*/
#concertIndicator {
  position: absolute;
  left: 0px;
  width: 50px;
  height: 10px;
}
#concertIndicator .bead {
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: #baeb5c;
  position: absolute;
  left: -5px;
  top: -5px;
  position: relative;
  left: 0px;
  top: -4px;
  float: left;
  opacity: 0;
}
/* video-----------------------*/
.videoMain {
  width: 100%;
  background-color: #eaeaea;
  position: relative;
  margin-bottom: 80px;
  z-index: 1;
  line-height: 0px;
}
.videoMain .videoMainInner {
  height: 663.75px;
  width: 1180px;
  margin: 0px auto;
  position: relative;
}
.videoSecondary {
  position: relative;
  z-index: 1;
  background-color: #eaeaea;
  width: 66%;
  margin-bottom: 80px;
  margin-top: 20px;
  line-height: 0px;
}
.videoSecondary h4 {
  font-size: 24px;
}
.videoSecondary .videoTitleArea {
  bottom: 28px;
}
.videoSecondary video {
  position: relative;
  z-index: 2;
}
.videoSecondary .videoSecInner {
  position: relative;
  z-index: 2;
}
.videoSecTag {
  width: 40px;
  position: absolute;
  top: 0px;
  left: 66%;
  height: 100%;
  margin-left: 6px;
  background-image: url(../img/videoTags.gif);
  background-repeat: no-repeat;
  background-size: 180px 288px;
}
#mythsVidTag {
  background-position: -36px bottom;
}
#tragedyVidTag {
  background-position: -72px top;
}
#ritualsVidTag {
  background-position: -108px bottom;
}
#faithVideoTag {
  background-position: -144px top;
}
.videoSecInfo {
  width: 34%;
  position: absolute;
  left: 66%;
  top: 0px;
}
.videoSecInfo p {
  margin-left: 55px;
  margin-top: -2px;
}
.videoSecInfoBtm {
  top: 0px;
  bottom: 0px;
}
.videoSecInfoBtm p {
  position: absolute;
  bottom: 0px;
}
#legacyVidInfo p {
  margin-left: 40px;
}
#vidInfoROS p {
  margin-left: 40px;
  margin-top: 4px;
  margin-right: 20px;
}
#vidInfoROS p:last-child {
  margin-top: 10px;
}
#parisiansHiss {
  width: 212px;
  margin-left: 40px;
  background-image: url(../img/parisiensHiss.gif);
  background-size: 212px;
  height: 281px;
}
#programmeBook {
  width: 330px;
  margin-left: 40px;
  background-image: url(../img/programmeBook.gif);
  background-size: 330px;
  height: 382px;
  position: absolute;
  right: 0px;
}
.pointCredit {
  position: relative;
  margin-top: 0px;
  margin-bottom: 10px;
  height: 30px;
}
.pointCredit p {
  font-style: italic;
  font-size: 13px;
  line-height: 16px;
  color: #808080;
  margin-top: 0px !important;
  width: auto !important;
  letter-spacing: -0.2px;
}
.creditCirc {
  width: 24px;
  height: 24px;
  border-radius: 12px;
  background-color: #baeb5c;
  position: absolute;
  left: -12px;
  top: -12px;
  position: static;
  display: inline-block;
  margin-right: 2px;
}
.raiseSlightInline {
  display: inline-block;
  position: relative;
  top: -7px;
}
.sideColour {
  background-color: #eaeaea;
  position: absolute;
  width: 100%;
  left: -100%;
  height: 100%;
}
.vidPoster {
  position: absolute;
  width: 100%;
  top: 0px;
  bottom: 0px;
  background-image: url(../img/PostersLg/sara_introduces.jpg);
  background-size: cover;
}
#vidPoster1 {
  background-image: url(../img/postersSecondary/stravinsky_tales.jpg);
}
#vidPoster2 {
  background-image: url(../img/postersSecondary/salonen_rite_of_spring.jpg);
}
#vidPoster3 {
  background-image: url(../img/PostersLg/jonathan_paris1.jpg);
}
#vidPoster4 {
  background-image: url(../img/postersSecondary/stravinsky_myths.jpg);
}
#vidPoster5 {
  background-image: url(../img/postersSecondary/stravinsky_tragedy.jpg);
}
#vidPoster6 {
  background-image: url(../img/PostersLg/la_section.jpg);
}
#vidPoster7 {
  background-image: url(../img/postersSecondary/stravinsky_rituals.jpg);
}
#vidPoster8 {
  background-image: url(../img/postersSecondary/stravinsky_faith.jpg);
}
#vidPoster9 {
  background-image: url(../img/PostersLg/sara_legacy.jpg);
}
.videoTitleArea {
  position: absolute;
  left: 0px;
  bottom: 30px;
  z-index: 2;
  background: rgba(0, 0, 0, 0.5);
}
.videoTitleArea .videoTitle {
  color: #ffffff;
  margin: 15px 15px 10px 40px;
}
.videoPlay {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  /* For some Androids */
  -ms-touch-action: manipulation;
  /* IE10  */
  touch-action: manipulation;
  /* IE11+ */
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0px;
  top: 0px;
  z-index: 2;
}
.videoPlay .playBtn {
  display: block;
  width: 14%;
  margin: 0px auto;
}
/* navigation------------------------------------------------------------- */
#stickyBar {
  width: 100%;
  height: 70px;
  position: absolute;
  z-index: 100;
  background: rgba(255, 255, 255, 0.8);
  top: 175px;
  opacity: 0;
  visibility: hidden;
}
button {
  border: none !important;
  background-color: transparent;
  cursor: pointer !important;
  padding: 0px !important;
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 26px;
}
nav button {
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 22px;
  color: #808080;
  text-decoration: none;
  margin: 16px 0px 12px 0px;
}
#mainMenu {
  margin-left: 0px;
  display: inline-block;
  width: auto;
}
#mainMenu ul {
  padding: 0px;
  margin: 16px 0px 8px 0px;
  display: inline-block;
}
#mainMenu ul li {
  display: block;
  float: left;
  margin-right: 30px;
}
#mainMenu ul li:last-child {
  margin-right: 0px;
}
#mainMenu ul a {
  font-family: "Knockout 48 A", "Knockout 48 B";
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 22px;
  color: #808080;
  text-decoration: none;
}
#timelineMenu {
  float: left;
  margin-right: 30px;
}
#timelineMenu a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  /* For some Androids */
  -ms-touch-action: manipulation;
  /* IE10  */
  touch-action: manipulation;
  /* IE11+ */
}
#timelineMenu a:focus {
  outline: none;
  text-decoration: underline;
}
#btnAbout {
  float: right;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  /* For some Androids */
  -ms-touch-action: manipulation;
  /* IE10  */
  touch-action: manipulation;
  /* IE11+ */
}
/* tickets widget ------------------------------------------------------------- */
#ticketsWidget {
  width: 100%;
  position: absolute;
  top: 120px;
  z-index: 201;
  opacity: 0;
}
#ticketsWidget #ticketsInner,
#ticketsWidget #ticketsOuter {
  height: 110px;
  background-color: #ea5297;
  position: absolute;
}
#ticketsWidget #ticketsOuter {
  width: 50%;
  right: -50%;
  cursor: pointer;
}
#ticketsWidget #ticketsInner {
  overflow: hidden;
  width: 80px;
  right: 0px;
}
#ticketsWidget #ticketsInner .dividingLineTix {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 2px;
  height: 100%;
  background-image: url(../img/dots2_v_w.png);
  background-repeat: repeat-y;
}
#ticketsWidget #ticketsInner #extraLine {
  right: -10px;
}
#ticketsWidget #ticketsInner img {
  width: 13px;
  display: block;
  position: absolute;
  right: 14px;
  top: 30px;
}
#ticketsWidget #ticketsInner .ticketsCTA {
  position: absolute;
  width: 110px;
  text-align: center;
  margin: 0px;
  top: 35px;
  right: 0px;
  color: #ffffff;
  font-size: 28px;
  letter-spacing: 0.1em;
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
#ticketsWidget #ticketsInner #ticketsSpecific {
  right: -95px;
}
#ticketsWidget #ticketsInner #ticketsSpecific p {
  color: #ffffff;
  margin: 0px;
  text-align: center;
}
/* header ------------------------------------------------------------- */
header {
  width: 100%;
}
header h1 {
  font-size: 48px;
  line-height: 40px;
}
header .nonSvgHeader {
  width: 100%;
  text-align: center;
  font-size: 80px;
  display: block;
  line-height: 80px;
  margin-top: -20px;
  margin-bottom: 60px;
}
header h2 {
  color: #808080;
  font-size: 26px;
  line-height: 28px;
}
header h3 {
  font-size: 23px;
  line-height: 19px;
  color: #222222;
  margin-bottom: 5px;
}
header #beginningOpts {
  margin-top: 580px;
  text-align: center;
}
header #beginningOpts #initialLine {
  width: 100px;
  height: 280px;
  margin: -100px auto 0px auto;
}
header #beginningOpts #bookTix {
  margin-top: 20px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  /* For some Androids */
  -ms-touch-action: manipulation;
  /* IE10  */
  touch-action: manipulation;
  /* IE11+ */
}
header #beginningOpts #continue {
  margin-top: 15px;
}
header #beginningOpts #bookTix,
header #beginningOpts #continue,
header #beginningOpts #or {
  opacity: 0;
  visibility: hidden;
}
header .headerTextHolder {
  width: 1100px;
  height: 210px;
  position: relative;
  z-index: 1;
}
header .headerTextHolder .headerText {
  width: 100%;
  height: 100%;
}
header .headerTextHolder .extendedColor {
  width: 50%;
  top: 0px;
  height: 100%;
  position: absolute;
  background-color: #ea5297;
}
header .headerTextHolder .extLeft {
  left: -50%;
}
header .headerTextHolder .extRight {
  right: -50%;
}
#sect_1 .extendedColor {
  background-color: #06ffce;
}
#sect_3 .extendedColor {
  background-color: #4ad5ff;
}
#beatmapHolder {
  overflow: hidden;
  top: 269px;
}
#beatmapHolder #beatmapInner {
  background-image: url(../img/beatmapLines.png);
  background-size: 1100px;
  display: none;
  width: 1100px;
  height: 300px;
  margin: 0px auto;
  overflow: hidden;
}
#beatmapHolder .beatSequence {
  position: absolute;
  width: 100%;
}
#beatmapHolder .beat {
  position: absolute;
}
#philLogo {
  top: -100px;
}
#philLogo img {
  width: 260px;
  display: block;
  margin: 0px auto;
}
#headerGreen {
  background-color: #baeb5c;
  top: 418px;
  width: 100%;
  height: 0px;
  overflow: hidden;
  position: absolute;
}
#headerGreen .holderInner {
  height: 300px;
}
#headerGreen #festivalInfo {
  position: absolute;
  bottom: 89px;
  z-index: 1;
}
#headerGreen #festivalInfo #meyerLogo {
  width: 60px;
  margin-top: 7px;
}
#headerGreen #festivalInfo #headerCredit {
  font-size: 13px;
  line-height: 16px;
  padding-top: 29px;
}
#headerGreen h1 {
  margin-bottom: 11px;
}
#headerGreen .leadImgHolder {
  overflow: hidden;
}
#headerGreen #leadImg {
  display: block;
  height: 300px;
  margin: 0px auto;
  margin-top: -150px;
}
#headerGreen #r3TopLogo {
  position: absolute;
  width: 90px;
  top: -80px;
  left: 0px;
  z-index: 100;
  opacity: 0;
}
/*---------------------------------------------------------------------- MEDIA QUERIES ---------------------------*/
@media screen and (max-width: 1400px) {
  #sect_0 {
    margin-top: 19.5px;
  }
  .holderTW {
    width: 1180px;
  }
}
/*---------------------------------------------------------------------- LARGE ---------------------------*/
@media screen and (max-width: 1260px) {
  #sect_0 {
    margin-top: 19px;
  }
  #mainMenu ul li {
    margin-right: 20px;
  }
  h3 {
    font-size: 80px;
    line-height: 60px;
  }
  .largeFontK {
    font-size: 46px;
    line-height: 40px;
  }
  .padTop {
    padding-top: 12px;
  }
  .padTopExtra {
    padding-top: 35px;
  }
  .quoteBlock p {
    font-size: 26px;
  }
  .yearLonger {
    max-width: 65%;
  }
  .holderOuter,
  .holderTW {
    width: auto;
    margin: 0px 40px;
  }
  .holderInner {
    width: auto;
    margin: 0px 80px;
  }
  #ticketsWidget #ticketsOuter {
    width: 40px;
    right: -40px;
  }
  .videoMain .videoMainInner {
    width: 100%;
    height: auto;
  }
  .videoMain,
  .videoSecondary {
    margin-bottom: 65px;
  }
  .headerTextHolder {
    width: 100%;
  }
  .illustrationArea {
    width: 100%;
  }
  .extraContentBtn button .plusIco {
    margin-top: 28px;
  }
  .extraContentBtn button p {
    margin: 21px 0px 0px 95px;
  }
  .inFlow button .plusIco {
    margin: 0px !important;
  }
  .extraVidOption img {
    width: 120px;
  }
  .extraVidOption .extraVidInfo {
    margin-left: 130px;
    margin-top: -10px;
  }
  #extraContent4Btn {
    left: 355px;
    top: -48px;
  }
  .wAlignBtm .worldEvent,
  .wAlignTop .worldEvent,
  .wAlignYear .worldEvent,
  .wAlignMid .worldEvent {
    left: 120px;
  }
  .wAlignBtm .worldEventMgLeft,
  .wAlignTop .worldEventMgLeft,
  .wAlignYear .worldEventMgLeft,
  .wAlignMid .worldEventMgLeft {
    left: 120px;
  }
  .wAlignYear .worldEvent {
    top: -48px;
  }
  .smallYear {
    height: 60px;
  }
  .smallYear .yearEvents {
    height: 60px;
  }
  #circImgt2 {
    top: 40px;
  }
  #circImgt3 {
    top: 340px;
    margin-left: -220px;
  }
  #deco0 {
    margin-left: 35px;
  }
  #circImgt4 {
    top: 245px;
  }
  #children .crown {
    width: 55px;
  }
  #iPathsArea2 {
    top: -72px;
    left: 50%;
  }
  #iPathsArea7 {
    top: 160px;
  }
  .mapBlock .mapLeft,
  .mapBlock .mapRight {
    display: none;
  }
  .premiereLine {
    width: 400px;
  }
  #year11 {
    max-width: 35%;
  }
  #year12 {
    max-width: 45%;
  }
  #year13 .floatLeft {
    float: none;
    margin-right: 0px;
  }
  #year18 .yearEvents,
  #year19 .yearEvents {
    clear: both;
    padding-top: 3px;
  }
  #year13 .padTopExtra {
    padding-top: 5px;
  }
  #year26 {
    background-color: #ffffff;
  }
  #parisiansHiss {
    margin-left: 30px;
  }
  #vidInfoROS p {
    margin-left: 30px;
    margin-right: 40px;
  }
  #veniceFullscreen {
    background-image: url(../img/venice_lg.jpg);
  }
  #LAFullscreen {
    background-image: url(../img/La_eveninglight_lg.jpg);
  }
  #endImgFullscreen {
    background-image: url(../img/end_lg.jpg);
  }
  #ladiesAnd {
    margin-bottom: 70px !important;
  }
}
/*----------------------------- EXTRA ---------------------------*/
@media screen and (max-width: 1140px) {
  .showMed {
    display: block;
  }
  #children .crown {
    width: 50px;
  }
  #children .smallFontK {
    font-size: 20px;
    line-height: 21px;
  }
  .noMaxW {
    max-width: 100% !important;
  }
  .plain,
  p {
    font-size: 14.5px;
  }
  #circImgt4 {
    top: 230px;
  }
  #circImgt5 {
    margin-left: 10px;
    top: 610px;
  }
  #iPathsArea9 {
    display: none;
  }
  #circImgt6 {
    margin-left: -230px;
  }
  #circImgt7 {
    margin-left: -60px;
    top: 365px;
  }
  #circImgt8 {
    margin-left: -200px;
  }
  #ladiesAnd {
    margin-bottom: 66px !important;
  }
  #year30,
  #year31,
  #year33 {
    height: auto;
  }
  #year30 .floatLeft,
  #year31 .floatLeft,
  #year33 .floatLeft {
    float: none;
    margin-right: 0px;
  }
  #year30 .worldEvent,
  #year31 .worldEvent,
  #year33 .worldEvent {
    position: static;
  }
  #year30 .yearEvents,
  #year31 .yearEvents,
  #year33 .yearEvents {
    height: auto;
  }
  #year30 .padTop,
  #year31 .padTop,
  #year33 .padTop {
    padding-top: 0px;
  }
  #year1 {
    max-width: none;
  }
  #extraContent0 {
    max-width: 550px;
  }
  #year6 {
    max-width: 60%;
  }
  #year6 p.plain {
    margin-right: 10px;
  }
  #year8Holder {
    top: 80px;
  }
  #circImgt1 {
    margin-left: -35px;
  }
  #programmeBook {
    height: 100%;
    width: auto;
    margin-left: 40px;
    background-image: url(../img/programmeBook_noTxt.png);
    width: 197px;
    height: 258px;
    background-size: cover;
    margin-bottom: 12px;
  }
  #legacyVidInfo .creditCirc {
    margin-right: 5px;
  }
  #legacyVidInfo .raiseSlightInline {
    top: 0px;
  }
  .beatLineAcross {
    width: 500px;
  }
  #starImg {
    right: 0px;
  }
  #iPathsArea11 {
    right: 43px;
  }
  #iPathsArea12 {
    right: 179px;
  }
}
@media only screen and (max-width: 1100px) {
  #beatmapHolder #beatmapInner {
    width: 100%;
  }
}
/*---------------------------------------------------------------------- MEDIUM SMALL ---------------------------*/
@media only screen and (max-width: 992px) {
  #invisBtn { display: none; }
  #sect_0 {
    margin-top: 18px;
  }
  /* text-----------------------*/
  h3 {
    font-size: 70px;
    line-height: 54px;
  }
  .largeFontK {
    font-size: 42px;
    line-height: 38px;
  }
  .medLgFontK {
    font-size: 36px;
    line-height: 34px;
  }
  .medFontK {
    font-size: 24px;
    line-height: 24px;
  }
  .smallFontK {
    font-size: 20px;
    line-height: 20px;
  }
  .plain,
  p {
    font-size: 14px;
    line-height: 17px;
  }
  .premiereDate .plain {
    font-size: 13px;
    letter-spacing: -0.2px;
  }
  .indentTxt {
    padding-left: 60px;
  }
  .textBeats {
    width: 100px;
    top: 40px;
  }
  #textBeats2 {
    top: 12px;
    height: 16px;
  }
  #textBeats3 {
    background-position: 0px -62px;
  }
  /* layout-----------------------*/
  .holderTW,
  .holderOuter {
    margin: 0px;
  }
  #ticketsWidget #ticketsOuter {
    display: none;
  }
  .holderInner {
    margin: 0px 60px;
  }
  .extraMarginBottom {
    margin-bottom: 60px !important;
  }
  .extraMarginTop {
    margin-top: 60px !important;
  }
  .hiddenSmall {
    display: none;
  }
  .showSmall {
    display: block;
  }
  /* header-----------------------*/
  #headerGreen #leadImg {
    margin-left: 25%;
    margin-right: 0px;
  }
  #headerGreen #r3TopLogo {
    top: -180px;
  }
  #mainMenu ul li {
    margin-right: 15px;
  }
  #timelineMenu {
    margin-right: 25px;
  }
  /* blocks-----------------------*/
  .quoteBlock {
    width: auto;
  }
  .quoteBlock p {
    font-size: 24px;
    line-height: 26px;
  }
  .slideshowHolder {
    margin: 0px 60px 60px 60px;
  }
  .sliderBtn {
    width: 60px;
  }
  .circImgLg {
    width: 272px;
    height: 272px;
  }
  .year {
    max-width: 55% !important;
  }
  .year p.plain {
    font-size: 14px;
    line-height: 17px;
  }
  .year .worldEvent {
    min-height: 30px;
    margin-bottom: 0px;
  }
  .year .worldEvent p {
    font-size: 20px;
    line-height: 20px;
    padding-top: 5px;
    margin-top: 5px;
  }
  .year .worldIco {
    width: 30px;
  }
  .yearXl {
    max-width: 55%;
  }
  .smallYear {
    height: 54px;
  }
  .smallYear .yearEvents {
    height: 54px;
  }
  .wAlignBtm .worldEvent,
  .wAlignTop .worldEvent,
  .wAlignYear .worldEvent,
  .wAlignMid .worldEvent {
    left: 105px;
  }
  .wAlignBtm .worldEvent p,
  .wAlignTop .worldEvent p,
  .wAlignYear .worldEvent p,
  .wAlignMid .worldEvent p {
    margin-left: 45px;
    margin-top: 0px;
  }
  .wAlignBtm .worldEventMgLeft,
  .wAlignTop .worldEventMgLeft,
  .wAlignYear .worldEventMgLeft,
  .wAlignMid .worldEventMgLeft {
    left: 110px;
  }
  .wAlignYear .worldEvent {
    top: -40px;
  }
  .mapBlock {
    height: auto;
  }
  #mapQuote {
    font-size: 28px;
    position: static;
    width: auto;
    margin: 20px 0px 60px 0px;
    text-align: center;
  }
  #mapQuote p {
    margin-top: 4px;
  }
  #mapQuote .mapQInner {
    width: auto;
  }
  .extraContentBtn button .plusIco {
    margin-left: 30px;
    margin-top: 24px;
  }
  /* video-----------------------*/
  .videoMain,
  .videoSecondary {
    margin-bottom: 55px;
    background-color: transparent;
  }
  .videoSecondary .videoTitleArea,
  .videoTitleArea {
    bottom: 15px;
  }
  .videoSecondary .videoTitleArea h4,
  .videoTitleArea h4 {
    font-size: 22px;
    line-height: 22px;
  }
  .videoSecondary .videoTitleArea .videoTitle,
  .videoTitleArea .videoTitle {
    margin: 8px 15px 10px 60px;
  }
  .videoSecInfo p {
    margin-right: 60px;
  }
  .symbolHolder .concertSymbol {
    width: 100%;
    margin-left: -100%;
    margin-top: -50%;
  }
  #AgonVid,
  #talesVid {
    margin-bottom: 20px;
  }
  #talesVid {
    margin-top: 130px;
  }
  #ritualsVidTag,
  #talesVidTag {
    height: 285px !important;
  }
  #AgonVidInfo,
  #talesVidInfo {
    width: auto;
    position: static;
    margin-bottom: 55px;
  }
  #AgonVidInfo p,
  #talesVidInfo p {
    margin-left: 60px;
    margin-top: 8px;
    margin-right: 60px;
    position: static;
  }
  #talesVidInfo {
    margin-bottom: 60px;
  }
  #talesSHolder {
    top: 0px;
  }
  /* individual elements-----------------------*/
  .sideInformation {
    position: relative;
    width: auto;
    max-width: 60%;
  }
  #children {
    bottom: 40px;
    text-align: left;
    margin-bottom: 15px;
    opacity: 1;
  }
  #children .crown {
    display: none;
  }
  #extraContent0Btn {
    position: absolute;
    top: 10px;
    left: 275px;
  }
  #extraContent4Btn {
    left: 322px;
  }
  #extraContent6 p {
    max-width: 400px;
  }
  #ritualsGrey {
    width: 170px;
  }
  .extraVidOption img {
    width: 120px;
    float: none;
  }
  .extraVidOption .extraVidInfo {
    margin-left: 0px;
    margin-top: 10px;
    float: none;
    clear: both;
  }
  #parisiansHiss {
    margin-left: 20px;
    margin-right: 60px;
    background-image: url(../img/parisiensHiss_noTxt.gif);
    width: 180px;
    height: 252px;
    background-size: 180px;
    background-repeat: no-repeat;
  }
  #vidInfoROS p {
    margin-left: 20px;
    margin-right: 60px;
  }
  #programmeBook {
    margin-left: 20px;
  }
  #year3,
  #year14,
  #year4,
  #year9,
  #year0 {
    max-width: none !important;
  }
  #year6 .worldEvent,
  #year30 .worldEvent,
  #year31 .worldEvent {
    margin-top: 12px;
  }
  #year6 {
    max-width: 58%;
  }
  #year8Holder {
    top: 0px;
    position: static;
    margin-top: 60px;
    margin-bottom: 0px;
  }
  #year10 {
    margin-bottom: 30px;
  }
  #year11,
  #year12 {
    max-width: 55%;
  }
  #year18,
  #year19,
  #year23,
  #year31,
  #year33 {
    max-width: none !important;
  }
  #year26 .yearEvents p {
    padding-left: 125px;
  }
  #year14 {
    background-color: #ffffff;
  }
  #iPathsArea6,
  #iPathsArea12,
  #iPathsArea10,
  #iPathsArea12,
  #iPathsArea3 {
    display: none;
  }
  #iPathsArea2 {
    left: 44%;
  }
  #iPathsArea11 {
    left: 0px;
    top: 100px;
  }
  #starImg {
    position: static;
    margin-left: 41px;
    margin-bottom: 60px;
  }
  #map1Holder {
    margin-top: 0px;
  }
  #map1 {
    margin-left: -70px;
  }
  #premiere1 {
    top: -10px;
  }
  #premiere13 {
    top: -60px;
  }
  #premiere14 {
    top: 55px;
  }
  #premiere15 {
    top: 150px;
  }
  #circImgt0 {
    left: auto;
    right: 0px;
    top: -25px;
  }
  #circImgt1 {
    margin-left: 0px;
    left: auto;
    right: 0px;
    background-image: url(../img/circImgs/walkingWounded.jpg);
  }
  #circImgt2 {
    top: 20px;
    left: auto;
    right: 0px;
  }
  #circImgt3 {
    position: static;
    margin-left: 0px;
    margin-bottom: 30px;
  }
  #deco0 {
    left: 0px;
    margin-left: 256px;
    top: 410px;
  }
  #circImgt4 {
    top: 235px;
    left: auto;
    right: 0px;
    background-image: url(../img/circImgs/laLights.jpg);
  }
  #circImgt5 {
    top: 555px;
    left: auto;
    right: 0px;
  }
  #circImgt6 {
    display: none;
  }
  #circImgt7 {
    margin-left: 0px;
    left: auto;
    right: 0px;
    background-image: url(../img/circImgs/Israel62.png);
  }
  #circImgt8 {
    margin-left: 0px;
    left: auto;
    right: 0px;
  }
  #philProjects h2 {
    margin-left: 60px;
  }
  #philProjects h4 {
    padding-top: 5px;
  }
  #philProjects .projectImg {
    margin-left: 205px;
    margin-right: 20px;
  }
  .project p {
    margin-right: 60px;
  }
  #mainFooter #logosHolderOuter,
  #mainFooter #mainLogosHolder {
    width: 100%;
  }
  #mainFooter .logosHolderInner {
    float: none;
    clear: both;
    display: block;
  }
  #mainFooter #logosHolderInner1 {
    width: 218px;
    margin: 0px auto;
  }
  #mainFooter #logosHolderInner2 {
    width: 465px;
    margin: 40px auto 0px auto;
  }
  #veniceFullscreen {
    background-image: url(../img/venice_med.jpg);
  }
  #LAFullscreen {
    background-image: url(../img/La_eveninglight_med.jpg);
  }
  #endImgFullscreen {
    background-image: url(../img/end_med.jpg);
  }
  #extraContent5 {
    margin-bottom: 20px;
  }
  #year8Holder .whiteTxt {
    color: #b7b7b7;
  }
  #year8Holder .year p {
    width: auto;
  }
  #slider3 {
    margin-bottom: 120px;
  }
  #extraContent4 p,
  #extraContent5 p,
  #extraContent6 p,
  #extraContent7 p,
  #extraContent8 p,
  #extraContent3 p,
  #extraContent1 p {
    max-width: none;
    margin-right: 0px;
  }
  #philProjects h2 {
    bottom: 110px;
  }
  #year26 .padTop {
    padding-top: 0px !important;
  }
}
/*---------------------------------------------------------------------- SMALL ---------------------------*/
@media only screen and (max-width: 767px) {
  #sect_0 {
    margin-top: 17px;
  }
  .mobileOnly {
    display: block !important;
  }
  .mobileGap {
    height: 4px;
  }
  .mobileOnlyInline {
    display: inline !important;
  }
  .hiddenSmall {
    display: block;
  }
  .hiddenMobile {
    display: none !important;
  }
  #specialFloatLeft {
    margin-bottom: 6px;
  }
  .holderInner {
    margin: 0px 30px;
  }
  .floatLeft {
    float: none;
    margin-right: 15px;
    display: block;
  }
  .floatLeftinTxt {
    max-width: 270px;
  }
  .indentTxt {
    padding-left: 0px;
  }
  .lower {
    margin-top: 4px;
  }
  .mobileDecoration {
    height: 20px;
    width: auto;
    position: relative;
    top: 5px;
  }
  .plain,
  p {
    margin-top: 8px;
  }
  h3 {
    font-size: 60px;
    line-height: 44px;
  }
  h4 {
    font-size: 20px;
    line-height: 24px;
  }
  h6 {
    font-size: 18px;
    line-height: 17px;
  }
  .largeFontK {
    font-size: 36px;
    line-height: 34px;
  }
  .quoteBlock p {
    font-size: 20px;
    line-height: 20px;
  }
  .raiseMid {
    margin-top: 6px !important;
  }
  #slider3 {
    margin-bottom: 60px;
  }
  #slider4 .slideshowHolder {
    background-color: #f4f4f4;
  }
  .sliderDescription p {
    font-size: 13px;
    line-height: 16px;
  }
  .videoSecInfoBtm p {
    position: static;
  }
  /*-------------------------------------------------------------- blocks */
  #philProjects h4 {
    padding-top: 10px;
    padding-bottom: 5px;
  }
  #DylanT {
    margin-top: 2px;
  }
  .doubleUnderline .ticketsUnderline {
    width: 40%;
    margin-left: 30%;
    margin-right: 30%;
  }
  .extraContentBtn button .peekScreenshot {
    width: 100%;
    display: block;
  }
  .extraContentBtn button .expandInstruction {
    float: none;
    width: 100%;
  }
  .extraContentBtn button .plusIco {
    margin-top: 2px;
    margin-left: 30px;
  }
  .extraContentBtn button p {
    margin: 15px 30px 15px 95px;
  }
  #ritualsGrey {
    width: 100px;
    height: 50px;
  }
  #ritualsGrey img {
    margin-left: -100px;
  }
  #vidInfoROS {
    margin-bottom: 20px;
  }
  #vidInfoROS p {
    margin: 0px 30px 0px 30px;
    text-align: center;
  }
  #parisiansHiss,
  #programmeBook {
    display: block;
    margin: 20px auto 0px auto;
  }
  #programmeBook {
    margin-bottom: 12px;
  }
  .pointCredit {
    text-align: center;
  }
  .pointCredit p {
    margin-left: 0px !important;
    text-align: center;
    width: 100% !important;
  }
  .creditCirc {
    margin-right: 5px;
  }
  .twoThirds {
    margin-top: 30px;
    text-align: center;
  }
  .twoThirds {
    max-width: 100%;
  }
  .extraVidOption {
    width: 100%;
    float: none;
  }
  .extraVidOption .extraVidInfo {
    margin: 10px 0px 0px 0px;
  }
  .extraVidOption .extraVidInfo button {
    margin-top: 5px;
  }
  .extraVidOption .extraVidInfo a {
    margin: 10px auto 0px auto;
    text-align: center;
  }
  .extraVidOption img {
    margin: 0px auto;
  }
  .premiereDate {
    min-height: 56px;
    clear: both;
    top: -30px !important;
    margin-bottom: 0px;
  }
  .premiereDate .premiereInner {
    width: 200px;
  }
  .circImg {
    display: block;
    position: static;
    margin: 0px auto 60px auto;
  }
  #circImgt0 {
    margin-top: 30px;
  }
  #circImgt1 {
    margin-top: -20px;
  }
  #circImgt2 {
    margin-bottom: 30px;
  }
  #circImgt3 {
    margin: 0px auto 60px auto;
  }
  #circImgt5 {
    margin-left: auto;
    margin-right: auto;
  }
  #deco0 {
    display: none;
  }
  #circImgt8 {
    margin-top: -30px;
  }
  .year {
    max-width: 100% !important;
  }
  .year p.plain {
    margin-top: 8px;
  }
  .year .yearLine {
    top: 22px;
  }
  .year .worldEvent {
    clear: both;
    margin-top: 10px;
  }
  .year .worldEvent p {
    padding-top: 2px;
  }
  .year .worldIco {
    width: 30px;
    margin-right: 10px;
  }
  .year .firstPara {
    margin-top: 10px;
  }
  .year .textBeats {
    display: none;
  }
  .noMarginMob {
    margin-bottom: 0px !important;
  }
  .smallYear {
    height: auto;
  }
  .smallYear .yearEvents {
    height: 44px;
  }
  .wAlignBtm .worldEvent,
  .wAlignTop .worldEvent,
  .wAlignYear .worldEvent,
  .wAlignMid .worldEvent {
    position: relative;
    left: 0px;
    top: 0px;
  }
  .yearLonger p.plain {
    margin-right: 0px;
  }
  .sideInformation {
    max-width: 100%;
  }
  #children {
    bottom: 0px !important;
    margin-bottom: 55px;
  }
  .third {
    float: none;
    width: 100%;
  }
  #resourcesList .listIco {
    top: 7px;
  }
  #resourcesList h4 {
    margin-bottom: 10px;
  }
  #philProjects h2 {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    position: static;
    font-size: 40px;
    line-height: 40px;
    margin-left: 30px;
    margin-bottom: 20px;
  }
  #philProjects .projectImg {
    margin-left: 30px;
    margin-right: 20px;
  }
  /* individual elements-----------------------*/
  #year7 .worldEvent,
  #year8 .worldEvent,
  #year12 .worldEvent,
  #year15 .worldEvent,
  #year16 .worldEvent,
  #year17 .worldEvent,
  #year27 .worldEvent {
    margin-top: 12px;
  }
  #extraContent0 {
    max-width: none;
    margin-right: 0px;
  }
  #iPathsArea5,
  #iPathsArea7,
  #iPathsArea2 {
    display: none;
  }
  #year11,
  #year12 {
    max-width: none;
    width: auto;
  }
  #year12 .worldEvent {
    clear: none;
    display: inline-block;
  }
  .inFlow {
    margin-top: 4px;
  }
  #extraContent0Btn {
    position: static;
    margin-top: 4px;
  }
  #RK {
    max-width: none;
  }
  #extraContent3Btn {
    position: relative;
    display: inline-block;
    top: 6px;
    left: 6px;
  }
  #extraContent4Btn {
    top: 4px;
    left: 217px;
  }
  #iPathsArea11 {
    top: 150px;
    left: 30px;
  }
  #premiere4 {
    margin-bottom: 20px;
  }
  #premiere6,
  #premiere7 {
    top: 0px !important;
    margin-bottom: 30px;
  }
  #year26 .yearEvents p {
    padding-left: 0px;
  }
  #year33 {
    margin-top: 0px;
  }
  #premiere13 {
    top: 0px !important;
  }
  #premiere14 {
    top: 30px !important;
  }
  #ritualsVidTag,
  #talesVidTag {
    display: none;
  }
  #AgonVidInfo p,
  #talesVidInfo p {
    margin-left: 30px;
    margin-right: 30px;
  }
  #talesVid {
    margin-top: 60px;
  }
  .beatLineAcross {
    display: none;
  }
  #legacyVidInfo {
    margin-bottom: 0px;
  }
  #philConcertDesc p {
    display: block;
    width: auto;
    margin: 20px 30px 0px 30px;
    text-align: center;
  }
  #firebird {
    width: 200px;
  }
  /* map-----------------------*/
  #map1 {
    margin-left: -120px;
  }
  #mapQuote {
    font-size: 20px;
    line-height: 22px;
    margin: 20px 0px 55px 0px;
  }
  /* image slider-----------------------*/
  .slideshowHolder {
    margin: 0px 30px 60px 30px;
  }
  .slideshowHolder .sliderDescription {
    height: auto;
  }
  .slideshowHolder .sliderDescription p {
    padding: 0px 20px 8px 20px;
  }
  .sliderBtn {
    width: 30px;
  }
  .sliderBtn img {
    width: 15px;
    margin: 30px auto;
  }
  /*-------------------------------------------------------------- video */
  .videoSecondary .videoTitleArea,
  .videoTitleArea {
    bottom: 0px;
  }
  .videoSecondary .videoTitleArea .videoTitle,
  .videoTitleArea .videoTitle {
    margin: 15px 30px 10px 30px;
  }
  .videoSecondary {
    width: 100%;
    margin-bottom: 10px;
  }
  .videoSecondary h4 {
    font-size: 20px;
  }
  .videoSecTag {
    width: auto;
    position: static;
  }
  .videoSecTag h4 {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    font-size: 24px;
    position: static;
    margin: 0px 30px;
  }
  .videoSecInfo {
    width: auto;
    position: static;
    margin-bottom: 55px;
  }
  .videoSecInfo p {
    margin-left: 30px;
    margin-top: 8px;
    margin-right: 30px;
  }
  .symbolHolder {
    display: none;
  }
  /*-------------------------------------------------------------- intro */
  #headerGreen {
    background-color: transparent;
    margin-top: 190px;
    position: static;
    height: auto;
  }
  #headerGreen .holderInner {
    margin: 0px;
    height: auto;
  }
  #headerGreen #r3TopLogo {
    display: none;
  }
  #headerGreen #festivalInfo {
    position: static;
    background-color: #b7b7b7;
    margin-top: 10px;
    padding: 24px 30px 20px 30px;
  }
  #headerGreen #festivalInfo #headerCredit {
    padding-top: 0px;
  }
  #headerGreen #leadImgHolder {
    width: 200%;
    position: relative;
    left: -50%;
    background-color: #baeb5c;
  }
  #headerGreen #leadImgHolder #leadImg {
    margin: 0px auto;
    height: 300px;
    max-width: 533px;
  }
  #beatmapHolder {
    top: 198px;
  }
  header #beginningOpts {
    margin-top: 10px;
  }
  .illustrationArea {
    margin-left: -30px;
  }
  #mainFooter #logosHolderOuter,
  #mainFooter #mainLogosHolder {
    width: 100%;
  }
  #mainFooter .logosHolderInner {
    width: 100%;
    float: none;
    clear: both;
    display: block;
    margin-top: 0px !important;
  }
  #mainFooter .mainlogo {
    display: block;
    margin: 40px auto !important;
  }
  #mainFooter p {
    margin: 0px 30px;
  }
  /*-------------------------------------------------------------- navigation */
  #mobileButtons {
    width: auto;
    height: 55px;
  }
  #mobileButtons #mobileMenuBtnHolder {
    width: 82px;
    height: 55px;
    position: absolute;
    margin: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    /* For some Androids */
    -ms-touch-action: manipulation;
    /* IE10  */
    touch-action: manipulation;
    /* IE11+ */
  }
  #mobileButtons #mobileMenuBtnHolder #mobileMenuBtn {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    /* For some Androids */
    -ms-touch-action: manipulation;
    /* IE10  */
    touch-action: manipulation;
    /* IE11+ */
    position: absolute;
    left: 30px;
    top: 0px;
    width: 30px;
    height: 55px;
    z-index: 200;
  }
  #stickyBar {
    width: 100%;
    height: 55px;
    background-color: #ea5297;
    top: 0px;
    left: 0px;
    position: fixed;
    opacity: 0;
    visibility: visible;
  }
  #stickyBar .holderInner {
    margin: 0px;
  }
  #mainMenu {
    left: -150%;
    position: fixed;
    top: 55px;
    bottom: 0px;
    display: block;
    background-color: #ffffff;
    width: 100%;
    z-index: 202;
  }
  #mainMenu ul {
    margin: 8px 30px 8px 30px;
    display: block;
  }
  #mainMenu ul li {
    float: none;
    margin-bottom: 10px;
    margin-right: 0px;
  }
  #mainMenu ul li a {
    display: block;
    margin-bottom: 8px;
  }
  #timelineMenu {
    float: none;
    margin-right: 0px;
  }
  #timelineMenu #menuHead {
    margin: 30px 30px 0px 30px;
  }
  #timelineMenu #menuHead h4 {
    font-size: 22px;
    color: #ea5297;
    padding-bottom: 16px;
  }
  #timelineMenu #sectionIndicator {
    position: absolute;
    left: 10px;
    top: 85px;
    width: 15px;
  }
  #timelineMenu #sectionIndicator img {
    width: 100%;
  }
  #btnAbout {
    float: none;
    margin-left: 30px;
  }
  /*-------------------------------------------------------------- navigation */
  #ticketsWidget {
    left: 0px;
    position: fixed;
    top: 0px;
  }
  #ticketsWidget #ticketsInner,
  #ticketsWidget #ticketsOuter {
    height: 55px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    /* For some Androids */
    -ms-touch-action: manipulation;
    /* IE10  */
    touch-action: manipulation;
    /* IE11+ */
  }
  #ticketsWidget #ticketsInner {
    border-left: 2px #ffffff solid !important;
    width: auto;
    left: 80px;
    right: auto;
  }
  #ticketsWidget #ticketsInner img {
    display: none;
  }
  #ticketsWidget #ticketsInner .ticketsCTA {
    position: static;
    width: auto;
    text-align: left;
    margin: 10px 30px;
    letter-spacing: 0.1em;
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    float: left;
  }
  #ticketsWidget #ticketsInner #ticketsSpecific {
    position: absolute;
    left: 150%;
    right: auto !important;
    top: 0px;
    margin: 16px 30px;
  }
  #ticketsWidget #ticketsInner #ticketsSpecific p {
    font-size: 28px;
  }
  #ticketsWidget #ticketsInner .dividingLineTix {
    top: 0px;
    right: auto;
    left: 140px;
  }
}
@media only screen and (max-width: 550px) {
  #map0 {
    margin-left: 45px;
  }
  #map1 {
    margin-left: -100px;
  }
  #map2 {
    margin-left: 70px;
  }
  .trigEndMap {
    position: relative;
    top: -200px;
  }
  #loading {
    margin-top: 50px;
  }
  #loading #loadingCirc {
    width: 300px;
    height: 300px;
    border-radius: 150px;
    background-color: #4ad5ff;
    position: absolute;
    left: -150px;
    top: -150px;
    position: relative;
    top: 0px;
    left: 0px;
  }
  #loading p {
    width: 220px;
    top: 100px;
  }
  #loading #welcome {
    padding-top: 60px;
  }
  #philProjects h2 {
    margin-right: 30px;
    text-align: center;
  }
  #philProjects .projectImg {
    display: block;
    margin: 0px auto;
    float: none;
    clear: both;
  }
  #philProjects h4,
  #philProjects p {
    margin: 0px 30px;
    text-align: center;
  }
  #philProjects a {
    margin-left: 30px;
    margin-right: 30px;
    text-align: center;
  }
  .nonSvgHeader {
    font-size: 50px !important;
    line-height: 46px !important;
  }
  #quotesLine {
    width: 260px;
  }
  .logosHolderInner {
    width: 300px !important;
  }
  #veniceFullscreen {
    background-image: url(../img/venice_sm.jpg);
  }
  #LAFullscreen {
    background-image: url(../img/La_eveninglight_sm.jpg);
  }
  #endImgFullscreen {
    background-image: url(../img/end_sm.jpg);
  }
}
@media only screen and (max-width: 400px) {
  #starImg {
    margin-left: 20px;
  }
  #iPathsArea11 {
    left: 10px;
  }
  #philLogoFoot {
    width: 250px;
  }
  #EPSsigFoot {
    width: 140px;
  }
  #ticketsWidget #ticketsInner {
    border-left: 1px #ffffff solid !important;
    left: 90px;
  }
  #ticketsWidget #ticketsInner .ticketsCTA {
    margin: 10px 15px;
  }
  #ticketsWidget #ticketsInner #ticketsSpecific {
    margin: 16px 15px;
  }
  #ticketsWidget #ticketsInner .dividingLineTix {
    top: 0px;
    right: auto;
    left: 110px;
  }
  .floatLeftinTxt {
    max-width: 250px;
  }
  #RK {
    max-width: 250px;
  }
}
