#location_area .card{
float:left;
width:100%;
display:none;
}

#location_area .card:first-child{
display:block;
}

#location_region .card{
float:left;
width:100%;
display:none;
}

#location_region .card:first-child{
display:block;
}

#location_region .card{
float:left;
width:100%;
display:none;
}


/* Mobile View only */
@media screen and (max-width: 45rem){

.location .left{
float:left;
width:auto;
display:none;
}

.location .right{
float:left;
width:auto;
}

}

/* Desktop View */
@media screen and (min-width: 45rem){

.location .left{
float:left;
width:auto;
position:relative;
padding:4px 0 0 0;
}

.location .right{
float:right;
width:auto;
}


}

.location{
float:left;
width:100%;
}

.foreground.status .location .left:before,
.foreground.detail .location .left:before{
float:left;
content:'';
width:1.25rem;
height:1.35rem;
}

.foreground.status .location .left:before,
.foreground.detail .location .left:before{
background:url('/asset/img/database/location/surrounding.svg') no-repeat 0 2px;
}

.foreground.status .location .left p,
.foreground.detail .location .left p{
float:left;
width:auto;
margin:0 0 0 .25rem;
padding:0 0 0 0;
}

.foreground.status .location .left p a,
.foreground.detail .location .left p a{
font-weight:normal;
}


.foreground.status .location .right:before,
.foreground.detail .location .right:before{
float:left;
content:'';
width:1.25rem;
height:1.35rem;
}

.foreground.status .location .right:before,
.foreground.detail .location .right:before{
background:url('/asset/img/database/location/location.svg') no-repeat 0 2px;
}

.foreground.status .location .right p,
.foreground.detail .location .right p{
float:left;
width:auto;
margin:0 0 0 .25rem;
padding:0 0 0 0;
}

.foreground.status .location .right p a,
.foreground.detail .location .right p a{
font-weight:normal;
}


.foreground.detail .location{
background:var(--base-background-color);
margin:.15rem 0 0 0;
padding:.5rem 0 .15rem 0;
}

.foreground.detail .location p{
font-family:var(--bold-font-family);
font-size:var(--s-font-size);
}