.main-map-container {
  position: relative;
  @media screen and (min-width: 981px){
    background: url("../img/Ellipse.png") center no-repeat;
  }

  .registration {
    width: 25%;
    position: absolute;
    right: 0;
    bottom: 5%;
    .registration-text {
      text-transform: uppercase;
      font-size: 20px;
      color: #0f4775;
      margin-bottom: 25px;
    }
    .registration-popap-info {
      display: none;
      position: absolute;
      z-index: 5;
      width: 100%;
      top: 0;
      right: 110%;
      padding: 10px 20px;
      color: #797979;
      background: #fff;
      box-shadow: 5px 5px 40px 0px rgba(0, 0, 0, 0.67);
    }
    &:hover {
      .registration-popap-info {
        display: block;
      }
    }
  }
}

.main-map {
  display: inline-block;
  margin: 0 auto;
  position: relative;
  padding: 7% 0;
  @media screen and (max-width: 980px){
    padding: 0;
  }
  .main-map-link {
    &:active img, &:hover img {
      opacity: .7;
    }
  }
  .bubble {
    position: absolute;
    display: block;
    width: 12%;
    height: 18%;
    background-size: contain;
    background-position: bottom center;
    background-repeat: no-repeat;
    transition: transform .3s;
    span {
      display: none;
      position: absolute;
      top: 100%;
      left: 0;
      font-size: 16px;
      text-transform: uppercase;
      font-weight: bold;
      transform: translate(-10%, 20%);
      background: #ffed82;
      color: #0f4775;
      padding: 2px 5px;
      min-width: 100%;

    }
    &:hover {
      transform: translateY(-5%);
      transition: transform .3s;
      span {
        display: inline-block;
      }
    }

    &.solar {
      background-image: url("../img/solar.png");
      top: 30%;
      left: 8%;
    }
    &.hydro {
      background-image: url("../img/hydro.png");
      top: 20%;
      left: 30%;
    }
    &.bio {
      background-image: url("../img/bio.png");
      top: 30%;
      left: 60%;
    }
    &.efective {
      background-image: url("../img/efective.png");
      top: 38%;
      left: 74%;
    }
    &.wind {
      background-image: url("../img/wind.png");
      top: 47%;
      left: 42%;
    }
  }
}

.footer-logo {
  min-height: 73px;
  display: block;
}

.footer-sm-text {
  color: #154865;
  font-size: 7px;
  font-weight: 600;
}

button:active, button:focus {
  outline: none !important;
}
.static-btn-container{
  z-index: 10;
  position: absolute;
  right: 0;
  top: 15px;
  @media screen and (max-width: 980px){
    right: -30px;
    top: -40px;
  }
}
.static-btn {
  width: 160px;
  height: 40px;
  margin: 15px 0;
  padding: 3px 10px;
  border-radius: 25px;
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  align-content: center;
  font-size: 12px;
  line-height: 1.2;
  color: #fff;
  text-transform: uppercase;
  transition: background .5s;
  background: linear-gradient(to right, rgba(37,114,166,1) 0%, rgba(14,166,216,1) 100%);
  @media screen and (max-width: 980px){
    width: 60px;
    border-radius: 25px 0 0 25px;
    font-size: 0px;
    color: transparent;
  }
  &.static-btn-project{
     @media screen and (max-width: 980px){
       background: url("../img/distr-proj.png") 15px center no-repeat, linear-gradient(to right, rgba(37,114,166,1) 0%, rgba(14,166,216,1) 100%);
     }
   }
  &.static-btn-resours{
    @media screen and (max-width: 980px){
      background: url("../img/distr.png") 15px center no-repeat, linear-gradient(to right, rgba(37,114,166,1) 0%, rgba(14,166,216,1) 100%);
    }
  }
  &:hover{
    @media screen and (min-width: 979px) {
      text-decoration: none;
      color: #fff;
      transition: background .5s;
      background: linear-gradient(to right, rgba(14, 166, 216, 1) 0%, rgba(37, 114, 166, 1) 100%);
    }
  }
  &:first-of-type{
    margin: 0 0 15px 0;
  }
}

.copyright{
  font-size: 14px;
  text-align: right;
  color: #95d7e0;
}
.footer-md-text{
  font-size: 14px;
  text-align: left;
  color: #2572a6;
}
.btn.show-on-map{
  font-size: 12px;
  line-height: 1.5;
  border-radius: 20px;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  width: 100%;
  color: #0f4775;
  background-color: #fffade;
  border-color: #ffd304;
  &:hover{
    background-color: #ffe959;
  }
}

@media screen and (max-width: 980px){
  .inner-map-container .static-btn-container {
    right: -15px;
    top: 5px;
  }
}