@charset "UTF-8";
/* CSS Document */

/**global styles **/
body {
  font-size: 1em;
  font-family: 'Open Sans',
  sans-serif; color:#747474;
}

a {}
p {font-size: 1.5625em; line-height: 140%; margin-bottom: 25px;}
h1, h2, h3, h4 {line-height: 130%;  word-wrap: normal;}
ol, ul {
  font-size: 2.1875em;
  line-height: 140%;
  list-style: outside none disc;
  margin: 25px 15px;
  padding-left: 25px;
}
ol {list-style: outside none decimal;}
ul li {}
ol li {}
h1 {
  font-family: "Lora",georgia,serif;
  font-size: 3.75em;
  font-weight: 700;
  margin: 60px 0;
  text-align: center;
  text-transform: uppercase;

}
h2 {color: #fff; font-weight: 600; font-style: italic; text-align: center; font-size: 2.1875em;}
strong {font-weight: 600;}
em {font-style: italic;}
.clear {clear: both;}

/**colors**/
.orange {color: #d77045;}
.white {color: #fff;}

/**variables**/
.center {text-align: center;}
.left {text-align: left;}

/**menu**/
.logo {
  position: fixed;
  top: 0;
  left: 0;
  width: 3%;
  z-index: 4000;
  background-color:#3A5675;
  display: block;
  padding: 1%;
  -webkit-box-shadow: -4px -4px 26px;
          box-shadow: -4px -4px 26px;
  -webkit-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.logo:hover {
  background-color: #2A3F55; 
  -webkit-transition: all .3s ease-in-out; 
  -o-transition: all .3s ease-in-out; 
  transition: all .3s ease-in-out;
}




/**layout**/
body, html {height: 100%;}
.section {
  clear: both;
  min-height: 90vh;
  /* height: auto;*/
  overflow: hidden;
  padding: 30px 0;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; 
}
.section::before, .section::after {display: table; content: ""; clear: both;}
.col {float: left;}
.half {width: 50%;}
.sixty {width: 60%;}
.fourty {width: 40%;}
.fourth {width: 25%;}
.seventy {width: 70%;}
.thirty {width: 30%;}
.twenty {width: 20%;}
.inner {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: auto;
  max-width: 1350px;
  overflow: hidden;
  padding: 50px 50px 80px;
  position: relative;
  width: 100%;
  
} 
a.thumbs {display: block;}
#physical-icon {height: auto; width: 100%;}
.icon {position: relative;}
.inner.wider {max-width: 1500px;}
.line {height: 2px; width: 100%; background: #fff; clear: both; margin: 35px auto;}
.prev-section, .next-section {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #fff;
  display: block;
  font-size: 2em;
  height: 50px;
  left: -webkit-calc(50% - 20px);
  left: calc(50% - 20px);
  line-height: 1;
  padding: 9px;
  position: absolute;
  text-align: center;
  top: 7.5%;
  width: 50px;
  z-index: 1000;
}
.prev-section .fa , .next-section .fa {}
.next-section {bottom: 7.5%; top: auto;}
#pageten .next-section, #pageten .prev-section, #pageeighteen .prev-section, #pageeighteen .next-section, #pageseventeen .prev-section, #pageseventeen .next-section, #pagesixteen .prev-section, #pagesixteen .next-section, #pagethree .prev-section, #pagethree .next-section, #pagetwelve .prev-section, #pagesix .prev-section, #pagesix .next-section, #pagetwelve .next-section, #pagefourteen .prev-section, #pagefourteen .next-section{color: #3a5675;}
#pageone .next-section {color: #ebebeb; background: #fff; -webkit-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0px 0px 14px rgba(168, 168, 168, 0.35); box-shadow: 0px 0px 14px rgba(168, 168, 168, 0.35); -webkit-transition: background .2 ease-in-out; -o-transition: background .2 ease-in-out; transition: background .2 ease-in-out;}

#pageone .next-section:hover {
  background: #3A5675;
  -webkit-transition: background .2 ease-in-out;
  -o-transition: background .2 ease-in-out;
  transition: background .2 ease-in-out;
}

/*specific section styling **/

/* Browser Update Notification */
.buorg {
    position:absolute;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    border: none !important;
    background: rgba(0,0,0,.8) !important;
    text-align:center!important;
    padding: 300px 0;
    cursor:pointer;
    font-family: Arial,Helvetica,sans-serif; color:#FFF!important;
    font-size: 2em !important;
}
.buorg div {
    padding:0 !important;
}
.buorg a {
    color:#E25600;
}
#buorgclose {
    position: absolute;
    right: 50px !important;
    top:.2em;
    height: 20px;
    width: 12px;
    font-weight: 800 !important;
    font-size:3.0625em !important;
    padding:0;
}

#buorgclose:hover .buorg a {
  color: #FFF;
}

/*Page One*/
#pageone{
  background: rgba(0, 0, 0, 0) url("images/lightgrey-background.png") no-repeat fixed 0 0 / cover ;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          -webkit-align-items: center; 
          align-items: center;
  
}
#pageone .outer {
  background: #fff;
  position: relative;
  width: 100%;
  margin: 100px 0px;
  padding: 0 50px 40px;
}

