/*--------------------------------------------------------------------------------------*/
/*General-Css-Here
/*--------------------------------------------------------------------------------------*/

:root {
  --black:#000;
  --white:#fff;
  --primary:#207FA1;  
  --light-blue:#EBF3F6;
  --p:#5E5E60;
  --heading:#161515;
  --border:#E3E3E3;  
  --gray:#9A9AA5;
  --light-gray:#FAFAFA;
  --regular:'FontspringDEMOceraproregular';
  --medium:'FontspringDEMOcerapromedium';
  --bold:'FontspringDEMOceraprobold';
  --black-f:'FontspringDEMOceraproblack';
  --light:'FontspringDEMOceraprolight';
}

*{margin: 0; padding: 0; box-sizing: border-box;} 
body,html{font-size: 16px; color:var(--black); font-family: "Poppins", sans-serif; font-weight: 400; font-style: normal; box-sizing: border-box;}
html{scroll-padding-top: 10rem;}

a{text-decoration: none; transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -ms-transition-duration: 0.5s; -o-transition-duration: 0.5s; color:var(--sky-blue);}
button{transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -ms-transition-duration: 0.5s; -o-transition-duration: 0.5s;}
ul{margin: 0; padding: 0; list-style: none;}
img{max-width: 100%;}
.paddTop0{padding-top: 0 !important;}
.btn-group-box .btn{margin-right: 15px;}
.btn-group-box .btn:last-child{margin-right: 0;}
.section-padding{padding:100px 0px;}
.white{color: var(--white);}
.btn{height: 44px; line-height: 42px; padding:0px 25px; font-size: 15px; font-weight: 500; border: none; border-radius:4px; font-weight: 500; background:var(--primary); color: var(--white); display: flex; align-items: center; justify-content: center;}
.btn:hover{background: var(--black); color: var(--white);}
.btn i{font-size: 24px; margin-right: 5px;}
.border-btn{background:var(--white); height: 44px; line-height: 42px; padding:0px 25px; font-size: 15px; color: var(--primary); font-weight: 500; border: solid 1px; border-color:var(--primary); border-radius: 6px; display: inline-block; text-align: center;}
.gray-border-btn{background:var(--white); height: 48px; line-height: 46px; padding:0px 25px; font-size: 18px; color: var(--black); font-weight: 600; border: solid 1px; border-color:var(--border); border-radius: 12px; display: inline-block; text-align: center;}
.yellow-border-btn{background:transparent; height: 42px; line-height: 41px; padding:0px 15px; font-size: 15px; color: var(--yellow); font-weight: 600; border: solid 1px; border-color:var(--yellow); border-radius: 5px; display: inline-block; text-align: center;}
.gray-border-btn.active{background:var(--green); border-color: var(--green); color: var(--white);}

h1 { font-size:34px; }
h2 { font-size:28px }
h3 { font-size:26px; }
h4 { font-size:24px; }
h5 { font-size:20px; }
h6 { font-size:18px; }

p{color: var(--p); font-size: 16px; line-height: 28px;}

.transform-scale-07{transform: scale(0.7);}
.transform-scale-08{transform: scale(0.8);}
.transform-scale-09{transform: scale(0.9);}
.transform-scale-1{transform: scale(1);}
.transform-scale-1-1{transform: scale(1.1);}
.transform-scale-1-2{transform: scale(1.2);}
.transform-scale-1-3{transform: scale(1.3);}
.transform-scale-1-4{transform: scale(1.4);}
.transform-scale-1-5{transform: scale(1.5);}
.mr-bot0{margin-bottom: 0 !important;}
.border0{border: none !important;}
.padd-left-35{padding-left: 35px;}
.mar-top50{margin-top: 50px;}
.mar-bot50{margin-bottom: 50px;}
.mar-top80{margin-top: 80px;}
.mar-left-right50{margin-left: 50px; margin-right:50px;}
.mar-left-right80{margin-left: 80px; margin-right:80px;}
.mar-top-bottom50{margin-top: 50px; margin-bottom:50px;}
.mar-top-bottom30{margin-top: 30px; margin-bottom:30px;}
.padd-top-bottom50{padding-top: 50px; padding-bottom:50px;}
.mr-left-right45{margin-left: 45px; margin-right: 45px;}
.padd0{padding: 0 !important;}
.mr0{margin: 0 !important;}
.padd-top89{padding-top: 89px !important;}
hr{margin: 25px 0px;}
.padd20{padding: 20px;}
.padd30{padding: 30px;}
.padd-bot0{padding-bottom: 0;}
.ml-50{margin-left: 50px}
.table tr td{vertical-align: middle;}
.white-bg{background:var(--white); border: 1px solid var(--border); border-radius: 30px;}
.light-bg{background: var(--white) !important;}
.marTop40{margin-top: 40px;}
.form-check-input:checked{background-color: var(--primary); border-color: var(--primary);}
.site-bg{padding-top: 88px;}


