chirag nagoi task

css/main.css

@@ -1346,6 +1346,11 @@ input::-moz-focus-inner {
 .js .animate-this,
 .js .animate-intro {
 	opacity: 0;
+	text-align: left;
+}
+
+.tem{
+	text-align: center !important;
 }
 
 .oldie .animate-this,
@@ -1739,7 +1744,7 @@ header .header-logo a {
 
 .home-content-tablecell h1 {
 	font-family: "librebaskerville-bold", serif;
-	font-size: 2.2rem;
+	font-size: 5.3rem;
 	line-height: 1.5;
 	color: #FFFFFF;
 }
@@ -1750,6 +1755,7 @@ header .header-logo a {
 	display: inline-block;
 	list-style: none;
 	margin: 4.8rem 0 0 0;
+	padding-right: 620px;
 }
 
 .home-content-tablecell .home-section-links li {
@@ -1979,7 +1985,7 @@ header .header-logo a {
 	position: relative;
 	padding: 10.8rem 0 10.8rem;
 	background-color: #FFFFFF;
-	min-height: 700px;
+	min-height: 1250px;
 }
 
 #about h3 {
@@ -2049,12 +2055,12 @@ header .header-logo a {
 
 .about-profile p.lead {
 	color: #636363;
-	font-size: 3rem;
+	font-size: 2.1rem;
 }
 
 .about-profile p {
-	font-size: 1rem;
-	line-height: 1px;
+
+	line-height: 32px;
 }
 
 /*  */
@@ -2096,8 +2102,8 @@ header .header-logo a {
 .about-services ul.services li p {
 	margin-bottom: 1.5rem;
 	color: #4f4f4f;
-	font-size: 10px;
-	line-height: 1rem;
+	font-size: 15px;
+	line-height: 3.11rem;
 }
 
 /*  */
@@ -2110,6 +2116,11 @@ header .header-logo a {
 	color: #4C2405;
 }
 
+.img {
+	padding-right: 30px !important;
+	font-size: 50px !important;
+}
+
 /*  */
 
 .about-services ul.services .icon-wrap i {
@@ -2302,6 +2313,7 @@ header .header-logo a {
 #skills .section-intro h3 {
 	color: rgba(255, 255, 255, 0.35);
 	color: #7c3b08;
+	text-align: left;
 }
 
 #skills .section-intro h1 {
@@ -2380,6 +2392,7 @@ header .header-logo a {
 	text-transform: uppercase;
 	letter-spacing: .15rem;
 	position: relative;
+	text-align: left;
 }
 
 #credentials .credentials-content h2::before {
@@ -2422,6 +2435,7 @@ header .header-logo a {
 	position: relative;
 	padding-left: 8rem;
 	margin-bottom: 4.2rem;
+	text-align: left;
 }
 
 #credentials .timeline-ico {
@@ -2797,7 +2811,7 @@ header .header-logo a {
 #stats .stat h5 {
 	color: #FFFFFF;
 	margin-top: 1.5rem;
-	font-size: 0.4rem;
+	font-size: 1.5rem;
 }
 
 /*  */
@@ -2806,7 +2820,7 @@ header .header-logo a {
 
 #stats .stat h3 {
 	color: #7c3b08;
-	font-size: 8.8rem;
+	font-size: 5rem;
 	text-transform: uppercase;
 	letter-spacing: .2rem;
 	margin: 1.5rem 0 0 0;
@@ -3254,4 +3268,4 @@ footer .footer-social li:last-child {
 		right: 0;
 	}
 
-}
+}

css/windows10/windows10.css

@@ -461,6 +461,7 @@
 }
 .icon-Refresh:before {
     content: "\e991";
+
 }
 .icon-RegisteredTrademark:before {
     content: "\e992";

index.html

@@ -163,9 +163,9 @@ <h1 class="animate-this">More About Me.</h1>
 					voluptate enim ut adipisicing fugiat cupidatat nisi adipisicing labore non adipisicing in sit
 					proident. Ut in qui ea sint occaecat in commodo in in in incididunt ut</p>
 
-				<p>
-					<a href="#" class="button full-width animate-this">Contact Me</a>
-					<a href="#" class="button button-primary full-width animate-this">Download CV</a>
+				<p>					
+					<a href="#" class="button full-width animate-this tem" >Contact Me</a>
+					<a href="#" class="button button-primary full-width animate-this tem">Download CV</a>
 				</p>
 
 			</div> <!-- end about-profile  -->
@@ -184,7 +184,7 @@ <h1 class="animate-this">What I Do.</h1>
 				<ul class="services">
 					<li class="item-branding animate-this">
 						<div class="icon-wrap">
-							<i class="icon-RegisteredTrademark"></i>
+							<i class="icon-RegisteredTrademark img"></i>
 						</div>
 						<div class="service-item">
 							<h4>Branding</h4>
@@ -196,7 +196,7 @@ <h4>Branding</h4>
 					</li>
 					<li class="item-photography animate-this">
 						<div class="icon-wrap">
-							<i class="icon-Picture"></i>
+							<i class="icon-Picture img"></i>
 						</div>
 						<div class="service-item">
 							<h4>Photography</h4>
@@ -208,7 +208,7 @@ <h4>Photography</h4>
 					</li>
 					<li class="item-webdesign animate-this">
 						<div class="icon-wrap">
-							<i class="icon-HTML"></i>
+							<i class="icon-HTML img"></i>
 						</div>
 						<div class="service-item">
 							<h4>Web Design</h4>
@@ -220,7 +220,7 @@ <h4>Web Design</h4>
 					</li>
 					<li class="item-uiux animate-this">
 						<div class="icon-wrap">
-							<i class="icon-Checked"></i>
+							<i class="icon-Checked img"></i>
 						</div>
 						<div class="service-item">
 							<h4>UI/UX Design</h4>
@@ -253,35 +253,35 @@ <h4>UI/UX Design</h4>
 					<h3 class="animate-this">Skillset</h3>
 					<h1 class="animate-this">I've Got Some Skills.</h1>
 
-					<p class="animate-this">Lorem ipsum Elit ut consequat veniam eu nulla nulla reprehenderit
+					<p class="animate-this" >Lorem ipsum Elit ut consequat veniam eu nulla nulla reprehenderit
 						reprehenderit sit velit in cupidatat ex aliquip ut cupidatat Excepteur tempor id irure sed
 						dolore sint sunt voluptate ullamco nulla qui Duis qui culpa voluptate enim ea aute qui veniam in
 						irure et nisi nostrud deserunt est officia minim.</p>
 				</div>
 
 				<ul class="skill-bars">
 					<li class="animate-this" data-animate="fadeInRight">
-						<div class="progress percent90"><span>90%</span></div>
+						<div class="progress percent90" style="width: 90%;"><span>90%</span></div>
 						<strong>HTML5</strong>
 					</li>
 					<li class="animate-this" data-animate="fadeInRight">
-						<div class="progress percent85"><span>85%</span></div>
+						<div class="progress percent85" style="width: 85%;"><span>85%</span></div>
 						<strong>CSS3</strong>
 					</li>
 					<li class="animate-this" data-animate="fadeInRight">
-						<div class="progress percent70"><span>70%</span></div>
+						<div class="progress percent70" style="width: 70%;"><span>70%</span></div>
 						<strong>JQuery</strong>
 					</li>
 					<li class="animate-this" data-animate="fadeInRight">
-						<div class="progress percent95"><span>95%</span></div>
+						<div class="progress percent95" style="width: 95%;"><span>95%</span></div>
 						<strong>PHP</strong>
 					</li>
 					<li class="animate-this" data-animate="fadeInRight">
-						<div class="progress percent75"><span>75%</span></div>
+						<div class="progress percent75" style="width: 75%;"><span>75%</span></div>
 						<strong>Wordpress</strong>
 					</li>
 					<li class="animate-this" data-animate="fadeInRight">
-						<div class="progress percent90"><span>90%</span></div>
+						<div class="progress percent90" style="width: 90%;"><span>90%</span></div>
 						<strong>Angular JS</strong>
 					</li>
 				</ul>
@@ -298,8 +298,8 @@ <h1 class="animate-this">I've Got Some Skills.</h1>
 
 		<div class="row narrow section-intro with-bottom-sep">
 			<div class="col-twelve">
-				<h3 class="animate-this">Career and Education</h3>
-				<h1 class="animate-this">More of My Credentials.</h1>
+				<h3 class="animate-this tem">Career and Education</h3>
+				<h1 class="animate-this tem" >More of My Credentials.</h1>
 
 				<p class="lead">Lorem ipsum Dolor adipisicing nostrud et aute Excepteur amet commodo ea dolore irure
 					esse Duis nulla sint fugiat cillum ullamco proident aliquip quis qui voluptate dolore veniam Ut
@@ -447,10 +447,10 @@ <h4>Bachelor Degree</h4>
 
 		<div class="row narrow section-intro with-bottom-sep">
 			<div class="col-twelve">
-				<h3 class="animate-this">Portfolio</h3>
-				<h1 class="animate-this">See My Latest Projects.</h1>
+				<h3 class="animate-this tem" >Portfolio</h3>
+				<h1 class="animate-this tem">See My Latest Projects.</h1>
 
-				<p class="lead animate-this">Lorem ipsum Dolor adipisicing nostrud et aute Excepteur amet commodo ea
+				<p class="lead animate-this tem">Lorem ipsum Dolor adipisicing nostrud et aute Excepteur amet commodo ea
 					dolore irure esse Duis nulla sint fugiat cillum ullamco proident aliquip quis qui voluptate dolore
 					veniam Ut laborum non est in officia.</p>
 			</div>
@@ -674,10 +674,10 @@ <h3 class="stat-count">120</h3>
 
 		<div class="row narrow section-intro">
 			<div class="col-twelve">
-				<h3 class="animate-this">Contact</h3>
-				<h1 class="animate-this">I'm Available for Freelance Work. Feel Free to Contact Me.</h1>
+				<h3 class="animate-this tem">Contact</h3>
+				<h1 class="animate-this tem">I'm Available for Freelance Work. Feel Free to Contact Me.</h1>
 
-				<p class="lead animate-this">Lorem ipsum Do commodo in proident enim in dolor cupidatat adipisicing
+				<p class="lead animate-this tem">Lorem ipsum Do commodo in proident enim in dolor cupidatat adipisicing
 					dolore officia nisi aliqua incididunt Ut veniam lorem ipsum Consectetur ut in in eu do.</p>
 			</div>
 		</div> <!-- end section-intro -->
@@ -717,28 +717,28 @@ <h1 class="animate-this">I'm Available for Freelance Work. Feel Free to Contact
 		<div class="row contact-info">
 
 			<div class="col-four tab-full">
-				<h5 class="animate-this">Where to find me</h5>
+				<h5 class="animate-this tem">Where to find me</h5>
 
-				<p class="animate-this">
+				<p class="animate-this tem">
 					1600 Amphitheatre Parkway<br>
 					Mountain View, CA<br>
 					94043 US
 				</p>
 			</div> <!-- end col-four -->
 
 			<div class="col-four tab-full collapse">
-				<h5 class="animate-this">Email Me At</h5>
+				<h5 class="animate-this tem">Email Me At</h5>
 
-				<p class="animate-this">
+				<p class="animate-this tem">
 					[email protected]<br>
 					[email protected]
 				</p>
 			</div> <!-- end col-four -->
 
 			<div class="col-four tab-full">
-				<h5 class="animate-this">Call Me At</h5>
+				<h5 class="animate-this tem">Call Me At</h5>
 
-				<p class="animate-this">
+				<p class="animate-this tem">
 					Phone: (+63) 555 1212<br>
 					Mobile: (+63) 555 0100<br>
 					Fax: (+63) 555 0101
@@ -790,4 +790,4 @@ <h5 class="animate-this">Call Me At</h5>
 
 </body>
 
-</html>
+</html>