:root {
	--nbuxAlert__borderColour: var(--color-grey-200, #e3e5e6);
    --nbuxAlert__backgroundColour: var(--color-white, #fefefe);
    --nbuxAlert__titleColour: var(--color-black, #252525);
    --nbuxAlert__textColour: var(--color-black, #252525);
}

.nbuxAlert {
	display: flex;
	flex-flow: column;
	flex: auto;
	align-items: flex-start;
	border-top-color: #e3e5e6;
	border-right-color: #e3e5e6;
	border-bottom-color: #e3e5e6;
	border-left-color: #e3e5e6;
    border-top-color: var(--nbuxAlert__borderColour);
    border-right-color: var(--nbuxAlert__borderColour);
    border-bottom-color: var(--nbuxAlert__borderColour);
    border-left-color: var(--nbuxAlert__borderColour);
    border-width: 1px 1px 1px 4px;
    border-style: solid;
	border-radius: 4px;
	padding: 16px;
	box-sizing: border-box;
    font-family: "poppins";
    font-family: var(--my-account-font-primary);
    background: #fefefe;
    background: var(--nbuxAlert__backgroundColour);
    color: #252525;
    color: var(--nbuxAlert__textColour);
}

.nbuxAlert_success {
    border-left-color: #208636;
    border-left-color: var(--color-success, #208636);
}

.nbuxAlert_information {
    border-left-color: #0066cc;
    border-left-color: var(--color-information, #0066cc);
}

.nbuxAlert_warning {
    border-left-color: #e7c000;
    border-left-color: var(--color-warning, #e7c000);
}

.nbuxAlert_danger {
    border-left-color: #d40000;
    border-left-color: var(--color-alert, #d40000);
}

.nbuxAlert_dismissable {
    position: relative;
}

.nbuxAlert_dismissable p.nbuxAlert__title,
.nbuxAlert_dismissable p.nbuxAlert__text {
	width: calc(100% - 24px);
}

.nbuxAlert__close {
    position: absolute;
    top: 2px;
    right: -4px;
    width: 48px;
    height: 48px;
    background: transparent;
    border: 0;
    padding: 0;
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 400 400' enable-background='new 0 0 400 400' xml:space='preserve'%3E%3Cpath fill='%23252525' d='M344.7,278.4l-78.1-78.1l78.1-78.1c7.6-7.6,7.6-19.9,0-27.4L305.9,56c-7.6-7.6-19.9-7.6-27.4,0l-78.1,78.1L122.3,56 c-7.6-7.6-19.9-7.6-27.4,0L56,94.8c-7.6,7.6-7.6,19.9,0,27.4l78.1,78.1L56,278.4c-7.6,7.6-7.6,19.9,0,27.4l38.8,38.8 c7.6,7.6,19.9,7.6,27.4,0l78.1-78.1l78.1,78.1c7.6,7.6,19.9,7.6,27.4,0l38.8-38.8C352.2,298.3,352.2,286,344.7,278.4z'/%3E%3C/svg%3E");
    background-size: 10px 10px;
    background-position: center center;
    background-repeat: no-repeat;
}

.nbuxAlert__title {
    font-size: 20px;
    font-size: var(--font-body-large-font-size);
    font-family: "poppins";
    font-family: var(--font-primary, "poppins");
    line-height: 28px;
    line-height: var(--font-body-large-line-height);
    font-weight: bold;
    margin: 0 0 8px;
    color: #252525;
    color: var(--nbuxAlert__titleColour);
    text-transform: none;
    letter-spacing: normal;
}

.nbuxAlert__text {
    font-size: 16px;
    font-size: var(--font-body-font-size);
    font-family: "poppins";
    font-family: var(--font-primary, "poppins");
    line-height: 24px;
    line-height: var(--font-body-line-height);
}

.nbuxAlert__textSmall {
	color: var(--color-grey-400, #3f4952);
	margin-top: var(--gutter);
    font-size: 12px;
    font-size: var(--font-body-small-font-size);
    font-family: "poppins";
    font-family: var(--font-primary, "poppins");
    line-height: 20px;
    line-height: var(--font-body-small-line-height);
}

.nbuxAlert__textCta {
	font-weight: bold;
    color: #252525;
    color: var(--nbuxAlert__textColour);
}
