:root {
    --maintxtclr: black;
    --mainbgclr: rgba(39, 77, 39, 0.152);
    --mainfnt:'Arial, sans-serif';
}

body {
    margin: auto;
    background-image: url('../images/bgimg.jpg');
    background-size: cover;
    font-family: var(--mainfnt);
    max-width: 120ch;
}

header {
    text-align: center;
}

form {
    margin-left:  20%;
    margin-right: 20%;
    background-color: var(--mainbgclr);
    border-radius: 1.5em;
}


h1 {
    text-transform: uppercase;
}

p,table{
    background-color: var(--mainbgclr);
    margin: 1em;
    padding: 1.5em;
}

table{
    border-collapse: collapse;
    border: 0.01em solid black;
    margin-bottom: 1.25em;
    font-size: smaller;
}

th,td {
    text-align: center;
    border: 0.01em solid rgba(62, 90, 63, 0.811);
    padding: 0.5em;
}

th {
    text-decoration: underline;
}
caption {
    background-color: var(--mainbgclr);
    font-size: 130%;
    border-top-left-radius: 1.5em;
    border-top-right-radius: 1.5em;
}

section>ul>li{
    padding: 1em;
}

figure {
    text-align: center;
    border: 0.01em solid rgba(0, 0, 0, 0.152);
    background-color: rgba(208, 244, 217, 0.285);
    max-width: 100%;
}

figcaption {
    text-align: center;
    font-size: smaller;
}

.roundedc {
    border-radius: 10%;
}

tr:nth-child(odd) {
    background-color: rgba(91, 142, 91, 0.152);
}

tr:nth-child(even) {
    background-color: rgba(47, 60, 47, 0.152);
}

.mainsection > * {
    padding: 1.25em;
    box-sizing: border-box;
}

section > ul > li:nth-child(even) {
    background-color: rgba(47, 60, 47, 0.152);
}

section>ul>li:nth-child(1){
    border-top-left-radius: 1.5em;
    border-top-right-radius: 1.5em;
}

section>ul>li:last-child{
    border-bottom-left-radius: 1.5em;
    border-bottom-right-radius: 1.5em;
}

section > ul > li:nth-child(odd) {
    background-color: rgba(91, 142, 91, 0.152);
}

img {
    text-align: center;
    max-width: 100%;
}

p {
    text-indent: 2em;
    border-radius: 1.5em;
}

table p {
    text-indent: 0em;
}

nav a:link{
    text-decoration: none;
}

nav a:hover {
    text-decoration: underline;
}

nav a{
    display: inline-block;
    font-size: large;
}

nav {
    text-align: center;
    background-color: var(--mainbgclr);
    padding: 1% 0;
}

cite {
    font-size: xx-small;
}

a:hover {
    color: rgb(59, 105, 59);
}

img {
    max-width: 100%;
}

.imgfield p{
    display: flex;
    justify-content: center;
    align-items: center;
}

select:focus, input[type=email]:focus {
    background-color: rgba(201, 229, 239, 0.386);  
}

input:invalid {
    border: 0.015em solid rgba(165, 31, 31, 0.949);
 }

 input[type=submit]:hover {
    background-color: rgba(18, 103, 159, 0.904);
 }

 input[type=submit] {
    background-color: rgba(14, 144, 231, 0.871);
    color: white;
    border: none;
    border-radius: 1.5em;
 }

 input[type=email],select {
    box-sizing: border-box;
    border-radius: 1.5em;
    border: 0.01em solid rgba(55, 118, 74, 0.386); 
 }

 input[type=email],select,input[type=radio],input[type=checkbox],input[type=submit]{
    cursor:pointer
 }

 fieldset{
    border-radius: 25%;
    
 }

 legend{
    text-align: left;
    font-weight: bold;
    padding-top: 5%;
    padding-left: 5%
 }

 fieldset p {
    background-color: rgba(56, 94, 58, 0.368);
    border-radius: 1.5em;
 }

input[type=checkbox],input[type=radio] {
        transform: scale(1.5);
}

input[type=submit]{
    transform: scale(2.5);
}

.activePage{
    text-decoration: underline !important;
    color: #000000;
}

#FormHeader{
    display: none;
}

.mistake{
    background-color: rgba(224, 68, 25, 0.368);
}