@media screen and (min-width: 1024px) and (max-width: 1279px){
  .secc-mapa{
    width: 100%;
    height: 600px;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .mapa{
    width: 85%;
    height: 600px;
  }
  .mapa_img{
    width: 100%;
    height: 600px;
    background-image: url(../assets/mapa_2d.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
  }
  .controles_mapa{
    width: 15%;
    height: 600px;
    background-color: #4e4e4e;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
  }
  .titulo_mapa_view{
    color: #d7a050;
    letter-spacing: 2px;
    position: absolute;
    margin-top: 130px;
    margin-left: 100px;
    font-size: 5rem;
  }
  .grup_btn{
    height: 120px;
    text-align: center;
    font-size: 1.5rem;
    font-weight: lighter;
    color: #d7a050;
    letter-spacing: 2px;
  }
  .grup_btn p{
    margin-top: 10px;
  }
  .btn_mapa_01{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_plaza_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_01_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_plaza_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_01:hover{
    background-image: url(../assets/botones/btn_plaza_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_mapa_02{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_corre_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_02_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_corre_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_02:hover{
    background-image: url(../assets/botones/btn_corre_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_mapa_03{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_comp_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_03_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_comp_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_03:hover{
    background-image: url(../assets/botones/btn_comp_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_picker_norm{
    width:  30px;
    height: 50px;
    position: absolute;
    z-index: 1;
    background-image: url(../assets/iconografia/picker_0.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: all 1s ease;
  }
  .btn_picker_norm:hover{
    background-image: url(../assets/iconografia/picker_1.png);
  }
  .sombra{
    width: 30px;
    height: 50px;
    background-image: url(../assets/iconografia/sombra.png);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
  }
  /* Acomodadores */
  .grup_piker_01{
    margin-top: 280px;
    margin-left: 170px;
    position: absolute;
  }
  .grup_piker_02{
    margin-top: 100px;
    margin-left: 320px;
    position: absolute;
  }
  .grup_piker_03{
    margin-top: 180px;
    margin-left: 480px;
    position: absolute;
  }
  .grup_piker_04{
    margin-top: 470px;
    margin-left: 250px;
    position: absolute;
  }
  .grup_piker_05{
    margin-top: 280px;
    margin-left: 580px;
    position: absolute;
  }
  .grup_piker_06{
    margin-top: 130px;
    margin-left: 700px;
    position: absolute;
  }
  .grup_piker_07{
    margin-top: 240px;
    margin-left: 540px;
    position: absolute;
  }
  .grup_piker_08{
    margin-top: 270px;
    margin-left: 340px;
    position: absolute;
  }
  .grup_piker_09{
    margin-left: 130px;
    margin-top: 300px;
    position: absolute;
  }
  .grup_piker_10{
    margin-left: 150px;
    margin-top: 330px;
    position: absolute;
  }
  .card{
    width: 300px;
    height: auto;
    position: absolute;
    z-index: 1;
    padding: 10px;
    background-color: #4e4e4e;
    color: #f5f5f5;
    font-weight: lighter;
    letter-spacing: 2px;
    font-size: 1.3rem;
    -webkit-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
  }
  .controles_card{
    display: flex;
    flex-direction: row;
  }
  .btn_card_view{
    width:  31px;
    height: 31px;
    background-image: url(../assets/iconografia/btn_more.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  .btn_card_close{
    width:  30px;
    height: 30px;
    margin-left: 10px;
    background-image: url(../assets/iconografia/btn_close_norm.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  /* Imagenes cards */
  .img_card_01{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_republica/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_02{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_malecon/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_03{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_baluarte/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_04{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/Parque_ciriaco/5.png);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
  }
  .img_card_05{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/huaca/huaca_03.jpg);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_06{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/corredores/rayon/3.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_07{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/corredores/landero/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_08{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/columna/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_09{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/morelos/5.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_10{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/reforma/3.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  /* Posiciones */
  .card_position_01{
    position: absolute;
    margin-top: 350px;
    margin-left: 450px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_01_hide{
    position: absolute;
    z-index: 1;
    margin-top: 350px;
    margin-left: 450px;
    transform: scale(0);
    filter: opacity(0%);
  }

  .card_position_02{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 750px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_02_hide{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 750px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_03{
    position: absolute;
    z-index: 1;
    margin-top: 200px;
    margin-left: 1050px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_03_hide{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 50px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_04{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: -350px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_04_hide{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: -350px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_05{
    position: absolute;
    z-index: 1;
    margin-top: -300px;
    margin-left: 20px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_05_hide{
    position: absolute;
    z-index: 1;
    margin-top: -300px;
    margin-left: 20px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_06{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 140px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_06_hide{
    position: absolute;
    z-index: 1;
    margin-top: -300px;
    margin-left: 20px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_07{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_07_hide{
    position: absolute;
    z-index: 1;
    margin-top: -300px;
    margin-left: 20px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_08{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 200px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_08_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 20px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_09{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_09_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_10{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_10_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(0);
    filter: opacity(0%);
  }
}
@media screen and (min-width: 1280px) and (max-width: 1439px){
  .secc-mapa{
    width: 100%;
    height: 700px;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .mapa{
    width: 85%;
    height: 700px;
    margin-top: 30px;
  }
  .mapa_img{
    width: 100%;
    height: 700px;
    background-image: url(../assets/mapa_2d.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
  }

  .controles_mapa{
    width: 15%;
    height: 700px;
    background-color: #4e4e4e;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content:space-between;
  }
  .titulo_mapa_view{
    color: #d7a050;
    letter-spacing: 2px;
    position: absolute;
    margin-top: 130px;
    margin-left: 100px;
    font-size: 5rem;
  }
  .grup_btn{
    width: 100%;
    height: 100px;
    margin-top: 60px;
    text-align: center;
    font-size: 1.5rem;
    font-weight: lighter;
    color: #d7a050;
    letter-spacing: 2px;
  }
  .grup_btn p{
    margin-top: 10px;
  }
  .btn_mapa_01{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_plaza_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_01_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_plaza_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_01:hover{
    background-image: url(../assets/botones/btn_plaza_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_mapa_02{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_corre_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_02_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_corre_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_02:hover{
    background-image: url(../assets/botones/btn_corre_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_mapa_03{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_comp_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_03_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_comp_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_03:hover{
    background-image: url(../assets/botones/btn_comp_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_picker_norm{
    width:  30px;
    height: 50px;
    position: absolute;
    z-index: 1;
    background-image: url(../assets/iconografia/picker_0.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: all 1s ease;
  }
  .btn_picker_norm:hover{
    background-image: url(../assets/iconografia/picker_1.png);
  }
  .sombra{
    width: 30px;
    height: 50px;
    background-image: url(../assets/iconografia/sombra.png);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
  }
  /* Acomodadores */
  .grup_piker_01{
    margin-top: 340px;
    margin-left: 200px;
    position: absolute;
  }
  .grup_piker_02{
    margin-top: 100px;
    margin-left: 410px;
    position: absolute;
  }
  .grup_piker_03{
    margin-top: 210px;
    margin-left: 620px;
    position: absolute;
  }
  .grup_piker_04{
    margin-top: 580px;
    margin-left: 320px;
    position: absolute;
  }
  .grup_piker_05{
    margin-top: 340px;
    margin-left: 730px;
    position: absolute;
  }
  .grup_piker_06{
    margin-top: 200px;
    margin-left: 900px;
    position: absolute;
  }
  .grup_piker_07{
    margin-top: 300px;
    margin-left: 680px;
    position: absolute;
  }
  .grup_piker_08{
    margin-top: 310px;
    margin-left: 480px;
    position: absolute;
  }
  .grup_piker_09{
    margin-left: 150px;
    margin-top: 380px;
    position: absolute;
  }
  .grup_piker_10{
    margin-left: 180px;
    margin-top: 400px;
    position: absolute;
  }
  .card{
    width: 300px;
    height: auto;
    position: absolute;
    z-index: 1;
    padding: 10px;
    background-color: #4e4e4e;
    color: #f5f5f5;
    font-weight: lighter;
    letter-spacing: 2px;
    font-size: 1.3rem;
    -webkit-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
  }
  .controles_card{
    display: flex;
    flex-direction: row;
  }
  .btn_card_view{
    width:  31px;
    height: 31px;
    background-image: url(../assets/iconografia/btn_more.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  .btn_card_close{
    width:  30px;
    height: 30px;
    margin-left: 10px;
    background-image: url(../assets/iconografia/btn_close_norm.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  /* Imagenes cards */
  .img_card_01{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_republica/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_02{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_malecon/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_03{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_baluarte/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_04{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/Parque_ciriaco/5.png);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
  }
  .img_card_05{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/huaca/huaca_03.jpg);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_06{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/corredores/rayon/3.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_07{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/corredores/landero/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_08{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/columna/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_09{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/morelos/5.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_10{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/reforma/3.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  /* Posiciones */
  .card_position_01{
    position: absolute;
    z-index: 1;
    margin-top: 150px;
    margin-left: 250px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_01_hide{
    position: absolute;
    z-index: 1;
    margin-top: 150px;
    margin-left: 250px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }

  .card_position_02{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 450px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_02_hide{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 450px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_03{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: 670px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_03_hide{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: 670px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_04{
    position: absolute;
    z-index: 1;
    margin-top: -10px;
    margin-left: -250px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_04_hide{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: -350px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_05{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -100px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_05_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -100px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_06{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 100px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_06_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 100px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_07{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -500px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_07_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -500px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_08{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 130px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_08_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 20px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_09{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -380px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_09_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -380px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_10{
    position: absolute;
    z-index: 1;
    margin-top: -100px;
    margin-left: -380px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_10_hide{
    position: absolute;
    z-index: 1;
    margin-top: -100px;
    margin-left: -380px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
}
@media screen and (min-width: 1440px) and (max-width: 1919px){
  .secc-mapa{
    width: 100%;
    height: 700px;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .mapa{
    width: 85%;
    height: 700px;
    margin-top: 30px;
  }
  .mapa_img{
    width: 100%;
    height: 700px;
    background-image: url(../assets/mapa_2d.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
  }
  .controles_mapa{
    width: 15%;
    height: 700px;
    background-color: #4e4e4e;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content:space-between;
  }
  .titulo_mapa_view{
    color: #d7a050;
    letter-spacing: 2px;
    position: absolute;
    margin-top: 130px;
    margin-left: 100px;
    font-size: 5rem;
  }
  .grup_btn{
    width: 100%;
    height: 100px;
    margin-top: 60px;
    text-align: center;
    font-size: 1.5rem;
    font-weight: lighter;
    color: #d7a050;
    letter-spacing: 2px;
  }
  .grup_btn p{
    margin-top: 10px;
  }
  .btn_mapa_01{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_plaza_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_01_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_plaza_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_01:hover{
    background-image: url(../assets/botones/btn_plaza_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_mapa_02{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_corre_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_02_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_corre_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_02:hover{
    background-image: url(../assets/botones/btn_corre_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_mapa_03{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_comp_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_03_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_comp_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_03:hover{
    background-image: url(../assets/botones/btn_comp_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_picker_norm{
    width:  30px;
    height: 50px;
    position: absolute;
    z-index: 1;
    background-image: url(../assets/iconografia/picker_0.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: all 1s ease;
  }
  .btn_picker_norm:hover{
    background-image: url(../assets/iconografia/picker_1.png);
  }
  .sombra{
    width: 30px;
    height: 50px;
    background-image: url(../assets/iconografia/sombra.png);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
  }
  /* Acomodadores */
  .grup_piker_01{
    margin-top: 340px;
    margin-left: 200px;
    position: absolute;
  }
  .grup_piker_02{
    margin-top: 100px;
    margin-left: 470px;
    position: absolute;
  }
  .grup_piker_03{
    margin-top: 210px;
    margin-left: 700px;
    position: absolute;
  }
  .grup_piker_04{
    margin-top: 600px;
    margin-left: 390px;
    position: absolute;
  }
  .grup_piker_05{
    margin-top: 340px;
    margin-left: 830px;
    position: absolute;
  }
  .grup_piker_06{
    margin-top: 200px;
    margin-left: 900px;
    position: absolute;
  }
  .grup_piker_07{
    margin-top: 280px;
    margin-left: 760px;
    position: absolute;
  }
  .grup_piker_08{
    margin-top: 310px;
    margin-left: 480px;
    position: absolute;
  }
  .grup_piker_09{
    margin-left: 170px;
    margin-top: 380px;
    position: absolute;
  }
  .grup_piker_10{
    margin-left: 200px;
    margin-top: 400px;
    position: absolute;
  }
  .card{
    width: 300px;
    height: auto;
    position: absolute;
    z-index: 1;
    padding: 10px;
    background-color: #4e4e4e;
    color: #f5f5f5;
    font-weight: lighter;
    letter-spacing: 2px;
    font-size: 1.3rem;
    -webkit-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
  }
  .controles_card{
    display: flex;
    flex-direction: row;
  }
  .btn_card_view{
    width:  31px;
    height: 31px;
    background-image: url(../assets/iconografia/btn_more.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  .btn_card_close{
    width:  30px;
    height: 30px;
    margin-left: 10px;
    background-image: url(../assets/iconografia/btn_close_norm.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  /* Imagenes cards */
  .img_card_01{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_republica/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_02{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_malecon/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_03{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_baluarte/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_04{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/Parque_ciriaco/5.png);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
  }
  .img_card_05{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/huaca/huaca_03.jpg);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_06{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/corredores/rayon/3.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_07{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/corredores/landero/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_08{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/columna/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_09{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/morelos/5.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_10{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/reforma/3.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  /* Posiciones */
  .card_position_01{
    position: absolute;
    z-index: 1;
    margin-top: 200px;
    margin-left: 250px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_01_hide{
    position: absolute;
    z-index: 1;
    margin-top: 200px;
    margin-left: 250px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }

  .card_position_02{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_02_hide{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 750px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_03{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: 800px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_03_hide{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: 800px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_04{
    position: absolute;
    z-index: 1;
    margin-top: -10px;
    margin-left: -270px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_04_hide{
    position: absolute;
    z-index: 1;
    margin-top: -10px;
    margin-left: -270px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_05{
    position: absolute;
    z-index: 1;
    margin-top: -300px;
    margin-left: 20px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_05_hide{
    position: absolute;
    z-index: 1;
    margin-top: -300px;
    margin-left: 20px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_06{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 140px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_06_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 140px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_07{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_07_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_08{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 200px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_08_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 20px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_09{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_09_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(0);
    filter: opacity(0%);
  }
  .card_position_10{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_10_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(0);
    filter: opacity(0%);
  }
}
@media screen and (min-width: 1920px) and (max-width: 2560px){
  .secc-mapa{
    width: 100%;
    height: 1000px;
    margin-top: 140px;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
  .mapa{
    width: 85%;
    height: 1000px;
  }
  .mapa_img{
    width: 100%;
    height: 1000px;
    background-image: url(../assets/mapa_2d.png);
    background-repeat: no-repeat;
    background-size: 95%;
    background-position: right;
  }
  .controles_mapa{
    width: 15%;
    height: 1000px;
    background-color: #4e4e4e;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .titulo_mapa_view{
    color: #d7a050;
    letter-spacing: 2px;
    position: absolute;
    margin-top: 130px;
    margin-left: 100px;
    font-size: 5rem;
  }
  .grup_btn{
    width: 100%;
    height: 100px;
    margin-top: 60px;
    text-align: center;
    font-size: 1.5rem;
    font-weight: lighter;
    color: #d7a050;
    letter-spacing: 2px;
  }
  .grup_btn p{
  }
  .btn_mapa_01{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_plaza_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_01_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_plaza_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_01:hover{
    background-image: url(../assets/botones/btn_plaza_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_mapa_02{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_corre_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_02_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_corre_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_02:hover{
    background-image: url(../assets/botones/btn_corre_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_mapa_03{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_comp_norm.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_03_activo{
    width:  100%;
    height: 100px;
    background-image: url(../assets/botones/btn_comp_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transition: all 1s ease;
  }
  .btn_mapa_03:hover{
    background-image: url(../assets/botones/btn_comp_act.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .btn_picker_norm{
    width:  30px;
    height: 50px;
    position: absolute;
    z-index: 1;
    background-image: url(../assets/iconografia/picker_0.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: all 1s ease;
  }
  .btn_picker_norm{
    width:  30px;
    height: 50px;
    position: absolute;
    z-index: 1;
    background-image: url(../assets/iconografia/picker_0.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transition: all 1s ease;
  }
  .btn_picker_norm:hover{
    background-image: url(../assets/iconografia/picker_1.png);
  }
  .sombra{
    width: 30px;
    height: 50px;
    background-image: url(../assets/iconografia/sombra.png);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
  }
  /* Acomodadores */
  .grup_piker_01{
    margin-top: 500px;
    margin-left: 400px;
    position: absolute;
  }
  .grup_piker_02{
    margin-top: 150px;
    margin-left: 670px;
    position: absolute;
  }
  .grup_piker_03{
    margin-top: 320px;
    margin-left: 1000px;
    position: absolute;
  }
  .grup_piker_04{
    margin-top: 840px;
    margin-left: 520px;
    position: absolute;
  }
  .grup_piker_05{
    margin-top: 480px;
    margin-left: 1100px;
    position: absolute;
  }
  .grup_piker_06{
    margin-top: 300px;
    margin-left: 1300px;
    position: absolute;
  }
  .grup_piker_07{
    margin-top: 440px;
    margin-left: 1050px;
    position: absolute;
  }
  .grup_piker_08{
    margin-top: 470px;
    margin-left: 750px;
    position: absolute;
  }
  .grup_piker_09{
    margin-left: 320px;
    margin-top: 570px;
    position: absolute;
  }
  .grup_piker_10{
    margin-left: 300px;
    margin-top: 530px;
    position: absolute;
  }
  /* Tarjetas */
  .card{
    width: 300px;
    height: auto;
    position: absolute;
    z-index: 1;
    padding: 10px;
    background-color: #4e4e4e;
    color: #f5f5f5;
    font-weight: lighter;
    letter-spacing: 2px;
    font-size: 1.3rem;
    -webkit-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 35px 0px rgba(0,0,0,0.75);
  }
  .controles_card{
    display: flex;
    flex-direction: row;
  }
  .btn_card_view{
    width:  31px;
    height: 31px;
    background-image: url(../assets/iconografia/btn_more.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  .btn_card_close{
    width:  30px;
    height: 30px;
    margin-left: 10px;
    background-image: url(../assets/iconografia/btn_close_norm.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  /* Imagenes cards */
  .img_card_01{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_republica/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_02{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_malecon/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_03{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/plaza_baluarte/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_04{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/plazas/Parque_ciriaco/5.png);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
  }
  .img_card_05{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/huaca/huaca_03.jpg);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_06{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/corredores/rayon/3.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_07{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/corredores/landero/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_08{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/columna/2.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_09{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/morelos/5.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  .img_card_10{
      width: 100%;
      height: 150px;
      background-image: url(../assets/galeria_imagenes/img_full/comple/reforma/3.png);
      background-repeat: no-repeat;
      background-size: cover;
  }
  /* Posiciones */
  .card_position_01{
    position: absolute;
    margin-top: 350px;
    margin-left: 450px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_01_hide{
    position: absolute;
    z-index: 1;
    margin-top: 350px;
    margin-left: 450px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }

  .card_position_02{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 750px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_02_hide{
    position: absolute;
    z-index: 1;
    margin-top: 50px;
    margin-left: 750px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_03{
    position: absolute;
    z-index: 1;
    margin-top: 200px;
    margin-left: 1050px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_03_hide{
    position: absolute;
    z-index: 1;
    margin-top: 200px;
    margin-left: 1050px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_04{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: -350px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_04_hide{
    position: absolute;
    z-index: 1;
    margin-top: 100px;
    margin-left: -350px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_05{
    position: absolute;
    z-index: 1;
    margin-top: -300px;
    margin-left: 20px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_05_hide{
    position: absolute;
    z-index: 1;
    margin-top: -300px;
    margin-left: 20px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_06{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 140px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_06_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 140px;;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_07{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_07_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_08{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 200px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_08_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: 200px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_09{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_09_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
  .card_position_10{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(1);
    filter: opacity(100%);
    transition: all 1s ease;
  }
  .card_position_10_hide{
    position: absolute;
    z-index: 1;
    margin-top: -200px;
    margin-left: -550px;
    transform: scale(0);
    filter: opacity(0%);
    transition: all 1s ease;
  }
}