:root { --bio-bg-color: inherit;
--bio-border: 1px solid #fcfcfc; --bio-width: 100%; --bio-height: auto; --name-font-size: 18px; --name-color: #1b1b1b; --email-font-size: 14px; --email-color: #777; --bio-text-font-size: 14px; --bio-text-color: #555;  --social-icon-size: 30px; --social-icon-gap: 30px;
}
#author-bio-container {
position: relative;
width: var(--bio-width);
margin: 50px auto;
padding: 5px 5px;
box-sizing: border-box !important;
margin-top: 50px ;
border: var(--bio-border);
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}
#author-bio-container > #about-author-heading {
position: absolute;
top: -20px;
left: 20px;
background-color: #36454F;
color: white;
padding: 5px 10px;
border-radius: 5px;
font-weight: bold;
font-size: 14px;
}
#author-bio-container > #author-kit-bio-box{
display: flex;
flex-direction: row;
padding: 35px 25px;
}
#author-bio-container > #author-kit-bio-box> div > #author-avatar-container {
display: flex;
justify-content: center;
align-items: center;
width:100px;
height: 100px;
margin-right: 20px;
flex-shrink: 0;
}
#author-bio-container > #author-kit-bio-box> div > #author-avatar-container > img#author-avatar {
width: 100% !important;
height: 100% !important;
border-radius: 50%;
object-fit: cover;
box-shadow: none !important; filter: none !important; background: none !important; }
#author-details {
width: auto;
}
#author-name {
font-size: var(--name-font-size);
color: var(--name-color);
font-variant: bold;
font-weight: 700;
margin: 0;
margin-bottom: 2px;
}
#author-name .author-name{
font-weight: 600;
}
#author-name a {
text-decoration: none;
color: inherit;
}
#author-name a:visited ,a:focus{
text-decoration: none;
border: none;
outline: none;
}
#author-info-placeholder {
font-size: var(--email-font-size);
color: var(--email-color);
margin: 0 0 0 0;
}
#author-bio-text {
font-size: var(--bio-text-font-size);
color: var(--bio-text-color);
line-height: 1.6;
overflow: wrap;
margin-top: 8px;
} @media (max-width: 600px) {
#author-bio-container {
box-sizing: border-box;
max-width: 96%;
background-color: white;
margin: initial auto;
}
#author-bio-container > #author-kit-bio-box{
flex-direction: column;
align-items: flex-start;
padding: 10px 10px;
}
#author-bio-container > #author-kit-bio-box> div > #author-avatar-container{
width: 100px;
height: 100px;
margin-bottom: 15px;
}
#author-avatar-container img#author-avatar {
width: 100%;
height: 100%;
}
#author-bio-container > #author-kit-bio-box> div > #author-avatar-container {
margin-right: 0px;
}
#author-bio-text {
font-size: 0.9rem;
width: 100%;
}
#author-details {
width: 100%;
}
}
#author-bio-container #author-kit-bio-box  div.author-kit-social-icons-list{
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px; justify-content: flex-start; margin-top: 15px;
}
.author-kit-social-icons-list a.author-kit-social-icon  {
display: flex;
align-items: center;
justify-content: center;
justify-content: center;
transition: transform 0.3s ease, opacity 0.3s ease;
text-decoration: none !important;
}
a#author-kit-circle{
border-radius: 50% !important;
}
a#author-kit-square{
border-radius: 5px !important;
}
.author-kit-social-icons-list a.author-kit-social-icon i {
line-height: 1;
color: white ;
justify-content: center;
}
.author-kit-social-icon:hover {
transform: scale(1.2);
opacity: 0.85;
} @media (max-width: 767px) {
#author-bio-container #author-kit-bio-box  div.author-kit-social-icons-list {
gap: 10px; justify-content: flex-start;
padding: 6px 0;
}
.author-kit-social-icons-list a.author-kit-social-icon {
font-size: 20px; width: 33px;
height: 33px;
justify-content: center;
align-items: center;
}
#author-bio-container > #author-kit-bio-box> div > #author-avatar-container {
width: 100%;
}
}