/******************************************
* Media Queries (Responsive Design)
*******************************************/

/*
WARNING! DO NOT EDIT THIS FILE!

To make it easy to update your theme, you should not edit the styles in this file. Instead use
the custom.css file to add your styles. You can copy a style from this file and paste it in
custom.css and it will override the style in this file.

*/


/* Large Screens */
@media screen and (max-width: 980px) {

	.inner-wrap,
    .wrapped { width: 96%; }

    .wpzlb-layout .wpzlb-inner-wrap,
    .wpzlb-layout .wrapped { width: 96%; }

    .wpzlb-layout .wpzlb-column { width: 100% !important; }

    .page-header .wpzlb-layout .wpzlb-inner-wrap { width: 90%; }

    .layout-boxed { width: 96%; margin: 0 auto 30px;  }

	#wrapper #main { width: 65%; padding-right: 2%;	}

	.entry blockquote { margin-right:-3%; }
	.post_author { margin-right:-3%; }

	#sidebar { width: 30%; padding-left: 2%; }

	#sidebar .widget_archive li { width:100%; float:none; }
	.wpzoomSocial li {float:none; margin-left:0; width:100%;}
	ul.tabbernav li a { font-size: 12px; }

    #footer div.column { width: 24%; margin-right: 1%; }

    #comments .commentlist li #respond input { width:94%; }
	#comments .commentlist li #respond textarea { width: 94%; }
	#comments .commentlist li #respond p.form-submit input { width: auto; }

	#sidebar.portfolio-sidebar  { width: 23%; }
	#wrapper #main.portfolio-main { width: 73%; padding:0 0 0 3%;}

	.portfolio-grid .portfolio_item { width: 30%; margin-left:2%; }
	.portfolio-grid .portfolio_item img { max-width: 100%; height: auto; }

}

/* Tablet Portrait */
@media screen and (max-width: 768px) {

	#wrapper #main {
		width:100%;
		padding-right: 0;
		border:none;
		box-shadow: none;
	}

	#logo { margin: 0 0 15px; }

   .head-btn { display: none; }

    #navbar a.cart-button { float: none; margin:0; }
    #navbar .btn_menu { float:left; }
    #navbar nav { float: left; }
    #navbar .dropdown a { padding: 6px 0; }
    #navbar .sub-menu { padding: 0; }
    #navbar p { float:right; margin:7px 0 0; }

    #topmenu-wrap,
    #menu-wrap,
    #featured-wrap { display: none; }

    #header { position: relative; }
     .mobile-menu { display: none; clear: both; }
    .btn_menu { display: block; float: right; cursor: pointer; background-image: url('images/menu.png'); background-position:  8px 9px; background-repeat:  no-repeat; background-color: rgba(0,0,0,0.3); padding: 5px 5px 0; width: 30px; height: 30px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
    .btn_menu:hover { background-color: rgba(0,0,0,0.5); }

    #menu { float: none; }
    #menu .dropdown .sub-menu li { border: none; }
    #menu .dropdown .sub-menu { border: none; background: none; box-shadow: none; padding: 0;}
    #menu li ul li a { color:#eee; }
    #menu .sfHover ul,
	#menu li:hover ul {	top: 0;	}

    .dropdown li { display: block; float: none; }
    #menu .dropdown > li:after { display: none; }
    .dropdown a { padding-left: 10px; display: block; }
    .dropdown .sub-menu { -webkit-box-shadow: none; box-shadow: none; background: none; margin-left: 10px; display: block !important; position: relative; visibility: inherit !important; top: 0; width: auto; border: none; }
    .dropdown .sub-menu .sub-menu { -webkit-box-shadow: none; box-shadow: none; background: none; margin-left: 10px; display: block !important; position: relative; visibility: inherit !important; top: 0; width: auto; border: none; }
    .dropdown  li:hover .sub-menu .sub-menu { top: 0; left: 0; border: none; -webkit-box-shadow: none; box-shadow: none; background: none; }
    #menu #mainmenu > li > a { border: none; padding-left: 0; }

    #menu li ul li a:hover { color: #fff; }

    .dropdown .sf-sub-indicator,
    .dropdown ul .sf-sub-indicator { display: none; }

    #menu #mainmenu > li > a:before { display: none; }
    #menutop .dropdown > li:after { display: none; }
    .dropdown .sub-menu li { border: none; }
    .dropdown a { padding:8px 0; }
    .dropdown a:hover {  }
    .dropdown li ul li { border: none; }
    .dropdown li ul li a {  }
    .dropdown li:hover li a:hover {  }
    .dropdown li:hover a {  }
    .dropdown li:hover ul a { background: none; }
    .dropdown > li > a:hover { margin-top: 0; }
    .dropdown > li > a:after { display: none; }
    .dropdown > li > a:hover { margin-top: 0; }
    .dropdown > li:hover { margin-top: 0; }
    .dropdown > li:hover > a { margin-top: 0; }
    .dropdown ul { background: none; }
    .dropdown li:hover ul,
    .dropdown li.sfHover ul { left: 0; top: 0; z-index: 99; background: none; }
    ul.dropdown li:hover li ul,
    ul.dropdown li.sfHover li ul { top: 0; }
    ul.dropdown li li:hover ul,
    ul.dropdown li li.sfHover ul { left: 0; top: 0; }
    ul.dropdown li li:hover li ul,
    ul.dropdown li li.sfHover li ul { top: 0; }
    ul.dropdown li li li:hover ul,
    ul.dropdown li li li.sfHover ul { left: 0; top: 0; }

 	a.cart-button { float: left; padding-left: 20px !important; }

    .featured-categories-nav .dropdown .current-menu-item:before { display: none; }
    .featured-categories-nav li { border: none; border-image: none; }
    .featured-categories-nav li a { padding: 10px 0 !important; line-height: 1.3 !important; }

    .featured-categories-nav .dropdown > .sfHover > ul,
    .featured-categories-nav .dropdown > li:hover > ul {
        top: 0!important;
    }

    .featured-categories-nav .dropdown > li > ul { margin-bottom: 10px; }
    .featured-categories-nav .btn_menu { float:left; margin: 10px 0;}

    #sidebar { width: 100%; padding-left: 0; }

    #sidebar.portfolio-sidebar  { width: 100%; margin-bottom: 25px; }
    #wrapper #main.portfolio-main { width: 100%; padding:0; box-shadow: none; border:none; }

    .portfolio-grid .portfolio_item { width: 30%; margin-right:2%; margin-left:0; }
    .portfolio-sidebar .portfolio-taxonomies .cat-item a { float: left; margin:0 10px 0 0; padding: 4px 10px; border:none; line-height: 1.5; }
    .portfolio-sidebar .portfolio-taxonomies .current-cat a { margin:0 10px 0 0; border-radius:3px; padding:4px 10px;}
    .portfolio_item-slider { padding: 4%; }
    .portfolio_item-slider .flex-control-nav { margin-top:7px; }
    .portfolio_item-related-grid li { width: 30%; }
    .portfolio_item-related-grid li img { max-width: 100%; height:  auto; }

    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product { width: 47% !important; margin-right:3% !important; }

    #footer div.column { width: 48%; margin-right: 2%; display: inline-block; vertical-align: top; }


}

