@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap');







:root{



    --dark-orange:#ffba00;



    --color-grey:#999999;



    --color-white:#fff;



    --color-dark:#333333;



    --light-grey:#d6d6d694;



}







*{



    margin: 0;



    padding: 0;



    box-sizing: border-box; 



}







html{



    scroll-behavior: smooth;



}



body{



    font-family: 'Roboto', sans-serif;



}



   /* 123 */

.error{

    color: red !important;

  }

  input:focus {

    outline: none !important; /* Remove the default focus outline */

    border-color: #ced4da !important; /* Set the border color to a neutral color */

}





a{



    text-decoration: none;



}



  



li{



    list-style: none;



}







.global-btn{



    border: 1px solid transparent;



    border-radius: 5px;



    background-color: var(--dark-orange);



    padding: 0.7rem 2.2rem;



    color: var(--color-white);



    font-size: 15px;



    font-weight: medium;



}







.transparent-btn{



    border: 1px solid var(--light-grey);



    border-radius: 5px;



    background-color: var(--color-white);



    padding: 0.7rem 1.8rem;



    color: var(--color-dark);



    font-size: 15px;



    font-weight: bold;



}



.shadow-btn{



    border: 1px solid transparent;



    display: inline-block;



    border-radius: 5px;



    background-color: var(--color-white);



    padding: 0.9rem 1.8rem;



    color: var(--color-dark);



    font-size: 15px;



    font-weight: bold;



    box-shadow: 0px 0px 20px 4px #00000012;



}











/* PAGE 1 CSS START */







.signup-form{



    height: 100vh;



    display: flex;



    align-items: center;



}







.signup-content{



    border: 1px solid transparent;



    box-shadow: 0px 0px 20px 6px #00000012;



    padding: 2.5rem 3.9rem;



}







 form p{



   color: var(--color-grey);



   font-size: 14px;



   font-weight: medium;



   



}



form .or-opt{



   position: relative;



   text-align: center;



   margin-top: 2rem;



}



.opt{



   position: relative;



   padding: 0 5px;



   z-index: 1;



}



form .or-opt::before{



   content: " ";



   display: block;



   height: 1px;



   width: 45%;



   position: absolute;



   top: 47%;



   right: 7px;



   background: var(--light-grey);



}



form .or-opt::after{



   content: " ";



   display: block;



   height: 1px;



   width: 45%;



   position: absolute;



   left: 4px;



   top: 47%;



   background: var(--light-grey);



}



.banner .container .pop-items::before {



   content: " ";



   display: block;



   height: 2px;



   width: 100px;



   position: absolute;



   top: 10%;



   left: -7rem;



   background: var(--bg-white);



}



form .google-sign-btn{



   width: 100%;



   padding: 10px 5px 10px 5px;



   border: 1px solid var(--light-grey);



   font-weight: 700;



   border-radius: 6px;



   display: block;



   text-align: center;



   color: var(--color-dark);



}



 



.text-field {



   position: relative;



   margin: 20px 2.5px 30px 2.5px;



}







input {



    display: block;



    width: 100%;



    padding: 16px 5px 16px 5px;



    border: 1px solid  var(--light-grey);



    font-weight: 600;



    background-color:var(--color-white);



    border-radius: 6px;



}







label {



    color: var(--color-grey);



    position: absolute;



    pointer-events: none;



    left: 17px;



    top: 17px;



    font-weight: 100;



    font-size: 16px;



    transition: 0.2s;



}







input:focus ~ label, input:valid ~ label, input:-webkit-autofill ~ label  {



   top: -10px;



   left: 15px;



   font-size: small;



   font-weight: 400;



   background-color:var(--color-white);



   padding:0 5px 0 5px;



   color: var(--color-dark);



}







form .primary-btn{



    display: block;



    width: 100%;



    padding: 15px 5px 15px 5px;



    border: 2px solid transparent;



    font-weight: 500;



    background-color:var(--dark-orange);



    color: var(--color-white);



    border-radius: 6px;



    margin-bottom: 1rem;  



}







