@media (min-width: 120px) and (max-width:768px) {    
    .erModel {font-size:12px;}
    .ccApplyHeader {font-size: 12px;font-weight:900;margin-left:0px;}
    .mainHeader img {margin-right: 0px;} 
    #ccDeclaration .inputPadBottom {padding-bottom: 10px;} 
    #Choosecards .filterBtn:first-child {margin-left:0px;}
    #Choosecards .filterSection{display:block;}
    .desktopHide {display: block;}
    .desktopHide h4 {font-size: 13px;}
    .forCircle {
        margin: auto;
    }
    .reqCircle {
        margin-bottom: 10px;
    }
    .ccDisplaySection{
        margin: 10px 0 40px 0;    
    }
    .footer .copyrights {        
        font-size: 10px;        
    }
}

@media (min-width: 120px) and (max-width:600px) {
    /*.welmeBtnAply {margin-right: 100%; margin-left:-15%;}*/
    .welmeBtnAply { margin-left:-4%;}
    #moreAboutYou .input-group-btn, #cardOptions .input-group-btn {
        float: right;
        top: -5px;
        width: 18%;
    }
    .floatBtn{        
        max-width: 100%;
        opacity: 1;        
    }
    .ccDisplaySection img {
         min-width: 50px; 
    }
    .inputPadBottom {
        padding-top:10px;
        padding-bottom:20px;
    }
    
}

@media (min-width: 601px) and (max-width:960px) {
    /*.welmeBtnAply {margin-left: -2%;}*/
}


@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
   /* IE10+ specific styles go here */  
    .blackHeader .progress-smalline-30 {        
        margin-right: 40%; margin-left: 0%;
    }

    .blackHeader .progress-smalline-70 {       
        margin-left: 40%;
    }

    .blackHeader .progress-smalline-20 {       
        margin-left: 0%; margin-right:70%;
    }

    .blackHeader .progress-smalline-40 {      
        margin-left: 0%; margin-right:38%;
    }

    .blackHeader .progress-smalline-60 {       
        margin-left: 33%; margin-right:37%;
    }

    .blackHeader .progress-smalline-80 {      
        margin-left: 30%;
    }

    .blackHeader .progress-smalline-100 {      
        margin-left: 64%; 
    }

    .blackHeader .progress-smalline-18 {       
        margin-left: 0%; margin-right:66%;
    }

    .blackHeader .progress-smalline-41 {      
        margin-left: 0%; margin-right:20%;
    }

    .blackHeader .progress-smalline-63 {       
        margin-left: 26%; 
    }

    .blackHeader .progress-smalline-85 {      
        margin-left: 70%;
    }

    #ccWelcomePage .welmeBtnAply {
        margin-right: 40%;
    }

    #ccWelcomePage .btnpad {
        margin-left: -2%;
    }
}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
/* Styles */
 .mobileHide {display: block;}
}

@media (min-width: 768px) {
    .ccDisplaySection .col-sm-3 {       
        min-height: 39%;
    }
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
.ccDisplaySection{margin-bottom: 20%;}
#creditAbleOdus .modal-dialog {
        max-width: 100% ;        
    }
#creditAbleOdus .modal-content {
        height: 450px;
    }
.m-signature-pad--body {
    height: 250px;
}
    .m-signature-pad--body canvas {
        height: 250px;
    }
    .m-signature-pad--footer {
          top: 280px;
        }

}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px)  and (orientation : landscape) {
/* Styles */
.mobileView{font-size:12px;}
#creditAbleOdus .modal-dialog {       
        min-width: 95%;      
    }
#creditAbleOdus .modal-content {
        height: 300px;
    }
.m-signature-pad--body {
    height: 120px;
}
    .m-signature-pad--body canvas {
        height: 120px;
    }
    .m-signature-pad--footer {
          top: 150px;
        }
    .modal-header {     
      padding-bottom: 1px;
      
    }
    md-input-container > md-select {
        width: 100%;
    }
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
/* Styles */
.ccDisplaySection{margin-bottom: 20%;}
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
/* Styles */

    md-divider {
        margin-bottom: 15px;
    }
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* Styles */
    .ccDisplaySection .col-sm-3 {
        /*min-height: 390px;*/
        min-height: 350px !important;
        width: 25%;
    }
    .ccSubTitl {
        padding-bottom: 35px;
    }
     .splProduct img {
        max-width: 150px;
    }
      .m-signature-pad {
        margin-top: -1px;
    }
      .desktopHide {
        display: block;
    }
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
/* Styles */
/*body {display: none;}*/
    .ccDisplaySection .col-sm-3 {
        min-height: 300px !important;
        width: 50%;
    }    
     .m-signature-pad {
        margin-top: -5px;
    }
    .m-signature-pad--body {
        
         height: 200px;
    }
    .m-signature-pad--body canvas {
        
        height: 200px;
    }

    #creditAbleOdus .modal-content {
        height: 400px;
    }

    .m-signature-pad--footer {
        top: 250px;
    }
    .ccApplyHeader {
        margin-left: 36%;
    }
    .desktopHide {
        display: block;
    }
}
/**********
iPad 3
**********/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
#creditAbleOdus .modal-content {
   height: 400px;
}
 .m-signature-pad {
   background-color: transparent;
   margin-top: 10px;
   margin-left: -450px;
   width: 80%;
 }
 .m-signature-pad--body {
     height: 150px;
 }
 .m-signature-pad--body canvas {
     height: 150px;
 }
 .m-signature-pad--footer {
     top: 180px;
 }

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */

}

/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
/* Styles */
}

/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
.mobileView{font-size:12px;}
}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
.ccDisplaySection{margin-bottom: 10%;}
.mobileView h4{font-size:12px;}
    .mobileView {     
        padding: 5px 0px 0px 5px;
        background: none;
    }
    .progress-smalline-30 {        
        margin-top: -3%;
    }
    .progress-smalline-70 {       
        margin-top: -6%;
    }
    .blackHeader .comprsdImg {
        width:10px;    
    }
}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
.ccDisplaySection{margin-bottom: 20%;}
.mobileView h4{font-size:10px;}
.mobileView {     
        padding: 3px 0px 0px 8px;background: none;
    }
.blackHeader .progress-smalline-30 {        
        margin-top: -3%;
    }
.blackHeader .progress-smalline-70 {       
        margin-top: -6%;
    }
.blackHeader .exDeclartn{
        margin-left: 20%; 
    }
.blackHeader .comprsdImg {
        width:10px;    
    }
}

/* iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
/* Styles */
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
/* Styles */
}

/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
/* Styles */
}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
/* Styles */

}


@media screen and (max-width: 1024px) {
  #creditAbleOdus .modal-dialog {
        width: 400px;      
    }
 
}

/*For Signature*/
@media screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #creditAbleOdus .modal-dialog {
        width: auto;        
    }

}

@media screen and (max-height: 320px) {
    #creditAbleOdus .modal-dialog {
        width: auto;        
    }
}

@media only screen and (min-width: 1440px) and (max-height: 873px) and (orientation : landscape) {
/* Styles */
    hr[class*='progress-smalline-'] {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .m-signature-pad {
        margin-top: 7%;
    }
}