:root{
    --color-bg: #f5f3e7;
    --color-primary: rgba(167, 178, 153, 1);
    --color-primary-50: rgba(167, 178, 153, 0.5);
    --color-primary-80: rgba(167, 178, 153, 0.8);
    --color-text: #1A1D1E;
    --color-text-20: rgba(26, 29, 30, 0.2);
    --color-white: #fff;

    --font-main: 'Montserrat', sans-serif;
    --font-title: 'Cinzel', serif;
}
*{
    margin: 0;
    padding: 0;
    text-decoration: none;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent;
}
body{
    background-color: var(--color-bg);
}
.main-heading{
    font-family: var(--font-title);
    letter-spacing: 1px;
    text-align: center;
    color: var(--color-text);
    margin: 40px 0px 40px -15px;
}
.discount-section,
.wellness-info-section,
.special-offer-section{
    width: 100%;
    background-color: var(--color-primary);
    padding: 25px 8px;
    font-family: var(--font-main);
    text-align: center;
    color: #f5f3e7;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 2px;
}
.price-list-container{
    margin: 0 auto;
}
.content-box{
    display: block;
    position: relative;
    color: var(--color-text);
    border: 2px solid var(--color-primary);
    box-shadow: 0px 0px 11px var(--color-primary);
    padding: 30px 20px;
    margin: 60px auto;
    width: 100%;
    max-width: 1200px;
}
.table-wrapper{
    padding: 0 25px;
}
.table-heading{
    position: absolute;
    top: -18px;
    color: var(--color-text);
    font-family: var(--font-title);
    font-size: 25px;
    letter-spacing: 3px;
    background-color: var(--color-bg);
    padding: 0 4px;
}
.content-box table{
    color: var(--color-text);
    font-family: var(--font-main);
    width: 100%;
    border-collapse: collapse;
}
.content-box .massage-table td,
.content-box .special-offer-table td{
    border-bottom: 1px solid var(--color-primary-80);
}
.content-box table tr td{
    padding: 10px 0 5px 0; 
}
.content-box table tr td:nth-of-type(1){
    width: 55%;
}
@media screen and (max-width: 768px) {
    .main-heading{
        font-size: 28px;
        margin: 30px 0px;
    }
    .table-wrapper{
        padding: 0 15px;
    }
    .discount-section,
    .wellness-info-section,
    .special-offer-section{
        font-size: 16px;
    }
    .table-heading{
        font-size: 19px;
        top: -12px;
    }
    .content-box{
        margin: 50px auto;
    }
    .content-box table{
        font-size: 14px;
    }
    .content-box table tr td:not(:nth-of-type(1)){
        text-align: center;
    }
    .content-box .massage-table tr td{
        padding-right: 6px;
    }
}