/* ---------------------------------------------- */
/* ---------------------------------------------- */
/*CONTENT media queries */
/* ---------------------------------------------- */

          /* ----------------------- */
          /*------ COMPUTER ---------*/
          /* ----------------------- */
      @media screen and (max-width: 2000px) {
        .identity{
            width: 100%;
            height: auto;
                display: flex;
                flex-direction: row;
        }
            .profile1{
                width: 20%;
                height: auto;
                padding: 2%;
            }
                .profile2{
                    width: 75%;
                    height: auto;
                    padding-top: 4%;
                }
                .profileimg{
                    width: 90%;
                    height: auto;
                    border-radius: 50px;
                    border: 5px outset var(--borderpink);
                    margin-top: 40%;
                }
                .divider{
                    width: 100%;
                    height: 1%;
                }
                .info{
                    width: 100%;
                    display: flex;
                    flex-direction: row;
                    justify-content: space-evenly;
                }
                .key{
                    width: 100%;
                    display: flex;
                    flex-direction: row;
                    justify-content: space-evenly;
                    flex-wrap: wrap;
                }
                .keybox{
                    width: 12%;
                    height: auto;
                    padding: .5em;
                    text-align: center;
                    line-height: 1.5em;
                    border-bottom: 2px solid rgb(31, 211, 172);
                    text-shadow: 1px 1px 5px #ffffff90;
                    background-color: #65ffe03d;
                    border-radius: 15px;
                }
                .flag-div{
                    width: 100%;
                    display: flex;
                    justify-content: center;
                    flex-wrap: wrap;
                }
                .lilflag{
                    width: 60px;
                    height: 40px;
                    border-radius: 12px;
                    padding: 1%;
                }
        .preferredterms{
            width: 100%;
            height: auto;
                display: flex;
                flex-direction: row;
        }
            .words-grid{
                width: 100%;
                display: grid;
                grid-template-columns: auto auto auto;
                grid-template-rows: auto auto auto;                
                padding: 5px;
                gap: 1%;
                text-shadow: 1px 1px 5px #ffffff6a;
            }
                .words-grid > div{
                  background-color: rgba(22, 46, 46, 0.853);
                  border-radius: 15px;
                  padding: 5%;
                }
                  .pronouns{
                    grid-column: 1 / span 1;
                  }
                  .honorifics{
                    grid-column: 1 / span auto;
                  }
                  .person-fam{
                    grid-column: 3 / span 1;
                  }

              .list-grid{
                width: 100%;
                height: auto;
                display: grid;
                grid-template-columns: 25% 75%;
                border: 3px outset rgb(44, 192, 179);
                border-radius: 10px;
                margin-top: 2%;
              }
                  .list-1{
                    color: #ffffff;
                    font-size: 18px;
                    text-align: center;
                    border-bottom: 1px solid rgb(44, 192, 179);
                    padding-top: 15%;
                  }
                  .list-2{
                    text-align: center;
                    border-bottom: 1px solid rgb(41, 181, 170);
                }
      }

          /* ----------------------- */
          /*------ MOBILE ---------*/
          /* ----------------------- */
      @media screen and (max-width: 600px) {
                
        }