update styles

cl-theme/static/css/style.css

@@ -15,6 +15,7 @@
     src: local("Roboto Condensed"), local("RobotoCondensed-Regular"), url(../fonts/roboto/roboto-latin.woff2) format("woff2");
     unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
+
 /* html/body/font-fixes */
 body, input, textarea, .button {
     font-family: 'Roboto Condensed', Nimbus Sans, sans-serif;
@@ -40,9 +41,11 @@ label[for=navbar-toggle-cbox] {
 .navbar {
     background-color: #0c0f0f;
 }
+
 .navbar a {
     color: whitesmoke;
 }
+
 .navbar.is-social-center {
     align-items: stretch;
     background-color: transparent;
@@ -62,10 +65,12 @@ label[for=navbar-toggle-cbox] {
     -ms-flex-negative: 0;
     -ms-flex-positive: 0;
 }
+
 .navbar.is-social-center > a.navbar-item {
     color: #4a4a4a;
     background-color: transparent;
 }
+
 .navbar.is-social-center > a.navbar-item:hover {
     color: #dd7325;
 }
@@ -74,12 +79,15 @@ label[for=navbar-toggle-cbox] {
 .main-header {
     box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
 }
+
 .main-header .title {
     color: whitesmoke;
 }
+
 .main-header .subtitle {
     color: #dd7325;
 }
+
 .main-header .hero {
     background-color: #161c1c;
 }
@@ -120,146 +128,191 @@ video {
     background: #000000;
     color: #cccccc;
 }
+
 .highlight pre {
     font-size: 75%;
 }
+
 .highlight .hll {
     background-color: #222222;
 }
+
 .highlight .c {
     color: #4E4F8E;
 }
+
 .highlight .err {
     color: #cccccc;
     border: 1px solid #FF0000;
 }
+
 .highlight .esc, .highlight .g {
     color: #cccccc;
 }
+
 .highlight .k {
     color: #cdcd00;
 }
+
 .highlight .l, .highlight .n {
     color: #cccccc;
 }
+
 .highlight .o {
     color: #3399cc;
 }
+
 .highlight .x {
     color: #cccccc;
 }
+
 .highlight .p {
     color: #fac0ba;
 }
+
 .highlight .ch, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1 {
     color: #4E4F8E;
 }
+
 .highlight .cs {
     color: #cd0000;
     font-weight: bold;
 }
+
 .highlight .gd {
     color: #cd0000;
 }
+
 .highlight .ge {
     color: #cccccc;
     font-style: italic;
 }
+
 .highlight .gr {
     color: #FF0000;
 }
+
 .highlight .gh {
     color: #4E4F8E;
     font-weight: bold;
 }
+
 .highlight .gi {
     color: #00cd00;
 }
+
 .highlight .go {
     color: #888888;
 }
+
 .highlight .gp {
     color: #4E4F8E;
     font-weight: bold;
 }
+
 .highlight .gs {
     color: #cccccc;
     font-weight: bold;
 }
+
 .highlight .gu {
     color: #800080;
     font-weight: bold;
 }
+
 .highlight .gt {
     color: #0044DD;
 }
+
 .highlight .kc {
     color: #cdcd00;
 }
+
 .highlight .kd {
     color: #00cd00;
 }
+
 .highlight .kn {
     color: #cd00cd;
 }
+
 .highlight .kp, .highlight .kr {
     color: #cdcd00;
 }
+
 .highlight .kt {
     color: #00cd00;
 }
+
 .highlight .ld {
     color: #cccccc;
 }
+
 .highlight .m {
     color: #cd00cd;
 }
+
 .highlight .s {
     color: #ffc400;
 }
+
 .highlight .na {
     color: #cccccc;
 }
+
 .highlight .nb {
     color: #cd00cd;
 }
+
 .highlight .nc {
     color: #00cdcd;
 }
+
 .highlight .no, .highlight .nd, .highlight .ni {
     color: #cccccc;
 }
+
 .highlight .ne {
     color: #666699;
     font-weight: bold;
 }
+
 .highlight .nf, .highlight .nl, .highlight .nn, .highlight .nx, .highlight .py {
     color: #cccccc;
 }
+
 .highlight .nt {
     color: orange;
 }
+
 .highlight .nv {
     color: #00cdcd;
 }
+
 .highlight .ow {
     color: #cdcd00;
 }
+
 .highlight .w {
     color: #cccccc;
 }
+
 .highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .mo {
     color: #cd00cd;
 }
+
 .highlight .sb, .highlight .sc, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .si, .highlight .sx, .highlight .sr, .highlight .s1, .highlight .ss {
     color: #FFEA00;
 }
+
 .highlight .bp {
     color: #cd00cd;
 }
+
 .highlight .vc, .highlight .vg, .highlight .vi {
     color: #00cdcd;
 }
+
 .highlight .il {
     color: #cd00cd;
 }
@@ -292,6 +345,7 @@ video {
 .card {
     background-color: #161c1c;
 }
+
 .card .card-content-footer {
     color: #7a7a7a;
 }
@@ -319,10 +373,12 @@ video {
     padding-bottom: 30px;
     border-bottom: 1px solid #dd7325;
 }
+
 .card-content-text p {
     color: whitesmoke;
     font-size: 1em;
 }
+
 .card-content-text label {
     color: whitesmoke;
     font-weight: 100;
@@ -358,9 +414,11 @@ video {
     margin: 1.5rem 1rem;
     padding: 1.5rem 1rem;
 }
+
 .content blockquote p {
     display: contents;
 }
+
 .content blockquote:before {
     opacity: 0.5;
     content: open-quote;
@@ -373,6 +431,7 @@ video {
 * {
     box-sizing: border-box;
 }
+
 *:after, *:before {
     box-sizing: border-box;
 }
@@ -384,6 +443,7 @@ legend {
 .content dl, .content dt, .content dd, .content h2, .content h3, .content h4, .content h5, .content h6 {
     color: white;
 }
+
 .content.social {
     margin-bottom: 0rem;
 }
@@ -391,24 +451,29 @@ legend {
 a {
     color: #0099e5;
 }
+
 a:hover {
     text-decoration: none;
     color: #ffc20e;
 }
+
 a.navbar-item.is-tab.is-active {
     border-bottom-color: #dd7325;
     border-width: 2px;
     color: whitesmoke;
 }
+
 a.navbar-item.is-tab:hover {
     border-bottom-color: #dd7325;
     border-width: 2px;
     color: #dd7325;
 }
+
 a.navbar-item:hover {
     color: #dd7325;
     background-color: transparent;
 }
+
 a.pagination-previous.disabled, a.pagination-next.disabled {
     background: #0c0f0f;
     color: white;
@@ -419,10 +484,6 @@ a.pagination-previous.disabled, a.pagination-next.disabled {
     opacity: .5;
 }
 
-.pagination-list {
-    margin-bottom: 1.5rem;
-}
-
 h4 > a:hover {
     color: white;
 }
@@ -433,6 +494,10 @@ h4 > a:hover {
     color: rgba(0, 0, 0, 0.7);
 }
 
+.button {
+    vertical-align: unset;
+}
+
 .button:hover, .pagination .is-current, .pagination-link:hover {
     background-color: #dd7325;
     border-color: transparent;
@@ -450,13 +515,14 @@ h4 > a:hover {
 }
 
 .pagination-style-custom {
-    padding-top: 50px;
+    margin-top: 50px;
 }
 
 .footer {
     background-color: #0c0f0f;
     color: whitesmoke;
 }
+
 .footer a {
     color: #dd7325;
 }
@@ -476,16 +542,20 @@ h4 > a:hover {
 .comments-wrapper p {
     color: whitesmoke;
 }
+
 .comments-wrapper small {
     color: #7a7a7a;
 }
+
 .comments-wrapper strong {
     color: whitesmoke;
     font-weight: 100;
 }
+
 .comments-wrapper a {
     color: #dd7325;
 }
+
 .comments-wrapper .media .media, .comments-wrapper .media + .media {
     border-top: 1px solid #dd7325;
 }
@@ -495,6 +565,7 @@ h4 > a:hover {
         background-color: transparent;
     }
 }
+
 @media screen and (max-width: 600px) {
     .main-content {
         padding: 0rem;