100 lines
1.5 KiB
CSS

#contact {
display: flex;
flex-direction: row;
gap: 2svw;
align-items: center;
justify-content: center;
}
#contact img {
border-radius: 100%;
max-height: 250px;
display: block;
background-color: var(--card-background-color);
padding: 0.5rem;
}
#contact div {
display: flex;
justify-content: center;
/* flex: 0 0 48%; */
}
#contact div div {
display: flex;
flex-direction: column;
flex-basis: auto;
}
#contact div ul {
display: flex;
flex-direction: column;
}
#contact div ul div {
display: flex;
flex-direction: row;
}
#contact a {
text-decoration: none;
color: inherit;
}
#contact h4 {
text-align: center;
margin-bottom: 0px;
}
#contact div ul {
list-style-type: none;
gap: 1svh;
padding: 0px;
}
#contact div ul li {
/* display: flex;
justify-content: flex-start; */
/* text-wrap: nowrap; */
padding-right: 1svw;
background-color: var(--card-background-color);
border-radius: var(--card-border-radius);
/* border: 1px solid whitesmoke; */
padding: 0.5svh 1svw;
}
#contact div ul li a {
display: flex;
flex-direction: row;
align-items: center;
}
#contact div ul li a div {
display: flex;
flex-direction: column;
}
#contact ul li p {
padding: 0px;
margin: 0px;
}
#contact ul li img {
height: var(--img-width);
width: var(--img-height);
object-fit: contain;
border-radius: 0px;
}
@media only screen and (max-width: 430px) {
#contact ul li img {
display: none;
}
#contact img {
border-radius: 100%;
max-width: 100%;
max-height: 250px;
display: block;
}
}