#pagenineteen .outer{
  padding: 0 50px 40px;
}
#pageone .inner, #pagenineteen .inner {
  height: 100%;
  padding: 0px;
  }

#pageone a.button, #pagenineteen a.button {
    background-color: #3a5675;
    color: #FFF;
    cursor: pointer;
    padding: 1em;
    max-width: 350px;
    font-size: 2em;
    text-align: center;
    border: none;
    -webkit-border-radius: 60px ;
            border-radius: 60px ;
    outline: none;
    margin: auto;
    display: block;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
  text-decoration: none;
}

#pageone a.button:hover {
  background-color:#2a3f55;
  -webkit-box-shadow: 0px 0px 17px 5px #d3d3d3;
          box-shadow: 0px 0px 17px 5px #d3d3d3;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}

/**page 2- section 2 **/
#pagetwo {  background: rgba(0, 0, 0, 0) url("images/orangebackground.png") no-repeat fixed 0 0 / cover ;
}
#white-circle, .eyes, .face, .brain {
    fill: #ffffff;
}
#circle-shadow {
  fill: #c66544;
}
#icon-shadow {
  fill: #efefef;
}
#person, #spiritual-person, .face {
    fill: #3a5675;
}

#eyebrows {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-miterlimit: 10;
  stroke-width: 3;
}
.mouth {
  fill: none;
  stroke: #ffffff;
  stroke-linecap: round;
  stroke-miterlimit: 10;
  stroke-width: 7;
}
#circle-shadow-dark {
  fill: #ad553d;
}
#pagetwo p {font-size: 2.1875em;}
#pagetwo {padding: 120px 0;}
#pagetwo .inner {padding: 15px 8px;}


/**setion 3 **/
#pagethree {  background: rgba(0, 0, 0, 0) url("images/brain-background.png") no-repeat scroll 0 0 / cover ;
}
#pagethree .icon {min-height: 600px;}

/**section 4 ***/

#pagefour {background: rgba(0, 0, 0, 0) url("images/woodfloor-background.png") no-repeat fixed 0 0 / cover ;}

#pagefour p {color:#FFF; text-align: center; margin-top: 6%;}

#pagefour .inner {padding: 30px 50px 5px}

/*#pagefour .icon {padding-top: 45px;}*/

#pagefour .bluegrey{fill:#404144;}
#pagefour .table-shadow{opacity:0.6;fill:#20252B;}
#pagefour .lightgrey{fill:#929498;}
#pagefour .mediumgrey{fill:#5F646D;}
#pagefour .white-grey{fill:#D1D1D1;}
#pagefour .darkgrey{fill:#464749;}
#pagefour .shadow{opacity:0.2;fill:#404144;}
#pagefour .blackgrey{fill:#333333;}
#pagefour .white{fill:#FFFFFF;}
#pagefour .greengrey{fill:#787C84;}
#pagefour .screen-light{opacity:0.22;fill:url(#SVGID_1_);}

#pagefour .button {
  color: #FFF;
  font-family: 'Open Sans';
  font-weight: 600;
  font-size: 1.5em;
  text-align: center;
  border: 3px solid #fff;
  display: block;
  padding: 10px;
  width: 80%;
  position: relative;
  margin:10px auto;
  cursor: pointer;
}

