/*
	* {
	 font-family: 'Raleway', sans-serif;
	 font-size: 20px;
 box-sizing: border-box;// samo width height brez padding and borders
 
	 //display:inline-block; v liniji, upošteva width height = inline; block;
	
	//box-sizing: content-box;     width height + padding + borders 
}
*/

.schedule {
  display: grid;
  gap: 8px;
}

.day {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 6px;
  padding: 10px;
  text-align: center;
}

.day-title {
  background: #e6e6e6;
  font-weight: bold;
  padding: 5px;
  border-radius: 4px;
}

.place {
  font-style: italic;
  margin: 5px 0;
}

.time {
  margin: 3px 0;
}

.time:not(:first-of-type) {
  border-top: 1px solid #aaa;
  padding-top: 5px;
  margin-top: 5px;
}

/* Desktop: days side by side */
@media (min-width: 770px) {
  .schedule {
    grid-template-columns: repeat(4, 1fr); /* 4 days side by side */
  }
}



/*NOVA KODA*/
/*
.item1 { grid-area: A1; }
.item2 { grid-area: B1; }
.item3 { grid-area: C1; }
.item4 { grid-area: D1; }
.item5 { grid-area: E1; }
.item6 { grid-area: F1; }
.item7 { grid-area: G1; }  
.item8 { grid-area: H1; }
.item9 { grid-area: A2; }
.item10 { grid-area: B2; }
.item11 { grid-area: C2; }
.item12 { grid-area: D2; }
.item13 { grid-area: E2; }
.item14 { grid-area: F2; }
.item15 { grid-area: G2; }  
.item16 { grid-area: H2; }
.item17 { grid-area: A3; }
.item18 { grid-area: B3; }
.item19 { grid-area: C3; }
.item20 { grid-area: D3; }
.item21 { grid-area: E3; }
.item22 { grid-area: F3; }
.item23 { grid-area: G3; }  
.item24 { grid-area: H3; }
.item25 { grid-area: A4; }
.item26 { grid-area: B4; }
.item27 { grid-area: C4; }
.item28 { grid-area: D4; }
.item29 { grid-area: E4; }
.item30 { grid-area: F4; }
.item31 { grid-area: G4; }  
.item32 { grid-area: H4; }


.grid-container {
    display:grid;
        grid-template-areas:
            'A1 B1 A2 B2 A3 B3 A4 B4'
            'C1 D1 C2 D2 C3 D3 C4 D4'
            'E1 F1 E2 F2 E3 F3 E4 F4'
            'G1 H1 G2 H2 G3 H3 G4 H4';
    grid-gap:5px;
    background-color: rgba(255,255,255,0.95);
	padding: 5px;
}

@media only screen and (min-width: 770px) {

 .grid-container { grid-template-columns: 100px repeat(7, 1fr); }
    div.item7 { display: none; } 
	div.item9 { display: none; } 
	div.item11 { display: none; } 
	div.item13 { display: none; } 
	div.item15 { display: none; } 
	div.item17 { display: none; } 
	div.item19 { display: none; } 
	div.item20 { display: none; } 
	div.item21 { display: none; } 
	div.item26 { display: none; } 
	div.item28 { display: none; } 
	div.item30 { display: none; } 
}

@media only screen and (max-width: 770px) {
 .grid-container {
    display: grid;
	grid-template-columns: 60px 1fr;
	grid-template-areas:
        'A1 B1'
        'C1 D1'
        'E1 F1'
		'G1 H1'
        'A2 B2'
        'C2 D2'
        'E2 F2'
		'G2 H2'
        'A3 B3'
        'C3 D3'
        'E3 F3'
		'G3 H3'
        'A4 B4'
        'C4 D4'
        'E4 F4'
		'G4 H4';

	grid-gap: 5px;
    background-color: rgba(255,255,255,0.95);
    padding: 5px;
    }
}

.grid-container > div {
    background-color: rgba(255, 255, 255, 0.8);
    text-align: center;
    padding: 10px 0px;
 // font-size: 30px;
}
*/

/*NOVA KODA KONEC*/

/*STARA KODA*/

