body{
	font-family: Arial;
	color: black;
    background-color: white;
	text-align: center;
	background-attachment: fixed;
}
body.ny{
	color: white;
	background-image: url("assets/pics/ny_background.png");
}
body.croissant{
	background-image: url("assets/pics/cwahsont.png");
}
body.november{
	background-image: url("assets/pics/november_bg.png");
}
body.boxing{
	background-image: url("assets/pics/boxing_bg.png");
}
body.leap{
	background-image: url("assets/pics/leap_bg.png");
}
body.sbuns{
	background-image: url("assets/pics/sbuns_bg.png");
}
body.alone{
	background-image: url("assets/pics/alone_bg.png");
}
div.upside_down{
	transform: rotate(180deg);
}
div.centered{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	text-align: center;
}
div.url_block{
	display: inline-block;
	width: 40%;
	text-align: center;
	vertical-align: middle;
}
div.url_block_container{
	margin-top: 20px;
	margin-bottom: 20px;
	width: 550px;
}
div.logo_anniversary{
	background-image: url("assets/pics/vcw_anniversary.png");
	background-repeat: no-repeat;
	width: 420px;
	height: 139px;
	margin: auto;
}
div.logo_ny{
	background-image: url("assets/pics/vcw_ny.png");
	width: 656px;
	height: 245px;
	margin: auto;
}
div.logo{
	background-image: url("assets/pics/vcw.png");
	width: 291px;
	height: 119px;
}
div.logo_xmas{
	background-image: url("assets/pics/vcw_xmas.png");
}
div.logo_easter{
	background-image: url("assets/pics/easter.png");
	width: 354px;
	height: 149px;
}
div.logo, div.logo_xmas, div.logo_easter{
	margin: auto;
	margin-top: 20px;
}
div.spotlight{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	pointer-events: none;
	visibility: hidden;
}
div.switch{
	width: 62px;
	height: 97px;
	background-image: url("assets/pics/switch_off.png");
	position: fixed;
	top: 24px;
	right: 24px;
	cursor: pointer;
}
p{
	width: 800px;
	margin: auto;
	margin-top: 10px;
	margin-bottom: 10px;
}
div.guestbook{
	width: 420px;
	margin: auto;
}
div.guestbook_left{
	width: 100%;
	margin: auto;
	text-align: left;
	font-weight: bold;
	font-style: italic;
	margin-top: 20px;
}
div.guestbook_right{
	width: 100%;
	margin: auto;
	text-align: right;
	margin-bottom: 30px;
}
table.guestbook_submit{
	width: 100%;
	margin: auto;
}
a{
	color: black;
}
a:hover{
	color: grey;
}
.button{
	background: url("instants/butt1.png");
	width: 100px;
	height: 100px;
	cursor: pointer;
	background-size: cover;
	border: none;
	margin: auto;
	margin-top: 24px;
	margin-bottom: 24px;
}
.button:hover{
	background: url("instants/butt2.png");
	background-size: cover;
}
.button:active{
	background: url("instants/butt3.png");
	background-size: cover;
}
div.image{
	border: 3px black solid;
	width: max-content;
	max-width: 600px;
	margin: auto;
}
#kilroy{
	background-image: url("assets/pics/kilroy.png");
	width: 179px;
	height: 106px;
	position: fixed;
	right: 0px;
	bottom: 0px;
	visibility: hidden;
	cursor: pointer;
}
#kilroy:active{
	background-image: url("assets/pics/kilroy_clicked.png");
}
#creator{
	background-image: url("assets/pics/creator_closed.png");
	cursor: pointer;
	width: 158px;
	height: 313px;
	position: fixed;
	left: 15%;
	bottom: -20px;
	visibility: hidden;
}
ul.menu{
	padding-left: 0px;
	list-style: none;
	margin-top: 10px;
	margin-bottom: 10px;
}
ul.menu li{
	display: inline-block;
}
ul.menu li:after{
	content: " |";
}
ul.menu li:last-child:after{
	content: "";
}
ul.menu li a{
	text-decoration: none;
}
body.ny a{
	color: white;
}
body.ny a:hover{
	color: pink;
}	
body.ny a:active{
	color: red;
}
hr{
	margin-top: 16px;
	margin-bottom: 16px;
	width: 200px;
	border: 1px black solid;
}
body.ny hr{
	border-color: white;
}
body.ny div.main,body.ny #heading_top{
	margin-top: -30px;
}
div.confetti_container{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	pointer-events: none;
}
@keyframes confetti_rotate_anim{
	from {transform: rotate(0deg);}
	to {transform: rotate(360deg);}
}
@keyframes confetti_move_anim{
	0% {transform: translateX(0px) translateY(-4%);}
	22% {transform: translateX(10px) translateY(22%);}
	44% {transform: translateX(0px) translateY(44%);}
	66% {transform: translateX(-10px) translateY(66%);}
	88% {transform: translateX(0px) translateY(88%);}
	100% {transform: translateX(10px) translateY(100%);}
}
div.confetti_rotate{
	width: 8px;
	height: 18px;
	background-color: #f0f;
	position: absolute;
	top: 0px;
	left: 0px;
	animation-name: confetti_rotate_anim;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
div.confetti_rotate.snow{
	width: 6px;
	height: 6px;
	background-color: #fff;
	border-radius: 8px;
	border: 1px black solid;
	animation-name: none;
}
div.confetti_move{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	animation-name: confetti_move_anim;
	animation-duration: 4s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
h3.main{
	margin-top: 10px;
	margin-bottom: 2px;
}
#tux{
	width: 154px;
	height: 178px;
	background-image: url("assets/pics/tux_small.png");
	position: fixed;
	left: 12px;
	bottom: -14px;
	cursor: pointer;
}
#dub{
	width: 93px;
	height: 95px;
	background-image: url("assets/pics/dubby_doo.png");
	position: fixed;
	top: 16px;
	left: 16px;
	cursor: pointer;
	transition-duration: 0.3s;
}
#dub:hover{
	transform: scale(1.1);
}
#tagline, #describer{
	font-style: italic;
	margin-top: 16px;
	margin-bottom: 0px;
}
#main_selector{
	width: 800px;
	margin-bottom: 20px;
}
#sitle, #visitors_heading{
	margin-top: 0px;
	margin-bottom: 10px;
}
#hardcore{
	margin-top: 16px;
	margin-bottom: 16px;
}
#hardcore_image{
	display: block;
	margin: auto;
	margin-bottom: 16px;
	border-radius: 50%;
	animation-name: three_sixty;
	animation-duration: 1.8s;
	animation-play-state: paused;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	pointer-events: none;
}
@keyframes three_sixty{
	from{
		transform: rotate(0deg);
	}
	to{
		transform: rotate(360deg);
	}
}
#hardcore_image, #hardcore_audio{
	width: 300px;
}
#hardcore_list{
	font-size: 13px;
	width: 550px;
	margin: auto;
}
#hardcore_list li{
	width: 80px;
}
#hardcore_iframe{
	width: 640px;
	height: 360px;
}
#visitors img{
	pointer-events: none;
	width: 34px;
}
body.ny #visitors img{
	filter: invert(100%);
}
#go_back_link{
	margin-bottom: 32px;
	display: inline-block;
}
#affiliates{
	width: 800px;
	text-align: center;
	margin: auto;
	margin-bottom: 16px;
}
#affiliates td{
	width: 33%;
}
#input_message{
	resize: none;
	width: 100%;
	height: 55px;
}
#drawing_canvas{
	border: 1px black solid;
	display: block;
	margin: auto;
	margin-bottom: 8px;
	cursor: crosshair;
	touch-action: none;
}
#drawing_canvas_mirror{
	display: none;
}
#drawing_tools{
	text-align: center;
	margin: auto;
	margin-bottom: 16px;
}
#drawing_gallery{
	width: 600px;
	margin: auto;
	margin-bottom: 16px;
}
#drawing_gallery img{
	width: 100px;
	border: 1px solid black;
	margin-left: 4px;
	margin-right: 4px;
}
#drawing_gallery img:hover{
	border-color: grey;
}
#brush_size{
	display: inline-block;
}
#brush_size_text{
	display: inline-block;
	margin-bottom: -24px;
	width: 48px;
}
#music figure{
	width: 250px;
	display: inline-block;
	vertical-align: top;
	margin: 16px;
}
#music figcaption{
	padding-top: 8px;
	padding-bottom: 8px;
	font-weight: bold;
	font-style: italic;
}
#music p{
	width: 100%;
	margin-top: 0px;
}
#music a{
	text-decoration: none;
}
ol{
	list-style-position: inside;
	padding-left: 0px;
}
ol li span{
	cursor: pointer;
}
ol li::marker{
	font-weight: bold;
}
ol li span:hover{
	color: grey;
}
@media (min-width: 768px){
	#main{
		overflow: hidden;
	}
}
@media (max-width: 767px){
	#main_selector{
		width: 100%;
	}
	p{
		width: 100%;
	}
	#kilroy, #creator, #tux, #dub, #switch{
		visibility: hidden;
	}
	#hardcore_iframe{
		width: 98%;
	}
	#hardcore_list{
		width: 100%;
	}
	#drawing_gallery{
		width: 100%;
	}
	#drawing_tools_brush_types{
		text-align: left;
	}
	#drawing_tools_brush_types span{
		display: block;
	}
	div.guestbook{
		width: 100%;
	}
	.mobile_unfriendly{
		display: none !important;
	}
}