@import "reset.css";

@font-face {
    font-family: 'Saturn';
    src: url('assets/fonts/saturn/senorsaturno-webfont.woff2') format('woff2'),
         url('assets/fonts/saturn/senorsaturno-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Calamity';
    src: url('assets/fonts/calamity/calamity-regular-webfont.woff2') format('woff2'),
         url('assets/fonts/calamity/calamity-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
}

@font-face {
    font-family: 'Calamity';
    src: url('assets/fonts/calamity/calamity-bold-webfont.woff2') format('woff2'),
         url('assets/fonts/calamity/calamity-bold-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-size: 48px;
}

@font-face {
    font-family: 'Apple Kid';
    src: url('assets/fonts/applekid/Apple-Kid.woff2') format('woff2'),
        url('assets/fonts/applekid/Apple-Kid.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body { 
    padding-bottom: 1px;
    background-color: #531818;
    background-repeat: no-repeat;
}

strong {
    font-weight: bold;
}

em {
    font-style: italic;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Apple Kid', sans-serif;
}

h1 {
    font-size: 64px;
}

h2 {
    font-size: 54px;
}

h3 {
    font-size: 48px;
}

h4 {
    font-size: 40px;
}

h5 {
    font-size: 30px;
}

h6 {
    font-size: 26px;
}

ul {
    margin-left: 40px;
    list-style-type: circle;
}

li {
    font: 26px 'Calamity', sans-serif;
    margin-bottom: 10px;
}

h1::after, h2::after, h3::after, h4::after, h5::after, h6::after {
    content: " ";
    height: 6px;
    display: block;
    background: #CD3C3C;
    margin-bottom: 15px;
}

#first-time-modal {
	background-color: rgba(0, 0, 0, 0.7);
	position: fixed;
	z-index: 100;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: 0.5s;
}
top
#splash {
	width: 100%;
	height: 100%;
}

#splash-image {
	position: fixed;
	width: 80%;
	height: auto;
	margin-left: 10%;
	margin-right: 10%;
	margin-top: 5%;
}

#button-area {
	position: fixed;
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
	margin-top: 20%;
}

#splash-done-button {
	position: relative;
	top: 51%;
	left: 70.5%;
	width: 25.5%;
	height: 11%;
	border: none;
	background: none;
}

#aboutMother {
	position: relative;
	top: 4%;
	left: 41.5%;
	width: 26%;
	height: 6%;
	border: none;
	background: none;
}

#aboutCreator {
	position: relative;
	top: 11%;
	left: 13%;
	width: 31%;
	height: 6%;
	border: none;
	background: none;
}

.calamity-font {
	font-family: 'Calamity', sans-serif;
}

.apple-kid-font {
	font-family: 'Apple Kid', sans-serif;
}

#header {
    width: 100%;
	position: relative;
}

#mobile-header {
    display: none;
}

#logo_container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 160px;
    background-image: url('assets/images/redesign/bg_banner.png');
	background-size: 50% auto;
	background-repeat: no-repeat;
	background-position: 55% 50%;
      background-color: #CD3C3C;
}

#header_logo {
    height: 150px
}

#tab_container {
    width: 1920px;
    margin-left: auto;
    margin-right: auto;
    background-color: #8F2A2B;
	
	display: flex;
	flex-direction: row;
	align-items: stretch;
	justify-content: space-between;
}

#navigation-container {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

#top-level-nav-container {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.top-level-nav-label {
    color: white;
    font: 30px "Calamity", sans-serif;
    font-weight: 600;
    text-shadow: 2px 2px 1px black;
    cursor: pointer;
    user-select: none;
    top: 10px;
    padding: 8px;
}

.top-level-nav-link {
    text-decoration: none;
}

#nav-drop-down {
    position: absolute;
    background-color: #EAB749;
    border: 3px solid #EAB749;
    min-width: 80px;
    max-width: 300px;
    visibility: hidden;
    top: 0px;
    left: 0px;
    z-index: 100;
}

.nav-drop-down-content {
    display: flex;
    flex-direction: column;
}

.drop-down-link {
    color: white;
    text-decoration: none;
    font: 24px "Calamity", sans-serif;
    padding: 10px;
}

.white-divider {
    height: 10px;
    margin: 0px;
    background: white;
}

.red-divider {
    height: 5px;
    margin: 5px;
    background: #CD3C3C;
}

#game-nav-container {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    margin: 0px;
    margin-left: 0px;
    margin-bottom: 0px;
    flex-grow: 1;
}

.game-nav-item {
    padding-left: 10px;
    padding-right: 15px;
    padding-top: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.game-nav-label {
    color: white;
    font: 24px "Calamity", sans-serif;
    font-weight: 600;
    text-shadow: 2px 2px 1px black;
    padding-top: 5px;
    margin-bottom: 0px;
    user-select: none;
}

.drop-down {
    width: 1920px;
    margin-left: auto;
    margin-right: auto;
    background-color: #CD3C3C;
    border: 5px solid #EAB749;
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    z-index: 100;
    visibility: hidden;
}

.drop-down-section {
    display: flex;
    flex-direction: column;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 5px;
    width: 18%;
}

.drop-down-section-header {
    font: 28px 'Calamity', sans-serif;
    font-weight: 600;
    margin-bottom: 8px;
    color: white;
}

.drop-down-item:link {
    color: white;
    font-weight: 600;
    text-decoration: none;
    font: 24px 'Calamity', sans-serif;
    padding: 4px;
}

.drop-down-item:visited {
    color: white;
}

.drop-down-item:hover {
    text-decoration: underline;
}

.drop-down-empty-view {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding-top: 20px;
    padding-bottom: 20px;
}

.drop-down-empty-image {
    margin-right: 20px;
    width: 100px;
    height: auto;
}

.drop-down-empty-label {
    font: 38px 'Saturn', sans-serif;
    color: white;
}

#search-social-container {
    margin-right: 10px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 10px;
}

#search-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-top: 5px;
    margin-bottom: 5px;
}

#search-field {
    padding: 7px;
    margin-right: 2px;
    width: 300px;
}

#search-button {
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: black;
    border: 2px solid white;
    height: 31px;
    cursor: pointer;
}

