@media screen and (min-width: 701px) and (max-width: 800px) {


p  {
    color: black;
    font-family: Verdana; 
    font-size: 55%;
    text-align: center;
    font-weight: normal;
    text-align: justify;
}


h2 {
    color: black;
    font-family: Verdana; 
    font-size: 8px;
    font-weight: normal
}


}


@media screen and (min-width: 801px) and (max-width: 1366px) {


p  {
    color: black;
    font-family: Verdana; 
    font-size: 70%;
    text-align: center;
    font-weight: normal;
    text-align: justify;
}


h2 {
    color: black;
    font-family: Verdana; 
    font-size: 10px;
    font-weight: normal
}


}

@media screen and (min-width: 1367px) {


p  {
    color: black;
    font-family: Verdana; 
    font-size: 87.5%;
    text-align: center;
    font-weight: normal;
    line-height: 25px;
    text-align: justify;
    display: table-cell;
    vertical-align: middle;
}


h2 {
    color: black;
    font-family: Verdana; 
    font-size: 11px;
    font-weight: normal
}


}

@media screen and (min-width: 1920px) {


p  {
    color: black;
    font-family: Verdana; 
    font-size: 87.5%;
    text-align: center;
    font-weight: normal;
    line-height: 25px;
    text-align: justify;
    display: table-cell;
    vertical-align: middle;
}


h2 {
    color: black;
    font-family: Verdana; 
    font-size: 12px;
    font-weight: normal
}


}


    a {
      text-decoration: none; 
      color: #000000
    }

    a:hover {
      text-decoration: underline;
    }

     #logo{
          width:25%;
          height:37.5%;
	  position: absolute;
	  top: 22.5%;
	  left: 37.5%;

      }

     #saluto{
          width:50%;
          height:3%;
	  position: absolute;
	  top: 1.5%;
	  right: 3%;

      }


     #footer {

          width: 98%;
          height: 3%;
          position: absolute;
          bottom: 3%;
          left: 1%;
      }


     #cerchio{
          width:99%;
          height:99%;
	  position: absolute;
	  top: 0.5%;
	  left: 0.5%;
          opacity:1;

      }


     #menu{
          width:45%;
          height:4.7%;
	  position: absolute;
	  top: 62%;
	  left: 27%;
          border-radius: 10px;
          background-color: #FFFFFF;
          opacity:1;
      }

     #menu2{
          width:45.3%;
          height:5.2%;
	  position: absolute;
	  top: 62%;
	  left: 27%;
          border-radius: 10px;
          background-color: #C0C0C0;
          opacity:1;
      }

     #sfondosuperiore{
          width:100%;
          height:5%;
	  position: absolute;
	  top: 0px;
	  left: 0px;
          background-color: #FFFFFF;
          opacity:0.7;
      }

     #sfondosuperiore2{
          width:100%;
          height:5.3%;
	  position: absolute;
	  top: 0px;
	  left: 0px;
          background-color: #C0C0C0;
          opacity:0.8;
      }

     #sfondoinferiore{
          width:100%;
          height:5%;
	  position: absolute;
	  bottom: 0px;
	  left: 0px;
          background-color: #FFFFFF;
          opacity:0.5;
      }

     #sfondoinferiore2{
          width:100%;
          height:5.3%;
	  position: absolute;
	  bottom: 0px;
	  left: 0px;
          background-color: #C0C0C0;
          opacity:0.8;
      }




     #sfondo {
          width:100%;
          height: 100%;
	  position: absolute;
	  bottom: 0px;
	  left: 0px;
          background-color: #FFFFFF;
          opacity:0.5;
      }
  
     #scelta1{
          width:9%;
          height:4.7%;
	  position: absolute;
	  top: 62%;
	  left: 30.5%;
          background-color: #C0C0C0;
          opacity:0;
      }

     #scelta2{
          width:9%;
          height:4.7%;
	  position: absolute;
	  top: 62%;
	  left: 40.5%;
          background-color: #C0C0C0;
          opacity:0;
      }

     #sceltaprodotti{
          width:10%;
          height:0%;
	  position: absolute;
	  top: 64%;
	  left: 40%;
          border-radius: 10px;
          background-color: #F0F0F0;  
          opacity:1;

          transition-property: width, height, top, opacity, right;
          transition-duration: 1s;
 
          -webkit-transition-property: width, height, opacity, top, right;
          -webkit-transition-duration: 1s;
         
          -o-transition-property: width, height, top, opacity, right;
          -o-transition-duration: 1s;
         
          -moz-transition-property: width, height, top, opacity, right;
          -moz-transition-duration: 1s;

      }

     #sceltaprodotti2{
          width:10%;
          height:0%;
	  position: absolute;
	  top: 64%;
	  left: 40%;
          border-radius: 10px;
          background-color: #C0C0C0;
          opacity:1;
          transition-property: width, height, top, opacity, right;
          transition-duration: 1s;
 
          -webkit-transition-property: width, height, opacity, top, right;
          -webkit-transition-duration: 1s;
         
          -o-transition-property: width, height, top, opacity, right;
          -o-transition-duration: 1s;
         
          -moz-transition-property: width, height, top, opacity, right;
          -moz-transition-duration: 1s;
      }

     #sceltap1{
          width:100%;
          height:14%;
	  position: absolute;
	  top: 14%;
	  left: 0%;
          font-family: Verdana; 
          font-size: 11px;
          text-align: center;
          cursor: pointer;
      }

     #sceltap2{
          width:100%;
          height:14%;
	  position: absolute;
	  top: 29%;
	  left: 0%;
          font-family: Verdana; 
          font-size: 11px;
          text-align: center;
          cursor: pointer;
      }

     #sceltap3{
          width:100%;
          height:14%;
	  position: absolute;
	  top: 44%;
	  left: 0%;
          font-family: Verdana; 
          font-size: 11px;
          text-align: center;
          cursor: pointer;
      }

     #sceltap4{
          width:100%;
          height:14%;
	  position: absolute;
	  top: 59%;
	  left: 0%;
          font-family: Verdana; 
          font-size: 11px;
          text-align: center;
          cursor: pointer;
      }

     #sceltap5{
          width:100%;
          height:14%;
	  position: absolute;
	  top: 74%;
	  left: 0%;
          font-family: Verdana; 
          font-size: 11px;
          text-align: center;
          cursor: pointer;
      }

     #sceltap6{
          width:100%;
          height:15%;
	  position: absolute;
	  top: 89%;
	  left: 0%;
          font-family: Verdana; 
          font-size: 11px;
          text-align: center;
          cursor: pointer;
      }



     #scelta3{
          width:9%;
          height:4.7%;
	  position: absolute;
	  top: 62%;
	  left: 50.5%;
          background-color: #C0C0C0;
          opacity:0;
      }

     #scelta4{
          width:9%;
          height:4.7%;
	  position: absolute;
	  top: 62%;
	  left: 60.5%;
          background-color: #C0C0C0;
          opacity:0;
      }

 
     #scelta10{
          width:9%;
          height:4.7%;
	  position: absolute;
	  top: 63%;
	  left: 30.5%;
          font-family: Verdana; 
          font-size: 12px;
          text-align: center;
          font-weight: normal;
          cursor:pointer;

       }

     #scelta20{
          width:9%;
          height:4.7%;
	  position: absolute;
	  top: 63%;
	  left: 40.5%;
          font-family: Verdana; 
          font-size: 12px;
          text-align: center;
          font-weight: normal;
          cursor:pointer;
      }


     #scelta30{
          width:9%;
          height:4.7%;
	  position: absolute;
	  top: 63%;
	  left: 50.5%;
          font-family: Verdana; 
          font-size: 12px;
          text-align: center;
          font-weight: normal;
          cursor:pointer;
      }


     #scelta40{
          width:9%;
          height:4.7%;
	  position: absolute;
	  top: 63%;
	  left: 60.5%;
          font-family: Verdana; 
          font-size: 12px;
          text-align: center;
          font-weight: normal;
          cursor:pointer;
      }




