.mycontainer { 
  width:28.5vw;
  resize: both;
  position: relative;
  margin: 5px;
  background:rgba(0,0,0,0.5);
  padding: 15px;
  border-radius:5px;
}

.mycontainer_right { 
  width:30vw;
  resize: both;
  left:65vw;
  right:2vw;
  position: relative;
  margin: 5px;
  background:rgba(0,0,0,0.85);
  padding: 15px;
  border-radius:5px;
}

 .mycontainer_center { 
          width:90vw;
          resize: both;
          position: relative;
          margin: auto;
          background:rgba(255,255,255,0);
          border-radius:5px;
        }

.mycontainer_center_in_center {
          max-width: 730px;

          resize: both;
          position: relative;
          margin: auto;
          background:rgba(0,0,0,0.5);
          padding: 25px;
          border-radius:5px;
}
/* CSS cho  hình ảnh nhỏ nằm giữa backgroung image */

.myimagecontainer_center {
  width:50%;
  height:50%;
  position: absolute;
  background:rgba(255, 255,255, 0);
  border-radius:3px;
  top:10%;
  left:40%;
}

.myimagecontainer_center_right {
  width:50%;
  height:25%;
  position: absolute;
  background:rgba(255, 255,255, 0);
  border-radius:3px;
  top:10vh;
  left:10%;
}
/* Kết thúc CSS cho 5 hình ảnh nhỏ trên backgroung image */
.center_img {
  display: block;
  margin-left:auto;
  margin-right: auto;
  width: 25vw;
  height: 100%;
  border: 2px solid #fff; 
}

.center_img_noborder {
  display: block;
  margin-left:auto;
  margin-right: auto;
  width: 25vw;
  height: 100%; 
}

.center_img_back { /* back --> background */
  display: block;
  margin-left:auto;
  margin-right: auto;
  width: 45vw;
  height: 35vm;
  border: 5px solid #fff;
}
h10 {
    margin-bottom: 0px;
    font-family: 'open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
    color: rgba(255, 255, 255, 1);
    font-size: 14px;
    text-shadow: 1px 1px 2px #000000;
    text-align: center;
}
h9 {
  margin-bottom: 0px;
  font-family: 'open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  color:lightgreen;
  font-size: 15px;
  text-shadow: 1px 1px 2px #000000;
  text-align: center;
}
h8 {
  margin-bottom: 0px;
  font-family: 'open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  color:lightgreen;
  font-size: 18px;
  text-shadow: 1px 1px 2px #000000;
  text-align: center;
  
}

/* Text huyen, thành phố Nha Trang */
.infotextbox {
    position: fixed;
    color: #d30f0f;
    right: 40%;
    bottom: 65%;
}
.credit p{
    font-size:12px;
    color: #ffffff;
    text-shadow: 0 0 2px black;
    margin-bottom: 0px;
}
/* hết CSS for info box đơn vị hành chính */
.info {
    padding: 2px 2px;
    font: Arial, Helvetica, sans-serif;
    box-shadow: 0 1px 1px rgba(0,0,0,0.5);
    border-radius: 8px;
    text-align: center;
    font-size=bold;
    font-size: 18px;
    margin: auto;
}
.text-distance{
    font-family:  'Trebuchet MS', sans-serif;
    font-weight: bold;
    color: #FFA500;
    font-size: 18px;
}

.info_scenename {
    position: fixed;
    top: 5px;
    left: 45%;
    background-color:rgba(135, 206, 250,0.75);
    border-radius: 8px;
    padding: 8px 0;
    text-align: center;
    border: 1px solid deeppink;
}

.info_scene {
    font: Arial, Helvetica, sans-serif;
    text-align: center;
    font-size:10px;
}

.img_on_map {
  display: block;
  margin-left:auto;
  margin-right: auto;
  width: 40px;
  height: 60px;
  border: 2px solid #fff; 
}

@media (min-width: 0px) and (max-width: 767px) {
    .container-fluid {
        width: 767px;
    }
    .storymap-story {
        width: 320px;
    }
}