#search-button-label {
    font: 18px 'Saturn', sans-serif;
    font-weight: bold;
    color: white;
    margin-left: 3px;
    user-select: none;
}

#search-button-image {
    position: relative;
    top: -8px;
}

#social-container {
    display: flex;
    flex-direction: row;
    margin-top: 5px;
    align-items: flex-start;
    margin-right: 5px;
}

.social-link {
    text-decoration: none;
}

.social-button {
    margin-left: 10px;
}

.social-button-image {
    height: 48px;
}

#social-button-image-discord {
    height: 48px;
}

#social-button-image-patreon {
    height: 48px;
}

#theme-container, #mobile-theme-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    padding-left: 5px;
    padding-right: 5px;
    margin-top: 5px;
    visibility: hidden;
}

#theme-label, #mobile-theme-label {
    color: white;
    font: 16px "Calamity", sans-serif;
    font-weight: 600;
    text-shadow: 1px 1px 0px black;
}

#theme-selector, #mobile-theme-selector {
    background-color: #1037A3;
    width: 55px;
    height: 30px;
    border-radius: 15px;
    margin-top: 10px;
    position: relative;
}

#theme-switch-button, #mobile-theme-switch-button {
    background-color: white;
    width: 34px;
    height: 34px;
    border-radius: 17px;
    position: absolute;
    top: -2px;
    left: -2px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.theme-dark {
    -moz-transform: translateX(24px);
    -webkit-transform: translateX(24px);
    transform: translateX(24px);
}

.theme-light {
    -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
}

.theme-to-dark {
	-moz-animation: toDark 0.3s linear 1 forwards;
	-webkit-animation: toDark 0.3s linear 1 forwards;
	animation: toDark 0.3s linear 1 forwards;
}

.theme-to-light {
    -moz-animation: toLight 0.3s linear 1 forwards;
	-webkit-animation: toLight 0.3s linear 1 forwards;
	animation: toLight 0.3s linear 1 forwards;
}

@-moz-keyframes toDark {
	0% {
		-moz-transform: translateX(0px);
	}
	100% {
		-moz-transform: translateX(24px);
	}
}

@-webkit-keyframes toDark {
	0% {
		-webkit-transform: translateX(0px);
	}
	100% {
		-webkit-transform: translateX(24px);
	}
}

@keyframes toDark {
	0% {
		-moz-transform: translateX(0px);
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
	}
	100% {
		-moz-transform: translateX(24px);
		-webkit-transform: translateX(24px);
		transform: translateX(24px);
	}
}

@-moz-keyframes toLight {
	0% {
		-moz-transform: translateX(24px);
	}
	100% {
		-moz-transform: translateX(0px);
	}
}

@-webkit-keyframes toLight {
	0% {
		-webkit-transform: translateX(24px);
	}
	100% {
		-webkit-transform: translateX(0px);
	}
}

@keyframes toLight {
	0% {
		-moz-transform: translateX(24px);
		-webkit-transform: translateX(24px);
		transform: translateX(24px);
	}
	100% {
		-moz-transform: translateX(0px);
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
	}
}

.bg-light {
    background-color: #EBEBEB;
}

.bg-dark {
    background-color: #515151;
}

.bg2-light {
    background-color: #CCCCCC;
}

.bg2-dark {
    background-color: #313131;
}

.fg-light {
    color: #000;
}

.fg-dark {
    color: #fff;
}

.link-light {
    color: #1037A3;
}

.link-dark {
    color: #EAB749;
}

.border-light {
    border-color: #000;
}

.border-dark {
    border-color: #fff;
}

.bg-to-light {
    -moz-animation: bgToLight 0.3s linear 1 forwards;
    -webkit-animation: bgToLight 0.3s linear 1 forwards;
    animation: bgToLight 0.3s linear 1 forwards;
}

.bg-to-dark {
    -moz-animation: bgToDark 0.3s linear 1 forwards;
    -webkit-animation: bgToDark 0.3s linear 1 forwards;
    animation: bgToDark 0.3s linear 1 forwards;
}

.bg2-to-light {
    -moz-animation: bg2ToLight 0.3s linear 1 forwards;
    -webkit-animation: bg2ToLight 0.3s linear 1 forwards;
    animation: bg2ToLight 0.3s linear 1 forwards;
}

.bg2-to-dark {
    -moz-animation: bg2ToDark 0.3s linear 1 forwards;
    -webkit-animation: bg2ToDark 0.3s linear 1 forwards;
    animation: bg2ToDark 0.3s linear 1 forwards;
}

.fg-to-light {
    -moz-animation: fgToLight 0.3s linear 1 forwards;
    -webkit-animation: fgToLight 0.3s linear 1 forwards;
    animation: fgToLight 0.3s linear 1 forwards;
}

.fg-to-dark {
    -moz-animation: fgToDark 0.3s linear 1 forwards;
    -webkit-animation: fgToDark 0.3s linear 1 forwards;
    animation: fgToDark 0.3s linear 1 forwards;
}

.link-to-light {
    -moz-animation: linkToLight 0.3s linear 1 forwards;
    -webkit-animation: linkToLight 0.3s linear 1 forwards;
    animation: linkToLight 0.3s linear 1 forwards;
}

.link-to-dark {
    -moz-animation: linkToDark 0.3s linear 1 forwards;
    -webkit-animation: linkToDark 0.3s linear 1 forwards;
    animation: linkToDark 0.3s linear 1 forwards;
}

.border-to-light {
    -moz-animation: borderToLight 0.3s linear 1 forwards;
    -webkit-animation: borderToLight 0.3s linear 1 forwards;
    animation: borderToLight 0.3s linear 1 forwards;
}

.border-to-dark {
    -moz-animation: borderToDark 0.3s linear 1 forwards;
    -webkit-animation: borderToDark 0.3s linear 1 forwards;
    animation: borderToDark 0.3s linear 1 forwards;
}

@keyframes bgToLight {
	0% {
		background-color: #515151;
	}
	100% {
	    background-color: #EBEBEB;
	}
}

@keyframes bgToDark {
    0% {
        background-color: #EBEBEB;
    }
    100% {
        background-color: #515151;
    }
}

@keyframes bg2ToLight {
	0% {
		background-color: #313131;
	}
	100% {
	    background-color: #CCCCCC;
	}
}

