Hello--

I noticed that the Outlook app for iOS will not display images via media queries. Does anyone know how to fix this in the below CSS?

Thanks!


<!doctype html>
<html lang="en">
    <head>
        <title>TEST</title>
        <style type="text/css">
@media only screen and (max-width: 480px) {
table[class="wrapper"] {
display: block !important;
max-width: 480px !important;
width: 100% !important;
}
td[class="deviceWidth"] {
display: block !important;
max-width: 480px !important;
padding: 0 !important;
}
td[class="mobileBanner"] {
background-image: url(http://echo4.bluehornet.com/cimages/73d08cc42669e84a270f24fa5d864ccb/INTA_head_2x.jpg) !important;
width: 480px !important;
background-repeat: no-repeat !important;
background-position: left top !important;
-webkit-background-size: cover;
background-size: cover !important;
}
[class="mobileBanner"] img {
display: none !important;
}
[class="mobileBanner"] a {
display: block !important;
padding-top: 20% !important;
}
td[class="mobileBannerSpring"] {
background-image: url(https://echo4.bluehornet.com/cimages/73d08cc42669e84a270f24fa5d864ccb/2017_la_cartegenia_2x.jpg) !important;
background-repeat: no-repeat !important;
background-position: left top !important;
-webkit-background-size: cover;
background-size: cover !important;
}
[class="mobileBannerSpring"] img {
display: none !important;
}
[class="mobileBannerSpring"] a {
display: block !important;
padding-top: 30% !important;
}

.txtBody {
max-width:480px !important;
width:80% !important;   
}

.emailButtonContainer {
padding-left:0px !important;
padding-bottom:20px !important;
}
.emailButton{
max-width:480px !important;
width:100% !important;
}
.emailButtonCenter{
max-width:480px !important;
width:100% !important;
}
.emailButton a{
display:block !important;
font-size:18px !important;
}
.featureBoxOuter {
background-color: #ffffff !important;
padding-left: 0px !important;
/*padding-top: 12px !important;*/
width: 100% !important;
}
.featureBox{ 
display: block !important;
width: 100% !important;
padding-top: 12px !important;
border-top: 0px !important;
border-bottom: 16px solid #ffffff !important;
border-left: 0px !important;
border-right: 0px !important;
background-color: #f5f5f5 !important;
}
.featureBoxText{
padding-left: 42px !important;
padding-right: 42px !important;
}
.youMayBe{
padding-top: 36px !important;
}
.footer {
font-size: 14px !important;
line-height:16px !important;
}
img[class="mediapartner"] {
width:370px !important;
padding-top: 24px !important;
}
td[class="mediapartnerTD"] {
text-align:center !important;
}
}
</style>