/* dissolve */

.dissolve {
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0%;
 left: 0%;
 overflow: hidden;
 }

.dissolve .item {
 width: 100%;
 height: 100%;
 position: absolute;
 left: 0;
 right: 0;
 opacity: 0;
 -webkit-animation: dissolve 40s linear infinite;
 -moz-animation: dissolve 40s linear infinite;
 -ms-animation: dissolve 40s linear infinite;
 animation: dissolve 40s linear infinite}
.dissolve .item:nth-child(2) {-webkit-animation-delay: 5s;
 -moz-animation-delay: 10s;
 -ms-animation-delay: 10s;
 animation-delay: 10s}
.dissolve .item:nth-child(3) {-webkit-animation-delay: 10s;
 -moz-animation-delay: 20s;
 -ms-animation-delay: 20s;
 animation-delay: 20s}
.dissolve .item:nth-child(4) {-webkit-animation-delay: 15s;
 -moz-animation-delay: 30s;
 -ms-animation-delay: 30s;
 animation-delay: 30s}
/*
/* The keyframes calculations are based on assumption of 4 items in the carousel.
/* You should notice the pattern for your own calculations.
*/
/* If you plan to support Safari 4 for any reason, you *must* have 0% and 100% frames */
@-webkit-keyframes dissolve {0%, 30%, 100% {opacity: 0}
 5%, 25% {opacity: 1}}
