body{
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0px;
    overflow: hidden;
    overscroll-behavior: contain;
}

.ajax_tartalom{
    overflow-y: auto;
    max-height: 100vh;
}

.mesterlogin{
    border: 1px solid black;
    box-shadow: 3px 3px 6px gray;
    padding: 1em;
}
.mesterlogin label{
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.quiz_login{
    border: 1px solid black;
    box-shadow: 3px 3px 6px gray;
    padding: 1em;
}

.new_quiz_window label,.quiz_login label{
    display: grid;
    grid-template-columns: 2fr 3fr;
}

.new_quiz_window{
    border: 1px solid black;
    box-shadow: 3px 3px 6px gray;
    padding: 1em;
}

.main_quizlista{
    overflow-y: auto;
    max-height: 80vh;
}

.egy_quiz{
    border: 1px solid black;
    margin: 0.5em;
    padding: 0.5em;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 4fr 1fr;
    gap: 1em;
}

.pixelcontainer{
    z-index: 999999;
    position: absolute;
}

.kszerk_kerdes_sor{
    max-height: 85vh;
    overflow-y: auto;
}

.kerdes_row{
    display: grid;
    grid-template-columns: 1fr 4fr 1fr 6fr 2fr;
    gap: 1em;
    border: 1px solid gray;
}
.ksz_valasz{
    border: 1px solid black;
    background-color: lightgrey;
    display: flow-root;
}
.ksz_helyesvalasz{
    background-color: lightgreen;
}
.paginator{
    grid-column-start: 1;
    grid-column-end: 4;
    display: flex;
    flex-flow: nowrap;
    overflow-x: auto;
}
.pagelink{
    margin-left: 0.25em;
    margin-right: 0.25em;
    border: 1px solid black;
    background-color: lightgray;
    padding: 0.5em;
    cursor: pointer;
}
.active_page{
    background-color: lightgreen;
}
.valasz_ablak{
    position: absolute;
    left:10vw;
    top:20vh;
    width: 80vw;
    height: 60vh;
    border: 3px solid black;
    border-radius: 1em;
    background-color: azure;
    padding: 1em;
}

.quiztakerlist_at_login{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 2em;
    border:1px solid gray;
    padding: 0.5em;
    border-radius:0.5em;
}

.quiztaker_at_login{
    border: 1px solid black;
    padding: 0.5em;
    border-radius: 0.25em;
    background-color: azure;
    box-shadow: 3px 3px 6px darkgray;
    margin: 0.5em;
    display: inline-block;
}

.in_quiz_list{
    display: flex;
    flex-flow: wrap;
}

.quiztaker_in_quiz{
    border: 1px solid black;
    padding: 0.5em;
    border-radius: 0.25em;
    background-color: rgb(209, 247, 247);
    box-shadow: 3px 3px 6px darkgray;
    margin: 0.5em;
    display: grid;
    grid-template-columns: 2fr 2fr 2fr 2fr 2fr 2fr 10fr;
    gap: 1em;
}

.mar_lezart{
    background-color: #C0C0C0;
    border: 3px solid gray;
}

.unanswered{
    background-color: pink;
}

.answered{
    background-color: lightgreen;
}

.fokerdes{
    margin-left: 15vw;
    margin-right:15vw;
    font-size: 3em;
}

.fovalaszok{
    border: 1px solid black;
    border-radius: 0.5em;
    padding: 0.5em;
    margin: 0.5em;
    background-color:aliceblue;
    box-shadow: 3px 3px 6px darkslategray;
    font-size: 2em;
}

.radiochecker{
    padding: 0.5em;
    margin: 0.5em;
    border: 1px solid gray;
    border-radius: 0.25em;
    background-color: aliceblue;
}

.osszesitovalasz{
    width: 2em;
    height: 2em;
    border: 1px solid black;
    text-shadow: 1px 1px white, -1px -1px white, -1px 1px white, 1px -1px white;
    font-size: 1.1em;
    font-weight: 600;
}

.jovalasz{
    background-color: greenyellow;
}

.rosszvalasz{
    background-color: red;
}

.kitoltetlen{
    background-color: lightgray;
}

button{
    padding:0.5em;
    border: 2px solid darkgray;
    border-radius: 0.25em;
    font-size: 1.2em;
    box-shadow: 3px 3px 6px darkslategray;
}

.gombsor_main{
    display: grid;
    grid-template-columns: 1fr;
    gap: 2em;
}

.gombsor_main div{
    padding: 0.5em;
    display: inline-block;
}

/* HTML: <div class="loader"></div> */
/*.loader {
    width: 20vw;
    aspect-ratio: 1;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    top: 25vh;
  }*/
/* HTML: <div class="loader"></div> */
.loader {
    display: inline-grid;
    aspect-ratio: 1;
    border-radius: 50%;
    overflow: hidden;
    outline: 7px solid #474847;
    outline-offset: -1px;
    animation: l2-0 6s linear infinite;

    width: 20vw;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    left: 40vw;
    top: 25vh;
  
  }
  .loader:before,
  .loader:after {
    content:"";
    grid-area: 1/1;
  }
  .loader:before {
    clip-path: polygon(evenodd,0 0,100% 0,100% 100%,0 100%,0 0,100% 50%,83.81% 59.06%,93.3% 75%,74.75% 74.75%,75% 93.3%,59.06% 83.81%,50% 100%,40.94% 83.81%,25% 93.3%,25.25% 74.75%,6.7% 75%,16.19% 59.06%,0% 50%,16.19% 40.94%,6.7% 25%,25.25% 25.25%,25% 6.7%,40.94% 16.19%,50% 0%,59.06% 16.19%,75% 6.7%,74.75% 25.25%,93.3% 25%,83.81% 40.94%,100% 50%);
    background: #474847;
  }
  .loader:after {
    margin: 12.5%;
    clip-path: polygon(100% 50%,78.19% 60.26%,88.3% 82.14%,65% 75.98%,58.68% 99.24%,44.79% 79.54%,25% 93.3%,27.02% 69.28%,3.02% 67.1%,20% 50%,3.02% 32.9%,27.02% 30.72%,25% 6.7%,44.79% 20.46%,58.68% 0.76%,65% 24.02%,88.3% 17.86%,78.19% 39.74%);
    background: #C0C0C0;
    transform: rotate(0turn) translate(15.625%) rotate(0turn);
    animation: l2-1 2s linear infinite;
  }
  @keyframes l2-0 {to{rotate: 1turn}}
  @keyframes l2-1 {to{transform: rotate(1turn) translate(15.625%) rotate(-1.333turn)}}


@media  (max-width:1199px){
    body{
        font-size: 1em;
    }

    .radiochecker{
        border: 4px solid black;
        font-size: 1.6em;
    }

    input[type=radio]{
        width: 1em;
        height: 1em;
    }

    input[type=text]{
        font-size: 1em;
    }
    input[type=password]{
        font-size: 1em;
    }

    input[type=mumber]{
        font-size: 1em;
    }
    
    .quiztaker_in_quiz{
        font-size: 1em;
    }

}

.kijelolt_valasz{
    background-color: lightskyblue;
}

.kerdes_editor{
    width: 20vw;
    height: 5em;
}

.delete_answer{
    float:right;
    clear: both;
    font-size: 0.7em;
}

.kszerk_vezerlok{
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2em;
}

.kerdes_to_add{
    width: 80vw;
    height: 6em;
}

.egyvalasz{
    display: grid;
    grid-template-columns: 5fr 1fr;
    gap: 1em;
    text-align: center;
}

.valasz_szerkeszto{
    width: 40vw;
    max-height: 6em;
    height: fit-content;
    background: inherit;
}

.feladattipus{
    height: 2em;
}

.osszesito_kerdes {
    border: 1px solid black;
    margin: 4px;
    padding: 4px;
    border-radius: 4px;
    box-shadow: 3px 3px 6px darkgray;
}

.osszesito_helyesvalasz{
    background-color: lightgreen;
    border: 1px solid darkgreen;
}

.kijelolt_helytelen_valasz {
    outline: 3px solid red;
}

.kijelolt_helyes_valasz {
    outline: 2px solid darkgreen;
}

.selected_for_deletion{
    border: 2px solid red;
    background-color: pink;
}

.vanhiba{
    background-color: pink;
    border: 2px solid red;
    box-shadow: 0px 0px 10px red;
}

.etarto{
    max-height: 80vh;
    overflow-y: auto;
}