@media screen {
    /* MOBILE */
    main{width:100%;margin:0 auto;}
    .articleSection{width:100%;height:auto;margin:20px auto 40px auto;padding:20px 0;overflow:auto;}    
    .articleBox{width:100%;padding:0 30px 40px 30px;}
    
    article{width:100%;}
    article h1{font-size:32px;color:#000;text-transform:uppercase;border-bottom:2px solid #008dd2;} 
    article .lead{margin-top:40px;font-size:16px;font-weight:bold;line-height:150%;}
    article .text{width:100%;margin-top:40px;font-size:15px;line-height:150%;}
    article .text b{font-size:16px;font-weight:bold;}
    article .imageContainer{margin-top:25px;}
    article .imageContainer img{width:100%;max-width:600px;margin:0 auto;}
    article .imageContainer .caption{background-color:#fff;padding:10px;font-size:13px;font-style:italic;color:#999;text-align:center;}
    
    .documentBox{float:left;width:50%;height:auto;overflow:auto;margin-bottom:40px;}
    .documentBox h2{margin:20px;font-size:19px;color:#f4792b;padding-bottom:20px;border-bottom:1px solid #717a82;}
    .documentBox div{margin:0 20px;}
    .documentBox div img{float:left;height:20px;margin:-1px 10px 0 0;vertical-align:middle;}
    .documentBox div a{font-size:15px;color:#000;text-decoration:none;}
    .documentBox div a:HOVER{color:#f4792b;}

    .mainProducts{display:none;}
}

@media screen and (min-width: 768px) {
    /* TABLET */
    .article{float:right;width:75%;padding:0 30px 20px 30px;}
    article .text{float:left;width:33.33%;margin-top:40px;font-size:15px;line-height:150%;}
}

@media screen and (min-width: 1360px) {
    /* DESKTOP */
    .articleBox{max-width:1400px;margin:0 auto;padding:0 100px 40px 100px;}
    .article{padding:0 20px 20px 20px;}
    article .text{float:left;width:33.33%;margin-top:40px;font-size:15px;line-height:150%;}
}