#popup {
      display: none; position: fixed; top: 17rem; left: 50%; transform: translate(-50%, -50%); background-color: #ebf9ff; border: 2px solid #7bceee; border-radius: 8px; box-shadow: 0 0 15px rgba(0,0,0,0.3);
      z-index: 1000; padding: 2%; }

#overlay {
    display: none; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.2); z-index: 999;}

.close-btn {  
    position: absolute; top:0; right: 0; margin: .5rem; background-color: #7bceee; color: white; border: none; padding: 0.5rem 1rem; cursor: pointer; border-radius: 4px; }

.PopupHeader {
    font-size: 1.5em; font-weight: bold; margin: 1.5rem 0; text-align: center; width: fit-content; width: 100%; color: #164a5e; }

.PopupHeader1 {color: #2175b6;}

.PopupField {
    font-size: 1em; font-weight: 400; line-height: 3em; border: 2px solid #0c8edc; border-radius: 27px; box-shadow: 0 -1px 7px transparent; display: block; margin-bottom: 5px; padding: 0 1%; transition: box-shadow .3s cubic-bezier(.77, 0, .175, 1); width: 90%; float: left; display: inline-block; margin: 2% 4%; text-align: center;}

.PopupButton {
    font-size: 1em; line-height: 3em; border: 2px solid #fff;  background-color: #dd3091; color: #fff; border-radius: 27px; font-weight: bold; float: left; padding: 0 1%; display: inline-block; width: 92%; margin: 2% 4%; }

.PopupButton:hover {
    box-shadow: 0 -1px 7px rgba(0, 0, 0, 0.2); background-color: #f82d99; color: #fff; cursor: pointer; }

    .PopupButtonText {
    font-size: .75em; line-height: 1.5em; text-align: center; margin-top: 1rem; font-weight: 400; float: left; width: 100%; }



    
    

   /*------Media Queries for Mobile Responsiveness */

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

    #popup {width: 80%; top: 15rem;}
   
    .PopupField, .PopupButton {
        width: 92%; margin: 1% 0 1% 4%; padding: 0; font-size: .85em; line-height: 2.5em;
    }
    .PopupHeader {
        font-size: 1.2em; margin: .4em 0 1em 0; padding: 0;
    }

    .PopupHeader1 {font-size: 1.4em; margin: 0.5em 0;}
    .close-btn {
        padding: 0.3rem 0.5rem; font-size: 0.9em;
    }
    .PopupButtonText {
        font-size: .6em; margin: 1rem 0;
    }
}       


@media only screen and (min-width: 1650px) {
  .PopupField {
        width: 60%; margin: 2% 19%; font-size: 1.2em; line-height: 2.5em;
    }
    .PopupButton {width: 62%; margin: 2% 19%; font-size: 1.2em; line-height: 2.5em;
}