@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,700;1,400;1,700&display=swap');

body, p, a, div, span, input, button, h1, h2, h3, h4, h5, h6 {
	font-family: 'Roboto', sans-serif;
	color: #fff;
}

body {
	background: #597a9d;
}

img {
	max-width: 100%;
}

.row1 {
  display: flex;
	flex-direction: column;
}

.column1 {
	display: flex;
	justify-content: center;
	padding: 15px;
}

input {
  color: #597a9d !important;
  font-size: 20px;
  padding: 5px 10px;
}

input[type="submit"] {
  background: #597a9d;
  color: #fff !important;
  border: 3px solid #fff;
}

select {
  background: #fff;
  color: #597a9d;
  font-size: 20px;
  padding: 5px 10px;
  border-radius: 20px;
}

.row {
  display: flex;
  flex-direction: row;
	justify-content: space-around;
}

.column2 {
  padding: 20px;
}

.column2 img {
  max-width: 100%;
  width: 350px;
}

.row .column1 img {
  max-width: 350px;
}

.row .column1 {
  flex-direction: column;
}

.logOutButton {
  position: absolute;
  right: 20px;
  top: 75px;
  background: #fff;
  color: #597a9d;
  font-size: 20px;
  border-radius: 20px;
  padding: 5px 10px;
}

header #logo {
  position: absolute;
  width: 175px !important;
  left: 20px;
	display: none;
}

header {
  display: flex;
  justify-content: center;
  height: 175px;
  align-items: center;
}

.saveScorePage #scoreAchieved {
  display: inline;
}

.saveScorePage .column1 {
  display: inline;
  font-size: 20px;
  margin: 20px;
}

.saveScorePage button {
  background: #fff !important;
  color: #597a9d;
  font-size: 20px;
  padding: 5px 10px;
}

th, td {
  padding: 10px;
  font-size: 20px;
  border: 1px solid #fff;
}