diff --git a/css/styles.css b/css/styles.css index b1c45f2..388a57f 100644 --- a/css/styles.css +++ b/css/styles.css @@ -197,6 +197,10 @@ body { .footer-color { background-color: #02867b; } +.tracks-color +{ + background-color: #2cecdc; +} .unselectable { user-select: none; } @@ -716,7 +720,7 @@ body { #faq { padding-top: 40px; - background-image: linear-gradient(180deg, #23bef9 0%, #02867b 100%); + background-image: linear-gradient(180deg, #047cb4 0%, #02867b 100%); } .section-header-faq { @@ -877,7 +881,7 @@ a:hover { } #tracks { - background-image: linear-gradient(180deg, #057eb0 0%, #2ceedd 100%); + background-image: linear-gradient(180deg, #24bcfc 0%, #2ceedd 100%); padding: 70px 30px 70px 30px; } @@ -1005,4 +1009,75 @@ a:hover { } } + +/*Track section css*/ + +/* :: About Single Page CSS */ +.single-we-offer-content { + position: relative; + z-index: 1; + -webkit-box-shadow: 0px 8px 27px 0px rgba(90, 111, 120, 0.15); + box-shadow: 0px 8px 27px 0px rgba(90, 111, 120, 0.15); + border-radius: 10px; + padding: 30px 25px; + margin-bottom: 30px; + overflow: hidden; } + .single-we-offer-content .offer-icon { + position: relative; + z-index: 1; + margin: auto; + height: 115px; + width: 115px; + background: #42dfa3; + background-image: -moz-linear-gradient(120deg, #42dfa3 0%, #505add 100%); + background-image: -webkit-linear-gradient(120deg, #42dfa3 0%, #505add 100%); + background-image: -ms-linear-gradient(120deg, #42dfa3 0%, #505add 100%); + border-radius: 50%; + line-height: 115px; } + .single-we-offer-content .offer-icon::after { + -webkit-transition-duration: 1000ms; + -o-transition-duration: 1000ms; + transition-duration: 1000ms; + border-radius: 50%; + content: ''; + position: absolute; + width: 0%; + height: 0%; + top: 50%; + left: 50%; + -webkit-transform: translate(-50%, -50%); + -ms-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + background: #42dfa3; + background-image: -moz-linear-gradient(120deg, #42dfa3 0%, #505add 100%); + background-image: -webkit-linear-gradient(120deg, #42dfa3 0%, #505add 100%); + background-image: -ms-linear-gradient(120deg, #42dfa3 0%, #505add 100%); + z-index: -10; } + .single-we-offer-content h5 { + -webkit-transition-duration: 1000ms; + -o-transition-duration: 1000ms; + transition-duration: 1000ms; + font-size: 22px; + color: #111343; + margin-top: 25px; + position: relative; + z-index: 2; } + .single-we-offer-content p { + -webkit-transition-duration: 1000ms; + -o-transition-duration: 1000ms; + transition-duration: 1000ms; + color: #5d5e8d; + margin-bottom: 0; + position: relative; + z-index: 2; } + .single-we-offer-content:hover {transform: scale(1.08);} + .single-we-offer-content:hover h5, + .single-we-offer-content:hover p, .single-we-offer-content:focus h5, + .single-we-offer-content:focus p { + color: #ffffff; } + .single-we-offer-content:hover .offer-icon::after, .single-we-offer-content:focus .offer-icon::after { + width: 800%; + height: 800%; } + + /*-------------------------------------------------------------------------------------------------------------------------------------------------*/ diff --git a/img/tracks/Connect.png b/img/tracks/Connect.png new file mode 100644 index 0000000..5fd58c5 Binary files /dev/null and b/img/tracks/Connect.png differ diff --git a/img/tracks/Contactless.png b/img/tracks/Contactless.png new file mode 100644 index 0000000..0361f35 Binary files /dev/null and b/img/tracks/Contactless.png differ diff --git a/img/tracks/Fitness.png b/img/tracks/Fitness.png new file mode 100644 index 0000000..d0550d5 Binary files /dev/null and b/img/tracks/Fitness.png differ diff --git a/img/tracks/Fun.png b/img/tracks/Fun.png new file mode 100644 index 0000000..5f42221 Binary files /dev/null and b/img/tracks/Fun.png differ diff --git a/img/tracks/Innovate.png b/img/tracks/Innovate.png new file mode 100644 index 0000000..97141e6 Binary files /dev/null and b/img/tracks/Innovate.png differ diff --git a/img/tracks/Security.png b/img/tracks/Security.png new file mode 100644 index 0000000..230311d Binary files /dev/null and b/img/tracks/Security.png differ diff --git a/index.html b/index.html index 7759df6..23acc8c 100644 --- a/index.html +++ b/index.html @@ -751,7 +751,9 @@

-
+ +
+ />
+
+
+
+
+
+

+ Tracks +

+
+
+
+ + +
+ + +
+
+
+ Let's Have Fun +
+
Let's Have Fun
+

+ "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!" +

+
+
+
+
+
+ Let's Connect +
+
Let's Connect
+

+ "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!" +

+
+
+
+
+
+ Let's Stay Fit +
+
Let's Stay Fit
+

+ "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." +

+
+
+
+
+
+
+
+ Let's Go Contactless +
+
Let's Go Contactless
+

+ "Want to Stay Safe from the Virus 🦠! Going Contactless is the Key. Design a contactless alternative for any activity that requires human interaction!" + +

+
+
+
+
+
+ Let's Stay Safe +
+
Let's Stay Safe
+

+ "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." +

+ +
+
+
+
+
+ Let's Innovate + +
+
Let's Innovate
+

+ "Technology makes your everyday life easy. So put your thinking caps 🧢 on and Innovate!" + +

+
+
+
+
+
+ +
+ +
+ +
@@ -1241,6 +1343,7 @@
+