/*
 * MEDIA
 * use these adjustments for mobile usage
 *
 */



/************************************************** GENERIC SMALL WINDOW
*/

@media only screen and (max-width: 1200px) {
	/****** PHOTOLINE
	******/
	.photoline .img-box {
		width: 25%;
		padding-top: 16.67%;
	}

	.photoline-preview p { margin: 1em; }
	.photoline-preview > img {
		margin: 1em auto;
		max-height: calc(100% - 5em);
	}
	.photoline-preview > p + img { 
		max-height: calc(100% - 7em);
	}
}

@media only screen and (max-width: 900px), only screen and (max-height: 920px){
	/****** MAIN
	******/
	body.main { font-size: 10px; } /* quick adjust to smaller size */
	div.section div.links { font-size: 12px; }

	/****** MORE
	******/
}



/************************************************** GENERIC TINY WINDOW
*/
@media only screen and (max-width: 650px), only screen and (max-height: 660px){
	/****** MAIN
	******/
	body.main { font-size: 6px; } /* quick adjust to half-size */

	div.section {
		min-width: 58em;
	}
	div.section div.content > h1 {
	}
	div.section div.content > div.links {
		margin-top: 0.5em;
		max-width: initial;
	}
	div.section div.content > div.links > a.tag {
		font-size: 1.1em;
		margin: 0.5em;
	}

	div.section span.photolink { 
		display: inline-block;
		width: auto;
		height: auto; 
		margin: 0.5em;
		padding: 0;
		font-size: inherit;
	}
	div.section span.photolink > a.tag { 
		position: relative;
		font-size: 1.1em; 
		text-align: center;
		background-color: rgba(64, 64, 64, 1.0);
	}
	div.section span.photolink > img { display: none; }
	div.section span.photolink > .noimg { display: none; }

	/****** MORE
	******/
	.more article > div.article-left,
	.more article > div.article-right { 
		display: block; 
		width: 100%;
	}

	div.article-left.icon-container + div.article-right {
		margin: 1em 0 0;
		width: 100%;
	}
	div.article-left.icon-container > div.icon { margin: 0 auto; }
	
	.more div.uc-icon { width: 100%; }
	.more div.uc-icon > p { 
		width: 10em; 
		margin: 0 auto;
	}

	.more div.app-icon {
		width: 5em;
		height: 5em;
		border-radius: 0.75em;
	}
	
	/****** PHOTOLINE
	******/
	.photoline .img-box {
		width: 50%;
		padding-top: 33.3%;
	}
}


@media only screen and (max-width: 650px){
	.tinyHide { display: none; }
}



@media only screen and (max-width: 450px) {
	div.section div.content > div.links > a.tag {
		font-size: 1em;
	}
}
