/*--------------------------------------------------------------

 Project   : Total WordPress Theme
 Purpose   : Responsiveness
 Author    : WPExplorer
 Theme URI : http://www.wpexplorer.com

/*------------------------------------------------------------------
[Table of contents]

# Visibility
# Greater than tablets
# Tablet & Small Desktop Widths 768px - 1280px
# All Devices under 960px
# Tablet Landscape
# Tablet Portrait
# Under 500px
# Phone Portrait and Landscape
# Phone Landscape
# Visual Composer
# Font Awesome Smoothing

/*------------------------------------------------------------------
[# Visibility]
-------------------------------------------------------------------*/
.hidden-desktop,
.visible-phone,
.visible-tablet,
.visible-tablet-landscape,
.visible-tablet-portrait { display: none !important }

/*------------------------------------------------------------------
[# Greater than tablets]
-------------------------------------------------------------------*/
@media only screen and (min-width: 768px) {
    .content-area { max-width: 70% }
    #sidebar { max-width: 26% }
}

/*------------------------------------------------------------------
[# Tablet & Small Desktop Widths 768px - 1280px]
-------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 1280px) {

    /* nav edits */
    #site-navigation .dropdown-menu li.flip-drops-smallscreen ul ul { left: auto; right: 100%; }
    body #site-navigation .sf-menu li.flip-drops-smallscreen ul a.sf-with-ul { padding-left: 25px; padding-right: 12px; }
    #site-navigation .dropdown-menu li.flip-drops-smallscreen ul .fa-angle-right { left: 9px; right: auto; }
    #site-navigation .dropdown-menu li.flip-drops-smallscreen ul .fa-angle-right:before { content: "\f104" }
    #site-navigation .dropdown-menu li.megamenu ul ul { right: auto; left: 0; }
    body #site-navigation .dropdown-menu li.megamenu ul.sub-menu a.sf-with-ul { padding-left: 12px }
}

