/* ========================================================================= */
/*                            Allgemeine Einstellungen                       */
/* ========================================================================= */
* {
  box-sizing: block;
}

body {
	background-color: white;
	width:100vw;
	height:100vh;
	margin-top: -25px; 
	font-size: 13px; 
/*	margin-left: 0; */
}


/* ========================================================================= */
/*                  Groesste Einstellung    (landscape)                      */
/* ========================================================================= */
.grid-container {
  display: grid;
  width: 80vw;
  height: 90vh;
  grid-template-columns: repeat(10,1fr);
  row-gap: 1px;
  column-gap: 1px;
  margin: auto;
  background-color: #5f7399;
}

/* HEADER */
.grid-header-item {
/*  background-color: #5f7399; */
  color: black;
}

.grid-button-home {
  grid-column: 1 / span 2;
}

.button {
 /* display: block; */
  background-color: lightblue;
  border: 2px solid black;
  border-radius: 10px;
  text-align: center;
  font-size: large;
}

.button-home {
  font-size: 1.5em;
	padding: 5px 10px 5px 10px;
  margin-left: 5px; 
  cursor: pointer;
}

.button-home:hover {
  background-color: rebeccapurple;
  color: white;
}

.grid-spielsaison {
  grid-column: 3 / span 4;
  align-content: center;
  color: white;
  font-size: 1.5rem;
  text-align: center;
}

.grid-spieltag {
  grid-column: 7 / span 4;
  align-content: center;
  color: white;
  font-size: 1.5rem;
  text-align: center;
}

#sel_spieltag {
  font-size: 1.5rem;
}

.header-text-hid {
/*	display: none; */ 
}


/* BODY */
.grid-body-termin {
  grid-column: 1 / span 10;
  background-color: lightgray;
  padding-left: 5px;
}

.grid-body-item {
  background-color: whitesmoke;
  color: black;
  font-size: 1.5em;
  align-content: center;
}

.team-home {
  grid-column: 1 / span 3;
  padding-right: 15px;
  text-align: right;
}

.hid-team-long {
	display: inline;
}

.hid-team-short {
	display: none;
}

.goals {
  text-align: center;
  font-weight: bold;
 }

.logo {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding: 0px;
  width: 2.5em;
  height: 2.5em; 
}

.team-guest {
  grid-column: 8 / span 3;
  padding-left: 15px;
  text-align: left;
}

/* ========================================================================= */
/*                  Tablet (min width 1180px landscape)                      */
/* ========================================================================= */
@media screen and (max-width: 1180px) and (orientation: landscape) {
	.grid-container {
	/*	background-color: pink; */
		width: 95vw;
		height: 95vh;
	}

	.header-text-hid {
/*		display: none; */ 
	}
}

/* ========================================================================= */
/*                  Handy (max width 1000px landscape)                       */
/* ========================================================================= */
@media screen and (max-width: 1000px) and (orientation: landscape) {
	.grid-container {
/*		background-color: green; */  
		width: 95vw;
		height: 65vh;
	}

	.grid-body-item {
		font-size: 1.0em;
	}
	
	.button-home {
		font-size: 1.2em;
		padding: 2px 5px 2px 5px;
	}

	.grid-header-text {
		grid-column: 2 / span 6;
	}

	.grid-button-save {
	  align-content: center;
		text-align: right;
		grid-column: 8 / span 3;
	}
	
	#sel_spieltag {
		font-size: 1.2rem;
	}

	.button-save {
		font-size: 1.0rem;
		padding: 2px; 
	}
	
	.digit-buttons {
		font-size: 1.5em;
		height: 1.8em;
	}

	.header-text-hid {
		display: none;  
	}

	.logo {
		width: 2.0em;
		height: 2.0em; 
	}	
}

/* ========================================================================= */
/*                  Handy (max width 949px portrait)                       */
/* ========================================================================= */
@media screen and (max-width: 949px) and (orientation: portrait) {

	.grid-container {
/*		background-color: pink; */ 
		width: 95vw;
		height: 75vh; 
		grid-template-columns: repeat(10,1fr); 
	}

	.grid-header-home {
		grid-column: 1 / span 2;
	}

	.grid-header-text {
		grid-column: 3 / span 5;
	}

	.hid-header-text {
		display: none;
	}
	
	.hid-team-long {
		display: none;
	}

	.hid-team-short {
		display: inline;
	}

	.header-text-hid {
		display: none;  
	}

	.logo-home {
		object-fit: contain;
	}

	.logo-guest {
		object-fit: contain;
	}

	.grid-button-save {
	  align-content: center;
		grid-column: 8 / span 3;
	}
	
	.button-save {
		font-size: 1.0em;
		padding: 2px; 
	}
	
	.grid-body-item {
		font-size: 1.6em;
	}	

	.resultat-gone {
		font-size: 1.6em;
	}
	
}