@media screen {
    /* MOBILE */
    main{width:100%;background-color:#fff;padding-bottom:40px;}    
    
    .articleContainer{width:100%;height:auto;margin:0 auto;padding:20px 10px;overflow:auto;background-color:#fff;}   
    article{width:100%;margin:0 auto;padding:0 20px;}
    article .lead{margin-top:25px;font-size:14px;font-weight:bold;line-height:150%;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}
    article .text{margin-top:25px;font-size:13px;line-height:150%;text-align:justify;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}
    article .imageContainer{margin-top:25px;}
    article .imageContainer img{width:100%;margin:0 auto;}
    article .imageContainer .caption{background-color:#fff;padding:10px;font-size:12px;font-style:italic;color:#aaa;text-align:center;}
    
    .catalogContainer{width:100%;height:auto;margin:0 auto;overflow:auto;}
    
    .catalogList{width:100%;margin:20px auto;padding:0;overflow:auto;}   
    .catalogBox{width:100%;overflow:auto;}
    .catalogBoxContent{height:auto;overflow:auto;border:10px solid #fff;border-radius:10px;overflow:hidden;cursor:pointer;}
    .catalogBoxContent:HOVER{border-color:#eee;}
    .catalogBoxContent:HOVER img{transform: scale(1.05);}
    .categoryBoxContent:HOVER .categoryBoxTitle{color:rgba(5,80,130,1)}
    .catalogImageContainer{padding:10px;}
    .catalogImageContainer img{width:100%;display:block;transition: transform .5s;}
    .catalogBoxTitle{margin:0 10px;padding:15px 0;font-size:17px;font-weight:bold;text-align:center;line-height:140%;border-top:1px solid rgba(10,110,190,1)}
    .catalogBoxText{padding:5px 0;font-size:15px;color:#999;}     
    
    .product{width:100%;margin:0 auto;overflow:auto;padding:0 20px;}
    .product .image{width:100%;padding:0;}
    .product .image .imageContainer{width:100%;padding:0 20px;}    
    .product .image .imageContainer img{width:100%;}    
    .product .detail {width:100%;overflow:auto;padding:0 10px;}    
    .detail .thumbnails{border-bottom:1px solid #ccc;margin-bottom:20px;padding-bottom:20px;overflow:auto;}    
    .detail .thumbnails .box{width:25%;padding:10px;float:left;overflow:auto;}   
    .detail .thumbnails .box img{width:100%;cursor:pointer;transition: transform .5s;} 
    .detail .thumbnails .box img:HOVER{transform: scale(1.1);} 
    .detail .productCode p{padding:0 0 20px 0;font-size:15px; font-weight:bold;line-height: 150%;} 
    .detail .shortDescription p{padding:20px 0;font-size:15px; font-weight:bold;line-height: 150%;} 
    .detail .description{overflow:auto;}  
    .detail .description p{padding-bottom:20px;font-size:13px; line-height: 150%;} 
    .detail .badge{margin-top:20px;border-top:1px solid #ccc;padding:20px 0;overflow:auto;}     
    .detail .badge .box{width:33.33%;padding:5px;float:left;overflow:auto;}   
    .detail .badge .box img{width:100%;background:#2a97ae;border-radius:5px;} 
    
    .productDocument{width:100%;overflow:auto;margin-top:20px;padding:5px 0;border-top:1px solid #ccc;}
    .productDocumentBox{height:auto;overflow:auto;overflow:visible;}
    .productDocumentBox h2{font-size:19px;color:#666;padding:0 20px 20px 0;border-bottom:1px solid #ccc;}
    .productDocumentBox ul{overflow:auto;list-style:none;padding:10px 0;}
    .productDocumentBox ul li {float:left;width:33.33%;padding:10px;cursor:pointer;}    
    .productDocumentBox ul li img{width:100%;background:rgb(222,6,4);border-radius:5px;transition: .5s}
    .productDocumentBox ul li:HOVER img{transform: scale(1.05);}
    .productDocumentBox ul li p{margin:15px 0 5px 0;font-size:13px;text-align:center;line-height:140%;}  
    .productDocumentBox ul li:HOVER p{color:#0a44b9;} 
    
    .document{width:100%;overflow:auto;padding:20px 0;}
    .documentBox{height:auto;overflow:auto;overflow:visible;}
    .documentBox h2{font-size:19px;color:#666;padding:0 20px 20px 0;border-bottom:1px solid #ccc;}
    .documentBox ul{overflow:auto;list-style:none;padding:10px 0;}
    .documentBox ul li {float:left;width:50%;border:8px solid #fff;border-radius:4px;padding:10px;cursor:pointer;}    
    .documentBox ul li:HOVER{border-color:#eee;}
    .documentBox ul li img{width:100%;background:rgb(222,6,4);border-radius:5px;transition: .5s}
    .documentBox ul li:HOVER img{transform: scale(1.05);}
    .documentBox ul li p{margin:15px 0 5px 0;font-size:15px;text-align:center;line-height:140%;}     
    
    h1{text-transform:none;}
}

@media screen and (min-width: 768px) {
    /* TABLET */    
    
    .articleContainer{padding:20px;}   
    
    .catalogBox{width:100%;overflow:auto;}
}

@media screen and (min-width: 1360px) {
    /* DESKTOP */
    
    article{max-width:1320px;}
    
    .catalogList{max-width:1320px;}
    .catalogBox{float:left;width:25%;overflow:auto;}
    
    .product{max-width:1360px;overflow:auto;padding:0 20px;}
    .product .image{float:left;width:50%;}
    .product .detail{float:left;width:50%;}
    
    .productDocumentBox ul li {float:left;width:16.66%;padding:10px;cursor:pointer;}    
    
}