/* @font-face {
  font-family: 'FontspringDEMOceraproregular';
  src: url('../fonts/FontspringDEMOceraproregular.eot');
  src: url('../fonts/FontspringDEMOceraproregular.eot') format('embedded-opentype'),
       url('../fonts/FontspringDEMOceraproregular.woff2') format('woff2'),
       url('../fonts/FontspringDEMOceraproregular.woff') format('woff'),
       url('../fonts/FontspringDEMOceraproregular.ttf') format('truetype'),
       url('../fonts/FontspringDEMOceraproregular.svg#FontspringDEMOceraproregular') format('svg');
}

@font-face {
  font-family: 'FontspringDEMOcerapromedium';
  src: url('../fonts/FontspringDEMOcerapromedium.eot');
  src: url('../fonts/FontspringDEMOcerapromedium.eot') format('embedded-opentype'),
       url('../fonts/FontspringDEMOcerapromedium.woff2') format('woff2'),
       url('../fonts/FontspringDEMOcerapromedium.woff') format('woff'),
       url('../fonts/FontspringDEMOcerapromedium.ttf') format('truetype'),
       url('../fonts/FontspringDEMOcerapromedium.svg#FontspringDEMOcerapromedium') format('svg');
}

@font-face {
  font-family: 'FontspringDEMOceraprobold';
  src: url('../fonts/FontspringDEMOceraprobold.eot');
  src: url('../fonts/FontspringDEMOceraprobold.eot') format('embedded-opentype'),
       url('../fonts/FontspringDEMOceraprobold.woff2') format('woff2'),
       url('../fonts/FontspringDEMOceraprobold.woff') format('woff'),
       url('../fonts/FontspringDEMOceraprobold.ttf') format('truetype'),
       url('../fonts/FontspringDEMOceraprobold.svg#FontspringDEMOceraprobold') format('svg');
}


@font-face {
  font-family: 'FontspringDEMOceraprolight';
  src: url('../fonts/FontspringDEMOceraprolight.eot');
  src: url('../fonts/FontspringDEMOceraprolight.eot') format('embedded-opentype'),
       url('../fonts/FontspringDEMOceraprolight.woff2') format('woff2'),
       url('../fonts/FontspringDEMOceraprolight.woff') format('woff'),
       url('../fonts/FontspringDEMOceraprolight.ttf') format('truetype'),
       url('../fonts/FontspringDEMOceraprolight.svg#FontspringDEMOceraprolight') format('svg');
}

@font-face {
  font-family: 'FontspringDEMOceraproblack';
  src: url('../fonts/FontspringDEMOceraproblack.eot');
  src: url('../fonts/FontspringDEMOceraproblack.eot') format('embedded-opentype'),
       url('../fonts/FontspringDEMOceraproblack.woff2') format('woff2'),
       url('../fonts/FontspringDEMOceraproblack.woff') format('woff'),
       url('../fonts/FontspringDEMOceraproblack.ttf') format('truetype'),
       url('../fonts/FontspringDEMOceraproblack.svg#FontspringDEMOceraproblack') format('svg');
} */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


/*--------------------------------------------------------------------------------------*/
/*form-pages-css-here
/*--------------------------------------------------------------------------------------*/

