.ValTube{
width:170px;
  height: 150px;
}
.ValTube:hover{
display:block;
box-shadow:  0 13px 10px -10px rgba(0, 0, 0, 0.6);
-webkit-transform: scale(3);
-ms-transform:scale(3);
-moz-transform:scale(3);
transform:scale(3);
border:solid 1px;
padding:1px;
background-color: #000;
  border-radius: 3px;
float:left;
z-index:999999;


}

.KP_Nomi {display:block; width:50%;color:aliceblue;font-family:Arial}
.KP_Image {
    display:block;
    height: auto;
    float:left;
    background-repeat: no-repeat;
    text-align:center;
    border-radius: 7px;
    border:solid;
    box-shadow:  0 10px 10px -10px rgba(0, 0, 0, 0.5);
}

.KP_header {
    /*background:url(Images/logo.png) no-repeat;*/
   position:fixed;
    width:100%; 
    height:10%;
    top:1px;
    z-index:9999;
     box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;
   background-color:#D22513;
   
}

.Kp_logo{
    background:url(Images/logo2.png) no-repeat;
     width:31px;
     height:39px; 
     display:block;
     box-shadow:  0 10px 10px -10px rgba(0, 0, 0, 0.5);
     
}


.KP_Intestazione{   width: 99%;  
    position: fixed; /*relative;*/ 
    /*float:right;*/ 
    overflow: auto;
    /*border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);*/
    display: block;
    /*margin: 10px;*/
    text-align:center;
    /*border-radius: 10px;
    padding: 10px;*/
    font-weight:bold;
    font-size:small;
   z-index:9999;
   top:5%;
}

.KP_Tabe{   width: 97%;  
    position: relative; 
    /*float:right;*/ 
    overflow: auto;
    border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;
    margin: 3px;
    text-align:center;
    border-radius: 10px;
    padding: 3px;
    font-weight:bold;
    font-size:small;

}

.KP_Tabe1{   width: 98%;  
    position: relative; 
    /*float:right;*/ 
    overflow: auto;
    border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;
    margin: 3px;
    text-align:center;
    border-radius: 10px;
    padding: 3px;
    font-weight:bold;
    font-size:small;

}

.KP_Intestazione:hoveraaaaa {
        -webkit-transition: all 0.7s ease-out;
        -moz-transition: all 0.7s ease-out;
        -o-transition: all 0.7s ease-out;
        transition: all 0.7s ease-out;
        -webkit-perspective: 100;
        -moz-perspective: 100;
        -ms-perspective: 100;
         perspective: 100;
         background-color: #FC3;
        -webkit-transform:  scale(1.5);
        -moz-trasformano :  scale(1.5);
        -o-transform:  scale(1.5);
        -ms-transform:  scale(1.5); 
        transform:  scale(1.5);
     }
