/* Responsive layout */
/* @media only screen and (max-width:1300px) { */

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

  /* .row1 {
    width: 100%;
    min-width: auto;
    min-height: auto;
    transform: translate(0, 0);
    border-left: black 0px solid;
  } */

  .main-scrollContents {
    top: 58px;
    width: 100%;
    /* width: calc(100% - 20px); */
    height: calc(100% - 58px);
    padding: 0;
  }

  .main-R {
    background: transparent;
  }

  #menu-arena {
    display:block;
  }

  .toolsWorld {
    left: 0;
    width: 100%;
    min-width: auto;
    min-height: auto;
    transform: translate(0, 0);
  }
  

  .arena-project {
    /* padding-top: 58px; */
    top: 58px !important;
    height: calc(100% - 58px) !important;
  }

}

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

  .font-menu {
    padding-right: 4px;
  }

  h1 {
    margin-block-end: 50px;
  }

}


@media only screen and (max-height:400px) {

}

@media only screen and (min-width:1125px) {

}

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



}


/* Tablet =============================================== */

@media only screen and (max-width:1077px) { /* For tablets: */

  .col2 {
    grid-template-columns: 1fr;
    row-gap: 0px;
  }
  

}

@media only screen and (max-width:800px) { /* For tablets: */




}

@media only screen and (max-width:600px) {   /* For tablets: */

  .menu-bg {
    height: 80px;
  }

  .menu-top-left {
    left: 0;
    /* width: 100%; */
    padding: 0 15px 0 15px;
  }

  .menu-top-right {
    top: 38px;
    left: 0;
    padding: 0 15px 0 15px;
  }


  /* .d-btn {
    display: none;
  } */

  .row1 {
    min-width: auto;
    min-height: auto;
    transform: translate(0, 0);
  }
  
  .main-scrollContents {
    top: 88px;
    width: 100%;
    height: calc(100% - 88px);
    padding: 0;
  }

  .main-L {
    width: 100%;
    padding: 0 15px 0 15px;
  }

  .main-R {
    display: none;
  }

  .row6 {
    padding-left: 28px;
  }

  .arena-project {
    top: 88px !important;
    width: 100%;
    /* width: calc(100% + 20px); */
    height: calc(100% - 88px) !important;
    padding: 0px !important;
  }

  .scrollContents {
    top: 0;
    width: 100%;
    height: 100svh;
    padding: 0;
  }
  
  .scrollContents-margin {
    top: 0;
    height: 100svh;
    padding: 0 15px 0 0;
  }

  .iframe-full {
    padding: 0 15px 0 15px;
  }


  /* .row3 {
    top: 88px;
    left: 0;
    width: 100%;
    height: calc(100% - 88px);
    margin: 0;
    min-width: auto;
    min-height: auto;
    transform: translate(0, 0);
    border: 0px solid #000000;
  } */

  .h-top {
    height: 134px;
  }

  .col2-full {
    grid-template-columns: 1fr;
    row-gap: 0px;
  }

  .col2 {
    padding: 0 15px 0 15px;
    grid-template-columns: 1fr;
    row-gap: 0px;
  }
  
  .col2-text {
    padding: 0 15px 0 15px;
    grid-template-columns: 1fr;
    row-gap: 0px;
  }

  .col2-S1 {
    grid-template-columns: 1fr;
  }

  .col2-S2 {
    grid-template-columns: 75px auto;
  }
  
  .col2-S3 {
    grid-template-columns: 75px 70px 70px auto;
  }

  .col-arena-R {
    width: 100%;
    padding: 0 15px 0 15px;
  }

  .col3-arena-1 {
    left: 0;
    transform: translate(0, 0);
    width: 100%;
    padding: 0 15px 0 15px;
  }

  .col3-arena-2 {
    left: 0;
    transform: translate(0, 0);
    width: 100%;
    padding: 0 15px 0 15px;
  }

  .col3-arena-3 {
    left: 0;
    transform: translate(0, 0);
    width: 100%;
    padding: 0 15px 0 15px;
  }

  .tbW, .tbWR3, .tbWR4 {
    grid-template-columns: 1fr;
    border-bottom: 1px solid #ffffff;
  }

  .tb3-1 {
    grid-template-columns: 45px 1fr 1fr;
    border-bottom: 1px dotted #ffffff;
  }

  .tb3-2 {
    grid-template-columns: 45px 1fr 1fr;
  }

  .tb4 {
  	display: grid;
    grid-template-columns: 45px 1fr 1fr;
    column-gap: 10px;
    row-gap: 10px;
    border-bottom: 1px solid #ffffff;
    /* backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px); */
  }

  .tb4Mo {
    display: none;
    /* color: transparent;
    grid-column:0;
    grid-row: 0; */
  }

  .p-title-sub {
    display: none;
  }

  .p-title-subM {
    display: block;
  }

  #btn_s_1 {
    color: white;
  }
  #syllabus_2 {
    display: none;
  }

  #btn_p1_1 {
    color: white;
  }
  #p1_magicSpells_2 {
    display: none;
  }
  
  #btn_p2_1 {
    color: white;
  }
  #p2_infiniteFigures_2 {
    display: none;
  }
  
  #btn_p3_1 {
    color: white;
  }
  #p3_ghosts_2 {
    display: none;
  }

  #btn_p4_1 {
    color: white;
  }
  #p4_terra_2 {
    display: none;
  }

  .font-menu {
    padding-right: 4px;
    padding-bottom: 4px;
  }

  h1 {
    margin-block-end: 20px;
  }

}

@media only screen and (max-width:450px) {   /* For tablets: */

}
