Compare commits
4 Commits
d0a0fcceb4
...
tuhama
| Author | SHA1 | Date | |
|---|---|---|---|
| d88eab95d2 | |||
| 2985df3d43 | |||
| e6f4178346 | |||
| c6762deb08 |
@@ -2,7 +2,7 @@
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-12">
|
||||
<img src="images/DreamShaper_v7_A_group_of_people_from_different_backgrounds_an_2.jpg" class="about-image img-fluid" alt="" />
|
||||
<img src="images/DreamShaper_v7_A_group_of_people_from_different_backgrounds_an_2.jpg" class="about-image img-fluid object-fit-cover" alt="" />
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6 col-12 mt-5 mt-lg-0">
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
</div>
|
||||
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-10 col-md-12 col-12">
|
||||
<div class="col-lg-12 col-md-12 col-12">
|
||||
<div class="contact-wrapper">
|
||||
<div class="row">
|
||||
<!-- Contact Info Cards -->
|
||||
@@ -57,7 +57,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Company Ad -->
|
||||
<div class="tech-masters-ad">
|
||||
<!-- <div class="tech-masters-ad">
|
||||
<div class="ad-content">
|
||||
<div class="ad-icon">
|
||||
<i class="bi bi-cpu"></i>
|
||||
@@ -66,14 +66,14 @@
|
||||
<p>Your Trusted Partner in Digital Innovation</p>
|
||||
<a href="#" class="ad-link">Learn More <i class="bi bi-arrow-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="contact-social">
|
||||
<h4>Follow Me</h4>
|
||||
<div class="social-icon">
|
||||
<ul class="list-inline">
|
||||
<li class="list-inline-item">
|
||||
<a href="#" class="social-icon-link">
|
||||
<a href="https://www.linkedin.com/in/mohammed-al-yaseen-79b056161/" class="social-icon-link" target="_blank">
|
||||
<i class="bi bi-linkedin"></i>
|
||||
</a>
|
||||
</li>
|
||||
@@ -82,11 +82,6 @@
|
||||
<i class="bi bi-github"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<a href="#" class="social-icon-link">
|
||||
<i class="bi bi-twitter"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -58,7 +58,7 @@
|
||||
<div class="col-lg-6 col-12 mt-5 mt-lg-0">
|
||||
<div class="about-thumb">
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-6 featured-border-bottom py-3">
|
||||
<div class="col-lg-6 col-6 featured-border-bottom pb-4">
|
||||
<div class="featured-item">
|
||||
<strong class="featured-numbers">15+</strong>
|
||||
<p class="featured-text">Years of Experience</p>
|
||||
@@ -68,7 +68,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6 col-6 featured-border-start featured-border-bottom ps-5 py-3">
|
||||
<div class="col-lg-6 col-6 featured-border-start featured-border-bottom pb-4">
|
||||
<div class="featured-item">
|
||||
<strong class="featured-numbers">5+</strong>
|
||||
<p class="featured-text">Happy Customers</p>
|
||||
@@ -88,7 +88,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6 col-6 featured-border-start ps-5 pt-4">
|
||||
<div class="col-lg-6 col-6 featured-border-start pt-4">
|
||||
<div class="featured-item">
|
||||
<strong class="featured-numbers">7+</strong>
|
||||
<p class="featured-text">Digital Awards</p>
|
||||
|
||||
@@ -1,14 +1,94 @@
|
||||
<footer class="site-footer">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-12">
|
||||
<div class="copyright-text-wrap">
|
||||
<p class="mb-0">
|
||||
<span class="copyright-text">Copyright © 2026 <a href="#">Tuhama Qlyshi</a>. All rights reserved.</span>
|
||||
<span class="copyright-text">Design: <a href="https://templatemo.com" target="_blank">TemplateMo</a></span>
|
||||
<!-- Footer Brand & Description -->
|
||||
<div class="col-lg-4 col-md-6 col-12 mb-4 mb-lg-0">
|
||||
<div class="footer-brand">
|
||||
<h3 class="footer-brand-name">Tuhama Qlyshi</h3>
|
||||
<p class="footer-description">
|
||||
Senior Frontend Developer passionate about building exceptional user experiences
|
||||
and scalable web applications.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Quick Links -->
|
||||
<div class="col-lg-2 col-md-6 col-12 mb-4 mb-lg-0">
|
||||
<h4 class="footer-heading">Quick Links</h4>
|
||||
<ul class="footer-menu">
|
||||
<li class="footer-menu-item">
|
||||
<a href="#section_1" class="footer-menu-link click-scroll">Home</a>
|
||||
</li>
|
||||
<li class="footer-menu-item">
|
||||
<a href="#section_2" class="footer-menu-link click-scroll">About</a>
|
||||
</li>
|
||||
<li class="footer-menu-item">
|
||||
<a href="#section_3" class="footer-menu-link click-scroll">Services</a>
|
||||
</li>
|
||||
<li class="footer-menu-item">
|
||||
<a href="#section_4" class="footer-menu-link click-scroll">Projects</a>
|
||||
</li>
|
||||
<li class="footer-menu-item">
|
||||
<a href="#section_5" class="footer-menu-link click-scroll">Contact</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Contact Info -->
|
||||
<div class="col-lg-3 col-md-6 col-12 mb-4 mb-lg-0">
|
||||
<h4 class="footer-heading">Get In Touch</h4>
|
||||
<ul class="footer-contact">
|
||||
<li class="footer-contact-item">
|
||||
<i class="bi bi-envelope-fill"></i>
|
||||
<a href="mailto:tuhama.gh.qlyshi@gmail.com">tuhama.gh.qlyshi@gmail.com</a>
|
||||
</li>
|
||||
<li class="footer-contact-item">
|
||||
<i class="bi bi-telephone-fill"></i>
|
||||
<a href="tel:+963-966-381-266">+963-966-381-266</a>
|
||||
</li>
|
||||
<li class="footer-contact-item">
|
||||
<i class="bi bi-geo-alt-fill"></i>
|
||||
<span>Damascus, Syria</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Social Media -->
|
||||
<div class="col-lg-3 col-md-6 col-12">
|
||||
<h4 class="footer-heading">Follow Me</h4>
|
||||
<div class="footer-social">
|
||||
<ul class="social-icon">
|
||||
<li class="social-icon-item">
|
||||
<a href="https://www.linkedin.com/in/tuhama-qlyshi-6016b1161/"
|
||||
class="social-icon-link"
|
||||
target="_blank"
|
||||
aria-label="LinkedIn">
|
||||
<i class="bi bi-linkedin"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="social-icon-item">
|
||||
<a href="https://github.com/tuhama-qlyshi"
|
||||
class="social-icon-link"
|
||||
target="_blank"
|
||||
aria-label="GitHub">
|
||||
<i class="bi bi-github"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="social-icon-item">
|
||||
<a href="https://www.facebook.com/tuhama.qlyshi"
|
||||
class="social-icon-link"
|
||||
target="_blank"
|
||||
aria-label="Facebook">
|
||||
<i class="bi bi-facebook"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Copyright -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
@@ -20,7 +20,7 @@
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<a href="index.html" class="navbar-brand mx-auto mx-lg-0">First</a>
|
||||
<a href="index.html" class="navbar-brand mx-auto mx-lg-0">M</a>
|
||||
|
||||
<div class="d-flex align-items-center d-lg-none">
|
||||
<i class="navbar-icon bi-telephone-plus me-3"></i>
|
||||
|
||||
@@ -1,11 +1,13 @@
|
||||
<section class="hero d-flex justify-content-center align-items-center" id="section_1">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-7 col-12">
|
||||
<div class="col-lg-12 col-12">
|
||||
<div class="hero-text">
|
||||
<div class="hero-title-wrap d-flex align-items-center mb-4">
|
||||
<img src="images/happy-bearded-young-man.jpg" class="avatar-image avatar-image-large img-fluid" alt="" />
|
||||
<h5 class="hero-title ms-3 mb-0">Hello friend!</h5>
|
||||
<div class="hero-image-wrapper position-relative me-4">
|
||||
<img src="images/happy-bearded-young-man.jpg" class="hero-image img-fluid object-fit-cover" alt="" />
|
||||
</div>
|
||||
<h5 class="hero-title mb-0">Hello friend!</h5>
|
||||
</div>
|
||||
|
||||
<h2 class="mb-4">Senior Frontend Developer with 15+ years of experience</h2>
|
||||
@@ -14,14 +16,10 @@
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 col-12 position-relative">
|
||||
<img src="images/National Geographic on Instagram Photo by Stephe.jpg" class="hero-image img-fluid" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320">
|
||||
<path fill="#535da1" fill-opacity="1" d="M0,160L24,160C48,160,96,160,144,138.7C192,117,240,75,288,64C336,53,384,75,432,106.7C480,139,528,181,576,208C624,235,672,245,720,240C768,235,816,213,864,186.7C912,160,960,128,1008,133.3C1056,139,1104,181,1152,202.7C1200,224,1248,224,1296,197.3C1344,171,1392,117,1416,90.7L1440,64L1440,0L1416,0C1392,0,1344,0,1296,0C1248,0,1200,0,1152,0C1104,0,1056,0,1008,0C960,0,912,0,864,0C816,0,768,0,720,0C672,0,624,0,576,0C528,0,480,0,432,0C384,0,336,0,288,0C240,0,192,0,144,0C96,0,48,0,24,0L0,0Z"></path>
|
||||
<path fill="#6c757d" fill-opacity="1" d="M0,160L24,160C48,160,96,160,144,138.7C192,117,240,75,288,64C336,53,384,75,432,106.7C480,139,528,181,576,208C624,235,672,245,720,240C768,235,816,213,864,186.7C912,160,960,128,1008,133.3C1056,139,1104,181,1152,202.7C1200,224,1248,224,1296,197.3C1344,171,1392,117,1416,90.7L1440,64L1440,0L1416,0C1392,0,1344,0,1296,0C1248,0,1200,0,1152,0C1104,0,1056,0,1008,0C960,0,912,0,864,0C816,0,768,0,720,0C672,0,624,0,576,0C528,0,480,0,432,0C384,0,336,0,288,0C240,0,192,0,144,0C96,0,48,0,24,0L0,0Z"></path>
|
||||
</svg>
|
||||
</section>
|
||||
@@ -11,13 +11,13 @@ https://templatemo.com/tm-578-first-portfolio
|
||||
-----------------------------------------*/
|
||||
:root {
|
||||
--white-color: #ffffff;
|
||||
--primary-color: #ff69b4; /* Hot pink */
|
||||
--secondary-color: #ffb6c1; /* Light pink */
|
||||
--section-bg-color: #fff5f7; /* Very light pink */
|
||||
--dark-color: #4a4a4a; /* Softer dark color */
|
||||
--p-color: #666666;
|
||||
--border-color: #ffd1dc; /* Light pink border */
|
||||
--featured-border-color: #ff69b4;
|
||||
--primary-color: #6c757d;
|
||||
--secondary-color: #14b789;
|
||||
--section-bg-color: #f9f9f9;
|
||||
--dark-color: #000000;
|
||||
--p-color: #717275;
|
||||
--border-color: #e9eaeb;
|
||||
--featured-border-color: #727aab;
|
||||
|
||||
--body-font-family: "DM Sans", sans-serif;
|
||||
|
||||
@@ -316,7 +316,7 @@ strong {
|
||||
}
|
||||
|
||||
.navbar.scrolled {
|
||||
background: rgba(83, 93, 161, 0.95);
|
||||
background: var(--primary-color);
|
||||
backdrop-filter: blur(10px);
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
padding: 10px 0;
|
||||
@@ -517,12 +517,34 @@ strong {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.hero-image-wrapper {
|
||||
position: relative;
|
||||
width: 340px;
|
||||
height: 340px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.hero-image-wrapper .hero-image {
|
||||
position: relative !important;
|
||||
top: auto !important;
|
||||
right: auto !important;
|
||||
left: auto !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
object-fit: cover;
|
||||
border-radius: 50%;
|
||||
border: 3px solid var(--white-color);
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||
z-index: auto !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.hero-image {
|
||||
position: absolute;
|
||||
z-index: 22;
|
||||
top: -44px;
|
||||
width: 340px;
|
||||
height: 340px;
|
||||
height: 340px !important;
|
||||
right: 67px;
|
||||
border-radius: 100%;
|
||||
border: 5px solid #FFF;
|
||||
@@ -552,6 +574,12 @@ strong {
|
||||
/*---------------------------------------
|
||||
ABOUT
|
||||
-----------------------------------------*/
|
||||
|
||||
.object-fit-cover {
|
||||
object-fit: cover;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.profile-thumb {
|
||||
background: var(--white-color);
|
||||
border-radius: 15px;
|
||||
@@ -560,11 +588,6 @@ strong {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.profile-thumb:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.profile-title {
|
||||
margin-bottom: 25px;
|
||||
padding-bottom: 15px;
|
||||
@@ -700,11 +723,11 @@ strong {
|
||||
box-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.about-image:hover {
|
||||
/* .about-image:hover {
|
||||
transform: scale(1.05);
|
||||
filter: brightness(1.3) contrast(1.2) saturate(1.2);
|
||||
box-shadow: 0 0 30px rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
} */
|
||||
|
||||
.about-thumb {
|
||||
padding-right: 20px;
|
||||
@@ -748,10 +771,6 @@ strong {
|
||||
transition: all ease 0.2s;
|
||||
}
|
||||
|
||||
.clients-image:hover {
|
||||
transform: scale(1.3);
|
||||
}
|
||||
|
||||
/*---------------------------------------
|
||||
SERVICES
|
||||
-----------------------------------------*/
|
||||
@@ -1050,10 +1069,10 @@ strong {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.contact-info-card:hover {
|
||||
/* .contact-info-card:hover {
|
||||
transform: translateX(10px);
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
} */
|
||||
|
||||
.contact-info-icon {
|
||||
width: 50px;
|
||||
@@ -1077,6 +1096,7 @@ strong {
|
||||
|
||||
.contact-info-content {
|
||||
flex-grow: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.contact-info-content h4 {
|
||||
@@ -1278,10 +1298,26 @@ strong {
|
||||
SITE FOOTER
|
||||
-----------------------------------------*/
|
||||
.site-footer {
|
||||
background: linear-gradient(135deg, rgba(83, 93, 161, 0.05) 0%, rgba(20, 183, 137, 0.05) 100%);
|
||||
border-top: 1px solid var(--border-color);
|
||||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
text-align: center;
|
||||
padding-top: 60px;
|
||||
padding-bottom: 30px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.site-footer::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: linear-gradient(90deg,
|
||||
transparent 0%,
|
||||
rgba(20, 183, 137, 0.3) 50%,
|
||||
transparent 100%
|
||||
);
|
||||
}
|
||||
|
||||
.site-footer-title {
|
||||
@@ -1290,52 +1326,324 @@ strong {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.copyright-text-wrap p,
|
||||
.copyright-text {
|
||||
font-size: var(--copyright-font-size);
|
||||
/* Footer Brand */
|
||||
.footer-brand {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.copyright-text {
|
||||
border-right: 1px solid var(--border-color);
|
||||
padding-right: 25px;
|
||||
margin-right: 20px;
|
||||
.footer-brand-name {
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
color: var(--dark-color);
|
||||
margin-bottom: 12px;
|
||||
background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
|
||||
.copyright-text-wrap a {
|
||||
font-weight: var(--font-weight-bold);
|
||||
.footer-description {
|
||||
font-size: 14px;
|
||||
line-height: 1.7;
|
||||
color: var(--p-color);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Footer Headings */
|
||||
.footer-heading {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: var(--dark-color);
|
||||
margin-bottom: 20px;
|
||||
position: relative;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.footer-heading::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 40px;
|
||||
height: 3px;
|
||||
background: linear-gradient(90deg, var(--secondary-color), var(--primary-color));
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
/* Footer Menu */
|
||||
.footer-menu {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.footer-menu-item {
|
||||
list-style: none;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.footer-menu-link {
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--border-radius-medium);
|
||||
font-size: var(--copyright-font-size);
|
||||
font-weight: var(--font-weight-medium);
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: var(--p-color);
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
padding: 6px 14px;
|
||||
min-width: 70px;
|
||||
transition: transform 0.3s ease, color 0.3s ease;
|
||||
transition: all 0.3s ease;
|
||||
position: relative;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.footer-menu-link::before {
|
||||
content: '→';
|
||||
position: absolute;
|
||||
left: -20px;
|
||||
opacity: 0;
|
||||
transition: all 0.3s ease;
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
.footer-menu-link:hover {
|
||||
background: var(--secondary-color);
|
||||
color: var(--secondary-color);
|
||||
padding-left: 20px;
|
||||
transform: translateX(5px);
|
||||
}
|
||||
|
||||
.footer-menu-link:hover::before {
|
||||
opacity: 1;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/* Footer Contact */
|
||||
.footer-contact {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.footer-contact-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 15px;
|
||||
font-size: 14px;
|
||||
color: var(--p-color);
|
||||
}
|
||||
|
||||
.footer-contact-item i {
|
||||
color: var(--secondary-color);
|
||||
font-size: 18px;
|
||||
margin-right: 12px;
|
||||
margin-top: 2px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.footer-contact-item a {
|
||||
color: var(--p-color);
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.footer-contact-item a:hover {
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
.footer-contact-item span {
|
||||
color: var(--p-color);
|
||||
}
|
||||
|
||||
/* Footer Social */
|
||||
.footer-social {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.footer-social .social-icon {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.footer-social .social-icon-item {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.footer-social .social-icon-link {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
line-height: 45px;
|
||||
text-align: center;
|
||||
border: 2px solid var(--border-color);
|
||||
border-radius: 50%;
|
||||
color: var(--p-color);
|
||||
background: var(--white-color);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
text-decoration: none;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.footer-social .social-icon-link:hover {
|
||||
background: linear-gradient(135deg, var(--secondary-color), var(--primary-color));
|
||||
border-color: transparent;
|
||||
color: var(--white-color);
|
||||
transform: translateY(-3px);
|
||||
transform: translateY(-5px) scale(1.1);
|
||||
box-shadow: 0 8px 20px rgba(20, 183, 137, 0.3);
|
||||
}
|
||||
|
||||
/* Copyright */
|
||||
.copyright-text-wrap {
|
||||
margin-top: 40px;
|
||||
padding-top: 30px;
|
||||
border-top: 1px solid var(--border-color);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.copyright-text-wrap p,
|
||||
.copyright-text {
|
||||
font-size: 14px;
|
||||
color: var(--p-color);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.copyright-text {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.copyright-text-wrap a {
|
||||
font-weight: 600;
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
.copyright-text-wrap a:hover {
|
||||
color: var(--secondary-color);
|
||||
}
|
||||
|
||||
/* Footer Responsive Styles */
|
||||
@media (max-width: 991px) {
|
||||
.site-footer {
|
||||
padding-top: 50px;
|
||||
padding-bottom: 25px;
|
||||
}
|
||||
|
||||
.footer-brand {
|
||||
text-align: center;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.footer-heading {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-heading::after {
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.footer-menu {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-menu-item {
|
||||
display: inline-block;
|
||||
margin: 0 8px 10px 8px;
|
||||
}
|
||||
|
||||
.footer-menu-link {
|
||||
padding: 8px 16px;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 20px;
|
||||
background: var(--white-color);
|
||||
}
|
||||
|
||||
.footer-menu-link::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.footer-menu-link:hover {
|
||||
padding-left: 16px;
|
||||
transform: none;
|
||||
background: var(--secondary-color);
|
||||
color: var(--white-color);
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.footer-contact {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-contact-item {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.footer-social {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-social .social-icon {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.site-footer {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.footer-brand-name {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.footer-description {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.footer-heading {
|
||||
font-size: 16px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.footer-menu-item {
|
||||
display: block;
|
||||
margin: 0 0 8px 0;
|
||||
}
|
||||
|
||||
.footer-menu-link {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.footer-contact-item {
|
||||
font-size: 13px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.footer-contact-item i {
|
||||
font-size: 16px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.footer-social .social-icon-link {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.copyright-text-wrap {
|
||||
margin-top: 30px;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.copyright-text {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/*---------------------------------------
|
||||
@@ -1747,9 +2055,9 @@ strong {
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.about-image:hover {
|
||||
/* .about-image:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
} */
|
||||
|
||||
/* Enhance projects section */
|
||||
.projects-thumb {
|
||||
@@ -1805,7 +2113,7 @@ html {
|
||||
}
|
||||
|
||||
.navbar.scrolled {
|
||||
background-color: rgba(83, 93, 161, 0.95);
|
||||
background-color: var(--primary-color);
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
|
||||
16
index.html
16
index.html
@@ -32,7 +32,7 @@
|
||||
|
||||
<!-- About Section -->
|
||||
<section id="about"></section>
|
||||
<aside class="about-ad">
|
||||
<!-- <aside class="about-ad">
|
||||
<div class="horizontal-ad-banner">
|
||||
<div class="ad-content">
|
||||
<div class="ad-icon">
|
||||
@@ -47,11 +47,11 @@
|
||||
></a>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</aside> -->
|
||||
|
||||
<!-- Featured Section -->
|
||||
<section id="featured"></section>
|
||||
<aside class="featured-ad">
|
||||
<!-- <aside class="featured-ad">
|
||||
<div class="feature-ad-banner">
|
||||
<div class="ad-content">
|
||||
<div class="ad-icon">
|
||||
@@ -64,11 +64,11 @@
|
||||
></a>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</aside> -->
|
||||
|
||||
<!-- Projects Section -->
|
||||
<section id="projects"></section>
|
||||
<aside class="projects-ad">
|
||||
<!-- <aside class="projects-ad">
|
||||
<div class="horizontal-ad-banner">
|
||||
<div class="ad-content">
|
||||
<div class="ad-icon">
|
||||
@@ -83,11 +83,11 @@
|
||||
></a>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</aside> -->
|
||||
|
||||
<!-- Services Section -->
|
||||
<section id="services"></section>
|
||||
<aside class="services-ad">
|
||||
<!-- <aside class="services-ad">
|
||||
<div class="feature-ad-banner">
|
||||
<div class="ad-content">
|
||||
<div class="ad-icon">
|
||||
@@ -100,7 +100,7 @@
|
||||
></a>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</aside> -->
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section id="contact"></section>
|
||||
|
||||
Reference in New Issue
Block a user