.map {
    height: 600px;
    width: 100%;
    border: 5px solid #333;
    background-color: #444;
}
/* from http://cssdeck.com/labs/bv45bh6p */
div.map-callout {
min-height: 50px;
width: 200px;
float: left;
left: -20px;
top: 10px;
background-color: #444;
position: relative;
color: #ccc;
padding: 10px;
border-radius: 3px;
box-shadow: 0px 0px 20px #999;
margin: 0px;
border: 1px solid #333;
border-radius: 5px;
text-shadow: 0 0 1px #000;
}
.map-callout::before {
content: "";
width: 0px;
height: 0px;
border: 0.8em solid transparent;
position: absolute;
}
.map-callout.map-callout-bottom::before {
left: 5%;
top: -20px;
border-bottom: 10px solid #444;
}

.SS_title {
    font-weight: bold;
  }
  
#infowindow-content {
    display: none;
}

#mapS1 #infowindow-content  {
    display: inline;
}

.map-control {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0 2px 2px rgba(33, 33, 33, 0.4);
  font-family: "Roboto", "sans-serif";
  margin: 10px;
  padding: 5px;
  /* Hide the control initially, to prevent it from appearing
           before the map loads. */
  display: none;
}

#mapS1 .map-control {
  display: block;
}
/*
.map-control select {
  -webkit-appearance: auto !important;
  -moz-appearance: auto;
  appearance: auto !important;
}      19 04 2022  */  

.selector-control {
  font-size: 14px;    /*  16 */
  line-height: 16px; /* 26  */
  cursor: pointer;
}

input[type="checkbox"]{
 /* width: 18px; /*Desired width*/
 /* height: 18px; /*Desired height*/
  cursor: pointer;
}

select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

/* Style buttons */
.btnMapDIV {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0 2px 6px rgba(33, 33, 33, 0.4);
  font-family: "Roboto", "sans-serif";
  margin: 10px;
  width: 26px;   /* 26 */
  height: 26px;     /* 26 */
  display: none;
}
#mapS1 .btnMapDIV  {
  display: block;
}

.btnMap {
  background-color: DodgerBlue; /* Blue background */
  border: none; /* Remove borders */
  color: white; /* White text */
  padding: 1px; /* Some padding  1px 1px   */
  cursor: pointer; /* Mouse pointer on hover */
  line-height: 15px;    /* 26 */
}
/* Darker background on mouse-over */
.btnMap:hover {
  background-color: RoyalBlue;
}
.btnsMapHideDiv {
  background-color: #fff;
  border: 2px solid #fff;
  border-radius: 3px;
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
  cursor: pointer;
  margin-top: 4px;
  margin-bottom: 4px; 
  margin-left: 4px;  
  text-align: center;
  display: none;
}
.btnMapHide {
  background-color: #fff;
  border: 2px solid #fff;
  border-radius: 3px;
  box-shadow: 0 2px 6px rgba(0,0,0,.3);
  cursor: pointer;
  margin-top: 4px;
  margin-left: 4px;  
  margin-right: 4px; 
  margin-bottom: 4px;  
  text-align: center;
}
.btnMapHideText {
  color: rgb(25,25,25);
  font-family: Roboto,Arial,sans-serif;
  font-size: 14px;
  line-height: 20px;  
  padding-left: 8px;
  padding-right: 8px;
}

#mapS1 .btnsMapHideDiv  {
  display: block;
}




/* Instagram */
.insta-padding{
  display:inline-block;
  height: 180px;
  padding: 5px;
  }
  .insta-padding:hover .insta-style1,.insta-padding:hover .insta-style2{
  border:solid 1px blue;
  border-radius:5px;
  }
  .insta-padding:hover .insta-style1{
    z-index: 1;
  transform: scale(2.3);
  }
  .insta-padding:hover .insta-style2{
  transform:rotate(360deg);
  }
  
  .insta-style1,.insta-style2{
   transition:border 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out;
  }
  .insta-style3{
    border:solid 1px black;
    padding:2px;
  }
  .insta-padding:hover .insta-style3{
    border:solid 1px #CCC;
    box-shadow:1px 1px 5px #999;
  }
  .insta-style4{
   transition: filter 0.5s ease-in-out;
   filter:opacity(30%);
  }
  .insta-padding:hover .insta-style4{
   filter:opacity(100%);
  }
  .insta-style5{
   transition: filter 0.5s ease-in-out;
   filter:brightness(50%);
  }
  .insta-padding:hover .insta-style5{
   filter:brightness(100%);
  }
  
  .insta-padding:hover  .insta-like,.insta-padding:hover  .insta-comment,.insta-padding:hover  .insta-createdate{
  opacity:1;
  }
  .insta-item {
      padding-left: 5px;
      padding-right: 5px;
      padding-top: 5px;
      padding-bottom: 5px;
      position: relative;
      text-align: center;
      height: 100%;
      width: 100%;
     
      margin:5px;
      display: inline-block;
  }
  .insta-list {
      padding-top: 30px;
      padding-bottom: 40px;
  width:100%;
  margin: 0 auto;
  }
  .insta-like {
      background: rgba(0, 0, 0, 0) url("../img/heart.png") no-repeat scroll center center / contain;
    position:absolute;
  bottom:6 px;
  right:5px;
      color: white;
  text-decoration:none;
      font-family: arial;
      font-size: 10px;
      padding: 7px 0;
      text-align: center;
      width: 30px;
    opacity:0;
  transition:opacity 0.2s linear 0.2s;
  }
  .insta-comment{
      background: rgba(0, 0, 0, 0) url("../img/comment.png") no-repeat scroll center center / contain;
    position:absolute;
      color: white;
  left:5px;
  text-decoration:none;
      font-family: arial;
      font-size: 10px;
      padding-bottom: 5px;
  margin-top:5px;
      text-align: center;
      width: 30px;
    opacity:0;
  transition:opacity 0.2s linear 0.2s;
  }
  .insta-createdate{
  background:#A0522D;
  color:white;
  border-radius:5px;
    position:absolute;
  margin-top:110px;
  text-align: center;
  text-decoration:none;
      font-family: arial;
      font-size: 10px;
  padding:5px;
    opacity:0;
  transition:opacity 0.2s linear 0.2s;
  }
  .insta-caption{
    width:110px;
    background-color:#f2f2f2;
    border-radius:5px;
    padding:5px;
    margin-left:5px;
    margin-right:5px;
  }
  