.BUTTON_1 {
   background: #42C0F6;
   background-image: -webkit-linear-gradient(top, #42C0F6, #081203);
   background-image: -moz-linear-gradient(top, #42C0F6, #081203);
   background-image: -ms-linear-gradient(top, #42C0F6, #081203);
   background-image: -o-linear-gradient(top, #42C0F6, #081203);
   background-image: linear-gradient(to bottom, #42C0F6, #081203);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   color: #FFFFFF;
   font-family: Arial;
   font-size: 20px;
   padding: 10px;
   box-shadow: -2px 1px 4px 0px #000000;
   -webkit-box-shadow: -2px 1px 4px 0px #000000;
   -moz-box-shadow: -2px 1px 4px 0px #000000;
   text-shadow: 1px 1px 20px #000000;
   text-decoration: none;
   display: inline-block;
   cursor: pointer;
   margin-left: 7px;
   margin-top: 7px;
   float: left;
   width: 100px;
}

.BUTTON_2 {
   background: #42C0F6;
   background-image: linear-gradient(to bottom, #42C0F6, #081203);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   border-color: #000000;
   color: #FFFFFF;
   font-family: Arial;
   font-size: 20px;
   padding: 10px;
   box-shadow: -2px 1px 4px 0px #000000;
   -webkit-box-shadow: -2px 1px 4px 0px #000000;
   -moz-box-shadow: -2px 1px 4px 0px #000000;
   text-shadow: 1px 1px 20px #000000;
   text-decoration: none;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center; 
   cursor: pointer;
   margin-left: 7px;
   margin-top: 7px;
   float: left;
   width: 175px;
   height: 110px;
   white-space: pre-line; /* Forces browser to respect <br> */
}

.button-group {
  margin-bottom: 175px;  /* Space between the button groups */
}

.subtext {
  font-size: 16px;
  display: grid; /* Forces content to stack */
  text-align: center; /* Centers the text */
}


.BUTTON_3 {
   background: #42C0F6;
   background-image: -webkit-linear-gradient(top, #42C0F6, #081203);
   background-image: -moz-linear-gradient(top, #42C0F6, #081203);
   background-image: -ms-linear-gradient(top, #42C0F6, #081203);
   background-image: -o-linear-gradient(top, #42C0F6, #081203);
   background-image: linear-gradient(to bottom, #42C0F6, #081203);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   color: #FFFFFF;
   font-family: Arial;
   font-size: 20px;
   padding: 10px;
   box-shadow: -2px 1px 4px 0px #000000;
   -webkit-box-shadow: -2px 1px 4px 0px #000000;
   -moz-box-shadow: -2px 1px 4px 0px #000000;
   text-shadow: 1px 1px 20px #000000;
   text-decoration: none;
   display: inline-flex;
   justify-content: center;
   align-items: center;
   cursor: pointer;
   margin-left: 7px;
   margin-top: 7px;
   float: left;
   width: 150px;
   height: 80px;
}
.BUTTON_4 {
   background: #42C0F6;
   background-image: -webkit-linear-gradient(top, #42C0F6, #081203);
   background-image: -moz-linear-gradient(top, #42C0F6, #081203);
   background-image: -ms-linear-gradient(top, #42C0F6, #081203);
   background-image: -o-linear-gradient(top, #42C0F6, #081203);
   background-image: linear-gradient(to bottom, #42C0F6, #081203);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   color: #FFFFFF;
   font-family: Arial;
   font-size: 20px;
   padding: 10px;
   box-shadow: -2px 1px 4px 0px #000000;
   -webkit-box-shadow: -2px 1px 4px 0px #000000;
   -moz-box-shadow: -2px 1px 4px 0px #000000;
   text-shadow: 1px 1px 20px #000000;
   text-decoration: none;
   display: inline-flex;
   justify-content: center;
   align-items: center;
   cursor: pointer;
   margin-left: 7px;
   margin-top: 7px;
   width: 150px;
   height: 80px;
}



#map {
    float: left; 
    width: 100%; 
    height: 100px;
}
#wrapper {
   float: left;
   width: 100%;
}

#cover-spin {
    position:fixed;
    width:100%;
    left:0;right:0;top:0;bottom:0;
    background-color: rgba(255,255,255,0.7);
    z-index:9999;
    display:none;
}

@-webkit-keyframes spin {
	from {-webkit-transform:rotate(0deg);}
	to {-webkit-transform:rotate(360deg);}
}

@keyframes spin {
	from {transform:rotate(0deg);}
	to {transform:rotate(360deg);}
}

#cover-spin::after {
    content:'';
    display:block;
    position:absolute;
    left:48%;top:40%;
    width:40px;height:40px;
    border-style:dotted;
    border-color:#0087ff;
    border-top-color:transparent;
    border-width: 9px;
    border-radius:50%;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite;
}

/* Style the overlay */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none; /* Initially hidden */
    justify-content: center;
    align-items: center;
}

/* Style the spinner */
.spinner {
    border: 8px solid #f3f3f3;
    border-top: 8px solid #3498db;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 2s linear infinite;
}

/* Spinner animation */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}