.moveable {
	position: absolute; display: block; overflow: hidden;
}

body {
	width: 1920px;
	height: 1080px;
	margin: 0;
	background-repeat: no-repeat;
	font-family: 'Montserrat', sans-serif;
	opacity: 0;
	/* background: url("unknown.png") no-repeat; */
	/* background: #464646; */
        /* border-right: 1px solid red; */
        /* border-bottom: 1px solid red; */

	/* Boiler Boss Fight Layout */
	/* background: url("boiler_low_res.png") no-repeat;
	background-size: 1920px 1080px;
	background-position-y: -3px; */
}

#highestDonation {
	height: 50px;
	opacity: 1;
	top: 15px;
	left: 110px;
	width: 0px;
	background: -webkit-linear-gradient(#f8ec08, #dfd634);
}

#highestDonationName {
	top: 16px;
	left: 990px;
	text-align: left;
	width: 760px;
	text-overflow: ellipsis;
}

#highestDonationAmount {
	top: 16px;
	left: 280px;
	width: 700px;
	text-align: right;
	padding-right: 5px;
}

#highestDonationName, #highestDonationAmount {
	opacity: 0;
	font-size: 35px;
	/*font-style: italic;*/
	font-weight: 900;
	background: -webkit-linear-gradient(300deg, rgb(255, 255, 255), rgb(249, 238, 196) 46.22%, #e6d54f 51.68%, rgb(243, 216, 66) 73.95%, rgb(254, 215, 34) 80.25%, #ecc948);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;}

div#nameBG {
	border: 1px solid red;
	width: 410px;
	height: 44px;
	left: 15px;
	top: 490px;
	background: -webkit-linear-gradient(#f8ec08, #dfd634);
	border-bottom: 3px solid #3456df;
}

div#tffc-blue {
	width: 404px;
	height: 75px;
	left: 0px;
	top: -28px;
	background: url("tffc_blue.png");
}

div#name {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	text-shadow: 1px 1px 2px #000;
	text-align: left;
	font-size: 21px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 4px;
	left: 88px;
	top: 1046px;
	color: #fff;
	width: 1000px;
	height: 45px;
	opacity: 1;
}

div#facecam {
	width: 396px;
	height: 297px;
	top: 90px;
	left: 17px;
	opacity: 0;
  border: 4px solid;
  border-image: radial-gradient(#198cff, #fff) 2;
}

.overlay-label {
  width: 384px;
  height: 33px;
  transition: transform 250ms ease;
}

.donationAmount, .highestDonationAmount {
	transition: transform 250ms ease, opacity 250ms ease, background-color 2s ease;
	opacity: 0;
	font-size: 30px;
	font-weight: 900;
	float: left;
	margin-top: 8px;
	padding-left: 10px;
	/* background: rgba(255, 255, 255, 1); */
}

.donationAmount, .donorName {
	padding-right: 2px;
	/* background: -webkit-linear-gradient(300deg, rgb(255, 255, 255), rgb(249, 238, 196) 46.22%, #e6d54f 51.68%, rgb(243, 216, 66) 73.95%, rgb(254, 215, 34) 80.25%, #ecc948); */
	/* -webkit-background-clip: text; */
	/* -webkit-text-fill-color: transparent; */
	color: #fff;
}

#donBar {
	top: 1px;
	left: 440px;
	width: 1310px;
	height: 40px;
	padding: 10px;
	text-overflow: clip;
}

#recentDonationsLabelContainer {
	top: 15px;
	left: 110px;
	width: 1639px;
	height: 45px;
	text-overflow: clip;
}


.recentDonation {
	height: 30px;
	margin-right: 5px;
	float: left;
	height: 50px;
}

#highestDonationLabelContainer {
	width: 1639px;
	height: 45px;
	text-overflow: clip;
}

#highestLabel {
	left: 660px;
	width: 229px;
}

#hDonationLabel {
	left: 840px;
	width: 270px;
}

.highest-donation-text {
	font-size: 40px;
	font-weight: 900;
}

.recentDonorNameBG, .highestDonorNameBG {
	transition: transform 250ms ease, opacity 250ms ease;
}

.donorName, .highestDonorName {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 45px;
	font-weight: 400;
	float: left;
	margin-top: 8px;
	padding-left: 5px;
	font-size: 41px;
	opacity: 0;
	transition: background-color 2s ease;
	/* background-color: rgba(255, 255, 255, 1); */
}

div#logo {
	width: 125px;
	height: 125px;
	background-image: url("tffc_logo.png");
	background-repeat: no-repeat;
	top: 932px;
	left: 149px;
	opacity: 1;
	background-size: 125px 125px;
	background-color: rgba(0, 0, 0, 0.7);
}