@-moz-keyframes dissolve {0%, 30%, 100% {opacity: 0}
 5%, 25% {opacity: 1}}
@-ms-keyframes dissolve {0%, 30%, 100% {opacity: 0}
 5%, 25% {opacity: 1}}
@keyframes dissolve {0%, 30%, 100% {opacity: 0}
 5%, 25% {opacity: 1}}

/* dissolve */
@width: 100%; // width of the carousel
@height: 100%; // height of the carousel
@numberofitems: 4; // the number of items in the carousel
@visibleitemduration: 10s; // time during which a carousel item is fully visible
@transitionduration: 2s; // duration of the transition between two carousel items

@oneitemduration: @visibleitemduration + @transitionduration;
@carouselperiod: @oneitemduration * @numberofitems;

.dissolve {width:@width;
 height: @height;
 position:absolute;
 overflow: hidden} .item {position:absolute;
 left: 0;
 right: 0;
 opacity: 0;
 z-index: -1;

 -webkit-animation: dissolve @carouselperiod linear infinite;
 -moz-animation: dissolve @carouselperiod linear infinite;
 -ms-animation: dissolve @carouselperiod linear infinite;
 animation: dissolve @carouselperiod linear infinite;

 &:nth-child(2) {-webkit-animation-delay: @oneitemduration;
 -moz-animation-delay: @oneitemduration;
 -ms-animation-delay: @oneitemduration;
 animation-delay: @oneitemduration}
 &:nth-child(3) {-webkit-animation-delay: 2 * @oneitemduration;
 -moz-animation-delay: 2 * @oneitemduration;
 -ms-animation-delay: 2 * @oneitemduration;
 animation-delay: 2 * @oneitemduration}
 &:nth-child(4) {-webkit-animation-delay: 3 * @oneitemduration;
 -moz-animation-delay: 3 * @oneitemduration;
 -ms-animation-delay: 3 * @oneitemduration;
 animation-delay: 3 * @oneitemduration}}}

/*
/* The keyframes calculations are based on assumption of 4 items in the carousel.
/* You should notice the pattern for your own calculations.
*/
/* If you plan to support Safari 4 for any reason, you *must* have 0% and 100% frames */
@-webkit-keyframes dissolve {0%, 30%, 100% {opacity: 0}
 5%, 25% {opacity: 1}}
@-moz-keyframes dissolve {0%, 30%, 100% {opacity: 0}
 5%, 25% {opacity: 1}}
@-ms-keyframes dissolve {0%, 30%, 100% {opacity: 0}
 5%, 25% {opacity: 1}}
@keyframes dissolve {0%, 30%, 100% {opacity: 0}
 5%, 25% {opacity: 1}}
#creditiangelneo {float: right; font-size: 10px; font-style: italic; margin-right: 20px}

    