/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 #mapid {
  max-height: 580px;
  height: 580px;
   margin: auto;
   z-index: 1;
 }

.form input[type="text"] {
  border: 1px solid #0e6651;
  border-radius: 0;
  background: transparent;
}

.form select.radius-select {
  padding: 5px 25px 5px 10px;
  margin: 10px 0;
  background: transparent;
  border: 1px solid #0e6651;
}

.cob-map-content {
  max-height: auto;
}

@media screen and (max-width: 1024px) {
  .cob_post_map-content {
      flex-direction: column;
  }
}

/* Left column */
.cob-cpt-list-container {
  width: 100%;
  border: 1px solid #0e6651;
  padding: 20px;
}

@media screen and (max-width: 1024px) {
  .cob-cpt-list-container {
      width: 100%;
  }
}

.cob-cpt-list-container .form {
  display: flex;
}

.explanation {
  margin-top: 10px;
  font-size: 14px;
  font-style: italic;
}

.cob-map-message-container {
  display: block;
  padding: 20px;
}

#message {
  margin: 10px 0 20px;
  display: block;
}

/* CPT List of item in the left column */
#cob-cpt-list {
  overflow-Y: auto;
  /*margin-top: 40px;*/
}

@media screen and (min-width: 1024px) {
  #cob-cpt-list {
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
  }
}

#cob-cpt-list .item-event {
  margin-top: 20px;
}

#cob-cpt-list .item p,
#cob-cpt-list .item-event p {
  font-size: 14px;
  line-height: 140%;
}

#cob-cpt-list .item p:not(:last-of-type),
#cob-cpt-list .item-event p:not(:last-of-type) {
  margin: 0;
}

#cob-cpt-list .item-title a {
  font-family: "p22-mackinac-pro", "times new roman", serif;
  font-weight: 500;
  font-size: 22px;
  line-height: 26px;
}

#cob-cpt-list .item-title:hover {
  cursor: pointer;
}

#cob-cpt-list .item a
#cob-cpt-list .item-event a {
  color: #0e6651;
  text-decoration: none;
}

#cob-cpt-list .item-event a {
  font-weight: 600;
  font-size: 18px;
  line-height: 140%;
}

#cob-cpt-list .item-event a:before {
  content: "→ ";
}

.cob-cpt-list-container .form input[type="text"] {
  flex: 1;
  min-width: 0;
}


/* Right column: Map */
.cob-map-container {
  width: 100%;
  height: 650px;
}

.cob-map {
  height: 100%;
}

@media screen and (max-width: 1024px) {
  .cob-map-container {
      width: 100%;
      height: 350px;
  }
}

#cob_map_id {
  height: 100%;
  width: 100%;
  margin: auto;
  z-index: 1;
  border: 1px solid #0e6651;
}

@media screen and (min-width: 1024px) {
  #cob_map_id {
      border-left: none;
  }
}

@media screen and (max-width: 1024px) {
  #cob_map_id {
      border-top: none;
  }
}

.leaflet-fixed-pane {
  position: relative;
}


/* to show .popup-fixed -> popup card in the top left corner of the map */
/*
.popup-fixed {
  position: absolute;
  top: 0 !important;
  left: 0 !important;
  transform: none !important;
  margin: 0;
  border-radius: 0;
}

.popup-fixed .leaflet-popup-tip-container {
  display: none;
}

.popup-fixed .leaflet-popup-content-wrapper {
  border-radius: 0;
  background: #fffbf8;
  color: #0e6651;
  box-shadow: none;
  border: 1px solid #0e6651;
}

@media screen and (min-width: 1025px) {
  .popup-fixed .leaflet-popup-content-wrapper {
      border-left: none;
  }
}

@media screen and (max-width: 1024px) {
  .popup-fixed .leaflet-popup-content-wrapper {
      border-top: none;
  }
}

.popup-fixed .leaflet-popup-content {
  margin: 10px 15px;
  line-height: 1.2;
}

.popup-fixed .leaflet-popup-content .item-title {
  font-family: "p22-mackinac-pro", "times new roman", serif;
  font-weight: bold;
}

.popup-fixed .leaflet-popup-content p {
  margin: 5px 0;
}*/


/* highlight item in the list when click on marker on the map */
.item-highlight {
  background-color: #0e6651;
  color: #fffbf8;
}

.leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar {
  border: none;
  background-clip: padding-box;
  background-color: #fffbf8;
  margin: 0;
}

.leaflet-touch .leaflet-bar a {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border: 1px solid #0e6651;
  border-radius: 0 !important;
  border-top: none;
  border-right: none;
  color: #0e6651;
}

/* cluster */

.cob-mh-cluster {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  background-color: #E7662E;
  color: white;
  text-align: center;
  font-size: 14px;
  line-height: 30px;
  margin-top: -20px;
  margin-left: -20px;
  border: 5px solid rgba(231, 102, 46, .8);
  -webkit-background-clip: padding-box; /* for Safari */
  background-clip: padding-box; /* for IE9+, Firefox 4+, Opera, Chrome */
  -webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.41); 
  box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.41);
}


#cob-map-modal{
  display: none;
}