.form-bg .row{margin: 0;}
.form-bg .col-md-6{padding: 0;}
.form-des{background: url(../images/banner01.png) no-repeat; background-size: cover; min-height: 100vh; width: 100%; display: flex; align-items: center; justify-content: center; padding: 30px; text-align: center;}
.form-des-inner{width: 100%; max-width: 532px;}
.form-des-inner h2{font-size: 50px; color: var(--white); font-weight: 700; margin-bottom: 15px;}
.form-des-inner p{font-size: 18px; color: var(--white); line-height: 28px;}
.create-account-btn{margin-top: 30px; text-align: center;}
.create-account-btn a{background: var(--white); color: var(--primary);}
.form-box{width: 100%; height: 100vh; overflow: auto; background: url(../images/dot-bg.png) no-repeat right top var(--white); padding: 30px; display: flex; align-items: center; justify-content: center;}
.form-box-inner{margin: auto; max-width: 400px; width: 100%;}
.form-logo{text-align: center;}
.form-head h3{font-size: 22px; color: var(--black); font-weight: 500; text-align: center; margin: 15px 0px;}
.form-text-head{text-align: center; margin-top: 40px; margin-bottom: 30px;}
.form-text-head h2{color: var(--heading); font-size: 44px; font-weight: 700;}
.form-group{position: relative; margin-bottom: 15px;}
.form-group label{font-size: 15px; font-weight: 500; color: var(--heading); margin-bottom: 5px;}
.form-control{border: solid 1px var(--border); height: 45px; border-radius: 4px; font-size: 16px;}
select.form-control{appearance: auto;}
textarea.form-control{height: 110px;}
.fild-with-icon button{background: none; border: none; font-size: 26px; color: var(--black); position: absolute; right: 10px; top: 33px;}
.form-submit-btn{padding: 15px 0px;}
.form-submit-btn .btn{width: 100%;}
.form-group.fild-with-icon .form-control{padding-right: 45px;}
.form-bg .col-md-6 .row{margin: 0px -15px;}
.form-bg .col-md-6 .row .col-md-6{padding: 0px 15px;}

/*--------------------------------------------------------------------------------------*/
/*header-css-here
/*--------------------------------------------------------------------------------------*/

header{background: var(--primary); text-align: center; padding:10px; position: fixed; left: 0; top: 0; width: 100%; z-index: 99;}
.site-bg{padding-top: 102px;}

/*--------------------------------------------------------------------------------------*/
/*client-information-page-css-here
/*--------------------------------------------------------------------------------------*/

