Как сохранить стили после анимации?

Я работаю над портфолио, чтобы показать его при подаче заявки на следующее исследование. Поскольку мы живем в 2012 году, в нем есть масса причудливой анимации и мусора CSS3, просто чтобы дать им ощущение «Нам нужен этот парень». У меня сейчас небольшая проблема.

Это небольшая часть определенного элемента:

/* This is the CSS of the elements with the id called 'fadein' */
#fadein {
    -moz-animation-duration: 2s;
    -moz-animation-name: item;
    -moz-animation-delay: 4.5s;
    -webkit-animation-duration: 5s;
    -webkit-animation-name: item;
-webkit-animation-delay: 4.5s;
opacity:0;
-webkit-opacity:0;
}

@-webkit-keyframes item {
from {
-webkit-opacity: 0;
     }
to { 
-webkit-opacity: 1;
 }
}

Обратите внимание, что я не учел ключевые кадры Firefox, поскольку они совершенно одинаковы. Верно, некрасиво отформатированный CSS, который заставляет элементы с идентификатором 'fadein' ... исчезать.

Проблема в том, что элементы снова исчезают после завершения анимации. Это превращает некрасиво отформатированный Css в непригодный для использования.

Кто-нибудь знает, как сохранить измененный стиль после анимации?

Думаю, этот вопрос задавался раньше, и мне очень жаль, если так.