*,
*:before,
*:after {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

html {
  height: 100%;
}

body {
  position: relative;
  min-height: 100%;
  background-color: #fafaf8;
}

h1 {
  font-size: 3.2em;
  text-align: center;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
li,
a {
  font-family: "Lato", helvetica, sans-serif;
  font-style: normal;
  font-weight: 300;
}

svg {
  color: #fff;
}

.center-element {
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

::-webkit-scrollbar {
  height: 8px;
  width: 8px; /* width of the entire scrollbar */
}

::-webkit-scrollbar-track {
  background: #fff; /* color of the tracking area - prev #4b4f54 */
}

::-webkit-scrollbar-thumb {
  background-color: #b1b4b3;
  border: 3px solid #fff;
  border-radius: 20px;
  transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #65675e;
  border: 2px solid #fff;
}
/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
}
