/* font converted using font-converter.net. thank you! */
@font-face {
    font-family: 'Roboto';
    src: url("../fonts/Amble-Regular.eot");
    src: url("../fonts/Amble-Regular.eot?#iefix") format('embedded-opentype'),
       /* url("../fonts/Amble-Regular.woff2") format('woff2'), */
        url("../fonts/Amble-Regular.woff") format('woff'),
        url("../fonts/Amble-Regular.ttf") format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
body {
   /* background-image: url(../immagini/dynamic-style.png); */
	 background-color: #3c1b01;
    color: #000;
    text-align: justify;
    font-size: 16px;
    font-family: "Roboto", Helvetica, sans-serif;
}
hr {
    color: #d8e8f5;
}
figure {
    margin-bottom: 10px;
}
#wrapper {
    margin: 0 auto;
    width: 960px;
    background: #f0f0f0;
}
#container {
    float: left;
    padding: 20px;
    width: 920px;
}
#content {
    float: left;
    /*  width: 736px;    */
    width: 80%;
}

aside {
    float: right;
    /*   width: 147px;  */
    width: 18%;
    background: #e8e8e8;
}
.clear {
    clear: both;
}
img {
    max-width: 100%;
    height: auto;
}


@media (min-width: 768px) and (max-width: 980px) {
    aside {
        float: right;
        /*  width: 113px;   */
        width: 18%;
    }
    #wrapper {
        margin: 0 auto;
        width: 748px;
    }
    #container {
        float: left;
        padding: 20px;
        width: 708px;
    }
    #content {
        float: left;
        /*   width: 566px;  */
        width: 80%;
    }
}


@media (max-width: 767px) {
    body {
        padding: 10px;
        background: #f0f0f0;
        text-align: left;
        /*  background-image: linear-gradient(to bottom, #999999, #8e8e8f, #838384, #78787a, #6d6d70, #636366, #59595c, #4f4f52, #434346, #38383a, #2d2d2f, #232324); */
    }


    #content {
        float: left;
        width: 100%;
    }
    aside {
        float: right;
        padding: 20px 0 0 0;
        width: 100%;
    }

    #wrapper {
        margin: 0 auto;
        width: 100%;
    }
    #container {
        float: left;
        padding: 20px 0 0 0;
        width: 100%;
    }
}
