@-webkit-keyframes lazyload {
  0% {
    background-position: -468px 0;
  }
  100% {
    background-position: 468px 0;
  }
}

@keyframes lazyload {
  0% {
    background-position: -468px 0;
  }
  100% {
    background-position: 468px 0;
  }
}

@-webkit-keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.animationSpin {
  -webkit-animation: spin 4s linear infinite;
          animation: spin 4s linear infinite;
}


i.fab {
  width: 34px;
  height: 34px;
}

a {
  text-decoration: none;
}

hr {
  margin: 15px;
}

.banner img {
  -webkit-box-shadow: 1px 1px 3px white;
          box-shadow: 1px 1px 3px white;
  border-radius: 9px;
}
.pointer-cursor{
    cursor:pointer;
}
pre{
    border: 7px solid #ffcdaa;
    border-radius: 9px;
    padding: 3px;
    background-color: black;
    color: white;
    overflow: auto;
    margin: 17px 0;
}
html, body {
  min-height: 100vh;
}
html{
  margin-top: 75px;
}
body {
  font-size: 10pt;
}

body > .container {
  min-height: 55vh;
}

body .lazyload {
  background-repeat: no-repeat;
  -webkit-animation-name: lazyload;
          animation-name: lazyload;
  background-color: #ffff;
  background-image: -webkit-gradient(linear, left top, right top, from(#fefefe), color-stop(20%, #faf8f8), color-stop(40%, #fefefe), to(#fefefe));
  background-image: linear-gradient(to right, #fefefe 0%, #faf8f8 20%, #fefefe 40%, #fefefe 100%);
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}

body img {
  max-width: 100%;
  height: auto;
}

header {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
}

header .d-flex > * {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

header .my-brand {
  font-size: 15pt;
}

header .search {
  border-radius: 17px;
}

nav {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

nav > * {
  margin: 0 3px;
  padding: 1px 5px;
  border-radius: 5px;
  -webkit-box-shadow: 1px 1px 1px #c7c7c7;
          box-shadow: 1px 1px 1px #c7c7c7;
}

main {
  padding: 0 19px;
}

main .date {
  font-size: 10pt;
}

main article {
  line-height: 2;
}

main .share ul {
  list-style: none;
}

aside {
  font-size: 12pt;
  padding: 0 19px;
}

aside ol, aside ul {
  padding: 0;
  list-style-position: inside;
}

aside ol li, aside ul li {
  margin-bottom: 5px;
}

ol li::marker, ul li::marker {
  font-weight: bold;
  font-size: 19px;
  font-style: italic;
  color: #8f8695;
}

footer {
  text-align: center;
  padding: 19px;
  background-color: #10121c;
  color: white;
  font-family: unset;
}

footer a {
  color: white;
}

footer .sosmed a {
  font-size: 15pt;
  color: white;
  margin: 3px 3px 17px;
  padding: 9px;
  border-radius: 50%;
  background-color: #181b26;
  width: 49px;
  height: 49px;
}

main:not(.list) article h2 {
  margin-top: 15px;
  border-left: 7px solid #aeafabb0;
  background-color: #fffbf7;
  padding: 11px 17px;
  font-size: 17pt;
  font-family: 'alata';
  color: #563131;
}

.brand-title {
  font-weight: 600;
  color: #255479;
  font-size: 13pt;
}

.card {
  border-radius: 17px;
}

footer{
    position:sticky;
    top: 100%;
}
nav svg{
     width:24px;height:24px;
}
nav > * {
    margin: 15px 3px;
    padding: 1px 5px;
    border-radius: 5px;
    -webkit-box-shadow: none;
    box-shadow: none;
}
nav a.border, nav span.border{
    border:none!important;
}
nav .px-4{
    padding-left:7px!important;
    padding-right:7px!important;
}
nav .cursor-default{
    color: #01579b;
    font-weight: bold;
}

@media (min-width: 576px) {
  header .my-brand {
    font-size: 15pt;
  }
  header .brand-title {
    font-size: 19pt;
  }
}

@media (min-width: 768px) {
  body {
    font-size: 12pt;
  }
  header .my-brand {
    font-size: 23pt;
  }
}
/*# sourceMappingURL=mystyle.css.map */