/*smaller than 1020*/
@media screen and (max-width: 1020px) {
	body {min-width: 100%}
	.story, .inside {width:95%; min-width:95%;}
	#myExtraContent1, #myExtraContent2 {width:100%; min-width:100%;} 
	div.bg[style] {width:45%; max-width:45%}
	#header, #footer .main, #footer .secondary, .pagination, #sidebar {width:95%}
	#footer .widget_tia_pixelscroll {width:90%}
}

/*smaller than 950*/
@media screen and (max-width: 950px) {
    #sidebar, #content {float:none}
    .post img, .post object {max-width:95%}
    #logo, #mainNav {position: relative}
    #mainNav li {margin: 0 20px 0 0;}
    #cover-left, #cover-right {display:none}
    #content #nav li a {padding:0;}
    #commentForm {margin-left: 0}
    .secondary p.left, .secondary p.right, #socialNetworks {float:none; text-align: center; padding: 8px 0; margin: 0;}}

/*smaller than 860*/
@media screen and (max-width: 860px) {
    .bg {display:none}
    .float-left, .float-right, .story .float-left, .story .float-right {float:none; width:99%; min-width:99%}
    #mainNav {
	    font-size: 14px;
	    margin-right: 10px;
	}	
}

/*smaller than 600*/
@media screen and (max-width: 600px) {
    .posts {width:90%}
    .post {background-attachment:scroll!important;}
    .secondary p.left, .secondary p.right {font-size: 10px}
	#nav{
		margin-top: 50px;
	}
	#content.postshome .post, .posthome {
		padding-left: 10px;
		padding-right: 10px;
	}
	.float-left, .float-right, .story .float-left, .story .float-right {float:none; width:95%; min-width:95%}
	#pageHead, #content .post, #commentForm {margin-left: 10px}
	h1{font-size: 2.3em;}
	h2{font-size: 2em;}
	h3{font-size: 1.5em;}
	h4{font-size: 1.4em;}
	h5{font-size: 1.2em;}
	h6{font-size: 1.1em;}
}


/*smaller than 480*/
@media screen and (max-width: 480px) {
	.footerBox {margin: 0 0 25px 0;}
	#myExtraContent2{
		bottom: -60px;
	}
	#pNavSlide {
		font-size: 2.2em;
	}
	#myExtraContent1 img{max-width: 280px}
}