.main-component-notification {
    background-color: #fff;
    border: 1px solid #e2e5e8;
    margin-bottom: 37px;
    padding: 25px;
}

.main-component-notification p{
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

.notification-component a {
    font-weight: 600;
    color: #1b7cac;
    cursor: pointer
}

.notification-component a:hover {
    text-decoration: underline;
    cursor: pointer
}

.notification-component  a.disabled {
    color: #6b737b
}

.notification-component a.disabled:hover {
    text-decoration: none;
    cursor: auto
}

.notification-component  {
    margin-bottom: 17px;
    padding: 6px 8px 8px 35px;
    position: relative;
    font-weight: 600;
    min-height: 40px;
    border: none;
    overflow-wrap: break-word;
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    /* display: flex; */
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start
}

.notification-component:before {
    height: 17px;
    width: 17px;
    top: 10px;
    left: 10px;
    position: absolute;
    line-height: 17px;
    text-align: center;
    font-weight: 400;
    font-size: 1.4rem
}

.notification-component p {
    margin-bottom: 10px
}

.notification-component p:last-child {
    margin-bottom: 0
}

.notification-component_closable {
    padding-right: 43px
}

.notification-component_errornotifications,
.notification-component_red {
    background-color: #f7e8e8
}

.notification-component_errornotifications:before,
.notification-component_red:before {
    content: url("../images/notifications/error-ico.svg")
}

.notification-component_warningnotifications,
.notification-component_yellow {
    background-color: #efeedc
}

.notification-component_warningnotifications:before,
.notification-component_yellow:before {
    content: url("../images/notifications/warning-ico.svg")
}

.notification-component_infonotifications,
.notification-component_blue {
    background-color: #d9e6ee
}

.notification-component_infonotifications:before,
.notification-component_blue:before {
    content: url("../images/notifications/info-grey-ico.svg")
}

.notification-component__body {
    flex-grow: 1;
    margin-top: 2px
}

@media screen and (max-width: 414px) {

    .notification-component {
        margin-right: 0;
        flex-direction: column
    }
}