hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}



/********************
BASE STYLING
********************/

/*html, body {
  height: 100%;
}
*/
#magicbase {
  position: absolute!important;
  width: 100%!important;
  height: 100vh!important; 
}

body {
  background: #D9FCFF;
}



/********************
MAGIC
********************/

#scroll-proxy { height: 1000px; }

#magicbase section {
  width: 100%!important;
  height: 100%!important;
  position: absolute!important;
  background-size: 100%!important;
  background-color: transparent!important;
  background-position: center bottom!important;
  background-repeat: no-repeat!important;
}

#environment {
  position: fixed;
  width: 100%;
  height: 100%;
  -webkit-perspective: 800px;
     -moz-perspective: 800px;
      -ms-perspective: 800px;
       -o-perspective: 800px;
          perspective: 800px;
}

#magicbase {
  -webkit-transform-style: preserve-3d;
     -moz-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
       -o-transform-style: preserve-3d;
          transform-style: preserve-3d;
}


/* Island START */
#first {
  background-image: url(../img/island/new/first.png);
  -webkit-transform: translate3d( 0, 0, -11500px) scale(16);
     -moz-transform: translate3d( 0, 0, -11500px) scale(16);
      -ms-transform: translate3d( 0, 0, -11500px) scale(16);
       -o-transform: translate3d( 0, 0, -11500px) scale(16);
          transform: translate3d( 0, 0, -11500px) scale(16);
}

#second {
 
  background-image: url(../img/island/new/second.png);
  -webkit-transform: translate3d( 0, 0, -24000px ) scale(40);
     -moz-transform: translate3d( 0, 0, -24000px ) scale(40);
      -ms-transform: translate3d( 0, 0, -24000px ) scale(40);
       -o-transform: translate3d( 0, 0, -24000px ) scale(40);
          transform: translate3d( 0, 0, -24000px ) scale(40);
}

#third {

 background-image: url(../img/island/new/third.png);
  -webkit-transform: translate3d( 0, 0, -48000px ) scale(64);
     -moz-transform: translate3d( 0, 0, -48000px ) scale(64);
      -ms-transform: translate3d( 0, 0, -48000px ) scale(64);
       -o-transform: translate3d( 0, 0, -48000px ) scale(64);
          transform: translate3d( 0, 0, -48000px ) scale(64);
}

#fourth {
   
   background-image: url(../img/island/new/fourth.png);
  -webkit-transform: translate3d( 0, 0, -80000px ) scale(128);  /* inicijalno je bilo -64000px */
     -moz-transform: translate3d( 0, 0, -80000px ) scale(128);
      -ms-transform: translate3d( 0, 0, -80000px ) scale(128);
       -o-transform: translate3d( 0, 0, -80000px ) scale(128);
          transform: translate3d( 0, 0, -80000px ) scale(128);
}

/* Island END */

/* space START*/
#afirstspace {
  background-image: url(../img/space/ikone.png);
  -webkit-transform: translate3d( 0, 0, -10500px) scale(16);
     -moz-transform: translate3d( 0, 0, -10500px) scale(16);
      -ms-transform: translate3d( 0, 0, -10500px) scale(16);
       -o-transform: translate3d( 0, 0, -10500px) scale(16);
          transform: translate3d( 0, 0, -10500px) scale(16);
}

#firstspace {
  background-image: url(../img/space/spacefirst.png);
  -webkit-transform: translate3d( 0, 0, -11500px) scale(16);
     -moz-transform: translate3d( 0, 0, -11500px) scale(16);
      -ms-transform: translate3d( 0, 0, -11500px) scale(16);
       -o-transform: translate3d( 0, 0, -11500px) scale(16);
          transform: translate3d( 0, 0, -11500px) scale(16);
}

