.modal-phone 
{
    max-width:360px;
    border-radius: 3px;
}

.outer-filter-container {
    overflow-x: auto;
    max-height: 400px;
}
.state-container {
    /*height: 80%;*/
    display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(50px,1fr));
    grid-auto-rows: 50px;
    grid-auto-flow: row;
    justify-content: space-around;
    align-content: space-around;

}
    .state-container > div {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 1.25em;
        font-weight: bold;
        overflow-wrap: break-word;
        word-break: break-all;
        border-radius: 50%;
        padding: 3px;
        color: white;
    }

        .state-container > div.USA {
            background-color: #002fff;
            border: 1px solid #002fff;
        }
        .state-container > div.USA:hover {
            background-color: #808080;
            border: 1px solid #404040;
        }
        .state-container > div.CAN {
            background-color: #f00202;
            border: 1px solid #f00202;
        }
        .state-container > div.CAN:hover {
            background-color: #808080;
            border: 1px solid #404040;
        }
    .state-container > div.loading {
        color: black;
    }