*   {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


body {
    /* background: rgb(4, 136, 107); */
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}


#logo {
    text-align: left;
   display: block;
}


h2 {
    margin-left: 10px;
}


#wrapper {
    /* width: 940px;  */
    width: 78%;  
    max-width: 1100px;
    margin: 30px auto;
    /* background: lightgray; */
    overflow: hidden;
   
}


#contact {
    color: #800;
}

main {
    /* width: 580px;  */
    width: 61.70%;
    max-width: 1100px;
    padding-right: 0;
    float: left;   
}


aside {
    width: 340px;
    /* width: 36.17%; */
    max-width: 1100px;
    padding-top: 20px;
    float: right;
}


footer {
    clear: both;
    height: 60px;
    line-height: 60px;
    /* display: flex; */
    justify-content: center;
    border-top: 1px solid #800;  
}

footer ul {
    display: flex;
   
}


footer li {
    /* margin: 0 10px; */
    margin-right: 30px;
    color: gray;
    font-weight: bold;
    /* list-style-type: none; */
}


form {
    /* max-width: 580px; */
    max-width: 61.70%;
    margin-top: 20px;
}


fieldset {
    padding: 10px;
    border: 1px dotted #800;
}


legend {
    font-size: 1.3em;
    font-style:  italic;
    font-weight: bold;
}

label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 1.1em;
}


input {
    margin-bottom: 10px;
    height: 30px;
    width: 100%;
}

input[type=radio],
input[type=checkbox]
 {
    height: auto;
    width: auto;
    margin-right: 3px;
    margin-bottom: 3px;
}


input[type=submit] {
    width: auto;
    
}

form {
    margin-bottom: 20px;

}


form ul {
    margin-left: 15px;
    margin-bottom: 10px;
}

form li {
    list-style-type: none;
}


select {
    margin-bottom: 10px;
}


textarea {
    width: 100%;
    height: 110px;
    margin-bottom: 10px;
}


a {
    font-weight: bold;
    color: gray;
}
 

a:hover {
    text-decoration: underline;
}


h3, p {
    margin-bottom: 20px;
}



#reset a {
    font-weight: bold;
    color: #800;

}
  


#container {
    /* width: 940px; */
    width: 78%;
    max-width: 1100px;
    margin: 30px auto;
}



.portal {
    font-weight: bold;
    text-align: right;
    display: block;
}



.t {
    margin: 50px;
}



@media screen and (max-width:800px) {
    #wrapper {
        width: 95%;
        max-width: 1100px;
        margin: 240px auto 10px auto;
    }

    nav ul {
        width: 96%;
    }


    main {
        width: 56.57%;  
        /* width: 560px divided by 940px */
        float: left;
        margin-bottom: 30px;
    }

    aside {
        border: 1px;
        width: 39.17;
        padding: 15px;
        float: right;

    }

}


@media screen and (max-width:700px) {
    main {
        width: auto;
        float: none;
    }

    aside {
        width: auto;
        float: none;
    }

    aside img {
        display: block;
        margin: 0 auto;
    }
    
}