@keyframes bg2ToDark {
    0% {
        background-color: #CCCCCC;
    }
    100% {
        background-color: #313131;
    }
}

@keyframes fgToLight {
    0% {
        color: #FFF;
    }
    100% {
        color: #000;
    }
}

@keyframes fgToDark {
    0% {
        color: #000;
    }
    100% {
        color: #FFF;
    }
}

@keyframes linkToLight {
    0% {
        color: #EAB749;
    }
    100% {
        color: #1037A3;
    }
}

@keyframes linkToDark {
    0% {
        color: #1037A3;
    }
    100% {
        color: #EAB749;
    }
}

@keyframes borderToLight {
    0% {
        border-color: #fff;
    }
    100% {
        border-color: #000;
    }
}

@keyframes borderToDark {
    0% {
        border-color: #000;
    }
    100% {
        border-color: #fff;
    }
}

#content {
	width: 1920px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	visibility: hidden;
	overflow: hidden;
	margin-bottom: 50px;
}

#four-zero-four-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #8F2A2B;
    padding: 40px;
}

#four-zero-four-label {
    font: 40px 'Saturn', sans-serif;
    text-align: center;
}

#marquee-container {
	width: 1870px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 10px;
	padding-bottom: 10px;
	display: flex;
	flex-direction: row;
	align-items: center;
}

#marquee-icon {
	height: 72px;
}

#marquee-area {
	background-color: black;
	border: 5px solid white;
	flex: 1 0 auto;
	margin-left: 30px;
	height: 50px;
	white-space: nowrap;
	overflow: hidden;
	position: relative;
}

#marquee-text-container {
	height: 50px;
	position: absolute;
	
	-moz-transform:translateX(1728px);
	-webkit-transform:translateX(1728px);
	
	transform: translateX(1728px);
	
	-moz-animation: scroll 15s linear infinite;
	-webkit-animation: scroll 15s linear infinite;
	animation: scroll 15s linear infinite;
}

#marquee-text {
	display: inline;
	color: white;
	font: 36px Saturn, sans-serif;
	line-height: 50px;
}

@-moz-keyframes scroll {
	0% {
		-moz-transform: translateX(1728px);
	}
	100% {
		-moz-transform: translateX(-100%);
	}
}

@-webkit-keyframes scroll {
	0% {
		-webkit-transform: translateX(1728px);
	}
	100% {
		-webkit-transform: translateX(-100%);
	}
}

@keyframes scroll {
	0% {
		-moz-transform: translateX(1728px);
		-webkit-transform: translateX(1728px);
		transform: translateX(1728px);
	}
	100% {
		-moz-transform: translateX(-100%);
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
	}
}

#headline-container {
    display: flex;
    flex-direction: column;
    background-color: #CD3C3C;
    box-shadow: 0px 2px 1px 1px black;
}

#headline-content-scrolling-container {
    overflow: hidden;
}

#headline-content-container {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.headline-item {
    flex: 0 0 610px;
    margin: 10px;
    position: relative;
}

.headline-title-image {
    width: 610px;
    height: 354px;
    border: 5px solid white;
}

.headline-avatar-image {
    width: 64px;
    height: 64px;
    background-color: white;
    border-radius: 5px;
    border: 4px solid black;
    position: absolute;
    right: 5px;
    bottom: 5px;
    z-index: 2;
}

.headline-author-overlay {
    position: absolute;
    right: 5px;
    bottom: 10px;
    color: white;
    background: rgba(0, 0, 0, 0.8);
    padding: 5px;
    font: 24px "Apple Kid", sans-serif;
    opacity: 0;
    line-height: 90%;
    text-align: right;
}

.headline-author-show {
    -moz-animation: author-to-visible 0.3s linear 1 forwards;
    -webkit-animation: author-to-visible 0.3s linear 1 forwards;
    animation: author-to-visible 0.3s linear 1 forwards;
}

.headline-author-hide {
    -moz-animation: author-to-hidden 0.3s linear 1 forwards;
    -webkit-animation: author-to-hidden 0.3s linear 1 forwards;
    animation: author-to-hidden 0.3s linear 1 forwards;
}

.headline-author-visible {
    opacity: 1.0;
    -moz-transform: translateX(-79px);
    -webkit-transform: translateX(-79px);
    transform: translateX(-79px);
}

.headline-author-hidden {
    opacity: 0;
    -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
}

@-moz-keyframes author-to-visible {
	100% {
		-moz-transform: translateX(-79px);
		opacity: 1.0;
	}
}

@-webkit-keyframes author-to-visible {
	100% {
		-webkit-transform: translateX(-79px);
		opacity: 1.0;
	}
}

@keyframes author-to-visible {
	100% {
		-moz-transform: translateX(-79px);
		-webkit-transform: translateX(-79px);
		transform: translateX(-79px);
		opacity: 1.0;
	}
}

@-moz-keyframes author-to-hidden {
	100% {
		-moz-transform: translateX(0px);
		opacity: 0.0;
	}
}

@-webkit-keyframes author-to-hidden {
	100% {
		-webkit-transform: translateX(0px);
		opacity: 0.0;
	}
}

@keyframes author-to-hidden {
	100% {
		-moz-transform: translateX(0px);
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 0.0;
	}
}

#headline-control-container, #affiliate-scrolling-controls {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

#centered-headline-control-container, #centered-affiliate-control-container {
    display: flex;
    flex-direction: row;
    align-items: center;
}

#headline-left-button, #headline-right-button, .scroll-control-left-button, .scroll-control-right-button {
    cursor: pointer;
}

#headline-left-button, #headline-right-button, .headline-index-indicator, .index-indicator {
    margin: 5px 15px;
}

#headline-left-button-image, #headline-right-button-image, .page-control-left-button-image, .page-control-right-button-image {
    height: 60px;
}

.headline-index-indicator-image, .index-indicator-image {
    height: 30px;
}

.headline-index-indicator, .index-indicator {
    cursor: pointer;
}

.item-inactive {
    opacity: 0.5;
}

.indicator-inactive {
    opacity: 0.5;
    pointer-events: auto;
}

.indicator-active, .item-active {
    opacity: 1.0;
    pointer-events: auto;
}

