/*@-webkit-keyframes spincube {*/
/*    from,to  { -webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); }*/
/*    16%      { -webkit-transform: rotateY(-90deg);                           }*/
/*    33%      { -webkit-transform: rotateY(-90deg) rotateZ(90deg);            }*/
/*    50%      { -webkit-transform: rotateY(-180deg) rotateZ(90deg);           }*/
/*    66%      { -webkit-transform: rotateY(-270deg) rotateX(90deg);           }*/
/*    83%      { -webkit-transform: rotateX(90deg);                            }*/
/*  }*/

/*  @keyframes spincube {*/
/*    from,to {*/
/*      -moz-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);*/
/*      -ms-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);*/
/*      transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);*/
/*    }*/
/*    16% {*/
/*      -moz-transform: rotateY(-90deg);*/
/*      -ms-transform: rotateY(-90deg);*/
/*      transform: rotateY(-90deg);*/
/*    }*/
/*    33% {*/
/*      -moz-transform: rotateY(-90deg) rotateZ(90deg);*/
/*      -ms-transform: rotateY(-90deg) rotateZ(90deg);*/
/*      transform: rotateY(-90deg) rotateZ(90deg);*/
/*    }*/
/*    50% {*/
/*      -moz-transform: rotateY(-180deg) rotateZ(90deg);*/
/*      -ms-transform: rotateY(-180deg) rotateZ(90deg);*/
/*      transform: rotateY(-180deg) rotateZ(90deg);*/
/*    }*/
/*    66% {*/
/*      -moz-transform: rotateY(-270deg) rotateX(90deg);*/
/*      -ms-transform: rotateY(-270deg) rotateX(90deg);*/
/*      transform: rotateY(-270deg) rotateX(90deg);*/
/*    }*/
/*    83% {*/
/*      -moz-transform: rotateX(90deg);*/
/*      -ms-transform: rotateX(90deg);*/
/*      transform: rotateX(90deg);*/
/*    }*/
/*  }*/

/*  .cubespinner {*/
/*    -webkit-animation-name: spincube;*/
/*    -webkit-animation-timing-function: ease-in-out;*/
/*    -webkit-animation-iteration-count: infinite;*/
/*    -webkit-animation-duration: 12s;*/

/*    animation-name: spincube;*/
/*    animation-timing-function: ease-in-out;*/
/*    animation-iteration-count: infinite;*/
/*    animation-duration: 30s;*/

/*    -webkit-transform-style: preserve-3d;*/
/*    -moz-transform-style: preserve-3d;*/
/*    -ms-transform-style: preserve-3d;*/
/*    transform-style: preserve-3d;*/

/*    -webkit-transform-origin: 60px 60px 0;*/
/*    -moz-transform-origin: 60px 60px 0;*/
/*    -ms-transform-origin: 60px 60px 0;*/
/*    transform-origin: 60px 60px 0;*/
/*  }*/

/*  .cubespinner div {*/
/*    position: absolute;*/
/*    width: 100px;*/
/*    height: 100px;*/
/*    border: 1px solid #ccc;*/
/*    background: rgba(255,255,255,0.8);*/
/*    box-shadow: inset 0 0 20px rgba(0,0,0,0.2);*/
/*    line-height: 120px;*/
/*    text-align: center;*/
/*    font-size: 100px;*/
/*    right:60%;*/
/*  }*/
   
/*  .cubespinner .front1{*/
/*   width: 165px;*/
/*    height: 165px;*/
/*    background: #efefef6b;*/
/*    -webkit-transform: translateZ(82px);*/
/*    -moz-transform: translateZ(82px);*/
/*    -ms-transform: translateZ(82px);*/
/*    transform: translateZ(82px);*/
    /* background: #008175b3; */
    /* background-size: 90%; */
    /* background-repeat: no-repeat; */
    /* padding: 5px; */
/*    background-position: center;*/
/*    top: -35px;*/
/*    right: 29%;*/
/*    margin-top: -2px;*/
/*  }*/
  
