html {
  font-size: 14px;
  background-color: #3E737CFF;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  font-family: 'OpenSans-Regular', Courier, monospace;
  color: #CBF7FF;
  background-color: #71C8D6;
  background-image: url("/imgs/ark-modding-big.jpg");
  background-position: center;
  background-size: cover;
  background-blend-mode: multiply;
  min-height: 100vh;
}

main {
  padding: 10px;
  background-color: #0b1c22CC;
  border: 1px solid #59D9FFFF !important;
  border-radius: 5px;
}

footer {
  padding: 10px;
  color: #CBF7FF;
  background-color: #26687C;
  border-top: 1px solid #59D9FFFF !important;
}

h1,
h2,
h3,
h4 {
  font-family: 'AlegreyaSansSC-Bold', Courier, monospace;
}

a {
  color: #59D9FFFF;
}

a:hover,
a:focus {
  color: #FFFFFFFF
}

.sec-dark {
  background-color: #3E737C;
}

.navbar {
  font-family: 'AlegreyaSansSC-Bold', Courier, monospace;
  background-color: #26687C;
  border-bottom: 1px solid #59D9FFFF !important;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28203, 247, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.nav-link,
.navbar-brand {
  color: #CBF7FFFF;
}

.nav-link:hover,
.navbar-brand:hover,
.nav-link:focus,
.navbar-brand:focus {
  color: #59D9FFFF;
}

.btn-primary {
  color: #CBF7FFFF;
  background-color: #26687CFF;
  border-color: #26687CFF;
}

.btn-primary:hover,
.btn-primary:focus {
  color: #26687CFF;
  background-color: #CBF7FFFF;
  border-color: #CBF7FFFF;
}

.main-logo {
  width: 50%;
}