.bottom-text{



    margin-top: 1rem;



    text-align: center;



}







.bottom-text p{



    color: var(--color-grey);



    font-weight: medium;



}







/* PAGE 1 CSS END  */











/* PAGE 4 CSS START  */







.dashboard-wrap .navbar .collapse .dropdown-menu{



    padding: 0 !important;



}







.dashboard-wrap .navbar .collapse .dropdown-item{



    font-size: 14px; 



    border-bottom: 1px solid var(--light-grey);



    padding: 10px;



}



.dropdown-menu{



    padding: 0;



}



.dropdown-item{



    font-size: 14px;



    border-bottom: 1px solid var(--light-grey);



    right: 100px;



}







.dashboard-wrap .navbar .collapse .dropdown-item:focus, .dropdown-item:hover {



    color: #25233C;



    background-color:#FEF7E6;



    font-size: 14px;



}







.dashboard-wrap .my-project{



    background: #FFFFFF 0% 0% no-repeat padding-box;



    box-shadow: 0px 0px 20px 2px #00000012;



    margin: 35px 70px;



    border-radius: 10px;



}



.dashboard-wrap .my-project .project-1{



    box-shadow: 0px 0px 20px #00000012;



    border-radius: 5px;



    padding: 40px;



    border-bottom: 4px solid #4078DD ;



}



.dashboard-wrap .my-project .project-2{



    box-shadow: 0px 0px 20px #00000012;



    border-radius: 5px;



    padding: 40px;



    border-bottom: 4px solid #FF0000;



}



.dashboard-wrap .my-project .project-3{



    box-shadow: 0px 0px 20px #00000012;



    border-radius: 5px;



    padding: 40px;



    border-bottom: 4px solid #008000;



}



.dashboard-wrap .my-project .project-4{



    box-shadow: 0px 0px 20px #00000012;



    border-radius: 5px;



    padding: 40px;



    border-bottom: 4px solid #FCB918;



}



.dashboard-wrap .my-project .project-5{



    box-shadow: 0px 0px 20px #00000012;



    border-radius: 5px;



    padding: 40px;



    border-bottom: 4px solid #4078DD;



}



.dashboard-wrap .my-project .project-6{



    box-shadow: 0px 0px 20px #00000012;



    border-radius: 5px;



    padding: 70px;



    border-bottom: 4px solid #E09C26;



}



.dashboard-wrap .my-project .project-6{



    background-color: #FEF7E6;



}



.dashboard-wrap .my-project .project-6 .add-project i{



     border: 1px solid ;



     border-radius: 100%;



     padding: 16px;



     color: var(--color-white);



     background-color: var(--dark-orange);



}



.dashboard-wrap .my-project .d-flex .dropdown-toggle::after{



    display: none;



}  







.dots::before{



    font-family: "FontAwesome";



    content: "\f142";



    position: absolute;



    left: 31px;



    font-size: 28px;



    margin: -44px 0px;



    color: var(--color-grey);



}







.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {



    border-color: var(--color-white) !important;



}







/* PAGE 4 CSS END   */











/* PAGE 23 CSS START  */







.signup-form .signup-content .reset-pass{



    font-size: 30px;



    color: var(--color-dark);



    text-align: center;



}







.signup-form .signup-content .reset-succ{



    color: #666666;



    text-align: center;



    font-size: 16px;



    display: flex;



    align-items: center;



    justify-content: center;



}







/* PAGE 23 CSS END  */























/* MEDIA QUERY START  */







