.sidebar-main{width:100vw;transition:all .7s ease-in-out;display:flex;align-items:center;justify-content:space-evenly;flex-direction:row;position:absolute;bottom:-140px}.dark-sidebar{background-color:var(--dark-lighter)}.dark-sidebar p{color:#fff!important}.light-sidebar{background-color:var(--white);box-shadow:0 8px 24px hsla(210,8%,62%,.2)}.light-sidebar p{color:var(--dark-gray)!important}.light-sidebar div:hover{background-color:var(--gray)}.dark-sidebar div:hover{background-color:var(--darker)}.sidebar-main p{font-size:smaller;font-weight:700}.sidebar-main a{text-decoration:none}.icon-name-wrap:hover{background-color:var(--gray);cursor:pointer}.icon-name-wrap-overview{color:var(--green)!important;flex-direction:row;align-items:center;padding:10px;position:relative;display:flex;flex-direction:column}.icon-name-wrap-overview:hover{background-color:var(--gray);cursor:pointer}.overview-text{color:var(--green)!important}.icon-name-wrap{flex-direction:row;align-items:center;justify-content:flex-start;margin:0;display:flex;flex-direction:column}.close-sidebar{display:none}@media (min-width:768px){.sidebar-main{min-height:100vh;top:0;width:300px;bottom:0;left:0;margin-right:20px;align-items:center;position:relative;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:100px 5px 5px;z-index:100}.close,.sidebar-main{transition:all .7s ease-in-out;overflow:hidden}.close{width:60px}.icon-rotate{transition:transform .3s ease-in-out;transform:rotate(180deg);z-index:1;position:absolute}.sidebar-main p{padding:20px 30px;font-size:smaller;font-weight:700}.icon-name-wrap:hover{background-color:var(--gray);cursor:pointer}.icon-name-wrap-overview{display:flex;flex-direction:row;align-items:center;padding:10px 0 10px 10px;position:relative;width:300px}.icon-name-wrap-overview:hover{background-color:var(--gray);cursor:pointer}.overview-text{color:var(--green)!important}.icon-name-wrap{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;padding:10px 0 10px 10px;margin:0;position:relative;width:300px}.close-sidebar{display:inline;position:absolute;left:20px;top:-70px}.sidebar-main-close{margin-right:20px;padding-top:40px;padding-left:5px;height:100vh;width:2vw;background-color:var(--white);cursor:pointer;box-shadow:0 8px 24px hsla(210,8%,62%,.2);animation:fadeIn 2s .5s forwards;transition:.5s}.sidebar-main-close:hover{background-color:var(--mid-gray)}.dark-light-mode{height:100px;position:absolute;left:15px;top:750px;width:200px;display:flex;flex-direction:row;justify-content:space-between}.theme-switch{display:inline-block;height:34px;position:relative;width:60px}.theme-switch input{display:none}.slider{background-color:var(--gray);border:.3px solid #d5dce3;bottom:0;cursor:pointer;left:0;right:0;top:0}.slider,.slider:before{position:absolute;transition:.4s}.slider:before{background-color:var(--green);bottom:4px;content:"";height:26px;left:4px;width:26px}input:checked+.slider{background-color:var(--white)}input:checked+.slider:before{transform:translateX(26px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}}.header-main{display:flex;flex-direction:row;justify-content:space-between;padding:20px;font-weight:lighter}.user-icon{border-radius:50%}.search-icon{padding:4px 8px}.search-user{display:flex;flex-direction:row;gap:20px;align-items:center}.search-bar-dark,.search-bar-light{position:relative;transition:all 1s;width:50px;height:50px;box-sizing:border-box;border-radius:10px;border:3px solid var(--mid-gray);padding:5px 0;box-shadow:0 0 50px -21px rgba(0,0,0,.1);color:var(--dark-gray)}.search-bar-dark input,.search-bar-light input{position:absolute;top:0;left:0;width:100%;height:42.5px;line-height:30px;outline:0;border:0;display:none;font-size:14px;font-weight:lighter;border-radius:20px;padding:0 20px}.search-bar-dark .fa,.search-bar-light .fa{box-sizing:border-box;padding:10px;width:42.5px;height:42.5px;position:absolute;top:0;right:0;text-align:center;font-size:1.2em;transition:all 1s}.search-bar-light:hover,.search-bar-light:valid{width:170px;cursor:pointer;border:2px solid #c0ced8;transition:all .2s ease-in-out}.search-bar-dark:hover,.search-bar-dark:valid{width:170px;cursor:pointer;border:2px solid #c0ced8;transition:all .2s ease-in-out}.search-bar-light:hover input,.search-bar-light:valid input{display:block;transition:all .2s ease-in-out;background-color:transparent;padding-left:70px;font-size:16px;color:var(--dark-gray)}.search-bar-dark:hover input,.search-bar-dark:valid input{display:block;transition:all .2s ease-in-out;background-color:transparent;padding-left:70px;font-size:16px;color:var(--white)}@media (min-width:768px){.menu-icon{display:none}.header-wrapper{align-items:flex-start}.header-main,.header-wrapper{display:flex;flex-direction:row}.header-main{justify-content:space-between;width:100%;font-size:20px}.search-icon{width:30px;height:25px}.user-icon{width:40px;height:40px}.search-bar-dark,.search-bar-light{width:390px}.search-bar-light:hover,.search-bar-light:valid{width:500px;transition:all .8s ease-in-out}.search-bar-dark:hover,.search-bar-dark:valid{width:500px;transition:all .8s ease-in-out}}.main-employees{margin:20px;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px}.employees{position:relative}.opacity{opacity:.5}.add-new-employee{color:var(--white);background-color:var(--lighter-blue);border-radius:5px;border:none;margin:20px;border:2px solid var(--lighter-blue);min-width:170px;cursor:pointer;display:flex;flex-direction:row;justify-content:space-evenly;gap:2px}.add-new-employee,.add-new-employee:hover{padding:10px 15px;font-weight:600;font-size:16px}.add-new-employee:hover{color:var(--lighter-blue);background-color:var(--white);border-radius:5px;border:2px solid var(--mid-gray);box-shadow:0 0 50px -21px rgba(0,0,0,.1)}.add-employee-form{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:550px;background-color:#fff;border-radius:8px;z-index:1;padding:30px 70px}.add-employee-form,.card-container{box-shadow:0 0 50px -21px rgba(0,0,0,.2)}.card-container{width:370px;height:320px;border-radius:15px;display:flex;flex-direction:column;padding:15px;cursor:pointer;justify-content:flex-start;gap:30px;letter-spacing:2px}.card-container:hover{box-shadow:0 0 50px -21px rgba(0,0,0,.5);transition:all .15s ease-in-out}.image-container{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;height:140px;position:relative;border-radius:10px}.card-name{font-size:24px!important;letter-spacing:5px;font-weight:500;color:var(--text-gray);text-align:center}.copy{right:93%}.copy,.ellipsis{position:absolute;top:0}.ellipsis{left:96%}.ellipsis-pop-up{width:120px;position:absolute;left:54%;border-radius:10px;top:0;background-color:#fff;padding:20px;box-shadow:0 0 50px -21px rgba(0,0,0,.5);display:flex;flex-direction:column}.ellipsis-pop-up span{padding:7px 0;border-bottom:.2px solid var(--text-gray);color:var(--text-gray);font-weight:700;font-size:14px;display:flex;flex-direction:row;justify-content:space-between}.ellipsis-pop-up span:hover{color:var(--dark-gray);transition:all .3s ease-in-out}.ellipsis-pop-up:hover{cursor:pointer}.employee-details{display:flex;flex-direction:column;gap:5px;padding-left:20px;font-size:14px;letter-spacing:2px}.employee-details span{display:flex;flex-direction:row;align-items:center;gap:20px}.db-data{padding:0 10px}.input-b{padding:10px 30px;display:flex;flex-direction:row;justify-content:space-between;align-items:center}.form-b{font-size:18px;font-weight:500;display:flex;flex-direction:column;justify-content:center;padding:0!important}.close-page-b{position:absolute;right:20px;top:20px;cursor:pointer}.add-new-title-b{font-size:24px;text-align:center;letter-spacing:2px;font-weight:500}.add-new-title-b span{color:var(--green)}.input-field-b{border:none;padding:10px;border-bottom:.5px solid var(--green);font-size:18px;width:60%;text-align:center;margin:0 15px;background-color:#fff;color:var(--text-gray);letter-spacing:2px}.submit-form-b{padding:10px 15px;color:var(--white);background-color:var(--green);border-radius:5px;font-weight:600;font-size:18px;border:none;margin:10px 30px;border:2px solid var(--green);width:150px}.submit-form-b:hover{padding:10px 15px;color:var(--green);background-color:var(--white);border-radius:5px;font-weight:600;border:2px solid var(--green);box-shadow:0 0 50px -21px rgba(0,0,0,.1);cursor:pointer}.employees-main{display:flex;flex-direction:row}