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

    .nav-position {
      height: 64px; 
    }
    h1.logo {
      margin: 0;
    }
    .logo img {
      width: 64px;
      height: auto;
      margin-left: 16px; 
      margin-top: -120px;
    }

    .icon-socials img {
      width: 36px;
      height: auto;
    }

    .socials li {
      margin-top: 16px;
      padding-right: 16px;
    }

    img {
      max-width: 100%;
      padding: 0;
      margin: 0;
      margin: 0 auto;
    }

    section.ecosystem ul {
      margin-top: 0;
    }

    section {
      padding-left: 2%;
      padding-right: 2%;
    }
    
    .w-30 {
      width: 100%;
      margin: 0 auto;
    }
    .team-img {
      width: 150px;
      height: auto;
    } 

    .logos-box {
      display: flex;
      flex-wrap: wrap;
    }

    .logo-item {
      flex: 1 1 33%;
      margin-bottom: 24px; 
    }  
    .logo-item img {
      width: 128px;
      height: auto;
    }

    .text-6xl {
      font-size: 2.25rem; /* 36px */
      line-height: 2.5rem; /* 40px */
    }

    .text-4xl {
      font-size: 1.5rem; /* 24px */
      line-height: 2rem; /* 32px */
    }

   
    .w-55 {
      width: 70%; 
      margin: 0 auto;
    }

    .mt-40 { 
      margin-top: 4rem; /* 64px */
    }

    .rock2 {
      right: 0px;
      top: -60px;
      width: 20%;
      height: auto;
    }

    .rock1 {
      left: 15px;
      top: -40px;
      width: 40%;
      height: auto;
    }
    /* gamers guilds games */
    .col3 img {
      width: 180px;
      height: auto;
    }

    .bg-player {
      display: block;
      position: relative;
      width: 40%;
      height: auto;
      top: 0;
      left: 0;
    }

    .bg-property {
      display: block;
      position: relative;
      right: 0;
      top: 16px;
      width: 40%;
      height:  auto;
    }

    .space-el-1, .space-el-2 {
      display: none;
    }

    .flexParent {
      width: 100%;
      display: flex;
      flex-direction: column;
    }

    .col2, .col3 {
      padding: 0 0;
      display: block;
      width: 100%;
    } 

    .team-img {
      width: 100px;
      height: auto;
    }

    .team-avatar .mt-2 {
      margin-top: 0;
    } 

    .team-avatar .px-4 {
      padding-left: 1rem; /* 16px */
      padding-right: 0; 
    }	

    .team .mt-10 {
      margin-top: 0;
    }
    .team h2 {
      padding-bottom: 24px;
    }

    .footer p { 
      font-size: 16px;
      text-align: center;
      margin-bottom: 64px;
    }
    
    /* own your saga - for mxp popup */
    .strokedTextPurple {
      font-size: 4rem;
      line-height: 4rem;
    }

     /* modal */
    .grid-stack {
      position: relative;
      display: grid;
      grid-template-columns: repeat(14, 1fr);
      grid-template-rows: 80px repeat(3, 1fr);
      margin: 0; 
    }
    .grid-logo img {
      width: 100px;
      height: auto;
    }
    .grid-logo {
      grid-column: 1 / span 14;
    }
    .grid-element-mid {
      grid-column: 2 / span 12;
      margin-top: 5px;
      margin-bottom: 10px;
    }
    .grid-element-topLeft,
    .grid-element-bottomLeft {
       grid-column: 1 / span 1;
    }
    .grid-element-topRight,
    .grid-element-bottomRight {
       grid-column: 14 / span 1;
    }
    .litepaper-content {
      font-size: 1rem;
      padding: .75rem 1rem; 
    }
    /* end modal */    

}