
.container > .content
	{
		max-height: 100%;
		overflow-x: hidden;
		overflow-y: auto;
		padding: 15px 15px;
	}


video.videobg
	{
		position: fixed;
		bottom: 0px;
		right: 0px;
		min-width: 100%;
		min-height: 100%;
	}

video.videobg.portrait
	{
		max-width: 100%;
		min-height: initial;
	}


@media ( min-aspect-ratio: 1/1 )
	{
		video.videobg.portrait
			{
				display: none;
			}
	}

@media ( max-aspect-ratio: 1/1 )
	{
		video.videobg.landscape
			{
				display: none;
			}
	}


.campaign .easter .overlay > :not(.egg)
	{
		position: absolute;
		left: 0px;
		bottom: 0px;
		width: 100%;
		min-width: 470px;
		max-width: 470px;
    }

.campaign > .layout-container
	{
		overflow: hidden;
	}

.campaign:not(.eggme) .easter .egg
	{
		display: none;
	}

.campaign:nth-child(even) .easter .overlay > :not(.egg)
	{
		transform: scaleX( -1 );
	}

.campaign .latest,
.campaign .button
	{
		display: none;
	}

.content .campaign > .layout-container
	{
		background-color: rgba( 0, 0, 0, 0.4 );
	}

body
	{
		background-color: rgb(209 215 225);
		background-position: bottom;
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-size: cover;
	}

body > .container
	{
		background-color: initial;
		opacity: 0.95;
	}

.campaign:not(.visible)
	{
		visibility: hidden;
	}

.campaign .egg
	{

		position: absolute;
/*
		transition: left 0.5s ease-in-out;
		transition: bottom 0.5s ease-in-out;
		transition: transform 0.5s ease-in-out;
		transition: width 0.5s ease-in-out;
		transition: height 0.5s ease-in-out;
*/
		transition: all 0.5s ease-in-out;

		transform: rotate(-15deg);
		z-index: 7;

		width: 40px;
		height: 40px;

		bottom: 12px;
		left: 280px;

		background-image: url(/graphics/easter/eggs/egg-01.png);
		background-repeat: no-repeat;
		background-size: cover;
	}

.campaign .egg.layer
	{
		cursor: pointer;
		z-index: 12;
		background-image: none;
	}

.campaign:nth-child(even) .egg
	{
		transform: rotate(33deg);
		right: initial;
		bottom: 8px;
		left: 160px;
	}


.container .campaign.found .egg,
.container .campaign.awaiting .egg,
.container .campaign.score .egg
	{
		left: -5px;
		bottom: 0px;
		width: 250px;
		height: 250px;
		transform: rotate(0);
	}

.campaign .bunny
	{
		position: absolute;
		transition: all 1.5s ease-in;
		top: 150px;
		height: 30px;
		width: 15px;
		z-index: -1;
		opacity: 0;
		left: 362px;
		transform: rotate(90deg);
		background-image: url(/graphics/easter/bunny-halt.png);
	}

.campaign.awaiting .bunny.found,
.campaign.score .bunny.found,
.campaign.score .bunny.waiting
	{
		display: none;
	}


.campaign.found .bunny.initiate
	{
		position: absolute;
		background-repeat: no-repeat;
		background-size: cover;
		background-image: url(/graphics/easter/bunny-halt.png);

		transform: rotate(0deg);

		top: -50px;
		height: 300px;
		width: 150px;
		z-index: 100;
		left: 162px;
		opacity: 1;
	}

.campaign.awaiting .bunny.waiting
	{

		position: absolute;
		background-repeat: no-repeat;
		background-size: cover;
		background-image: url(/graphics/easter/bunny-waiting.png);

		transform: rotate(0deg);
		top: -63px;
		height: 310px;
		width: 223px;
		z-index: 99999;
		left: 162px;

		opacity: 1;
	}

