Настоящая любовь всегда творит и никогда не разрушает. И в этом - единственная надежда человека.
Код:
<!--HTML--><style type="text/css">
.regan .alec { width: 450px; height: 80px; background-color: #8593DC; border-bottom: 7px solid #FBCA57; position: relative; top: 0px; left: 0px; opacity: 0; transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s; }
.moretti a:hover { color: #b8c968; }
.regan .anna { width: 150px; padding-top: 5px; padding-bottom: 5px; font-size: 14px; letter-spacing: 2px; color: #fff; text-align: center; text-transform: lowercase; line-height: 100%; font-style: italic; background-color: #FBCA57; font-family: cambria, serif; position: absolute; top: 65px; opacity: 0; transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s;}
.regan { width: 450px; height: 400px; background-color: #fafafa; position: relative; -webkit-box-shadow: 1px 1px 21px 3px rgba(25, 25, 25, 0.30); -moz-box-shadow: 1px 1px 21px 3px rgba(25, 25, 25, 0.30); box-shadow: 1px 1px 21px 3px rgba(25, 25, 25, 0.30); overflow: hidden; }
.regan .img { width: 150px; height: 150px; position: absolute; top: 40px; left: 150px; transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s; z-index: 9; }
.regan:hover .img { top: 10px; z-index: 9;}
.regan:hover .alec { opacity: .99; }
.regan .moretti { width: 400px; height: 200px; padding-right: 5px; bottom: -250px; position: absolute; left: 25px; transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s; overflow: auto; font-family: arial, serif; font-size: 11px; text-align: center; color: #222; line-height: 100%;}
.moretti a { letter-spacing: 2px; font-family: cambria, serif; font-size: 12px; line-height: 100%; text-align: center; text-transform: lowercase; color: #000; font-style: italic; transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s;}
.regan:hover .moretti { bottom: 25px; }
.moretti::-webkit-scrollbar { width: 10px; background-color: #222; border: 4px solid #fafafa; }
.moretti::-webkit-scrollbar-thumb { background-color: #222; border: 3px solid #fafafa; }
.regan:hover .anna { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s; opacity: .99;}
</style>
<center><div class="regan"><div class="img"><div style="width: 150px; height: 150px; border-radius: 100%; background-image: url(http://i69.fastpic.ru/big/2015/0821/25/618c33e3acc89574d6fbfbb865c29925.png);"><a href="http://doortohollywood.rusff.me/"><div class="anna">
<br>
Имя Фамилия [рус.]
</div></a></div></div><div class="alec"></div>
<div class="moretti">
<center>♦ <b>Внешность:</b>имя звезды<br>
♦ <b>Дата рождения:</b> пишем дату рождения <br>
♦ <b>Возраст:</b> ЦИФРА y.o<br>
♦ <b>Место работы:</b> пишем где работает<br>
♦ <b>Должность:</b> его должность<br></center><br>
ЗДЕСЬ ПИШЕМ ВСЕ, ЧТО СЧИТАЕМ НУЖНЫМ! ЧТОБЫ ПЕРЕНЕСТИ СТРОКУ (enter), В КОНЦЕ СТРОЧКИ СТАВИМ <*br>
НЕ ЗАБУДЬТЕ УБРАТЬ ЗВЕЗДОЧКУ<p>
</div></div></center>Код:
[*code]<*!--HTML--><style type="text/css">
.regan .alec { width: 450px; height: 80px; background-color: #8593DC; border-bottom: 7px solid #FBCA57; position: relative; top: 0px; left: 0px; opacity: 0; transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s; }
.moretti a:hover { color: #b8c968; }
.regan .anna { width: 150px; padding-top: 5px; padding-bottom: 5px; font-size: 14px; letter-spacing: 2px; color: #fff; text-align: center; text-transform: lowercase; line-height: 100%; font-style: italic; background-color: #FBCA57; font-family: cambria, serif; position: absolute; top: 65px; opacity: 0; transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s;}
.regan { width: 450px; height: 400px; background-color: #fafafa; position: relative; -webkit-box-shadow: 1px 1px 21px 3px rgba(25, 25, 25, 0.30); -moz-box-shadow: 1px 1px 21px 3px rgba(25, 25, 25, 0.30); box-shadow: 1px 1px 21px 3px rgba(25, 25, 25, 0.30); overflow: hidden; }
.regan .img { width: 150px; height: 150px; position: absolute; top: 40px; left: 150px; transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s; z-index: 9; }
.regan:hover .img { top: 10px; z-index: 9;}
.regan:hover .alec { opacity: .99; }
.regan .moretti { width: 400px; height: 200px; padding-right: 5px; bottom: -250px; position: absolute; left: 25px; transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s; overflow: auto; font-family: arial, serif; font-size: 11px; text-align: center; color: #222; line-height: 100%;}
.moretti a { letter-spacing: 2px; font-family: cambria, serif; font-size: 12px; line-height: 100%; text-align: center; text-transform: lowercase; color: #000; font-style: italic; transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s;}
.regan:hover .moretti { bottom: 25px; }
.moretti::-webkit-scrollbar { width: 10px; background-color: #222; border: 4px solid #fafafa; }
.moretti::-webkit-scrollbar-thumb { background-color: #222; border: 3px solid #fafafa; }
.regan:hover .anna { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transition-duration: .6s; -webkit-transition-duration: .6s; -moz-transition-duration: .6s; -ms-transition-duration: .6s; -o-transition-duration: .6s; opacity: .99;}
</style>
<center><div class="regan"><div class="img"><div style="width: 150px; height: 150px; border-radius: 100%; background-image: url(http://i69.fastpic.ru/big/2015/0821/25/618c33e3acc89574d6fbfbb865c29925.png);"><a href="http://doortohollywood.rusff.me/"><div class="anna">
Имя Фамилия [англ.]<br>
Имя Фамилия [рус.]
</div></a></div></div><div class="alec"></div>
<div class="moretti">
<center>♦ <b>дата рождения:</b> пишем дату рождения <br>
♦ <b>возраст:</b> ЦИФРА y.o<br>
♦ <b>ориентация:</b> пишем ориентацию<br>
♦ <b>профессия:</b> пишем профессию</center><br>
ЗДЕСЬ ПИШЕМ ВСЕ, ЧТО СЧИТАЕМ НУЖНЫМ! ЧТОБЫ ПЕРЕНЕСТИ СТРОКУ (enter), В КОНЦЕ СТРОЧКИ СТАВИМ <*br>
НЕ ЗАБУДЬТЕ УБРАТЬ ЗВЕЗДОЧКУ<p>
</div></div></center>[*/code]










