/*
* 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
================================================== */

/* #Page Styles
================================================== */

/* #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) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		
		img.logo{ padding: 0 auto; margin: 0 auto; display: block; float: none; padding-bottom: 0px; margin-bottom: 0px; }
        #logo{ padding-top: 40px; }
		.title{ text-shadow: 2px 2px 2px #999; float: right; margin-right: 30px; }
		.slogan{ padding: 5px 0px 0px 5px; float: right; margin-right: 30px; }
        h1.title{ text-align: center; }
		h5.slogan{ text-align: center; }
		.slogan{ float: none; text-align: center; margin: 0 auto; }
		
        .nav_container ul.nav{ float: none; text-align: center; margin: 0 0 0 0; }
        .nav_container ul.nav li{ float: none; text-align: center; margin: 0 0 0 10px; }
		nav.top{margin-top: 20px}
		
		footer p{ text-align: center; }
		ul.footer{ float: none; text-align: center }
		ul.footer li.twitter{ float: right; }
		ul.footer li.facebook{ float: right; margin-right: 10px; }
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
	
		/*pro-blog css*/
		#pb_body{ border-top: 1px dashed #666; margin: 15px 0 0 10px; overflow: hidden; }
		.container div h1{ clear:both; display: block; padding: 10px 0; float: left; width: 100%; }
		.content-sbBlog-wrap{ padding: 0 0 0 10px; }
		.rssIcon{ padding: 0 0 0 10px; }
		.arch_months{ padding: 0 0 0 10px; }
		.four.columns h1, .four.columns h2, .four.columns h3, .four.columns h4, .four.columns h5, .four.columns h6{ padding: 0 0 0 0px; }
		.content-sbBlog-wrap{ padding: 0 0 0 10px; }
		.content-sbBlog-contain #content-sbBlog-title h3{ margin: 0 0 0 0; padding: 0 0 0 0; }
		
		.container p{ margin: 0 10px 10px 10px; }
		h1, h2, h3, h4, h5, h6{ margin: 0 10px 10px 10px; }
		ul{ margin: 0 10px 0 10px; }
		form{ margin: 0 10px 0 10px; float: left; }
		input{ margin: 0 10px 0 10px; float: left; }
		input[type="text"], input[type="password"], input[type="email"], textarea, select{ max-width: 200px; margin: 0 10px 10px 0px; }
		img{  }
		span.note{ clear:both; display: block; width: 100%; }
		img.scale-with-grid{ margin: 0 0 0 0; }
		
		img.logo{ float: none; margin: 0 auto; padding: 13px 0 0 30px; }
        #logo{ padding-top: 10px; text-align: center; }
        #top{ text-align: center; }
		.title{ text-shadow: 2px 2px 2px #999; float: none; margin: 0 auto; text-align: center; }
		h1.title{ text-align: center; }
		h5.slogan{ text-align: center; float: none; padding: 0 0 0 0; margin: 0 auto; }
		.slogan{ float: none; text-align: center; margin: 0 auto; }
		
        .nav_container ul.nav{ float: none; text-align: center; margin: 0 0 0 0; }
        .nav_container ul.nav li{ float: none; text-align: center; margin: 0 0 0 10px; }
		nav.top{margin-top: 20px}
		footer p{ text-align: center; }
		ul.footer li{ text-align: center; }
		ul.footer li.twitter{ float: right; }
		ul.footer li.facebook{ float: right; }
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
	
		/*pro-blog css*/
		#pb_body{ border-top: 1px dashed #666; margin: 15px 0 0 10px; overflow: hidden; }
		.container div h1{ clear:both; display: block; padding: 10px 0; float: left; }
		.pb_body h4{ float: left; clear: both; display: block; padding: 10px 0 0 0; }
		.blog-attributes h1{ width: 100%; }
		.container div h1{ clear:both; display: block; padding: 10px 0; float: left; width: 100%; }
		.content-sbBlog-wrap{ padding: 0 0 0 10px; }
		.rssIcon{ padding: 0 0 0 10px; }
		.arch_months{ padding: 0 0 0 10px; }
		.four.columns h1, .four.columns h2, .four.columns h3, .four.columns h4, .four.columns h5, .four.columns h6{ padding: 0 0 0 0px; }
		.content-sbBlog-contain #content-sbBlog-title h3{ margin: 0 0 0 0; padding: 0 0 0 0; }
		
		.container p{ margin: 0 10px 10px 10px; }
		h1, h2, h3, h4, h5, h6{ margin: 0 10px 10px 10px; }
		ul{ margin: 0 10px 0 10px }
		form{ margin: 0 10px 0 10px; float: left; }
		input{ margin: 0 10px 0 10px; float: left; }
		input[type="text"], input[type="password"], input[type="email"], textarea, select{ max-width: 200px; margin: 0 10px 10px 0px; }
		label{ clear: both; width: 100%; display: block; clear: both; }
		img{  }
		span.note{ clear:both; display: block; width: 100%; }
		img.scale-with-grid{ margin: 0 0 0 0; }
		
		img.logo{ float: none; margin: 0 auto; padding-top: 10px; text-align: center; }
        #logo{ padding-top: 10px; text-align: center; }
        #top{ text-align: center; }
		.title{ text-shadow: 2px 2px 2px #999; float: none; margin: 0 auto; text-align: center; }
		h1.title{ text-align: center; }
		h5.slogan{ text-align: center; float: none; padding: 0 0 0 0; margin: 0 auto; }
		.slogan{ float: none; text-align: center; margin: 0 auto; }
		
		
        nav ul{ float: none; text-align: center; }
		nav.top{margin-top: 20px}
		footer p{ text-align: center; }
		ul.footer li{ text-align: center; }
		ul.footer li.twitter{ float: right; }
		ul.footer li.facebook{ float: right; }
	}


/* #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; }
*/