.popper-popup {
    display: none;
    
    
    padding: 2spx;
    border-radius: 4px;
    display: none;
    /* width: 100%; */
    width: 174px;
    height: auto;
}

.popper-popup a {
    font-size: 16px;
    font-weight: 300;
    display: block;
    padding: 5px;
    
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.popper-popup a:hover {
    
}

.popper-popup[data-popper-reference-hidden] {
    visibility: hidden;
    pointer-events: none;
}

.popper-popup[show-popper] {
    display: block;
    z-index: 9999;
}


/*keep popper visible in the Divi Builder for editing*/


/* #popper-arrow-highlight,
#popper-arrow-highlight::before,
#popper-arrow-city,
#popper-arrow-initial, */


/* .arrow */

#popper-arrow-highlight::before,
#popper-arrow-city::before,
#popper-arrow-sett::before,
#popper-arrow-change::before
 {
    position: absolute;
    width: 10px;
    height: 10px;
    
    top: -10px;
    content: "";
    transform: rotate(45deg)!important;
    
    border-width: 0px 0px 1px 1px;
}
#popper-arrow-change::before
{
    transform: rotate(228deg)!important;
    right: -2px;
}
#popper-arrow-city::before,
#popper-arrow-sett::before,
#popper-arrow-change::before {
    top: -2px;
}


/* 
#popper-arrow-city {
    visibility: hidden;
}

#popper-arrow-city::before,
popper-popup-highlight::before,
#popper-arrow-initial::before {
    visibility: visible;
    content: "";
    transform: rotate(45deg);
} */


/*position arrow using popper.js data-popper-placement attribute*/


/* 
.popper-popup[data-popper-placement^="top"] #popper-arrow-city {
    bottom: -4px;
}

.popper-popup[data-popper-placement^="bottom"] #popper-arrow-city {
    top: -4px;
}

.popper-popup[data-popper-placement^="left"] #popper-arrow-city {
    right: -4px;
}

.popper-popup[data-popper-placement^="right"] #popper-arrow-city {
    left: -4px;
} */


/*hide arrow when reference outside of viewport*/

.popper-popup[data-popper-reference-hidden] .arrow::before {
    visibility: hidden;
}

.popper-popup[data-popper-placement^="top"] .arrow {
    bottom: -4px;
}

.popper-popup[data-popper-placement^="bottom"] .arrow {
    top: -4px;
}

.popper-popup[data-popper-placement^="left"] .arrow {
    right: -4px;
}

.popper-popup[data-popper-placement^="right"] .arrow {
    left: -5px;
}


/*hide arrow when reference outside of viewport*/

.popper-popup[data-popper-reference-hidden] .arrow::before {
    visibility: hidden;
}


/* Hide the popper when the reference is hidden */

#popper[data-popper-reference-hidden] {
    visibility: hidden;
    pointer-events: none;
}

.popper-popup .instructions {
    
    cursor: none;
    padding: 1rem;
}

.popper-popup .color_schema_collection {
    margin-top: 0px;
}

#popper-popup-highlight .content,
#popper-popup-change .content {
    margin: 10px;
    font-size: 1rem;
}