html, body {
	width: 100%;
	height: 100%;
  	margin: 0px;
  	padding: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
}

html {	
	flex-direction: column;
}

body {
	flex-direction: row;
	overflow: hidden;
    touch-action: none;
	/*background: radial-gradient(#efefef, #000000);*/
	background: black;
}



.skulltop, .skullbottom {
      position: relative;
      margin: 0 auto;
    top: 200px;
    background:url("city12.jpg");
    background-size: 100% 50%;
      background-repeat: no-repeat;
 }


.skullbottom { 
      height: 800px;
      width: 533px;
			transform-style: preserve-3d;
			background-blend-mode: luminosity;
		}

.skulltop{   	
      height: 800px;
      width: 533px;
      opacity: .3;
      top: -4px;
      left: -3px;
			background-blend-mode: multiply;
			background-repeat: no-repeat;
			transform:translateZ(100px);
		}


    * {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      -webkit-tap-highlight-color: transparent;
      -webkit-touch-callout: none;
    }