/* ---------[ Responsive Design ]--------- */

@media only screen and (max-width: 768px) {

	#wrap,
	.limit {
		width:96%;
		padding:0;
		margin:0 auto;
		border:0;
		max-width:640px;
	}

	#sitetitle {
		width:100%;
		display:block;
		float:none;
		clear:both;
		margin:0 auto;
		padding:30px 0 10px;
		text-align:center;
	}

	#sitetitle .title {
		width:100%;
		display:block;
		float:none;
		clear:both;
		margin:0 auto;
		text-align:center;
		font-size:24px;
	}

	#topnav {
		display:block;
		margin: 0 auto 30px;
		float:none;
		background:#333;
		padding:8px;
		border:1px solid #444;
	}

	#topnav ul { 
		display: none; 
	}

	#topnav .select-menu {
		display:block;
		padding: 0;
		margin: 0 auto;
		font-size:14px;
		text-transform:none;
		border:0;
		background:transparent;
		color:#eee;
		width:100%;
		border:0;
		-webkit-appearance:none;
		background:#333 url(images/downarrow.png) 100% 50% no-repeat;
	}

	.footer-widget1,
	.footer-widget2,
	.footer-widget3,
	.footer-widget4,
	.home-widget-1,
	.home-widget-2,
	.home-widget-3,
	.page-widget-1,
	.page-widget-2 {
		width: 100% !important;
		clear:both !important;
		float:none !important;
		margin: 0 auto;
	}

	.sitemap-narrow {
		width:auto;
		float:none;
		padding: 0;
		margin:0 auto 15px;
	}

	.sitemap-wide {
		width:auto;
		float:none;
		padding: 0;
		margin:0 auto 15px;
	}
	
	.one-half,
	.one-third,
	.two-thirds,
	.one-fourth,
	.two-fourths,
	.three-fourths,
	.one-fifth,
	.two-fifths,
	.three-fifths,
	.four-fifths {
		width:100%;
		margin:0 auto 30px;
		float:none;
		clear:both;
		display:block;
	}

}

@media only screen and (max-width:640px) {

	a.slidebutton,
	a.slidebutton-feed {
		margin:0;
		display:block;
		float:none;
		padding-top:0;
		padding-bottom:0;
	}

	.comment-body img.avatar {
		margin:0 0 10px;
		float:none;
		display:block;
		position:static;
		left:0;
		top:0;
	}

	ol.commentlist li .comment-body {
		clear:both;
		padding:0 0 30px;
		display:block;
		margin: 0;
	}

	#commentform input[type="text"],
	#commentform textarea,
	.wpcf7 input[type="text"],
	.wpcf7 textarea {
		width:95%;
	}

	.popularposts ul li {
		margin:0 2%;
		clear:both;
		width:96%;
		display:block;
		float:none;
	}

}

@media only screen and (max-width:560px) {

	#wrap {
		width:100%;
	}

	.limit {
		width:92%;
		padding:0 4%;
	}

	#outer-wrap {
		background:#333; 
	}

	#page {
		margin:1px auto;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;
	}

	.entry,
	.page .post.entry,
	.allcomments,
	#respond {
		padding: 20px;
	}

	.inner-mysubscribebox {
		color:#fff;
		padding: 20px;
		text-align:center;
		margin:0;
	}

	.navigation {
		padding-left:20px;
		padding-right:20px;
	}

	ul#portfolio { 
		margin: 0 auto;
	}

	ul#portfolio li {
		background:transparent; 
		display:block; 
		float:none;
		margin: 0 auto 30px 0; 
		width:100%;
	}

	.testimonial {
		background:transparent;
		padding: 0;
		font-size:16px;
	}

	img.alignleft,
	img.alignright {
		float:none!important;
		display:block !important;
		margin: 0 0 10px !important;
	}

	.page .post .wpcf7 {
		background:transparent;
		padding:0;
	}

	.mysubscribebox .email-form input[type="text"],
	.mysubscribebox .email-form input[type="email"] {
		width:60%;
	}

	h1 {
		font-size:20px;
		letter-spacing:-0.03em;
	}

	h2 {
		font-size: 18px;
		line-height: 1.3em;
	}

	h3 {
		font-size: 16px;
		line-height: 1.5em;
	}

	h4,h5,h6,h7 {
		font-size: 14px;
		line-height: 1.5em;
	}

	h1.post-title,
	h2.post-title {
		font-size:20px;
		line-height:1.3em;
	}

	.banner728-container,
	.banner728-container.bottom {
		margin: 0 auto;
	}

}

@media only screen and (max-width:480px) {

	.mysubscribebox .email-form input[type="text"],
	.mysubscribebox .email-form input[type="email"] {
		width:80%;
	}

}