I'm having trouble editing my profile, I will include my full CSS below (I am not a coder, this is just stuff I've picked up from other people. When I try to turn my pfp into a gif, I see the original blank pfp on top and the gif is below it behind my url info and contact info instead of on top of it, and it was working fine earlier so I know I've blipped somewhere and need help figuring it out!!
<style>
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;400&display=swap');
font-family: 'Montserrat', sans-serif;
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url(https://64.media.tumblr.com/1044be452b5c583705c105ca67a8c0b4/tumblr_n1s6qmgTRd1qf1qjho1_500.gifv); display: inline-block; content:"" }
.blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; } /* blogs, bulletins */
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; } /* profile */
.profile {
background-color: rgba(146, 186, 146, 0.43);
}
body {
background-image: url(https://i.pinimg.com/originals/9b/00/31/9b003185cf9c96cf9918a8afa9e4bdf7.jpg);
}
main {
background-color: transparent;
}
a, .count, .friends a p, h1, h2, h3 , h4, h5, .url-info p {
color: white;
}
.profile .contact, .profile .table-section, .profile .blog-preview, .profile .blurbs, .profile .friends {
border: 1px solid;
border-color: transparent;
font-family: 'Montserrat', sans-serif;
}
:root {
--logo-blue: #4b5443;
--darker-blue: #97a987;
--lighter-blue: #97a987;
--even-lighter-blue: #97a987;
--lightest-blue: rgba(49, 76, 49, 0.43);
--dark-orange: #97a987;
--light-orange: transparent;
--even-lighter-orange: #97a987;
--green: #97a987;
--topic1: "Songs"; /* EDIT INTEREST LABELS HERE */
--topic2: "Animals";
--topic3: "Hobbies";
--topic4: "Musicians";
--topic5: "Aesthetics";
--topic6: "Video Games";
}
.table-section:not(:last-child) .details-table tr td:first-child p{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}
.details-table tr td:first-child p::after{
color:var(--links) !important;
letter-spacing:normal !important;
text-shadow: 2px 2px white !important; /* CHANGE COLOR OF INTEREST LABELS HERE */
filter: brightness(95%) !important;
}
.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{
content: var(--topic1);
}
.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{
content: var(--topic2);
}
.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{
content: var(--topic3);
}
.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{
content: var(--topic4);
}
.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{
content: var(--topic5);
}
.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{
content: var(--topic6);
}
</style>