/* Extra small devices (phones, 600px and down) */
@media screen and (max-width: 600px) {
.small{
    display: flex !important;
  }

  .large{
    display: none !important;
  }

.map-number-2 {
   font-size: 8px;
   padding: 2px 3px 0px 0px;
}

.map-number-2:hover {
    font-size: 9px;
    padding: 3px 4px 1px 1px;
}


  .main-container{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
  }

  .content{
    margin-top: 15px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-evenly;
  }

  .main-map {
    display: block;
    max-width: 100%;
    border: none;
    width: 100%;
    height: auto;
    margin-top: 10px;
  }

  .map-number{
    font-size: 8px !important;
    padding: 2px 4px 1px 2px !important;
  }

  /* 1.-La Huamantanga */
  .popup-col-1-huamantanga{
      width: 150px;
  }

  .popup-col-2-huamantanga{
      width: 200px;
  }

  .img-list-huamantanga {
    width: 70px;
    cursor: pointer;
  }

  .img-list-huamantanga:hover {
    width: 75px;
  }
  .la-huamantanga-map-number{
        left: 21%;
    top: 113.8%;
  }
  .la-huamantanga-popup {
    display: none; 
    left: 32%;
    top: 133%;
  }

/* 2.-Fuente Suiza */
  .popup-col-1-fuente-suiza{
      width: 150px;
  }

  .popup-col-2-fuente-suiza{
      width: 200px;
  }

  .img-list-fuente-suiza {
    width: 70px;
    cursor: pointer;
  }

  .img-list-fuente-suiza:hover {
    width: 75px;
  }

  .fuente-suiza-map-number{
    left: 24%;
    top: 115%;
  }

  .fuente-suiza-popup {
     display: none; 
    left: 32%;
    top: 134%;
  }


/* 3.-La Finestra */
  .popup-col-1-la-finestra{
      width: 100px;
  }

  .popup-col-2-la-finestra{
      width: 200px;
  }

  .img-list-la-finestra {
    width: 70px;
    cursor: pointer;
  }

  .img-list-la-finestra:hover {
    width: 75px;
  }

  .la-finestra-map-number{
    left: 47%;
    top: 122%;
  }

  .la-finestra-popup {
    display: none; 
    left: 50%;
    top: 143%;
  }

/* 4.-Akbar */
  .popup-col-1-akbar{
      width: 100px;
  }

  .popup-col-2-akbar{
      width: 200px;
  }

  .img-list-akbar {
    width: 70px;
    cursor: pointer;
  }

  .img-list-akbar:hover {
    width: 75px;
  }

  .akbar-map-number{
    left: 50%;
    top: 122.9%;
  }

  .akbar-popup {
    left: 52%;
    top: 142%;
  }

  /* 5.-De Niro */
  .popup-col-1-de-niro{
      width: 80px;
  }

  .popup-col-2-de-niro{
      width: 160px;
  }

  .img-list-de-niro {
    width: 65px;
    width: 0 2px 0 2px 0;
    cursor: pointer;
  }

  .img-list-de-niro:hover {
    width: 75px;
  }
  
  .de-niro-map-number{
    left: 52.7%;
    top: 123.6%;
  }

  .de-niro-popup {
    left: 55%;
    top: 149%;
  }


/* 6.-Bar Local */
  .popup-col-1-bar-local{
      width: 100px;
  }

  .popup-col-2-bar-local{
      width: 180px;
  }

  .img-list-bar-local {
    width: 61px;
    padding: 0 7px 0 0px;
    cursor: pointer;
  }

  .img-list-bar-local:hover {
    width: 75px;
  }
  .bar-local-map-number{
    left: 55.7%;
    top: 124.3%;
  }
  .bar-local-popup {
     left: 55%;
    top: 118%;
  }

/* 7.-Las Lanzas */
  .popup-col-1-las-lanzas{
      width: 100px;
  }

  .popup-col-2-las-lanzas{
      width: 180px;
  }

  .img-list-las-lanzas {
    width: 70px;
    padding: 0 5px 0 10px;
    cursor: pointer;
  }

  .img-list-las-lanzas:hover {
    width: 75px;
  }
  .las-lanzas-map-number{
    left: 54.6%;
    top: 126.3%;
  }
  .las-lanzas-popup {
     left: 55%;
    top: 123%;
  }

/* 8.-Fran Art */
  .popup-col-1-fran-art{
      width: 100px;
  }

  .popup-col-2-fran-art{
      width: 200px;
  }

  .img-list-fran-art {
    width: 100px;
    padding: 0 25px 0 10px;
    cursor: pointer;
  }

  .img-list-fran-art:hover {
    width: 105px;
  }

  .fran-art-map-number{
    left: 86.6%;
    top: 140.3%;
  }

  .fran-art-popup {
    left: 75%;
    top: 136%;
  }

/* 9.-La Destileria */
  .popup-col-1-destileria{
      width: 150px;
  }

  .popup-col-2-destileria{
      width: 200px;
  }

  .img-list-destileria {
    width: 101px;
    padding: 0px 28px 0 0px;
    cursor: pointer;
  }

  .img-list-destileria:hover {
    width: 75px;
  }
  .destileria-map-number{
    left: 89.6%;
    top: 106.3%;
  }
  .destileria-popup {
    left: 75%;
    top: 115.3%;
}


/* 10.-Mekero */
  .popup-col-1-mekero{
      width: 100px;
  }

  .popup-col-2-mekero{
      width: 200px;
  }

  .img-list-mekero {
    width: 75px;
    cursor: pointer;
  }

  .img-list-mekero:hover {
    width: 80px;
  }
  .mekero-map-number{
    left: 90.6%;
    top: 104.3%;
  }
  .mekero-popup {
    left: 82%;
    top: 112.3%;
}


/* 11.-Antonia */
  .popup-col-1-bar-antonia{
      width: 100px;
  }

  .popup-col-2-bar-antonia{
      width: 200px;
  }

  .img-list-bar-antonia {
    width: 75px;
    cursor: pointer;
  }

  .img-list-bar-antonia:hover {
    width: 80px;
  }
  .bar-antonia-map-number{
    left: 82.6%;
    top: 104.3%;
  }
  .bar-antonia-popup {
    left: 78%;
    top: 111.8%;
}

/* 12.-Barba Negra */
  .popup-col-1-barba-negra{
      width: 100px;
  }

  .popup-col-2-barba-negra{
      width: 200px;
  }

  .img-list-barba-negra {
    width: 75px;
    cursor: pointer;
  }

  .img-list-barba-negra:hover {
    width: 80px;
  }
  .barba-negra-map-number{
    left: 78.2%;
    top: 103.2%;
  } 
  .barba-negra-popup {
    left: 70%;
    top: 111.8%;
  }


/* 13.-Blue Pub */
  .popup-col-1-blue-pub{
      width: 100px;
  }

  .popup-col-2-blue-pub{
      width: 200px;
  }

  .img-list-blue-pub {
    width: 75px;
    cursor: pointer;
  }

  .img-list-blue-pub:hover {
    width: 80px;
  }
  .blue-pub-map-number{
    left: 74.2%;
    top: 102.5%;

  }
  .blue-pub-popup {
    left: 70%;
    top: 107.8%;
  }


/* 14.-Santo Secreto */
  .popup-col-1-santo-secreto{
      width: 100px;
  }

  .popup-col-2-santo-secreto{
      width: 260px;
  }

  .img-list-santo-secreto {
    width: 75px;
    cursor: pointer;
  }

  .img-list-santo-secreto:hover {
    width: 80px;
  }
  .santo-secreto-map-number{
       left: 66%;
    top: 103.8%;
  }
  .santo-secreto-popup {
    left: 62.2%;
    top: 116%;
  }

/* 15.-Barbudo */
  .popup-col-1-barbudo{
      width: 120px;
  }

  .popup-col-2-barbudo{
      width: 200px;
  }

  .img-list-barbudo {
    width: 75px;
    cursor: pointer;
  }

  .img-list-barbudo:hover {
    width: 80px;
  }
  .barbudo-map-number{
    left: 64.6%;
    top: 105.8%;
  }
  .barbudo-popup {
    left: 62.2%;
    top: 116%;
  }


/* 16.-La Tecla */
  .popup-col-1-la-tecla{
      width: 150px;
  }

  .popup-col-2-la-tecla{
      width: 200px;
  }

  .img-list-la-tecla {
    width: 75px;
    cursor: pointer;
  }

  .img-list-la-tecla:hover {
    width: 80px;
  }
  .la-tecla-map-number{
    left: 63.3%;
    top: 107.8%;
  }
  .la-tecla-popup {
    left: 54.2%;
    top: 127%;
  }


/* 17.-Kunstmann */
  .popup-col-1-kunstmann{
      width: 110px;
  }

  .popup-col-2-kunstmann{
      width: 200px;
  }

  .img-list-kunstmann {
    width: 75px;
    cursor: pointer;
  }

  .img-list-kunstmann:hover {
    width: 80px;
  }
  .kunstmann-map-number{
     left: 62.3%;
    top: 109.9%;
  }
  .kunstmann-popup {
     left: 54.2%;
    top: 130%;
  }


/* 18.-Barba Azul */
  .popup-col-1-barba-azul{
      width: 100px;
  }

  .popup-col-2-barba-azul{
      width: 200px;
  }

  .img-list-barba-azul {
    width: 75px;
    cursor: pointer;
  }

  .img-list-barba-azul:hover {
    width: 80px;
  }
  .barba-azul-map-number{
    left: 61%;
    top: 111.9%;
  }
  .barba-azul-popup {
    left: 54.2%;
    top: 130%;
  }

/* 19.-La Batuta */
  .popup-col-1-la-batuta{
      width: 150px;
  }

  .popup-col-2-la-batuta{
      width: 200px;
  }

  .img-list-la-batuta {
    width: 55px;
    padding: 0 2px 0 20px;
    cursor: pointer;
  }

  .img-list-la-batuta:hover {
    width: 55px;
  }
  .la-batuta-map-number{
    left: 60%;
    top: 114%;
  }
  .la-batuta-popup {
    left: 54.2%;
    top: 139%;
  }

/* 20.-Cafe Dante */
  .popup-col-1-cafe-dante{
      width: 100px;
  }

  .popup-col-2-cafe-dante{
      width: 200px;
  }

  .img-list-cafe-dante {
    width: 50px;
    padding: 0 10px 0 10px;
    cursor: pointer;
  }

  .img-list-cafe-dante:hover {
    width: 55px;
  }
  .cafe-dante-map-number{
    left: 58%;
    top: 119%;
  }
  .cafe-dante-popup {
    left: 54.2%;
    top: 139%;
  }

/* 21.-Filippo */
  .popup-col-1-filippo{
      width: 97px;
  }

  .popup-col-2-filippo{
      width: 200px;
  }

  .img-list-filippo {
    width: 75px;
    cursor: pointer;
  }

  .img-list-filippo:hover {
    width: 80px;
  }
  .filippo-map-number{
    left: 54%;
    top: 119%;
  }
  .filippo-popup {
    left: 54.2%;
    top: 139%;
  }


/* 22.-Hotel Plaza */
  .popup-col-1-hotel-plaza{
      width: 87px;
  }

  .popup-col-2-hotel-plaza{
      width: 200px;
  }

  .img-list-hotel-plaza {
    width: 75px;
    padding: 0 5px 0 0;
    cursor: pointer;
  }

  .img-list-hotel-plaza:hover {
    width: 80px;
  }
  .hotel-plaza-map-number{
    left: 50.5%;
    top: 118%;
  }
  .hotel-plaza-popup {
    left: 45.2%;
    top: 135.5%;
  }

/* 23.-Clasico Dante */
  .popup-col-1-clasico-dante{
      width: 100px;
  }

  .popup-col-2-clasico-dante{
      width: 200px;
  }

  .img-list-clasico-dante {
    width: 50px;
    padding: 0 10px 0 10px;
    cursor: pointer;
  }

  .img-list-clasico-dante:hover {
    width: 55px;
  }
  .clasico-dante-map-number{
    left: 47.2%;
    top: 117.3%;
  }
  .clasico-dante-popup {
    left: 45.2%;
    top: 135.5%;
  }


/* 24.-Emporio el Dante */
  .popup-col-1-emporio-el-dante{
      width: 95px;
  }

  .popup-col-2-emporio-el-dante{
      width: 200px;
  }

  .img-list-emporio-el-dante {
    width: 50px;
    padding: 0 10px 0 10px;
    cursor: pointer;
  }

  .img-list-emporio-el-dante:hover {
    width: 55px;
  }
  .emporio-el-dante-map-number{
    left: 44.1%;
    top: 116.4%;
  }
  .emporio-el-dante-popup {
    left: 45.2%;
    top: 134.5%;
  }


/* 25.-La Vinocracia */
  .popup-col-1-la-vinocracia{
      width: 95px;
  }

  .popup-col-2-la-vinocracia{
      width: 200px;
  }

  .img-list-la-vinocracia {
    width: 90px;
    cursor: pointer;
  }

  .img-list-la-vinocracia:hover {
    width: 95px;
  }
  .la-vinocracia-map-number{
    left: 41.3%;
    top: 115.8%;
  }
  .la-vinocracia-popup {
    left: 45.2%;
    top: 130.9%;
  }

/* 26.-Irarrazabar */
  .popup-col-1-irarrazabar{
      width: 127px;
  }

  .popup-col-2-irarrazabar{
      width: 200px;
  }

  .img-list-irarrazabar {
    width: 80px;
    cursor: pointer;
  }

  .img-list-irarrazabar:hover {
    width: 85px;
  }
  .irarrazabar-map-number{
    left: 35%;
    top: 113.5%;
  }
  .irarrazabar-popup {
        left: 31.2%;
    top: 128.9%;
  }

/* 27.-Danelli */
  .popup-col-1-danelli{
      width: 110px;
  }

  .popup-col-2-danelli{
      width: 200px;
  }

  .img-list-danelli {
    width: 75px;
    cursor: pointer;
  }

  .img-list-danelli:hover {
    width: 80px;
  }
  .danelli-map-number{
    left: 29%;
    top: 110.5%;
  }
  .danelli-popup {
    left: 29.2%;
    top: 120.9%;
  }

  .logo-barrio{
    width: 71px !important;
    left: 44.2% !important;
    top: 101% !important;
  }

  .logo-barrios-comerciales{
    width: 70px !important;
    left: 25% !important;
    top: 121% !important;
  }

  .logo-caretas{
    width: 20px !important;
    left: 56% !important;
    top: 116% !important;
  }
}