/*****Common Styles*****/
body{
    font-family: 'Roboto', sans-serif;
    font-size:14px;
    color:#000000;
    font-weight:400;
    background: #f9f9f9;
    overflow-y: hidden;
   }
   
   h1{
       font-family: 'Roboto', sans-serif;
       font-size: 48px;
       margin-bottom: 15px;
       font-weight: 700;
   }
   h2{
       font-family: 'Roboto', sans-serif;
       font-size: 35px;
       margin-bottom: 30px;
       font-weight: 500;
   }
   
 
   
   h4{
       font-family: 'Roboto', sans-serif;
       font-size: 22px;
       margin-bottom: 30px;
       font-weight: 500;
   }
   h5{
       font-family: 'Roboto', sans-serif;
       font-size: 16px;
       margin-bottom: 30px;
       font-weight: 500;
   }
   h6{
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    margin-bottom: 30px;
    font-weight: 500;
}
   a{
       text-decoration: none;
       -webkit-transition: all .25s ease-in;
       -moz-transition: all .25s ease-in;
       -o-transition: all .25s ease-in;
       transition: all .25s ease-in;
   }
   a:hover{
       text-decoration: none;
       cursor: pointer;
   }
   p{
       margin: 0 0 10px 0;
       font-size: 12px;
   }
   
   .container{
       max-width: 1369px;
       width:100%;
   }
   


/******************************************************Login Start CSS*******************************************************/

.login_main_div{
    width: 100%;
}

.login_first_section{
    width: 100%;
    background-color: #f9f9f9;
   
height: 683px
}


.login_center_contends_div{
    width: 90%;
    margin: auto;
    display: block;
    text-align: center;
    padding: 130px 30px
}

.login_center_contends_div h1{
font-size: 30px;
color: #2d2d2d;
}

.login_center_contends_div p{
    font-size: 14px;
    color: #a5a5a5;
    padding-bottom: 13px;
    margin: 0px;
}

.login_input_section{
    width: 100%;
    text-align: start;
}

.forgot_password{
    color: #4c8cff;
    font-size: 14px;
    text-decoration: underline;
}

.passwords_text{
    color: #4c8cff;
    font-size: 14px;
    text-decoration: underline;
    padding-top: 30px;   
}

.forgot_password:hover{
    color: #4c8cff;
    text-decoration: underline;
}




.container form {
    color: #888888;
    text-align: left;
  }
  
  .container label {
    display: none;
  }
  
  .container input,
  .container textarea {
    /* to create space for placing icon*/
    padding-left: 32px;
    border-color: transparent;
    background-color: #ededed;
    border-radius: 4px;
    padding: 20px 42px;
    font-size: 14px;
    color: #a5a5a5;
    font-weight: 300;
  }


  
  /*position should be relative and z-index greater than one*/
  .container .icon {
    position: relative;
    float: left;
    margin-left: 8px;
    margin-top: -24px;
    z-index: 2;
    color: #222222;
  }
  
  .container .icon-textarea {
    float: left;
    margin-left: 8px;
    margin-top: -104px;
    position: relative;
    z-index: 2;
    color: #222222;
  }

  .email_imgs{
    position: relative;
    top: -32px;
    left: 8px;
  }

  .form-control {
    background-color: #ededed!important;
    border: none!important;
    box-shadow: none!important;
}

.form-group {
    margin-bottom: 0px !important;
}

.login_btn{
    background: #ff9600;
    font-size: 16px;
    color: #f9f9f9;
    padding: 7px 30px;
    width: 100%;
}
.login_btn:hover{
    color: #f9f9f9;
}
/******************************************************Login Close CSS*******************************************************/



/******************************************************Login_Second_Div Start CSS*******************************************************/
.login_section_section {
    width: 100%;
/*   // background-image: url(#);*/
    background-size: cover;
    background-repeat: no-repeat;
    padding: 120px 0px 254px 0px;
    background-position: center;
}
.login_right_center_div{
    width: 80%;
    margin: auto;
    display: block;
}

