@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
:root{
	
}
/*render*/
#demo{
	padding:2%;
	background:white;
}
.li{
	font-size:1.4em;
}
.textHigh{
		background-color:#DDE0E3;
		font-size:1.3em;
		border:5px solid black;
		padding:1%;
	}
	
	.odkaz {
		color:#5F9086;
		font-weight:bold;
		font-size:1.8em;
	}
	h1{
		font-family:Roboto;
		font-weight:400;
	}
	h2{
		font-family:Roboto;
		font-weight:200;
	}
	h3,h4,h5,h6,h7{
		font-family:Roboto;
		font-weight:100;
	}
	.text{
		font-size:1.4em;
		font-family:Roboto;
		
	}	
	li{
		font-family:Roboto;
	
	}
/*render*/
body::-webkit-scrollbar {
  width: 15px;
}
body::-webkit-scrollbar-track {
  background: #252525;
}
body::-webkit-scrollbar-thumb {
  background-color: white;
  
}

#cmd::-webkit-scrollbar {
  width: 5px;
}
#cmd::-webkit-scrollbar-track {
  background: #252525;
}
#cmd::-webkit-scrollbar-thumb {
  background-color: #555555;
 
}



#textarea::-webkit-scrollbar {
  width: 5px;
}
#textarea::-webkit-scrollbar-track {
  background: #252525;
}
#textarea::-webkit-scrollbar-thumb {
  background-color: #555555;
  
}
#wasSaved{
	width:100%;
	height:8px;
	background-color:green;
}
body{
	background:linear-gradient(90deg,#95f1d7, #130417);
	background:#D3D4DD;
	color:black;
	margin:0%;
}
a{
	color:black;
	text-decoration:none;
}
#nadpis{
	color:black;
	font-weight:bold;
	font-size:4.5em;
	font-family:Roboto;
	font-weight:300;
}
#nadpisPredmety{
	color:black;

	font-size:1.5em;
font-family:Roboto;
	font-weight:300;
}
#podnadpis{
	color:black;
	font-size:1.3em;
	font-family:Arial;
	font-style:italic;
	
}
footer{
	font-size:1.3em;
	font-family:Arial;
	font-style:italic;
}
#blokIndex{
	display: flex;
    margin: 0% auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	gap:5px;
}
#blokDashboard{
	display: flex;
    margin: 0% auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	gap:5px;
}
#name{
	font-size:3.4em;
	font-weight:bold;
	font-family:Arial;
	
}
#blokUser form{
	border:5px solid black;
	display:flex;
	flex-direction: column;
	padding:2%;
	margin:1%;
	width:25vw;
	gap:5px;
}

	
	
#blokUser form input{
    background-color: #f5f5f5;
    font-size: 1.5em;
   font-family:Roboto;
	font-weight:300;
    padding: 1%;

    text-align: center;
    text-decoration: none; 
    color: black;
}
#blokUser form input[type=submit]{
    background-color: #f5f5f5;
    font-size: 1.5em;
   font-family:Roboto;
	font-weight:300;
    padding: 1%;
    text-align: center;
    text-decoration: none; 
    color: black;
	font-weight:bold;
}
#info{
	font-size:1.5em;
	font-style:italic;
	font-family:Arial;
	margin:1%;
}
#blokUser{
	display: flex;
    margin: 0% auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	gap:5px;
}
#blokDashboard input{
	
	
	background-color: #f5f5f5;
    text-align: center;
    font-size: 1.5em;
   font-family:Roboto;
	font-weight:300;
    padding: 1%;
   outline:none;
border: none;
    text-align: center;
    text-decoration: none;
    color: var(--black);
}

#vyhledavacPlatno{
	background-color:white;
	width:80vw;
	overflow-y:auto;
	max-height:400px;
	display:none;
	padding:2%;
	font-weight:400;
	font-family:Roboto;
}
#trash{
	width:1.4em;
}
#panel{
	display: flex;
    justify-content: center;
    align-items: center;
	background-color: white;
    padding: 0.4%;
    
	gap:5px;
	font-size:1.2em;
	font-family:Roboto;
	font-weight:300;
}
#panel span,input{
	padding:0.5%;
	font-size:1.2em;
	font-style:regular;
}
#poznamky, #predmety{
	display:flex;
	gap:10px;
	flex-direction:column;
	align-items: center;
}
#vyhledavacPlatno h2{
	text-align:center;
}
.nazev{
	font-size:1.2em;
	
}
.nazev:hover{
	text-decoration:underline;
	
}
#blokPrihlasit{
	display: flex;
    margin: 0% auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	gap:5px;
}
#blokKos{
	display: flex;
    margin: 0% auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	gap:5px;
	width:50%;
	
}
#blokKos table a{
	color:#298EFF;
	font-weight:bold;
	font-size:0.7em;
	font-family:Roboto;
	font-weight:300;
	text-decoration:underline;
	
}
#blokKos input{
	width:90%;
	margin:3%;
	background-color: #f5f5f5;
    font-size: 1.5em;
   font-family:Roboto;
	font-weight:300;
    padding: 1%;
   border:none;
   outline:none;
    text-align: center;
    text-decoration: none; 
    color: black;
}
#blokPrihlasit form{
	display: flex;
	flex-direction: column;
	gap:3px;
	
}
#alertPlatno{
	background-color:rgba(0,0,0,0.8);
	width:100vw;
	height:100vh;
	position:absolute;
	top:0;
	
}
#alert{
	background-color:rgba(255,255,255,0.8);
	width:30vw;
	height:40vh;
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	border:9px solid black;

	display:flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
}
#cmd{
		font-size:1.6em;
		white-space: pre-wrap;
		width:95vw;
		height:70vh;
		  background: #dfe2e4;  
    color: #5A6361;
  
	}
