@media (max-width: 1024px) and (min-width: 769px) {
    body{
        margin-top: 30px;
    }
    .circlesty{
        width: 450px !important;
        height: 450px !important;
        background: url(../imgs/circle-bg.svg) center center no-repeat;
        background-size: 450px;
        font-size: 22px;
        color: #001738;
    }
    .circlesty .content {
        width: 90%;
        margin: auto;
        font-size: 22px;
        line-height: 1.2;
    }
    .btn-cstbtn {
        font-size: 25px;
    }
    #questionnaire,#aresources,#haeondemand,#longtermprophylaxis {
        scroll-margin-top: 160px;
    }
    #hae,#haeassociations {
        scroll-margin-top: 100px;
    }
}

@media (max-width: 575.98px) {
    .circlesty .content {
        width: 90%;
        margin: auto;
        font-size: 16px;
        line-height: 1.2;
    }
    .circlesty{
        font-size: 18px;
        padding: 30px;
    }
}
@media (max-width: 376px) {
    .circlesty{
        font-size: 17px;
        color: #001738;
        padding: 30px;
    }
}
@media (max-width: 320px) {
    .circlesty{
        font-size: 16px;
        padding: 20px;
    }
}