.KP_Convocati_num {
    width: 10%;  
    position: relative; 
    float:left; 
    overflow: auto;
    /*border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;*/
    /*margin: 5px;*/
    /*text-align:center;
    border-radius: 15px;*/
    /*padding: 3px;*/
    font-weight:bold;
    font-size: medium ;
    color:red;
    /*left:5%;*/

    display: block;
    padding: 1px ;
    border: 1px solid #ddd;
    /*color: #666;*/
    text-shadow: 0px 1px 0px #fff;
    -webkit-border-radius: 5px!important;
    -moz-border-radius: 5px!important;
    border-radius: 5px!important;
    -webkit-box-shadow: 0px 3px 0 0px #999;
    -moz-box-shadow: 0px 3px 0 0px #999;
    /*box-shadow:  0 10px 10px -10px rgba(0, 0, 0, 0.5);*/
    box-shadow: 0px 3px 0 0px #999;
    background: #ececec;
    background: -moz-linear-gradient(top,#ffffff 0%,#ececec 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#ffffff),color-stop(100%,#ececec));
    background: -webkit-linear-gradient(top,#ffffff 0%,#ececec 100%);
    background: -o-linear-gradient(top,#ffffff 0%,#ececec 100%);
    background: -ms-linear-gradient(top,#ffffff 0%,#ececec 100%);
    background: linear-gradient(top,#ffffff 0%,#ececec 100%);
    text-align:center;




    background: #ececec;
    background: -moz-linear-gradient(top,#ffffff 0%,#ececec 100%);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#ffffff),color-stop(100%,#ececec));
    background: -webkit-linear-gradient(top,#ffffff 0%,#ececec 100%);
    background: -o-linear-gradient(top,#ffffff 0%,#ececec 100%);
    background: -ms-linear-gradient(top,#ffffff 0%,#ececec 100%);
    background: linear-gradient(top,#ffffff 0%,#ececec 100%);





}
.KP_Convocati {
    width: 35%;  
    left:5%;
    position: relative; 
    float:left; 
    overflow: auto;
    border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;
    margin: 5px;
    text-align:center;
    border-radius: 10px;
    padding: 3px;
    font-weight:bold;
    font-size: large;
    color:#000066;
   
}
.KP_Gara {
    width: 10%;  
    height:6%;
    left:2%;
    position: relative; 
    float:left; 
    overflow: auto;
    border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;
    margin: 5px;
    text-align:center;
    border-radius: 10px;
    padding: 3px;
    font-weight:bold;
    font-size: small;
    color:#000066;
}
.KP_Gara_intesta {
    width: 20%;  
    height:6%;
    left:2%;
    position: relative; 
    float:left; 
    overflow: auto;
    border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;
    margin: 5px;
    text-align:center;
    border-radius: 10px;
    padding: 3px;
    font-weight:bold;
    font-size: large;
    color:#000066;
}

.KP_Footer {
    width: 15%;  
    height:10%;
    left:2%;
    position: relative; 
    float:left; 
    overflow: auto;
    border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;
    margin: 5px;
    text-align:center;
    border-radius: 10px;
    padding: 3px;
    font-weight:bold;
    font-size: medium;
    color:#000066;
    vertical-align:central;
}
.KP_Footer_intesta {
    width: 20%;  
    height: 10%;
    left:2%;
    position: relative; 
    float:left; 
    overflow: auto;
    border: 1px solid #E5E5E5; 
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5);
    display: block;
    margin: 5px;
    text-align:center;
    border-radius: 10px;
    padding: 3px;
    font-weight:bold;
    font-size: medium;
    color:#000066;
    vertical-align:central;
}
imput,textarea{
    width:auto;
}

.VALFormPopup {
    position: absolute;
    padding: 11px;
    background: #fff;
    -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.5);
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.5);
	z-index: 100000;
    top: 230%;
    left: 25%;
    width: 50%;
    height: 50% ;
    display:inline;
   border-radius: 4px;
     /*-webkit-transition: all 7s ease-out;
    -moz-transition: all 7s ease-out;
    -o-transition: all 7s ease-out;
    transition: all 7s ease-out;
     -webkit-transform: scale(1.2);
        -webkit-transform-style: preserve-3d;
        -moz-transform: scale(1.2);
        -moz-transform-style: preserve-3d;
        -ms-transform:  scale(1.2);
        -ms-transform-style: preserve-3d;
        -o-transform:  scale(1.2);*/
}
   

/*.VALFormPopup:hover{
     -webkit-transform: scale(1.2);
        -webkit-transform-style: preserve-3d;
        -moz-transform: scale(1.2);
        -moz-transform-style: preserve-3d;
        -ms-transform:  scale(1.2);
        -ms-transform-style: preserve-3d;
        -o-transform:  scale(1.2);
}*/

    .VALFormPopup .VALModalCtrl {
        display: block;
        position: absolute;
        top: 1px;
        right: -5px;
        left:96%;
        width: 2px;
        height: 2px;
        border-radius: 10px;
        background-color: #fff;
        -webkit-border-radius: 50px;
        box-shadow: 0px 0px 5px #666;
         background: #585858 url('Images/closeBtn.png') no-repeat center;
         
    }

      .VALFormPopup .VALModalCtrl1 {
        display: block;
        position: absolute;
        top: 260px;
        left:50%;
      
        width: 3px;
        height: 3px;
        border-radius: 10px;
        background-color: #fff;
        -webkit-border-radius: 50px;
        box-shadow: 0px 0px 5px #666;
        background: #585858 url('Images/next.png') no-repeat center;
    }

       .VALFormPopup .VALModalCtrl2 {
        display: block;
        position: absolute;
        top: 10px;
        left:10%;
       z-index:999999;
        width: 3px;
        height: 3px;
        border-radius: 10px;
        background-color: #fff;
        -webkit-border-radius: 50px;
        box-shadow: 0px 0px 5px #666;
        background: #585858 url('Images/next.png') no-repeat center;
    }
.Vale_Help1 {
    background-image: url('Images/icon_help_32px.gif');
    background-repeat: no-repeat;
    width: 32px;
    height: 32px;
    font-size: 0%;
    display: block;
    float: left;
    line-height:1.42857143;
   
}

    
.Vale_Help1:hover {
position:absolute  ;
z-index:1070;
display:block;
right:-50px;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
font-size:12px;
line-break:auto;
width:30%;
filter:alpha(opacity=70);
opacity:.7;
max-width:200px;
padding:3px 35px;
color:#fff;
/*text-align:center;*/
background-color:#000;
border-radius:4px;
/*font-size: 75%;*/
/*width: 70% ;*/
height:auto;
max-height:250px;
min-height:40px;
/*top:-18px;*/
 cursor: help  ;
}

.pager-main {
    height: 35px;
    margin-bottom: 10px;
}

.KP_pager a {
    display: block;
    padding: 5px 10px;
    border: 1px solid #ddd;
    /*color: #666;*/
    text-shadow: 0px 1px 0px #fff;
    -webkit-border-radius: 5px!important;
    -moz-border-radius: 5px!important;
    border-radius: 5px!important;
    -webkit-box-shadow: 0px 3px 0 0px #999;
    -moz-box-shadow: 0px 3px 0 0px #999;
    /*box-shadow:  0 10px 10px -10px rgba(0, 0, 0, 0.5);*/
    box-shadow: 0px 3px 0 0px #999;
    /*background: #c0c0c0;*/
   
}
.KP_pager:visited {
    transform:  scale(1.5);
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
       -webkit-transition: all 0.7s ease-out;
        -moz-transition: all 0.7s ease-out;
        -o-transition: all 0.7s ease-out;
        transition: all 0.7s ease-out;
}

.Val_DescrMani {background-color: #cccccc;

    border-bottom: none;
    border-right: none;
    padding: 10px 20px;
    font-size: 1.1em;
    
}

.Val_DescriMani {background-color:#ddd9c3;

    border-bottom: none;
    border-right: none;
    padding: 10px 20px;
   /* font-size: 1.1rem;*/
}

.Val_DescriManiInfo {background-color:#747473;
    border-bottom: none;
    border-right: none;
    padding: 10px 20px;
    font-size:0.9rem;
color:#ffffff;
}
.Val_modelo {
    margin-bottom: 7px;
    line-height: 35px;
    font-weight: bold;
    border-radius: 10px;
    box-shadow: 0 0 6px rgba(0,0,0,0.2);
    width: 3%;
    height: 70px;
    font-size: smaller;
    background-color:white;
    back
    }
 .Val_model {
    margin-bottom: 7px;
    line-height: 35px;
    font-weight: bold;
    border-radius: 10px;
    box-shadow: 0 0 6px rgba(0,0,0,0.2);
    width: 3%;
    height: 100px;
    font-size: smaller;
    background-color:white;
    back
    }
    .Val_model:hover{
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out;
    -webkit-perspective: 100px;
    -moz-perspective: 100px;
    -ms-perspective: 100px;
    perspective: 100px;
    -webkit-transform: rotateY(360deg);
    -webkit-transform-style: preserve-3d;
    -moz-transform: rotateY(360deg);
    -moz-transform-style: preserve-3d;
    -ms-transform: rotateY(360deg);
    -ms-transform-style: preserve-3d;
    -o-transform: rotateY(360deg);
    }


.slideoutTab {
    padding-top: 12px;
    padding-bottom: 12px;
    z-index:    1000000000000;
}

#slideout {
    position: fixed;
    top: 200px;
    right: 0;
    width: 100px;
    height: 100px;
    padding: 0px;
    text-align: center;
    background: #b81818;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-border-radius: 5px 0 0px 5px;
    -moz-border-radius: 5px 0 0px 5px;
    border-radius: 5px 0 0px 5px;
    box-shadow: 1px 1px 6px 1px #333333;
    z-index: 99999999;
    opacity: 0.4;
}
#slideout_inner {
    position: fixed;
    top: inherit;
    right: -250px;
    background: #f0f0f0;
    width: 200px;
    padding: 25px;
    height: 300px;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    text-align: left;
    -webkit-border-radius: 5px 0 0px 0;
    -moz-border-radius: 5px 0 0px 0;
    border-radius: 5px 0 0px 0;
    z-index:    99999999;
}
#slideout_inner p {
    width: 190px;
    font-size: 19px;
    text-transform: uppercase;
    margin-bottom: 10px;
}
#slideout:hover {
    right: 250px;
    opacity: 1.0;
}
#slideout:hover #slideout_inner {
    right: 0;

}
.ValClub {

    top: 5%;
    right: 5%;
    text-align: center;
     -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    z-index: 999999;
    opacity: 0.4;

}


 
    .ValClub:hover {opacity: 1.0;
    transform:  scale(1.5);
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out;
    }
 .header {
   /* background-color: #00b050;*/
  background-image: -webkit-gradient(linear, left top ,right bottom , from(#054e04), to(#84de82));
    color: white;
    text-shadow: 2px 2px 4px #000000;
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    position: relative;
    top: 0;
    width: 98%;
    transition: 0.2s;
    position: -webkit-sticky;
    position: sticky;
    box-shadow: 0 15px 25px rgba(0, 0, 0, 0.3);
    }

.Val_Meteo
{
  padding:10px;
  border: 1px solid grey; 
  text-align: center; 
  border-radius: 10px; 
  
  box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
   
}

#header {
    background-image: -webkit-gradient(linear, left top ,right bottom , from(#054e04), to(#84de82));
    padding: 30px 10px;
    color: white;
    text-shadow: 2px 2px 4px #000000;
    text-align: center;
    font-size: 35px;
    font-weight: bold;
    position: relative;
    top: 0;
    width: 98%;
    transition: 0.2s;
    position: -webkit-sticky;
    position: sticky;
    box-shadow: 0 15px 25px rgba(0, 0, 0, 0.3);
    }



.Valbutton {
  margin-left: 1%;
  margin-right: 50%;
  margin-bottom:1%;
  padding: 1%;
  
  -webkit-border-radius: 6px;
          border-radius: 6px;
          background-color:#FFFF99; 
          /*border:  outset;*/
/*width: 50%;*/
  /* IE10 */ 
background-image: -ms-linear-gradient(top right, #FFFFFF 0%, #FFFF99 100%);
/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top right, #FFFFFF 0%, #FFFF99 100%);
/* Opera */ 
background-image: -o-linear-gradient(top right, #FFFFFF 0%, #FFFF99 100%);
/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, right top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #FFFF99));
/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top right, #FFFFFF 0%, #FFFF99 100%);
/* Regola standard */ 
background-image: linear-gradient(to top right, #FFFFFF 0%, #FFFF99 100%);

  background-image: linear-gradient(top right, #FFFFFF 0%, #FFFF99 100%);
         
}
.Val_button {
  margin-left: auto;
  margin-right: auto;
  padding: 2%;
  background-color: rgba(0,0,0,0.5);
  -webkit-border-radius: 6px;
          border-radius: 6px;
          background-color:#FFFF99; 
         cursor: pointer;
         font-size:medium;
         color: #fff;
  /*  background-color: #007bff;
    border-color: #007bff;*/
    background-image: -webkit-gradient(linear, left top ,right bottom , from(#054e04), to(#84de82));
}
.Val_button:hover {
         -webkit-box-shadow: 0 6px 4px rgba(0,0,0,0.05);
        /* box-shadow: 0 6px 4px rgba(0,0,0,0.05);*/
         font-size:medium;
        /* background-color: #117a8b;*/
         background-image: -webkit-gradient(linear, left top ,right bottom , from(#84de82), to(#054e04));
         box-shadow:  0 13px 10px -10px rgba(0, 0, 0, 0.6);
         color: yellow;
}


/* The Modal */
#myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}

#myImg:hover {opacity: 0.7;}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.5); /* Black w/ opacity */
}

/* Modal Content (image) */
.modal-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
}

/* Caption of Modal Image */
#caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

/* Add Animation */
.modal-content, #caption {  
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
  from {-webkit-transform:scale(0)} 
  to {-webkit-transform:scale(1)}
}

@keyframes zoom {
  from {transform:scale(0)} 
  to {transform:scale(1)}
}

/* The Close Button */
.close {
  position: absolute;
  top: 15%;
  right: 2%;
  color: #ffffff;
  font-size: 50px;
  font-weight: bold;
  transition: 0.3s;
  z-index: 999;
   
}

.close:hover,
.close:focus {
  color: rgb(247, 247, 247);
  text-decoration: none;
  cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
  .modal-content {
    width: 100%;
  }
}