@keyframes shake {
    0%,
    100% {
        transform: translateX(0);
    }
    25%,
    75% {
        transform: translateX(7px);
    }
    50% {
        transform: translateX(-7px);
    }
}

.error-message {
    color: red;
    animation: shake 0.5s ease-in-out 1.5;
}

#threeLines {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3 !important; /* number of lines to show */
    line-clamp: 3 !important;
    -webkit-box-orient: vertical;
}

.threeLines {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3 !important; /* number of lines to show */
    line-clamp: 3 !important;
    -webkit-box-orient: vertical;
}

#twoLines {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2 !important; /* number of lines to show */
    line-clamp: 2 !important;
    -webkit-box-orient: vertical;
}

.twoLines {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2 !important; /* number of lines to show */
    line-clamp: 2 !important;
    -webkit-box-orient: vertical;
}