cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv

Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

You're using npm packages, so we've auto-selected Babel for you here, which we require to process imports and make it all work. If you need to use a different JavaScript preprocessor, remove the packages in the npm tab.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Use npm Packages

We can make npm packages available for you to use in your JavaScript. We use webpack to prepare them and make them available to import. We'll also process your JavaScript with Babel.

⚠️ This feature can only be used by logged in users.

Code Indentation

     

Save Automatically?

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

            
              <div class="wrap">
	<div class="scene-1">
		<div class="bg-1 animation_to_left"></div>
		<div class="bg-2 animation_to_right"></div>
		<div class="back-table animation_to_left">
			<div class="books"></div>
			<div class="frame"></div>
		</div>
		<div class="photos animation_to_left"></div>
		<div class="shelf-1 animation_to_left">
				<div class="book"></div>
				<div class="camera">
				<div class="camera__flash"></div>
			</div>
		</div>
		<div class="shelf-2 animation_to_left">
			<div class="books"></div>
			<div class="ship">
				<div></div>
				<div></div>
				<div></div>
				<div></div>
			</div>
		</div>
		<div class="table animation_to_right">
			<div></div>
			<div></div>
			<div></div>
			<div class="tablet"></div>
			<div class="lamp">
				<div></div>
			</div>
		</div>
		<div class="chair animation_to_right"></div>
		<div class="armchair animation_to_right">
			<div></div>
			<div class="plaid"></div>
		</div>
		<div class="picture animation_to_right">
			<div></div>
			<div></div>
		</div>
		<div class="red-dog animation_to_right">
			<div class="red-dog__body"></div>
			<div class="red-dog__leg"></div>
			<div class="red-dog__hand"></div>
			<div class="red-dog__head">
				<div></div>
				<div></div>
			</div>
		</div>
		<div class="man animation_to_right">
			<div class="man__leg">
				<div class="man__knee">
					<div class="man__feet">
						<div></div>
						<div></div>
					</div>
				</div>
			</div>
			<div class="man__body">
				<div class="man__chest">
					<div class="man__head">
						<div></div>
						<div></div>
						<div></div>
						<div></div>
						<div></div>
					</div>
					<div class="man__arm">
						<div class="man__forearm">
							<div></div>
							<div></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="scene-2">
		<div class="bg-1"></div>
		<div class="bg-2"></div>
		<div class="bg-3"></div>
		<div class="bg-4"></div>
		<div class="bg-5"></div>
		<div class="bg-6"></div>
		<div class="rock">
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div class="lighthouse"></div>
		</div>
		<div class="girl">
			<div></div>
			<div></div>
			<div class="girl__back-leg">
				<div class="girl__foot"></div>
				<div class="girl__foot-thumbs"></div>
			</div>
			<div class="girl__back-arm">
				<div class="girl__paper"></div>
			</div>
			<div class="girl__chest">
				<div class="girl__face">
					<div class="girl__nose"></div>
				</div>
			</div>
			<div class="girl__back-shorts"></div>
			<div class="girl__front-leg">
				<div class="girl__knee"></div>
			</div>
			<div class="girl__shorts"></div>
			<div class="girl__front-arm">
				<div class="girl__forearm">
					<div class="girl__palm"></div>
				</div>
			</div>
		</div>
		<div class="stone"></div>
		<div class="basket">
			<div></div>
			<div></div>
		</div>
		<div class="sand">
			<div></div>
		</div>
		<div class="crab">
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
			<div></div>
		</div>
		<div class="water">
			<div></div>
			<div></div>
			<div></div>
			<div></div>
		</div>
	</div>
	<div class="scene-3">
		<div class="bg-1"></div>
		<div class="bg-2"></div>
		<div class="road">
			<div class="car">
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div><div></div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div></div>
				<div class="sneakers">
					<div></div>
				</div>
				<div class="papper"></div>
				<div class="pizza">
					<div class="pizza__fat"></div>
				</div>
				<div class="coffee"></div>
				<div class="man">
					<div class="man__legs">
						<div></div>
						<div></div>
						<div></div>
						<div></div>
						<div></div>
						<div></div>
					</div>
					<div class="man__head">
						<div class="man__beard"></div>
						<div class="man__hair"></div>
						<div class="man__nose"></div>
					</div>
					<div class="man__body"></div>
					<div class="laptop"></div>
					<div class="man__arm">
						<div class="man__forearm"></div>
					</div>
					<div class="man__shorts"></div>
				</div>
			</div>
		</div>
	</div>
	<div class="scene-4">
		<div class="bg-2"></div>
		<div class="bg-1"></div>
		<div class="scene-4__right">
			<div class="bookshelf"></div>
			<div class="photo"></div>
			<div class="books-1"></div>
			<div class="books-2"></div>
			<div class="books-3"></div>
		</div>
		<div class="scene-4__top">
			<div class="picture-1"></div>
			<div class="picture-2"></div>
			<div class="picture-3"></div>
			<div class="picture-4"></div>
			<div class="picture-5"></div>
			<div class="picture-6"></div>
			<div class="picture-7"></div>
			<div class="picture-8"></div>
		</div>
		<div class="scene-4__left">
			<div class="commode">
				<div class="commode__box"></div>
				<div class="printer"></div>
			</div>
			<div class="chair">
				<div class="chair__legs"></div>
				<div class="chair__back"></div>
				<div class="girl">
					<div class="girl__neck"></div>
					<div class="girl__back-arm">
						<div class="girl__palm"></div>
					</div>
					<div class="girl__body"></div>
					<div class="girl__head">
						<div class="girl__hair"></div>
						<div class="girl__face"></div>
					</div>
					<div class="girl__front-arm">
						<div class="girl__forearm">
							<div class="teacup"></div>
						</div>
					</div>
					<div class="girl__skirt"></div>
					<div class="girl__back-leg"></div>
					<div class="girl__front-leg"></div>
				</div>
			</div>
			<div class="table">
				<div class="table__leg"></div>
				<div class="plant"></div>
				<div class="plant__flower"></div>
				<div class="monitor"></div>
				<div class="keyboard"></div>
			</div>
		</div>
	</div>
</div>
            
          
!
            
              @use postcss-nested;