/* All Mobile Sizes (devices and browser) */
@media screen and (max-width: 640px) {

	.share_box h3 { display: none; }
	.share_box .share_btn { float: none; margin: 0 0 15px; }

	.post_author { padding: 3%; }

	.post_author .author_links { padding:0;  }

    .recent-post .post-content {overflow:visible; }
    .recent-post .post-thumb { width:100%; margin-right:0;}
    .recent-post .post-thumb img { max-width:100%; height:auto;}

    #respond .form_fields { width:97%; margin:0; }
    #respond input, #respond textarea { width: 97%; }
    #respond .comment-form-comment {width:99%; }
    #respond .form_fields input { width:98%; }
    .children #respond { margin-right:0; }

    #sidebar .widget {width:100%; margin-right:0%; float:none; }

    #footer div.column { margin-right: 0;  width: 100%; }
	#footer .widget-area {  ; padding: 4%; }
	#footer .column .widget { width:100%; }

 	p.wpzoom { float: left; }

	.portfolio_item-nav a { margin: 0 5px; font-size: 10px; }
	.portfolio_item-main .portfolio_item-title { font-size: 28px; }
	.portfolio_item-main .portfolio_item-content { margin:5% 3%; }
	#wrapper #main.portfolio_item-main { margin-top: 20px; }
	.portfolio_item-main .portfolio_item-client { padding-bottom: 20px; }
	.portfolio_item-related-grid h3 a, .portfolio-grid h3 a { font-size: 14px; }
	.portfolio_item-related-grid h3, .portfolio-grid h3 { line-height: 1; }

}

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

	.post_author .author_links { display:none; }
	#recent-posts .post-thumb { display: block; width: 100%; margin:0 0 15px;}
	#recent-posts .post-content { overflow: visible; }

    #wrapper #main.portfolio-main { text-align: center; }

    .portfolio-grid .portfolio_item { width: 100%; margin-right:0; margin-left:0; border:none;  }
    .portfolio_item-related-grid .post-thumb a:before, .portfolio-grid .post-thumb a:before { display: none; }
    .portfolio_item-related-grid  { text-align: center;}
    .portfolio_item-related-grid li { width: 100%; margin: 0 0 15px; float: none; text-align: center; }

    .bottombar .wpzoom { float: none; }

}