#username{
	display:flex;
	align-self:end;
	text-decoration:underline;
	font-family:Roboto;
	font-weight:300;
	font-size:1.3em;
	padding-right:1%;
	padding-top:1%;
	
}
#alertZprava{
	font-size:1.3em;
	padding:1%;
}
#alert svg{
	fill:black;
	width:6em;
} 
#alertLogo{
	font-weight: bold;
    font-family:Roboto;
	font-weight:300;
	font-size:1.5em;
	text-align:left;
	
	
}
#blokPrihlasit form input,label{
	font-size:1.5em;
	padding:3%;
	outline:none;
	font-family:Roboto;
	font-weight:300;
	
}
main{
	margin:2%;
}
#blokIndex a{
	padding: 3%;
    width: 85vw;
    
    font-size: 1.9em;
    font-family:Roboto;
	font-weight:300;
    /* border: 9px solid #ffffff; */
    text-align: center;
    background-color: white;
  
	transition:all 0.4s;
	text-decoration:none;
	
}
#blokIndex a:hover{

  
	/*padding:2%;*/
	background:black;
	color:white;

	
}
#blokIndex  a{
	text-decoration:none;
	color:black;
}
#loginAlert,#heslaAlert{
	font-size:0.8em;
	background:black;
	color:white;
	padding:1%;
	display:none;
}
.nadpisKategorie{
	font-weight:bold;
	font-size:2em;
	background-color:white;
	padding:1%;
	font-family:Roboto;
	font-weight:300;
	margin:3%;
}
footer{
	text-align:center;

}
table{
	    border-collapse: collapse;
    border: 1px solid;
	font-size:1.5em;
}
th{
	background-color:white;
	
}
table,td,tr,th{
	border: 2px solid black;
    font-family:Roboto;
	font-weight:300;
    text-align: center;
	font-size:1.15em;
}
#predmetyBlok{
	display:grid;
	grid-template-columns: 1fr 1fr 1fr;
	background-color:white;
	padding:3%;
	width:75vw;

	grid-gap:15px;
	
box-shadow: 0 10px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19) !important;
}
#nadpisPredmety{
	
	text-align:center;
	font-size:2em;
	font-weight:bold;
	font-family:Roboto;
	font-weight:300;
	
}
.predmet{
	background-color: #efefef;
    text-align: center;
    font-size: 1.5em;
  font-family:Roboto;
	font-weight:300;
    padding: 5%;
  
   
    text-align: center;
    text-decoration: none;
    color: var(--black);
}
.predmet:hover{
    text-decoration: underline;
}
header{
	display: flex;
    margin: 0% auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	
}
#btnAddPredmet{
	
	height:2em;
	
}
#pridatPredmetBlokPlachetka{
	background-color:rgba(0,0,0,0.8);
	width:100vw;
	height:100vh;
	position:absolute;
	top:0;
	display:none;
}
#pridatPredmetBlok{
	background-color:rgba(255,255,255,0.8);
	width:30vw;
	height:40vh;
	position:absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	border:9px solid black;

	display:flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
	gap:10px;
	
}
#pridatPredmetBlok input{
	width:85%;
}
#pridatPredmetBlok button{
	width:87%;
	    background-color: #f5f5f5;
    /* text-align: center; */
    font-size: 1.5em;
    /* font-family: calibri; */
    padding: 3%;
   font-family:Roboto;
	font-weight:300;

    text-align: center;
    text-decoration: none;
    color: var(--black);
	border:none;

	
}
#pridatPredmetBlok button:hover{
	    background-color: #e5e5e5;
  

	
}
#search{
	width:80vw;
}
#btnBlok{
	display:flex;
	width:80vw;
	align-items:flex-end;
	justify-content: flex-end;
	background-color:white;
	padding:1%;

}

#blokNadpisPredmety{
	display:flex;
	gap:15px;
}
#kos{
	text-align:end;
	width:90vw;
	text-decoration:underline;
	color:blue;
	padding:2%;
}
@media only screen and (max-width: 1330px) {
  #podnadpis{
	font-size:0.9em;
	
	}
	#blokIndex div{
	
    width: 80vw;
}

#alert{ 
	width:90vw;
	height:40vh;

}
#alertZprava{
	font-size:0.9em;
}
#blokUser form{
	width:85vw;
}
#vyhledavacPlatno{
	width:80vw;

}
#blokDashboard input{
	/*width:78vw;*/

}
#predmetyBlok{
	
	grid-template-columns: 1fr;

}
#cmd{
		margin:5%;
		width:85vw;
		  background: #dfe2e4;
  
	}
	#wasSaved{
	width:85vw;
	height:8px;
	background-color:green;
	margin:5%;
}
#pridatPredmetBlok{
	
	width:80vw;
	height:40vh;

	 
}
#panel{
	flex-direction: column;
}