
body > .infopopup.hosted img
	{
		max-width: 100%;
	}

body > .infopopup.hosted > .content
	{
		display: flex;
		flex-direction: column;
		padding: 0px;
		margin: 10px;
		max-width: 600px;
		background-color: rgba( 240, 248, 255, 0.9 );
		background-color: rgba( 255, 255, 255, 1 );
		color: rgb( 0, 0, 0 );

		border-color: rgb(158 27 27 / 80%);
		border-width: 1px;
		border-style: solid;

		-webkit-font-smoothing: antialiased;
		line-height: 23px;
		font-size: 17px;

		overflow: hidden;

	}

body > .infopopup.hosted hr
	{
		display: block;
		width: 100%;
		height: 1px;
		background-color: rgba( 0, 0, 0, 0.3 );
		border: 0px;
		max-width: 75%;
		margin: 40px auto;
	}

body > .infopopup.hosted .header
	{
		border-radius: 25px;
		border-bottom-right-radius: 0px;
		border-bottom-left-radius: 0px;
		overflow: hidden;

		position: sticky;
		top: -50%;
		top: calc(100% * (9 / 16) / -2);
	}

body > .infopopup.hosted .footer
	{
		position: relative;
		display: flex;
		flex-direction: column;
		border-radius: 25px;
		x-padding: 10px 20px;
		border-top-right-radius: 0px;
		border-top-left-radius: 0px;
		border: 1px solid rgba( 0, 0, 0, 0.8 );
		x-background-color: rgb( 128, 0, 0 );
	}

body > .infopopup.hosted .footer::before
	{
		display: block;
		position: absolute;
		bottom: 0px;
		top: 0px;
		left: 0px;
		content: "";
		width: 100%;
		height: 100%;
		background-image: url(/graphics/hosted/4514-header.jpg);
		background-size: cover;
		background-position: top;
	}

body > .infopopup.hosted .footer > .row
	{
		display: flex;
		flex-wrap: nowrap;
		z-index: 10;
		padding: 10px 20px;
		background-color: rgba( 0, 0, 0, 0.4 );
	}

body > .infopopup.hosted .footer .button
	{
		display: flex;
		flex-direction: column;
		border-radius: 10px;
		background-color: rgba( 214, 100, 95, 1 );
		color: rgb( 255, 255, 255 );
		cursor: pointer;

		background-color: rgb(214 212 95);
		color: rgb(125 40 40);
		font-size: larger;
		x-font-weight: 400;
		x-letter-spacing: 1px;
		font-family: "Bebas Neue", sans-serif;

	}

body > .infopopup.hosted .footer .button span
	{
		padding: 5px 10px;
	}
body > .infopopup.hosted .footer .button.donate
	{
		margin-left: auto;
	}

body > .infopopup.hosted > .content > .scroll > .story
	{
		padding: 0px 15px;
	}