.games{
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out
}

.games:hover {
  background-color: #000
}
.games.reveal {
  background-color: #FFF;
  color:#000!important;
}
.gamble{
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out
}

.gamble:hover {
  background-color: #000
}
.gamble.reveal {
   background-color: #FFF;
  color:#000!important;
}
.internet{
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out
}

.internet:hover {
  background-color: #000
}
.internet.reveal {
   background-color: #FFF;
  color:#000!important;
}
.sex{
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out
}

.sex:hover {
  background-color: #000
}
.sex.reveal {
  background-color: #FFF;
  color:#000!important;
}
.eating{
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out
}

.eating:hover {
  background-color: #000
}
.eating.reveal {
 background-color: #FFF;
  color:#000!important;
}

/**page five**/
#pagefive, #pageeight {background: rgba(0, 0, 0, 0) url("images/orangebackground.png") no-repeat fixed 0 0 / cover ;}

#pagefive p, #pageeight p {font-size: 2.1875em;}

/**page six**/
#pagesix {background: rgba(0, 0, 0, 0) url("images/lightgrey-background.png") no-repeat fixed 0 0 / cover ;}
#pagesix .inner.wider {max-width: 90%; padding: 0px 0px 50px 0px;}
#pagesix h1 {font-size:2.2em; margin-bottom: 5px;}
#pagesix h2, #pagesix ul {font-size: 1.8em; color: #3A5675;}
#pagesix ul {font-size:1.5em;}
#pagesix strong {color:#3A5675;}


.residentialcontainer.reveal {
  position: absolute;
  left:0;
  top: 45%;
  -webkit-transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
  -o-transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
  transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
}

.residentialcontainer {
  max-width: 700px;
  position: absolute;
  left: -webkit-calc(0% - 700px);
  left: calc(0% - 700px);
  top: 45%;
  width: 100%;
  z-index: 1000;
  -webkit-transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
  -o-transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
  transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
}

.outpatientcontainer.reveal {
  position: absolute;
  right:0;
  top: 45%;
  -webkit-transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
  -o-transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
  transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
}

.outpatientcontainer {
  max-width: 700px;
  position: absolute;
  right: -webkit-calc(0% - 720px);
  right: calc(0% - 720px);
  top: 45%;
  width: 100%;
  z-index: 1000;
  -webkit-transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
  -o-transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
  transition: all 1s cubic-bezier(.59,-0.26,.33,1.5);
}

.residential-box, .outpatient-box {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: #fff;
  display: block;
  font-size: .8em;
  line-height: 1em;
  padding: 13% 30px 10% 30px;
  text-align: left;
  width: 100%;
  max-width: 700px;
  height:auto;
  -webkit-box-shadow: 0 0 30px #B7B7B7;
          box-shadow: 0 0 30px #B7B7B7;
  position: relative;
}
 
  .exit-residential{
  background: #3a5675 none repeat scroll 0 0;
  color: #fff;
  display: block;
  font-size: 3.0625em;
  font-weight: 800;
  height: 44px;
  line-height: 1;
  padding: 13px 0;
  position: absolute;
  right: 0;
  text-align: center;
  text-decoration: none;
  top: 0;
  width: 73px;
  cursor: pointer;
  text-shadow: 5px 5px 0 #2c4867;
  z-index: 99;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}

 .exit-outpatient{
  background: #3a5675 none repeat scroll 0 0;
  color: #fff;
  display: block;
  font-size: 3.0625em;
  font-weight: 800;
  height: 44px;
  line-height: 1;
  padding: 13px 0;
  position: absolute;
  left: 0;
  text-align: center;
  text-decoration: none;
  top: 0;
  width: 73px;
  cursor: pointer;
  text-shadow: 5px 5px 0 #2c4867;
  z-index: 99;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}
.exit-residential:hover {
  background: #233844;
  text-shadow: none;
}

.exit-outpatient:hover {
  background: #233844;
  text-shadow: none;
}

/**page seven **/
#pageseven {background: rgba(0, 0, 0, 0) url("images/darkblue-background.png") no-repeat fixed 0 0 / cover ;}

