#transition-container {
    position: relative;
    z-index: 1;
}

#transition {
    background: rgb(56,56,56);
    background: -moz-linear-gradient(180deg, rgba(56,56,56,0) 0%, rgba(52,52,52,1) 45%, rgba(51,51,51,1) 50%, rgba(52,52,52,1) 55%, rgba(92,92,92,0) 100%);
    background: -webkit-linear-gradient(180deg, rgba(56,56,56,0) 0%, rgba(52,52,52,1) 45%, rgba(51,51,51,1) 50%, rgba(52,52,52,1) 55%, rgba(92,92,92,0) 100%);
    background: linear-gradient(180deg, rgba(56,56,56,0) 0%, rgba(52,52,52,1) 45%, rgba(51,51,51,1) 50%, rgba(52,52,52,1) 55%, rgba(92,92,92,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#383838",endColorstr="#5c5c5c",GradientType=1);
    position: absolute;
    width: 100%;
    height: 322px;
    top: -178px;
}

#sec-4 {
    height: 427px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#sec-4 .bg-overlay {
    background: linear-gradient(var(--prim-col) 80%, rgb(36, 36, 36));
}

.sec-4-btn {
    display: inline;
    text-decoration: none;
    padding: 10px 20px;
}

#sec-4 .btn-container a {
    text-decoration: none; 
}

#sec-4 .btn-container, 
#sec-4-content {
    position: relative;
    margin-left: 5rem; 
    margin-right: 5rem; 
}

@media (width <= 664px) {
    #sec-4 {
        align-items: center; 
    }

    #sec-4 * {
        text-align: center; 
    }

    #sec-4 .btn-container {
       display: flex; 
       align-items: center; 
    }
}