/*  .cubespinner .cuberight2{*/
/*      width: 165px;*/
/*    height: 165px;*/
    /* transform: translateZ(80px); */
/*    -webkit-transform: rotateY(90deg) translateZ(82px);*/
/*    -moz-transform: rotateY(90deg) translateZ(82px);*/
/*    -ms-transform: rotateY(90deg) translateZ(82px);*/
/*    transform: rotateY(90deg) translateZ(82px);*/
/*    background: #efefef6b;*/
/*    background-size: 90%;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*    background-position: center;*/
/*    top: -37px;*/
/*    right: 29%;*/
/*  }*/
  
/*  .cubespinner .cubeleft3{*/
/*      width: 165px;*/
/*    height: 165px;*/
/*    -webkit-transform: rotateY(90deg) rotateX(90deg) translateZ(82px);*/
/*    -moz-transform: rotateY(90deg) rotateX(90deg) translateZ(82px);*/
/*    -ms-transform: rotateY(90deg) rotateX(90deg) translateZ(82px);*/
/*    transform: rotateY(90deg) rotateX(90deg) translateZ(82px);*/
/*    background: #efefef6b;*/
/*    background-size: 90%;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*    background-position: center;*/
/*    top: -37px;*/
/*    right: 29%;*/
/*  }*/
  
/*  .cubespinner .cubetop4{*/
/*     width: 165px;*/
/*    height: 165px;*/
/*    -webkit-transform: rotateY(180deg) rotateZ(90deg) translateZ(82px);*/
/*    -moz-transform: rotateY(180deg) rotateZ(90deg) translateZ(82px);*/
/*    -ms-transform: rotateY(180deg) rotateZ(90deg) translateZ(82px);*/
/*    transform: rotateY(180deg) rotateZ(90deg) translateZ(82px);*/
/*    background: #efefef6b;*/
/*    background-size: 90%;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*    background-position: center;*/
/*    top: -37px;*/
/*    right: 29%;*/
/*}*/

  
/*    .cubespinner .cubebottom5{*/
/*      width: 165px;*/
/*    height: 165px;*/
/*    background: #efefef6b;*/
    /* transform: translateZ(80px); */
/*      -webkit-transform: rotateY(-90deg) rotateZ(90deg) translateZ560px);*/
/*    -moz-transform: rotateY(-90deg) rotateZ(90deg) translateZ(82px);*/
/*    -ms-transform: rotateY(-90deg) rotateZ(90deg) translateZ(82px);*/
/*    transform: rotateY(-90deg) rotateZ(90deg) translateZ(82px);*/
/*    background-size: 90%;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*    background-position: center;*/
/*    top: -37px;*/
/*    right: 29%;*/
/*  }*/
  

/*   .cubespinner .cubebck6{*/
/*      width: 165px;*/
/*    height: 165px;*/
    /* transform: translateZ(80px); */
/*       -webkit-transform: rotateX(-90deg) translateZ(82px);*/
/*    -moz-transform: rotateX(-90deg) translateZ(82px);*/
/*    -ms-transform: rotateX(-90deg) translateZ(82px);*/
/*    transform: rotateX(-90deg) translateZ(82px);*/
    
    
    
/*    background: #efefef6b;*/
/*    background-size: 90%;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*    background-position: center;*/
/*    top: -37px;*/
/*    right: 29%;*/
/*  }*/


/*  .cubespinner .face1 {*/
/*     -webkit-transform: translateZ(50px);*/
/*    -moz-transform: translateZ(50px);*/
/*    -ms-transform: translateZ(50px);*/
/*    transform: translateZ(50px);*/
/*     background:#008175b3;*/
/*    background-size: 90%;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*    background-position:center;*/
  
/*  }*/
/*  .cubespinner .face2 {*/
/*    -webkit-transform: rotateY(90deg) translateZ(50px);*/
/*    -moz-transform: rotateY(90deg) translateZ(50px);*/
/*    -ms-transform: rotateY(90deg) translateZ(50px);*/
/*    transform: rotateY(90deg) translateZ(50px);*/
    /*background-image: url('https://melivenews.com/ui/img/tmt svg-01.svg');*/
