@charset "UTF-8";
/* CSS Document */

html{
	margin:0;
	padding:0;
	height:auto;
}

body{
	height:100%;
	width:100%;
	padding:0;
	margin:auto;
	background-image: url("store_right.jpg");
	background-color:#949a8e;
	background-repeat:repeat-x;
}
a{
	padding:0;
	margin:0;
}
main{
	height:100%;
	min-width:1313px;
}
table{
	height:100%;
	
}
table, tr, td{
	border:0;
	margin:0 auto;
	padding:0;
	border-collapse: collapse;
}
.p{
	font-family: "Courier New", "monospace";
	font-size:11pt;
	line-height: 22pt;
}
ul{
	text-align: left;
}
.left{
	background-image: url("left.jpg");
	background-size:contain;
	min-width:70px;
}
.middle{
	background-image: url("middle_unlit.jpg");
	background-size:contain;
	height:100%;
	min-width:250px;
	top:0;
	left:0;
}
.right{
	background-image: url("right.jpg");
	background-size:contain;
	height:100%;
	min-width: 993px;
}

@keyframes blink{
	0% {opacity:0;}
	24% {opacity:0;}
	25%  {opacity:1;}
	99%  {opacity:1;}
	100% {opacity:0;}
}

.neon{
	overflow:hidden;
	animation: blink 2s infinite forwards;
}

/*page2*/
.store{
	max-width:1313px;
	min-height:750px;
	background-image: url("store.jpg");
	background-size: contain;
	background-repeat:none;
}
.jars{
	max-width:910px;
	height:inherit;
	transform:translateY(2px);
}
.desc{
	transform:translateY(10px);
	width:360px;
	padding:30px;
	padding-top:0;
}
.tess{
	width:900px;
	height:370px;
	padding:0;
}
#pic{
	width:300px;
	height: 300px;
	transform: translate(485px, 75px);
}
#poster{
	visibility: hidden;
	transform:translate(-1000px,-660px);
	width:400px;
	height:525px;
	background-color: white;
	border:solid;
	border-width: 1px;
	border-color: black;
	text-align: center;
	justify-content: center;
}
#poster2{
	visibility: hidden;
	transform:translate(-1500px,-660px);
	width:400px;
	height:525px;
	background-color: white;
	border:solid;
	border-width: 1px;
	border-color: black;
	text-align: center;
	justify-content: center;
}
#poster3{
	visibility: hidden;
	transform:translate(-1000px,-660px);
	width:400px;
	height:525px;
	background-color: white;
	border:solid;
	border-width: 1px;
	border-color: black;
	text-align: center;
	justify-content: center;
}
#poster4{
	visibility: hidden;
	transform:translate(-1000px,-660px);
	width:400px;
	height:525px;
	background-color: white;
	border:solid;
	border-width: 1px;
	border-color: black;
	text-align: center;
	justify-content: center;
}
#poster5{
	visibility: hidden;
	transform:translate(-1000px,-660px);
	width:400px;
	height:525px;
	background-color: white;
	border:solid;
	border-width: 1px;
	border-color: black;
	text-align: center;
	justify-content: center;
}
#jar1, #jar2, #jar2, #jar4, #jar5{
	transform:translateY(0px);
}
@keyframes shakeJar{
	from{transform:rotate(-2deg);}
	to{transform:rotate(2deg);}
}
#td1, #td2, #td3, #td4, #td5{
	transform-origin: 60% 60%;
}
#td5{
	animation: shakeJar .125s alternate infinite;
}
#h1{
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size:24pt;
	color:blue;
	font-style: italic;
}
#h2{
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size:24pt;
	color:fuchsia;
	font-style: italic;
}
#h3{
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size:24pt;
	color:blue;
	font-style: italic;
}
#h4{
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size:24pt;
	color:fuchsia;
	font-style: italic;
}
#h5{
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size:24pt;
	color:lawngreen;
	font-style: italic;
}
.card{
}
.ok1{
	background-color:white;
	transform:translateY(-400px);
	width:100%;
	min-width: 100%;
	padding:10px
}