@media (min-width: 362px) and (max-width:768px) {



    



    .my-project .row{



        padding: 5px !important;



    }



    .dashboard-wrap .my-project .project-1 {



        box-shadow: 0px 0px 20px #00000012;



        border-radius: 5px;



        padding: 10px;



        border-bottom: 4px solid #4078DD;



    }



    .dashboard-wrap .my-project {



        background: #FFFFFF 0% 0% no-repeat padding-box;



        box-shadow: 0px 0px 20px 2px #00000012;



        margin: 10px 10px !important; 



        border-radius: 10px;



    } 



    .dashboard-wrap .my-project .project-2 span{



         flex-wrap: nowrap !important;



    }



  }







@media (min-width: 280px) and (max-width:480px){







    .update-section{



        margin: 0 2px 0 2px !important;



    }



    .signup-content {



        border: 1px solid transparent;



        box-shadow: 0px 0px 20px 6px #00000012;



        padding: 1.1rem 1.3rem;



    }



    .bottom-text {



        margin-top: 0.6rem;



        text-align: center;



    }



    .text-field {



        position: relative;



        margin: 10px 2.5px 20px 2.5px;



    }



  }







/* MEDIA QUERY END  */

/* 
New=====css=========start=====for==========responsive=============page==07.07.24==== */

.update-section .text-field i{
    position: absolute;
    top: 38%;
    transform: translateX(-38%);
    right: 20px;
}

.update-section .text-field{
    margin: 30px 0px !important;
}

.text-field input{
    padding-left: 20px;
    
}

.update-section .global-btn{
    margin: 30px 0;
}

.form-control:focus{
    border-color: unset;
    outline: 0;
    box-shadow: unset;
}

.main_sec .table_section .btn_section{
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.home-section .row.main_sec .table-responsive-sm{
    margin: 0 20px;
}
  
.navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;
    right: 0 !important;
    left: -8px;
}

.my-project .project-1  .project-bottom{
    gap: 15px;
    margin-top: 15px;
}

.dashboard-wrap .my-project .project-1, .dashboard-wrap .my-project .project-6{
    height: 300px !important;
    margin: 0 !important;
}

.dashboard-wrap .my-project .project-1 .global-btn{
    margin-top: 0 !important;
}

/* .main-section #project1 .offset-lg-1{
    margin-left: 0% !important;
} */

#project1 .process_bar_section.overall .btn_download{
    margin: 10px 0 10px 0 !important;
}

#update_profile_details_form .text-field label{
    top: -10px;
    left: 15px;
    font-size: small;
    font-weight: 400;
    background-color: var(--color-white);
    padding: 0 5px 0 5px;
    color: var(--color-dark);
}



@media (min-width:320px) and (max-width:767px){
  .my-project.body-1 .Update h2{
    text-align: center !important;
  }
  .navbar-nav .dropdown-menu{
    right: 0;
  }
  .dropdown-menu[data-bs-popper]{
    left: 0;
  }
  h1.fs-5.fw-bold.mb-0{
    display: none;
  }
  .navbar-nav .nav-item .nav-link .rounded-circle{
    width: 40px;
    height: 40px;
  }

  .update-section .global-btn{
    margin:0 0 30px 0;
}

.dashboard-wrap .my-project{
    padding: 0 20px;
}

.home-section .row.main_sec .table-responsive-sm{
    white-space: normal;
    overflow-x: auto;
    
}

.home-section .main_sec{
    margin: 0px !important;
}


.dash-bottom.bannerquote .bottom_right{
    display: block !important;
}

.my-project.body-1 .Update h2.fs-5.fw-bold{
    left: 0 !important;
}

.dashboard-wrap .my-project .project-inner .fs-4.fw-bold{
    text-align: center !important;
}




}


@media (min-width:320px) and (max-width:534px){
   .navbar-brand img.pe-5{
    padding-right: 10px !important;
   }

   .dashboard-wrap .navbar .container-fluid{
    flex-wrap: nowrap !important;
   }

   .my-project .project-inner{
    flex-direction: column;
    text-align: center;
   }
   .my-project .project-inner h2.fs-5.fw-bold{
    left: 0;
   }

   .my-project .card-body.border-start{
    border: 0 !important;
    padding: 15px !important;
   }

   .my-project.body-1 .card-body.border-start{
    padding: 0px !important;
   }

   .update-section .global-btn{
   width: 100% !important;
}

.my-project.body-1 .card-body.border-start .text-field{
    margin: 1rem 0 !important;
}
}


