/* TABLETS
--------------------------------------------------*/

@media screen and (max-width: 768px) {
	.col-1-2,
	.col-2-3,
	.col-1-8,
	.col-1-3,
	.col-1-4  {
	  width: auto;
	  float: none;
	  display: block;
	  margin-bottom: 20px;
	}
	h1 {
		font-size: 150%;
	}
	h2 {
		font-size: 130%;
	}
	h3 {
		font-size: 120%;
	}
	h4 {
		font-size: 120%;
	}
	#sidebar {
		display: none;
	}
	#sub-content.two-col {
		width: 100%;
	}
	#top-nav li {
		padding: .5em .5em 0 0;
		font-size: 95%;
	}
	#project-nav-mobile {
		display: block;
	}
	#footer-news {
		float: none;
		margin-bottom: 2em;
		width: 100%;
	}
	#social-networking {
		float: none;
		width: 100%;
		padding: 0;
	}
	#social-networking ul {
		overflow: hidden;
	}
}

/* PHONES
--------------------------------------------------*/

@media screen and (max-width: 340px) {
	body {padding: 0;background-image: none;}
	#header {
		width: auto; /* 960px, base design width */
		background: #fff url(../img/bgr-header-paint.gif) no-repeat left top;
		padding: 88px 20px 0 20px;
	}
	ul#top-nav {
		border-top: 1px solid #008caa;
		padding-top: 5px;
		margin-top: 5px;
	}
	#top-nav li {
		font-size: 90%;
		padding: 3px 3px 3px 0px;
	}
	#logo-header {
		display: none;
	}
	#bcd {
		font-size: 18px;
	}
	#quick-contact {
		width: 100%;
		position: static;
		text-align: left;
		background: #fff;
		opacity:0.8;
		filter:alpha(opacity=80); /* For IE8 and earlier */
	}
	.description {
		display: none;
	}
	textarea {
		width:90%;
	}
	input.text-field {
		width: 90%;
	}
	form dl {
		width: 90%;	
	}
	#project-nav {
		display: none;
	}
	.project-thumb {
		float: none;
	}
}