@font-face {font-family: persob;
            src: url(../images/fonts/Futura_Round_Demi.woff) format('woff'),
                 url(../images/fonts/Futura_Round_Demi.ttf) format('truetype'); }
@font-face {font-family: person;
            src: url(../images/fonts/Futura_Round.woff) format('woff'),
                 url(../images/fonts/Futura_Round.ttf) format('truetype'); }


      body {background: #C0DCC0; }

         a {text-decoration: none;
            color: #000099;}

     table {font-family: person, Verdana; font-size: 18px; color: #000000; }

    .titol {font-family: persob, Verdana; font-size: 24px; color: #000099; }
    .titov {font-family: persob, Verdana; font-size: 24px; color: #009900; }
    .titor {font-family: persob, Verdana; font-size: 24px; color: #FF0000; }
    .titon {font-family: persob, Verdana; font-size: 24px; color: #000000; }

    .titbl {font-family: persob, Verdana; font-size: 36px; color: #000099; }
    .titbv {font-family: persob, Verdana; font-size: 36px; color: #009900; }
    .titbr {font-family: persob, Verdana; font-size: 36px; color: #FF0000; }
    .titbn {font-family: persob, Verdana; font-size: 36px; color: #000000; }

    .testb {font-family: person, Verdana; font-size: 18px; color: #000099; }
    .testv {font-family: person, Verdana; font-size: 18px; color: #009900; }
    .testr {font-family: person, Verdana; font-size: 18px; color: #FF0000; }
    .testo {font-family: person, Verdana; font-size: 18px; color: #000000; }

    .boldb {font-family: persob, Verdana; font-size: 18px; color: #000099; }
    .boldv {font-family: persob, Verdana; font-size: 18px; color: #009900; }
    .boldr {font-family: persob, Verdana; font-size: 18px; color: #FF0000; }
    .boldo {font-family: persob, Verdana; font-size: 18px; color: #000000; }

    .botnm {background:    #1caf1c;
            border:        2px solid #556699;
            border-radius: 1000px;
            width:         38px;
            height:        38px;
            color:         #ffffff;
            display:       inline-block;
            font:          normal bold 24px/38px person, Verdana;
            text-align:    center;
            text-shadow:   1px 1px #000000; }

    div#centro1 {width: 400px;
                height: 250px;
                background: #DDD9D0;
                position: absolute;
                top: 50%;
                left: 50%;
                padding: 20px;
                overflow: auto;
                margin-top: -125px;
                margin-left: -200px;
                border: 2px solid #0000FF;
                border-radius: 10px; }

    div#centro2 {width: 800px;
                height: 600px;
                background: #DDD9D0;
                position: absolute;
                top: 50%;
                left: 50%;
                padding: 20px;
                overflow: auto;
                margin-top: -300px;
                margin-left: -400px;
                border: 2px solid #0000FF;
                border-radius: 10px; }

    div#centro3 {width: 800px;
                height: 300px;
                background: #C0DCC0;
                position: absolute;
                top: 50%;
                left: 50%;
                padding: 20px;
                overflow: auto;
                margin-top: -200px;
                margin-left: -420px; }

    div#sottoo {width: 50px;
                height: 50px;
                background: #DDD9D0;
                position: absolute;
                top: 50%;
                left: 50%;
                text-align: center;
                margin-top: 95px;
                margin-left: -200px;
                border: 2px solid #0000FF;
                border-radius: 10px; }

       .botver {background:   #b6d7a8;
                background:    linear-gradient(#b6d7a8, #8fce00);
                border:        1px solid #556699;
                border-radius: 1000px;
                margin:        2px;
                width:         100px;
                height:        26px;
                color:         #111111;
                display:       inline-block;
                font:          bold 16px/26px person, Verdana;
                text-align:    center; }

       .botros {background:   #ff9200;
                background:    linear-gradient(#ff9200, #ff4600);
                border:        1px solid #556699;
                border-radius: 1000px;
                margin:        2px;
                width:         100px;
                height:        26px;
                color:         #111111;
                display:       inline-block;
                font:          bold 16px/26px person, Verdana;
                text-align:    center; }

    .botto {display: flex;
           justify-content: space-around;
           flex-wrap: no-wrap;
           width: 600px;
           margin-top: 5px; }
    .botto > .gia {background:   #fffb00;
                  background:    linear-gradient(#fffb00, #ffaf00);
                  border:        1px solid #556699;
                  border-radius: 1000px;
                  margin:        2px;
                  width:         100px;
                  height:        26px;
                  color:         #111111;
                  display:       inline-block;
                  font:          bold 16px/26px person, Verdana;
                  text-align:    center; }
    .botto > .ros {background:   #ff9200;
                  background:    linear-gradient(#ff9200, #ff4600);
                  border:        1px solid #556699;
                  border-radius: 1000px;
                  margin:        2px;
                  width:         100px;
                  height:        26px;
                  color:         #111111;
                  display:       inline-block;
                  font:          bold 16px/26px person, Verdana;
                  text-align:    center; }
    .botto > .ver {background:   #b6d7a8;
                  background:    linear-gradient(#b6d7a8, #8fce00);
                  border:        1px solid #556699;
                  border-radius: 1000px;
                  margin:        2px;
                  width:         100px;
                  height:        26px;
                  color:         #111111;
                  display:       inline-block;
                  font:          bold 16px/26px person, Verdana;
                  text-align:    center; }

    .corpo {display: flex;
           justify-content: center;
           flex-wrap: wrap;
           width: 680px;
           margin-top: 5px; }
    .corpo > .ite {background:   #ffffff;
                   margin:       5px;
                   border:       2px solid #000000;
                   width:        210px;
                   height:       300px; }

    .parro {display: flex;
           justify-content: space-around;
           flex-wrap: wrap;
           width: 550px;
           margin-top: 5px; }
    .parro > .ver {background:   #b6d7a8;
                  background:    linear-gradient(#b6d7a8, #8fce00);
                  border:        1px solid #556699;
                  border-radius: 1000px;
                  margin:        2px;
                  width:         150px;
                  height:        52px;
                  color:         #111111;
                  display:       inline-block;
                  font:          bold 16px/26px person, Verdana;
                  text-align:    center; }