Skip to content

Commit c7ccaaf

Browse files
authored
Merge pull request #27 from Nishthakumari/Tracks
Tracks Section Added
2 parents 611d674 + 77c6b75 commit c7ccaaf

File tree

8 files changed

+182
-4
lines changed

8 files changed

+182
-4
lines changed

css/styles.css

Lines changed: 77 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -209,6 +209,10 @@ body {
209209
.footer-color {
210210
background-color: #02867b;
211211
}
212+
.tracks-color
213+
{
214+
background-color: #2cecdc;
215+
}
212216
.unselectable {
213217
user-select: none;
214218
}
@@ -728,7 +732,7 @@ body {
728732

729733
#faq {
730734
padding-top: 40px;
731-
background-image: linear-gradient(180deg, #23bef9 0%, #02867b 100%);
735+
background-image: linear-gradient(180deg, #047cb4 0%, #02867b 100%);
732736
}
733737

734738
.section-header-faq {
@@ -889,7 +893,7 @@ a:hover {
889893
}
890894

891895
#tracks {
892-
background-image: linear-gradient(180deg, #057eb0 0%, #2ceedd 100%);
896+
background-image: linear-gradient(180deg, #24bcfc 0%, #2ceedd 100%);
893897
padding: 70px 30px 70px 30px;
894898
}
895899

@@ -1017,4 +1021,75 @@ a:hover {
10171021
}
10181022
}
10191023

1024+
1025+
/*Track section css*/
1026+
1027+
/* :: About Single Page CSS */
1028+
.single-we-offer-content {
1029+
position: relative;
1030+
z-index: 1;
1031+
-webkit-box-shadow: 0px 8px 27px 0px rgba(90, 111, 120, 0.15);
1032+
box-shadow: 0px 8px 27px 0px rgba(90, 111, 120, 0.15);
1033+
border-radius: 10px;
1034+
padding: 30px 25px;
1035+
margin-bottom: 30px;
1036+
overflow: hidden; }
1037+
.single-we-offer-content .offer-icon {
1038+
position: relative;
1039+
z-index: 1;
1040+
margin: auto;
1041+
height: 115px;
1042+
width: 115px;
1043+
background: #42dfa3;
1044+
background-image: -moz-linear-gradient(120deg, #42dfa3 0%, #505add 100%);
1045+
background-image: -webkit-linear-gradient(120deg, #42dfa3 0%, #505add 100%);
1046+
background-image: -ms-linear-gradient(120deg, #42dfa3 0%, #505add 100%);
1047+
border-radius: 50%;
1048+
line-height: 115px; }
1049+
.single-we-offer-content .offer-icon::after {
1050+
-webkit-transition-duration: 1000ms;
1051+
-o-transition-duration: 1000ms;
1052+
transition-duration: 1000ms;
1053+
border-radius: 50%;
1054+
content: '';
1055+
position: absolute;
1056+
width: 0%;
1057+
height: 0%;
1058+
top: 50%;
1059+
left: 50%;
1060+
-webkit-transform: translate(-50%, -50%);
1061+
-ms-transform: translate(-50%, -50%);
1062+
transform: translate(-50%, -50%);
1063+
background: #42dfa3;
1064+
background-image: -moz-linear-gradient(120deg, #42dfa3 0%, #505add 100%);
1065+
background-image: -webkit-linear-gradient(120deg, #42dfa3 0%, #505add 100%);
1066+
background-image: -ms-linear-gradient(120deg, #42dfa3 0%, #505add 100%);
1067+
z-index: -10; }
1068+
.single-we-offer-content h5 {
1069+
-webkit-transition-duration: 1000ms;
1070+
-o-transition-duration: 1000ms;
1071+
transition-duration: 1000ms;
1072+
font-size: 22px;
1073+
color: #111343;
1074+
margin-top: 25px;
1075+
position: relative;
1076+
z-index: 2; }
1077+
.single-we-offer-content p {
1078+
-webkit-transition-duration: 1000ms;
1079+
-o-transition-duration: 1000ms;
1080+
transition-duration: 1000ms;
1081+
color: #5d5e8d;
1082+
margin-bottom: 0;
1083+
position: relative;
1084+
z-index: 2; }
1085+
.single-we-offer-content:hover {transform: scale(1.08);}
1086+
.single-we-offer-content:hover h5,
1087+
.single-we-offer-content:hover p, .single-we-offer-content:focus h5,
1088+
.single-we-offer-content:focus p {
1089+
color: #ffffff; }
1090+
.single-we-offer-content:hover .offer-icon::after, .single-we-offer-content:focus .offer-icon::after {
1091+
width: 800%;
1092+
height: 800%; }
1093+
1094+
10201095
/*-------------------------------------------------------------------------------------------------------------------------------------------------*/

img/tracks/Connect.png

241 KB
Loading

img/tracks/Contactless.png

152 KB
Loading

img/tracks/Fitness.png

129 KB
Loading

img/tracks/Fun.png

198 KB
Loading

img/tracks/Innovate.png

150 KB
Loading

img/tracks/Security.png

149 KB
Loading

index.html

Lines changed: 105 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -775,7 +775,9 @@ <h2 class="ticket-price" style="color:black !important">
775775

776776

777777
<!--Section Breaker Prizes/Sponsors-->
778-
<div class="section-divider sponser-color unselectable">
778+
779+
<div class="section-divider tracks-color unselectable">
780+
779781
<img
780782
src="./img/Sea creatures/S1.png"
781783
style="
@@ -806,6 +808,106 @@ <h2 class="ticket-price" style="color:black !important">
806808
/>
807809
</div>
808810

811+
<section style="padding-top: 0%;" class="what-we-offer-area section-padding-100-70" id="tracks">
812+
<div class="container">
813+
<div class="row">
814+
<div class="col-12">
815+
<div class="section-heading-2">
816+
<h4 class="text-center" style="margin-bottom: 70px; color: black">
817+
Tracks
818+
</h4>
819+
</div>
820+
</div>
821+
</div>
822+
823+
824+
<div class="row">
825+
826+
827+
<div class="col-12 col-md-4 col-xl-4">
828+
<div class="single-we-offer-content text-center wow fadeInUp" data-wow-delay="0.3s">
829+
<div style="background-image: none;background: none;" class="offer-icon">
830+
<img src="img/tracks/Fun.png" onerror="this.onerror=null;this.src='img/tracks/ai.png';" alt="Let's Have Fun" width="150" height="150">
831+
</div>
832+
<h5>Let's Have Fun</h5>
833+
<p>
834+
"Recreate a newer version of any of your Favourite Game or any New Game. Not just games, your project can include any hacks that can make you and your pals have Fun together!"
835+
</p>
836+
</div>
837+
</div>
838+
<div class="col-12 col-md-4 col-xl-4">
839+
<div class="single-we-offer-content text-center wow fadeInUp" data-wow-delay="0.3s">
840+
<div style="background-image: none;background: none;" class="offer-icon">
841+
<img src="img/tracks/Connect.png" onerror="this.onerror=null;this.src='img/tracks/Connect.png';" alt="Let's Connect" width="150" height="150">
842+
</div>
843+
<h5>Let's Connect</h5>
844+
<p>
845+
"Getting bored with your Virtual Setup? Find ways of making your Virtual Education, Classrooms, Gatherings or even Work From Home more Interactive and Easy to work with!"
846+
</p>
847+
</div>
848+
</div>
849+
<div class="col-12 col-md-4 col-xl-4">
850+
<div class="single-we-offer-content text-center wow fadeInUp" data-wow-delay="0.3s">
851+
<div style="background-image: none;background: none;" class="offer-icon">
852+
<img src="img/tracks/Fitness.png" onerror="this.onerror=null;this.src='img/tracks/Fitness.png';" alt="Let's Stay Fit" width="150" height="150">
853+
</div>
854+
<h5>Let's Stay Fit</h5>
855+
<p>
856+
"Health is Wealth! Especially during these tough times. Design ways of keeping yourself and your loved ones safe by making Healthcare more efficient and easily accessible."
857+
</p>
858+
</div>
859+
</div>
860+
</div>
861+
<div class="row">
862+
<div class="col-12 col-md-4 col-xl-4">
863+
<div class="single-we-offer-content text-center wow fadeInUp" data-wow-delay="0.3s">
864+
<div style="background-image: none;background: none;" class="offer-icon">
865+
<img src="img/tracks/Contactless.png" onerror="this.onerror=null;this.src='img/tracks/Contactless.png';" alt="Let's Go Contactless" width="150" height="150">
866+
</div>
867+
<h5>Let's Go Contactless</h5>
868+
<p>
869+
"Want to Stay Safe from the Virus 🦠! Going Contactless is the Key. Design a contactless alternative for any activity that requires human interaction!"
870+
871+
</p>
872+
</div>
873+
</div>
874+
<div class="col-12 col-md-4 col-xl-4">
875+
<div class="single-we-offer-content text-center wow fadeInUp" data-wow-delay="0.3s">
876+
<div style="background-image: none;background: none;" class="offer-icon">
877+
<img src="img/tracks/Security.png" onerror="this.onerror=null;this.src='img/tracks/Security.png';" alt="Let's Stay Safe" width="150" height="150">
878+
</div>
879+
<h5>Let's Stay Safe</h5>
880+
<p>
881+
"With the surge in Crime Rates, its better to be “Safe than Sorry”. Come up with hacks of making the Community safe, secure and a better place to live in."
882+
</p>
883+
884+
</div>
885+
</div>
886+
<div class="col-12 col-md-4 col-xl-4">
887+
<div class="single-we-offer-content text-center wow fadeInUp" data-wow-delay="0.3s">
888+
<div style="background-image: none;background: none;" class="offer-icon">
889+
<img src="img/tracks/Innovate.png" onerror="this.onerror=null;this.src='img/tracks/Innovate.png';" alt="Let's Innovate" width="150" height="150">
890+
891+
</div>
892+
<h5>Let's Innovate</h5>
893+
<p>
894+
"Technology makes your everyday life easy. So put your thinking caps 🧢 on and Innovate!"
895+
896+
</p>
897+
</div>
898+
</div>
899+
</div>
900+
</div>
901+
</section>
902+
<!--TRACKS End-->
903+
<div class="section-divider sponser-color unselectables">
904+
<img
905+
src="img/section_breaker_blue/W4.webp"
906+
onerror="this.onerror=null;this.src='img/section_breaker_blue/W4.png';"
907+
/>
908+
</div>
909+
910+
809911
<!--------------------------------------------------------------------------------------------------------------------------->
810912
<!--Sponsors-->
811913
<section id="sponsors" class="our-sponsor-client-area section-padding-100">
@@ -1265,6 +1367,7 @@ <h5 style="display: flex; justify-content: center">
12651367

12661368
<!--------------------------------------------------------------------------------------------------------------------------->
12671369
<!-- Tracks -->
1370+
<!--
12681371
<section id="tracks" class="part-3">
12691372
<div class="container">
12701373
<div class="row">
@@ -1331,7 +1434,7 @@ <h5 class="card-body">COMING SOON!</h5>
13311434
onerror="this.onerror=null;this.src='img/section_breaker_blue/W4.png';"
13321435
/>
13331436
</div>
1334-
1437+
-->
13351438

13361439
<!--------------------------------------------------------------------------------------------------------------------------->
13371440
<!--FAQ Section-->

0 commit comments

Comments
 (0)