Код:
<!--HTML--> <script type="text/javascript"> function move(id,spd) { var obj=document.getElementById(id); var max=-obj.offsetHeight+obj.parentNode.offsetHeight; var top=parseInt(obj.style.top); if ((spd>0&&top<=0)||(spd<0&&top>=max)){ obj.style.top=top+spd+"px"; move.to=setTimeout(function(){ move(id,spd); },20); } else obj.style.top=(spd>0?0:max)+"px"; } </script> <style type="text/css"> .bodyov1314 { width: 620px; height: 200; margin-left: -3px; padding-top: 130px; padding-bottom: 30px; display: block; background: url(http://funkyimg.com/i/22WYN.png) top no-repeat, url(http://funkyimg.com/i/22VAY.png) bottom no-repeat, url(http://funkyimg.com/i/22VAZ.png) repeat-y;} </style> <center> <div class="bodyov1314"> <link href='http://fonts.googleapis.com/css?family=Roboto:400,700,700italic' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Lily+Script+One' rel='stylesheet' type='text/css'> <center> <div style="width: 450px; background: #; padding: 20px;"> <div style="font-family: lobster; font-size: 35px; color: #7a3834; margin-left: 163px; line-height: 70%;">Самое романтичное шоу</div> <div style="width: 220px; height: 8px; background: #276043; border-left: 80px solid #b82d26; border-right: 150px solid #4fa379;"></div> <div style="width: 500px; height: auto; font-family: Cuprum; font-size: 14px; line-height: 95%; color: #3b3b3b; overflow: ; text-align: justify; padding-top: 20px; margin-bottom: -15px; margin-left: -30px;"> <center> <font color="#296547">Посвящается всем жителям Чеджу, у которых пока нет второй половинки, но которые мечтают встретить свою ЛЮБОВЬ;3</font></center> <br> <style type='text/css'> .total { position:relative; overflow:hidden; width:450px; height:450px; border:1px solid #eee; } #heart { position: relative; opacity:.9; top:125px; width: 200px; height: 190px; webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; transition:all 1s ease-in-out; } #heart:before, #heart:after { position: absolute; content: ""; left: 100px; top: 0; width: 100px; height: 180px; background: #ffcccc; -moz-border-radius: 100px 100px 0 0; border-radius: 100px 100px 0 0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; -ms-transform-origin: 0 100%; -o-transform-origin: 0 100%; transform-origin: 0 100%; webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; transition:all 1s ease-in-out; } #heart:after { left: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); -webkit-transform-origin: 100% 100%; -moz-transform-origin: 100% 100%; -ms-transform-origin: 100% 100%; -o-transform-origin: 100% 100%; transform-origin :100% 100%; webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; transition:all 1s ease-in-out; } .total:hover #heart { top:0px; width: 450px; height: 450px; webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; transition:all 1s ease-in-out; } .total:hover #heart:before, .total:hover #heart:after { left: 225px; top: 0; width: 225px; height: 450px; background: #fff; -moz-border-radius:0; border-radius:0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transform-origin: 0; -moz-transform-origin: 0; -ms-transform-origin: 0; -o-transform-origin: 0; transform-origin: 0; webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; transition:all 1s ease-in-out; } .total:hover #heart:after { left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transform-origin: 0; -moz-transform-origin: 0; -ms-transform-origin: 0; -o-transform-origin: 0; transform-origin :0; webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; transition:all 1s ease-in-out; } .eclipse { position:absolute; top:50px; left:50px; opacity:0; width:350px; height:350px; font-family:cuprum; text-align:justify; font-size:13px; line-height:100%; color:#222; overflow:auto; webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; transition:all 1s ease-in-out; } .total:hover .eclipse { opacity:1; webkit-transition:all 1s ease-in-out; -moz-transition:all 1s ease-in-out; -o-transition:all 1s ease-in-out; transition:all 1s ease-in-out; transition-delay: .75s; -webkit-transition-delay: .75s; } .of::-webkit-scrollbar {width: 5px;background: #ffcccc;} .of::-webkit-scrollbar-thumb {background: #ffcccc;} .of::-webkit-scrollbar-corner {background: #ffcccc;} </style><center><div class='total' style='background-image:url(http://funkyimg.com/i/22WYK.png);'><div id='heart'></div><div class='eclipse'><div class='of'> <center>Местный телеканал организует первое в Южной Корее <b>рекламное шоу</b>, посвященное отношениям. <br><br>Только жаркие ощущения! <br><br>Только яркие эмоции! <br><br>Организаторы шоу "ОС+" предлагают вам провести незабываемый <b>уикенд-свидание вслепую</b>! Помимо партнера вам будет предложено место проведения свидания, его тематика, будут предоставлены стилисты и всё, что даст вам почувствовать себя <b>настоящим айдолом на шоу We Got Married</b>. <br><br>Заинтригованы? <br><br>А еще, всё это абсолютно <b>бесплатно</b>! Вам будет предоставлено приятное и удобное расписание. Стандартно съемки начинаются в субботу и длятся первую половину дня. Вторая половина дня и ночь - полностью в вашем распоряжении. Во второй день, а именно в воскресенье, съемки проходят вечером, так что утро после ночи тоже полностью ваше. НО! В некоторых случаях график может меняться, всё зависит от ситуации. Но не волнуйтесь, организаторы все заранее согласуют с вами.</center> <br><br><b>Цели шоу:</b> <br>- Показать молодежи идеальные типы свиданий, что-то типа социальной рекламы, которая длится не больше 10 минут, вырезанных и профессионально смонтированных со всего времени съемок пары. Естественно, вырежут только яркие и разрешенные для показа на телевидении моменты вашего свидания. <br>- Скрытая реклама отелей, ресторанов, развлекательных мест, вещей и прочего, что используется во время съемок. <br>- Любовь и счастье жителей родного города ♥ <center><br><br>Но будьте готовы и к тому, что в некоторых случаях бывают и <b>тройные свидания</b>. Операторы вырежут на рекламное шоу только двоих, лучших по совпадению в кадре. Поэтому придется постараться ^^ <br><br>Наверняка вас заинтересовало, что значит <b>"+"</b> в названии шоу. Это говорит о том, что программа рассчитана не только на романтическую линию, но и на <b>дружескую</b>. Два парня и две девушки тоже могут отлично провести время вместе, при этом не сидя за чашкой чая дома. Именно поэтому несколько выпусков рекламы будут посвящены исключительно дружескому времяпровождению. </div></div></div></center> <br> <center><br><br><font color="#e05858" face="lobster">Чтобы записаться на кастинг, достаточно подходить по основным параметрам:</font></center> <br>❥ возраст 18-40 <br>❥ наличие места работы или учебы <br>❥ презентабельный вид <center><br><br><font color="#e05858" face="lobster">... и заполнить небольшую анкету:</font></center> <br>1. Ваше имя. <br>2. Возраст. <br>3. Родной город. <br>4. Место работы или учебы. <br>5. Контактные данные. <br>6. Свидание, дружеская встреча или возможны оба варианта.</div> <br><br><div style="width: 500px; height: auto; font-family: Cuprum; font-size: 12px; line-height: 95%; color: #3b3b3b; overflow: ; text-align: justify; padding-top: 20px; margin-bottom: -15px; margin-left: -30px;"> <center>Пояснение от администрации: <font color="#e05858" face="lobster">важно</font></center> <br>♥ выбираем "свидание", если ваш персонаж гетеро ориентации <br>♥ выбираем "дружеская встреча", если вашего персонажа интересуют только однополые отношения <br>♥ соответственно, "оба варианта" выбирают те, кому все равно, а именно персонажи с ориентацией би <br><br><center><font color="#e05858" face="lobster">Зачем это нужно?</font> Как вы могли догадаться, на шоу не могут пропагандировать однополые отношения. Но мы хотим, чтобы все одинокие форумчане могли при желании поучаствовать в данной "акции". Именно поэтому мы и придумали графу "дружеские встречи", которые вне эфирного времени могут стать совсем не дружескими и дать начало совершенно другим чувствам... ну если вы понимаете, о чем мы;3</center></div> <br><br><div style="width: 500px; height: auto; font-family: lobster; font-size: 14px; line-height: 95%; color: #426348; overflow: ; text-align: justify; padding-top: 20px; margin-bottom: -15px; margin-left: -30px;"> <center><p><br>Не стесняемся - записываемся и приходим на кастинг. <br>Даже если это встреча не станет судьбоносной, вы не пожалеете. <br>Почувствуйте себя айдолами вместе с шоу "Одинокие Сердца +".</center> <br><br><br><br> </div></center>