@media (min-width:320px) and (max-width:991px){


.home-section .row.main_sec .table-responsive-sm .table.main_table .progress{
    max-width: 200px;
    width: 100%;
}

.main_table{
    width: 1200px !important;
}
.home-section nav{
    width: 100% !important;
}
.space .left-chart-sec .chart_f1.bar{
    margin-left: 15px !important;
}
   
.space.desktop .fs-5.fw-bold.mt-2.pl-1.overview{
   padding-left: 0px !important;
}
  
 .dash-bottom.bannerquote .col-lg-4.bottom_right{
    width: 100% !important;
}

.navbar.desktop .dashboard, .navbar.desktop .navbar-toggler{
    display: none !important;
}

.navbar.desktop .container-fluid{
    flex-wrap: nowrap !important;
}

.navbar.desktop .container-fluid #navbarSupportedContent{
    display: flex !important;
}

.space.moblie .mobdownload .shadow-btn{
    margin-left: 0px !important;
}

.overview-container{
    display: flex;
    width: 100%;
    overflow: auto;
    flex-wrap: wrap;
}

#project1 .col-lg-8.offset-lg-1{
    margin: 20px auto !important;
}


.overview-sec .top_bar {
    display: flex;
    align-items: center;
}

.overview-sec .top_bar .global-btn{
    height: auto !important;
    width: auto !important;
    margin-bottom: 0 !important;
}

.overview-sec .top_bar h2.fs-5.fw-bold{
    left: 0 !important;
}

.overview-sec .top_bar .add-project{
    margin-left: auto !important;
}

}
    


@media (min-width:768px) and (max-width:991px){

.home-section .row.main_sec .table-responsive-sm{
    /* width: 100%; */
    overflow-x: auto;
    /* white-space: nowrap; */
}



}

@media (min-width:320px) and (max-width:540px){

    .main_sec .table_section .btn_section .check_result, .main_sec .table_section .btn_section button.see_more{
      width: 100%;
    }

    .dashboard-wrap .my-project .project-1 .project-bottom .global-btn, .dashboard-wrap .my-project .project-1 .project-bottom .transparent-btn{
        width: 100% !important;
        text-align: center;
    } 

    .dashboard-wrap .my-project .project-6{
        margin-top: 30px !important;
    }
    .my-project .project-inner a.global-btn.add-btn{
        width: 100%;
        left: 0 !important;
    }

    .space.moblie .global-btn{
        width: unset;
    }

    .navbar.moblie .container-fluid{
        flex-wrap: nowrap !important;
    }

    .navbar.moblie .container-fluid .navbar-brand img{
        height: 34px;
    }

    .navbar.moblie .container-fluid #navbarSupportedContent a.text-warning{
        display: none;
    }
    .space.moblie h2.fs-5.fw-bold{
        left: 0 !important;
    }

     .dash-bottom.bannerquote a.dash-bottom-button.blink_me{
        font-size: 16px !important;
    }

    .captaing-logo{
        justify-content: center !important;
    }
    
     
    }

    

    @media(max-width:575px){

        .space .left-chart-sec .chart_f1.bar{
            margin-left: 0px !important;
        }

        .overview-sec .top_bar .add-project{
            padding: 12px 8px !important;
        }
        
        }


        @media (min-width:992px) and (max-width:1024px){
            .dash-bottom.bannerquote .bottom_right, .dash-bottom.bannerquote .bottom_left{
                padding: 30px;
                width: 100% !important;
                background-position: right !important;
                display: flex;
                 align-items: center;
            }

            .space .left-chart-sec .chart_f1{
                margin-bottom: 20px;
            }
        }