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

*{box-sizing: border-box;margin:0;font-family: Montserrat; font-size: 1.3vw;}
body{background: silver; }
nav,header,main, footer {width:90vw;margin:auto;background:white;}
header {min-height:10vw;padding:20px;border-bottom:1px dotted #0000dc;} 
nav {height:4vw;background:#0000dc;display: flex;border-bottom:1px solid #0000dc;}
nav a {display: block;width:100%;text-align: center;line-height: 4vw;text-decoration: none;
       color:white; transition: background 0.5s; font-size:1em;font-weight: bold;}
nav a:hover {background:white;color:#0000dc}
main {padding:1vw 1vw 5vw 1vw;}
section{}
section:nth-child(even):{background:rgba(170,220,5,0.2)}

/*formáty*/
header {text-align: center;}
header h1 {line-height:5vw;}
header p{font-weight:bold;color:#0000dc;text-align:justify;margin:10px;:}
.chyba {text-align: center;font-weight: bold; color:#0000dc}
footer {text-align:center;padding:20px;}
footer img.loga, header img.loga {width:50%;margin:auto; margin-top:50px;max-width:200px;text-align:center}

/* main page*/
.hlavni_bloky {width:80%;padding:10vw;display:block; align-content:center; border:2px dotted #0000dc;margin:auto; }
.hlavni_bloky a {width:100%;padding:40px;display:block;margin:20px;background:#0000dc;color:white;text-align:center;
                    justify-content:center;align-items:center; font-size:1.6em}


/* fomular login*/
form.edit {display:block;width:70%;margin:auto;border:#0000dc 2px dotted;padding:1em;margin-bottom:2vw;}
form.edit div {width:100%;padding:0.5vw}
form.edit div label{display:block;width:100%;text-align:center;line-height:3vw;font-weight: bold;padding-right: 1vw}
form.edit div input {font-size:1em;height:2em;line-height:2em;width:100%; border:2px solid border:#0000dc; outline:border:#0000dc }
form.edit div input[type="submit"] {width:100%;margin-top:1vw;}
form.edit div input[type="checkbox"] {width:100%;margin-top:1vw;height:1.2em;}
form.edit div textarea {width:100%;margin-top:1vw;}
form.edit div select  {width:100%;margin-top:1vw;text-align: center;}
form.edit div p {text-align:center; font-size:0.8em;color:olive}
table form {display:inline;border:0;padding:0.1em}
td form.edit {margin-bottom:0;border:none;padding:0.2em}
td form.edit div input {font-size:1em;height:1em;line-height:1em;width:100%; border:none; outline:none }


/*textove elementy*/
h1 {font-size:1.8em; padding:1rem; text-align: center;}
h2 {font-size:1.3em; padding:1rem;margin-top:2rem; text-align: center;}
h3 {font-size:1.1em; padding:1rem; text-align:center; border-top:1px dotted #0000dc; margin-top:2em }
p  {text-align: center;}
/*tabulka*/
table {min-width:70%; margin:auto}
table * {font-size:0.8rem;}
th{background:#0000dc; color:white;}
td,th {text-align:center;padding:5px;}
tr:nth-child(even) td {background:rgb(245,245,245);}
table a {text-decoration: none; font-size: 0.8em}
table p {text-align: justify;}
table ul {text-align: left;}
table div.blok {border:1px black solid; padding:2px; margin:5px;}

/*zpetne odkazy*/
p.zpet:first-child  {margin-top: 2em}
.zpet a {display: list-item; color:#0000dc;text-decoration:none; margin-left: 2em;text-align: left;}
.zpet a:hover{color:black;text-decoration: underline;}

/*dotaznik*/
.otazka{border:1px dotted #0000dc; padding:10px; text-align:left; width:90%;margin:auto;margin-top:30px;margin-bottom:60px;}
.dot_form {width:90%;margin: auto;}
.dot_form input {width:100%}


.polozka_otazky {margin:auto;margin-top:4px;display:flex;justify-content:center; align-content:center; align-items:center;}
.polozka_otazky:nth-child(even) {background:rgb(245,245,245);}
.polozka_otazky * {width:100%;display:flex; justify-content:center; align-content:center; align-items:center;}
.polozka_otazky select {height:1.5em;margin:3px;margin-left:5px}
.polozka_otazky div { display: flex; align-items: center;padding:3px;}
.polozka_otazky div input {width:100%}
.zadani{font-size:1.2em;margin-top:10px;margin-bottom:10px;}
	.komentar{margin-bottom:20px;color:#0000dc;font-size:1em;}
.zadani b {font-size:1em;}
.polozka_otazky label {width:70%;display:inline-block;text-align:right;}
.polozka_otazky input, select{width:28%;}
 table select{width:90%;}
.otazka ul {margin:auto;}
.otazka li {display:block;margin-top:5px}
.skryt  {display: none;}
.odstavec {width:90%;margin:auto;margin-top:20px;text-align: justify;font-size: 1em;}
.odstavec p {text-align: justify; font-weight:bold ; font-size: 1em;margin-bottom:1em }
.odstavec ul li {font-size:1em; }
.odstavec ul {margin-bottom:10px;}
.odstavec h3 {margin-top:2em; font-size: 1.8em;}
.odstavec b {color:#0000dc}
.modra {color:#0000dc;}
.odstavec .modra{color:black;}
input[type="radio"], input[type="checkbox"] {
  /* ...existing styles */
color:red; font-size:35px; background:red;   width: 0.5em;
  height: 0.5em; margin-right:5px;
}
.otazka ul li {display: flex; align-items: center;padding:3px;font-size:1em;}
li div {display:inline-block; padding-left:5px;width:95%;}

#odesli_dotaznik{width:100%; margin:auto; margin-top:40px; margin-bottom:40px; background:#0000dc;color:white;padding:20px;
    outline:none;border:2px solid black; cursor:pointer
    }
#odesli_dotaznik:hover{background:silver;color:#0000dc}

@media only screen and (max-width: 600px) {

*{font-size: 15px;}
 form.edit div input,select {font-size:1.1em;}
 body{font-size: 3vw;}
 nav,header,main, footer {width:100vw}
 nav {height:7em;display:block;height:auto;}
 nav a {font-size:2em;line-height:4em;}


.hlavni_bloky {display:block;}
.hlavni_bloky a {width:80%;padding:20px;display:block;margin:auto;margin-bottom:30px;}

.polozka_otazky {}
.polozka_otazky * {}
.polozka_otazky select {}
.polozka_otazky div {}
.polozka_otazky div input {}
.zadani{font-size:1em;
.komentar{margin-bottom:20px;color:#0000dc;font-size:0.8em;}
.polozka_otazky label {width:70%;display:inline-block;text-align:right;}
.polozka_otazky input, select{width:28%;}
 table select{width:90%;}
.otazka ul {margin:auto;}
.otazka li {display:block;margin-top:5px}
.skryt  {display: none;}
.odstavec {}
.odstavec p {text-align: justify; font-style: italic; font-size: 1.2em;}
.odstavec h3 {margin-top:2em; font-size: 2.1em;}
.odstavec b {color:#0000dc}

form {width:90% }
form div {width:100%;padding:1vw}
form div label{display:block;width:100%;text-align:center;line-height:3em;font-weight: bold;
                 padding-right: 1em;font-size:2em}
form div input {height:3em;font-size:2em; line-height:3em;width:100%; border:2px solid border:#0000dc; outline:border:#0000dc }
form div input[type="submit"] {width:100%;margin-top:1vw;}
form div textarea {width:100%;margin-top:1vw;font-size:2em;}

table {width:95%; font-size:4em;margin:auto}
th{background:#0000dc;}
td,th {text-align:center;padding:2px;font-size:1.5em;}
td a {font-size:1em;}
}