#house {
  fill: #d77045;
}
#arrow-down {
  -webkit-animation: 2s ease 0s normal none infinite running arrow-down;
          animation: 2s ease 0s normal none infinite running arrow-down;
  fill: #474747;
}
.arrow {
  fill: #474747;
}
#pageseven h2 {font-style: normal; margin: 25px 0;}
#pageseven ul {font-size: 1.5625em;}
#pageseven ul li {margin-bottom: 15px;}

/**page eight **/
#pageeight, #pagefive, #pagenine, #pageten, #pagetwelve { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; 
    -webkit-box-align: center; 
        -ms-flex-align: center; 
            -webkit-align-items: center; 
            align-items: center;}
  
/*page nine */
#pagenine {background: #bac5cc url("images/clouds.svg") no-repeat scroll 0 top / 110% auto ;} 
#pagenine .outer {
  padding: 100px 50px 100px 0;
  width: 100%;
}
#pagenine ol {font-size: 1.5625em; margin-left: 0; color:#3A5675;}
#pagenine .col.sixty {max-width: 890px; float: right;}
#pagenine h2 {margin-bottom: 25px; color:#3A5675;}
#pagenine p {color:#3A5675;}
.plane-animation {
  max-width: 600px;
  position: absolute;
  left: -webkit-calc(0%);
  left: calc(0%);
  top: 29%;
  width: 100%;
  z-index: 1002;
  cursor: pointer;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}
.plane-animation.reveal {
  left: -webkit-calc(100%);
  left: calc(100%);
  -webkit-transition: all 2s ease-in-out;
  -o-transition: all 2s ease-in-out;
  transition: all 2s ease-in-out;
}

#pagenine .planeinfo-background {
  position:absolute;
  background-color:rgba(58,86,117,.8);
  top:0;
  width: 0%;
  height: 100%;
  z-index: 1000;
  -webkit-transition: width 1s ease-in-out;
  -o-transition: width 1s ease-in-out;
  transition: width 1s ease-in-out;
  display: block;
}

#pagenine .planeinfo-background.reveal {
  width: 100%;
  -webkit-transition: width 2s ease-in-out;
  -o-transition: width 2s ease-in-out;
  transition: width 2s ease-in-out;
}

#pagenine .planeinfo {
  position: relative;
  font-size: 4em;
  font-style: italic;
  color:#FFF;
  line-height: 1.6em;
  text-align:center;
  z-index: 1000;
  padding: 0 10%;
  opacity: 0;
  top: 30%;
  bottom: 30%;
  -webkit-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}

#pagenine .planeinfo.reveal {
  opacity: 1;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

  .exit-plane{
  background: #FFF none repeat scroll 0 0;
  color: #3a5675;
  display: block;
  font-size: 3.0625em;
  font-weight: 800;
  height: 44px;
  line-height: 1;
  padding: 13px 0;
  position: absolute;
  right: 0;
  text-align: center;
  text-decoration: none;
  top: 0;
  width: 73px;
  cursor: pointer;
  z-index: 1001;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  opacity: 0; 
}

.exit-plane.reveal {
  opacity: 1;
}

.exit-plane:hover {
  background: transparent;
  color: #fff;

}
/**page ten **/
#pageten {background: rgba(0, 0, 0, 0) url("images/calendar-background.png") no-repeat fixed 0 center / cover ;}
#pageten .half {padding-top: 15%;}
#clock {
  fill: #d77045;
}
#clock-shadow {
  fill: #bc5f3f;
}
#clock-face-shadow {
  fill: #efefef;
}
#clock-face {
  fill: #ffffff;
}
#hour-hand {
  fill: #355068;
  -webkit-transform-origin: left center 0;
          -ms-transform-origin: left center 0;
      transform-origin: left center 0;
}
#minute-hand {
  fill: #355068;
  -webkit-transform-origin: center bottom 0;
          -ms-transform-origin: center bottom 0;
      transform-origin: center bottom 0;
}
#second-hand {
  fill: #bc5f3f;
  -webkit-transform-origin: center top 0;
          -ms-transform-origin: center top 0;
      transform-origin: center top 0;
}
.center-base {
  fill: #3a5675;
}
.second-base {
  fill: #bc5f3f;
}
.hand-base {
  fill: #355068;
}
#pageten h2 {color: #747474}
#pageten h2 {margin-bottom: 25px;}