div#recentDonations {
	color: #fff;
	font-size: 40px;
	text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
	height: 40px;
	width: 4000px;
	top: 3px;
	opacity: 0;
	font-weight: 600;
}

div#updateBG {
	width: 593px;
	height: 100px;
	opacity: 1;
	top: 945px;
	left: 285px;
	background: rgba(0, 0, 0, 0);
}

div#update {
	text-align: center;
	color: #fff;
	font-size: 30px;
	text-shadow: 0px 0px 5px #000;
	font-weight: 700;
	top: 940px;
        left: 287px;
	padding-left: 5px;
	padding-right: 5px;
	opacity: 1;
}

div#information {
	/* width: 1236px; */
	/* height: 100px; */
	font-weight: 400;
	top: 978px;
	left: 283px;
	padding-top: 5px;
	padding-left: 10px;
	font-size: 30px;
	color: #fff;
	text-shadow: 0px 0px 5px #000;
	padding: 10px;
	margin: 5px;
	background: rgba(0, 0, 0, 0.7);
}

div#left {
	color: rgba(255, 60, 120, 0.75);
	font-size: 30px;
	text-align: center;
	font-weight: bold;
	background: #fff;
	top: 0px;
	width: 625px;
	height: 45px;
}

div#right {
	color: #fff;
	font-size: 30px;
	text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
	top: 3px;
	left: 625px;
	width: 625px;
	height: 45px;
	text-align: center;
}

div#highlight {
	top: 9px;
	left: 96px;
	width: 1666px;
	height: 50px;
	background: linear-gradient(#000, #000);
	border: 5px solid #fff;
	border-radius: 50px;
	box-shadow: 0px 0px 10px #fff;
	opacity: 0;

}

div#highlight2 {
	top: 15px;
	left: 110px;
	width: 1639px;
	height: 45px;
	background: #fff;
	opacity: 0;
}

div#highlightText {
	left: 110px;
	top: 17px;
	font-weight: 900;
	/* font-style: italic; */
	/* text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.6); */
	color: #fff;
	font-size: 35px;
	width: 1639px;
	text-align: center;
	opacity: 0;
}

#recentLabel {
	left: 570px;
	top: -6px;
	width: 200px;
	font-size: 45px;
	/*font-style: italic;*/
	font-weight: 900;
	text-align: center;
	background: -webkit-linear-gradient(rgb(243, 232, 16), rgb(230, 221, 38));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-align: center;
	opacity: 0;
}

#donationsLabel {
	left: 770px;
	top: -6px;
	width: 300px;
	font-size: 45px;
	/*font-style: italic;*/
	font-weight: 900;
	text-align: center;
	background: -webkit-linear-gradient(rgb(243, 232, 16), rgb(230, 221, 38));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-align: center;
	opacity: 0;
}

#totalRaised {
	top: 2px;
	left: 4px;
	font-size: 35px;
	font-weight: 800;
	width: 1310px;
	text-align: left;
	height: 48px;
	padding-left: 10px;
	background: -webkit-linear-gradient(rgb(255, 255, 255), rgb(249, 238, 196) 46.22%, #e6d54f 51.68%, rgb(243, 216, 66) 73.95%, rgb(254, 215, 34) 80.25%, #ecc948);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
        color: #fff;
        /* text-shadow: 1px 1px 4px #000; */
}

#goal {
 top: 2px;
 font-size: 35px;
 font-weight: 800;
 width: 1300px;
 text-align: right;
 margin-right: 100px;
 height: 48px;
 background: -webkit-linear-gradient(rgb(255, 255, 255), rgb(249, 238, 196) 46.22%, #e6d54f 51.68%, rgb(243, 216, 66) 73.95%, rgb(254, 215, 34) 80.25%, #ecc948);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}

#totalRaisedCombined {
	top: 15px;
	left: 440px;
	width: 1310px;
	height: 45px;
	opacity: 0;
}

div#fundraisingFor, div#donateLink {
        top: 10px;
        /* left: 310px; */
        font-size: 30px;
        font-weight: 700;
	color: #000;
        opacity: 0;
        width: 1666px;
        height: 50px;
	color: #fff;
        text-align: center;	
	/* background: rgba(0, 0, 0, 0.25); */
	/*text-shadow: 0px 0px 4px #000;*/
        /*background: -webkit-linear-gradient(rgb(255, 255, 255), rgb(249, 238, 196) 46.22%, #e6d54f 51.68%, rgb(243, 216, 66) 73.95%, rgb(254, 215, 34) 80.25%, #ecc948);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;*/
}

