.nonotami-infobox {
    display: block;
    position: relative;
    padding: 1em;
    width: 100%;
    box-sizing: border-box;
    clear: both;
}

.nonotami-infobox.right {
    flex-direction: row-reverse;
}

.nonotami-infobox .nt-icon {
    width: 40px;
    height: 40px;
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.nonotami-infobox .nt-content {
    padding-left: 60px;
}

.nonotami-infobox.top .nt-icon {
    top: 1em;
    transform: none;
}

.nonotami-infobox.bottom .nt-icon {
    bottom: 1em;
    top: auto;
    transform: none;
}

.nonotami-infobox.center .nt-icon {
    top: 50%;
    transform: translateY(-50%);
}

.nonotami-infobox.overflow .nt-icon {
    top: 0;
    transform: translateY(-50%);
}

.nonotami-infobox.overflow .nt-icon {
    top: 0;
    transform: translateY(-50%);
}

/* Backgrounds */
.nt-bg-yellow { background:#fff9db; }
.nt-bg-red { background:#ffe3e3; }
.nt-bg-blue { background:#e7f5ff; }
.nt-bg-green { background:#ebfbee; }
.nt-bg-grey { background:#f1f3f5; }

/* Borders */
.nt-border-solid { border:2px solid #333; }
.nt-border-dashed { border:2px dashed #333; }
.nt-border-dotted { border:2px dotted #333; }
.nt-border-double { border:3px double #333; }

/* Margins */
.nt-mt-1 { margin-top:1em; }
.nt-mb-1 { margin-bottom:1em; }
.nt-mlr-1 { margin-left:1em; margin-right:1em; }

.nonotami-infobox.center {
    margin-left: auto;
    margin-right: auto;
}

.nonotami-infobox.right {
    margin-left: auto;
    margin-right: 0;
}

.nonotami-infobox.left {
    margin-left: 0;
    margin-right: auto;
}