/*
 Theme Name:   Listingpro Child
 Theme URI:    http://studio.cridio.com/listingpro/
 Description:  Listingpro Child Theme
 Author:       cridio team
 Author URI:   http://cridio.com/
 Template:     listingpro
 Version:      1.0.0
 Tags:         listingpro, directory, listing, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  listingpro
*/
svg {      
margin: 0 auto;     
display: inline-block;      
margin: auto;      
vertical-align: top;      
width: 50%;      
float: left;
    }

    path {
      fill: #d4d4d4;
      cursor: pointer;
      -webkit-transition: all 150ms;
      -moz-transition: all 150ms;
      -o-transition: all 150ms;
      transition: all 400ms ease-out;
      z-index:1;
      border: 1px solid black;
    }

    path::after {  content: "<div>Read this:</div> ";
    font-size: 34px;
    position: absolute;
    top: 0;
    z-index: 1000000;
}


    path:hover,path.hover {
      opacity: 1;
      fill: #000000;
      stroke:  #000000;
      stroke-width: 1px;
      z-index:100;
    }

    .land {
      fill-opacity: 1;
      stroke: white;
      stroke-opacity: 1;
      stroke-width: 1px;
    }
.tip {
    font-size: 20px;
    background-color: #a50000;
    color: #fff;
    display: inline-block;
    padding: 10px 20px 10px 20px;
    border-radius: 25px;
    margin-left: 10px;
    margin-top: -40px;
    -webkit-box-shadow: 10px 10px 66px -28px rgba(0,0,0,1);
    -moz-box-shadow: 10px 10px 66px -28px rgba(0,0,0,1);
    box-shadow: 10px 10px 40px -10px rgba(0,0,0,1);
    position: relative;
    z-index: 101;
}

.tip:after{
    content: " ";
    width:20px;
    width: 20px;
    height: 20px;
    background-color: #a50000;
    position: absolute;
    left: 0px;
    top: 27px;
    display: block;
    }

#city{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    width: 50%;
    float: right;
    margin: 0px;
    padding: 0px;
    position: relative;
}
#city li{padding:10px;color:#000;list-style: none;}
#city li a{color:#000;text-decoration: none;}
#city .active,#city li:hover, #city .active a,#city li:hover a{background-color: #a50000;color:#fff;border-radius: 25px;}
.map-container{width: 100%;max-width: 1600px;margin: auto;}