/* custom css */

/* Color the world */
.red    { color: #dc1414; }
.red-bg { background-color: #dc1414; }
.orange { color: #FF7A00; }
.yellow { color: #D3D300; }
.green  { color: #0CBE00; }
.dark-green  { color: #097f00; }
.blue   { color: #0000ff; }
.white  { color: #ffffff; }
.grey   { color: #8a8a8c; }
.black  { color: #000000; }


html, body {
    font-family: 'Kanit', sans-serif;
    font-weight: 400;
    font-size: 1rem;
}

.footer {
    /*border-top: 1px solid #e5e5e5;*/
    margin-top: 120px;
    height: 60px; /* Set the fixed height of the footer here */
    line-height: 60px; /* Vertically center the text there */
}
.footer span {
    margin: 0 10px;
    color: #7f7f7f;
    font-size: 0.8rem;
}

a {
    text-decoration: underline;
}

.clickme {
    cursor: pointer;
}

.justified {
    text-align: justify;
}

.form-error {
    color: #d00000;
    font-size: 0.8rem;
}

.formspacer {
    width: 100%;
    height: 1rem;
}

.backstretch {
    opacity:0.07;
    filter:alpha(opacity=7);
}

.loading-spinner {
    color: silver;
    font-size: 3rem;
}

@-webkit-keyframes rotate { to { -webkit-transform: rotate(360deg); } }
@keyframes         rotate { to {         transform: rotate(360deg); } }
.rotating {
  -webkit-animation: rotate 3s linear infinite;
          animation: rotate 3s linear infinite;
}

/* // Navbar stuff */
.navbar.bg-dark {
    background-image: linear-gradient(#4f4f4f, #000000);
    background-repeat: no-repeat;
    filter: none;
}
/* Navbar stuff // */

.select2-selection__rendered {
    line-height: 33px !important;
}
.select2-container .select2-selection--single {
    height: 37px !important;
}
.select2-selection__arrow {
    height: 36px !important;
}

/* // Transitions */
.popup-enter-active, .popup-leave-active {
  transition: all 0.7s;
}
/* Transitions // */

.btn-xs {
    padding: 0.15rem 0.4rem;
    font-size: .8rem;
    line-height: 1.3;
    border-radius: .15rem;
}

/* // VueJS related stuff */
button:disabled {
    color: silver;
    cursor: not-allowed;
}
input[type="file"]:disabled {
    color: silver;
    cursor: not-allowed;
}
/* VueJS related stuff // */