/* consider category selector as map element */
.category-selector { display: block; left: 10px; margin: 70px auto 0; position: absolute; z-index: 1; }
.city-selector { display: block; left: 10px; margin: 90px auto 0; position: absolute; z-index: 1; }
.category-selector select, .city-selector select { background-color: #e8e8e8; border: 0; box-shadow: 1px 1px 5px -1px #121212; text-transform: capitalize; }

.map-control { background-color: #fff; border: 1px solid #ccc; box-shadow: 0 2px 2px rgba(33, 33, 33, 0.4); font-family: "Courier New", Courier, monospace; margin: 10px; /* Hide the control initially, to prevent it from appearing before the map loads. */ display: none; }

/* Display the control once it is inside the map. */
#map .map-control { display: block; }

.selector-control { font-size: 14px; line-height: 30px; padding-left: 5px; padding-right: 5px; }

.map-marker__global-link { cursor: pointer; display: block; /*min-height: 250px;*/ min-width: 300px; text-decoration: none; }
.map-marker__title { color: #121212; }
.map-marker__desc { color: #808080; }

/* Smartphones (portrait and landscape) */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    /* more space between category-selector and city-selector */
    .city-selector { margin: 105px auto 0; }
}