html{width:336px;height:280px;overflow:hidden;}
body{font-family:'Oswald', sans serfif;line-height:1;font-weight:700;width:336px;height:280px;padding:0;margin:0;overflow:hidden;font-size:20px;text-align:center;background-image:url('back.jpg');position:relative;}
div{animation-timing-function:linear;}
.img{background-size:cover;background-position:center;background-repeat:no-repeat;}
header{color:#fcb040;text-outline:1px solid #000;text-shadow:0 0 4px #000;font-size:40px;padding-top:5px;}
#snowman{height:208px;position:relative;margin-top:-4px;}
#logo{position:absolute;top:115px;right:28px;}
#tag{color:#056839;}
.snow{border-radius:50%;background:#fff;transform:rotate(8deg);position:absolute;}
#body{width:100px;height:100px;bottom:5px;left:60px;box-shadow:inset -10px -10px 0 #d6f0ff;animation-name:bounce1;animation-duration:3s;}
#head{width:60px;height:60px;bottom:80px;left:80px;box-shadow:inset -6px -6px 0 #d6f0ff;animation-name:bounce2;animation-duration:5s;}
.arm{background-image:url('Arms.png');width:50px;height:47px;position:absolute;animation-duration:10.5s;animation-name:fall;}
#left{left:28px;top:85px;}
#right{transform:scaleX(-1);top:85px;left:142px;}
.coal{border-radius:50%;background:#414042;box-shadow:1px 1px 2px #4a4a4b;position:absolute;width:8px;height:8px;position:absolute;animation-duration:10s;}
#e1:after,#e2:after{content:'';display:block;width:4px;height:4px;border-radius:50%;position:absolute;top:1px;right:1px;background:#808285;animation-name:alive;animation-duration:24s;}
#e1{left:95px;top:85px;animation-name:swirl4;}#e2{left:113px;top:85px;animation-name:swirl5;}
#b1{left:99px;top:135px;animation-name:swirl3;}#b2{left:99px;top:155px;animation-name:swirl2;}#b3{left:99px;top:175px;animation-name:swirl1;}
#m1{width:4px;height:4px;left:93px;top:109px;animation-name:swirl6;}#m2{width:5px;height:5px;left:97px;top:111px;animation-name:swirl7;}
#m3{width:6px;height:6px;left:103px;top:112px;animation-name:swirl8;}
#m4{width:5px;height:5px;left:111px;top:111px;animation-name:swirl9;}#m5{width:4px;height:4px;left:117px;top:109px;animation-name:swirl10;}
#nose{background-image:url('carrot.png');width:25px;height:12px;position:absolute;top:96px;left:88px;animation-name:pop;animation-duration:11s;}
#scarf{background-image:url('scarf.png');width:67px;height:49px;position:absolute;top:108px;left:77px;animation-name:spin;animation-duration:24s;}
#hat{width:67px;height:55px;position:absolute;left:77px;top:31px;animation-name:cap;animation-duration:14s;}#hat div{position:absolute;top:0;left:0;width:67px;height:55px;}
#band{z-index:-5;background-image:url('Hat-back.png');}#top{background-image:url('Hat.png');}
.word{animation-name:light;}
#w1{animation-duration:19s;}#w2{animation-duration:21s;}#w3{animation-duration:23s;}

@keyframes bounce1{
	0%{bottom:40px;left:336px;transform:rotate(8deg);}
	15%{bottom:4px;}
	30%{bottom:27px;}
	50%{bottom:3px;}
	55%{bottom:10px;transform:rotate(8deg);}
	80%{bottom:7px;left:40px;transform:rotate(0deg);}
	100%{bottom:5px;left:60px;transform:rotate(8deg);}
}
@keyframes bounce2{
	0%{bottom:150px;left:336px;transform:rotate(15deg);}
	40%{bottom:150px;left:336px;}
	60%{bottom:5px;left:246px;}
	78%{bottom:123px;left:181px;}
	82%{bottom:130px;left:161px;}
	85%{bottom:123px;}
	95%{bottom:80px;left:90px;transform:rotate(15deg);}
	100%{bottom:80px;left:80px;transform:rotate(8deg);}
}
@keyframes swirl1{
	0%{left:336px;top:-20px;}
	48%{left:336px;top:-20px;}
	55%{left:230px;top:80px;}
	56.5%{left:200px;top:88px;}
	61%{left:136px;top:36px;}
	62%{left:131px;top:12px;}
	64%{left:170px;top:-12px;}
	68%{left:232px;top:6px;}
	70%{left:260px;top:42px;}
	75%{left:234px;top:110px;}
	82%{left:99px;top:175px;}
	100%{left:99px;top:175px;}
}
@keyframes swirl2{
	0%{left:336px;top:-20px;}
	50%{left:336px;top:-20px;}
	57%{left:230px;top:80px;}
	58.5%{left:200px;top:88px;}
	63%{left:136px;top:36px;}
	64%{left:131px;top:12px;}
	66%{left:170px;top:-12px;}
	70%{left:232px;top:6px;}
	72%{left:260px;top:42px;}
	77%{left:234px;top:110px;}
	84%{left:99px;top:155px;}
	100%{left:99px;top:155px;}
}
@keyframes swirl3{
	0%{left:336px;top:-20px;}
	52%{left:336px;top:-20px;}
	59%{left:230px;top:80px;}
	60.5%{left:200px;top:88px;}
	65%{left:136px;top:36px;}
	66%{left:131px;top:12px;}
	68%{left:170px;top:-12px;}
	72%{left:232px;top:6px;}
	74%{left:260px;top:42px;}
	79%{left:234px;top:110px;}
	86%{left:99px;top:135px;}
	100%{left:99px;top:135px;}
}
@keyframes swirl4{
	0%{left:336px;top:-20px;}
	54%{left:336px;top:-20px;}
	61%{left:230px;top:80px;}
	62.5%{left:200px;top:88px;}
	67%{left:136px;top:36px;}
	68%{left:131px;top:12px;}
	70%{left:170px;top:-12px;}
	74%{left:232px;top:6px;}
	76%{left:260px;top:42px;}
	81%{left:234px;top:110px;}
	88%{left:95px;top:85px;}
	100%{left:95px;top:85px;}
}
@keyframes swirl5{
	0%{left:336px;top:-20px;}
	56%{left:336px;top:-20px;}
	63%{left:230px;top:80px;}
	64.5%{left:200px;top:88px;}
	69%{left:136px;top:36px;}
	70%{left:131px;top:12px;}
	72%{left:170px;top:-12px;}
	76%{left:232px;top:6px;}
	78%{left:260px;top:42px;}
	83%{left:234px;top:110px;}
	90%{left:113px;top:85px;}
	100%{left:113px;top:85px;}
}
@keyframes swirl6{
	0%{left:336px;top:-20px;}
	58%{left:336px;top:-20px;}
	65%{left:230px;top:80px;}
	66.5%{left:200px;top:88px;}
	71%{left:136px;top:36px;}
	72%{left:131px;top:12px;}
	74%{left:170px;top:-12px;}
	78%{left:232px;top:6px;}
	80%{left:260px;top:42px;}
	85%{left:234px;top:110px;}
	92%{left:93px;top:109px;}
	100%{left:93px;top:109px;}
}
@keyframes swirl7{
	0%{left:336px;top:-20px;}
	60%{left:336px;top:-20px;}
	67%{left:230px;top:80px;}
	68.5%{left:200px;top:88px;}
	73%{left:136px;top:36px;}
	75%{left:131px;top:12px;}
	76%{left:170px;top:-12px;}
	80%{left:232px;top:6px;}
	82%{left:260px;top:42px;}
	87%{left:234px;top:110px;}
	94%{left:97px;top:111px;}
	100%{left:97px;top:111px;}
}
@keyframes swirl8{
	0%{left:336px;top:-20px;}
	62%{left:336px;top:-20px;}
	69%{left:230px;top:80px;}
	70.5%{left:200px;top:88px;}
	75%{left:136px;top:36px;}
	77%{left:131px;top:12px;}
	78%{left:170px;top:-12px;}
	82%{left:232px;top:6px;}
	84%{left:260px;top:42px;}
	89%{left:234px;top:110px;}
	96%{left:103px;top:112px;}
	100%{left:103px;top:112px;}
}
@keyframes swirl9{
	0%{left:336px;top:-20px;}
	64%{left:336px;top:-20px;}
	71%{left:230px;top:80px;}
	72.5%{left:200px;top:88px;}
	77%{left:136px;top:36px;}
	79%{left:131px;top:12px;}
	80%{left:170px;top:-12px;}
	84%{left:232px;top:6px;}
	86%{left:260px;top:42px;}
	91%{left:234px;top:110px;}
	98%{left:111px;top:111px;}
	100%{left:111px;top:111px;}
}
@keyframes swirl10{
	0%{left:336px;top:-20px;}
	66%{left:336px;top:-20px;}
	73%{left:230px;top:80px;}
	74.5%{left:200px;top:88px;}
	79%{left:136px;top:36px;}
	81%{left:131px;top:12px;}
	82%{left:170px;top:-12px;}
	86%{left:232px;top:6px;}
	88%{left:260px;top:42px;}
	93%{left:234px;top:110px;}
	100%{left:117px;top:109px;}
}
@keyframes fall{
	0%{top:-90px;}
	90%{top:-90px;}
	100%{top:85px;}
}
@keyframes pop{
	0%{left:-25px;}
	95%{left:-25px;}
	100%{left:88px;}
}
@keyframes cap{
	0%{left:336px;top:91px;transform:rotate(-40deg);}
	75%{left:336px;top:91px;}
	84.5%{left:132px;top:19px;transform:rotate(-40deg);}
	85.5%{left:114px;top:0;}
	86.5%{left:115px;top:-25px;}
	88%{left:150px;top:-43px;}
	90%{left:204px;top:-60px;}
	92%{left:235px;top:-17px;transform:rotate(380deg);}
	98%{transform:rotate(360deg);}
	100%{left:77px;top:31px;transform:rotate(360deg);}
	
}
@keyframes alive{
	0%{right:1px;top:1px;opacity:0}
	58%{opacity:0}
	60%{opacity:1;}
	62%{opacity:0;}
	64%{right:1px;top:1px;opacity:1;}
	67%{right:4px;top:3px;}
	69%{right:4px;top:1px;}
	100%{right:1px;top:1px;opacity:1;}
}
@keyframes light{
	0%{color:#fff;}
	90%{color:#fff;}
	100%{color:#fcb040;}
}
@keyframes spin{
	0%{opacity:0;}
	95%{opacity:0;}
	100%{opacity:1;}
}