@import "components/layout";

.about-loaded{
  .loading-screen{
    display: none;
  }
  .ti-about-wrap{
    display: block;
  }
}

.loading-screen {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ti-about-wrap {
  display: none;
  position: relative;
  font-size: 15px;
  max-width: 100%;
  @import "components/generic";
  @import "components/header";
  @import "components/tablist";
  @import "components/sidebar";
  @import "components/tabs";
  @import "components/plugins-tab";
  @import "components/free_pro_table";
  @import "components/changelog";


  @media (max-width: 1200px) {
    .header .header-info {
      padding: 10px 15px 5px;

      h1 {
        font-size: 24px;
      }

      img {
        height: 65px;
      }
    }
    .ti-about-tablist {
      padding-left: 15px;

      a {
        margin: 0 8px;
      }
    }
    .main-content {
      flex-direction: column;
      padding: 15px;
    }
    #about-tabs, .about-sidebar {
      width: 100%;
      margin-bottom: 20px;
      margin-right: 0;
      box-sizing: border-box;
    }
    .about-sidebar-item:not(:last-child) {
      border-bottom: 1px solid #ccc;
    }
    .about-sidebar-item:last-child {
      margin-bottom: 0;
      padding-bottom: 0;
    }
  }
}

@media screen and (max-width: 782px) {
  .auto-fold #wpcontent {
    padding-left: 0;
  }
  .ti-about-wrap .ti-about-tablist {
    padding: 0;
    flex-wrap: wrap;
    z-index: unset;
    border-top: 1px solid #ccc;
    border-bottom: none;

    li {
      width: 50%;
      text-align: center;
      border-bottom: 3px solid #ccc;

      a {
        margin: 0;
      }
    }
  }
  .ti-about-wrap #about-tabs {
    > div {
      &.columns-2 > div, &.columns-3 > div {
        width: 100%;
      }
    }
  }
}