.item-to-active {
    -moz-animation: toActive 0.3s linear 1 forwards;
    -webkit-animation: toActive 0.3s linear 1 forwards;
    animation: toActive 0.3s linear 1 forwards;
}

.item-to-inactive {
    -moz-animation: toInactive 0.3s linear 1 forwards;
    -webkit-animation: toInactive 0.3s linear 1 forwards;
    animation: toInactive 0.3s linear 1 forwards;
}

@keyframes toActive {
    0% { opacity: 0.4; }
    100% { opacity: 1.0; }
}

@keyframes toInactive {
    0% { opacity: 1.0; }
    100% { opacity: 0.4; }
}

.item-to-1 {
	-moz-animation: to-one 0.3s linear 1 forwards;
	-webkit-animation: to-one 0.3s linear 1 forwards;
	animation: to-one 0.3s linear 1 forwards;
}

.item-at-1 {
    -moz-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
}

@-moz-keyframes to-one {
	100% {
		-moz-transform: translateX(0px);
	}
}

@-webkit-keyframes to-one {
	100% {
		-webkit-transform: translateX(0px);
	}
}

@keyframes to-one {
	100% {
		-moz-transform: translateX(0px);
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
	}
}

.item-to-2 {
    -moz-animation: to-two 0.3s linear 1 forwards;
    -webkit-animation: to-two 0.3s linear 1 forwards;
    animation: to-two 0.3s linear 1 forwards;
}

.item-at-2 {
    -moz-transform: translateX(-640px);
    -webkit-transform: translateX(-640px);
    transform: translateX(-640px);
}

@-moz-keyframes to-two {
	100% {
		-moz-transform: translateX(-640px);
	}
}

@-webkit-keyframes to-two {
	100% {
		-webkit-transform: translateX(-640px);
	}
}

@keyframes to-two {
	100% {
		-moz-transform: translateX(-640px);
		-webkit-transform: translateX(-640px);
		transform: translateX(-640px);
	}
}

.item-to-3 {
    -moz-animation: to-three 0.3s linear 1 forwards;
    -webkit-animation: to-three 0.3s linear 1 forwards;
    animation: to-three 0.3s linear 1 forwards;
}

.item-at-3 {
    -moz-transform: translateX(-1280px);
    -webkit-transform: translateX(-1280px);
    transform: translateX(-1280px);
}

@-moz-keyframes to-three {
	100% {
		-moz-transform: translateX(-1280px);
	}
}

@-webkit-keyframes to-three {
	100% {
		-webkit-transform: translateX(-1280px);
	}
}

@keyframes to-three {
	100% {
		-moz-transform: translateX(-1280px);
		-webkit-transform: translateX(-1280px);
		transform: translateX(-1280px);
	}
}

#main-content-container {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	padding: 10px 0px;
}

#main-content {
	width: 100%;
}

#footer {
    display: flex;
    flex-direction: column;
    width: 1920px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

#footer-content {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: 10px;
}

#social-link-area {
    display: flex;
    flex-direction: row;
}

#disclaimer-area {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
}

.disclaimer-text {
    color: white;
    font: 24px 'Apple Kid', sans-serif;
    margin-right: 10px;
}

.footer-social-button-container {
    margin-left: 20px;
}

.social-link-image {
    width: 50px;
    height: 50px;
}

#rss-button-image {
    margin-bottom: 15px;
}

#pagination-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 20px;
}

.prev-page-button, .current-page-item, .direct-page-link, .next-page-button {
    margin: 20px;
}

.prev-page-button {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.prev-page-button img {
    width: 48px;
    height: auto;
    margin-right: 10px;
}

.next-page-button img {
    width: 48px;
    height: auto;
    margin-left: 10px;
}

.prev-page-button p, .next-page-button p, .current-page-item p, .direct-page-link p {
    font: 24px 'Saturn', sans-serif;
}

.prev-page-link:link, .next-page-link:link, .direct-page-link:link {
    color: black;
    text-decoration: none;
}

.prev-page-link:visited, .next-page-link:visited, .direct-page-link:visited {
    color: black;
}

.prev-page-link:hover, .next-page-link:hover, .direct-page-link:hover {
    text-decoration: underline;
}

.current-page-item {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.current-page-item p {
    color: white;
    background-color: #531818;
    padding: 10px;
    border-radius: 10px;
}

.direct-page-item {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.next-page-button {
    display: flex;
    flex-direction: row;
    align-items: center;
}

#affiliate-scrolling-content {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.affiliate-view {
    display: flex;
    flex-direction: row;
    flex: 0 0 100%;
}

.affiliate-image-container {
    flex: 0 0 33%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.affiliate-image {
    flex: 0 0 200px;
    margin: 20px;
    border: 4px solid white;
}

.affiliate-text-container {
    flex: 0 0 66%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.affiliate-title-label {
    font: 64px "Apple Kid", sans-serif;
    font-weight: bold;
    color: white;
}

.affiliate-description-label {
    font: 26px "Calamity", sans-serif;
    color: white;
    text-align: center;
    margin-bottom: 20px;
}

.affiliate-community-link:link {
    font: 36px "Calamity", sans-serif;
    color: white;
}

.affiliate-community-link:visited {
    color: white;
}

.affiliates-text {
    font: 32px 'Calamity', sans-serif;
    text-align: center;
    margin-bottom: 20px;
    min-width: 700px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.affiliate-slideshow {
    display: flex;
    flex-direction: column;
    background-color: #CD3C3C;
}

.affiliate-container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.affiliate-scrolling-controls {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-bottom: 10px;
}

#content-footer {
    position: relative;
    padding: 30px;
}

#content-footer-link-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
}

.content-footer-link {
    font: 16px "Calamity", sans-serif;   
}

.content-footer-link:link {
    text-decoration: none;
}

#footer-saturn-image {
    position: absolute;
    bottom: 0px;
    left: 10px;
}

.footer-pizza-button {
    position: absolute;
    bottom: 0px;
    right: 10px;
}

#footer-text {
    text-align: center;
    font: 18px "Calamity", sans-serif;
    font-style: italic;
    margin-left: 10%;
    margin-right: 10%;
    position: relative;
    max-width: 80%;
    left: 10px;
}

#nav-title {
	font: bold 64px 'Apple Kid', sans-serif;
	text-align: center;
}

