@font-face {
     font-family: "Ubuntu";
     src: url("/bundles/deblanblog/skin2018/frontoffice/fonts/ubuntu-font-family-0.83/Ubuntu-L.ttf");
}
 li, p {
     -webkit-hyphens: auto;
     -moz-hyphens: auto;
     -ms-hyphens: auto;
     -o-hyphens: auto;
     hyphens: auto;
}
 code mark {
     color: inherit;
     background: #547682;
}
 a:focus .logo-svg * {
     fill: #ccc;
}
 .page {
     min-height: 100vh;
     background: #fff;
     font-family: Ubuntu;
}
 .no-margin {
     margin: 0;
}
 .navigation {
     padding-top: 35px;
     font-size: 15px;
}
 .navigation ul {
     margin: 0;
     padding: 0;
     list-style: none;
}
 .navigation li {
     margin: 0 0 3px 0;
     padding: 0;
}
 .navigation svg {
     display: inline-block;
     height: 21px;
     width: 15px;
     vertical-align: top;
     margin-right: 3px;
}
 .navigation a {
     color: #fff;
     display: block;
     padding: 12px 15px;
    /*background: #3c3c3c;
    */
     background: #5d5e68;
}
 .navigation a:hover, .navigation a.active, .navigation a:focus {
     background: #858795;
}
 .small-menu {
     background: #454651;
     padding: 5px;
     position: fixed;
     bottom: 0;
     width: 100%;
}
 .small-menu .navigation {
     padding-top: 0;
     float: right;
}
 .small-menu .navigation a {
     margin-left: 2px;
}
 .small-menu img {
     padding: 10px;
}
 .wide-menu {
     width: 230px;
     background: linear-gradient(to bottom, #454651 0%, #373841 500px);
     padding: 34px 25px;
     min-height: calc(100vh - 130px);
}
 .wide-menu .navigation svg {
     margin-right: 7px;
}
 .header {
     padding: 30px;
     background: linear-gradient(to bottom, #48a8ce 0%, #0269a0 100%);
     color: #fff;
}
 .fixed-menu {
     position: fixed;
     width: calc(230px - 50px);
}
 .content {
     width: calc(100% - 230px);
}
 .header .h1 {
     font-weight: normal;
     font-size: 24px;
}
 .header .h3 {
     font-size: 17px;
     font-weight: normal;
     color: #b9d4e3;
}
 .header a {
     color: #fff !important;
}
 .header a:focus {
     color: #2c65b0 !important;
     background: #fff;
}
 .body {
     padding: 25px 40px;
     max-width: 900px;
}
 .body iframe {
     margin-bottom: 25px;
}
 .body img {
     width: auto;
     cursor: zoom-in;
}
 .body a, .body h1, .body h2, .body h3, .body h4, .body h5, .body p, .body ul {
     color: #454651;
}
 .body p a, .body ul a {
     border-bottom: 1px dotted #2c65b0;
}
 .body blockquote {
     border-left: 2px solid #eee;
     margin: 10px;
     padding: 5px 20px;
}
 .body blockquote p {
     margin: 0;
     padding: 0;
}
 .body code {
     color: #c7254e;
}
 .content hr {
     border: 0;
     border-bottom: 1px dashed #ccc;
     background: #b2b3b7;
}
 .reviews {
     padding: 0 40px;
     max-width: 900px;
}
 .reviews hr:first-child {
     margin-bottom: 30px;
}
 .review-body code {
     color: #c7254e;
}
 .review-body pre {
     padding: 10px;
     border: 1px solid #3c3c3c;
     overflow: auto;
     background: #222222;
     color: #f8f8f2;
     font-size: 13px;
}
 .review-body pre code {
     color: #f8f8f2;
     display: inline-block;
     max-width: 100%;
}
 .review-avatar {
     padding-right: 20px;
}
 .review.offset-1 {
     padding-left: 10px;
}
 .review.offset-2 {
     padding-left: 20px;
}
 .review.offset-3 {
     padding-left: 30px;
}
 .review ul {
     margin: 0;
     padding: 0 0 25px 0;
}
 .review a svg {
     display: inline-block;
     height: 21px;
     width: 15px;
     vertical-align: middle;
     margin-right: 3px;
}
 .review .review-header {
     border-bottom: 1px solid #eee;
     padding-bottom: 5px;
     margin-bottom: 5px;
     color: #64656e;
}
 .review .review-body {
     color: #64656e;
     margin-bottom: 10px;
}
 .review .review-body ul {
     margin: 0 !important;
     padding: 0 0 10px 10px !important;
}
 .review .review-body li {
     list-style: disc;
     margin: 0 0 0 15px;
     padding: 0;
}
 .alert {
     padding: 20px;
     border: 1px solid #333;
}
 .alert-success {
     border-color: #9db024;
     background: #c6ff69;
     color: #415f29;
}
 .alert-notice {
     border-color: #2c65b0;
     background: #66e6ff;
     color: #254e5f;
}
 .alert-warning {
     border-color: #b07f29;
     background: #ffd465;
     color: #5f4520;
}
 .alert-error {
     border-color: #b02e2a;
     background: #ff6363;
     color: #5f2521;
}
 .alert-notice-light {
     border-color: #2c65b0;
     background: #d9fffc;
     color: #254e5f;
}
 .body pre {
     padding: 10px;
     border: 1px solid #3c3c3c;
     overflow: auto;
     background: #222222;
     color: #f8f8f2;
     font-size: 13px;
}
 .body pre code {
     color: #f8f8f2;
     display: inline-block;
     max-width: 100%;
}
 .body pre.with-title {
     margin-top: 0;
     border-top-right-radius: 0;
     border-top-left-radius: 0;
}
 .code-title {
     background: #3c3c3c;
     padding: 10px 15px;
     color: #999;
}
 .body-content {
     line-height: 30px;
}
 .quick-image img {
     width: 100%;
     height: 350px;
     background-position: center center;
     background: #f2f2f2 url("/bundles/deblanblog/skin2018/frontoffice/img/quick-post-load.png") no-repeat center center;
     border: 2px solid #dfdfdf;
     border-bottom: 0;
     cursor: pointer;
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
}
 .quick-body {
     padding: 10px;
     border: 2px solid #dfdfdf;
     margin-top: -7px;
     border-bottom-left-radius: 5px;
     border-bottom-right-radius: 5px;
}
 .error_list {
     color: #b02e2a !important;
     padding: 4px 0 !important;
}
 .content-footer {
     font-size: 12px;
     font-weight: bold;
     background: #f6f6f6;
     text-align: center;
     border-top: 1px dotted #ccc;
}
 .content-footer ul {
     padding: 20px;
}
 .links {
     margin: 0;
     padding: 5px 0 0 0;
     text-align: center;
}
 .link {
     background: url("/bundles/deblanblog/skin2018/frontoffice/img/links.png") no-repeat 1000px 0;
     margin: 0 1px;
     display: inline-block;
}
 .link a {
     display: block;
     height: 20px;
     width: 20px;
     overflow: hidden;
     text-indent: 100px;
}
 .links a:focus, .wide-menu a:focus .fixed {
     border: 1px solid #fff;
}
 .link-twitter {
     background-position: 0 0;
}
 .link-rss {
     background-position: -20px 0;
}
 .link-linkedin {
     background-position: -60px 0;
}
 .link-diaspora {
     background-position: -80px 0;
}
 .link-github {
     background-position: -100px 0;
}
 .link-gitnet {
     background-position: -120px 0;
}
 .preview-button {
     cursor: pointer;
     margin-left: 3px;
}
 .content-footer a:focus, .body a:focus, .review a:focus, form a:focus {
     background: #2c65b0;
     color: #fff;
}
 .button:focus {
     background: #333;
}
 .pager a {
     margin: 0 0 0 7px;
}
 @keyframes bounceIn {
     0% {
         opacity: 0;
    }
     50% {
         opacity: 0.9;
    }
     80% {
         opacity: 1;
    }
     100% {
         opacity: 1;
    }
}
 @keyframes knmc {
     0% {
         left: -256px;
    }
     100% {
         left: 150vw;
    }
}
 .knmc {
     animation-name: knmc;
     animation-duration: 15s;
     animation-iteration-count: 1;
}
 .logo-svg {
     animation-name: bounceIn;
     animation-duration: 1s;
}
 .logo-svg {
     animation-name: bounceIn;
     animation-duration: 1s;
}
 @media screen and (max-width: 980px) {
     .quick-image img {
         height: 200px;
    }
}
 @media screen and (max-width: 719px) {
     .content-footer {
         margin-bottom: 40px;
    }
}
 @media screen and (max-width: 550px) {
     .body {
         padding: 10px 10px 20px 10px;
    }
     .reviews {
         padding: 10px 10px 20px 10px;
    }
}
 @media screen and (max-width: 719px) {
     .content {
         width: 100%;
    }
}
 @media screen and (max-width: 380px) {
     .navigation a {
         padding: 7px 10px;
    }
     .small-menu img {
         width: 20px;
         margin-top: 11px;
         padding: 0;
    }
}
Insérer
<div%key%id="gist-5c1ac4e3c58ec-1e260b714f8d029a6297d2519acd771f7b49f97f" class="gist-container"></div>
<script src="https://gist.deblan.org/fr/embedjs/5c1ac4e3c58ec" async></script>