.client-information-des{padding: 50px 0px;}
.client-information-des .nav-pills{display: flex; justify-content: space-between; padding-left: 100px;}
.client-information-des .nav-pills li{flex:1; position: relative;}
.client-information-des .nav-pills li .step-box:after{content: ""; width: 100%; height: 3px; background: var(--border); position: absolute; left: -160px; top: 28px; z-index: -1;}  
.client-information-des .nav-pills li:first-child .step-box:after{content:none;}
.step-box{text-align: center;}
.step-box span{display: inline-block; width: 40px; height: 40px; border: solid 1px var(--border); background: var(--white); color: var(--gray); font-size: 16px; font-weight: 500; display: flex; align-items: center; justify-content: center; border-radius: 50px; margin: auto;}
.step-box h5{margin-top: 10px; font-size: 14px; color: var(--gray); font-weight: 400; line-height: 22px;}
.step-box.active{background: none !important;}
.step-box.active span{background: var(--primary); border-color: var(--primary); color: var(--white);}
.step-box.completed span{background: var(--light-blue); border-color: var(--primary); color: var(--primary);}
.step-box.active h5{color: var(--black);} 
.step-box.completed h5{color: var(--black);} 
.client-information-des .nav-pills li .step-box.active:after{background: var(--primary);}
.client-information-des .nav-pills li .step-box.completed:after{background: var(--primary);}
.client-information-des .tab-content{border-top: solid 2px var(--border); padding-top: 30px;}
.step-title-head{display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
.step-title-head h3{font-size: 24px; color: var(--heading); font-weight: 600; margin: 0;}
.client-action-btn{display: flex; align-items: center;}
.client-action-btn a{display: flex; align-items: center; margin-right: 10px;}
.client-action-btn a:last-child{margin-right: 0;}
.client-action-btn a i{margin-right: 5px;}
.inner-step-head{display: flex; align-items: center; justify-content: space-between;}
.in-step-head-box ul{display: flex; align-items: center;}
.in-step-head-box ul li{margin-right: 10px; width: 83px; height: 8px; background: var(--light-blue); border-radius: 50px;}
.in-step-head-box ul li:last-child{margin-right: 0;}
.in-step-head-box ul li.active{background: var(--primary);}
.client-information-step{margin-bottom: 30px;}
.step-page-count{font-size: 16px; color: var(--primary);}
.step-in-des h4{font-size: 16px; color: var(--p); font-weight: normal; margin-bottom: 15px;}
.minors-age-box{margin-bottom: 15px;}
.minors-age-box h3{font-size: 15px; font-weight: 500; color: var(--heading); margin-bottom: 5px;}
.radio-list{display: flex; align-items: center;}
.radio-list .form-check{margin-right: 15px;}
.radio-list .form-check:last-child{margin-right: 0;}
.form-action-foot{border-top: solid 2px var(--border); padding-top: 30px; margin-top: 30px; display: flex; align-items: center; justify-content: space-between;}
.action-right{display: flex; align-items: center;}
.action-right button{margin-right: 15px;}
.action-right button:last-child{margin-right: 0;}
.select-file-box{position: relative; background: var(--light-gray); border: solid 1px var(--border); border-radius: 4px; padding:25px 15px; text-align: center;}
.select-file-box input{position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 9; opacity: 0;}
.select-file-box i{margin-bottom: 10px;}
.select-file-box p{margin: 0; font-size: 14px; color: var(--heading);}
.goal-box{margin-bottom: 15px;}
.goal-box:last-child{margin-bottom: 0;}
.goal-box h3{font-size: 16px; color: var(--heading); font-weight: 500;}
.step-add-box{padding-left: 30px;}
.step-fild{display: flex; align-items: center;}
.step-fild button{margin-left: 15px; background: none; border: none; font-size: 28px; color: var(--black);}
.add-new-step-btn{margin: 15px 0px;}
.add-new-step-btn button{display: flex; align-items: center; background: none; border: none;}
.add-new-step-btn button i{font-size: 24px; margin-right: 5px; color: var(--primary);}
.add-new-step-btn button span{font-size: 15px; color: var(--primary);}
.goal-head{display: flex; align-items: center; justify-content: space-between; border-bottom: solid 1px var(--border); padding-bottom: 15px; margin-bottom: 15px;}
.goal-head button{background: none; border: none; display: flex; align-items: center; font-size: 15px; font-weight: 500;}
.goal-head button i{font-size: 24px; color: var(--primary);}
.goal-head button span{color: var(--primary); padding-left: 5px;}
.form-check .form-check-label{font-weight: normal;}
.save-estimated-box{display: flex; align-items: center; margin-bottom: 15px;}
.save-estimated-box label{margin-right: 15px;}
.save-estimated-box .form-control{width: 86px; margin-right: 15px;}
.multi-select-list{display: flex; flex-wrap: wrap;}
.multi-select-list button{padding: 10px; border-radius: 4px; font-size: 14px; color: var(--heading); background: var(--white); border: solid 1px var(--border); margin-right: 15px; margin-bottom: 15px;}
.multi-select-list button:hover{background: var(--primary); border-color: var(--primary); color: var(--white);}
.multi-select-services-box h3{font-size: 15px; color: var(--heading); font-weight: 500; margin-bottom: 10px;}
.pl-3{padding-left: 15px;}
.table-responsive th{background: #F8F8F8; font-weight: normal; font-size: 15px; font-weight: 500;}
.table-responsive .form-group{margin-bottom: 0;}
.table-responsive .fild-with-icon button{top: 5px;}
.register-company-des{text-align: center;}
.register-company-des h3{font-size: 22px; color: var(--heading); font-weight: 700;}
.btn-close{position: absolute; right: 15px; top: 15px; z-index: 9;}
.modal-body{padding-top: 40px;}
.header-inner{display: flex; align-items: center; justify-content: space-between;}
.logo a img{height: 82px;}
nav.navbar ul li a{font-size: 15px; color: var(--white); font-weight: 500;}
nav.navbar ul li a.active{color: var(--white) !important;}
nav.navbar ul li a:hover,nav.navbar ul li a:focus{color: var(--white);}
.notification-user-box{display: flex; align-items: center;}
.notification-user-box a.notification-btn{width: 44px; height: 44px; background: #3D99BA; border: solid 1px #49AACD; display: flex; align-items: center; justify-content: center; border-radius: 50px; margin-right: 15px;}
.notification-user-box a.notification-btn{width: 44px; height: 44px; background: #3D99BA; border: solid 1px #49AACD; display: flex; align-items: center; justify-content: center; border-radius: 50px;}
.notification-user-box .dropdown-toggle{width: 44px; height: 44px; background: #3D99BA; border: solid 1px #49AACD; display: flex; align-items: center; justify-content: center; border-radius: 50px;}
.notification-user-box .dropdown-toggle:after{content: none;}

.user-logout-box .dropdown-menu{padding: 0; margin-top: 15px !important; background: #FFFFFF; background: color(display-p3 1.000 1.000 1.000); box-shadow: 0px 1px 9px rgba(72, 65, 65, 0.16); box-shadow: 0px 1px 9px color(display-p3 0.278 0.259 0.259 / 0.16); border-radius: 6px; border: none; overflow: hidden; min-width: 100px;}
.user-logout-box .dropdown-menu a{padding: 10px; display: flex; align-items: center;}
.user-logout-box .dropdown-menu a i{font-size: 22px; margin-right: 5px;}
.user-logout-box .dropdown-menu{right: 0 !important; left: auto !important;}



.employer-dashboard-des{padding: 50px 0px;}
.employer-dashboard-des h3{font-size: 24px; color:var(--heading); font-weight: 500; margin-bottom: 20px;}
.employee-list-box{margin-top: 30px;}
.employees-head{display: flex; align-items: center; justify-content: space-between; margin-bottom:20px;}
.employees-head h3{margin-bottom: 0;}
.table-action-btn{display: flex; align-items: center;}
.table-action-btn a{font-size: 28px; color: var(--black); margin-right: 10px;}
.table-action-btn a:last-child{margin-right: 0;}

/*--------------------------------------------------------------------------------------*/
/*timesheet-page-css-here
/*--------------------------------------------------------------------------------------*/

.timesheet-list ul li{background: #FFFFFF; background: color(display-p3 1.000 1.000 1.000); box-shadow: 0px 4px 13px rgba(82, 76, 76, 0.12); box-shadow: 0px 4px 13px color(display-p3 0.318 0.298 0.298 / 0.12); border-radius: 20px; padding: 20px; margin-bottom: 30px;}
.timesheet-head{display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px;}
.timesheet-head-left{display: flex; align-items: center;}
.timesheet-head-left figure{margin:0 10px 0 0; width: 44px; height: 44px; border-radius: 50px;}
.timesheet-head-left figcaption{font-size: 18px; color: var(--heading); font-weight: 600;}
.timeline-history-btn a{color: var(--primary); font-weight: normal;}
.timesheet-list ul li .table{margin-bottom: 0;}
.edit-hour{color: var(--primary); padding-left: 10px;}
.approve-return-btn{display: flex; align-items: center;}
.approve-return-btn button{margin-right: 10px;}
.approve-return-btn button:last-child{margin-right: 0;}
.total-amount-box{display: flex; align-items: center; justify-content: space-between; background: #DCF6FF; border: solid 1px #A2E3FA; padding: 10px 15px; margin-bottom: 15px;}
.total-amount-box h3{margin: 0; font-size: 15px; color: var(--heading);}
.total-amount-box span{font-size: 16px; font-weight: 500; color: var(--primary);}
.timeline-history-bg .timesheet-head{margin-bottom: 0;}
.pending-approved-bg{background: color(display-p3 1.000 1.000 1.000); box-shadow: 0px 4px 13px rgba(82, 76, 76, 0.12); box-shadow: 0px 4px 13px color(display-p3 0.318 0.298 0.298 / 0.12); border-radius: 20px; padding: 20px;}
.pending-approved-bg .nav-pills .nav-link{border-radius: 0; font-size: 14px; color: var(--p); background: #F8F8F8; padding: 10px 20px; letter-spacing: 0.5px;}
.pending-approved-bg .nav-pills .nav-link.active{background: var(--primary); color: var(--white);}
body .modal-header{border: none; text-align: center; display: block;}
.modal-header h1{flex: 1; font-size: 20px; margin-bottom: 5px;}
.modal-header p{margin: 0;}
.modal-body{padding-top: 0;}
.cancel-save-btn{display: flex; align-items: center; justify-content: center;}
.cancel-save-btn button{margin-right: 10px; min-width:110px; text-align: center;}
.cancel-save-btn button:last-child{margin-right: 0;}
.hour-amount-box .total-amount-box:last-child{margin-bottom: 0;}

.notifications-list ul li{display: flex; align-items: center; background: #FFFFFF; background: color(display-p3 1.000 1.000 1.000); box-shadow: 0px 4px 13px rgba(82, 76, 76, 0.12); box-shadow: 0px 4px 13px color(display-p3 0.318 0.298 0.298 / 0.12); border-radius: 20px; padding: 15px; margin-bottom: 15px;}
.notifications-list ul li:last-child{margin-bottom: 0;}
.notifications-list ul li figure{margin: 0; max-width: 44px; flex:0 0 44px;}
.notifications-list ul li figcaption{flex: 1; padding-left: 15px;}
.notifications-list ul li figcaption h3{margin:0 0 5px 0; font-size: 16px; color: var(--heading); font-weight: 500;}
.notifications-list ul li figcaption p{margin: 0; font-size: 15px;}
.notifications-list ul li.active{background: #F4FCFF;}