@keyframes migot {
	0%	{color: #fff;}
	100%	{color: #bbb;}
}
@keyframes migot576px {
	0%	{color: #f88;}
	100%	{color: #f00;}
}
#announcement {
	background-color: #000;
	border: .2rem solid white;
	margin-bottom: .2rem;
}
#announcement p {
	font-family: Verdana, sans-serif;
	margin: 0 auto;
	padding: .25rem;
}
#announcement .annTitle {
	animation: migot 0.75s infinite;
	font-weight: bold;
	letter-spacing: .5rem;
	text-transform: uppercase;
}
#announcement .annTitle2 {
	animation: none;
	letter-spacing: normal;
}
.artwork-container {
	width: 100%;
}
#cycle-pager {
	display: none;
}
.desc-container {
	background-color: white;
	color: black;
	font-size: .9rem;
	padding: .4em;
	text-align: center;
}
.desc-container p {
	margin: .2em 0;
}
.desc-data {
	font-size: .8em;
}
.desc-data .shape {
	color: #666666;
	font-size: 1rem;
	text-shadow: -1px 1px 0px #aaaaaa;
	font-weight: bold;
}
.desc-status {
	text-transform: lowercase;
}
.desc-status-special {
	color: red;
	font-weight: bold;
	text-transform: uppercase;
}
#highlight {
	width: 100%;
}
.image-container {
	box-sizing: border-box;
	background-color: white;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	border: 2px solid white;
	min-height: 45.5vh;
	width: 100%;
}
#seemore {
	background-color: #fff; 
	border-bottom: .5px solid #eee;
	box-sizing: border-box;
	color: #000;
	margin: .2em 0;
	padding: .5em 0;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
}

/*
=================================================
BREAKPOINT 1
=================================================
*/

@media all and (min-width: 576px) {
	#announcement {
		background: rgba(255, 255, 255, .8);
		border: none;
		color: #000;
		margin-bottom: .5rem;
	}
	#announcement .annTitle {
		animation: migot576px 0.75s infinite;
		color: #a55;
		font-size: 2rem;
	}
	#announcement .annTitle2 {
		animation: none;
		color: #f00;
	}
	#announcement p:not(.annTitle) {
		font-size: 1.25rem;
		padding-top: .75rem;
		padding-bottom: .25rem;
	}
	#content-text {
		height: 100%;
		overflow-y: auto;
	}
	/* CYCLE2 PAGER */
	#cycle-pager { 
		display: block;
		text-align: center;
		width: 100%;
		z-index: 500;
		position: absolute;
		bottom: 110px;
		overflow: hidden;
	}
	#cycle-pager span { 
		font-family: arial;
		font-size: 3em;
		width: 1em;
		height: 1em; 
		display: inline-block;
		color: #ddd;
		cursor: pointer;
	}
	#cycle-pager span.cycle-pager-active {
		color: #000;
	}
	#cycle-pager > * {
		cursor: pointer;
	}
	html {
		background:  url("../images/background-home-bw.jpg") no-repeat center top fixed;
		background-size: cover;
	}
	#seemore {
		background-color: rgba(255,255,255, .8);
		color: #555;
		font-weight: bold;
		margin: .5em 0;
		padding-left: 1em;
		padding-right: 1em;
	}
	#seemore:hover {
		background-color: #fff;
		color: #000;
	}
}


/*
=================================================
BREAKPOINT 2
=================================================
*/

@media all and (min-width: 650px) {
	
}


/*
=================================================
BREAKPOINT 3
=================================================
*/

@media all and (min-width: 768px) and (orientation: landscape) {
	#content-float {
		float: left;
		margin-left: .25em;
		width: calc(50% - .25em);
	}
	#content-text {
		max-height: calc(100vh - 7.9em);
		overflow-y: auto;
	}
	#highlight {
		float: left;
		margin-right: .25em;
		width: calc(50% - .25em);
	}
	.image-container {
		height: calc(100vh - 14.5em);
	}
}