@media screen {
    /* MOBILE */
    main{width:100%;margin:0 auto;padding:0 1px;background-color:#fff;}
    .mainContainer{width:100%;height:auto;margin:0 auto;overflow:auto;padding:20px 10px;}     
    
    .article{width:100%;padding:0 20px}
    .article .lead{margin-top:25px;font-size:14px;font-weight:bold;line-height:150%;}
    .article .text{margin-top:25px;font-size:13px;line-height:150%;text-align:justify;}
    .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;}
    
    .content{width:100%;overflow:auto;padding:0 20px;margin-bottom:20px;}
    .message{width:100%;padding:30px 0;overflow:auto;border-bottom:1px solid #666;}
    .custom{width:100%;margin-top:-10px;padding:30px 0;overflow:auto;}
    
    .companyBlock{width:100%;}
    .companyBlock div{padding:5px 0;}
    .addressBlock{width:100%;}
    .addressBlock div{padding:5px 0;}
    .contactBlock{width:100%;}
    .contactBlock div{padding:5px 0;}    
    .inputBlock{padding:15px 0 10px 0;margin-bottom:5px;font-size:17px;font-weight:bold;color:#333;border-bottom:1px solid #ccc;}
    .inputText{padding:5px 0;font-size:13px;color:#333;line-height:150%;}
    .inputTextCustom{padding:0 0 5px 0;font-size:13px;line-height:150%;}
    .inputInfo{clear:both;padding:7px 0;font-size:12px;line-height:140%;color:#999;}
    .magicSelect{width:100%;padding:10px;background-color:#fff;border:2px solid #ccc;border-radius:5px;font-size:13px;}
    .magicSelect option{font-size:13px;}
    .input{width:100%;max-width:100%;padding:10px;border:2px solid #ccc;border-radius:5px;font-size:13px;}
    .inputCustom{width:50%;max-width:30%;margin:0 10px 10px 0;padding:10px;border:2px solid #ccc;border-radius:5px;font-size:13px;}
    .magicInput{width:100%;max-width:100%;padding:10px;border:2px solid #ccc;border-radius:5px;font-size:13px;}
    #dynamicInput{padding:0px;}
    .magicFile{width:100%;max-width:100%;padding:10px;border:2px solid #ccc;border-radius:5px;font-size:13px;}
    .height200{min-height:200px;}
    .height400{min-height:400px;}
    .inputError{width:100%;padding:10px;border:2px solid #f00;border-radius:5px;font-size:13px;}
    .magicInputError{width:100%;padding:10px;border:2px solid #f00;border-radius:5px;font-size:13px;}
    .magicSelectError{border:2px solid #f00;}
    .magicLabelbox{display: none;}
    .magicLabelbox + label {float:left;margin:0 5px 5px 0;background-color:#fff;border:2px solid #ccc;border-radius:5px;padding:10px 5px;text-align:center;font-size:13px;display: inline-block;position: relative;cursor:pointer;}
    .magicLabelbox:checked + label {font-size:13px;background-color:#38609c;color:#fff;}  
    .magicLabelboxError + label{font-size:13px;border:2px solid #f00;}
    
    .addressText{padding:0 0 5px 0;font-size:13px;color:#999;}
    .zip{float:left;width:20%;margin:0 10px 5px 0;padding:0;}
    .city{float:left;width:70%;margin:0 10px 5px 0;padding:0;}
    .street{float:left;width:40%;margin:0 10px 5px 0;padding:0;}
    .public{float:left;width:30%;margin:0 10px 5px 0;padding:0;}
    .number{float:left;width:20%;margin:0 10px 5px 0;padding:0;}
    .other{float:left;width:20%;margin:0 10px 5px 0;padding:0;}
        
    .contactType{width:100%;padding:10px;background-color:#fff;border:2px solid #ccc;border-radius:5px;font-size:13px;}
    .contactField{float:left;width:25%;}
    .contactField select{width:95%;}
    .contactField input{width:95%;}
    .addField {clear:left;width:31.66%;margin-top:10px;padding:10px;background-color:#fff;border:2px solid #ccc;border-radius:5px;font-size:13px;}
    
    
    .consent{width:100%;padding:30px 0 20px 0;overflow:auto;border-bottom:1px solid #666;}
    .custom{width:100%;padding:30px 0 20px 0;overflow:auto;border-bottom:1px solid #666;}
    .dataAgreement{padding:5px 0;font-size:13px;color:#999;}
    .magicCheckbox {display: none;}
    .magicCheckbox + label {background-color:#fff;border: 2px solid #f00;padding:8px;border-radius: 10px;display: inline-block;position: relative;margin-bottom:5px;cursor:pointer;}
    .magicCheckbox:checked + label {background-color:#38609c;border-color:#ccc;}
    span.dataAgreement {position: relative;top:-10px;left:5px;font-size:13px;}
    
    .hide{display:none;}
    
    .submit{margin-top:10px;}
    a.button{display:inline-block;margin:10px 10px 0 0;border-radius:5px;padding:10px 15px 10px 10px;background-color:#38609c;;color:#fff;font-size:15px;font-weight:bold;cursor:pointer;}
    a.hide{display:none;}
    a.button:HOVER{background-color:#333;}
    a.button p{display:inline-block;border:0;margin:0;padding:1px 0 0 0;color:#fff;white-space: nowrap;}
    a.button img{float:left;width:20px;margin-right:10px;}
    
    button{display:inline-block;margin:10px 10px 0 0;border-radius:5px;padding:10px 15px 10px 10px;background-color:#38609c;;color:#fff;font-size:15px;font-weight:bold;cursor:pointer;}
    button:HOVER{background-color:#333;}
    .buttonCustom{background-color:#666;}
}

@media screen and (min-width: 768px) {
    /* TABLET */
    .mainContainer{width:100%;}
    
    .article{float:right;width:66.67%;padding:0 20px}
    .content{float:right;width:66.67%}
    
    form{padding:0;}
    
    .companyBlock div{padding:5px 0;}
    .messageBlock div{padding:5px 0;}  
    .contactBlock div{padding:5px 0;}
}

@media screen and (min-width: 1360px) {
    /* DESKTOP */
    .mainContainer{max-width:1360px;padding-bottom:40px;}
    .article{float:right;width:100%;padding:0 20px}
    .content{float:right;width:100%}
    
    .companyBlock{float:left;width:50%;padding:5px 30px 5px 0;border-right:1px solid #666;}
    .companyBlock #billingData{}  
    .companyBlock div{padding:5px 0;}
    .addressBlock{float:left;width:50%;}
    .addressBlock #billingData{overflow:auto;padding:5px 0 5px 30px;}  
    .addressBlock #deliveryData{overflow:auto;padding:5px 0 5px 30px;} 
}