body {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 100vh;
	width: 100%;
	margin: 0;
	padding: 0;
}
.wrap {
	position: relative;
	width: 800px; height: 600px;
	overflow: hidden;
}
.scene-1 {
	position: absolute;
	top: 0px; left: 0px;
	width: 800px; height: 600px;
	animation: sceneOne 10s linear infinite;

	.bg-1 {
		position: absolute;
		top: 0px; left: 0px;
		width: 900px; height: 122px;
		background: #654143;
		border-radius: 0 61px 61px 0;

		&:before {
			content: '';
			position: absolute;
			top: 122px; left: 0px;
			width: 822px; height: 250px;
			background: #704744;
		}
		&:after {
			content: '';
			position: absolute;
			top: 340px; left: 0px;
			width: 543px; height: 228px;
			background: #654143;
			border-radius: 0 56px 35px 0;
		}
	}
	.bg-2 {
		position: absolute;
		top: 0px; right: 0px;
		width: 900px; height: 77px;
		background: #593640;
		border-radius: 30px 0 0 30px;

		&:before {
			content: '';
			position: absolute;
			top: 360px; right: 0px;
			width: 870px; height: 222px;
			background: #654143;
			border-radius: 68px 0 0 0;
		}
		&:after {
			content: '';
			position: absolute;
			top: 582px; right: 0px;
			width: 1244px; height: 20px;
			background: #3F252E;
		}
	}
	.table {
		position: absolute;
		top: 326px; left: 397px;
		width: 208px; height: 14px;
		background: #377CA6;

		&:before {
			content: '';
			position: absolute;
			top: 14px; left: 49px;
			width: 133px; height: 24px;
			box-sizing: border-box;
			border-top: 13px solid #1C101C;
			border-right: 13px solid #1C101C;
			border-left: 13px solid #1C101C;
		}
		&:after {
			content: '';
			position: absolute;
			top: 38px; left: 49px;
			width: 133px; height: 186px;
			box-sizing: border-box;
			border-left: 13px solid #271F28;
			border-bottom: 13px solid #271F28;
			border-right: 13px solid #271F28;
			border-radius: 0 0 53px 0;
		}

		& > div:nth-child(1) {
			position: absolute;
			top: 14px; left: 21px;
			width: 28px; height: 13px;
			background: #1C101C;
		
			&:before {
				content: '';
				position: absolute;
				top: 196px; left: 17px;
				width: 13px; height: 14px;
				background: #271F28;
				box-shadow: 0 14px 0 #1C101C, 0 27px 0 #271F28, 0 31px 0 #271F28;
			}
			&:after {
				content: '';
				position: absolute;
				top: 204px; left: 99px;
				width: 13px; height: 18px;
				background: #1C101C;
				box-shadow: 0 18px 0 #271F28;
			}
		}
		& > div:nth-child(2) {
			position: absolute;
			top: -96px; left: 89px;
			width: 86px; height: 96px;
			background: #271F28;
			border-radius: 27px 27px 40px 0;
			box-shadow: inset -8px -59px 0 9px #1C101C;

			&:before {
				content: '';
				position: absolute;
				top: 28px; left: -50px;
				width: 67px; height: 10px;
				background: #D37241;
				box-shadow: 28px 0 0 0 #AA375F, 
							27px 0 0 0 #740748, 
							-9px 10px 0 0 #1C101C, 
							28px 10px 0 0 white, 
							-23px 28px 0 0 #377CA6, 
							28px 28px 0 0 #D37241, 
							-28px 38px 0 0 white, 
							27px 38px 0 0 white;
			}
			&:after {
				content: '';
				position: absolute;
				top: 62px; left: 67px;
				width: 27px; height: 27px;
				background-image: linear-gradient(to right, #377CA6 36%, #1C101C 37%, #1C101C 63%, #377CA6 64%);
				box-shadow: 0 0 0 6px #1C101C, 
							0 -5px 0 12px #234259;
			}
		}
		& > div:nth-child(3) {
			position: absolute;
			top: -71px; left: 40px;
			width: 97px; height: 5px;
			background: #404040;
			box-shadow: -3px 25px 0px 3px #404040, 
						-14px 25px 0px 3px #404040, 
						-8px 58px 0px 8px #404040, 
						-32px 58px 0px 8px #404040;

			&:before {
				content: '';
				position: absolute;
				top: 0px;
				left: -8px; width: 5px;
				height: 50px;
				background: #404040;
				box-shadow: 14px 0 0 0 #404040, 
							28px 0 0 0 #404040, 
							42px 0 0 0 #404040, 
							56px 0 0 0 #404040, 
							71px 0 0 0 #404040, 
							85px 0 0 0 #404040, 
							100px 0 0 0 #404040;
			}
			&:after {
				content: '';
				position: absolute;
				top: 47px; left: 92px;
				width: 76px; height: 6px;
				background: white;
				box-shadow: 0 6px 0 0 #A7AEAF, 
							-7px 12px 0 0 white, 
							0 18px 0 0 #A7AEAF, 
							-76px 18px 0 0 #1C101C;
			}
		}
	}
	.tablet {
		position: absolute;
		top: 0; left: 0;
		width: 17px; height: 185px;
		background: #BEAE9D;
		transform-origin: top left;
		transform: rotate(-143deg);
		box-shadow: inset 0 -13px 0 0 #9C857C, inset 0 45px 0 0 #9C857C;

		&:after {
			content: '';
			position: absolute;
			top: 79px; left: -14px;
			width: 14px; height: 38px;
			background: #234259;
		}
		&:before {
			content: '';
			position: absolute;
			top: 62px; left: -83px;
			width: 80px; height: 10px;
			background: #1C101C;
			transform: rotate(23deg);
			transform-origin: 0 0;
		}
	}
	.lamp {
		position: absolute;
		top: -304px; left: 46px;
		width: 21px; height: 21px;
		border-radius: 20px 20px 0 0;
		background: #1C101C;

		&:before {
			content: '';
			position: absolute;
			top: 13px; left: -9px;
			width: 43px; height: 10px;
			background: #271F28;
		}
		&:after {
			content: '';
			position: absolute;
			top: 10px; left: 52px;
			width: 80px; height: 5px;
			background: #271F28;
			box-shadow: 0 10px 0 0 #271F28;
		}

		& > div:nth-child(1) {
			position: absolute;
			top: 8px; left: 33px;
			width: 19px; height: 20px;
			background: #1C101C;
			border-radius: 20px 0 0 20px;

			&:after {
				content: '';
				position: absolute;
				top: -2px; left: 99px;
				width: 22px; height: 32px;
				background: #1C101C;
				border-radius: 2px 100% 14px 14px;
			}
			&:before {
				content: '';
				position: absolute;
				top: 16px; left: 103px;
				width: 6px; height: 102px;
				background: #271F28;
				transform: rotate(35deg);
				transform-origin: 0 0;
				box-shadow: 10px 0 0 0 #271F28;
			}
		}
		& > div:nth-child(2) {
			position: absolute;
			top: 19px; left: -25px;
			width: 70px; height: 33px;
			background: #1C101C;
			border-radius: 100px 100px 0 0;
		
			&:before {
				content: '';
				position: absolute;
				top: 33px; left: 0px;
				width: 70px; height: 4px;
				background: #D37241;
			}
			&:after {
				content: '';
				position: absolute;
				top: 37px; left: -133px;
				width: 330px; height: 0px;
				border-left: 132px solid transparent;
				border-right: 127px solid transparent;
				border-bottom: 194px solid #D37241;
				box-sizing: border-box;
				opacity: .2;
			}
		}
	}
	.chair {
		position: absolute;
		top: 433px; left: 214px;
		height: 39px; width: 109px;
		background: #1C101C;
		border-radius: 28px 28px 2px 2px;
		box-shadow: 0 123px 0 -15px #271F28;
	
		&:before {
			content: '';
			position: absolute;
			top: 39px; left: 36px;
			width: 13px; height: 99px;
			background: #271F28;
			box-shadow: 12px 0 0 0 #404040;
		}
		&:after {
			content: '';
			position: absolute;
			top: 71px; left: 56px;
			width: 32px; height: 12px;
			border-radius: 6px;
			box-shadow: -21px -48px 0 13px #1C101C;
			background: #1C101C;
		}
	}
	.armchair {
		position: absolute;
		top: 244px; left: 604px;
		width: 114px; height: 165px;
		background: #1C101C;
		border-radius: 20px 62px 0 0;
	
		&:before {
			content: '';
			position: absolute;
			top: 167px; left: 0px;
			width: 210px; height: 171px;
			background: #3F252E;
		}
		&:after {
			content: '';
			position: absolute;
			top: 128px; left: 114px;
			width: 100px; height: 34px;
			background: #1C101C;
			box-shadow: inset 0 12px 0 0 #3F252E;
		}

		& > div:nth-child(1) {
			position: absolute;
			top: 162px; left: 0px;
			width: 200px; height: 66px;
			background: #593640;
			border-radius: 0 0 0 66px;
			box-shadow: 0 21px 0 0 #1C101C;
		
			&:before {
				content: '';
				position: absolute;
				top: 0px; left: 72px;
				width: 140px; height: 20px;
				background: #654036;
				border-radius: 0 0 0 20px;
			}
			&:after {
				content: '';
				position: absolute;
				top: -80px; left: 0px;
				width: 71px; height: 80px;
				background: #593640;
				border-radius: 0 100px 0 0;
			}
		}
		.plaid {
			position: absolute;
			top: 152px; left: 114px;
			width: 90px; height: 10px;
			background: #AF7C50;
			box-shadow: 0 10px 0 0 #956B48, 
						0 20px 0 0 #AF7C50, 
						0 30px 0 0 #956B48, 
						0 40px 0 0 #AF7C50;
			z-index: 1;
		
			&:before {
				content: '';
				position: absolute;
				top: 50px; left: 0px;
				width: 10px; height: 14px;
				background: #956B48;
				box-shadow: 18px 0 0 0 #956B48, 
							36px 0 0 0 #956B48, 
							54px 0 0 0 #956B48, 
							72px 0 0 0 #956B48;
			}
			&:after {
				content: '';
				position: absolute;
				top: -44px; left: 0px;
				width: 41px; height: 44px;
				background: linear-gradient(to right, #AF7C50 50%, #D69C51 51%);
				border-radius: 24px 24px 0 0;
			}
		}
	}
	.picture {
		position: absolute;
		top: -34px; right: -22px;
		height: 150px; width: 120px;
		background: #9C857C;
		overflow: hidden;
		box-shadow: 0 0 0 22px #956B48, 
					0 0 0 43px #3F252E;
	
		&:before {
			content: '';
			position: absolute;
			top: 47px; left: 27px;
			width: 50px; height: 50px;
			border-radius: 100%;
			background: #BEAE9D;
		}
		&:after {
			content: '';
			position: absolute;
			top: 109px; left: 56px;
			width: 14px;
			border-left: 29px solid transparent;
			border-bottom: 35px solid #3F252E;
		}

		& > div:nth-child(1) {
			position: absolute;
			top: 75px; left: 9px;
			width: 15px;
			border-right: 50px solid transparent;
			border-left: 39px solid transparent;
			border-bottom: 40px solid #88594E;
		
			&:before {
				content: '';
				position: absolute;
				top: -46px; left: -23px;
				height: 10px;
				border-left: 74px solid transparent;
				border-bottom: 76px solid #88594E;
			}
			&:after {
				content: '';
				position: absolute;
				top: 17px; left: -48px;
				width: 14px;
				border-right: 78px solid transparent;
				border-bottom: 100px solid #654036;
			}
		}
		& > div:nth-child(2) {
			position: absolute;
			top: 100px; left: 19px;
			width: 24px;
			border-right: 35px solid transparent;
			border-bottom: 40px solid #654036;
		
			&:before {
				content: '';
				position: absolute;
				top: 9px; left: 32px;
				width: 50px; height: 40px;
				background: #654036;
			}
			&:after {
				content: '';
				position: absolute;
				top: 24px; left: -4px;
				width: 13px;
				border-right: 20px solid transparent;
				border-left: 20px solid transparent;
				border-bottom: 20px solid #3F252E;
				box-shadow: 8px 44px 0 24px #3F252E;
			}
		}
	}
	.red-dog {
		position: absolute;
		top: 152px; left: 568px;
		width: 70px; height: 43px;
		background: #D37241;
		border-radius: 0 34px 0 0;
	
		&:before {
			content: '';
			position: absolute;
			top: -20px; left: -78px;
			width: 104px; height: 68px;
			background: white;
			border-radius: 0 100px 0 100px;
		}

		&__body {
			position: absolute;
			top: -44px; left: -65px;
			width: 81px; height: 74px;
			background: #D37241;
			border-radius: 0 100px 0 100px;
			box-shadow: 35px 24px 0 -24px #D37241, -7px -15px 0 -5px #D37241;

			&:before {
				content: '';
				position: absolute;
				top: 30px; left: 15px;
				width: 35px; height: 40px;
				background: #D37241;
				border-radius: 0 0 20px 20px;
				transform-origin: 0 0;
				transform: rotate(40deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 50px; left: 111px;
				width: 16px; height: 16px;
				background: #D37241;
				transform: skewX(-22deg) rotate(-34deg);
				animation: sceneOneDogTail .8s ease infinite;
				transform-origin: bottom left;
			}
		}
		&__leg {
			position: absolute;
			top: 28px; left: 21px;
			width: 49px; height: 43px;
			background: #D37241;
			border-radius: 0 9px 0 35px;
		
			&:before {
				content: '';
				position: absolute;
				top: 30px; left: 49px;
				width: 12px; height: 34px;
				background: linear-gradient(#D37241 38%, white 39%);
				border-radius: 0 5px 2px 0 / 0 15px 2px 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 52px; left: 34px;
				width: 16px; height: 12px;
				background: white;
				border-radius: 14px 0 0 0;
			}
		}
		&__hand {
			position: absolute;
			top: 15px; left: -96px;
			width: 43px; height: 22px;
			background: white;
			transform-origin: bottom right;
			transform: rotate(40deg);
			border-radius: 21px 10px 10px 0;
		
			&:before {
				content: '';
				position: absolute;
				top: 21px; left: 0px;
				width: 15px; height: 20px;
				background: white;
				border-radius: 0 0 0 17px;
			}
		}
		&__head {
			position: absolute;
			top: -68px; left: -99px;
			width: 42px; height: 56px;
			background: #D37241;
			border-radius: 36% 0 90% 4px / 70% 0 46% 4px;
			border-right: 8px solid white;
			transform-origin: bottom right;
			animation: sceneOneDogHead 10s ease infinite;
			transform: rotate(0deg);
		
			&:before {
				content: '';
				position: absolute;
				top: 25px; left: -20px;
				width: 22px; height: 21px;
				background: #D37241;
				border-radius: 27% 0 0 100%;
				box-shadow: inset 21px 2px 0 -6px white;
			}
			&:after {
				content: '';
				position: absolute;
				top: 20px; left: 9px;
				width: 6px; height: 6px;
				background: black;
				border-radius: 100%;
				animation: sceneOneDogEye 2s ease infinite;
			}

			& > div:nth-child(1) {
				position: absolute;
				top: -22px; left: 18px;
				width: 11px;
				border-left: 23px solid transparent;
				border-bottom: 39px solid #D37241;
				transform-origin: right bottom;
				transform: rotate(10deg);
			
				&:before {
					content: '';
					position: absolute;
					top: 0px; left: -18px;
					width: 6px;
					border-left: 23px solid transparent;
					border-bottom: 39px solid white;
				}
				&:after {
					content: '';
					position: absolute;
					top: 37px; left: -18px;
					width: 30px; height: 9px;
					background: white;
					transform: rotate(-9deg);
					border-radius: 0 0 10px 6px;
				}
			}
			& > div:nth-child(2) {
				position: absolute;
				top: 25px; left: -20px;
				width: 10px; height: 9px;
				background: black;
				border-radius: 6px 0 15px 3px;
			}
		}
	}
	.back-table {
		position: absolute;
		top: 350px; left: 0px;
		width: 277px; height: 30px;
		background: linear-gradient(to right, #956B48 20%, #7A5548 21%, #7A5548 79%, #956B48 80%);
		box-shadow: 0 25px 0 0 #1C101C, 0 -10px 0 0 #AF7C50;
	
		&:before {
			content: '';
			position: absolute;
			top: 55px; left: 0px;
			width: 26px; height: 175px;
			background: #1C101C;
			box-shadow: 251px 0 0 0 #1C101C;
		}
		&:after {
			content: '';
			position: absolute;
			top: 10px; left: 124px;
			width: 30px; height: 10px;
			background: #1C101C;
		}

		.books {
			position: absolute;
			top: -26px; left: 46px;
			width: 102px; height: 16px;
			box-sizing: border-box;
			background: white;
			box-shadow: inset -8px 0 0 0 #716C6B;
			border-radius: 8px 0 0 8px;
			border: 4px solid #271F28;
			border-right: 0;
			
			&:before {
				content: '';
				position: absolute;
				top: -28px; left: 10px;
				width: 88px; height: 24px;
				box-sizing: border-box;
				background: white;
				border-radius: 0 12px 12px 0;
				border: 6px solid #593640;
				border-left: 0;
				box-shadow: inset 6px 0 0 0 #716C6B, 
							inset -23px 0 0 -13px #271F28, 
							inset 0 6px 0 0 rgba(0, 0, 0, .1);
			}
		}
		.frame {
			position: absolute;
			top: -92px; left: 148px;
			width: 46px; height: 62px;
			background: #D69C51;
			border: 10px solid #485973;
		
			&:before {
				content: '';
				position: absolute;
				top: 10px; left: 10px;
				width: 20px; height: 20px;
				border: 3px solid #553333;
				transform: rotate(45deg);
				z-index: 1;
			}
			&:after {
				content: '';
				position: absolute;
				top: 26px; left: 10px;
				width: 20px; height: 20px;
				border: 3px solid #553333;
				transform: rotate(45deg);
				z-index: 1;
			}
		}
	}
	.photos {
		position: absolute;
		top: 252px; left: 66px;
		width: 21px; height: 22px;
		background: #3F252E;
		border: 4px solid white;
		border-bottom-width: 10px;
		transform: rotate(22deg);
	
		&:before {
			content: '';
			position: absolute;
			top: -10px; left: 13px;
			width: 21px; height: 22px;
			background: #234259;
			border: 4px solid white;
			border-bottom-width: 10px;
			transform: rotate(-44deg);
		}
		&:after {
			content: '';
			position: absolute;
			top: -5px; left: 8px;
			width: 8px; height: 8px;
			background: black;
			border-radius: 50%;
		}
	}
	.shelf-1 {
		position: absolute;
		top: 224px; left: 0px;
		width: 210px; height: 8px;
		background: #AF7C50;
	
		&:before {
			content: '';
			position: absolute;
			top: 8px; left: 40px;
			width: 111px; height: 6px;
			background: #1C101C;
		}
		&:after {
			content: '';
			position: absolute;
			top: 14px; left: 40px;
			width: 8px; height: 6px;
			background: #1C101C;
			border-radius: 0 0 5px 5px;
			box-shadow: 103px 0 0 0 #1C101C;
		}

		.book {
			position: absolute;
			top: -28px; left: 77px;
			width: 71px; height: 16px;
			background: white;
			border: 6px solid #234259;
			border-right: 0;
			border-radius: 15px 0 0 15px;
			box-shadow: inset 24px 0 0 -15px #1C101C, 
						inset 0 6px 0 0 rgba(0, 0, 0, .1);
		
			&:before {
				content: '';
				position: absolute;
				top: -43px; left: 35px;
				width: 36px; height: 37px;
				background: linear-gradient(#D5C8B8 12%, #BEAE9D 13%, #BEAE9D 90%, #3F252E 91%);
				border-radius: 0 0 12px 12px;
			}
			&:after {
				content: '';
				position: absolute;
				top: -38px; left: 71px;
				width: 14px; height: 22px;
				box-sizing: border-box;
				border-radius: 0 12px 12px 0;
				border: 7px solid #3F252E;
				border-left: 0;
			}
		}
		.camera {
			position: absolute;
			top: -38px; left: 0px;
			width: 60px; height: 38px;
			background: linear-gradient(#404040 68%, #271F28 69%);
			border-radius: 0 8px 0 8px;
		
			&:before {
				content: '';
				position: absolute;
				top: -4px; left: 0px;
				width: 16px; height: 4px;
				background: #1C101C;
				box-shadow: 5px 26px 0 0 #716C6B;
			}
			&:after {
				content: '';
				position: absolute;
				top: 3px; left: 24px;
				width: 30px; height: 30px;
				box-sizing: border-box;
				background: linear-gradient(#716C6B 45%, #94959B 46%);
				border-radius: 50%;
				border: 7px solid #1C101C;
				transform: rotate(-45deg);
			}

			&__flash {
				position: absolute;
				top: -34px; left: 22px;
				width: 34px; height: 24px;
				box-sizing: border-box;
				background: white;
				border: 4px solid #271F28;
				border-top-width: 7px;
				box-shadow: inset 0 6px 0 0 rgba(0, 0, 0, .1);
			
				&:before {
					content: '';
					position: absolute;
					top: 17px; left: 1px;
					width: 22px; height: 10px;
					background: #1C101C;
				}
			}
		}
	}
	.shelf-2 {
		position: absolute;
		top: 118px; left: 0px;
		width: 198px; height: 18px;
		background: #3F252E;
		box-shadow: -18px 16px 0 0 #593640;
	
		&:before {
			content: '';
			position: absolute;
			top: 18px; left: 180px;
			border-right: 17px solid transparent;
			border-top: 16px solid #271F28;
		}

		.books {
			position: absolute;
			top: -18px; left: 18px;
			width: 54px; height: 18px;
			box-sizing: border-box;
			border-top: 6px solid #956B48;
			border-bottom: 6px solid #956B48;
			border-left: 11px solid #956B48;
			border-right: 11px solid #956B48;
			background: #AF7C50;
			box-shadow: -6px 0 0 0 #AF7C50, 6px 0 0 0 #AF7C50;
			
			&:before {
				content: '';
				position: absolute;
				top: -62px; left: -15px;
				width: 26px; height: 56px;
				background: #756356;
				box-shadow: inset 5px 0 0 0 #58433F, 
							inset 0 4px 0 0 #58433F, 
							inset 0 10px 0 0 #756356, 
							inset 0 16px 0 0 #58433F;
			}
			&:after {
				content: '';
				position: absolute;
				top: -47px; left: 11px;
				width: 26px; height: 41px;
				background: #58433F;
				box-shadow: inset 8px 0 0 0 #9C857C, 
							inset 0 -24px 0 0 #BEAE9D, 
							inset 0 7px 0 0 #BEAE9D, 
							inset -8px 0 0 0 #BEAE9D, 
								  -6px 0 0 0 #58433F;
			}
		}
		.ship {
			position: absolute;
			top: -40px; left: 105px;
			width: 127px; height: 26px;
			background: #7A5548;
			border-radius: 0 0 26% 0 / 0 0 100% 0;
		
			&:before {
				content: '';
				position: absolute;
				top: 0px; left: -25px;
				width: 25px; height: 6px;
				background: #7A5548;
			}
			&:after {
				content: '';
				position: absolute;
				top: 12px; left: 3px;
				width: 8px; height: 8px;
				background: #7A5548;
				transform: rotate(45deg);
				box-shadow: 15px -15px 0 0 #7A5548, 
							30px -30px 0 0 #7A5548, 
							45px -45px 0 0 #7A5548, 
							60px -60px 0 0 #7A5548;
			}

			div:nth-child(1) {
				position: absolute;
				top: -4px; left: -13px;
				width: 122px; height: 4px;
				background: #3F252E;
			
				&:before {
					content: '';
					position: absolute;
					top: -22px; left: 122px;
					width: 10px; height: 20px;
					border-radius: 17px 0 0 0;
					border-top: 6px solid #3F252E;
					border-left: 8px solid #3F252E;
				}
				&:after {
					content: '';
					position: absolute;
					top: -16px; left: 130px;
					width: 10px; height: 10px;
					border-radius: 10px 8px 0 0;
					border-left: 10px solid #7A5548;
					border-top: 10px solid #7A5548;
				}
			}
			div:nth-child(2) {
				position: absolute;
				top: -14px; left: 0px;
				width: 47px; height: 6px;
				background: linear-gradient(to right, #271F28 14%, 
													  #7A5548 15%, #7A5548 27%, 
													  #271F28 28%, #271F28 44%, 
													  #7A5548 45%, #7A5548 57%, 
													  #271F28 58%, #271F28 74%, 
													  #7A5548 75%, #7A5548 87%, 
													  #271F28 88%);
				border-top: 4px solid #3F252E;
			
				&:before {
					content: '';
					position: absolute;
					top: -68px; left: 15px;
					width: 4px; height: 64px;
					background: #3F252E;
				}
				&:after {
					content: '';
					position: absolute;
					top: -68px; left: 65px;
					width: 6px; height: 74px;
					background: #3F252E;
				}
			}
			div:nth-child(3) {
				position: absolute;
				top: -74px; left: 11px;
				width: 21px;
				height: 26px;
				box-sizing: border-box;
				background: #716C6B;
				border: 4px solid #9C857C;
				border-left: 4px solid #593640;
				border-radius: 0 13px 13px 0;
				
				&:before {
					content: '';
					position: absolute;
					top: 18px; left: -4px;
					width: 24px;
					height: 31px;
					box-sizing: border-box;
					border: 4px solid #9C857C;
					border-left: 4px solid #593640;
					background: #716C6B;
					border-radius: 0 16px 16px 0;
				}
				&:after {
					content: '';
					position: absolute;
					top: 12px; left: 43px;
					width: 38px;
					height: 48px;
					box-sizing: border-box;
					border: 9px solid #9C857C;
					border-left: 7px solid #593640;
					background: #716C6B;
					border-radius: 0 26px 26px 0;
				}
			}
			div:nth-child(4) {
				position: absolute;
				top: 6px; left: -19px;
				width: 136px;
				height: 24px;
				background: #3F252E;
				border-radius: 0 0 30px 30px;
				
				&:before {
					content: '';
					position: absolute;
					top: 24px; left: 28px;
					width: 80px;
					height: 4px;
					background: #271F28;
				}
				&:after {
					content: '';
					position: absolute;
					top: 28px; left: 28px;
					width: 5px;
					height: 6px;
					background: #271F28;
					box-shadow: 37px 0 0 0 #271F28, 
								75px 0 0 0 #271F28;
				}
			}
		}
	}
	.man {
		position: absolute;
		top: 54px; left: 189px;
		width: 262px; height: 528px;
		z-index: 1;

		&__body {
			position: absolute;
			top: 241px; left: 0px;
			width: 118px; height: 61px;
			background: linear-gradient(to right, #271F28 46%, #1C101C 47%);
			border-radius: 0 0 100% 5% / 0 0 10% 100%;
		}
		&__chest {
			position: absolute;
			bottom: 59px; left: 0px;
			width: 116px; height: 157px;
			transform-origin: bottom left;
			animation: sceneOneManBody 10s ease infinite;
			transform: rotate(10deg) translateY(0px);

			&:before {
				content: '';
				position: absolute;
				bottom: 0px; left: 0px;
				width: 116px; height: 157px;
				background: linear-gradient(to right, #271F28 46%, #1C101C 47%);
				transform-origin: bottom left;
				animation: sceneOneManChest 10s ease infinite;
				border-radius: 100% 44% 0 0 / 100% 70% 0 0;
				transform: scaleX(1);
			}
		}
		&__head {
			position: absolute;
			top: -98px; left: 44px;
			width: 87px; height: 74px;
			background: #271F28;
			border-radius: 46px 13px 0 0;
			transform-origin: 0 0;
			animation: sceneOneManHead 10s ease infinite;
			transform: rotate(-10deg) translateY(0px) translateX(0px);
		
			&:before {
				content: '';
				position: absolute;
				top: 74px; left: 0px;
				width: 68px; height: 42px;
				background: linear-gradient(to right, #F6BE9C 30%, #D7957C 31%);
				transform-origin: 0 0;
				animation: sceneOneManNeck 10s ease infinite;
				transform: rotate(34deg);
			}

			div:nth-child(1) {
				position: absolute;
				top: 6px; left: 52px;
				width: 47px; height: 27px;
				background: #F6BE9C;
				border-radius: 14px 54% 0 13px / 14px 100% 0 13px;
				
				&:before {
					content: '';
					position: absolute;
					top: 26px; left: -11px;
					width: 39px;
					border-left: 19px solid transparent;
					border-bottom: 23px solid #F6BE9C;
				}
				&:after {
					content: '';
					position: absolute;
					top: 56px; left: 47px;
					width: 10px; height: 12px;
					background: #F6BE9C;
					border-radius: 0 3px 10px 0;
				}
			}
			div:nth-child(2) {
				position: absolute;
				top: 46px; left: 8px;
				width: 24px; height: 24px;
				border-radius: 50%;
				background: #D7957C;
				box-shadow: inset 1px 1px 0 4px #F6BE9C;
				
				&:before {
					content: '';
					position: absolute;
					top: 12px; left: 13px;
					width: 8px; height: 8px;
					background: #F6BE9C;
					border-radius: 50%;
				}
				&:after {
					content: '';
					position: absolute;
					top: 28px; left: -2px;
					border-right: 20px solid transparent;
					border-left: 20px solid transparent;
					border-bottom: 15px solid #F6BE9C;
					transform-origin: top center;
					transform: rotate(36deg);
				}
			}
			div:nth-child(3) {
				position: absolute;
				top: 55px; left: 24px;
				width: 47px; height: 59px;
				background: #271F28;
				border-radius: 18px 0 0 48px;
				
				&:before {
					content: '';
					position: absolute;
					top: 0px; left: 17px;
					width: 58px; height: 19px;
					background: #F6BE9C;
					border-radius: 0 0 0 21px;
				}
				&:after {
					content: '';
					position: absolute;
					top: 19px; left: 47px;
					width: 29px; height: 10px;
					background: #271F28;
					border-radius: 0 0 8px 0;
				}
			}
			div:nth-child(4) {
				position: absolute;
				top: 84px; left: 71px;
				width: 24px; height: 30px;
				background: #271F28;
				border-radius: 0 0 17px 0;
				
				&:before {
					content: '';
					position: absolute;
					top: 0px; left: 5px;
					width: 17px; height: 8px;
					background: white;
					border-radius: 0 0 0 10px;
					animation: sceneOneManMouth 10s ease infinite;
					transform: scaleY(1);
				}
				&:after {
					content: '';
					position: absolute;
					top: -34px; left: 11px;
					width: 5px; height: 13px;
					background: black;
					border-radius: 5px;
					animation: sceneOneManEye 2s ease infinite,
							   sceneOneManEye2 10s ease infinite;
					transform: scaleY(1);
				}
			}
			div:nth-child(5) {
				position: absolute;
				top: 32px; left: 70px;
				width: 10px; height: 6px;
				border-radius: 16px 0 0 0;
				border-top: 7px solid #404040;
				border-left: 7px solid #404040;
				animation: sceneOneManBrow 2s ease infinite,
						   sceneOneManBrow2 10s ease infinite;
				transform: rotate(0deg) translate(0, 0);

				&:before {
					content: '';
					position: absolute;
					top: -7px; left: 6px;
					width: 7px; height: 7px;
					background: #404040;
					border-radius: 50%;
				}
				&:after {
					content: '';
					position: absolute;
					top: 1px; left: -7px;
					width: 7px; height: 7px;
					background: #404040;
					border-radius: 50%;
				}
			}
		}
		&__arm {
			position: absolute;
			top: 6px; left: 12px;
			width: 81px; height: 123px;
			background: linear-gradient(#404040 49%, #D7957C 50%);
			border-radius: 42px 42px 39px 0;
			transform-origin: center top;
			animation: sceneOneManArm 10s ease infinite;
			transform: rotate(-34deg) translateY(0px) translateX(0px);

			&:before {
				content: '';
				position: absolute;
				top: 118px; left: 0px;
				width: 40px; height: 50px;
				background: #D7957C;
				border-radius: 0 0 0 20px;
			}
			&:after {
				content: '';
				position: absolute;
				top: 50px; left: -6px;
				width: 93px; height: 33px;
				background: #94959B;
				border-radius: 5px;
			}
		}
		&__forearm {
			position: absolute;
			top: 165px; left: -31px;
			width: 67px; height: 100px;
			background: #F6BE9C;
			border-radius: 36px 28px 60px 4px;
			z-index: 1;
			transform-origin: top center;
			animation: sceneOneManForearm 10s ease infinite;
			transform: rotate(-102deg);

			&:before {
				content: '';
				position: absolute;
				top: 79px; left: 44px;
				width: 30px; height: 54px;
				background: #F6BE9C;
				transform: rotate(-16deg);
				border-radius: 5px 30px 15px 10px;
				box-shadow: 0 14px 0 0 #D7957C;
			}
			&:after {
				content: '';
				position: absolute;
				top: 121px; left: 68px;
				width: 9px; height: 13px;
				background: #1C101C;
				border-radius: 100% 0;
			}

			div:nth-child(2) {
				position: absolute;
				top: 93px; left: 1px;
				width: 15px; height: 41px;
				background: #F6BE9C;
				transform: rotate(-17deg);
				border-radius: 12px 8px 8px 11px;
				box-shadow: 0 15px 0 0 #88594E;
			
				&:before {
					content: '';
					position: absolute;
					top: 0px; left: 8px;
					width: 20px; height: 57px;
					background: #F6BE9C;
					border-radius: 0 0 10px 10px;
					box-shadow: 0 15px 0 0 #AF736B;
				}
				&:after {
					content: '';
					position: absolute;
					top: 0px; left: 21px;
					width: 17px; height: 70px;
					background: #F6BE9C;
					border-radius: 0 0 0 13px;
					box-shadow: 0 15px 0 0 #D7957C;
				}
			}
			div:nth-child(1) {
				position: absolute;
				top: 80px; left: 45px;
				width: 20px; height: 95px;
				background: #F6BE9C;
				transform: rotate(-17deg);
				border-radius: 10px;
			
				&:before {
					content: '';
					position: absolute;
					top: 40px; left: 24px;
					width: 30px; height: 6px;
					background: #1C101C;
					transform: rotate(-37deg);
				}
				&:after {
					content: '';
					position: absolute;
					top: 82px; left: -31px;
					width: 17px;
					border-left: 11px solid transparent;
					border-top: 6px solid #1C101C;
					transform: rotate(-37deg);
				}
			}
		}
		&__leg {
			position: absolute;
			top: 298px; left: 5px;
			width: 222px; height: 88px;
			background: linear-gradient(to right, #36779D 56%, #D7957C 57%);
			border-radius: 0 69px 120px 131px / 0 75px 74px 140px;
		}
		&__knee {
			position: absolute;
			top: 15px; left: 189px;
			width: 47px; height: 194px;
			background: linear-gradient(#D7957C 38%, 
										#D7D7D6 39%, 
										#D7D7D6 55%, 
										white 56%);
			border-radius: 10px 40px 20px 30px;
			transform-origin: 50% 0;
			animation: sceneOneManKnee 10s ease infinite;
			transform: rotate(23deg);
		
			&:before {
				content: '';
				position: absolute;
				top: 75px; left: -27px;
				width: 28px; height: 64px;
				background: linear-gradient(#D7D7D6 50%, 
											white 51%);
				border-radius: 64% 0 0 100% / 50% 0 0 50%;
			}
			&:after {
				content: '';
				position: absolute;
				top: 75px; left: -10px;
				width: 13px; height: 33px;
				background: #A7AEAF;
				box-shadow: 30px 0 0 0 #A7AEAF;
			}
		}
		&__feet {
			position: absolute;
			top: 191px; left: 0px;
			width: 93px; height: 36px;
			background: #59BECF;
			border-radius: 4px 29px 0 0;
			transform-origin: 0 0;
			transform: rotate(-20deg);
			animation: sceneOneManFeet 10s ease infinite;
			
			&:before {
				content: '';
				position: absolute;
				top: 36px; left: -5px;
				width: 101px; height: 7px;
				background: #1C101C;
				border-radius: 2px;
			}
			&:after {
				content: '';
				position: absolute;
				top: -20px; left: 0px;
				width: 28px; height: 23px;
				background: #59BECF;
				border-radius: 0 17px 0 0;
			}

			div:nth-child(1) {
				position: absolute;
				top: -1px; left: -11px;
				width: 38px; height: 37px;
				background: #377CA6;
				z-index: 1;
				border-radius: 50% 50% 0 50%;
				
				&:before {
					content: '';
					position: absolute;
					top: 20px; left: 38px;
					width: 40px; height: 17px;
					background: #377CA6;
					border-radius: 0 15px 0 0;
				}
				&:after {
					content: '';
					position: absolute;
					top: -28px; left: 44px;
					width: 40px; height: 20px;
					background: #377CA6;
					border-radius: 30px 30px 0 0;
					transform: rotate(-56deg);
				}
			}
			div:nth-child(2) {
				position: absolute;
				top: -8px; left: 52px;
				width: 12px; height: 20px;
				background: #1C101C;
				z-index: 1;
				transform: rotate(-4deg);
				border-radius: 6px;
			}
		}
	}
	.animation_to_left {
		animation: sceneOneGoLeft 10s ease infinite;
	}
	.animation_to_right {
		animation: sceneOneGoRight 10s ease infinite;
	}
}
@keyframes sceneOneManEye {
	0% 	{ transform: scaleY(1); }
	5% 	{ transform: scaleY(.1); }
	10% { transform: scaleY(1); }
}
@keyframes sceneOneManBrow {
	2% 	{ transform: translateY(0px); }
	8% 	{ transform: translateY(7px); }
	14% { transform: translateY(0px); }
}
@keyframes sceneOneDogTail {
	0% 		{ transform: skewX(-22deg) rotate(-34deg); }
	50% 	{ transform: skewX(-22deg) rotate(16deg); }
	100%	{ transform: skewX(-22deg) rotate(-34deg); }
}
@keyframes sceneOneDogEye {
	60% { transform: scaleY(1); }
	65% { transform: scaleY(.1); }
	70% { transform: scaleY(1); }
}
@keyframes sceneOne {
	0% 		{ opacity: 1; z-index: 4; }
	10.1% 	{ opacity: 1; z-index: 4; }
	10.2% 	{ opacity: 0; z-index: 1; }
	37.8% 	{ opacity: 0; z-index: 2; }
	61.8% 	{ opacity: 0; z-index: 3; }
	80.3% 	{ opacity: 0; z-index: 3; }
	80.4% 	{ opacity: 1; z-index: 3; }
	88.8% 	{ opacity: 1; z-index: 4; }
	100% 	{ opacity: 1; z-index: 4; }
}
@keyframes sceneOneGoLeft {
	0% 		{ transform: translateX(0px); }
	3% 		{ transform: translateX(0px); }
	10.2% 	{ transform: translateX(-900px); }
	10.8% 	{ transform: translateX(0px); }
}
@keyframes sceneOneGoRight {
	0% 		{ transform: translateX(0px); }
	3% 		{ transform: translateX(0px); }
	10.2% 	{ transform: translateX(900px); }
	10.8% 	{ transform: translateX(0px); }
}
@keyframes sceneOneManFeet {
	0% 		{ transform: rotate(-20deg); }
	12% 	{ transform: rotate(-20deg); }
	87% 	{ transform: rotate(-17deg); }
	91.8% 	{ transform: rotate(-17deg); }
	100% 	{ transform: rotate(-20deg); }
}
@keyframes sceneOneManKnee {
	0% 		{ transform: rotate(23deg); }
	12% 	{ transform: rotate(23deg); }
	87% 	{ transform: rotate(17deg); }
	91.8% 	{ transform: rotate(13deg); }
	100% 	{ transform: rotate(23deg); }
}
@keyframes sceneOneManForearm {
	0% 		{ transform: rotate(-102deg); }
	12% 	{ transform: rotate(-102deg); }
	87% 	{ transform: rotate(-126deg); }
	91.8% 	{ transform: rotate(-126deg); }
	100% 	{ transform: rotate(-102deg); }
}
@keyframes sceneOneManArm {
	0% 		{ transform: rotate(-34deg) translateY(0px) 	translateX(0px); }
	12% 	{ transform: rotate(-34deg) translateY(0px) 	translateX(0px); }
	87% 	{ transform: rotate(-20deg) translateY(10px) 	translateX(52px); }
	91.8% 	{ transform: rotate(-19deg) translateY(12px) 	translateX(41px); }
	100% 	{ transform: rotate(-34deg) translateY(0px) 	translateX(0px); }
}
@keyframes sceneOneManBrow2 {
	0% 		{ transform: rotate(0deg) 	translate(0, 0); }
	12% 	{ transform: rotate(0deg) 	translate(0, 0); }
	87% 	{ transform: rotate(22deg) 	translate(5px, 9px); }
	91.8% 	{ transform: rotate(22deg) 	translate(4px, 6px); }
	100% 	{ transform: rotate(0deg) 	translate(0, 0); }
}
@keyframes sceneOneManEye2 {
	0% 		{ transform: scaleY(1); }
	12% 	{ transform: scaleY(1); }
	87% 	{ transform: scaleY(0.5); }
	91.8% 	{ transform: scaleY(0.5); }
	100% 	{ transform: scaleY(1); }
}
@keyframes sceneOneManMouth {
	0% 		{ transform: scaleY(1); }
	12% 	{ transform: scaleY(1); }
	87% 	{ transform: scaleY(0); }
	91.8% 	{ transform: scaleY(0); }
	100% 	{ transform: scaleY(1); }
}
@keyframes sceneOneManNeck {
	0% 		{ transform: rotate(34deg); }
	12% 	{ transform: rotate(34deg); }
	87% 	{ transform: rotate(14deg); }
	91.8% 	{ transform: rotate(34deg); }
	100% 	{ transform: rotate(34deg); }
}
@keyframes sceneOneManHead {
	0% 		{ transform: rotate(-10deg) translateY(0px) 	translateX(0px); }
	12% 	{ transform: rotate(-10deg) translateY(0px) 	translateX(0px); }
	87% 	{ transform: rotate(29deg) 	translateY(-50px) 	translateX(107px); }
	91.8% 	{ transform: rotate(-4deg) 	translateY(4px) 	translateX(53px); }
	100% 	{ transform: rotate(-10deg) translateY(0px) 	translateX(0px); }
}
@keyframes sceneOneManChest {
	0% {
		border-radius: 100% 44% 0 0 / 100% 70% 0 0;
		transform: scaleX(1);
	}
	12% {
		border-radius: 100% 44% 0 0 / 100% 70% 0 0;
		transform: scaleX(1);
	}
	87% {
		border-radius: 100% 44% 0 30px / 100% 70% 0 30px;
		transform: scaleX(1.5);
	}
	91.8% {
		border-radius: 100% 44% 0 30px / 100% 70% 0 30px;
		transform: scaleX(1.5);
	}
	100% {
		border-radius: 100% 44% 0 0 / 100% 70% 0 0;
		transform: scaleX(1);
	}
}
@keyframes sceneOneManBody {
	0% 		{ transform: rotate(10deg) translateY(0px); }
	12% 	{ transform: rotate(10deg) translateY(0px); }
	87% 	{ transform: rotate(10deg) translateY(21px); }
	91.8% 	{ transform: rotate(10deg) translateY(21px); }
	100% 	{ transform: rotate(10deg) translateY(0px); }
}
@keyframes sceneOneDogHead {
	0% 		{ transform: rotate(0deg); }
	12% 	{ transform: rotate(0deg); }
	87% 	{ transform: rotate(-21deg); }
	91.8% 	{ transform: rotate(-7deg); }
	100% 	{ transform: rotate(0deg); }
}

.scene-2 {
	position: absolute;
	top: 0px; left: 0px;
	width: 800px; height: 600px;
	animation: sceneTwo 10s linear infinite;

	.rock {
		position: absolute;
		top: 378px; left: 94px;
		width: 32px; height: 4px;
		background: #B4394A;
		animation: sceneTwoRock 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 4px; left: 6px;
			width: 26px; height: 15px;
			background: #B4394A;
		}
		div:nth-child(1) {
			position: absolute;
			top: 10px; left: 50px;
			width: 40px; height: 25px;
			background: #CE524A;
			border-radius: 0 22px 0 0;
			
			&:before {
				content: '';
				position: absolute;
				top: 0px; left: -102px;
				width: 21px;
				border-left: 73px solid transparent;
				border-bottom: 32px solid #ED7852;
				transform: skewX(-36deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 32px; left: -116px;
				width: 93px; height: 12px;
				background: #ED7852;
				transform: skewX(-29deg);
				box-shadow: 10px 0 0 0 #B4394A;
			}
		}
		div:nth-child(2) {
			position: absolute;
			top: 54px; left: -56px;
			width: 18px;
			border-left: 43px solid transparent;
			border-bottom: 14px solid #CE524A;

			&:before {
				content: '';
				position: absolute;
				top: 0px; left: -87px;
				width: 66px; height: 14px;
				background: #ED7852;
				transform: skewX(-72deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 14px; left: -93px;
				width: 108px; height: 16px;
				background: #ED7852;
				transform: skewX(-37deg);
				box-shadow: 17px 0 0 0 #B4394A;
			}
		}
		div:nth-child(3) {
			position: absolute;
			top: 54px; left: 5px;
			width: 20px;
			border-right: 8px solid transparent;
			border-top: 14px solid #B4394A;

			&:before {
				content: '';
				position: absolute;
				top: 16px; left: -110px;
				width: 72px; height: 18px;
				background: #ED7852;
				transform: skewX(-36deg);
				box-shadow: 21px 0 0 0 #B4394A;
			}
			&:after {
				content: '';
				position: absolute;
				top: 34px; left: -130px;
				width: 55px; height: 28px;
				background: #CE524A;
				transform: skewX(-39deg);
				box-shadow: 40px 0 0 0 #B4394A;
			}
		}
		div:nth-child(4) {
			position: absolute;
			top: 112px; left: -41px;
			width: 49px;
			border-left: 13px solid transparent;
			border-bottom: 18px solid #B4394A;

			&:before {
				content: '';
				position: absolute;
				top: 18px; left: -140px;
				width: 127px; height: 70px;
				background: #ED7852;
				transform: skewX(-35deg);
				box-shadow: 60px 0 0 0 #B4394A;
			}
			&:after {
				content: '';
				position: absolute;
				top: 17px; left: -36px;
				border-left: 48px solid transparent;
				border-right: 40px solid transparent;
				border-bottom: 71px solid #CE524A;
			}
		}
		div:nth-child(5) {
			position: absolute;
			top: 14px; left: 30px;
			border-left: 20px solid transparent;
			border-bottom: 28px solid #B4394A;
		
			&:before {
				content: '';
				position: absolute;
				top: 70px; left: -66px;
				width: 95px; height: 28px;
				background: #B4394A;
				transform: skewX(-37deg);
				box-shadow: 0 18px 0 0 #B4394A;
			}
			&:after {
				content: '';
				position: absolute;
				top: 85px; left: -27px;
				border-right: 22px solid transparent;
				border-bottom: 40px solid #CE524A;
			}
		}
		div:nth-child(6) {
			position: absolute;
			top: 34px; left: 13px;
			width: 16px;
			border-right: 34px solid transparent;
			border-left: 32px solid transparent;
			border-bottom: 50px solid #B4394A;
			border-radius: 0 0 7px 0;

			&:before {
				content: '';
				position: absolute;
				top: 49px; left: 22px;
				border-left: 23px solid transparent;
				border-right: 7px solid transparent;
				border-bottom: 30px solid #B4394A;
			}
			&:after {
				content: '';
				position: absolute;
				top: -4px; left: 10px;
				border-left: 21px solid transparent;
				border-right: 10px solid transparent;
				border-bottom: 29px solid #B4394A;
				transform: rotate(-70deg);
			}
		}
		div:nth-child(7) {
			position: absolute;
			top: 59px; left: -4px;
			border-right: 38px solid transparent;
			border-left: 38px solid transparent;
			border-bottom: 24px solid #CE524A;
			transform: rotate(-90deg);

			&:before {
				content: '';
				position: absolute;
				top: 34px; left: 2px;
				border-right: 11px solid transparent;
				border-left: 11px solid transparent;
				border-top: 11px solid #CE524A;
			}
			&:after {
				content: '';
				position: absolute;
				top: 41px; left: 39px;
				width: 9px; height: 8px;
				background: #B4394A;
				transform: skewX(-30deg) rotate(24deg);
			}
		}
	}
	.lighthouse {
		position: absolute;
		top: -40px; left: 32px;
		width: 14px; height: 50px;
		background: #CE524A;
		animation: sceneTwoLighthouse 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 4px; left: -2px;
			width: 18px; height: 10px;
			background: #F7BD64;
			border-top: 4px solid #CE524A;
			border-bottom: 4px solid #CE524A;
			box-shadow: 0 4px 0 0 rgba(0, 0, 0, .1), 
						inset 6px 0 0 0 #4A4263, 
						inset -8px 0 0 0 #4A4263, 
						inset 0 2px 0 0 #4A4263, 
						inset 0 -2px 0 0 #4A4263;
		}
		&:after {
			content: '';
			position: absolute;
			top: 12px; left: -56px;
			width: 7px;
			border-left: 50px solid transparent;
			border-right: 50px solid transparent;
			border-bottom: 150px solid #F7D67B;
			transform-origin: top center;
			transform: rotate(90deg) scaleX(1);
			animation: sceneTwoLighhouse 2s ease infinite;
		}
	}
	.girl {
		position: absolute;
		top: 60px; left: 236px;
		width: 394px; height: 500px;
		animation: sceneTwoStone 10s ease infinite;
		
		& > div:nth-child(1) {
			position: absolute;
			top: 170px; left: 112px;
			width: 150px; height: 90px;
			background: #101019;
			border-radius: 0 110px 4px 0;
			transform-origin: right top;
			animation: sceneTwoGirlHear1 10s ease infinite;
			transform: rotate(-40deg) translate(0, 0);

			&:before {
				content: '';
				position: absolute;
				top: -50px; left: -11px;
				width: 60px; height: 80px;
				background: #101019;
				transform: rotate(-19deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -37px; left: 0px;
				width: 60px; height: 80px;
				background: #101019;
				transform: rotate(-50deg);
			}
		}
		& > div:nth-child(2) {
			position: absolute;
			top: 180px; left: 17px;
			width: 90px; height: 120px;
			background: #101019;
			border-radius: 24px 10px 0 80px;
			animation: sceneTwoGirlHear2 10s ease infinite;
			transform: translate(0px, 0px) rotate(0deg);

			&:before {
				content: '';
				position: absolute;
				top: -126px; left: -18px;
				width: 130px; height: 153px;
				background: #101019;
				border-radius: 70px 0 0 60px;
				transform: translate(0px, 0px);
			}
			&:after {
				content: '';
				position: absolute;
				top: -175px; left: 37px;
				width: 100px; height: 100px;
				background: #101019;
				border-radius: 50%;
				box-shadow: 45px -14px 0 -10px #101019, 80px 7px 0 -23px #101019, 20px 37px 0 -13px #101019;
				transform: translate(0px, 0px) rotate(0deg);
			}
		}
		&__back-leg {
			position: absolute;
			top: 303px; left: 170px;
			width: 115px; height: 40px;
			background: #943139;
			border-radius: 0 14px 0 0;
			transform-origin: 0 0;
			transform: rotate(9deg);

			&:before {
				content: '';
				position: absolute;
				top: 36px; left: 2px;
				width: 100px; height: 27px;
				background: #943139;
				transform-origin: 0 0;
				transform: rotate(-13deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 21px; left: 83px;
				width: 33px; height: 160px;
				background: #943139;
				transform-origin: 0 0;
				transform: rotate(-30deg);
			}
		}
		&__foot {
			position: absolute;
			top: 137px; left: 166px;
			width: 66px; height: 53px;
			background: #943139;
			transform-origin: 0 0;
			transform: rotate(-21deg);

			&:before {
				content: '';
				position: absolute;
				top: -15px; left: 9px;
				width: 10px; height: 20px;
				background: #943139;
				transform: rotate(-20deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -1px; left: 10px;
				width: 30px; height: 10px;
				background: #943139;
				transform: rotate(20deg);
			}
		}
		&__foot-thumbs {
			position: absolute;
			top: 94px;left: 232px;
			width: 12px; height: 14px;
			background: #943139;
			border-radius: 2px 10px 10px 0;
			transform: rotate(10deg);

			&:before {
				content: '';
				position: absolute;
				top: 11px; left: -3px;
				width: 10px; height: 17px;
				background: #943139;
				transform: rotate(23deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 11px; left: 2px;
				width: 10px; height: 25px;
				background: #943139;
				border-radius: 0 90% 100% 0;
			}
		}
		&__paper {
			position: absolute;
			top: -44px;left: 84px;
			width: 60px; height: 72px;
			background: #E7CEB5;
			box-shadow: 8px -22px 0 -8px #E7CEB5;
			transform-origin: bottom left;
			transform: rotate(57deg) translate(0px, 0px);

			&:before {
				content: '';
				position: absolute;
				top: -14px; left: 0px;
				border-top: 14px solid transparent;
				border-right: 16px solid #DAAA8A;
			}
			&:after {
				content: '';
				position: absolute;
				top: 37px; left: 12px;
				width: 40px; height: 5px;
				background: #D09B88;
				border-radius: 2px;
			}
		}
		&__back-arm {
			position: absolute;
			top: 248px; left: 130px;
			width: 109px; height: 22px;
			background: #943139;
			border-radius: 0 10px 20px 0;
			transform-origin: 0 0;
			animation: sceneTwoGirlBackArm 10s ease infinite;
			transform: rotate(-30deg) translate(0px, 0px);

			&:before {
				content: '';
				position: absolute;
				top: -11px; left: 15px;
				width: 90px; height: 15px;
				background: #943139;
				transform-origin: 0 0;
				transform: rotate(7deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 0px; left: 104px;
				width: 24px; height: 9px;
				background: #943139;
				border-radius: 0 2px 10px 0;
				transform-origin: 0 0;
				transform: rotate(16deg);
			}
		}
		&__chest {
			position: absolute;
			top: 121px; left: 93px;
			width: 50px; height: 83px;
			background: #5A8C8C;
			border-radius: 49px 0 0 0;
			transform-origin: left bottom;
			animation: sceneTwoGirlChest 10s ease infinite;
			transform: rotate(-12deg);

			&:after {
				content: '';
				position: absolute;
				top: 9px; left: 0px;
				width: 83px; height: 92px;
				background: #5A8C8C;
				border-radius: 35px 59px 0 0;
				transform-origin: right bottom;
				transform: rotate(13deg);
			}
			&:before {
				content: '';
				position: absolute;
				top: 79px; left: 0px;
				width: 65px; height: 27px;
				background: #9C2141;
				transform-origin: 0 0;
				animation: sceneTwoGirlStomack 10s ease infinite;
				transform: rotate(16deg);
			}
		}
		&__back-shorts {
			position: absolute;
			top: 290px; left: 110px;
			width: 67px; height: 75px;
			box-sizing: border-box;
			background: #27445A;
			border-right: 25px solid #798C8D;

			&:before {
				content: '';
				position: absolute;
				top: -72px; left: -18px;
				width: 60px; height: 55px;
				background: #BD4242;
				transform-origin: 0 0;
				transform: rotate(26deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -72px; left: -18px;
				width: 64px; height: 60px;
				background: #BD4242;
				transform-origin: 0 0;
				transform: rotate(13deg);
			}
		}
		&__front-leg {
			position: absolute;
			top: 270px; left: 137px;
			width: 110px; height: 61px;
			background: #BD4242;
			border-radius: 0 44% 23px 0;
			transform-origin: 0 0;
			transform: rotate(-28deg);

			&:before {
				content: '';
				position: absolute;
				top: 31px; left: 0px;
				width: 90px; height: 40px;
				background: #BD4242;
				border-radius: 0 0 94% 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 20px; left: 72px;
				width: 20px; height: 140px;
				background: #BD4242;
				transform-origin: 0 0;
				transform: rotate(12deg);
			}
		}
		&__knee {
			position: absolute;
			top: 41px;left: 89px;
			width: 20px; height: 160px;
			background: #BD4242;
			transform-origin: 0 0;
			transform: rotate(17deg);

			&:before {
				content: '';
				position: absolute;
				top: 96px; left: -30px;
				width: 30px; height: 50px;
				background: #BD4242;
				border-radius: 20px 0 0 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 14px; left: -191px;
				width: 70px; height: 76px;
				background: #354E6F;
				border-radius: 22px 0 0 50px;
				transform-origin: 0 0;
				transform: rotate(-15deg);
			}
		}
		&__shorts {
			position: absolute;
			top: 267px; left: 67px;
			width: 60px; height: 80px;
			background: #354E6F;
			border-radius: 0 0 0 56px;
			transform-origin: 0 0;
			transform: rotate(22deg);

			&:before {
				content: '';
				position: absolute;
				top: -27px; left: 62px;
				width: 83px; height: 32px;
				background: #9CB5BD;
				transform-origin: 0 0;
				transform: rotate(40deg);
			}
		}
		&__front-arm {
			position: absolute;
			top: 103px; left: 124px;
			width: 135px; height: 23px;
			background: #BD4242;
			border-radius: 20px 11px 2px 0;
			transform-origin: 0 0;
			animation: sceneTwoGirlFromArm 10s ease infinite;
			transform: rotate(27deg) translate(0px, 0px);

			&:before {
				content: '';
				position: absolute;
				top: 22px; left: 0px;
				width: 135px; height: 25px;
				background: #BD4242;
				border-radius: 0 0 18px 23px;
				transform-origin: 0 0;
				transform: rotate(-6deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 30px; left: 128px;
				width: 20px; height: 134px;
				background: #BD4242;
				border-radius: 6px 0 0 20px;
				transform-origin: 0 0;
				animation: sceneTwoGirlTriceps 10s ease infinite;
				transform: rotate(198deg);
			}
		}
		&__forearm {
			position: absolute;
			top: 13px;left: 99px;
			width: 100px; height: 13px;
			background: #BD4242;
			transform-origin: 0 0;
			animation: sceneTwoGirlForearm 10s ease infinite;
			transform: rotate(-67deg);

			&:before {
				content: '';
				position: absolute;
				top: -4px; left: 98px;
				width: 35px; height: 10px;
				background: #BD4242;
				border-radius: 4px;
				transform-origin: 0 0;
				transform: rotate(-29deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -10px; left: 100px;
				width: 23px; height: 16px;
				background: #BD4242;
			}
		}
		&__palm {
			position: absolute;
			top: -18px;left: 104px;
			width: 10px; height: 26px;
			background: #BD4242;
			border-radius: 6px 0 0 0;
			transform-origin: 0 0;
			transform: rotate(26deg);

			&:before {
				content: '';
				position: absolute;
				top: -9px; left: 2px;
				width: 10px; height: 17px;
				background: #BD4242;
				border-radius: 0 8px 0 3px;
				transform: rotate(20deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -24px; left: 9px;
				width: 6px; height: 21px;
				background: #101019;
				border-radius: 0 0 10px 0;
				transform: rotate(-16deg);
			}
		}
		&__face {
			position: absolute;
			top: -48px; left: 73px;
			width: 42px; height: 40px;
			background: #BD4242;
			border-radius: 50%;
			transform-origin: 0 0;
			animation: sceneTwoGirlFace 10s ease infinite;
			transform: rotate(0deg) translate(0px, 0px);

			&:before {
				content: '';
				position: absolute;
				top: 32px; left: 0px;
				width: 35px; height: 50px;
				background: #BD4242;
				border-radius: 0 0 4px 0;
				transform-origin: top right;
				transform: rotate(25deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 16px; left: -36px;
				width: 40px; height: 40px;
				background: #101019;
				border-radius: 50%;
			}
		}
		&__nose {
			position: absolute;
			top: 33px; left: 18px;
			width: 16px; height: 28px;
			background: #BD4242;
			border-radius: 0 0 8px 0;
			transform: rotate(-9deg) translate(0, 0);

			&:before {
				content: '';
				position: absolute;
				top: -13px; left: -2px;
				width: 23px; height: 10px;
				background: #101019;
				border-radius: 20px;
				animation: sceneTwoGirlBrow 10s ease infinite;
				transform: rotate(51deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 1px; left: -7px;
				width: 17px; height: 5px;
				background: #101019;
				border-radius: 4px;
				animation: sceneTwoGirlEye 10s ease infinite;
				transform: rotate(47deg);
			}
		}
	}
	.stone {
		position: absolute;
		top: 422px; left: 203px;
		width: 350px; height: 138px;
		border-radius: 110px 180px 0 0 / 82px 130px 0 0;
		background: linear-gradient(-50deg, #4A4263 45%, 
											#413452 46%, 
											#413452 62%, 
											#352C49 63%);
		animation: sceneTwoStone 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 66px; left: -90px;
			width: 97px; height: 76px;
			background: #352C49;
			border-radius: 48px 0 0 0;
		}
		&:after {
			content: '';
			position: absolute;
			top: 96px; left: -141px;
			width: 106px; height: 46px;
			background: #352C49;
			border-radius: 50px 50px 0 0;
			box-shadow: 524px 6px 0 0 #352C49;
		}
	}
	.basket {
		position: absolute;
		top: 516px; left: 248px;
		width: 50px; height: 50px;
		box-sizing: border-box;
		background: #413452;
		border-radius: 50%;
		box-shadow: inset 0 0 0 12px #CA415A, 
					inset 0 0 0 18px #EECD19;
		animation: sceneTwoStone 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 1px; left: -105px;
			width: 61px; height: 12px;
			background: #D69338;
			transform: rotate(-44deg);
			box-shadow: 0px 3px 0 0 #677321, 
						3px 15px 0 0 #B4394A, 
						3px 20px 0 0 #7B3231, 
						-7px 32px 0 0 #D69338;
		}
		&:after {
			content: '';
			position: absolute;
			top: -7px; left: -26px;
			width: 15px; height: 43px;
			background: #C47533;
			border-radius: 8px;
		}

		div:nth-child(1) {
			position: absolute;
			top: 16px; left: -53px;
			width: 60px; height: 8px;
			background: #8C9421;
			border-radius: 10px 10px 0 0;

			&:before {
				content: '';
				position: absolute;
				top: 8px; left: -33px;
				width: 136px; height: 30px;
				background: #C47533;
				border-top: 6px solid #E7AD39;
				z-index: 1;
			}
			&:after {
				content: '';
				position: absolute;
				top: 22px; left: -33px;
				width: 21px; height: 17px;
				background: #7B3231;
				z-index: 1;
				border-radius: 0 15px 0 0;
			}
		}
		div:nth-child(2) {
			position: absolute;
			top: 30px; left: -44px;
			width: 52px; height: 24px;
			box-sizing: border-box;
			background: #E7AD39;
			z-index: 1;
			border-radius: 0 0 25px 25px;
			border-left: 8px solid #7B3231;
			border-bottom: 8px solid #7B3231;
			border-right: 8px solid #7B3231;

			&:before {
				content: '';
				position: absolute;
				top: -14px; left: 6px;
				width: 14px; height: 20px;
				background: #C47533;
				border-radius: 0 0 12px 12px;
				border: 5px solid #101019;
				border-top: 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 20px; left: -50px;
				width: 48px; height: 10px;
				background: #7B3231;
				border-radius: 0 10px 0 0;
			}
		}
	}
	.sand {
		position: absolute;
		bottom: 0px; left: 0px;
		width: 500px; height: 40px;
		background: #677321;
		animation: sceneTwoStone 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			bottom: 0px; left: 0px;
			width: 810px; height: 18px;
			background: #E7AD39;
		}
		&:after {
			content: '';
			position: absolute;
			top: 14px; left: 135px;
			width: 190px; height: 8px;
			background: #E7AD39;
			border-radius: 10px 0 0 0;
		}

		div {
			position: absolute;
			top: 8px; left: 240px;
			width: 117px; height: 14px;
			background: #E7AD39;
			border-radius: 0 15px 0 0;

			&:before {
				content: '';
				position: absolute;
				top: -15px; left: 0px;
				width: 71px; height: 15px;
				background: #E7AD39;
				border-radius: 0 20px 0 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 0px; left: -10px;
				width: 75px; height: 10px;
				background: #E7AD39;
				z-index: 1;
				border-radius: 10px 0 0 0;
			}
		}
	}
	.crab {
		position: absolute;
		bottom: 25px; left: 28px;
		width: 60px; height: 30px;
		animation: sceneTwoCrab 10s linear infinite,
				   sceneTwoStone 10s ease infinite;
		transform: translateX(0px);

		div:nth-child(1) {
			content: '';
			position: absolute;
			bottom: 0; left: 0;
			width: 60px; height: 30px;
			background: linear-gradient(#9C2141 49%, #E7CEB5 50%);
			border-radius: 10px;
			animation: sceneTwoCrabBody 10s linear infinite;
			transform: rotate(0deg) translate(0px, 0px);

			&:before {
				content: '';
				position: absolute;
				top: -7px; left: 14px;
				width: 8px; height: 9px;
				background: white;
				border-radius: 2px;
				box-shadow: 24px 0 0 0 white;
			}
		}
		div:nth-child(2) {
			position: absolute;
			top: -29px; left: -32px;
			width: 15px; height: 44px;
			background: #9C2141;
			border-radius: 10px 0 0 10px;
			animation: sceneTwoCrabLeftArm 10s linear infinite;

			&:before {
				content: '';
				position: absolute;
				top: 6px; left: 15px;
				width: 13px; height: 18px;
				background: #641939;
				border-radius: 0 15px 0 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 24px; left: 15px;
				width: 13px; height: 20px;
				background: #9C2141;
				border-radius: 0 0 10px 0;
			}
		}
		div:nth-child(3) {
			position: absolute;
			top: -35px; left: 79px;
			width: 15px; height: 44px;
			background: #9C2141;
			border-radius: 0 10px 10px 0;
			animation: sceneTwoCrabRightArm 10s linear infinite;
			transform: rotate(0deg) translate(0px, 0px);

			&:before {
				content: '';
				position: absolute;
				top: 6px; left: -13px;
				width: 13px; height: 18px;
				background: #641939;
				border-radius: 15px 0 0 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 24px; left: -13px;
				width: 13px; height: 20px;
				background: #9C2141;
				border-radius: 0 0 0 10px;
			}
		}
		div:nth-child(4) {
			position: absolute;
			top: 21px; left: -18px;
			width: 17px; height: 16px;
			background: #641939;
			border-radius: 0 0 100% 0;
			animation: sceneTwoCrabLeg1 10s linear infinite;
			transform: rotate(-20deg) translate(0px, 0px);
		}
		div:nth-child(5) {
			position: absolute;
			top: 21px; left: 2px;
			width: 14px; height: 16px;
			background: #9C2141;
			border-radius: 0 0 100% 0;
			animation: sceneTwoCrabLeg2 10s linear infinite;
			transform: rotate(0deg) translate(0px, 0px);
		}
		div:nth-child(6) {
			position: absolute;
			top: 21px; left: 46px;
			width: 16px; height: 16px;
			background: #9C2141;
			border-radius: 0 0 0 100%;
			animation: sceneTwoCrabLeg3 10s linear infinite;
			transform: rotate(0deg) translate(0px, 0px);
		}
		div:nth-child(7) {
			position: absolute;
			top: 21px; left: 64px;
			width: 16px; height: 16px;
			background: #641939;
			border-radius: 0 0 0 100%;
			animation: sceneTwoCrabLeg4 10s linear infinite;
			transform: rotate(0deg) translate(0px, 0px);
		}
	}
	.bg-1 {
		position: absolute;
		top: 0px; left: 0px;
		width: 800px; height: 300px;
		background: #9C3163;
		border-radius: 0 0 90px 90px;
		animation: sceneTwoBg1 10s ease infinite;
	}
	.bg-2 {
		position: absolute;
		top: -30px; left: -47px;
		width: 220px; height: 220px;
		background: #CA415A;
		border-radius: 50%;
		animation: sceneTwoBg2 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 33px; left: 144px;
			width: 200px; height: 200px;
			background: #CA415A;
			border-radius: 50%;
		}
	}
	.bg-3 {
		position: absolute;
		top: -41px; right: -44px;
		width: 200px; height: 200px;
		background: #CA415A;
		border-radius: 50%;
		animation: sceneTwoBg3 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 68px; left: -230px;
			width: 200px; height: 200px;
			background: #CA415A;
			border-radius: 50%;
		}
		&:after {
			content: '';
			position: absolute;
			top: 93px; left: -117px;
			width: 110px; height: 110px;
			background: #CA415A;
			border-radius: 50%;
			box-shadow: 100px -7px 0 10px #CA415A;
		}
	}
	.bg-4 {
		position: absolute;
		top: 36px; left: -127px;
		width: 220px; height: 220px;
		background: #ED7852;
		border-radius: 50%;
		box-shadow: 442px 10px 0 0 #ED7852, 
					782px -21px 0 0 #ED7852, 
					302px 69px 0 0 #ED7852, 
					112px 140px 0 0 #ED7852, 
					262px 150px 0 0 #ED7852, 
					542px 110px 0 0 #ED7852, 
					772px 70px 0 0 #ED7852;
		animation: sceneTwoBg4 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 58px; left: 156px;
			width: 140px; height: 140px;
			background: #ED7852;
			border-radius: 50%;
			box-shadow: 509px 15px 0 0 #ED7852;
		}
		&:after {
			content: '';
			position: absolute;
			top: 110px; left: 260px;
			width: 80px; height: 80px;
			background: #ED7852;
			border-radius: 50%;
			box-shadow: 378px -16px 0 0 #ED7852, 
						488px -35px 0 0 #ED7852;
		}
	}
	.bg-5 {
		position: absolute;
		top: 199px; left: -140px;
		width: 220px; height: 220px;
		background: #FC9250;
		border-radius: 50%;
		box-shadow: 500px 20px 0 0 #FC9250, 
					635px -15px 0 0 #FC9250, 
					805px 135px 0 0 #FC9250, 
					605px 75px 0 0 #FC9250, 
					335px 125px 0 0 #FC9250, 
					105px 125px 0 0 #FC9250;
		animation: sceneTwoBg5 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 110px; left: 340px;
			width: 100px; height: 40px;
			background: #FC9250;
			border-radius: 50%;
			box-shadow: 538px 6px 0 0 #FC9250;
		}
		&:after {
			content: '';
			position: absolute;
			top: 112px; left: 222px;
			width: 170px; height: 170px;
			background: #FC9250;
			border-radius: 50%;
			box-shadow: 510px -70px 0 0 #FC9250;
		}
	}
	.bg-6 {
		position: absolute;
		bottom: 0px; left: 559px;
		width: 260px; height: 260px;
		background: #F7BD64;
		border-radius: 50%;
		box-shadow: -751px 8px 0 0 #F7BD64, 
					-204px 38px 0 0 #F7BD64;
		animation: sceneTwoBg6 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 50px; left: -385px;
			width: 150px; height: 150px;
			background: #F7BD64;
			border-radius: 50%;
			box-shadow: 84px 20px 0 0 #F7BD64, 
						-186px 10px 0 0 #F7BD64, 
						-86px 30px 0 0 #F7BD64;
		}
	}
	.water {
		position: absolute;
		bottom: 18px; right: 0px;
		width: 470px; height: 21px;
		background: white;
		z-index: 1;
		animation: sceneTwoWater 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: -11px; left: -45px;
			width: 55px; height: 32px;
			background: white;
			border-radius: 30px 30px 0 0;
		}
		&:after {
			content: '';
			position: absolute;
			top: 9px; left: -60px;
			width: 20px; height: 12px;
			background: white;
			border-radius: 14px 0 0 0;
		}
		div:nth-child(1) {
			position: absolute;
			top: -12px; left: 102px;
			width: 230px; height: 12px;
			background: white;
			border-radius: 20px 0 0 0;
			box-shadow: 183px -9px 0 0 white;

			&:before {
				content: '';
				position: absolute;
				top: -31px; left: 43px;
				width: 102px; height: 45px;
				background: white;
				border-radius: 120px 120px 0 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: -15px; left: 210px;
				width: 79px; height: 10px;
				background: white;
				border-radius: 10px 10px 0 0;
			}
		}
		div:nth-child(2) {
			position: absolute;
			top: -40px; left: 320px;
			width: 39px; height: 22px;
			background: white;
			border-radius: 50px 50px 0 0;

			&:before {
				content: '';
				position: absolute;
				top: -7px; left: -74px;
				width: 12px; height: 12px;
				background: white;
				border-radius: 50%;
				box-shadow: 93px 0 0 0 white;
			}
			&:after {
				content: '';
				position: absolute;
				top: -37px; left: -74px;
				width: 5px; height: 5px;
				background: white;
				border-radius: 50%;
				box-shadow: 18px 15px 0 0 white, 124px 13px 0 0 white;
			}
		}
		div:nth-child(4) {
			position: absolute;
			top: 7px; left: 66px;
			width: 408px; height: 6px;
			background: #0297DA;
			border-radius: 0 0 0 10px;

			&:before {
				content: '';
				position: absolute;
				top: 6px; left: 0px;
				width: 86px; height: 8px;
				background: white;
				border-radius: 0 10px 0 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 4px; left: 215px;
				width: 210px; height: 10px;
				background: white;
				border-radius: 10px 0 0 0;
			}
		}
		div:nth-child(3) {
			position: absolute;
			top: 0px; left: 131px;
			width: 360px; height: 10px;
			background: #0297DA;
			border-radius: 10px 0 0 0;

			&:before {
				content: '';
				position: absolute;
				top: 0px; left: 272px;
				width: 80px; height: 11px;
				background: white;
				border-radius: 11px 0 0 0;
				z-index: 1;
			}
			&:after {
				content: '';
				position: absolute;
				top: -11px; left: 195px;
				width: 150px; height: 11px;
				background: #0297DA;
				border-radius: 11px 0 0;
			}
		}
	}
}
@keyframes sceneTwoCrab {
	0% 		{ transform: translateX(0px); }
	15% 	{ transform: translateX(0px); }
	16.2% 	{ transform: translateX(4px); }
	19.8% 	{ transform: translateX(11px); }
	100% 	{ transform: translateX(11px); }
}
@keyframes sceneTwoCrabBody {
	0% 		{ transform: rotate(0deg) 	translate(0px, 0px); }
	12.6% 	{ transform: rotate(-2deg) 	translate(0px, 0px); }
	13.2% 	{ transform: rotate(-3deg) 	translate(0px, 0px); }
	15% 	{ transform: rotate(1deg) 	translate(5px, -2px); }
	19.8% 	{ transform: rotate(3deg) 	translate(5px, -2px); }
	24% 	{ transform: rotate(3deg) 	translate(5px, -6px); }
	27% 	{ transform: rotate(6deg) 	translate(12px, -13px); }
	30% 	{ transform: rotate(-8deg) 	translate(-6px, -15px); }
	100% 	{ transform: rotate(-8deg) 	translate(-6px, -15px); }
}
@keyframes sceneTwoCrabLeftArm {
	13.2% 	{ transform: rotate(0deg) 	translate(0px, 0px); }
	15% 	{ transform: rotate(0deg) 	translate(4px, -1px); }
	16.2% 	{ transform: rotate(0deg) 	translate(5px, -6px); }
	19.8% 	{ transform: rotate(6deg) 	translate(9px, -20px); }
	24% 	{ transform: rotate(21deg) 	translate(10px, -28px); }
	27% 	{ transform: rotate(21deg) 	translate(17px, -34px); }
	30% 	{ transform: rotate(-19deg) translate(-13px, -6px); }
	100% 	{ transform: rotate(-19deg) translate(-13px, -6px); }
}
@keyframes sceneTwoCrabRightArm {
	0% 		{ transform: rotate(0deg) 	translate(0px, 0px); }
	12.6% 	{ transform: rotate(0deg) 	translate(0px, 0px); }
	13.2% 	{ transform: rotate(-5deg) 	translate(-3px, -3px); }
	15% 	{ transform: rotate(1deg) 	translate(4px, -1px); }
	16.2% 	{ transform: rotate(15deg) 	translate(10px, 4px); }
	19.8% 	{ transform: rotate(58deg) 	translate(33px, -1px); }
	24% 	{ transform: rotate(58deg) 	translate(27px, -1px); }
	27% 	{ transform: rotate(58deg) 	translate(27px, -15px); }
	30% 	{ transform: rotate(-26deg) translate(-15px, -40px); }
	100% 	{ transform: rotate(-26deg) translate(-15px, -40px); }
}
@keyframes sceneTwoCrabLeg1 {
	0% 		{ transform: rotate(-20deg) translate(0px, 0px); }
	15% 	{ transform: rotate(-20deg) translate(0px, 0px); }
	16.2% 	{ transform: rotate(-20deg) translate(3px, -6px); }
	19.8% 	{ transform: rotate(0deg) 	translate(5px, 0px); }
	100% 	{ transform: rotate(0deg) 	translate(5px, 0px); }
}
@keyframes sceneTwoCrabLeg2 {
	0% 		{ transform: rotate(0deg) 	translate(0px, 0px); }
	12.6% 	{ transform: rotate(0deg) 	translate(0px, 0px); }
	13.2% 	{ transform: rotate(-6deg) 	translate(1px, -4px); }
	15% 	{ transform: rotate(-6deg) 	translate(12px, 0px); }
	16.2% 	{ transform: rotate(1deg) 	translate(9px, 0px); }
	19.8% 	{ transform: rotate(1deg) 	translate(4px, 0px); }
	100% 	{ transform: rotate(1deg) 	translate(4px, 0px); }
}
@keyframes sceneTwoCrabLeg3 {
	0% 		{ transform: rotate(0deg) 	translate(0px, 0px); }
	12.6% 	{ transform: rotate(0deg) 	translate(0px, 0px); }
	13.2% 	{ transform: rotate(-12deg) translate(3px, -4px); }
	15% 	{ transform: rotate(5deg) 	translate(10px, -2px); }
	16.2% 	{ transform: rotate(2deg) 	translate(10px, 0px); }
	19.8% 	{ transform: rotate(2deg) 	translate(4px, 0px); }
	100% 	{ transform: rotate(2deg) 	translate(4px, 0px); }
}
@keyframes sceneTwoCrabLeg4 {
	0% 		{ transform: rotate(0deg) 	translate(0px, 0px); }
	15% 	{ transform: rotate(0deg) 	translate(0px, 0px); }
	16.2% 	{ transform: rotate(-30deg) translate(4px, -5px); }
	19.8% 	{ transform: rotate(0deg) 	translate(5px, 0px); }
	100% 	{ transform: rotate(0deg) 	translate(5px, 0px); }
}
@keyframes sceneTwoLighhouse {
	0% 		{ transform: rotate(90deg) scaleX(1); }
	50% 	{ transform: rotate(90deg) scaleX(2); }
	100% 	{ transform: rotate(90deg) scaleX(1); }
}
@keyframes sceneTwoGirlHear1 {
	0% 		{ transform: rotate(-40deg) translate(0, 0); }
	10.8% 	{ transform: rotate(-40deg) translate(0, 0); }
	16.2% 	{ transform: rotate(-40deg) translate(25px, 7px); }
	21% 	{ transform: rotate(-40deg) translate(-13px, -33px); }
	100% 	{ transform: rotate(-40deg) translate(-13px, -33px); }
}
@keyframes sceneTwoGirlHear2 {
	0% 		{ transform: translate(0px, 0px) 	rotate(0deg); }
	10.8% 	{ transform: translate(0px, 0px) 	rotate(0deg); }
	16.2% 	{ transform: translate(18px, 9px) 	rotate(-15deg); }
	21% 	{ transform: translate(7px, 9px) 	rotate(-20deg); }
	100% 	{ transform: translate(7px, 9px) 	rotate(-20deg); }
}
@keyframes sceneTwoGirlBackArm {
	0% 		{ transform: rotate(-30deg) translate(0px, 0px); }
	10.8% 	{ transform: rotate(-30deg) translate(0px, 0px); }
	16.2% 	{ transform: rotate(-37deg) translate(-19px, 0px); }
	21% 	{ transform: rotate(-33deg) translate(-32px, -16px); }
	100% 	{ transform: rotate(-33deg) translate(-32px, -16px); }
}
@keyframes sceneTwoGirlChest {
	0% 		{ transform: rotate(-12deg) translate(0px, 0px); }
	10.8% 	{ transform: rotate(-12deg) translate(0px, 0px); }
	16.2% 	{ transform: rotate(-12deg) translate(0px, 0px); }
	21% 	{transform: rotate(-32deg) 	translate(-3px, 0px); }
	100% 	{transform: rotate(-32deg) 	translate(-3px, 0px); }
}
@keyframes sceneTwoGirlStomack {
	0% 		{ transform: rotate(16deg) scaleY(1) 	scaleX(1) 		translate(0px, 0px); }
	10.8% 	{ transform: rotate(16deg) scaleY(1) 	scaleX(1) 		translate(0px, 0px); }
	16.2% 	{ transform: rotate(16deg) scaleY(1) 	scaleX(1) 		translate(0px, 0px); }
	21% 	{ transform: rotate(26deg) scaleY(2.2) 	scaleX(0.94) 	translate(2px, -10px); }
	100% 	{ transform: rotate(26deg) scaleY(2.2) 	scaleX(0.94) 	translate(2px, -10px); }
}
@keyframes sceneTwoGirlFromArm {
	0% 		{ transform: rotate(27deg) translate(0px, 0px); }
	10.8% 	{ transform: rotate(27deg) translate(0px, 0px); }
	16.2% 	{ transform: rotate(25deg) translate(-8px, 2px); }
	21% 	{ transform: rotate(-3deg) translate(-48px, 0px); }
	100% 	{ transform: rotate(-3deg) translate(-48px, 0px); }
}
@keyframes sceneTwoGirlTriceps {
	0% 		{ transform: rotate(198deg) translate(0px, 0px); }
	10.8% 	{ transform: rotate(198deg) translate(0px, 0px); }
	16.2% 	{ transform: rotate(200deg) translate(0px, 0px); }
	21% 	{ transform: rotate(264deg) translate(0px, -20px); }
	100% 	{ transform: rotate(264deg) translate(0px, -20px); }
}
@keyframes sceneTwoGirlForearm {
	0% 		{ transform: rotate(-67deg) translate(0px, 0px); }
	10.8% 	{ transform: rotate(-67deg) translate(0px, 0px); }
	16.2% 	{ transform: rotate(-62deg) translate(0px, 0px); }
	21% 	{ transform: rotate(-2deg) 	translate(18px, -12px); }
	100% 	{ transform: rotate(-2deg) 	translate(18px, -12px); }
}
@keyframes sceneTwoGirlFace {
	0% 		{ transform: rotate(0deg) 	translate(0px, 0px); }
	10.8% 	{ transform: rotate(0deg) 	translate(0px, 0px); }
	16.2% 	{ transform: rotate(-16deg) translate(-26px, -16px); }
	21% 	{ transform: rotate(-1deg) 	translate(-6px, -2px); }
}
@keyframes sceneTwoGirlBrow {
	0% 		{ transform: rotate(51deg); }
	10.8% 	{ transform: rotate(51deg); }
	16.2% 	{ transform: rotate(43deg); }
	100% 	{ transform: rotate(43deg); }
}
@keyframes sceneTwoGirlEye {
	0% 		{ transform: rotate(47deg); }
	10.8% 	{ transform: rotate(47deg); }
	16.2% 	{ transform: rotate(36deg); }
	100% 	{ transform: rotate(36deg); }
}
@keyframes sceneTwo {
	0% 		{ opacity: 0; z-index: 3; }
	3.5% 	{ opacity: 0; z-index: 3; }
	3.6% 	{ opacity: 1; z-index: 3; }
	10.2% 	{ opacity: 1; z-index: 4; }
	37.7% 	{ opacity: 1; z-index: 4; }
	37.8% 	{ opacity: 0; z-index: 1; }
	61.8% 	{ opacity: 0; z-index: 2; }
	88.8% 	{ opacity: 0; z-index: 3; }
	100% 	{ opacity: 0; z-index: 3; }
}
@keyframes sceneTwoBg1 {
	0% 		{ transform: translateY(0px); }
	30.6% 	{ transform: translateY(0px); }
	34.8% 	{ transform: translateY(600px); }
	100% 	{ transform: translateY(600px); }
}
@keyframes sceneTwoBg2 {
	0% 		{ transform: translate(0px, 0px); }
	31.2% 	{ transform: translate(0px, 0px); }
	34.2% 	{ transform: translate(-400px, -10px); }
	100% 	{ transform: translate(-400px, -10px); }
}
@keyframes sceneTwoBg3 {
	0% 		{ transform: translate(0px, 0px); }
	31.2% 	{ transform: translate(0px, 0px); }
	34.2% 	{ transform: translate(-870px, 30px); }
	100% 	{ transform: translate(-870px, 30px); }
}
@keyframes sceneTwoBg4 {
	0% 		{ transform: translate(0px, 0px); }
	31.8% 	{ transform: translate(0px, 0px); }
	35.4% 	{ transform: translate(930px, 10px); }
	100% 	{ transform: translate(930px, 10px); }
}
@keyframes sceneTwoBg5 {
	0% 		{ transform: translate(0px, 0px); }
	32.4% 	{ transform: translate(0px, 0px); }
	36.6% 	{ transform: translate(-940px, 10px); }
	100% 	{ transform: translate(-940px, 10px); }
}
@keyframes sceneTwoBg6 {
	0% 		{ transform: translate(0px, 0px); }
	32.4% 	{ transform: translate(0px, 0px); }
	36.6% 	{ transform: translate(1000px, 10px); }
	100% 	{ transform: translate(1000px, 10px); }
}
@keyframes sceneTwoRock {
	0% 		{ transform: translate(0px, 0px); }
	31.8% 	{ transform: translate(0px, 0px); }
	35.4% 	{ transform: translate(-193px, 0px); }
	100% 	{ transform: translate(-193px, 0px); }
}
@keyframes sceneTwoStone {
	0% 		{ transform: translate(0px, 0px); }
	33.6% 	{ transform: translate(0px, 0px); }
	37.8% 	{ transform: translate(-750px, 0px); }
	100% 	{ transform: translate(-750px, 0px); }
}
@keyframes sceneTwoWater {
	0% 		{ transform: translate(160px, 0px); }
	7.8% 	{ transform: translate(160px, 0px); }
	19.2% 	{ transform: translate(0px, 0px); }
	21% 	{ transform: translate(0px, 0px); }
	33.6% 	{ transform: translate(160px, 0px); }
	37.8% 	{ transform: translate(480px, 0px); }
	100% 	{ transform: translate(480px, 0px); }
}

.scene-3 {
	position: absolute;
	top: 0px; left: 0px;
	width: 800px; height: 600px;
	animation: sceneThree 10s linear infinite;

	.road {
		position: absolute;
		top: 0px; left: 0px;
		animation: sceneThreeRoad 10s ease infinite;
	}
	.car {
		position: absolute;
		top: 0px; left: 0px;
		animation: sceneThreeCar 1s ease infinite;
		animation-delay: .1s;

		& > div:nth-child(1) {
			position: absolute;
			top: 102px; left: 318px;
			width: 279px; height: 166px;
			background: #424A6B;
			border-radius: 0 20px 0 0;
			box-shadow: inset 0 7px 0 0 #526B94;

			&:before {
				content: '';
				position: absolute;
				top: -10px; left: 163px;
				width: 100px; height: 208px;
				background: #424A6B;
				box-shadow: inset -11px 0 0 -1px #526B94;
				border-radius: 0 26px 0 0;
				transform-origin: right top;
				transform: rotate(-36deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -50px; left: -10px;
				width: 290px; height: 226px;
				box-sizing: border-box;
				border-radius: 0 20px 0 0;
				border-left: 10px solid #0A0615;
				border-top: 10px solid #0A0615;
				border-bottom: 10px solid #0A0615;
			}
		}
		& > div:nth-child(2) {
			position: absolute;
			top: 41px; left: 516px;
			width: 64px; height: 253px;
			box-sizing: border-box;
			border-right: 10px solid #0A0615;
			border-bottom: 10px solid #0A0615;
			border-radius: 0 28px 42px 0;
			transform-origin: top right;
			transform: rotate(-37deg);
			z-index: 1;

			&:before {
				content: '';
				position: absolute;
				top: 212px; left: -84px;
				width: 100px; height: 10px;
				background: #0A0615;
				transform: rotate(37deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -259px; left: -441px;
				width: 213px; height: 227px;
				box-sizing: border-box;
				border-top: 10px solid #0A0615;
				border-right: 10px solid #0A0615;
				border-bottom: 10px solid #0A0615;
				border-radius: 20px 0 0 0;
				transform: rotate(37deg);
			}
		}
		& > div:nth-child(3) {
			position: absolute;
			top: 268px; left: 0px;
			width: 80px; height: 10px;
			background: #0A0615;

			&:before {
				content: '';
				position: absolute;
				top: -185px; left: 70px;
				width: 64px; height: 253px;
				box-sizing: border-box;
				border-left: 10px solid #0A0615;
				border-bottom: 10px solid #0A0615;
				border-radius: 28px 0 0 42px;
				transform-origin: top right;
				transform: rotate(37deg);
				z-index: 1;
			}
			&:after {
				content: '';
				position: absolute;
				top: -60px; left: 100px;
				border-left: 32px solid transparent;
				border-right: 32px solid transparent;
				border-bottom: 52px solid #0A0615;
			}
		}
		& > div:nth-child(4) {
			position: absolute;
			top: 137px; left: 90px;
			width: 12px; height: 74px;
			background: #0A0615;
			border-radius: 6px;
			box-shadow: -42px -11px 0 0 #0A0615, 
						-29px 17px 0 1px #0A0615, 
						-14px 18px 0 2px #0A0615, 
						-51px 40px 0 2px #0A0615;

			&:before {
				content: '';
				position: absolute;
				top: 79px; left: -32px;
				width: 32px; height: 20px;
				background: #0A0615;
			}
			&:after {
				content: '';
				position: absolute;
				top: 60px; left: -11px;
				width: 20px; height: 25px;
				background: #0A0615;
				border-radius: 6px;
				transform: rotate(30deg);
			}
		}
		& > div:nth-child(5) {
			position: absolute;
			top: 29px; left: 54px;
			width: 569px; height: 23px;
			box-sizing: border-box;
			border-top: 10px solid #0A0615;
			background: #1B172C;
			border-radius: 7% 7% 0 0 / 100% 100% 0 0;

			&:before {
				content: '';
				position: absolute;
				top: -7px; left: 7px;
				width: 35px; height: 273px;
				box-sizing: border-box;
				background: #1B172C;
				transform-origin: 0 0;
				transform: rotate(37deg);
				border-radius: 21% 0 0 0;
				border-left: 14px solid #425273;
				z-index: 3;
			}
			&:after {
				content: '';
				position: absolute;
				top: 13px; left: 226px;
				width: 28px; height: 227px;
				background: #1B172C;
			}
		}
		& > div:nth-child(6) {
			position: absolute;
			top: 30px; left: 599px;
			width: 26px; height: 26px;
			background: #0A0615;
			border-radius: 0 40px 0 0;
			transform: skewX(37deg);

			&:before {
				content: '';
				position: absolute;
				top: 26px; left: 16px;
				width: 10px; height: 218px;
				background: #526B94;
				box-shadow: -10px 0 0 0 #425273, 
							-16px 0 0 0 #425273,
							-26px 0 0 0 #1B172C, 
							-34px 0 0 0 #1B172C;
			}
			&:after {
				content: '';
				position: absolute;
				top: 22px; left: -25px;
				width: 25px; height: 25px;
				background: #1B172C;
			}
		}
		& > div:nth-child(7) {
			position: absolute;
			top: 278px; left: 0px;
			width: 780px; height: 290px;
			background: #1B172C;

			&:before {
				content: '';
				position: absolute;
				top: -64px; right: 20px;
				border-right: 50px solid transparent;
				border-bottom: 64px solid #1B172C;
			}
			&:after {
				content: '';
				position: absolute;
				top: -26px; right: 68px;
				border-left: 30px solid transparent;
				border-bottom: 26px solid #1B172C;
			}
		}
		& > div:nth-child(8) {
			position: absolute;
			top: 136px; left: 182px;
			width: 68px; height: 180px;
			background: #425464; 
			border-radius: 60px;
			box-shadow: inset 25px -4px 0 9px #2F294A, 
						inset 35px -10px 0 17px #313152;
			z-index: 1;

			&:before {
				content: '';
				position: absolute;
				top: 154px; left: 1px;
				width: 71px; height: 219px;
				background: #425464; 
				border-radius: 0 0 0 60px;
				box-shadow: inset 24px -9px 0 9px #2F294A, 
							inset 54px 0 0 0 #313152;
				transform: rotate(-19.5deg);
				transform-origin: 0 0;
			}
			&:after {
				content: '';
				position: absolute;
				top: 263px; left: 65px;
				width: 232px; height: 80px;
				background: #2F294A;
				border-radius: 60px 30px 30px 60px;
			}
		}
		& > div:nth-child(9) {
			position: absolute;
			top: 333px; left: 664px;
			width: 113px; height: 85px;
			box-sizing: border-box;
			background: #0A0615;
			border: 10px solid #2B242C;
			border-radius: 0 60px 60px 60px;
			box-shadow: 40px 0 0 10px #2B242C, 
						37px 78px 0 4px #2B242C, 
						47px 158px 0 4px #2B242C;

			&:before {
				content: '';
				position: absolute;
				top: -57px; left: -11px;
				width: 97px; height: 47px;
				box-sizing: border-box;
				background: #0A0615;
				border-radius: 0 0 20px 0;
				border-top: 13px solid #2B242C;
				border-left: 22px solid #2B242C;
				border-right: 10px solid #2B242C;
				transform: skewX(-49deg);
				transform-origin: bottom left;
				box-shadow: 70px 0 0 #2B242C;
			}
			&:after {
				content: '';
				position: absolute;
				top: 77px; left: 73px;
				width: 80px; height: 131px;
				background: #0A0615;
				border-radius: 70px 0 0 0;
				border-top: 19px solid #1B172C;
				border-left: 19px solid #1B172C;
			}
		}
		& > div:nth-child(10) {
			position: absolute;
			top: 414px; left: 498px;
			width: 234px; height: 144px;
			background: #1B172C;
			border-radius: 0 56px 71px 60px;
			overflow: hidden;
			z-index: 1;

			&:before {
				content: '';
				position: absolute;
				top: 16px; left: 2px;
				width: 94px; height: 139px;
				box-sizing: border-box;
				background: #293253;
				border-radius: 27px 27px;
				box-shadow: inset 0 10px 0 12px #293253, 
							inset 0 -9px 0 12px #293253, 
							inset 0 48px 0 20px #424A6B, 
							inset 0 -17px 0 12px #424A6B, 
							inset 0 80px 0 0 #202132;
			}
			&:after {
				content: '';
				position: absolute;
				top: 0px; left: 32px;
				width: 26px; height: 8px;
				border-left: 6px solid #3F4262;
				border-top: 8px solid #3F4262;
				border-right: 6px solid #3F4262;
				border-radius: 6px 6px 0 0;
			}

			& > div {
				position: absolute;
				top: 72px; left: 102px;
				width: 84px; height: 12px;
				background: #424A6B;
				box-shadow: 14px 0 0 0 #424A6B, 
							34px 0 0 0 #293253, 
							-18px 12px 0 0 #313152, 
							-18px 16px 0 0 #313152, 
							11px 12px 0 0 #313152, 
							11px 16px 0 0 #313152, 
							16px 28px 0 0 #293253, 
							16px 34px 0 0 #293253, 
							26px 28px 0 0 #293253, 
							26px 34px 0 0 #293253, 
							8px 46px 0 0 #432747, 
							8px 50px 0 0 #432747;

				&:before {
					content: '';
					position: absolute;
					top: 16px; left: 4px;
					width: 30px; height: 6px;
					background: #202132;
					box-shadow: 34px 0 0 0 #202132, 
								38px 0 0 0 #202132, 
								34px 18px 0 0 #202132, 
								54px 18px 0 0 #202132, 
								28px 34px 0 0 #202132, 
								28px 36px 0 0 #202132, 
								34px 34px 0 0 #202132, 
								34px 36px 0 0 #202132;
				}
				&:after {
					content: '';
					position: absolute;
					top: 26px; left: 10px;
					width: 6px; height: 16px;
					background: #202132;
					box-shadow: 0 4px 0 0 #202132, 
								15px 4px 0 0 #202132, 
								15px 0 0 0 #202132, 
								85px 4px 0 0 #202132, 
								85px 0 0 0 #202132, 
								6px 20px 0 0 #202132, 
								9px 20px 0 0 #202132, 
								66px 20px 0 0 #202132, 
								69px 20px 0 0 #202132;
				}
			}
		}
		& > div:nth-child(11) {
			position: absolute;
			top: 329px; left: 660px;
			width: 74px; height: 6px;
			background: #0A0615;
			transform-origin: 0 0;
			transform: rotate(-41deg);
			border-radius: 4px;

			&:before {
				content: '';
				position: absolute;
				top: -10px; left: 20px;
				width: 10px; height: 11px;
				background: #0A0615;
			}
			&:after {
				content: '';
				position: absolute;
				top: -37px; left: -18px;
				width: 85px; height: 27px;
				background: #0A0615;
				border-radius: 10px 10px 20px 20px;
			}
		}
		& > div:nth-child(12) {
			position: absolute;
			top: 392px; left: 691px;
			width: 61px; height: 16px;
			background: #293253;
			border-radius: 2px 2px 20px 20px;

			&:before {
				content: '';
				position: absolute;
				top: -28px; left: -12px;
				width: 86px; height: 28px;
				box-sizing: border-box;
				background: #313152;
				border-radius: 0 14px 14px 0;
				border-top: 5px solid #522959;
				border-right: 5px solid #522959;
				border-bottom: 5px solid #522959;
				box-shadow: inset 5px 0 0 0 #0A0615, 
							inset -44px 0 0 -36px #1B172C;
			}
			&:after {
				content: '';
				position: absolute;
				top: -68px; left: 11px;
				width: 44px; height: 10px;
				background: #293253;
				border-radius: 5px;
				box-shadow: 10px -10px 0 0 #293253;
			}
		}
		& > div:nth-child(13) {
			position: absolute;
			top: 272px; left: 750px;
			width: 60px; height: 14px;
			background: #0A0615;
			transform: skewX(37deg);

			&:before {
				content: '';
				position: absolute;
				top: -113px; left: 68px;
				width: 9px; height: 113px;
				background: #0A0615;
				box-shadow: -15px -55px 0 0 #0A0615, 
							-15px 0px 0 0 #0A0615;
			}
			&:after {
				content: '';
				position: absolute;
				top: -102px; left: 53px;
				width: 16px; height: 14px;
				background: #0A0615;
			}
		}
		& > div:nth-child(14) {
			position: absolute;
			top: 496px; left: 323px;
			width: 230px; height: 62px;
			background: linear-gradient(#0A0615 25%, #2B242C 26%, #2B242C 84%, #1B172C 85%);
			border-radius: 56px 0 0 0;

			&:before {
				content: '';
				position: absolute;
				top: -16px; left: -29px;
				width: 160px; height: 16px;
				background: #0A0615;
			}
			&:after {
				content: '';
				position: absolute;
				top: 0px; left: 29px;
				width: 62px; height: 62px;
				background: #432747;
			}
		}
		& > div:nth-child(15) {
			position: absolute;
			top: 481px; left: 41px;
			width: 157px; height: 30px;
			background: #0A0615;

			&:before {
				content: '';
				position: absolute;
				top: 30px; left: 0px;
				width: 157px;
				border-right: 40px solid transparent;
				border-bottom: 47px solid #2B242C;
			}
			&:after {
				content: '';
				position: absolute;
				top: -291px; left: -31px;
				width: 50px; height: 160px;
				background: #5A6B8C;
				transform-origin: 0 0;
				transform: rotate(-14deg);
				border-radius: 21px;
				z-index: 1;
			}
		}
		& > div:nth-child(16) {
			position: absolute;
			top: 413px; left: -10px;
			width: 234px; height: 68px;
			background: #2F294A;
			border-radius: 0 41px 21px 0;

			&:after {
				content: '';
				position: absolute;
				top: -276px; left: -20px;
				width: 69px; height: 276px;
				background: linear-gradient(to right, #292149 28%, #2F294A 29%);
				border-radius: 34px 34px 15px 15px;
				z-index: 2;
			}
			&:before {
				content: '';
				position: absolute;
				top: -163px; left: -172px;
				border-right: 100px solid transparent;
				border-left: 160px solid transparent;
				border-bottom: 60px solid #1B172C;
				transform: rotate(-90deg);
				z-index: 1;
			}
		}
		& > div:nth-child(17) {
			position: absolute;
			top: 264px; left: -417px;
			width: 320px; height: 239px;
			box-sizing: border-box;
			background: #1B172C;
			border-top: 12px solid #0A0615;
			border-left: 14px solid #0A0615;
			border-bottom: 17px solid #0A0615;
			border-radius: 40% 0 0 0;
			box-shadow: inset 21px -24px 0 0 #2B242C;

			&:before {
				content: '';
				position: absolute;
				top: 13px; left: 0px;
				width: 54px; height: 103px;
				background: #432747;
				border-radius: 100% 0 31px 0 / 73% 0 31px 0;
				box-shadow: inset -12px -29px 0 0 #0A0615;
			}
			&:after {
				content: '';
				position: absolute;
				top: 116px; left: 24px;
				width: 183px; height: 70px;
				background: #0A0615;
				border-radius: 35px;
			}
		}
		& > div:nth-child(18) {
			position: absolute;
			top: 342px; left: -334px;
			width: 130px; height: 34px;
			background: #2B242C;

			&:before {
				content: '';
				position: absolute;
				top: -80px; left: 200px;
				width: 66px; height: 191px;
				background: #2B242C;
				border-radius: 40px 42px 0 0;
				transform-origin: 0 0;
				transform: rotate(-20deg);
				z-index: 3;
			}
			&:after {
				content: '';
				position: absolute;
				top: -96px; left: 215px;
				width: 30px; height: 30px;
				background: #0A0615;
				transform: skewX(-35deg);
				z-index: 3;
			}
		}
		& > div:nth-child(19) {
			position: absolute;
			top: 340px; left: -97px;
			border-right: 50px solid transparent;
			border-bottom: 78px solid #2B242C;

			&:before {
				content: '';
				position: absolute;
				top: 36px; left: -105px;
				width: 90px; height: 41px;
				background: linear-gradient(#473A56 49%, #413452 50%);
				transform: rotate(-20deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 57px; left: -108px;
				width: 250px; height: 250px;
				box-sizing: border-box;
				border-radius: 50%;
				border: 20px solid transparent;
				border-left: 20px solid #2B242C;
				transform: rotate(65deg);
			}
		}
		& > div:nth-child(20) {
			position: absolute;
			top: 412px; left: -205px;
			width: 256px; height: 188px;
			box-sizing: border-box;
			background: linear-gradient(#0A0615 92%, #202132 93%);
			border-radius: 138px 86px 0 0;
			border-top: 20px solid #1B172C;
			border-left: 20px solid #1B172C;
			border-right: 20px solid #1B172C;
			z-index: 3;

			&:before {
				content: '';
				position: absolute;
				top: 17px; left: 20px;
				width: 192px; height: 192px;
				box-sizing: border-box;
				background: radial-gradient(#1B172C 10%, #0A0615 11%, #0A0615 24%, #1B172C 25%, #1B172C 50%, #0A0615 51%);
				border-radius: 50%;
				border-top: 9px solid #1B172C;
				border-left: 9px solid #1B172C;
				border-bottom: 9px solid #0A0615;
				border-right: 9px solid #0A0615;
				transform: rotate(45deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -56px; left: -168px;
				width: 92px; height: 17px;
				background: #1A3142;
				border-right: 16px solid #27445A;
				border-left: 16px solid #27445A;
				box-shadow: 5px -57px 0 0 #2B242C, 
							41px -57px 0 0 #2B242C;
			}
		}
		& > div:nth-child(21) {
			position: absolute;
			top: 503px; left: -393px;
			width: 59px; height: 57px;
			background: linear-gradient(#821D42 32%, #4A5A73 33%);
			box-shadow: inset -47px 0 0 0 #0A0615, 140px 0 0 0 #0A0615;

			&:before {
				content: '';
				position: absolute;
				top: 0px; left: 59px;
				width: 81px; height: 31px;
				background: #1B172C;
				border-bottom: 12px solid #0A0615;
			}
			&:after {
				content: '';
				position: absolute;
				top: 55px; left: 444px;
				width: 677px; height: 12px;
				background: #2B242C;
				box-shadow: 0px 12px 0 0 #0A0615, 90px 12px 0 0 #0A0615;
			}
		}
	}
	.sneakers {
		position: absolute;
		top: 514px; left: 50px;
		width: 31px; height: 36px;
		background: linear-gradient(#424A6B 77%, #293253 78%);

		&:before {
			content: '';
			position: absolute;
			top: 12px; left: 31px;
			width: 40px; height: 24px;
			background: linear-gradient(to right, #424A6B 61%, #293253 62%);
			border-radius: 0 17px 0 0;
			box-shadow: inset 0 -8px 0 0 #293253;
		}
		&:after {
			content: '';
			position: absolute;
			top: 5px; left: 31px;
			border-right: 25px solid transparent;
			border-bottom: 7px solid #293253;
		}

		& > div {
			position: absolute;
			top: 14px; left: 0px;
			width: 17px; height: 14px;
			background: #293253;
			border-radius: 0 14px 0 0;

			&:before {
				content: '';
				position: absolute;
				top: -32px; left: 13px;
				width: 18px; height: 30px;
				background: #293253;
				border-radius: 20px 0 0 8px;
			}
			&:after {
				content: '';
				position: absolute;
				top: -4px; left: 50px;
				width: 5px; height: 8px;
				background: #1B172C;
				box-shadow: -8px -2px 0 0 #1B172C, -16px -4px 0 0 #1B172C;
				z-index: 1;
			}
		}
	}
	.papper {
		position: absolute;
		top: 480px; left: 106px;
		width: 60px; height: 66px;
		box-sizing: border-box;
		background: #293253;
		border: 15px solid #4A5A73;
		box-shadow: 0 8px 0 0 #424A6B, 0 24px 0 0 #4A5A73;
		z-index: 11;
		transform-origin: left 90px;
		transform: rotate(-6deg);
		animation: sceneThreePapper 10s ease infinite;
		animation-delay: -0.5s;

		&:before {
			content: '';
			position: absolute;
			top: -15px; left: -15px;
			border-bottom: 28px solid transparent;
			border-left: 60px solid #5A6B8C;
		}
		&:after {
			content: '';
			position: absolute;
			top: -15px; left: -15px;
			border-top: 28px solid transparent;
			border-left: 60px solid #424A6B;
			transform: rotate(-50deg);
		}
	}
	.man {
		position: absolute;
		top: 168px; left: 236px;
		width: 465px; height: 321px;
		z-index: 1;

		&__head {
			content: '';
			position: absolute;
			top: 77px; left: 30px;
			width: 35px; height: 67px;
			background: #473A56;
			border-radius: 18px;
			transform-origin: bottom left;
			transform: rotate(5deg);
			animation: sceneThreeManHead 1s ease infinite;

			&:before {
				content: '';
				position: absolute;
				top: -9px; left: 12px;
				width: 56px; height: 66px;
				background: #0A0615;
				border-radius: 0 0 6px 45px;
			}
			&:after {
				content: '';
				position: absolute;
				top: 13px; left: 51px;
				width: 23px; height: 16px;
				background: #0A0615;
				border-radius: 0 0 4px 0;
			}
		}
		&__hair {
			content: '';
			position: absolute;
			top: -67px; left: -16px;
			width: 46px; height: 86px;
			background: #0A0615;
			border-radius: 35px 0 0 27px;

			&:before {
				content: '';
				position: absolute;
				top: 0px; left: 46px;
				width: 10px;
				border-right: 11px solid transparent;
				border-top: 16px solid #0A0615;
			}
			&:after {
				content: '';
				position: absolute;
				top: 16px; left: 46px;
				height: 17px;
				border-bottom: 10px solid transparent;
				border-left: 10px solid #0A0615;
			}
		}
		&__beard {
			content: '';
			position: absolute;
			top: -62px; left: 30px;
			width: 40px; height: 75px;
			background: #6B8278;
			border-radius: 0 28px 0 22px;
			box-shadow: inset -10px 1px 0 0 #7AA68E;

			&:before {
				content: '';
				position: absolute;
				top: 37px; left: 18px;
				width: 26px; height: 8px;
				background: #0A0615;
			}
			&:after {
				content: '';
				position: absolute;
				top: 50px; left: 28px;
				width: 6px; height: 9px;
				background: #0A0615;
				border-radius: 2px;
				animation: sceneThreeManEye 2s ease infinite;
			}
		}
		&__nose {
			position: absolute;
			top: -11px; left: 70px;
			width: 12px; height: 24px;
			background: #73436B;
			border-radius: 0 12px 4px 0;
			box-shadow: inset -4px 0 0 0 #B65B76;

			&:before {
				content: '';
				position: absolute;
				top: 14px; left: -4px;
				width: 12px; height: 10px;
				background: #73436B;
				border-radius: 4px 0 0 4px;
				box-shadow: inset 0 -4px 0 0 #B65B76;
			}
		}
		&__body {
			position: absolute;
			top: 199px; left: 40px;
			width: 71px; height: 110px;
			background: #31396A;
			border-radius: 50px 0 0 4px;
			box-shadow: inset -14px 0 0 0 #3A7BA5;
			transform-origin: 0 0;
			transform: rotate(-66deg);
			z-index: 1;

			&:before {
				content: '';
				position: absolute;
				top: 157px; left: 15px;
				width: 72px; height: 37px;
				background: #4A4263;
				box-shadow: inset -7px 0 0 0 #413452, 0 12px 0 0 #3A114B;
				transform-origin: 0 0;
				transform: rotate(-24deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 108px; left: -8px;
				width: 72px; height: 68px;
				background: #31396A;
				box-shadow: inset -8px 0 0 0 #293253;
				border-radius: 16% 0 0 0 / 100% 0 0 0;
				transform-origin: 0 0;
				transform: rotate(-25deg);
			}
		}
		&__arm {
			position: absolute;
			top: 121px; left: 28px;
			width: 58px; height: 75px;
			background: #325385;
			border-radius: 29px 29px 0 0;
			box-shadow: inset -12px 0 0 0 #3A7BA5;
			transform: rotate(-9deg);
			transform-origin: 29px 29px;
			z-index: 1;

			&:before {
				content: '';
				position: absolute;
				top: 75px; left: 16px;
				width: 33px; height: 80px;
				background: #6B8278;
				border-radius: 0 0 16px 16px;
			}
		}
		&__forearm {
			position: absolute;
			top: 130px;  left: 20px;
			width: 26px; height: 163px;
			background: #6B8278;
			border-radius: 40px;
			transform-origin: 13px 13px;
			transform: rotate(-131deg);

			&:before {
				content: '';
				position: absolute;
				top: 142px; left: 7px;
				height: 18px;
				border-bottom: 22px solid transparent;
				border-right: 23px solid #6B8278;
				transform: rotate(50deg);
				transform-origin: 0 0;
				animation: sceneThreeManPalm .5s linear infinite;
			}
			&:after {
				content: '';
				position: absolute;
				top: 165px; left: -39px;
				width: 13px;
				border-left: 19px solid transparent;
				border-bottom: 18px solid #7AA68E;
				transform-origin: bottom right;
				transform: rotate(4deg) translate(0, 0);
				animation: sceneThreeManFingers .5s linear infinite;
			}
		}
		&__shorts {
			position: absolute;
			top: 244px; left: 277px;
			width: 50px; height: 70px;
			background: #3A114B;
			transform-origin: 0 0;
			transform: rotate(-117deg);
			border-radius: 4px 0 0 0;
			z-index: 7;

			&:after {
				content: '';
				position: absolute;
				top: -9px; left: -12px;
				width: 83px; height: 102px;
				background: #553356;
				box-shadow: inset 47px 0 0 0 #522959;
				transform-origin: 0 0;
				transform: rotate(-22deg);
				border-radius: 24px 40px 0 0 / 54px 40px 0 0;
			}
			&:before {
				content: '';
				position: absolute;
				top: -37px; left: 14px;
				border-right: 50px solid transparent;
				border-top: 46px solid #522959;
				border-radius: 0 15px;
				transform-origin: 0 0;
				transform: rotate(23deg);
			}
		}
		&__legs {
			position: absolute;
			top: 183px; left: 323px;

			div:nth-child(1) {
				position: absolute;
				top: -37px; left: -95px;
				width: 40px; height: 164px;
				background: #4A426B;
				border-radius: 0 0 22px 15px;
				transform-origin: top right;
				transform: rotate(-143deg);
				z-index: 6;

				&:before {
					content: '';
					position: absolute;
					top: -2px; left: -28px;
					width: 40px; height: 164px;
					background: #4A426B;
					border-radius: 0 0 22px 15px;
					transform-origin: top right;
					transform: rotate(-8deg);
				}
			}
			div:nth-child(2) {
				position: absolute;
				top: -68px; left: 106px;
				width: 32px; height: 69px;
				background: #4A426B;
				border-radius: 0 0 0 10px;
				transform-origin: 0 0;
				transform: rotate(-146deg);

				&:before {
					content: '';
					position: absolute;
					top: -13px; left: 84px;
					width: 23px;
					border-right: 33px solid transparent;
					border-left: 5px solid transparent;
					border-top: 70px solid #473A56;
					transform-origin: 0 0;
					transform: rotate(91deg);
				}
				&:after {
					content: '';
					position: absolute;
					top: 48px; left: 3px;
					width: 30px; height: 15px;
					background: #4A426B;
					border-radius: 0 0 11px 6px;
					transform-origin: 0 0;
					transform: rotate(41deg);
				}
			}
			div:nth-child(3) {
				position: absolute;
				top: -131px; left: 115px;
				width: 23px; height: 13px;
				background: #4A426B;
				border-radius: 0 5px 10px 0;
				transform-origin: 0 0;
				transform: rotate(-126deg);
			}
			div:nth-child(4) {
				position: absolute;
				top: 24px; left: 3px;
				width: 58px; height: 135px;
				background: #352C49;
				border-radius: 0 0 30px 30px;
				transform-origin: 0 0;
				transform: rotate(-124deg);
				z-index: 4;
			}
			div:nth-child(5) {
				content: '';
				position: absolute;
				top: -97px; left: 65px;
				width: 30px; height: 180px;
				transform-origin: 0 0;
				transform: rotate(7deg);
				background: #352C49;
				border-radius: 19px 14px 0 0;
				z-index: 5;

				&:before {
					content: '';
					position: absolute;
					top: 0px; left: 22px;
					width: 30px; height: 170px;
					background: #352C49;
					border-radius: 0 29px 0 26px;
					transform-origin: 0 0;
					transform: rotate(8deg);
				}
			}
			div:nth-child(6) {
				position: absolute;
				top: 71px; left: 37px;
				width: 35px; height: 35px;
				background: #352C49;
				border-radius: 30px 30px 0 0;
				transform: rotate(237deg);

				&:before {
					content: '';
					position: absolute;
					top: 1px; left: -30px;
					height: 13px;
					border-top: 22px solid transparent;
					border-right: 50px solid #352C49;
					transform: rotate(10deg);
				}
				&:after {
					content: '';
					position: absolute;
					top: 16px; left: -56px;
					width: 42px; height: 19px;
					background: #352C49;
					border-radius: 20px 17px 0 0;
					transform: rotate(-40deg);
				}
			}
		}
	}
	.laptop {
		position: absolute;
		top: 166px; left: 164px;
		width: 72px; height: 11px;
		background: #0A0615;
		border-radius: 0 0 8px 0;

		&:before {
			content: '';
			position: absolute;
			top: -84px; left: 65px;
			width: 10px; height: 96px;
			background: #0A0615;
			border-radius: 0 10px 10px 0;
			box-shadow: -5px 0 0 0 #92DAF3;
			transform-origin: bottom right;
			transform: rotate(14deg);
		}
		&:after {
			content: '';
			position: absolute;
			top: 0px; left: 58px;
			width: 10px; height: 10px;
			background: #0A0615;
		}
	}
	.pizza {
		position: absolute;
		top: 392px; left: 62px;
		width: 156px; height: 18px;
		background: #473A56;
		z-index: 1;

		&:before {
			content: '';
			position: absolute;
			top: -102px; left: -12px;
			width: 94px; height: 102px;
			box-sizing: border-box;
			background: #524A6B;
			border-top: 10px solid #413452;
			border-right: 16px solid #473A56;
			border-left: 14px solid #473A56;
			transform: skewX(14deg);
		}
		&:after {
			content: '';
			position: absolute;
			top: -20px; left: 0px;
			border-left: 10px solid transparent;
			border-right: 10px solid transparent;
			border-bottom: 20px solid #524A6B;
		}

		&__fat {
			position: absolute;
			top: -78px; left: 12px;
			width: 18px; height: 16px;
			background: #413452;
			border-radius: 50%;
			transform: skewX(14deg);

			&:before {
				content: '';
				position: absolute;
				top: 4px; left: 31px;
				width: 20px; height: 25px;
				background: #413452;
				border-radius: 15px 0 0 15px;
			}
			&:after {
				content: '';
				position: absolute;
				top: 33px; left: 4px;
				width: 47px; height: 46px;
				background: #413452;
				border-radius: 70% 0 0 0;
			}
		}
	}
	.coffee {
		position: absolute;
		top: 355px; left: 125px;
		width: 28px;
		border-left: 7px solid transparent;
		border-right: 7px solid transparent;
		border-top: 55px solid #5A6B8C;
		transform-origin: 7px bottom;
		z-index: 1;
		animation: sceneThreeCoffee 10s ease infinite;
		animation-delay: -0.5s;

		&:before {
			content: '';
			position: absolute;
			top: -45px; left: -6px;
			width: 32px;
			border-left: 4px solid transparent;
			border-right: 4px solid transparent;
			border-top: 27px solid #27445A;
		}
		&:after {
			content: '';
			position: absolute;
			top: -72px; left: 0px;
			width: 29px; height: 9px;
			background: #4A5A73;
			box-shadow: -13px 8px 0 0 #5A6B8C, 
						13px 8px 0 0 #5A6B8C, 
						6px 13px 0 0 #4A5A73, 
						-7px 13px 0 0 #4A5A73;
		}
	}
	.bg-1 {
		position: absolute;
		top: 0px; left: 0px;
		width: 850px; height: 130px;
		border-radius: 0 50px 50px 0;
		background: #2F294A;
		animation: sceneThreeBg1 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 257px; left: 0px;
			width: 850px; height: 133px;
			background: #2F294A;
			border-radius: 0 55px 55px 0;
		}
	}
	.bg-2 {
		position: absolute;
		top: 0px; right: 0px;
		width: 860px; height: 54px;
		background: #2F294A;
		border-radius: 25px 0 0 25px;
		animation: sceneThreeBg2 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 126px; right: 0px;
			width: 1054px; height: 133px;
			background: #2F294A;
			border-radius: 57px 0 0 57px;
		}
		&:after {
			content: '';
			position: absolute;
			top: 521px; right: 0px;
			width: 1314px; height: 90px;
			background: #2F294A;
			border-radius: 50px 0 0 0;
		}
	}
}

@keyframes sceneThreeManEye {
	60% { transform: scaleY(1); }
	65% { transform: scaleY(.1); }
	70% { transform: scaleY(1); }
}
@keyframes sceneThreeManPalm {
	0% 		{ transform: rotate(50deg); }
	50% 	{ transform: rotate(40deg); }
	100% 	{ transform: rotate(50deg); }
}
@keyframes sceneThreeManFingers {
	0% 		{ transform: rotate(4deg) translate(0, 0); }
	50% 	{ transform: rotate(-6deg) translate(5px, 4px); }
	100% 	{ transform: rotate(4deg) translate(0, 0); }
}
@keyframes sceneThreeManHead {
	0% 		{ transform: rotate(0deg); }
	50% 	{ transform: rotate(9deg); }
	100% 	{ transform: rotate(0deg); }
}
@keyframes sceneThreeCoffee {
	0% 		{ transform: rotate(0deg) translate(0px, 0px); }
	55.2% 	{ transform: rotate(0deg) translate(0px, 0px); }
	57.6% 	{ transform: rotate(-77deg) translate(0px, 0px); }
	58.8% 	{ transform: rotate(-77deg) translate(9px, 8px); }
	60% 	{ transform: rotate(-77deg) translate(0px, 0px); }
	100% 	{ transform: rotate(-77deg) translate(0px, 0px); }
}
@keyframes sceneThreePapper {
	0% 		{ transform: rotate(-6deg); }
	57% 	{ transform: rotate(-6deg); }
	59.4% 	{ transform: rotate(-38deg); }
	100% 	{ transform: rotate(-38deg); }
}
@keyframes sceneThreeManHead {
	0% 		{ transform: rotate(0deg); }
	50% 	{ transform: rotate(9deg); }
	100% 	{ transform: rotate(0deg); }
}
@keyframes sceneThreeRoad {
	0% 		{ transform: translate(0, 0); }
	52.8% 	{ transform: translate(0, 0); }
	61.8% 	{ transform: translate(1220px, 0); }
	100% 	{ transform: translate(1220px, 0); }
}
@keyframes sceneThreeCar {
	0% 		{ transform: translateY(0); }
	50% 	{ transform: translateY(-10px); }
	100% 	{ transform: translateY(0); }
}
@keyframes sceneThreeBg1 {
	0% 		{ transform: translateX(0); }
	55.3% 	{ transform: translateX(0); }
	61.8% 	{ transform: translateX(-850px); }
	100% 	{ transform: translateX(-850px); }
}
@keyframes sceneThreeBg2 {
	0% 		{ transform: translateX(0); }
	55.2% 	{ transform: translateX(0); }
	61.8% 	{ transform: translateX(1320px); }
	100% 	{ transform: translateX(1320px); }
}
@keyframes sceneThree {
	0% 		{ opacity: 0; z-index: 3; }
	31.1% 	{ opacity: 0; z-index: 3; }
	31.2% 	{ opacity: 1; z-index: 3; }
	37.8% 	{ opacity: 1; z-index: 4; }
	61.7% 	{ opacity: 1; z-index: 4; }
	61.8% 	{ opacity: 0; z-index: 1; }
	88.8% 	{ opacity: 0; z-index: 2; }
	100% 	{ opacity: 0; z-index: 2; }
}

.scene-4 {
	position: absolute;
	top: 0px; left: 0px;
	width: 800px; height: 600px;
	animation: sceneFour 10s linear infinite;
	
	&__top {
		position: absolute;
		top: 0px; left: 0px;
		animation: sceneFourTop 10s ease infinite;
	}
	&__left {
		position: absolute;
		top: 0px; left: 0px;
		animation: sceneFourLeft 10s ease infinite;
	}
	&__right {
		position: absolute;
		top: 0px; left: 0px;
		animation: sceneFourRight 10s ease infinite;
	}

	.picture-1 {
		position: absolute;
		top: 0px; left: 0px;
		width: 98px; height: 98px;
		background: #6B8439;
		border: 12px solid #32283F;
		overflow: hidden;

		&:before {
			content: '';
			position: absolute;
			top: 0px; left: 0px;
			width: 100px; height: 100px;
			background: #435A3A;
			transform: rotate(45deg);
		}
		&:after {
			content: '';
			position: absolute;
			top: 53px; left: 58px;
			width: 20px; height: 36px;
			background: #D0BD21;
			box-shadow: 0 -43px 0 0 #D0BD21;
			border-radius: 100%;
			transform-origin: 0 0;
			transform: rotate(-135deg);
		}
	}
	.picture-2 {
		position: absolute;
		top: 136px; left: 36px;
		width: 62px; height: 91px;
		background: #C6C69C;
		border: 12px solid #314339;

		&:before {
			content: '';
			position: absolute;
			top: 62px; left: 6px;
			width: 4px; height: 5px;
			background: #32283F;
			box-shadow: 8px 0 0 0 #32283F, 12px 0 0 0 #32283F, 20px 0 0 0 #32283F, 24px 0 0 0 #32283F, 
						28px 0 0 0 #32283F, 32px 0 0 0 #32283F, 36px 0 0 0 #32283F, 40px 0 0 0 #32283F, 
						44px 0 0 0 #32283F, 44px 8px 0 0 #32283F, 40px 8px 0 0 #32283F, 36px 8px 0 0 #32283F, 
						8px -8px 0 0 #32283F, 12px -8px 0 0 #32283F, 16px -8px 0 0 #32283F, 24px -8px 0 0 #32283F, 
						32px -8px 0 0 #32283F, 36px -8px 0 0 #32283F, 40px -8px 0 0 #32283F, 43px -8px 0 0 #32283F, 
						4px -16px 0 0 #32283F, 8px -16px 0 0 #32283F, 12px -16px 0 0 #32283F, 16px -16px 0 0 #32283F, 
						20px -16px 0 0 #32283F, 28px -16px 0 0 #32283F, 32px -16px 0 0 #32283F, 36px -16px 0 0 #32283F, 
						40px -16px 0 0 #32283F, 12px -28px 0 0 #32283F, 16px -28px 0 0 #32283F, 20px -28px 0 0 #32283F, 
						24px -28px 0 0 #32283F, 28px -28px 0 0 #32283F, 32px -28px 0 0 #32283F, 34px -28px 0 0 #32283F, 
						12px -24px 0 0 #32283F, 16px -24px 0 0 #32283F, 20px -24px 0 0 #32283F, 24px -24px 0 0 #32283F, 
						28px -24px 0 0 #32283F, 32px -24px 0 0 #32283F, 34px -24px 0 0 #32283F;
		}
		&:after {
			content: '';
			position: absolute;
			top: 9px; left: 23px;
			width: 7px; height: 7px;
			border: 4px solid #32283F;
			transform: rotate(45deg);
		}
	}
	.picture-3 {
		position: absolute;
		top: -30px; left: 138px;
		width: 53px; height: 74px;
		background: #6B8439;
		border: 10px solid #314339;
	}
	.picture-4 {
		position: absolute;
		top: 79px; left: 138px;
		width: 164px; height: 86px;
		background: #AEAB21;
		border: 12px solid #424242;
		box-shadow: inset 0 0 0 14px #D0C821;

		&:before {
			content: '';
			position: absolute;
			top: 26px; left: 102px;
			width: 35px; height: 35px;
			background: linear-gradient(-45deg, #9B9C21 50%, #737B21 50%);
			border-radius: 100% 0;
			transform: rotate(-45deg);
			box-shadow: -27px -27px 0 0 #737B21;
		}
		&:after {
			content: '';
			position: absolute;
			top: 26px; left: 26px;
			width: 35px; height: 35px;
			background: linear-gradient(-45deg, #737B21 50%, #9B9C21 50%);
			border-radius: 100% 0;
			transform: rotate(-45deg);
		}
	}
	.picture-5 {
		position: absolute;
		top: 26px; left: 225px;
		width: 26px; height: 26px;
		background: #435A3A;
		border: 6px solid #32283F;

		&:before {
			content: '';
			position: absolute;
			top: 7px; left: 7px;
			width: 11px; height: 11px;
			background: #9B9C21;
			transform: rotate(45deg);
		}
		&:after {
			content: '';
			position: absolute;
			top: -43px; left: -5px;
			width: 25px; height: 10px;
			background: #435A3A;
			border: 6px solid #32283F;
		}
	}
	.picture-6 {
		position: absolute;
		top: -30px; left: 276px;
		width: 310px; height: 55px;
		background: #5A6222;
		border: 12px solid #5A6222;
		box-shadow: inset 0 0 0 12px #737B21;

		&:before {
			content: '';
			position: absolute;
			top: 6px; left: 23px;
			width: 30px; height: 30px;
			background: #737B21;
			border-radius: 90% 0;
			box-shadow: 103px 0 0 0 #737B21, 206px 0 0 0 #737B21;
		}
		&:after {
			content: '';
			position: absolute;
			top: 6px; left: 52px;
			width: 30px; height: 30px;
			background: #737B21;
			border-radius: 0 90%;
			box-shadow: 103px 0 0 0 #737B21, 206px 0 0 0 #737B21;
		}
	}
	.picture-7 {
		position: absolute;
		top: 64px; left: 552px;
		width: 112px; height: 64px;
		background: linear-gradient(to right, #6B8439 45%, #435A3A 46%, #435A3A 55%, #6B8439 56%);
		border: 12px solid #32283F;
		box-shadow: inset 0 0 0 12px #435A3A;

		&:before {
			content: '';
			position: absolute;
			top: 18px; left: 17px;
			width: 14px; height: 14px;
			background: #314339;
			border-radius: 50%;
			box-shadow: 14px 0 0 0 #314339, 14px 14px 0 0 #314339, 
						0 14px 0 0 #314339, 49px 0 0 0 #314339, 
						49px 14px 0 0 #314339, 63px 14px 0 0 #314339, 
						63px 0 0 0 #314339;
		}
		&:after {
			content: '';
			position: absolute;
			top: -100px; left: 62px;
			width: 190px; height: 51px;
			background: #314339;
			border: 11px solid #32283F;
			box-shadow: inset 0 0 0 12px #6B8439;
		}
	}
	.picture-8 {
		position: absolute;
		top: 64px; left: 702px;
		width: 120px; height: 97px;
		background: #9B9C21;
		border: 15px solid #314339;
		box-shadow: inset 0 0 0 12px #D0BD21;

		&:before {
			content: '';
			position: absolute;
			top: 85px; left: -624px;
			width: 10px; height: 4px;
			background: #32283F;
			box-shadow: -2px 8px 0 0 #32283F;
			transform: skewX(-27deg);
		}
		&:after {
			content: '';
			position: absolute;
			top: 85px; left: -663px;
			width: 10px; height: 4px;
			background: #32283F;
			box-shadow: 2px 8px 0 0 #32283F;
			transform: skewX(27deg);
		}
	}
	.bookshelf {
		position: absolute;
		top: 266px; left: 555px;
		width: 320px; height: 294px;
		background: linear-gradient(#314339 9%, 
									#435A3A 9%, #435A3A 35%, 
									#4A6B39 35%, #4A6B39 38%, 
									#314339 38%, #314339 48%, 
									#435A3A 48%, #435A3A 68%, 
									#4A6B39 68%, #4A6B39 71.5%, 
									#314339 72%, #314339 81%, 
									#435A3A 81%);
		border: 12px solid #537A39;

		&:before {
			content: '';
			position: absolute;
			top: 10px; left: 168px;
			width: 28px; height: 92px;
			background: #FFFFFF;
			box-shadow: -8px 0 0 0 #436B94, inset 0 22px 0 10px #528CB5, inset 0 0 0 10px #528CB5;
		}
		&:after {
			content: '';
			position: absolute;
			top: 10px; left: 204px;
			width: 28px; height: 92px;
			background: #FFFFFF;
			box-shadow: -8px 0 0 0 #737B21, inset 0 22px 0 10px #9B9C21, inset 0 0 0 10px #9B9C21;
		}
	}
	.photo {
		position: absolute;
		top: 306px; left: 629px;
		width: 35px; height: 56px;
		background: #6B8439;
		border: 9px solid #32283F;
		overflow: hidden;

		&:before {
			content: '';
			position: absolute;
			top: 10px; left: 7px;
			width: 18px; height: 18px;
			background: #ACB752;
			border-radius: 50%;
		}
		&:after {
			content: '';
			position: absolute;
			top: 32px; left: -7px;
			border-left: 20px solid transparent;
			border-right: 10px solid transparent;
			border-bottom: 19px solid #314339;
			box-shadow: 20px 7px 0 -7px #314339;
		}
	}
	.books-1 {
		position: absolute;
		top: 416px; left: 574px;
		width: 64px; height: 10px;
		background: #9B9C21;
		box-shadow: 0 4px 0 0 #737B21, 
					0 14px 0 0 #E7BD39, 
					0 16px 0 0 #E7BD39, 
					0 22px 0 0 #C47533, 
					0 32px 0 0 #C65A84, 
					0 35px 0 0 #C65A84, 
					0 40px 0 0 #873E5E, 
					0 46px 0 0 #424242, 
					0 52px 0 0 #211821;

		&:before {
			content: '';
			position: absolute;
			top: 14px; left: 48px;
			width: 8px; height: 12px;
			background: #C47533;
		}
		&:after {
			content: '';
			position: absolute;
			top: 38px; left: 8px;
			width: 48px; height: 7px;
			background: #873E5E;
		}
	}
	.books-2 {
		position: absolute;
		top: 448px; left: 652px;
		width: 6px; height: 30px;
		background: #2B242C;
		box-shadow: 11px -5px 0 5px #9B9C21, 
					27px -5px 0 5px #6B8439, 27px -13px 0 5px #6B8439, 
					33px -13px 0 5px #314339, 33px -5px 0 5px #314339, 
					53px -9px 0 9px #528CB5, 53px -17px 0 9px #528CB5, 
					73px -5px 0 5px #E7BD39, 73px -27px 0 5px #E7BD39, 
					79px -27px 0 5px #C47533, 79px -5px 0 5px #C47533, 
					95px -5px 0 5px #9B9C21, 95px -35px 0 5px #9B9C21, 
					101px -35px 0 5px #737B21, 101px -5px 0 5px #737B21, 
					114px -3px 0 2px #704946, 114px -34px 0 2px #704946, 114px -47px 0 2px #704946, 
					124px -47px 0 2px #563636, 124px -16px 0 2px #563636, 124px -2px 0 2px #563636, 
					134px -38px 0 2px #E7BD39, 134px -12px 0 2px #E7BD39, 
					157px -25px 0 25px #C47533;

		&:before {
			content: '';
			position: absolute;
			top: -13px; left: 29px;
			width: 14px; height: 9px;
			background: #314339;
			box-shadow: 15px -8px 0 0 #526B94, 15px 30px 0 0 #526B94, 
						25px -8px 0 0 #526B94, 25px 30px 0 0 #526B94, 
						39px 34px 0 0 #C47533, 47px 34px 0 0 #C47533, 
						47px -19px 0 0 #C47533, 39px -19px 0 0 #C47533, 
						60px -21px 0 -1px #737B21, 70px -21px 0 -1px #737B21, 
						70px 28px 0 -1px #737B21, 60px 28px 0 -1px #737B21, 
						81px 32px 0 -2px #563636, 81px -32px 0 -2px #563636;
		}
		&:after {
			content: '';
			position: absolute;
			top: 56px; left: 44px;
			width: 49px; height: 12px;
			background: #528CB5;
			box-shadow: 19px 0 0 0 #528CB5, 
						9px 8px 0 0 #526B94, 
						9px 20px 0 0 #528CB5, 9px 22px 0 0 #528CB5, 
						2px 34px 0 0 #424242, 46px 34px 0 0 #424242, 66px 34px 0 0 #424242, 
						10px 42px 0 0 #2B242C, 58px 42px 0 0 #2B242C, 
						10px 53px 0 0 #424242, 59px 53px 0 0 #424242, 59px 56px 0 0 #424242, 10px 56px 0 0 #424242;
		}
	}
	.books-3 {
		position: absolute;
		top: 504px; left: 570px;
		width: 28px; height: 68px;
		box-sizing: border-box;
		background: #FFFFFF;
		box-shadow: -3px 0 0 0 #737B21, 
					inset 0 26px 0 0 #9B9C21, inset 0 0 0 10px #9B9C21;

		&:before {
			content: '';
			position: absolute;
			top: 0px; left: 31px;
			width: 28px; height: 68px;
			box-sizing: border-box;
			background: #FFFFFF;
			box-shadow: -3px 0 0 0 #436B94, 
						inset 0 26px 0 0 #528CB5, inset 0 0 0 10px #528CB5;
		}
		&:after {
			content: '';
			position: absolute;
			top: 0px; left: 62px;
			width: 28px; height: 68px;
			box-sizing: border-box;
			background: #FFFFFF;
			box-shadow: -3px 0 0 0 #873E5E, 
						inset 0 26px 0 0 #C65A84, inset 0 0 0 10px #C65A84;
		}
	}
	.commode {
		position: absolute;
		top: 408px; left: 0px;
		width: 268px; height: 14px;
		background: #4C7339;

		&:before {
			content: '';
			position: absolute;
			top: 14px; left: 12px;
			width: 242px; height: 108px;
			background: #4A6B39;
			box-shadow: inset 0 14px 0 0 #435A3A;
		}
		&:after {
			content: '';
			position: absolute;
			top: 122px; left: 12px;
			width: 12px; height: 53px;
			background: #4A6B39;
			box-shadow: 230px 0 0 0 #4A6B39;
		}
	}
	.commode__box {
		position: absolute;
		top: 25px; left: 23px;
		width: 105px; height: 37px;
		background: #6B8439;
		box-shadow: 0 6px 0 0 #435A3A, 
					114px 0 0 0 #6B8439, 
					114px 6px 0 0 #435A3A, 
					0 49px 0 0 #6B8439, 100px 49px 0 0 #6B8439, 114px 49px 0 0 #6B8439, 
					0 54px 0 0 #435A3A, 100px 54px 0 0 #435A3A, 114px 54px 0 0 #435A3A;

		&:before {
			content: '';
			position: absolute;
			top: 13px; left: 33px;
			width: 40px; height: 12px;
			background: #E7BD39;
			box-shadow: 0 6px 0 0 #4A6B39, 
						114px 0 0 0 #E7BD39, 
						114px 6px 0 0 #4A6B39, 
						57px 44px 0 0 #E7BD39, 
						57px 50px 0 0 #4A6B39;
		}
		&:after {
			content: '';
			position: absolute;
			top: -73px; left: -11px;
			width: 108px; height: 48px;
			background: #424242;
			border-radius: 10px 10px 0 0;
			box-shadow: inset 0 16px 0 0 #5A595A;
		}
	}
	.printer {
		position: absolute;
		top: -43px; left: 25px;
		width: 9px; height: 5px;
		background: #97B04E;

		&:before {
			content: '';
			position: absolute;
			top: 0px; left: 15px;
			width: 8px; height: 5px;
			background: #528CB5;
		}
		&:after {
			content: '';
			position: absolute;
			top: 22px; left: 19px;
			width: 46px; height: 9px;
			background: #528CB5;
		}
	}
	.table {
		position: absolute;
		top: 332px; left: 124px;
		width: 274px; height: 12px;
		background: #E7BD39;

		&:before {
			content: '';
			position: absolute;
			top: 12px; left: 16px;
			width: 212px; height: 12px;
			background: #211821;
		}
		&:after {
			content: '';
			position: absolute;
			top: 24px; left: 36px;
			width: 14px; height: 222px;
			background: #211821;
		}

		&__leg {
			position: absolute;
			top: 239px; left: 36px;
			width: 136px; height: 12px;
			background: #211821;

			&:before {
				content: '';
				position: absolute;
				top: -243px; left: 55px;
				width: 12px; height: 150px;
				background: #211821;
				transform: rotate(45deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -261px; left: -12px;
				width: 88px; height: 22px;
				background: #2B242C;
			}
		}
	}
	.plant {
		position: absolute;
		top: -36px; left: 10px;
		width: 52px; height: 10px;
		background: #704946;

		&:before {
			content: '';
			position: absolute;
			top: 10px; left: 8px;
			width: 38px; height: 26px;
			background: linear-gradient(#5A3942 21%, #704946 22%, #704946 80%, #5A3942 81%);
			border-radius: 0 0 10px 10px;
		}
		&:after {
			content: '';
			position: absolute;
			top: -48px; left: 10px;
			width: 28px; height: 48px;
			background: linear-gradient(to right, #435A3A 50%, #737B21 51%);
			border-radius: 20px 20px 0 0;
		}
	}
	.plant__flower {
		position: absolute;
		top: -70px; left: 48px;
		width: 10px; height: 26px;
		background: #435A3A;
		border-radius: 10px 10px 20px 0;

		&:before {
			content: '';
			position: absolute;
			top: 14px; left: -7px;
			width: 12px; height: 12px;
			background: #435A3A;
			border-radius: 50%;
		}
		&:after {
			content: '';
			position: absolute;
			top: -25px; left: -23px;
			width: 8px; height: 8px;
			background: #BC6B3A;
			border: 5px solid #E7BD39;
			transform: rotate(45deg);
		}
	}
	.monitor {
		position: absolute;
		top: -22px; left: 69px;
		width: 63px; height: 22px;
		box-sizing: border-box;
		border-left: 10px solid #424242;
		border-bottom: 10px solid #424242;
		border-radius: 0 0 0 19px;

		&:before {
			content: '';
			position: absolute;
			top: -85px; left: 10px;
			width: 20px; height: 104px;
			box-sizing: border-box;
			border-left: 10px solid #424242;
			border-bottom: 10px solid #424242;
			border-radius: 0 0 0 30px;
			transform-origin: 0 0;
			transform: rotate(14deg);
		}
		&:after {
			content: '';
			position: absolute;
			top: -163px; left: -26px;
			width: 24px; height: 175px;
			background: #D6D6D5;
			box-shadow: inset -12px 0 0 0 #424242;
			border-radius: 100% 0 0 100%;
			transform-origin: 0 0;
			transform: rotate(-24deg);
		}
	}
	.keyboard {
		position: absolute;
		top: -20px; left: 161px;
		width: 20px; height: 20px;
		background: #424242;
		border: 5px solid #D6D6D5;
		box-sizing: border-box;
		border-radius: 50%;

		&:before {
			content: '';
			position: absolute;
			top: -4px; left: 11px;
			width: 50px; height: 8px;
			background: #D6D6D5;
			transform-origin: 0 0;
			transform: rotate(13deg);
			box-shadow: -1px -5px 0 -2px #424242;
		}
		&:after {
			content: '';
			position: absolute;
			top: -170px; left: -87px;
			width: 5px; height: 153px;
			background: #FFFFFF;
			transform-origin: 0 0;
			transform: rotate(-24deg);
		}
	}
	.chair {
		position: absolute;
		top: 556px; left: 386px;
		width: 196px; height: 15px;
		background: #211821;
		border-radius: 10px 10px 0 0;
		transform: translateX(0);
		animation: sceneFourChair 10s ease infinite;

		&:after {
			content: '';
			position: absolute;
			top: -96px; left: 87px;
			width: 23px; height: 10px;
			background: #211821;
			box-shadow: 0 10px 0 0 #424242, 
						0 20px 0 0 #211821, 
						0 30px 0 0 #424242, 
						0 40px 0 0 #211821, 
						0 50px 0 0 #424242, 
						0 60px 0 0 #211821, 
						0 70px 0 0 #424242, 
						0 80px 0 0 #211821, 
						0 86px 0 0 #424242,
						6px 43px 0 0 #211821;
		}
		&:before {
			content: '';
			position: absolute;
			top: -140px; left: 22px;
			width: 155px; height: 44px;
			background: linear-gradient(#F7AD39 59%, #BC6B3A 60%);
			border-radius: 50px;
		}

		&__legs {
			position: absolute;
			top: 15px; left: 8px;
			width: 18px; height: 12px;
			background: #211821;
			box-shadow: 166px 0 0 0 #211821;

			&:before {
				content: '';
				position: absolute;
				top: -79px; left: 108px;
				width: 10px; height: 32px;
				background: #211821;
			}
			&:after {
				content: '';
				position: absolute;
				top: -323px; left: 140px;
				width: 100px; height: 212px;
				box-sizing: border-box;
				border-radius: 0 20px 74px 0;
				border-right: 20px solid #211821;
				border-bottom: 20px solid #211821;
			}
		}
		&__back {
			position: absolute;
			top: -374px; left: 184px;
			width: 44px; height: 147px;
			background: #F7AD39;
			border-radius: 25px;
			
			&:before {
				content: '';
				position: absolute;
				top: 100px; left: 7px;
				width: 44px; height: 117px;
				background: #F7AD39;
				border-radius: 25px;
				transform-origin: 0 0;
				transform: rotate(17deg);
			}
		}
	}
	.girl {
		position: absolute;
		top: -467px; left: 43px;
		width: 120px; height: 340px;
		transform: translateX(0);

		&:before {
			content: '';
			position: absolute;
			top: 475px; left: -186px;
			width: 10px; height: 10px;
			background: #F7C6A5;
			border-radius: 4px 0 0;
			transform: translateX(0);
			animation: sceneFourGirlToe 10s ease infinite;
		}
		&:after {
			content: '';
			position: absolute;
			top: 453px; left: -36px;
			width: 12px; height: 14px;
			background: #FFD6B5;
			border-radius: 10px 0 0 0;
		}
		&__neck {
			position: absolute;
			top: 77px; left: 70px;
			width: 17px; height: 50px;
			background: linear-gradient(-45deg, #FFD6B5 58%, #DAAA8A 59%);
			transform-origin: bottom left;
			transform: rotate(3deg);

			&:before {
				content: '';
				position: absolute;
				top: 51px; left: -6px;
				width: 22px; height: 18px;
				background: #ffffff;
				transform-origin: bottom left;
				transform: skewY(-43deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: 74px; left: -15px;
				width: 29px; height: 38px;
				background: #424242;
				transform-origin: bottom left;
				transform: skewY(-37deg);
			}
		}
		&__body {
			position: absolute;
			top: 170px; left: 44px;
			width: 40px; height: 84px;
			background: #424242;
			border-radius: 20px 0 0 0;

			&:before {
				content: '';
				position: absolute;
				top: -8px; left: -2px;
				width: 30px; height: 42px;
				background: #424242;
				transform: rotate(33deg);
				border-radius: 0 0 0 20px / 0 0 0 8px;
			}
			&:after {
				content: '';
				position: absolute;
				top: 84px; left: 0px;
				width: 55px; height: 85px;
				background: #325385;
				border-radius: 0 17px 42px 0 / 0 36px 42px 0;
				box-shadow: inset 0 -123px 0 -50px #528CB5;
			}
		}
		&__head { 
			position: absolute;
			top: -10px; left: 32px;
			width: 56px; height: 110px;
			background: #FFD6B5;
			border-radius: 39px 0 32px 12px;
			transform-origin: bottom right;
			transform: rotate(5deg);
			animation: sceneFourGirlHead 10s ease infinite;

			&:before {
				content: '';
				position: absolute;
				top: 63px; left: -20px;
				width: 21px; height: 13px;
				background: #FFD6B5;
				border-radius: 0 0 0 16px;
			}
			&:after {
				content: '';
				position: absolute;
				top: 73px; left: -5px;
				width: 7px; height: 15px;
				background: #FFD6B5;
				border-radius: 0 0 0 20px;
				border-bottom: 2px solid #DAAA8A;
			}
		}
		&__hair {
			position: absolute;
			top: 0px; left: 30px;
			width: 40px; height: 60px;
			box-sizing: border-box;
			background: #FFD639;
			border-radius: 4px 12px 0 24px;
			border-left: 9px solid #F7AD39;
			border-bottom: 9px solid #F7AD39;

			&:before {
				content: '';
				position: absolute;
				top: 0px; left: 16px;
				width: 47px; height: 240px;
				background: #F7AD39;
				border-radius: 0 60px 50px 8px;
				box-shadow: inset -11px 39px 0 11px #FFD639;
			}
			&:after {
				content: '';
				position: absolute;
				top: 0px; left: 16px;
				width: 12px; height: 60px;
				background: #F7647B;
				border-radius: 2px 4px 0 0;
			}
		}
		&__face {
			position: absolute;
			top: 53px; left: 55px;
			width: 16px; height: 25px;
			background: #FFD6B5;
			border-radius: 10px 10px 16px 0;

			&:before {
				content: '';
				position: absolute;
				top: -1px; left: -47px;
				width: 5px; height: 8px;
				background: #2B242C;
				border-radius: 4px;
			}
			&:after {
				content: '';
				position: absolute;
				top: -10px; left: -49px;
				width: 17px; height: 7px;
				background: #F7AD39;
				border-radius: 4px;
				transform-origin: bottom right;
				transform: rotate(23deg);
			}
		}
		&__back-arm { 
			position: absolute;
			top: 148px; left: 40px;
			width: 18px; height: 90px;
			background: #F7C6A5;
			border-radius: 0 0 0 7px;
			transform-origin: bottom right;
			transform: rotate(-30deg) translate(0, 0);
			animation: sceneFourGirlBackArm 10s ease infinite;

			&:before {
				content: '';
				position: absolute;
				top: -27px; left: -26px;
				width: 30px; height: 29px;
				background: #D6947B;
				border-radius: 30px 0 0 20px;
				transform-origin: bottom right;
				transform: rotate(30deg);
			}
			&:after {
				content: '';
				position: absolute;
				top: -20px; left: -15px;
				width: 20px; height: 9px;
				background: #F7C6A5;
				border-radius: 4px 0 0 4px;
				transform-origin: bottom right;
				transform: rotate(30deg);
			}

			.girl__palm {
				position: absolute;
				top: -54px; left: -18px;
				width: 6px; height: 36px;
				background: #875A4F;
				border-radius: 2px;
				transform-origin: bottom left;
				transform: rotate(48deg);

				&:before {
					content: '';
					position: absolute;
					top: 3px; left: 11px;
					width: 20px; height: 20px;
					background: #F7C6A5;
					border-radius: 0px 30px 0 10px;
					transform-origin: bottom left;
					transform: rotate(29deg);
				}
				&:after {
					content: '';
					position: absolute;
					top: 16px; left: 20px;
					width: 19px; height: 14px;
					background: #F7C6A5;
					transform: rotate(44deg);
				}
			}
		}
		&__front-arm {
			position: absolute;
			top: 126px; left: 72px;
			width: 25px; height: 140px;
			background: #FFD6B5;
			border-radius: 13px;
			transform-origin: 12px 12px;
			transform: rotate(4deg);
			animation: sceneFourGirlFrontArm 10s ease infinite;
		}
		&__forearm {
			position: absolute;
			top: 120px; left: 2px;
			width: 20px; height: 137px;
			background: #FFD6B5;
			border-radius: 10px;
			transform-origin: 10px 10px;
			transform: rotate(121deg);
			animation: sceneFourGirlForearm 10s ease infinite;

			&:before {
				content: '';
				position: absolute;
				top: 120px; left: -3px;
				width: 21px; height: 29px;
				background: #DAAA8A;
				border-radius: 2px 4px 14px;
			}
			&:after {
				content: '';
				position: absolute;
				top: 134px; left: 2px;
				width: 7px; height: 24px;
				background: #FFD6B5;
				border-radius: 4px;
				box-shadow: 6px -18px 0 0 #FFD6B5, 10px -22px 0 0 #FFD6B5, -1px -22px 0 0 #FFD6B5;
			}
		}
		&__skirt {
			position: absolute;
			top: 284px; left: -40px;
			width: 139px; height: 55px;
			box-sizing: border-box;
			background: #528CB5;
			border-radius: 0 0 42px 0;
			border-bottom: 10px solid #436B94;

			&:before {
				content: '';
				position: absolute;
				top: 31px; left: -84px;
				width: 84px; height: 23px;
				background: #F7C6A5;
				border-radius: 12px 0 0 12px;
			}
			&:after {
				content: '';
				position: absolute;
				top: 6px; left: -94px;
				width: 94px; height: 30px;
				background: #FFD6B5;
				border-radius: 15px 0 0 15px;
			}
		}
		&__back-leg {
			position: absolute;
			top: 315px; left: -124px;
			width: 20px; height: 157px;
			border-radius: 10px;
			background: #F7C6A5;
			transform-origin: 10px 10px;
			transform: rotate(15deg);
			animation: sceneFourGirlBackLeg 10s ease infinite;

			&:before {
				content: '';
				position: absolute;
				top: 137px; left: 1px;
				width: 26px; height: 26px;
				border-radius: 50%;
				background: #F7C6A5;
			}
			&:after {
				content: '';
				position: absolute;
				top: 143px; left: 0px;
				width: 20px; height: 38px;
				background: #F7C6A5;
				border-radius: 0 0 30px 0;
				transform-origin: 0 0;
				transform: rotate(23deg);
				animation: sceneFourGirlFoot 10s ease infinite;
			}
		}
		&__front-leg { 
			position: absolute;
			top: 292px; left: -135px;
			width: 22px; height: 186px;
			background: #FFD6B5;
			border-radius: 11px;
			transform-origin: 11px 11px;
			transform: rotate(-41.7deg);

			&:before {
				content: '';
				position: absolute;
				top: 165px; left: 1px;
				width: 26px; height: 26px;
				border-radius: 50%;
				background: #FFD6B5;
			}
			&:after {
				content: '';
				position: absolute;
				top: 170px; left: 0px;
				width: 20px; height: 38px;
				background: #FFD6B5;
				transform-origin: 0 0;
				transform: rotate(40deg);
			}
		}
	}
	.teacup {
		position: absolute;
		top: 138px; left: -18px;
		width: 21px; height: 36px;
		background: #704946;
		border-radius: 0 16px 16px 0;
		transform-origin: 0 0;
		transform: rotate(-35deg);
		animation: sceneFourGirlTeacup 10s ease infinite;

		&:before { 
			content: '';
			position: absolute;
			top: 24px; left: -16px;
			width: 17px; height: 9px;
			background: #D0BD21;
			border-radius: 10px;
			box-shadow: 2px -22px 0 -2px #D0BD21;
			animation: sceneFourGirlTeacupSteam 1s ease infinite;
		}
		&:after {
			content: '';
			position: absolute;
			top: 14px; left: -36px;
			width: 13px; height: 7px;
			background: #D0BD21;
			border-radius: 4px;
			box-shadow: -23px -10px 0 1px #D0BD21;
			animation: sceneFourGirlTeacupSteam 1s ease infinite;
			animation-delay: .2s;
		}
	}
	.bg-1 {
		position: absolute;
		top: 50px; left: 0px;
		width: 870px; height: 164px;
		background: #9B9C21;
		border-radius: 0 68px 68px 0;
		animation: sceneFourLeft 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 164px; left: 0px;
			width: 1026px; height: 164px;
			background: #9B9C21;
			border-radius: 0 72px 72px 0;
		}
		&:after {
			content: '';
			position: absolute;
			top: 532px; left: 0px;
			width: 1196px; height: 21px;
			background: #211821;
		}
	}
	.bg-2 {
		position: absolute;
		top: 0px; right: 0px;
		width: 850px; height: 51px;
		background: #9B9C21;
		border-radius: 15px 0 0 15px;
		animation: sceneFourRight 10s ease infinite;

		&:before {
			content: '';
			position: absolute;
			top: 374px; right: 0px;
			width: 850px; height: 220px;
			background: #848C21;
			border-radius: 74px 0 0 60px;
		}
	}
}
@keyframes sceneFourChair {
	0% 		{ transform: translateX(0); }
	60%  	{ transform: translateX(0); }
	62.4% 	{ transform: translateX(-5px); }
	63% 	{ transform: translateX(-9px); }
	63.6% 	{ transform: translateX(-15px); }
	64.2% 	{ transform: translateX(-23px); }
	64.8% 	{ transform: translateX(-29px); }
	65.4% 	{ transform: translateX(-35px); }
	66% 	{ transform: translateX(-41px); }
	66.6% 	{ transform: translateX(-45px); }
	67.2% 	{ transform: translateX(-47px); }
	67.8% 	{ transform: translateX(-49px); }
	69% 	{ transform: translateX(-51px); }
	70.2% 	{ transform: translateX(-49px); }
	71.4% 	{ transform: translateX(-45px); }
	72.6% 	{ transform: translateX(-37px); }
	73.8% 	{ transform: translateX(-25px); }
	75% 	{ transform: translateX(-13px); }
	76.2% 	{ transform: translateX(-3px); }
	78% 	{ transform: translateX(5px); }
	79.8% 	{ transform: translateX(5px); }
	81.6% 	{ transform: translateX(1px); }
	100% 	{ transform: translateX(1px); }
}
@keyframes sceneFourGirlHead {
	0% 		{ transform: rotate(5deg); }
	60% 	{ transform: rotate(5deg); }
	62.4% 	{ transform: rotate(6deg) translate(3px, 0px); }
	63.6% 	{ transform: rotate(8deg) translate(3px, 0px); }
	64.2% 	{ transform: rotate(8deg) translate(5px, 1px); }
	64.8% 	{ transform: rotate(8deg) translate(5px, 1px); }
	65.4% 	{ transform: rotate(8deg) translate(3px, 1px); }
	66.6% 	{ transform: rotate(8deg) translate(3px, 1px); }
	67.2% 	{ transform: rotate(8deg) translate(0px, 1px); }
	71.4% 	{ transform: rotate(8deg) translate(-2px, 1px); }
	72.6% 	{ transform: rotate(5deg) translate(-2px, 1px); }
	75% 	{ transform: rotate(3deg) translate(-2px, 1px); }
	76.2% 	{ transform: rotate(1deg) translate(-2px, 1px); }
	78% 	{ transform: rotate(-2deg) translate(-2px, 1px); }
	100% 	{ transform: rotate(-2deg) translate(-2px, 1px); }
}
@keyframes sceneFourGirlToe {
	0% 		{ transform: translateX(0); }
	60% 	{ transform: translateX(0); }
	62.4% 	{ transform: translateX(5px); }
	63% 	{ transform: translateX(9px); }
	63.6% 	{ transform: translateX(15px); }
	64.2% 	{ transform: translateX(23px); }
	64.8% 	{ transform: translateX(29px); }
	65.4% 	{ transform: translateX(34px); }
	66% 	{ transform: translateX(41px); }
	66.6% 	{ transform: translateX(45px); }
	67.2% 	{ transform: translateX(47px); }
	67.8% 	{ transform: translateX(49px); }
	69% 	{ transform: translateX(51px); }
	70.2% 	{ transform: translateX(49px); }
	71.4% 	{ transform: translateX(45px); }
	72.6% 	{ transform: translateX(37px); }
	73.8% 	{ transform: translateX(25px); }
	75% 	{ transform: translateX(13px); }
	76.2% 	{ transform: translateX(3px); }
	78% 	{ transform: translateX(-5px); }
	79.8% 	{ transform: translateX(-5px); }
	81.6% 	{ transform: translateX(-1px); }
	100% 	{ transform: translateX(-1px); }
}
@keyframes sceneFourGirlFoot {
	0% 		{ transform: rotate(23deg); }
	60% 	{ transform: rotate(23deg); }
	62.4% 	{ transform: rotate(29deg); }
	63% 	{ transform: rotate(32deg); }
	63.6% 	{ transform: rotate(32deg); }
	64.2% 	{ transform: rotate(42deg); }
	64.8% 	{ transform: rotate(42deg); }
	65.4% 	{ transform: rotate(47deg); }
	67.2% 	{ transform: rotate(47deg); }
	67.8% 	{ transform: rotate(53deg); }
	70.2% 	{ transform: rotate(53deg); }
	71.4% 	{ transform: rotate(45deg); }
	72.6% 	{ transform: rotate(45deg); }
	73.8% 	{ transform: rotate(39deg); }
	75% 	{ transform: rotate(29deg); }
	76.2% 	{ transform: rotate(26deg); }
	78% 	{ transform: rotate(21deg); }
	100% 	{ transform: rotate(21deg); }
}
@keyframes sceneFourGirlBackLeg {
	0% 		{ transform: rotate(15deg); }
	60% 	{ transform: rotate(15deg); }
	62.4% 	{ transform: rotate(12deg); }
	63% 	{ transform: rotate(10deg); }
	63.6% 	{ transform: rotate(8deg); }
	64.2% 	{ transform: rotate(4deg); }
	64.8% 	{ transform: rotate(2deg); }
	65.4% 	{ transform: rotate(0deg); }
	66% 	{ transform: rotate(-2deg); }
	66.6% 	{ transform: rotate(-4deg); }
	67.8% 	{ transform: rotate(-6deg); }
	69% 	{ transform: rotate(-7deg); }
	70.2% 	{ transform: rotate(-5deg); }
	71.4% 	{ transform: rotate(-3deg); }
	72.6% 	{ transform: rotate(0deg); }
	73.8% 	{ transform: rotate(5deg); }
	75% 	{ transform: rotate(10deg); }
	76.2% 	{ transform: rotate(14deg); }
	78% 	{ transform: rotate(17deg); }
	81.6% 	{ transform: rotate(15deg); }
	100% 	{ transform: rotate(15deg); }
}
@keyframes sceneFourGirlForearm {
	0% 		{ transform: rotate(121deg); }
	60% 	{ transform: rotate(121deg); }
	63% 	{ transform: rotate(123deg); }
	63.6% 	{ transform: rotate(126deg); }
	64.2% 	{ transform: rotate(129deg); }
	64.8% 	{ transform: rotate(131deg); }
	65.4% 	{ transform: rotate(134deg); }
	66% 	{ transform: rotate(136deg); }
	66.6% 	{ transform: rotate(135deg); }
	67.8% 	{ transform: rotate(135deg); }
	69% 	{ transform: rotate(134deg); }
	70.2% 	{ transform: rotate(131deg); }
	71.4% 	{ transform: rotate(128deg); }
	72.6% 	{ transform: rotate(124deg); }
	73.8% 	{ transform: rotate(121deg); }
	76.2% 	{ transform: rotate(121deg); }
	78% 	{ transform: rotate(119deg); }
	81.6% 	{ transform: rotate(120deg); }
	100% 	{ transform: rotate(120deg); }
}
@keyframes sceneFourGirlFrontArm {
	0% 		{ transform: rotate(4deg); }
	60% 	{ transform: rotate(4deg); }
	63.6% 	{ transform: rotate(1deg); }
	65.4% 	{ transform: rotate(1deg); }
	66% 	{ transform: rotate(4deg); }
	66.6% 	{ transform: rotate(6deg); }
	67.2% 	{ transform: rotate(8deg); }
	67.8% 	{ transform: rotate(10deg); }
	69% 	{ transform: rotate(14deg); }
	70.2% 	{ transform: rotate(17deg); }
	71.4% 	{ transform: rotate(20deg); }
	72.6% 	{ transform: rotate(23deg); }
	75% 	{ transform: rotate(22deg); }
	76.2% 	{ transform: rotate(21deg); }
	78% 	{ transform: rotate(17deg); }
	79.8% 	{ transform: rotate(11deg); }
	81.6% 	{ transform: rotate(5deg); }
	100% 	{ transform: rotate(5deg); }
}
@keyframes sceneFourGirlTeacup {
	0% 		{ transform: rotate(-35deg) translate(0px, 0px); }
	60% 	{ transform: rotate(-35deg) translate(0px, 0px); }
	63% 	{ transform: rotate(-36deg) translate(3px, -1px); }
	63.6% 	{ transform: rotate(-37deg) translate(0px, 2px); }
	64.2% 	{ transform: rotate(-39deg) translate(3px, 2px); }
	64.8% 	{ transform: rotate(-40deg) translate(2px, 2px); }
	65.4% 	{ transform: rotate(-44deg) translate(2px, 6px); }
	66% 	{ transform: rotate(-49deg) translate(2px, 8px); }
	66.6% 	{ transform: rotate(-49deg) translate(-1px, 7px); }
	67.2% 	{ transform: rotate(-53deg) translate(-1px, 9px); }
	67.8% 	{ transform: rotate(-54deg) translate(0px, 11px); }
	69% 	{ transform: rotate(-56deg) translate(1px, 12px); }
	70.2% 	{ transform: rotate(-56deg) translate(-2px, 12px); }
	71.4% 	{ transform: rotate(-57deg) translate(0px, 12px); }
	72.6% 	{ transform: rotate(-57deg) translate(1px, 10px); }
	73.8% 	{ transform: rotate(-54deg) translate(0px, 8px); }
	75% 	{ transform: rotate(-52deg) translate(0px, 8px); }
	76.2% 	{ transform: rotate(-51deg) translate(0px, 8px); }
	78% 	{ transform: rotate(-48deg) translate(-2px, 5px); }
	79.8% 	{ transform: rotate(-40deg) translate(1px, 1px); }
	81.6% 	{ transform: rotate(-35deg) translate(0px, -1px); }
	100% 	{ transform: rotate(-35deg) translate(0px, -1px); }
}
@keyframes sceneFourGirlBackArm {
	0% 		{ transform: rotate(-30deg) translate(0, 0); }
	60% 	{ transform: rotate(-30deg) translate(0, 0); }
	62.4% 	{ transform: rotate(-30deg) translate(1px, 2px); }
	63% 	{ transform: rotate(-31deg) translate(5px, 2px); }
	63.6% 	{ transform: rotate(-31deg) translate(9px, 2px); }
	64.2% 	{ transform: rotate(-32deg) translate(16px, 2px); }
	64.8% 	{ transform: rotate(-32deg) translate(20px, 0px); }
	65.4% 	{ transform: rotate(-32deg) translate(23px, -4px); }
	66% 	{ transform: rotate(-32deg) translate(27px, -9px); }
	66.6% 	{ transform: rotate(-32deg) translate(27px, -9px); }
	67.2% 	{ transform: rotate(-32deg) translate(27px, -15px); }
	67.8% 	{ transform: rotate(-31deg) translate(27px, -15px); }
	69% 	{ transform: rotate(-30deg) translate(27px, -15px); }
	70.2% 	{ transform: rotate(-30deg) translate(22px, -27px); }
	71.4% 	{ transform: rotate(-30deg) translate(17px, -31px); }
	72.6% 	{ transform: rotate(-30deg) translate(10px, -34px); }
	73.8% 	{ transform: rotate(-31deg) translate(7px, -34px); }
	76.2% 	{ transform: rotate(-30deg) translate(4px, -31px); }
	78% 	{ transform: rotate(-30deg) translate(0px, -22px); }
	79.8% 	{ transform: rotate(-31deg) translate(-2px, -14px); }
	81.6% 	{ transform: rotate(-31deg) translate(-2px, -5px); }
	100% 	{ transform: rotate(-31deg) translate(-2px, -5px); }
}
@keyframes sceneFourGirlTeacupSteam {
	0% 		{ transform: translateX(0px); opacity: 0; }
	50% 	{ transform: translateX(-10px); opacity: 1; }
	100% 	{ transform: translateX(-20px); opacity: 0; }
}
@keyframes sceneFourTop {
	0% 		{ transform: translateY(0px); }
	82.2% 	{ transform: translateY(0px); }
	87% 	{ transform: translateY(-260px); }
	100% 	{ transform: translateY(-260px); }
}
@keyframes sceneFourLeft {
	0% 		{ transform: translateX(0px); }
	79.8% 	{ transform: translateX(0px); }
	88.2% 	{ transform: translateX(-1198px); }
	100% 	{ transform: translateX(-1198px); }
}
@keyframes sceneFourRight {
	0% 		{ transform: translateX(0px); }
	81% 	{ transform: translateX(0px); }
	88.8% 	{ transform: translateX(850px); }
	100% 	{ transform: translateX(850px); }
}
@keyframes sceneFour {
	0% 		{ opacity: 0; z-index: 2; }
	10.2% 	{ opacity: 0; z-index: 2; }
	37.8% 	{ opacity: 0; z-index: 3; }
	54.5% 	{ opacity: 0; z-index: 3; }
	54.6% 	{ opacity: 1; z-index: 3; }
	61.8% 	{ opacity: 1; z-index: 4; }
	88.7% 	{ opacity: 1; z-index: 4; }
	88.8% 	{ opacity: 0; z-index: 1; }
	100% 	{ opacity: 0; z-index: 1; }
}
            
          
!
            
              // based on Beresnev gif https://dribbble.com/shots/2933600-Dribbblers
            
          
!
999px
🕑 One or more of the npm packages you are using needs to be built. You're the first person to ever need it! We're building it right now and your preview will start updating again when it's ready.
Loading ..................

Console