/*
Theme Name:     Foxiz child
Template:      	foxiz
Theme URI:      https://foxiz.themeruby.com
Author:         Theme-Ruby
Author URI:     https://themeforest.net/user/theme-ruby/portfolio/
Description:    Make your modifications to Foxiz in this child theme.
Version:        1.0
Tags:           custom-background, custom-menu, featured-images, theme-options, custom-colors, translation-ready, threaded-comments, translation-ready
License:        Themeforest Licence
License URI:    https://themeforest.net/licenses/standard
*/

/* Your CSS code goes here
-------------------------------------- */
:root {
  --content-width: 1400px;
  --takeover-width: 160px;
  --header-offset: 164px;
}

.background-takeover-left,
.background-takeover-right {
  position: fixed;
  top: var(--header-offset);
  width: var(--takeover-width);
  height: calc(100vh - var(--header-offset));
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  pointer-events: auto;
}

.background-takeover-left {
  right: calc(50% + (var(--content-width) / 2));
}

.background-takeover-right {
  left: calc(50% + (var(--content-width) / 2));
}

@media (min-width: 1920px) {
  :root {
    --takeover-width: 280px;
  }
}

@media (max-width: 1600px) {
  .background-takeover-left,
  .background-takeover-right {
    display: none;
  }
}

.notDisplayDesktop {
  display: none;
}

.notDisplayMobile {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  text-align: center;
  padding-top: 20px;
}

@media screen and (max-width: 768px) {
  .notDisplayDesktop {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    text-align: center;
    padding-top: 20px;
  }

  .notDisplayMobile {
    display: none;
  }
}