.divider {
	background-image: url("assets/images/divider.png");
	height: 4px;
	margin-bottom: 10px;
}

#nav-divider {
	margin-left: 6px;
	margin-right: 6px;
}

#nav-links-list {
    margin-left: 0px;
    list-style-type: none;
}

.nav-link-item {
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-bottom: 0px;
}

.nav-link-item a:link {
	color: black;
	text-decoration: none;
}

.nav-link-item a:visited {
    color: black;
}

.nav-link-item a:hover {
	text-decoration: underline;
}

.nav-link-item a:active {
	text-decoration: underline;
}

.nav-link {
	font: bold 30px 'Apple Kid', sans-serif;
}

.home_article {
    flex: 0 0 45%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 20px;
}

.offset_newsAndEditorials {
    margin: 15px;
}

.full_newsAndEditorials {
    display: none;
    margin: 15px;
}

.pages-of-the-day {
    margin: 15px;
}

.community-section {
    margin: 15px;
}

#affiliates-header {
    margin-left: 15px;
    margin-right: 15px;
}

.news-editorial-container, .potd-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 10px;
    margin-top: 20px
}

.avatar_image_view {
    border-width: 4px;
    border-style: solid;
	border-radius: 10px;
	width: 64px;
	height: 64px;
}

.home_article_content {
    display: flex;
	flex-direction: column;
	align-items: center;
	margin-left: 20px;
	width: 100%;
}

.home_article_title_label {
	font: bold 48px 'Apple Kid', sans-serif;
	line-height: 90%;
    width: 100%;
    position: relative;
    top: -5px;
}

.home_article_by_line {
	font: 36px 'Apple Kid', sans-serif;
	width: 100%;
	line-height: 90%;
	position: relative;
	top: -5px;
}

.home_article_text {
    width: 100%;
}

.home_article_text p {
    display: block;
    font: 26px 'Calamity', sans-serif;
    margin-bottom: 10px;
    line-height: 150%;
}

.community_article {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.community-link {
    text-decoration: none;
}

.community_article_title_label {
    font: 56px "Apple Kid", sans-serif;
}

.community_article_text .wp-block-image {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 20px;
}

.community_article_text p {
    font: 18px "Calamity", sans-serif;
    text-align: center;
    margin: 25px;
    line-height: 150%;
}

.article {
    margin-left: 20px;
    margin-right: 20px;
}

.article_header {
	display: flex;
	flex-direction: row;
	align-items: flex-end;
	margin-bottom: 5px;
}

.article_text_header_container {
	flex-grow: 1;
	margin-left: 5px;
}

.article_header_text {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: baseline;
}

.article_title_label {
	font: bold 64px 'Apple Kid', sans-serif;
}

.article_by_line {
	font: 30px 'Apple Kid', sans-serif;
}

.post_thumbnail {
    float: left;
    width: 300px;
    height: auto;
    margin-right: 10px;
    margin-bottom: 5px;
    background-color: white;
    border-width: 4px;
    border-style: solid;
    border-radius: 10px;
}

.article_body {
    overflow: auto;
}

.article_body p {
	display: block;
	font: 26px 'Calamity', sans-serif;
	margin-bottom: 10px;
	line-height: 150%;
}

.read_more_container {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}

.read_more {
	background-color: #CD3C3C;
	display: flex;
	flex-direction: row;
	padding: 15px 10px;
	align-items: center;
	box-shadow: 0px 2px 0px 2px black;
}

.read-more-button-text {
	font: 26px 'Saturn', sans-serif;
	color: white !important;
	margin-right: 5px;
}

.read_more_container a:link {
	color: white;
	text-decoration: none;
}

.read-more-button-wrap {
    display: none;
}

.older-newer-section {
    margin: 20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.older-newer-link {
    font: 28px 'Saturn', sans-serif;
    padding: 20px;
}

.older-newer-link:link {
    color: black;
}

.older-newer-link:visited {
    color: black;
}

.search-text {
    font: 28px 'Calamity', sans-serif;
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
    line-height: 150%;
}

.expired-label {
    font: 20px 'Calamity', sans-serif;
    color: #f00;
    font-weight: bold;
    font-style: italic;
    line-height: 150%;
}

/* Full-screen image preview */
#image-preview {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 100;
    visibility: hidden;
}

#full-screen-image-caption-combo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

#full-screen-image-view {
    border: 10px solid #CD3C3C;
    box-shadow: 0px 2px 0px 1px black;
    background-color: black;
    margin-bottom: 15px;
    max-height: 70%;
    max-width: 90%;
}

#full-screen-caption-area {
    background-color: #CCCCCC;
    box-shadow: 0px 6px 0px -1px black;
    display: inline-block;
    position: relative;
    max-width: 90%;
}

#full-screen-caption {
    text-align: center;
    font: 24px 'Calamity', sans-serif;
    color: black;
    width: auto;
    padding: 10px;
}

/* Hover Button */
.hover-button {
	display: inline-block;
}

.hover-button-normal {
	display: block;
}

.hover-button-hover {
	display: none;
}

.hover-button-normal-image, .hover-button-hover-image {
    width: 100%;
}

.fade-in-on-hover {
    opacity: 80%;
}

/* Modules */
/* Content Box Module */
.content-box {
	/*background-color: #8F2A2B;*/
	display: flex;
      color: white;
	flex-direction: column;
	margin-top: 10px;
	margin-bottom: 10px;
}

.content-box-title-box {
	background-color: #CD3C3C;
      color: white;
}

.content-box-title {
	color: white;
	font: 30px 'Calamity', sans-serif !important;
	margin: 10px;
      line-height: 150%;
}

.content-box-body-container {
	display: flex;
	flex-direction: row;
}

.content-box-left, .content-box-right {
	display: flex;
	flex-direction: column;
	margin: 10px;
      color: white;
}

.content-box-center {
	display: flex;
	flex-direction: column;
	margin: 20px;
      width: 30%;
      flex-grow: 0;
      flex-shrink: 0;
}

.content-box-left {
    width: 25%;
    flex-grow: 0;
    flex-shrink: 0;
}

.content-box-image {
	width: 80%;
	height: auto;
	background-color: #CD3C3C;
	border: 2px solid #CD3C3C;
}

.content-box-text {
	font: 30px 'Calamity', sans-serif;
}

