CSS not working on all browsers

Have an unusual sitation where some of css is not working in chrome or ie.
firefox seems fine but chrome is not showing drop shadow or rounded corners on images

ie is showing rounded corners on some images but not all but shows all drop shadows!

below is the full css edits I have added

/* menu size */
#header_main .avia-menu-text {
font-size: 22px;
}
/*header phone number size and colour*/

.phone-info {
font-size: 18px;
}
.av_header_transparency .phone-info a { color: white; }
.phone-info a { color: #808080; }

/*change icon size*/

.av-seperator-icon {
display: inline-block;
vertical-align: middle;
font-size: 35px;
}

/*footer padding*/
#footer { padding: 0; }
#footer .widget { padding: 0; margin: 10px 0 10px 0; }

#socket .container {
padding: 2px 0;
}

/*image drop shadow*/
.dropshadow
{
-webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
}
/*curved image corners*/
.avia-image-container
{
-webkit-border-radius: 20px !important;
-moz-border-radius: 20px !important;
border-radius: 20px !important;
}
.avia_image
{
-webkit-border-radius: 20px !important;
-moz-border-radius: 20px !important;
-border-radius: 20px !important;
}

/*dronesafe image in footer to right*/
.wp-image-571
{
float: right;
}
.wp-image-572
{
float: right;
}