.custom-tooltip-trigger {
  position: relative;
  cursor: pointer;
  padding-right: 15px;
}

.custom-tooltip {
  display: none;
  font-family: 'SourceSansPro-Regular', sans-serif;
  font-size: 15px;
  position: absolute;
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  z-index: 999;
  top: 100%;
  left: 0;
  width: 400px;
}

.tooltip-size-1 {
  width: 250px;
}

.tooltip-size-2 {
  width: 330px;
}

.custom-tooltip-trigger:hover .custom-tooltip {
  display: block;
}

.custom-tooltip-trigger .info-icon {
  display: inline-block;
  position: absolute;
  top: -0.1em;
  font-size: 0.7em;
  color: #F57320;
}

.tooltip-columns {
  display: flex;
}

.tooltip-column {
  flex: 1;
  padding-right: 10px;
}

@media (max-width: 991.98px) {
  .tooltip-mobile-1 {
    margin-top: 30px;
  }

  .tooltip-size-2 {
    width: 230px;
}

.tooltip-1-left {
  margin-left: -40px;
}

.tooltip-2-left {
  margin-left: -160px;
}
}

@media (max-width: 575px) {
  .iphone-tooltip {
    margin-top: 30px;
  }

  .iphone-tooltip-es {
    margin-top: 0px;
  }
}

/* Styles specific to iPhone 12 Pro */
@media only screen and (min-device-width : 390px) and (max-device-width : 390px) and (min-device-height : 844px) and (max-device-height : 844px) 
  and (-webkit-device-pixel-ratio : 3) { /* For retina display */
    .iphone-tooltip {
      margin: 1px;
    }

    .tooltip-mobile-1 {
      width: 250px;
      margin-left: -200px;
    }
}




@media only screen and (min-width: 414px) and (max-width: 414px) and (min-height: 736px) and (max-height: 736px) {
/* iPhone 6/7/8 */
  .tooltip-mobile-1 {
    margin-top: 0px;
  }
}

/* Styles specific for screen size 414px by 896px */
@media only screen and (min-device-width: 414px) and (max-device-width: 414px) and (min-device-height: 896px) and (max-device-height: 896px) {
  .tooltip-mobile-1 {
    margin-top: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
  /* Your CSS styles for iPad 768x1024 go here */
  .tooltip-mobile-1 {
    margin-top: 0px;
  }

}

/* Show the image only on laptop screens (1280px wide) */
@media screen and (min-width: 1025px) and (max-width: 1280px) {
  .tooltip-laptop-1 {
    top: -1em;
  }

  .tooltip-laptop-2 {
    top: 2em !important;
  }
}