.center-content {
	align-items: center;
}

.content-box-button {
	background-color: #CD3C3C;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 10px;
	margin: 10px;
	box-shadow: 1px 1px 0px 1px black;
}

.content-box-button-label {
      color: white;
      text-align: center;
	font: 30px 'Saturn', sans-serif !important;
	margin-bottom: 0px !important;
}

.content-box-button-title {
      color: white;
      text-align: center;
	font: 30px 'Calamity', sans-serif !important;
	margin-bottom: 0px !important;
}

.content-box-button-link:link {
	color: white;
	text-decoration: none;
}

.content-box-button-link:visited {
	color: white;
}

.content-box-button-image {
	width: auto;
	height: 32px;
	display: none;
      color: white;
}

/* Gallery Module */
.gallery-module {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.gallery-item {
	width: 200px;
	height: 150px;
	overflow: hidden;
	margin: 5px;
	
	border: 4px solid #CD3C3C;
    box-shadow: 0px 2px 0px 1px black;
}

.gallery-image {
	width: 200px;
	height: 150px;
	object-fit: cover;
}

.gallery-caption {
	display: none;
	visibility: hidden;
}

/* Editor Elements */

.wp-block-image figure img, .wp-block-image img {
    cursor: pointer;
}

.hasBorder figure img, .hasBorder img {
    border: 8px solid #CD3C3C;
    box-shadow: 0px 2px 0px 1px black;
    margin-bottom: 5px;
}

.wp-block-image figure figcaption { /* Hide this for now, but figure out how to support built-in captions later. */
    display: none;
}

.aligncenter img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.alignright img {
    float: right;
    margin-left: 20px;
    margin-right: 5px;
}

.alignleft img {
    float: left;
    margin-right: 20px;
}

.wp-block-quote {
    margin: 10px 40px;
    border-left: 5px double #531818;
    padding-left: 5px;
}

.tg th {
    background-color: #CD3C3C;
    color: white;
}

.tg td, .tg th {
    border: 2px solid rgba(0, 0, 0, 0.5) !important;
    font: 18px 'Calamity', sans-serif !important;
}

.wp-block-columns {
    display: flex;
    flex-direction: row;
}

.wp-block-column {
    flex: 1 1 40%;
    margin: 10px;
    padding: 5px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.wp-block-embed-twitter {
    width: 520px;
    margin-left: auto;
    margin-right: auto;
}

/* File download block */
.wp-block-file {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 50%;
    margin-bottom: 10px;
}

.wp-block-file a {
    font: 48px 'Apple Kid', sans-serif;
    padding: 8px;
    text-decoration: none;
}

.wp-block-file a:nth-child(2) {
    color: white;
    background-color: #CD3C3C;
    padding-left: 16px;
    padding-right: 16px;
}

@media only screen and (max-width: 1930px) {
	#tab_container {
	    width: 1440px;
	}
	
	.drop-down {
	    width: 1440px;
	}
	
	#search-field {
	    width: 150px;
	}
	
	.game-nav-item {
	    padding-left: 5px;
	    padding-right: 5px;
	}
	
	.game-nav-label {
	    font: 15px "Calamity", sans-serif;
	    font-weight: bold;
	}
	
	#content {
		width: 1440px;
	}
	
	#footer {
	    width: 1440px;
	}
	
	#marquee-container {
		width: 1296px;
	}
	
	#marquee-text-container {
		-moz-transform:translateX(1296px);
		-webkit-transform:translateX(1296px);
	
		transform: translateX(1296px);
	}

	@-moz-keyframes scroll {
		0% {
			-moz-transform: translateX(1296px);
		}
		100% {
			-moz-transform: translateX(-100%);
		}
	}

	@-webkit-keyframes scroll {
		0% {
			-webkit-transform: translateX(1296px);
		}
		100% {
			-webkit-transform: translateX(-100%);
		}
	}

	@keyframes scroll {
		0% {
			-moz-transform: translateX(1296px);
			-webkit-transform: translateX(1296px);
			transform: translateX(1296px);
		}
		100% {
			-moz-transform: translateX(-100%);
			-webkit-transform: translateX(-100%);
			transform: translateX(-100%);
		}
	}
	
	.headline-item {
	    flex: 0 0 460px;
	    margin: 5px;
	}
	
	.headline-title-image {
	    width: 460px;
	    height: 263px;
	}
	
	.item-at-2 {
        -moz-transform: translateX(-480px);
        -webkit-transform: translateX(-480px);
        transform: translateX(-480px);
    }
    
    @-moz-keyframes to-two {
    	100% {
    		-moz-transform: translateX(-480px);
    	}
    }
    
    @-webkit-keyframes to-two {
    	100% {
    		-webkit-transform: translateX(-480px);
    	}
    }
    
    @keyframes to-two {
    	100% {
    		-moz-transform: translateX(-480px);
    		-webkit-transform: translateX(-480px);
    		transform: translateX(-480px);
    	}
    }
    
    .item-to-3 {
        -moz-animation: to-three 0.3s linear 1 forwards;
        -webkit-animation: to-three 0.3s linear 1 forwards;
        animation: to-three 0.3s linear 1 forwards;
    }
    
    .item-at-3 {
        -moz-transform: translateX(-960px);
        -webkit-transform: translateX(-960px);
        transform: translateX(-960px);
    }
    
    @-moz-keyframes to-three {
    	100% {
    		-moz-transform: translateX(-960px);
    	}
    }
    
    @-webkit-keyframes to-three {
    	100% {
    		-webkit-transform: translateX(-960px);
    	}
    }
    
    @keyframes to-three {
    	100% {
    		-moz-transform: translateX(-960px);
    		-webkit-transform: translateX(-960px);
    		transform: translateX(-960px);
    	}
    }
}

