.theme-sidebar-open {
  position: fixed;
  top: 2.7rem;
  width: 3.3rem;
  height: 3.3rem;
  padding: 1rem;
  margin: -1rem;
  z-index: 1; }
  @media screen and (max-width: 768px) {
    .theme-sidebar-open {
      z-index: 12; } }
  .theme-sidebar-open svg {
    color: #ffffff;
    -webkit-transition: color 0.3s linear, z-index 0s 0.5s linear;
    transition: color 0.3s linear, z-index 0s 0.5s linear;
    cursor: pointer; }
    @media screen and (max-width: 768px) {
      .theme-sidebar-open svg {
        color: #cbcbcb; } }
  .theme-sidebar-open:hover svg {
    color: #707070;
    -webkit-transition: color 0.3s linear, z-index 0s linear;
    transition: color 0.3s linear, z-index 0s linear; }
  @media screen and (min-width: 769px) {
    .theme-sidebar-open {
      left: 2.7rem; } }
  @media screen and (max-width: 768px) {
    .theme-sidebar-open {
      right: 2.7rem; } }

@media screen and (max-width: 768px) {
  .theme-layout {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column; }
  .theme-header {
    -webkit-box-ordinal-group: 2;
    order: 1; }
  .theme-content {
    -webkit-box-ordinal-group: 3;
    order: 2;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
    flex-wrap: nowrap;
    -webkit-box-align: start;
    align-items: flex-start; }
  .theme-main {
    -webkit-box-ordinal-group: 2;
    order: 1;
    width: 100vw;
    flex-shrink: 0; }
  .theme-sidebar {
    -webkit-box-ordinal-group: 3;
    order: 2;
    width: 100vw;
    -webkit-box-flex: 1;
    flex-grow: 1;
    flex-shrink: 0;
    flex-basis: auto;
    -webkit-transition: -webkit-transform 0.5s ease-in-out;
    transition: -webkit-transform 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out;
    position: relative; }
    .theme-sidebar:target,
    .sidebar-open .theme-sidebar {
      -webkit-transform: translateX(-100vw);
      transform: translateX(-100vw); } }

@media screen and (min-width: 769px) {
  .theme-layout {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    height: 100vh;
    max-height: 100vh; }
  .theme-header {
    -webkit-box-ordinal-group: 3;
    order: 2;
    flex-shrink: 0;
    z-index: 1;
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 7.5rem;
    background-color: #ffffff; }
  .theme-content {
    -webkit-box-ordinal-group: 2;
    order: 1;
    width: 100%;
    -webkit-box-flex: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
    flex-wrap: nowrap;
    -webkit-box-align: stretch;
    align-items: stretch;
    position: relative; }
  .theme-main {
    flex-basis: 100%;
    -webkit-box-ordinal-group: 3;
    order: 2; }
  .theme-sidebar {
    width: 0;
    position: fixed;
    z-index: 2000;
    -webkit-box-ordinal-group: 2;
    order: 1;
    background-color: #ffffff;
    -webkit-box-flex: 1;
    flex-grow: 1;
    flex-shrink: 0;
    flex-basis: auto;
    -webkit-transition: width 0.5s ease-in-out;
    transition: width 0.5s ease-in-out; }
    .theme-sidebar:target,
    .sidebar-open .theme-sidebar {
      width: 45rem; } }

@media screen and (max-width: 768px) {
  .sidebar-open .theme-sidebar-open {
    display: none; } }

@media screen and (max-width: 768px) {
  .sidebar-open .theme-sidebar {
    position: fixed;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    z-index: 111; } }

.scrolled .theme-sidebar-open {
  top: 2rem; }