*,nav ul {
    padding:0;
    margin:0
    }
    
    *,body,nav ul {
    margin:0
    }
    
    body,form,nav ul {
    display:flex
    }
    
    footer,form button:hover {
    background:#333
    }
    
    #services,#testimonials,#why-choose-us ul li,body {
    background-color:#f4f4f4
    }
    
    *,.video-gallery li,body {
    box-sizing:border-box
    }
    
    footer,header {
    position:fixed
    }
    
    .cta-button,.image-label,form button,form label,nav ul li a {
    font-weight:700;
    font-size:12px
    }
    
    #contact a,.cta-button,.map-container a,nav ul li a {
    text-decoration:none
    }
    
    body {
    flex-direction:column;
    min-height:100vh;
    font-family:Arial,sans-serif;
    padding:70px 0 0
    }
    
    nav ul {
    justify-content:center;
    list-style:none;
    gap:20px
    }
    
    .map-container a.active,nav ul li a.active {
    text-decoration:underline
    }
    
    main {
    flex:1;
    padding:20px;
    max-width:1500px;
    margin:auto;
    text-align:left
    }
    .logo-link {
        text-decoration: none; /* Remove underline */
        display: inline-block; /* Ensure it behaves like a block */
    }
    
    .logo-link .logo-container {
        display: flex;
        align-items: center;
        text-decoration: none;
        cursor: pointer; /* Make it clear it's clickable */
    }

    .logo-container {
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:20px
    }
    
    .slogan-container {
    display:flex;
    margin-top:15px;
    padding-left:20px
    }
    
    .error,.service h3,.success {
    margin-bottom:15px
    }
    
    section {
    margin-bottom:30px
    }
    
    footer {
    color:#fff;
    text-align:center;
    padding:10px;
    bottom:0;
    width:100%
    }
    
    .contact-container h1,.contact-container p {
    text-align:left;
    margin-bottom:15px
    }
    
    form {
    flex-direction:column;
    max-width:600px;
    margin:0 auto
    }
    
    .success {
    color:green;
    background:#e6ffe6;
    padding:10px;
    border:1px solid green
    }
    
    .error {
    color:red;
    background:#ffe6e6;
    padding:10px;
    border:1px solid red
    }
    
    .tag-cloud,.tag-iframe {
    background:0 0;
    overflow:auto
    }
    
    #why-choose-us ul,.image-list,.video-gallery ul {
    padding:0;
    list-style:none
    }
    
    .gallery {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:20px;
    margin-top:30px
    }
    
    .gallery-item {
    border:2px solid #ddd;
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 4px 8px #0000001a
    }
    
    .gallery-item img {
    width:100%;
    height:auto
    }
    
    .image-list {
    margin:20px auto;
    max-width:90%
    }
    
    #about h2,.video-gallery ul li {
    margin-bottom:20px
    }
    
    #contact h2,#why-choose-us h2,.image-item {
    text-align:center;
    margin-bottom:20px
    }
    
    #about p,#why-choose-us ul {
    max-width:800px;
    margin:0 auto
    }
    
    #services h2,#testimonials h2,h4,h3,h2 {
    margin-bottom:40px;
    text-align:center
    }
    
    #slogan-container h5 {
    margin-top:50px;
    text-align:left
    }
    
    .image-label {
    margin-bottom:10px
    }
    
    .image-item img {
    width:auto;
    max-width:80%;
    height:auto;
    border:2px solid #ddd;
    border-radius:5px
    }
    
    .video-gallery {
    margin-top:20px;
    max-width:96%;
    text-align:center;
    align-content:center
    }
    
    .tag-cloud {
    display:flex;
    justify-content:center;
    max-width:100%
    }
    
    .tag-iframe {
    display:block
    }
    
    .service,.testimonial {
    background-color:#fff
    }
    
    .contact-container a,footer a {
    text-decoration:none;
    color:#0ff
    }
    
    .contact-container,.map-container {
    max-width:700px;
    min-width:360px;
    margin:30px auto;
    padding:20px
    }
    
    @keyframes spin-twice {
    0% {
    transform:rotate(0)
    }
    
    100% {
    transform:rotate(720deg)
    }
    }
    
    .logo-container img {
    transform-style:preserve-3d;
    perspective:1000px;
    width:80px;
    animation:2s ease-in-out spin-y-axis;
    transform-style:preserve-3d;
    perspective:1000px
    }
    
    @keyframes spin-y-axis {
    0% {
    transform:rotateY(0)
    }
    
    25% {
    transform:rotateY(180deg)
    }
    
    50% {
    transform:rotateY(990deg)
    }
    
    100% {
    transform:rotateY(1080deg)
    }
    }
    
    #why-choose-us ul li {
    padding:10px;
    margin-bottom:10px;
    border-radius:5px;
    color:#333
    }
    
    #about h2 {
    text-align:left
    }
    
    #about p {
    color:#555;
    text-align:center
    }
    
    .services-grid,.testimonial-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:20px
    }
    
    #about,#contact,#why-choose-us {
    padding:25px 15px;
    align-items:center;
    max-width:95%;
    margin:25px auto;
    background-color:#fff
    }
    
    .service {
    padding:20px;
    border-radius:8px;
    box-shadow:0 2px 5px #0000001a;
    border:1px solid #ddd;
    box-shadow:0 4px 6px #0000001a;
    transition:transform .3s,box-shadow .3s
    }
    
    .service h3 {
    margin-top:0;
    font-size:1.5rem;
    color:#222
    }
    
    .service p {
    font-size:1rem;
    color:#555;
    line-height:1.6
    }
    
    #contact p {
    text-align:center;
    color:#555
    }
    
    form label {
    display:block;
    margin:10px 0 5px;
    color:#000
    }
    
    form input,form textarea {
    margin-top:5px;
    width:100%;
    padding:10px;
    margin-bottom:20px;
    border:1px solid #ccc;
    border-radius:5px;
    font-size:1rem
    }
    
    form button {
    margin-top:15px;
    background:#000;
    color:#fff;
    padding:10px 20px;
    border:none;
    border-radius:5px;
    cursor:pointer
    }
    
    .testimonials-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px
    }
    
    .testimonial {
    margin-bottom:20px;
    padding:20px;
    border-radius:5px;
    box-shadow:0 2px 5px #0000001a
    }
    
    .testimonial blockquote {
    margin:0;
    font-style:italic;
    color:#555
    }
    
    .testimonial p {
    text-align:right;
    margin:10px 0 0;
    color:#000
    }
    
    .container {
    width:90%;
    max-width:900px;
    margin:0 auto;
    padding:20px 0
    }
    
    h2 {
    font-size:2rem;
    color:#333
    }
    
    .service:hover {
    transform:translateY(-5px);
    box-shadow:0 6px 12px #00000026
    }
    
    #services,#testimonials {
    padding:25px 0
    }
    
    .video-gallery ul {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    padding:0;
    list-style:none
    }
    
    .video-gallery iframe {
    width:96%;
    height:400px
    }
    
    .video-gallery li {
    flex:1 1 calc(33% - 20px);
    min-width:360px;
    max-width:calc(30% - 20px);
    margin:10px;
    text-align:center
    }
    
    .contact-container,.map-container {
    background:#fff;
    border-radius:8px;
    box-shadow:0 0 10px #0000001a;
    display:flex;
    flex:1;
    flex-direction:column
    }
    
    .contact-map-container {
    display:flex;
    flex-wrap:wrap;
    gap:20px;
    justify-content:space-between;
    max-width:900px;
    margin:auto;
    align-items:center;
    justify-content:center
    }
    
    .contact-container,.map-container {
    flex:1
    }
    
    .map-container {
    max-width:800px;
    height:100%;
    overflow:hidden;
    margin:20px auto;
    padding:10px;
    align-items:center;
    justify-content:center
    }
    
    .map-container a {
    color:#00f;
    font-weight:700
    }
    
    .tag-cloud {
    display:flex;
    justify-content:center;
    width:98%;
    margin-top:10px
    }
    
    .tag-iframe {
    width:420px;
    height:360px;
    border:none
    }
    
    @media (max-width:768px) {
    .services-grid,.testimonial-grid {
    grid-template-columns:repeat(auto-fit,minmax(255px,1fr))
    }
    
    .video-gallery li {
    flex:1 1 100%
    }
    
    .contact-map-container {
    flex-direction:column
    }
    
    .tag-iframe {
    width:420px;
    height:360px
    }
    }
    
    @media (max-width:480px) {
    .services-grid,.testimonial-grid {
    grid-template-columns:1fr
    }
    }
    
    header {
    color:#fff;
    text-align:center;
    top:0;
    left:0;
    width:100%;
    background:#2e2e2e;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    padding:5px 10px;
    box-shadow:0 4px 6px #0000001a;
    z-index:1000
    }
    
    .logo-container {
    display:flex;
    align-items:center
    }
    
    .logo-container img {
    height:75px;
    margin-right:10px
    }
    
    .title-container h1 {
    margin:0;
    font-size:24px;
    color:#f5f5f5
    }
    
    .title-container h3 {
    margin:0;
    font-size:14px;
    color:#fff
    }
    
    nav ul li {
    display:inline
    }
    
    nav ul li a {
    color:#d3d3d3
    }
    
    .gallery-contact-page {
    display:flex;
    justify-content:flex-end;
    padding:10px
    }
    
    .cta-button {
    display:inline-block;
    padding:5px;
    font-size:16px;
    color:#252525;
    background-color:#e9e9e9;
    border-radius:4px;
    transition:background-color .3s,transform .2s
    }
    
    .cta-button:hover {
    background-color:#242424;
    color:#fff;
    transform:scale(1.05)
    }
    
    .cta-button:active {
    background-color:#0a0a0a;
    color:#fff;
    transform:scale(.98)
    }
    
    html,body {
    max-width:100%;
    overflow-x:auto
    }
    
    @media (max-width: 1024px) {
    main {
    padding:15px;
    max-width:95%
    }
    
    .gallery {
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr))
    }
    
    .services-grid,.testimonial-grid {
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr))
    }
    
    .contact-container,.map-container {
    max-width:90%
    }
    
    .slogan-container {
    height:10px
    }
    }
    
    @media (max-width: 768px) {
    nav ul {
    flex-direction:row;
    align-items:center;
    gap:10px
    }
    
    .gallery {
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr))
    }
    
    .services-grid,.testimonial-grid {
    grid-template-columns:1fr
    }
    
    .contact-map-container {
    flex-direction:column
    }
    
    .slogan-container {
    height:auto
    }
    }
    
    @media (max-width: 480px) {
    nav ul {
    flex-direction:row;
    align-items:center;
    gap:10px
    }
    
    body {
    padding:50px 0 0
    }
    
    .title-container h1 {
    font-size:20px
    }
    
    .cta-button {
    font-size:14px;
    padding:8px
    }
    
    .gallery {
    grid-template-columns:1fr
    }
    
    .contact-container,.map-container {
    padding:5px
    }
    
    .tag-cloud {
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%
    }
    
    .contact-container,.map-container {
    min-width:320px;
    margin:10px auto;
    padding:10px
    }
    
    .slogan-container {
    height:auto
    }
    }

    .social-icons ul {
        list-style: none;
        padding: 0;
        margin: 20px 0 0 0;
        display: flex;
        justify-content: center;
        gap: 15px;
    }
    
    .social-icons a {
        display: inline-block;
        width: 40px;
        height: 40px;
        text-decoration: none;
    }
    
    /* Example icon styles - you'll need to replace with actual icon implementations */
    .fb.icon { background: #3b5998; }
    .twitt.icon { background: #1da1f2; }
    .gplus.icon { background: #db4437; }
    .linkedin.icon { background: #0077b5; }

    /* Social Icons Styles */
.social-icons {
    margin: 20px 0;
    text-align: center;
}

.social-icons ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline-flex;
    gap: 15px;
}

.social-icons li {
    display: inline-block;
}

.social-icons a {
    display: block;
    width: 40px;
    height: 40px;
    text-decoration: none;
    position: relative;
}

.social-icons .icon {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #333;
    transition: background-color 0.3s ease;
}

.social-icons .fb.icon {
    background-color: #3b5998; /* Facebook blue */
}

.social-icons .twitt.icon {
    background-color: #1da1f2; /* Twitter blue */
}

.social-icons .gplus.icon {
    background-color: #db4437; /* Google red */
}

.social-icons .linkedin.icon {
    background-color: #0077b5; /* LinkedIn blue */
}

.social-icons a:hover .icon {
    opacity: 0.8;
    transform: scale(1.1);
}

.social-icons span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Social Icons Styles */
.social-icons {
    margin: 20px 0;
    text-align: center;
}

.social-icons ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.social-icons li {
    display: inline-block;
}

.social-icons a {
    display: block;
    width: 40px;
    height: 40px;
    position: relative;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.social-icons .icon {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #333;
    transition: all 0.3s ease;
}

/* Social Platform Colors */
.social-icons .fb { background-color: #3b5998; } /* Facebook blue */
.social-icons .twitt { background-color: #1da1f2; } /* Twitter blue */
.social-icons .gplus { background-color: #db4437; } /* Google red */
.social-icons .linkedin { background-color: #0077b5; } /* LinkedIn blue */

/* Hover Effects */
.social-icons a:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.social-icons a:hover .icon {
    opacity: 0.9;
}

/* Accessibility - hide text but keep for screen readers */
.social-icons span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Footer specific adjustments */
footer .social-icons {
    margin-bottom: 15px;
}

footer .social-icons a {
    width: 36px;
    height: 36px;
}

/* Responsive adjustments */
@media (max-width: 480px) {
    .social-icons ul {
        gap: 15px;
    }
    
    footer .social-icons a {
        width: 32px;
        height: 32px;
    }
}

.social-icons a i {
    color: white;
    font-size: 18px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}