@media screen {
    /* MOBILE */
    main{clear:left;width:100%;margin:0 auto;padding:0;height:auto;overflow:auto;} 
    .titleContainer{padding:100px 0;text-align:center;background-image:url('/design/image/striped.png');}
    .mainLead{margin:0 auto;font-size:15px;line-height:180%;padding:10px 30px;color:#fff;text-align:center;}
    .mainContainer{background-color:#fff;} 
    .mainContent{} 
    article{padding:50px 20px 80px 20px;}
    article .lead{margin:30px auto 0 auto;font-size:15px;font-weight:bold;line-height: 180%}
    article .text{margin:30px auto 0 auto;font-size:14px;line-height: 150%}
    article .date{}
    article .imageContainer{width:100%;}
    article .imageContainer img{width:inherit;margin:30px auto 0 auto;}
    article .imageContainer .caption{}
    
    .listContent{padding:20px 0 60px 0;overflow:auto;} 
    .articleBox{float:left;width:100%;padding:20px;min-height:260px;border:1px solid #fff;border-radius:20px;cursor:pointer;}
    .articleBox:HOVER{background-color:#eee;border-color:#ddd;}
    .articleBox .title{padding-bottom:20px;font-size:21px;text-align:center;}
    .articleBox .lead{padding-bottom:20px;font-size:14px;line-height:150%;}
     
    .relatedContainer{background-image: url('/design/image/ffffff090.png');text-align:center;padding:60px 0;}
    .relatedContainer p{font-size:36px;font-weight:bold;}
    button{margin:20px 10px 0 10px;}
    button a{color:#fff;}
    button a:HOVER{color:#fff;}
    
}

@media screen and (min-width: 768px) {
    /* TABLET */
    .articleBox{width:50%;}
    
}

@media screen and (min-width: 1360px) {
    /* DESKTOP */
    .mainContent{max-width:1360px;margin:0 auto;}
    .mainLead{max-width:1360px;}
    article .imageContainer img{max-width:75%;}
    .listContent{max-width:1360px;margin:0 auto;}
    .articleBox{width:33.33%;}
}