Costume halaman error 404

CSS HTML jQuery Trik

404 Adalah Kode Halaman Error yang biasa muncul pada setiap halaman web/blog ketika seorang visitor (pengunjung) mengunjungi url yang tidak ada atau telah di hapus dari web/blog. Nah, kali ini saya ingin berbagi tutorial "Bagaimana Cara Membuat Halaman Error 404" untuk di pasang pada blog sobat dengan sedikit custom dan tambahan jquery.

Untuk sobat yang penasaran bagaimana tampilan halaman 404 yang saya maksud, silahkan lihat Demonya dengan menekan tombol demo di bawah ini :


Keunggulan
  • Responsive
  • Smooth
  • Support CSS3
  • Simple & Fast
  • Menarik dan beda
untuk sobat yang telah menerapkan halaman error 404 tinggal mengganti kode HTMLnya dan CSS dengan HTML dan CSS di bawah ini dan meletakkan jquerynya saja:

untuk yang belum silahkan ikuti langkat penerapannya...

Cara Pemasangan

Langkah 1 - Login Blogger, buka menu Template → Edit HTML lalu simpan kode di bawah ini tepat setelah kode <body> :

1code-line:1-1<b:if cond='data:blog.pageType != &quot;error_page&quot;'> 

Langkah 2 - Simpan kode di bawah ini tepat di atas kode </body> :