/*

.item1 { grid-area: A; }
.item2 { grid-area: B; }
.item3 { grid-area: C; }
.item4 { grid-area: D; }
.item5 { grid-area: E; }
.item6 { grid-area: F; }
.item7 { grid-area: G; }  
.item8 { grid-area: H; }
.item9 { grid-area: I; }
.item10 { grid-area: J; }
.item11 { grid-area: K; }
.item12 { grid-area: L; }
.item13 { grid-area: M; }
.item14 { grid-area: N }
.item15 { grid-area: O; }
.item16 { grid-area: P; }
.item17 { grid-area: R; }
.item18 { grid-area: S; }
.item19 { grid-area: T; }
.item20 { grid-area: U; }
.item21 { grid-area: V; }
.item22 { grid-area: Z; }
.item23 { grid-area: X; }
.item25 { grid-area: Q; }

.item26 { grid-area: g1; }
.item27 { grid-area: h1; }
.item28 { grid-area: i1; }
.item29 { grid-area: j1; }
.item30 { grid-area: k1; }
.item31 { grid-area: z1; }
.item32 { grid-area: l1; }

	
.grid-container {
  display: grid;
	 grid-template-areas:
    'A B H N h1'
    'C D J P j1'
    'E X L S z1'
		'E F Q Z l1';
  /*'E F Q Z'*/

/*

  grid-gap: 5px;
  background-color: rgba(255,255,255,0.95);
	 padding: 5px;
}

@media only screen and (min-width: 770px) {
 .grid-container { grid-template-columns: 100px repeat(4, 1fr); }
    div.item9 { display: none; } 
	div.item11 { display: none; } 
	div.item13 { display: none; } 
	div.item15 { display: none; } 
	div.item17 { display: none; } 
	div.item19 { display: none; } 
	div.item21 { display: none; } 
	div.item23 { display: none; } 
	div.item25 { display: none; } 
	div.item27 { display: none; } 
	div.item29 { display: none; } 
	div.item31 { display: none; } 
}

@media only screen and (max-width: 770px) {
	div.item24 { display: none;} 
	div.item23 { display: none;} 
	div.item31 { display: none;} 
 .grid-container {
  display: grid;
	grid-template-columns: 60px 1fr;
	grid-template-areas:
    'A B'
    'C D'
    'E F'
		'G H'
		'I J'
		'K L'
		'M N'
		'O P'
		'R S'
		'V Z'
		'g1 h1'
		'i1 j1'
		'k1 l1';
		grid-gap: 5px;
    background-color: rgba(255,255,255,0.95);
  padding: 5px;
}}

.grid-container > div {
  background-color: rgba(255, 255, 255, 0.8);
  text-align: center;
  padding: 10px 0px;
 // font-size: 30px;
}

*/

/*STARA KODA KONEC*/

   /* Poletna tabela */
.myitem1 { grid-area: myA; }
.myitem2 { grid-area: myB; }
.myitem3 { grid-area: myC; }
.myitem4 { grid-area: myD; }
.myitem5 { grid-area: myE; }
.myitem6 { grid-area: myF; }
.myitem7 { grid-area: myG; }  
.myitem8 { grid-area: myH; }
.myitem9 { grid-area: myI; }
.myitem10 { grid-area: myJ; }
.myitem11 { grid-area: myK; }
.myitem12 { grid-area: myL; }

.grid-container2 {
  display: grid;
	grid-template-areas:
    'myA  myB myH'
    'myC  myD myJ'
    'myE  myF myL';
  grid-gap: 5px;
   background-color: rgba(255,255,255,0.95);
  padding: 5px;
}
@media only screen and (min-width: 770px) {
	.grid-container2 { grid-template-columns: 100px repeat(2, 1fr); }
  div.myitem7 { display: none; } 
	div.myitem9 { display: none; } 
	div.myitem11 { display: none; } 
	}
@media only screen and (max-width: 770px) {
 .grid-container2 {
  display: grid;
	grid-template-columns: 60px 1fr;
 grid-template-areas:
    'myA myB'
    'myC myD'
    'myE myF'
		'myG myH'
		'myI myJ'
		'myK myL'	;
		grid-gap: 5px;
    background-color: rgba(255,255,255,0.95);
  padding: 5px;
}}
.grid-container2 > div {
  background-color: rgba(255, 255, 255, 0.8);
  text-align: center;
  padding: 10px 0px;
  //font-size: 30px;
}

div.item1, div.item2, div.item7, div.item8, div.item13, div.item14, div.item26, div.item27,
div.myitem1, div.myitem2, div.myitem7, div.myitem13, div.myitem8 {
background-color: #e6e6e6;
font-weight: bold;
}