@media(max-width: 1920px){
    :root{
        --max-width: 1920px;
    }    
}

.linear-border{
    width: fit-content;
    position: relative;
    margin-bottom: 40px;
}

.linear-border::after {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: rgb(254, 163, 17);
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    z-index: -1;
    padding: 7px;
    border-radius: 15px;
}

.services-link {
    display: flex;
    margin: auto;
    max-width: var(--max-width);    
}

#service-info {
    color: white; 
    font-family: Corbel;
    font-size: 40px; 
    margin-top: 2%; 
    margin-left: 2%;
}

#service-button {
    cursor: pointer; 
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color: black;
    box-shadow: 0px 0px 7px black;
    font-size: 20px; 
    border-radius: 15px; 
    background-color: white; 
    height: fit-content; 
    padding: 20px; 
    margin-left: auto; 
    margin-right: auto; 
    margin-top: 1.5%;
    transition: all 0.3s ease-in-out;
}

#service-button:hover{
    color: rgb(242, 61, 73);
    box-shadow: 0px 0px 7px white;
    transform: translateY(-10%);
}

#service-here{
    display: flex;
}

@media(max-width: 400px){
    .linear-border{
        margin: 0;
        width: fit-content !important;
    }

    #service-here{
        display: flex;
        flex-direction: column;
        text-align: center;
        padding: 10px 0px 110px 0px;
    }

    #service-info{
        font-size: 28px !important;
        margin-bottom: 1%;
    }

    #service-button{
        padding: 10px;
        margin-top: 2%;
    }

    .services-link{
        margin-top: 4%;
        margin-bottom: 0;
    }
}