-
-
-#### About Page
-
-
-
-#### Projects Page
-
-
-
-
-:star: Star me on GitHub — it helps!
-
-## Features 📋
-⚡️ Fully Responsive\
-⚡️ Valid HTML5 & CSS3\
-⚡️ Typing animation using `Typed.js`\
-⚡️ Easy to modify
-
-## Installation & Deployment 📦
-- Clone the repository and modify the content of index.html
-- Add or remove images from `assets/img/` directory as per your requirement.
-- Update the info of `projects` folder according to your need
-- Use [Github Pages](https://create-react-app.dev/docs/deployment/#github-pages) to create your own website.
-- To deploy your website, first you need to create github repository with name `Welcome to the After Login Page
+ + + + + diff --git a/index.html b/index.html index ca4f4a10..2e13d178 100644 --- a/index.html +++ b/index.html @@ -13,7 +13,7 @@ -
-
+
+
+
+
+
@@ -144,23 +150,14 @@ Prerak Raja
+Chaudhry Rashid
I'm
@@ -103,30 +106,33 @@About
- 
+ ![]()
+
-
Focused and enthusiastic developer with a keen interest in software development and artificial intelligence. By comprehensive exposure - to the underlying concepts and applying them vividly to various projects, my love for these domains came into being. - I am a passionate individual who thrives to build and apply algorithms to solve real-world industry problems. +
Started unintentionally with Supersimple.dev. Now, creating beautiful and responsive websites and templates for everyone to explore! But this time intentionally.
-
-
- Birthday: 12 October 1996 -
- Phone: +1 480-401-8112 +
- Age:16 Year old +
- Phone: +1 123-456-9999
-
-
- City: Tempe, AZ -
- Email: rajaprerak@gmail.com +
- City: Highpoint, NC +
- Email: rohailch2023@outlook.com
Software Development
-
+
-
-
- Machine Learning
-Computer Vision
-
+
-
-
- Natural Language Processing
-
@@ -174,220 +171,62 @@
Visualization
-
-
-
-
- Algorithms
-
-
-
-
-
-
-
-
-
-
-
-
-
- Image Processing
-
-
-
-
-
-
- Education
-
-
-
-
-
-
-
- 
-
-
-
-
- MS in Computer Science
-Janurary 2021 - Present
-Relevant Coursework
--
-
- Distributed Database Systems -
- Cloud Computing -
- Foundation Of Algorithms -
- 
-
-
-
-
- B.Tech. in Information and Communication Technology
-July 2014 - May 2018
-Relevant Coursework
--
-
-
- Database Management Systems - -
- Algorithms & Optimization for Big Data -
- Machine Learning - -
-
-
-
-
-
-
+
+
-
-
-
-
-
-
-
-
-
-
-
-
- Online Certification
-
-
-
-
-
-
-
+
-
-
-
-
-
-
-
- 
- 
- 
- 
-
-
-
-
- Experience
-
-
-
-
- Arizona State University
-
- Arizona State University
- January 2021 - Present
-Software Engineer
--
-
- Managed large‑scale deployment of JupyterHub with Nbgrader and webwork software, facilitating approx 5500 students. -
- Configured, troubleshot, and administered server‑side web applications for the statistics department. -
- Handled Linux server administration and Apache configuration; automated tasks like user account creation, managing student database, and system maintenance using Shell and automation scripts, reducing manual work by 200%. -
- Augmenify Infotech Pvt. Ltd.
-
- Augmenify Infotech Pvt. Ltd.
- August 2020 - November 2020
-Backend Developer
--
-
- Documented and coded server‑less web application for the hotel industry and designed REST API using Flask‑based JWT authentication. -
- Redeveloped an existing system to support customer account management, scheduling, and time tracking; enabled dynamic API calls with the help of Amazon API Gateway, AWS Lambda, and DynamoDB. -
- Epitome Corporation Pvt. Ltd.
-
- Epitome Corporation Pvt. Ltd.
- July 2019 - Dec 2019
-Software Developer
--
-
- Tested, designed, and developed backend APIs of WebRTC enabled multi‑party video conferencing web application and delivered the project 15 days ahead of schedule by efficiently designing the flow of the project. -
- Meditab Software Pvt. Ltd.
-
- Meditab Software Pvt. Ltd.
- May 2018 - June 2018
-Programmer Analyst
--
-
- Optimized image processing algorithm of pill detection by creating customized MASKRCNN algorithm, increasing accuracy by 15%; trained classification algorithm with the help of triplet loss to learn the image embedding of pill, reducing the hassle of collecting data of new pills. -
- Devised a pipeline of the project to incorporate it into the product of the company. Implemented Restful APIs in Django that enabled our quality Analyst team to increase reporting speed by 46%. -
- Built a web app to onboard data from the company’s product using Flask, Postgres, and AWS S3, enabling interactive charts in real-time. -
- Mentored 2 interns to optimize the pill detection algorithm and to include the multiprocessing pipeline, increasing overall speed by 75%. -
- Space Application Centre, ISRO
-
- Space Application Centre, ISRO
- Jan 2018 - May 2018
-Research Intern
--
-
- Implemented noise reduction algorithm on the satellite image and prepared architecture for detecting objects in high‑resolution satellite images, achieving 80% accuracy. -
- Increased accessibility of satellite image data by redesigning database and application for showcasing graphical data. -
Projects
@@ -455,7 +294,7 @@Projects
@@ -467,7 +306,7 @@Projects
@@ -481,7 +320,7 @@ Projects
@@ -494,7 +333,7 @@Resume Section Classifier
@@ -506,7 +345,7 @@ Resume Section Classifier
@@ -518,7 +357,7 @@ Resume Section Classifier
@@ -533,7 +372,7 @@ Resume Section Classifier
@@ -643,9 +482,8 @@ Contact
My Address
-1275 E University Dr
-Unit 212
-Tempe, AZ 85281
+Greensboro
+NC 27406
My Address
Social Profiles
@@ -666,20 +504,77 @@Social Profiles
rajaprerak@gmail.com
-pkraja@asu.edu
+rohailch2023@outlook.com
Contact
-+1 480-401-8112
++1 123-456-789
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Contact Us / Feedback
+ +
+
+
+
+
+
+
+
diff --git a/loginold.css b/loginold.css
new file mode 100644
index 00000000..af768a44
--- /dev/null
+++ b/loginold.css
@@ -0,0 +1,65 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ font-family: Arial, sans-serif;
+ }
+
+ .wrapper {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100vh;
+ background-color: #f0f0f0;
+ }
+
+ .login-box {
+ width: 400px;
+ padding: 20px;
+ background-color: white;
+ box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
+ border-radius: 10px;
+ }
+
+ h2 {
+ text-align: center;
+ margin-bottom: 20px;
+ }
+
+ .input-box {
+ position: relative;
+ margin-bottom: 20px;
+ }
+
+ .input-box input {
+ width: 100%;
+ padding: 10px;
+ border: 1px solid #ccc;
+ border-radius: 5px;
+ }
+
+ button {
+ width: 100%;
+ padding: 10px;
+ background-color: #4CAF50;
+ color: white;
+ border: none;
+ border-radius: 5px;
+ cursor: pointer;
+ }
+
+ button:hover {
+ background-color: #45a049;
+ }
+
+ .remember-forgot {
+ display: flex;
+ justify-content: space-between;
+ font-size: 0.9em;
+ }
+
+ .register-link {
+ text-align: center;
+ margin-top: 10px;
+ }
+
diff --git a/main.css b/main.css
new file mode 100644
index 00000000..b012ef9e
--- /dev/null
+++ b/main.css
@@ -0,0 +1,1238 @@
+@import url('https://fonts.googleapis.com/css?family=Cinzel+Decorative:300,400,500,600,700,900|Ubuntu:300,400,500,600,700,900&display=swap');
+
+/* GLOBALS START */
+
+
+/* GLOBALS END */
+/* BUTTONS START */
+.btn-success {
+ color: #fff;
+ background-color: #0D5E10;
+ border-color: #0D5E10;
+}
+
+/* BUTTONS END */
+/* BADGES START */
+.badge-success {
+ color: #fff;
+ background-color: #0D5E10;
+ border-color: #0D5E10;
+}
+
+/* BADGES END */
+/* BACKGROUNDS START */
+.bg-secondary {
+ color: #fff;
+ background-color: #0d5b5e !important;
+ background: linear-gradient(to right, #0d5b5e, #100d5e);
+}
+
+.bg-custom {
+ color: #fff;
+ width: 100%;
+ min-height: 40vh;
+ background: #5e0d5b;
+ background: linear-gradient(to right, #100d5e, #5e0d5b);
+}
+
+.bg-secondary a {
+ color: #d2973b;
+ font-weight: bold;
+}
+
+.dropdown-item.active,
+.dropdown-item:active {
+ color: #fff;
+ text-decoration: none;
+ background-color: #0D5E10;
+}
+
+.navbar {
+ font-weight: 600;
+}
+
+.nav-pills .nav-link.active {
+ color: #fff;
+ background-color: #0D5E10;
+}
+
+.nav-pills .nav-link {
+ color: #555;
+ text-transform: capitalize;
+}
+
+.text-uppercase {
+ letter-spacing: 0.2em;
+}
+
+/* With arrow tabs */
+
+.with-arrow .nav-link.active {
+ position: relative;
+ background: #0d5b5e;
+}
+
+.with-arrow .nav-link.active::after {
+ content: '';
+ border-left: 20px solid transparent;
+ border-right: 20px solid transparent;
+ border-top: 20px solid #d94e2b;
+ position: absolute;
+ bottom: -20px;
+ left: 50%;
+ transform: translateX(-50%);
+ display: block;
+}
+
+/* lined tabs */
+
+.lined .nav-link {
+ border: none;
+ border-bottom: 3px solid transparent;
+}
+
+.lined .nav-link:hover {
+ border: none;
+ border-bottom: 3px solid transparent;
+}
+
+.lined .nav-link.active {
+ background: none;
+ color: #555;
+ border-color: #2b90d9;
+}
+
+/* BACKGROUNDS END */
+#salah-times {
+ border-radius: 20px;
+ padding-left: 20px;
+ padding-right: 20px;
+}
+
+/* CAROUSEL START */
+.carousel-item {
+ height: 100vh;
+ min-height: 350px;
+ background: no-repeat center center scroll;
+ -webkit-background-size: cover;
+ -moz-background-size: cover;
+ -o-background-size: cover;
+ background-size: cover;
+}
+
+/* CAROUSEL END */
+.social-link {
+ width: 30px;
+ height: 30px;
+ border: 1px solid #ddd;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #666;
+ border-radius: 50%;
+ transition: all 0.3s;
+ font-size: 0.9rem;
+}
+
+.social-link:hover,
+.social-link:focus {
+ background: #ddd;
+ text-decoration: none;
+ color: #555;
+}
+
+a.contact-link {
+ text-decoration: none;
+ color: #fff;
+}
+
+.nav-narrow {
+ height: 30px !important;
+}
+
+.nav-wide {
+ background-color: #2a267b;
+}
+
+.how-section1 {
+ margin-top: -10%;
+ padding: 5%;
+}
+
+.how-section1 h4 {
+ font-size: 30px;
+}
+
+.how-section1 .subheading {
+ color: #3931af;
+ font-size: 20px;
+}
+
+.how-section1 .row {
+ margin-top: 10%;
+}
+
+.how-img {
+ text-align: center;
+}
+
+.how-img img {
+ width: 100%;
+}
+
+/*===========================================================================*/
+/*Parallax Section*/
+/*===========================================================================*/
+.parallax-section {
+ float: left;
+ width: 100%;
+ background: url(../images/parallax-bg.jpg) no-repeat left top/cover;
+ padding: 50px 0;
+}
+
+.parallax-section .right-box {
+ float: right;
+ width: 770px;
+}
+
+.parallax-section .right-box img {
+ float: right;
+ margin: 0 0 20px 0;
+}
+
+.parallax-section .right-box strong.title {
+ display: block;
+ font: 300 25px/25px 'Cinzel Decorative', cursive;
+ color: #fff;
+ clear: both;
+ padding: 0 0 15px 0;
+}
+
+.parallax-section .right-box a {
+ color: #ffad05;
+ display: inline-block;
+ font: 400 14px/14px 'Cinzel Decorative', cursive;
+ text-decoration: none;
+}
+
+.contact4 {
+ color: #8d97ad;
+ font-weight: 300;
+}
+
+.contact4 h1,
+.contact4 h2,
+.contact4 h3,
+.contact4 h4,
+.contact4 h5,
+.contact4 h6 {
+ color: #3e4555;
+}
+
+.contact4 .font-weight-medium {
+ font-weight: 500;
+}
+
+.contact4 .form-control {
+ background: transparent;
+ border: 2px solid rgba(255, 255, 255, 0.5);
+}
+
+.contact4 .form-control:focus {
+ border-color: #ffffff;
+}
+
+.contact4 input::-webkit-input-placeholder,
+.contact4 textarea::-webkit-input-placeholder {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.contact4 input:-ms-input-placeholder,
+.contact4 textarea:-ms-input-placeholder {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.contact4 input::placeholder,
+.contact4 textarea::placeholder {
+ color: rgba(255, 255, 255, 0.7);
+}
+
+.contact4 .right-image {
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ top: 0;
+}
+
+.contact4.bg-info {
+ background-color: #1f201f !important;
+}
+
+.contact4 .text-inverse {
+ color: #3e4555 !important;
+}
+
+.alert-warning {
+ background-color: #ffee00;
+ color: #211d22;
+}
+
+.navbar-toggler.collapsed .close-icon {
+ display: none;
+}
+
+.navbar-toggler:not(.collapsed) .navbar-toggler-icon {
+ display: inline;
+}
+
+.schedule-warp {
+ padding-right: 20px;
+ padding-left: 20px;
+ padding: 20px 30px;
+ border: solid 1px #ddd;
+ background-color: #f5f5f5;
+ -webkit-transition: all 0.7s cubic-bezier(0.11, 0.6, 0.24, 0.89);
+ transition: all 0.7s cubic-bezier(0.11, 0.6, 0.24, 0.89);
+}
+
+.schedule {
+ background-color: #fff;
+}
+
+.schedule-warp:hover {
+ box-shadow: 0 6px 20px rgba(0, 0, 0, .07);
+ border: solid 1px rgba(100, 40, 145, .97);
+}
+
+.schedule {
+ padding: 100px 0px;
+ background-color: #ecedf0;
+}
+
+.schedule-tag {
+ padding: 3px 8px;
+ margin-right: 15px;
+ width: 90px;
+ text-align: center;
+}
+
+.schedule-tag-boys {
+ color: #fff;
+ background-color: #2779d6;
+}
+
+.schedule-tag-girls {
+ color: #fff;
+ background-color: #b261b2;
+}
+
+.schedule-header span {
+ display: inline-block;
+ margin-right: 25px;
+}
+
+.schedule-header {
+ margin-bottom: 80px;
+}
+
+.schedule-card {
+ position: relative;
+ margin-bottom: 0.7em;
+}
+
+.schedule-card:hover .insidebox {
+ transform: scale(1.033);
+ /* box-shadow: 0 5px 18px rgba(0, 0, 0, 0.1); */
+ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.schedule-card:hover:after {
+ background: #8a56d1;
+ width: 25px;
+}
+
+.schedule-card:after {
+ height: 2px;
+ width: 22px;
+ background: #ddd;
+ content: '';
+ position: absolute;
+ top: 50%;
+ left: -22px;
+ transition: all 0.3s ease-in;
+}
+
+.insidebox {
+ box-shadow: 0 0px 5px rgba(0, 0, 0, .07);
+ background: #ffffff;
+ width: 100%;
+ height: auto;
+ display: flex;
+ display: -moz-flex;
+ display: -ms-flex;
+ display: -webkit-flex;
+ display: -o-flex;
+ -webkit-align-items: center;
+ align-items: center;
+ padding: 10px 20px;
+ color: #6164B2;
+ transition: all 0.2s ease-in;
+ /* justify-content: center;*/
+}
+
+.day-one {
+ margin-bottom: 50px;
+ font-weight: bold;
+ font-size: 20px;
+ color: #6164B2;
+}
+
+.bg-cover {
+ color: #ffffff;
+}
+
+.bg-cover {
+ background: url(../images/backgrounds/quran.jpg) no-repeat top center fixed;
+ background-size: cover;
+ padding: 20px 0;
+ width: 100%;
+ float: left;
+ position: relative;
+}
+
+.bg-cover:after {
+ content: "";
+ background: rgba(29, 26, 26, 0.9);
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ left: 0;
+ top: 0;
+}
+
+.bg-cover .container {
+ position: relative;
+ z-index: 99;
+}
+
+section.pricing {
+ background: #5e0d5b;
+ background: linear-gradient(to right, #5e0d5b, #100d5e);
+}
+
+.pricing .card {
+ border: none;
+ border-radius: 1rem;
+ transition: all 0.2s;
+ box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1);
+}
+
+.pricing hr {
+ margin: 1.5rem 0;
+}
+
+.pricing .card-title {
+ margin: 0.5rem 0;
+ font-size: 0.9rem;
+ letter-spacing: .1rem;
+ font-weight: bold;
+}
+
+.pricing .card-price {
+ font-size: 3rem;
+ margin: 0;
+ color: #0d5b5e;
+}
+
+.pricing .card-price .period {
+ font-size: 0.8rem;
+}
+
+.pricing ul li {
+ margin-bottom: 1rem;
+}
+
+.pricing .text-muted {
+ opacity: 0.7;
+}
+
+.pricing .btn {
+ font-size: 80%;
+ border-radius: 5rem;
+ letter-spacing: .1rem;
+ font-weight: bold;
+ padding: 1rem;
+ opacity: 0.7;
+ transition: all 0.2s;
+}
+
+/* Hover Effects on Card */
+
+
+.bg-cover-2 {
+ background: url(../images/mos-bg5.png) no-repeat center bottom;
+ background-size: cover !important;
+ min-height: 50vh;
+}
+
+.modal-dialog {
+ overflow-y: initial !important
+}
+
+.modal-body {
+ max-height: calc(100vh - 250px);
+ overflow-y: auto;
+}
+
+/* Rounded tabs */
+
+/* GALLERY START */
+.gallery-block.grid-gallery {
+ padding-bottom: 60px;
+ padding-top: 60px;
+}
+
+.gallery-block.grid-gallery .heading {
+ margin-bottom: 50px;
+ text-align: center;
+}
+
+.gallery-block.grid-gallery .heading h2 {
+ font-weight: bold;
+ font-size: 1.4rem;
+ text-transform: uppercase;
+}
+
+.gallery-block.grid-gallery a:hover {
+ opacity: 0.8;
+}
+
+.gallery-block.grid-gallery .item img {
+ box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.15);
+ transition: 0.4s;
+}
+
+.gallery-block.grid-gallery .item {
+ margin-bottom: 20px;
+}
+
+/* GALLERY END */
+.circle-button {
+ box-shadow: 2px 4px 0 2px rgba(0, 0, 0, 0.1);
+ border: .5em solid #0d404d;
+ font-size: 1em;
+ line-height: 1.1em;
+ color: #ffffff;
+ background-color: #0d404d;
+ margin: auto;
+ border-radius: 50%;
+ height: 10em;
+ width: 10em;
+ position: relative;
+}
+
+.circle-button:hover {
+ color: #ffffff;
+ background-color: #145363;
+ text-decoration: none;
+ border-color: #24758a;
+}
+
+.holderCircle {
+ width: 600px;
+ height: 600px;
+ border-radius: 100%;
+ margin: auto;
+ position: relative;
+}
+
+.dotCircle {
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ margin: auto;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ border-radius: 100%;
+ z-index: 20;
+}
+
+.dotCircle .itemDot {
+ display: block;
+ width: 80px;
+ height: 80px;
+ position: absolute;
+ background: #ffffff;
+ color: #7d4ac7;
+ border-radius: 20px;
+ text-align: center;
+ line-height: 80px;
+ font-size: 30px;
+ z-index: 3;
+ cursor: pointer;
+ border: 2px solid #e6e6e6;
+}
+
+.dotCircle .itemDot .forActive {
+ width: 56px;
+ height: 56px;
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ display: none;
+}
+
+.dotCircle .itemDot .forActive::after {
+ content: '';
+ width: 5px;
+ height: 5px;
+ border: 3px solid #7d4ac7;
+ bottom: -31px;
+ left: -14px;
+ filter: blur(1px);
+ position: absolute;
+ border-radius: 100%;
+}
+
+.dotCircle .itemDot .forActive::before {
+ content: '';
+ width: 6px;
+ height: 6px;
+ filter: blur(5px);
+ top: -15px;
+ position: absolute;
+ transform: rotate(-45deg);
+ border: 6px solid #a733bb;
+ right: -39px;
+}
+
+.dotCircle .itemDot.active .forActive {
+ display: block;
+}
+
+.round {
+ position: absolute;
+ left: 40px;
+ top: 45px;
+ width: 510px;
+ height: 510px;
+ border: 2px dotted #a733bb;
+ border-radius: 100%;
+ -webkit-animation: rotation 100s infinite linear;
+}
+
+.dotCircle .itemDot:hover,
+.dotCircle .itemDot.active {
+ color: #ffffff;
+ transition: 0.5s;
+ /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7d4ac7+0,a733bb+100 */
+ background: #7d4ac7;
+ /* Old browsers */
+ background: -moz-linear-gradient(left, #7d4ac7 0%, #a733bb 100%);
+ /* FF3.6-15 */
+ background: -webkit-linear-gradient(left, #7d4ac7 0%, #a733bb 100%);
+ /* Chrome10-25,Safari5.1-6 */
+ background: linear-gradient(to right, #7d4ac7 0%, #a733bb 100%);
+ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d4ac7', endColorstr='#a733bb', GradientType=1);
+ /* IE6-9 */
+ border: 2px solid #ffffff;
+ -webkit-box-shadow: 0 30px 30px 0 rgba(0, 0, 0, .13);
+ -moz-box-shadow: 0 30px 30px 0 rgba(0, 0, 0, .13);
+ box-shadow: 0 30px 30px 0 rgba(0, 0, 0, .13);
+}
+
+.dotCircle .itemDot {
+ font-size: 40px;
+}
+
+.contentCircle {
+ width: 300px;
+ border-radius: 100%;
+ color: #222222;
+ position: relative;
+ top: 150px;
+ left: 50%;
+ transform: translate(-50%, -50%);
+}
+
+.contentCircle .CirItem {
+ border-radius: 100%;
+ color: #222222;
+ position: absolute;
+ text-align: center;
+ bottom: 0;
+ left: 0;
+ opacity: 0;
+ transform: scale(0);
+ transition: 0.5s;
+ font-size: 15px;
+ width: 100%;
+ height: 100%;
+ top: 0;
+ right: 0;
+ margin: auto;
+ line-height: 250px;
+}
+
+.CirItem.active {
+ z-index: 1;
+ opacity: 1;
+ transform: scale(1);
+ transition: 0.5s;
+}
+
+.contentCircle .CirItem i {
+ font-size: 180px;
+ position: absolute;
+ top: 0;
+ left: 50%;
+ margin-left: -90px;
+ color: #000000;
+ opacity: 0.1;
+}
+
+.title-box .title {
+ font-weight: 600;
+ letter-spacing: 2px;
+ position: relative;
+ z-index: -1;
+}
+
+.title-box span {
+ text-shadow: 0 10px 10px rgba(0, 0, 0, .15);
+ font-weight: 800;
+ color: #640178;
+}
+
+.title-box p {
+ font-size: 17px;
+ line-height: 2em;
+}
+
+.blog-home2 {
+ font-family: "Montserrat", sans-serif;
+ color: #8d97ad;
+ font-weight: 300;
+}
+
+.blog-home2 h1,
+.blog-home2 h2,
+.blog-home2 h3,
+.blog-home2 h4,
+.blog-home2 h5,
+.blog-home2 h6 {
+ color: #3e4555;
+}
+
+.blog-home2 .font-weight-medium {
+ font-weight: 500;
+}
+
+.blog-home2 .bg-light {
+ background-color: #f4f8fa !important;
+}
+
+.blog-home2 .subtitle {
+ color: #8d97ad;
+ line-height: 24px;
+}
+
+.blog-home2 .text-themecolor {
+ color: #316ce8;
+}
+
+.blog-home2 h5 {
+ line-height: 22px;
+ font-size: 18px;
+}
+
+.blog-home2 a.link {
+ color: #3e4555;
+}
+
+.blog-home2 a.link:hover {
+ color: #316ce8;
+}
+
+.blog-home2 .on-hover {
+ -webkit-transition: 0.2s ease-in;
+ -o-transition: 0.2s ease-in;
+ transition: 0.2s ease-in;
+}
+
+.blog-home2 .on-hover:hover {
+ -webkit-transform: translateY(-10px);
+ -ms-transform: translateY(-10px);
+ transform: translateY(-10px);
+}
+
+.blog-home2 .date-pos {
+ right: 10px;
+ top: 10px;
+}
+
+.blog-home2 .date-pos span {
+ font-size: 30px;
+ line-height: 30px;
+}
+
+.blog-home2 .bg-info-gradiant {
+ background: #0D5E10;
+ background: -webkit-linear-gradient(legacy-direction(to right), #0D5E10 0%, rgb(16, 177, 21) 100%);
+ background: -webkit-gradient(linear, left top, right top, from(#0D5E10), to(rgb(16, 177, 21)));
+ background: -webkit-linear-gradient(left, #0D5E10 0%, rgb(16, 177, 21) 100%);
+ background: -o-linear-gradient(left, #0D5E10 0%, rgb(16, 177, 21) 100%);
+ background: linear-gradient(to right, #0D5E10 0%, rgb(16, 177, 21) 100%);
+}
+
+/************************* Welcome Section Start ****************************/
+.cp-welcome {
+ background: #f9f0e7;
+ padding: 80px 0;
+ width: 100%;
+ float: left;
+}
+
+.cp-welcome .container {
+ background: #fff;
+}
+
+.cp-welcome img {
+ padding: 20px;
+}
+
+.cp-welcome h2 {
+ font-size: 36px;
+}
+
+.cp-welcome-content {
+ padding: 45px 45px 0;
+}
+
+body .cp-welcome-content p {
+ margin: 20px 0;
+}
+
+.cp-welcome .btn {
+ margin-bottom: 15px;
+}
+
+/************************* Welcome Section End ****************************/
+/************************* Pillars Of Islam Section Start ****************************/
+.section-title {
+ text-align: center;
+ width: 100%;
+ float: left;
+ margin-bottom: 30px;
+}
+
+.section-title strong {
+ text-align: center;
+ font-size: 16px;
+ font-weight: 400;
+ color: #222;
+}
+
+.section-title h2,
+.cp-welcome h2,
+.blog-home2 h2 {
+ font-family: 'Cinzel Decorative', cursive;
+ font-size: 48px;
+ font-weight: 700;
+ margin: 5px 0 0 0;
+ line-height: 50px;
+ color: #222;
+}
+
+.salah-times,
+.pillars-islam {
+ color: #fff;
+}
+
+.salah-times .section-title strong,
+.salah-times .section-title h2,
+.pillars-islam .section-title strong,
+.pillars-islam .section-title h2 {
+ color: #fff;
+}
+
+.salah-times {
+ background: url(../images/salat-times-bg-large.jpg) no-repeat top center fixed;
+ background-size: cover;
+ padding: 80px 0;
+ width: 100%;
+ float: left;
+ position: relative;
+}
+
+.pillars-islam {
+ background: url(../images/mos-bg5.png) no-repeat top center fixed;
+ background-size: cover;
+ padding: 80px 0;
+ width: 100%;
+ float: left;
+ position: relative;
+}
+
+.salah-times:after,
+.pillars-islam:after {
+ content: "";
+ background: rgba(15, 15, 15, 0.8);
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ left: 0;
+ top: 0;
+}
+
+.salah-times .container,
+.pillars-islam .container {
+ position: relative;
+ z-index: 99;
+}
+
+.salah-times .features-box {
+ background: url(../images/pillar-bg.png) no-repeat top;
+ width: 177px;
+ height: 232px;
+ margin: 10px auto;
+ background-size: 177px 250px;
+}
+
+.salah-times .features-box p,
+.salah-times .features-box h2 {
+ text-align: center;
+ vertical-align: middle;
+}
+
+.salah-times .features-box p {
+ font-size: 20px;
+}
+
+.pillars-islam .features-box span {
+ background: url(../images/poi-bg.png) no-repeat;
+ width: 177px;
+ height: 177px;
+ display: block;
+ text-align: center;
+ line-height: 177px;
+ margin: 0 auto
+}
+
+.salah-times .text-box,
+.pillars-islam .text-box {
+ text-align: center;
+}
+
+.salah-times .text-box h2 {
+ font-family: 'Cinzel Decorative', cursive;
+ font-size: 15px;
+ font-weight: bold;
+}
+
+.pillars-islam .text-box h2 {
+ font-family: 'Cinzel Decorative', cursive;
+ font-size: 25px;
+}
+
+.pillars-islam .sub {
+ text-align: center;
+ font-size: 14px;
+ font-style: italic;
+ font-weight: 400;
+ color: #d2973b;
+}
+
+.pillars-islam .features-box i {
+ vertical-align: middle;
+ border-style: none;
+ color: #0d5b5e;
+}
+
+/************************* Pillars Of Islam Section End ****************************/
+.sticky-footer {
+ position: fixed;
+ width: 100%;
+ bottom: -20px;
+ text-align: center;
+ color: #000;
+ transition: all 0.250s;
+ z-index: 999;
+}
+
+.sticky-footer p {
+ margin: 0;
+}
+
+.sticky-footer.alert-dismissible .close {
+ top: 50%;
+ transform: translateY(-55%);
+}
+
+.video-container {
+ position: relative;
+ padding-bottom: 56.25%;
+}
+
+.video-container iframe {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
+
+blockquote.quote-card {
+ margin: 0 0 0;
+}
+
+.quote-card a:link {
+ color: #FFF;
+ text-decoration: none;
+ font-weight: normal;
+}
+
+.quote-card a:visited {
+ color: #FFF;
+ text-decoration: none;
+ font-weight: normal;
+}
+
+.quote-card a:hover {
+ color: #FFF;
+ text-decoration: none;
+ font-weight: normal;
+}
+
+.quote-card a:active {
+ color: #FFF;
+ text-decoration: none;
+ font-weight: normal;
+}
+
+.quote-card {
+ background: #fff;
+ color: #222222;
+ padding: 20px;
+ padding-left: 50px;
+ box-sizing: border-box;
+ box-shadow: 0 2px 4px rgba(34, 34, 34, 0.12);
+ position: relative;
+ overflow: hidden;
+ min-height: 120px;
+}
+
+.quote-card p {
+ font-size: 22px;
+ line-height: 1.5;
+ margin: 0;
+ max-width: 80%;
+}
+
+.quote-card cite {
+ font-size: 16px;
+ margin-top: 10px;
+ display: block;
+ font-weight: 200;
+ opacity: 0.8;
+}
+
+.quote-card:before {
+ font-family: Georgia, serif;
+ content: "“";
+ position: absolute;
+ top: 10px;
+ left: 10px;
+ font-size: 5em;
+ color: rgba(238, 238, 238, 0.8);
+ font-weight: normal;
+}
+
+.quote-card:after {
+ font-family: Georgia, serif;
+ content: "”";
+ position: absolute;
+ bottom: -110px;
+ line-height: 100px;
+ right: -32px;
+ font-size: 25em;
+ color: rgba(238, 238, 238, 0.8);
+ font-weight: normal;
+}
+
+@media (max-width: 640px) {
+ .quote-card:after {
+ font-size: 22em;
+ right: -25px;
+ }
+}
+
+.quote-card.blue-card {
+ background: #0078FF;
+ color: #ffffff;
+ box-shadow: 0 1px 2px rgba(34, 34, 34, 0.12), 0 2px 4px rgba(34, 34, 34, 0.24);
+}
+
+.quote-card.blue-card:before,
+.quote-card.blue-card:after {
+ color: #5FAAFF;
+}
+
+.quote-card.green-card {
+ background: #0D5E10;
+ color: #ffffff;
+ box-shadow: 0 1px 2px rgba(34, 34, 34, 0.12), 0 2px 4px rgba(34, 34, 34, 0.24);
+}
+
+.quote-card.green-card:before,
+.quote-card.green-card:after {
+ color: #59E063;
+}
+
+.quote-card.red-card {
+ background: #F61E32;
+ color: #ffffff;
+ box-shadow: 0 1px 2px rgba(34, 34, 34, 0.12), 0 2px 4px rgba(34, 34, 34, 0.24);
+}
+
+.quote-card.red-card:before,
+.quote-card.red-card:after {
+ color: #F65665;
+}
+
+.quote-card.yellow-card {
+ background: #F9A825;
+ color: #222222;
+ box-shadow: 0 1px 2px rgba(34, 34, 34, 0.12), 0 2px 4px rgba(34, 34, 34, 0.24);
+}
+
+.quote-card.yellow-card:before,
+.quote-card.yellow-card:after {
+ color: #FBC02D;
+}
+
+/* ################################################ */
+/* RESPONSIVE START */
+
+/* col-sm-* - 576px */
+@media only screen and (min-width:300px) and (max-width:599px) {
+ .parallax-section .right-box {
+ width: 100%;
+ }
+
+ .parallax-section .right-box img {
+ width: 100%;
+ }
+
+ .gallery-block.grid-gallery .scale-on-hover:hover {
+ transform: scale(1.05);
+ box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.15) !important;
+ }
+
+ .holderCircle {
+ width: 300px;
+ height: 300px;
+ margin: 110px auto;
+ }
+
+ .holderCircle::after {
+ width: 100%;
+ height: 100%;
+ }
+
+ .dotCircle {
+ width: 100%;
+ height: 100%;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ margin: auto;
+ }
+
+ .with-arrow .nav-link.active::after {
+ content: '';
+ border-left: 20px solid transparent;
+ border-right: 20px solid transparent;
+ border-top: 20px solid #d94e2b;
+ position: absolute;
+ left: 20px;
+ top: -50%;
+ transform: rotate(-90deg);
+ display: block;
+ }
+}
+
+/* col-md-* - 768px */
+@media only screen and (min-width:600px) and (max-width:767px) {
+ .parallax-section .right-box {
+ width: 100%;
+ }
+
+ .parallax-section .right-box img {
+ width: 100%;
+ }
+
+}
+
+/* col-lg-* - 992px */
+@media only screen and (min-width:768px) and (max-width:991px) {
+ .parallax-section .right-box {
+ width: 100%;
+ }
+}
+
+/* col-lg-* - 992px */
+@media only screen and (min-width:992px) and (max-width:1199px) {
+ .pricing .card:hover {
+ margin-top: -.25rem;
+ margin-bottom: .25rem;
+ box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.3);
+ }
+
+ .pricing .card:hover .btn {
+ opacity: 1;
+ }
+}
+
+/* col-xl-* - 1200px */
+@media only screen and (min-width:1200px) and (max-width:1499px) {}
+
+/* RESPONSIVE END */
+
+
+/* MISC RESPONSIVENESS */
+@media (min-width: 576px) {
+ .rounded-nav {
+ border-radius: 50rem !important;
+ }
+
+ .rounded-nav .nav-link {
+ border-radius: 50rem !important;
+ }
+}
+
+@media (min-width: 1024px) {
+ .contact4 .contact-box {
+ padding: 80px 105px 80px 0px;
+ }
+}
+
+@media (max-width: 767px) {
+ .contact4 .contact-box {
+ padding-left: 15px;
+ padding-right: 15px;
+ }
+}
+
+@media (max-width: 1023px) {
+ .contact4 .right-image {
+ position: relative;
+ bottom: -95px;
+ }
+}
\ No newline at end of file
diff --git a/more.html b/more.html
new file mode 100644
index 00000000..5295a450
--- /dev/null
+++ b/more.html
@@ -0,0 +1,52 @@
+
+
+
+
+
+
+
+
+