.world-cyber{
position: relative;
padding: 93px 0px 305px 0px;
}
.world-cyber .sec-title{
margin-bottom: 150px;
}
.world-cyber .pattern-layer{
position: absolute;
left: 0px;
top: 180px;
right: 0px;
width: 100%;
height: 600px;
background-repeat: no-repeat;
background-position: center;
}
.world-cyber .office-location{
position: relative;
display: block;
min-height: 320px;
}
.world-cyber .office-location .location-area{
position: relative;
display: block;
width: 100%;
height: 100%;
max-width: 1140px;
width: 100%;
margin: 0 auto;
min-height: 320px;
}
.world-cyber .office-location .location-area .location-box{
position: absolute;
left: 200px;
top: 0px;
width: 15px;
height: 15px;
background: #fff;
box-shadow: 0 0px 10px rgba(0, 0, 0, 0.05);
cursor: pointer;
transition: all 500ms ease;
}
.world-cyber .office-location .location-area .location-box:nth-child(2){
left: 295px;
top: 95px;
}
.world-cyber .office-location .location-area .location-box:nth-child(3){
left: 390px;
top: 260px;
}
.world-cyber .office-location .location-area .location-box:nth-child(4){
left: 60%;
top: 25px;
margin-left: -25px;
}
.world-cyber .office-location .location-area .location-box:nth-child(5){
left: 55%;
top: 215px;
margin-left: -20px;
}
.world-cyber .office-location .location-area .location-box:nth-child(6){
top: -8px;
left: inherit;
right: 225px;
}
.world-cyber .office-location .location-area .location-box:nth-child(7){
top: 95px;
left: inherit;
right: 320px;
}
.world-cyber .office-location .location-area .location-box:last-child{
top: 300px;
left: inherit;
right: 195px;
}
.world-cyber .office-location .location-area .location-box:before{
position: absolute;
content: '';
width: 7px;
height: 7px;
left: 4px;
top: 4px;
transition: all 500ms ease;
}
.world-cyber .office-location .location-area .location-box:hover:before{
}
.world-cyber .office-location .location-area .location-box .address-box{
position: absolute;
left: -109px;
bottom: 40px;
width: 230px;
background: #fff;
padding: 10px 15px 15px 60px;
transform: translateY(-15px);
opacity: 0;
visibility: hidden;
z-index: 1;
transition: all 500ms ease;
box-shadow: 0 0px 10px rgba(0, 0, 0, 0.1);
}
.world-cyber .office-location .location-area .location-box:hover .address-box{
transform: translateY(0px);
opacity: 1;
visibility: visible;
}
.world-cyber .office-location .location-area .location-box .address-box:before{
position: absolute;
content: '';
background: #fff;
width: 20px;
height: 20px;
left: 50%;
margin-left: -10px;
transform: rotate(45deg);
bottom: -6px;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.05);
}
.world-cyber .office-location .location-area .location-box .address-box .icon-box{
position: absolute;
left: 16px;
top: 17px;
}
.world-cyber .office-location .location-area .location-box .address-box p{
font-size: 14px;
line-height: 20px;
margin: 0px;
}