@media only screen and (max-width: 1450px) {
	#tab_container {
	    width: 1024px;
	}
	
	.drop-down {
	    width: 1024px;
	}
	
	#content {
		width: 1024px;
	}
	
	#footer {
        width: 1024px;
	}
	
	#marquee-container {
		width: 921px;
	}
	
	.affiliate-image {
        flex: 0 0 150px;
        margin: 10px;
    }
	
	#marquee-text-container {
		-moz-transform:translateX(921px);
		-webkit-transform:translateX(921px);
	
		transform: translateX(921px);
	}

	@-moz-keyframes scroll {
		0% {
			-moz-transform: translateX(921px);
		}
		100% {
			-moz-transform: translateX(-100%);
		}
	}

	@-webkit-keyframes scroll {
		0% {
			-webkit-transform: translateX(921px);
		}
		100% {
			-webkit-transform: translateX(-100%);
		}
	}

	@keyframes scroll {
		0% {
			-moz-transform: translateX(921px);
			-webkit-transform: translateX(921px);
			transform: translateX(921px);
		}
		100% {
			-moz-transform: translateX(-100%);
			-webkit-transform: translateX(-100%);
			transform: translateX(-100%);
		}
	}
	
	.headline-item {
	    flex: 0 0 321px;
	    margin: 5px;
	}
	
	.headline-title-image {
	    width: 321px;
	    height: 195px;
	}
	
	.item-at-2 {
        -moz-transform: translateX(-341px);
        -webkit-transform: translateX(-341px);
        transform: translateX(-341px);
    }
    
    @-moz-keyframes to-two {
    	100% {
    		-moz-transform: translateX(-341px);
    	}
    }
    
    @-webkit-keyframes to-two {
    	100% {
    		-webkit-transform: translateX(-341px);
    	}
    }
    
    @keyframes to-two {
    	100% {
    		-moz-transform: translateX(-341px);
    		-webkit-transform: translateX(-341px);
    		transform: translateX(-341px);
    	}
    }
    
    .item-to-3 {
        -moz-animation: to-three 0.3s linear 1 forwards;
        -webkit-animation: to-three 0.3s linear 1 forwards;
        animation: to-three 0.3s linear 1 forwards;
    }
    
    .item-at-3 {
        -moz-transform: translateX(-682px);
        -webkit-transform: translateX(-682px);
        transform: translateX(-682px);
    }
    
    @-moz-keyframes to-three {
    	100% {
    		-moz-transform: translateX(-682px);
    	}
    }
    
    @-webkit-keyframes to-three {
    	100% {
    		-webkit-transform: translateX(-682px);
    	}
    }
    
    @keyframes to-three {
    	100% {
    		-moz-transform: translateX(-682px);
    		-webkit-transform: translateX(-682px);
    		transform: translateX(-682px);
    	}
    }
	
	.wp-block-embed-twitter {
        width: 350px;
    }
}

