@font-face {
  font-weight: normal;
  font-sytle: normal;
  font-family: "cuprum-bold";
  src: url("../font/cuprum-bold.ttf") format("truetype"), url("../font/cuprum-bold.svg#cuprum-bold") format("svg"); }

body {
  margin: 0;
  padding: 0; }

#view {
  margin: 0;
  padding: 0;
  width: 1024px;
  height: 768px;
  position: relative;
  overflow: hidden; }

#inn {
  width: 1024px;
  height: 768px;
  position: absolute;
  overflow: hidden;
  display: none; }

#out {
  width: 1024px;
  height: 768px;
  position: absolute;
  overflow: hidden;
  /*strong
		font-family: 'saira-extra-condensed-bold'*/ }
  #out * {
    font-size: 28px;
    line-height: 32px; }
  #out .events-none, #out .events-none * {
    pointer-events: none; }
  #out .btn {
    cursor: pointer !important;
    border: 0;
    font-size: 1.5em;
    font-weight: bold;
    color: white;
    outline: none; }
  #out .ease, #out .ease * {
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out; }
  #out .no-ease, #out .no-ease * {
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important; }
  #out .clear {
    clear: both; }
  #out span.line-space {
    display: block;
    height: 10px;
    width: 100%; }
  #out .vertical-align {
    display: table;
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    width: 100%; }
  #out section {
    width: 1024px;
    height: 768px;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    -o-opacity: 0;
    opacity: 0;
    -webkit-visibility: hidden;
    -moz-visibility: hidden;
    -o-visibility: hidden;
    visibility: hidden; }
    #out section#cover {
      background: url("../../assets/img/cover-bg.jpg") no-repeat;
      -webkit-transform: scale(2);
      -ms-transform: scale(2);
          transform: scale(2); }
      #out section#cover .bottom {
        position: absolute;
        background: url("../../assets/img/cover-bottom.png") no-repeat;
        width: 100%;
        height: 100%;
        bottom: -465px; }
      #out section#cover .fish {
        position: absolute;
        background: url("../../assets/img/cover-fish.png");
        width: 561px;
        height: 170px;
        top: 88px;
        right: -562px; }
      #out section#cover .light {
        background: url("../../assets/img/cover-light.png") no-repeat;
        position: absolute;
        height: 100%;
        width: 100%;
        opacity: 0;
        top: -780px; }
      #out section#cover .overlay {
        background: rgba(0, 0, 0, 0.3);
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0; }
      #out section#cover .title {
        background: url("../../assets/img/cover-title.png") center center/cover no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        width: 680px;
        height: 386px;
        left: 0;
        right: 0;
        margin: auto;
        top: 122px;
        opacity: 0;
        -webkit-transform: scale(0);
            -ms-transform: scale(0);
                transform: scale(0); }
      #out section#cover .btn-start {
        background: url("../../assets/img/btn-start.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        bottom: -138px;
        left: 0;
        right: 0;
        margin: auto;
        height: 85px;
        width: 195px;
        opacity: 0; }
        #out section#cover .btn-start:active {
          background: url("../../assets/img/btn-start-down.png") no-repeat;
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover; }
    #out section#intro {
      background: url("../../assets/img/intro-bg.jpg") no-repeat;
      -webkit-transform: scale(2);
      -ms-transform: scale(2);
          transform: scale(2); }
      #out section#intro .overlay {
        background: rgba(0, 0, 0, 0.3);
        position: absolute;
        width: 100%;
        height: 100%; }
      #out section#intro .popup {
        background: url("../../assets/img/popup-bg.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        width: 983px;
        height: 584px;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        opacity: 0; }
        #out section#intro .popup .text {
          position: absolute;
          color: white;
          font-family: "cuprum-bold";
          font-size: 21px;
          width: 522px;
          height: 200px;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          margin: auto; }
      #out section#intro .btn-next {
        background: url("../../assets/img/btn-next.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        bottom: -138px;
        left: 0;
        right: 0;
        margin: auto;
        height: 85px;
        width: 195px;
        opacity: 0; }
        #out section#intro .btn-next:active {
          background: url("../../assets/img/btn-next-down.png") no-repeat;
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover; }
    #out section#ocean {
      -webkit-transform: scale(2);
      -ms-transform: scale(2);
          transform: scale(2); }
      #out section#ocean .bg:nth-child(1), #out section#ocean .bg:nth-child(2), #out section#ocean .bg:nth-child(3), #out section#ocean .bg:nth-child(4), #out section#ocean .bg:nth-child(5) {
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        width: 2048px;
        height: 768px; }
      #out section#ocean .bg:nth-child(1) {
        background: url("../../assets/img/ocean-bg1.jpg") no-repeat; }
      #out section#ocean .bg:nth-child(2) {
        background: url("../../assets/img/ocean-bg2.png") no-repeat; }
      #out section#ocean .bg:nth-child(3) {
        background: url("../../assets/img/ocean-bg3.png") no-repeat;
        cursor: default !important; }
        #out section#ocean .bg:nth-child(3) .btn-vertebrados {
          position: absolute;
          background: url("../../assets/img/btn-vertebrado-down.png") no-repeat;
          width: 237px;
          height: 181px;
          top: 134px;
          left: 381px;
          -webkit-border-radius: 70% 100% 80% 90%;
                  border-radius: 70% 100% 80% 90%; }
          #out section#ocean .bg:nth-child(3) .btn-vertebrados:active, #out section#ocean .bg:nth-child(3) .btn-vertebrados:hover {
            background: url("../../assets/img/btn-vertebrado-down.png") no-repeat;
            -webkit-transform: translate(0, 3px);
                -ms-transform: translate(0, 3px);
                    transform: translate(0, 3px); }
          #out section#ocean .bg:nth-child(3) .btn-vertebrados:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
        #out section#ocean .bg:nth-child(3) .btn-moluscos {
          position: absolute;
          background: url("../../assets/img/btn-molusco-down.png") no-repeat;
          width: 390px;
          height: 285px;
          bottom: -35px;
          left: -4px;
          -webkit-border-radius: 60% 190% 70% 90%;
                  border-radius: 60% 190% 70% 90%; }
          #out section#ocean .bg:nth-child(3) .btn-moluscos:active, #out section#ocean .bg:nth-child(3) .btn-moluscos:hover {
            background: url("../../assets/img/btn-molusco-down.png") no-repeat;
            -webkit-transform: translate(0, 3px);
                -ms-transform: translate(0, 3px);
                    transform: translate(0, 3px); }
          #out section#ocean .bg:nth-child(3) .btn-moluscos:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
        #out section#ocean .bg:nth-child(3) .btn-anelideos1, #out section#ocean .bg:nth-child(3) .btn-anelideos2, #out section#ocean .bg:nth-child(3) .btn-anelideos3 {
          position: absolute;
          background: url("../../assets/img/btn-anelideo-down.png") no-repeat;
          -webkit-border-radius: 20%;
                  border-radius: 20%; }
          #out section#ocean .bg:nth-child(3) .btn-anelideos1:active, #out section#ocean .bg:nth-child(3) .btn-anelideos2:active, #out section#ocean .bg:nth-child(3) .btn-anelideos3:active, #out section#ocean .bg:nth-child(3) .btn-anelideos1:hover, #out section#ocean .bg:nth-child(3) .btn-anelideos2:hover, #out section#ocean .bg:nth-child(3) .btn-anelideos3:hover {
            background: url("../../assets/img/btn-anelideo-down.png") no-repeat;
            -webkit-transform: translate(0, 2px);
                -ms-transform: translate(0, 2px);
                    transform: translate(0, 2px); }
          #out section#ocean .bg:nth-child(3) .btn-anelideos1:active, #out section#ocean .bg:nth-child(3) .btn-anelideos2:active, #out section#ocean .bg:nth-child(3) .btn-anelideos3:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
        #out section#ocean .bg:nth-child(3) .btn-anelideos1 {
          width: 115px;
          height: 45px;
          bottom: 35px;
          left: 408px; }
        #out section#ocean .bg:nth-child(3) .btn-anelideos2 {
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover;
          width: 81px;
          height: 30px;
          bottom: 260px;
          left: 363px; }
          #out section#ocean .bg:nth-child(3) .btn-anelideos2:active, #out section#ocean .bg:nth-child(3) .btn-anelideos2:hover {
            background-position: center center;
            -webkit-background-size: cover;
                    background-size: cover; }
        #out section#ocean .bg:nth-child(3) .btn-anelideos3 {
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover;
          width: 81px;
          height: 30px;
          bottom: 12px;
          left: 1207px; }
          #out section#ocean .bg:nth-child(3) .btn-anelideos3:active, #out section#ocean .bg:nth-child(3) .btn-anelideos3:hover {
            background-position: center center;
            -webkit-background-size: cover;
                    background-size: cover; }
        #out section#ocean .bg:nth-child(3) .btn-poriferos1, #out section#ocean .bg:nth-child(3) .btn-poriferos2, #out section#ocean .bg:nth-child(3) .btn-poriferos3, #out section#ocean .bg:nth-child(3) .btn-poriferos4 {
          position: absolute;
          background: url("../../assets/img/btn-porifero-down.png") no-repeat;
          -webkit-border-radius: 75% 100% 90% 70%;
                  border-radius: 75% 100% 90% 70%; }
          #out section#ocean .bg:nth-child(3) .btn-poriferos1:active, #out section#ocean .bg:nth-child(3) .btn-poriferos2:active, #out section#ocean .bg:nth-child(3) .btn-poriferos3:active, #out section#ocean .bg:nth-child(3) .btn-poriferos4:active, #out section#ocean .bg:nth-child(3) .btn-poriferos1:hover, #out section#ocean .bg:nth-child(3) .btn-poriferos2:hover, #out section#ocean .bg:nth-child(3) .btn-poriferos3:hover, #out section#ocean .bg:nth-child(3) .btn-poriferos4:hover {
            background: url("../../assets/img/btn-porifero-down.png") no-repeat;
            -webkit-transform: translate(0, 2px);
                -ms-transform: translate(0, 2px);
                    transform: translate(0, 2px); }
          #out section#ocean .bg:nth-child(3) .btn-poriferos1:active, #out section#ocean .bg:nth-child(3) .btn-poriferos2:active, #out section#ocean .bg:nth-child(3) .btn-poriferos3:active, #out section#ocean .bg:nth-child(3) .btn-poriferos4:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
        #out section#ocean .bg:nth-child(3) .btn-poriferos1 {
          width: 369px;
          height: 325px;
          bottom: -59px;
          left: 761px; }
        #out section#ocean .bg:nth-child(3) .btn-poriferos2 {
          width: 289px;
          height: 325px;
          bottom: -169px;
          left: 842px; }
        #out section#ocean .bg:nth-child(3) .btn-poriferos3 {
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover;
          width: 181px;
          height: 171px;
          bottom: 161px;
          left: 1187px; }
          #out section#ocean .bg:nth-child(3) .btn-poriferos3:active, #out section#ocean .bg:nth-child(3) .btn-poriferos3:hover {
            background-position: center center;
            -webkit-background-size: cover;
                    background-size: cover; }
        #out section#ocean .bg:nth-child(3) .btn-poriferos4 {
          width: 369px;
          height: 325px;
          bottom: -93px;
          left: 1817px; }
        #out section#ocean .bg:nth-child(3) .btn-equinodermos {
          position: absolute;
          background: url("../../assets/img/btn-equinodermo-down.png") no-repeat;
          width: 157px;
          height: 82px;
          bottom: 67px;
          left: 1131px;
          -webkit-border-radius: 50%;
                  border-radius: 50%; }
          #out section#ocean .bg:nth-child(3) .btn-equinodermos:active, #out section#ocean .bg:nth-child(3) .btn-equinodermos:hover {
            background: url("../../assets/img/btn-equinodermo-down.png") no-repeat;
            -webkit-transform: translate(0, 3px);
                -ms-transform: translate(0, 3px);
                    transform: translate(0, 3px); }
          #out section#ocean .bg:nth-child(3) .btn-equinodermos:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
        #out section#ocean .bg:nth-child(3) .btn-cnidarios1, #out section#ocean .bg:nth-child(3) .btn-cnidarios2 {
          position: absolute;
          background: url("../../assets/img/btn-cnidario-down.png") no-repeat;
          -webkit-border-radius: 50% 40% 40% 50%;
                  border-radius: 50% 40% 40% 50%; }
          #out section#ocean .bg:nth-child(3) .btn-cnidarios1:active, #out section#ocean .bg:nth-child(3) .btn-cnidarios2:active, #out section#ocean .bg:nth-child(3) .btn-cnidarios1:hover, #out section#ocean .bg:nth-child(3) .btn-cnidarios2:hover {
            background: url("../../assets/img/btn-cnidario-down.png") no-repeat;
            -webkit-transform: translate(0, 2px);
                -ms-transform: translate(0, 2px);
                    transform: translate(0, 2px); }
          #out section#ocean .bg:nth-child(3) .btn-cnidarios1:active, #out section#ocean .bg:nth-child(3) .btn-cnidarios2:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
        #out section#ocean .bg:nth-child(3) .btn-cnidarios1 {
          width: 298px;
          height: 308px;
          bottom: -81px;
          left: 1627px;
          z-index: 2; }
        #out section#ocean .bg:nth-child(3) .btn-cnidarios2 {
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover;
          width: 131px;
          height: 120px;
          bottom: 157px;
          left: 1510px; }
          #out section#ocean .bg:nth-child(3) .btn-cnidarios2:active, #out section#ocean .bg:nth-child(3) .btn-cnidarios2:hover {
            background-position: center center;
            -webkit-background-size: cover;
                    background-size: cover; }
        #out section#ocean .bg:nth-child(3) .btn-platelmintos {
          position: absolute;
          background: url("../../assets/img/btn-platelminto-down.png") no-repeat;
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover;
          width: 141px;
          height: 35px;
          bottom: 146px;
          left: 1447px;
          z-index: 2;
          -webkit-border-radius: 50%;
                  border-radius: 50%; }
          #out section#ocean .bg:nth-child(3) .btn-platelmintos:active, #out section#ocean .bg:nth-child(3) .btn-platelmintos:hover {
            background: url("../../assets/img/btn-platelminto-down.png") no-repeat;
            -webkit-transform: translate(0, 3px);
                -ms-transform: translate(0, 3px);
                    transform: translate(0, 3px);
            background-position: center center;
            -webkit-background-size: cover;
                    background-size: cover; }
          #out section#ocean .bg:nth-child(3) .btn-platelmintos:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
        #out section#ocean .bg:nth-child(3) .btn-artropodes {
          position: absolute;
          background: url("../../assets/img/btn-artropode-down.png") no-repeat;
          width: 210px;
          height: 128px;
          bottom: 5px;
          left: 1403px;
          -webkit-border-radius: 150% 80% 80% 60%;
                  border-radius: 150% 80% 80% 60%; }
          #out section#ocean .bg:nth-child(3) .btn-artropodes:active, #out section#ocean .bg:nth-child(3) .btn-artropodes:hover {
            background: url("../../assets/img/btn-artropode-down.png") no-repeat;
            -webkit-transform: translate(0, 3px);
                -ms-transform: translate(0, 3px);
                    transform: translate(0, 3px); }
          #out section#ocean .bg:nth-child(3) .btn-artropodes:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
      #out section#ocean .bg:nth-child(4) {
        background: url("../../assets/img/ocean-bg4.png") no-repeat;
        pointer-events: none !important;
        width: 2248px;
        -webkit-filter: contrast(200%);
                filter: contrast(200%);
        opacity: 0.5; }
      #out section#ocean .bg:nth-child(5) {
        background: url("../../assets/img/ocean-bg5.png") no-repeat;
        pointer-events: none !important;
        width: 2248px; }
      #out section#ocean .overlay {
        background: rgba(0, 0, 0, 0.5);
        position: absolute;
        width: 100%;
        height: 100%; }
      #out section#ocean .popup {
        background: url("../../assets/img/popup-bg.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        width: 600px;
        height: 350px;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        opacity: 0; }
        #out section#ocean .popup .text {
          position: absolute;
          color: white;
          font-family: "cuprum-bold";
          font-size: 21px;
          width: 365px;
          height: 50px;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          margin: auto; }
      #out section#ocean .btn-next {
        background: url("../../assets/img/btn-next.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        bottom: 215px;
        left: 0;
        right: 0;
        margin: auto;
        height: 65px;
        width: 155px;
        opacity: 0; }
        #out section#ocean .btn-next:active {
          background: url("../../assets/img/btn-next-down.png") no-repeat;
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover; }
      #out section#ocean .arrow {
        background: url("../../assets/img/btn-drag.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        width: 80px;
        height: 80px;
        top: 0;
        bottom: 0;
        margin: auto;
        left: 850px;
        -webkit-transform: scale(1.5);
            -ms-transform: scale(1.5);
                transform: scale(1.5);
        opacity: 0; }
    #out section#gallery {
      -webkit-transform: scale(2);
      -ms-transform: scale(2);
          transform: scale(2);
      background: url("../../assets/img/gallery-bg.jpg") no-repeat; }
      #out section#gallery .btn-back {
        background: url("../../assets/img/btn-back.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        bottom: 25px;
        right: 25px;
        height: 80px;
        width: 80px;
        -webkit-border-radius: 50%;
                border-radius: 50%; }
        #out section#gallery .btn-back:active {
          background: url("../../assets/img/btn-back-down.png") no-repeat;
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover; }
      #out section#gallery .popup {
        position: absolute;
        background: url("../../assets/img/popup-bg.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        width: 845px;
        height: 490px;
        right: 40px;
        top: 0;
        bottom: 0;
        margin: auto;
        z-index: 2; }
        #out section#gallery .popup .popup-img {
          position: absolute;
          background-position: center bottom !important;
          -webkit-background-size: contain !important;
                  background-size: contain !important;
          width: 100%;
          height: 100%;
          top: -200px;
          bottom: 0;
          right: 0;
          left: 0;
          margin: auto;
          -webkit-transition: all .2s ease-in-out 0s;
          -o-transition: all .2s ease-in-out 0s;
          transition: all .2s ease-in-out 0s; }
        #out section#gallery .popup .title {
          font-family: 'cuprum-bold';
          font-size: 25px;
          color: white;
          text-transform: uppercase;
          text-align: center;
          width: 40%;
          left: 0;
          right: 0;
          margin: auto;
          position: absolute;
          bottom: 130px; }
        #out section#gallery .popup .btn-zoom {
          background: url("../../assets/img/btn-zoom-stroke.png") no-repeat;
          background-position: center center;
          -webkit-background-size: 75% 75%;
                  background-size: 75%;
          position: absolute;
          bottom: 100px;
          right: 80px;
          height: 100px;
          width: 100px;
          -webkit-border-radius: 50%;
                  border-radius: 50%; }
          #out section#gallery .popup .btn-zoom:active {
            -webkit-transform: scale(0.9);
                -ms-transform: scale(0.9);
                    transform: scale(0.9); }
      #out section#gallery .info {
        position: absolute;
        background: url("../../assets/img/popup-text-bg.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        width: 770px;
        height: 275px;
        right: 80px;
        top: 405px;
        bottom: 0;
        margin: auto;
        -webkit-transform: scale(0);
            -ms-transform: scale(0);
                transform: scale(0);
        -webkit-transform-origin: center top;
            -ms-transform-origin: center top;
                transform-origin: center top;
        opacity: 0;
        font-family: 'cuprum-bold';
        color: white; }
        #out section#gallery .info .title {
          font-size: 25px;
          position: absolute;
          width: 100%;
          text-align: center;
          top: 60px; }
        #out section#gallery .info .text {
          font-size: 18px;
          position: absolute;
          top: 100px;
          line-height: 1.5;
          width: 70%;
          height: 135px;
          right: 0;
          left: 0;
          margin: auto; }
          #out section#gallery .info .text p {
            font-size: 18px;
            margin: 0;
            line-height: 1.5; }
            #out section#gallery .info .text p span {
              font-size: 1.15em; }
      #out section#gallery .sidebar {
        position: absolute;
        width: 110px;
        height: 100%;
        left: 0;
        top: 0; }
        #out section#gallery .sidebar .wrapper {
          position: absolute;
          width: 100%;
          height: 600px;
          margin: auto 0;
          top: 0;
          bottom: 0; }
          #out section#gallery .sidebar .wrapper .gallery-thumb {
            list-style-type: none;
            outline: none;
            margin: 10px 0; }
            #out section#gallery .sidebar .wrapper .gallery-thumb .btn-thumb {
              width: 60px;
              height: 60px;
              background: -webkit-linear-gradient(45deg, #007dd4, #00f0fc);
              background: -o-linear-gradient(45deg, #007dd4, #00f0fc);
              background: linear-gradient(45deg, #007dd4, #00f0fc);
              -webkit-border-radius: 50%;
                      border-radius: 50%;
              overflow: hidden;
              border: 2px white solid; }
              #out section#gallery .sidebar .wrapper .gallery-thumb .btn-thumb div:first-child {
                width: 100%;
                height: 100%;
                display: inline-block; }
            #out section#gallery .sidebar .wrapper .gallery-thumb .btn-locked {
              width: 100%;
              height: 100%;
              opacity: 0.8;
              -webkit-border-radius: 50%;
                      border-radius: 50%;
              background-color: black;
              background-image: url("../../assets/img/btn-locker.png");
              background-repeat: no-repeat;
              background-position: center;
              -webkit-background-size: 60% 60%;
                      background-size: 60%; }
          #out section#gallery .sidebar .wrapper .arrow {
            position: absolute;
            display: none;
            background: url("../../assets/img/info-arrow.png") no-repeat;
            background-position: center center;
            -webkit-background-size: cover;
                    background-size: cover;
            width: 15px;
            height: 25px;
            right: 20px;
            margin: 15px auto; }
      #out section#gallery .overlay {
        background: rgba(0, 65, 150, 0.8);
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 999;
        opacity: 0;
        visibility: hidden;
        -webkit-transform: scale(0);
            -ms-transform: scale(0);
                transform: scale(0);
        -webkit-transform-origin: center center;
            -ms-transform-origin: center center;
                transform-origin: center center; }
        #out section#gallery .overlay .drag {
          position: absolute;
          width: 100%;
          height: 100%;
          cursor: pointer; }
        #out section#gallery .overlay .popup {
          background: url("../../assets/img/popup-bg.png") no-repeat;
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover;
          position: absolute;
          width: 600px;
          height: 350px;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          margin: auto;
          opacity: 0; }
          #out section#gallery .overlay .popup .text {
            position: absolute;
            color: white;
            font-family: "cuprum-bold";
            font-size: 21px;
            width: 365px;
            height: 100px;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
            text-align: center; }
      #out section#gallery .btn-close {
        background: url("../../assets/img/btn-close.png") no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
                background-size: cover;
        position: absolute;
        top: 25px;
        left: 25px;
        height: 80px;
        width: 80px;
        opacity: 0;
        visibility: hidden;
        z-index: 999;
        -webkit-border-radius: 50%;
                border-radius: 50%; }
        #out section#gallery .btn-close:active {
          background: url("../../assets/img/btn-close-down.png") no-repeat;
          background-position: center center;
          -webkit-background-size: cover;
                  background-size: cover;
          -webkit-transform: scale(0.9);
              -ms-transform: scale(0.9);
                  transform: scale(0.9); }