/**page 11**/
#pageeleven {background: rgba(0, 0, 0, 0) url("images/darkblue-background.png") no-repeat fixed 0 0 / cover ;
}
#pageeleven .half {padding-top: 7%;}

#pageeleven .info{
    font-size: 2.5em;
    line-height: 1.5em;
    text-align: center;
    font-style: italic;
}

#pageeleven .moreinfo-container {
  max-width: 700px;
  position: absolute;
  right: -webkit-calc(0% - 720px);
  right: calc(0% - 720px);
  top: 22%;
  width: 100%;
  z-index: 1000;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out
}
#pageeleven .moreinfo-container.reveal  {
  right: 0;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

#pageeleven .moreinfo-box  {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: #fff;
  display: block;
  font-size: .8em;
  line-height: 1em;
  padding: 13% 30px 10% 30px;
  text-align: left;
  width: 100%;
  max-width: 700px;
  height:auto;
  -webkit-box-shadow: 0 0 30px #2e4155;
          box-shadow: 0 0 30px #2e4155;
  position: relative;
}

#pageeleven .close {
  background: #3a5675 none repeat scroll 0 0;
  color: #fff;
  display: block;
  font-size: 3.0625em;
  font-weight: 800;
  height: 44px;
  line-height: 1;
  padding: 13px 0;
  position: absolute;
  left: 0;
  text-align: center;
  text-decoration: none;
  top: 0;
  width: 73px;
  cursor: pointer;
  text-shadow: 5px 5px 0 #2c4867;
  z-index: 99;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}

#pageeleven .close:hover {
  background: #233844;
  text-shadow: none;
}

/*page twelve*/
#pagetwelve {background: rgba(0, 0, 0, 0) url("images/lightgrey-background.png") no-repeat fixed 0 0 / cover ;}
#pagetwelve h1 {font-size: 2.1875em; margin-bottom: 25px;}
#pagetwelve .icon {padding-top: 50px; }
#pagetwelve .inner.wider {max-width: 100%}

/*page thirteen**/
#pagethirteen {background: rgba(0, 0, 0, 0) url("images/orangebackground.png") no-repeat fixed 0 0 / cover ;
}
#pagethirteen h2 {font-style: normal; font-size: 2.2em;}
#pagethirteen p {margin-bottom: 0px; padding-top: 10px;}
#pagethirteen .inner {padding-bottom: 0px}
#pagethirteen .outer {
  padding: 100px 0 100px 0;
  width: 100%;
}
#pagethirteen .thirty {width: 33.3%;}

/*page fourteen**/
#pagefourteen {background: rgba(0, 0, 0, 0) url("images/celebrating-background.png") no-repeat fixed 0 0 / cover ;
}
#pagefourteen .line {background-color: #3A5675}