/*------------------------------------------------------------------
[# All Devices under 960px]
-------------------------------------------------------------------*/
@media only screen and (max-width: 959px) {

    /* visibility */
    .hidden-desktop { display: block !important }

    /* hide things */
    .header-one-search-toggle,
    .visible-desktop,
    .post-edit { display: none !important }

    /* boxed */
    .boxed-main-layout #wrap { overflow: hidden }

    /* full width content and sidebar */
    .content-area { width: 100%; max-width: none; }
    #sidebar { width: 100%; max-width: none; }
    body.has-composer.has-sidebar #primary { margin-bottom: 40px }

    /* Header > Logo */
    #site-header #site-logo { height: 100%; float: left; text-align: left; }
    body.rtl #site-header #site-logo { float: right; text-align: right; }

    /* Header > Navbar */
    body.has-mobile-menu #site-navigation-wrap { display: none }
    body.has-mobile-menu .wpex-mobile-menu-toggle { display: block }

    /* Add some spacing for toggle menu */
    body.wpex-mobile-toggle-menu-icon_buttons #site-header-inner.container { padding-right: 80px; }

    /* Header > Mobile Menu Disabled */
    body.mobile-menu-disabled #site-header #site-logo { float: none; text-align: center; margin: 0 auto 20px 0; }
    body.mobile-menu-disabled #site-logo a { display: inline; display: inline-block; float: none; }
    body.mobile-menu-disabled #site-logo img { display: block }
    body.mobile-menu-disabled #site-header #site-navigation-wrap { position: relative; top: auto; right: auto; clear: both; margin: 0; }

    /* Header > Mobile Menu Toggle Buttons Under Logo */
    .wpex-mobile-toggle-menu-icon_buttons_under_logo #site-header #site-logo { float: none !important; display: block; text-align: center; width: 100%; max-width: none; }
    .wpex-mobile-toggle-menu-icon_buttons_under_logo #site-logo-inner { display: block; }
    .wpex-mobile-toggle-menu-icon_buttons_under_logo #site-header #site-logo img { display: inline; float: none; }

    /* Header > Fixed Top Mobile Menu */
    body.has-mobile-menu.wpex-mobile-toggle-menu-fixed_top { padding-top: 50px; } /* offset fixed mobile menu*/
    body.has-mobile-menu.wpex-mobile-toggle-menu-fixed_top #site-header #site-logo { float: none; width: 100%; text-align: center; }

    /* Page Title */
    body.has-breadcrumbs .page-header-title { max-width: 100%; width: 100%; }

    /* Visual Composer tabs */
    .wpb_tour .wpb_tour_tabs_wrapper .wpb_tabs_nav,
    .wpb_tour .wpb_tab,
    .wpb_tour_next_prev_nav { width: 100%; float: none; margin-left: 0; }
    .wpb_tour .wpb_tour_tabs_wrapper .wpb_tab { width: 100%; }
    .wpb_tour .wpb_tab { padding-left: 0; padding-right: 0; border: none; }
    .wpb_tour, .wpb_tour .wpb_tour_tabs_wrapper .wpb_tab { border: none !important }
    .wpb_tour .wpb_tour_tabs_wrapper .wpb_tab { padding: 20px 0 0 !important }
    .wpb_tour .wpb_tour_next_prev_nav { display: none !important }
    .wpb_tour .wpb_tabs_nav { border: 1px solid #e4e4e4 }
    .wpb_tour .wpb_tabs_nav li { background: none; border-bottom: 1px solid #e4e4e4; border-right: 0; margin: 0; }
    #wrap .wpb_tour .wpb_tabs_nav li a { padding: 10px }

}

/*------------------------------------------------------------------
[# Tablet Landscape]
-------------------------------------------------------------------*/
@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape) {
    .hidden-desktop,
    .visible-tablet,
    .visible-tablet-landscape { display: block !important }
    .visible-desktop,
    .hidden-tablet-landscape { display: none !important }
}

/*------------------------------------------------------------------
[# Tablet landscape VC Fix]
-------------------------------------------------------------------*/
@media only screen and (min-width:768px) and (max-width:1024px) {
    .compose-mode .hidden-desktop,
    .compose-mode .visible-tablet,
    .compose-mode .visible-tablet-landscape { display: block !important }
    .compose-mode .visible-desktop,
    .compose-mode .hidden-tablet-landscape { display: none !important }
}

/*------------------------------------------------------------------
[# Tablet Portrait]
-------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

    /* visibility */
    .hidden-desktop,
    .visible-tablet,
    .visible-tablet-portrait { display: block !important }
    .visible-desktop,
    .hidden-tablet,
    .hide-on-tablets,
    .tparrows.custom,
    .hidden-tablet-portrait { display: none !important }

    /*hide things*/
    .single .meta-comments,
    .blog-entry .wpex-social-share { display: none }

    /* main  */
    body.boxed-main-layout#wrap { width: auto !important }

    /* fullwidth columns on tablet */
    .tablet-fullwidth-columns .col,
    .tablet-fullwidth-columns .wpb_column,
    .tablet-fullwidth-columns .vcex-feature-box-content,
    .tablet-fullwidth-columns .vcex-feature-box-media { width: 100% !important; margin-left: 0 !important; height: auto !important; }
    .tablet-fullwidth-columns .vcex-feature-box-media { margin-bottom: 30px }
    .tablet-fullwidth-columns.vcex-feature-box-match-height .vcex-feature-box-image { position: inherit; top: auto; left: auto; max-width: 100%; }
    .tablet-fullwidth-columns.vcex-feature-box-match-height .vcex-feature-box-image img { max-width: 100% }
    .tablet-fullwidth-columns.vcex-feature-box.left-content-right-image .vcex-feature-box-content { padding-right: 0px }
    .tablet-fullwidth-columns.vcex-feature-box.left-image-right-content .vcex-feature-box-content { padding-left: 0px }

    /* page header */
    .site-breadcrumbs { position: inherit; top: auto; left: auto; right: auto; margin-top: 0; }
    .boxed-main-layout .site-breadcrumbs { padding: 0 30px }

    /* portfolio  */
    .single-portfolio-media { width: 100%; margin: 0 0 20px; }
    .single-portfolio-content { width: 100%; margin: 0; }

    /* turn 4 column masonry grids into 2 columns */
    .wpex-row .span_1_of_4.col-3.col,
    .wpex-row .span_1_of_4.col.product:nth-child(2n+3) { margin-left: 0; clear: both; }
    .wpex-row .span_1_of_4.col,
    .vcex-isotope-grid .span_1_of_4.col,
    .wpex-isotope-grid .span_1_of_4.col { width: 50% }

    /* make footer columns 1 column*/
    #footer-widgets .col { width: 100% }

    /* blog */
    .social-share-title { margin: 40px 0 15px }
    .social-share-title span { background: #fff; padding-right: 15px; }
    .social-share-wrap.position-vertical .social-share-title { display: block }
    .wpex-social-share.position-vertical { margin: 0 0 40px }
    .wpex-social-share.position-vertical { position: inherit; top: auto; left: auto; width: auto; height: auto; margin-top: 30px; }
    #content-wrap.left-sidebar .wpex-social-share.position-vertical { right: auto; left: auto; }
    .wpex-social-share.position-vertical li { float: left; border: none; }
    .wpex-social-share.position-vertical li a { color: #999; padding: 0 10px; height: 30px; line-height: 30px; display: block; width: auto; border: 1px solid #e4e4e4; margin: 0 5px 0 0; }
    .wpex-social-share.position-vertical li:first-child { border-top: 0 }
    .wpex-social-share.position-vertical .social-share-button-text { display: inline; display: inline-block; }

    /* useful common classes */
    .tablet-single-column { width: 100% !important }

}

/*------------------------------------------------------------------
[# Under 500px]
-------------------------------------------------------------------*/
@media only screen and (max-width: 500px) {
    .mobile-menu-extra-icons { display: none !important }
    .mobile-menu-extra-icons.mobile-menu-shopping-cart { display: inline-block !important }
}

/*------------------------------------------------------------------
[# Phone Portrait and Landscape]
-------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {

    /* visibility */
    .hidden-desktop { display: block !important }
    .visible-desktop { display: none !important }
    .hidden-phone { display: none !important }
    .visible-phone { display: block !important }

    /* hide things */
    .hide-on-phones,
    .tparrows.custom { display: none !important }
    .vcex-caroufredsel .staff-social { display: none }
    .gallery-format-post-slider-wrap .flex-direction-nav { display: none }

    /* grid & main  */
    #wrap { width: 100% !important }
    body.boxed-main-layout#wrap { width: auto !important }
    /*body.vc_responsive .wpb_column { float: left; width: 100%; }*/

    /*.full-width-main-layout .center-row-inner { margin: 0 }*/
    .col,
    .blog-entry { width: 100% !important; margin-bottom: 25px; }
    .content-area,
    #sidebar { float: none; width: 100% !important; }

    /* remove padding around boxed layout */
    .boxed-main-layout #outer-wrap { padding: 0 !important }

    /* logo */
    #site-logo { margin-top: 0px !important; margin-bottom: 0px !important; }

    /* coloumns */
    #wrap .wpex-row .col { width: 100% !important; }
    #wrap .wpex-row.gap-none .col { margin-bottom: 0 !important }
    .row-no-spacing .wpb_column { margin-bottom: 0 }
    .vc_span12.wpb_column { margin-bottom: 0 !important }

    /* Entries > Left Thumbnail Style */
    .entries.left-thumbs .entry .entry-media { margin-bottom: 20px }
    .entries.left-thumbs .entry .entry-media,
    .entries.left-thumbs .entry .entry-details { float: none; width: 100%; }

    /*phone full-width*/
    .phone-fullwidth-columns .col,
    .phone-fullwidth-columns .wpb_column,
    .phone-fullwidth-columns .vcex-feature-box-content,
    .phone-fullwidth-columns .vcex-feature-box-media { width: 100% !important; margin-left: 0 !important; height: auto !important; }
    .phone-fullwidth-columns .vcex-feature-box-media { margin-bottom: 30px }
    .phone-fullwidth-columns.vcex-feature-box-match-height .vcex-feature-box-media .vcex-feature-box-image { position: inherit; top: auto; left: auto; max-width: 100%; }
    .phone-fullwidth-columns.vcex-feature-box-match-height .vcex-feature-box-media .vcex-feature-box-image img { max-width: 100% }
    .phone-fullwidth-columns.vcex-feature-box.left-content-right-image .vcex-feature-box-content { padding-right: 0px }
    .phone-fullwidth-columns.vcex-feature-box.left-image-right-content .vcex-feature-box-content { padding-left: 0px }

    /* top-bar */
    #top-bar { padding: 20px 0; }
    #top-bar-content { float: none; text-align: center; }
    #top-bar-social.top-bar-left,
    #top-bar-social.top-bar-right { position: inherit; left: auto; right: auto; float: none; text-align: center; height: auto; line-height: 1.5em; }
    body.boxed-main-layout #top-bar-social.top-bar-right { right: auto; }
    .top-bar-right { padding-top: 20px; float: none; text-align: center; }
    #top-bar-social { text-align: center }
    #top-bar-social a { display: inline-block; float: none; margin-top: 7px; }
    #top-bar #lang_sel { text-align: left }
    body.rtl #top-bar #lang_sel { text-align: right }

    /* page header */
    .page-header.background-image-page-header .page-header-table { height: 150px; }
    .page-header.background-image-page-header .page-header-title,
    .centered-page-header .page-header-title,
    .centered-minimal-page-header .page-header-title { font-size: 1.846em }
    .centered-page-header .page-subheading,
    .centered-minimal-page-header .page-header-subheading,
    .page-header.background-image-page-header .page-subheading { font-size: 1.077em }

    /* slider  */
    .page-slider .ls-container .ls-nav-prev,
    .page-slider .ls-container .ls-nav-next { display: none !important }

    /* header  */
    body.has-breadcrumbs .page-header-title { max-width: 100%; width: 100%; }
    .site-breadcrumbs { display: none }

    /* composer extension */
    .vcex-filter-links li { float: none !important; width: 100% !important; margin: 0 0 5px !important; }
    .vcex-filter-links li a { display: block }

    /* portfolio  */
    .portfolio-archives-filter li { float: none; margin: 0 0 5px; }
    .filterable-portfolio { margin-left: 0; margin-right: 0; }

    /* blog  */
    #single-post-next-prev { top: 0 }
    .entry-has-avatar .blog-entry-header { width: 100%; padding: 0; min-height: 0; }
    .blog-entry-author-avatar { display: none }
    .related-post { width: 100% !important }
    .author-bio-avatar { position: inherit; left: auto; top: auto; margin-bottom: 20px; }
    .author-bio { padding-left: 25px; }
    .author-bio-social a { margin-top: 5px; }

    /* clear match heights js */
    .blog-entry.grid-entry-style .blog-entry-inner,
    .match-height-content { height: auto !important }

    /* social share */
    .social-share-title { display: block }
    .blog-entry .wpex-social-share { display: none }
    .social-share-title { margin: 40px 0 15px }
    .social-share-title span { background: #fff; padding-right: 15px; }
    .wpex-social-share.position-vertical { position: inherit; top: auto; left: auto; width: auto; height: auto; }
    #content-wrap.left-sidebar .wpex-social-share.position-vertical { right: auto; left: auto; }
    .wpex-social-share.position-verticals li { float: left; border: none; }
    .wpex-social-share.position-vertical li a { color: #999; width: 30px; height: 30px; line-height: 30px; display: block; border: 1px solid #e4e4e4; margin: 0 5px 0 0; }
    .wpex-social-share.position-vertical li:first-child { border-top: 0 }

    /* comments */
    #comments .children { margin-left: 0; }
    .comment-form-author input,
    .comment-form-author input,
    .comment-form-email input,
    .comment-form-website input,
    .comment-form-comment input,
    .comment-form-url input { width: 100% }

    /* sidebar  */
    #main .widget_nav_menu li a:before { display: none }

    /* footer callout  */
    #footer-callout-left,
    #footer-callout-right { width: 100%; margin: 0; float: none; }
    #footer-callout-right { margin-top: 20px }
    #footer-bottom { text-align: center; padding: 30px 0; }
    #footer-bottom-menu { position: static; top: auto; right: auto !important; left: auto !important; margin: 10px 0 0; text-align: center; height: auto; line-height: inherit; }
    #footer-bottom-menu ul li { float: none; display: inline-block; height: auto; line-height: inherit; margin-top: 10px; }
    #footer-bottom-menu ul li a,
    #footer-bottom-menu ul li a:hover { text-decoration: underline }

    /* vc tabs */
    .wpb_tabs.tab-style-default .wpb_tabs_nav { height: auto }
    .wpb_tabs .wpb_tabs_nav li,
    .wpb_tabs .wpb_tabs_nav li a { float: none; width: 100% !important; }
    .wpb_tabs.tab-style-alternative-one .wpb_tabs_nav { float: none }
    .wpb_tabs.tab-style-alternative-one .wpb_tabs_nav li a { border-left: 0; border-radius: 0 !important; -moz-border-radius: 0 !important; -webkit-border-radius: 0 !important; }
    .wpb_tabs.tab-style-alternative-two { border: none }
    .wpb_tabs.tab-style-alternative-two .wpb_tabs_nav li a { border-top: 1px solid #eee }

    /* vc post types slider */
    .vcex-posttypes-flexslider .vcex-img-flexslider-caption { padding: 10px; text-align: center; background: rgba(0,0,0,0.7); }
    .vcex-posttypes-flexslider .vcex-img-flexslider-caption .title { font-size: 14px }
    .vcex-posttypes-flexslider .vcex-img-flexslider-caption .excerpt { display: none }
}

/*------------------------------------------------------------------
[# Phone Landscape]
-------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {

    /* visibility */
    .hidden-desktop { display: block !important }
    .visible-desktop, .hidden-phone { display: none !important }

    /* grid */
    .content-area, #sidebar { width: 100%; float: none; }
    .col { width: 100%; margin-left: 0; margin-right: 0; margin-bottom: 30px; }
    .row-no-spacing .wpb_column { margin-bottom: 0 }
    .equal-height-column { height: auto !important }

    /* misc */
    .wpex-flickr-widget .flickr_badge_image { width: 23% }

}

/*------------------------------------------------------------------
[# Visual Composer]
-------------------------------------------------------------------*/
@media screen and (max-width: 860px) {
    .wpex-responsive .vcex-flexslider-wrap .flex-direction-nav .flex-prev { opacity: 1; left: 10px; }
    .wpex-responsive .vcex-flexslider-wrap .flex-direction-nav .flex-next { opacity: 1; right: 10px; }
    .wpex-responsive .vcex-callout.with-button .vcex-callout-caption { width: 100%; padding-right: 0; }
    .wpex-responsive .vcex-callout-caption { float: none; width: 100%; text-align: center; }
    .wpex-responsive .vcex-callout-button { float: none; width: 100%; float: none; display: block; position: inherit; right: auto; top: auto; margin: 15px auto 0; text-align: center; }
    .wpex-responsive .vcex-callout-button .theme-button { display: inline-block; float: none; }
    .wpex-responsive .vcex-galleryslider-entry-title { font-size: 13px; padding: 10px; }
}

/*------------------------------------------------------------------
[# Font Awesome Smoothing]
-------------------------------------------------------------------*/
.sidr-class-toggle-sidr-close:before,
.sidr-class-dropdown-toggle:before,
.sidr-class-dropdown-menu ul a:before,
.sidr-class-mobile-menu-searchform:after { font-weight: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }