#modal{position:fixed;top:0;right:0;left:0;bottom:0;display:flex;justify-content:center;align-items:center}#modal-background{position:fixed;top:0;right:0;left:0;bottom:0;background-color:#000000b3}#modal-content{position:absolute;background-color:#fff}.login-modal{display:flex;flex-wrap:nowrap;flex-direction:column;align-content:space-between;justify-content:space-evenly;background-color:"#001f3f";color:#fff;align-items:center;height:35rem;width:600px}.login-btns{margin:15px;display:flex;flex-direction:row;justify-content:center}.login-btns>button{margin:7px;height:55px;width:200px;cursor:pointer;font-size:1rem;font-weight:500}.footer{position:fixed;bottom:0;width:100%;height:7%;background-color:#001f3f;color:#fff;text-align:center}.login-title{font-size:3rem}.signup-modal{display:flex;flex-wrap:nowrap;flex-direction:column;align-content:space-between;justify-content:space-evenly;background-color:"#001f3f";color:#fff;align-items:center;height:auto;width:600px}.form{display:flex;flex-direction:column;padding:15px}form>label{margin:10px;font-size:1.5rem}label>input{width:-webkit-fill-available;margin:10px 0;height:2rem}.signup-btns{margin:15px;display:flex;flex-direction:row;justify-content:center}.signup-btns>button{margin:7px;height:55px;width:200px;cursor:pointer;font-size:1rem;font-weight:500}.errors{color:red;display:flex;justify-content:center}.mainContainer{background-image:url(/blueprint.jpeg);background-size:cover;background-position:center;background-attachment:fixed;height:auto}.auth-btns{list-style-type:none;display:flex;flex-direction:row;padding-top:11%;justify-content:center}li>button{background-color:#001f3f;color:#f0f8ff;font-size:1.5rem;border:1px solid aliceblue;width:350px;height:100px;padding:5px;margin:5px}li>button:hover{cursor:pointer}.createProjectForm{background-color:#001f3f;display:flex;flex-wrap:nowrap;flex-direction:column;align-content:space-between;justify-content:space-evenly;background-color:"#001f3f";color:#fff;align-items:center;height:auto;width:600px;margin-top:-35%}.modal-content{background-color:#001f3f}.newProjectButton{margin:7px;height:55px;width:350px;cursor:pointer;font-size:1rem;font-weight:500}.delete>h1,h2{align-self:center}.yes-delete,.no-delete{margin:7px;height:55px;width:350px;cursor:pointer;font-size:1rem;font-weight:500}.yes-delete:hover{background-color:#b22222}.no-delete:hover{background-color:#006400}.mainContainer{background-image:url(./blueprint.jpeg);background-size:cover;background-position:center;background-attachment:fixed;height:100vh;padding-top:12%;display:flex;justify-content:center;align-items:flex-start;flex-wrap:wrap;flex-direction:row}.newProject{height:25rem}.newProject>button{background-color:#28a745;color:#fff;height:15%;width:20rem;font-size:large}.newProject>button:hover{background-color:#218838;cursor:pointer}.projectImage{width:300px;height:300px}.imageContainer{display:flex;justify-content:center}.card{border:solid;padding:20px;margin:30% 30px 30px;background-color:#fff;opacity:.9;text-decoration:none;color:#000;height:650px;width:500px}.card:hover{cursor:pointer}.card-image{display:flex;height:300px;width:300px;margin:auto;border:1px solid white;border-radius:20%}.no-underline{text-decoration:none}.cardContainer{display:flex;flex-direction:column;align-items:center}.cardContainer>button:hover{cursor:pointer}.delete-project>button{background-color:#dc3545;color:#fff;font-size:larger;border:solid 1px white;padding:1rem;margin:0 1rem;cursor:pointer}.delete-project>button:hover{background-color:#b22222}.edit-project>button{background-color:#007bff;color:#fff;font-size:larger;border:solid 1px white;padding:1rem;margin:0 1rem;cursor:pointer}.edit-project>button:hover{background-color:#0056d2}.card-buttons{display:flex}.updateProjectForm{background-color:#001f3f;display:flex;flex-wrap:nowrap;flex-direction:column;align-content:space-between;justify-content:space-evenly;background-color:"#001f3f";color:#fff;align-items:center;height:auto;width:800px;margin-top:-35%}.addProjectImages{width:-webkit-fill-available;margin:10px 0;height:2rem}.addMoreImagesButton{margin:7px;height:25px;width:350px;cursor:pointer;font-size:1rem;font-weight:500}.updateProjectButton{height:50px}.projectDetailsContainer{background-image:url(/blueprint.jpeg);background-size:cover;background-position:center;background-attachment:fixed;height:auto;padding-top:12%;padding-bottom:5%;display:flex;justify-content:center;align-items:flex-start;flex-wrap:wrap;flex-direction:row}.projectImagesContainer{display:flex;justify-content:center}.projectImage{width:400px;height:400px;margin:15px}.projectDescription{background-color:#f9f9f9;border-radius:8px;box-shadow:0 4px 8px #0000001a;margin:10px 20%;padding:5px}.projectDescription>p{font-size:larger}.projectDescription>h1{text-align:center}.employee-card{display:flex;flex-direction:column;align-items:center;background-color:#f9f9f9;border-radius:8px;box-shadow:0 4px 8px #0000001a;width:300px;margin:20px;overflow:hidden}.employee-picture{width:100%;height:200px;object-fit:cover}.employee-details{padding:15px;text-align:center}.employee-name{font-size:1.5em;font-weight:700;margin-bottom:10px;color:#333}.employee-job-title{font-size:1.2em;margin-bottom:8px;color:#555}.employee-hire-date,.employee-contact-number,.employee-email,.employee-salary{font-size:.9em;margin-bottom:6px;color:#777}.employee-salary{font-weight:700;color:#2c3e50}.employee-card-container{display:flex;flex-direction:row;justify-content:center}.employee-actions{gap:10px;opacity:0;transition:opacity .3s ease;display:flex;justify-content:center;flex-direction:row;align-items:center}.employee-card:hover .employee-actions{opacity:1}.employee-actions>button{font-size:1.3rem}.edit-btn:hover{background-color:#00f}.delete-btn:hover{background-color:red}.project-image-card{display:flex;flex-direction:column;align-items:center;background-color:#f9f9f9;border-radius:8px;box-shadow:0 4px 8px #0000001a;width:300px;height:370px;margin:20px;overflow:hidden;background-color:#f1f1f1}.project-image{width:100%;height:300px;object-fit:cover}.project-image-details{padding:15px;text-align:center}.project-image-title{font-size:1.5em;font-weight:700;margin-bottom:10px;color:#333}.project-image-description{font-size:1em;color:#555;margin-bottom:8px}.project-image-actions{position:relative;top:10px;right:10px;display:flex;gap:10px;opacity:0;transition:opacity .3s ease}.project-image-card:hover .project-image-actions{opacity:1}.project-image-actions button{background-color:#fff;border:none;border-radius:50%;padding:10px;color:#000;cursor:pointer;transition:background-color .3s ease;font-size:larger}.project-image-actions>button{font-size:1.5em}.staff-title>h1{margin:auto;background:white;padding-left:1rem;padding-right:1rem}.edit-button>button:hover{background-color:#00f;font-size:larger}.remove-buton>button:hover{background-color:red;font-size:larger}.employee-actions button{background-color:#000000b3;border:none;border-radius:50%;padding:10px;color:#fff;cursor:pointer;transition:background-color .3s ease;font-size:larger}.add-employee,.add-image{display:flex;align-items:center}.add-employee>button{background-color:#28a745;color:#fff;height:4rem;width:10rem;font-size:large;border-radius:20%}.add-employee>button:hover{background-color:#218838;cursor:pointer}.add-image>button{background-color:#28a745;color:#fff;height:15%;width:10rem;font-size:large;border-radius:20%}.add-image>button:hover{background-color:#218838;cursor:pointer}.project-staff>button:hover{background-color:green;cursor:pointer}.project-staff,.staff-title{display:flex;flex-direction:column;justify-content:center}.project-staff>h1{margin:auto;background:white;padding-left:1rem;padding-right:1rem}.project-staff>button{font-size:larger;margin:auto;background-color:#006400;color:#fff;padding:10px}.edit-employee{background-color:#001f3f;display:flex;flex-wrap:nowrap;flex-direction:column;align-content:space-between;justify-content:space-evenly;background-color:"#001f3f";color:#fff;align-items:center;height:auto;width:800px;margin-top:-35%}.delete{background-color:#001f3f;color:azure;display:flex;flex-wrap:wrap;width:auto;flex-direction:column;padding:15px;justify-content:center}.delete>p{margin:auto;padding:2rem;font-size:larger}.confirm-delete{display:flex;flex-direction:row;align-content:center;justify-content:space-around;flex-wrap:wrap;align-items:center}.confirm-delete>button:hover{cursor:pointer}.edit-image{background-color:#001f3f;display:flex;flex-wrap:nowrap;flex-direction:column;align-content:space-between;justify-content:space-evenly;background-color:"#001f3f";color:#fff;align-items:center;height:auto;width:20rem;margin-top:-35%}.add-imageModal{background-color:#001f3f;display:flex;flex-wrap:nowrap;flex-direction:column;align-content:space-between;justify-content:space-evenly;background-color:"#001f3f";color:#fff;align-items:center;height:auto;width:30rem;margin-top:-35%}.add-btn{background-color:#28a745;color:#fff;height:15%;width:20rem;font-size:large}.add-btn:hover{background-color:#218838;cursor:pointer}*{box-sizing:border-box}#root{background-image:url(/blueprint.jpeg);background-size:cover;background-position:center;height:100vh}body{margin:0;padding:0}nav{display:flex;background-color:#001f3f;padding:2rem 2rem 0;flex-direction:column;text-decoration:none;width:auto}.navbarContainer{position:fixed;width:100%}.navbar{display:flex;flex-direction:row;justify-content:space-between}nav>button{background-color:#fff;width:auto;height:40px;padding:10px}button:hover{background-color:gray;color:#f0f8ff;border:1px solid white}.link{text-decoration:none;font-size:small;font-weight:500}.logo{font-size:9vh;color:#fff;height:auto;width:auto}.logo:hover{cursor:pointer}.nav-title{font-size:3rem;font-weight:600;color:#fff}.slogan{font-size:1.5rem;font-weight:600;color:#fff;align-self:center}.currentProjectsText{font-size:2rem;font-weight:600;color:#fff;align-self:center;padding-right:5%}.homepage-banner{display:flex;justify-content:center;color:#fff;background-color:#001f3f;margin-top:10%}.subnavbar{display:flex;justify-content:space-between;align-items:center}.subnavbar>button{width:10rem;height:2.5rem;font-size:1rem;color:#f0f8ff;background-color:#b22222}.subnavbar>button:hover{cursor:pointer}.projectNav{display:flex;flex-direction:row;flex-wrap:wrap;text-decoration:none;width:auto;align-content:center;justify-content:space-evenly;align-items:center;background-color:#fff;position:fixed;width:-webkit-fill-available;margin-top:-4rem}.projectDetails{margin-top:5%;width:-webkit-fill-available}.add-button{background-color:#28a745;color:#fff;height:15%;width:20rem;font-size:large}.add-button:hover{background-color:#218838;cursor:pointer}