cr aicoholdrink links

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">
</script>
<script>
$(function(){
$('#social-toggle').click(function(e){
e.preventDefault();
$('#social ul').animate({width: 'toggle'});
});
});
</script>
<style>
/*social media tab by chloe | @redivide | @themekid */
#social {
position:fixed;
font-size: 2em;
color: #F0CEE2;
}

@media only screen and (max-width: 600px) {
#social {
bottom: 140px;
}
}

#social ul {
list-style-type: none;
font-size: 0.7em;
padding: 0;
text-align: center;
display: inline-block;
display: none;
overflow: hidden;
white-space: nowrap;
position: absolute;
left: 40px;
top: 5px;
margin: 0;
}

#social ul li {
display: inline-block;
margin: 0 3px;
vertical-align: top;
line-height: 120%;
}

#social a {
color: #CCDCEC;
text-decoration: none;
}
</style>
</head>
<body>
<div id="social">
<i class="ph-phone-call-fill" title="social" style="cursor: pointer" id="social-toggle"></i><ul> <a href="#">
<i class="ph-twitter-logo-fill"></i></a> <a href="#">
<i class="ph-spotify-logo-fill"></i></a> <a href="#">
<i class="ph-chats-fill"></i></a> <a href="#">
<i class="ph-film-slate-fill"></i></a> </ul>
</div>