.snowflake {
    position: absolute;
    width: 10px;
    height: 10px;
    background: linear-gradient(white, white); /* Workaround for Chromium's selective color inversion */
    border-radius: 50%;
    filter: drop-shadow(0 0 10px white);
}

.tooltipx {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
  cursor: pointer;
}

.tooltipx .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  margin-top: -60px; 
}

.tooltipx.active .tooltiptext {
  visibility: visible;
}

.icon_atm10 {
  width:100%;
}

footer .footer-howto {
  max-height: 40px;
  margin-bottom: 0;
  position: relative;
}

.page-section .howto {
  height: 74.5vh;
  width: 100%;
}

.spacinghowto {
  height: 50px;
}

.spacinghowtohub {
  height: 15px;
}


.fancytitle h3 {
  /* margin: 20px; */
  font-family: "Paytone One";
  color: #202020;
  text-transform: uppercase;
  letter-spacing: -2px;
  text-align: center;
}

.fancytitle h3 span {
  display: block;
  margin: 11px 0 25px 0;
  font-size: 50px;
  line-height: 50px;
  color: #084f8dcc;
  text-shadow: 0 13.36px 8.896px #110f0f,0 -2px 1px #0c589bcc;
  letter-spacing: -4px;
}

/*USED ON THE JOIN SERVER INSTRUCTION PAGE TO CREATE A GRID AND ALIGN THE INFORMATION*/
.gridForServerJoin 
{
  display: grid;
  grid-template-columns: repeat(4, 1fr) 0 repeat(4, 1fr);
  grid-template-rows: 0.25fr repeat(4, 1fr);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  text-align:center;
}

/*---------------DIV CLASSES USED FOR THE INDIVIDUAL INFORMATION/VIDEO FOR THE JOIN INSTRUCTION PAGE.---------------*/
/*Par header*/
.divJoin1 
{ 
grid-area: 1 / 1 / 2 / 10;
    margin-left:auto;
    margin-right:auto;
}
/*Desc */
.divJoin5 
{ 
  grid-area: 2 / 2 / 6 / 5;
    margin-left:auto;
    margin-right:auto;
}

/*HOW-TO VIDEO*/
.divJoinVideo { 
  grid-area: 2 / 6 / 6 / 9; 
  margin-left:auto;
  margin-right:auto;

}

/*Used for the title of the "how to join" pages*/
.fancytitle h4 span {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 7VH;
  color: #084f8dcc;
  text-shadow: 0 13.36px 8.896px #110f0f,0 -2px 1px #0c589bcc;
}

/*Container for how-to videos (for dynamic resizing)*/

.howToVideo {
  width: 50vw;
  margin-right: auto;
  margin-left: auto;
  height: auto;
  aspect-ratio: 16 / 9;
}
