.noti-banner { position: relative; }

.noti-banner .nb-content {
  padding:25px;
  border: 1px solid transparent;
  display: block;
  text-align: center;
  font-weight: 300;
  color: #333;
  line-height: 24px;
  border-radius: 4px; 
}
.noti-banner .nb-content .nb-heading {
  margin: 8px 0;
  font-weight: 300;
}

.noti-banner .nb-content .nb-icon {
  width: 40px;
  height: 40px;
  background-size: contain;
  margin: auto;
  display: block;
  background-repeat: no-repeat;
}

.noti-banner.success { background-color: #f2f9f3; }
.noti-banner.success .nb-content { border-color: #008312; color: #155724; }
.noti-banner.success .nb-heading { color: #008312; }

.noti-banner.info { background-color: #f2fbfe; }
.noti-banner.info .nb-content { border-color: #0076b6; color: #004785; }
.noti-banner.info .nb-heading { color: #0076b6; }

.noti-banner.default { background-color: #f7f7f7; }
.noti-banner.default .nb-content { border-color: #8d8d8d; color: #3e3e3e; }
.noti-banner.default .nb-heading { color: #8d8d8d; }

.noti-banner.validation { background-color: #faf1ff; }
.noti-banner.validation .nb-content { border-color: #7408ab; color: #734782; }
.noti-banner.validation .nb-heading { color: #7408ab; }

.noti-banner.error, .noti-banner.danger { background-color: #fcf5f5; }
.noti-banner.error .nb-content, .noti-banner.danger .nb-content { border-color: #c33; color: #750809; }
.noti-banner.error .nb-heading, .noti-banner.danger .nb-heading { color: #c33;}

.noti-banner.warning { background-color: #fffcf3; }
.noti-banner.warning .nb-content { border-color: #ffbe10; color: #854b04; }
.noti-banner.warning .nb-heading { color: #ffbe10; }

.noti-banner.success .nb-content .nb-icon {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iNDhweCIgaGVpZ2h0PSI0OHB4IiB2aWV3Qm94PSIwIDAgNDggNDgiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDUxLjMgKDU3NTQ0KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5JY29ucy8g4q2Q77iPUG9wdWxhci90aWNrPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IlN5bWJvbHMiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJOYXZpZ2F0aW9uLS8tc3RlcC1pbmRpY2F0b3ItLy1kZXNrdG9wIj4KICAgICAgICAgICAgPGcgaWQ9Ikljb25zLy3irZDvuI9Qb3B1bGFyL3RpY2siPgogICAgICAgICAgICAgICAgPGcgaWQ9ImNoZWNrYm94Ij4KICAgICAgICAgICAgICAgICAgICA8cmVjdCBpZD0iUEgiIGZpbGwtcnVsZT0ibm9uemVybyIgeD0iMCIgeT0iMCIgd2lkdGg9IjQ4IiBoZWlnaHQ9IjQ4Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPGcgaWQ9Imljb24iIHN0cm9rZT0iIzAwODMxMiI+CiAgICAgICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0yNCw0Ny40NTQ1NDU1IEMzNi45NTM1ODc4LDQ3LjQ1NDU0NTUgNDcuNDU0NTQ1NSwzNi45NTM1ODc4IDQ3LjQ1NDU0NTUsMjQgQzQ3LjQ1NDU0NTUsMTEuMDQ2NDEyMiAzNi45NTM1ODc4LDAuNTQ1NDU0NTQ1IDI0LDAuNTQ1NDU0NTQ1IEMxMS4wNDY0MTIyLDAuNTQ1NDU0NTQ1IDAuNTQ1NDU0NTQ1LDExLjA0NjQxMjIgMC41NDU0NTQ1NDUsMjQgQzAuNTQ1NDU0NTQ1LDM2Ljk1MzU4NzggMTEuMDQ2NDEyMiw0Ny40NTQ1NDU1IDI0LDQ3LjQ1NDU0NTUgWiIgaWQ9Ik92YWwiIHN0cm9rZS13aWR0aD0iMS4wOTA5MDkwOSI+PC9wYXRoPgogICAgICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMjEuNDAwMTkwOCwzMC45MTU2Mzk5IEwxNC4zMzAyNDExLDI1LjI1OTI5ODQgQzE0LjAwMjg0OTEsMjQuOTkzOTQ4NiAxMy41MjE3ODMzLDI1LjA1MDI2MzggMTMuMjU2NDMzNSwyNS4zNzg2MTAzIEMxMi45OTU4NTYxLDI1LjcwNjk1NjkgMTMuMDQ4MzUzNCwyNi4xODcwNjgyIDEzLjM3NTc0NTQsMjYuNDUyNDE4IEwyMS4wMTE3MTEsMzIuNTU5MjgxNSBDMjEuMTUzOTMwOSwzMi42NzA5NTc1IDIxLjMyMTkyMjEsMzIuNzI3MjcyNyAyMS40ODg5NTg5LDMyLjcyNzI3MjcgQzIxLjcwMTgxMTQsMzIuNzI3MjcyNyAyMS45MTA4NDYsMzIuNjQxMzY4MSAyMi4wNjM1NjUzLDMyLjQ2OTU1ODkgTDM0LjI3ODI0NjcsMTguNzI2NzI5OCBDMzQuNTYxNzMyLDE4LjQwOTgzNzIgMzQuNTMxMTg4MSwxNy45Mjg3NzE0IDM0LjIxNDI5NTUsMTcuNjQ5MTA0MiBDMzMuOTAxMjIwOSwxNy4zNjU2MTg5IDMzLjQxNzI5MTYsMTcuMzk2MTYyOCAzMy4xMzc2MjQ0LDE3LjcxMzA1NTQgTDIxLjQwMDE5MDgsMzAuOTE1NjM5OSBaIiBpZD0iRmlsbC0yIiBzdHJva2Utd2lkdGg9IjAuMjUiIGZpbGw9IiMwMDgzMTIiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==);
}
.noti-banner.warning .nb-content .nb-icon {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjM0cHgiIGhlaWdodD0iMzNweCIgdmlld0JveD0iMCAwIDM0IDMzIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA0OS4yICg1MTE2MCkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+YWxlcnRfd2FybmluZ19pY29uPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+PC9kZWZzPgogICAgPGcgaWQ9IjEtQ29tcG9uZW50cyIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFsZXJ0cyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI5NS4wMDAwMDAsIC04MjcuMDAwMDAwKSI+CiAgICAgICAgICAgIDxnIGlkPSJJY29uLS8tZ2VuZXJhbC0vLUljb24td2FybmluZy10cmlhbmdsZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjk2LjAwMDAwMCwgODI4LjAwMDAwMCkiPgogICAgICAgICAgICAgICAgPHBhdGggZD0iTTE0Ljk1OTgxMSwwLjc3NzgzODQyMSBMMC4zMzQwNTIwNDEsMjkuMzI4OTgwNSBDLTAuMzE3MTM3MjgxLDMwLjYwMDE3NiAwLjIzMDg2NTU4MiwzMS41IDEuNjUxNjY3NTIsMzEuNSBMMzAuMzQ4MDMyNCwzMS41IEMzMS43NzI1NzU2LDMxLjUgMzIuMzE3MjY5NSwzMC42MDEwMiAzMS42NjU2NDc4LDI5LjMyODk4MDUgTDE3LjAzOTg4ODksMC43Nzc4Mzg0MjEgQzE2LjQwNDM5MTQsLTAuNDYyNzI0NzE3IDE1LjU5NDk0ODcsLTAuNDYyMDIyNDY4IDE0Ljk1OTgxMSwwLjc3NzgzODQyMSBaIiBpZD0iUmVjdGFuZ2xlIiBzdHJva2U9IiNGRkJFMTAiPjwvcGF0aD4KICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cC0yIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE0LjY2NjY2NywgMTAuNjY2NjY3KSIgZmlsbD0iI0ZGQkUxMCI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZSIgeD0iMC42NjY2NjY2NjciIHk9IjAiIHdpZHRoPSIxLjMzMzMzMzMzIiBoZWlnaHQ9IjEwLjY2NjY2NjciIHJ4PSIwLjY2NjY2NjY2NyI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgIDxjaXJjbGUgaWQ9Ik92YWwtMTYiIGN4PSIxLjMzMzMzMzMzIiBjeT0iMTQuNjY2NjY2NyIgcj0iMS4zMzMzMzMzMyI+PC9jaXJjbGU+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==);
}
.noti-banner.info .nb-content .nb-icon {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMjRweCIgaGVpZ2h0PSIyNHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+CiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDUxLjMgKDU3NTQ0KSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5JbmZvIGljb248L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iU3ltYm9scyIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFsZXJ0LS8tZGVza3RvcC0vLWluZm8tLy1iaWctLy1pY29uLSstYnV0dG9uIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMjAuMDAwMDAwLCAtMzAuMDAwMDAwKSI+CiAgICAgICAgICAgIDxnIGlkPSJJbmZvLWljb24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIwLjAwMDAwMCwgMzAuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8cmVjdCBpZD0iUEgiIGZpbGwtcnVsZT0ibm9uemVybyIgeD0iMCIgeT0iMCIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTIsMjMgQzE4LjA3NTEzMjIsMjMgMjMsMTguMDc1MTMyMiAyMywxMiBDMjMsNS45MjQ4Njc3NSAxOC4wNzUxMzIyLDEgMTIsMSBDNS45MjQ4Njc3NSwxIDEsNS45MjQ4Njc3NSAxLDEyIEMxLDE4LjA3NTEzMjIgNS45MjQ4Njc3NSwyMyAxMiwyMyBaIE0xMiwyNCBDNS4zNzI1ODMsMjQgMCwxOC42Mjc0MTcgMCwxMiBDMCw1LjM3MjU4MyA1LjM3MjU4MywwIDEyLDAgQzE4LjYyNzQxNywwIDI0LDUuMzcyNTgzIDI0LDEyIEMyNCwxOC42Mjc0MTcgMTguNjI3NDE3LDI0IDEyLDI0IFoiIGlkPSJPdmFsLTExIiBmaWxsPSIjMDA3NkI2IiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIGZpbGw9IiMwMDc2QjYiIHg9IjExLjUiIHk9IjEwIiB3aWR0aD0iMSIgaGVpZ2h0PSI4IiByeD0iMC41Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICA8Y2lyY2xlIGlkPSJPdmFsLTE2IiBmaWxsPSIjMDA3NkI2IiBjeD0iMTIiIGN5PSI3IiByPSIxIj48L2NpcmNsZT4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+);
}
.noti-banner.default .nb-content .nb-icon {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWlkWU1pZCBtZWV0IiB2aWV3Qm94PSIwIDAgNjQwIDY0MCIgd2lkdGg9IjY0MCIgaGVpZ2h0PSI2NDAiPjxkZWZzPjxwYXRoIGQ9Ik02NDAgMEM2NDAgMCA2NDAgMCA2NDAgMEM2NDAgMzg0IDY0MCA1OTcuMzMgNjQwIDY0MEM2NDAgNjQwIDY0MCA2NDAgNjQwIDY0MEMyNTYgNjQwIDQyLjY3IDY0MCAwIDY0MEMwIDY0MCAwIDY0MCAwIDY0MEMwIDI1NiAwIDQyLjY3IDAgMEMwIDAgMCAwIDAgMEMzODQgMCA1OTcuMzMgMCA2NDAgMFoiIGlkPSJnMmk4cHNaSVJGIj48L3BhdGg+PHBhdGggZD0iTTYxMy4zMyAzMjBDNjEzLjMzIDE1Ny4zMyA0ODIuNjcgMjYuNjcgMzIwIDI2LjY3QzE1Ny4zMyAyNi42NyAyNi42NyAxNTcuMzMgMjYuNjcgMzIwQzI2LjY3IDQ4Mi42NyAxNTcuMzMgNjEzLjMzIDMyMCA2MTMuMzNDNDgyLjY3IDYxMy4zMyA2MTMuMzMgNDgyLjY3IDYxMy4zMyAzMjBaTTAgMzIwQzAgMTQ0IDE0NCAwIDMyMCAwQzQ5NiAwIDY0MCAxNDQgNjQwIDMyMEM2NDAgNDk2IDQ5NiA2NDAgMzIwIDY0MEMxNDQgNjQwIDAgNDk2IDAgMzIwWiIgaWQ9ImM3WGlYWW9wcGIiPjwvcGF0aD48cGF0aCBkPSJNMzIwIDI2Ni42N0MzMjggMjY2LjY3IDMzMy4zMyAyNzIgMzMzLjMzIDI4MEMzMzMuMzMgMjk4LjY3IDMzMy4zMyA0NDggMzMzLjMzIDQ2Ni42N0MzMzMuMzMgNDc0LjY3IDMyOCA0ODAgMzIwIDQ4MEMzMjAgNDgwIDMyMCA0ODAgMzIwIDQ4MEMzMTIgNDgwIDMwNi42NyA0NzQuNjcgMzA2LjY3IDQ2Ni42N0MzMDYuNjcgNDQ4IDMwNi42NyAyOTguNjcgMzA2LjY3IDI4MEMzMDYuNjcgMjcyIDMxMiAyNjYuNjcgMzIwIDI2Ni42N0MzMjAgMjY2LjY3IDMyMCAyNjYuNjcgMzIwIDI2Ni42N1oiIGlkPSJjM25JZVF3R3llIj48L3BhdGg+PHBhdGggZD0iTTMyMCAxNjBDMzA1LjI3IDE2MCAyOTMuMzMgMTcxLjk0IDI5My4zMyAxODYuNjdDMjkzLjMzIDIwMS4zOSAzMDUuMjcgMjEzLjMzIDMyMCAyMTMuMzNDMzM0LjczIDIxMy4zMyAzNDYuNjcgMjAxLjM5IDM0Ni42NyAxODYuNjdDMzQ2LjY3IDE3MS45NCAzMzQuNzMgMTYwIDMyMCAxNjBaIiBpZD0iYzI3OVNlbmw1WiI+PC9wYXRoPjwvZGVmcz48Zz48Zz48Zz48dXNlIHhsaW5rOmhyZWY9IiNnMmk4cHNaSVJGIiBvcGFjaXR5PSIxIiBmaWxsPSIjMDAwMDAwIiBmaWxsLW9wYWNpdHk9IjAiPjwvdXNlPjxnPjx1c2UgeGxpbms6aHJlZj0iI2cyaThwc1pJUkYiIG9wYWNpdHk9IjEiIGZpbGwtb3BhY2l0eT0iMCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1vcGFjaXR5PSIwIj48L3VzZT48L2c+PC9nPjxnPjx1c2UgeGxpbms6aHJlZj0iI2M3WGlYWW9wcGIiIG9wYWNpdHk9IjEiIGZpbGw9IiM4ZDhkOGQiIGZpbGwtb3BhY2l0eT0iMSI+PC91c2U+PGc+PHVzZSB4bGluazpocmVmPSIjYzdYaVhZb3BwYiIgb3BhY2l0eT0iMSIgZmlsbC1vcGFjaXR5PSIwIiBzdHJva2U9IiMwMDAwMDAiIHN0cm9rZS13aWR0aD0iMSIgc3Ryb2tlLW9wYWNpdHk9IjAiPjwvdXNlPjwvZz48L2c+PGc+PHVzZSB4bGluazpocmVmPSIjYzNuSWVRd0d5ZSIgb3BhY2l0eT0iMSIgZmlsbD0iIzhkOGQ4ZCIgZmlsbC1vcGFjaXR5PSIxIj48L3VzZT48Zz48dXNlIHhsaW5rOmhyZWY9IiNjM25JZVF3R3llIiBvcGFjaXR5PSIxIiBmaWxsLW9wYWNpdHk9IjAiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLXdpZHRoPSIxIiBzdHJva2Utb3BhY2l0eT0iMCI+PC91c2U+PC9nPjwvZz48Zz48dXNlIHhsaW5rOmhyZWY9IiNjMjc5U2VubDVaIiBvcGFjaXR5PSIxIiBmaWxsPSIjOGQ4ZDhkIiBmaWxsLW9wYWNpdHk9IjEiPjwvdXNlPjxnPjx1c2UgeGxpbms6aHJlZj0iI2MyNzlTZW5sNVoiIG9wYWNpdHk9IjEiIGZpbGwtb3BhY2l0eT0iMCIgc3Ryb2tlPSIjMDAwMDAwIiBzdHJva2Utd2lkdGg9IjEiIHN0cm9rZS1vcGFjaXR5PSIwIj48L3VzZT48L2c+PC9nPjwvZz48L2c+PC9zdmc+);
}
.noti-banner.validation .nb-content .nb-icon {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNC4xLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHZpZXdCb3g9IjAgMCAyNCAyNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMjQgMjQ7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOm5vbmU7fQ0KCS5zdDF7ZmlsbDojNzQwOEFCO30NCgkuc3Qye2ZpbGwtcnVsZTpldmVub2RkO2NsaXAtcnVsZTpldmVub2RkO2ZpbGw6Izc0MDhBQjt9DQo8L3N0eWxlPg0KPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQo8ZyBpZD0iU3ltYm9scyI+DQoJPGcgaWQ9IkFsZXJ0LV94MkZfLWRlc2t0b3AtX3gyRl8taW5mby1feDJGXy1iaWctX3gyRl8taWNvbi1feDJCXy1idXR0b24iIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMC4wMDAwMDAsIC0zMC4wMDAwMDApIj4NCgkJPGcgaWQ9IkluZm8taWNvbiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjAuMDAwMDAwLCAzMC4wMDAwMDApIj4NCgkJCTxyZWN0IGlkPSJQSCIgeT0iMCIgY2xhc3M9InN0MCIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+DQoJCQk8cGF0aCBpZD0iT3ZhbC0xMSIgY2xhc3M9InN0MSIgZD0iTTEyLDIzYzYuMSwwLDExLTQuOSwxMS0xMVMxOC4xLDEsMTIsMVMxLDUuOSwxLDEyUzUuOSwyMywxMiwyM3ogTTEyLDI0QzUuNCwyNCwwLDE4LjYsMCwxMg0KCQkJCVM1LjQsMCwxMiwwczEyLDUuNCwxMiwxMlMxOC42LDI0LDEyLDI0eiIvPg0KCQkJPHBhdGggaWQ9IlJlY3RhbmdsZSIgY2xhc3M9InN0MiIgZD0iTTEyLDEwTDEyLDEwYzAuMywwLDAuNSwwLjIsMC41LDAuNXY3YzAsMC4zLTAuMiwwLjUtMC41LDAuNWwwLDBjLTAuMywwLTAuNS0wLjItMC41LTAuNXYtNw0KCQkJCUMxMS41LDEwLjIsMTEuNywxMCwxMiwxMHoiLz4NCgkJCTxjaXJjbGUgaWQ9Ik92YWwtMTYiIGNsYXNzPSJzdDIiIGN4PSIxMiIgY3k9IjciIHI9IjEiLz4NCgkJPC9nPg0KCTwvZz4NCjwvZz4NCjwvc3ZnPg0K);
}
.noti-banner.error .nb-content .nb-icon, .noti-banner.danger .nb-content .nb-icon {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjMycHgiIGhlaWdodD0iMzJweCIgdmlld0JveD0iMCAwIDMyIDMyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCA0OS4yICg1MTE2MCkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+YWxlcnRfZXJyb3JfaWNvbjwvdGl0bGU+CiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4KICAgIDxkZWZzPjwvZGVmcz4KICAgIDxnIGlkPSIxLUNvbXBvbmVudHMiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSJBbGVydHMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yOTYuMDAwMDAwLCAtNTkyLjAwMDAwMCkiPgogICAgICAgICAgICA8ZyBpZD0iZXJyb3IiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI2Ni4wMDAwMDAsIDU1Mi4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSJ2YWxpZGF0aW9uIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0icG9wdXAiPgogICAgICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iSWNvbi0vLWdlbmVyYWwtLy1JY29uLXdhcm5pbmctY2lyY2xlIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzMC4wMDAwMDAsIDQwLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IkluZm8iPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxjaXJjbGUgaWQ9Ik92YWwtMTEiIHN0cm9rZT0iI0NDMzMzMyIgY3g9IjE2IiBjeT0iMTYiIHI9IjE1LjUiPjwvY2lyY2xlPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cC0yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNC42NjY2NjcsIDguMDAwMDAwKSIgZmlsbD0iI0NDMzMzMyI+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUiIHg9IjAuNjY2NjY2NjY3IiB5PSIwIiB3aWR0aD0iMS4zMzMzMzMzMyIgaGVpZ2h0PSIxMC42NjY2NjY3IiByeD0iMC42NjY2NjY2NjciPjwvcmVjdD4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPGNpcmNsZSBpZD0iT3ZhbC0xNiIgY3g9IjEuMzMzMzMzMzMiIGN5PSIxNC42NjY2NjY3IiByPSIxLjMzMzMzMzMzIj48L2NpcmNsZT4KICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==);
}

.nb-content.rounded-0 { border-radius: 0; }

.noti-banner-thin .nb-content { padding:10px; text-align: left; }
.noti-banner-thin .nb-content .nb-heading { font-size: 1.40rem; }
.noti-banner-thin .nb-content .nb-icon { width: 42px; height: 42px; }

.porto.noti-banner-thin .nb-content { font-weight: 400; }
.porto.noti-banner-thin .nb-content .nb-heading { font-weight: 400; font-size: 20px; }


.noti-banner .d-flex {
    display: flex !important;
}
.noti-banner .align-items-center {
    align-items: center !important;
}
