/*
Edited YUI CSS Reset

Copyright (c) 2011, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.com/yui/license.html, version: 2.9.0
*/
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,button,caption,cite,code,dfn,em,input,optgroup,option,select,strong,textarea,th,var{font:inherit}del,ins{text-decoration:none}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:baseline}sub{vertical-align:baseline}legend{color:#000}a{color:inherit;text-decoration:none}header,footer,section,nav{display:block}

html, body {
  min-height: 100%;
  height: 100%;
}
#intro, #intro>div {
  height: 100%;
  overflow: hidden;
}
.contentcontainer {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.contentx {
  width: 1920px;
  height: 1200px;
  position: absolute;
  left: 50%;
  bottom: 0%;
  background: url("../res/base.jpg") no-repeat 560px 420px;
  margin-left: -960px;
/*   margin-top: -600px; */
  transform-origin: 50% 100%;
}
.unifooter {
  height: 30px;
  width: 100%;
  background: white;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 100;
}
.unifooter h1 {
  width: 1200px;
  margin: 0 auto;
  height: 30px;
  position: relative;
}
.unifooter h1 a {
  display: block;
  height: 79px;
  margin-top: -49px;
  width: 150px;
  overflow: hidden;
  text-indent: -10000px;
  background: url("tmplogo.png?v=1") no-repeat;
}
.contentx>div.shown {
  visibility: visible;
  opacity: 1;
}
.contentx>div {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}
.step1 {
  background: url("../res/85.jpg?v=1") no-repeat 560px 700px;
}
.step2 {
  background: url("../res/86.jpg?v=1") no-repeat 560px 700px;
}
.step3 {
  background: url("../res/85.jpg?v=1") no-repeat 560px 700px;
}
.step4 {
  background: url("../res/86.jpg?v=1") no-repeat 560px 700px;
}
.step5 {
  background: url("../res/85.jpg?v=1") no-repeat 560px 700px;
}
.step6 {
  background: url("../res/86.jpg?v=1") no-repeat 560px 700px;
}
.step7 {
  background: url("../res/85.jpg?v=1") no-repeat 560px 700px;
}
.step8 {
  background: url("../res/87.jpg?v=1") no-repeat 560px 700px;
}
.step9 {
  background: url("../res/88.jpg?v=1") no-repeat 560px 700px;
}
.step10 {
  background: url("../res/89.jpg?v=1") no-repeat 560px 700px;
}
.step11 {
  background: url("../res/96.jpg?v=1") no-repeat 1380px 420px;
}
.step12 {
  background: url("../res/97.jpg?v=1") no-repeat 1380px 420px;
}
.step13 {
  background: url("../res/98.jpg?v=1") no-repeat 1380px 420px;
}
.step14 {
  background: url("../res/99.jpg?v=1") no-repeat 1380px 420px;
}



#intro .down {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 40px;
  background: white;
  bottom: -160px;
  transition: 1s bottom; -webkit-transition: 1s bottom;
}
#intro .down.shown {
  bottom: 0px;
}

#intro .down h1 {
  position: absolute;
  bottom: 20px;
  left: 50%;
  margin-left: -359px;
  width: 150px;
  height: 80px;
  text-indent: -1000px;
  overflow: hidden;
  background: url("https://www.unicorntheatre.com/bundles/unicorn/img/logo.png") no-repeat 50% 50%;
}

#intro nav {
  position: absolute;
  top: 35%;
  height: 120px;
  line-height: 120px;
  margin-top: -60px;
  width: 100%;
  left: 0px;
  text-align: center;
  font-family: "SugoRegular";
/*   font-size: 60px; */
  font-size: 70px;
  color: black;
  text-transform: uppercase;
  text-shadow: 0px 0px 8px rgba(255,255,255,1);
}
#intro nav a {
  color: black;
}
#intro nav a:hover {
/*   text-decoration: underline; */
  border-bottom: 6px solid black;
}
@media screen and (max-width: 767px) {
  #intro nav a:hover {
    border-bottom: 4px solid black;
  }
}
#intro nav.white {
  color: white;
  text-shadow: 0px 0px 8px rgba(0,0,0,1);
}
#intro nav.white a {
  color: white;
}
#intro nav.white a:hover {
  border-bottom: 6px solid white;
}
#intro nav.grey,
#intro nav.grey a {
  color: #686564;
}
#intro nav.grey a:hover {
  border-bottom: 6px solid #686564;
}

#intro>div.customintro {
  position: relative;
}
#intro>div.customintro>img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1920px;
  height: 1200px;
  margin: -600px 0 0 -960px;
}
@media screen and (max-width: 767px) {
  #intro .down h1 {
    margin-left: 0px;
    left: 20px;
    width: 87px;
    height: 46px;
    background-size: 87px 46px;
  }
  #intro nav {
    position: absolute;
    top: 35%;
    height: 120px;
    line-height: 40px;
    margin-top: -40px;
    width: 80%;
    left: 10%;
    text-align: center;
    font-family: "SugoRegular";
  /*   font-size: 60px; */
    font-size: 35px;
    color: black;
    text-transform: uppercase;
    text-shadow: 0px 0px 8px rgba(255,255,255,1);
  }
  #intro nav a.eelse::before {
    content: "\A";
    white-space: pre;
  }

}
