/******************************************
* 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
add your styles in Customizer > Additional CSS.

*/


/* Tablet Landscape */
@media screen and (max-width: 1030px) {

    .inner-wrap { width: 94%; padding: 0 3%; }
    #content { width:66%;}

    #carousel img { max-width: 100%; height: auto; }

    #carousel .video_cover { position: relative; padding-bottom: 56.25%; display:block;  height: 0; overflow: hidden; width: 100%; max-width: 100%; }
    #carousel .video_cover  iframe,
    #carousel .video_cover  object,
    #carousel .video_cover  embed { position: absolute; top: 0; left: 15%; width: 70%; height: 70%; }

    .adv { display: none; }

    .home_widgets .home_column {  width: 32%; margin: 0 2% 0 0;  }
    .home_widgets .home_column img { max-width:100%; height:auto; }

    #featured-products ul li { width: 23%; margin-right:2%; }
    #featured-products ul li img { max-width:100%; height:auto;  }

    .recent-post .post-thumb img { max-width:100%; height:auto; }
    .recent-post .video_cover { position: relative; padding-bottom: 56.25%; display:block; padding-top: 30px; height: 0; overflow: hidden; width: 100%; max-width: 100%; }
    .recent-post .video_cover  iframe,
    .recent-post .video_cover  object,
    .recent-post .video_cover  embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

    .side_ad img { max-width: 100%; }
    #sidebar { width:30%; }
    .wpzoomSocial li { float: none; width:100%; }
    .widget_wpzoom-instagram li:nth-child(3n+3) { margin-right:12px; }

    #footer div.column { margin-right: 2%;  width: 31%; }
    #footer .column .widget {  width:100%; }

    #carousel-wrap.carousel--loaded { height: 100%; }
    #carousel > div { height: 100%; }
    #carousel .video_cover { margin-top:3%; }
    #carousel h3 { font-size: 24px; padding:10px 0;}
    #carousel .slide_content_wrap { bottom: 10%; }
    #carousel-wrap #pager { left: 43%; }
}


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

    #content { width:100%;}

    #sidebar { width:100%; float:none; }
    #sidebar .widget { float:none; }

    .welcome_message h2 { font-size: 24px; }

    .btn_menu { display: block; float: left; cursor: pointer; background: #276cdc url('images/menu.png') 8px 9px no-repeat; padding: 5px 5px 0; width: 30px; height: 30px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; margin: 10px 0; }

    .mobile-menu  { display: none; }

    #menu-wrap { display: none; }
    #menu .dropdown .sub-menu li { border: none; }
    #menu .dropdown .sub-menu { border: none; }
    #menutop .btn_menu { background-color: #1F394D; }
    .mobile-menu { display: none; clear: both; }
    .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; }
    #mainmenu { width: 100%; }
    #menu #mainmenu > li > a { border: none; padding-left: 0; }
    #menu #mainmenu > li > a:before { display: none; }
    #menutop .dropdown > li:after { display: none; }
    .dropdown .sub-menu li { border: none; }
    .dropdown a { float:none; }
    .dropdown a:hover { background:none; }
    .dropdown li ul li { border: none; }
    .dropdown li ul li a {  }
    .dropdown li:hover li a:hover {  }
    .dropdown li:hover a { background:none;  }
    .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; }

    #logo img { max-width:100%; height:auto; }

    #featured-products ul { margin-left:15%; }
    #featured-products ul li { width: 32%; margin-right:17%; }

    .share_box h3 { float: none; }
    .share_box .share_btn { border: none; float: none;}

    .copyright .left { float: none; text-align: center; margin:0 0 10px; }
    .copyright .right { float: none; text-align: center; }

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

}

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

    #logo a { font-size: 36px; }

    #carousel .slide_content_wrap { bottom: 13%; }

    .home_widgets { margin-left:0%;  }
    .home_widgets .home_column {  width:100%; margin: 0;  }

    .wpzoom-featured-category .post-thumb h4.cat-link { display: none; }

    .recent-post h2.post-title a { font-size: 24px; }

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

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

}

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

    #carousel h3 { font-size: 14px; }
    #carousel .slide_content_wrap { bottom: 21%; left:15%; width: 67%; }

    #featured-products ul { margin-left:21%; }
    #featured-products ul li { width: 72%; margin-right:0; }
}