/* Less than 1100px */
@media only screen
and (max-width: 1099px) {
	/* decrease article width to 640 */
	article, div.disqus, div.notes {
		width: 840px;
		margin-left:auto;
		margin-right:auto;
	}
	article img {
		max-width: 100%;
	}
	#main{
		width:990px;
	}
	.about{
		width:840px;
	}
	#site{
		width:840px;
	}
}
/* Less than 1000px */
@media only screen
and (max-width: 999px) {
	article, div.disqus, div.notes{
		width: 640px;
	}
	#main{
		width:790px;
	}
	.about{
		width:640px;
	}
	#site{
		width:640px;
	}
	.about .about-left{
		float:none;
		width: 100%;
	}
	.about .about-right{
		float:none;
		width:100%;
	}
	article footer ul.tags {
		margin-top:0px;
		margin-left:0px;
		width: 95%;
	}
	
}
/* Less than 720px */
@media only screen
and (max-width: 759px) {
	body{
		font-size:80% !important;
	}
	article, div.disqus, div.notes {
		width: auto !important;
		max-width: 520px;
		margin-left:auto;
		margin-right:auto;
	}
	#main{
		width: auto;
		max-width:670px;
	}
	.about{
		width: auto;
		max-width:90%;
	}
	#site{
		width: auto;
		max-width:90%;
		padding: 25px 0 25px 0;
	}
	#site h1{
		width:auto;
		max-width: 100%;
		text-align:center;
		display:block;
		margin:auto;
		padding: 0 25px 0 25px;
	}
	#site h1 img{
		width: auto;
		max-width: 100%;
		padding:15px 0 0;
	}
	#site nav{
		width:auto;
		text-align:center;
		display:block;
		margin:0px auto 0px auto;
		padding: 20px 0 10px 0;
	}
	#site nav ul li:first-child{
		margin-left:auto;	
	}
	
	#myUpArrow{
		display:none;
	}
	article footer ul.tags {
		margin-top:0px;
		margin-left:0px;
		width: 95%;
	}
	article header h2{
		line-height: 1.5em;
	}
	article.chat strong{
		width: auto;
		padding: 4px 0px 0 0;
		display: inline;
	}
	article.chat span{
		display:inline;
		max-width: none;
		text-align:left;
		width: 90% !important;
	}
	article.chat .odd span{
		float:right;
		margin: 10px 0 0 0;
	}
		
	article.chat .even span{
		clear:right;
		float:right;
		margin: 10px 0 0 0;
	}
	article.chat .odd span:before {
		top:60px;
		left:-17px;
	}
	article.chat .even span:before {
		top:60px;
		right:-17px;
	}
	article.chat .even span:before, article.chat .odd span:before {
		display: none;
	}
	
}
@media only screen 
and (max-width : 700px) {
	.disqus .box-1, .notes .box-1, article .box-2, .disqus .box-2, .notes .box-2, article .box-3, .disqus .box-3, .notes .box-3, .disqus .box-4, .notes .box-4, .post-type{
		display:none !important;
	}
	article .box-1, article .box-4{
		border:0 !important;
	}
	article .time a{
		position:absolute;
		bottom:0px;
		left:-10px;
	}
	article .box-1{
		position:absolute;
		left:0px;
		top:10px;
	}
	article{
		margin:0px auto 8px auto;
	}
	article footer{
		margin-top:10px;
		margin-left:20px;
	}
	article footer {
		width: 120%;
	}
	article .box-4{
		padding-bottom:20px;
	}
	article footer ul.tags {
		margin-top:0px;
		margin-left:0px;
		width: 100% !important;
	}
	#pagination{
		margin:0 auto 50px auto;
	}	
	.recent-updates {
		float:none;
		width:100%;
	}
	.liked-posts {
		float:none !important;
		width:100%;
	}
	#main{
	margin:25px auto;
	}
	
	
}


/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
	/*article, div.disqus, div.notes {
			width: 90%;
			margin-left:auto;
			margin-right:auto;
		}
		#main{
			width:100%;
		}
		.about{
			width:100%;
		}
		#site{
			width:100%;
			max-width:480px;
		}*/
	

}
/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {

}