/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */
body:after {content: "less than 320px";font-size: 300%;font-weight: bold;position: fixed;bottom: 60px;width: 100%;text-align: center;background-color: hsla(1,60%,40%,0.7);color: #fff;
display:none;}

/* #Page Styles
================================================== */
body:after {content: "Wider than 959px";background-color: hsla(270,60%,40%,0.7);/* Notify what @media browser is using, Disable above by display:none; */ 	

}

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {body:after {content: "768 to 959px";background-color: hsla(270,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 	
	body { min-width:768px; }
	.content {width:768px;}
}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		body:after {content: "0 to 480px"; background-color: hsla(90,60%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 
	body { min-width:300px;}
		.content {width:420px;}
	/* Removes traditional menu */ 
	#top-menu ul { display: none; }  
	#top-menu select {visibility:visible; width:100%; float:none; background-color: #fff; padding: 5px; font-size: 12px; border: 1px solid #ccc; height: 34px; margin:0 auto 20px;
			}/* Adds in menu select */
	/* Centering the logo and search form */
	#logo {float:none; text-align:center;}
	header p {float:none; text-align:center;}
	footer .searchform {float:none; margin-top:0;margin-left:30%; width:100% }
	#contact_form textarea {width:428px;}

/* Centering the footer contents */
	ul#footer-navigation {float:none;  width:100%;  text-align:center; padding-bottom:20px;}
	ul#footer-navigation li {display:inline; float:none; margin-right:10px; }
	#footer {text-align:center;}
	#footer-base-right { width:100%; float:none; margin:0 auto; text-align:center; padding-bottom:10px;}
	.ie7 #footer-base-right {text-align:right;}
	#contact_form textarea, #contact_form input { width:100%;}
}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		body:after { content: "480 to 767px"; background-color: hsla(150,50%,40%,0.7);}/* Notify what @media browser is using, Disable above by display:none; */ 
			.content {width:420px;}
	body { min-width:420px;}
	#contact_form textarea, #contact_form input { width:300px;}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
	#contact_form textarea, #contact_form input { width:100%;}
}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/