1code-line:2-12code-line:2-23code-line:2-34code-line:2-45code-line:2-56code-line:2-67code-line:2-78code-line:2-89code-line:2-910code-line:2-1011code-line:2-1112code-line:2-1213code-line:2-1314code-line:2-1415code-line:2-1516code-line:2-1617code-line:2-1718code-line:2-1819code-line:2-1920code-line:2-2021code-line:2-2122code-line:2-2223code-line:2-2324code-line:2-2425code-line:2-2526code-line:2-2627code-line:2-2728code-line:2-2829code-line:2-2930code-line:2-3031code-line:2-3132code-line:2-3233code-line:2-3334code-line:2-3435code-line:2-3536code-line:2-3637code-line:2-3738code-line:2-3839code-line:2-3940code-line:2-4041code-line:2-4142code-line:2-4243code-line:2-4344code-line:2-4445code-line:2-4546code-line:2-4647code-line:2-4748code-line:2-4849code-line:2-4950code-line:2-5051code-line:2-5152code-line:2-5253code-line:2-5354code-line:2-5455code-line:2-5556code-line:2-5657code-line:2-5758code-line:2-5859code-line:2-5960code-line:2-6061code-line:2-6162code-line:2-6263code-line:2-6364code-line:2-6465code-line:2-6566code-line:2-6667code-line:2-6768code-line:2-6869code-line:2-6970code-line:2-7071code-line:2-7172code-line:2-7273code-line:2-7374code-line:2-7475code-line:2-7576code-line:2-7677code-line:2-7778code-line:2-7879code-line:2-7980code-line:2-8081code-line:2-8182code-line:2-8283code-line:2-8384code-line:2-8485code-line:2-8586code-line:2-8687code-line:2-8788code-line:2-8889code-line:2-8990code-line:2-9091code-line:2-9192code-line:2-9293code-line:2-9394code-line:2-9495code-line:2-9596code-line:2-9697code-line:2-9798code-line:2-9899code-line:2-99100code-line:2-100101code-line:2-101102code-line:2-102103code-line:2-103104code-line:2-104105code-line:2-105106code-line:2-106107code-line:2-107108code-line:2-108109code-line:2-109110code-line:2-110111code-line:2-111112code-line:2-112113code-line:2-113114code-line:2-114115code-line:2-115116code-line:2-116117code-line:2-117118code-line:2-118119code-line:2-119120code-line:2-120121code-line:2-121122code-line:2-122123code-line:2-123124code-line:2-124125code-line:2-125126code-line:2-126127code-line:2-127128code-line:2-128129code-line:2-129130code-line:2-130131code-line:2-131132code-line:2-132133code-line:2-133134code-line:2-134135code-line:2-135136code-line:2-136137code-line:2-137138code-line:2-138139code-line:2-139140code-line:2-140141code-line:2-141142code-line:2-142143code-line:2-143144code-line:2-144145code-line:2-145146code-line:2-146147code-line:2-147148code-line:2-148149code-line:2-149150code-line:2-150151code-line:2-151152code-line:2-152153code-line:2-153154code-line:2-154155code-line:2-155156code-line:2-156157code-line:2-157158code-line:2-158159code-line:2-159160code-line:2-160161code-line:2-161162code-line:2-162163code-line:2-163164code-line:2-164165code-line:2-165166code-line:2-166167code-line:2-167168code-line:2-168169code-line:2-169170code-line:2-170171code-line:2-171172code-line:2-172173code-line:2-173174code-line:2-174175code-line:2-175176code-line:2-176177code-line:2-177178code-line:2-178179code-line:2-179180code-line:2-180181code-line:2-181182code-line:2-182183code-line:2-183184code-line:2-184185code-line:2-185186code-line:2-186187code-line:2-187188code-line:2-188189code-line:2-189190code-line:2-190191code-line:2-191192code-line:2-192193code-line:2-193194code-line:2-194195code-line:2-195196code-line:2-196197code-line:2-197198code-line:2-198199code-line:2-199200code-line:2-200201code-line:2-201202code-line:2-202203code-line:2-203204code-line:2-204205code-line:2-205206code-line:2-206207code-line:2-207208code-line:2-208209code-line:2-209210code-line:2-210211code-line:2-211212code-line:2-212213code-line:2-213214code-line:2-214215code-line:2-215216code-line:2-216217code-line:2-217218code-line:2-218219code-line:2-219220code-line:2-220221code-line:2-221222code-line:2-222223code-line:2-223224code-line:2-224225code-line:2-225226code-line:2-226227code-line:2-227228code-line:2-228229code-line:2-229230code-line:2-230231code-line:2-231232code-line:2-232233code-line:2-233234code-line:2-234235code-line:2-235236code-line:2-236237code-line:2-237238code-line:2-238239code-line:2-239240code-line:2-240241code-line:2-241242code-line:2-242243code-line:2-243244code-line:2-244245code-line:2-245246code-line:2-246247code-line:2-247248code-line:2-248249code-line:2-249250code-line:2-250251code-line:2-251252code-line:2-252253code-line:2-253254code-line:2-254255code-line:2-255256code-line:2-256257code-line:2-257258code-line:2-258259code-line:2-259260code-line:2-260261code-line:2-261262code-line:2-262263code-line:2-263264code-line:2-264265code-line:2-265266code-line:2-266267code-line:2-267268code-line:2-268269code-line:2-269270code-line:2-270271code-line:2-271272code-line:2-272273code-line:2-273274code-line:2-274275code-line:2-275276code-line:2-276277code-line:2-277278code-line:2-278279code-line:2-279280code-line:2-280281code-line:2-281282code-line:2-282283code-line:2-283284code-line:2-284285code-line:2-285286code-line:2-286287code-line:2-287288code-line:2-288289code-line:2-289290code-line:2-290291code-line:2-291292code-line:2-292293code-line:2-293294code-line:2-294295code-line:2-295296code-line:2-296297code-line:2-297298code-line:2-298299code-line:2-299300code-line:2-300301code-line:2-301302code-line:2-302303code-line:2-303304code-line:2-304305code-line:2-305306code-line:2-306307code-line:2-307308code-line:2-308309code-line:2-309310code-line:2-310311code-line:2-311312code-line:2-312313code-line:2-313314code-line:2-314315code-line:2-315316code-line:2-316317code-line:2-317318code-line:2-318319code-line:2-319320code-line:2-320321code-line:2-321322code-line:2-322323code-line:2-323324code-line:2-324325code-line:2-325326code-line:2-326327code-line:2-327328code-line:2-328329code-line:2-329330code-line:2-330331code-line:2-331332code-line:2-332333code-line:2-333334code-line:2-334335code-line:2-335336code-line:2-336337code-line:2-337338code-line:2-338339code-line:2-339340code-line:2-340341code-line:2-341342code-line:2-342343code-line:2-343344code-line:2-344345code-line:2-345346code-line:2-346347code-line:2-347348code-line:2-348349code-line:2-349350code-line:2-350351code-line:2-351352code-line:2-352353code-line:2-353354code-line:2-354355code-line:2-355356code-line:2-356357code-line:2-357358code-line:2-358359code-line:2-359360code-line:2-360361code-line:2-361362code-line:2-362363code-line:2-363364code-line:2-364365code-line:2-365366code-line:2-366367code-line:2-367368code-line:2-368369code-line:2-369370code-line:2-370371code-line:2-371372code-line:2-372373code-line:2-373374code-line:2-374375code-line:2-375376code-line:2-376377code-line:2-377378code-line:2-378379code-line:2-379380code-line:2-380381code-line:2-381382code-line:2-382383code-line:2-383384code-line:2-384385code-line:2-385386code-line:2-386387code-line:2-387388code-line:2-388389code-line:2-389390code-line:2-390391code-line:2-391392code-line:2-392393code-line:2-393394code-line:2-394395code-line:2-395396code-line:2-396397code-line:2-397398code-line:2-398399code-line:2-399400code-line:2-400401code-line:2-401402code-line:2-402403code-line:2-403404code-line:2-404405code-line:2-405406code-line:2-406407code-line:2-407408code-line:2-408409code-line:2-409410code-line:2-410411code-line:2-411412code-line:2-412413code-line:2-413414code-line:2-414415code-line:2-415416code-line:2-416417code-line:2-417418code-line:2-418419code-line:2-419420code-line:2-420421code-line:2-421422code-line:2-422423code-line:2-423424code-line:2-424425code-line:2-425426code-line:2-426427code-line:2-427428code-line:2-428429code-line:2-429430code-line:2-430431code-line:2-431432code-line:2-432433code-line:2-433434code-line:2-434435code-line:2-435436code-line:2-436437code-line:2-437438code-line:2-438439code-line:2-439440code-line:2-440441code-line:2-441442code-line:2-442443code-line:2-443444code-line:2-444445code-line:2-445446code-line:2-446447code-line:2-447448code-line:2-448449code-line:2-449450code-line:2-450451code-line:2-451452code-line:2-452453code-line:2-453454code-line:2-454455code-line:2-455456code-line:2-456457code-line:2-457458code-line:2-458459code-line:2-459460code-line:2-460461code-line:2-461462code-line:2-462463code-line:2-463464code-line:2-464465code-line:2-465466code-line:2-466467code-line:2-467468code-line:2-468469code-line:2-469470code-line:2-470471code-line:2-471472code-line:2-472473code-line:2-473474code-line:2-474475code-line:2-475476code-line:2-476477code-line:2-477478code-line:2-478479code-line:2-479480code-line:2-480481code-line:2-481482code-line:2-482483code-line:2-483484code-line:2-484485code-line:2-485486code-line:2-486487code-line:2-487488code-line:2-488489code-line:2-489490code-line:2-490491code-line:2-491492code-line:2-492493code-line:2-493494code-line:2-494495code-line:2-495496code-line:2-496497code-line:2-497498code-line:2-498499code-line:2-499500code-line:2-500501code-line:2-501502code-line:2-502503code-line:2-503504code-line:2-504505code-line:2-505506code-line:2-506507code-line:2-507508code-line:2-508509code-line:2-509510code-line:2-510511code-line:2-511512code-line:2-512513code-line:2-513514code-line:2-514515code-line:2-515516code-line:2-516517code-line:2-517518code-line:2-518519code-line:2-519520code-line:2-520521code-line:2-521522code-line:2-522523code-line:2-523524code-line:2-524525code-line:2-525526code-line:2-526527code-line:2-527528code-line:2-528529code-line:2-529530code-line:2-530531code-line:2-531532code-line:2-532533code-line:2-533534code-line:2-534535code-line:2-535536code-line:2-536537code-line:2-537538code-line:2-538539code-line:2-539540code-line:2-540541code-line:2-541542code-line:2-542543code-line:2-543544code-line:2-544545code-line:2-545546code-line:2-546547code-line:2-547548code-line:2-548549code-line:2-549550code-line:2-550551code-line:2-551552code-line:2-552553code-line:2-553554code-line:2-554555code-line:2-555556code-line:2-556557code-line:2-557558code-line:2-558559code-line:2-559560code-line:2-560561code-line:2-561562code-line:2-562563code-line:2-563564code-line:2-564565code-line:2-565566code-line:2-566567code-line:2-567568code-line:2-568569code-line:2-569570code-line:2-570571code-line:2-571572code-line:2-572573code-line:2-573574code-line:2-574575code-line:2-575576code-line:2-576577code-line:2-577578code-line:2-578579code-line:2-579580code-line:2-580581code-line:2-581582code-line:2-582583code-line:2-583584code-line:2-584585code-line:2-585586code-line:2-586587code-line:2-587588code-line:2-588589code-line:2-589590code-line:2-590591code-line:2-591592code-line:2-592593code-line:2-593594code-line:2-594595code-line:2-595596code-line:2-596597code-line:2-597598code-line:2-598599code-line:2-599600code-line:2-600601code-line:2-601602code-line:2-602603code-line:2-603604code-line:2-604605code-line:2-605606code-line:2-606607code-line:2-607608code-line:2-608609code-line:2-609610code-line:2-610611code-line:2-611612code-line:2-612613code-line:2-613614code-line:2-614615code-line:2-615616code-line:2-616617code-line:2-617618code-line:2-618619code-line:2-619620code-line:2-620621code-line:2-621622code-line:2-622623code-line:2-623624code-line:2-624625code-line:2-625626code-line:2-626627code-line:2-627628code-line:2-628629code-line:2-629630code-line:2-630631code-line:2-631632code-line:2-632633code-line:2-633634code-line:2-634635code-line:2-635636code-line:2-636637code-line:2-637638code-line:2-638639code-line:2-639640code-line:2-640641code-line:2-641642code-line:2-642643code-line:2-643644code-line:2-644645code-line:2-645646code-line:2-646647code-line:2-647648code-line:2-648649code-line:2-649650code-line:2-650651code-line:2-651652code-line:2-652653code-line:2-653654code-line:2-654655code-line:2-655656code-line:2-656657code-line:2-657658code-line:2-658659code-line:2-659660code-line:2-660661code-line:2-661662code-line:2-662663code-line:2-663664code-line:2-664665code-line:2-665666code-line:2-666667code-line:2-667668code-line:2-668669code-line:2-669670code-line:2-670671code-line:2-671672code-line:2-672673code-line:2-673674code-line:2-674675code-line:2-675676code-line:2-676677code-line:2-677678code-line:2-678679code-line:2-679680code-line:2-680681code-line:2-681682code-line:2-682683code-line:2-683684code-line:2-684685code-line:2-685686code-line:2-686687code-line:2-687688code-line:2-688689code-line:2-689690code-line:2-690691code-line:2-691692code-line:2-692693code-line:2-693694code-line:2-694695code-line:2-695696code-line:2-696697code-line:2-697698code-line:2-698699code-line:2-699700code-line:2-700701code-line:2-701702code-line:2-702703code-line:2-703704code-line:2-704705code-line:2-705706code-line:2-706707code-line:2-707708code-line:2-708709code-line:2-709710code-line:2-710711code-line:2-711712code-line:2-712713code-line:2-713714code-line:2-714715code-line:2-715716code-line:2-716717code-line:2-717718code-line:2-718719code-line:2-719720code-line:2-720721code-line:2-721722code-line:2-722723code-line:2-723724code-line:2-724725code-line:2-725726code-line:2-726727code-line:2-727728code-line:2-728729code-line:2-729730code-line:2-730731code-line:2-731732code-line:2-732733code-line:2-733734code-line:2-734735code-line:2-735736code-line:2-736737code-line:2-737738code-line:2-738739code-line:2-739740code-line:2-740741code-line:2-741742code-line:2-742743code-line:2-743744code-line:2-744745code-line:2-745746code-line:2-746747code-line:2-747748code-line:2-748749code-line:2-749750code-line:2-750751code-line:2-751752code-line:2-752753code-line:2-753754code-line:2-754755code-line:2-755756code-line:2-756757code-line:2-757758code-line:2-758759code-line:2-759760code-line:2-760761code-line:2-761762code-line:2-762763code-line:2-763764code-line:2-764765code-line:2-765766code-line:2-766767code-line:2-767768code-line:2-768769code-line:2-769770code-line:2-770771code-line:2-771772code-line:2-772773code-line:2-773774code-line:2-774775code-line:2-775776code-line:2-776777code-line:2-777778code-line:2-778779code-line:2-779780code-line:2-780781code-line:2-781782code-line:2-782783code-line:2-783784code-line:2-784785code-line:2-785786code-line:2-786787code-line:2-787788code-line:2-788789code-line:2-789790code-line:2-790791code-line:2-791792code-line:2-792793code-line:2-793794code-line:2-794795code-line:2-795796code-line:2-796797code-line:2-797798code-line:2-798799code-line:2-799800code-line:2-800801code-line:2-801802code-line:2-802803code-line:2-803804code-line:2-804805code-line:2-805806code-line:2-806807code-line:2-807808code-line:2-808809code-line:2-809810code-line:2-810811code-line:2-811812code-line:2-812813code-line:2-813814code-line:2-814815code-line:2-815816code-line:2-816817code-line:2-817818code-line:2-818819code-line:2-819820code-line:2-820821code-line:2-821822code-line:2-822823code-line:2-823824code-line:2-824825code-line:2-825826code-line:2-826827code-line:2-827828code-line:2-828829code-line:2-829830code-line:2-830831code-line:2-831832code-line:2-832833code-line:2-833834code-line:2-834835code-line:2-835836code-line:2-836837code-line:2-837838code-line:2-838839code-line:2-839840code-line:2-840841code-line:2-841842code-line:2-842843code-line:2-843844code-line:2-844845code-line:2-845846code-line:2-846847code-line:2-847848code-line:2-848849code-line:2-849850code-line:2-850851code-line:2-851852code-line:2-852853code-line:2-853854code-line:2-854855code-line:2-855856code-line:2-856857code-line:2-857858code-line:2-858859code-line:2-859860code-line:2-860861code-line:2-861862code-line:2-862863code-line:2-863864code-line:2-864865code-line:2-865866code-line:2-866867code-line:2-867868code-line:2-868869code-line:2-869870code-line:2-870871code-line:2-871872code-line:2-872873code-line:2-873874code-line:2-874875code-line:2-875876code-line:2-876877code-line:2-877878code-line:2-878879code-line:2-879880code-line:2-880881code-line:2-881882code-line:2-882883code-line:2-883884code-line:2-884885code-line:2-885886code-line:2-886887code-line:2-887888code-line:2-888889code-line:2-889</b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='error-page'>
<!-- Halaman Error -->
<div class='error-404'>
<span class='ref-0' data-delay='282'></span>
<span class='ref-1' data-delay='340'></span>
<span class='ref-2' data-delay='0'></span>
<span class='ref-3' data-delay='4'></span>
<span class='ref-4' data-delay='381'></span>
<span class='ref-5' data-delay='485'></span>
<span class='ref-6' data-delay='5'></span>
<span class='ref-7' data-delay='437'></span>
<span class='ref-8' data-delay='15'></span>
<span class='blank ref-9'></span>
<span class='ref-10' data-delay='339'></span>
<span class='ref-11' data-delay='468'></span>
<span class='ref-12' data-delay='601'></span>
<span class='ref-13' data-delay='55'></span>
<span class='ref-14' data-delay='224'></span>
<span class='ref-15' data-delay='385'></span>
<span class='ref-16' data-delay='2'></span>
<span class='ref-17' data-delay='1'></span>
<span class='blank ref-18'></span>
<span class='blank ref-19'></span>
<span class='ref-20' data-delay='28'></span>
<span class='ref-21' data-delay='132'></span>
<span class='ref-22' data-delay='327'></span>
<span class='ref-23' data-delay='285'></span>
<span class='ref-24' data-delay='74'></span>
<span class='ref-25' data-delay='3'></span>
<span class='ref-26' data-delay='611'></span>
<span class='ref-27' data-delay='50'></span>
<span class='blank ref-28'></span>
<span class='blank ref-29'></span>
<span class='blank ref-30'></span>
<span class='ref-31' data-delay='289'></span>
<span class='ref-32' data-delay='139'></span>
<span class='ref-33' data-delay='29'></span>
<span class='ref-34' data-delay='57'></span>
<span class='ref-35' data-delay='94'></span>
<span class='ref-36' data-delay='133'></span>
<span class='ref-37' data-delay='161'></span>
<span class='blank ref-38'></span>
<span class='blank ref-39'></span>
<span class='ref-40' data-delay='257'></span>
<span class='ref-41' data-delay='286'></span>
<span class='ref-42' data-delay='335'></span>
<span class='ref-43' data-delay='359'></span>
<span class='ref-44' data-delay='382'></span>
<span class='ref-45' data-delay='424'></span>
<span class='ref-46' data-delay='459'></span>
<span class='ref-47' data-delay='486'></span>
<span class='blank ref-48'></span>
<span class='blank ref-49'></span>
<span class='blank ref-50'></span>
<span class='blank ref-51'></span>
<span class='blank ref-52'></span>
<span class='blank ref-53'></span>
<span class='blank ref-54'></span>
<span class='ref-55' data-delay='344'></span>
<span class='ref-56' data-delay='39'></span>
<span class='ref-57' data-delay='75'></span>
<span class='ref-58' data-delay='124'></span>
<span class='ref-59' data-delay='160'></span>
<span class='blank ref-60'></span>
<span class='blank ref-61'></span>
<span class='blank ref-62'></span>
<span class='ref-63' data-delay='328'></span>
<span class='ref-64' data-delay='358'></span>
<span class='ref-65' data-delay='383'></span>
<span class='ref-66' data-delay='438'></span>
<span class='ref-67' data-delay='471'></span>
<span class='ref-68' data-delay='514'></span>
<span class='blank ref-69'></span>
<span class='blank ref-70'></span>
<span class='blank ref-71'></span>
<span class='blank ref-72'></span>
<span class='blank ref-73'></span>
<span class='ref-74' data-delay='67'></span>
<span class='ref-75' data-delay='44'></span>
<span class='ref-76' data-delay='93'></span>
<span class='ref-77' data-delay='145'></span>
<span class='ref-78' data-delay='191'></span>
<span class='blank ref-79'></span>
<span class='ref-80' data-delay='506'></span>
<span class='ref-81' data-delay='241'></span>
<span class='ref-82' data-delay='373'></span>
<span class='ref-83' data-delay='423'></span>
<span class='ref-84' data-delay='469'></span>
<span class='ref-85' data-delay='517'></span>
<span class='ref-86' data-delay='555'></span>
<span class='ref-87' data-delay='602'></span>
<span class='ref-88' data-delay='89'></span>
<span class='blank ref-89'></span>
<span class='ref-90' data-delay='70'></span>
<span class='ref-91' data-delay='56'></span>
<span class='ref-92' data-delay='122'></span>
<span class='ref-93' data-delay='180'></span>
<span class='ref-94' data-delay='225'></span>
<span class='ref-95' data-delay='284'></span>
<span class='ref-96' data-delay='349'></span>
<span class='ref-97' data-delay='386'></span>
<span class='ref-98' data-delay='458'></span>
<span class='blank ref-99'></span>
<span class='ref-100' data-delay='558'></span>
<span class='ref-101' data-delay='612'></span>
<span class='ref-102' data-delay='337'></span>
<span class='ref-103' data-delay='157'></span>
<span class='ref-104' data-delay='51'></span>
<span class='ref-105' data-delay='131'></span>
<span class='ref-106' data-delay='197'></span>
<span class='ref-107' data-delay='256'></span>
<span class='ref-108' data-delay='334'></span>
<span class='blank ref-109'></span>
<span class='ref-110' data-delay='466'></span>
<span class='ref-111' data-delay='530'></span>
<span class='ref-112' data-delay='582'></span>
<span class='ref-113' data-delay='251'></span>
<span class='ref-114' data-delay='564'></span>
<span class='ref-115' data-delay='62'></span>
<span class='ref-116' data-delay='151'></span>
<span class='ref-117' data-delay='219'></span>
<span class='ref-118' data-delay='311'></span>
<span class='blank ref-119'></span>
<span class='ref-120' data-delay='476'></span>
<span class='ref-121' data-delay='539'></span>
<span class='ref-122' data-delay='618'></span>
<span class='ref-123' data-delay='164'></span>
<span class='ref-124' data-delay='37'></span>
<span class='ref-125' data-delay='159'></span>
<span class='ref-126' data-delay='250'></span>
<span class='ref-127' data-delay='356'></span>
<span class='ref-128' data-delay='444'></span>
<span class='blank ref-129'></span>
<span class='blank ref-130'></span>
<span class='blank ref-131'></span>
<span class='blank ref-132'></span>
<span class='blank ref-133'></span>
<span class='ref-134' data-delay='346'></span>
<span class='ref-135' data-delay='454'></span>
<span class='ref-136' data-delay='568'></span>
<span class='ref-137' data-delay='10'></span>
<span class='ref-138' data-delay='72'></span>
<span class='ref-139' data-delay='206'></span>
<span class='blank ref-140'></span>
<span class='blank ref-141'></span>
<span class='ref-142' data-delay='608'></span>
<span class='ref-143' data-delay='85'></span>
<span class='ref-144' data-delay='187'></span>
<span class='ref-145' data-delay='371'></span>
<span class='ref-146' data-delay='527'></span>
<span class='ref-147' data-delay='364'></span>
<span class='ref-148' data-delay='143'></span>
<span class='ref-149' data-delay='324'></span>
<span class='blank ref-150'></span>
<span class='blank ref-151'></span>
<span class='blank ref-152'></span>
<span class='ref-153' data-delay='484'></span>
<span class='ref-154' data-delay='166'></span>
<span class='ref-155' data-delay='280'></span>
<span class='ref-156' data-delay='579'></span>
<span class='ref-157' data-delay='116'></span>
<span class='ref-158' data-delay='436'></span>
<span class='blank ref-159'></span>
<span class='ref-160' data-delay='347'></span>
<span class='ref-161' data-delay='350'></span>
<span class='ref-162' data-delay='193'></span>
<span class='ref-163' data-delay='599'></span>
<span class='ref-164' data-delay='420'></span>
<span class='ref-165' data-delay='11'></span>
<span class='ref-166' data-delay='176'></span>
<span class='ref-167' data-delay='27'></span>
<span class='ref-168' data-delay='626'></span>
<span class='blank ref-169'></span>
<span class='ref-170' data-delay='14'></span>
<span class='ref-171' data-delay='22'></span>
<span class='ref-172' data-delay='117'></span>
<span class='ref-173' data-delay='325'></span>
<span class='ref-174' data-delay='445'></span>
<span class='ref-175' data-delay='221'></span>
<span class='ref-176' data-delay='351'></span>
<span class='ref-177' data-delay='425'></span>
<span class='ref-178' data-delay='23'></span>
<span class='blank ref-179'></span>
<span class='ref-180' data-delay='542'></span>
<span class='ref-181' data-delay='507'></span>
<span class='ref-182' data-delay='202'></span>
<span class='ref-183' data-delay='332'></span>
<span class='ref-184' data-delay='209'></span>
<span class='ref-185' data-delay='616'></span>
<span class='ref-186' data-delay='248'></span>
<span class='ref-187' data-delay='214'></span>
<span class='ref-188' data-delay='263'></span>
<span class='blank ref-189'></span>
<span class='ref-190' data-delay='559'></span>
<span class='ref-191' data-delay='294'></span>
<span class='ref-192' data-delay='502'></span>
<span class='ref-193' data-delay='30'></span>
<span class='ref-194' data-delay='38'></span>
<span class='ref-195' data-delay='42'></span>
<span class='ref-196' data-delay='45'></span>
<span class='ref-197' data-delay='52'></span>
<span class='ref-198' data-delay='58'></span>
<span class='blank ref-199'></span>
<span class='ref-200' data-delay='73'></span>
<span class='ref-201' data-delay='76'></span>
<span class='ref-202' data-delay='90'></span>
<span class='ref-203' data-delay='95'></span>
<span class='ref-204' data-delay='103'></span>
<span class='ref-205' data-delay='118'></span>
<span class='ref-206' data-delay='123'></span>
<span class='ref-207' data-delay='125'></span>
<span class='ref-208' data-delay='134'></span>
<span class='blank ref-209'></span>
<span class='blank ref-210'></span>
<span class='blank ref-211'></span>
<span class='blank ref-212'></span>
<span class='blank ref-213'></span>
<span class='ref-214' data-delay='177'></span>
<span class='ref-215' data-delay='181'></span>
<span class='ref-216' data-delay='189'></span>
<span class='ref-217' data-delay='192'></span>
<span class='ref-218' data-delay='198'></span>
<span class='ref-219' data-delay='200'></span>
<span class='blank ref-220'></span>
<span class='blank ref-221'></span>
<span class='ref-222' data-delay='220'></span>
<span class='ref-223' data-delay='226'></span>
<span class='ref-224' data-delay='229'></span>
<span class='ref-225' data-delay='230'></span>
<span class='ref-226' data-delay='242'></span>
<span class='ref-227' data-delay='252'></span>
<span class='ref-228' data-delay='258'></span>
<span class='ref-229' data-delay='267'></span>
<span class='blank ref-230'></span>
<span class='blank ref-231'></span>
<span class='blank ref-232'></span>
<span class='ref-233' data-delay='287'></span>
<span class='ref-234' data-delay='307'></span>
<span class='ref-235' data-delay='312'></span>
<span class='ref-236' data-delay='326'></span>
<span class='ref-237' data-delay='329'></span>
<span class='ref-238' data-delay='336'></span>
<span class='blank ref-239'></span>
<span class='ref-240' data-delay='144'></span>
<span class='ref-241' data-delay='147'></span>
<span class='ref-242' data-delay='357'></span>
<span class='blank ref-243'></span>
<span class='blank ref-244'></span>
<span class='blank ref-245'></span>
<span class='blank ref-246'></span>
<span class='blank ref-247'></span>
<span class='blank ref-248'></span>
<span class='blank ref-249'></span>
<span class='ref-250' data-delay='387'></span>
<span class='ref-251' data-delay='406'></span>
<span class='ref-252' data-delay='421'></span>
<span class='blank ref-253'></span>
<span class='blank ref-254'></span>
<span class='blank ref-255'></span>
<span class='ref-256' data-delay='446'></span>
<span class='ref-257' data-delay='455'></span>
<span class='ref-258' data-delay='460'></span>
<span class='blank ref-259'></span>
<span class='ref-260' data-delay='470'></span>
<span class='ref-261 nf' data-delay='472'></span>
<span class='ref-262' data-delay='477'></span>
<span class='blank ref-263'></span>
<span class='blank ref-264 nf'></span>
<span class='blank ref-265'></span>
<span class='ref-266' data-delay='513'></span>
<span class='ref-267 nf' data-delay='515'></span>
<span class='ref-268 nf' data-delay='518'></span>
<span class='blank ref-269'></span>
<span class='ref-270' data-delay='532'></span>
<span class='ref-271 nf' data-delay='536'></span>
<span class='ref-272 nf' data-delay='540'></span>
<span class='blank ref-273 nf'></span>
<span class='blank ref-274'></span>
<span class='blank ref-275'></span>
<span class='ref-276 nf' data-delay='562'></span>
<span class='ref-277 nf' data-delay='569'></span>
<span class='ref-278 nf' data-delay='580'></span>
<span class='blank ref-279'></span>
<span class='ref-280' data-delay='583'></span>
<span class='ref-281 nf' data-delay='600'></span>
<span class='ref-282 nf' data-delay='603'></span>
<span class='blank ref-283'></span>
<span class='blank ref-284'></span>
<span class='blank ref-285 nf'></span>
<span class='ref-286' data-delay='620'></span>
<span class='ref-287' data-delay='13'></span>
<span class='ref-288 nf' data-delay='41'></span>
<span class='blank ref-289'></span>
<span class='blank ref-290 nf'></span>
<span class='blank ref-291'></span>
<span class='blank ref-292'></span>
<span class='ref-293 nf' data-delay='461'></span>
<span class='ref-294' data-delay='53'></span>
<span class='ref-295 nf' data-delay='440'></span>
<span class='ref-296 nf' data-delay='585'></span>
<span class='ref-297 nf' data-delay='12'></span>
<span class='ref-298' data-delay='376'></span>
<span class='ref-299' data-delay='246'></span>
<span class='blank ref-300'></span>
<span class='blank ref-301'></span>
<span class='ref-302' data-delay='19'></span>
<span class='ref-303' data-delay='523'></span>
<span class='ref-304' data-delay='109'></span>
<span class='blank ref-305'></span>
<span class='blank ref-306'></span>
<span class='ref-307' data-delay='31'></span>
<span class='ref-308' data-delay='43'></span>
<span class='ref-309' data-delay='46'></span>
<span class='blank ref-310'></span>
<span class='blank ref-311'></span>
<span class='ref-312' data-delay='63'></span>
<span class='ref-313' data-delay='77'></span>
<span class='ref-314' data-delay='92'></span>
<span class='ref-315' data-delay='96'></span>
<span class='ref-316' data-delay='104'></span>
<span class='ref-317' data-delay='120'></span>
<span class='ref-318' data-delay='126'></span>
<span class='blank ref-319'></span>
<span class='ref-320' data-delay='576'></span>
<span class='ref-321' data-delay='113'></span>
<span class='ref-322' data-delay='152'></span>
<span class='ref-323' data-delay='162'></span>
<span class='ref-324' data-delay='178'></span>
<span class='ref-325' data-delay='182'></span>
<span class='ref-326' data-delay='190'></span>
<span class='ref-327' data-delay='194'></span>
<span class='ref-328' data-delay='201'></span>
<span class='blank ref-329'></span>
<span class='ref-330' data-delay='213'></span>
<span class='ref-331' data-delay='222'></span>
<span class='ref-332' data-delay='227'></span>
<span class='ref-333' data-delay='231'></span>
<span class='ref-334' data-delay='243'></span>
<span class='ref-335' data-delay='253'></span>
<span class='ref-336' data-delay='259'></span>
<span class='ref-337' data-delay='269'></span>
<span class='ref-338' data-delay='281'></span>
<span class='blank ref-339'></span>
<span class='ref-340' data-delay='288'></span>
<span class='ref-341 nf' data-delay='308'></span>
<span class='ref-342 nf' data-delay='313'></span>
<span class='ref-343' data-delay='330'></span>
<span class='ref-344 nf' data-delay='338'></span>
<span class='ref-345' data-delay='341'></span>
<span class='ref-346 nf' data-delay='348'></span>
<span class='ref-347' data-delay='352'></span>
<span class='ref-348' data-delay='360'></span>
<span class='blank ref-349 nf'></span>
<span class='ref-350' data-delay='372'></span>
<span class='ref-351' data-delay='374'></span>
<span class='ref-352 nf' data-delay='379'></span>
<span class='blank ref-353'></span>
<span class='blank ref-354'></span>
<span class='blank ref-355'></span>
<span class='ref-356 nf' data-delay='422'></span>
<span class='ref-357' data-delay='426'></span>
<span class='ref-358' data-delay='439'></span>
<span class='blank ref-359'></span>
<span class='ref-360 nf' data-delay='456'></span>
<span class='ref-361' data-delay='462'></span>
<span class='ref-362' data-delay='467'></span>
<span class='ref-363 nf' data-delay='473'></span>
<span class='ref-364' data-delay='478'></span>
<span class='ref-365 nf' data-delay='487'></span>
<span class='ref-366' data-delay='495'></span>
<span class='ref-367' data-delay='509'></span>
<span class='ref-368 nf' data-delay='516'></span>
<span class='blank ref-369'></span>
<span class='blank ref-370 nf'></span>
<span class='blank ref-371 nf'></span>
<span class='blank ref-372'></span>
<span class='ref-373 nf' data-delay='541'></span>
<span class='ref-374' data-delay='554'></span>
<span class='ref-375 nf' data-delay='556'></span>
<span class='blank ref-376'></span>
<span class='ref-377' data-delay='570'></span>
<span class='ref-378 nf' data-delay='581'></span>
<span class='ref-379' data-delay='584'></span>
<span class='blank ref-380'></span>
<span class='blank ref-381'></span>
<span class='ref-382' data-delay='609'></span>
<span class='ref-383' data-delay='614'></span>
<span class='ref-384' data-delay='621'></span>
<span class='blank ref-385'></span>
<span class='blank ref-386'></span>
<span class='ref-387' data-delay='188'></span>
<span class='ref-388' data-delay='512'></span>
<span class='ref-389' data-delay='268'></span>
<span class='blank ref-390'></span>
<span class='blank ref-391'></span>
<span class='ref-392' data-delay='463'></span>
<span class='ref-393' data-delay='17'></span>
<span class='ref-394' data-delay='448'></span>
<span class='blank ref-395'></span>
<span class='ref-396' data-delay='20'></span>
<span class='ref-397' data-delay='353'></span>
<span class='ref-398' data-delay='573'></span>
<span class='blank ref-399'></span>
<span class='ref-400' data-delay='278'></span>
<span class='ref-401' data-delay='33'></span>
<span class='ref-402' data-delay='32'></span>
<span class='ref-403' data-delay='47'></span>
<span class='ref-404' data-delay='54'></span>
<span class='ref-405' data-delay='59'></span>
<span class='ref-406' data-delay='64'></span>
<span class='ref-407' data-delay='78'></span>
<span class='ref-408' data-delay='97'></span>
<span class='blank ref-409'></span>
<span class='ref-410' data-delay='121'></span>
<span class='ref-411' data-delay='128'></span>
<span class='ref-412' data-delay='135'></span>
<span class='ref-413' data-delay='148'></span>
<span class='ref-414' data-delay='154'></span>
<span class='ref-415' data-delay='163'></span>
<span class='ref-416' data-delay='179'></span>
<span class='ref-417' data-delay='183'></span>
<span class='ref-418' data-delay='195'></span>
<span class='blank ref-419'></span>
<span class='ref-420' data-delay='207'></span>
<span class='ref-421 nf' data-delay='216'></span>
<span class='ref-422' data-delay='223'></span>
<span class='ref-423 nf' data-delay='232'></span>
<span class='ref-424 nf' data-delay='245'></span>
<span class='ref-425' data-delay='254'></span>
<span class='ref-426 nf' data-delay='260'></span>
<span class='ref-427' data-delay='271'></span>
<span class='ref-428' data-delay='283'></span>
<span class='blank ref-429 nf'></span>
<span class='ref-430' data-delay='309'></span>
<span class='ref-431' data-delay='315'></span>
<span class='ref-432 nf' data-delay='331'></span>
<span class='blank ref-433'></span>
<span class='blank ref-434'></span>
<span class='blank ref-435'></span>
<span class='ref-436 nf' data-delay='361'></span>
<span class='ref-437 nf' data-delay='365'></span>
<span class='ref-438 nf' data-delay='375'></span>
<span class='blank ref-439'></span>
<span class='ref-440 nf' data-delay='384'></span>
<span class='ref-441' data-delay='388'></span>
<span class='ref-442' data-delay='407'></span>
<span class='ref-443 nf' data-delay='427'></span>
<span class='ref-444' data-delay='441'></span>
<span class='ref-445 nf' data-delay='447'></span>
<span class='ref-446' data-delay='457'></span>
<span class='ref-447' data-delay='464'></span>
<span class='ref-448 nf' data-delay='474'></span>
<span class='blank ref-449'></span>
<span class='blank ref-450 nf'></span>
<span class='blank ref-451'></span>
<span class='ref-452 nf' data-delay='510'></span>
<span class='ref-453 nf' data-delay='519'></span>
<span class='ref-454' data-delay='528'></span>
<span class='ref-455 nf' data-delay='533'></span>
<span class='blank ref-456'></span>
<span class='ref-457' data-delay='543'></span>
<span class='ref-458 nf' data-delay='557'></span>
<span class='ref-459' data-delay='563'></span>
<span class='blank ref-460'></span>
<span class='blank ref-461'></span>
<span class='ref-462' data-delay='586'></span>
<span class='ref-463' data-delay='604'></span>
<span class='ref-464' data-delay='610'></span>
<span class='blank ref-465'></span>
<span class='blank ref-466'></span>
<span class='ref-467' data-delay='538'></span>
<span class='ref-468' data-delay='199'></span>
<span class='ref-469' data-delay='531'></span>
<span class='blank ref-470'></span>
<span class='ref-471' data-delay='508'></span>
<span class='ref-472' data-delay='127'></span>
<span class='ref-473' data-delay='48'></span>
<span class='ref-474' data-delay='488'></span>
<span class='blank ref-475'></span>
<span class='ref-476' data-delay='100'></span>
<span class='ref-477' data-delay='408'></span>
<span class='ref-478' data-delay='319'></span>
<span class='blank ref-479'></span>
<span class='ref-480' data-delay='218'></span>
<span class='ref-481' data-delay='233'></span>
<span class='ref-482' data-delay='49'></span>
<span class='ref-483' data-delay='60'></span>
<span class='ref-484' data-delay='65'></span>
<span class='ref-485' data-delay='82'></span>
<span class='ref-486' data-delay='98'></span>
<span class='ref-487' data-delay='105'></span>
<span class='ref-488' data-delay='130'></span>
<span class='blank ref-489'></span>
<span class='ref-490' data-delay='149'></span>
<span class='ref-491' data-delay='155'></span>
<span class='ref-492' data-delay='165'></span>
<span class='ref-493' data-delay='184'></span>
<span class='ref-494' data-delay='196'></span>
<span class='ref-495' data-delay='203'></span>
<span class='ref-496' data-delay='208'></span>
<span class='ref-497' data-delay='217'></span>
<span class='blank ref-498'></span>
<span class='blank ref-499'></span>
<span class='ref-500' data-delay='255'></span>
<span class='ref-501 nf' data-delay='261'></span>
<span class='ref-502' data-delay='272'></span>
<span class='ref-503' data-delay='290'></span>
<span class='ref-504 nf' data-delay='310'></span>
<span class='ref-505' data-delay='316'></span>
<span class='ref-506 nf' data-delay='333'></span>
<span class='ref-507' data-delay='342'></span>
<span class='blank ref-508'></span>
<span class='blank ref-509 nf'></span>
<span class='ref-510' data-delay='366'></span>
<span class='ref-511' data-delay='377'></span>
<span class='ref-512 nf' data-delay='380'></span>
<span class='blank ref-513'></span>
<span class='blank ref-514'></span>
<span class='blank ref-515'></span>
<span class='ref-516 nf' data-delay='442'></span>
<span class='ref-517' data-delay='449'></span>
<span class='ref-518' data-delay='465'></span>
<span class='blank ref-519'></span>
<span class='ref-520 nf' data-delay='479'></span>
<span class='ref-521' data-delay='489'></span>
<span class='ref-522' data-delay='496'></span>
<span class='ref-523 nf' data-delay='520'></span>
<span class='ref-524' data-delay='529'></span>
<span class='ref-525 nf' data-delay='534'></span>
<span class='ref-526' data-delay='537'></span>
<span class='ref-527' data-delay='545'></span>
<span class='blank ref-528 nf'></span>
<span class='blank ref-529'></span>
<span class='blank ref-530 nf'></span>
<span class='blank ref-531'></span>
<span class='ref-532' data-delay='605'></span>
<span class='ref-533 nf' data-delay='615'></span>
<span class='ref-534' data-delay='623'></span>
<span class='ref-535 nf' data-delay='36'></span>
<span class='ref-536' data-delay='228'></span>
<span class='ref-537' data-delay='561'></span>
<span class='ref-538 nf' data-delay='553'></span>
<span class='ref-539' data-delay='153'></span>
<span class='ref-540' data-delay='81'></span>
<span class='blank ref-541'></span>
<span class='ref-542' data-delay='497'></span>
<span class='ref-543' data-delay='491'></span>
<span class='ref-544' data-delay='390'></span>
<span class='blank ref-545'></span>
<span class='blank ref-546'></span>
<span class='ref-547' data-delay='34'></span>
<span class='ref-548' data-delay='61'></span>
<span class='ref-549' data-delay='66'></span>
<span class='blank ref-550'></span>
<span class='ref-551' data-delay='99'></span>
<span class='ref-552' data-delay='106'></span>
<span class='ref-553' data-delay='137'></span>
<span class='ref-554' data-delay='150'></span>
<span class='ref-555' data-delay='156'></span>
<span class='ref-556' data-delay='167'></span>
<span class='ref-557' data-delay='185'></span>
<span class='ref-558' data-delay='204'></span>
<span class='ref-559' data-delay='210'></span>
<span class='ref-560' data-delay='453'></span>
<span class='ref-561' data-delay='619'></span>
<span class='ref-562' data-delay='247'></span>
<span class='blank ref-563'></span>
<span class='blank ref-564'></span>
<span class='blank ref-565'></span>
<span class='blank ref-566'></span>
<span class='blank ref-567'></span>
<span class='blank ref-568'></span>
<span class='blank ref-569'></span>
<span class='ref-570' data-delay='362'></span>
<span class='ref-571' data-delay='367'></span>
<span class='ref-572' data-delay='378'></span>
<span class='blank ref-573'></span>
<span class='blank ref-574'></span>
<span class='ref-575' data-delay='428'></span>
<span class='ref-576' data-delay='443'></span>
<span class='ref-577' data-delay='450'></span>
<span class='ref-578' data-delay='475'></span>
<span class='blank ref-579'></span>
<span class='ref-580' data-delay='490'></span>
<span class='ref-581 nf' data-delay='498'></span>
<span class='ref-582' data-delay='521'></span>
<span class='blank ref-583'></span>
<span class='blank ref-584 nf'></span>
<span class='ref-585' data-delay='546'></span>
<span class='ref-586' data-delay='565'></span>
<span class='ref-587 nf' data-delay='571'></span>
<span class='ref-588 nf' data-delay='587'></span>
<span class='blank ref-589'></span>
<span class='ref-590' data-delay='617'></span>
<span class='ref-591' data-delay='624'></span>
<span class='ref-592 nf' data-delay='355'></span>
<span class='blank ref-593'></span>
<span class='blank ref-594'></span>
<span class='blank ref-595'></span>
<span class='ref-596 nf' data-delay='129'></span>
<span class='ref-597' data-delay='544'></span>
<span class='ref-598' data-delay='547'></span>
<span class='blank ref-599'></span>
<span class='ref-600' data-delay='276'></span>
<span class='ref-601 nf' data-delay='172'></span>
<span class='ref-602 nf' data-delay='35'></span>
<span class='blank ref-603'></span>
<span class='blank ref-604'></span>
<span class='ref-605' data-delay='101'></span>
<span class='ref-606 nf' data-delay='107'></span>
<span class='ref-607 nf' data-delay='138'></span>
<span class='ref-608' data-delay='158'></span>
<span class='blank ref-609'></span>
<span class='blank ref-610 nf'></span>
<span class='blank ref-611'></span>
<span class='ref-612' data-delay='211'></span>
<span class='ref-613 nf' data-delay='234'></span>
<span class='ref-614' data-delay='249'></span>
<span class='ref-615 nf' data-delay='262'></span>
<span class='ref-616 nf' data-delay='273'></span>
<span class='ref-617 nf' data-delay='291'></span>
<span class='ref-618' data-delay='317'></span>
<span class='ref-619' data-delay='343'></span>
<span class='ref-620' data-delay='354'></span>
<span class='blank ref-621'></span>
<span class='ref-622' data-delay='368'></span>
<span class='ref-623' data-delay='389'></span>
<span class='ref-624' data-delay='409'></span>
<span class='blank ref-625'></span>
<span class='blank ref-626'></span>
<span class='ref-627' data-delay='451'></span>
<span class='ref-628' data-delay='480'></span>
<span class='ref-629' data-delay='492'></span>
<span class='blank ref-630'></span>
<span class='ref-631' data-delay='522'></span>
<span class='ref-632' data-delay='535'></span>
<span class='ref-633' data-delay='548'></span>
<span class='ref-634' data-delay='566'></span>
<span class='ref-635' data-delay='572'></span>
<span class='ref-636' data-delay='589'></span>
<span class='ref-637' data-delay='606'></span>
<span class='ref-638' data-delay='625'></span>
<span class='ref-639' data-delay='613'></span>
<span class='ref-640' data-delay='141'></span>
<span class='ref-641' data-delay='168'></span>
<span class='ref-642' data-delay='215'></span>
<span class='ref-643' data-delay='622'></span>
<span class='ref-644' data-delay='588'></span>
<span class='ref-645' data-delay='550'></span>
<span class='ref-646' data-delay='392'></span>
<span class='ref-647' data-delay='394'></span>
<span class='ref-648' data-delay='68'></span>
<span class='blank ref-649'></span>
<span class='ref-650' data-delay='102'></span>
<span class='ref-651' data-delay='108'></span>
<span class='ref-652' data-delay='140'></span>
<span class='blank ref-653'></span>
<span class='blank ref-654'></span>
<span class='blank ref-655'></span>
<span class='ref-656' data-delay='212'></span>
<span class='ref-657' data-delay='235'></span>
<span class='ref-658' data-delay='264'></span>
<span class='blank ref-659'></span>
<span class='ref-660' data-delay='292'></span>
<span class='ref-661' data-delay='318'></span>
<span class='ref-662' data-delay='345'></span>
<span class='blank ref-663'></span>
<span class='blank ref-664'></span>
<span class='blank ref-665'></span>
<span class='ref-666' data-delay='410'></span>
<span class='ref-667' data-delay='429'></span>
<span class='ref-668' data-delay='452'></span>
<span class='blank ref-669'></span>
<span class='ref-670' data-delay='493'></span>
<span class='ref-671' data-delay='499'></span>
<span class='ref-672' data-delay='524'></span>
<span class='ref-673' data-delay='549'></span>
<span class='ref-674' data-delay='567'></span>
<span class='ref-675' data-delay='574'></span>
<span class='ref-676' data-delay='590'></span>
<span class='ref-677' data-delay='607'></span>
<span class='ref-678' data-delay='71'></span>
<span class='blank ref-679'></span>
<span class='ref-680' data-delay='511'></span>
<span class='ref-681' data-delay='244'></span>
<span class='ref-682' data-delay='560'></span>
<span class='blank ref-683'></span>
<span class='blank ref-684'></span>
<span class='blank ref-685'></span>
<span class='ref-686' data-delay='69'></span>
<span class='ref-687' data-delay='83'></span>
<span class='ref-688' data-delay='110'></span>
<span class='blank ref-689'></span>
<span class='blank ref-690'></span>
<span class='blank ref-691'></span>
<span class='ref-692' data-delay='205'></span>
<span class='ref-693' data-delay='236'></span>
<span class='ref-694' data-delay='265'></span>
<span class='ref-695' data-delay='274'></span>
<span class='ref-696' data-delay='293'></span>
<span class='ref-697' data-delay='320'></span>
<span class='ref-698' data-delay='363'></span>
<span class='ref-699' data-delay='369'></span>
<span class='ref-700' data-delay='391'></span>
<span class='blank ref-701'></span>
<span class='ref-702' data-delay='430'></span>
<span class='ref-703' data-delay='481'></span>
<span class='ref-704' data-delay='494'></span>
<span class='ref-705' data-delay='500'></span>
<span class='ref-706' data-delay='525'></span>
<span class='ref-707' data-delay='551'></span>
<span class='ref-708' data-delay='575'></span>
<span class='ref-709' data-delay='591'></span>
<span class='blank ref-710'></span>
<span class='ref-711' data-delay='21'></span>
<span class='ref-712' data-delay='9'></span>
<span class='ref-713' data-delay='270'></span>
<span class='ref-714' data-delay='80'></span>
<span class='ref-715' data-delay='79'></span>
<span class='ref-716' data-delay='593'></span>
<span class='ref-717' data-delay='25'></span>
<span class='ref-718' data-delay='84'></span>
<span class='ref-719' data-delay='111'></span>
<span class='ref-720' data-delay='115'></span>
<span class='ref-721' data-delay='173'></span>
<span class='ref-722' data-delay='186'></span>
<span class='ref-723' data-delay='237'></span>
<span class='ref-724' data-delay='266'></span>
<span class='ref-725' data-delay='275'></span>
<span class='ref-726' data-delay='295'></span>
<span class='ref-727' data-delay='321'></span>
<span class='ref-728' data-delay='370'></span>
<span class='blank ref-729'></span>
<span class='ref-730' data-delay='411'></span>
<span class='ref-731' data-delay='431'></span>
<span class='ref-732' data-delay='482'></span>
<span class='blank ref-733'></span>
<span class='blank ref-734'></span>
<span class='blank ref-735'></span>
<span class='ref-736' data-delay='577'></span>
<span class='ref-737' data-delay='592'></span>
<span class='ref-738' data-delay='526'></span>
<span class='blank ref-739'></span>
<span class='ref-740' data-delay='314'></span>
<span class='ref-741' data-delay='18'></span>
<span class='ref-742' data-delay='24'></span>
<span class='blank ref-743'></span>
<span class='blank ref-744'></span>
<span class='blank ref-745'></span>
<span class='ref-746' data-delay='142'></span>
<span class='ref-747' data-delay='169'></span>
<span class='ref-748' data-delay='238'></span>
<span class='blank ref-749'></span>
<span class='ref-750' data-delay='277'></span>
<span class='ref-751' data-delay='296'></span>
<span class='ref-752' data-delay='322'></span>
<span class='ref-753' data-delay='393'></span>
<span class='ref-754' data-delay='412'></span>
<span class='ref-755' data-delay='432'></span>
<span class='ref-756' data-delay='483'></span>
<span class='ref-757' data-delay='501'></span>
<span class='ref-758' data-delay='552'></span>
<span class='blank ref-759'></span>
<span class='ref-760' data-delay='594'></span>
<span class='ref-761' data-delay='323'></span>
<span class='ref-762' data-delay='16'></span>
<span class='blank ref-763'></span>
<span class='blank ref-764'></span>
<span class='blank ref-765'></span>
<span class='ref-766' data-delay='86'></span>
<span class='ref-767' data-delay='112'></span>
<span class='ref-768' data-delay='170'></span>
<span class='blank ref-769'></span>
<span class='blank ref-770'></span>
<span class='blank ref-771'></span>
<span class='blank ref-772'></span>
<span class='blank ref-773'></span>
<span class='blank ref-774'></span>
<span class='blank ref-775'></span>
<span class='blank ref-776'></span>
<span class='ref-777' data-delay='503'></span>
<span class='ref-778' data-delay='578'></span>
<span class='ref-779' data-delay='595'></span>
<span class='blank ref-780'></span>
<span class='blank ref-781'></span>
<span class='ref-782' data-delay='136'></span>
<span class='ref-783' data-delay='415'></span>
<span class='ref-784' data-delay='87'></span>
<span class='ref-785' data-delay='114'></span>
<span class='ref-786' data-delay='171'></span>
<span class='ref-787' data-delay='239'></span>
<span class='ref-788' data-delay='279'></span>
<span class='ref-789' data-delay='297'></span>
<span class='blank ref-790'></span>
<span class='blank ref-791'></span>
<span class='blank ref-792'></span>
<span class='blank ref-793'></span>
<span class='blank ref-794'></span>
<span class='blank ref-795'></span>
<span class='ref-796' data-delay='435'></span>
<span class='ref-797' data-delay='91'></span>
<span class='ref-798' data-delay='174'></span>
<span class='blank ref-799'></span>
<span class='ref-800' data-delay='40'></span>
<span class='ref-801' data-delay='240'></span>
<span class='ref-802' data-delay='298'></span>
<span class='ref-803' data-delay='395'></span>
<span class='ref-804' data-delay='413'></span>
<span class='ref-805' data-delay='433'></span>
<span class='ref-806' data-delay='434'></span>
<span class='ref-807' data-delay='504'></span>
<span class='ref-808' data-delay='596'></span>
<span class='blank ref-809'></span>
<span class='ref-810' data-delay='119'></span>
<span class='ref-811' data-delay='417'></span>
<span class='ref-812' data-delay='88'></span>
<span class='blank ref-813'></span>
<span class='blank ref-814'></span>
<span class='blank ref-815'></span>
<span class='ref-816' data-delay='396'></span>
<span class='ref-817' data-delay='414'></span>
<span class='ref-818' data-delay='505'></span>
<span class='blank ref-819'></span>
<span class='ref-820' data-delay='6'></span>
<span class='ref-821' data-delay='146'></span>
<span class='ref-822' data-delay='300'></span>
<span class='blank ref-823'></span>
<span class='blank ref-824'></span>
<span class='blank ref-825'></span>
<span class='ref-826' data-delay='397'></span>
<span class='ref-827' data-delay='416'></span>
<span class='ref-828' data-delay='597'></span>
<span class='blank ref-829'></span>
<span class='blank ref-830'></span>
<span class='ref-831' data-delay='302'></span>
<span class='ref-832' data-delay='175'></span>
<span class='ref-833' data-delay='299'></span>
<span class='ref-834' data-delay='398'></span>
<span class='ref-835' data-delay='418'></span>
<span class='ref-836' data-delay='598'></span>
<span class='ref-837' data-delay='7'></span>
<span class='blank ref-838'></span>
<span class='blank ref-839'></span>
<span class='ref-840' data-delay='301'></span>
<span class='ref-841' data-delay='399'></span>
<span class='ref-842' data-delay='419'></span>
<span class='blank ref-843'></span>
<span class='blank ref-844'></span>
<span class='blank ref-845'></span>
<span class='ref-846' data-delay='303'></span>
<span class='ref-847' data-delay='400'></span>
<span class='ref-848' data-delay='8'></span>
<span class='blank ref-849'></span>
<span class='blank ref-850'></span>
<span class='blank ref-851'></span>
<span class='blank ref-852'></span>
<span class='blank ref-853'></span>
<span class='blank ref-854'></span>
<span class='blank ref-855'></span>
<span class='blank ref-856'></span>
<span class='ref-857' data-delay='26'></span>
<span class='ref-858' data-delay='304'></span>
<span class='ref-859' data-delay='401'></span>
<span class='blank ref-860'></span>
<span class='blank ref-861'></span>
<span class='blank ref-862'></span>
<span class='ref-863' data-delay='305'></span>
<span class='ref-864' data-delay='402'></span>
<span class='ref-865' data-delay='306'></span>
<span class='ref-866' data-delay='403'></span>
<span class='ref-867' data-delay='404'></span>
<span class='ref-868' data-delay='627'></span>
<span class='blank ref-869'></span>
<span class='blank ref-870'></span>
<span class='blank ref-871'></span>
<span class='blank ref-872'></span>
<span class='blank ref-873'></span>
<span class='blank ref-874'></span>
<span class='blank ref-875'></span>
<span class='ref-876' data-delay='628'></span>
<span class='ref-877' data-delay='405'></span>
<span class='ref-878' data-delay='629'></span>
<span class='blank ref-879'></span>
</div>
<!-- #404 -->
</div>
</b:if>

