.custom-row-buttons .button,
.custom-row-buttons a {
font-size: 14px !important; letter-spacing: 0 !important; padding: 2px 6px !important; margin: 0 2px !important; line-height: 1.3 !important; white-space: nowrap !important; display: inline-block; max-width: 100%; text-align: left; } .btn {
display: inline-flex !important;
align-items: center !important;
gap: 5px !important;
font-weight: 500 !important;
text-decoration: none !important;
position: relative !important;
} .btn::after {
content: "";
position: absolute;
left: 0;
bottom: -2px;
width: 0%;
height: 2px;
background-color: currentColor;
transition: width 0.3s ease;
}
.btn:hover::after {
width: 100%;
} .btn-g { color: #2ecc71 !important; }
.btn-g:hover { color: #27ae60 !important; }
.btn-r { color: #e74c3c !important; }
.btn-r:hover { color: #c0392b !important; }
.btn-o { color: #e67e22 !important; }
.btn-o:hover { color: #d35400 !important; } .btn-b { color: #3498db !important; }
.btn-b:hover { color: #2980b9 !important; }.custom-btn {
display: inline-block;
padding: 6px 16px; margin: 0 6px; border: 1px solid white;
background-color: transparent;
color: white;
border-radius: 15px;
font-size: 12px;
text-decoration: none;
transition: background-color 0.3s ease;
white-space: nowrap;
}
.custom-btn:hover {
background-color: rgba(255, 0, 0, 0.2); color: white;
}
.btn-link {
border-radius: 6.1875rem;
border: 0.0625rem solid rgb(255 255 255 / 32%);
background: var(
--ruot-kinh,
linear-gradient(
46deg,
rgba(255, 255, 255, 0.2) -12.56%,
rgba(255, 255, 255, 0.5) 100%
)
);
backdrop-filter: blur(0.125rem);
min-width: 10.625rem;
height: var(--40);
margin: 0;
display: inline-flex;
justify-content: center;
align-items: center;
font-weight: normal;
font-size: 1rem;
font-family: var(--medi);
gap: 0;
-webkit-transition: 300ms all cubic-bezier(0.4, 0, 0.2, 1);
-o-transition: 300ms all cubic-bezier(0.4, 0, 0.2, 1);
transition: 300ms all cubic-bezier(0.4, 0, 0.2, 1);
font-weight: 100;
}
.btn-link i {
font-size: 0.875rem;
}
.btn-link:hover {
box-shadow: none;
background-color: var(--theme-color);
}
.social-home {
display: flex;
gap: 1rem;
}
.social-home a {
height: var(--32);
padding: 0 var(--18);
display: inline-flex;
align-items: center;
justify-content: center;
border: 0.0625rem solid var(--vien-kinh, rgba(255, 255, 255, 0.32));
backdrop-filter: blur(0.125rem);
border-radius: 6.1875rem;
color: #fff;
font-size: var(--15);
font-family: var(--medi);
z-index: 9;
}
.social-home a:hover {
background-color: var(--theme-color);
}.fall-down, .slide-in-right, .slide-in-left {
opacity: 0;
animation: none;
} .flickity-slider > .is-selected .fall-down {
animation: fallDown 1s ease-out forwards;
}
.flickity-slider > .is-selected .slide-in-right {
animation: slideInRight 1s ease-out forwards;
animation-delay: 0.3s;
}
.flickity-slider > .is-selected .slide-in-left {
animation: slideInLeft 1s ease-out forwards;
animation-delay: 0.6s;
} @keyframes fallDown {
0% {
opacity: 0;
transform: translateY(-300px); }
100% {
opacity: 1;
transform: translateY(0);
}
}
@keyframes slideInRight {
0% {
opacity: 0;
transform: translateX(100%);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
@keyframes slideInLeft {
0% {
opacity: 0;
transform: translateX(-100%);
}
100% {
opacity: 1;
transform: translateX(0);
}
} .flickity-prev-next-button {
display: none !important;
} .fall-down {
display: inline-block;
padding-top: 80px; } .slide-in-right,
.slide-in-left {
display: block;
margin: 0;
line-height: 1.4; }