body{
    padding: 0;
    margin:0;
}
img{
    max-width:100%;
}
/*------------------- SPLASH PAGE START --------------------*/
.red_opegbg{
    background: url(../images/splash.jpg) no-repeat top center #bb232d;
    background-size: cover;
}
.splashScrooen{
    width:100vw;
    height:100vh;
    display:flex;
    align-items: center;
    justify-content: center;
    
}

.splashScrooen .splashlogo{
    max-width: 70vw;
}

/*------------------- SPLASH PAGE End --------------------*/

/*------------------- LOGIN PAGE START --------------------*/
.login_wraper{
    width:100vw;
    height:100vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.login_logo{
    padding: 10vh 0;
    text-align: center;
    width:60vw;
    max-width:350px;
    margin:0 auto;
}
.login_ctrl{
    padding: 0 5vw;
    margin:0;
}
a.login_typebtn{
    border:2px solid #fff;
    padding: 10px;
    position: relative;
    display:flex;
    align-items: center;
    border-radius:50px;
    font:300 20px/34px  'Roboto', sans-serif;
    color:#fff;
    text-decoration: none;
}
a.login_typebtn:after{
    content: '';
    position: absolute;
    right: 20px;
    top: 50%;
    margin: -7px 0 0 0;
    width: 15px;
    height: 15px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
}
a.login_typebtn span{
    width: 45px;
    border-right: 2px solid #fff;
    padding: 0 8px;
    margin: 0 8px 0 0;
}

.or_part{
    width:35%;
    margin:5vh auto;
    height:2px;
    background:#fff;
    position: relative;
}
.or_part .or_txt{
    width:40px;
    height:40px;
    position: absolute;
    left:50%;
    top:0;
    margin:-20px 0 0 -20px;
    border-radius:60px;
    display:flex;
    align-items: center;
    justify-content: center;
    font:300 20px/normal  'Roboto', sans-serif;
    color:#04413d;
    text-decoration: none;
    text-transform:uppercase;
    background:#fff;
}


/*------------------- LOGIN PAGE END --------------------*/

/*------------------- code PAGE Start --------------------*/
.red_opegbg.relator_code{
    background:url(../images/enter_code.jpg) no-repeat top center #e1e1e0;
    background-size: cover;

}
.red_opegbg.relator_code .splashlogo{
    max-width:350px;
    padding: 10vh 0;
    margin:0 auto;

}
.red_opegbg.relator_code .splashScrooen{
    justify-content: flex-start;
    flex-direction: column;
    width:100%;
}

.relator_code{
    padding: 0 3vw;
    display:flex;
    flex-direction: column;
    width:100%;
}
.relator_code .input-group-prepend .input-group-text{
    padding-right: 15px;
}
.relator_code .input-group-text img{
    max-width:40px;
}
.relator_code .form-control{
    font-size: 30px;
}
a.question_mark{
    width:30px;
    height:30px;
    position: absolute;
    top:10px;
    right:10px;
    z-index: 10;
    color:#000;
    text-decoration: none;
    font-size: 24px;
}
a.question_mark:hover{
    color:#fff;
}

/*------------------- code PAGE END --------------------*/


/*------------------- loan officer sign up PAGE Start --------------------*/

.red_opegbg.loanofficer_page{
    height:100vh;
    width:100vw;
    background:url(../images/enter_code.jpg) no-repeat top center #e1e1e0;
    background-size: cover;
    overflow-x: hidden;
    overflow-y: auto;

}

.loanofficer_page .topfixedbar{
    background:rgba(204, 35, 42, 0.9);
    padding:20px 15px;
    width:100%;
   
}
.topfixedbar .loanofficerlogo{
    text-align: center;
    display: block;
}
.topfixedbar .loanofficerlogo img{
    max-height:100px;
    max-width:100%;
}
.loan_signup{
    padding:30px 0;
}
.loan_signup h3{
    padding: 0;
    margin:0 0 22px 0;
    font:300 28px/normal  'Roboto', sans-serif;
    color:#000;
    text-align: left;
    text-decoration: none;
}
.loan_signup h3 .fa{
    color:#cc232a;
    font-size: 28px;
    margin:0 5px 0 0;
}
.form-control{
    border:0;
    border-bottom:1px solid #c4c4c4;
    background:none;
    font:300 13px/normal  'Roboto', sans-serif;
    color:#000;
    border-radius:0;
    box-shadow:none;
    padding: .375rem 0;
}

.form-control:focus{
    background:none;
    border:0;
    border-bottom:1px solid #c4c4c4;
    box-shadow:none;
    padding: .375rem 0;
}
.input-group-prepend .input-group-text{
    background:none;
    border:0;
    border-bottom:1px solid #c4c4c4;
    border-radius:0;
    padding: 0;

}
label.input_label{
    font:300 18px/normal  'Roboto', sans-serif;
    color:#000;
    padding: 0;
    margin:0;

}
label.input_label sup{
    color:#cc232a;
    font-size:13px;
}
.sign_upbtn{
    padding: 12px 40px;
    margin:0;
    border-radius:100px;
    font:300 20px/normal  'Roboto', sans-serif;
    color:#fff;
    text-decoration: none;
    background: #cc232a;
    border:0;
    display: inline-flex;
    align-items: center;
}
.sign_upbtn:disabled{
  opacity: 0.5;
}
.sign_upbtn .fa{
    margin-left:12px;
    font-size:30px;
}
a.already_register{
    font:300 20px/normal  'Roboto', sans-serif;
    color:#cc232a;
    text-decoration: none;
    text-align: right;
    float:right;
    padding: 15px 0 0 0;
    margin:0; 
}


/*------------------- loan officer sign up PAGE END --------------------*/
/*------------------- SELECT ReLATOR PAGE START --------------------*/
.red_opegbg.select_relator{
    background: url(../images/select_relator.jpg) top center;
    background-attachment: fixed;
    background-size: cover;

}

.red_toparea{
    padding: 20px 15px;
    margin:0;
    background:rgba(204, 35, 42, 0.9);
}
.red_toparea .toptitle_area{
    display:flex;
    align-items: center;
    padding: 0;
    margin:0 0 20px 0;
}
.toptitle_area h2{
    padding: 0; 
    margin:0;
    font:300 30px/normal  'Roboto', sans-serif;
    color:#fff;
    text-decoration: none;
    text-align:left;
    display:flex;
    flex-grow:1;
    align-items: center;
    justify-content: space-between;
}
.toptitle_area h2 a.question_icon{
     font-size: 28px;
     text-decoration: none;
     text-align: right;
     color:#fff;

}
.topsearch_part{
    padding: 0 2vw;
    margin:0;
}
.topsearch_part .search_control{
    width: 100%;
    background: #fff;
    border-radius: 100px;
    padding: 0px 40px 0px 15px;
    margin: 0;
    position: relative;
}
.search_control .form-control{
    width: 100%;
    background: none;
    border: 0;
    box-shadow: none;
    font: 300 20px/normal 'Roboto', sans-serif;
    color: #030102;
    text-decoration: none;
    text-align: left;
    padding: 0;
    margin: 0;
}

.search_control .search_btn{
    background: none;
    border: 0;
    position: absolute;
    right: 15px;
    top: 8px;
    font-size: 18px;
    color: #030102;
    padding: 0;
    margin: 0;
    width: 20px;
    height: 20px;
}

.select_relatorlistpart{
    height:calc(100vh - 133px);
    overflow-x: hidden;
    overflow-y: auto;
    background:rgba(255, 255, 255, 0.9);
}
.select_relatorlist{
    padding: 30px 0 0 0;
    margin:0;

}
.select_relatorlist ul{
    padding: 0;
    margin:0;
    list-style: none;
}
.select_relatorlist ul li{
    padding:0;
    margin:0;
    list-style: none;
}
.select_relatorlist ul li a{
    padding:8px 15px;
    margin:0;
    border-bottom:1px solid #d6d6d6;
    display:flex;
    align-items: center;
    justify-content: space-between;
    text-decoration: none;
} 
.select_relatorlist ul li a h3{
    padding: 0;
    margin:0;
    font: 300 28px/normal 'Roboto', sans-serif;
    text-decoration: none;
    text-align: left;
    color:#6c6c6c;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width:calc(100% - 30px);
}
.select_relatorlist ul li a span{
    width:30px;
    font-size: 26px;
    color:#3b3b3b;
    text-align: right;
}

.select_relatorlist ul li a:hover h3, .select_relatorlist ul li a.active h3{
    color:#be1733;
}
.select_relatorlist ul li a:hover span, .select_relatorlist ul li a.active span{
    color:#be1733;
}

/*------------------- SELECT ReLATOR PAGE END --------------------*/

/*------------------- SETTING PAGE START --------------------*/
.red_opegbg.setting_page{
    background:none;
}
.setting_page .toptitle_area{
    margin:0;
}
.setting_page .toptitle_area h2{
    justify-content: flex-start;
}
.setting_page .toptitle_area h2 .fa{
    font-size: 30px;
    margin-right:10px;
}
.settingpage_content{
    height:calc(100vh - 68px);
    background: url(../images/setting.jpg) no-repeat top center;
    background-size: cover;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 0 20px 0;
    margin:0;
}
.settingpage_content h3{
    padding:20px 0 0 0;
    margin:0;
    font: 300 22px/normal 'Roboto', sans-serif;
    text-decoration: none;
    text-align: left;
    color:#000;
}

.settingpage_content p{
    padding:8px 0 0 0;
    margin:0;
    font: 300 16px/22px 'Roboto', sans-serif;
    text-decoration: none;
    text-align: left;
    color:#656565;
}

.add_emailpart{
    padding: 20px 0 0 0;
    margin:0;
}
.add_emailpart ul{ 
    padding: 0;
    margin: 0;
    list-style: none;
    display:flex;
    flex-wrap:wrap;
    justify-content: space-between;
}
.add_emailpart ul li{ 
    width:48%;
    padding: 10px 15px;
    margin:0 0 15px 0;
    background:#fff;
    border-radius:10px;
    box-shadow: 3px 0 7px rgba(15, 41, 0, 0.15);
    display:flex;
    align-items: center;
}
.add_emailpart ul li .lefttxt_email{
    width:calc(100% - 30px);
    display:flex;
    flex-direction: column;
}
.add_emailpart ul li .lefttxt_email h4{
    padding: 0;
    margin:0;
    font: 300 20px/normal 'Roboto', sans-serif;
    text-decoration: none;
    text-align: left;
    color:#454545;
}

.add_emailpart ul li .lefttxt_email h5{
    padding: 0;
    margin:0;
    font: 300 17px/normal 'Roboto', sans-serif;
    text-decoration: none;
    text-align: left;
    color:#8b8b8b;
    font-style: italic;
}
.add_emailpart ul li .minis_icon{
    width:30px;
    text-align: right;
    display:flex;
    align-items: center;
}
.add_emailpart ul li .minis_icon a{
    width:24px;
    height:24px;
    border:2px solid #cc232a;
    border-radius:50%;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color:#cc232a;
    font-size:15px;
    display: flex;
}
.add_another{
    display: flex;
    justify-content: flex-end;
}
.add_another a{
    display:inline-flex;
    align-items: center;
    justify-content: flex-end;
    font: 300 20px/normal 'Roboto', sans-serif;
    text-decoration: none;
    text-align: right;
    color:#454545;
}
.add_another a span{
    width:24px;
    height:24px;
    border:2px solid #818181;
    border-radius:50%;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color:#818181;
    font-size:15px;
    display: flex;
    margin:0 8px 0 0;
}



/*------------------- SETTING PAGE END --------------------*/

/*----------------- Sign Up v2 End--------------------- */
.red_opegbg.signin_v2{
    background:url(../images/signup_v2.jpg) no-repeat top center;
    background-size:cover;
}
.signin_v2 .red_toparea{
    background:none;
    padding: 20px 0;
}
.signin_v2  .toptitle_area{
    margin:0;
}
.signin_v2 .toptitle_area h2{
    color:#303030;
}
span.icon_logintitle{
    width:70px;
    display:flex;
    align-content: center;
    justify-content: space-between;
    font-size:30px;
    color:#303030;
}
span.icon_logintitle a{
    font-size:30px;
    color:#303030;
    text-decoration: none;
}
.openhouse_signinimg{
    padding: 0;
    margin:0;
    text-align: center;
}
.openhouse_signinimg img{
    max-height:30vh;
}
.signupv2_content{
    height:calc(100vh - 103px);
    overflow-x: hidden;
    overflow-y: auto;
}
.oener_secirity{
    padding: 10px 15px;
    margin:0 0 10px 0;
    background:#fff;
    border-radius:10px;
    box-shadow: 3px 0 7px rgba(15, 41, 0, 0.15);
}
.oener_secirity h3, .signin_content h3.owner_security{
    padding: 0;
    margin:0;
    font: 600 22px/normal 'Roboto', sans-serif;
    text-decoration: none;
    text-align: center;
    color:#cc232a;
}
.oener_secirity h4{
    padding: 0;
    margin:0;
    font: 600 22px/normal 'Roboto', sans-serif;
    text-decoration: none;
    text-align: center;
    color:#4e4e4e;
}

.signupv2_content p{
    font: 300 18px/normal 'Roboto', sans-serif;
    text-decoration: none;
    color:#303030;
    text-align: center;
}
.sign_upbtn.signupv2_btn span{
    border-right: 1px solid #db3752;
    position: absolute;
    left: 0;
    top: 9px;
    width: 60px;
    text-align: center;
    margin-right: 10px;
}
.sign_upbtn.signupv2_btn span img{
    width:30px;
}
.sign_upbtn.signupv2_btn{
    position: relative;
    padding-left: 70px;
}
/*----------------- Sign Up v2 End--------------------- */

.red_opegbg.loginpage{
    background:url(../images/sign_in.jpg) no-repeat top center;
    background-size: cover;
}
.loginpage .red_toparea{
    background:none;
    padding: 20px 0;
}
.loginpage .toptitle_area h2{
    justify-content: flex-start;
    color:#303030;
}
.loginpage .toptitle_area h2 .fa{
    font-size:28px;
    padding-right: 10px;
}
.loginpage  .toptitle_area{
    margin:0;
}
.signin_content{
    height:calc(100vh - 69px);
    overflow-y: auto;
    overflow-x: hidden;
}
.signin_content label{ 
    padding: 0;
    margin:0;
    font: 300 20px/normal 'Roboto', sans-serif;
    text-decoration: none;
    color:#444;
}
.signin_content .form-control{
    font-style: italic;
    border-bottom:1px solid #c9c9c9;
    color:#8b8b8b;
    font-size:15px;
}
.signin_content p{
    font: 300 18px/normal 'Roboto', sans-serif;
    text-decoration: none;
    color:#303030;
    text-align: center;
    padding: 10px 0;
    margin:0;
    border-bottom:1px solid #c9c9c9;
}
.signin_content p:last-child{
    border:0;
}
.switch_txt{
    padding: 0;
    margin:0 15px 0 0;
    font: 300 20px/normal 'Roboto', sans-serif;
    text-decoration: none;
    color:#444;
    max-width:calc(100% - 160px);
}

.switch {
    position: relative;
    display: inline-block;
    width: 160px;
    height: 50px;
}
.switch input {display:none;}
  
.slider {
    position: absolute;
    cursor: pointer;
    overflow: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f2f2f2;
    -webkit-transition: .4s;
    transition: .4s;
    border:1px solid #cfcfcf;
}
  
.slider:before {
    position: absolute;
    z-index: 2;
    content: "";
    height: 46px;
    width: 46px;
    left: 1px;
    bottom: 1px;
    background-color: #f2f2f2;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
    -webkit-transition: .4s;
    transition: all 0.4s ease-in-out;
}
.slider:after {
    position: absolute;
    left: 0;
    z-index: 1;
    content: "YES";
    font-size:20px;
    text-align: left !important;
    line-height:50px;
    padding-left: 0;
    width: 160px;
    color: #2fc72d;
    height: 50px;
    border-radius: 100px;
    background-color: #fff;
    -webkit-transform: translateX(-110px);
    -ms-transform: translateX(-110px);
    transform: translateX(-110px);
    transition: all 0.4s ease-in-out;
}
  
input:checked + .slider:after {
    -webkit-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
    /*width: 235px;*/
    padding-left: 25px;
}
  
input:checked + .slider:before {
    background-color: #fff;
}
  
input:checked + .slider:before {
    -webkit-transform: translateX(109px);
    -ms-transform: translateX(109px);
    transform: translateX(109px);
}
  
  /* Rounded sliders */
.slider.round {
    border-radius: 100px;
}
  
.slider.round:before {
    border-radius: 100px;
}
.absolute-no {
    position: absolute;
    left: 0;
    color: #cc232a;
    text-align: right !important;
    font-size:20px;
    width: calc(100% - 25px);
    height:50px;
    line-height: 50px;
    cursor: pointer;
}

.bottom_fixedbar{
    background: #cc232a;
    width:100%;
    height:26px;
    text-align: center;
    font: 400 12px/normal 'Roboto', sans-serif;
    text-decoration: none;
    color:#fff;
    position: fixed;
    left:0;
    bottom:0;
    display: flex;
    align-items: center;
    justify-content: center;

}







@media(max-width:767px){
    
    a.already_register{
        display: block;
        width: 100%;
        float: none;
        text-align: center;
    }
    .loanofficer_page .topfixedbar{
        padding: 10px 15px;
    }
    .topfixedbar .loanofficerlogo img{
        max-height:80px;
    }

    .red_opegbg.relator_code .splashlogo{
        max-width:250px;
    }
    .relator_code .input-group-text img{
        max-width:30px;
    }
    .relator_code .form-control{
        font-size: 18px;
    }
    .toptitle_area h2{
        font-size: 24px;

    }
.toptitle_area h2 a.question_icon{
    font-size: 22px;
}
.select_relatorlist ul li a h3, .select_relatorlist ul li a span{
    font-size: 24px;
}
.select_relatorlist ul li a{
    padding: 5px 15px;
}
.add_emailpart ul li{
    width:100%;
    padding: 7px 10px;
}
.mob_center{
    text-align: center;
}

.switch_txt{
    max-width:100%;
    width:100%;
    padding-bottom: 10px;
}



}



@media(max-width:360px){


    a.login_typebtn{
        font-size:16px;
        line-height: 28px;
    }
    a.login_typebtn span{
        width:40px;
    }




}