.ServicesMainTitle
        {
            font-size: 8.5rem;
            font-weight: bold;
            margin-top: 10%;
          text-align: center;
            font-family: "Inter", serif;
            color: var(--white-color);
        }



 

        .full-width-gif {
            width: 100vw;
            height: auto;
        }

   

     .services{
            background-color: #33333321;
            backdrop-filter: blur(25px);
            border: var(--main-color) solid 3px;
            border-radius: 10px;
            padding: 2%;
           transition: all .35s ease-in-out;
            margin: 5%;
        }

        .servicesImage{
            border-radius: 10px 10px 0 0;
            width: 100%;
           
            
        }

        .servicesTitle{
            
            color: var(--white-color);
            font-size: 2rem;
            text-align: left; 
            font-family: "Inter", serif;
            font-weight: 700;
            
        }

        .servicesText{
           
            color: var(--white-color);
            font-size: 1rem;
            text-align: left; 
            font-family: "Inter", serif;
            font-weight: 400;
        }

        
        .servicesSubText{
            color: var(--white-color);
            font-family: "Inter", serif;
           color: var(--secondary-color);
           text-decoration: underline;
            font-size: 1rem;
            font-weight: 600;
            transition: all .35s ease-in-out;
        }

        .servicesSubText:hover{
            text-decoration: underline;
            /* font-size: 1.25rem; */
            font-weight: 900;
            }

    
        .servicesTextBox{
            padding:0 10% 0 10%;
        }

        .right-align{
            text-align: left;
        }

        .servicesImgButtonContainer {
            display: flex;
            justify-content: center;
            margin-bottom: 0rem;
        }
       
        .servicesImgButton {
            width: 20%;
            height: auto;
        }
        
        .servicesButton {
            font-family: "Inter", serif;
            color: var(--secondary-color);
            text-decoration: underline;
            font-size: 1rem;
            font-weight: 600;
            transition: all .35s ease-in-out;
            margin-top: 1rem; /* Adjust the margin as needed */
            margin-bottom: 1rem;
        }
        .servicesButton:hover {
            color: var(--secondary-color);
            text-decoration: underline;
            /* font-size: 1.25rem; */
            font-weight: 900;
        }
   
            /* Tablet styles */
@media only screen and (min-width: 600px) and (max-width: 1024px) {


    .ServicesMainTitle
    {
        margin-top: 20%;
        font-size: 5.5rem;
}


    .services{

        border: var(--main-color) solid 3px;
        border-radius: 10px;
        padding: 2%;
       transition: all .35s ease-in-out;
       margin: 0 -2% 4% 0;
    }

    .servicesTitle{
        
        color: var(--white-color);
        font-size: 1.3rem;
        text-align: left; 
        font-family: "Inter", serif;
        font-weight: 700;
        
    }

    .servicesText{
       
        color: var(--white-color);
        font-size: .8rem;
        text-align: left; 
        font-family: "Inter", serif;
        font-weight: 400;
    }

    
    .servicesSubText{
        color: var(--white-color);
        font-family: "Inter", serif;
       color: var(--secondary-color);
       text-decoration: underline;
       font-size: .9rem;
        font-weight: 600;
        transition: all .35s ease-in-out;
    }

                        .servicesImgButtonContainer {
                            display: flex;
                            justify-content: center;
                            margin-bottom: 0rem;
                        }
                        
                        .servicesImgButton {
                            width: 30%;
                            height: auto;
                        }

}


/* Mobile styles */
@media only screen and (max-width: 600px) {


    .ServicesMainTitle
    {
        font-size: 3.5rem;
        margin-top: 50%!important;
    }

    .services{
        transform: scale(1.15);
        margin-top: 20%;
        margin-bottom: 6%;
    }

    .servicesTitle{
        
        color: var(--white-color);
        font-size: 1.2rem;
        text-align: left; 
        font-family: "Inter", serif;
        font-weight: 700;
        
    }

    .servicesText{
       
        color: var(--white-color);
        font-size: .8rem;
        text-align: left; 
        font-family: "Inter", serif;
        font-weight: 400;
    }

    
    .servicesSubText{
        color: var(--white-color);
        font-family: "Inter", serif;
       color: var(--secondary-color);
       text-decoration: underline;
       font-size: .8rem;
        font-weight: 600;
        transition: all .35s ease-in-out;
    }

   .servicesButton {
                margin-top: -2%; /* Adjust the margin as needed */
                         margin-bottom: 1rem;
                     }

                     .servicesImgButtonContainer {
                        display: flex;
                        justify-content: center;
                        margin-bottom: 0rem;
                    }
                    
                    .servicesImgButton {
                        width: 30%;
                        height: auto;
                    }


}