
.no-select, .btnHead{
  user-select: none;        /* Standard */
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none;   /* Firefox */
  -ms-user-select: none;    /* IE10+ */
}
*{
  image-rendering: optimizeSpeed;
}

#loading{
    height: 100%;
    width: 100%;
    position: absolute;
    top:0;
    left:0;
    background-color: black;
    transition: 2s ease-out opacity 1s;
}

.head div{
    padding-left: 1vw;
    padding-top: 0.5vh;
    font-size: 2vh;
    margin-bottom: 0;
}
#bts-grid{
  display: grid;
  grid-template-columns: repeat(5,1fr);
  grid-template-rows: repeat(3,1fr);
  gap: 0.6rem;
  padding: 2rem;
  width: 100%; height: auto;
  justify-items: center;
  box-sizing: border-box;
  align-items: stretch;
  transition: 0.4s;
  
}
.bts{
  background-color: #cea3f0;
  position: relative;
  transition: 0.25s ease;
  will-change: transform;
  transition: 0.5s, border-radius 0s;
  border-radius: 0.44rem;
  border-width: 1vh;
  display: block;
  width: 100%; height: auto;
  cursor: pointer;
}
.bts:hover{
    background-color: #DEC8DD !important;
    /* transform: scale(1.1); */
    letter-spacing: 0.03em;
    /* margin: 2% !important; */
}
#btn1{transform-origin: top left;      grid-row: 1/3;  grid-column: 1;}
#btn2{transform-origin: bottom left;   grid-row: 3;    grid-column: 1/3;}
#btn3{transform-origin: top right;    grid-row: 1;    grid-column: 2/6; justify-self: end;}
#btn4{transform-origin: center center; grid-row: 2;    grid-column: 2/5;}
#btn5{transform-origin: bottom center; grid-row: 3;    grid-column: 3/5; justify-self: end;}
#btn6{transform-origin: bottom right;  grid-row: 2/4;  grid-column: 5;}

.mainContent{
    margin-left: 10vw;
    margin-right: 10vw;
    
}
.mainContent #bts-grid .bts{
  align-items: end;
 }

@media (max-width:768px){
  #bts-grid{
    grid-template-columns: repeat(5,1fr);
    grid-template-rows: repeat(5,1fr);
    width: auto; height: auto;
  }
  .mainContent #bts-grid div p{
  line-break: normal;
  font-size: 2vh;
  }
  #btn1{transform-origin: center left;    grid-row: 2/5;  grid-column: 1/3; justify-self: start;}
  #btn2{transform-origin: bottom center;  grid-row: 5;    grid-column: 1/6; justify-self: center;}
  #btn3{transform-origin: top center;     grid-row: 1;    grid-column: 1/6; justify-self: center;}
  #btn4{transform-origin: center right;   grid-row: 2;    grid-column: 3/6; justify-self: end;}
  #btn5{transform-origin: center right;   grid-row: 3;    grid-column: 3/6; justify-self: end;}
  #btn6{transform-origin: center right;   grid-row: 4/5;  grid-column: 3/6; justify-self: end;}

}