Delhi Metro

Developer
Krishna Babu
Size
6,344 Kb
Views
4,048
  1. Delhi Metro Previews
  2. Delhi Metro HTML Codes
  3. Delhi Metro CSS Codes

How do I make an delhi metro?

CSS3 and html based New Delhi (India) metro map. Credit goes to Denish Gandhi who give idea to do this.. What is a delhi metro? How do you make a delhi metro? This script and codes were developed by Krishna Babu on 11 January 2023, Wednesday.

Delhi Metro Previews
IQ Test

Delhi Metro - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Delhi Metro</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <header> <h1>Delhi Metro Map</h1>
</header>
<!---->
<div class="container">	<div class="connectors">	<div class="circle circle1"><div class="station">Inderloke</div><div class="inner_circle"></div></div>	<div class="circle circle2"><div class="station" style="left: -4px; top: -41px;">Kashmere Gate</div><div class="inner_circle"></div></div>	<div class="circle circle3"><div class="station" style="left: 0px; top: -32px;">Welcome</div><div class="inner_circle"></div></div>	<div class="circle circle4"><div class="station">Azadpur</div><div class="inner_circle"></div></div>	<div class="circle circle5"><div class="station" style="left: -5px; top: -37px;">Anand Vihar</div><div class="inner_circle"></div></div>	<div class="circle circle6"><div class="station" style="left: -66px; top: 21px;transform: rotate(-21deg);-webkit-transform: rotate(-21deg);">Punjabi Bagh</div><div class="inner_circle"></div></div>	<div class="circle circle7"><div class="station" style="left: 19px;top: 2px;transform: rotate(-53deg);-webkit-transform: rotate(0deg);">Ashok Park</div><div class="inner_circle"></div></div>	<div class="circle circle8"><div class="station" style="left: -60px;top: 39px;">Rajori Garden</div><div class="inner_circle"></div></div>	<div class="circle circle9"><div class="station" style="left: -42px;top: 35px;">Kirti Nagar</div><div class="inner_circle"></div></div>	<div class="circle circle10"><div class="station">Dwarka</div><div class="inner_circle"></div></div>	<div class="circle circle11"><div class="station" style="left: -6px;top: -43px;">Janakpuri (W)</div><div class="inner_circle"></div></div>	<div class="circle circle12"><div class="station" style="left: 11px;top: -33px;transform: rotate(-33deg);-webkit-transform: rotate(-33deg);">New Delhi Rly Stn</div><div class="inner_circle"></div></div>	<div class="circle circle13"><div class="station" style="left: -31px;top: 30px;">Dhaula Kuan</div><div class="inner_circle"></div></div>	<div class="circle circle14"><div class="station" style="left: -67px;top: 27px;transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">Central Sectt.</div><div class="inner_circle"></div></div>	<div class="circle circle15"><div class="station">Yamuna Bank</div><div class="inner_circle"></div></div>	<div class="circle circle16"><div class="station" style="left: -1px; top: -37px;">Mayur Vihar</div><div class="inner_circle"></div></div>	<div class="circle circle17"><div class="station" style="left: 18px;top: -4px;transform: rotate(0deg);-webkit-transform: rotate(0deg);">Lajpath Nagar</div><div class="inner_circle"></div></div>	<div class="circle circle18"><div class="station" style="transform: rotate(-32deg);-webkit-transform: rotate(-32deg);">&nbsp;Haujkhas Enclave</div><div class="inner_circle"></div></div>	<div class="circle circle19"><div class="station" style="left: 18px;top: -4px;transform: rotate(0deg);-webkit-transform: rotate(0deg);">Kalkaji Mandir</div><div class="inner_circle"></div></div>	</div>	<div>	<div class="red_line">	<div class="stop red_stop1"><div class="station" style="left: 5px; top: -34px;">Rohini(W)</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop2"><div class="station" style="left: 5px; top: -34px;">Rohini(E)</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop3"><div class="station" style="left: 1px; top: -35px;">Pritampura</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop4"><div class="station" style="left: -3px; top: -42px;">Kohat Enclave</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop5"><div class="station" style="left: 10px; top: -22px;">NSP</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop6"><div class="station" style="left: -1px; top: -40px;">KeshavPuram</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop7"><div class="station" style="left: -4px; top: -45px;">Kanhaiya Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop8"><div class="station" style="left: -2px; top: -41px;">Sashtri Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop9"><div class="station" style="left: 1px; top: -39px;">Pratap Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop10"><div class="station" style="left: -3px; top: -38px;">Pulbangash</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop11"><div class="station" style="left: -41px; top: 34px;">Tis Hazari</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop12"><div class="station" style="left: -4px; top: -36px;">Sastri Park</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop13"><div class="station" style="left: -4px; top: -36px;">Seelampur</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop14"><div class="station" style="left: -1px; top: -33px;">Shahdara</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop15"><div class="station" style="left: -9px; top: -48px;">Mansarovar Park</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop red_stop16"><div class="station">Jhilmil</div><div class="double_line"></div><div class="line"></div></div>	<div class="red1 red"></div>	<div class="red2 red"></div>	<div class="box box1"><div class="station">Rithala</div></div>	<div class="box box2"><div class="station" style="left: -1px; top: -46px;">Dilshad Garden</div></div>	</div>	<div class="blue_line">	<div class="stop blue_stop1"><div class="station" style="left: -12px; top: -46px;">Najafgarh Depot</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop2"><div class="station" style="left: -5px; top: -41px;">Dwarka More</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop3"><div class="station" style="left: 0px; top: -28px;">Nawada</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop4"><div class="station" style="left: -12px; top: -46px;">Uttam Nagar(W)</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop5"><div class="station" style="left: -12px; top: -46px;">Uttam Nagar(E)</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop6"><div class="station" style="left: -7px; top: -39px;">Janakpuri(E)</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop7"><div class="station" style="left: -6px; top: -34px;">Tilak Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop8"><div class="station" style="left: -7px; top: -46px;">Subhash Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop9"><div class="station" style="left: -5px; top: -44px;">Tagore Garden</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop10"><div class="station" style="left: -58px; top: 40px;">Ramesh Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop11"><div class="station" style="left: -41px; top: 33px;">Moti Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop12"><div class="station" style="left: 13px; top: -12px; transform: rotate(-15deg); -webkit-transform: rotate(-15deg);">Shadipur</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop13"><div class="station" style="left: 15px; top: -15px; transform: rotate(-15deg); -webkit-transform: rotate(-15deg);">Patel Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop14"><div class="station" style="left: 15px; top: -16px; transform: rotate(-15deg); -webkit-transform: rotate(-15deg);">Rajendra Place</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop15"><div class="station" style="left: 14px; top: -15px; transform: rotate(-15deg); -webkit-transform: rotate(-15deg);">Karol Bagh</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop16"><div class="station" style="left: -71px; top: 10px; transform: rotate(-15deg); -webkit-transform: rotate(-15deg);">Jhandewalan</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop17"><div class="station" style="left: -94px; top: 14px; transform: rotate(-15deg); -webkit-transform: rotate(-15deg);">R.K Ashram Marg</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop18"><div class="station" style="left: -8px; top: -46px;">Barakhanba Road</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop19"><div class="station" style="left: -5px; top: -37px;">Mandi House</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop20"><div class="station" style="left: -4px; top: -41px;">Pragati Maidan</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop21"><div class="station" style="left: -4px; top: -37px;">Indraprastha</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop22"><div class="station" style="left: 0px; top: -36px;">Akshardham</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop23"><div class="station" style="left: -9px; top: -48px;">Mayur Vihar-Extn.</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop24"><div class="station" style="left: -9px; top: -48px;">New Ashok Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop25"><div class="station" style="left: -6px; top: -45px;">Noida Sector 15</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop26"><div class="station" style="left: -7px; top: -44px;">Noida SEctor 16</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop27"><div class="station" style="left: -8px; top: -46px;">Noida SEctor 18</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop28"><div class="station" style="left: -12px; top: -46px;">Botanical Garden</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop29"><div class="station" style="left: -1px; top: -36px;">Golf Course</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop30"><div class="station angle1">Dwarka Sector 14</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop31"><div class="station angle1">Dwarka Sector 13</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop32"><div class="station angle1">Dwarka Sector 12</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop33"><div class="station angle1">Dwarka Sector 11</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop34"><div class="station angle1">Dwarka Sector 10</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop35"><div class="station angle1">Dwarka Sector 9</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop36"><div class="station angle1">Dwarka Sector 8</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop37"><div class="station angle2">Laxmi Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop38"><div class="station angle2">Nirman Vihar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop39"><div class="station angle2">Preet Vihar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop40"><div class="station" style="left: -2px; top: -38px;">Karkaduma</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop blue_stop41"><div class="station" style="left: -2px; top: -38px;">Kaushambi</div><div class="double_line"></div><div class="line"></div></div>	<div class="blue1 blue"></div>	<div class="blue2 blue"></div>	<div class="blue3 blue"></div>	<div class="blue4 blue"></div>	<div class="blue5 blue"></div>	<div class="box box1"><div class="station">Vaishali</div></div>	<div class="box box2"><div class="station" style="left: -3px;top: -48px;">Noida City Center</div></div>	<div class="box box3"><div class="station" style="left: -75px;top: 46px;">Dwarka Sector 21</div></div>	</div>	<div class="yellow_line">	<div class="stop yellow_stop1"><div class="station" style="left: -2px; top: -41px;">Adarsh Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop2"><div class="station" style="left: 1px; top: -38px;">Model Town</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop3"><div class="station" style="left: 1px; top: -38px;">G.T.B Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop4"><div class="station" style="left: -7px; top: -47px;">Vishwavidayalaya</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop5"><div class="station" style="left: 1px; top: -37px;">Vidhan Sabha</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop6"><div class="station" style="left: 7px; top: -27px;">Civil Lines</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop7"><div class="station" style="left: 10px; top: -26px;transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">Chandni Chowk</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop8"><div class="station" style="left: 10px; top: -27px;transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">Chawari Bazar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop9"><div class="station" style="left: -63px; top: 20px;transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">Patel chowk</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop10"><div class="station" style="left: -87px; top: 27px; transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">Udhyog Bhawan</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop11"><div class="station" style="left: -63px; top: 20px;transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">Race Course</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop12"><div class="station" style="left: -47px; top: 14px;transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">Jor Bagh</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop13"><div class="station" style="left: -25px;top: 8px;transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">INA</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop14"><div class="station" style="left: -35px; top: 12px;transform: rotate(-36deg);-webkit-transform: rotate(-36deg);">AIIMS</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop15"><div class="station" style="left: 12px; top: -19px;-webkit-transform: rotate(-36deg);transform: rotate(-36deg);">Green Park</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop16"><div class="station" style="left: 10px; top: -27px;-webkit-transform: rotate(-36deg);transform: rotate(-36deg);">Malviyda Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop17"><div class="station" style="left: 13px; top: -12px;-webkit-transform: rotate(-36deg);transform: rotate(-36deg);">Saket</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop18"><div class="station" style="left: 12px; top: -19px;-webkit-transform: rotate(-36deg);transform: rotate(-36deg);">Qutab Minar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop19"><div class="station" style="left: 12px; top: -19px;-webkit-transform: rotate(-36deg);transform: rotate(-36deg);">Chattarpur</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop20"><div class="station" style="left: 12px; top: -19px;-webkit-transform: rotate(-36deg);transform: rotate(-36deg);">Sultanpur</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop21"><div class="station" style="left: 1px; top: -30px;">Ghitorni</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop22"><div class="station" style="left: -2px; top: -37px;">Arajangarh</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop23"><div class="station" style="left: -1px; top: -40px;">Guru Droha</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop24"><div class="station" style="left: -2px; top: -40px;">Sikandarpur</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop25"><div class="station" style="left: -1px; top: -32px;">MG Road</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop yellow_stop26"><div class="station" style="left: -6px; top: -42px;">IFFCO Chowk</div><div class="double_line"></div><div class="line"></div></div>	<div class="yellow1 yellow"></div>	<div class="yellow2 yellow"></div>	<div class="yellow3 yellow"></div>	<div class="yellow4 yellow"></div>	<div class="box box1"><div class="station" style="left: 7px;top: -36px;">Jahingirpuri</div></div>	<div class="box box2"><div class="station" style="left: -7px;top: -9px;">Huda City Center</div></div>	</div>	<div class="violet_line">	<div class="stop violet_stop1"><div class="station angle">Khan Market</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop2"><div class="station angle">JLN Stadium</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop3"><div class="station angle">Jangpura</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop4"><div class="station angle">Moolchand</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop5"><div class="station angle">Kailash Colony</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop6"><div class="station angle">Nehru Place</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop7"><div class="station angle">Govindpuri</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop8"><div class="station angle">Okhla</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop9"><div class="station angle">Jasola</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop10"><div class="station angle">Sarita Vihar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop11"><div class="station angle">Mohan Estate</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop violet_stop12"><div class="station angle">Tughlakabad</div><div class="double_line"></div><div class="line"></div></div>	<div class="violet1"></div>	<div class="box box1"><div class="station" style="left: 20px;top: 0px;transform: rotate(0eg);-webkit-transform: rotate(0deg);">Badarpur</div></div>	</div>	<div class="green_line">	<div class="stop green_stop1"><div class="station angle" style="left: 8px; top: -27px;">Rajdhani Park</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop2"><div class="station angle" style="left: 8px; top: -30px;">Nangloi Rly Stn</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop3"><div class="station angle" style="left: 9px; top: -19px;">Nangloi</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop4"><div class="station angle" style="left: 5px; top: -30px;">Surajmal Stadium</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop5"><div class="station angle" style="left: 7px; top: -25px;">Udhog Nagar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop6"><div class="station angle" style="left: 10px; top: -24px;">Peera Garhi</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop7"><div class="station angle" style="left: 8px; top: -26px;">Sehedav Park</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop8"><div class="station angle" style="left: 10px; top: -25px;">Pasvhim Vihar</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop9"><div class="station angle" style="left: 9px; top: -19px;">Madipur</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop10"><div class="station angle" style="left: 10px; top: -22px;">Shaviji Park</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop green_stop11"><div class="station angle" style="left: 15px; top: -6px;-webkit-transform: rotate(0deg);transform: rotate(0deg);">Khan Market</div><div class="double_line"></div><div class="line"></div></div>	<div class="green1 green"></div>	<div class="green2 green"></div>	<div class="green3 green"></div>	<div class="box box1"><div class="station" style="">Mundka</div></div>	</div>	<div class="brown_line">	<div class="stop brown_stop1"><div class="station angle">IGI Airport</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop brown_stop2"><div class="station angle">Delhi Aero City</div><div class="double_line"></div><div class="line"></div></div>	<div class="stop brown_stop3"><div class="station angle">Shivaji Stadium</div><div class="double_line"></div><div class="line"></div></div>	<div class="brown1"></div>	</div>
</div>
</body>
</html>

