@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500;600;700;800&display=swap');
@import url('https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css');

body {
    font-family: Raleway, sans-serif;
}

.head {
    letter-spacing: 1.0px;
}

.sub {
    opacity: 70%;
    letter-spacing: 1.2px;
}

.is-bold {
    font-weight: 700 !important;
}

.is-white {
    color: white !important;
}

.navbar-item {
    transition-duration: 250ms;
}

.navbar-item:hover {
    transition-duration: 250ms;

    background: transparent !important;
    opacity: 90%;
}

.box {
    background-color: #282828;
}

.card {
    background-color: #282828;
}

.almix-section {
    background: rgb(22, 22, 22);
    padding-top: 50px;
    padding-bottom: 50px;
}

.almix-box {
    border: 1px solid white;
    border-radius: 5px;
}

.almix-footer {
    background: #0A0A0A;
    
    padding-top: 25px;
    padding-bottom: 25px;

    color: white !important;
}

.almix-footer-image {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 40%;
}

.links {
    margin-left: 80px;
    margin-right: 80px;
}

.link {
    color: rgb(206, 206, 206);
    transition-duration: 250ms;
}

.link:hover {
    color: rgb(129, 129, 129);
    transition-duration: 250ms;
}

.footer-copyright {
    text-align: right;
}

.footer-hr {
    background: rgb(255, 255, 255);
}

.footer-title {
    color: rgb(255, 255, 255);
}

img {
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

/* why must bulma make it light mode :/ */
.select option { 
    color: white !important;
    background-color: #424242 !important; 
}

.select select {
    color: white !important;
    background-color: #424242 !important; 
}

.navbar-link:not(.is-arrowless)::after, .select:not(.is-multiple):not(.is-loading)::after {
    border-color: white !important;
}

.textarea {
    background-color: #424242 !important;
    color:rgb(223, 223, 223) !important;
}
.textarea::placeholder {
    color:rgb(133, 133, 133) !important;
}

@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.rotating {
  -webkit-animation: rotating 5s linear infinite;
  -moz-animation: rotating 5s linear infinite;
  -ms-animation: rotating 5s linear infinite;
  -o-animation: rotating 5s linear infinite;
  animation: rotating 5s linear infinite;
}