.our_workArea {
    width: 100%;
    padding: 0 0 100px;
}
.our_workArea .itemBox {
    padding: 8px 0 0;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0px 180px;
 
}
.our_workArea .itemBox .item {
    text-align: center;
    margin: 60px 0 0;
}
.our_workArea .itemBox .item h5 {
    margin: 0;
}
.our_workArea .itemBox .item .map {
    width: 120px;
    height: 120px;
    background: #816AFF;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 24px;
    transition: all ease 0.5s;
} 

.our_workArea .itemBox .item .map.syria {
    background: #01C0B5;
}
.our_workArea .itemBox .item .map.bahrain {
    background: #00625C;
}
.our_workArea .itemBox .item .map.iraq {
    background: #F38C13;
}
.our_workArea .itemBox .item .map.kuwait {
    background: #361EA6;
}
.our_workArea .itemBox .item .map.oman {
    background: #F3BC44;
}
.our_workArea .itemBox .item:hover .map {
    background: #FEF7E9 !important;
}
.our_workArea .itemBox .item .map img {
    transition: all ease 0.5s;
}
.our_workArea .itemBox .item:hover .map img{
    filter: invert(1);
}


@media(max-width: 1365px){
    .our_workArea .itemBox {
        gap: 0px 155px;
    }
}
@media(max-width: 1279px){
    .our_workArea {
        padding: 0 0 80px;
    }
    .our_workArea .itemBox {
       gap: 0px 130px;
    }
}

@media(max-width: 1199px){
    .our_workArea .itemBox {
       gap: 0px 85px;
    }
}

@media(max-width: 991px){

    .our_workArea {
        padding: 0 0 70px;
    }
    
    .our_workArea .itemBox {
        gap: 0px 80px;
        grid-template-columns: repeat(4, 1fr);
    }
 
    .our_workArea .itemBox .item {
        margin: 45px 0 0;
    }
    .our_workArea .itemBox .item .map {
        width: 110px;
        height: 110px;
        margin: 0 auto 15px;
    }
}

@media(max-width: 767px){

    .our_workArea .itemBox {
        gap: 0px 90px;
        grid-template-columns: repeat(3, 1fr);
    }
}
@media(max-width: 575px){

    .our_workArea .itemBox {
        gap: 0px 50px;
    }

}
@media(max-width: 479px){
    .our_workArea .itemBox {
        gap: 0px 90px;
        grid-template-columns: repeat(2, 1fr);
    }
    .our_workArea .itemBox .item {
        margin: 35px 0 0;
    }
}

@media(max-width: 374px){
    .our_workArea .itemBox {
        gap: 0px 50px;
    }
}