.moreinfo-container {
  max-width: 570px;
  position: absolute;
  right: -webkit-calc(0% - 540px);
  right: calc(0% - 540px);
  top: -webkit-calc(50% - 200px);
  top: calc(50% - 200px);
  -webkit-transition: all 0.7s ease-in-out;
  -o-transition: all 0.7s ease-in-out;
  transition: all 0.7s ease-in-out;
  width: 100%;
  z-index: 1000;
}
.moreinfo-container.reveal  {
  right: 0;
  -webkit-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

.moreinfo-box  {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  background-color: #fff;
  display: block;
  font-size: .8em;
  line-height: 1em;
  padding: 30px;
  text-align: left;
  width: 100%;
  height:430px;
  -webkit-box-shadow: 0 0 30px #B7B7B7;
          box-shadow: 0 0 30px #B7B7B7;
  position: relative;
  
}

.moreinfo {
 -webkit-box-sizing: border-box;
         box-sizing: border-box;
 background-color: #3A5675;
 color: #FFF;
 width: 200px;
 text-align: center;
 position: absolute;
 padding:25px 25px;
 -webkit-border-radius: 20px 20px 0 0;
         border-radius: 20px 20px 0 0;
 -webkit-transform: rotate(-90deg);
     -ms-transform: rotate(-90deg);
         transform: rotate(-90deg);
 left: -125px;
 top: 180px;
 cursor: pointer;
 -webkit-transition: all .3s ease;
 -o-transition: all .3s ease;
 transition: all .3s ease;
}

@media (min-width: 768px) {
  /*hover animation for desktop */
  .moreinfo-container:hover {max-width: 580px;}
  .moreinfo-container:hover .moreinfo {
    background-color: #355068;
    left: -130px;
    top: 175px;
    padding: 30px 25px;
  }
  .moreinfo-container.reveal:hover {max-width: 555px;}
  .moreinfo-container.reveal:hover .moreinfo {
    background-color: #355068;
    left: -125px;
    top: 180px;
    padding: 25px 25px;
  }
}

.moreinfo-container .moreinfo p {margin: 0; line-height: 0;}

/*page fifteen**/
#pagefifteen {background: rgba(0, 0, 0, 0) url("images/darkblue-background.png") no-repeat fixed 0 0 / cover ;
}
#pagefifteen .inner {padding-top: 100px}

/*page sixteen**/
#pagesixteen {background: rgba(0, 0, 0, 0) url("images/lightgrey-background.png") no-repeat fixed 0 0 / cover ;
}
#pagesixteen h1 {font-size: 2.5em; margin-bottom: 20px;}
#pagesixteen .moreinfo-box {
  height:460px;
}

/*page seventeen**/
#pageseventeen {background: #bac5cc no-repeat scroll 0 top / 110% auto ;} 
#pageseventeen h2, #pageseventeen p {color:#3A5675; padding-bottom: 5px;}
#pageseventeen .inner {padding-top:150px; padding-bottom: 0;}
#pageseventeen .inner.wider {width:100%;}

/*page eightteen**/
#pageeighteen {background: rgba(0, 0, 0, 0) url("images/lightgrey-background.png") no-repeat fixed 0 0 / cover ;
}
#pageeighteen .inner {padding-top: 8%;}
#pageeighteen h1 {font-size: 2em; margin-bottom:10px;}
#pageeighteen p {font-size: 1.5em;}
#pageeighteen .inner-non {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: auto;
  max-width: 1350px;
  overflow: hidden;
  padding: 50px 10% 80px 10%;
  position: relative;
  width: 100%;}
.rolldown-list {
  text-align: left;
  padding: 0;
  margin: 0;
}
button.accordion {
    background-color: #3a5675;
    color: #FFF;
    cursor: pointer;
    padding: 1em;
    width: 100%;
    font-size: 1em;
    text-align: left;
    border: white 1px solid;
    outline: none;
    margin: 0;
    display: block;
    -webkit-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    opacity: 0;
}

button.accordion.rolldown {
    -webkit-animation: rolldown 0.7s 1;
            animation: rolldown 0.7s 1;
    -webkit-transform-origin: 50%, 0;
        -ms-transform-origin: 50%, 0;
            transform-origin: 50%, 0;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
}