div#none {
	top: 15px;
	left: 440px;
	font-size: 35px;
	font-weight: 700;
	background: -webkit-linear-gradient(rgb(255, 255, 255), rgb(249, 238, 196) 46.22%, #e6d54f 51.68%, rgb(243, 216, 66) 73.95%, rgb(254, 215, 34) 80.25%, #ecc948);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	opacity: 0;
	width: 1310px;
	height: 50px;
	text-align: center;
}

div#hospitalLogo {
	/* left: 100px; */
	width: 223px;
	height: 60px;
	background-image: url("https://www.arnoldpalmerhospital.com/-/media/logos/aph/oh-arnold-palmer-hospital-2022__hor_rgb-300px.png");
	background-repeat: no-repeat;
	opacity: 0;
	/* top: 9px; */
	background-size: 200px;
        background-color: rgba(255, 255, 255, 0.85);
	background-position: center;
}

div#extra-life-logo {
	width: 223px;
	height: 60px;
	/* top: 9px; */
	/* left: 100px; */
	transform: scale(1);
	background-image: url("ExtraLife_logo_RGB.png");
	background-repeat: no-repeat;
	background-color: rgba(255, 255, 255, 0.85);
	background-position-x: center;
	background-position-y: center;
	opacity: 0;
}

div.logo-loop {
        transition: transform 500ms ease-in-out;
}

div#message {
	word-break: normal;
	width: 1639px;
	opacity: 0;
	top: 80px;
	left: 110px;
	font-size: 40px;
	font-weight: bold;
	color: #fff;
	text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
	padding: 5px;
	text-align: center;
	background: rgba(0, 0, 0, 0.5);
}

div#newFollower {
	opacity: 0;
	top: 502px;
	left: 30px;
	width: 0px;
	height: 40px;
	font-family: "Quicksand", sans-serif;
	font-weight: 800;
	font-style: italic;
	font-size: 30px;
	text-align: center;
	color: #fff;
	background: rgba(0, 0, 0, 0.75);
	text-shadow: 1px 1px 5px #000;
	transition: all 500ms cubic-bezier(0.460, 0.025, 0.000, 0.925);
}

div#newFollowerNotice {
	opacity: 0;
	top: 502px;
	left: 30px;
	width: 0px;
	height: 46px;
	font-family: "Quicksand", sans-serif;
	font-weight: 800;
	font-style: italic;
	font-size: 35px;
	text-align: center;
	color: #fff;
	text-shadow: 1px 1px 5px #000;
	transition: all 500ms cubic-bezier(0.460, 0.025, 0.000, 0.925);
	white-space: nowrap;
}

div#newFollowerNoticeBG {
	opacity: 0;
	top: 502px;
	left: 30px;
	width: 0px;
	height: 46px;
	font-family: "Quicksand", sans-serif;
	font-weight: 800;
	font-style: italic;
	font-size: 35px;
	text-align: center;
	color: #fff;
	background: rgba(0, 0, 0, 0.75);
	text-shadow: 1px 1px 5px #000;
	transition: all 500ms cubic-bezier(0.460, 0.025, 0.000, 0.925);
	white-space: nowrap;
}

div#omnibar-background {
	top: 9px;
	left: 96px;
	width: 1666px;
	height: 59px;
	background: -webkit-linear-gradient(rgba(255, 202, 0, 0.5), rgba(255, 255, 255, 0.375));
	/* border-bottom: 5px solid #001a80; */
	box-shadow: 0px 0px 10px #fbd442;
	/* opacity: 0.5; */
	border-radius: 50px;
}

div#omnibar {
	top: 10px;
	left: 440px;
	width: 1310px;
	height: 45px;
	background: rgba(29, 29, 29, 0.85);
	border: 5px solid white;
	border-radius: 30px;
	box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.5);
	opacity: 0;
}


div#progressBarBackground {
	top: 15px;
	left: 440px;
	width: 1310px;
	height: 45px;
	background: #6a5f00;
	border: 1px solid #fff;
	border-radius: 50px;
}

div#progressBar {
	/* top: 15px; */
	/* left: 445px; */
	width: 0px;
	height: 45px;
	background: linear-gradient(143deg, #007dff, rgb(203, 220, 237) 29.83%, rgb(66, 152, 237) 92.44%, #4398e1);
	border-radius: 5px 0px 0px 5px;
	opacity: 0;
}

div#brushContainer {
	top: 15px;
	left: 440px;
	width: 1310px;
	height: 45px;
	opacity: 0;
}

span#progressBarBrush {
	background: url("progress-bar-brush.png") no-repeat;
	display: block;
	width: 17px;
	height: 45px;
	opacity : 0;
}

