/* Mobile CSS */

/* Responsive Design

------------------------------------------------------------ */


@media only screen and (max-width: 768px) {

	html {-webkit-text-size-adjust: none; /* Prevent font scaling in landscape */}

	#wrap {

		width: 96%;

		margin:0 auto;

	}

	#header{
	 padding: 20px 0;
	width: 100%;	

	}
	#header .wrap{
		width: 100%;	
	}
	.top .wrap{
		width: 100%;	
	}

	#inner{

    overflow: hidden;
    padding: 15px;
    width: 96%;
	}
	.content-sidebar #content-sidebar-wrap, .full-width-content #content-sidebar-wrap, .sidebar-content #content-sidebar-wrap{
		width: 100%;	
	}

	.content-sidebar #content, .sidebar-content #content {
    width: 480px;
	}
	
	.sidebar-content-sidebar #content-sidebar-wrap, .sidebar-sidebar-content #content-sidebar-wrap {
   		 float: right;
	}
	.sidebar {
		float: right;
		width: 200px;
	}
		
	#sidebar-alt {
    	float: left;
    	width: 130px;
	}
	#content-sidebar-wrap{

		float: left;
		width: 540px;

	}
	
	#content {
    float: left;
    width: 320px;
	}
	
	#options{

		width: 100%;	

	}

	#home_gallery{

		width: 100%;

		height: auto !important;	

	}

	.flexslider ul li iframe{

		height: auto !important;	

	}

	

	#title-area {

		text-align: center;

		width: 100%

	}

	.header-image #title-area,

	.header-image #title,

	.header-image #title a {

		float: none;

		width: 100%;

	}

	.header-image #title a {

		background-position: center;

	}

	#header .searchform{float:none;}

	#header .widget-area{width:100%; text-align:center;}

	

	#description,

	.page-header,

	#home-intro {

		text-align: center;

	}

	#nav, #subnav{
		width: 100%;
		float: none;	
	}
	

	.intro{text-align:center;}



	#header-sociable ul {

		text-align: center;

		margin: 25px 0 0;

		width: 100%;

	}



	#header-sociable li {

		float: none;

	}



	#header-sociable a {

		margin: 0 3px 5px;

	}

	

	#container{width:100% !important;}
	

	#nav li a, #subnav li a, #header ul.nav li a, #header ul.menu li a{

		 padding: 0 15px;

		font-size:1em;

	}

	

	#title-area #title, #title-area #description{margin:10px 0 0 5px;}

	

	.header-full-width #title-area, .header-full-width #title, .header-full-width #title a{width:180px; padding: 0 0 0 10px;}

	#footer-widgets, #footer {
		padding: 20px 0;
		width: 100% !important;
	}
	#footer-widgets .wrap, #footer .wrap{
		width: 97%;	
	}
	#footer_nav {
     float: none;
    text-align: center;
	}
	#footer .creds{
		text-align: center;
		float: none;	
	}
	
	.one-third.pricing:after, .special-services-box:after{
		width: 94%;	
	}
	 .one-third.pricing:before, .special-services-box:before{
		 	width: 98%;
	 }
	 .portfolio_single_feature{
			width: 100%; 
	 }
	.folio-entry {
		float: left;
		width: 450px;
	}
	#gallery_widget{
		width: 100% !important;	
	}
	#pagination_widget{
		width: 100%;	
	}
	.two-columns, .four-columns{
		margin-right:15px !important; 
		margin-bottom:15px !important; 
		width:45% !important;
		}
	.three-columns{
		margin-right:15px !important; 
		width:29% !important;
	}
	#top-link{
		display: none !important;	
	}
	.footer-widgets-1, .footer-widgets-2,.footer-widgets-3{
		width: 31%;	
	}
	.portfolio-widget{
		 margin: 0 8px 0 0;	
	}
}



