@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600;1,700;1,800&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

:root {
  scroll-behavior: auto;
  --background-colour: #ffffff;
  --darker-blue-1: #a2d7e4;
  --darker-blue-2: #3590d5;
  --light-blue-1: rgb(220,256,256);
}

.main-base-class {
  width: 100%;
  background-color: var(--background-colour);
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: normal;
  font-style: normal;
  font-size:1rem;
  touch-action: manipulation;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
  
h1, h2, h3, h4, h5, h6 {
  font-weight: bold;
}

h1 {
  font-size: 3rem;
}
/* Footer CS */

footer {
  margin-top: 1rem;
  margin-bottom: 1rem;
  flex-shrink: 0;
  width: 100%;
  color: grey;
  text-align: center;
  font-size: 0.8rem ;
}

footer > a {
  color: inherit;
}

/* Navbar CSS */

#navbarNav {
  font-size: 1.2rem;
}

#nav-profile-dropdown {
  background-color: white;
}

/* Organisational CSS */

.outer-container {
  flex: 1 0 auto;
}

#content-block-container {
  margin-top: 1.5rem;
}

.centre-div {
  text-align: center;
}

.main-div {
  max-width: 1200px;
  margin: 0 auto;
}

.narrow-main-div {
  max-width: 600px;
}

.profile-pic-form {
  max-width: 80%;
  max-height: 50rem;
  height: auto; width: auto;
  margin-top: 1em;
  margin-bottom: 1em;
}

.wide-submit-btn {
  width: 100%;
}

.dropdown-menu {
  background-color: var(--background-blue);
  text-align: center;
}

p {
  margin-bottom: 0.5rem;
}

.p-no-bottom {
  margin-bottom: 0rem;
}

.bg-info {
  color: white;
  background-color: #049ab8;
  border-color: #049ab8;
}

/* Button CSS */

.btn-info {
  color: white;
  background-color: #049ab8;
  border-color: #049ab8;
}

.btn-info:hover {
  color: white;
  background-color: #016d83;
  border-color: #016d83;
}

.btn-info:focus {
  color: white;
  background-color: #016d83;
  border-color: #016d83;
}

.btn-warning {
  color: white;
  background-color: #e89700;
  border-color: #e89700;
}

.btn-warning:hover {
  color: white;
  background-color: #c47f00;
  border-color: #c47f00;
}

.btn-warning:focus {
  color: white;
  background-color: #c47f00;
  border-color: #c47f00;
}

#players-cm-a {
  color: black;
  text-decoration: none;
  vertical-align: middle;
  font-size: 1.2rem;
}

.i-margin-right {
  margin-right: 0.3rem;
}