.field1 {
  position: absolute; right:10px; margin:0px 0px;
  padding: 0px; border:0px solid red;  text-align:center; z-index:1;
}

.numero {
  width:20px; height:20px; border:0px solid red; position: absolute; right:5px; margin:-7px 0px; font-size:10px; color:#fff; line-height:20px; text-align:center; background: #0396ea; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%;
}


button.like {
  padding: 8px 20px; margin:0px 0px;
  border: none;
  outline: none;
  background: #ccc;
  transition: 0.15s ease-in-out;
  -webkit-transition: 0.15s ease-in-out;
-moz-transition: 0.15s ease-in-out;
-ms-transition: 0.15s ease-in-out;
-o-transition: 0.15s ease-in-out;
  color: white; height:50px;
  text-decoration: none;
  border-radius: 0px;
  display: inline-block; cursor:pointer;
}

button.like a:hover {
  background: #0396ea;
}


.field {
  position: absolute; right:10px; margin:0px 0px;
  padding: 0px; border:0px solid red; width:240px; text-align:center;
}

button, .btn, input[type='submit'] {
  padding: 8px 20px; margin:0px 0px;
  border: none;
  outline: none;
  background: #ccc;
  transition: 0.15s ease-in-out;
  -webkit-transition: 0.15s ease-in-out;
-moz-transition: 0.15s ease-in-out;
-ms-transition: 0.15s ease-in-out;
-o-transition: 0.15s ease-in-out;
  color: white; height:50px;
  text-decoration: none;
  border-radius: 0px;
  display: inline-block; xwidth:250px; cursor:pointer;
}
button:hover, button:focus, .btn:hover, .btn:focus, input[type='submit']:hover, input[type='submit']:focus {
  background: #0396ea;
}

.has-tooltip:hover + .tooltip,
.has-tooltip:focus + .tooltip,
.has-tooltip.hover + .tooltip {
  opacity: 1;  -moz-opacity:1; -webkit-opacity:1; filter:alpha(opacity=1);
  transform: translate(-50%, -100%) scale(1) rotate(0deg);
  pointer-events: inherit; 
}




.tooltip {
  display: block;
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.75) rotate(5deg);
  -webkit-transform: translate(-50%, -50%) scale(0.75) rotate(5deg);
-moz-transform: translate(-50%, -50%) scale(0.75) rotate(5deg);
-o-transform: translate(-50%, -50%) scale(0.75) rotate(5deg);
-ms-transform: translate(-50%, -50%) scale(0.75) rotate(5deg);
  transform-origin: bottom center;
  padding: 10px 10px;
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.75);
  text-align: center;
  color: white;
  transition: 0.15s ease-in-out;
  -webkit-transition: 0.15s ease-in-out;
-moz-transition: 0.15s ease-in-out;
-ms-transition: 0.15s ease-in-out;
-o-transition: 0.15s ease-in-out;
  
  opacity: 0; -moz-opacity:0; -webkit-opacity:0; filter:alpha(opacity=0);
  width: 100%;
  max-width: 250px;
  pointer-events: none; z-index:30;

}
.tooltip.blue {
  background: rgba(0, 0, 0, 0.9);
}
.tooltip.blue:after {
  border-top: 5px solid rgba(0, 0, 0, 0.9);
}

.tooltip:hover {
  opacity: 1;
   -moz-opacity:1; -webkit-opacity:1; filter:alpha(opacity=1);
  transform: translate(-50%, -100%) scale(1) rotate(0deg);
  -webkit-transform: translate(-50%, -100%) scale(1) rotate(0deg);
-moz-transform: translate(-50%, -100%) scale(1) rotate(0deg);
-o-transform: translate(-50%, -100%) scale(1) rotate(0deg);
-ms-transform: translate(-50%, -100%) scale(1) rotate(0deg);

  pointer-events: inherit;
}

.tooltip:after {
  content: "";
  display: block;
  margin: 0 auto;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-top: 5px solid rgba(0, 0, 0, 0.75);
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 100%);
  -webkit-transform: translate(-50%, 100%);
-moz-transform: translate(-50%, 100%);
-o-transform: translate(-50%, 100%);
-ms-transform: translate(-50%, 100%);
}

.tooltip p {
  clear:both; text-align:left; border:0px solid red; margin:0px 0px 2px 0px; padding:0px 0px 0px 0px;
}

.tooltip p a {
  color:#fff; padding:0px 5px; margin:0px 3px 0px 3px; display:inline-block;
}
.tooltip p a:hover {
  color:#0396ea;
}

.xtooltip p img {
  width:25px; display:inline-block;
}