.project{border:1px solid grey;border-radius:10px;display:flex;flex-direction:row;margin-bottom:.5rem;margin-top:1rem;position:relative;width:100%;overflow:hidden;opacity:0;animation:slideInFromLeft .7s ease forwards;transition:all .7s ease}.top-right-icons{position:absolute;display:flex;flex-direction:column;gap:.5rem;right:5px;top:5px}.complete-icon,.type-icon{transition:transform .3s ease;z-index:5}.complete-icon:hover,.technology-image:hover,.type-icon:hover{transform:scale(1.3)}.project-data{justify-content:space-between;position:relative;width:100%;height:auto;flex-grow:1}.project-data,.project-text{display:flex;flex-direction:column}.project-text{align-items:flex-start;justify-content:center;margin-right:2rem;margin-bottom:1rem;padding:.25rem;text-align:start}.project-name{font-size:1.2rem;font-weight:700;width:auto}.project-name:hover{color:aqua;text-decoration:underline}.project-desc{color:grey;font-style:italic;width:auto}.project-image{width:70%;display:flex;align-items:center;justify-content:center;object-fit:cover}.project-image img{width:100%;height:100%}.stack-type-display{display:flex;justify-content:center;width:100%;margin-bottom:.5rem}.deployed-link,.github-link,.stack-type-display p{margin-right:5px;margin-left:5px;padding:.5rem;text-align:center}.stack-display{display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:.3rem;padding-right:2rem;padding-left:2rem}.technology-image{flex:0 1;margin-left:5px;margin-right:5px;transition:transform .3s ease}.project-links{display:flex;justify-content:center;width:100%;margin-bottom:.6rem}.backend,.deployed-link,.frontend,.fullstack,.github-link,.other{width:100px;height:40px;background:transparent;cursor:pointer;transition:all .3s ease;position:relative;margin-bottom:5px;display:flex;justify-content:center;align-items:center;color:#fff;border:1px solid #fff;box-shadow:0 0 5px #fff,inset 0 0 5px}.backend:after,.deployed-link:after,.frontend:after,.fullstack:after,.github-link:after,.other:after{position:absolute;background-color:transparent;content:"";top:2px;left:2px;width:95%;height:86%;border:1px solid #fff;box-shadow:inset 0 0 5px #fff;opacity:0;transition:all .3s ease}.deployed-link,.github-link{color:#fff;border:1px solid #fff;box-shadow:0 0 5px #fff,inset 0 0 5px}.deployed-link p,.github-link p{margin-right:5px;text-align:center}.backend{color:blue;border:1px solid blue;box-shadow:0 0 5px blue,inset 0 0 5px}.backend:after{border:1px solid blue;box-shadow:inset 0 0 5px blue}.frontend{color:#ff0;border:1px solid #ff0;box-shadow:0 0 5px #ff0,inset 0 0 5px}.frontend:after{border:1px solid #ff0;box-shadow:inset 0 0 5px #ff0}.fullstack{color:#32cd32;border:1px solid #32cd32;box-shadow:0 0 5px #32cd32,inset 0 0 5px}.fullstack:after{border:1px solid #32cd32;box-shadow:inset 0 0 5px #32cd32}.other{color:#7b68ee;box-shadow:0 0 5px #7b68ee,inset 0 0 5px}.other,.other:after{border:1px solid #7b68ee}.other:after{box-shadow:inset 0 0 5px #7b68ee}.backend:hover:after,.deployed-link:hover:after,.frontend:hover:after,.fullstack:hover:after,.github-link:hover:after,.other:hover:after{opacity:1}@media screen and (max-width:660px){.project{flex-direction:column;justify-content:center;align-items:center;padding-top:1rem;padding-bottom:.5rem}.project-image{width:75%}.project-data{justify-content:space-between}.project-text{align-items:center;text-align:center;padding-right:1rem;padding-left:1rem;margin:.5rem 0}.deployed-link,.github-link{font-size:15px;width:100px;height:50px}.deployed-link:after,.github-link:after{top:2px;left:2px;width:95%;height:89%}}@media screen and (max-width:370px){.backend,.frontend,.fullstack,.other{width:64px;height:50px}.backend:after,.frontend:after,.fullstack:after,.other:after{top:2px;left:2px;width:91%;height:89%}}@media screen and (min-width:850px){.backend,.deployed-link,.frontend,.fullstack,.github-link,.other{font-size:20px;font-weight:700;width:120px;height:50px;background:transparent;cursor:pointer;transition:all .3s ease;position:relative;margin-bottom:5px;display:flex;justify-content:center;align-items:center}.backend:after,.deployed-link:after,.frontend:after,.fullstack:after,.github-link:after,.other:after{position:absolute;background-color:transparent;content:"";top:2px;left:2px;width:95%;height:89%;opacity:0;transition:all .3s ease}.project-name{font-size:30px}.project-desc{font-size:1.2rem}.technology-image{transform:scale(1.2);margin:10px}.technology-image:hover{transform:scale(1.6)}}@keyframes slideInFromLeft{0%{transform:translateX(-150px)}to{opacity:1;transform:translateX(0)}}.card{position:relative;background-size:cover;background-position:50%;background-repeat:no-repeat;transform:rotateX(0) rotateY(0);transform-style:preserve-3d;transition:transform .1s ease,box-shadow .5s ease-in-out;border-radius:20px;width:500px;height:500px}.card:hover{box-shadow:0 0 30px 2px hsla(0,0%,100%,.66)}.card.is-out{transition:all .5s ease-in-out}@media screen and (min-width:769px){.card{width:270px;height:270px}}@media screen and (max-width:768px){.card{width:300px;height:300px}}@media screen and (max-width:400px){.card{width:220px;height:220px}}