/*********************************************
 * Social Media
**********************************************/
.vii-social-buttons {gap:16px;}
.vii-social-buttons__ul {gap:4px;}
.vii-social-buttons .vii-social-buttons__link {
    --bg:var(--vii-color-blue);--bg-hover:var(--vii-color-orange);
    --color:var(--vii-color-white);--color-hover:var(--vii-color-white);
    background-color:var(--bg);color:var(--color);
}

/* remove default focus-visible */
.vii-social-buttons.icon .vii-social-buttons__link:focus-visible {border-radius:50%;}

/* hover, focus */
.vii-social-buttons .vii-social-buttons__link:hover,
.vii-social-buttons .vii-social-buttons__link:focus {background-color:var(--bg-hover);color:var(--color-hover);}

/* class txt_color_white */
.txt_color_white .vii-social-buttons .vii-social-buttons__link {
    --bg:var(--vii-color-white);--color:var(--vii-color-blue);
    --bg-hover:var(--vii-color-orange);--color-hover:var(--vii-color-white);
}

/* Type icon */
.vii-social-buttons.icon .vii-social-buttons__link { width:32px;height:32px; }

/* Type Text only options */
.vii-social-buttons.text .vii-social-buttons__link { padding:10px 14px; }


/*********************************************
 * Responsive Social Media
**********************************************/
@media screen and (max-width:768px) {
    .vii-social-buttons {gap:12px;}
}