.apoi-section{
    position:relative;
    min-height:700px;
    overflow:hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.apoi-filter-container{
    width:70px;
    height:700px;
    -webkit-box-shadow:0 3px 5px 0 rgba(0,0,0,.15);
    -moz-box-shadow:0 3px 5px 0 rgba(0,0,0,.15);
    box-shadow:0 3px 5px 0 rgba(0,0,0,.15);
    float:right;
    z-index:1000;
    position:relative;
    background:#fff;
    padding-top:70px
}
#apoi-maps-container{
    width: calc(100%);
    height:700px;
    float:left
}
.apoi-filter{
    cursor:pointer;
    padding:0 15px 12px;
    height:40px;
    line-height:40px;
    font-size:13px;
    font-weight:700;
    margin:15px 0 20px -40px;
    color:transparent;
    background-color:rgba(255,255,255,0);
    display:block;
    position:relative;
    text-align:center;
    width:0
}
.apoi-filter:hover{
    -webkit-box-shadow:0 3px 5px 0 rgba(0,0,0,.15);
    -moz-box-shadow:0 3px 5px 0 rgba(0,0,0,.15);
    box-shadow:0 3px 5px 0 rgba(0,0,0,.15);
    color:rgba(0,0,0,.6);
    background-color:rgba(255,255,255,1);
    width:160px;
    margin:15px 0 20px -170px
}
.apoi-filter:after{
    width:0;
    height:0;
    border:0 solid transparent;
    border-bottom-width:6px;
    border-top-width:5px;
    border-left:6px solid #fff;
    left:100%;
    top:50%;
    position:absolute;
    display:block;
    content:" ";
    margin-top:-6px;
    opacity:0
}
.apoi-filter:hover:after{
    opacity:1
}
.apoi-filter .apoi-map-icon{
    top:-10px;
    display:block;
    font-size:28px;
    position:absolute;
    right: 0px;
    color:#95979a;
    height:60px;
    line-height:60px;
    width:70px;
    text-align:center;
    border-right:3px solid transparent
}
.apoi-filter .apoi-map-icon:hover{
    background:#f0f0f0
}
.apoi-filter.selected .apoi-map-icon{
    color:#fff;
    background:#47484c;
    border-right:3px solid #28beca
}
#apoi-details-container,#apoi-list{
    position: absolute;
    top: 100px;
    right: 100px;
    height: 500px;
    background: #ffffff;
    width:380px;
    overflow-x:hidden;
    padding: 1rem 1rem;
}
#apoi-list{
    -webkit-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    -moz-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    z-index:2
}
#apoi-details-container{
    -webkit-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    -moz-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    z-index:3
}
.apoi-rank-empty,.apoi-rank-empty2,.apoi-rank-full,.apoi-rank-full2,.apoi-rank-half,.apoi-rank-half2{
    display:inline-block;
    width:12px;
    height:12px
}
.apoi-rank-full{
    background-image:url(../icons/star-full.png)
}
.apoi-rank-half{
    background-image:url(../icons/star-half.png)
}
.apoi-rank-empty{
    background-image:url(../icons/star-empty.png)
}
.apoi-rank-full2{
    background-image:url(../icons/star-full-white.png)
}
.apoi-rank-half2{
    background-image:url(../icons/star-half-white.png)
}
.apoi-rank-empty2{
    background-image:url(../icons/star-empty-white.png)
}
.apoi-short-details,.apoi-short-details-json{
    clear:both;
    height:95px;
    padding:10px 0 0 10px;
    cursor:pointer;
    margin-bottom:10px;
    /* -webkit-box-shadow:0 0 5px 0 rgba(0,0,0,.1); */
    -moz-box-shadow:0 0 5px 0 rgba(0,0,0,.1);
    /* box-shadow:0 0 5px 0 rgba(0,0,0,.1); */
    background:#fff;
    border: 1px solid #e5e5e5;
}
.apoi-short-details h4,.apoi-short-details-json h4{
    font-size:14px;
    font-weight:700;
    margin-top:0;
    margin-bottom:0
}
.apoi-short-details address,.apoi-short-details-json address{
    font-size:12px;
    color:#99999a;
    margin-top:5px;
    margin-bottom:0;
    font-style:normal
}
.apoi-short-left{
    float:left;
    width:275px;
    position:relative;
    height:100%;
    padding-right:10px
}
.apoi-details-photo{
    float:right;
    display:block;
    width:95px;
    height:95px;
    margin-top:-10px;
    position:relative;
    overflow:hidden
}
.apoi-short-details img,.apoi-short-details-json img{
    display:block;
    position:absolute;
    left:50%;
    top:50%;
    -ms-transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%)
}
.apoi-rank{
    position:absolute;
    right:10px;
    bottom:6px
}
.apoi-place-image{
    height:195px;
    position:relative;
    overflow:hidden
}
.apoi-place-image:empty{
    height:88px;
    background:#28beca;
    margin-bottom:2px
}
.apoi-place-image img{
    position:absolute;
    top:50%;
    -ms-transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    width:100%
}
.details-hide,.list-hide{
    width:30px;
    height:30px;
    font-size:24px;
    cursor:pointer;
    color:#595959;
    text-align:center
}
.list-hide{
    background:#f2f2f2;
    padding-right:2px;
    float:right;
    display: none;
}
.list-hide span:before{
    -ms-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
    display:inline-block
}
.details-hide{
    position:absolute;
    right:0;
    top:0;
    background:rgba(255,255,255,1)
}
.details-hide span:before{
    -ms-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
    display:inline-block
}
.apoi-place-name{
    background:rgba(0,0,0,.4);
    padding:3px 10px;
    position:relative;
    margin-top:-60px;
    height:60px;
    display:table
}
.apoi-place-name h4{
    font-size:16px;
    font-weight:700;
    color:#fff;
    margin:0;
    display:table-cell;
    vertical-align:middle;
    width:100%;
    min-width:360px;
    padding-right:60px
}
.apoi-place-name>span{
    margin-bottom:5px;
    display:block
}
.apoi-place-name #apoi-route-link{
    position:absolute;
    display:block;
    right:10px;
    top:50%;
    -ms-transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    border-radius:50%;
    background:#fff;
    width:33px;
    height:33px;
    padding-right:4px;
    padding-top:1px;
    text-align:center
}
#apoi-route-link .apoi-map-icon{
    color:#28beca;
    font-size:24px;
    line-height:33px
}
.apoi-place-address,.apoi-place-phone,.apoi-place-web{
    border-bottom:1px solid #e1e1e1;
    padding:15px 10px 15px 0;
    font-size:12px;
    color:#706e6e;
    font-weight:700;
    background:#fff
}
.apoi-place-address:empty,.apoi-place-phone:empty,.apoi-place-web:empty{
    display:none
}
.apoi-place-address:not(:empty)::before,.apoi-place-phone:not(:empty)::before,.apoi-place-web:not(:empty)::before{
    padding:0 10px 0 15px;
    color:#28beca;
    font-size:18px;
    font-family:map-icons;
    position:relative;
    top:2px
}
#apoi-switch-street,.apoi-autocomplete-container{
    position:absolute;
    -webkit-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    -moz-box-shadow:0 0 10px 0 rgba(0,0,0,.15)
}
.apoi-place-address:not(:empty)::before{
    content:"\e877"
}
.apoi-place-phone:not(:empty)::before{
    content:"\e8a4"
}
.apoi-place-web:not(:empty)::before{
    content:"\e833"
}
.apoi-place-phone a,.apoi-place-web a{
    color:#706e6e
}
.apoi-place-photos{
    column-count:2;
    column-gap:1px;
    margin-left:10px;
    margin-top:5px
}
.apoi-place-photos img{
    width:95%;
    margin-top:5px
}
.apoi-review{
    padding:15px;
    font-size:12px;
    color:#848484
}
.apoi-review:nth-child(odd){
    background:#fff
}
.apoi-review h4{
    color:#494949;
    font-size:14px;
    font-weight:700;
    margin:0
}
.apoi-review>span{
    margin-bottom:7px;
    display:block
}
.apoi-review-date{
    padding-left:10px;
    color:#9d9d9d
}
#apoi-route{
    margin:20px 10px;
    font-size:13px;
    background:#fff!important
}
.adp-placemark{
    background:#fff;
    padding:5px
}
.apoi-autocomplete-container{
    top:10px;
    right:80px;
    height:45px;
    background:#fff;
    width:250px;
    z-index:1;
    overflow-y:auto;
    box-shadow:0 0 10px 0 rgba(0,0,0,.15)
}
#apoi-autocomplete{
    border:none;
    height:45px;
    padding-left:10px;
    width:190px
}
#apoi-geolocation{
    width:45px;
    height:45px;
    float:right;
    background:#28beca;
    color:#fff;
    text-align:center;
    line-height:45px;
    font-size:18px
}
#apoi-switch-map,#apoi-switch-street{
    top:10px;
    LEFT: 0;
    width:70px;
    background: #3a53a4;
    font-size:28px;
    color:#fff;
    height:45px;
    line-height:45px;
    text-align:center
}
#apoi-switch-street{
    box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    z-index:1000
}
#apoi-switch-map,.apoi-transport-modes{
    -webkit-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    -moz-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    position:absolute
}
#apoi-switch-map{
    box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    z-index:10000
}
.apoi-transport-modes{
    top:645px;
    right:80px;
    max-height:45px;
    background:#fff;
    box-shadow:0 0 10px 0 rgba(0,0,0,.15)
}
.apoi-transport-modes input{
    opacity:0;
    width:15px
}
.apoi-transport-modes label{
    height:45px;
    line-height:45px;
    text-align:center;
    width:45px;
    margin-left:-15px;
    font-size:18px;
    color:#99999a
}
.apoi-transport-modes input[type=radio]:checked:not(old)+label{
    background:#28beca;
    color:#fff
}
#apoi-route-time{
    position:absolute;
    top:610px;
    right:80px;
    height:25px;
    background:#fff;
    font-size:12px;
    line-height:25px;
    padding:0 7px;
    -webkit-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    -moz-box-shadow:0 0 10px 0 rgba(0,0,0,.15);
    box-shadow:0 0 10px 0 rgba(0,0,0,.15)
}
.apoi-short-details{
    display: flex;
    flex-direction: row-reverse;
}
.infobox-photo{
    float:none;
    width:100%;
    min-height:0;
    max-height:150px;
    overflow:hidden;
    max-width:270px
}
.infobox-photo img{
    width:270px
}
.gm-style div>div:last-child>div>div:first-child>div:nth-child(2){
    box-shadow:none!important
}
.gm-style div>div:last-child>div>div:first-child>div{
    background:0 0!important;
    border:none;
    box-shadow:none
}
.gm-style div>div:last-child>div>div:first-child>div:nth-child(3)>div div{
    background-color:transparent!important;
    box-shadow:none!important
}
.gm-style div>div:last-child>div>div:first-child>div:first-child{
    background:0 0!important;
    box-shadow:none!important;
    border:none!important
}
.gm-style img{
    border-radius:5px 5px 0 0!important
}
.gm-style-iw{
    width:270px!important;
    top:20px!important;
    left:25px!important;
    background-color:#fff;
    box-shadow:0 1px 6px rgba(178,178,178,.6);
    border-radius:5px
}
.gm-style-iw+div{
    right:35px!important;
    top:27px!important
}
.gm-style .gm-style-iw{
    overflow:visible
}
.infobox-text{
    float:none;
    padding:10px;
    background-color:#fff;
    margin-top:-3px;
    border-radius:0 0 5px 5px;
    width:270px
}
.infobox-text h4{
    margin:5px;
    font-size:16px
}
.infobox-text address{
    font-style:normal;
    margin:15px 5px 5px
}
.infobox-text:after{
    display:block;
    content:" ";
    width:0;
    height:0;
    border-style:solid;
    border-width:10px 10px 0;
    border-color:#fff transparent transparent;
    position:absolute;
    bottom:-7px;
    left:125px
}
#apoi-switch-map{
    display:none
}
.apoi-street-view{
    left:-100%;
    z-index:10;
    -webkit-transition:all .5s ease-in-out;
    -moz-transition:all .5s ease-in-out;
    -ms-transition:all .5s ease-in-out;
    -o-transition:all .5s ease-in-out;
    transition:all .5s ease-in-out
}
.apoi-place-street-view{
    width:100%;
    height:200px;
    margin:10px 0
}
@media only screen and (max-width:767px){
    .apoi-container,.apoi-filter-container{
        width:100%;
        height:auto
    }
    #apoi-maps-container{
        width:100%
    }
    .apoi-filter-container{
        position:static;
        background:#f8f8f8;
        padding-bottom:4px;
        padding-top:0;
        float:none
    }
    #apoi-switch-map,#apoi-switch-street{
        position:static;
        float:left;
        margin-bottom:5px;
        margin-left:5px;
        width:auto;
        width:45px
    }
    #apoi-switch-street{
        display:block
    }
    .apoi-autocomplete-container{
        left:auto;
        right:10px
    }
    #apoi-details-container,#apoi-list{
        position:relative;
        width:100%;
        top:0;
        left:0;
        height:305px
    }
    #apoi-details-container{
        margin-top:-305px;
        z-index:2000;
        background:#fff
    }
    .apoi-autocomplete-container{
        position:static;
        width:calc(100% - 10px);
        margin:5px
    }
    #apoi-autocomplete{
        width:calc(100% - 55px)
    }
    .apoi-transport-modes{
        position:static;
        float:right;
        margin-right:5px
    }
    #apoi-route-time{
        position:static;
        float:right;
        height:45px;
        line-height:45px;
        margin-right:5px;
        margin-bottom:5px
    }
    .apoi-filter,.apoi-filter:hover{
        width:auto;
        margin:5px 0 0
    }
    .apoi-filter{
        cursor:pointer;
        padding:10px;
        line-height:12px;
        font-szie:12px;
        color:rgba(0,0,0,.7);
        background-color:rgba(255,255,255,1);
        display:inline-block;
        position:static;
        height:auto
    }
    .apoi-filter .apoi-map-icon{
        top:6px;
        color:#28beca;
        height:30px;
        width:auto;
        position:relative;
        padding-right:5px;
        line-height:inherit;
        right:0;
        font-size:26px
    }
    .apoi-filter .apoi-map-icon:hover{
        background:0 0
    }
}