

.alert {
    border: 1px solid #666;
    color: #333;
    margin-bottom: 2em;
    margin-top: 1em;
    padding: 1em;
    position: relative;
/**    max-width: 100%  **/
}

@media only screen and (min-width: 48em) {
    .alert {
        padding:1.5em
    }
}

.alert:before {
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: #666;
    border-radius: 50%;
    color: #fff;
    content: "i";
    display: flex;
    font-family: Consolas,Monaco,monospace;
    font-size: .9rem;
    font-weight: 700;
    height: 24px;
    justify-content: center;
    left: -12px;
    line-height: 1;
    position: absolute;
    top: -12px;
    width: 24px 
}

.alert:after {
    background-color: #fff;
    content: "";
    height: 100%;
    left: 0;
    opacity: .05;
    position: absolute;
    right: 0;
    top: 0;
/**    max-width: 100%; **/
    z-index: -1
}

.alert.info {
    border-color: #259eef;
}

.alert.info:before {
    content: "i"
}

.alert.info:after,.alert.info:before {
    background-color: #259eef;
}

.alert.warning {
    border-color: #fddc58;
}

.alert.warning:before {
    content: "!"
}

.alert.warning:after,.alert.warning:before {
    background-color: #fddc58;
}

.alert.error {
    border-color: #fc365e;
}

.alert.error:before {
    content: "!"
}

.alert.error:after,.alert.error:before {
    background-color: #fc365e;
}

.alert.success {
    border-color: #48c774;
}

.alert.success:before {
    content: "✓";
    font-family: Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
}

.alert.success:after,.alert.success:before {
    background-color: #48c774;
}











.kg-card {
    align-self: center;
    margin: 0 0 2em;
/**    max-width: 100%; 
    width: 100vw **/
}


.kg-card a[data-fslightbox],.kg-card div,.kg-card img {
    border-radius: inherit
}

.kg-callout-card,.kg-callout-card * {
    box-sizing: border-box
}

.kg-callout-card {
    display: flex;
    padding: 1.2em 1.6em;
    border-radius: 3px
}

.kg-callout-card-grey {
    background: rgba(124,139,154,.13)
}

.kg-callout-card-white {
    background: 0 0;
    box-shadow: inset 0 0 0 1px rgba(124,139,154,.25)
}

.kg-callout-card-blue {
    background: rgba(33,172,232,.12)
}

.kg-callout-card-green {
    background: rgba(52,183,67,.12)
}

.kg-callout-card-yellow {
    background: rgba(240,165,15,.13)
}

.kg-callout-card-red {
    background: rgba(209,46,46,.11)
}

.kg-callout-card-pink {
    background: rgba(225,71,174,.11)
}

.kg-callout-card-purple {
    background: rgba(135,85,236,.12)
}

.kg-callout-card-accent {
    background: var(--ghost-accent-color);
    color: #fff
}

.kg-callout-card.kg-callout-card-accent a {
    color: #fff;
    text-decoration: underline
}

.kg-callout-card {
    padding-right: .8em;
    line-height: 1.25em;
    font-size: 1.15em
}

.kg-callout-card {
    font-size: .95em;
    line-height: 1.5em
}

.kg-callout-card+.kg-callout-card {
    margin-top: 1em
}



.kg-callout-card div.kg-callout-emoji {
    padding-right: .8em;
    line-height: 1.25em;
    font-size: 1.15em
}

.kg-callout-card div.kg-callout-text {
    font-size: .95em;
    line-height: 1.5em
}

.kg-callout-card+.kg-callout-card {
    margin-top: 1em
}









.callout.note {
    background-color: #d5f0c3;
    color: #000c2a
}

.callout.warning {
    background-color: #ffbab5;
    color: #000c2a
}

.callout.info {
    background-color: #c6e3ff;
    color: #000c2a
}

.callout.draft {
    background-color: #ebbfeb;
    color: #000c2a
}















.uk-alert {
  width: 100%;
  padding: 12px 16px;
  border-radius: 4px;
  border-style: solid;
  border-width: 1px;
  margin-bottom: 12px;
  font-size: 16px;
}

.uk-alert-success {
  background-color: rgba(227, 253, 235, 1);
  font-size: 19px;
  border-color: rgba(38, 179, 3, 1);
  color: rgba(60, 118, 61, 1);
}

.uk-alert-info {
  background-color: rgba(217, 237, 247, 1);
		font-size: 19px;
  color: rgba(49, 112, 143, 1);
  border-color: rgba(126, 182, 193, 1);
}


.uk-alert-warning {
  background-color: rgba(252, 248, 227, 1);
		font-size: 19px;
  border-color: rgba(177, 161, 129, 1);
  color: rgba(138, 109, 59, 1);
}

.uk-alert-danger {
  background-color: rgba(248, 215, 218, 1);
	font-size: 19px;
  border-color: rgba(220, 53, 69, 1);
  color: rgba(114, 28, 36,1);
}