@media (max-width: $xs-breakpoint) {
    .user-wizard {
        .welcome {            
            .wizard-mainlbl {
                display: block;
                .sub-mainlbl {
                    position: relative;
                    top: 1em;
                }
                img {
                    position: relative;
                    top: -7px;
                }
            }
        }
        .wizard-finish {
            h2 {
                text-align: center;
            }
            .wizard-finish-lbl {
                text-align: center;
            }
           .view {
               margin-top: 2.5em;
               padding-left: 1.5em;
               padding-right: 1.5em;               
           } 
           .img-desc {
                line-height: 16px;               
            } 
        }   
        .personal {
            .container-personal {
                padding: 5em 2em 2em 2em;
            }
            .row {
                display: flex;
                .col {
                    display: block;
                    flex: 100%;
                }
            }
        }  
        #locale {
           .view {
               td.firstrow {
                   line-height: 20px;
               }
           } 
        } 
        .mobile-order{
            order: -1;
        }          
        .mobile-hide {
            display: none;
        }
        .edit {
            table {
                padding: 5px;
            }
            tr {
                border-bottom: none;
            }
        }        
        .view {
            margin-top: 2.5em;
            padding-left: 1em;
            padding-right: 1em;
            width: 98%;
            tr th {
                border-bottom: 1px solid lightgrey;
            }
        }
        input[type=text],input[type=password],input[type=email] {
            width: 100%; 
        }
        input:not([type]) {
            width: 100%;
        }
    }
}

@media (min-width:750px) and (max-width:768px) {
    .user-wizard {
        .welcome {
            background-size: cover;
            .panel {
                margin-top: 9em;
            }
        }
        .personal {
            .container-personal {
               margin-top: 4em;
            }
        }
        #locale {
           margin-top: 3em;
        }
        .wizard-finish {
           margin-top: 3em; 
        }
        .img-desc {
            line-height: 15px;
        }
    }
}



@media (min-width:768px) and (max-width:768px) {
    .user-wizard {
        .welcome {
            background-size: cover;
            .panel {
                margin-top: 5em;
            }
        }
        .personal {
            .container-personal {
               margin-top: 0em;
            }
        }
        #locale {
           margin-top: 0em;
        }
        .wizard-finish {
           margin-top: 0em; 
        }
        .img-desc {
            line-height: 20px;
        }
    }
}

@media (max-width:750px) {
    .user-wizard {
        .welcome {
            .panel {
                margin-top: 9em;
            }
        }
        .personal {
            .container-personal {
               margin-top: 0em;
            }
        }
        #locale {
            margin-top: 0em;
         }
         .wizard-finish {
            margin-top: 0em; 
         }
    }
}

@media (max-width: 450px) {
    .user-wizard {
        .welcome {
            .panel {
                h1 {
                    font-size: 2rem;
                }
                .open-crm-txt {
                    font-size: 1.2rem;
                }
            }
        }
    }
}