/* All small mobile - design for a width of less than 480px
%
*/

/* width < 480px */

@media only screen and (max-width: 479px) {
    /* LOGIN */
    .blocoLogin {
        width: 100%;
    }
    .login-panel {
        width: 48%;
    }
    .header .infoBox {
        float: none;
        margin: 0 auto;
        clear: both;
        width: 89%;
        display: inline-table;
    }
    .header .infoBox #chatLink {
        display: none;
    }
    .header .infoBox li {
        width: 100%;
    }
    #copyrights {
        text-align: center;
        width: 100%;
    }
    #copyrights p {
        text-align: center;
        width: 100%;
    }
    #b2b {
        float: none !important;
        clear: both;
    }
    .box-ajuda {
        font-size: 13px;
    }
    .box-ajuda span {
        font-weight: bold;
    }
    /* CADASTRO */
    .col3-left {
        width: 100%;
    }
    .form_billing_fs, .field_pf {
        width: inherit;
    }
}
/* width < 767px */

@media only screen and (max-width: 767px) {
    .container-footer-osc p {
        text-align: center;
    }
    .container-footer-osc #b2b {
        float: none;
        margin: 10px auto 0;
        width: auto;
        display: table;
        position: relative;
    }
    .logo_osc {
        float: none;
        margin: 10px auto;
        padding: 0;
        display: inline-block;
    }
    .login-security-purchase .list {
        width: 90%;
    }
    .header-osc .top-itens {
        float: none;
        display: table;
        margin: 0 auto;
    }
    /* LOGIN */
    .header .infoBox {
        float: none;
        margin: 0 auto;
        clear: both;
        width: 100%;
        display: inline-table;
        padding: 10px 0;
    }
    .header .infoBox li {
        width: 100%;
    }
    .header .infoBox #chatLink {
        display: none;
    }
    .box-ajuda {
        font-size: 16px;
    }
    .blocoLogin, .login-panel {
        width: 100%;
        min-height: inherit;
        padding: 0 0 20px;
    }
    .list {
        width: 100%;
    }
    /* CADASTRO */
    .col3-left, .col3-middle, .col3-right {
        margin: 0 0 10px;
        width: 100%;
    }
    .container-footer-osc {
        position: relative;
    }
    .osc-onepage-login, .osc-onepage-checkout {
        padding: 0;
    }
}
@media only screen and (min-width: 768px) {
    button.btn-checkout {
        float: right;
        width: 180px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    /*CADASTRO*/
    .col3-left, .col3-middle, .col3-right {
        width: 49%;
    }
    .col3-middle {
        margin-right: 0;
        float: right;
    }
}
/* All mobile - design for a width of less than 768px
%
*/

/* width < 768px */

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .form_billing_fs, .field_pf {
        float: left;
        width: 43%;
    }
}
/* 768px <= width */

@media only screen and (min-width: 768px) {
    /* .login-panel {width: 100%;} */
}
/* Design for a width of 960-1280 px
%
*/

/* 960px <= width < 1280px */

@media only screen and (min-width: 960px) {
    .login-security-purchase {
        float: left;
        min-height: 306px;
    }
    .osc-onepage-login .container-footer-osc {
        position: fixed;
        bottom: 0;
    }
    .osc-onepage-login {
        padding: 0;
        float: left;
        width: 100%;
    }
    .button-container {
        clear: right;
        float: right;
        width: auto;
        margin: 10px 0 0;
    }
}
/* Design for a width of 1024 px
%
*/

/* width < 1024px */

@media only screen and (max-width: 1023px) {
    .blocoLogin {
        width: 100%;
    }
    /*LOGIN*/
    .osc-onepage-login #containerCopyrights {
        position: inherit;
        clear: both;
    }
    .login-security-purchase {
        width: auto;
        float: left;
    }
    .blocoLogin {
        width: 100%;
        float: left;
    }
}
/* 
Mobile, small old desktop - design for a width of less than 960px
%

width < 960px
@media only screen and (max-width: 959px) { 
}

Tablet (Portrait) - design for a width of 768px
%

768px <= width < 960px
@media only screen and (min-width: 768px) and (max-width: 959px) {

}


Mobile (Landscape) - design for a width of 480px
%

480px <= width < 768px
@media only screen and (min-width: 480px) and (max-width: 767px) {  
    }
Additional break-point:
   Mobile (Landscape, iPhone 4 Portrait) - design for a width of 640px
%
@media only screen and (max-width: 640px) {

}

Mobile (Portrait) - design for a width of 320px
%

320px <= width < 480px
@media only screen and (min-width: 320px) and (max-width: 479px) {

}

width < 320px
@media only screen and (max-width: 319px) {

}
 */