.jitsipopover { position: absolute; top: 0; left: 0; z-index: 1010; display: none; max-width: 300px; min-width: 100px; padding: 1px; text-align: left; color: $auiDialogColor; background-color: $auiDialogContentBg; background-clip: padding-box; border: 1px solid $popoverBorderColorFallback; border: 1px solid $popoverBorderColor; border-radius: 3px; /*-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);*/ /*box-shadow: 0 5px 10px rgba(0, 0, 0, 0.4);*/ white-space: normal; margin-top: -10px; margin-bottom: 35px; &__title { text-align: center; } &__content { padding: em(5) em(10); font-size: em(14); white-space:pre-wrap; text-align: center; } &__icon { margin-right: 5px; } &__green { @extend .jitsipopover__icon; color: #4abd04; } &__orange { @extend .jitsipopover__icon; color: #ffa800; } &__menu-padding { height: 35px; width: 100px; position: absolute; bottom: -35px; } &__showmore { display: block; text-align: center; width: 90px; margin: 10px auto; } &__clear { position: absolute; display: block; width: 0; height: 0; border-color: transparent; border-style: solid; } > .arrow { border-width: 5px; left: 50%; margin-left: -5px; border-bottom-width: 0; border-top-color: $popoverArrowBorderColorFallback; border-top-color: $popoverArrowBorderColor; bottom: -5px; @extend .jitsipopover__clear; &:after { border-width: 5px; content: " "; bottom: 1px; margin-left: -5px; border-bottom-width: 0; border-top-color: $auiDialogContentBg; @extend .jitsipopover__clear; } } }