.legend {
font-size:12px;
font-weight:bold;
color:#333333;
background-color:#e0e0e0;
padding:2px 5px 2px 2px;
border-bottom:1px solid #333333;
}

.tag {
padding:2px;
font-size:10px;font-family:Arial;color:#333333;background-color:#f9f9f9;
border-bottom:1px solid #333333;
}

.gridarticle {float:left; width:100%;}
.gridarticleimage { width:50%; display:inline-block;min-height:440px; }
.gridarticletext {width:40%; display:inline-block; padding:5%; background:#555; height:100%;}
.gridarticletext {min-height:100%!important; height:100%!important; position:relative; top:0; left:0; bottom:0; right:0;}
.gridarticletext h1 {color:#fff;}
.gridarticletext h1 a {color:#fff;}
.gridarticletext p {font-size:18px; margin-top:40px; line-height:180%;color:#fff;}
.oddrow .gridarticletext {float:right;}
.oddrow .gridarticleimage {float:left;}
.evenrow .gridarticletext {float:left;}
.evenrow .gridarticleimage {float:right;}
.oddrow .gridarticle {background-position:0 50%;}
.evenrow .gridarticle {background-position:100% 50%;}

@media screen and (max-width: 900px){
.gridarticletext h1 {font-size:32px!important;}
}
@media (max-width: 728px) {
.gridarticles .gridarticle .gridarticletext {float:none!important; width:90%!important;text-align:center!important;padding:8% 5%!important;}
.gridarticleimage { width:100%;}
}
@media(max-width:620px){
.gridarticletext p {margin-top:20px!important; font-size:14px!important;}
}
@media(max-width:480px){
.gridarticleimage {min-height:350px; }
}