.courses {
    background: #E6F2F9;
    padding: 50px 0;
}
.courses .header {
    margin-bottom: 50px;
}
.courses .header h2 {
    color: #001F7E;
    text-align: center;
    font-family: Inter;
    font-size: 40px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.courses .header p {
    color: #1C2A45;
    text-align: center;
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.courses .inner {
    display: flex;
    border-radius: 4px;
    background: #FFF;
    padding: 20px;
}
@media (max-width: 576px) {
    .courses .inner {
        flex-direction: column;
    }
}
.courses .inner .left {
    margin-right: 30px;
}
@media (max-width: 576px) {
    .courses .inner .left {
        margin-bottom: 20px;
    }
}
.courses .inner .left .number {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    background: #D00C27;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFF;
    text-align: center;
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.courses .inner .right h3 {
    color: #001F7E;
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 20px;
}
.courses .inner .right .content {
    color: #1C2A45;
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.courses .inner .right .click {
    margin-top: 40px;
}
@media (max-width: 576px) {
    .courses .inner .right .click .btn-red {
        margin-bottom: 10px;
    }
}