#secondspace {
 background-image: url(../img/space/asteroid.png);

  -webkit-transform: translate3d( 0, 0, -24000px ) scale(32);
     -moz-transform: translate3d( 0, 0, -24000px ) scale(32);
      -ms-transform: translate3d( 0, 0, -24000px ) scale(32);
       -o-transform: translate3d( 0, 0, -24000px ) scale(32);
          transform: translate3d( 0, 0, -24000px ) scale(32);
}


#fifthspace {
   
   background-image: url(../img/space/asteroids.png);
  -webkit-transform: translate3d( 0, 0, -30000px ) scale(40);
     -moz-transform: translate3d( 0, 0, -30000px ) scale(40);
      -ms-transform: translate3d( 0, 0, -30000px ) scale(40);
       -o-transform: translate3d( 0, 0, -30000px ) scale(40);
          transform: translate3d( 0, 0, -30000px ) scale(40);
}

#thirdspace {

 background-image: url(../img/space/spacethird.png);
  -webkit-transform: translate3d( 0, 0, -48000px ) scale(64);
     -moz-transform: translate3d( 0, 0, -48000px ) scale(64);
      -ms-transform: translate3d( 0, 0, -48000px ) scale(64);
       -o-transform: translate3d( 0, 0, -48000px ) scale(64);
          transform: translate3d( 0, 0, -48000px ) scale(64);
}

#fourthspace {
   
   background-image: url(../img/space/spacefourth.png);
  -webkit-transform: translate3d( 0, 0, -80000px ) scale(128);
     -moz-transform: translate3d( 0, 0, -80000px ) scale(128);
      -ms-transform: translate3d( 0, 0, -80000px ) scale(128);
       -o-transform: translate3d( 0, 0, -80000px ) scale(128);
          transform: translate3d( 0, 0, -80000px ) scale(128);
}



/* space END*/

/* formula START*/
#firstform {
  background-image: url(../img/formula/spacethird.png);
  
  
  -webkit-transform: translate3d( 0, 0, -11500px) scale(16);
     -moz-transform: translate3d( 0, 0, -11500px) scale(16);
      -ms-transform: translate3d( 0, 0, -11500px) scale(16);
       -o-transform: translate3d( 0, 0, -11500px) scale(16);
          transform: translate3d( 0, 0, -11500px) scale(16);
}

#secondform {
  background-image: url(../img/formula/formulamenu.png);


  -webkit-transform: translate3d( 0, 0, -24000px ) scale(32);
     -moz-transform: translate3d( 0, 0, -24000px ) scale(32);
      -ms-transform: translate3d( 0, 0, -24000px ) scale(32);
       -o-transform: translate3d( 0, 0, -24000px ) scale(32);
          transform: translate3d( 0, 0, -24000px ) scale(32);
}

#fifthform {
  background-image: url(../img/formula/formulamenu2.png);


  -webkit-transform: translate3d( 0, 0, -30000px ) scale(40);
     -moz-transform: translate3d( 0, 0, -30000px ) scale(40);
      -ms-transform: translate3d( 0, 0, -30000px ) scale(40);
       -o-transform: translate3d( 0, 0, -30000px ) scale(40);
          transform: translate3d( 0, 0, -30000px ) scale(40);
}



#thirdform {

  background-image: url(../img/formula/formula.png);
  -webkit-transform: translate3d( 0, 0, -48000px ) scale(64);
     -moz-transform: translate3d( 0, 0, -48000px ) scale(64);
      -ms-transform: translate3d( 0, 0, -48000px ) scale(64);
       -o-transform: translate3d( 0, 0, -48000px ) scale(64);
          transform: translate3d( 0, 0, -48000px ) scale(64);
}

#fourthform {
   
   background-image: url(../img/formula/formulabg.png);
  -webkit-transform: translate3d( 0, 0, -80000px ) scale(128);
     -moz-transform: translate3d( 0, 0, -80000px ) scale(128);
      -ms-transform: translate3d( 0, 0, -80000px ) scale(128);
       -o-transform: translate3d( 0, 0, -80000px ) scale(128);
          transform: translate3d( 0, 0, -80000px ) scale(128);
}


/* forumula END*/