Langkah 3 - letakkan kode di bawah ini tepat di atas kode </style> atau css di blog sobat :

1code-line:3-12code-line:3-23code-line:3-34code-line:3-45code-line:3-56code-line:3-67code-line:3-78code-line:3-89code-line:3-910code-line:3-1011code-line:3-1112code-line:3-1213code-line:3-1314code-line:3-1415code-line:3-1516code-line:3-1617code-line:3-1718code-line:3-1819code-line:3-1920code-line:3-2021code-line:3-2122code-line:3-2223code-line:3-2324code-line:3-2425code-line:3-2526code-line:3-2627code-line:3-2728code-line:3-2829code-line:3-2930code-line:3-3031code-line:3-3132code-line:3-3233code-line:3-3334code-line:3-3435code-line:3-3536code-line:3-3637code-line:3-3738code-line:3-3839code-line:3-3940code-line:3-4041code-line:3-4142code-line:3-4243code-line:3-4344code-line:3-44#error-page{background-color:#0f0f0f;position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;-webkit-box-shadow:inset 0 2px 5px black,inset 0 2px 10px black;-moz-box-shadow:inset 0 2px 5px black,inset 0 2px 10px black;box-shadow:inset 0 2px 5px black,inset 0 2px 10px black}
.error-404{
     width:800px;
     height:110px;
     position:absolute;
     top:50%;left:50%;
     margin:-55px auto auto -400px;overflow:hidden
}
.error-404 span{
     display:block;
     float:left;
     width:9px;
     height:9px;
     margin:0 1px 1px 0;
     background-color:darkred;opacity:0
}
.error-404 .blank{
     background:none
}
.error-404 .blank.nf-text{
     background-color:darkred
}

