@import url("https://fonts.googleapis.com/css?family=Raleway:400,900");

html {
  overflow: hidden;
  -ms-touch-action: none;
  -ms-content-zooming: none;
}

body {
  position: absolute;
  margin: 0px;
  padding: 0px;
  background-color: black;
  width: 100%;
  height: 100%;
	overflow: hidden;
}




.canvas {
  position: absolute;
  top: 0;
  left: 0;
	width: 100%;
  height: 100%;
  z-index: 1000;
	opacity: 1;
}





#screen {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  background: ;
	opacity: 1;
  overflow: hidden;
	
}

@media screen and (orientation: portrait) {
   #screen {
   transform: scale(2);
   }
}


#screen img {
  position: absolute;
  visibility: hidden;
}

.words {
  position: absolute;
  color: none;
  width: 300px;
  text-align: center;
  font-size: 60px;
  -webkit-text-stroke-width: .4px;
  -webkit-text-stroke-color: white;
}












.in {
    display: none;
  }

#box4 {
   width: 100px;
    height: 100px;    
    background: url(../img/sg_boxxxr_log_1037.png);        
	background-repeat:no-repeat;
    background-position:top left;
	margin-left: 0px;      
    margin-right: 0px; 
    position: absolute;
	top: 20px;
	left: 20px;
	z-index: 5000;
}
#box5 {
   width: 100px;
    height: 100px;    
    background: url(../ham1.png);        
	background-repeat:no-repeat;
    background-size: cover;
	margin-left: 0px;      
    margin-right: 0px; 
    position: absolute;
	top: 20px;
	left: 20px;
	z-index: 5001;
}

#box6 {
   width: 200px;
    height: 200px;    
    background: url(../logo-b.png);        
	background-repeat:no-repeat;
    background-size: cover;
	margin-left: 0px;      
    margin-right: 0px; 
    position: absolute;
	bottom: 28px;
	left: 28px;
	z-index: 5001;
}

#box9 {
   width: 310px;
    height: 100px;    
    background:url('../dragcube2.png') no-repeat;
	background-size: contain;
	background-position: center;
	margin-left: 0px;      
    margin-right: 0px; 
    position: absolute;
	top: 28px;
	
	right: 28px;
	z-index: 5006;
}

.embed-container{
   width: 100px;
    height: 100px;    
    position: absolute;
	top: 20px;
	left: 20px;
	z-index: 6001;
	overflow: hidden;
}





#box0 {
   width: 100%;
    height: 100%;    
    
	
	margin: 0;      
    
    position: absolute;
	animation: go 4s ease-in-out infinite alternate,  5s infinite alternate;
	
	
	z-index: 2;
}



@keyframes go {

	0% {
        transform: translateY(-30px);
		}
	50% {
        transform: translateY(30px);
		}
	100% {
        transform: translateY(-30px);
		}
}

@keyframes go2 {

	0% {
        transform: translateX(0px);
		}
	50% {
        transform: translateX(70px);
		}
	100% {
        transform: translateX(0px);
		}
}