.SDalerts
{
}
.SDalerts .alert
{
	/*border: 3px solid black;*/
	/*padding: calc(var(--defaultInterval)*.5);*/
	/*max-width:var(--maxWidth);*/
	/*margin-left: auto;*/
	/*margin-right: auto;*/
	transition:var(--defaultTransition);
	/*transition: all 2000ms ease-in-out !important;*/
	max-height: 1200px;
	overflow: hidden;
	box-sizing: border-box;
	background-color:var(--rowCol);
	overflow:autp;
}
.SDalerts .alert:nth-child(even)
{
	background-color:var(--rowColAlt);
}
.SDalerts .alert .wrapper
{
	padding: calc(var(--defaultInterval)*.5);
	max-width:var(--maxWidth);
	margin-left: auto;
	margin-right: auto;
	display: grid;
	grid-template-areas: "headline buttonClose" "headline buttonClose" "message message" "button button";
	grid-gap: calc(var(--defaultInterval)*.5);
	grid-template-columns: 1fr auto;
	max-width: calc(100vw - 400px);
}
.SDalerts .alert.image .wrapper
{
	padding: calc(var(--defaultInterval)*.5);
	display: grid;
	grid-template-areas: "image headline buttonClose" "image headline buttonClose" "image message message" "image button button";
	grid-template-columns: 200px auto 200px;
}
.SDalerts .alert .image
{
	grid-area: image;
	position: relative;
	overflow: hidden;
}
#SD .SDalerts .alert .close.button
{
	grid-area: buttonClose;
	position: relative;
	overflow: hidden;
	display: flex;
	padding: calc(var(--defaultInterval)*.5);
	min-height: auto;
	align-self: start;
	height: calc(var(--defaultInterval)*1.5);
	width: calc(var(--defaultInterval)*1.5);
}
.SDalerts .alert p:last-child
{
	margin-bottom: 0px;
}
.SDalerts .alert .close.button .bar
{
	height: 60%;
	width: calc(var(--defaultInterval)*.25);
	background-color: white;
	position: absolute;
	display: ;
	transform: rotate(-45deg);
	pointer-events: none;
}
.SDalerts .alert .close.button .bar:nth-child(1)
{
	transform: rotate(45deg);
}
.SDalerts .alert .image .inner
{
	position: absolute;
	height: 100%;
	width: 100%;
	background-size: cover;
}
.SDalerts .alert .headline
{
	grid-area: headline;
}
.SDalerts .alert .message
{
	grid-area: message;
}
.SDalerts .alert .button:not(.close)
{
	grid-area: button;
	justify-self: start;
}
.SDalerts .alert.close
{
	border: ;
	max-height: 0;
}
.SDalerts .alert.image .wrapper .message a
{
	white-space: normal;
}
@media only screen and (max-width: 1000px)
{
	.SDalerts .alert .wrapper
	{
		max-width: none;
	}
}
@media only screen and (max-width: 800px)
{
	.SDalerts .alert .wrapper
	{
		/*max-width: none;*/
		/*display: none;*/
		max-width: none !important;
		/*background-color: #587878 !important;*/
	}
}
@media only screen and (max-width: 400px)
{
	#SD .SDalerts .alert .close.button
	{
		display: none;
	}
	.SDalerts .alert.image .wrapper
	{
		grid-template-areas: "image buttonClose" "headline buttonClose" "imessage message" "i button button";
		grid-template-columns: 1fr 1fr;
		background-color: white;
		max-width: none;
		grid-template-rows: 100px 100px 100px;
	}
	.SDalerts .alert .wrapper
	{
		padding: calc(var(--defaultInterval)*.5);
		max-width:var(--maxWidth);
		margin-left: auto;
		margin-right: auto;
		display: grid;
		grid-template-areas: "headline buttonClose" "headline buttonClose" "message message" "button button";
		grid-gap: calc(var(--defaultInterval)*.5);
		grid-template-columns: 1fr auto;
		max-width: none;
	}
}