/
var
/
www
/
barefootlaw.org
/
wp-content
/
plugins
/
vc-shortcodes
/
shortcodes
/
hotspot
/
css
/
Upload File
HOME
@charset "utf-8"; /* Hotspot Shortcode CSS */ .asvc-hotspot-wrapper { position: relative; text-align: center; line-height: .5; } .asvc-hotspot-wrapper .asvc-tooltip-position-left .HotspotPlugin_Hotspot > div { top: 50%; left: auto; right: 100%; margin: 0 10px 0 0; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } .asvc-hotspot-wrapper .asvc-tooltip-position-left .HotspotPlugin_Hotspot > div.hidden { -webkit-transform: translate(0, -50%) scale(.85); -moz-transform: translate(0, -50%) scale(.85); -o-transform: translate(0, -50%) scale(.85); transform: translate(0, -50%) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-left .HotspotPlugin_Hotspot > div:not(.hidden) { -webkit-transform: translate(0, -50%) scale(1); -moz-transform: translate(0, -50%) scale(1); -o-transform: translate(0, -50%) scale(1); transform: translate(0, -50%) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-left .HotspotPlugin_Hotspot > div.asvc-hotspot-left { left: 100%; right: auto; margin: 0 0 0 10px; } .asvc-hotspot-wrapper .asvc-tooltip-position-right .HotspotPlugin_Hotspot > div { top: 50%; left: 100%; margin: 0 0 0 10px; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } .asvc-hotspot-wrapper .asvc-tooltip-position-right .HotspotPlugin_Hotspot > div.hidden { -webkit-transform: translate(0, -50%) scale(.85); -moz-transform: translate(0, -50%) scale(.85); -o-transform: translate(0, -50%) scale(.85); transform: translate(0, -50%) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-right .HotspotPlugin_Hotspot > div:not(.hidden) { -webkit-transform: translate(0, -50%) scale(1); -moz-transform: translate(0, -50%) scale(1); -o-transform: translate(0, -50%) scale(1); transform: translate(0, -50%) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-right .HotspotPlugin_Hotspot > div.asvc-hotspot-right { left: auto; right: 100%; margin: 0 10px 0 0; } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div { top: auto; bottom: 100%; left: 50%; margin: 0 0 10px 0; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div.asvc-hotspot-left { -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div.asvc-hotspot-right { -webkit-transform: translate(-100%, 0); -moz-transform: translate(-100%, 0); -o-transform: translate(-100%, 0); transform: translate(-100%, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div.hidden { -webkit-transform: translate(-50%, 0) scale(.85); -moz-transform: translate(-50%, 0) scale(.85); -o-transform: translate(-50%, 0) scale(.85); transform: translate(-50%, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div.hidden.asvc-hotspot-left { -webkit-transform: translate(0, 0) scale(.85); -moz-transform: translate(0, 0) scale(.85); -o-transform: translate(0, 0) scale(.85); transform: translate(0, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div.hidden.asvc-hotspot-right { -webkit-transform: translate(-100%, 0) scale(.85); -moz-transform: translate(-100%, 0) scale(.85); -o-transform: translate(-100%, 0) scale(.85); transform: translate(-100%, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div:not(.hidden) { -webkit-transform: translate(-50%, 0) scale(1); -moz-transform: translate(-50%, 0) scale(1); -o-transform: translate(-50%, 0) scale(1); transform: translate(-50%, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div:not(.hidden).asvc-hotspot-left { -webkit-transform: translate(0, 0) scale(1); -moz-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-top .HotspotPlugin_Hotspot > div:not(.hidden).asvc-hotspot-right { -webkit-transform: translate(-100%, 0) scale(1); -moz-transform: translate(-100%, 0) scale(1); -o-transform: translate(-100%, 0) scale(1); transform: translate(-100%, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div { top: 100%; left: 50%; margin: 10px 0 0 0; -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div.asvc-hotspot-left { -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div.asvc-hotspot-right { -webkit-transform: translate(-100%, 0); -moz-transform: translate(-100%, 0); -o-transform: translate(-100%, 0); transform: translate(-100%, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div.hidden { -webkit-transform: translate(-50%, 0) scale(.85); -moz-transform: translate(-50%, 0) scale(.85); -o-transform: translate(-50%, 0) scale(.85); transform: translate(-50%, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div.hidden.asvc-hotspot-left { -webkit-transform: translate(0, 0) scale(.85); -moz-transform: translate(0, 0) scale(.85); -o-transform: translate(0, 0) scale(.85); transform: translate(0, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div.hidden.asvc-hotspot-right { -webkit-transform: translate(-100%, 0) scale(.85); -moz-transform: translate(-100%, 0) scale(.85); -o-transform: translate(-100%, 0) scale(.85); transform: translate(-100%, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div:not(.hidden) { -webkit-transform: translate(-50%, 0) scale(1); -moz-transform: translate(-50%, 0) scale(1); -o-transform: translate(-50%, 0) scale(1); transform: translate(-50%, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div:not(.hidden).asvc-hotspot-left { -webkit-transform: translate(0, 0) scale(1); -moz-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom .HotspotPlugin_Hotspot > div:not(.hidden).asvc-hotspot-right { -webkit-transform: translate(-100%, 0) scale(1); -moz-transform: translate(-100%, 0) scale(1); -o-transform: translate(-100%, 0) scale(1); transform: translate(-100%, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-top-left .HotspotPlugin_Hotspot > div { top: auto; bottom: 100%; left: auto; right: 100%; margin: 0 10px 10px 0; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-top-left .HotspotPlugin_Hotspot > div.asvc-hotspot-left { left: 100%; right: auto; margin: 0 0 10px 10px; } .asvc-hotspot-wrapper .asvc-tooltip-position-top-left .HotspotPlugin_Hotspot > div.hidden { -webkit-transform: translate(0, 0) scale(.85); -moz-transform: translate(0, 0) scale(.85); -o-transform: translate(0, 0) scale(.85); transform: translate(0, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-top-left .HotspotPlugin_Hotspot > div:not(.hidden) { -webkit-transform: translate(0, 0) scale(1); -moz-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-top-right .HotspotPlugin_Hotspot > div { top: auto; bottom: 100%; left: 100%; margin: 0 0 10px 10px; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-top-right .HotspotPlugin_Hotspot > div.asvc-hotspot-right { left: auto; right: 100%; margin: 0 10px 10px 0; } .asvc-hotspot-wrapper .asvc-tooltip-position-top-right .HotspotPlugin_Hotspot > div.hidden { -webkit-transform: translate(0, 0) scale(.85); -moz-transform: translate(0, 0) scale(.85); -o-transform: translate(0, 0) scale(.85); transform: translate(0, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-top-right .HotspotPlugin_Hotspot > div:not(.hidden) { -webkit-transform: translate(0, 0) scale(1); -moz-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom-left .HotspotPlugin_Hotspot > div { top: 100%; left: auto; right: 100%; margin: 10px 10px 0 0; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom-left .HotspotPlugin_Hotspot > div.asvc-hotspot-left { left: 100%; right: auto; margin: 10px 0 0 10px; } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom-left .HotspotPlugin_Hotspot > div.hidden { -webkit-transform: translate(0, 0) scale(.85); -moz-transform: translate(0, 0) scale(.85); -o-transform: translate(0, 0) scale(.85); transform: translate(0, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom-left .HotspotPlugin_Hotspot > div:not(.hidden) { -webkit-transform: translate(0, 0) scale(1); -moz-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom-right .HotspotPlugin_Hotspot > div { top: 100%; left: 100%; margin: 10px 0 0 10px; -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom-right .HotspotPlugin_Hotspot > div.asvc-hotspot-right { left: auto; right: 100%; margin: 10px 10px 0 0; } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom-right .HotspotPlugin_Hotspot > div.hidden { -webkit-transform: translate(0, 0) scale(.85); -moz-transform: translate(0, 0) scale(.85); -o-transform: translate(0, 0) scale(.85); transform: translate(0, 0) scale(.85); } .asvc-hotspot-wrapper .asvc-tooltip-position-bottom-right .HotspotPlugin_Hotspot > div:not(.hidden) { -webkit-transform: translate(0, 0) scale(1); -moz-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot > div { font-size: 10px; display: block; position: absolute; top: 100%; left: 50%; margin-top: 10px; padding: 25px 20px; overflow: hidden; background: #fff; border-radius: 6px; -webkit-box-shadow: 7px 15px 70px 0 rgba(0, 0, 0, 0.25); box-shadow: 7px 15px 70px 0 rgba(0, 0, 0, 0.25); -webkit-transform: translateX(-50%) scale(1); -moz-transform: translateX(-50%) scale(1); -o-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); -webkit-transition: all .3s ease .2s; -moz-transition: all .3s ease .2s; transition: all .3s ease .2s; z-index: 3; } .asvc-hotspot-wrapper .asvc-tooltip-text-align-left .HotspotPlugin_Hotspot > div { text-align:left !important; } .asvc-hotspot-wrapper .asvc-tooltip-text-align-center .HotspotPlugin_Hotspot > div { text-align:center !important; } .asvc-hotspot-wrapper .asvc-tooltip-text-align-right .HotspotPlugin_Hotspot > div { text-align:right !important; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot > div.hidden { opacity: 0; visibility: hidden; -webkit-transform: translateX(-50%) scale(.85); -moz-transform: translateX(-50%) scale(.85); -o-transform: translateX(-50%) scale(.85); transform: translateX(-50%) scale(.85); } .HotspotPlugin_Hotspot.asvc-hotspot-wrapper:not(.hidden) > div { opacity: 1; visibility: visible; -webkit-transition-delay: 0s; transition-delay: 0s; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot > div > .close-item { position: absolute; top: 0; right: 0; display: block; width: 20px; height: 20px; line-height: 20px; text-align: center; visibility:hidden; } .asvc-hotspot-wrapper .asvc-action-click .HotspotPlugin_Hotspot > div > .close-item { visibility: visible; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot > div > .Hotspot_Title { font-size: 16px; font-weight: bold; white-space: nowrap; color: #232323; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot > div > .Hotspot_Title + .Hotspot_Message { margin-top: 5px; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot > div > .Hotspot_Message { font-size: 14px; line-height: 25px; white-space: pre-line; color: #595959; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot.asvcHotspotImageMarker { position: absolute; cursor:pointer; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot:not(.asvcHotspotImageMarker) { position: absolute; width: 24px; height: 24px; margin-top: -12px; margin-left: -12px; z-index: 200; cursor: pointer; -webkit-transition: z-index .3s ease .3s; -moz-transition: z-index .3s ease .3s; transition: z-index .3s ease .3s; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot:not(.asvcHotspotImageMarker):before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #ff3368; border-radius: 50%; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform .3s ease; -moz-transition: -moz-transform .3s ease; transition: transform .3s ease; -webkit-animation: asvcPulseAnimation 1s ease infinite; -moz-animation: asvcPulseAnimation 1s ease infinite; animation: asvcPulseAnimation 1s ease infinite; } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot:not(.asvcHotspotImageMarker):after { content: ""; display: block; width: 8px; height: 8px; position: absolute; top: 50%; left: 50%; margin-top: -4px; margin-left: -4px; background: #fff; border-radius: 50%; -webkit-box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.35); box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.35); } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot:not(.asvcHotspotImageMarker):hover:before { -webkit-transform: scale(1.25); transform: scale(1.25); } .asvc-hotspot-wrapper .HotspotPlugin_Hotspot:hover, .asvc-hotspot-wrapper .HotspotPlugin_Hotspot.active { z-index: 300; -webkit-transition-delay: 0s; transition-delay: 0s; } .asvc-hotspot-wrapper .asvc-hotspot-image-cover { position: relative; display: inline-block; line-height: .5; } .asvc-hotspot-wrapper .asvc-hotspot-image-cover * { text-align: inherit; } @-webkit-keyframes asvcPulseAnimation { 0%, 100% { -webkit-transform: scale(0.9); } 50% { -webkit-transform: scale(1.1); } } @-moz-keyframes asvcPulseAnimation { 0%, 100% { -moz-transform: scale(0.9); } 50% { -moz-transform: scale(1.1); } } @-o-keyframes asvcPulseAnimation { 0%, 100% { -o-transform: scale(0.9); } 50% { -o-transform: scale(1.1); } } @keyframes asvcPulseAnimation { 0%, 100% { transform: scale(0.9); } 50% { transform: scale(1.1); } }