.showUpdate {
	transform: translateX(627px) scaleX(1251);
	transition: transform 0.25s;
}

.newFollowerNoticeIn {
	width: 1015px;
}

.newFollowerNoticeOut {
	transform: scaleY(0);
}

#work-in-progress {
	font-size: 45px;
	font-weight: 900;
	color: rgba(255, 255, 255, 0.5);
	left: 10px;
}

#wip-date {
	font-size: 20px;
	font-weight: 700px;
	color: rgba(255, 255, 255, 0.5);
	top: 60px;
	left: 13px;
}
div#in-vc {
	top: 550px;
	left: 20px;
	font-size: 20px;
}

div.in-vc {
	color: #f1cc44;
	font-weight: 900;
	text-shadow: 1px 1px 2px #000;
	font-size: 21px;
}

div#activityBG {
	background: rgba(255, 255, 255, 0.8);
	width: 920px;
	height: 50px;
	top: 800px;
	left: 1000px;
	border-radius: 15px 0px 0px 15px;
}

div#socials {
	color: rgba(255, 255, 255, 1);
	top: 80px;
	left: 95px;
	font-size: 30px;
	text-shadow: 1px 1px 3px rgba(0, 0, 0, 1);
	width: 1000px;
	height: 100px;
	opacity: 0;
}

div#twitch, div#youtube, div#twitter {
	padding-left: 5px;
	opacity: 0;
}

div#twitch {
	/* background: #9146FF; */
	/* border-bottom: 4px solid #9146FF; */
	background: url('TwitchGlitchPurple.png');
	width: 1000px;
	height: 50px;
	background-size: 30px 35px;
	background-repeat: no-repeat;
	padding-left: 40px;
}

div#youtube {
	/* background: #F00; */
	/* border-bottom: 4px solid #F00; */
	background: url('yt_logo_rgb_light.png');
	width: 1000px;
	height: 50px;
	background-size: 50px 35px;
	background-repeat: no-repeat;
	padding-left: 60px;
}

div#twitter {
	/* background: #1DA1F2; */
	/* border-bottom: 4px solid #1DA1F2; */
	background: url('Twitter_social_icons-rounded_square-blue.png');
	width: 1000px;
	height: 50px;
	background-size: 30px 30px;
	background-repeat: no-repeat;
	padding-left: 50px;
	background-position-x: 10px;
	background-position-y: 4px;

}

div#omnibar-label {
	width: 118px;
	height: 45px;
	/* background: #001a80; */
	left: 321px;
	top: 15px;
	color: #fff;
}
div#omnibar-label-text {
	opacity: 0;
	position: relative;
	top: 5px;
	text-align: center;
	font-weight: 600;
	text-transform: uppercase;
	color: #000;
}

div#omnibar-image {
	width: 200px;
	height: 45px;
	top: 14px;
	left: 108px;
}

div#shine, div#shineHighlight {
	width: 23px;
	height: 120px;
	background: rgb(255, 255, 255);
	transform: rotate(45deg);
	transform-origin: center;
	top: -25px;
	opacity: 1;
	left: -62px;
}

div#giveawayBG {
	width: 800px;
	height: 280px;
	background: rgba(0, 0, 0, 0.75);
	opacity: 0;
	left: 550px;
	top: 170px;
}

div#giveaway {
	width: 1698px;
	height: 592px;
	background-image: url("ToonFest2020_Unique_Sunglasses_transparent.png");
	background-repeat: no-repeat;
	opacity: 0;
}

div#giveawayDetails {
	left: 710px;
	top: 450px;
	color: #fff;
	font-weight: 500;
	letter-spacing: 5px;
	opacity: 0;
	text-shadow: 0px 0px 4px rgba(255, 255, 255, 0.75);
	background: rgba(0, 0, 0, 0.75);
	padding: 5px;
}

div#giveawayHeader {
	font-size: 60px;
	font-weight: 800;
	color: #fff;
	top: 100px;
	left: 600px;
	opacity: 0;
	text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.75);
	background: rgba(0, 0, 0, 0.75);
}

div#ttrLogo {
	background-image: url("TTR_logo.png");
	background-repeat: no-repeat;
	width: 97px;
	height: 45px;
	left: 1230px;
	top: 400px;
	opacity: 0;
}
div#counter {
	top: 945px;
	left: 900px;
	color: #fff;
	margin: auto;
	background: rgba(0, 0, 0, 0.25);
	text-align: center;
	padding-left: 10px;
	padding-right: 10px;
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.75);
}
div#counterName {
	font-weight: bold;
	font-size: 20px;
	transform: translateY(5px) translateX(-7px) rotate(-5deg);
}
div#counterNumber {
	font-size: 60px;
}
