/*---MEDIA QUERY STUFF FOR SCREENS SMALLER THAN 480px (i.e. iPhone)---*/
@media screen and (max-width:900px) {
	#galleryBox {max-width: 100%}
	#logo {max-width: 100%; height: auto; margin-top: 45px;}
	.boxStuff {position: relative; top: 0; left: 0; display: block !important; clear: left; margin-top: 0 !important; padding: 0 30px 30px; max-width: 100%;}
	#copyright {
		clear: left; 
		position: relative; 
		left: -30px;
		right: -30px; 
		top: 20px; 
		margin-bottom: 15px; 
		padding: 10px 30px;
		text-align: center;
		border: 1px solid #fff;
		border-width: 1px 0;
		opacity: .5; 
		width: 100%;
		background: rgba(0,0,0,.5);
	}
	#blogNav,
	#imgInfo,
	#leftBg,
	#navBox,
	#bgControls {display: none !important}
	#rightBg {display: block; left: 0; right: 0; top: 0; bottom: 0; width: 100% !important;}
	ul.attachmentGallery li.activeImg,
	ul.attachmentGallery li:hover {outline:2px solid #000;}
	#dropmenu li {width: 20%; min-width:129px; line-height: 35px;}
	#dropmenu li a {line-height: 35px;}
	
	#commentsection h3 {margin-top: 0;}
	
	a.thumbLink {float: left; width: 50%; margin-right: 20px;}
	
	a.thumbLink img {
	    max-width: 100%;
    	width: auto;
	}
	#galleryBox, 
	#widgetBox {
	    max-width: 100%;
	}
	
	#widgetBox {border-top: 1px solid rgba(255,255,255,.5); padding-top: 40px; background: rgba(0,0,0,.5); position: relative;}
	#widgetBox:after {display: block; content: ""; clear: both;}
	
	#widgetBox ul li.widget {
		width: 260px;
		float: left;
		margin-right: 20px;
	}
}

@media screen and (max-width:550px) {
	a.thumbLink {float: none; width: auto; margin-right: 0;}
}