jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.

jsperf.com URLs are mirrored at the same path, e.g:

https://jsperf.com/negative-modulo/2

Can be accessed at:

https://jsperf.app/negative-modulo/2

cleanmyjquery

Benchmark created by Suresh Pattu on December 21, 2011

Description

i want to clean my jquery code with browser compatibility

Test runner

Ready to run.

Test Ops/sec

myfirst

Testing in
Test	Ops/sec
myfirst	< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < html > < head > < meta http - equiv = "Content-type" content = "text/html; charset=utf-8" / > < link href = "https://docs.google.com/static/spreadsheets/client/css/744745208-embedded_form_compiled.css" type = "text/css" rel = "stylesheet" > < link href = "includes/style.css" rel = "stylesheet" type = "text/css" / > < link media = "screen" rel = "stylesheet" href = "../css/colorbox.css" / > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" > < /script> <script src="js/jquery.colorbox.js "></script> <script> var $dr = jQuery.noConflict(); $dr(document).ready(function(){ //Examples of how to assign the ColorBox event to elements $dr(".group1 ").colorbox({rel:'group1'}); $dr(".group2 ").colorbox({rel:'group2', transition:" fade "}); $dr(".group3 ").colorbox({rel:'group3', transition:" none ", width:" 75 % ", height:" 75 % "}); $dr(".group4 ").colorbox({rel:'group4', slideshow:true}); $dr(".ajax ").colorbox(); $dr(".youtube ").colorbox({iframe:true, innerWidth:425, innerHeight:344}); $dr(".iframe ").colorbox({iframe:true, width:" 80 % ", height:" 80 % "}); $dr(".inline ").colorbox({inline:true, width:" 70 % "}); $dr(".callbacks ").colorbox({ onOpen:function(){ alert('onOpen: colorbox is about to open'); }, onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); }, onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); }, onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); }, onClosed:function(){ alert('onClosed: colorbox has completely closed'); } }); //Example of preserving a JavaScript event for inline calls. $dr("#click ").click(function(){ $('#click').css({" background - color ":"#f00 ", " color ":"#fff ", " cursor ":" inherit "}).text(" Open this window again and this message will still be here."); return false; }); }); </script> <title>Rang De Christmas Campaign.</title> <style type=" text / css " > body{background: #000;} #wrapper{width:920px;margin:0 auto;} #header{background: #000 url(images/christmas/background_image.png)repeat-y scroll left top;text-align:center;} #header h1{padding-top:125px;font-family: Arial, " MS Trebuchet ", sans-serif;color:white;} #body{background-color:#efefef;height:500px;} #nav{height:35px;background-color: #111;} #form_back{padding:100px 0px 0px 40px;} input[type=" text "]{margin-bottom:7px;box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:15px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important;} input::-webkit-input-placeholder { color: red;} input::-webkit-input-placeholder { color: #090;opacity:0.5;} #tt {position:absolute; display:block; } #tttop {display:block; height:5px; margin-left:5px; overflow:hidden} #ttcont {display:block;z-index:115; /background:#fff url(arrow_left.gif) top left no-repeat;/padding:2px 12px 3px 7px; margin-left:5px; border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;margin:10px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; color:#000;} #ttbot {display:block; height:5px; margin-left:5px; overflow:hidden} #bell{cursor:pointer;} #img_back{float:right;height:430px;} #tree_back{z-index:99;} #light1{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;} #light2{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light3{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light4{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light5{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:220px;position:absolute;} #light6{height:18px;width:30px;background:url(images/christmas/gifts.png) -0px -70px no-repeat;top:-420px;left:190px;position:absolute;} #light7{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-40px;left:260px;position:absolute;} #light8{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:100px;position:absolute;} #light9{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-140px;left:120px;position:absolute;} #light10{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:200px;position:absolute;} #light11{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:300px;position:absolute;} #light12{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:240px;position:absolute;} #light13{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:340px;position:absolute;} #light14{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-150px;left:240px;position:absolute;} #light15{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-230px;left:260px;position:absolute;} #light16{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-367px;left:190px;position:absolute;} #light17{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-230px;left:100px;position:absolute;} #light18{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:130px;position:absolute;} #light19{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-10px;left:60px;position:absolute;} #light20{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:200px;position:absolute;} #light21{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:170px;position:absolute;} #light22{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-120px;left:50px;position:absolute;} #light23{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-210px;left:150px;position:absolute;} #light24{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-190px;left:80px;position:absolute;} #light25{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-70px;left:70px;position:absolute;} #light26{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:330px;position:absolute;} #light27{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-150px;left:330px;position:absolute;} #light28{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-190px;left:330px;position:absolute;} #light29{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -105px no-repeat;top:-420px;left:250px;position:absolute;} #light30{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:250px;position:absolute;} #light31{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-184px;left:250px;position:absolute;} #light32{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-70px;left:200px;position:absolute;} #light33{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:140px;position:absolute;} #light34{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:140px;position:absolute;} #light35{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:83px;position:absolute;} #light36{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:270px;position:absolute;} #light37{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:270px;position:absolute;} #light38{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:320px;position:absolute;} #light39{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-120px;left:270px;position:absolute;} #light40{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-230px;left:200px;position:absolute;} #light41{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:200px;position:absolute;} #light42{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:200px;position:absolute;} #light43{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-490px;left:200px;position:absolute;} #light44{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:230px;position:absolute;} #light45{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-40px;left:100px;position:absolute;} #light46{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-173px;left:130px;position:absolute;} #light47{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-120px;left:230px;position:absolute;} #light48{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-109px;left:350px;position:absolute;} #light49{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-240px;left:130px;position:absolute;} #light50{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-190px;left:170px;position:absolute;} #light51{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-260px;left:250px;position:absolute;} #light52{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:290px;position:absolute;} #light53{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:330px;position:absolute;} #light54{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:70px;position:absolute;} #light55{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;} #light56{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;} #light57{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:270px;position:absolute;} #light58{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:355px;position:absolute;} #light59{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-169px;left:310px;position:absolute;} #light60{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:150px;position:absolute;} #light61{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-370px;left:290px;position:absolute;} #light62{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-450px;left:230px;position:absolute;} #light63{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:160px;position:absolute;} #light64{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:80px;position:absolute;} #light65{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:350px;position:absolute;} #light66{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-70px;left:180px;position:absolute;} #light67{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-30px;left:80px;position:absolute;} #light68{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:300px;position:absolute;} #light69{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:60px;position:absolute;} #light70{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-40px;left:300px;position:absolute;} #light71{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-100px;left:300px;position:absolute;} #light72{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:150px;position:absolute;} #light73{height:18px;width:30px;background: url(images/christmas/gifts.png) -0px -70px no-repeat;top:-380px;left:180px;position:absolute;} #light74{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:120px;position:absolute;} #light75{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-180px;left:200px;position:absolute;} #light76{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-220px;left:280px;position:absolute;} #light77{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-125px;left:300px;position:absolute;} #light78{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:240px;position:absolute;} #light79{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-120px;left:120px;position:absolute;} #light80{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-50px;left:50px;position:absolute;} #light81{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-410px;left:240px;position:absolute;} #light82{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-70px;left:110px;position:absolute;} #light83{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:190px;position:absolute;} #light84{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:130px;position:absolute;} #light85{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-280px;left:190px;position:absolute;} #light86{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-90px;left:90px;position:absolute;} #light87{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-130px;left:90px;position:absolute;} #light88{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:270px;position:absolute;} #light89{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-130px;left:200px;position:absolute;} #light90{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:150px;position:absolute;} #light91{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light92{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light93{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light94{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light95{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light96{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light97{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light98{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light99{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} /pink-ball: url(images/christmas/gifts.png) -37px -30px no-repeat orange-ball url(images/christmas/gifts.png) 0px -31px no-repeat zepra-gift-box url(images/christmas/gifts.png) 0px 0px no-repeat blue-giftbox url(images/christmas/gifts.png) -0px -70px no-repeat pink-gift-box url(images/christmas/gifts.png) -43px -70px no-repeat blue-ball url(images/christmas/gifts.png) -81px -37px no-repeat dark-orangeball url(images/christmas/gifts.png) -119px -35px no-repeat red-gift-box url(images/christmas/gifts.png) -81px -0px no-repeat star url(images/christmas/gifts.png) -40px -0px no-repeat / #details ul{padding:20px 0px 20px 20px; list-style:circle; color:#F09;} #details h3.sub-heading{ color:#F60;padding:0px !important;} #details ul li span{color:#404040;} #thankyoubox{box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:12px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important; width:250px;height:300px; text-align:left !important;} #lights{position:relative;left:0px;top:-400px;opacity:0.7;} #lights p{margin:0px;z-index:100;} .dispalynone{display:none;} html div.ss-legal{ display:none !important;} #footer_text{ background:url(images/christmas/footer_background.png) no-repeat; height:250px;z-index:0;} #footer_text img{padding-top:200px;} #ss-form{z-index:99;} input[type=submit]{ background:url(images/christmas/Christmas_bell.png) no-repeat; width:150px;height:150px;border:none;} #ss-form{background:none;box-shadow:0px 0px 10px #fff;box-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10p;border:1px solid #fff; -webkit-box-shadow:0px 0px 10px #fff;-moz-box-shadow:0px 0px 10px #fff;} .amount{display:block !important;} #cboxOverlay{ background:#fdf0bb !important;} #note_ul{list-style:none;padding:0px; font-size:12px; font-weight:bold; list-style:circle; color:#F06; font-size:14px; text-align:left !important;} ul#note_ul li span{ font-size:12px; color:#404040;} #step_for_pledge{ text-align:left !important; padding-left: 40px;} #steps_texts{padding-left: 35px;padding-top: 2px;font-weight:bold;font-size:14px;color:#090;} #steps_texts a{ font-size:11px; font-weight:normal;padding-right:10px; outline:none;} html p{display:none;} #ie_label1,#ie_label2,#ie_label3{display:none;text-align:left;margin-top:5px;padding-left:45px;} #search_bar{display:block;z-index:115; /background:#fff url(arrow_left.gif) top left no-repeat;/padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; color:#000; right:0;top:0;} #searchtextboxdiv{float:left;width:300px;} #searchtextarea{position:absolute;top:-700px;left:455px;padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;cursor:pointer; color:#000;width:190px;} #searchbuttondiv{} #searchtextarea{font-weight:bold;font-size:16px;color:#f00;} </style> <!--[if lte IE 6]> <style type=" text / css " media=" screen "> #header div{ background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='overlay.png', sizingMethod='scale'); } </style> <![endif]--> </head> <body> <div id=" wrapper "> <div id=" search_bar " style=" display: none; "> <div style=" width: 100 % "><span style=" color: #f00; font - weight: bold; font - size: 16px; ">Please enter your First name</span> <span style=" color: #7f7f7f;font-size:14px;">e.g: Arvind </span><br/></div> <div id= "searchtextboxdiv" > < input type = "text" id = "search_text" / > < /div> <div id="searchbuttondiv"><img src="/images / christmas / show_mygiftbutton.png " width=" 160 " id=" search_gift "/><a id=" close_searchbar " class=" fr " ><b>Hide</b></a></div> </div> <div id=" header "> <div id=" top_header "> <img src=" images / christmas / header - text.png " width=" 900 " /> </div> <div id=" img_back "> <div id=" tree_back "> <img src=" images / christmas / real - tree.png " width=" 455 " id=" tree " /> </div> <div id=" lights "> <p id=" searchtextarea ">Show my gift</p> <p id=" light25 " class=" Smita has pledged Rs.100 " ></p> <p id=" light24 " class=" Arvind Sridharan has pledged Rs.200 " ></p> <p id='light23' class='Nikhil Kaushal has pledged Rs.200'></p> <p id='light22' class='Aditi has pledged Rs.100'></p> <p id='light21' class='Aishwarya Singh has pledged Rs.500'></p> <p id='light20' class='Ram has pledged Rs.100'></p> <p id='light19' class='Amit Kumar has pledged Rs.200'></p> <p id='light18' class='Aishwarya Mishra has pledged Rs.1000'></p> <p id='light17' class='Chetan Agrawal has pledged Rs.500'></p> <p id='light16' class='ashish mehra has pledged Rs.3000'></p> <p id='light15' class='Piyush Goel has pledged Rs.200'></p> <p id='light14' class='Shantaram has pledged Rs.500'></p> <p id='light13' class='Akshay Pandey has pledged Rs.100'></p> <p id='light12' class='Abhishek Adhikari has pledged Rs.1000'></p> <p id='light11' class='dhiraj has pledged Rs.500'></p> <p id='light10' class='Rohit T George has pledged Rs.500'></p> <p id='light9' class='Pinky Goyal has pledged Rs.200'></p> <p id='light8' class='Sarathy Srinivas has pledged Rs.1000'></p> <p id='light7' class='Makarand has pledged Rs.100'></p> <p id='light6' class='Mitesh Tank has pledged Rs.5000'></p> <p id='light5' class='Jagannath R has pledged Rs.1000'></p> <!-- <p id='light4' class='Jagannath R has pledged Rs.500'></p>--> <!-- <p id='light3' class='Jagannath R has pledged Rs.500'></p>--> <!-- <p id='light2' class='Jagannath R has pledged Rs.500'></p>--> <p id='light26' class='Siddharth Agarwal has pledged Rs.200'></p> <p id='light27' class='sangeeta aisola has pledged Rs.100'></p> <p id='light28' class='nester has pledged Rs.500'></p> <p id='light29' class='Chirag has pledged Rs.5000'></p> <p id='light30' class='Pavithra Lakshmanan has pledged Rs.100'></p> <p id='light31' class='Priyanka Manjari has pledged Rs.500'></p> <p id='light32' class='Navneet Saxena has pledged Rs.100'></p> <p id='light33' class='Sanjay Bathija has pledged Rs.3000'></p> <p id='light34' class='amrita has pledged Rs.100'></p> <p id='light35' class='kiriti has pledged Rs.500'></p> <p id='light36' class='Kiran Challapalli has pledged Rs.1000'></p> <p id='light37' class='Amit Palrecha has pledged Rs.200'></p> <p id='light38' class='Srivatsan Hari has pledged Rs.500'></p> <p id='light39' class='Kalavathi has pledged Rs.100'></p> <p id='light40' class='Sampath G has pledged Rs.300'></p> <p id='light41' class='Vikash Kontia has pledged Rs.500'></p> <p id='light42' class='Binit has pledged Rs.100'></p> <p id='light43' class='Neha Tiwari has pledged Rs.10000'></p> <p id='light44' class='Loveen has pledged Rs.500'></p> <p id='light45' class='Rajdeep Poddar has pledged Rs.100'></p> <p id='light46' class='Suvadra Chakraborty has pledged Rs.200'></p> <p id='light47' class='Aritri has pledged Rs.100'></p> <p id='light48' class='Archana R has pledged Rs.200'></p> <p id='light49' class='anant bhatia has pledged Rs.500'></p> <p id='light50' class='Kavitha Udupa has pledged Rs.100'></p> <p id='light51' class='Sony Varghese has pledged Rs.500'></p> <p id='light52' class='Sony Varghese has pledged Rs.1000'></p> <p id='light53' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light54' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light55' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light56' class='Ujjwal Grover has pledged Rs.300'></p> <p id='light57' class='Balavinayagam.V.R has pledged Rs.500'></p> <p id='light58' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light59' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light60' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light61' class='Mohsin Khan has pledged Rs.1000'></p> <p id='light62' class='Mohsin Khan has pledged Rs.10000'></p> <p id='light63' class='Nita Row has pledged Rs.1000'></p> <p id='light64' class='Monu has pledged Rs.500'></p> <p id='light65' class='ANTONY CHRISTOPHER has pledged Rs.200'></p> <p id='light66' class='M.Sendhilvel has pledged Rs.100'></p> <p id='light67' class='pinda jatt has pledged Rs.100'></p> <p id='light68' class='Sreekanth has pledged Rs.1000'></p> <p id='light69' class='N Krishnamurthy has pledged Rs.100'></p> <p id='light70' class='auxilia has pledged Rs.200'></p> <p id='light71' class='Zishan Ansari has pledged Rs.200'></p> <p id='light72' class='Zishan Ansari has pledged Rs.200'></p> <p id='light73' class='Chirag has pledged Rs.5000'></p> <p id='light74' class='Deepesh Darla has pledged Rs.1000'></p> <p id='light75' class='ajay has pledged Rs.500'></p> <p id='light76' class='Payal Shah has pledged Rs.100'></p> <p id='light77' class='Gnanaraj Sadacharam has pledged Rs.300'></p> <p id='light78' class='chandan akella has pledged Rs.2500'></p> <p id='light79' class='Pranab has pledged Rs.200'></p> <p id='light80' class='Amit Ahuja has pledged Rs.200'></p> <p id='light81' class='Rajeev Shroff has pledged Rs.4000'></p> <p id='light82' class='nitya gaur has pledged Rs.100'></p> <p id='light83' class='Ravi Kumar has pledged Rs.500'></p> <p id='light84' class='Mohit has pledged Rs.500'></p> <p id='light85' class='Rakesh has pledged Rs.1100'></p> <p id='light86' class='Kshma Lal has pledged Rs.250'></p> <p id='light87' class='Aravind Deivendran has pledged Rs.500'></p> <p id='light88' class='shashidhara has pledged Rs.500'></p> <p id='light89' class='Satish has pledged Rs.100'></p> <p id='light90' class='Anita Menon has pledged Rs.500'></p> <p id='light91' class='Gokul has pledged Rs.500'></p> <p id='light92' class='Raghunandan Panigrahi has pledged Rs.100'></p> <p id='light93' class='Suchandra Chatterjee has pledged Rs.100'></p> <p id='light94' class='gaurav has pledged Rs.100'></p> <p id='light95' class='chandan has pledged Rs.200'></p> <p id='light96' class='Dwijesh Desai has pledged Rs.200'></p> <p id='light97' class='Dinoy Davis has pledged Rs.500'></p> <p id='light98' class='Kamlesh has pledged Rs.500'></p> <p id='light99' class='ravi sankar has pledged Rs.100'></p> </div> </div> <div id=" form_back " class=" fl w40 "> <div id=" thankyoubox " style=" display: none; "> <span style=" color: #090; font-size:18px;">Thanks for making a pledge!</span><br /><br /> <span>Simply mouseover the gifts on the Christmas Tree to see your name and others who have pledged.</span><br /><br /> <span>Invite your friends to light up our Christmas Tree!</span><br /> <br /><img src= "images/christmas/make_another_pleadge.png" width = "250" id = "madeanother" / > < br / > < br / > < div style = " width:250px;" > < img src = "images/christmas/share_ontext.png" width = "100" > < a class = "member" href = "http://www.facebook.com/sharer.php?s=100&p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&p[url]=http://tinyurl.com/d3vkw76&p[summary]=&p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target = "blank" > < img src = "images/christmas/facebook_icon.png" alt = "Share on Facebook" border = "0" > < /a> <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> < /div> </div > < div id = "ss-form" > < form action = "" method = "POST" target = "fake-target" onsubmit = "this.action='https://docs.google.com/a/rangde.org/spreadsheet/formResponse?formkey=dFlSZkt0TzZTWHJyblBiQlNrcmZvZGc6MQ&ifq'; if (validate(this)) {custommsg(); return true;} else return false;" > < br / > < div id = "step_for_pledge" > < div style = "clear:both;" > < div style = "width:20px; margin-bottom:10px;height:21px; background:url(images/christmas/number_buttons.png) 0px 0px no-repeat; float:left" > < /div><div id="steps_texts">Enter Your Details</div > < /div> <div style="clear:both;"> <div style="width:20px;margin-bottom:10px; height:21px; background:url(images/christmas / number_buttons.png) - 22px 0px no - repeat; float: left "></div><div id=" steps_texts ">Pledge an amount(Rs.100 or more)</div> </div> <div style=" clear: both; "> <div style=" width: 20px; margin - bottom: 10px; height: 21px; background: url(images / christmas / number_buttons.png) - 44px 0px no - repeat; float: left "></div><div id=" steps_texts ">Ring the bell<br/> <a href="#details " class=" inline " style=" text - decoration: underline; "> What next?</a></div> </div> </div> <br /><br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_0 ">Your Name<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_0 "></label></div> <div id=" ie_label1 "><label class=" ss - q - title " for=" entry_0 ">Your Name<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_0 "></label></div> <input type=" text " name=" entry.0.single " value="" class=" ss - q - short " id=" entry_0 " placeholder=" Your Name " /> <br /><br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_1 ">E-mail Address<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <div id=" ie_label2 " class=" email_errorlabel "><label class=" ss - q - title " for=" entry_1 ">E-mail Address<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <input type=" text " name=" entry.1.single " value="" class=" ss - q - short " id=" entry_1 " placeholder=" E - mail Address " /> <br /> <br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_2 ">Pledge Amount<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_2 "></label></div> <div id=" ie_label3 "><label class=" ss - q - title " for=" entry_2 ">Pledge Amount<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_2 "></label></div> <div style=" display: none; " class=" amount_errorlabel "><label class=" ss - q - title " for=" entry_1 ">Please enter an amount in multiples of 100<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <input type=" text " name=" entry.2.single " value="" class=" ss - q - short " id=" entry_2 " placeholder=" Pledge Amount " /> <br /> <br /> <img src=" images / christmas / Christmas_bell.png " width=" 150 " id=" bell " /> <div class=" ss - item ss - navigate "><div class=" ss - form - entry "> <input type=" submit " name=" submit " value="" id=" submit " style=" display: none; " /> <iframe src="#" id=" fake - target " name=" fake - target " style=" width: 0px; height: 0px; border: 0px; "></iframe> </div></div></form> </div> </div> <div class=" clearfloat "></div> <div id=" footer_text "> <div > <div style=" width: 250px; " ><img src=" images / christmas / share_ontext.png "><a class=" member " href=" http: //www.facebook.com/sharer.php?s=100&p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&p[url]=http://tinyurl.com/d3vkw76&p[summary]=&p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target="blank"> < img src = "images/christmas/facebook_icon.png" alt = "Share on Facebook" border = "0" > < /a> <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> < /div> <div style="margin-top:-25px"> <div id="privacy" style="width: 175px;cursor:pointer;height:30px;background: url(images/christmas / footer - text.png) - 400px 0px no - repeat; float: right; "></div><div style=" width: 200px; cursor: pointer; height: 30px; background: url(images / christmas / footer - text.png) - 190px 0px no - repeat; float: right; " href="#details " class=" inline "><a href="#details ">  </a></div> <div id=" about " style=" width: 120px; cursor: pointer; height: 30px; background: url(images / christmas / footer - text.png) - 50px 0px no - repeat; float: right; "></div> </div> <!--<img src=" footer - text.png " width=" 550 " usemap=" footer_links " />--> </div> </div> <map name=" footer_links "> <!--<area shape=" rect " coords=" 103, 140, 133, 168 " alt=" Sun " />--> <area shape=" rect " coords=" 370, 1, 631, 220 " alt=" policy " class='inline' href=" http: //www.rangde.org/terms-of-use.htm" /> < area shape = "rect" coords = "163,-6,370,218" alt = "details" class = 'inline' href = "#details" / > < area shape = "rect" coords = "-98,-3,163,216" alt = "about" class = 'inline' href = "http://www.rangde.org/rangde.htm" / > < /map> <div style="display:none;"> <div id="details"> <h3 class="sub-heading">Rang De brings to you a chance, to create the biggest Christmas tree ever. But this is not just another Christmas tree. <br / > This tree stands for hope, courage and the Christmas spirit itself! < br / > < /h3> <ul> <li><span>How to Participate?</span > < /li> <li><span>Enter your details</span > < /li> <li><span>Pledge an amount</span > < /li> <li><span>Ring the bell !!!</span > < /li> <li><span>And you become a part of the world's biggest Christmas Tree Online!</span > < /li></ul > < h3 class = "sub-heading" > What next ? < /h3> <ul> <li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span > < /li> <li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span > < /li> <li><span>You can fulfill the pledge by making a social investment for the pledged amount</span > < /li> <li><span>You can roll your mouse over it to see your name and the names of thousands of other pledge owners.</span > < /li> <li><span>And of course, everyone who pledges will be part of our Christmas Lucky Draw on 25th December</span > < /li></ul > < strong > The Goal : < /strong>We need to light them all by 0.00 hrs on 24th December. The more the pledge amount the bigger the tree will grow in size. For every pledge over Rs.100 the tree will grow in size proportionately.<br / > < br / > < h3 class = "sub-heading" > So what are you waiting for ? Ring the Bell! < /h3> <ul> <li><span>You get a Secret Santa Badge that you can share on Facebook & embed in your Email signature. Ask your friends to join you in your noble efforts!</span > < /li> <li><span>Go ahead and make a pledge this Christmas. Become a Secret Santa :)</span > < /li> <li><span>Please note – pledge owners would need to fulfill their pledge by helping someone through RangDe.org by 31st December 2011.</span > < /li></ul > < /div> </div > < /div> </div > < /body> <!-- Import jQuery--> <script src="js/tooltipjavascript.js "></script> <script src=" http : //ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script> < script type = "text/javascript" charset = "utf-8" > var $dj = jQuery.noConflict(); var scrollSpeed = 190; var step = 1; var current = 0; var imageHeight = 4300; var headerHeight = 650; var restartPosition = -(imageHeight - headerHeight); function scrollBg() { current += step; if (current == restartPosition) { current = 0; } $dj('#header').css("background-position", "0 " + current + "px"); } var init = setInterval("scrollBg()", scrollSpeed); < /script> <script type="text/javascript" language=" javascript " > var $dd = jQuery.noConflict(); $dd('document').ready(function () { if ($dd.browser.msie && $dd.browser.version <= 9){ $dd('#header').css('background','#fdf0bb'); $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'}); $dd('#ttcont').css('border','#fdf0bb'); $dd('#ie_label1').show(); $dd('#ie_label2').show(); $dd('#ie_label3').show(); (function fadeNext(jq){ jq.eq(0).show(" 200 ", function(){ // you can also set a timeout here if you'd like (jq=jq.slice(1)).length && fadeNext(jq); }); })($dd('html p')) } if ($dd.browser.msie){ $dd('#header').css('background','#fdf0bb'); $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'}); $dd('#ttcont').css('border','#fdf0bb'); $dd('#ie_label1').show(); $dd('#ie_label2').show(); $dd('#ie_label3').show(); } }); </script> <script type=" text / javascript " src=" js / jquery.autotab - 1.1b.js "></script> <script type=" text / javascript " language=" javascript " > var $ds = jQuery.noConflict(); $ds('document').ready(function () { $ds('input#entry_2').autotab_filter({ format: 'custom', pattern: '[^0-9\.]' }); }); </script> <script src=" http: //code.jquery.com/jquery-1.6.1.js" type="text/javascript" ></script> < script type = "text/javascript" language = "javascript" > $(document).ready(function() { var audioElement = document.createElement('audio'); audioElement.setAttribute('src', 'http://www.rangde.org/static/bell-ring-01.mp3'); $.get(); $('#submit').click(function() { audioElement.play(); }); }); < /script> <script src="http:/ / code.jquery.com / jquery - 1.6.1.js " type=" text / javascript " ></script> <script src=" https: //ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> < script type = "text/javascript" language = "javascript" charset = "utf-8" > var data = [ { 'id': 'light2' }, { 'id': 'light3' }, { 'id': 'light4' }, { 'id': 'light1' }]; var posleft = [{ 'left': '130' }, { 'left': '280' }, { 'left': '190' }, { 'left': '140' }, { 'left': '300' }, { 'left': '330' }, { 'left': '280' }, { 'left': '300' }, { 'left': '140' }, { 'left': '270' }, { 'left': '60' }, { 'left': '180' }, { 'left': '150' }, { 'left': '140' }, { 'left': '170' }] var postop = [{ 'top': '-320' }, { 'top': '-400' }, { 'top': '-450' }, { 'top': '-420' }, { 'top': '-449' }, { 'top': '-320' }, { 'top': '-450' }, { 'top': '-350' }, { 'top': '-320' }, { 'top': '-329' }, { 'top': '-340' }, { 'top': '-249' }, { 'top': '-310' }, { 'top': '-420' }, { 'top': '-339' }]; var divposleft = [{ 'left': '160' }, { 'left': '310' }, { 'left': '220' }, { 'left': '170' }, { 'left': '330' }, { 'left': '330' }, { 'left': '280' }, { 'left': '300' }, { 'left': '140' }, { 'left': '270' }, { 'left': '60' }, { 'left': '180' }, { 'left': '150' }, { 'left': '140' }, { 'left': '170' }] var divpostop = [{ 'top': '-350' }, { 'top': '-430' }, { 'top': '-480' }, { 'top': '-450' }, { 'top': '-479' }, { 'top': '-320' }, { 'top': '-450' }, { 'top': '-350' }, { 'top': '-320' }, { 'top': '-329' }, { 'top': '-340' }, { 'top': '-249' }, { 'top': '-310' }, { 'top': '-420' }, { 'top': '-339' }]; var position = 0; $('document').ready(function() { $('#searchtextarea').click(function() { $('#searchtextarea').hide(); $('#search_bar').show(); }); $('#close_searchbar').click(function() { $('#search_bar').hide(); $('#searchtextarea').show(); }); $('#search_gift').live('click', function() { var cssClass = $('#search_text').val(); var selector = 'p[class^="' + cssClass + '"]'; console.log(selector); var $elements = $(selector); $elements.each(function(i) { var classname = $(this).attr('class'); var toppos = $(this).css('top'); var leftpos = $(this).css('left'); var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block'); div.text(classname); div.css({ 'top': toppos, 'left': leftpos }); $('#lights').append(div); }); }); (function fadeNext(jq) { jq.eq(0).fadeIn("50", function() { // you can also set a timeout here if you'd like (jq = jq.slice(1)).length && fadeNext(jq); }); })($('html p')) $('#privacy ').click(function() { window.open('http://www.rangde.org/terms-of-use.htm'); }); $('#about').click(function() { window.open('http://www.rangde.org/about-rang-de.htm'); }); $('#madeanother').click(function() { $('#thankyoubox').hide(100); $('#ss-form').show(100); $('#submit').hide(); $('#bell').show(); $('input[name="entry.0.single"]').val(''); $('input[name="entry.1.single"]').val(''); $('input[name="entry.2.single"]').val(''); $('div.email_errorlabel').css('display', 'none'); $('#ie_label2').show(); }); $('h1.ss-form-title').hide(); $('#bell,#submit').hover(function() { tooltip.show('Double click the bell'); }, function() { tooltip.hide(); }); $('#steps_texts a').hover(function() { tooltip.show('<h3 style="color:#f60;">What next?</h3><ul style="list-style:circle; font-size:12px; color:#404040;"><li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span></li><li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span></li><li><span>You can fulfill the pledge by making a social investment for the pledged amount</span></li><li><span>You can <b style="color:#f00;">roll your mouse over it to see your name</b> and the names of thousands of other pledge owners.</span></li><li>And of course, everyone who pledges will be part of our <b style="color:#f00;">Christmas Lucky Draw on 25th December</b></li></ul>'); }, function() { tooltip.hide(); }); $('#submit').click(function() { var name = $('input[name="entry.0.single"]').val(); var amount = $('input[name="entry.2.single"]').val(); var light = $('<p></p>').attr('id', data[position].id).css('position', 'absolute').css('display', 'block'); light.addClass(name); light.addClass(' has pledged Rs.'); light.addClass(amount); light.offset({ top: postop[position].top, left: posleft[position].left }); var text = light.attr('class'); $("#lights").append(light); var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block'); div.text(text); div.offset({ top: divpostop[position].top, left: divposleft[position].left }); $('#lights').append(div); position++; position %= data.length; $('#tree').animate({ 'width': '+=3px' }, 1000); $('#ss-form').hide(); $('#thankyoubox').show(); }); $('#lights p').live('mouseover', function() { $('.pledgetooltip').hide(); var text = $(this).attr('class'); tooltip.show(text); }); $('#lights p').live('mouseout', function() { tooltip.hide(); }); $('img#bell').click(function() { $('div#error_labels').hide(); var emptyTextBoxes = $('form input[type=text],[type=password]').filter(function() { return this.value == ""; }); var input = document.getElementById('entry_2'); if (input.value.match(/^[1-9]\d00$/) \|\| !(input.value.match)("")) { $('.amount_errorlabel').css({ 'display': 'none', 'color': '#404040' }); } else { $('.amount_errorlabel').css({ 'display': 'inline', 'color': '#F00' }); return false; } var email = $('#entry_1').val(); if (email !== "") { if (email == "" \|\| !isValidEmailAddress(email)) { $('.email_errorlabel').css({ 'display': 'inline', 'color': '#F00' }); return false; } } function isValidEmailAddress(emailAddress) { var pattern = new RegExp(/^(("[\w-+\s]+")\|([\w-+]+(?:\.[\w-+]+))\|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)\|(@\[?((25[0-5]\.\|2[0-4][0-9]\.\|1[0-9]{2}\.\|[0-9]{1,2}\.))((25[0-5]\|2[0-4][0-9]\|1[0-9]{2}\|[0-9]{1,2})\.){2}(25[0-5]\|2[0-4][0-9]\|1[0-9]{2}\|[0-9]{1,2})\]?$)/i); return pattern.test(emailAddress); }; if (emptyTextBoxes.length < 1) { $('#bell').hide(); $('#submit').show(); } else { // ignore the click if all fields haven't been clicked emptyTextBoxes.each(function() { $(emptyTextBoxes).prevAll('#error_labels').css({ 'display': 'inline', 'color': '#F00' }); }); } }); }); < /script> </html >	ready
myfirst	< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < html > < head > < meta http - equiv = "Content-type" content = "text/html; charset=utf-8" / > < link href = "https://docs.google.com/static/spreadsheets/client/css/744745208-embedded_form_compiled.css" type = "text/css" rel = "stylesheet" > < link href = "includes/style.css" rel = "stylesheet" type = "text/css" / > < link media = "screen" rel = "stylesheet" href = "../css/colorbox.css" / > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" > < /script> <script src="js/jquery.colorbox.js "></script> <script> var $dr = jQuery.noConflict(); $dr(document).ready(function(){ //Examples of how to assign the ColorBox event to elements $dr(".group1 ").colorbox({rel:'group1'}); $dr(".group2 ").colorbox({rel:'group2', transition:" fade "}); $dr(".group3 ").colorbox({rel:'group3', transition:" none ", width:" 75 % ", height:" 75 % "}); $dr(".group4 ").colorbox({rel:'group4', slideshow:true}); $dr(".ajax ").colorbox(); $dr(".youtube ").colorbox({iframe:true, innerWidth:425, innerHeight:344}); $dr(".iframe ").colorbox({iframe:true, width:" 80 % ", height:" 80 % "}); $dr(".inline ").colorbox({inline:true, width:" 70 % "}); $dr(".callbacks ").colorbox({ onOpen:function(){ alert('onOpen: colorbox is about to open'); }, onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); }, onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); }, onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); }, onClosed:function(){ alert('onClosed: colorbox has completely closed'); } }); //Example of preserving a JavaScript event for inline calls. $dr("#click ").click(function(){ $('#click').css({" background - color ":"#f00 ", " color ":"#fff ", " cursor ":" inherit "}).text(" Open this window again and this message will still be here."); return false; }); }); </script> <title>Rang De Christmas Campaign.</title> <style type=" text / css " > body{background: #000;} #wrapper{width:920px;margin:0 auto;} #header{background: #000 url(images/christmas/background_image.png)repeat-y scroll left top;text-align:center;} #header h1{padding-top:125px;font-family: Arial, " MS Trebuchet ", sans-serif;color:white;} #body{background-color:#efefef;height:500px;} #nav{height:35px;background-color: #111;} #form_back{padding:100px 0px 0px 40px;} input[type=" text "]{margin-bottom:7px;box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:15px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important;} input::-webkit-input-placeholder { color: red;} input::-webkit-input-placeholder { color: #090;opacity:0.5;} #tt {position:absolute; display:block; } #tttop {display:block; height:5px; margin-left:5px; overflow:hidden} #ttcont {display:block;z-index:115; /background:#fff url(arrow_left.gif) top left no-repeat;/padding:2px 12px 3px 7px; margin-left:5px; border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;margin:10px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; color:#000;} #ttbot {display:block; height:5px; margin-left:5px; overflow:hidden} #bell{cursor:pointer;} #img_back{float:right;height:430px;} #tree_back{z-index:99;} #light1{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;} #light2{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light3{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light4{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light5{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:220px;position:absolute;} #light6{height:18px;width:30px;background:url(images/christmas/gifts.png) -0px -70px no-repeat;top:-420px;left:190px;position:absolute;} #light7{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-40px;left:260px;position:absolute;} #light8{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:100px;position:absolute;} #light9{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-140px;left:120px;position:absolute;} #light10{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:200px;position:absolute;} #light11{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:300px;position:absolute;} #light12{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:240px;position:absolute;} #light13{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:340px;position:absolute;} #light14{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-150px;left:240px;position:absolute;} #light15{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-230px;left:260px;position:absolute;} #light16{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-367px;left:190px;position:absolute;} #light17{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-230px;left:100px;position:absolute;} #light18{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:130px;position:absolute;} #light19{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-10px;left:60px;position:absolute;} #light20{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:200px;position:absolute;} #light21{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:170px;position:absolute;} #light22{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-120px;left:50px;position:absolute;} #light23{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-210px;left:150px;position:absolute;} #light24{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-190px;left:80px;position:absolute;} #light25{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-70px;left:70px;position:absolute;} #light26{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:330px;position:absolute;} #light27{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-150px;left:330px;position:absolute;} #light28{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-190px;left:330px;position:absolute;} #light29{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -105px no-repeat;top:-420px;left:250px;position:absolute;} #light30{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:250px;position:absolute;} #light31{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-184px;left:250px;position:absolute;} #light32{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-70px;left:200px;position:absolute;} #light33{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:140px;position:absolute;} #light34{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:140px;position:absolute;} #light35{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:83px;position:absolute;} #light36{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:270px;position:absolute;} #light37{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:270px;position:absolute;} #light38{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:320px;position:absolute;} #light39{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-120px;left:270px;position:absolute;} #light40{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-230px;left:200px;position:absolute;} #light41{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:200px;position:absolute;} #light42{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:200px;position:absolute;} #light43{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-490px;left:200px;position:absolute;} #light44{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:230px;position:absolute;} #light45{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-40px;left:100px;position:absolute;} #light46{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-173px;left:130px;position:absolute;} #light47{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-120px;left:230px;position:absolute;} #light48{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-109px;left:350px;position:absolute;} #light49{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-240px;left:130px;position:absolute;} #light50{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-190px;left:170px;position:absolute;} #light51{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-260px;left:250px;position:absolute;} #light52{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:290px;position:absolute;} #light53{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:330px;position:absolute;} #light54{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:70px;position:absolute;} #light55{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;} #light56{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;} #light57{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:270px;position:absolute;} #light58{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:355px;position:absolute;} #light59{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-169px;left:310px;position:absolute;} #light60{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:150px;position:absolute;} #light61{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-370px;left:290px;position:absolute;} #light62{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-450px;left:230px;position:absolute;} #light63{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:160px;position:absolute;} #light64{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:80px;position:absolute;} #light65{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:350px;position:absolute;} #light66{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-70px;left:180px;position:absolute;} #light67{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-30px;left:80px;position:absolute;} #light68{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:300px;position:absolute;} #light69{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:60px;position:absolute;} #light70{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-40px;left:300px;position:absolute;} #light71{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-100px;left:300px;position:absolute;} #light72{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:150px;position:absolute;} #light73{height:18px;width:30px;background: url(images/christmas/gifts.png) -0px -70px no-repeat;top:-380px;left:180px;position:absolute;} #light74{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:120px;position:absolute;} #light75{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-180px;left:200px;position:absolute;} #light76{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-220px;left:280px;position:absolute;} #light77{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-125px;left:300px;position:absolute;} #light78{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:240px;position:absolute;} #light79{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-120px;left:120px;position:absolute;} #light80{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-50px;left:50px;position:absolute;} #light81{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-410px;left:240px;position:absolute;} #light82{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-70px;left:110px;position:absolute;} #light83{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:190px;position:absolute;} #light84{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:130px;position:absolute;} #light85{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-280px;left:190px;position:absolute;} #light86{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-90px;left:90px;position:absolute;} #light87{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-130px;left:90px;position:absolute;} #light88{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:270px;position:absolute;} #light89{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-130px;left:200px;position:absolute;} #light90{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:150px;position:absolute;} #light91{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light92{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light93{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light94{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light95{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light96{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light97{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light98{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light99{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} /pink-ball: url(images/christmas/gifts.png) -37px -30px no-repeat orange-ball url(images/christmas/gifts.png) 0px -31px no-repeat zepra-gift-box url(images/christmas/gifts.png) 0px 0px no-repeat blue-giftbox url(images/christmas/gifts.png) -0px -70px no-repeat pink-gift-box url(images/christmas/gifts.png) -43px -70px no-repeat blue-ball url(images/christmas/gifts.png) -81px -37px no-repeat dark-orangeball url(images/christmas/gifts.png) -119px -35px no-repeat red-gift-box url(images/christmas/gifts.png) -81px -0px no-repeat star url(images/christmas/gifts.png) -40px -0px no-repeat / #details ul{padding:20px 0px 20px 20px; list-style:circle; color:#F09;} #details h3.sub-heading{ color:#F60;padding:0px !important;} #details ul li span{color:#404040;} #thankyoubox{box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:12px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important; width:250px;height:300px; text-align:left !important;} #lights{position:relative;left:0px;top:-400px;opacity:0.7;} #lights p{margin:0px;z-index:100;} .dispalynone{display:none;} html div.ss-legal{ display:none !important;} #footer_text{ background:url(images/christmas/footer_background.png) no-repeat; height:250px;z-index:0;} #footer_text img{padding-top:200px;} #ss-form{z-index:99;} input[type=submit]{ background:url(images/christmas/Christmas_bell.png) no-repeat; width:150px;height:150px;border:none;} #ss-form{background:none;box-shadow:0px 0px 10px #fff;box-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10p;border:1px solid #fff; -webkit-box-shadow:0px 0px 10px #fff;-moz-box-shadow:0px 0px 10px #fff;} .amount{display:block !important;} #cboxOverlay{ background:#fdf0bb !important;} #note_ul{list-style:none;padding:0px; font-size:12px; font-weight:bold; list-style:circle; color:#F06; font-size:14px; text-align:left !important;} ul#note_ul li span{ font-size:12px; color:#404040;} #step_for_pledge{ text-align:left !important; padding-left: 40px;} #steps_texts{padding-left: 35px;padding-top: 2px;font-weight:bold;font-size:14px;color:#090;} #steps_texts a{ font-size:11px; font-weight:normal;padding-right:10px; outline:none;} html p{display:none;} #ie_label1,#ie_label2,#ie_label3{display:none;text-align:left;margin-top:5px;padding-left:45px;} #search_bar{display:block;z-index:115; /background:#fff url(arrow_left.gif) top left no-repeat;/padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; color:#000; right:0;top:0;} #searchtextboxdiv{float:left;width:300px;} #searchtextarea{position:absolute;top:-700px;left:455px;padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;cursor:pointer; color:#000;width:190px;} #searchbuttondiv{} #searchtextarea{font-weight:bold;font-size:16px;color:#f00;} </style> <!--[if lte IE 6]> <style type=" text / css " media=" screen "> #header div{ background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='overlay.png', sizingMethod='scale'); } </style> <![endif]--> </head> <body> <div id=" wrapper "> <div id=" search_bar " style=" display: none; "> <div style=" width: 100 % "><span style=" color: #f00; font - weight: bold; font - size: 16px; ">Please enter your First name</span> <span style=" color: #7f7f7f;font-size:14px;">e.g: Arvind </span><br/></div> <div id= "searchtextboxdiv" > < input type = "text" id = "search_text" / > < /div> <div id="searchbuttondiv"><img src="/images / christmas / show_mygiftbutton.png " width=" 160 " id=" search_gift "/><a id=" close_searchbar " class=" fr " ><b>Hide</b></a></div> </div> <div id=" header "> <div id=" top_header "> <img src=" images / christmas / header - text.png " width=" 900 " /> </div> <div id=" img_back "> <div id=" tree_back "> <img src=" images / christmas / real - tree.png " width=" 455 " id=" tree " /> </div> <div id=" lights "> <p id=" searchtextarea ">Show my gift</p> <p id=" light25 " class=" Smita has pledged Rs.100 " ></p> <p id=" light24 " class=" Arvind Sridharan has pledged Rs.200 " ></p> <p id='light23' class='Nikhil Kaushal has pledged Rs.200'></p> <p id='light22' class='Aditi has pledged Rs.100'></p> <p id='light21' class='Aishwarya Singh has pledged Rs.500'></p> <p id='light20' class='Ram has pledged Rs.100'></p> <p id='light19' class='Amit Kumar has pledged Rs.200'></p> <p id='light18' class='Aishwarya Mishra has pledged Rs.1000'></p> <p id='light17' class='Chetan Agrawal has pledged Rs.500'></p> <p id='light16' class='ashish mehra has pledged Rs.3000'></p> <p id='light15' class='Piyush Goel has pledged Rs.200'></p> <p id='light14' class='Shantaram has pledged Rs.500'></p> <p id='light13' class='Akshay Pandey has pledged Rs.100'></p> <p id='light12' class='Abhishek Adhikari has pledged Rs.1000'></p> <p id='light11' class='dhiraj has pledged Rs.500'></p> <p id='light10' class='Rohit T George has pledged Rs.500'></p> <p id='light9' class='Pinky Goyal has pledged Rs.200'></p> <p id='light8' class='Sarathy Srinivas has pledged Rs.1000'></p> <p id='light7' class='Makarand has pledged Rs.100'></p> <p id='light6' class='Mitesh Tank has pledged Rs.5000'></p> <p id='light5' class='Jagannath R has pledged Rs.1000'></p> <!-- <p id='light4' class='Jagannath R has pledged Rs.500'></p>--> <!-- <p id='light3' class='Jagannath R has pledged Rs.500'></p>--> <!-- <p id='light2' class='Jagannath R has pledged Rs.500'></p>--> <p id='light26' class='Siddharth Agarwal has pledged Rs.200'></p> <p id='light27' class='sangeeta aisola has pledged Rs.100'></p> <p id='light28' class='nester has pledged Rs.500'></p> <p id='light29' class='Chirag has pledged Rs.5000'></p> <p id='light30' class='Pavithra Lakshmanan has pledged Rs.100'></p> <p id='light31' class='Priyanka Manjari has pledged Rs.500'></p> <p id='light32' class='Navneet Saxena has pledged Rs.100'></p> <p id='light33' class='Sanjay Bathija has pledged Rs.3000'></p> <p id='light34' class='amrita has pledged Rs.100'></p> <p id='light35' class='kiriti has pledged Rs.500'></p> <p id='light36' class='Kiran Challapalli has pledged Rs.1000'></p> <p id='light37' class='Amit Palrecha has pledged Rs.200'></p> <p id='light38' class='Srivatsan Hari has pledged Rs.500'></p> <p id='light39' class='Kalavathi has pledged Rs.100'></p> <p id='light40' class='Sampath G has pledged Rs.300'></p> <p id='light41' class='Vikash Kontia has pledged Rs.500'></p> <p id='light42' class='Binit has pledged Rs.100'></p> <p id='light43' class='Neha Tiwari has pledged Rs.10000'></p> <p id='light44' class='Loveen has pledged Rs.500'></p> <p id='light45' class='Rajdeep Poddar has pledged Rs.100'></p> <p id='light46' class='Suvadra Chakraborty has pledged Rs.200'></p> <p id='light47' class='Aritri has pledged Rs.100'></p> <p id='light48' class='Archana R has pledged Rs.200'></p> <p id='light49' class='anant bhatia has pledged Rs.500'></p> <p id='light50' class='Kavitha Udupa has pledged Rs.100'></p> <p id='light51' class='Sony Varghese has pledged Rs.500'></p> <p id='light52' class='Sony Varghese has pledged Rs.1000'></p> <p id='light53' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light54' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light55' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light56' class='Ujjwal Grover has pledged Rs.300'></p> <p id='light57' class='Balavinayagam.V.R has pledged Rs.500'></p> <p id='light58' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light59' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light60' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light61' class='Mohsin Khan has pledged Rs.1000'></p> <p id='light62' class='Mohsin Khan has pledged Rs.10000'></p> <p id='light63' class='Nita Row has pledged Rs.1000'></p> <p id='light64' class='Monu has pledged Rs.500'></p> <p id='light65' class='ANTONY CHRISTOPHER has pledged Rs.200'></p> <p id='light66' class='M.Sendhilvel has pledged Rs.100'></p> <p id='light67' class='pinda jatt has pledged Rs.100'></p> <p id='light68' class='Sreekanth has pledged Rs.1000'></p> <p id='light69' class='N Krishnamurthy has pledged Rs.100'></p> <p id='light70' class='auxilia has pledged Rs.200'></p> <p id='light71' class='Zishan Ansari has pledged Rs.200'></p> <p id='light72' class='Zishan Ansari has pledged Rs.200'></p> <p id='light73' class='Chirag has pledged Rs.5000'></p> <p id='light74' class='Deepesh Darla has pledged Rs.1000'></p> <p id='light75' class='ajay has pledged Rs.500'></p> <p id='light76' class='Payal Shah has pledged Rs.100'></p> <p id='light77' class='Gnanaraj Sadacharam has pledged Rs.300'></p> <p id='light78' class='chandan akella has pledged Rs.2500'></p> <p id='light79' class='Pranab has pledged Rs.200'></p> <p id='light80' class='Amit Ahuja has pledged Rs.200'></p> <p id='light81' class='Rajeev Shroff has pledged Rs.4000'></p> <p id='light82' class='nitya gaur has pledged Rs.100'></p> <p id='light83' class='Ravi Kumar has pledged Rs.500'></p> <p id='light84' class='Mohit has pledged Rs.500'></p> <p id='light85' class='Rakesh has pledged Rs.1100'></p> <p id='light86' class='Kshma Lal has pledged Rs.250'></p> <p id='light87' class='Aravind Deivendran has pledged Rs.500'></p> <p id='light88' class='shashidhara has pledged Rs.500'></p> <p id='light89' class='Satish has pledged Rs.100'></p> <p id='light90' class='Anita Menon has pledged Rs.500'></p> <p id='light91' class='Gokul has pledged Rs.500'></p> <p id='light92' class='Raghunandan Panigrahi has pledged Rs.100'></p> <p id='light93' class='Suchandra Chatterjee has pledged Rs.100'></p> <p id='light94' class='gaurav has pledged Rs.100'></p> <p id='light95' class='chandan has pledged Rs.200'></p> <p id='light96' class='Dwijesh Desai has pledged Rs.200'></p> <p id='light97' class='Dinoy Davis has pledged Rs.500'></p> <p id='light98' class='Kamlesh has pledged Rs.500'></p> <p id='light99' class='ravi sankar has pledged Rs.100'></p> </div> </div> <div id=" form_back " class=" fl w40 "> <div id=" thankyoubox " style=" display: none; "> <span style=" color: #090; font-size:18px;">Thanks for making a pledge!</span><br /><br /> <span>Simply mouseover the gifts on the Christmas Tree to see your name and others who have pledged.</span><br /><br /> <span>Invite your friends to light up our Christmas Tree!</span><br /> <br /><img src= "images/christmas/make_another_pleadge.png" width = "250" id = "madeanother" / > < br / > < br / > < div style = " width:250px;" > < img src = "images/christmas/share_ontext.png" width = "100" > < a class = "member" href = "http://www.facebook.com/sharer.php?s=100&p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&p[url]=http://tinyurl.com/d3vkw76&p[summary]=&p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target = "blank" > < img src = "images/christmas/facebook_icon.png" alt = "Share on Facebook" border = "0" > < /a> <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> < /div> </div > < div id = "ss-form" > < form action = "" method = "POST" target = "fake-target" onsubmit = "this.action='https://docs.google.com/a/rangde.org/spreadsheet/formResponse?formkey=dFlSZkt0TzZTWHJyblBiQlNrcmZvZGc6MQ&ifq'; if (validate(this)) {custommsg(); return true;} else return false;" > < br / > < div id = "step_for_pledge" > < div style = "clear:both;" > < div style = "width:20px; margin-bottom:10px;height:21px; background:url(images/christmas/number_buttons.png) 0px 0px no-repeat; float:left" > < /div><div id="steps_texts">Enter Your Details</div > < /div> <div style="clear:both;"> <div style="width:20px;margin-bottom:10px; height:21px; background:url(images/christmas / number_buttons.png) - 22px 0px no - repeat; float: left "></div><div id=" steps_texts ">Pledge an amount(Rs.100 or more)</div> </div> <div style=" clear: both; "> <div style=" width: 20px; margin - bottom: 10px; height: 21px; background: url(images / christmas / number_buttons.png) - 44px 0px no - repeat; float: left "></div><div id=" steps_texts ">Ring the bell<br/> <a href="#details " class=" inline " style=" text - decoration: underline; "> What next?</a></div> </div> </div> <br /><br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_0 ">Your Name<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_0 "></label></div> <div id=" ie_label1 "><label class=" ss - q - title " for=" entry_0 ">Your Name<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_0 "></label></div> <input type=" text " name=" entry.0.single " value="" class=" ss - q - short " id=" entry_0 " placeholder=" Your Name " /> <br /><br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_1 ">E-mail Address<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <div id=" ie_label2 " class=" email_errorlabel "><label class=" ss - q - title " for=" entry_1 ">E-mail Address<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <input type=" text " name=" entry.1.single " value="" class=" ss - q - short " id=" entry_1 " placeholder=" E - mail Address " /> <br /> <br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_2 ">Pledge Amount<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_2 "></label></div> <div id=" ie_label3 "><label class=" ss - q - title " for=" entry_2 ">Pledge Amount<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_2 "></label></div> <div style=" display: none; " class=" amount_errorlabel "><label class=" ss - q - title " for=" entry_1 ">Please enter an amount in multiples of 100<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <input type=" text " name=" entry.2.single " value="" class=" ss - q - short " id=" entry_2 " placeholder=" Pledge Amount " /> <br /> <br /> <img src=" images / christmas / Christmas_bell.png " width=" 150 " id=" bell " /> <div class=" ss - item ss - navigate "><div class=" ss - form - entry "> <input type=" submit " name=" submit " value="" id=" submit " style=" display: none; " /> <iframe src="#" id=" fake - target " name=" fake - target " style=" width: 0px; height: 0px; border: 0px; "></iframe> </div></div></form> </div> </div> <div class=" clearfloat "></div> <div id=" footer_text "> <div > <div style=" width: 250px; " ><img src=" images / christmas / share_ontext.png "><a class=" member " href=" http: //www.facebook.com/sharer.php?s=100&p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&p[url]=http://tinyurl.com/d3vkw76&p[summary]=&p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target="blank"> < img src = "images/christmas/facebook_icon.png" alt = "Share on Facebook" border = "0" > < /a> <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> < /div> <div style="margin-top:-25px"> <div id="privacy" style="width: 175px;cursor:pointer;height:30px;background: url(images/christmas / footer - text.png) - 400px 0px no - repeat; float: right; "></div><div style=" width: 200px; cursor: pointer; height: 30px; background: url(images / christmas / footer - text.png) - 190px 0px no - repeat; float: right; " href="#details " class=" inline "><a href="#details ">  </a></div> <div id=" about " style=" width: 120px; cursor: pointer; height: 30px; background: url(images / christmas / footer - text.png) - 50px 0px no - repeat; float: right; "></div> </div> <!--<img src=" footer - text.png " width=" 550 " usemap=" footer_links " />--> </div> </div> <map name=" footer_links "> <!--<area shape=" rect " coords=" 103, 140, 133, 168 " alt=" Sun " />--> <area shape=" rect " coords=" 370, 1, 631, 220 " alt=" policy " class='inline' href=" http: //www.rangde.org/terms-of-use.htm" /> < area shape = "rect" coords = "163,-6,370,218" alt = "details" class = 'inline' href = "#details" / > < area shape = "rect" coords = "-98,-3,163,216" alt = "about" class = 'inline' href = "http://www.rangde.org/rangde.htm" / > < /map> <div style="display:none;"> <div id="details"> <h3 class="sub-heading">Rang De brings to you a chance, to create the biggest Christmas tree ever. But this is not just another Christmas tree. <br / > This tree stands for hope, courage and the Christmas spirit itself! < br / > < /h3> <ul> <li><span>How to Participate?</span > < /li> <li><span>Enter your details</span > < /li> <li><span>Pledge an amount</span > < /li> <li><span>Ring the bell !!!</span > < /li> <li><span>And you become a part of the world's biggest Christmas Tree Online!</span > < /li></ul > < h3 class = "sub-heading" > What next ? < /h3> <ul> <li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span > < /li> <li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span > < /li> <li><span>You can fulfill the pledge by making a social investment for the pledged amount</span > < /li> <li><span>You can roll your mouse over it to see your name and the names of thousands of other pledge owners.</span > < /li> <li><span>And of course, everyone who pledges will be part of our Christmas Lucky Draw on 25th December</span > < /li></ul > < strong > The Goal : < /strong>We need to light them all by 0.00 hrs on 24th December. The more the pledge amount the bigger the tree will grow in size. For every pledge over Rs.100 the tree will grow in size proportionately.<br / > < br / > < h3 class = "sub-heading" > So what are you waiting for ? Ring the Bell! < /h3> <ul> <li><span>You get a Secret Santa Badge that you can share on Facebook & embed in your Email signature. Ask your friends to join you in your noble efforts!</span > < /li> <li><span>Go ahead and make a pledge this Christmas. Become a Secret Santa :)</span > < /li> <li><span>Please note – pledge owners would need to fulfill their pledge by helping someone through RangDe.org by 31st December 2011.</span > < /li></ul > < /div> </div > < /div> </div > < /body> <!-- Import jQuery--> <script src="js/tooltipjavascript.js "></script> <script src=" http : //ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script> < script type = "text/javascript" charset = "utf-8" > var $dj = jQuery.noConflict(); var scrollSpeed = 190; var step = 1; var current = 0; var imageHeight = 4300; var headerHeight = 650; var restartPosition = -(imageHeight - headerHeight); function scrollBg() { current += step; if (current == restartPosition) { current = 0; } $dj('#header').css("background-position", "0 " + current + "px"); } var init = setInterval("scrollBg()", scrollSpeed); < /script> <script type="text/javascript" language=" javascript " > var $dd = jQuery.noConflict(); $dd('document').ready(function () { if ($dd.browser.msie && $dd.browser.version <= 9){ $dd('#header').css('background','#fdf0bb'); $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'}); $dd('#ttcont').css('border','#fdf0bb'); $dd('#ie_label1').show(); $dd('#ie_label2').show(); $dd('#ie_label3').show(); (function fadeNext(jq){ jq.eq(0).show(" 200 ", function(){ // you can also set a timeout here if you'd like (jq=jq.slice(1)).length && fadeNext(jq); }); })($dd('html p')) } if ($dd.browser.msie){ $dd('#header').css('background','#fdf0bb'); $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'}); $dd('#ttcont').css('border','#fdf0bb'); $dd('#ie_label1').show(); $dd('#ie_label2').show(); $dd('#ie_label3').show(); } }); </script> <script type=" text / javascript " src=" js / jquery.autotab - 1.1b.js "></script> <script type=" text / javascript " language=" javascript " > var $ds = jQuery.noConflict(); $ds('document').ready(function () { $ds('input#entry_2').autotab_filter({ format: 'custom', pattern: '[^0-9\.]' }); }); </script> <script src=" http: //code.jquery.com/jquery-1.6.1.js" type="text/javascript" ></script> < script type = "text/javascript" language = "javascript" > $(document).ready(function() { var audioElement = document.createElement('audio'); audioElement.setAttribute('src', 'http://www.rangde.org/static/bell-ring-01.mp3'); $.get(); $('#submit').click(function() { audioElement.play(); }); }); < /script> <script src="http:/ / code.jquery.com / jquery - 1.6.1.js " type=" text / javascript " ></script> <script src=" https: //ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> < script type = "text/javascript" language = "javascript" charset = "utf-8" > var data = [ { 'id': 'light2' }, { 'id': 'light3' }, { 'id': 'light4' }, { 'id': 'light1' }]; var posleft = [{ 'left': '130' }, { 'left': '280' }, { 'left': '190' }, { 'left': '140' }, { 'left': '300' }, { 'left': '330' }, { 'left': '280' }, { 'left': '300' }, { 'left': '140' }, { 'left': '270' }, { 'left': '60' }, { 'left': '180' }, { 'left': '150' }, { 'left': '140' }, { 'left': '170' }] var postop = [{ 'top': '-320' }, { 'top': '-400' }, { 'top': '-450' }, { 'top': '-420' }, { 'top': '-449' }, { 'top': '-320' }, { 'top': '-450' }, { 'top': '-350' }, { 'top': '-320' }, { 'top': '-329' }, { 'top': '-340' }, { 'top': '-249' }, { 'top': '-310' }, { 'top': '-420' }, { 'top': '-339' }]; var divposleft = [{ 'left': '160' }, { 'left': '310' }, { 'left': '220' }, { 'left': '170' }, { 'left': '330' }, { 'left': '330' }, { 'left': '280' }, { 'left': '300' }, { 'left': '140' }, { 'left': '270' }, { 'left': '60' }, { 'left': '180' }, { 'left': '150' }, { 'left': '140' }, { 'left': '170' }] var divpostop = [{ 'top': '-350' }, { 'top': '-430' }, { 'top': '-480' }, { 'top': '-450' }, { 'top': '-479' }, { 'top': '-320' }, { 'top': '-450' }, { 'top': '-350' }, { 'top': '-320' }, { 'top': '-329' }, { 'top': '-340' }, { 'top': '-249' }, { 'top': '-310' }, { 'top': '-420' }, { 'top': '-339' }]; var position = 0; $('document').ready(function() { $('#searchtextarea').click(function() { $('#searchtextarea').hide(); $('#search_bar').show(); }); $('#close_searchbar').click(function() { $('#search_bar').hide(); $('#searchtextarea').show(); }); $('#search_gift').live('click', function() { var cssClass = $('#search_text').val(); var selector = 'p[class^="' + cssClass + '"]'; console.log(selector); var $elements = $(selector); $elements.each(function(i) { var classname = $(this).attr('class'); var toppos = $(this).css('top'); var leftpos = $(this).css('left'); var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block'); div.text(classname); div.css({ 'top': toppos, 'left': leftpos }); $('#lights').append(div); }); }); (function fadeNext(jq) { jq.eq(0).fadeIn("50", function() { // you can also set a timeout here if you'd like (jq = jq.slice(1)).length && fadeNext(jq); }); })($('html p')) $('#privacy ').click(function() { window.open('http://www.rangde.org/terms-of-use.htm'); }); $('#about').click(function() { window.open('http://www.rangde.org/about-rang-de.htm'); }); $('#madeanother').click(function() { $('#thankyoubox').hide(100); $('#ss-form').show(100); $('#submit').hide(); $('#bell').show(); $('input[name="entry.0.single"]').val(''); $('input[name="entry.1.single"]').val(''); $('input[name="entry.2.single"]').val(''); $('div.email_errorlabel').css('display', 'none'); $('#ie_label2').show(); }); $('h1.ss-form-title').hide(); $('#bell,#submit').hover(function() { tooltip.show('Double click the bell'); }, function() { tooltip.hide(); }); $('#steps_texts a').hover(function() { tooltip.show('<h3 style="color:#f60;">What next?</h3><ul style="list-style:circle; font-size:12px; color:#404040;"><li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span></li><li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span></li><li><span>You can fulfill the pledge by making a social investment for the pledged amount</span></li><li><span>You can <b style="color:#f00;">roll your mouse over it to see your name</b> and the names of thousands of other pledge owners.</span></li><li>And of course, everyone who pledges will be part of our <b style="color:#f00;">Christmas Lucky Draw on 25th December</b></li></ul>'); }, function() { tooltip.hide(); }); $('#submit').click(function() { var name = $('input[name="entry.0.single"]').val(); var amount = $('input[name="entry.2.single"]').val(); var light = $('<p></p>').attr('id', data[position].id).css('position', 'absolute').css('display', 'block'); light.addClass(name); light.addClass(' has pledged Rs.'); light.addClass(amount); light.offset({ top: postop[position].top, left: posleft[position].left }); var text = light.attr('class'); $("#lights").append(light); var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block'); div.text(text); div.offset({ top: divpostop[position].top, left: divposleft[position].left }); $('#lights').append(div); position++; position %= data.length; $('#tree').animate({ 'width': '+=3px' }, 1000); $('#ss-form').hide(); $('#thankyoubox').show(); }); $('#lights p').live('mouseover', function() { $('.pledgetooltip').hide(); var text = $(this).attr('class'); tooltip.show(text); }); $('#lights p').live('mouseout', function() { tooltip.hide(); }); $('img#bell').click(function() { $('div#error_labels').hide(); var emptyTextBoxes = $('form input[type=text],[type=password]').filter(function() { return this.value == ""; }); var input = document.getElementById('entry_2'); if (input.value.match(/^[1-9]\d00$/) \|\| !(input.value.match)("")) { $('.amount_errorlabel').css({ 'display': 'none', 'color': '#404040' }); } else { $('.amount_errorlabel').css({ 'display': 'inline', 'color': '#F00' }); return false; } var email = $('#entry_1').val(); if (email !== "") { if (email == "" \|\| !isValidEmailAddress(email)) { $('.email_errorlabel').css({ 'display': 'inline', 'color': '#F00' }); return false; } } function isValidEmailAddress(emailAddress) { var pattern = new RegExp(/^(("[\w-+\s]+")\|([\w-+]+(?:\.[\w-+]+))\|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)\|(@\[?((25[0-5]\.\|2[0-4][0-9]\.\|1[0-9]{2}\.\|[0-9]{1,2}\.))((25[0-5]\|2[0-4][0-9]\|1[0-9]{2}\|[0-9]{1,2})\.){2}(25[0-5]\|2[0-4][0-9]\|1[0-9]{2}\|[0-9]{1,2})\]?$)/i); return pattern.test(emailAddress); }; if (emptyTextBoxes.length < 1) { $('#bell').hide(); $('#submit').show(); } else { // ignore the click if all fields haven't been clicked emptyTextBoxes.each(function() { $(emptyTextBoxes).prevAll('#error_labels').css({ 'display': 'inline', 'color': '#F00' }); }); } }); }); < /script> </html >	ready
myfirst	< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < html > < head > < meta http - equiv = "Content-type" content = "text/html; charset=utf-8" / > < link href = "https://docs.google.com/static/spreadsheets/client/css/744745208-embedded_form_compiled.css" type = "text/css" rel = "stylesheet" > < link href = "includes/style.css" rel = "stylesheet" type = "text/css" / > < link media = "screen" rel = "stylesheet" href = "../css/colorbox.css" / > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" > < /script> <script src="js/jquery.colorbox.js "></script> <script> var $dr = jQuery.noConflict(); $dr(document).ready(function(){ //Examples of how to assign the ColorBox event to elements $dr(".group1 ").colorbox({rel:'group1'}); $dr(".group2 ").colorbox({rel:'group2', transition:" fade "}); $dr(".group3 ").colorbox({rel:'group3', transition:" none ", width:" 75 % ", height:" 75 % "}); $dr(".group4 ").colorbox({rel:'group4', slideshow:true}); $dr(".ajax ").colorbox(); $dr(".youtube ").colorbox({iframe:true, innerWidth:425, innerHeight:344}); $dr(".iframe ").colorbox({iframe:true, width:" 80 % ", height:" 80 % "}); $dr(".inline ").colorbox({inline:true, width:" 70 % "}); $dr(".callbacks ").colorbox({ onOpen:function(){ alert('onOpen: colorbox is about to open'); }, onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); }, onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); }, onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); }, onClosed:function(){ alert('onClosed: colorbox has completely closed'); } }); //Example of preserving a JavaScript event for inline calls. $dr("#click ").click(function(){ $('#click').css({" background - color ":"#f00 ", " color ":"#fff ", " cursor ":" inherit "}).text(" Open this window again and this message will still be here."); return false; }); }); </script> <title>Rang De Christmas Campaign.</title> <style type=" text / css " > body{background: #000;} #wrapper{width:920px;margin:0 auto;} #header{background: #000 url(images/christmas/background_image.png)repeat-y scroll left top;text-align:center;} #header h1{padding-top:125px;font-family: Arial, " MS Trebuchet ", sans-serif;color:white;} #body{background-color:#efefef;height:500px;} #nav{height:35px;background-color: #111;} #form_back{padding:100px 0px 0px 40px;} input[type=" text "]{margin-bottom:7px;box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:15px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important;} input::-webkit-input-placeholder { color: red;} input::-webkit-input-placeholder { color: #090;opacity:0.5;} #tt {position:absolute; display:block; } #tttop {display:block; height:5px; margin-left:5px; overflow:hidden} #ttcont {display:block;z-index:115; /background:#fff url(arrow_left.gif) top left no-repeat;/padding:2px 12px 3px 7px; margin-left:5px; border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;margin:10px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; color:#000;} #ttbot {display:block; height:5px; margin-left:5px; overflow:hidden} #bell{cursor:pointer;} #img_back{float:right;height:430px;} #tree_back{z-index:99;} #light1{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;} #light2{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light3{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light4{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;} #light5{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:220px;position:absolute;} #light6{height:18px;width:30px;background:url(images/christmas/gifts.png) -0px -70px no-repeat;top:-420px;left:190px;position:absolute;} #light7{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-40px;left:260px;position:absolute;} #light8{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:100px;position:absolute;} #light9{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-140px;left:120px;position:absolute;} #light10{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:200px;position:absolute;} #light11{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:300px;position:absolute;} #light12{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:240px;position:absolute;} #light13{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:340px;position:absolute;} #light14{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-150px;left:240px;position:absolute;} #light15{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-230px;left:260px;position:absolute;} #light16{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-367px;left:190px;position:absolute;} #light17{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-230px;left:100px;position:absolute;} #light18{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:130px;position:absolute;} #light19{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-10px;left:60px;position:absolute;} #light20{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:200px;position:absolute;} #light21{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:170px;position:absolute;} #light22{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-120px;left:50px;position:absolute;} #light23{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-210px;left:150px;position:absolute;} #light24{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-190px;left:80px;position:absolute;} #light25{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-70px;left:70px;position:absolute;} #light26{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:330px;position:absolute;} #light27{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-150px;left:330px;position:absolute;} #light28{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-190px;left:330px;position:absolute;} #light29{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -105px no-repeat;top:-420px;left:250px;position:absolute;} #light30{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:250px;position:absolute;} #light31{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-184px;left:250px;position:absolute;} #light32{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-70px;left:200px;position:absolute;} #light33{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:140px;position:absolute;} #light34{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:140px;position:absolute;} #light35{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:83px;position:absolute;} #light36{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:270px;position:absolute;} #light37{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:270px;position:absolute;} #light38{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:320px;position:absolute;} #light39{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-120px;left:270px;position:absolute;} #light40{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-230px;left:200px;position:absolute;} #light41{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:200px;position:absolute;} #light42{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:200px;position:absolute;} #light43{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-490px;left:200px;position:absolute;} #light44{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:230px;position:absolute;} #light45{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-40px;left:100px;position:absolute;} #light46{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-173px;left:130px;position:absolute;} #light47{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-120px;left:230px;position:absolute;} #light48{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-109px;left:350px;position:absolute;} #light49{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-240px;left:130px;position:absolute;} #light50{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-190px;left:170px;position:absolute;} #light51{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-260px;left:250px;position:absolute;} #light52{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:290px;position:absolute;} #light53{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:330px;position:absolute;} #light54{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:70px;position:absolute;} #light55{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;} #light56{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;} #light57{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:270px;position:absolute;} #light58{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:355px;position:absolute;} #light59{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-169px;left:310px;position:absolute;} #light60{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:150px;position:absolute;} #light61{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-370px;left:290px;position:absolute;} #light62{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-450px;left:230px;position:absolute;} #light63{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:160px;position:absolute;} #light64{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:80px;position:absolute;} #light65{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:350px;position:absolute;} #light66{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-70px;left:180px;position:absolute;} #light67{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-30px;left:80px;position:absolute;} #light68{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:300px;position:absolute;} #light69{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:60px;position:absolute;} #light70{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-40px;left:300px;position:absolute;} #light71{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-100px;left:300px;position:absolute;} #light72{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:150px;position:absolute;} #light73{height:18px;width:30px;background: url(images/christmas/gifts.png) -0px -70px no-repeat;top:-380px;left:180px;position:absolute;} #light74{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:120px;position:absolute;} #light75{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-180px;left:200px;position:absolute;} #light76{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-220px;left:280px;position:absolute;} #light77{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-125px;left:300px;position:absolute;} #light78{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:240px;position:absolute;} #light79{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-120px;left:120px;position:absolute;} #light80{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-50px;left:50px;position:absolute;} #light81{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-410px;left:240px;position:absolute;} #light82{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-70px;left:110px;position:absolute;} #light83{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:190px;position:absolute;} #light84{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:130px;position:absolute;} #light85{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-280px;left:190px;position:absolute;} #light86{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-90px;left:90px;position:absolute;} #light87{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-130px;left:90px;position:absolute;} #light88{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:270px;position:absolute;} #light89{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-130px;left:200px;position:absolute;} #light90{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:150px;position:absolute;} #light91{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light92{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light93{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light94{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light95{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light96{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light97{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light98{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} #light99{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;} /pink-ball: url(images/christmas/gifts.png) -37px -30px no-repeat orange-ball url(images/christmas/gifts.png) 0px -31px no-repeat zepra-gift-box url(images/christmas/gifts.png) 0px 0px no-repeat blue-giftbox url(images/christmas/gifts.png) -0px -70px no-repeat pink-gift-box url(images/christmas/gifts.png) -43px -70px no-repeat blue-ball url(images/christmas/gifts.png) -81px -37px no-repeat dark-orangeball url(images/christmas/gifts.png) -119px -35px no-repeat red-gift-box url(images/christmas/gifts.png) -81px -0px no-repeat star url(images/christmas/gifts.png) -40px -0px no-repeat / #details ul{padding:20px 0px 20px 20px; list-style:circle; color:#F09;} #details h3.sub-heading{ color:#F60;padding:0px !important;} #details ul li span{color:#404040;} #thankyoubox{box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:12px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important; width:250px;height:300px; text-align:left !important;} #lights{position:relative;left:0px;top:-400px;opacity:0.7;} #lights p{margin:0px;z-index:100;} .dispalynone{display:none;} html div.ss-legal{ display:none !important;} #footer_text{ background:url(images/christmas/footer_background.png) no-repeat; height:250px;z-index:0;} #footer_text img{padding-top:200px;} #ss-form{z-index:99;} input[type=submit]{ background:url(images/christmas/Christmas_bell.png) no-repeat; width:150px;height:150px;border:none;} #ss-form{background:none;box-shadow:0px 0px 10px #fff;box-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10p;border:1px solid #fff; -webkit-box-shadow:0px 0px 10px #fff;-moz-box-shadow:0px 0px 10px #fff;} .amount{display:block !important;} #cboxOverlay{ background:#fdf0bb !important;} #note_ul{list-style:none;padding:0px; font-size:12px; font-weight:bold; list-style:circle; color:#F06; font-size:14px; text-align:left !important;} ul#note_ul li span{ font-size:12px; color:#404040;} #step_for_pledge{ text-align:left !important; padding-left: 40px;} #steps_texts{padding-left: 35px;padding-top: 2px;font-weight:bold;font-size:14px;color:#090;} #steps_texts a{ font-size:11px; font-weight:normal;padding-right:10px; outline:none;} html p{display:none;} #ie_label1,#ie_label2,#ie_label3{display:none;text-align:left;margin-top:5px;padding-left:45px;} #search_bar{display:block;z-index:115; /background:#fff url(arrow_left.gif) top left no-repeat;/padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; color:#000; right:0;top:0;} #searchtextboxdiv{float:left;width:300px;} #searchtextarea{position:absolute;top:-700px;left:455px;padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px;padding:10px; background:#fff; -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc; box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;cursor:pointer; color:#000;width:190px;} #searchbuttondiv{} #searchtextarea{font-weight:bold;font-size:16px;color:#f00;} </style> <!--[if lte IE 6]> <style type=" text / css " media=" screen "> #header div{ background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='overlay.png', sizingMethod='scale'); } </style> <![endif]--> </head> <body> <div id=" wrapper "> <div id=" search_bar " style=" display: none; "> <div style=" width: 100 % "><span style=" color: #f00; font - weight: bold; font - size: 16px; ">Please enter your First name</span> <span style=" color: #7f7f7f;font-size:14px;">e.g: Arvind </span><br/></div> <div id= "searchtextboxdiv" > < input type = "text" id = "search_text" / > < /div> <div id="searchbuttondiv"><img src="/images / christmas / show_mygiftbutton.png " width=" 160 " id=" search_gift "/><a id=" close_searchbar " class=" fr " ><b>Hide</b></a></div> </div> <div id=" header "> <div id=" top_header "> <img src=" images / christmas / header - text.png " width=" 900 " /> </div> <div id=" img_back "> <div id=" tree_back "> <img src=" images / christmas / real - tree.png " width=" 455 " id=" tree " /> </div> <div id=" lights "> <p id=" searchtextarea ">Show my gift</p> <p id=" light25 " class=" Smita has pledged Rs.100 " ></p> <p id=" light24 " class=" Arvind Sridharan has pledged Rs.200 " ></p> <p id='light23' class='Nikhil Kaushal has pledged Rs.200'></p> <p id='light22' class='Aditi has pledged Rs.100'></p> <p id='light21' class='Aishwarya Singh has pledged Rs.500'></p> <p id='light20' class='Ram has pledged Rs.100'></p> <p id='light19' class='Amit Kumar has pledged Rs.200'></p> <p id='light18' class='Aishwarya Mishra has pledged Rs.1000'></p> <p id='light17' class='Chetan Agrawal has pledged Rs.500'></p> <p id='light16' class='ashish mehra has pledged Rs.3000'></p> <p id='light15' class='Piyush Goel has pledged Rs.200'></p> <p id='light14' class='Shantaram has pledged Rs.500'></p> <p id='light13' class='Akshay Pandey has pledged Rs.100'></p> <p id='light12' class='Abhishek Adhikari has pledged Rs.1000'></p> <p id='light11' class='dhiraj has pledged Rs.500'></p> <p id='light10' class='Rohit T George has pledged Rs.500'></p> <p id='light9' class='Pinky Goyal has pledged Rs.200'></p> <p id='light8' class='Sarathy Srinivas has pledged Rs.1000'></p> <p id='light7' class='Makarand has pledged Rs.100'></p> <p id='light6' class='Mitesh Tank has pledged Rs.5000'></p> <p id='light5' class='Jagannath R has pledged Rs.1000'></p> <!-- <p id='light4' class='Jagannath R has pledged Rs.500'></p>--> <!-- <p id='light3' class='Jagannath R has pledged Rs.500'></p>--> <!-- <p id='light2' class='Jagannath R has pledged Rs.500'></p>--> <p id='light26' class='Siddharth Agarwal has pledged Rs.200'></p> <p id='light27' class='sangeeta aisola has pledged Rs.100'></p> <p id='light28' class='nester has pledged Rs.500'></p> <p id='light29' class='Chirag has pledged Rs.5000'></p> <p id='light30' class='Pavithra Lakshmanan has pledged Rs.100'></p> <p id='light31' class='Priyanka Manjari has pledged Rs.500'></p> <p id='light32' class='Navneet Saxena has pledged Rs.100'></p> <p id='light33' class='Sanjay Bathija has pledged Rs.3000'></p> <p id='light34' class='amrita has pledged Rs.100'></p> <p id='light35' class='kiriti has pledged Rs.500'></p> <p id='light36' class='Kiran Challapalli has pledged Rs.1000'></p> <p id='light37' class='Amit Palrecha has pledged Rs.200'></p> <p id='light38' class='Srivatsan Hari has pledged Rs.500'></p> <p id='light39' class='Kalavathi has pledged Rs.100'></p> <p id='light40' class='Sampath G has pledged Rs.300'></p> <p id='light41' class='Vikash Kontia has pledged Rs.500'></p> <p id='light42' class='Binit has pledged Rs.100'></p> <p id='light43' class='Neha Tiwari has pledged Rs.10000'></p> <p id='light44' class='Loveen has pledged Rs.500'></p> <p id='light45' class='Rajdeep Poddar has pledged Rs.100'></p> <p id='light46' class='Suvadra Chakraborty has pledged Rs.200'></p> <p id='light47' class='Aritri has pledged Rs.100'></p> <p id='light48' class='Archana R has pledged Rs.200'></p> <p id='light49' class='anant bhatia has pledged Rs.500'></p> <p id='light50' class='Kavitha Udupa has pledged Rs.100'></p> <p id='light51' class='Sony Varghese has pledged Rs.500'></p> <p id='light52' class='Sony Varghese has pledged Rs.1000'></p> <p id='light53' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light54' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light55' class='THANDAVA KRISHNA has pledged Rs.400'></p> <p id='light56' class='Ujjwal Grover has pledged Rs.300'></p> <p id='light57' class='Balavinayagam.V.R has pledged Rs.500'></p> <p id='light58' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light59' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light60' class='Abhishek Pradhan has pledged Rs.500'></p> <p id='light61' class='Mohsin Khan has pledged Rs.1000'></p> <p id='light62' class='Mohsin Khan has pledged Rs.10000'></p> <p id='light63' class='Nita Row has pledged Rs.1000'></p> <p id='light64' class='Monu has pledged Rs.500'></p> <p id='light65' class='ANTONY CHRISTOPHER has pledged Rs.200'></p> <p id='light66' class='M.Sendhilvel has pledged Rs.100'></p> <p id='light67' class='pinda jatt has pledged Rs.100'></p> <p id='light68' class='Sreekanth has pledged Rs.1000'></p> <p id='light69' class='N Krishnamurthy has pledged Rs.100'></p> <p id='light70' class='auxilia has pledged Rs.200'></p> <p id='light71' class='Zishan Ansari has pledged Rs.200'></p> <p id='light72' class='Zishan Ansari has pledged Rs.200'></p> <p id='light73' class='Chirag has pledged Rs.5000'></p> <p id='light74' class='Deepesh Darla has pledged Rs.1000'></p> <p id='light75' class='ajay has pledged Rs.500'></p> <p id='light76' class='Payal Shah has pledged Rs.100'></p> <p id='light77' class='Gnanaraj Sadacharam has pledged Rs.300'></p> <p id='light78' class='chandan akella has pledged Rs.2500'></p> <p id='light79' class='Pranab has pledged Rs.200'></p> <p id='light80' class='Amit Ahuja has pledged Rs.200'></p> <p id='light81' class='Rajeev Shroff has pledged Rs.4000'></p> <p id='light82' class='nitya gaur has pledged Rs.100'></p> <p id='light83' class='Ravi Kumar has pledged Rs.500'></p> <p id='light84' class='Mohit has pledged Rs.500'></p> <p id='light85' class='Rakesh has pledged Rs.1100'></p> <p id='light86' class='Kshma Lal has pledged Rs.250'></p> <p id='light87' class='Aravind Deivendran has pledged Rs.500'></p> <p id='light88' class='shashidhara has pledged Rs.500'></p> <p id='light89' class='Satish has pledged Rs.100'></p> <p id='light90' class='Anita Menon has pledged Rs.500'></p> <p id='light91' class='Gokul has pledged Rs.500'></p> <p id='light92' class='Raghunandan Panigrahi has pledged Rs.100'></p> <p id='light93' class='Suchandra Chatterjee has pledged Rs.100'></p> <p id='light94' class='gaurav has pledged Rs.100'></p> <p id='light95' class='chandan has pledged Rs.200'></p> <p id='light96' class='Dwijesh Desai has pledged Rs.200'></p> <p id='light97' class='Dinoy Davis has pledged Rs.500'></p> <p id='light98' class='Kamlesh has pledged Rs.500'></p> <p id='light99' class='ravi sankar has pledged Rs.100'></p> </div> </div> <div id=" form_back " class=" fl w40 "> <div id=" thankyoubox " style=" display: none; "> <span style=" color: #090; font-size:18px;">Thanks for making a pledge!</span><br /><br /> <span>Simply mouseover the gifts on the Christmas Tree to see your name and others who have pledged.</span><br /><br /> <span>Invite your friends to light up our Christmas Tree!</span><br /> <br /><img src= "images/christmas/make_another_pleadge.png" width = "250" id = "madeanother" / > < br / > < br / > < div style = " width:250px;" > < img src = "images/christmas/share_ontext.png" width = "100" > < a class = "member" href = "http://www.facebook.com/sharer.php?s=100&p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&p[url]=http://tinyurl.com/d3vkw76&p[summary]=&p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target = "blank" > < img src = "images/christmas/facebook_icon.png" alt = "Share on Facebook" border = "0" > < /a> <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> < /div> </div > < div id = "ss-form" > < form action = "" method = "POST" target = "fake-target" onsubmit = "this.action='https://docs.google.com/a/rangde.org/spreadsheet/formResponse?formkey=dFlSZkt0TzZTWHJyblBiQlNrcmZvZGc6MQ&ifq'; if (validate(this)) {custommsg(); return true;} else return false;" > < br / > < div id = "step_for_pledge" > < div style = "clear:both;" > < div style = "width:20px; margin-bottom:10px;height:21px; background:url(images/christmas/number_buttons.png) 0px 0px no-repeat; float:left" > < /div><div id="steps_texts">Enter Your Details</div > < /div> <div style="clear:both;"> <div style="width:20px;margin-bottom:10px; height:21px; background:url(images/christmas / number_buttons.png) - 22px 0px no - repeat; float: left "></div><div id=" steps_texts ">Pledge an amount(Rs.100 or more)</div> </div> <div style=" clear: both; "> <div style=" width: 20px; margin - bottom: 10px; height: 21px; background: url(images / christmas / number_buttons.png) - 44px 0px no - repeat; float: left "></div><div id=" steps_texts ">Ring the bell<br/> <a href="#details " class=" inline " style=" text - decoration: underline; "> What next?</a></div> </div> </div> <br /><br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_0 ">Your Name<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_0 "></label></div> <div id=" ie_label1 "><label class=" ss - q - title " for=" entry_0 ">Your Name<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_0 "></label></div> <input type=" text " name=" entry.0.single " value="" class=" ss - q - short " id=" entry_0 " placeholder=" Your Name " /> <br /><br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_1 ">E-mail Address<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <div id=" ie_label2 " class=" email_errorlabel "><label class=" ss - q - title " for=" entry_1 ">E-mail Address<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <input type=" text " name=" entry.1.single " value="" class=" ss - q - short " id=" entry_1 " placeholder=" E - mail Address " /> <br /> <br /> <div style=" display: none; " id=" error_labels "><label class=" ss - q - title " for=" entry_2 ">Pledge Amount<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_2 "></label></div> <div id=" ie_label3 "><label class=" ss - q - title " for=" entry_2 ">Pledge Amount<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_2 "></label></div> <div style=" display: none; " class=" amount_errorlabel "><label class=" ss - q - title " for=" entry_1 ">Please enter an amount in multiples of 100<span class=" ss - required - asterisk "></span></label> <label class=" ss - q - help " for=" entry_1 "></label></div> <input type=" text " name=" entry.2.single " value="" class=" ss - q - short " id=" entry_2 " placeholder=" Pledge Amount " /> <br /> <br /> <img src=" images / christmas / Christmas_bell.png " width=" 150 " id=" bell " /> <div class=" ss - item ss - navigate "><div class=" ss - form - entry "> <input type=" submit " name=" submit " value="" id=" submit " style=" display: none; " /> <iframe src="#" id=" fake - target " name=" fake - target " style=" width: 0px; height: 0px; border: 0px; "></iframe> </div></div></form> </div> </div> <div class=" clearfloat "></div> <div id=" footer_text "> <div > <div style=" width: 250px; " ><img src=" images / christmas / share_ontext.png "><a class=" member " href=" http: //www.facebook.com/sharer.php?s=100&p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&p[url]=http://tinyurl.com/d3vkw76&p[summary]=&p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target="blank"> < img src = "images/christmas/facebook_icon.png" alt = "Share on Facebook" border = "0" > < /a> <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> < /div> <div style="margin-top:-25px"> <div id="privacy" style="width: 175px;cursor:pointer;height:30px;background: url(images/christmas / footer - text.png) - 400px 0px no - repeat; float: right; "></div><div style=" width: 200px; cursor: pointer; height: 30px; background: url(images / christmas / footer - text.png) - 190px 0px no - repeat; float: right; " href="#details " class=" inline "><a href="#details ">  </a></div> <div id=" about " style=" width: 120px; cursor: pointer; height: 30px; background: url(images / christmas / footer - text.png) - 50px 0px no - repeat; float: right; "></div> </div> <!--<img src=" footer - text.png " width=" 550 " usemap=" footer_links " />--> </div> </div> <map name=" footer_links "> <!--<area shape=" rect " coords=" 103, 140, 133, 168 " alt=" Sun " />--> <area shape=" rect " coords=" 370, 1, 631, 220 " alt=" policy " class='inline' href=" http: //www.rangde.org/terms-of-use.htm" /> < area shape = "rect" coords = "163,-6,370,218" alt = "details" class = 'inline' href = "#details" / > < area shape = "rect" coords = "-98,-3,163,216" alt = "about" class = 'inline' href = "http://www.rangde.org/rangde.htm" / > < /map> <div style="display:none;"> <div id="details"> <h3 class="sub-heading">Rang De brings to you a chance, to create the biggest Christmas tree ever. But this is not just another Christmas tree. <br / > This tree stands for hope, courage and the Christmas spirit itself! < br / > < /h3> <ul> <li><span>How to Participate?</span > < /li> <li><span>Enter your details</span > < /li> <li><span>Pledge an amount</span > < /li> <li><span>Ring the bell !!!</span > < /li> <li><span>And you become a part of the world's biggest Christmas Tree Online!</span > < /li></ul > < h3 class = "sub-heading" > What next ? < /h3> <ul> <li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span > < /li> <li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span > < /li> <li><span>You can fulfill the pledge by making a social investment for the pledged amount</span > < /li> <li><span>You can roll your mouse over it to see your name and the names of thousands of other pledge owners.</span > < /li> <li><span>And of course, everyone who pledges will be part of our Christmas Lucky Draw on 25th December</span > < /li></ul > < strong > The Goal : < /strong>We need to light them all by 0.00 hrs on 24th December. The more the pledge amount the bigger the tree will grow in size. For every pledge over Rs.100 the tree will grow in size proportionately.<br / > < br / > < h3 class = "sub-heading" > So what are you waiting for ? Ring the Bell! < /h3> <ul> <li><span>You get a Secret Santa Badge that you can share on Facebook & embed in your Email signature. Ask your friends to join you in your noble efforts!</span > < /li> <li><span>Go ahead and make a pledge this Christmas. Become a Secret Santa :)</span > < /li> <li><span>Please note – pledge owners would need to fulfill their pledge by helping someone through RangDe.org by 31st December 2011.</span > < /li></ul > < /div> </div > < /div> </div > < /body> <!-- Import jQuery--> <script src="js/tooltipjavascript.js "></script> <script src=" http : //ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script> < script type = "text/javascript" charset = "utf-8" > var $dj = jQuery.noConflict(); var scrollSpeed = 190; var step = 1; var current = 0; var imageHeight = 4300; var headerHeight = 650; var restartPosition = -(imageHeight - headerHeight); function scrollBg() { current += step; if (current == restartPosition) { current = 0; } $dj('#header').css("background-position", "0 " + current + "px"); } var init = setInterval("scrollBg()", scrollSpeed); < /script> <script type="text/javascript" language=" javascript " > var $dd = jQuery.noConflict(); $dd('document').ready(function () { if ($dd.browser.msie && $dd.browser.version <= 9){ $dd('#header').css('background','#fdf0bb'); $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'}); $dd('#ttcont').css('border','#fdf0bb'); $dd('#ie_label1').show(); $dd('#ie_label2').show(); $dd('#ie_label3').show(); (function fadeNext(jq){ jq.eq(0).show(" 200 ", function(){ // you can also set a timeout here if you'd like (jq=jq.slice(1)).length && fadeNext(jq); }); })($dd('html p')) } if ($dd.browser.msie){ $dd('#header').css('background','#fdf0bb'); $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'}); $dd('#ttcont').css('border','#fdf0bb'); $dd('#ie_label1').show(); $dd('#ie_label2').show(); $dd('#ie_label3').show(); } }); </script> <script type=" text / javascript " src=" js / jquery.autotab - 1.1b.js "></script> <script type=" text / javascript " language=" javascript " > var $ds = jQuery.noConflict(); $ds('document').ready(function () { $ds('input#entry_2').autotab_filter({ format: 'custom', pattern: '[^0-9\.]' }); }); </script> <script src=" http: //code.jquery.com/jquery-1.6.1.js" type="text/javascript" ></script> < script type = "text/javascript" language = "javascript" > $(document).ready(function() { var audioElement = document.createElement('audio'); audioElement.setAttribute('src', 'http://www.rangde.org/static/bell-ring-01.mp3'); $.get(); $('#submit').click(function() { audioElement.play(); }); }); < /script> <script src="http:/ / code.jquery.com / jquery - 1.6.1.js " type=" text / javascript " ></script> <script src=" https: //ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> < script type = "text/javascript" language = "javascript" charset = "utf-8" > var data = [ { 'id': 'light2' }, { 'id': 'light3' }, { 'id': 'light4' }, { 'id': 'light1' }]; var posleft = [{ 'left': '130' }, { 'left': '280' }, { 'left': '190' }, { 'left': '140' }, { 'left': '300' }, { 'left': '330' }, { 'left': '280' }, { 'left': '300' }, { 'left': '140' }, { 'left': '270' }, { 'left': '60' }, { 'left': '180' }, { 'left': '150' }, { 'left': '140' }, { 'left': '170' }] var postop = [{ 'top': '-320' }, { 'top': '-400' }, { 'top': '-450' }, { 'top': '-420' }, { 'top': '-449' }, { 'top': '-320' }, { 'top': '-450' }, { 'top': '-350' }, { 'top': '-320' }, { 'top': '-329' }, { 'top': '-340' }, { 'top': '-249' }, { 'top': '-310' }, { 'top': '-420' }, { 'top': '-339' }]; var divposleft = [{ 'left': '160' }, { 'left': '310' }, { 'left': '220' }, { 'left': '170' }, { 'left': '330' }, { 'left': '330' }, { 'left': '280' }, { 'left': '300' }, { 'left': '140' }, { 'left': '270' }, { 'left': '60' }, { 'left': '180' }, { 'left': '150' }, { 'left': '140' }, { 'left': '170' }] var divpostop = [{ 'top': '-350' }, { 'top': '-430' }, { 'top': '-480' }, { 'top': '-450' }, { 'top': '-479' }, { 'top': '-320' }, { 'top': '-450' }, { 'top': '-350' }, { 'top': '-320' }, { 'top': '-329' }, { 'top': '-340' }, { 'top': '-249' }, { 'top': '-310' }, { 'top': '-420' }, { 'top': '-339' }]; var position = 0; $('document').ready(function() { $('#searchtextarea').click(function() { $('#searchtextarea').hide(); $('#search_bar').show(); }); $('#close_searchbar').click(function() { $('#search_bar').hide(); $('#searchtextarea').show(); }); $('#search_gift').live('click', function() { var cssClass = $('#search_text').val(); var selector = 'p[class^="' + cssClass + '"]'; console.log(selector); var $elements = $(selector); $elements.each(function(i) { var classname = $(this).attr('class'); var toppos = $(this).css('top'); var leftpos = $(this).css('left'); var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block'); div.text(classname); div.css({ 'top': toppos, 'left': leftpos }); $('#lights').append(div); }); }); (function fadeNext(jq) { jq.eq(0).fadeIn("50", function() { // you can also set a timeout here if you'd like (jq = jq.slice(1)).length && fadeNext(jq); }); })($('html p')) $('#privacy ').click(function() { window.open('http://www.rangde.org/terms-of-use.htm'); }); $('#about').click(function() { window.open('http://www.rangde.org/about-rang-de.htm'); }); $('#madeanother').click(function() { $('#thankyoubox').hide(100); $('#ss-form').show(100); $('#submit').hide(); $('#bell').show(); $('input[name="entry.0.single"]').val(''); $('input[name="entry.1.single"]').val(''); $('input[name="entry.2.single"]').val(''); $('div.email_errorlabel').css('display', 'none'); $('#ie_label2').show(); }); $('h1.ss-form-title').hide(); $('#bell,#submit').hover(function() { tooltip.show('Double click the bell'); }, function() { tooltip.hide(); }); $('#steps_texts a').hover(function() { tooltip.show('<h3 style="color:#f60;">What next?</h3><ul style="list-style:circle; font-size:12px; color:#404040;"><li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span></li><li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span></li><li><span>You can fulfill the pledge by making a social investment for the pledged amount</span></li><li><span>You can <b style="color:#f00;">roll your mouse over it to see your name</b> and the names of thousands of other pledge owners.</span></li><li>And of course, everyone who pledges will be part of our <b style="color:#f00;">Christmas Lucky Draw on 25th December</b></li></ul>'); }, function() { tooltip.hide(); }); $('#submit').click(function() { var name = $('input[name="entry.0.single"]').val(); var amount = $('input[name="entry.2.single"]').val(); var light = $('<p></p>').attr('id', data[position].id).css('position', 'absolute').css('display', 'block'); light.addClass(name); light.addClass(' has pledged Rs.'); light.addClass(amount); light.offset({ top: postop[position].top, left: posleft[position].left }); var text = light.attr('class'); $("#lights").append(light); var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block'); div.text(text); div.offset({ top: divpostop[position].top, left: divposleft[position].left }); $('#lights').append(div); position++; position %= data.length; $('#tree').animate({ 'width': '+=3px' }, 1000); $('#ss-form').hide(); $('#thankyoubox').show(); }); $('#lights p').live('mouseover', function() { $('.pledgetooltip').hide(); var text = $(this).attr('class'); tooltip.show(text); }); $('#lights p').live('mouseout', function() { tooltip.hide(); }); $('img#bell').click(function() { $('div#error_labels').hide(); var emptyTextBoxes = $('form input[type=text],[type=password]').filter(function() { return this.value == ""; }); var input = document.getElementById('entry_2'); if (input.value.match(/^[1-9]\d00$/) \|\| !(input.value.match)("")) { $('.amount_errorlabel').css({ 'display': 'none', 'color': '#404040' }); } else { $('.amount_errorlabel').css({ 'display': 'inline', 'color': '#F00' }); return false; } var email = $('#entry_1').val(); if (email !== "") { if (email == "" \|\| !isValidEmailAddress(email)) { $('.email_errorlabel').css({ 'display': 'inline', 'color': '#F00' }); return false; } } function isValidEmailAddress(emailAddress) { var pattern = new RegExp(/^(("[\w-+\s]+")\|([\w-+]+(?:\.[\w-+]+))\|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)\|(@\[?((25[0-5]\.\|2[0-4][0-9]\.\|1[0-9]{2}\.\|[0-9]{1,2}\.))((25[0-5]\|2[0-4][0-9]\|1[0-9]{2}\|[0-9]{1,2})\.){2}(25[0-5]\|2[0-4][0-9]\|1[0-9]{2}\|[0-9]{1,2})\]?$)/i); return pattern.test(emailAddress); }; if (emptyTextBoxes.length < 1) { $('#bell').hide(); $('#submit').show(); } else { // ignore the click if all fields haven't been clicked emptyTextBoxes.each(function() { $(emptyTextBoxes).prevAll('#error_labels').css({ 'display': 'inline', 'color': '#F00' }); }); } }); }); < /script> </html >	ready

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < html > < head > < meta http - equiv = "Content-type"
content = "text/html; charset=utf-8" / > < link href = "https://docs.google.com/static/spreadsheets/client/css/744745208-embedded_form_compiled.css"
type = "text/css"
rel = "stylesheet" > < link href = "includes/style.css"
rel = "stylesheet"
type = "text/css" / > < link media = "screen"
rel = "stylesheet"
href = "../css/colorbox.css" / > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" > < /script>
       <script src="js/jquery.colorbox.js "></script>
        <script>
        var $dr = jQuery.noConflict();
                $dr(document).ready(function(){
                        //Examples of how to assign the ColorBox event to elements
                        $dr(".group1 ").colorbox({rel:'group1'});
                        $dr(".group2 ").colorbox({rel:'group2', transition:"
fade "});
                        $dr(".group3 ").colorbox({rel:'group3', transition:"
none ", width:"
75 % ", height:"
75 % "});
                        $dr(".group4 ").colorbox({rel:'group4', slideshow:true});
                        $dr(".ajax ").colorbox();
                        $dr(".youtube ").colorbox({iframe:true, innerWidth:425, innerHeight:344});
                        $dr(".iframe ").colorbox({iframe:true, width:"
80 % ", height:"
80 % "});
                        $dr(".inline ").colorbox({inline:true, width:"
70 % "});
                        $dr(".callbacks ").colorbox({
                                onOpen:function(){ alert('onOpen: colorbox is about to open'); },
                                onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
                                onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
                                onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
                                onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
                        });
                        
                        //Example of preserving a JavaScript event for inline calls.
                        $dr("#click ").click(function(){ 
                                $('#click').css({"
background - color ":"#f00 ", "
color ":"#fff ", "
cursor ":"
inherit "}).text("
Open this window again and this message will still be here.");
                                return false;
                        });
                });
        </script>
                <title>Rang De Christmas Campaign.</title>
                <style type="
text / css " >                  
                        body{background: #000;}         
                        #wrapper{width:920px;margin:0 auto;}    
                        #header{background: #000 url(images/christmas/background_image.png)repeat-y scroll left top;text-align:center;}                 
                        #header h1{padding-top:125px;font-family: Arial, "
MS Trebuchet ", sans-serif;color:white;}                
                        #body{background-color:#efefef;height:500px;}
                        #nav{height:35px;background-color: #111;}
                        #form_back{padding:100px 0px 0px 40px;}
                        input[type="
text "]{margin-bottom:7px;box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:15px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important;}
                        input::-webkit-input-placeholder { color: red;}
                        input::-webkit-input-placeholder { color: #090;opacity:0.5;}
                        #tt {position:absolute; display:block; }
                        #tttop {display:block; height:5px; margin-left:5px; overflow:hidden}
                        #ttcont {display:block;z-index:115;  /*background:#fff url(arrow_left.gif) top left no-repeat;*/padding:2px 12px 3px 7px; margin-left:5px; border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;margin:10px;padding:10px; background:#fff;    -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;   color:#000;}
                        #ttbot {display:block; height:5px; margin-left:5px; overflow:hidden}
                        #bell{cursor:pointer;}
                        #img_back{float:right;height:430px;}
                        #tree_back{z-index:99;}
                        #light1{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;}
                        #light2{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light3{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light4{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light5{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:220px;position:absolute;}

                        #light6{height:18px;width:30px;background:url(images/christmas/gifts.png) -0px -70px no-repeat;top:-420px;left:190px;position:absolute;}
                        #light7{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-40px;left:260px;position:absolute;}
                        #light8{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:100px;position:absolute;}
                        #light9{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-140px;left:120px;position:absolute;}
                        #light10{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:200px;position:absolute;}

                        #light11{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:300px;position:absolute;}
                        #light12{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:240px;position:absolute;}
                        #light13{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:340px;position:absolute;}
                        #light14{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-150px;left:240px;position:absolute;}
                        #light15{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-230px;left:260px;position:absolute;}

                        #light16{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-367px;left:190px;position:absolute;}
                        #light17{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-230px;left:100px;position:absolute;}
                        #light18{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:130px;position:absolute;}
                        #light19{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-10px;left:60px;position:absolute;}
                        #light20{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:200px;position:absolute;}
                        
                        #light21{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:170px;position:absolute;}
                        #light22{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-120px;left:50px;position:absolute;}
                        #light23{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-210px;left:150px;position:absolute;}
                        #light24{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-190px;left:80px;position:absolute;}
                        #light25{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-70px;left:70px;position:absolute;}
                        
                        #light26{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:330px;position:absolute;}
                        #light27{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-150px;left:330px;position:absolute;}
                        #light28{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-190px;left:330px;position:absolute;}
                        #light29{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -105px no-repeat;top:-420px;left:250px;position:absolute;}
                        #light30{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:250px;position:absolute;}
                        #light31{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-184px;left:250px;position:absolute;}
                        #light32{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-70px;left:200px;position:absolute;}
                        #light33{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:140px;position:absolute;}
                        #light34{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:140px;position:absolute;}
                        #light35{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:83px;position:absolute;}
                        #light36{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:270px;position:absolute;}
                        #light37{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:270px;position:absolute;}
                        #light38{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:320px;position:absolute;}
                        #light39{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-120px;left:270px;position:absolute;}
                        #light40{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-230px;left:200px;position:absolute;}
                        #light41{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:200px;position:absolute;}
                        #light42{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:200px;position:absolute;}
                        #light43{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-490px;left:200px;position:absolute;}
                        #light44{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:230px;position:absolute;}
                        #light45{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-40px;left:100px;position:absolute;}
                        #light46{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-173px;left:130px;position:absolute;}
                        #light47{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-120px;left:230px;position:absolute;}
                        #light48{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-109px;left:350px;position:absolute;}
                        #light49{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-240px;left:130px;position:absolute;}
                        #light50{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-190px;left:170px;position:absolute;}
                        #light51{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-260px;left:250px;position:absolute;}
                        #light52{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:290px;position:absolute;}
                        #light53{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:330px;position:absolute;}
                        #light54{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:70px;position:absolute;}
                        #light55{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;}
                        #light56{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;}
                        #light57{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:270px;position:absolute;}
                        #light58{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:355px;position:absolute;}
                        #light59{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-169px;left:310px;position:absolute;}
                        #light60{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:150px;position:absolute;}
                        #light61{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-370px;left:290px;position:absolute;}
                        #light62{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-450px;left:230px;position:absolute;}
                        #light63{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:160px;position:absolute;}
                        #light64{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:80px;position:absolute;}          
                        #light65{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:350px;position:absolute;}
                        #light66{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-70px;left:180px;position:absolute;}
                        #light67{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-30px;left:80px;position:absolute;} 
                        #light68{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:300px;position:absolute;}     
                        #light69{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:60px;position:absolute;}
                        #light70{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-40px;left:300px;position:absolute;}
                        #light71{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-100px;left:300px;position:absolute;}
                        #light72{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:150px;position:absolute;}
                        #light73{height:18px;width:30px;background: url(images/christmas/gifts.png) -0px -70px no-repeat;top:-380px;left:180px;position:absolute;}
                        #light74{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:120px;position:absolute;}
                        #light75{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-180px;left:200px;position:absolute;}
                        #light76{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-220px;left:280px;position:absolute;}
                        #light77{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-125px;left:300px;position:absolute;}
                        #light78{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:240px;position:absolute;}
                        #light79{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-120px;left:120px;position:absolute;}
                        #light80{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-50px;left:50px;position:absolute;}      
                        #light81{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-410px;left:240px;position:absolute;}
                        #light82{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-70px;left:110px;position:absolute;}
                        #light83{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:190px;position:absolute;}
                        #light84{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:130px;position:absolute;}
                        #light85{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-280px;left:190px;position:absolute;}
                        #light86{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-90px;left:90px;position:absolute;}
                        #light87{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-130px;left:90px;position:absolute;}
                        #light88{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:270px;position:absolute;} 
                        #light89{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-130px;left:200px;position:absolute;}
                        #light90{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:150px;position:absolute;}
                        #light91{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light92{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light93{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light94{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light95{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light96{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light97{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light98{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light99{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}                          
                                                                        /*pink-ball:
                                                 url(images/christmas/gifts.png) -37px -30px no-repeat
                                                
                                                orange-ball
                                                url(images/christmas/gifts.png) 0px -31px no-repeat
                                                
                                                zepra-gift-box
                                                url(images/christmas/gifts.png) 0px 0px no-repeat
                                                
                                                blue-giftbox
                                                url(images/christmas/gifts.png) -0px -70px no-repeat
                                                
                                                pink-gift-box
                                                url(images/christmas/gifts.png) -43px -70px no-repeat
                                                
                                                blue-ball
                                                url(images/christmas/gifts.png) -81px -37px no-repeat
                                                
                                                dark-orangeball
                                                url(images/christmas/gifts.png) -119px -35px no-repeat
                                                
                                                
                                                red-gift-box
                                                url(images/christmas/gifts.png) -81px -0px no-repeat
                                                
                                                
                                                star
                                                url(images/christmas/gifts.png) -40px -0px no-repeat
                        */
                        
                        
                        
                        #details ul{padding:20px 0px 20px 20px; list-style:circle; color:#F09;}
                        #details h3.sub-heading{ color:#F60;padding:0px !important;}
                        #details ul li span{color:#404040;}
                        #thankyoubox{box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:12px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important; width:250px;height:300px; text-align:left !important;}
                        
                        #lights{position:relative;left:0px;top:-400px;opacity:0.7;}
                        #lights p{margin:0px;z-index:100;}
                        .dispalynone{display:none;}
                        html div.ss-legal{ display:none !important;}
                        #footer_text{ background:url(images/christmas/footer_background.png) no-repeat; height:250px;z-index:0;}
                        #footer_text img{padding-top:200px;}
                        #ss-form{z-index:99;}
                        input[type=submit]{ background:url(images/christmas/Christmas_bell.png) no-repeat; width:150px;height:150px;border:none;}
                        #ss-form{background:none;box-shadow:0px 0px 10px #fff;box-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10p;border:1px solid #fff;
                         -webkit-box-shadow:0px 0px 10px #fff;-moz-box-shadow:0px 0px 10px #fff;}
                         .amount{display:block !important;}
                         #cboxOverlay{ background:#fdf0bb !important;}
                        #note_ul{list-style:none;padding:0px; font-size:12px; font-weight:bold; list-style:circle; color:#F06; font-size:14px; text-align:left !important;}
                        ul#note_ul li span{ font-size:12px; color:#404040;}
                        #step_for_pledge{ text-align:left !important; padding-left: 40px;}
                        #steps_texts{padding-left: 35px;padding-top: 2px;font-weight:bold;font-size:14px;color:#090;}
                        #steps_texts a{ font-size:11px; font-weight:normal;padding-right:10px; outline:none;}
                        html p{display:none;}
                        #ie_label1,#ie_label2,#ie_label3{display:none;text-align:left;margin-top:5px;padding-left:45px;}
                        #search_bar{display:block;z-index:115;  /*background:#fff url(arrow_left.gif) top left no-repeat;*/padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;padding:10px; background:#fff;     -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;   color:#000; right:0;top:0;}
                        #searchtextboxdiv{float:left;width:300px;}
                        #searchtextarea{position:absolute;top:-700px;left:455px;padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;padding:10px; background:#fff;     -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;cursor:pointer;    color:#000;width:190px;}
                        #searchbuttondiv{}
                        #searchtextarea{font-weight:bold;font-size:16px;color:#f00;}
                </style>
                <!--[if lte IE 6]>
                        <style type="
text / css " media="
screen ">
                                #header div{
                                        background-image: none;
                                        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='overlay.png', sizingMethod='scale');
                                }
                        </style>
                <![endif]-->
        </head>
        <body>
   
                <div id="
wrapper ">
                                <div id="
search_bar " style="
display: none;
">
                                <div style="
width: 100 % "><span style="
color: #f00;
font - weight: bold;
font - size: 16px;
">Please enter your First name</span> <span style="
color: #7f7f7f;font-size:14px;">e.g: Arvind </span><br/></div>
                                <div id= "searchtextboxdiv" > < input type = "text"
id = "search_text" / > < /div>
        <div id="searchbuttondiv"><img src="/images / christmas / show_mygiftbutton.png " width="
160 " id="
search_gift "/><a id="
close_searchbar "  class="
fr " ><b>Hide</b></a></div>
        
        </div>
                        <div id="
header ">
             <div id="
top_header ">
    <img src="
images / christmas / header - text.png " width="
900 " />
    </div>
            <div id="
img_back ">     
            <div id="
tree_back ">
            <img src="
images / christmas / real - tree.png " width="
455 " id="
tree " />
            </div>      

            <div id="
lights ">
            <p id="
searchtextarea ">Show my gift</p>
            <p id="
light25 " class="
Smita has pledged Rs.100 " ></p>
            <p id="
light24 " class="
Arvind Sridharan has pledged Rs.200 " ></p>
            <p id='light23' class='Nikhil Kaushal has pledged Rs.200'></p>
            <p id='light22' class='Aditi has pledged Rs.100'></p>
            <p id='light21' class='Aishwarya Singh has pledged Rs.500'></p>
            <p id='light20' class='Ram has pledged Rs.100'></p>
            <p id='light19' class='Amit Kumar has pledged Rs.200'></p>
            <p id='light18' class='Aishwarya Mishra has pledged Rs.1000'></p>
            <p id='light17' class='Chetan Agrawal has pledged Rs.500'></p>
            <p id='light16' class='ashish mehra has pledged Rs.3000'></p>
            <p id='light15' class='Piyush Goel has pledged Rs.200'></p>
            <p id='light14' class='Shantaram has pledged Rs.500'></p>
            <p id='light13' class='Akshay Pandey has pledged Rs.100'></p>
            <p id='light12' class='Abhishek Adhikari has pledged Rs.1000'></p>
            <p id='light11' class='dhiraj has pledged Rs.500'></p>
            <p id='light10' class='Rohit T George has pledged Rs.500'></p>
            <p id='light9' class='Pinky Goyal has pledged Rs.200'></p>
            <p id='light8' class='Sarathy Srinivas has pledged Rs.1000'></p>
            <p id='light7' class='Makarand has pledged Rs.100'></p>
            <p id='light6' class='Mitesh Tank has pledged Rs.5000'></p>
            <p id='light5' class='Jagannath R has pledged Rs.1000'></p>
<!--            <p id='light4' class='Jagannath R has pledged Rs.500'></p>-->
<!--            <p id='light3' class='Jagannath R has pledged Rs.500'></p>-->
<!--            <p id='light2' class='Jagannath R has pledged Rs.500'></p>-->
            <p id='light26' class='Siddharth Agarwal has pledged Rs.200'></p>
            <p id='light27' class='sangeeta aisola has pledged Rs.100'></p>
            <p id='light28' class='nester has pledged Rs.500'></p>
            <p id='light29' class='Chirag has pledged Rs.5000'></p>
            <p id='light30' class='Pavithra Lakshmanan has pledged Rs.100'></p>
            <p id='light31' class='Priyanka Manjari has pledged Rs.500'></p>
            <p id='light32' class='Navneet Saxena has pledged Rs.100'></p>
            <p id='light33' class='Sanjay Bathija has pledged Rs.3000'></p>
            <p id='light34' class='amrita has pledged Rs.100'></p>
            <p id='light35' class='kiriti has pledged Rs.500'></p>
            <p id='light36' class='Kiran Challapalli has pledged Rs.1000'></p>
            <p id='light37' class='Amit Palrecha has pledged Rs.200'></p>
            <p id='light38' class='Srivatsan Hari has pledged Rs.500'></p>
            <p id='light39' class='Kalavathi has pledged Rs.100'></p>
            <p id='light40' class='Sampath G has pledged Rs.300'></p>
            <p id='light41' class='Vikash Kontia has pledged Rs.500'></p>
            <p id='light42' class='Binit has pledged Rs.100'></p>
            <p id='light43' class='Neha Tiwari has pledged Rs.10000'></p>
            <p id='light44' class='Loveen has pledged Rs.500'></p>
            <p id='light45' class='Rajdeep Poddar has pledged Rs.100'></p>
            <p id='light46' class='Suvadra Chakraborty has pledged Rs.200'></p>
            <p id='light47' class='Aritri has pledged Rs.100'></p>
            <p id='light48' class='Archana R has pledged Rs.200'></p>
            <p id='light49' class='anant bhatia has pledged Rs.500'></p>
            <p id='light50' class='Kavitha Udupa has pledged Rs.100'></p>
            <p id='light51' class='Sony Varghese has pledged Rs.500'></p>
            <p id='light52' class='Sony Varghese has pledged Rs.1000'></p>
            <p id='light53' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light54' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light55' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light56' class='Ujjwal Grover has pledged Rs.300'></p>
            <p id='light57' class='Balavinayagam.V.R has pledged Rs.500'></p>
            <p id='light58' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light59' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light60' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light61' class='Mohsin Khan has pledged Rs.1000'></p>
            <p id='light62' class='Mohsin Khan has pledged Rs.10000'></p>
            <p id='light63' class='Nita Row has pledged Rs.1000'></p>
            <p id='light64' class='Monu has pledged Rs.500'></p>
            <p id='light65' class='ANTONY CHRISTOPHER has pledged Rs.200'></p>
            <p id='light66' class='M.Sendhilvel has pledged Rs.100'></p>
            <p id='light67' class='pinda jatt has pledged Rs.100'></p>
            <p id='light68' class='Sreekanth has pledged Rs.1000'></p>
            <p id='light69' class='N Krishnamurthy has pledged Rs.100'></p>
            <p id='light70' class='auxilia has pledged Rs.200'></p>
            <p id='light71' class='Zishan Ansari has pledged Rs.200'></p>
            <p id='light72' class='Zishan Ansari has pledged Rs.200'></p>
            <p id='light73' class='Chirag has pledged Rs.5000'></p>
            <p id='light74' class='Deepesh Darla has pledged Rs.1000'></p>
            <p id='light75' class='ajay has pledged Rs.500'></p>
            <p id='light76' class='Payal Shah has pledged Rs.100'></p>
            <p id='light77' class='Gnanaraj Sadacharam has pledged Rs.300'></p>
            <p id='light78' class='chandan akella has pledged Rs.2500'></p>
            <p id='light79' class='Pranab has pledged Rs.200'></p>
            <p id='light80' class='Amit Ahuja has pledged Rs.200'></p>
            <p id='light81' class='Rajeev Shroff has pledged Rs.4000'></p>
            <p id='light82' class='nitya gaur has pledged Rs.100'></p>
            <p id='light83' class='Ravi Kumar has pledged Rs.500'></p>
            <p id='light84' class='Mohit has pledged Rs.500'></p>
            <p id='light85' class='Rakesh has pledged Rs.1100'></p>
            <p id='light86' class='Kshma Lal has pledged Rs.250'></p>
            <p id='light87' class='Aravind Deivendran has pledged Rs.500'></p>
            <p id='light88' class='shashidhara has pledged Rs.500'></p>
            <p id='light89' class='Satish has pledged Rs.100'></p>
            <p id='light90' class='Anita Menon has pledged Rs.500'></p>
            <p id='light91' class='Gokul has pledged Rs.500'></p>
            <p id='light92' class='Raghunandan Panigrahi has pledged Rs.100'></p>
            <p id='light93' class='Suchandra Chatterjee has pledged Rs.100'></p>
            <p id='light94' class='gaurav has pledged Rs.100'></p>
            <p id='light95' class='chandan has pledged Rs.200'></p>
            <p id='light96' class='Dwijesh Desai has pledged Rs.200'></p>
            <p id='light97' class='Dinoy Davis has pledged Rs.500'></p>
            <p id='light98' class='Kamlesh has pledged Rs.500'></p>
            <p id='light99' class='ravi sankar has pledged Rs.100'></p>
            </div>
                        </div>  
                                
                                <div id="
form_back " class="
fl w40 ">
                
<div id="
thankyoubox " style="
display: none;
">
<span style="
color: #090; font-size:18px;">Thanks for making a pledge!</span><br /><br />

<span>Simply mouseover the gifts on the Christmas Tree to see your name and others who have pledged.</span><br /><br />

<span>Invite your friends to light up our Christmas Tree!</span><br />
<br /><img src= "images/christmas/make_another_pleadge.png"
width = "250"
id = "madeanother" / > < br / > < br / > < div style = " width:250px;" > < img src = "images/christmas/share_ontext.png"
width = "100" > < a class = "member"
href = "http://www.facebook.com/sharer.php?s=100&amp;p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&amp;p[url]=http://tinyurl.com/d3vkw76&amp;p[summary]=&amp;p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png"
target = "blank" > < img src = "images/christmas/facebook_icon.png"
alt = "Share on Facebook"
border = "0" > < /a>
            
                        <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&amp;text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> 
< /div>
</div > < div id = "ss-form" > < form action = ""
method = "POST"
target = "fake-target"
onsubmit = "this.action='https://docs.google.com/a/rangde.org/spreadsheet/formResponse?formkey=dFlSZkt0TzZTWHJyblBiQlNrcmZvZGc6MQ&amp;ifq'; if (validate(this)) {custommsg(); return true;} else return false;" > < br / > < div id = "step_for_pledge" > < div style = "clear:both;" > < div style = "width:20px; margin-bottom:10px;height:21px; background:url(images/christmas/number_buttons.png) 0px 0px no-repeat; float:left" > < /div><div id="steps_texts">Enter Your Details</div > < /div>
<div style="clear:both;">
<div style="width:20px;margin-bottom:10px; height:21px; background:url(images/christmas / number_buttons.png) - 22px 0px no - repeat;
float: left "></div><div id="
steps_texts ">Pledge an amount(Rs.100 or more)</div>
</div>
<div style="
clear: both;
">
<div style="
width: 20px;
margin - bottom: 10px;
height: 21px;
background: url(images / christmas / number_buttons.png) - 44px 0px no - repeat;
float: left "></div><div id="
steps_texts ">Ring the bell<br/> <a href="#details " class="
inline " style="
text - decoration: underline;
"> What next?</a></div>
</div>
</div>
<br /><br />

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_0 ">Your Name<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_0 "></label></div>
<div   id="
ie_label1 "><label class="
ss - q - title " for="
entry_0 ">Your Name<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_0 "></label></div>
<input type="
text " name="
entry.0.single " value="" class="
ss - q - short " id="
entry_0 " placeholder="
Your Name " />
<br /><br /> 

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_1 ">E-mail Address<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<div  id="
ie_label2 " class="
email_errorlabel "><label class="
ss - q - title " for="
entry_1 ">E-mail Address<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<input type="
text " name="
entry.1.single " value="" class="
ss - q - short " id="
entry_1 " placeholder="
E - mail Address " />
<br /> <br /> 

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_2 ">Pledge Amount<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_2 "></label></div>

<div   id="
ie_label3 "><label class="
ss - q - title " for="
entry_2 ">Pledge Amount<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_2 "></label></div>
<div  style="
display: none;
" class="
amount_errorlabel "><label class="
ss - q - title " for="
entry_1 ">Please enter an amount in multiples of 100<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<input type="
text " name="
entry.2.single " value="" class="
ss - q - short " id="
entry_2 " placeholder="
Pledge Amount " />
<br /> <br /> 


<img src="
images / christmas / Christmas_bell.png " width="
150 " id="
bell " />
<div class="
ss - item ss - navigate "><div class="
ss - form - entry ">
<input type="
submit " name="
submit " value="" id="
submit " style="
display: none;
" />
<iframe src="#" id="
fake - target " name="
fake - target " style="
width: 0px;
height: 0px;
border: 0px;
"></iframe>
</div></div></form>
</div>


</div>           
                
                <div class="
clearfloat "></div>
                 <div id="
footer_text ">
                <div >
                <div style="
width: 250px;
" ><img src="
images / christmas / share_ontext.png "><a class="
member " href="
http: //www.facebook.com/sharer.php?s=100&amp;p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&amp;p[url]=http://tinyurl.com/d3vkw76&amp;p[summary]=&amp;p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target="blank">
< img src = "images/christmas/facebook_icon.png"
alt = "Share on Facebook"
border = "0" > < /a>
            
                        <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&amp;text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> 
< /div>
           <div style="margin-top:-25px"> 
           <div id="privacy" style="width: 175px;cursor:pointer;height:30px;background: url(images/christmas / footer - text.png) - 400px 0px no - repeat;
float: right;
"></div><div  style="
width: 200px;
cursor: pointer;
height: 30px;
background: url(images / christmas / footer - text.png) - 190px 0px no - repeat;
float: right;
" href="#details " class="
inline "><a href="#details "> &nbsp;</a></div> <div id="
about " style="
width: 120px;
cursor: pointer;
height: 30px;
background: url(images / christmas / footer - text.png) - 50px 0px no - repeat;
float: right;
"></div>
           </div> <!--<img src="
footer - text.png " width="
550 " usemap="
footer_links " />-->
              </div>
                 </div>
                 
              
                 
                 
                  <map name="
footer_links ">
  <!--<area shape="
rect "   coords="
103, 140, 133, 168 " alt="
Sun "  />-->
  <area shape="
rect " coords="
370, 1, 631, 220 " alt="
policy " class='inline' href="
http: //www.rangde.org/terms-of-use.htm" />  
< area shape = "rect"
coords = "163,-6,370,218"
alt = "details"
class = 'inline'
href = "#details" / > < area shape = "rect"
coords = "-98,-3,163,216"
alt = "about"
class = 'inline'
href = "http://www.rangde.org/rangde.htm" / >

< /map>
<div style="display:none;">
<div id="details">

<h3 class="sub-heading">Rang De brings to you a chance, to create the biggest Christmas tree ever. But this is not just another Christmas tree. <br / > This tree stands
for hope,
courage and the Christmas spirit itself! < br / > < /h3>

<ul>
<li><span>How to Participate?</span > < /li>
<li><span>Enter your details</span > < /li>
<li><span>Pledge an amount</span > < /li>
<li><span>Ring the bell !!!</span > < /li>
<li><span>And you become a part of the world's biggest Christmas Tree Online!</span > < /li></ul >

< h3 class = "sub-heading" > What next ? < /h3>
<ul>
<li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span > < /li>
<li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span > < /li>
<li><span>You can fulfill the pledge by making a social investment for the pledged amount</span > < /li>
<li><span>You can roll your mouse over it to see your name and the names of thousands of other pledge owners.</span > < /li>
<li><span>And of course, everyone who pledges will be part of our Christmas Lucky Draw on 25th December</span > < /li></ul >

< strong > The Goal : < /strong>We need to light them all by 0.00 hrs on 24th December. The more the pledge amount the bigger the tree will grow in size. For every pledge over Rs.100 the tree will grow in size proportionately.<br / > < br / >

< h3 class = "sub-heading" > So what are you waiting
for ? Ring the Bell! < /h3>

<ul>
<li><span>You get a Secret Santa Badge that you can share on Facebook & embed in your Email signature.
Ask your friends to join you in your noble efforts!</span > < /li>

<li><span>Go ahead and make a pledge this Christmas. Become a Secret Santa :)</span > < /li>

<li><span>Please note – pledge owners would need to fulfill their pledge by helping someone through RangDe.org by 31st December 2011.</span > < /li></ul >


< /div>
</div >

< /div>
             
                        </div >


< /body>                
        
        <!-- Import jQuery-->
    <script src="js/tooltipjavascript.js "></script>
        <script src="
http : //ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
< script type = "text/javascript"
charset = "utf-8" >
var $dj = jQuery.noConflict();
var scrollSpeed = 190;
var step = 1;
var current = 0;
var imageHeight = 4300;
var headerHeight = 650;
var restartPosition = -(imageHeight - headerHeight);

function scrollBg() {
  current += step;
  if (current == restartPosition) {
    current = 0;
  }
  $dj('#header').css("background-position", "0 " + current + "px");
}
var init = setInterval("scrollBg()", scrollSpeed); < /script>


 <script type="text/javascript" language="
javascript " >
var $dd = jQuery.noConflict();
$dd('document').ready(function () {
        
if ($dd.browser.msie && $dd.browser.version <= 9){                      
        $dd('#header').css('background','#fdf0bb');     
        $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'});
        $dd('#ttcont').css('border','#fdf0bb');
        $dd('#ie_label1').show();
        $dd('#ie_label2').show();
        $dd('#ie_label3').show();
        (function fadeNext(jq){
            jq.eq(0).show("
200 ", function(){
                // you can also set a timeout here if you'd like
                (jq=jq.slice(1)).length && fadeNext(jq);
            });
        })($dd('html p'))       
}
if ($dd.browser.msie){                  
        $dd('#header').css('background','#fdf0bb');     
        $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'});
        $dd('#ttcont').css('border','#fdf0bb');
        $dd('#ie_label1').show();
        $dd('#ie_label2').show();
        $dd('#ie_label3').show();
                
}
});
</script>
<script type="
text / javascript " src="
js / jquery.autotab - 1.1b.js "></script>
<script type="
text / javascript " language="
javascript " >
var $ds = jQuery.noConflict();
$ds('document').ready(function () {
        $ds('input#entry_2').autotab_filter({ format: 'custom', pattern: '[^0-9\.]' });
        });
</script>


<script src="
http: //code.jquery.com/jquery-1.6.1.js" type="text/javascript" ></script>
< script type = "text/javascript"
language = "javascript" > $(document).ready(function() {
  var audioElement = document.createElement('audio');
  audioElement.setAttribute('src', 'http://www.rangde.org/static/bell-ring-01.mp3');
  $.get();

  $('#submit').click(function() {
    audioElement.play();
  });



}); < /script>
<script src="http:/ / code.jquery.com / jquery - 1.6.1.js " type="
text / javascript " ></script>
<script src="
https: //ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
< script type = "text/javascript"
language = "javascript"
charset = "utf-8" >
var data = [



{
  'id': 'light2'
}, {
  'id': 'light3'
}, {
  'id': 'light4'
}, {
  'id': 'light1'
}];

var posleft = [{
  'left': '130'
}, {
  'left': '280'
}, {
  'left': '190'
}, {
  'left': '140'
}, {
  'left': '300'
}, {
  'left': '330'
}, {
  'left': '280'
}, {
  'left': '300'
}, {
  'left': '140'
}, {
  'left': '270'
}, {
  'left': '60'
}, {
  'left': '180'
}, {
  'left': '150'
}, {
  'left': '140'
}, {
  'left': '170'
}]
var postop = [{
  'top': '-320'
}, {
  'top': '-400'
}, {
  'top': '-450'
}, {
  'top': '-420'
}, {
  'top': '-449'
}, {
  'top': '-320'
}, {
  'top': '-450'
}, {
  'top': '-350'
}, {
  'top': '-320'
}, {
  'top': '-329'
}, {
  'top': '-340'
}, {
  'top': '-249'
}, {
  'top': '-310'
}, {
  'top': '-420'
}, {
  'top': '-339'
}];
var divposleft = [{
  'left': '160'
}, {
  'left': '310'
}, {
  'left': '220'
}, {
  'left': '170'
}, {
  'left': '330'
}, {
  'left': '330'
}, {
  'left': '280'
}, {
  'left': '300'
}, {
  'left': '140'
}, {
  'left': '270'
}, {
  'left': '60'
}, {
  'left': '180'
}, {
  'left': '150'
}, {
  'left': '140'
}, {
  'left': '170'
}]
var divpostop = [{
  'top': '-350'
}, {
  'top': '-430'
}, {
  'top': '-480'
}, {
  'top': '-450'
}, {
  'top': '-479'
}, {
  'top': '-320'
}, {
  'top': '-450'
}, {
  'top': '-350'
}, {
  'top': '-320'
}, {
  'top': '-329'
}, {
  'top': '-340'
}, {
  'top': '-249'
}, {
  'top': '-310'
}, {
  'top': '-420'
}, {
  'top': '-339'
}];
var position = 0;

$('document').ready(function() {

  $('#searchtextarea').click(function() {
    $('#searchtextarea').hide();
    $('#search_bar').show();
  });
  $('#close_searchbar').click(function() {
    $('#search_bar').hide();
    $('#searchtextarea').show();
  });
  $('#search_gift').live('click', function() {
    var cssClass = $('#search_text').val();
    var selector = 'p[class^="' + cssClass + '"]';
    console.log(selector);
    var $elements = $(selector);
    $elements.each(function(i) {
      var classname = $(this).attr('class');
      var toppos = $(this).css('top');
      var leftpos = $(this).css('left');
      var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block');
      div.text(classname);
      div.css({
        'top': toppos,
        'left': leftpos
      });
      $('#lights').append(div);

    });

  });

  (function fadeNext(jq) {
    jq.eq(0).fadeIn("50", function() {
      // you can also set a timeout here if you'd like
      (jq = jq.slice(1)).length && fadeNext(jq);
    });
  })($('html p'))


  $('#privacy   ').click(function() {
    window.open('http://www.rangde.org/terms-of-use.htm');
  });
  $('#about').click(function() {
    window.open('http://www.rangde.org/about-rang-de.htm');
  });



  $('#madeanother').click(function() {
    $('#thankyoubox').hide(100);
    $('#ss-form').show(100);
    $('#submit').hide();
    $('#bell').show();
    $('input[name="entry.0.single"]').val('');
    $('input[name="entry.1.single"]').val('');
    $('input[name="entry.2.single"]').val('');
    $('div.email_errorlabel').css('display', 'none');
    $('#ie_label2').show();
  });

  $('h1.ss-form-title').hide();

  $('#bell,#submit').hover(function() {
    tooltip.show('Double click the bell');
  }, function() {
    tooltip.hide();
  });
  $('#steps_texts a').hover(function() {
    tooltip.show('<h3 style="color:#f60;">What next?</h3><ul style="list-style:circle; font-size:12px; color:#404040;"><li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span></li><li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span></li><li><span>You can fulfill the pledge by making a social investment for the pledged amount</span></li><li><span>You can <b style="color:#f00;">roll your mouse over it to see your name</b> and the names of thousands of other pledge owners.</span></li><li>And of course, everyone who pledges will be part of our <b style="color:#f00;">Christmas Lucky Draw on 25th December</b></li></ul>');
  }, function() {
    tooltip.hide();
  });

  $('#submit').click(function() {
    var name = $('input[name="entry.0.single"]').val();
    var amount = $('input[name="entry.2.single"]').val();
    var light = $('<p></p>').attr('id', data[position].id).css('position', 'absolute').css('display', 'block');

    light.addClass(name);
    light.addClass(' has pledged Rs.');
    light.addClass(amount);

    light.offset({
      top: postop[position].top,
      left: posleft[position].left
    });
    var text = light.attr('class');
    $("#lights").append(light);
    var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block');
    div.text(text);
    div.offset({
      top: divpostop[position].top,
      left: divposleft[position].left
    });
    $('#lights').append(div);
    position++;
    position %= data.length;
    $('#tree').animate({
      'width': '+=3px'
    }, 1000);
    $('#ss-form').hide();
    $('#thankyoubox').show();
  });




  $('#lights p').live('mouseover', function() {
    $('.pledgetooltip').hide();
    var text = $(this).attr('class');
    tooltip.show(text);
  });
  $('#lights p').live('mouseout', function() {

    tooltip.hide();
  });






  $('img#bell').click(function() {
    $('div#error_labels').hide();


    var emptyTextBoxes = $('form input[type=text],[type=password]').filter(function() {
      return this.value == "";
    });
    var input = document.getElementById('entry_2');
    if (input.value.match(/^[1-9]\d*00$/) || !(input.value.match)("")) {
      $('.amount_errorlabel').css({
        'display': 'none',
        'color': '#404040'
      });
    } else {
      $('.amount_errorlabel').css({
        'display': 'inline',
        'color': '#F00'
      });
      return false;
    }
    var email = $('#entry_1').val();
    if (email !== "") {
      if (email == "" || !isValidEmailAddress(email)) {
        $('.email_errorlabel').css({
          'display': 'inline',
          'color': '#F00'
        });
        return false;
      }
    }

    function isValidEmailAddress(emailAddress) {
      var pattern = new RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
      return pattern.test(emailAddress);
    };
    if (emptyTextBoxes.length < 1) {

      $('#bell').hide();
      $('#submit').show();

    } else {
      // ignore the click if all fields haven't been clicked
      emptyTextBoxes.each(function() {
        $(emptyTextBoxes).prevAll('#error_labels').css({
          'display': 'inline',
          'color': '#F00'
        });


      });
    }

  });

});


< /script>
</html >

ready

myfirst

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < html > < head > < meta http - equiv = "Content-type"
content = "text/html; charset=utf-8" / > < link href = "https://docs.google.com/static/spreadsheets/client/css/744745208-embedded_form_compiled.css"
type = "text/css"
rel = "stylesheet" > < link href = "includes/style.css"
rel = "stylesheet"
type = "text/css" / > < link media = "screen"
rel = "stylesheet"
href = "../css/colorbox.css" / > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" > < /script>
       <script src="js/jquery.colorbox.js "></script>
        <script>
        var $dr = jQuery.noConflict();
                $dr(document).ready(function(){
                        //Examples of how to assign the ColorBox event to elements
                        $dr(".group1 ").colorbox({rel:'group1'});
                        $dr(".group2 ").colorbox({rel:'group2', transition:"
fade "});
                        $dr(".group3 ").colorbox({rel:'group3', transition:"
none ", width:"
75 % ", height:"
75 % "});
                        $dr(".group4 ").colorbox({rel:'group4', slideshow:true});
                        $dr(".ajax ").colorbox();
                        $dr(".youtube ").colorbox({iframe:true, innerWidth:425, innerHeight:344});
                        $dr(".iframe ").colorbox({iframe:true, width:"
80 % ", height:"
80 % "});
                        $dr(".inline ").colorbox({inline:true, width:"
70 % "});
                        $dr(".callbacks ").colorbox({
                                onOpen:function(){ alert('onOpen: colorbox is about to open'); },
                                onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
                                onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
                                onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
                                onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
                        });
                        
                        //Example of preserving a JavaScript event for inline calls.
                        $dr("#click ").click(function(){ 
                                $('#click').css({"
background - color ":"#f00 ", "
color ":"#fff ", "
cursor ":"
inherit "}).text("
Open this window again and this message will still be here.");
                                return false;
                        });
                });
        </script>
                <title>Rang De Christmas Campaign.</title>
                <style type="
text / css " >                  
                        body{background: #000;}         
                        #wrapper{width:920px;margin:0 auto;}    
                        #header{background: #000 url(images/christmas/background_image.png)repeat-y scroll left top;text-align:center;}                 
                        #header h1{padding-top:125px;font-family: Arial, "
MS Trebuchet ", sans-serif;color:white;}                
                        #body{background-color:#efefef;height:500px;}
                        #nav{height:35px;background-color: #111;}
                        #form_back{padding:100px 0px 0px 40px;}
                        input[type="
text "]{margin-bottom:7px;box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:15px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important;}
                        input::-webkit-input-placeholder { color: red;}
                        input::-webkit-input-placeholder { color: #090;opacity:0.5;}
                        #tt {position:absolute; display:block; }
                        #tttop {display:block; height:5px; margin-left:5px; overflow:hidden}
                        #ttcont {display:block;z-index:115;  /*background:#fff url(arrow_left.gif) top left no-repeat;*/padding:2px 12px 3px 7px; margin-left:5px; border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;margin:10px;padding:10px; background:#fff;    -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;   color:#000;}
                        #ttbot {display:block; height:5px; margin-left:5px; overflow:hidden}
                        #bell{cursor:pointer;}
                        #img_back{float:right;height:430px;}
                        #tree_back{z-index:99;}
                        #light1{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;}
                        #light2{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light3{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light4{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light5{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:220px;position:absolute;}

                        #light6{height:18px;width:30px;background:url(images/christmas/gifts.png) -0px -70px no-repeat;top:-420px;left:190px;position:absolute;}
                        #light7{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-40px;left:260px;position:absolute;}
                        #light8{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:100px;position:absolute;}
                        #light9{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-140px;left:120px;position:absolute;}
                        #light10{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:200px;position:absolute;}

                        #light11{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:300px;position:absolute;}
                        #light12{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:240px;position:absolute;}
                        #light13{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:340px;position:absolute;}
                        #light14{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-150px;left:240px;position:absolute;}
                        #light15{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-230px;left:260px;position:absolute;}

                        #light16{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-367px;left:190px;position:absolute;}
                        #light17{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-230px;left:100px;position:absolute;}
                        #light18{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:130px;position:absolute;}
                        #light19{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-10px;left:60px;position:absolute;}
                        #light20{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:200px;position:absolute;}
                        
                        #light21{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:170px;position:absolute;}
                        #light22{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-120px;left:50px;position:absolute;}
                        #light23{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-210px;left:150px;position:absolute;}
                        #light24{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-190px;left:80px;position:absolute;}
                        #light25{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-70px;left:70px;position:absolute;}
                        
                        #light26{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:330px;position:absolute;}
                        #light27{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-150px;left:330px;position:absolute;}
                        #light28{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-190px;left:330px;position:absolute;}
                        #light29{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -105px no-repeat;top:-420px;left:250px;position:absolute;}
                        #light30{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:250px;position:absolute;}
                        #light31{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-184px;left:250px;position:absolute;}
                        #light32{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-70px;left:200px;position:absolute;}
                        #light33{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:140px;position:absolute;}
                        #light34{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:140px;position:absolute;}
                        #light35{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:83px;position:absolute;}
                        #light36{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:270px;position:absolute;}
                        #light37{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:270px;position:absolute;}
                        #light38{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:320px;position:absolute;}
                        #light39{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-120px;left:270px;position:absolute;}
                        #light40{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-230px;left:200px;position:absolute;}
                        #light41{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:200px;position:absolute;}
                        #light42{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:200px;position:absolute;}
                        #light43{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-490px;left:200px;position:absolute;}
                        #light44{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:230px;position:absolute;}
                        #light45{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-40px;left:100px;position:absolute;}
                        #light46{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-173px;left:130px;position:absolute;}
                        #light47{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-120px;left:230px;position:absolute;}
                        #light48{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-109px;left:350px;position:absolute;}
                        #light49{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-240px;left:130px;position:absolute;}
                        #light50{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-190px;left:170px;position:absolute;}
                        #light51{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-260px;left:250px;position:absolute;}
                        #light52{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:290px;position:absolute;}
                        #light53{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:330px;position:absolute;}
                        #light54{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:70px;position:absolute;}
                        #light55{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;}
                        #light56{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;}
                        #light57{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:270px;position:absolute;}
                        #light58{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:355px;position:absolute;}
                        #light59{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-169px;left:310px;position:absolute;}
                        #light60{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:150px;position:absolute;}
                        #light61{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-370px;left:290px;position:absolute;}
                        #light62{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-450px;left:230px;position:absolute;}
                        #light63{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:160px;position:absolute;}
                        #light64{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:80px;position:absolute;}          
                        #light65{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:350px;position:absolute;}
                        #light66{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-70px;left:180px;position:absolute;}
                        #light67{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-30px;left:80px;position:absolute;} 
                        #light68{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:300px;position:absolute;}     
                        #light69{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:60px;position:absolute;}
                        #light70{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-40px;left:300px;position:absolute;}
                        #light71{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-100px;left:300px;position:absolute;}
                        #light72{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:150px;position:absolute;}
                        #light73{height:18px;width:30px;background: url(images/christmas/gifts.png) -0px -70px no-repeat;top:-380px;left:180px;position:absolute;}
                        #light74{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:120px;position:absolute;}
                        #light75{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-180px;left:200px;position:absolute;}
                        #light76{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-220px;left:280px;position:absolute;}
                        #light77{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-125px;left:300px;position:absolute;}
                        #light78{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:240px;position:absolute;}
                        #light79{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-120px;left:120px;position:absolute;}
                        #light80{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-50px;left:50px;position:absolute;}      
                        #light81{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-410px;left:240px;position:absolute;}
                        #light82{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-70px;left:110px;position:absolute;}
                        #light83{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:190px;position:absolute;}
                        #light84{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:130px;position:absolute;}
                        #light85{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-280px;left:190px;position:absolute;}
                        #light86{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-90px;left:90px;position:absolute;}
                        #light87{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-130px;left:90px;position:absolute;}
                        #light88{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:270px;position:absolute;} 
                        #light89{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-130px;left:200px;position:absolute;}
                        #light90{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:150px;position:absolute;}
                        #light91{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light92{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light93{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light94{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light95{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light96{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light97{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light98{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light99{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}                          
                                                                        /*pink-ball:
                                                 url(images/christmas/gifts.png) -37px -30px no-repeat
                                                
                                                orange-ball
                                                url(images/christmas/gifts.png) 0px -31px no-repeat
                                                
                                                zepra-gift-box
                                                url(images/christmas/gifts.png) 0px 0px no-repeat
                                                
                                                blue-giftbox
                                                url(images/christmas/gifts.png) -0px -70px no-repeat
                                                
                                                pink-gift-box
                                                url(images/christmas/gifts.png) -43px -70px no-repeat
                                                
                                                blue-ball
                                                url(images/christmas/gifts.png) -81px -37px no-repeat
                                                
                                                dark-orangeball
                                                url(images/christmas/gifts.png) -119px -35px no-repeat
                                                
                                                
                                                red-gift-box
                                                url(images/christmas/gifts.png) -81px -0px no-repeat
                                                
                                                
                                                star
                                                url(images/christmas/gifts.png) -40px -0px no-repeat
                        */
                        
                        
                        
                        #details ul{padding:20px 0px 20px 20px; list-style:circle; color:#F09;}
                        #details h3.sub-heading{ color:#F60;padding:0px !important;}
                        #details ul li span{color:#404040;}
                        #thankyoubox{box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:12px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important; width:250px;height:300px; text-align:left !important;}
                        
                        #lights{position:relative;left:0px;top:-400px;opacity:0.7;}
                        #lights p{margin:0px;z-index:100;}
                        .dispalynone{display:none;}
                        html div.ss-legal{ display:none !important;}
                        #footer_text{ background:url(images/christmas/footer_background.png) no-repeat; height:250px;z-index:0;}
                        #footer_text img{padding-top:200px;}
                        #ss-form{z-index:99;}
                        input[type=submit]{ background:url(images/christmas/Christmas_bell.png) no-repeat; width:150px;height:150px;border:none;}
                        #ss-form{background:none;box-shadow:0px 0px 10px #fff;box-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10p;border:1px solid #fff;
                         -webkit-box-shadow:0px 0px 10px #fff;-moz-box-shadow:0px 0px 10px #fff;}
                         .amount{display:block !important;}
                         #cboxOverlay{ background:#fdf0bb !important;}
                        #note_ul{list-style:none;padding:0px; font-size:12px; font-weight:bold; list-style:circle; color:#F06; font-size:14px; text-align:left !important;}
                        ul#note_ul li span{ font-size:12px; color:#404040;}
                        #step_for_pledge{ text-align:left !important; padding-left: 40px;}
                        #steps_texts{padding-left: 35px;padding-top: 2px;font-weight:bold;font-size:14px;color:#090;}
                        #steps_texts a{ font-size:11px; font-weight:normal;padding-right:10px; outline:none;}
                        html p{display:none;}
                        #ie_label1,#ie_label2,#ie_label3{display:none;text-align:left;margin-top:5px;padding-left:45px;}
                        #search_bar{display:block;z-index:115;  /*background:#fff url(arrow_left.gif) top left no-repeat;*/padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;padding:10px; background:#fff;     -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;   color:#000; right:0;top:0;}
                        #searchtextboxdiv{float:left;width:300px;}
                        #searchtextarea{position:absolute;top:-700px;left:455px;padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;padding:10px; background:#fff;     -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;cursor:pointer;    color:#000;width:190px;}
                        #searchbuttondiv{}
                        #searchtextarea{font-weight:bold;font-size:16px;color:#f00;}
                </style>
                <!--[if lte IE 6]>
                        <style type="
text / css " media="
screen ">
                                #header div{
                                        background-image: none;
                                        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='overlay.png', sizingMethod='scale');
                                }
                        </style>
                <![endif]-->
        </head>
        <body>
   
                <div id="
wrapper ">
                                <div id="
search_bar " style="
display: none;
">
                                <div style="
width: 100 % "><span style="
color: #f00;
font - weight: bold;
font - size: 16px;
">Please enter your First name</span> <span style="
color: #7f7f7f;font-size:14px;">e.g: Arvind </span><br/></div>
                                <div id= "searchtextboxdiv" > < input type = "text"
id = "search_text" / > < /div>
        <div id="searchbuttondiv"><img src="/images / christmas / show_mygiftbutton.png " width="
160 " id="
search_gift "/><a id="
close_searchbar "  class="
fr " ><b>Hide</b></a></div>
        
        </div>
                        <div id="
header ">
             <div id="
top_header ">
    <img src="
images / christmas / header - text.png " width="
900 " />
    </div>
            <div id="
img_back ">     
            <div id="
tree_back ">
            <img src="
images / christmas / real - tree.png " width="
455 " id="
tree " />
            </div>      

            <div id="
lights ">
            <p id="
searchtextarea ">Show my gift</p>
            <p id="
light25 " class="
Smita has pledged Rs.100 " ></p>
            <p id="
light24 " class="
Arvind Sridharan has pledged Rs.200 " ></p>
            <p id='light23' class='Nikhil Kaushal has pledged Rs.200'></p>
            <p id='light22' class='Aditi has pledged Rs.100'></p>
            <p id='light21' class='Aishwarya Singh has pledged Rs.500'></p>
            <p id='light20' class='Ram has pledged Rs.100'></p>
            <p id='light19' class='Amit Kumar has pledged Rs.200'></p>
            <p id='light18' class='Aishwarya Mishra has pledged Rs.1000'></p>
            <p id='light17' class='Chetan Agrawal has pledged Rs.500'></p>
            <p id='light16' class='ashish mehra has pledged Rs.3000'></p>
            <p id='light15' class='Piyush Goel has pledged Rs.200'></p>
            <p id='light14' class='Shantaram has pledged Rs.500'></p>
            <p id='light13' class='Akshay Pandey has pledged Rs.100'></p>
            <p id='light12' class='Abhishek Adhikari has pledged Rs.1000'></p>
            <p id='light11' class='dhiraj has pledged Rs.500'></p>
            <p id='light10' class='Rohit T George has pledged Rs.500'></p>
            <p id='light9' class='Pinky Goyal has pledged Rs.200'></p>
            <p id='light8' class='Sarathy Srinivas has pledged Rs.1000'></p>
            <p id='light7' class='Makarand has pledged Rs.100'></p>
            <p id='light6' class='Mitesh Tank has pledged Rs.5000'></p>
            <p id='light5' class='Jagannath R has pledged Rs.1000'></p>
<!--            <p id='light4' class='Jagannath R has pledged Rs.500'></p>-->
<!--            <p id='light3' class='Jagannath R has pledged Rs.500'></p>-->
<!--            <p id='light2' class='Jagannath R has pledged Rs.500'></p>-->
            <p id='light26' class='Siddharth Agarwal has pledged Rs.200'></p>
            <p id='light27' class='sangeeta aisola has pledged Rs.100'></p>
            <p id='light28' class='nester has pledged Rs.500'></p>
            <p id='light29' class='Chirag has pledged Rs.5000'></p>
            <p id='light30' class='Pavithra Lakshmanan has pledged Rs.100'></p>
            <p id='light31' class='Priyanka Manjari has pledged Rs.500'></p>
            <p id='light32' class='Navneet Saxena has pledged Rs.100'></p>
            <p id='light33' class='Sanjay Bathija has pledged Rs.3000'></p>
            <p id='light34' class='amrita has pledged Rs.100'></p>
            <p id='light35' class='kiriti has pledged Rs.500'></p>
            <p id='light36' class='Kiran Challapalli has pledged Rs.1000'></p>
            <p id='light37' class='Amit Palrecha has pledged Rs.200'></p>
            <p id='light38' class='Srivatsan Hari has pledged Rs.500'></p>
            <p id='light39' class='Kalavathi has pledged Rs.100'></p>
            <p id='light40' class='Sampath G has pledged Rs.300'></p>
            <p id='light41' class='Vikash Kontia has pledged Rs.500'></p>
            <p id='light42' class='Binit has pledged Rs.100'></p>
            <p id='light43' class='Neha Tiwari has pledged Rs.10000'></p>
            <p id='light44' class='Loveen has pledged Rs.500'></p>
            <p id='light45' class='Rajdeep Poddar has pledged Rs.100'></p>
            <p id='light46' class='Suvadra Chakraborty has pledged Rs.200'></p>
            <p id='light47' class='Aritri has pledged Rs.100'></p>
            <p id='light48' class='Archana R has pledged Rs.200'></p>
            <p id='light49' class='anant bhatia has pledged Rs.500'></p>
            <p id='light50' class='Kavitha Udupa has pledged Rs.100'></p>
            <p id='light51' class='Sony Varghese has pledged Rs.500'></p>
            <p id='light52' class='Sony Varghese has pledged Rs.1000'></p>
            <p id='light53' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light54' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light55' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light56' class='Ujjwal Grover has pledged Rs.300'></p>
            <p id='light57' class='Balavinayagam.V.R has pledged Rs.500'></p>
            <p id='light58' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light59' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light60' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light61' class='Mohsin Khan has pledged Rs.1000'></p>
            <p id='light62' class='Mohsin Khan has pledged Rs.10000'></p>
            <p id='light63' class='Nita Row has pledged Rs.1000'></p>
            <p id='light64' class='Monu has pledged Rs.500'></p>
            <p id='light65' class='ANTONY CHRISTOPHER has pledged Rs.200'></p>
            <p id='light66' class='M.Sendhilvel has pledged Rs.100'></p>
            <p id='light67' class='pinda jatt has pledged Rs.100'></p>
            <p id='light68' class='Sreekanth has pledged Rs.1000'></p>
            <p id='light69' class='N Krishnamurthy has pledged Rs.100'></p>
            <p id='light70' class='auxilia has pledged Rs.200'></p>
            <p id='light71' class='Zishan Ansari has pledged Rs.200'></p>
            <p id='light72' class='Zishan Ansari has pledged Rs.200'></p>
            <p id='light73' class='Chirag has pledged Rs.5000'></p>
            <p id='light74' class='Deepesh Darla has pledged Rs.1000'></p>
            <p id='light75' class='ajay has pledged Rs.500'></p>
            <p id='light76' class='Payal Shah has pledged Rs.100'></p>
            <p id='light77' class='Gnanaraj Sadacharam has pledged Rs.300'></p>
            <p id='light78' class='chandan akella has pledged Rs.2500'></p>
            <p id='light79' class='Pranab has pledged Rs.200'></p>
            <p id='light80' class='Amit Ahuja has pledged Rs.200'></p>
            <p id='light81' class='Rajeev Shroff has pledged Rs.4000'></p>
            <p id='light82' class='nitya gaur has pledged Rs.100'></p>
            <p id='light83' class='Ravi Kumar has pledged Rs.500'></p>
            <p id='light84' class='Mohit has pledged Rs.500'></p>
            <p id='light85' class='Rakesh has pledged Rs.1100'></p>
            <p id='light86' class='Kshma Lal has pledged Rs.250'></p>
            <p id='light87' class='Aravind Deivendran has pledged Rs.500'></p>
            <p id='light88' class='shashidhara has pledged Rs.500'></p>
            <p id='light89' class='Satish has pledged Rs.100'></p>
            <p id='light90' class='Anita Menon has pledged Rs.500'></p>
            <p id='light91' class='Gokul has pledged Rs.500'></p>
            <p id='light92' class='Raghunandan Panigrahi has pledged Rs.100'></p>
            <p id='light93' class='Suchandra Chatterjee has pledged Rs.100'></p>
            <p id='light94' class='gaurav has pledged Rs.100'></p>
            <p id='light95' class='chandan has pledged Rs.200'></p>
            <p id='light96' class='Dwijesh Desai has pledged Rs.200'></p>
            <p id='light97' class='Dinoy Davis has pledged Rs.500'></p>
            <p id='light98' class='Kamlesh has pledged Rs.500'></p>
            <p id='light99' class='ravi sankar has pledged Rs.100'></p>
            </div>
                        </div>  
                                
                                <div id="
form_back " class="
fl w40 ">
                
<div id="
thankyoubox " style="
display: none;
">
<span style="
color: #090; font-size:18px;">Thanks for making a pledge!</span><br /><br />

<span>Simply mouseover the gifts on the Christmas Tree to see your name and others who have pledged.</span><br /><br />

<span>Invite your friends to light up our Christmas Tree!</span><br />
<br /><img src= "images/christmas/make_another_pleadge.png"
width = "250"
id = "madeanother" / > < br / > < br / > < div style = " width:250px;" > < img src = "images/christmas/share_ontext.png"
width = "100" > < a class = "member"
href = "http://www.facebook.com/sharer.php?s=100&amp;p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&amp;p[url]=http://tinyurl.com/d3vkw76&amp;p[summary]=&amp;p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png"
target = "blank" > < img src = "images/christmas/facebook_icon.png"
alt = "Share on Facebook"
border = "0" > < /a>
            
                        <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&amp;text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> 
< /div>
</div > < div id = "ss-form" > < form action = ""
method = "POST"
target = "fake-target"
onsubmit = "this.action='https://docs.google.com/a/rangde.org/spreadsheet/formResponse?formkey=dFlSZkt0TzZTWHJyblBiQlNrcmZvZGc6MQ&amp;ifq'; if (validate(this)) {custommsg(); return true;} else return false;" > < br / > < div id = "step_for_pledge" > < div style = "clear:both;" > < div style = "width:20px; margin-bottom:10px;height:21px; background:url(images/christmas/number_buttons.png) 0px 0px no-repeat; float:left" > < /div><div id="steps_texts">Enter Your Details</div > < /div>
<div style="clear:both;">
<div style="width:20px;margin-bottom:10px; height:21px; background:url(images/christmas / number_buttons.png) - 22px 0px no - repeat;
float: left "></div><div id="
steps_texts ">Pledge an amount(Rs.100 or more)</div>
</div>
<div style="
clear: both;
">
<div style="
width: 20px;
margin - bottom: 10px;
height: 21px;
background: url(images / christmas / number_buttons.png) - 44px 0px no - repeat;
float: left "></div><div id="
steps_texts ">Ring the bell<br/> <a href="#details " class="
inline " style="
text - decoration: underline;
"> What next?</a></div>
</div>
</div>
<br /><br />

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_0 ">Your Name<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_0 "></label></div>
<div   id="
ie_label1 "><label class="
ss - q - title " for="
entry_0 ">Your Name<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_0 "></label></div>
<input type="
text " name="
entry.0.single " value="" class="
ss - q - short " id="
entry_0 " placeholder="
Your Name " />
<br /><br /> 

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_1 ">E-mail Address<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<div  id="
ie_label2 " class="
email_errorlabel "><label class="
ss - q - title " for="
entry_1 ">E-mail Address<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<input type="
text " name="
entry.1.single " value="" class="
ss - q - short " id="
entry_1 " placeholder="
E - mail Address " />
<br /> <br /> 

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_2 ">Pledge Amount<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_2 "></label></div>

<div   id="
ie_label3 "><label class="
ss - q - title " for="
entry_2 ">Pledge Amount<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_2 "></label></div>
<div  style="
display: none;
" class="
amount_errorlabel "><label class="
ss - q - title " for="
entry_1 ">Please enter an amount in multiples of 100<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<input type="
text " name="
entry.2.single " value="" class="
ss - q - short " id="
entry_2 " placeholder="
Pledge Amount " />
<br /> <br /> 


<img src="
images / christmas / Christmas_bell.png " width="
150 " id="
bell " />
<div class="
ss - item ss - navigate "><div class="
ss - form - entry ">
<input type="
submit " name="
submit " value="" id="
submit " style="
display: none;
" />
<iframe src="#" id="
fake - target " name="
fake - target " style="
width: 0px;
height: 0px;
border: 0px;
"></iframe>
</div></div></form>
</div>


</div>           
                
                <div class="
clearfloat "></div>
                 <div id="
footer_text ">
                <div >
                <div style="
width: 250px;
" ><img src="
images / christmas / share_ontext.png "><a class="
member " href="
http: //www.facebook.com/sharer.php?s=100&amp;p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&amp;p[url]=http://tinyurl.com/d3vkw76&amp;p[summary]=&amp;p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target="blank">
< img src = "images/christmas/facebook_icon.png"
alt = "Share on Facebook"
border = "0" > < /a>
            
                        <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&amp;text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> 
< /div>
           <div style="margin-top:-25px"> 
           <div id="privacy" style="width: 175px;cursor:pointer;height:30px;background: url(images/christmas / footer - text.png) - 400px 0px no - repeat;
float: right;
"></div><div  style="
width: 200px;
cursor: pointer;
height: 30px;
background: url(images / christmas / footer - text.png) - 190px 0px no - repeat;
float: right;
" href="#details " class="
inline "><a href="#details "> &nbsp;</a></div> <div id="
about " style="
width: 120px;
cursor: pointer;
height: 30px;
background: url(images / christmas / footer - text.png) - 50px 0px no - repeat;
float: right;
"></div>
           </div> <!--<img src="
footer - text.png " width="
550 " usemap="
footer_links " />-->
              </div>
                 </div>
                 
              
                 
                 
                  <map name="
footer_links ">
  <!--<area shape="
rect "   coords="
103, 140, 133, 168 " alt="
Sun "  />-->
  <area shape="
rect " coords="
370, 1, 631, 220 " alt="
policy " class='inline' href="
http: //www.rangde.org/terms-of-use.htm" />  
< area shape = "rect"
coords = "163,-6,370,218"
alt = "details"
class = 'inline'
href = "#details" / > < area shape = "rect"
coords = "-98,-3,163,216"
alt = "about"
class = 'inline'
href = "http://www.rangde.org/rangde.htm" / >

< /map>
<div style="display:none;">
<div id="details">

<h3 class="sub-heading">Rang De brings to you a chance, to create the biggest Christmas tree ever. But this is not just another Christmas tree. <br / > This tree stands
for hope,
courage and the Christmas spirit itself! < br / > < /h3>

<ul>
<li><span>How to Participate?</span > < /li>
<li><span>Enter your details</span > < /li>
<li><span>Pledge an amount</span > < /li>
<li><span>Ring the bell !!!</span > < /li>
<li><span>And you become a part of the world's biggest Christmas Tree Online!</span > < /li></ul >

< h3 class = "sub-heading" > What next ? < /h3>
<ul>
<li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span > < /li>
<li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span > < /li>
<li><span>You can fulfill the pledge by making a social investment for the pledged amount</span > < /li>
<li><span>You can roll your mouse over it to see your name and the names of thousands of other pledge owners.</span > < /li>
<li><span>And of course, everyone who pledges will be part of our Christmas Lucky Draw on 25th December</span > < /li></ul >

< strong > The Goal : < /strong>We need to light them all by 0.00 hrs on 24th December. The more the pledge amount the bigger the tree will grow in size. For every pledge over Rs.100 the tree will grow in size proportionately.<br / > < br / >

< h3 class = "sub-heading" > So what are you waiting
for ? Ring the Bell! < /h3>

<ul>
<li><span>You get a Secret Santa Badge that you can share on Facebook & embed in your Email signature.
Ask your friends to join you in your noble efforts!</span > < /li>

<li><span>Go ahead and make a pledge this Christmas. Become a Secret Santa :)</span > < /li>

<li><span>Please note – pledge owners would need to fulfill their pledge by helping someone through RangDe.org by 31st December 2011.</span > < /li></ul >


< /div>
</div >

< /div>
             
                        </div >


< /body>                
        
        <!-- Import jQuery-->
    <script src="js/tooltipjavascript.js "></script>
        <script src="
http : //ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
< script type = "text/javascript"
charset = "utf-8" >
var $dj = jQuery.noConflict();
var scrollSpeed = 190;
var step = 1;
var current = 0;
var imageHeight = 4300;
var headerHeight = 650;
var restartPosition = -(imageHeight - headerHeight);

function scrollBg() {
  current += step;
  if (current == restartPosition) {
    current = 0;
  }
  $dj('#header').css("background-position", "0 " + current + "px");
}
var init = setInterval("scrollBg()", scrollSpeed); < /script>


 <script type="text/javascript" language="
javascript " >
var $dd = jQuery.noConflict();
$dd('document').ready(function () {
        
if ($dd.browser.msie && $dd.browser.version <= 9){                      
        $dd('#header').css('background','#fdf0bb');     
        $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'});
        $dd('#ttcont').css('border','#fdf0bb');
        $dd('#ie_label1').show();
        $dd('#ie_label2').show();
        $dd('#ie_label3').show();
        (function fadeNext(jq){
            jq.eq(0).show("
200 ", function(){
                // you can also set a timeout here if you'd like
                (jq=jq.slice(1)).length && fadeNext(jq);
            });
        })($dd('html p'))       
}
if ($dd.browser.msie){                  
        $dd('#header').css('background','#fdf0bb');     
        $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'});
        $dd('#ttcont').css('border','#fdf0bb');
        $dd('#ie_label1').show();
        $dd('#ie_label2').show();
        $dd('#ie_label3').show();
                
}
});
</script>
<script type="
text / javascript " src="
js / jquery.autotab - 1.1b.js "></script>
<script type="
text / javascript " language="
javascript " >
var $ds = jQuery.noConflict();
$ds('document').ready(function () {
        $ds('input#entry_2').autotab_filter({ format: 'custom', pattern: '[^0-9\.]' });
        });
</script>


<script src="
http: //code.jquery.com/jquery-1.6.1.js" type="text/javascript" ></script>
< script type = "text/javascript"
language = "javascript" > $(document).ready(function() {
  var audioElement = document.createElement('audio');
  audioElement.setAttribute('src', 'http://www.rangde.org/static/bell-ring-01.mp3');
  $.get();

  $('#submit').click(function() {
    audioElement.play();
  });



}); < /script>
<script src="http:/ / code.jquery.com / jquery - 1.6.1.js " type="
text / javascript " ></script>
<script src="
https: //ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
< script type = "text/javascript"
language = "javascript"
charset = "utf-8" >
var data = [



{
  'id': 'light2'
}, {
  'id': 'light3'
}, {
  'id': 'light4'
}, {
  'id': 'light1'
}];

var posleft = [{
  'left': '130'
}, {
  'left': '280'
}, {
  'left': '190'
}, {
  'left': '140'
}, {
  'left': '300'
}, {
  'left': '330'
}, {
  'left': '280'
}, {
  'left': '300'
}, {
  'left': '140'
}, {
  'left': '270'
}, {
  'left': '60'
}, {
  'left': '180'
}, {
  'left': '150'
}, {
  'left': '140'
}, {
  'left': '170'
}]
var postop = [{
  'top': '-320'
}, {
  'top': '-400'
}, {
  'top': '-450'
}, {
  'top': '-420'
}, {
  'top': '-449'
}, {
  'top': '-320'
}, {
  'top': '-450'
}, {
  'top': '-350'
}, {
  'top': '-320'
}, {
  'top': '-329'
}, {
  'top': '-340'
}, {
  'top': '-249'
}, {
  'top': '-310'
}, {
  'top': '-420'
}, {
  'top': '-339'
}];
var divposleft = [{
  'left': '160'
}, {
  'left': '310'
}, {
  'left': '220'
}, {
  'left': '170'
}, {
  'left': '330'
}, {
  'left': '330'
}, {
  'left': '280'
}, {
  'left': '300'
}, {
  'left': '140'
}, {
  'left': '270'
}, {
  'left': '60'
}, {
  'left': '180'
}, {
  'left': '150'
}, {
  'left': '140'
}, {
  'left': '170'
}]
var divpostop = [{
  'top': '-350'
}, {
  'top': '-430'
}, {
  'top': '-480'
}, {
  'top': '-450'
}, {
  'top': '-479'
}, {
  'top': '-320'
}, {
  'top': '-450'
}, {
  'top': '-350'
}, {
  'top': '-320'
}, {
  'top': '-329'
}, {
  'top': '-340'
}, {
  'top': '-249'
}, {
  'top': '-310'
}, {
  'top': '-420'
}, {
  'top': '-339'
}];
var position = 0;

$('document').ready(function() {

  $('#searchtextarea').click(function() {
    $('#searchtextarea').hide();
    $('#search_bar').show();
  });
  $('#close_searchbar').click(function() {
    $('#search_bar').hide();
    $('#searchtextarea').show();
  });
  $('#search_gift').live('click', function() {
    var cssClass = $('#search_text').val();
    var selector = 'p[class^="' + cssClass + '"]';
    console.log(selector);
    var $elements = $(selector);
    $elements.each(function(i) {
      var classname = $(this).attr('class');
      var toppos = $(this).css('top');
      var leftpos = $(this).css('left');
      var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block');
      div.text(classname);
      div.css({
        'top': toppos,
        'left': leftpos
      });
      $('#lights').append(div);

    });

  });

  (function fadeNext(jq) {
    jq.eq(0).fadeIn("50", function() {
      // you can also set a timeout here if you'd like
      (jq = jq.slice(1)).length && fadeNext(jq);
    });
  })($('html p'))


  $('#privacy   ').click(function() {
    window.open('http://www.rangde.org/terms-of-use.htm');
  });
  $('#about').click(function() {
    window.open('http://www.rangde.org/about-rang-de.htm');
  });



  $('#madeanother').click(function() {
    $('#thankyoubox').hide(100);
    $('#ss-form').show(100);
    $('#submit').hide();
    $('#bell').show();
    $('input[name="entry.0.single"]').val('');
    $('input[name="entry.1.single"]').val('');
    $('input[name="entry.2.single"]').val('');
    $('div.email_errorlabel').css('display', 'none');
    $('#ie_label2').show();
  });

  $('h1.ss-form-title').hide();

  $('#bell,#submit').hover(function() {
    tooltip.show('Double click the bell');
  }, function() {
    tooltip.hide();
  });
  $('#steps_texts a').hover(function() {
    tooltip.show('<h3 style="color:#f60;">What next?</h3><ul style="list-style:circle; font-size:12px; color:#404040;"><li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span></li><li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span></li><li><span>You can fulfill the pledge by making a social investment for the pledged amount</span></li><li><span>You can <b style="color:#f00;">roll your mouse over it to see your name</b> and the names of thousands of other pledge owners.</span></li><li>And of course, everyone who pledges will be part of our <b style="color:#f00;">Christmas Lucky Draw on 25th December</b></li></ul>');
  }, function() {
    tooltip.hide();
  });

  $('#submit').click(function() {
    var name = $('input[name="entry.0.single"]').val();
    var amount = $('input[name="entry.2.single"]').val();
    var light = $('<p></p>').attr('id', data[position].id).css('position', 'absolute').css('display', 'block');

    light.addClass(name);
    light.addClass(' has pledged Rs.');
    light.addClass(amount);

    light.offset({
      top: postop[position].top,
      left: posleft[position].left
    });
    var text = light.attr('class');
    $("#lights").append(light);
    var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block');
    div.text(text);
    div.offset({
      top: divpostop[position].top,
      left: divposleft[position].left
    });
    $('#lights').append(div);
    position++;
    position %= data.length;
    $('#tree').animate({
      'width': '+=3px'
    }, 1000);
    $('#ss-form').hide();
    $('#thankyoubox').show();
  });




  $('#lights p').live('mouseover', function() {
    $('.pledgetooltip').hide();
    var text = $(this).attr('class');
    tooltip.show(text);
  });
  $('#lights p').live('mouseout', function() {

    tooltip.hide();
  });






  $('img#bell').click(function() {
    $('div#error_labels').hide();


    var emptyTextBoxes = $('form input[type=text],[type=password]').filter(function() {
      return this.value == "";
    });
    var input = document.getElementById('entry_2');
    if (input.value.match(/^[1-9]\d*00$/) || !(input.value.match)("")) {
      $('.amount_errorlabel').css({
        'display': 'none',
        'color': '#404040'
      });
    } else {
      $('.amount_errorlabel').css({
        'display': 'inline',
        'color': '#F00'
      });
      return false;
    }
    var email = $('#entry_1').val();
    if (email !== "") {
      if (email == "" || !isValidEmailAddress(email)) {
        $('.email_errorlabel').css({
          'display': 'inline',
          'color': '#F00'
        });
        return false;
      }
    }

    function isValidEmailAddress(emailAddress) {
      var pattern = new RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
      return pattern.test(emailAddress);
    };
    if (emptyTextBoxes.length < 1) {

      $('#bell').hide();
      $('#submit').show();

    } else {
      // ignore the click if all fields haven't been clicked
      emptyTextBoxes.each(function() {
        $(emptyTextBoxes).prevAll('#error_labels').css({
          'display': 'inline',
          'color': '#F00'
        });


      });
    }

  });

});


< /script>
</html >

ready

myfirst

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < html > < head > < meta http - equiv = "Content-type"
content = "text/html; charset=utf-8" / > < link href = "https://docs.google.com/static/spreadsheets/client/css/744745208-embedded_form_compiled.css"
type = "text/css"
rel = "stylesheet" > < link href = "includes/style.css"
rel = "stylesheet"
type = "text/css" / > < link media = "screen"
rel = "stylesheet"
href = "../css/colorbox.css" / > < script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" > < /script>
       <script src="js/jquery.colorbox.js "></script>
        <script>
        var $dr = jQuery.noConflict();
                $dr(document).ready(function(){
                        //Examples of how to assign the ColorBox event to elements
                        $dr(".group1 ").colorbox({rel:'group1'});
                        $dr(".group2 ").colorbox({rel:'group2', transition:"
fade "});
                        $dr(".group3 ").colorbox({rel:'group3', transition:"
none ", width:"
75 % ", height:"
75 % "});
                        $dr(".group4 ").colorbox({rel:'group4', slideshow:true});
                        $dr(".ajax ").colorbox();
                        $dr(".youtube ").colorbox({iframe:true, innerWidth:425, innerHeight:344});
                        $dr(".iframe ").colorbox({iframe:true, width:"
80 % ", height:"
80 % "});
                        $dr(".inline ").colorbox({inline:true, width:"
70 % "});
                        $dr(".callbacks ").colorbox({
                                onOpen:function(){ alert('onOpen: colorbox is about to open'); },
                                onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
                                onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
                                onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
                                onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
                        });
                        
                        //Example of preserving a JavaScript event for inline calls.
                        $dr("#click ").click(function(){ 
                                $('#click').css({"
background - color ":"#f00 ", "
color ":"#fff ", "
cursor ":"
inherit "}).text("
Open this window again and this message will still be here.");
                                return false;
                        });
                });
        </script>
                <title>Rang De Christmas Campaign.</title>
                <style type="
text / css " >                  
                        body{background: #000;}         
                        #wrapper{width:920px;margin:0 auto;}    
                        #header{background: #000 url(images/christmas/background_image.png)repeat-y scroll left top;text-align:center;}                 
                        #header h1{padding-top:125px;font-family: Arial, "
MS Trebuchet ", sans-serif;color:white;}                
                        #body{background-color:#efefef;height:500px;}
                        #nav{height:35px;background-color: #111;}
                        #form_back{padding:100px 0px 0px 40px;}
                        input[type="
text "]{margin-bottom:7px;box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:15px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important;}
                        input::-webkit-input-placeholder { color: red;}
                        input::-webkit-input-placeholder { color: #090;opacity:0.5;}
                        #tt {position:absolute; display:block; }
                        #tttop {display:block; height:5px; margin-left:5px; overflow:hidden}
                        #ttcont {display:block;z-index:115;  /*background:#fff url(arrow_left.gif) top left no-repeat;*/padding:2px 12px 3px 7px; margin-left:5px; border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;margin:10px;padding:10px; background:#fff;    -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;   color:#000;}
                        #ttbot {display:block; height:5px; margin-left:5px; overflow:hidden}
                        #bell{cursor:pointer;}
                        #img_back{float:right;height:430px;}
                        #tree_back{z-index:99;}
                        #light1{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;}
                        #light2{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light3{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light4{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;}
                        #light5{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:220px;position:absolute;}

                        #light6{height:18px;width:30px;background:url(images/christmas/gifts.png) -0px -70px no-repeat;top:-420px;left:190px;position:absolute;}
                        #light7{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-40px;left:260px;position:absolute;}
                        #light8{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-320px;left:100px;position:absolute;}
                        #light9{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-140px;left:120px;position:absolute;}
                        #light10{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:200px;position:absolute;}

                        #light11{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:300px;position:absolute;}
                        #light12{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:240px;position:absolute;}
                        #light13{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:340px;position:absolute;}
                        #light14{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-150px;left:240px;position:absolute;}
                        #light15{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-230px;left:260px;position:absolute;}

                        #light16{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-367px;left:190px;position:absolute;}
                        #light17{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-230px;left:100px;position:absolute;}
                        #light18{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:130px;position:absolute;}
                        #light19{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-10px;left:60px;position:absolute;}
                        #light20{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-100px;left:200px;position:absolute;}
                        
                        #light21{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:170px;position:absolute;}
                        #light22{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-120px;left:50px;position:absolute;}
                        #light23{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-210px;left:150px;position:absolute;}
                        #light24{height:18px;width:30px;background:url(images/christmas/gifts.png) -119px -35px no-repeat;top:-190px;left:80px;position:absolute;}
                        #light25{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-70px;left:70px;position:absolute;}
                        
                        #light26{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:330px;position:absolute;}
                        #light27{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -31px no-repeat;top:-150px;left:330px;position:absolute;}
                        #light28{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-190px;left:330px;position:absolute;}
                        #light29{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px -105px no-repeat;top:-420px;left:250px;position:absolute;}
                        #light30{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:250px;position:absolute;}
                        #light31{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-184px;left:250px;position:absolute;}
                        #light32{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-70px;left:200px;position:absolute;}
                        #light33{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:140px;position:absolute;}
                        #light34{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-80px;left:140px;position:absolute;}
                        #light35{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:83px;position:absolute;}
                        #light36{height:18px;width:30px;background:url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:270px;position:absolute;}
                        #light37{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-70px;left:270px;position:absolute;}
                        #light38{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:320px;position:absolute;}
                        #light39{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-120px;left:270px;position:absolute;}
                        #light40{height:18px;width:30px;background:url(images/christmas/gifts.png) -81px -37px no-repeat;top:-230px;left:200px;position:absolute;}
                        #light41{height:18px;width:30px;background:url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:200px;position:absolute;}
                        #light42{height:18px;width:30px;background:url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:200px;position:absolute;}
                        #light43{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-490px;left:200px;position:absolute;}
                        #light44{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:230px;position:absolute;}
                        #light45{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-40px;left:100px;position:absolute;}
                        #light46{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-173px;left:130px;position:absolute;}
                        #light47{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-120px;left:230px;position:absolute;}
                        #light48{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-109px;left:350px;position:absolute;}
                        #light49{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-240px;left:130px;position:absolute;}
                        #light50{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-190px;left:170px;position:absolute;}
                        #light51{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-260px;left:250px;position:absolute;}
                        #light52{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:290px;position:absolute;}
                        #light53{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:330px;position:absolute;}
                        #light54{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-220px;left:70px;position:absolute;}
                        #light55{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;}
                        #light56{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-157px;left:270px;position:absolute;}
                        #light57{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:270px;position:absolute;}
                        #light58{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-177px;left:355px;position:absolute;}
                        #light59{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-169px;left:310px;position:absolute;}
                        #light60{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-40px;left:150px;position:absolute;}
                        #light61{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-370px;left:290px;position:absolute;}
                        #light62{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-450px;left:230px;position:absolute;}
                        #light63{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-330px;left:160px;position:absolute;}
                        #light64{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:80px;position:absolute;}          
                        #light65{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:350px;position:absolute;}
                        #light66{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-70px;left:180px;position:absolute;}
                        #light67{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-30px;left:80px;position:absolute;} 
                        #light68{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-350px;left:300px;position:absolute;}     
                        #light69{height:18px;width:30px;background: url(images/christmas/gifts.png) -40px -0px no-repeat;top:-150px;left:60px;position:absolute;}
                        #light70{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-40px;left:300px;position:absolute;}
                        #light71{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-100px;left:300px;position:absolute;}
                        #light72{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-140px;left:150px;position:absolute;}
                        #light73{height:18px;width:30px;background: url(images/christmas/gifts.png) -0px -70px no-repeat;top:-380px;left:180px;position:absolute;}
                        #light74{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-300px;left:120px;position:absolute;}
                        #light75{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-180px;left:200px;position:absolute;}
                        #light76{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-220px;left:280px;position:absolute;}
                        #light77{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -37px no-repeat;top:-125px;left:300px;position:absolute;}
                        #light78{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-380px;left:240px;position:absolute;}
                        #light79{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-120px;left:120px;position:absolute;}
                        #light80{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-50px;left:50px;position:absolute;}      
                        #light81{height:18px;width:30px;background: url(images/christmas/gifts.png) -81px -0px no-repeat;top:-410px;left:240px;position:absolute;}
                        #light82{height:18px;width:30px;background: url(images/christmas/gifts.png) -119px -35px no-repeat;top:-70px;left:110px;position:absolute;}
                        #light83{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-210px;left:190px;position:absolute;}
                        #light84{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-200px;left:130px;position:absolute;}
                        #light85{height:18px;width:30px;background: url(images/christmas/gifts.png) -43px -70px no-repeat;top:-280px;left:190px;position:absolute;}
                        #light86{height:18px;width:30px;background: url(images/christmas/gifts.png) -37px -30px no-repeat;top:-90px;left:90px;position:absolute;}
                        #light87{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-130px;left:90px;position:absolute;}
                        #light88{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-270px;left:270px;position:absolute;} 
                        #light89{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px -31px no-repeat;top:-130px;left:200px;position:absolute;}
                        #light90{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-100px;left:150px;position:absolute;}
                        #light91{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light92{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light93{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light94{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light95{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light96{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light97{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light98{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}
                        #light99{height:18px;width:30px;background: url(images/christmas/gifts.png) 0px 0px no-repeat;top:-69px;left:230px;position:absolute;}                          
                                                                        /*pink-ball:
                                                 url(images/christmas/gifts.png) -37px -30px no-repeat
                                                
                                                orange-ball
                                                url(images/christmas/gifts.png) 0px -31px no-repeat
                                                
                                                zepra-gift-box
                                                url(images/christmas/gifts.png) 0px 0px no-repeat
                                                
                                                blue-giftbox
                                                url(images/christmas/gifts.png) -0px -70px no-repeat
                                                
                                                pink-gift-box
                                                url(images/christmas/gifts.png) -43px -70px no-repeat
                                                
                                                blue-ball
                                                url(images/christmas/gifts.png) -81px -37px no-repeat
                                                
                                                dark-orangeball
                                                url(images/christmas/gifts.png) -119px -35px no-repeat
                                                
                                                
                                                red-gift-box
                                                url(images/christmas/gifts.png) -81px -0px no-repeat
                                                
                                                
                                                star
                                                url(images/christmas/gifts.png) -40px -0px no-repeat
                        */
                        
                        
                        
                        #details ul{padding:20px 0px 20px 20px; list-style:circle; color:#F09;}
                        #details h3.sub-heading{ color:#F60;padding:0px !important;}
                        #details ul li span{color:#404040;}
                        #thankyoubox{box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff; border: 1px solid #f8c550;outline:none;width: 252px;padding: 10px; font-size:12px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background:none !important; width:250px;height:300px; text-align:left !important;}
                        
                        #lights{position:relative;left:0px;top:-400px;opacity:0.7;}
                        #lights p{margin:0px;z-index:100;}
                        .dispalynone{display:none;}
                        html div.ss-legal{ display:none !important;}
                        #footer_text{ background:url(images/christmas/footer_background.png) no-repeat; height:250px;z-index:0;}
                        #footer_text img{padding-top:200px;}
                        #ss-form{z-index:99;}
                        input[type=submit]{ background:url(images/christmas/Christmas_bell.png) no-repeat; width:150px;height:150px;border:none;}
                        #ss-form{background:none;box-shadow:0px 0px 10px #fff;box-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10p;border:1px solid #fff;
                         -webkit-box-shadow:0px 0px 10px #fff;-moz-box-shadow:0px 0px 10px #fff;}
                         .amount{display:block !important;}
                         #cboxOverlay{ background:#fdf0bb !important;}
                        #note_ul{list-style:none;padding:0px; font-size:12px; font-weight:bold; list-style:circle; color:#F06; font-size:14px; text-align:left !important;}
                        ul#note_ul li span{ font-size:12px; color:#404040;}
                        #step_for_pledge{ text-align:left !important; padding-left: 40px;}
                        #steps_texts{padding-left: 35px;padding-top: 2px;font-weight:bold;font-size:14px;color:#090;}
                        #steps_texts a{ font-size:11px; font-weight:normal;padding-right:10px; outline:none;}
                        html p{display:none;}
                        #ie_label1,#ie_label2,#ie_label3{display:none;text-align:left;margin-top:5px;padding-left:45px;}
                        #search_bar{display:block;z-index:115;  /*background:#fff url(arrow_left.gif) top left no-repeat;*/padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;padding:10px; background:#fff;     -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;   color:#000; right:0;top:0;}
                        #searchtextboxdiv{float:left;width:300px;}
                        #searchtextarea{position:absolute;top:-700px;left:455px;padding:2px 12px 3px 7px;border:1px solid #fff;-moz-box-shadow:1px 1px 4px #ccc; -webkit-box-shadow:1px 1px 4px #ccc; box-shadow:1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;padding:10px; background:#fff;     -webkit-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;
    -moz-box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;    box-shadow: inset 0 0 30px #e7f1d7,1px 1px 4px #ccc;cursor:pointer;    color:#000;width:190px;}
                        #searchbuttondiv{}
                        #searchtextarea{font-weight:bold;font-size:16px;color:#f00;}
                </style>
                <!--[if lte IE 6]>
                        <style type="
text / css " media="
screen ">
                                #header div{
                                        background-image: none;
                                        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='overlay.png', sizingMethod='scale');
                                }
                        </style>
                <![endif]-->
        </head>
        <body>
   
                <div id="
wrapper ">
                                <div id="
search_bar " style="
display: none;
">
                                <div style="
width: 100 % "><span style="
color: #f00;
font - weight: bold;
font - size: 16px;
">Please enter your First name</span> <span style="
color: #7f7f7f;font-size:14px;">e.g: Arvind </span><br/></div>
                                <div id= "searchtextboxdiv" > < input type = "text"
id = "search_text" / > < /div>
        <div id="searchbuttondiv"><img src="/images / christmas / show_mygiftbutton.png " width="
160 " id="
search_gift "/><a id="
close_searchbar "  class="
fr " ><b>Hide</b></a></div>
        
        </div>
                        <div id="
header ">
             <div id="
top_header ">
    <img src="
images / christmas / header - text.png " width="
900 " />
    </div>
            <div id="
img_back ">     
            <div id="
tree_back ">
            <img src="
images / christmas / real - tree.png " width="
455 " id="
tree " />
            </div>      

            <div id="
lights ">
            <p id="
searchtextarea ">Show my gift</p>
            <p id="
light25 " class="
Smita has pledged Rs.100 " ></p>
            <p id="
light24 " class="
Arvind Sridharan has pledged Rs.200 " ></p>
            <p id='light23' class='Nikhil Kaushal has pledged Rs.200'></p>
            <p id='light22' class='Aditi has pledged Rs.100'></p>
            <p id='light21' class='Aishwarya Singh has pledged Rs.500'></p>
            <p id='light20' class='Ram has pledged Rs.100'></p>
            <p id='light19' class='Amit Kumar has pledged Rs.200'></p>
            <p id='light18' class='Aishwarya Mishra has pledged Rs.1000'></p>
            <p id='light17' class='Chetan Agrawal has pledged Rs.500'></p>
            <p id='light16' class='ashish mehra has pledged Rs.3000'></p>
            <p id='light15' class='Piyush Goel has pledged Rs.200'></p>
            <p id='light14' class='Shantaram has pledged Rs.500'></p>
            <p id='light13' class='Akshay Pandey has pledged Rs.100'></p>
            <p id='light12' class='Abhishek Adhikari has pledged Rs.1000'></p>
            <p id='light11' class='dhiraj has pledged Rs.500'></p>
            <p id='light10' class='Rohit T George has pledged Rs.500'></p>
            <p id='light9' class='Pinky Goyal has pledged Rs.200'></p>
            <p id='light8' class='Sarathy Srinivas has pledged Rs.1000'></p>
            <p id='light7' class='Makarand has pledged Rs.100'></p>
            <p id='light6' class='Mitesh Tank has pledged Rs.5000'></p>
            <p id='light5' class='Jagannath R has pledged Rs.1000'></p>
<!--            <p id='light4' class='Jagannath R has pledged Rs.500'></p>-->
<!--            <p id='light3' class='Jagannath R has pledged Rs.500'></p>-->
<!--            <p id='light2' class='Jagannath R has pledged Rs.500'></p>-->
            <p id='light26' class='Siddharth Agarwal has pledged Rs.200'></p>
            <p id='light27' class='sangeeta aisola has pledged Rs.100'></p>
            <p id='light28' class='nester has pledged Rs.500'></p>
            <p id='light29' class='Chirag has pledged Rs.5000'></p>
            <p id='light30' class='Pavithra Lakshmanan has pledged Rs.100'></p>
            <p id='light31' class='Priyanka Manjari has pledged Rs.500'></p>
            <p id='light32' class='Navneet Saxena has pledged Rs.100'></p>
            <p id='light33' class='Sanjay Bathija has pledged Rs.3000'></p>
            <p id='light34' class='amrita has pledged Rs.100'></p>
            <p id='light35' class='kiriti has pledged Rs.500'></p>
            <p id='light36' class='Kiran Challapalli has pledged Rs.1000'></p>
            <p id='light37' class='Amit Palrecha has pledged Rs.200'></p>
            <p id='light38' class='Srivatsan Hari has pledged Rs.500'></p>
            <p id='light39' class='Kalavathi has pledged Rs.100'></p>
            <p id='light40' class='Sampath G has pledged Rs.300'></p>
            <p id='light41' class='Vikash Kontia has pledged Rs.500'></p>
            <p id='light42' class='Binit has pledged Rs.100'></p>
            <p id='light43' class='Neha Tiwari has pledged Rs.10000'></p>
            <p id='light44' class='Loveen has pledged Rs.500'></p>
            <p id='light45' class='Rajdeep Poddar has pledged Rs.100'></p>
            <p id='light46' class='Suvadra Chakraborty has pledged Rs.200'></p>
            <p id='light47' class='Aritri has pledged Rs.100'></p>
            <p id='light48' class='Archana R has pledged Rs.200'></p>
            <p id='light49' class='anant bhatia has pledged Rs.500'></p>
            <p id='light50' class='Kavitha Udupa has pledged Rs.100'></p>
            <p id='light51' class='Sony Varghese has pledged Rs.500'></p>
            <p id='light52' class='Sony Varghese has pledged Rs.1000'></p>
            <p id='light53' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light54' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light55' class='THANDAVA KRISHNA has pledged Rs.400'></p>
            <p id='light56' class='Ujjwal Grover has pledged Rs.300'></p>
            <p id='light57' class='Balavinayagam.V.R has pledged Rs.500'></p>
            <p id='light58' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light59' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light60' class='Abhishek Pradhan has pledged Rs.500'></p>
            <p id='light61' class='Mohsin Khan has pledged Rs.1000'></p>
            <p id='light62' class='Mohsin Khan has pledged Rs.10000'></p>
            <p id='light63' class='Nita Row has pledged Rs.1000'></p>
            <p id='light64' class='Monu has pledged Rs.500'></p>
            <p id='light65' class='ANTONY CHRISTOPHER has pledged Rs.200'></p>
            <p id='light66' class='M.Sendhilvel has pledged Rs.100'></p>
            <p id='light67' class='pinda jatt has pledged Rs.100'></p>
            <p id='light68' class='Sreekanth has pledged Rs.1000'></p>
            <p id='light69' class='N Krishnamurthy has pledged Rs.100'></p>
            <p id='light70' class='auxilia has pledged Rs.200'></p>
            <p id='light71' class='Zishan Ansari has pledged Rs.200'></p>
            <p id='light72' class='Zishan Ansari has pledged Rs.200'></p>
            <p id='light73' class='Chirag has pledged Rs.5000'></p>
            <p id='light74' class='Deepesh Darla has pledged Rs.1000'></p>
            <p id='light75' class='ajay has pledged Rs.500'></p>
            <p id='light76' class='Payal Shah has pledged Rs.100'></p>
            <p id='light77' class='Gnanaraj Sadacharam has pledged Rs.300'></p>
            <p id='light78' class='chandan akella has pledged Rs.2500'></p>
            <p id='light79' class='Pranab has pledged Rs.200'></p>
            <p id='light80' class='Amit Ahuja has pledged Rs.200'></p>
            <p id='light81' class='Rajeev Shroff has pledged Rs.4000'></p>
            <p id='light82' class='nitya gaur has pledged Rs.100'></p>
            <p id='light83' class='Ravi Kumar has pledged Rs.500'></p>
            <p id='light84' class='Mohit has pledged Rs.500'></p>
            <p id='light85' class='Rakesh has pledged Rs.1100'></p>
            <p id='light86' class='Kshma Lal has pledged Rs.250'></p>
            <p id='light87' class='Aravind Deivendran has pledged Rs.500'></p>
            <p id='light88' class='shashidhara has pledged Rs.500'></p>
            <p id='light89' class='Satish has pledged Rs.100'></p>
            <p id='light90' class='Anita Menon has pledged Rs.500'></p>
            <p id='light91' class='Gokul has pledged Rs.500'></p>
            <p id='light92' class='Raghunandan Panigrahi has pledged Rs.100'></p>
            <p id='light93' class='Suchandra Chatterjee has pledged Rs.100'></p>
            <p id='light94' class='gaurav has pledged Rs.100'></p>
            <p id='light95' class='chandan has pledged Rs.200'></p>
            <p id='light96' class='Dwijesh Desai has pledged Rs.200'></p>
            <p id='light97' class='Dinoy Davis has pledged Rs.500'></p>
            <p id='light98' class='Kamlesh has pledged Rs.500'></p>
            <p id='light99' class='ravi sankar has pledged Rs.100'></p>
            </div>
                        </div>  
                                
                                <div id="
form_back " class="
fl w40 ">
                
<div id="
thankyoubox " style="
display: none;
">
<span style="
color: #090; font-size:18px;">Thanks for making a pledge!</span><br /><br />

<span>Simply mouseover the gifts on the Christmas Tree to see your name and others who have pledged.</span><br /><br />

<span>Invite your friends to light up our Christmas Tree!</span><br />
<br /><img src= "images/christmas/make_another_pleadge.png"
width = "250"
id = "madeanother" / > < br / > < br / > < div style = " width:250px;" > < img src = "images/christmas/share_ontext.png"
width = "100" > < a class = "member"
href = "http://www.facebook.com/sharer.php?s=100&amp;p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&amp;p[url]=http://tinyurl.com/d3vkw76&amp;p[summary]=&amp;p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png"
target = "blank" > < img src = "images/christmas/facebook_icon.png"
alt = "Share on Facebook"
border = "0" > < /a>
            
                        <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&amp;text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> 
< /div>
</div > < div id = "ss-form" > < form action = ""
method = "POST"
target = "fake-target"
onsubmit = "this.action='https://docs.google.com/a/rangde.org/spreadsheet/formResponse?formkey=dFlSZkt0TzZTWHJyblBiQlNrcmZvZGc6MQ&amp;ifq'; if (validate(this)) {custommsg(); return true;} else return false;" > < br / > < div id = "step_for_pledge" > < div style = "clear:both;" > < div style = "width:20px; margin-bottom:10px;height:21px; background:url(images/christmas/number_buttons.png) 0px 0px no-repeat; float:left" > < /div><div id="steps_texts">Enter Your Details</div > < /div>
<div style="clear:both;">
<div style="width:20px;margin-bottom:10px; height:21px; background:url(images/christmas / number_buttons.png) - 22px 0px no - repeat;
float: left "></div><div id="
steps_texts ">Pledge an amount(Rs.100 or more)</div>
</div>
<div style="
clear: both;
">
<div style="
width: 20px;
margin - bottom: 10px;
height: 21px;
background: url(images / christmas / number_buttons.png) - 44px 0px no - repeat;
float: left "></div><div id="
steps_texts ">Ring the bell<br/> <a href="#details " class="
inline " style="
text - decoration: underline;
"> What next?</a></div>
</div>
</div>
<br /><br />

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_0 ">Your Name<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_0 "></label></div>
<div   id="
ie_label1 "><label class="
ss - q - title " for="
entry_0 ">Your Name<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_0 "></label></div>
<input type="
text " name="
entry.0.single " value="" class="
ss - q - short " id="
entry_0 " placeholder="
Your Name " />
<br /><br /> 

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_1 ">E-mail Address<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<div  id="
ie_label2 " class="
email_errorlabel "><label class="
ss - q - title " for="
entry_1 ">E-mail Address<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<input type="
text " name="
entry.1.single " value="" class="
ss - q - short " id="
entry_1 " placeholder="
E - mail Address " />
<br /> <br /> 

<div style="
display: none;
" id="
error_labels "><label class="
ss - q - title " for="
entry_2 ">Pledge Amount<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_2 "></label></div>

<div   id="
ie_label3 "><label class="
ss - q - title " for="
entry_2 ">Pledge Amount<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_2 "></label></div>
<div  style="
display: none;
" class="
amount_errorlabel "><label class="
ss - q - title " for="
entry_1 ">Please enter an amount in multiples of 100<span class="
ss - required - asterisk ">*</span></label>
<label class="
ss - q - help " for="
entry_1 "></label></div>
<input type="
text " name="
entry.2.single " value="" class="
ss - q - short " id="
entry_2 " placeholder="
Pledge Amount " />
<br /> <br /> 


<img src="
images / christmas / Christmas_bell.png " width="
150 " id="
bell " />
<div class="
ss - item ss - navigate "><div class="
ss - form - entry ">
<input type="
submit " name="
submit " value="" id="
submit " style="
display: none;
" />
<iframe src="#" id="
fake - target " name="
fake - target " style="
width: 0px;
height: 0px;
border: 0px;
"></iframe>
</div></div></form>
</div>


</div>           
                
                <div class="
clearfloat "></div>
                 <div id="
footer_text ">
                <div >
                <div style="
width: 250px;
" ><img src="
images / christmas / share_ontext.png "><a class="
member " href="
http: //www.facebook.com/sharer.php?s=100&amp;p[title]=The Rang De Christmas Tree can Knock out Poverty! Join me to find out more.&amp;p[url]=http://tinyurl.com/d3vkw76&amp;p[summary]=&amp;p[images][0]=http://www.rangde.org/images/christmas/facebook_badge.png" target="blank">
< img src = "images/christmas/facebook_icon.png"
alt = "Share on Facebook"
border = "0" > < /a>
            
                        <a href="http:/ / twitter.com / share ? url = http : //tinyurl.com/d3vkw76&amp;text=I decorated the Rang De Christmas Tree to Knock out Poverty in India! You too can become a Secret Santa" title="Share on Twitter" target="_blank"><img src="images/christmas/twitter-icon.png" alt="Share on Twitter" border="0"></a> 
< /div>
           <div style="margin-top:-25px"> 
           <div id="privacy" style="width: 175px;cursor:pointer;height:30px;background: url(images/christmas / footer - text.png) - 400px 0px no - repeat;
float: right;
"></div><div  style="
width: 200px;
cursor: pointer;
height: 30px;
background: url(images / christmas / footer - text.png) - 190px 0px no - repeat;
float: right;
" href="#details " class="
inline "><a href="#details "> &nbsp;</a></div> <div id="
about " style="
width: 120px;
cursor: pointer;
height: 30px;
background: url(images / christmas / footer - text.png) - 50px 0px no - repeat;
float: right;
"></div>
           </div> <!--<img src="
footer - text.png " width="
550 " usemap="
footer_links " />-->
              </div>
                 </div>
                 
              
                 
                 
                  <map name="
footer_links ">
  <!--<area shape="
rect "   coords="
103, 140, 133, 168 " alt="
Sun "  />-->
  <area shape="
rect " coords="
370, 1, 631, 220 " alt="
policy " class='inline' href="
http: //www.rangde.org/terms-of-use.htm" />  
< area shape = "rect"
coords = "163,-6,370,218"
alt = "details"
class = 'inline'
href = "#details" / > < area shape = "rect"
coords = "-98,-3,163,216"
alt = "about"
class = 'inline'
href = "http://www.rangde.org/rangde.htm" / >

< /map>
<div style="display:none;">
<div id="details">

<h3 class="sub-heading">Rang De brings to you a chance, to create the biggest Christmas tree ever. But this is not just another Christmas tree. <br / > This tree stands
for hope,
courage and the Christmas spirit itself! < br / > < /h3>

<ul>
<li><span>How to Participate?</span > < /li>
<li><span>Enter your details</span > < /li>
<li><span>Pledge an amount</span > < /li>
<li><span>Ring the bell !!!</span > < /li>
<li><span>And you become a part of the world's biggest Christmas Tree Online!</span > < /li></ul >

< h3 class = "sub-heading" > What next ? < /h3>
<ul>
<li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span > < /li>
<li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span > < /li>
<li><span>You can fulfill the pledge by making a social investment for the pledged amount</span > < /li>
<li><span>You can roll your mouse over it to see your name and the names of thousands of other pledge owners.</span > < /li>
<li><span>And of course, everyone who pledges will be part of our Christmas Lucky Draw on 25th December</span > < /li></ul >

< strong > The Goal : < /strong>We need to light them all by 0.00 hrs on 24th December. The more the pledge amount the bigger the tree will grow in size. For every pledge over Rs.100 the tree will grow in size proportionately.<br / > < br / >

< h3 class = "sub-heading" > So what are you waiting
for ? Ring the Bell! < /h3>

<ul>
<li><span>You get a Secret Santa Badge that you can share on Facebook & embed in your Email signature.
Ask your friends to join you in your noble efforts!</span > < /li>

<li><span>Go ahead and make a pledge this Christmas. Become a Secret Santa :)</span > < /li>

<li><span>Please note – pledge owners would need to fulfill their pledge by helping someone through RangDe.org by 31st December 2011.</span > < /li></ul >


< /div>
</div >

< /div>
             
                        </div >


< /body>                
        
        <!-- Import jQuery-->
    <script src="js/tooltipjavascript.js "></script>
        <script src="
http : //ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
< script type = "text/javascript"
charset = "utf-8" >
var $dj = jQuery.noConflict();
var scrollSpeed = 190;
var step = 1;
var current = 0;
var imageHeight = 4300;
var headerHeight = 650;
var restartPosition = -(imageHeight - headerHeight);

function scrollBg() {
  current += step;
  if (current == restartPosition) {
    current = 0;
  }
  $dj('#header').css("background-position", "0 " + current + "px");
}
var init = setInterval("scrollBg()", scrollSpeed); < /script>


 <script type="text/javascript" language="
javascript " >
var $dd = jQuery.noConflict();
$dd('document').ready(function () {
        
if ($dd.browser.msie && $dd.browser.version <= 9){                      
        $dd('#header').css('background','#fdf0bb');     
        $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'});
        $dd('#ttcont').css('border','#fdf0bb');
        $dd('#ie_label1').show();
        $dd('#ie_label2').show();
        $dd('#ie_label3').show();
        (function fadeNext(jq){
            jq.eq(0).show("
200 ", function(){
                // you can also set a timeout here if you'd like
                (jq=jq.slice(1)).length && fadeNext(jq);
            });
        })($dd('html p'))       
}
if ($dd.browser.msie){                  
        $dd('#header').css('background','#fdf0bb');     
        $dd('input[type=text]').css({'color':'#000','margin-bottom':'5px'});
        $dd('#ttcont').css('border','#fdf0bb');
        $dd('#ie_label1').show();
        $dd('#ie_label2').show();
        $dd('#ie_label3').show();
                
}
});
</script>
<script type="
text / javascript " src="
js / jquery.autotab - 1.1b.js "></script>
<script type="
text / javascript " language="
javascript " >
var $ds = jQuery.noConflict();
$ds('document').ready(function () {
        $ds('input#entry_2').autotab_filter({ format: 'custom', pattern: '[^0-9\.]' });
        });
</script>


<script src="
http: //code.jquery.com/jquery-1.6.1.js" type="text/javascript" ></script>
< script type = "text/javascript"
language = "javascript" > $(document).ready(function() {
  var audioElement = document.createElement('audio');
  audioElement.setAttribute('src', 'http://www.rangde.org/static/bell-ring-01.mp3');
  $.get();

  $('#submit').click(function() {
    audioElement.play();
  });



}); < /script>
<script src="http:/ / code.jquery.com / jquery - 1.6.1.js " type="
text / javascript " ></script>
<script src="
https: //ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
< script type = "text/javascript"
language = "javascript"
charset = "utf-8" >
var data = [



{
  'id': 'light2'
}, {
  'id': 'light3'
}, {
  'id': 'light4'
}, {
  'id': 'light1'
}];

var posleft = [{
  'left': '130'
}, {
  'left': '280'
}, {
  'left': '190'
}, {
  'left': '140'
}, {
  'left': '300'
}, {
  'left': '330'
}, {
  'left': '280'
}, {
  'left': '300'
}, {
  'left': '140'
}, {
  'left': '270'
}, {
  'left': '60'
}, {
  'left': '180'
}, {
  'left': '150'
}, {
  'left': '140'
}, {
  'left': '170'
}]
var postop = [{
  'top': '-320'
}, {
  'top': '-400'
}, {
  'top': '-450'
}, {
  'top': '-420'
}, {
  'top': '-449'
}, {
  'top': '-320'
}, {
  'top': '-450'
}, {
  'top': '-350'
}, {
  'top': '-320'
}, {
  'top': '-329'
}, {
  'top': '-340'
}, {
  'top': '-249'
}, {
  'top': '-310'
}, {
  'top': '-420'
}, {
  'top': '-339'
}];
var divposleft = [{
  'left': '160'
}, {
  'left': '310'
}, {
  'left': '220'
}, {
  'left': '170'
}, {
  'left': '330'
}, {
  'left': '330'
}, {
  'left': '280'
}, {
  'left': '300'
}, {
  'left': '140'
}, {
  'left': '270'
}, {
  'left': '60'
}, {
  'left': '180'
}, {
  'left': '150'
}, {
  'left': '140'
}, {
  'left': '170'
}]
var divpostop = [{
  'top': '-350'
}, {
  'top': '-430'
}, {
  'top': '-480'
}, {
  'top': '-450'
}, {
  'top': '-479'
}, {
  'top': '-320'
}, {
  'top': '-450'
}, {
  'top': '-350'
}, {
  'top': '-320'
}, {
  'top': '-329'
}, {
  'top': '-340'
}, {
  'top': '-249'
}, {
  'top': '-310'
}, {
  'top': '-420'
}, {
  'top': '-339'
}];
var position = 0;

$('document').ready(function() {

  $('#searchtextarea').click(function() {
    $('#searchtextarea').hide();
    $('#search_bar').show();
  });
  $('#close_searchbar').click(function() {
    $('#search_bar').hide();
    $('#searchtextarea').show();
  });
  $('#search_gift').live('click', function() {
    var cssClass = $('#search_text').val();
    var selector = 'p[class^="' + cssClass + '"]';
    console.log(selector);
    var $elements = $(selector);
    $elements.each(function(i) {
      var classname = $(this).attr('class');
      var toppos = $(this).css('top');
      var leftpos = $(this).css('left');
      var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block');
      div.text(classname);
      div.css({
        'top': toppos,
        'left': leftpos
      });
      $('#lights').append(div);

    });

  });

  (function fadeNext(jq) {
    jq.eq(0).fadeIn("50", function() {
      // you can also set a timeout here if you'd like
      (jq = jq.slice(1)).length && fadeNext(jq);
    });
  })($('html p'))


  $('#privacy   ').click(function() {
    window.open('http://www.rangde.org/terms-of-use.htm');
  });
  $('#about').click(function() {
    window.open('http://www.rangde.org/about-rang-de.htm');
  });



  $('#madeanother').click(function() {
    $('#thankyoubox').hide(100);
    $('#ss-form').show(100);
    $('#submit').hide();
    $('#bell').show();
    $('input[name="entry.0.single"]').val('');
    $('input[name="entry.1.single"]').val('');
    $('input[name="entry.2.single"]').val('');
    $('div.email_errorlabel').css('display', 'none');
    $('#ie_label2').show();
  });

  $('h1.ss-form-title').hide();

  $('#bell,#submit').hover(function() {
    tooltip.show('Double click the bell');
  }, function() {
    tooltip.hide();
  });
  $('#steps_texts a').hover(function() {
    tooltip.show('<h3 style="color:#f60;">What next?</h3><ul style="list-style:circle; font-size:12px; color:#404040;"><li><span>Every time you create a pledge and ring the bell, a star, light or a decoration item will light up.</span></li><li><span>The Rang De team will get in touch with you to help you fulfill your pledge.</span></li><li><span>You can fulfill the pledge by making a social investment for the pledged amount</span></li><li><span>You can <b style="color:#f00;">roll your mouse over it to see your name</b> and the names of thousands of other pledge owners.</span></li><li>And of course, everyone who pledges will be part of our <b style="color:#f00;">Christmas Lucky Draw on 25th December</b></li></ul>');
  }, function() {
    tooltip.hide();
  });

  $('#submit').click(function() {
    var name = $('input[name="entry.0.single"]').val();
    var amount = $('input[name="entry.2.single"]').val();
    var light = $('<p></p>').attr('id', data[position].id).css('position', 'absolute').css('display', 'block');

    light.addClass(name);
    light.addClass(' has pledged Rs.');
    light.addClass(amount);

    light.offset({
      top: postop[position].top,
      left: posleft[position].left
    });
    var text = light.attr('class');
    $("#lights").append(light);
    var div = $('<div></div>').attr('id', 'ttcont').css('position', 'absolute').attr('class', 'pledgetooltip').css('display', 'block');
    div.text(text);
    div.offset({
      top: divpostop[position].top,
      left: divposleft[position].left
    });
    $('#lights').append(div);
    position++;
    position %= data.length;
    $('#tree').animate({
      'width': '+=3px'
    }, 1000);
    $('#ss-form').hide();
    $('#thankyoubox').show();
  });




  $('#lights p').live('mouseover', function() {
    $('.pledgetooltip').hide();
    var text = $(this).attr('class');
    tooltip.show(text);
  });
  $('#lights p').live('mouseout', function() {

    tooltip.hide();
  });






  $('img#bell').click(function() {
    $('div#error_labels').hide();


    var emptyTextBoxes = $('form input[type=text],[type=password]').filter(function() {
      return this.value == "";
    });
    var input = document.getElementById('entry_2');
    if (input.value.match(/^[1-9]\d*00$/) || !(input.value.match)("")) {
      $('.amount_errorlabel').css({
        'display': 'none',
        'color': '#404040'
      });
    } else {
      $('.amount_errorlabel').css({
        'display': 'inline',
        'color': '#F00'
      });
      return false;
    }
    var email = $('#entry_1').val();
    if (email !== "") {
      if (email == "" || !isValidEmailAddress(email)) {
        $('.email_errorlabel').css({
          'display': 'inline',
          'color': '#F00'
        });
        return false;
      }
    }

    function isValidEmailAddress(emailAddress) {
      var pattern = new RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
      return pattern.test(emailAddress);
    };
    if (emptyTextBoxes.length < 1) {

      $('#bell').hide();
      $('#submit').show();

    } else {
      // ignore the click if all fields haven't been clicked
      emptyTextBoxes.each(function() {
        $(emptyTextBoxes).prevAll('#error_labels').css({
          'display': 'inline',
          'color': '#F00'
        });


      });
    }

  });

});


< /script>
</html >

ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

Revision 1: published by Suresh Pattu on December 21, 2011