.login_right_center_div h1{
    color: #ffffff;
    font-size: 40px;
}

.login_right_center_div p{
    font-size: 14px;
    color: #ffffff;
    margin-bottom: 25px;
}

.read_more_bg{
    color: #ffffff;
    background-color: #ff9600;
    padding: 10px 25px;
    border-radius: 2px;
    font-weight: 500;
    font-size: 16px;
}

.read_more_bg:hover{
    color: #ffffff;
}


  

.btns_divs{
    width: 100%;
    display: flex;
   justify-content: flex-start;
   align-items: flex-start;
}

.login_11_div{
    width: 65%;
    margin-right: 48px;
}
.forgot_pp{
    width: 48%;
    margin-top: 10px;
}



    .or {
        font-size: 12px!important;
        color: #a5a5a5!important;
        position: relative;
        top: -16px;
        left: -14px;
        right: 0px;
    }

.gray_section_broders{
    margin-top: 30px;
}


.all_icons_sections_divs{
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}

.icons_div1fb{
    background-color: #ffffff;
    margin: 14px;
    border-radius: 4px;
    width: 113px;
    height: 30px;
    box-shadow: 0px 0px 3px rgb(128 128 128 / 25%);
    cursor: pointer;
}
/******************************************************Login_Second_Div Close CSS*******************************************************/



/******************************************************RESPONSIVE CSS*******************************************************/

/*

 * Table of Contents:

 * 	   - Media Queries

 *   0 - media screen and (max-width: 1170px)

 *   1 - media screen and (max-width: 1152px) 

 *   2 - media screen and (max-width: 1024px)

 *   3 - media screen and (max-width: 992px)

 *   4 - media screen and (max-width: 800px)

 *   5 - media screen and (max-width: 768px)

 *   6 - media screen and (max-width: 728px)

 *   7 - media screen and (max-width: 640px)

 *   8 - media screen and (max-width: 500px)

 *   9 - media screen and (max-width: 480px)

 *  10 - media screen and (max-width: 414px)

 *  11 - media screen and (max-width: 375px)

 *  12 - media screen and (max-width: 360px)

 *  13 - media screen and (max-width: 320px)

---------------------------------------------------------------------- */


@media screen and (max-width:1323px){
    body{
        overflow-y:inherit}
}



@media screen and (max-width:1178px){
    .container{
        padding:0px 15px;
    }
    
    .login_11_div {
        width: 100%;
        margin-right: 0px;
}
.all_icons_sections_divs {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;

}
.icons_div1fb {
    width: 87px;
}
.or {
    left: 2px;
}
}
@media screen and (max-width:1152px){

}

@media screen and (max-width:1024px){

}
@media screen and (max-width:992px){

}


@media screen and (max-width:970px){
}

@media screen and (max-width:940px){
    .icons_div1fb {
        width: 86px!important;
}

}

@media screen and (max-width:942px){
    .icons_div1fb {
        width: 81px!important;
}

}

@media screen and (max-width:1200px){
    .btns_divs {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;

}
.login_11_div {
    width: 100%;
    margin-right: 0px;
}
.forgot_pp {
    width: 100%;
    margin-top: 10px;
}
}

@media screen and (max-width:768px){
    .login_11_div {
        width: 100%;
        margin-right: 0px;
    }
    .or {
        top: -15px;
        left: 2px;
        right: 0px

}
.img-fluid {
    width: 613px;
   /* height: 10px;*/
}
.icons_div1fb {
    padding: 5px 13px 4px 16px;
}
}

@media screen and (max-width:800px){
    .login_11_div {
        width: 100%;
        margin-right: 0px;
    }
    .icons_div1fb {
        padding: 5px 13px 4px 16px;
    }
    .icons_div1fb {
        width: 86px!important;
}
    .login_first_section {
        height: 753px;
}
}


