.elementor-465503 .elementor-element.elementor-element-967686d{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--gap:0px 60px;--row-gap:0px;--column-gap:60px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-465503 .elementor-element.elementor-element-967686d.e-con{--align-self:center;}@media(max-width:767px){.elementor-465503 .elementor-element.elementor-element-967686d{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:10px;--padding-right:10px;}}@media(min-width:768px){.elementor-465503 .elementor-element.elementor-element-967686d{--content-width:1256px;}}/* Start custom CSS for container, class: .elementor-element-967686d */i{ 
    background-color: #D8F6E1;
    padding: 5px;
    border-radius: 100px;
    width: 20px !important;
    height: 20px !important;
    
}

.e-hotspot__icon i{ 
    font-size: 8px;
    background-color: #ddd;
    padding: 4px;
    border-radius: 100px;
    width: 15px !important;
    height: 15px !important;
}

sup,
sub {
  font-size: 32.4px;       /* smaller than surrounding text */
  line-height: 0;          /* avoids extra line height */
  position: relative;      /* lets us nudge them */
  vertical-align: sub;
}

/****** Column Ribbon Styling ******/

/* Use IDs to target specific ribbons. #column1-ribbon, #column2-ribbon, #column3-ribbon */

.ribbon {
 font-size: 16px !important;
 /* This ribbon is based on a 16px font side and a 24px vertical rhythm. I've used em's to position each element for scalability. If you want to use a different font size you may have to play with the position of the ribbon elements */

 width: 108%;
    
 position: relative;
 background: #5F56FA;
 color: white !important;
 text-align: center;
 padding: 0.8em 2em; /* Adjust to suit */
 margin: 2em auto 3em; /* Based on 24px vertical rhythm. 48px bottom margin - normally 24 but the ribbon 'graphics' take up 24px themselves so we double it. */
}
.ribbon:before, .ribbon:after {
 content: "";
 position: absolute;
 display: block;
 bottom: -1em;
 border: 1.5em solid transparent;
 z-index: -1;
}
.ribbon:before {
 left: -2em;
 border-right-width: 1.5em;
 border-left-color: transparent;
}
.ribbon:after {
 right: -2em;
 border-left-width: 1.5em;
 border-right-color: transparent;
}
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
 content: "";
 position: absolute;
 display: block;
 border-style: solid;
 border-color: #804f7c transparent transparent transparent;
 bottom: -1em;
}
.ribbon .ribbon-content:before {
 left: 0;
 border-width: 1em 0 0 1em;
}
.ribbon .ribbon-content:after {
 right: 0;
 border-width: 1em 1em 0 0;
}/* End custom CSS */