Delhi Metro - Script Codes CSS Codes

body{background:url(http://www.flashadicts.com/clientdisplay/images/delhi_metro_map.png) no-repeat; font-family:'Lato', sans-serif;font-size:12px;}
*{margin:0;padding:0;}
header h1{ text-align: center; font-weight: bold; margin: 20px 0;
}
.container{position:absolute;float:left;width:1075px;height:1086px;}
.container div{position:absolute;}
.box{height:15px;width:15px;border:2px solid #000;}
.circle{height:15px;width:15px;border:2px solid #000;border-radius:100%;}
.circle1{top:338px;left:466px;}
.circle2{top:356px;left:640px;}
.circle3{top:307px;left:771px;}
.circle4{top:161px;left:488px;}
.circle5{top:352px;left:926px;}
.circle6{top:358px;left:378px;}
.circle7{top:364px;left:414px;}
.circle8{top:450px;left:365px;}
.circle9{top:429px;left:440px;}
.circle10{top:527px;left:89px;}
.circle11{top:488px;left:229px;}
.circle12{top:478px;left:621px;}
.circle13{top:578px;left:467px;}
.circle14{top:543px;left:610px;}
.circle15{top:561px;left:752px;}
.circle16{top:583px;left:800px;}
.circle17{top:673px;left:702px;}
.circle18{top:772px;left:573px;}
.circle19{top:772px;left:775px;}
.inner_circle{height:9px;width:9px;border:3px solid #9da6ae;border-radius:100%;background-color:#fff;}
.stop{border:2px solid #ce2129;width:12px;height:12px;border-radius:50%;background-color:#fff;}
.stop .double_line{border:2px solid #ce2129;width:11px;height:4px;border-radius:5px;top:2px;left:-1px;}
.stop .line{border-top:2px solid #ce2129;width:8px;height:1px;left:2px;top:5px;transform:rotate(-30deg);-webkit-transform:rotate(-30deg);}
.station{left: 6px;top: -27px; transform:rotate(-53deg);-webkit-transform:rotate(-53deg);white-space:nowrap;}
.red_line{left:219px;top:185px;width:744px;height:220px;}
.red_line .red{border:4px solid #ce2129;z-index:-1;}
.red_line .red1{width:392px;transform:rotate(32deg);-webkit-transform:rotate(32deg);top:106px;left:-29px;}
.red_line .red2{width:410px;transform:rotate(-20deg);-webkit-transform:rotate(-20deg);top:139px;left:323px;}
.red_line .box1{background-color:#ce2129;left:-1px;}
.red_line .box2{background-color:#ce2129;top:61px;left:726px;}
.red_line .red_stop1{left:30px;top:19px;}
.red_line .red_stop2{left:56px;top:35px;}
.red_line .red_stop3{left:89px;top:56px;}
.red_line .red_stop4{left:118px;top:75px;}
.red_line .red_stop5{left:155px;top:97px;}
.red_line .red_stop6{left:184px;top:115px;}
.red_line .red_stop7{left:224px;top:141px;}
.red_line .red_stop8{left:279px;top:175px;}
.red_line .red_stop9{left:314px;top:196px;}
.red_line .red_stop10{left:359px;top:196px;}
.red_line .red_stop11{left:390px;top:184px;}
.red_line .red_stop12{left:469px;top:156px;}
.red_line .red_stop13{left:505px;top:144px;}
.red_line .red_stop14{left:597px;top:109px;}
.red_line .red_stop15{left:633px;top:95px;}
.red_line .red_stop16{left:672px;top:81px;}
.blue_line{left:48px;top:428px;width:980px;height:305px;}
.blue_line .blue{border:4px solid #1195db;z-index:-1;}
.blue_line .blue1{width:407px;transform:rotate(-15deg);-webkit-transform:rotate(-15deg);top:62px;left:-5px;}
.blue_line .blue2{width:250px;transform:rotate(49deg);-webkit-transform:rotate(49deg);top:200px;left:4px;}
.blue_line .blue3{width:620px;transform:rotate(23deg);-webkit-transform:rotate(23deg);top:131px;left:375px;}
.blue_line .blue4{width:231px;transform:rotate(120deg);-webkit-transform:rotate(120deg);top:38px;left:653px;}
.blue_line .blue5{width:134px;transform:rotate(173deg);-webkit-transform:rotate(173deg);top:-71px;left:828px;}
.blue_line .box1{background-color:#1195db;left:958px;top:-87px;}
.blue_line .box2{background-color:#1195db;left:963px;top:243px;}
.blue_line .box3{background-color:#1195db;left:204px;top:288px;}
.blue_line .stop{border:2px solid #1195db;}
.blue_line .double_line{border:2px solid #1195db;}
.blue_line .line{border-top:2px solid #1195db;}
.blue_line .blue_stop1{left:-1px;top:110px;}
.blue_line .blue_stop2{left: 73px;top: 90px;}
.blue_line .blue_stop3{left: 103px;top: 81px;}
.blue_line .blue_stop4{left: 133px;top: 74px;}
.blue_line .blue_stop5{left: 159px;top: 67px;}
.blue_line .blue_stop6{left: 206px;top: 53px;}
.blue_line .blue_stop7{left: 234px;top: 46px;}
.blue_line .blue_stop8{left: 260px;top: 39px;}
.blue_line .blue_stop9{left: 286px;top: 32px;}
.blue_line .blue_stop10{left: 340px;top: 17px;}
.blue_line .blue_stop11{left: 364px;top: 12px;}
.blue_line .blue_stop12{left: 412px;top: 13px;}
.blue_line .blue_stop13{left: 434px;top: 22px;}
.blue_line .blue_stop14{left: 458px;top: 32px;}
.blue_line .blue_stop15{left: 485px;top: 43px;}
.blue_line .blue_stop16{left: 508px;top: 54px;}
.blue_line .blue_stop17{left: 532px;top: 63px;}
.blue_line .blue_stop18{left: 599px;top: 92px;}
.blue_line .blue_stop19{left: 624px;top: 102px;}
.blue_line .blue_stop20{left: 650px;top: 113px;}
.blue_line .blue_stop21{left: 677px;top: 125px;}
.blue_line .blue_stop22{left: 729px;top: 147px;}
.blue_line .blue_stop23{left: 781px;top: 168px;}
.blue_line .blue_stop24{left: 806px;top: 179px;}
.blue_line .blue_stop25{left: 828px;top: 188px;}
.blue_line .blue_stop26{left: 853px;top: 200px;}
.blue_line .blue_stop27{left: 877px;top: 209px;}
.blue_line .blue_stop28{left: 903px;top: 219px;}
.blue_line .blue_stop29{left: 929px;top: 231px;}
.blue_line .blue_stop30{left: 59px;top: 121px;}
.blue_line .blue_stop31{left: 79px;top: 145px;}
.blue_line .blue_stop32{left: 96px;top: 164px;}
.blue_line .blue_stop33{left: 115px;top: 186px;}
.blue_line .blue_stop34{left: 133px;top: 206px;}
.blue_line .blue_stop35{left: 152px;top: 227px;}
.blue_line .blue_stop36{left: 173px;top: 251px;}
.blue_line .blue_stop37{left: 746px;top: 67px;}
.blue_line .blue_stop38{left: 770px;top: 24px;}
.blue_line .blue_stop39{left: 800px;top: -25px;}
.blue_line .blue_stop40{left: 823px;top: -65px;}
.blue_line .blue_stop41{left: 914px;top: -77px;}
.blue_line .angle1{left: 10px;top: -20px;transform: rotate(-21deg);-webkit-transform: rotate(-21deg);}
.blue_line .angle2{left: 16px;top: -2px;transform: rotate(0deg);-webkit-transform: rotate(0deg);}
.yellow_line{left:230px;top:112px;width:443px;height:930px;}
.yellow_line .yellow{border:4px solid #ffce01;z-index:-1;}
.yellow_line .yellow1{width:288px;transform:rotate(213deg);-webkit-transform:rotate(213deg);top:79px;left:157px;}
.yellow_line .yellow2{width:700px;transform:rotate(99deg);-webkit-transform:rotate(99deg);top:506px;left:23px;}
.yellow_line .yellow3{width:315px;top:851px;left:3px;}
.yellow_line .yellow4{height:69px;top:851px;left:3px;}
.yellow_line .box1{background-color:#ffce01;left:177px;top:0px;}
.yellow_line .box2{background-color:#ffce01;left:-1px;top:912px;}
.yellow_line .stop{border:2px solid #ffce01;}
.yellow_line .double_line{border:2px solid #ffce01;}
.yellow_line .line{border-top:2px solid #ffce01;}
.yellow_line .yellow_stop1{left: 220px;top: 26px;}
.yellow_line .yellow_stop2{left: 294px;top: 74px;}
.yellow_line .yellow_stop3{left: 339px;top: 103px;}
.yellow_line .yellow_stop4{left: 380px;top: 129px;}
.yellow_line .yellow_stop5{left: 422px;top: 155px;}
.yellow_line .yellow_stop6{left: 417px;top: 202px;}
.yellow_line .yellow_stop7{left: 403px;top: 288px;}
.yellow_line .yellow_stop8{left: 399px;top: 323px;}
.yellow_line .yellow_stop9{left: 383px;top: 414px;}
.yellow_line .yellow_stop10{left: 376px;top: 467px;}
.yellow_line .yellow_stop11{left: 370px;top: 497px;}
.yellow_line .yellow_stop12{left: 366px;top: 524px;}
.yellow_line .yellow_stop13{left: 361px;top: 555px;}
.yellow_line .yellow_stop14{left: 358px;top: 583px;}
.yellow_line .yellow_stop15{left: 353px;top: 612px;}
.yellow_line .yellow_stop16{left: 341px;top: 680px;}
.yellow_line .yellow_stop17{left: 337px;top: 709px;}
.yellow_line .yellow_stop18{left: 332px;top: 739px;}
.yellow_line .yellow_stop19{left: 327px;top: 769px;}
.yellow_line .yellow_stop20{left: 313px;top: 849px;}
.yellow_line .yellow_stop21{left: 271px;top: 848px;}
.yellow_line .yellow_stop22{left: 220px;top: 847px;}
.yellow_line .yellow_stop23{left: 162px;top: 847px;}
.yellow_line .yellow_stop24{left: 117px;top: 846px;}
.yellow_line .yellow_stop25{left: 70px;top: 847px;}
.yellow_line .yellow_stop26{left: 0px;top: 847px;}
.violet_line{left:612px;top:548px;width:314px;height:423px;}
.violet_line .violet1{border:4px solid #8963a3;width:502px;transform:rotate(234deg);-webkit-transform:rotate(234deg);top:205px;left:-99px;z-index:-1;}
.violet_line .box1{background-color:#572260;left:294px;top:403px;}
.violet_line .stop{border:2px solid #572260;}
.violet_line .double_line{border:2px solid #572260;}
.violet_line .line{border-top:2px solid #572260;}
.violet_line .violet_stop1{left: 28px;top: 35px;}
.violet_line .violet_stop2{left: 52px;top: 68px;}
.violet_line .violet_stop3{left: 74px;top: 98px;}
.violet_line .violet_stop4{left: 111px;top: 150px;}
.violet_line .violet_stop5{left: 129px;top: 175px;}
.violet_line .violet_stop6{left: 145px;top: 196px;}
.violet_line .violet_stop7{left: 180px;top: 246px;}
.violet_line .violet_stop8{left: 199px;top: 271px;}
.violet_line .violet_stop9{left: 218px;top: 297px;}
.violet_line .violet_stop10{left: 235px;top: 321px;}
.violet_line .violet_stop11{left: 256px;top: 349px;}
.violet_line .violet_stop12{left: 275px;top: 375px;}
.violet_line .angle{left: 18px;top: -5px;-webkit-transform: rotate(-1deg);transform: rotate(-1deg);}
.green_line{left:25px;top:274px;width:460px;height:175px;}
.green_line .green{border:4px solid #8cc664;z-index:-1;}
.green_line .green1{width:405px;transform:rotate(193deg);-webkit-transform:rotate(193deg);top:50px;left:-6px;}
.green_line .green2{width:55px;transform:rotate(152deg);-webkit-transform:rotate(152deg);top:83px;left:390px;}
.green_line .green3{width:55px;transform:rotate(248deg);-webkit-transform:rotate(248deg);top:127px;left:380px;}
.green_line .box1{background-color:#8cc664;left:-2px;top:0px;}
.green_line .stop{border:2px solid #8cc664;}
.green_line .double_line{border:2px solid #8cc664;}
.green_line .line{border-top:2px solid #8cc664;}
.green_line .green_stop1{left: 32px;top: 12px;}
.green_line .green_stop2{left: 65px;top: 19px;}
.green_line .green_stop3{left: 101px;top: 26px;}
.green_line .green_stop4{left: 139px;top: 35px;}
.green_line .green_stop5{left: 175px;top: 43px;}
.green_line .green_stop6{left: 211px;top: 51px;}
.green_line .green_stop7{left: 250px;top: 61px;}
.green_line .green_stop8{left: 273px;top: 65px;}
.green_line .green_stop9{left: 304px;top: 74px;}
.green_line .green_stop10{left: 332px;top: 78px;}
.green_line .green_stop11{left: 405px;top: 126px;}
.green_line .angle{transform: rotate(-27deg);-webkit-transform: rotate(-27deg);}
.brown_line{left:253px;top:475px;width:390px;height:260px;}
.brown_line .brown1{border:4px solid #d66660;width:440px;transform:rotate(147deg);-webkit-transform:rotate(147deg);top:129px;left:-32px;z-index:-1;}
.brown_line .stop{border:2px solid #d66660;}
.brown_line .double_line{border:2px solid #d66660;}
.brown_line .line{border-top:2px solid #d66660;}
.brown_line .brown_stop1{left: 49px;top: 213px;}
.brown_line .brown_stop2{left: 143px;top: 150px;}
.brown_line .brown_stop3{left: 269px;top: 69px;}
.brown_line .angle{left: -45px;top: 34px;}
Delhi Metro - Script Codes
Delhi Metro - Script Codes
Home Page Home
Developer Krishna Babu
Username krishnab
Uploaded January 11, 2023
Rating 3
Size 6,344 Kb
Views 4,048
Do you need developer help for Delhi Metro?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Krishna Babu (krishnab) Script Codes
Name
Horizontal Scrolling
Flat UI Color Gradients
Background
Fade out slideshow
Wipe slider
Upload Button
AngularJs Combobox
Justify Horizontal Menu
Javascript Tab
Slide Transition
Create amazing sales emails with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!