* {
    font-size: 3.7037037037037033vh;
    font-weight: bolder;
}

.content {
    width: 100vw;
    height: 100vh;
    position: relative;
    margin: auto;
    background-image: url("./assets/feedback.png");
    background-repeat: no-repeat;
    background-size: contain;
    overflow: hidden;
}

body {
    margin: 0px;
}

label {
    margin-top: 2.2222222222222223vh;
    background-color: rgb(205, 118, 70);
    padding: 0.7407407407407408vh;
    border-radius: 1.7777777777777777vh;
    cursor: pointer;
    width: 58.333333333333336vw;
    height: auto;
    text-align: center;
    display: flex;
    color: white;
}

.container2 {
    display: block;
    position: relative;
    padding-left: 2.9166666666666665vw;
    margin-bottom: 1.7777777777777777vh;
    cursor: pointer;
    font-size: 3.259259259259259vh;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.container2:hover {
    border: solid black 0.2962962962962963vh;
}

.container2 input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    margin-top: 1.037037037037037vh;
    margin-left: 0.8333333333333334vw;
    height: 3.7037037037037033vh;
    width: 2.083333333333333vw;
    background-color: #eee;
    border-radius: 1.7777777777777777vh;
}

.container2:hover input~.checkmark {
    background-color: #ccc;
}

.container2 input:checked~.checkmark {
    background-color: burlywood;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.container2 input:checked~.checkmark:after {
    display: block;
}

.container2 .checkmark:after {
    left: 0.75vw;
    top: 0.7407407407407408vh;
    width: 0.4166666666666667vw;
    height: 1.4814814814814816vh;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

#cpytanie {
    position: relative;
    text-align: center;
    top: 14.814814814814813vh;
}

#radia {
    position: relative;
    top: 17.77777777777778vh;
}

#btn {
    position: absolute;
    top: 68.14814814814815vh;
    left: 35.833333333333336vw;
    background-color: rgb(205, 118, 70);
    padding: 0.7407407407407408vh;
    border-radius: 1.7777777777777777vh;
    cursor: pointer;
    width: 25vw;
    height: 7.4074074074074066vh;
    text-align: center;
    border: none;
    color: white;
}

#btn:hover {
    border: solid black 0.2962962962962963vh;
}

#feedback {
    color: red;
    position: absolute;
    text-align: center;
    top: 77.03703703703704vh;
    left: 36.666666666666664vw;
    display: none;
}

.bad {
    background-color: red;
}

.good {
    background-color: green;
}

.bad input:checked~.checkmark {
    background-color: maroon;
}

.good input:checked~.checkmark {
    background-color: greenyellow;
}


.menuC{
    justify-content: center;
    align-items: center;
}