@media only screen and (max-width: 1050px) {
    
    body {
        background-image: none;
        background-color: rgba(0, 0, 0, 0) !important;
    }
    
    h1 {
        font-size: 72px;
    }
    
    h2 {
        font-size: 64px;
    }
    
    h3 {
        font-size: 56px;
    }
    
    h4 {
        font-size: 48px;
    }
    
    h5 {
        font-size: 36px;
    }
    
    h6 {
        font-size: 30px;
    }
    
	#tab_container {
	    width: 800;
	}
	
	.drop-down {
	    width: 800;
	}
	
	#header {
	    display: none;
	}
	
	#mobile-header {
	    display: flex;
	    flex-direction: column;
	    position: fixed;
	    z-index: 100;
	    width: 100%;
	}
	
	#mobile-navigation-bar {
	    background: #CD3C3C;
	    flex: 0 0 144px;
	    width: 100%;
	    
	    display: flex;
	    flex-direction: row;
	    justify-content: space-between;
	    align-items: center;
	}
	
	#header_home_link {
	    flex: 0 0 30%;
	    display: flex;
	    flex-direction: row;
	    justify-content: center;
	}
	
	#mobile_header_logo {
	    height: 144px;
	    margin-left: auto;
	    margin-right: auto;
	}
	
	#mobile-hamburger-text {
	    font: 64px sans-serif;
	    color: white;
	    padding: 10px;
	    margin-left: 5px;
	}
	
	#mobile-theme-selector {
        width: 110px;
        height: 60px;
        border-radius: 30px;
        margin-top: 10px;
        margin-right: 20px;
    }
    
    #mobile-theme-switch-button {
        width: 68px;
        height: 68px;
        border-radius: 34px;
        top: -4px;
        left: -4px;
    }
    
    #mobile-theme-switch-button-image {
        width: 48px;
        height: 48px;
    }
    
    .home_section_header {
        font-size: 96px;
    }
    
    .home_article_title_label {
        font: 64px 'Apple Kid', sans-serif;
        font-weight: bold;
        line-height: 90%;
    }
    
    .home_article_by_line {
        font: 64px 'Apple Kid', sans-serif;
        line-height: 90%;
    }
    
    .home_article_text p {
        font: 36px 'Calamity', sans-serif;
    }
    
    .community_article_title_label {
        font: 72px 'Apple Kid', sans-serif;
    }
    
    .community_article_text p {
        font: 36px 'Calamity', sans-serif;
    }
    
    .affiliates-text {
        font: 36px 'Calamity', sans-serif;
    }
    
    .affiliate-title-label {
        font: 72px 'Apple Kid', sans-serif;
    }
    
    .affiliate-description-label {
        font: 28px 'Calamity', sans-serif;
    }
    
    .article_body p, .article_body li {
        font: 36px 'Calamity', sans-serif;
    }
    
    .article_title_label {
        font: 72px 'Apple Kid', sans-serif;
        font-weight: bold;
        line-height: 90%;
    }
    
    .article_by_line {
        font: 36px 'Apple Kid', sans-serif;
    }
    
    .theme-dark {
        -moz-transform: translateX(48px);
        -webkit-transform: translateX(48px);
        transform: translateX(48px);
    }
    
    @-moz-keyframes toDark {
    	0% {
    		-moz-transform: translateX(0px);
    	}
    	100% {
    		-moz-transform: translateX(48px);
    	}
    }
    
    @-webkit-keyframes toDark {
    	0% {
    		-webkit-transform: translateX(0px);
    	}
    	100% {
    		-webkit-transform: translateX(48px);
    	}
    }
    
    @keyframes toDark {
    	0% {
    		-moz-transform: translateX(0px);
    		-webkit-transform: translateX(0px);
    		transform: translateX(0px);
    	}
    	100% {
    		-moz-transform: translateX(48px);
    		-webkit-transform: translateX(48px);
    		transform: translateX(48px);
    	}
    }
    
    @-moz-keyframes toLight {
    	0% {
    		-moz-transform: translateX(48px);
    	}
    	100% {
    		-moz-transform: translateX(0px);
    	}
    }
    
    @-webkit-keyframes toLight {
    	0% {
    		-webkit-transform: translateX(48px);
    	}
    	100% {
    		-webkit-transform: translateX(0px);
    	}
    }
    
    @keyframes toLight {
    	0% {
    		-moz-transform: translateX(48px);
    		-webkit-transform: translateX(48px);
    		transform: translateX(48px);
    	}
    	100% {
    		-moz-transform: translateX(0px);
    		-webkit-transform: translateX(0px);
    		transform: translateX(0px);
    	}
    }
	
	#mobile-navigation-menu {
	    background-color: #531818;
	    height: 100%;
	    z-index: 100;
	}
	
	.mobile-navigation-menu-collapsed {
	    -moz-transform: translateX(-100%);
	    -webkit-transform: translateX(-100%);
	    transform: translateX(-100%);
	}
	
	.mobile-navigation-menu-expanded {
	    -moz-transform: translateX(0%);
	    -webkit-transform: translateX(0%);
	    transform: translateX(0%);
	}
	
	.expand-mobile-navigation-menu {
	    -moz-animation: expand-mobile-nav 0.3s linear 1 forwards;
        -webkit-animation: expand-mobile-nav 0.3s linear 1 forwards;
        animation: expand-mobile-nav 0.3s linear 1 forwards;
	}
	
	.collapse-mobile-navigation-menu {
	    -moz-animation: collapse-mobile-nav 0.3s linear 1 forwards;
        -webkit-animation: collapse-mobile-nav 0.3s linear 1 forwards;
        animation: collapse-mobile-nav 0.3s linear 1 forwards;
	}
	
	@-moz-keyframes expand-mobile-nav {
    	100% {
    		-moz-transform: translateX(0%);
    	}
    }
    
    @-webkit-keyframes expand-mobile-nav {
    	100% {
    		-webkit-transform: translateX(0%);
    	}
    }
    
    @keyframes expand-mobile-nav {
    	100% {
    		-moz-transform: translateX(0%);
    		-webkit-transform: translateX(0%);
    		transform: translateX(0%);
    	}
    }
    
    @-moz-keyframes collapse-mobile-nav {
    	100% {
    		-moz-transform: translateX(-100%);
    	}
    }
    
    @-webkit-keyframes collapse-mobile-nav {
    	100% {
    		-webkit-transform: translateX(-100%);
    	}
    }
    
    @keyframes collapse-mobile-nav {
    	100% {
    		-moz-transform: translateX(-100%);
    		-webkit-transform: translateX(-100%);
    		transform: translateX(-100%);
    	}
    }
    
    #mobile-navigation-menu {
        display: flex;
        flex-direction: column;
        overflow-y: scroll;
    }
    
    .mobile-navigation-item {
        width: 99%;
        margin-left: 0.5%;
        margin-right: 0.5%;
        margin-top: 1px;
        margin-bottom: 4px;
        box-shadow: 0px 3px 0px -1px black;
        display: flex;
        flex-direction: column;
        justify-content: center;
        flex-shrink: 0;
    }
    
    .mobile-navigation-level-1-item {
        background-color: #CD3C3C;
    }
    
    .mobile-navigation-level-1-item-label {
        color: white;
        font: 56px sans-serif;
        font-weight: bold;
        text-shadow: 2px 2px 1px black;
        margin-left: 2px;
        margin-top: 15px;
        margin-bottom: 15px;
        user-select: none;
    }
    
    .mobile-navigation-level-1-item-link:link, .mobile-navigation-level-2-item-link:link {
        text-decoration: none;
    }
    
    .mobile-navigation-level-2-item-label {
        font: 42px sans-serif;
        font-weight: bold;
        margin-left: 22px;
        margin-top: 25px;
        margin-bottom: 25px;
        user-select: none;
    }
    
    .mobile-expanded {
        display: flex;
        flex-direction: column;
    }
    
    .mobile-section {
        display: flex;
        flex-direction: column;
    }
    
    .mobile-section-header {
        font: 36px sans-serif;
        font-weight: bold;
        margin-left: 42px;
        margin-top: 10px;
        user-select: none;
    }
    
    .mobile-section-item {
        font: 36px sans-serif;
        margin-left: 62px;
        margin-top: 5px;
        margin-bottom: 5px;
        user-select: none;
    }
    
    .mobile-section-item:link {
        text-decoration: none;
    }
	
	#headline-container {
	    display: none;
	}
	
	.offset_newsAndEditorials {
	    display: none;
	}
	
	.full_newsAndEditorials {
	    display: block;
	}
    
    .affiliate-image-container {
        flex: 0 0 25%;
    }
    
    .affiliate-image {
        height: 150px;
    }
    
    .affiliate-text-container {
        flex: 0 1 75%;
    }
    
	#content {
		width: 100%;
		top: 144px;
	}
	
	.home_article {
        flex: 0 0 95%;
	}
	
	#footer {
        width: 800px;
	}
	
	#marquee-container {
		display: none;
	}
	
	#marquee-text-container {
		-moz-transform:translateX(720px);
		-webkit-transform:translateX(720px);
	
		transform: translateX(720px);
	}

	@-moz-keyframes scroll {
		0% {
			-moz-transform: translateX(720px);
		}
		100% {
			-moz-transform: translateX(-100%);
		}
	}

	@-webkit-keyframes scroll {
		0% {
			-webkit-transform: translateX(720px);
		}
		100% {
			-webkit-transform: translateX(-100%);
		}
	}

	@keyframes scroll {
		0% {
			-moz-transform: translateX(720px);
			-webkit-transform: translateX(720px);
			transform: translateX(720px);
		}
		100% {
			-moz-transform: translateX(-100%);
			-webkit-transform: translateX(-100%);
			transform: translateX(-100%);
		}
	}
	
	.wp-block-embed-youtube {
        display: inline-block;
        width: 640px;
        height: 360px;
        position: relative;
    }
    
    iframe {
        width: 640px;
        height: 360px;
    }
	
	.wp-block-embed-twitter {
        width: 220px;
    }
}