diff --git a/layouts/shortcodes/notice.html b/layouts/shortcodes/notice.html
index e4a8c8e..be729aa 100644
--- a/layouts/shortcodes/notice.html
+++ b/layouts/shortcodes/notice.html
@@ -1,7 +1,11 @@
-{{- $noticeType := .Get 0 -}}
 {{/* Available notice types: warning, info, note, tip */}}
+{{- $noticeType := .Get 0 -}}
+{{/* Count how many times we've called this shortcode and load the css if it's the first time */}}
+{{- if not ($.Page.Scratch.Get "noticecount") -}}
 <style type="text/css">.notice{padding:18px;line-height:24px;margin-bottom:24px;border-radius:4px;color:#444;background:#e7f2fa}.notice p:last-child{margin-bottom:0}.notice-title{margin:-18px -18px 12px;padding:4px 18px;border-radius:4px 4px 0 0;font-weight:700;color:#fff;background:#6ab0de}.notice-title:before{margin-right:8px;font-family:FontAwesome;font-weight:400}.notice.warning .notice-title{background:rgba(217,83,79,.9)}.notice.warning .notice-title:before{content:'\f071'}.notice.warning{background:#fae2e2}.notice.info .notice-title{background:#f0b37e}.notice.info .notice-title:before{content:'\f05a'}.notice.info{background:#fff2db}.notice.note .notice-title{background:#6ab0de}.notice.note .notice-title:before{content:'\f06a'}.notice.note{background:#e7f2fA}.notice.tip .notice-title{background:rgba(92,184,92,.8)}.notice.tip .notice-title:before{content:'\f058'}.notice.tip{background:#e6f9e6}</style>
+{{- end -}}
+{{- $.Page.Scratch.Add "noticecount" 1 -}}
 <div class="notice {{ $noticeType }}" {{ if len .Params | eq 2 }} id="{{ .Get 1 }}" {{ end }}>
-<p class="first notice-title">{{ i18n $noticeType }}</p>
+<p class="first notice-title">{{- i18n $noticeType -}}</p>
 {{- .Inner -}}
 </div>