@media only screen and (max-width: 600px) {

	html {-webkit-text-size-adjust: none; /* Prevent font scaling in landscape */}
	
	#tspLeftFixed{
	display: none;	
	}

	#wrap {

		width: 90%;

		margin:0 auto;
		
		padding: 0 10px;

	}
	.top .wrap, .top_widget .widget{
		width: 100%;	
	}
	

	#header{

		width: 100%;	

	}

	#inner{

		width: 100%;

		padding: 0;	

		overflow: hidden;

	}

	

	#options{

		width: 100%;	

	}

	#nav .wrap{
		background: none;	
	}
	#home_gallery{

		width: 100%;

		height: auto !important;	

	}

	.flexslider ul li iframe{

		height: auto !important;	

	}

	

	#title-area {

		text-align: center;

		width: 100%

	}



	.header-image #title-area,

	.header-image #title,

	.header-image #title a {

		float: none;

		width: 100%;

	}



	.header-image #title a {

		background-position: center;

	}



	#header .searchform{float:none;}

	#header .widget-area{width:100%; text-align:center;}


	#description,

	.page-header,

	#home-intro {

		text-align: center;

	}



	#header-sociable ul {

		text-align: center;

		margin: 25px 0 0;

		width: 100%;

	}



	#header-sociable li {

		float: none;

	}



	#header-sociable a {

		margin: 0 3px 5px;

	}

	

	#container{width:100% !important;}


	#nav .current_page_item a, #nav li a:hover, #nav li a:active{

   	 color: #444444 !important;

	}

	
	#header .menu,

	.slides_container div.caption,

	.pagination {

		display: none;

	}


	.content-sidebar #content,

	.sidebar-content #content,

	.portfolio-clip,

	.post-clip,

	#jcarousel-post .jcarousel-item {

		width: 100%;

	}



	#slides,

	.slides_container,

	.slides_container div {

		height: 93px;

		width: 260px;

	}



	#slides.portfolio-slideshow,

	#slides.portfolio-slideshow .slides_container,

	#slides.portfolio-slideshow .slides_container div {

		height: 124px;

		width: 220px;

	}



	#slides .next,

	#slides .prev {

		top: 31px;

	}



	#home-intro h3.dizain-title {

		margin-right: 0;

	}



	#home-intro a.intro-button {

		margin: 25px 0 5px;

		position: static;

	}



	#portfolio .portfolio {

		border-bottom: 1px solid #f5f5f5;

		margin-bottom: 30px;

		padding-bottom: 30px

	}



	ul#sort-by {

		margin-top: 25px;

	}



	ul#sort-by a {

		margin: 0 5px 5px 0;

	}



	a.intro-button {

		display: inline-block;

		float: none;

		margin: 5px 0 20px;

	}



	.dizain-jcarousel-text {

		margin-right: 0;

	}

	#nav .wrap .select-menu{
	  display: block;
		margin: 10px 0;
		width: 100%;
	}
	
	#nav .wrap .menu{
		display: none;	
	}

	div.five-sixths,

	div.four-fifths,

	div.four-sixths,

	div.one-fifth,

	div.one-fourth,

	div.one-half,

	div.one-sixth,

	div.one-third,

	div.three-fifths,

	div.three-fourths,

	div.three-sixths,

	div.two-fifths,

	div.two-fourths,

	div.two-sixths,

	div.two-thirds {

		padding: 0;

		width: 100%;

	}



	.author-box .avatar {

		display: inline-block;

		margin: 5px 50px 25px;

	}



	.author-box p,

	.comment-text,

	.comment-list ul.children,

	.comment-list ul.children .comment-text,

	.comment-list ul.children .children {

		margin-left: 0;

	}



	.sidebar {

		border-top: 1px solid #f5f5f5;

		margin-top: 30px;

		

	}



	.comment-entry {

		background-color: #f5f5f5;

	}



	.comment-avatar {

		float: none;

		margin-right: 0;

		padding-top: 30px;

		text-align: center;

	}



	#author,

	#comment,

	#email,

	#url,

	.wpcf7-text,

	.wpcf7-textarea,

	.wpcf7-file,

	.wpcf7-quiz,

	.wpcf7-textarea {

		width: 94%;

	}

	.breadcrumb{

		padding: 13px;	

	}

	.entry-content{
		width: 100%; 	

	}

	

	.sidebar .widget {

		margin: 0 0 30px;

		padding: 10px 20px 0;

	}

	#footer-widgets .wrap{
		width: 90%;	
	}

	#footer .gototop,

	#footer .creds {

		text-align: center;

	}



	#footer .gototop {

		margin-bottom: 5px;

	}



	.post-thumb {

		width: 220px !important;

		height: 138px !important;

	}



		#flickr_badge_wrapper{width:100% !important;}

	.special-services-box{padding:0 !important;}

	div.one-half.special-services-box, div.one-third.special-services-box, div.two-third.special-services-box, div.three-fourth.special-services-box, div.one-fourth.special-services-box{width:100% !important;}

	#top-link{display:none !important;}

	.flex_container{width:100% !important;}

	#container{width:100% !important; margin:20px auto !important;}

	.element-2col, .gallery-2col, .element-3col, .gallery-3col, .element-4col, .gallery-4col{width:97% !important;  display: block; overflow: hidden; clear: both; height: auto !important; margin:5px auto !important;}

	.portfolio_image img{width:100%;}

	div.one-half.pricing, div.one-third.pricing, div.two-third.pricing, div.three-fourth.pricing, div.one-fourth.pricing{width:100% !important;}

	.two-columns, .three-columns, .four-columns{width:100% !important; margin:0 0 15px !important;}

	.pricing .box-wrapper, .special-services-box .box-wrapper{border:1px dotted #dddddd;}

	.carousel_item .element-2col, .carousel_item .gallery-2col, .carousel_item .element-3col, .carousel_item .gallery-3col, .carousel_item .element-4col, .carousel_item .gallery-4col{height:auto !important;}

	.sidebar{width:100% !important;}

	.content-sidebar-sidebar #content, .sidebar-sidebar-content #content, .sidebar-content-sidebar #content{width:100%; padding:0;}

	ul.tabs li a{padding:0 10px !important;}

	#footer_nav{overflow:hidden; width:100%;}

	#footer .wrap{padding:10px; width: 100%;}

	#footer_nav{padding:0 0 10px;}

	#footer a, #footer a:visited{font-size:11px;}

	#content-sidebar-wrap, .content-sidebar-sidebar #sidebar-alt{width:100% !important;}

	

	.element-3col #icon {

    		width: 100% !important;

	}

	

	#content{width:100%;}

	

	#options li {padding: 0 2px !important;}

	#options li a{padding: 3px 5px !important;}

	#sidebar-alt{width:100%;}

	.archive-page{width:100%; padding:0;}

	

	#testimonials .testim-pane{width: 200px !important; float: left;}

	#testimonials div h3, #testimonials div p{ width: 100% !important;}

	#testimonials img {clear: both;}

	#testimonials div{display: block !important;}

	

	.portfolio_single_feature, .portfolio_single_feature img{

		width: 100%	

	}

	.metaItem {
		padding: 0 20px;
		width: 90%;
		margin: 0 0 20px;
	}

	.folio-entry{
   margin: 20px 0 0;
    width: 100%;

	}

	.folio-entry p{

		padding: 0 20px;

		width: 85%;	

	}

	

	#gallery_widget{width: 100% !important}

	#pagination_widget{width: 100%;}

	

	.feature-bottom .textwidget {

    padding: 0 20px;

	}
	.flex-direction-nav, flex-control-nav{
		display: none;	
	}

	.featuredpage .page{

		padding: 0 20px !important;	

	}

	.featuredpost .post{

		padding: 0 20px 15px;	

	}

	.feature-bottom .featuredpost .post, .feature-bottom .featuredpost .post img, .feature-bottom .featuredpost .post a	{
	
		height: auto;
		padding: 0;
		width: 100%;
	}



	.feature-bottom .featuredpost img, .feature-bottom .featuredpage img{

		width: 100%;

	}

	#footer-widgets{

		width: 100%;	

	}

	.footer-widgets-1,.footer-widgets-2, .footer-widgets-3{

		width: 100%;

	}

	#footer{

		width: 100%;

		text-align: center;	

		padding: 10px 0 20px;

	}

	#footer-widgets ul {

		float: left;

		line-height: 26px;

		margin: 0;

		padding: 0;

		width: 92%;

	}

	.status-publish, .hentry{
		padding: 0 20px;	
	}

	#content .post {

		padding: 0 20px;

	}
	#content .post-info{
		margin: 0;
		width: 100%;	
	}
	#content .archive-page{
		width: 100%;	
	}
	#comments, #respond{
		padding: 20px;
	}
	
	.one-third.pricing:after, .one-third.pricing:before, .special-services-box:after, .special-services-box:before{
		width: 100%;	
	}
}





@media only screen and (width: 320px) {

	html {-webkit-text-size-adjust: none; /* Prevent font scaling in landscape */}

	.latest_blog{width:90% !important; margin:0 auto;}

	.latest_blog .carousel h4{padding:0 5px !important;}

	.home_blog_meta, .post_box_comments{padding:0 5px !important;}

	.latest_blog p{padding:0 5px !important;}

	.latest_blog_description{width:100% !important;}

	

	



}





@media only screen and (width: 480px) {

	html {-webkit-text-size-adjust: none; /* Prevent font scaling in landscape */}

	.latest_blog{width:100% !important; margin:0 auto;}

	.latest_blog .carousel h4{padding:0 5px !important;}

	.home_blog_meta, .post_box_comments{padding:0 5px !important;}

	.latest_blog p{padding:0 5px !important;}

	.latest_blog_description{width:40% !important;}

	.latest_blog .flex_container{width:52% !important; float:right;}

	

		

}