:root{
    --main-bg-color: #eeeeee;
    --main-txt-color: #111111;
    --main-bg-color-rgba: rgba(256, 256, 256, 0.8);
    --link-txt-color: #111111;
    --h1-txt-color-rgba: rgba(225, 166, 94, 0.8);
    --h-font-family: "Bodoni MT";
}

*{
    margin:0;
    padding:0;
    font-family: "Times New Roman";
}

a:hover{
    background-color: var(--main-txt-color);
    color: var(--main-bg-color);
}

caption{
    font-variant: small-caps;
    font-weight: bold;
    padding-top: 1em;
}

body{
    margin: 1%;
    padding: 2%;
}

.details{
    padding-bottom: 3%;
}

.details p{
    padding-bottom: 1%;
}

figcaption{
    font-family: "Comic Sans MS";
}

figure{
    float: right;
    text-align: center;
    border-radius: 5.16em;
    width: 50%;
    border: medium solid rgb(196, 131, 52);
}

footer{
    background-color: #666666;
    max-width: 4.25%;
    padding: 0.5%;
}

footer a{
    color: var(--link-txt-color);
}

form{
    margin: auto;
    max-width: 30em;
}

html{
    background-image: url("../images/nature_bike.jpg");
    background-size: cover;
    background-color: var(--main-bg-color);
    color: var(--main-txt-color);
}

h1{
    text-transform: uppercase;
    margin-left: 30%;
    text-align: center;
    padding: 1%;
    background-color: var(--h1-txt-color-rgba);
    width: 40%;
    font-family: var(--h-font-family);
}

h2{
    font-family: var(--h-font-family);
    text-decoration: underline;
    text-decoration-color: rgb(225, 166, 94);
}

h3{
    padding-top: 0.75%;
    font-family: var(--h-font-family);
}

img{
    max-width: 100%;
    padding-bottom: 0.5%;
    border-radius: 5em;
    border-collapse: collapse;
}

.formImg{
    float: left;
    width: 30%;
    border-radius: 1.5em;
}

.formImg img{
    border-radius: 1.3em;
}

li{
    width: 60%;
}

li:nth-child(odd){
    background-color: #FFCE92;
}

li:nth-child(even){
    background-color: #FFE1BC;
}

main{
    background-color: var(--main-bg-color-rgba);
    padding: 1%;
}

main a{
    font-size: xx-small;
}

nav{
    background-color: rgba(196, 131, 52, 0.85);
    text-align: center;
    padding: 1% 0;
    border-top-left-radius: 1.5em;
    border-top-right-radius: 1.5em;
}
nav a{
    background-color: rgba(196, 131, 52, 1);
    color: var(--link-txt-color);
    display: inline-block;
    width: 19%;
    padding: 0.75%;
    border: medium solid black;
    border-collapse: collapse;
    border-width: thin;
}

nav a:link{
     background-color: #fff;
     color: #009;
     text-decoration: none;
 }

nav a:hover{
    text-decoration: underline;
    background-color: var(--main-txt-color);
    color: var(--main-bg-color);
}

p{
    text-indent: 3%;
}

table{
    border: medium solid black;
    border-collapse: collapse;
    max-width: 80%;
    margin: auto;
}

tr:nth-child(even){
    background-color: #FFE1BC
}
tr:nth-child(odd){
    background-color: #FFCE92;
}

tr, td, th{
    border: medium solid black;
    border-width: thin;
    padding: .5em;
}

ul{
    padding-left: 1%;
}