/*     background-size: 92%!important;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*	background-position:center;*/
/*     background:#008175b3;*/
    /*color: #253361;*/
    /*overflow: hidden;*/
    /*font-size: 17px;*/
    /*font-weight: 600;*/
    /*padding: 30px 5px 5px 5px;*/
    /*line-height: normal;*/
/*  }*/
/*  .cubespinner .face3 {*/
/*    -webkit-transform: rotateY(90deg) rotateX(90deg) translateZ(50px);*/
/*    -moz-transform: rotateY(90deg) rotateX(90deg) translateZ(50px);*/
/*    -ms-transform: rotateY(90deg) rotateX(90deg) translateZ(50px);*/
/*    transform: rotateY(90deg) rotateX(90deg) translateZ(50px);*/
/*     background:#008175b3;*/
/*    background-size: 90%;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*	background-position:center;*/
/*		background-position:center;*/
/*  }*/
  
/*  .cubespinner .face4 {*/
/*    -webkit-transform: rotateY(180deg) rotateZ(90deg) translateZ(50px);*/
/*    -moz-transform: rotateY(180deg) rotateZ(90deg) translateZ(50px);*/
/*    -ms-transform: rotateY(180deg) rotateZ(90deg) translateZ(50px);*/
/*    transform: rotateY(180deg) rotateZ(90deg) translateZ(50px);*/
/*     background:#008175b3;*/
/*    background-size: 90%;*/
/*    background-repeat: no-repeat;*/
    /*padding: 5px;*/
/*	background-position:center;*/
/*  }*/
/*  .cubespinner .face5 {*/
/*    -webkit-transform: rotateY(-90deg) rotateZ(90deg) translateZ560px);*/
/*    -moz-transform: rotateY(-90deg) rotateZ(90deg) translateZ(50px);*/
/*    -ms-transform: rotateY(-90deg) rotateZ(90deg) translateZ(50px);*/
/*    transform: rotateY(-90deg) rotateZ(90deg) translateZ(50px);*/
/*     background:#008175b3;*/
/*     background-size: 90%;*/
/*    background-repeat: no-repeat;*/
    /*padding: 5px;*/
/*	background-position:center;*/
/*  }*/
/*  .cubespinner .face6 {*/
/*    -webkit-transform: rotateX(-90deg) translateZ(50px);*/
/*    -moz-transform: rotateX(-90deg) translateZ(50px);*/
/*    -ms-transform: rotateX(-90deg) translateZ(50px);*/
/*    transform: rotateX(-90deg) translateZ(50px);*/
/*     background:#008175b3;*/
/*     background-size: 90%;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5px;*/
/*	background-position:center;*/
/*  }*/

/*  .cubespinner .face3 span.boxtitle3 , .cubespinner .face4 span.boxtitle4,*/
/*  .cubespinner .face5 span.boxtitle5,.cubespinner .face6 span.boxtitle6{*/
/*	  background: #fcfdfde8;*/
/*	  font-size: 11px;*/
/*	  top: 0px;*/
/*	  padding: 3px 5px;*/
/*	    color: #000;*/
/*	    padding: 0;*/
/*	    position: absolute;*/
/*	    background: #fff;*/
/*	     line-height: normal;*/
/*	     width: 100%;*/
/*	     text-align: center;*/
/*	     left: 0;*/
/*  }*/
/*  .cubespinner .face3 span.boxcontent3 , .cubespinner .face4 span.boxcontent4,*/
/*  .cubespinner .face5 span.boxcontent5,.cubespinner .face6 span.boxcontent6{*/
/*	position: absolute;*/
/*    top: 14px;*/
/*    font-size: 15px;*/
/*    color: #000;*/
/*    font-weight: 600;*/
/*    left: 0;*/
/*    line-height: normal;*/
/*   color: #253361;*/
/*   padding: 5px*/
/*  }*/

