.socialcard{background-color:var(--bg-white);width:fit-content;height:fit-content;box-shadow:var(--boxshadow);z-index:999;border-radius:var(--borderradius);border-top-left-radius:0;border-bottom-left-radius:0;flex-direction:column;justify-content:center;align-items:center;gap:20px;padding:5px;display:flex;position:absolute;top:20%}.socialContainer{background-color:var(--accent-color);border-radius:var(--borderradius);justify-content:center;align-items:center;width:34px;height:34px;transition-duration:.3s;display:flex;overflow:hidden}.socialContainer svg{width:1.5em;height:1.5em;fill:var(--bg-white);transition-duration:.3s}.containerOne:hover{background-color:#0d1117}.containerOne:hover svg,.containerTwo:hover svg,.containerThree:hover svg,.containerFour:hover svg{fill:#fff}.containerTwo:hover{background-color:#000}.containerThree:hover{background-color:#0072b1}.containerFour:hover{background-color:#d62976}.socialContainer:active{transition-duration:.3s;transform:scale(.9)}.socialSvg{width:17px}.socialSvg path{fill:#fff}.socialContainer:hover .socialSvg{animation:.3s both slide-in-top}@keyframes slide-in-top{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.socialcard{display:none}}