/*button.accordion.one {
  visibility: hidden;
  animation: rolldown 0.7s infinite;
  transform-origin: 50%, 0;
  animation-fill-mode: forwards;
}*/
button.accordion.two {
  -webkit-animation-delay: .2s;
          animation-delay: .2s;
}
button.accordion.three {
  -webkit-animation-delay: .4s;
          animation-delay: .4s;
}
button.accordion.four {
  -webkit-animation-delay: .6s;
          animation-delay: .6s;
}
button.accordion.five {
  -webkit-animation-delay:.8s;
          animation-delay:.8s;
}
button.accordion.six {
  -webkit-animation-delay: 1s;
          animation-delay: 1s;
}
button.accordion.seven {
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}
button.accordion.eight {
  -webkit-animation-delay: 1.4s;
          animation-delay: 1.4s;
}
button.accordion.nine {
  -webkit-animation-delay: 1.6s;
          animation-delay: 1.6s;
}
button.accordion.ten {
  -webkit-animation-delay: 1.8s;
          animation-delay: 1.8s;
}
button.accordion.eleven {
  -webkit-animation-delay: 2s;
          animation-delay: 2s;
}
button.accordion.twelve {
  -webkit-animation-delay: 2.2s;
          animation-delay: 2.2s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
button.accordion.active, button.accordion:hover {
    background-color: #2f465f;
    color: #FFF;
}

/* Style the accordion panel. Note: hidden by default */
div.step-panel {
    background-color: white;
    max-height: 0px;
    overflow: hidden;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-transition: opacity 0.6s ease, max-height 0.8s ease;
    -o-transition: opacity 0.6s ease, max-height 0.8s ease;
    transition: opacity 0.6s ease, max-height 0.8s ease;
    -webkit-transform-origin: top;
        -ms-transform-origin: top;
            transform-origin: top;
    opacity: 0;
  }


/* The "show" class is added to the accordion panel when the user clicks on one of the buttons. This will show the panel content */
div.step-panel.show {
    opacity: 1;
    display: block;
    max-height: 500px;
    -webkit-transition: opacity 0.6s ease, max-height 0.8s ease;
    -o-transition: opacity 0.6s ease, max-height 0.8s ease;
    transition: opacity 0.6s ease, max-height 0.8s ease;
}

button.accordion:after {
    content:'\f055'; /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    font-family: FontAwesome;
    color: #FFF;
    float: right;
    margin-left: 5px;
}

button.accordion.active:after {
    content: "\f056"; /* Unicode character for "minus" sign (-) */
}

#pageeighteen div.step-panel p {
  padding: 20px;
  margin-bottom: 0px;
  font-size: 1.2em;
}

@-webkit-keyframes rolldown {
  0% {
    opacity: 0;
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg);
  }
  70% {
    -webkit-transform: rotateX(-20deg);
            transform: rotateX(-20deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg);
  }
}

@keyframes rolldown {
  0% {
    opacity: 0;
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg);
  }
  70% {
    -webkit-transform: rotateX(-20deg);
            transform: rotateX(-20deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg);
  }
}

/** page nineteen **/
#pagenineteen {
  background: rgba(0, 0, 0, 0) url("images/orangebackground.png") no-repeat fixed 0 bottom / cover ;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          -webkit-align-items: center;
          align-items: center;
  
}

#pagenineteen .outer{
  background: #fff;
  position: relative;
  width: 100%;
  margin: 100px 0px;
   } 

#pagenineteen .button:hover {
  background-color:#2a3f55;
  -webkit-box-shadow: 0px 0px 17px 5px #d3d3d3;
          box-shadow: 0px 0px 17px 5px #d3d3d3;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}



/****SECTION ANIMATIONS*****/

.hidden{
  opacity: 0;
}

.visible{
  opacity: 1;
}

/**popover styling**/
.close {
  background: #3a5675 none repeat scroll 0 0;
  color: #fff;
  display: block;
  font-size: 3.0625em;
  font-weight: 800;
  height: 50px;
  line-height: 1;
  padding: 10px 0;
  position: absolute;
  right: 0;
  text-align: center;
  text-decoration: none;
  top: 0;
  width: 75px;
  text-shadow: 5px 5px 0 #2c4867;
  z-index: 99;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}
.close:hover {
  background: #233844;
  text-shadow: none;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
}

.fancybox-item.fancybox-close {
  background-image: none;
}
.fancybox-skin {
  background: #fff none repeat scroll 0 0;
  -webkit-border-radius: 0;
          border-radius: 0;
  padding: 0 !important ;
}
.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 4px 4px 0 rgba(0, 0, 0, 0.2);
}

.fancybox-skin h3 {}
.fancybox-overlay {background: rgba(0,0,0,0.4);}
.fancybox-skin .inner-modal {padding: 80px 20px 20px;}

.fancybox-inner, .fancybox-wrap {max-width: 500px; max-height: 500px;}

