.project{display:flex;justify-content:flex-start;gap:20px;border:1px solid var(--light-main);border-radius:20px;width:100%;padding:20px;transition:all .2s ease}.project:hover{border:1px solid var(--accent-light);transition:all .2s ease}.project-preview{max-width:300px;width:250px;border-radius:inherit;aspect-ratio:4/3;-o-object-fit:cover;object-fit:cover}.project-description{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:10px}.project-description p{color:var(--clear-white);font-size:var(--normal);width:50ch}.techs-used{display:flex;justify-content:center;align-items:center;gap:10px;font-size:var(--small)}.techs-used svg{color:var(--light-main)}.go-to{gap:10px;flex-wrap:wrap}.btn,.go-to{display:flex;justify-content:center;align-items:center}.btn{cursor:pointer;border:none;gap:5px;background-color:var(--accent-light);color:var(--dark-main);font-size:var(--small);text-transform:uppercase;font-weight:600;padding:5px 10px;border-radius:5px}.btn,.btn:hover{transition:all .15s ease}.btn:hover{transform:scale(1.02)}.deploy-btn svg{transform:rotate(0);transition:transform .2s ease}.deploy-btn:hover svg{transform:rotate(40deg);transition:transform .2s ease}.repository-btn{background-color:var(--light-main)}.deploy-btn:hover{box-shadow:5px 5px var(--accent-dark)}.repository-btn:hover{box-shadow:5px 5px var(--clear-light)}.repository-btn svg,.repository-btn:hover svg{transition:transform .2s ease}.repository-btn:hover svg{transform:rotate(10deg)}@media screen and (max-width:970px){.project-description p{width:90%;word-wrap:break-word}}@media screen and (max-width:680px){.project{justify-content:flex-start;flex-direction:column}.project,.project-description{align-items:flex-start}.project-description p{text-align:left}}@media screen and (max-width:490px){.project-preview{max-width:unset;width:100%;height:160px}.project-description{width:100%;gap:15px}.project-description p{width:100%}}.projects-container{width:100%;display:flex;flex-direction:column;gap:25px;padding-right:20px}@media screen and (max-width:970px){.projects-container{align-items:center}}@media screen and (max-width:680px){.projects-container{overflow:auto;padding:0;height:auto;align-items:flex-start}}