/*autocomplete*/ .autocompleteCLASSEHTML { /*the container must be positioned relative:*/ position: relative; display: inline-block; } .autocompleteCLASSEHTML-items { position: absolute; border: 1px solid #d4d4d4; border-bottom: none; border-top: none; z-index: 99; /*position the autocomplete items to be the same width as the container:*/ top: 100%; left: 0; right: 0; } .autocompleteCLASSEHTML-items div { padding: 10px; cursor: pointer; background-color: #fff; border-bottom: 1px solid #d4d4d4; } .autocompleteCLASSEHTML-items div:hover { /*when hovering an item:*/ background-color: #e9e9e9; } .autocompleteCLASSEHTML-active { /*when navigating through the items using the arrow keys:*/ background-color: DodgerBlue !important; color: #ffffff; } /*FINE AUTOCOMPLETE*/ .div_tooltipNascosto { display:none; } .tooltiptext_infoBox { width: 140px; color: #fff; text-align: center; border-radius: 6px; padding: 0.4em; border: 1px solid transparent; /* Position the tooltip */ position: absolute; left:-140px; top:0px; font-family: Lucida Grande, Lucida Sans, Verdana, Arial, sans-serif; font-size:11px; z-index:1000; } .tooltiptext_infoBox_primary { color: #004085; background-color: #cce5ff; border-color: #b8daff; } .tooltiptext_infoBox_danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; } .tooltiptext_infoBox_warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba; } /*creare thumbnail con zoom immagine*/ /**THE SAME CSS IS USED IN ALL 3 DEMOS**/ /**gallery margins**/ ul.gallery{ margin-left: 3vw; margin-right:3vw; } .zoom { -webkit-transition: all 0.35s ease-in-out; -moz-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .zoom:hover, .zoom:active, .zoom:focus { /**adjust scale to desired size, add browser prefixes**/ -ms-transform: scale(8.0); -moz-transform: scale(8.0); -webkit-transform: scale(8.0); -o-transform: scale(8.0); transform: scale(8.0); position:relative; z-index:100; } /**To keep upscaled images visible on mobile, increase left & right margins a bit**/ @media only screen and (max-width: 768px) { ul.gallery { margin-left: 15vw; margin-right: 15vw; } /**TIP: Easy escape for touch screens, give gallery's parent container a cursor: pointer.**/ .DivName {cursor: pointer} } /*FINE CREAZIONE THUMBNAIL CON ZOOM */