:root { --sidebarBackground: rgba(34, 124, 157, .8); --sidebarIconColor: #fef9ef;}#social-sidebar { position: fixed; left: 0; list-style: none; margin: 0; z-index: 20; opacity: 0; transition: opacity .3s;}@media screen and (max-width: 599px) { #social-sidebar { bottom: 10%; } }@media screen and (min-width: 600px) { #social-sidebar { top: 30%; } }#social-sidebar li:first-child a { border-top-right-radius: 5px; }#social-sidebar li:last-child a { border-bottom-right-radius: 5px; }#social-sidebar a { background: var(--sidebarBackground); color: var(--sidebarIconColor); text-decoration: none; display: block; height: 50px; width: 35px; font-size: var(--font-size-l); line-height: 50px; position: relative; text-align: center; cursor: pointer;}@media screen and (min-width: 1200px) { #social-sidebar a { width: 40px; } }@media screen and (min-width: 1500px) { #social-sidebar a { width: 50px; height: 60px; line-height: 60px; } }@media screen and (min-width: 1800px) { #social-sidebar a { width: 60px; height: 70px; line-height: 70px; } }#social-sidebar a:hover span { left: 120%; opacity: 1;}#social-sidebar a span { font: 12px "Open Sans", sans-serif; text-transform: uppercase; line-height: 24px; border-radius: 3px; position: absolute; top: 50%; left: -100%; padding: 4px 8px; margin-top: -16px; width: 120px; opacity: 0; transition: opacity .3s, left .4s;}#social-sidebar a span:before { content: ""; display: block; height: 8px; width: 8px; left: -4px; margin-top: -4px; position: absolute; top: 50%; transform: rotate(45deg);}#social-sidebar a[class*="email"]:hover,#social-sidebar a[class*="email"] span,#social-sidebar a[class*="email"] span:before {background: #DB4437;}#social-sidebar a[class*="twitter"]:hover,#social-sidebar a[class*="twitter"] span,#social-sidebar a[class*="twitter"] span:before {background: #1da1f2;}#social-sidebar a[class*="telegram"]:hover,#social-sidebar a[class*="telegram"] span,#social-sidebar a[class*="telegram"] span:before {background: #0088CC;}#social-sidebar a[class*="whatsapp"]:hover,#social-sidebar a[class*="whatsapp"] span,#social-sidebar a[class*="whatsapp"] span:before {background: #25d366;}#social-sidebar a[class*="pinterest"]:hover,#social-sidebar a[class*="pinterest"] span,#social-sidebar a[class*="pinterest"] span:before {background: #e60023;}