﻿@media (min-width: 1350px) {
    main {
        /*background: url(/images/2020/frame_top_nobanner2.jpg) no-repeat scroll center top, url(/images/2020/frame_bottom.jpg) no-repeat scroll center bottom, url(/images/2020/frame_middle.jpg) repeat-y scroll center top;*/
        background: url(https://www.stardock.com/thepoliticalmachine/2024/background/frame_top_blog.jpg) no-repeat scroll center top, url(https://www.stardock.com/thepoliticalmachine/2024/background/frame_bottom.jpg) no-repeat scroll center bottom, url(https://www.stardock.com/thepoliticalmachine/2024/background/frame_middle.jpg) repeat-y scroll center top;
        display: block;
    }

    section.TPM2024 > div {
        margin-top: -50em;
    }

	section.blog > div.featured > a {
		max-width: 543px;
	}

		section.blog > div.featured > a > img {
			max-width: 543px;
			width: 100%;
		}
}

section.blog {
	-ms-flex-align: stretch;
	align-items: stretch
}

	section.blog div.header {
		background: url(/images/2016/redbanner.png) no-repeat top center;
		height: 105px;
		margin: 0 auto;
		padding: 0.6em 0 0;
		max-width: 1375px;
		font: 48px "cooper-black-std", 'Segoe UI', Arial, Tahoma, san-serif;
		color: #ffffff;
		display: block;
	}

	section.blog div.newsitem {
		position: relative
	}

        section.blog div.newsitem p.category {
            color: #d40910;
            font-weight: bold;
            font-size: 1em;
            margin: 0;
            margin-top: 0.5em;
            text-transform: uppercase
        }

        section.blog div.newsitem hr {
            height: 1px;
            background: #ffffff;
            border: none;
        }

	section.blog div.newsitem p.title {
		font: 52px "cooper-black-std", 'Segoe UI', Arial, Tahoma, san-serif;
		font-size: 1.688em;
		font-weight: bold;
		margin: 0 0 7px 0;
	}

        section.blog div.newsitem p.title a {
            color: #ffffff;
            text-decoration: none;
        }

			section.blog div.newsitem p.title a:hover {
				text-decoration: underline
			}

		section.blog div.newsitem p.previewtxt {
			line-height: 1.5em;
			max-height: 6em;
			overflow: hidden;
			position: relative;
			text-overflow: ellipsis
		}

            section.blog div.newsitem p.previewtxt:before {
                content: "";
                position: absolute;
                right: 0;
                bottom: 0;
                background: linear-gradient(90deg,transparent,#030912 77%);
                width: 100%;
                height: 1.125rem
            }

			section.blog div.newsitem p.previewtxt a.more {
				position: absolute;
				right: 0;
				bottom: 0;
				font-size: .75rem;
				color: #d40910
			}

	section.blog div.blogpager {
		display: -ms-flexbox;
		display: flex;
		padding-bottom: 3em;
		margin: 0 auto;
		width: 280px;
	}

		section.blog div.blogpager > div.left {
			display: inline-block;
			width: 5px;
			height: 39px;
			background: url(/games/starcontrol/images/brackets.png) 0 0
		}

		section.blog div.blogpager > div.right {
			display: inline-block;
			width: 5px;
			height: 39px;
			background: url(/games/starcontrol/images/brackets.png) 5px 0
		}

		section.blog div.blogpager div.pagenumbers {
			-ms-flex-align: center;
			align-items: center;
			display: -ms-flexbox;
			display: flex;
			font-size: 1.5em;
			margin: 0 10px
		}

@media screen and (max-width:767px) {
	section.blog > div.blogpager div.pagenumbers {
		font-size: 1.25em;
		margin-right: 0
	}
}

section.blog > div.blogpager div.pagenumbers a {
	color: #0062d3;
	margin: 0 8px;
	text-align: center;
	width: 13px
}

	section.blog > div.blogpager div.pagenumbers a.active, section.blog > div.blogpager div.pagenumbers a:hover {
		color: #d40910;
		text-decoration: none;
		font-weight: 700
	}

section.blog > div.blogpager div.pagenumbers span {
	color: #d40910;
	font-weight: 700
}

section.blog > div.featured {

	text-align: center
}

@media screen and (min-width:1080px) {
	section.blog > div.featured {
		margin: 1em 0 2em 0;
	}
}

section.blog > div.featured > div.newsitem, section.blog > div.featured > img {
	display: inline-block;
	margin: 0 1.5em 1em;
	vertical-align: top
}

@media screen and (max-width:630px) {
	section.blog > div.featured > div.newsitem, section.blog > div.featured > img {
		margin: 0 auto 1em
	}
}

section.blog > div.featured > a {
	text-decoration: none;

}

	section.blog > div.featured > a > img {
		display: inline-block;
		vertical-align: top;
		width: 95%;
		max-width: 95%;

	}

@media (min-width:768px) {
	section.blog > div.featured > a > img {
		width: unset;
		max-width: 550px;
	}
}

section.blog > div.featured > div.newsitem {
	text-align: left;
	margin: 1em 1em 5em 1em;
}
@media (min-width:768px) {
	section.blog > div.featured > div.newsitem {
		margin: 1em auto 5em auto;
		max-width: 544px;
	}
}

@media (min-width:1080px) {
	section.blog > div.featured > div.newsitem {
		margin: 0 1em 5em 2em;
	}
}


	section.blog > div.featured > div.newsitem p.previewtxt {
		max-height: 11.8em
	}

		section.blog > div.featured > div.newsitem p.previewtxt:before {
			right: 0;
			bottom: 0
		}

		section.blog > div.featured > div.newsitem p.previewtxt a.more {
			right: 0;
			bottom: -3px
		}

@media (min-width:768px) {
	section.blog > div.featured > div.newsitem p.previewtxt a.more {
		bottom: 0
	}
}

section.blog > div.sections {
	margin: 1em auto;
}
@media (min-width:1080px) {
	section.blog > div.sections {
		display: -ms-flexbox;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		max-width:1100px;
	}
}

section.blog > div.sections > div.newsitem {
	margin:1em 1em 5em 1em;
	position: relative;
	text-align: left;
}

@media screen and (min-width:500px) {
	section.blog > div.sections > div.newsitem {
		margin: 1em auto;
		max-width: 500px;
	}
}

@media screen and (min-width:768px) {
	section.blog > div.sections > div.newsitem {
		width: unset;
		max-width: 455px;
	}
}

@media screen and (min-width:1080px) {
	section.blog > div.sections > div.newsitem {
		width: unset;
		max-width: 455px;
		margin: 2em 3em;
	}
}

section.blog > div.sections > div.newsitem > div {
    height: 242px;
    overflow: hidden;
}

section.blog > div.sections > div.newsitem > div > a > img {
	width: 90%;
	max-width: 90%;
}

@media (min-width:768px) {
    section.blog > div.sections > div.newsitem > div > a > img {
        width: unset;
        max-width: 455px;
    }
}

@media (max-width: 1349px) {
    section.logo {
        display: none;
    }

    section.logo2 {
        display: block;
        margin: 0 auto;
        max-width: 1251px;
        position: relative;
        top: 0;
        width: 100%;
        z-index: 1;
    }

        section.logo2 > img {
            display: block;
            /*margin-top: -56px;*/
            width: 100%;
        }

    section.TPM2020 {
        background-color: #edf6ff;
        display: block;
        margin: 0 auto;
        max-width: 1251px;
        position: relative;
        width: 100%;
        z-index: 1;
    }

    section.blog div.header {
        font: 36px "cooper-black-std", 'Segoe UI', Arial, Tahoma, san-serif;
        height: 60px;
        margin-bottom: 0.5em;
        overflow: hidden;
    }
}