Yayy...online resume

css/cv - Copy.css

@@ -0,0 +1,64 @@
+body {
+  color: #333;
+  padding-top: 20px;
+  padding-bottom: 20px;
+  background-color: #333;
+}
+
+/* Custom container */
+
+
+
+/* Portrait tablet to landscape and desktop */
+@media (min-width: 930px) { 
+
+  .container-main { margin: 0 auto;  width: 940px;  background-color: #fff;   border: 1px solid #ddd;}
+  .container-head {padding:40px;background-image: url("../img/bg.png");}
+  .container-body {padding:40px;padding-top:10px;}
+  .inner-seperator {margin:10px 0 20px 0; border-bottom: 1px solid #ddd;}
+  .inner-seperator-borderless {margin:10px 0 20px 0;}
+
+  .c-header {margin-bottom1: 60px; }
+  .c-header .c-photo {margin-left:50px;}  
+  .c-header .c-info {margin-left:40px; margin-top:40px;}  
+  .c-header .c-info .c-name {font-size: 36px; margin-bottom:10px;}  
+  .c-header .c-info .c-title {font-size: 18px; font-style: italic; }
+  .c-header .c-contact {margin-left:40px;}      
+
+  .c-line {margin-bottom:1px;}
+  .c-section {margin-top:30px; padding-bottom:30px;}
+  .c-section .c-caption {font-size: 20px; width:160px; font-style: italic;}
+  .c-section .c-body {width:670px; float: right;} 
+
+  .c-body .c-title-cont {margin-bottom:10px;}
+  .c-body .c-title-cont .c-title-name {width: 550px;}
+  .c-body .c-title-cont .c-title-name .c-title-name-desc { width:680px;margin-bottom1:2px; font-size: 18px; color: #2e4dbf;}
+  .c-body .c-title-cont .c-title-name .c-title-name-sub { width:680px;font-size:16px; font-style: italic;}
+  .c-body .c-title-cont .c-title-period {border: 1px solid #ddd; font-size: 12px; padding:2px 5px 2px 5px;}
+  .c-desc-cont ul {margin-left:17px;}
+  .c-title-text {font-size: 18px; color: #2e4dbf; margin-bottom:10px;}
+  .c-body .c-title-cont .c-title-name .c-title-name-desc { width:680px;margin-bottom1:2px; font-size: 18px; color: #2e4dbf;}
+
+  .c-border {border:1px solid #ddd; }
+  .hide {display:none;}
+  .seperator {border-bottom: 1px solid #ddd;}
+  .c-seperator-line {border-bottom: 0px solid #eee; margin: 2px 0 2px 0;}
+}
+
+/* Landscape phone to portrait tablet */
+@media (max-width: 767px) {  }
+
+/* Landscape phones and down */
+@media (max-width: 480px) { 
+  .container-main { margin: 0 auto;  width: 480px;  background-color: #fff;   border: 1px solid #ddd;}
+  .c-section .c-caption {font-size: 20px; width:60px; font-style: italic;}
+  .c-section .c-body {width:470px; float: right;} 
+  .c-body .c-title-cont .c-title-name .c-title-name-desc {width:380px;}
+  .c-body .c-title-cont .c-title-name .c-title-name-sub {width:380px;}
+}
+
+
+.c-border {border:1px solid #ddd; }
+.hide {display:none;}
+.seperator {border-bottom: 1px solid #ddd;}
+.c-seperator-line {border-bottom: 0px solid #eee; margin: 2px 0 2px 0;}

css/cv.css

@@ -0,0 +1,56 @@
+body { color: #333; background-color: #444;}
+
+.border {border:1px solid #ddd; }
+.hide {display:none;}
+
+.platform {margin: 20px auto; background-color: #fff;}
+.header {padding:40px; padding-bottom:30px; background-image: url("../img/bg.png");}
+.name-text {font-size: 36px; margin-bottom:10px; margin-top: 30px; line-height: 36px;}
+.major-text {font-size: 18px; margin-bottom: 10px;}
+.margin-top-5 {margin-top:5px;}
+.margin-top-10 {margin-top:10px;}
+.margin-bottom-2 {margin-bottom:2px;}
+.margin-bottom-5 {margin-bottom:5px;}
+.margin-bottom-10 {margin-bottom:10px;}
+
+.main {padding:40px;}
+.section-title {  font-size: 20px; font-style: italic; padding-bottom: 5px;}
+.section-body { }
+.seperator {border-bottom: 1px solid #ddd; margin: 20px 0 30px 0;}
+.seperator-line {border-bottom: 0px solid #eee; margin: 2px 0 2px 0;}
+.inner-seperator {margin:10px 0 20px 0; border-bottom: 1px dashed #ddd;}
+.section-body ul {margin-left: 17px;}
+.subject-name { font-size: 16px; font-weight: bold; color: #2e4dbf; margin-bottom: 5px;}
+.pdf {width: 50px; display:block; height: 50px; background-image: url(../img/pdf_icon.png); cursor: pointer; margin-top:10px;}
+a.dotted {border-bottom: 1px black dotted; display: block;}
+a.dotted:hover {text-decoration: none;}
+
+/* Portrait tablet to landscape and desktop */
+@media (min-width: 900px) { 
+  .platform {width:980px; }
+  .section-title { width: 180px; }
+  .section-body { width: 690px; }
+
+  .pdf {position: fixed; top:189px; margin-left: 340px;}
+
+  .item-name { max-width:550px; font-size: 16px; font-weight: bold; color: #2e4dbf;}
+  .item-desc { max-width:550px; font-size:14px; font-style: italic;}
+  .item-period {border: 1px solid #ddd; font-size: 12px; padding:2px 5px 2px 5px;}
+}
+
+/* Landscape phone to portrait tablet */
+@media (max-width: 767px) {  
+
+}
+
+/* Landscape phones and down */
+@media (max-width: 480px) { 
+  .name-text {margin-top: 15px;}
+  .main {padding:20px; padding-bottom:25px;}
+  .platform {margin: 10px auto;}
+  .header {padding:10px; padding-bottom:0px;}
+  .seperator {margin: 5px 0 10px 0;}
+  .inner-seperator {margin:5px 0 10px 0; }
+}
+
+

index.html

@@ -0,0 +1,253 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<title>CV</title>
+		<meta name="viewport" content="width=device-width, initial-scale=1.0">
+		<meta name="description" content="">
+		<meta name="author" content="">
+		<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
+		<link href="css/cv.css" rel="stylesheet">		
+	</head>
+	<body>
+
+		<div class="platform">
+
+			<div class="header">
+
+		    	<div class="row">		
+
+		        	<div class="span">
+		        		<img src="img/hayseuss.jpeg" class="img-polaroid">
+		        	</div>
+		        	<!--/photo-->
+
+		        	<div class="span margin-bottom-5">
+		        		<div class="name-text">Udit Manektala</div>
+                <div class="major-text"><i>Software <del>Jesus</del> Developer</i></div>						
+		        		<div class="major-text"><i>'Saving' Software Projects since 2005.</i></div>						
+		        	</div>
+		        	<!--/name-->
+
+		        	<div class="span pull-right">
+						<div class="span">
+							<address class="margin-bottom-5">
+							 Berkeley, CA 
+							</address>							
+							<abbr rel="tooltip" data-original-title="Email">E:</abbr>&nbsp;&nbsp;<a href="mailto:[email protected]">[email protected]</a><br>
+							<abbr rel="tooltip" data-original-title="Website">W:</abbr>&nbsp;<a href="www.domain.com">udit.manektala.com</a><br>
+							<div class="margin-top-5 margin-bottom-5">
+								<a href="http://www.linkedin.com/pub/udit-manektala/1/b48/66" target ="_blank" rel="tooltip" data-original-title="LinkedIn"><img src="img/linkedin.png" alt="LinkedIn" width="20"/></a>&nbsp;
+								<a href="http://twitter.com/udit" rel="tooltip" data-original-title="Twitter"><img src="img/twitter.png" alt="Twitter" width="20"/></a>&nbsp;
+							</div>
+						</div>
+
+						<a class="pdf" href="cv.pdf" target="_blank" rel="tooltip" data-original-title="Download as PDF"></a>	
+
+		        	</div>
+		        	<!--/contacts-->
+
+		      	</div>
+
+	    	</div><!-- /header -->
+
+
+	      	<div class="main">  	
+      			<div class="seperator"></div>
+
+      			<div class="row">
+	      			<div class="span section-title">
+		        		Personal Projects
+			        </div>
+
+	        		<div class="span section-body">
+
+		        		<div class="clearfix">
+			        		<div class="row">
+				        		<div class="span">
+				        			<div class="item-name">Gitori - A musician's toolkit</div>
+                        <p> Rails/MySQL/Redis/Chrome HTML5 Webaudio </p>
+				        		</div>	
+				        	</div>
+				        	<div class="margin-top-10">	
+                    Wore every possible hat to make this hare-brained idea come to life. The app is built to scratch a personal itch as a musician.
+				        	</div>
+				        </div>
+
+				        <div class="inner-seperator"></div>
+		        		<div class="clearfix">
+			        		<div class="row">
+				        		<div class="span">
+				        			<div class="item-name">Visamapper</div>
+                        <p> Rails/MongoDB</p>
+				        		</div>	
+				        	</div>
+				        	<div class="margin-top-10">	
+                    A crowd-sourced app built to help find visa-free travel destinations. The need to build this came from my wanderlust butting heads with my Indian passport.
+				        	</div>
+				        </div>
+
+				        <div class="inner-seperator"></div>
+		        		<div class="clearfix">
+			        		<div class="row">
+				        		<div class="span">
+				        			<div class="item-name">4.everalone</div>
+                        <p> Rails/Neo4J</p>
+				        		</div>	
+				        	</div>
+                  <div class="margin-top-10">	
+                    It's a ...matchmaking site for redditors. Yeah, I know..stupid idea.Oh well..
+				        	</div>
+				        </div>
+		        	</div>	
+		        </div>	        	
+		        <!-- /education-->
+
+		        <div class="seperator"></div>
+
+	      	  	<div class="row">
+	      			<div class="span section-title">
+		        		Education
+			        </div>
+
+	        		<div class="span section-body">
+
+		        		<div class="clearfix">
+			        		<div class="row">
+				        		<div class="span">
+				        			<div class="item-name">MSc Finance and Global Banking, MSc Finance and Global Banking</div>
+				        			<div class="item-desc">European Business School London (EBSL), London, UK, School London (EBSL), London, UK</div>
+				        		</div>	
+				        		<div class="item-period pull-right span">2010 - 2012</div>
+				        	</div>
+				        	<div class="margin-top-10">	
+				        		<ul>
+									<li>Bank Risk Management, Banking Regulation</li>
+									<li>Corporate Finance, Financial Reporting and Analyses</li>
+									<li>Monetary Policy and Central Bank Operations</li>
+									<li>Trading in Global Financial Markets, Investment Analyses</li>
+									<li>Thesis: Gold Price Relation to Sovereign Debt</li>
+								</ul>
+				        	</div>
+				        </div>
+
+			        	<div class="inner-seperator"></div>
+
+			        	<div class="clearfix">
+			        		<div class="row">
+				        		<div class="span">
+				        			<div class="item-name">Bachelor of Civil Engineering</div>
+				        			<div class="item-desc">Auburn University – Auburn, Alabama</div>
+				        		</div>	
+				        		<div class="item-period pull-right span">2006 - 2010</div>
+				        	</div>
+				        	<div class="margin-top-10">	
+				        		<ul>
+				        			<li>Graduated magna cum laude with a 3.62 GPA</li>
+									<li>Member of Chi Epsilon and Tau Beta Pi (Engineering honorary societies)</li>
+									<li>Monetary Policy and Central Bank Operations</li>
+									<li>Thesis: Taught Introduction to Computers in Civil Engineering</li>
+								</ul>
+				        	</div>
+				        </div>
+
+		        	</div>	
+		        </div>	        	
+		        <!-- /education-->
+
+		        <div class="seperator"></div>
+
+      			<div class="row">
+	      			<div class="span section-title">
+		        		Skills
+			        </div>
+
+	        		<div class="span section-body">
+
+		        		<div class="clearfix">
+
+			        		<div class="subject-name">Technical</div>					        	
+					        <ul>
+								<li>Technical Management and System Architect.</li>
+								<li>Software Engineering in C/C++, Java, .NET, PHP, Objective-C.</li>
+								<li>Database Engineering for MSSQL, MySQL.</li>
+								<li>System Administration for Linux OS(Fedora, CentOS, RedHat, Ubuntu).</li>
+								<li>Web Development in HTML/HTML5, CCS/CCS3, JavaScript.</li>
+								<li>Mobile Application Development for Android and iOS(iPhone, iPad and iPod).</li>
+								<li>Consulting for Navitaire Airline Solution Integration.</li>
+							</ul>
+
+							<div class="margin-bottom-10"></div>
+
+							<div class="subject-name">Languages</div>
+							<ul>
+								<li>English - Native</li>
+								<li>Spanish - Fluent</li>
+								<li>French  - Fluent</li>
+							</ul>
+
+				        </div>	
+
+		        	</div>	
+		        </div>	        	
+		        <!-- /skills-->
+
+		        <div class="seperator"></div>
+
+		        <div class="row">
+		      		<div class="span section-title">
+			        	Awards & Certificates
+				    </div>
+				    <div class="span section-body">
+				    	<ul>
+							<li>2008 Certificate A in IT.</li>
+							<li>2nd prize winner in National Programming Contest, 2012.</li>
+							<li>3nd prize winner in State Math Olympiad, 2012.</li>
+						</ul>
+				    </div>	
+		        </div>
+		        <!-- /awards-->
+
+		        <div class="seperator"></div>
+
+		        <div class="row">
+		      		<div class="span section-title">
+		        		Interests
+		        	</div>
+		        	<div class="span section-body">
+			        	Swimming, travelling, cooking, photography, fishing.	
+			        </div>
+			    </div>
+			    <!-- /interests-->
+
+		        <div class="seperator"></div>
+
+		        <div class="row">
+		      		<div class="span section-title">
+		        		Requests
+		        	</div>
+		        	<div class="span section-body">
+			        	Available upon request.
+			        </div>
+			    </div>
+
+			    <div class="clearfix margin-bottom-10 pull-right">
+			    	<a class="dotted" href="javascript:;"
+			    	 onclick="jQuery('html,body').animate({scrollTop: jQuery('.header').offset().top}, 'slow');"
+			    	>	
+			    	top
+			    	</a>
+			    </div>
+
+      		</div> <!-- /main -->
+
+    	</div> <!-- /container -->
+	<script src="js/jquery-1.8.2.min.js"></script>
+	<script src="bootstrap/js/bootstrap.min.js"></script>	
+	<script>
+	jQuery(document).ready(function() {
+		jQuery('[rel="tooltip"]').tooltip({trigger : 'hover'});	
+	})
+	</script>
+	</body>
+</html>