/* Services Sytles */

.service-item {
    margin-bottom: 20px; /* Spacing between cards */
    border: 1px solid #e1e1e1; /* Light border */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    transition: transform 0.2s; /* Smooth hover effect */
}

.service-item:hover {
    transform: scale(1.05); /* Scale up on hover */
}


/* Values,Vison & Mision Styles */

.about-section {
    padding: 40px 20px; /* Padding for the section */
    background-color: #f9f9f9; /* Light background color */
}

.card {
    border: 1px solid #e1e1e1; /* Light border */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    transition: transform 0.2s; /* Smooth hover effect */
}

.card:hover {
    transform: scale(1.05); /* Scale up on hover */
}


/* Service Request Styles */

:is(#service-request,#solution-center-section){
 
    background-color: #f9f9f9; /* Light background color */
}

/* Social Media Icon Styles */

#whatsapp-button {
    position: fixed;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    background-color: white; /* Optional: background color for better visibility */
    border-radius: 50%; /* Makes the button circular */
    padding: 10px; /* Padding around the icon */
    box-shadow: 0 0 10px rgba(0,0,0,0.3); /* Shadow effect */
}

#whatsapp-button img {
    width: 30px; /* Size of the icon */
    height: 30px; /* Size of the icon */
}


#facebook-button {
    position: fixed;
    left: 0;
    top: 58%; /* Adjust this to position it lower or higher */
    transform: translateY(-50%);
    z-index: 1000;
    background-color: white; /* Optional: background color for better visibility */
    border-radius: 50%; /* Makes the button circular */
    padding: 10px; /* Padding around the icon */
    box-shadow: 0 0 10px rgba(0,0,0,0.3); /* Shadow effect */
}

#facebook-button img {
    width: 30px; /* Size of the icon */
    height: 30px; /* Size of the icon */
}

/* ICON COLORS */

:is(.fas,#icons){
    color: #F22998;
}