@media (max-width:800px){
  .error-404{
     width:400px;
     height:55px;
     margin:-28px auto auto -200px
     }

  .error-404 span{
     width:4px;height:4px
     }
}
@media (max-width:400px){
   .error-404{
     width:240px;
     height:33px;
     margin:-17px auto auto -120px
     }
   .error-404 span{
     width:2px;height:2px
     }
}

Langkah 4 - Simpan kode di bawah ini tepat di atas kode </body> :

1code-line:4-12code-line:4-23code-line:4-34code-line:4-45code-line:4-56code-line:4-67code-line:4-78code-line:4-89code-line:4-9<script type='text/javascript'>
(function(d){
   var e=d(window),c=d(".error-404 span"),b=d(".error-404 span[data-delay]"),a=b.length;c.css("opacity",0);
     e.on("load",function(){b.each(function(){var f=d(this),g=parseInt(f.data("delay"),10);
     setTimeout(function(){f.animate({opacity:1},600)},g*50)});
     setTimeout(function(){c.each(function(f){if(!d(this).attr("data-delay")){d(this).attr("data-delay",f)}var g=d(this),h=parseInt(g.data("delay"),10);
     setTimeout(function(){if(g.hasClass("nf")){g.addClass("nf-text").animate({opacity:1},800)}else{g.animate({opacity:0.02},800)}},h*10)})},(a*50)+1000)})})