@media screen and (max-width:896px){
    .icons_div1fb {
        width: 79px!important;
}
}

@media screen and (max-width:960px){
    .icons_div1fb {
        width: 88px;
}
}

@media screen and (max-width:776px){
    .icons_div1fb {
        width: 61px!important;
}
}


@media screen and (max-width:900px){
    .icons_div1fb {
        width: 79px!important;
}

}

@media screen and (max-width:882px){
    .icons_div1fb {
        width: 68px!important;
}
}

@media screen and (max-width:906px){
    .icons_div1fb {
        width: 100%!important;
}
}

@media screen and (max-width:850px){

    .icons_div1fb {
        padding: 5px 13px 4px 16px;
    }
}
@media screen and (max-width:640px){
}
@media screen and (max-width:500px){  
}

@media screen and (max-width:480px){
    
}
@media screen and (max-width:414px){
}
@media screen and (max-width:360px){
    
}

@media screen and (max-width:944px){
    .icons_div1fb {
        width: 86px;
}
}

@media screen and (max-width:214px){
    .login_right_center_div h1 {
        font-size: 30px;
}
}


@media screen and (max-width:926px){
    .icons_div1fb {
        width: 100%!important;
    } 
    .login_first_section {
        height: 730px;
}
}

@media screen and (max-width:962px){
    .icons_div1fb {
        width: 100%!important;
    } 
    .login_first_section {
        height: 730px;
}
}

@media screen and (max-width:1294px){
    .or {
        left: -6px;
}
}
@media screen and (max-width:1260px){
    .or {
        left: -4px;
}
}

@media screen and (max-width:1234px){
    .or {
        left: 2px;
}
}

@media screen and (max-width:894px){
    .icons_div1fb {
        width: 100%!important;
    } 
    .login_first_section {
        height: 732px;
}
}

@media screen and (max-width:880px){
    .icons_div1fb {
        width: 100%!important;
    } 
    .login_first_section {
        height: 753px;
}
}

@media screen and (max-width:220px){
    .login_right_center_div h1 {
        font-size: 33px;
}
}

@media screen and (max-width:764px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 655px;
}
}

@media screen and (max-width:700px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 655px;
}
}


@media screen and (max-width:588px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 800px!important;
}
}


@media screen and (max-width:418px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 820px;
}
}


@media screen and (max-width:312px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 900px;
}
}

@media screen and (max-width:320px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 1500px!important;
}
}


@media screen and (max-width:766px){
    .brack_point_right{
    position: relative;
    top: 0px;
    display: none
}
.brack_point_left{
    position: relative;
    top: 600px;
}
}




@media screen and (max-width:594px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: -103px!important;
}
}

@media screen and (max-width:408px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 793px!important;
}
}

@media screen and (max-width:420px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 793px!important;
}
}

@media screen and (max-width:300px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 895px!important;
}
}

@media screen and (max-width:422px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 790px!important;
}
}


@media screen and (max-width:436px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 750px!important;
}
}


@media screen and (max-width:438px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: -102px!important;
}
}

@media screen and (max-width:422px){

.brack_point_left{
    position: relative;  
    top: -105px!important;
}
}

@media screen and (max-width:400px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: -100px!important;
}
}

@media screen and (max-width:368px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: -98px!important;
}
}


@media screen and (max-width:298px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 870px!important;
}
}

@media screen and (max-width:258px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 950px!important;
}
}

@media screen and (max-width:302px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 870px!important;
}
}

@media screen and (max-width:314px){
    .brack_point_right{
       position: relative;
       top: -756px;
}
.brack_point_left{
    position: relative;
    top: 505px!important;
}
}

@media screen and (max-width:758px){
    .login_section_section {
        padding: 50px 0px 100px 0px;
}
.brack_point_left {
    position: relative;
    top: -102px;
}
}

@media screen and (max-width:320px){
.brack_point_left {
    top: -98px!important;
}
}