/******************************************
Replace with your custom spritesheet name
******************************************/
.sprite {
	background: url("spritesheet_lock.png") no-repeat;
}
/************************************
 Used by unified index.html + main.js
 DO NOT TOUCH.
 ***********************************/

/* The 5 end screen shapes */
.triangle1 {
	background-position: 0px 0px;
	width: 60px;
	height: 90px;
	-ms-transform-origin: 15px 15px;
	-webkit-transform-origin: 15px 15px;
	transform-origin: 15px 15px;
}
.triangle2 {
	background-position: -60px 0px;
	width: 90px;
	height: 90px;
	-ms-transform-origin: 15px 15px;
	-webkit-transform-origin: 15px 15px;
	transform-origin: 15px 15px;
}
.triangle3 {
	background-position: 0px -90px;
	width: 150px;
	height: 90px;
	-ms-transform-origin: 15px 15px;
	-webkit-transform-origin: 15px 15px;
	transform-origin: 15px 15px;
}
.diamond {
	background-position: -151px -120px;
	width: 90px;
	height: 90px;
	-ms-transform-origin: 45px 45px;
	-webkit-transform-origin: 45px 45px;
	transform-origin: 45px 45px;
}
.parallelogram {
	background-position: -150px 0px;
	width: 60px;
	height: 120px;
	-ms-transform-origin: 15px 15px;
	-webkit-transform-origin: 15px 15px;
	transform-origin: 15px 15px;
}
.logoColored {
	background-position: -5px -180px;
	left: 18px;
	top: 218px;
	width: 63px;
	height: 22px;
	opacity: 1;
}
.logoWhite {
	background-position: -80px -180px;
	left: 18px;
	top: 218px;
	width: 63px;
	height: 22px;
	opacity: 0;
}
/* The 4 CTA button shapes */
.ctaTriLeft {
	background-position: -400px -15px;
	left: -28px;
	top: 145px;
	width: 53px;
	height: 53px;
	opacity: 0;
}
.ctaPara {
	background-position: -240px -15px;
	left: -2px;
	top: 129px;
	width: 152px;
	height: 54px;
	opacity: 0;
}
.ctaTriRight {
	background-position: -400px -75px;
	left: 136px;
	top: 104px;
	width: 53px;
	height: 53px;
	opacity: 0;
}
.ctaRect {
	background-position: -240px -75px;
	left: 14px;
	top: 129px;
	width: 152px;
	height: 54px;
	opacity: 0;
}
/***********************************
 PLACE YOUR CUSTOM SPRITE CSS BELOW
 .sampleName is safe to delete
 **********************************/
 
 /*clock main*/

.part0 {
	background-position: -19px -275px;
	width: 54px;
	height: 56px;
	opacity: 0;
}
.part1 {
	background-position: -80px -303px;
	width: 54px;
	height: 28px;
	opacity: 0;
}
.part2 {
	background-position: -143px -247px;
	width: 27px;
	height: 56px;
	opacity: 0;
}
.part3 {
	background-position: -205px -279px;
	width: 14px;
	height: 12px;
	opacity: 0;
}
.part4 {
	background-position: -219px -255px;
	width: 22px;
	height: 12px;
	opacity: 0;
}
.part5 {
	background-position: -252px -257px;
	width: 20px;
	height: 10px;
	opacity: 0;
}
.part6 {
	background-position: -299px -249px;
	width: 22px;
	height: 12px;
	opacity: 0;
}
.part7 {
	background-position: -329px -275px;
	width: 14px;
	height: 12px;
	opacity: 0;
}
.topLockSprite {
	background-position: -367px -285px;
	width: 44px;
	height: 36px;
	left: 174px;
	top: 139px;
	opacity: 0;
}