.modal h2, .modal p {color: #7b7b7b; text-align: left;}

@media (min-width: 768px) and (max-width: 1250px) {
  #pagetwelve .thirty, #pagetwelve .fourty {width:100%;}
  #pagefour .button {font-size:1.3em;}
}

@media (min-width: 768px) and (max-width:1050px){
  #pagefour .button {font-size:1.5em;}
  #pagefour .twenty {width: 100%}
  #pageeighteen .half {width: 100%}
  #pageeighteen .inner-non {
    padding: 50px 0px 80px 0px;
  }
  #pageone button, #pagenineteen button {
  width: 100%;
}
 #pagenine .fourty, #pagenine .sixty {width:100%;}
  #pagenine .sixty h2, #pagenine .sixty p {
    padding-left: 20%;
  }
  #pagenine .sixty ol {
    padding-left: 23%;
  }
  #pageeleven .half {width: 100%;}
  #pageone, #pagefourteen {
  background-attachment: scroll;
}
  .logo {width: 5%;}
}

@media (max-width: 767px) {
  /** start responsive styling **/
  .col, .half, .fourth, #pagefour #gambling, #pagethirteen .thirty {width: 100%;}
  .section {height: auto; min-height: none;}
  h1 {font-size: 2em; margin: 15px 0;}
  h2 {font-size: 1.75em;}
  p, #pagetwo p, ol, ul, #pagefive p, #pageeight p, #pageseven ul, #pagenine ol {font-size: 1.125em;}
  .prev-section, .next-section {display: none;}
  .inner, #pagenine .outer {padding: 25px;}
  #head {left: 0px !important;}
#pagetwelve .icon {padding-top: 15px;}
#pagenine .icon {left: -25px;}
 #pagenine .fourty, #pagenine .sixty {width:100%;}
  #pagenine .sixty h2, #pagenine .sixty p {
    padding-left: 30%;
  }
  #pagenine .sixty ol {
    padding-left: 34%;
  }
#pagenine .outer {padding-right: 0px;}
#pagetwo {padding: 30px 0;}
.moreinfo-container {
  position: absolute;
  right: -webkit-calc(-100% + 10px);
  right: calc(-100% + 10px);
  top: -webkit-calc(50% - 200px);
  top: calc(50% - 200px);
  -webkit-transition: all 0.7s cubic-bezier(0.59, -0.26, 0.33, 1) 0s;
  -o-transition: all 0.7s cubic-bezier(0.59, -0.26, 0.33, 1) 0s;
  transition: all 0.7s cubic-bezier(0.59, -0.26, 0.33, 1) 0s;
  width: 100%;
  z-index: 1000;
  max-width: none;
}
#pageseventeen h2 {text-align: left;}
.moreinfo-container.reveal {width: -webkit-calc(100% - 60px);width: calc(100% - 60px);}
#pagesix .exit-residential, #pagesix .exit-outpatient {
  font-size: 2.0625em;
  font-weight: 800;
  height: 29px;
  line-height: 1;
  padding: 13px 0;
  width: 63px;
}
#pageeleven .close {
  font-size: 2.0625em;
  font-weight: 800;
  height: 29px;
  line-height: 1;
  padding: 13px 0;
  width: 63px;
}

#pageeleven .info{
  font-size: 2.5em;
}
#pagesix ul {font-size: 1.125em;}
#pageone button, #pagenineteen button {
  width: 100%;
}
#pageone a.button, #pagenineteen a.button{
  font-size:1.5rem;
}
.fancybox-inner, .fancybox-wrap {max-width: 500px; max-height: 370px;}
.close {height: 32px; padding: 18px 0px; width: 70px; font-size: 2em;}
#pagenine .planeinfo {font-size: 3.0em; padding:0 5%;}
#pagenine .col.sixty {
padding:0px 20px 0px 0px;
}
#pageone, #pagefourteen {
  background-attachment: scroll;
}
.logo {width: 10%;}
#pageone button, #pagenineteen button, #pagefour .button {
  font-size:1.5em;
}
}

/*****fixing some stuff in IE 10 *****/

  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
   /* IE10+ specific styles go here */  
    button.accordion {
    opacity: 1 !important;
    -webkit-transform:  none !important;
        -ms-transform:  none !important;
            transform:  none !important;
  }
    svg {min-height: 400px !important;}
}

@media screen and (max-width: 767px), (-ms-high-contrast: active), (-ms-high-contrast: none)  {
    svg {min-height: none !important;}
  
}
  
  