/*   .cubespinner .face3 span.boxpoweredby , .cubespinner .face4 span.boxpoweredby,*/
/*   .cubespinner .face5 span.boxpoweredby,.cubespinner .face6 span.boxpoweredby{*/
/*	  background: #fcfdfde8;*/
/*	  font-size: 10px;*/
/*	  bottom: 0px;*/
/*	  padding: 3px 5px;*/
/*	    color: #000;*/
/*	    padding: 0;*/
/*	    position: absolute;*/
/*	    background: #fff;*/
/*	     line-height: normal;*/
/*	     width: 100%;*/
/*	     text-align: center;*/
/*	     left: 0;*/
/*  }*/
  
  
  
  
  
  /*//////////////////////*/
  
  

.cube2 .logo{
   margin: 1em;
   position: fixed;
   bottom: -72px;
   z-index: 99999999999;
   right: 0;
}
.scale{
perspective:400px;
transform-style:preserve-3d;
transform: rotateX(-22deg);
}
      /* keyframes for rotating animation */
@-webkit-keyframes spin {
  from { transform: rotateY(0); }
  to   { transform: rotateY(360deg); }
}

/* scene wrapper */
.wrapper{
  position:relative;
  perspective: 800px;
  perspective-origin: 50% 100px;
}

/* cube wrapper */
.cube{
  position: relative;
  
    margin: 0 auto;
    width: 100px;
    transform-style: preserve-3d;
    animation: spin 4s infinite linear;
    transition: all 1s linear;
    top: -16px;
    left: -136px;
}

/* outer cube */
h{
  position:absolute;
  width:100px;
  height:100px;
  display:none;
  background:rgba(255,255,255,0.1);
  box-shadow:inset 0 0 30px rgba(0,0,0,0.2);
  font-size:20px;
  text-align:center;
  line-height:200px;
  color:rgba(0,0,0,0.5);
  font-family:sans-serif;
  text-transform:uppercase;
  transition: all 1s linear;
}
h.cube2back{
  transform: translateZ(-50px) rotateY(180deg);
}
h.right{
  transform:rotateY(-270deg) translateX(50px);
  transform-origin: top right;
}
h.left{
  transform:rotateY(270deg) translateX(-50px);
  transform-origin: center left;
}
h.top{
 transform:rotateX(90deg)translateZ(50px);
  
}
h.bottom{
  transform:rotateX(90deg) translateY(50px);
  transform-origin: bottom center;
}
h.front{
  transform: translateZ(50px);
}

/* inner cube */
k{
  position:absolute;
  border-radius: 15px;
  top:35px;
  left:25px;
  width:50px;
  height:50px;
  display:block;
  background:#15acbaab;
  transition: all 1s linear;
       background-size: 90%;
    background-repeat: no-repeat;
    padding: 5px;
	background-position:center;
}
k.front{
  transform: translateZ(-30px); 
}
k.cube2back{
  transform: translateZ(20px) rotateY(180deg);
}
k.bottom{
  transform:rotateX(-90deg) translateY(30px);
  transform-origin: left bottom;
}
k.left{
  transform:rotateY(270deg) translateX(-30px);
  transform-origin: center left;
}
k.right{
  transform:rotateY(-270deg) translateX(30px);
  transform-origin: top right;
}
k.top{
  transform:rotateX(-270deg) translateY(-30px);
  transform-origin: right top;
}

/* hover transformations */
/*.cube:hover{*/
/*  top:150px;*/
/*}*/
/*.cube:hover h.top{*/
/*  transform: translateZ(-100px) rotateX(175deg);*/
/*  transform-origin: top ;*/
/*}*/
/*.cube:hover k{*/
/*  top:-200px;*/
/*}*/

svg{

 

}
.pen{
  fill:black;
 animation:rotateInDownLeft 3s forwards;
}
.all{
  animation:rotateOut 3s forwards;
}
@keyframes rotateInDownLeft {
  from {
    transform-origin: left bottom;
    transform: rotate3d(0,0,0, 0deg);
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
 transform: ;
 transform:translateX(850px) translateY(-83px) rotate3d(0,0,1, -60deg);
    opacity: 1;
  }
}
@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 1;
  }
}