(jQuery);
</script>

Terakhir - Simpan Template!

Untuk mencoba tinggal tuliskan http://nama-blog-sobat.blogspot.com/404 ( ganti nama-blog-sobat dengan alamat blog sobat )

Pastikan pada template blog sobat di atas kode <head> sudah terpasang jquery library seperti <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/> atau versi terbaru lainnya.

Selesai, sekian saja tentang custome halaman error 404 bloggernya Semoga Bermanfaat!

Artikel Terkait

  • :before dan :after Elemen Pseudo pada Sidebar
    Ini adalah metode lain menggunakan properti :before dan :after dan akan bekerja tanpa masalah di browser apapun, termasuk IE8. trik ini akan membagi bar header sidenar ke kiri dan kanan bagian, di mana kiri akan berisi judul dan kanan link terkait. Ide menghasilkan Adobe ini sebenarnya dibahas oleh css-trik yang disesuaikan dengan Blogger. …
  • Membuat link berefek Nudge
    Dengan semakin berkembangnya jQuery dan CSS3 para blogger terus menciptakan hal baru yang terbilang menarik, salah satunya adalan link nudge ini. Link nudge adalah link yang berefek ketika mouse menyorotinya maka link tersebut akan bergeser. trik ini banyak di gunakan para blogger tidak terkecuali juga oleh master taufik nurohman, di bawah ini…
  • Memahami CSS dan Penerapan CSS pada HTML
    Css sendiri berfungsi untuk mendesain tampilan/layout agar terlihat lebih indah dan berkualitas.selain itu css juga dapat meringkas kode-kode yang di gunakan pada template anda dan tentunya anda pun akan sedikit menggunakan kode kode pada blog. CSS adalah singkatan dari Cascading Style Sheets CSS digunakan untuk mendesain tampilan dari html,…
  • Efek shadow dengan css :before :after pseudo-elemen
    Dalam tutorial ini kita akan menciptakan kotak dengan efek bayangan hanya dengan CSS. Kita akan menggunakan CSS shadow properti yang merupakan salah satu properti CSS favorit saya yang akan Anda lihat dalam tutorial ini dan betapa mudahnya Anda dapat menggunakannya untuk kreasi anda sendiri. Properti box-shadow memungkinkan Anda untuk dengan…
  • CSS untuk Contact form di blogger/blogspot
    Sebelumnya saya telam memposting "Cara memasang widget contact form di blogger" dan "Memasang widget contact form di halaman statis blogger". kali ini saya akan membagi tiga css yang berbeda untuk formulir kontak widget blogger anda dan bagaimana cara menggunakannya, langsung saja... 01CSS form contact #1 /*---- Custom Blogger Contact…
  • Blockquote yang membuka otomatis di posting
    Dengan memanfaatkan css transisi dan css pseudo classes kita coba untuk membuat blockuote yang akan terbuka dengan sendirinya ketika pointer di arahkan ke area elemen blockquote tersebut. trik ini sendiri sebenarna lebih cenderung seperti efek hover, dan tidak menggunakan javasript atau pun jQuery di dalam cara kerjanya. jika anda ingin tau cob…

Tidak ada komentar :

Kode klik emo: :) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT

Back to Top
Loading...