.campaign.score .bunny.score
	{

		position: absolute;
		background-repeat: no-repeat;
		background-size: cover;
		background-image: url(/graphics/easter/bunny-loves-you.png);

		transform: rotate(0deg);
		top: -63px;
		height: 310px;
		width: 223px;
		z-index: 99999;
		left: 162px;

		opacity: 1;
	}


.campaign.found .bunny .text,
.campaign.awaiting .bunny .text,
.campaign.score .bunny .text
	{
		cursor: pointer;
		display: flex;
		flex-direction: column;
		width: 320px;
		background: white;
		color: black;
		position: absolute;
		bottom: -4px;
		left: -130px;
		border: 2px solid black;
		border-radius: 25px;
		padding: 6px 10px;		
		font-family: fantasy;
		font-size: 14px;
		font-weight: 600;
	}

body > .infopopup > .content
	{
		max-width: 450px;
		margin: 15px;
	}

form.egghunt .copy
	{
		width: 100%;
		display: flex;
		justify-content: center;
	}

form.egghunt .copy a:not(.selected)
	{
		display: none;
	}


form.egghunt .copy a
	{
		display: flex;
		border-radius: 15px;
		background-color: rgba( 31, 158, 94, 1 );
		color: rgba( 255, 50, 51, 1 );
		color: rgba( 255, 255, 255, 1 );
		z-index: 1;
		padding: 10px;
		cursor: pointer;
		width: 100%;
		justify-content: center;

	}

form.egghunt .copy a.generate-code-button
	{
		background-color: rgba( 31, 158, 94, 1 );
		background-color: rgba( 161, 25, 26, 1 );
		color: rgba( 255, 255, 255, 1 );		
	}


form.egghunt .copy a > *
	{
		font-family: sans-serif;
		padding-left: 5px;
		font-weight: 400;
	}

body > .infopopup form.egghunt.login
	{
		margin-bottom: 30px;		
	}

body > .infopopup form.egghunt h3
	{
		margin: 0px;		
	}
body > .infopopup form.egghunt input[type=button]
	{
		color: rgba(0, 0, 0, 0.8);
		x-color: rgba( 255, 255, 255, 1 );
		background-color: rgb(208, 246, 212);
		width: 100%;
		display: flex;
		justify-content: center;
	}

.container > .bottom > .layout-container
	{
		justify-content: flex-end;
	}

.container > .bottom .menu-main
	{
		flex-grow: initial;
	}

.menu-item.easterbasket
	{
		display: block;
	}

.menu-item.easterbasket .icon
	{
		background-image: url(/graphics/easter/basket.png);
		background-size: contain;
		background-color: rgba(255, 255, 255, 0.5);
		border-radius: 50%;
	}


body > .infopopup.egghunthighscore > .content
	{
		min-width: 350px;
		padding: 0px;
		background-color: rgb(87 196 93 / 55%);
	}

body > .infopopup.egghunthighscore > .content .scroll
	{
		border-radius: 25px;
	}

.infopopup.egghunthighscore h3
	{
		margin: 10px 0px;
		padding: 4px 10px;
		position: sticky;
		top: 0px;
		background-color: rgba(240, 100, 100, 0.7);
		margin-top: -10px;
	}

.infopopup.egghunthighscore ul
	{
		display: flex;
		flex-direction: column;
		font-family: cursive;
		font-family: monospace;
		font-size: 16px;
		font-weight: 600;
	}

.infopopup.egghunthighscore ul li
	{
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: space-between;
		padding: 7px 10px;
	}

.infopopup.egghunthighscore ul li:nth-child( odd )
	{
		background-color: rgba( 187, 196, 87, 0.55 );		
		background-color: rgb(1 2 2 / 15%);
	}



/*

body > .infopopup form.eggunt input[type=button][name="cancel"]
	{
		color: rgba( 255, 255, 255, 0.8 );
		background-color: transparent;
		border: 0px;
	}
*/
