@font-face {
    font-family: gesucattivo;
    src: url("floridaisland.ttf");
/*floridaisland.ttf
font/rathney.ttf
*/
}

@font-face {
    font-family: body;
    src: url("font/baskervville.ttf");
/* josefinsans.ttf
*/
}

body {
     font-family: body;
   /* background-color: #CD121D;
background-image: url("https://www.transparenttextures.com/patterns/argyle.png");
    background-size: 5%; */
   background-color: #cd121d;
 background-image: url("black-linen.png");
*/

    
}

b {
    color: #cd121d;
}

h1, h2, h3 {
    font-family: gesucattivo;
    color: #cd121d;
    font-size: 40px;
}

.header {
    font-family: gesucattivo;
    color: #cd121d;
    font-size: 50px;
    font-weight: bold;
    margin-left: 20px;
    /*text-shadow: 2px 2px 2px #F6AB6A*/;
}


.fiola {
    position: absolute;
    right: 0px;
    top: 80px;
}

.main {
    position: absolute;
    top: 80px;
    right: 300px;
    width: 900px;
    height: 500px;
    border: 20px solid transparent;
border-image: url('ivory.png') 34 round;
    background-clip: padding-box;
    border-image-slice: fill;
    background-color: #FCE9D2;
    overflow-y: scroll;
    padding-left: 20px;
    padding-right: 20px;
}

.cosobordo {
    width: 250px;
    position: absolute;
    top: 0;
    left: 0;
}

.navleft {
    width: 500px;
    position: absolute;
    bottom: -70px;
    left: 0;
}

.navright {
    width: 500px;
    position: absolute;
    bottom: -70px;
    right: 0;
}

.navright:hover {
    content: url(volume9navrighthover.png);
}

.navleft:hover {
    content: url(volume9navlefthover.png);
}






/* ALTEZZE */

@media screen and (min-height: 1091px) and (max-height: 1250px) {
    .navleft {
    top: 750px;
}

.navright {
    top: 750px;
}
}

@media screen and (min-height: 1031px) and (max-height: 1090px) {
    .navleft {
    top: 700px;
}

.navright {
    top: 700px;
}
}


@media screen and (min-height: 950px) and (max-height: 1030px) {
    .navleft {
    bottom: 80px;
}

.navright {
    bottom: 80px;
}
}

@media screen and (min-height: 850px) and (max-height: 949px) {
    .navleft {
    bottom: 0px;
    left: 0;
}

.navright {
    bottom: 0px;
    right: 0;
}
}


@media screen and (max-height: 770px) {
    .navleft {
    bottom: -120px;
}

.navright {
    bottom: -120px;
}
}





/*LUNGHEZZE*/

@media screen and (max-width: 1301px) {
    .main {
       width: 600px;
    height: 400px;
         top: 130px;
    }
    .fiola {
    top: 50px;
}
    .navleft {
    width: 480px;
}

.navright {
    width: 480px;
}
}


@media screen and (min-width: 1701px) {
    .main {
       width: 1100px;
    height: 600px;
         top: 20px;
    }
    .fiola {
    top: 100px;
}
.navleft {
    width: 600px;
}

.navright {
    width: 600px;
}
}

@media screen and (min-width: 1701px) {
    .main {
       width: 1200px;
    height: 650px;
         top: 20px;
    }
    .fiola {
    top: 180px;
}
.navleft {
    width: 600px;
}

.navright {
    width: 600px;
}
}