.pop--over--arrow-top-left,
.oui-pop--over--arrow-top-left,
.pop--over--arrow-top-center,
.oui-pop--over--arrow-top-center,
.pop--over--arrow-top-right,
.oui-pop--over--arrow-top-right, .pop--tip--arrow-top-left,
.oui-pop--tip--arrow-top-left, .pop--tip--arrow-top-center,
.oui-pop--tip--arrow-top-center, .pop--tip--arrow-top-right,
.oui-pop--tip--arrow-top-right, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip,
.pop--over--arrow-right-top,
.oui-pop--over--arrow-right-top,
.pop--over--arrow-left-top,
.oui-pop--over--arrow-left-top, .pop--tip--arrow-right-top,
.oui-pop--tip--arrow-right-top, .pop--tip--arrow-left-top,
.oui-pop--tip--arrow-left-top, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip,
.pop--over--arrow-right-center,
.oui-pop--over--arrow-right-center,
.pop--over--arrow-left-center,
.oui-pop--over--arrow-left-center, .pop--tip--arrow-right-center,
.oui-pop--tip--arrow-right-center, .pop--tip--arrow-left-center,
.oui-pop--tip--arrow-left-center, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip,
.pop--over--arrow-right-bottom,
.oui-pop--over--arrow-right-bottom,
.pop--over--arrow-left-bottom,
.oui-pop--over--arrow-left-bottom, .pop--tip--arrow-right-bottom,
.oui-pop--tip--arrow-right-bottom, .pop--tip--arrow-left-bottom,
.oui-pop--tip--arrow-left-bottom, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip,
.pop--over--arrow-bottom-right,
.oui-pop--over--arrow-bottom-right,
.pop--over--arrow-bottom-center,
.oui-pop--over--arrow-bottom-center,
.pop--over--arrow-bottom-left,
.oui-pop--over--arrow-bottom-left, .pop--tip--arrow-bottom-right,
.oui-pop--tip--arrow-bottom-right, .pop--tip--arrow-bottom-center,
.oui-pop--tip--arrow-bottom-center, .pop--tip--arrow-bottom-left,
.oui-pop--tip--arrow-bottom-left, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip {
position: relative; }
.pop--over--arrow-top-left::before,
.oui-pop--over--arrow-top-left::before,
.pop--over--arrow-top-center::before,
.oui-pop--over--arrow-top-center::before,
.pop--over--arrow-top-right::before,
.oui-pop--over--arrow-top-right::before, .pop--tip--arrow-top-left::before,
.oui-pop--tip--arrow-top-left::before, .pop--tip--arrow-top-center::before,
.oui-pop--tip--arrow-top-center::before, .pop--tip--arrow-top-right::before,
.oui-pop--tip--arrow-top-right::before, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::before, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::before, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-right-top::before,
.oui-pop--over--arrow-right-top::before,
.pop--over--arrow-left-top::before,
.oui-pop--over--arrow-left-top::before, .pop--tip--arrow-right-top::before,
.oui-pop--tip--arrow-right-top::before, .pop--tip--arrow-left-top::before,
.oui-pop--tip--arrow-left-top::before, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-right-center::before,
.oui-pop--over--arrow-right-center::before,
.pop--over--arrow-left-center::before,
.oui-pop--over--arrow-left-center::before, .pop--tip--arrow-right-center::before,
.oui-pop--tip--arrow-right-center::before, .pop--tip--arrow-left-center::before,
.oui-pop--tip--arrow-left-center::before, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-right-bottom::before,
.oui-pop--over--arrow-right-bottom::before,
.pop--over--arrow-left-bottom::before,
.oui-pop--over--arrow-left-bottom::before, .pop--tip--arrow-right-bottom::before,
.oui-pop--tip--arrow-right-bottom::before, .pop--tip--arrow-left-bottom::before,
.oui-pop--tip--arrow-left-bottom::before, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-bottom-right::before,
.oui-pop--over--arrow-bottom-right::before,
.pop--over--arrow-bottom-center::before,
.oui-pop--over--arrow-bottom-center::before,
.pop--over--arrow-bottom-left::before,
.oui-pop--over--arrow-bottom-left::before, .pop--tip--arrow-bottom-right::before,
.oui-pop--tip--arrow-bottom-right::before, .pop--tip--arrow-bottom-center::before,
.oui-pop--tip--arrow-bottom-center::before, .pop--tip--arrow-bottom-left::before,
.oui-pop--tip--arrow-bottom-left::before, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::before, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::before, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-top-left::after,
.oui-pop--over--arrow-top-left::after,
.pop--over--arrow-top-center::after,
.oui-pop--over--arrow-top-center::after,
.pop--over--arrow-top-right::after,
.oui-pop--over--arrow-top-right::after, .pop--tip--arrow-top-left::after,
.oui-pop--tip--arrow-top-left::after, .pop--tip--arrow-top-center::after,
.oui-pop--tip--arrow-top-center::after, .pop--tip--arrow-top-right::after,
.oui-pop--tip--arrow-top-right::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::after, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after,
.pop--over--arrow-right-top::after,
.oui-pop--over--arrow-right-top::after,
.pop--over--arrow-left-top::after,
.oui-pop--over--arrow-left-top::after, .pop--tip--arrow-right-top::after,
.oui-pop--tip--arrow-right-top::after, .pop--tip--arrow-left-top::after,
.oui-pop--tip--arrow-left-top::after, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after,
.pop--over--arrow-right-center::after,
.oui-pop--over--arrow-right-center::after,
.pop--over--arrow-left-center::after,
.oui-pop--over--arrow-left-center::after, .pop--tip--arrow-right-center::after,
.oui-pop--tip--arrow-right-center::after, .pop--tip--arrow-left-center::after,
.oui-pop--tip--arrow-left-center::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::after,
.pop--over--arrow-right-bottom::after,
.oui-pop--over--arrow-right-bottom::after,
.pop--over--arrow-left-bottom::after,
.oui-pop--over--arrow-left-bottom::after, .pop--tip--arrow-right-bottom::after,
.oui-pop--tip--arrow-right-bottom::after, .pop--tip--arrow-left-bottom::after,
.oui-pop--tip--arrow-left-bottom::after, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after,
.pop--over--arrow-bottom-right::after,
.oui-pop--over--arrow-bottom-right::after,
.pop--over--arrow-bottom-center::after,
.oui-pop--over--arrow-bottom-center::after,
.pop--over--arrow-bottom-left::after,
.oui-pop--over--arrow-bottom-left::after, .pop--tip--arrow-bottom-right::after,
.oui-pop--tip--arrow-bottom-right::after, .pop--tip--arrow-bottom-center::after,
.oui-pop--tip--arrow-bottom-center::after, .pop--tip--arrow-bottom-left::after,
.oui-pop--tip--arrow-bottom-left::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::after, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after {
content: '';
position: absolute;
border-collapse: separate;
pointer-events: none; }
.pop--over--arrow-top-left::before,
.oui-pop--over--arrow-top-left::before,
.pop--over--arrow-top-center::before,
.oui-pop--over--arrow-top-center::before,
.pop--over--arrow-top-right::before,
.oui-pop--over--arrow-top-right::before, .pop--tip--arrow-top-left::before,
.oui-pop--tip--arrow-top-left::before, .pop--tip--arrow-top-center::before,
.oui-pop--tip--arrow-top-center::before, .pop--tip--arrow-top-right::before,
.oui-pop--tip--arrow-top-right::before, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::before, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::before, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-right-top::before,
.oui-pop--over--arrow-right-top::before,
.pop--over--arrow-left-top::before,
.oui-pop--over--arrow-left-top::before, .pop--tip--arrow-right-top::before,
.oui-pop--tip--arrow-right-top::before, .pop--tip--arrow-left-top::before,
.oui-pop--tip--arrow-left-top::before, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-right-center::before,
.oui-pop--over--arrow-right-center::before,
.pop--over--arrow-left-center::before,
.oui-pop--over--arrow-left-center::before, .pop--tip--arrow-right-center::before,
.oui-pop--tip--arrow-right-center::before, .pop--tip--arrow-left-center::before,
.oui-pop--tip--arrow-left-center::before, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-right-bottom::before,
.oui-pop--over--arrow-right-bottom::before,
.pop--over--arrow-left-bottom::before,
.oui-pop--over--arrow-left-bottom::before, .pop--tip--arrow-right-bottom::before,
.oui-pop--tip--arrow-right-bottom::before, .pop--tip--arrow-left-bottom::before,
.oui-pop--tip--arrow-left-bottom::before, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-bottom-right::before,
.oui-pop--over--arrow-bottom-right::before,
.pop--over--arrow-bottom-center::before,
.oui-pop--over--arrow-bottom-center::before,
.pop--over--arrow-bottom-left::before,
.oui-pop--over--arrow-bottom-left::before, .pop--tip--arrow-bottom-right::before,
.oui-pop--tip--arrow-bottom-right::before, .pop--tip--arrow-bottom-center::before,
.oui-pop--tip--arrow-bottom-center::before, .pop--tip--arrow-bottom-left::before,
.oui-pop--tip--arrow-bottom-left::before, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::before, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::before, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before {
border: 6px solid transparent; }
.pop--over--arrow-top-left::after,
.oui-pop--over--arrow-top-left::after,
.pop--over--arrow-top-center::after,
.oui-pop--over--arrow-top-center::after,
.pop--over--arrow-top-right::after,
.oui-pop--over--arrow-top-right::after, .pop--tip--arrow-top-left::after,
.oui-pop--tip--arrow-top-left::after, .pop--tip--arrow-top-center::after,
.oui-pop--tip--arrow-top-center::after, .pop--tip--arrow-top-right::after,
.oui-pop--tip--arrow-top-right::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::after, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after,
.pop--over--arrow-right-top::after,
.oui-pop--over--arrow-right-top::after,
.pop--over--arrow-left-top::after,
.oui-pop--over--arrow-left-top::after, .pop--tip--arrow-right-top::after,
.oui-pop--tip--arrow-right-top::after, .pop--tip--arrow-left-top::after,
.oui-pop--tip--arrow-left-top::after, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after,
.pop--over--arrow-right-center::after,
.oui-pop--over--arrow-right-center::after,
.pop--over--arrow-left-center::after,
.oui-pop--over--arrow-left-center::after, .pop--tip--arrow-right-center::after,
.oui-pop--tip--arrow-right-center::after, .pop--tip--arrow-left-center::after,
.oui-pop--tip--arrow-left-center::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::after,
.pop--over--arrow-right-bottom::after,
.oui-pop--over--arrow-right-bottom::after,
.pop--over--arrow-left-bottom::after,
.oui-pop--over--arrow-left-bottom::after, .pop--tip--arrow-right-bottom::after,
.oui-pop--tip--arrow-right-bottom::after, .pop--tip--arrow-left-bottom::after,
.oui-pop--tip--arrow-left-bottom::after, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after,
.pop--over--arrow-bottom-right::after,
.oui-pop--over--arrow-bottom-right::after,
.pop--over--arrow-bottom-center::after,
.oui-pop--over--arrow-bottom-center::after,
.pop--over--arrow-bottom-left::after,
.oui-pop--over--arrow-bottom-left::after, .pop--tip--arrow-bottom-right::after,
.oui-pop--tip--arrow-bottom-right::after, .pop--tip--arrow-bottom-center::after,
.oui-pop--tip--arrow-bottom-center::after, .pop--tip--arrow-bottom-left::after,
.oui-pop--tip--arrow-bottom-left::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::after, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after {
border: 5px solid transparent; }
.pop--over--arrow-top-left::before,
.oui-pop--over--arrow-top-left::before,
.pop--over--arrow-top-center::before,
.oui-pop--over--arrow-top-center::before,
.pop--over--arrow-top-right::before,
.oui-pop--over--arrow-top-right::before, .pop--tip--arrow-top-left::before,
.oui-pop--tip--arrow-top-left::before, .pop--tip--arrow-top-center::before,
.oui-pop--tip--arrow-top-center::before, .pop--tip--arrow-top-right::before,
.oui-pop--tip--arrow-top-right::before, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::before, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::before, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-top-left::after,
.oui-pop--over--arrow-top-left::after,
.pop--over--arrow-top-center::after,
.oui-pop--over--arrow-top-center::after,
.pop--over--arrow-top-right::after,
.oui-pop--over--arrow-top-right::after, .pop--tip--arrow-top-left::after,
.oui-pop--tip--arrow-top-left::after, .pop--tip--arrow-top-center::after,
.oui-pop--tip--arrow-top-center::after, .pop--tip--arrow-top-right::after,
.oui-pop--tip--arrow-top-right::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::after, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after {
bottom: 100%; }
.pop--over--arrow-right-top::before,
.oui-pop--over--arrow-right-top::before,
.pop--over--arrow-left-top::before,
.oui-pop--over--arrow-left-top::before, .pop--tip--arrow-right-top::before,
.oui-pop--tip--arrow-right-top::before, .pop--tip--arrow-left-top::before,
.oui-pop--tip--arrow-left-top::before, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before {
top: 5px; }
.pop--over--arrow-right-top::after,
.oui-pop--over--arrow-right-top::after,
.pop--over--arrow-left-top::after,
.oui-pop--over--arrow-left-top::after, .pop--tip--arrow-right-top::after,
.oui-pop--tip--arrow-right-top::after, .pop--tip--arrow-left-top::after,
.oui-pop--tip--arrow-left-top::after, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after {
top: 6px; }
.pop--over--arrow-right-center::before,
.oui-pop--over--arrow-right-center::before,
.pop--over--arrow-left-center::before,
.oui-pop--over--arrow-left-center::before, .pop--tip--arrow-right-center::before,
.oui-pop--tip--arrow-right-center::before, .pop--tip--arrow-left-center::before,
.oui-pop--tip--arrow-left-center::before, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-right-center::after,
.oui-pop--over--arrow-right-center::after,
.pop--over--arrow-left-center::after,
.oui-pop--over--arrow-left-center::after, .pop--tip--arrow-right-center::after,
.oui-pop--tip--arrow-right-center::after, .pop--tip--arrow-left-center::after,
.oui-pop--tip--arrow-left-center::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::after {
top: 50%;
margin-top: -6px; }
.pop--over--arrow-right-center::after,
.oui-pop--over--arrow-right-center::after,
.pop--over--arrow-left-center::after,
.oui-pop--over--arrow-left-center::after, .pop--tip--arrow-right-center::after,
.oui-pop--tip--arrow-right-center::after, .pop--tip--arrow-left-center::after,
.oui-pop--tip--arrow-left-center::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::after {
margin-top: -5px; }
.pop--over--arrow-right-bottom::before,
.oui-pop--over--arrow-right-bottom::before,
.pop--over--arrow-left-bottom::before,
.oui-pop--over--arrow-left-bottom::before, .pop--tip--arrow-right-bottom::before,
.oui-pop--tip--arrow-right-bottom::before, .pop--tip--arrow-left-bottom::before,
.oui-pop--tip--arrow-left-bottom::before, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before {
bottom: 5px; }
.pop--over--arrow-right-bottom::after,
.oui-pop--over--arrow-right-bottom::after,
.pop--over--arrow-left-bottom::after,
.oui-pop--over--arrow-left-bottom::after, .pop--tip--arrow-right-bottom::after,
.oui-pop--tip--arrow-right-bottom::after, .pop--tip--arrow-left-bottom::after,
.oui-pop--tip--arrow-left-bottom::after, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after {
bottom: 6px; }
.pop--over--arrow-bottom-right::before,
.oui-pop--over--arrow-bottom-right::before,
.pop--over--arrow-bottom-center::before,
.oui-pop--over--arrow-bottom-center::before,
.pop--over--arrow-bottom-left::before,
.oui-pop--over--arrow-bottom-left::before, .pop--tip--arrow-bottom-right::before,
.oui-pop--tip--arrow-bottom-right::before, .pop--tip--arrow-bottom-center::before,
.oui-pop--tip--arrow-bottom-center::before, .pop--tip--arrow-bottom-left::before,
.oui-pop--tip--arrow-bottom-left::before, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::before, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::before, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-bottom-right::after,
.oui-pop--over--arrow-bottom-right::after,
.pop--over--arrow-bottom-center::after,
.oui-pop--over--arrow-bottom-center::after,
.pop--over--arrow-bottom-left::after,
.oui-pop--over--arrow-bottom-left::after, .pop--tip--arrow-bottom-right::after,
.oui-pop--tip--arrow-bottom-right::after, .pop--tip--arrow-bottom-center::after,
.oui-pop--tip--arrow-bottom-center::after, .pop--tip--arrow-bottom-left::after,
.oui-pop--tip--arrow-bottom-left::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::after, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after {
top: 100%; }
.pop--over--arrow-left-bottom::before,
.oui-pop--over--arrow-left-bottom::before,
.pop--over--arrow-left-center::before,
.oui-pop--over--arrow-left-center::before,
.pop--over--arrow-left-top::before,
.oui-pop--over--arrow-left-top::before, .pop--tip--arrow-left-bottom::before,
.oui-pop--tip--arrow-left-bottom::before, .pop--tip--arrow-left-center::before,
.oui-pop--tip--arrow-left-center::before, .pop--tip--arrow-left-top::before,
.oui-pop--tip--arrow-left-top::before, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::before, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before,
.pop--over--arrow-left-bottom::after,
.oui-pop--over--arrow-left-bottom::after,
.pop--over--arrow-left-center::after,
.oui-pop--over--arrow-left-center::after,
.pop--over--arrow-left-top::after,
.oui-pop--over--arrow-left-top::after, .pop--tip--arrow-left-bottom::after,
.oui-pop--tip--arrow-left-bottom::after, .pop--tip--arrow-left-center::after,
.oui-pop--tip--arrow-left-center::after, .pop--tip--arrow-left-top::after,
.oui-pop--tip--arrow-left-top::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::after, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after {
right: 100%; }
.pop--over--arrow-top-left::before,
.oui-pop--over--arrow-top-left::before,
.pop--over--arrow-bottom-left::before,
.oui-pop--over--arrow-bottom-left::before, .pop--tip--arrow-top-left::before,
.oui-pop--tip--arrow-top-left::before, .pop--tip--arrow-bottom-left::before,
.oui-pop--tip--arrow-bottom-left::before, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before {
left: 5px; }
.pop--over--arrow-top-left::after,
.oui-pop--over--arrow-top-left::after,
.pop--over--arrow-bottom-left::after,
.oui-pop--over--arrow-bottom-left::after, .pop--tip--arrow-top-left::after,
.oui-pop--tip--arrow-top-left::after, .pop--tip--arrow-bottom-left::after,
.oui-pop--tip--arrow-bottom-left::after, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after {
left: 6px; }
.pop--over--arrow-top-center::before,
.oui-pop--over--arrow-top-center::before,
.pop--over--arrow-bottom-center::before,
.oui-pop--over--arrow-bottom-center::before, .pop--tip--arrow-top-center::before,
.oui-pop--tip--arrow-top-center::before, .pop--tip--arrow-bottom-center::before,
.oui-pop--tip--arrow-bottom-center::before, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::before, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::before, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::before, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::before,
.pop--over--arrow-top-center::after,
.oui-pop--over--arrow-top-center::after,
.pop--over--arrow-bottom-center::after,
.oui-pop--over--arrow-bottom-center::after, .pop--tip--arrow-top-center::after,
.oui-pop--tip--arrow-top-center::after, .pop--tip--arrow-bottom-center::after,
.oui-pop--tip--arrow-bottom-center::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::after {
left: 50%;
margin-left: -6px; }
.pop--over--arrow-top-center::after,
.oui-pop--over--arrow-top-center::after,
.pop--over--arrow-bottom-center::after,
.oui-pop--over--arrow-bottom-center::after, .pop--tip--arrow-top-center::after,
.oui-pop--tip--arrow-top-center::after, .pop--tip--arrow-bottom-center::after,
.oui-pop--tip--arrow-bottom-center::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::after, .tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::after {
margin-left: -5px; }
.pop--over--arrow-top-right::before,
.oui-pop--over--arrow-top-right::before,
.pop--over--arrow-bottom-right::before,
.oui-pop--over--arrow-bottom-right::before, .pop--tip--arrow-top-right::before,
.oui-pop--tip--arrow-top-right::before, .pop--tip--arrow-bottom-right::before,
.oui-pop--tip--arrow-bottom-right::before, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before {
right: 5px; }
.pop--over--arrow-top-right::after,
.oui-pop--over--arrow-top-right::after,
.pop--over--arrow-bottom-right::after,
.oui-pop--over--arrow-bottom-right::after, .pop--tip--arrow-top-right::after,
.oui-pop--tip--arrow-top-right::after, .pop--tip--arrow-bottom-right::after,
.oui-pop--tip--arrow-bottom-right::after, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after, .tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after {
right: 6px; }
.pop--over--arrow-right-top::before,
.oui-pop--over--arrow-right-top::before,
.pop--over--arrow-right-center::before,
.oui-pop--over--arrow-right-center::before,
.pop--over--arrow-right-bottom::before,
.oui-pop--over--arrow-right-bottom::before, .pop--tip--arrow-right-top::before,
.oui-pop--tip--arrow-right-top::before, .pop--tip--arrow-right-center::before,
.oui-pop--tip--arrow-right-center::before, .pop--tip--arrow-right-bottom::before,
.oui-pop--tip--arrow-right-bottom::before, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before,
.pop--over--arrow-right-top::after,
.oui-pop--over--arrow-right-top::after,
.pop--over--arrow-right-center::after,
.oui-pop--over--arrow-right-center::after,
.pop--over--arrow-right-bottom::after,
.oui-pop--over--arrow-right-bottom::after, .pop--tip--arrow-right-top::after,
.oui-pop--tip--arrow-right-top::after, .pop--tip--arrow-right-center::after,
.oui-pop--tip--arrow-right-center::after, .pop--tip--arrow-right-bottom::after,
.oui-pop--tip--arrow-right-bottom::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after, .tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after {
left: 100%; }
*, *::before, *::after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box; }
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin: 0;
color: #080738;
text-rendering: optimizeLegibility;
-moz-osx-font-smoothing: grayscale;
font-feature-settings: "kern";
font-kerning: normal;
/* TODO: Test normal vs auto */ }
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
dl,
dd,
ol,
ul,
form,
fieldset,
legend,
table,
th,
td,
caption,
hr {
margin: 0;
padding: 0; }
ol,
ul {
list-style: none; }
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 400; }
table {
border-collapse: collapse;
border-spacing: 0; }
abbr[title],
dfn[title] {
cursor: help; }
u,
ins {
text-decoration: none; }
ins {
border-bottom: 1px solid; }
img {
font-style: italic; }
button,
select,
option,
input[type="checkbox"] + label,
input[type="radio"] + label {
cursor: pointer; }
[type="text"]:active,
[type="text"]:focus,
[type="password"]:active,
[type="password"]:focus,
[type="email"]:active,
[type="email"]:focus,
[type="number"]:active,
[type="number"]:focus,
[type="search"]:active,
[type="search"]:focus,
[type="url"]:active,
[type="url"]:focus,
textarea:active,
textarea:focus {
cursor: text;
outline: none; }
a {
text-decoration: none; }
a:active,
a:hover {
outline: 0; }
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline; }
sup {
top: -0.5em; }
sub {
bottom: -0.25em; }
em {
font-style: italic; }
b,
strong {
font-weight: 500; }
fieldset {
border: 0; }
textarea {
vertical-align: top; }
button[disabled],
html input[disabled] {
cursor: default; }
button,
select {
text-transform: none; }
button,
input,
select,
textarea {
font-family: inherit;
font-size: 100%;
margin: 0; }
button::-moz-focus-inner {
padding: 0;
border: 0; }
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none; }
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
cursor: pointer; }
::-webkit-input-placeholder {
color: #83839B; }
:-moz-placeholder {
color: #83839B; }
::-moz-placeholder {
color: #83839B; }
:-ms-input-placeholder {
color: #83839B; }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0; }
html {
color: #080738;
background-color: #FFFFFF;
font-family: Graphik, Lato, Helvetica, Verdana, sans-serif;
font-size: 14px;
line-height: 1.6; }
p {
margin-bottom: 10px; }
blockquote {
border-left: 3px solid #e0e0e0;
padding-left: 15px; }
.button,
.toolbar__button,
.oui-button {
display: inline-block;
vertical-align: middle;
white-space: nowrap;
font-family: inherit;
cursor: pointer;
margin: 0;
line-height: 32px;
border-width: 1px;
border-style: solid;
font-size: 13px;
font-weight: 400;
user-select: none;
border-radius: 5px;
height: 34px;
padding: 0 15px;
transition: color 0.3s, background-color 0.3s, box-shadow 0.3s, border-color 0.3s;
background-color: #f7f7f7;
border-color: #bfbfbf;
color: #080738; }
.button:visited,
.toolbar__button:visited,
.oui-button:visited {
color: #080738; }
.button:hover,
.toolbar__button:hover,
.oui-button:hover {
color: #080738;
background-color: #FFFFFF; }
.button:focus,
.toolbar__button:focus,
.oui-button:focus {
outline: none;
border: 1px solid #999999; }
.button.is-active,
.button:active,
.is-active.toolbar__button,
.toolbar__button:active,
.oui-button.is-active,
.oui-button:active {
background: #46456A;
border-color: #46456A;
color: #FFFFFF;
box-shadow: inset 1px 0 3px 0 rgba(0, 0, 0, 0.5); }
.button--highlight,
.oui-button--highlight {
background-color: #4069FF;
border-color: #5378ff;
color: #FFFFFF; }
.button--highlight:hover,
.oui-button--highlight:hover {
background: #0037FF;
border-color: #1a4bff; }
.button--highlight:focus,
.oui-button--highlight:focus {
border: 1px solid var(--light-blue-100); }
.button--highlight:active,
.oui-button--highlight:active {
background: #002ccc;
border-color: #0027b3;
box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); }
.button--highlight:visited,
.button--highlight:hover,
.button--highlight:active,
.button--highlight:focus,
.oui-button--highlight:visited,
.oui-button--highlight:hover,
.oui-button--highlight:active,
.oui-button--highlight:focus {
color: #FFFFFF; }
.button--outline,
.oui-button--outline {
background-color: transparent;
border-color: #4069FF;
color: #4069FF; }
.button--outline:visited,
.oui-button--outline:visited {
color: #4069FF; }
.button--outline:focus,
.oui-button--outline:focus {
border-color: #0037FF; }
.button--outline:focus,
.oui-button--outline:focus {
border: 1px solid var(--light-blue-100); }
.button--outline:hover,
.oui-button--outline:hover {
background-color: transparent;
border-color: #0037FF;
color: #0037FF;
box-shadow: none; }
.button--outline:active,
.oui-button--outline:active {
background-color: transparent;
border-color: #080738;
color: #080738;
box-shadow: none; }
.button--danger,
.oui-button--danger {
background-color: #FF5B5B;
border-color: #FF5B5B;
color: #FFFFFF; }
.button--danger:hover,
.oui-button--danger:hover {
background: #cc4949;
border-color: #cc4949; }
.button--danger:active,
.oui-button--danger:active {
background: #b34040;
border-color: #b34040; }
.button--danger:focus,
.oui-button--danger:focus {
border: 1px solid #b34040; }
.button--danger:visited,
.button--danger:hover,
.button--danger:active,
.button--danger:focus,
.oui-button--danger:visited,
.oui-button--danger:hover,
.oui-button--danger:active,
.oui-button--danger:focus {
color: #FFFFFF; }
.button--danger-outline,
.oui-button--danger-outline {
color: #FF5B5B;
border-color: #FF5B5B;
background-color: transparent;
box-shadow: none; }
.button--danger-outline:focus,
.oui-button--danger-outline:focus {
border: 1px solid #b34040; }
.button--danger-outline:hover,
.oui-button--danger-outline:hover {
color: #cc4949;
border-color: #cc4949;
background-color: transparent;
box-shadow: none; }
.button--danger-outline:active,
.oui-button--danger-outline:active {
border-color: #b34040;
background-color: transparent;
color: #b34040;
box-shadow: none; }
.button--plain,
.button--underline,
.oui-button--plain,
.oui-button--underline {
color: #46456A;
border-color: transparent;
background-color: transparent;
box-shadow: none; }
.button--plain:hover,
.button--underline:hover,
.oui-button--plain:hover,
.oui-button--underline:hover {
color: #4069FF; }
.button--plain:active,
.button--underline:active,
.oui-button--plain:active,
.oui-button--underline:active {
color: #080738; }
.button--plain:visited,
.button--plain:hover,
.button--plain:active,
.button--plain:focus,
.button--underline:visited,
.button--underline:hover,
.button--underline:active,
.button--underline:focus,
.oui-button--plain:visited,
.oui-button--plain:hover,
.oui-button--plain:active,
.oui-button--plain:focus,
.oui-button--underline:visited,
.oui-button--underline:hover,
.oui-button--underline:active,
.oui-button--underline:focus {
border-color: transparent;
background-color: transparent;
box-shadow: none; }
.button--underline,
.oui-button--underline {
border-radius: 0 !important; }
.button--plain:focus,
.oui-button--plain:focus {
border: 1px solid var(--light-blue-25); }
.button--toggle:hover,
.toolbar__button:hover,
.oui-button--toggle:hover {
color: #080738; }
.button--toggle:active,
.button--toggle.is-active:hover,
.toolbar__button:active,
.is-active.toolbar__button:hover,
.oui-button--toggle:active,
.oui-button--toggle.is-active:hover {
color: #FFFFFF; }
.button--toggle:not(:hover):not(:active):not(.is-active),
.toolbar__button:not(:hover):not(:active):not(.is-active),
.oui-button--toggle:not(:hover):not(:active):not(.is-active) {
border-color: transparent;
background-color: transparent; }
.button--underline,
.oui-button--underline {
border-bottom: 2px solid #a6a6a6;
color: #080738;
padding-left: 5px;
padding-right: 5px; }
.button--underline:hover,
.oui-button--underline:hover {
border-bottom-width: 2px;
border-bottom-color: gray;
color: #080738; }
.button--underline:focus,
.oui-button--underline:focus {
border-bottom-width: 2px;
border-bottom-color: #0037FF; }
.button--underline:active,
.oui-button--underline:active {
border-bottom-width: 2px;
border-bottom-color: #999999;
color: #46456A; }
.button--tiny,
.oui-button--tiny {
font-size: 11px;
font-weight: 400;
border-radius: 5px;
line-height: 18px;
height: 19px;
padding: 0 8px; }
.button--small,
.oui-button--small {
font-size: 11px;
font-weight: 400;
border-radius: 5px;
line-height: 26px;
height: 27px;
padding: 0 7px; }
.button--large,
.oui-button--large {
font-size: 15px;
font-weight: 400;
border-radius: 5px;
line-height: 41px;
height: 42px;
padding: 0 20px; }
.button--narrow,
.toolbar__button,
.oui-button--narrow {
padding-left: 10px;
padding-right: 10px; }
.button--tight,
.oui-button--tight {
padding-left: 5px;
padding-right: 5px; }
.button--full,
.oui-button--full {
width: 100%;
text-align: center; }
.button--icon,
.oui-button--icon {
line-height: 1.4; }
.button--icon .icon,
.oui-button--icon .icon {
vertical-align: sub; }
.button--unstyled,
.oui-button--unstyled {
background: inherit !important;
border: inherit !important;
border-radius: inherit !important;
box-shadow: inherit !important;
color: inherit !important;
font-size: inherit !important;
font-weight: inherit !important;
height: inherit !important;
line-height: 1 !important;
margin: 0 !important;
padding: 0 !important;
text-shadow: inherit !important; }
.button[disabled],
.button--disabled,
.button--disabled:visited,
.button--disabled:hover,
.button--disabled:active,
.button--disabled:focus,
.toolbar__button[disabled],
.oui-button[disabled],
.oui-button--disabled,
.oui-button--disabled:visited,
.oui-button--disabled:hover,
.oui-button--disabled:active,
.oui-button--disabled:focus {
cursor: default;
box-shadow: none;
background-color: #F9F9F9;
border-color: #d1d1d1;
color: #83839B;
box-shadow: none; }
.button[disabled].button--plain,
.button[disabled].button--toggle,
.button[disabled].oui-button--plain,
.button[disabled].oui-button--toggle,
.button--disabled.button--plain,
.button--disabled.button--toggle,
.button--disabled.oui-button--plain,
.button--disabled.oui-button--toggle,
.button--disabled:visited.button--plain,
.button--disabled:visited.button--toggle,
.button--disabled:visited.oui-button--plain,
.button--disabled:visited.oui-button--toggle,
.button--disabled:hover.button--plain,
.button--disabled:hover.button--toggle,
.button--disabled:hover.oui-button--plain,
.button--disabled:hover.oui-button--toggle,
.button--disabled:active.button--plain,
.button--disabled:active.button--toggle,
.button--disabled:active.oui-button--plain,
.button--disabled:active.oui-button--toggle,
.button--disabled:focus.button--plain,
.button--disabled:focus.button--toggle,
.button--disabled:focus.oui-button--plain,
.button--disabled:focus.oui-button--toggle,
.toolbar__button[disabled].button--plain,
.toolbar__button[disabled].button--toggle,
.toolbar__button[disabled].oui-button--plain,
.toolbar__button[disabled].oui-button--toggle,
.oui-button[disabled].button--plain,
.oui-button[disabled].button--toggle,
.oui-button[disabled].oui-button--plain,
.oui-button[disabled].oui-button--toggle,
.oui-button--disabled.button--plain,
.oui-button--disabled.button--toggle,
.oui-button--disabled.oui-button--plain,
.oui-button--disabled.oui-button--toggle,
.oui-button--disabled:visited.button--plain,
.oui-button--disabled:visited.button--toggle,
.oui-button--disabled:visited.oui-button--plain,
.oui-button--disabled:visited.oui-button--toggle,
.oui-button--disabled:hover.button--plain,
.oui-button--disabled:hover.button--toggle,
.oui-button--disabled:hover.oui-button--plain,
.oui-button--disabled:hover.oui-button--toggle,
.oui-button--disabled:active.button--plain,
.oui-button--disabled:active.button--toggle,
.oui-button--disabled:active.oui-button--plain,
.oui-button--disabled:active.oui-button--toggle,
.oui-button--disabled:focus.button--plain,
.oui-button--disabled:focus.button--toggle,
.oui-button--disabled:focus.oui-button--plain,
.oui-button--disabled:focus.oui-button--toggle {
background-color: transparent;
border-color: transparent; }
.button[disabled].button--outline-reverse,
.button[disabled].oui-button--outline-reverse,
.button--disabled.button--outline-reverse,
.button--disabled.oui-button--outline-reverse,
.button--disabled:visited.button--outline-reverse,
.button--disabled:visited.oui-button--outline-reverse,
.button--disabled:hover.button--outline-reverse,
.button--disabled:hover.oui-button--outline-reverse,
.button--disabled:active.button--outline-reverse,
.button--disabled:active.oui-button--outline-reverse,
.button--disabled:focus.button--outline-reverse,
.button--disabled:focus.oui-button--outline-reverse,
.toolbar__button[disabled].button--outline-reverse,
.toolbar__button[disabled].oui-button--outline-reverse,
.oui-button[disabled].button--outline-reverse,
.oui-button[disabled].oui-button--outline-reverse,
.oui-button--disabled.button--outline-reverse,
.oui-button--disabled.oui-button--outline-reverse,
.oui-button--disabled:visited.button--outline-reverse,
.oui-button--disabled:visited.oui-button--outline-reverse,
.oui-button--disabled:hover.button--outline-reverse,
.oui-button--disabled:hover.oui-button--outline-reverse,
.oui-button--disabled:active.button--outline-reverse,
.oui-button--disabled:active.oui-button--outline-reverse,
.oui-button--disabled:focus.button--outline-reverse,
.oui-button--disabled:focus.oui-button--outline-reverse {
background-color: transparent; }
code {
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
font-size: 13px; }
.pre,
.oui-pre {
margin-bottom: 10px;
white-space: pre-wrap; }
.pre code,
.oui-pre code {
padding: 10px;
background: #FFFFFF;
overflow-x: auto;
display: block;
border-radius: 5px;
border: 1px solid #e0e0e0; }
.code,
.oui-code {
background: #FFFFFF;
border-radius: 5px;
border: 1px solid #e0e0e0;
padding: 1px 3px; }
@font-face {
font-family: 'Graphik';
font-weight: 300;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-light.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 300;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-lightitalic.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 400;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-regular.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 400;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-regularitalic.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 500;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-medium.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 500;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-mediumitalic.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 600;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-semibold.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 600;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-semibolditalic.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 700;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-bold.woff2") format("woff2"); }
@font-face {
font-family: 'Graphik';
font-weight: 700;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/graphik/graphik-bolditalic.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 300;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-light.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 300;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-lightitalic.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 400;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-regular.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 400;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-regularitalic.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 500;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-medium.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 500;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-mediumitalic.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 600;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-semibold.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 600;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-semibolditalic.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 700;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-bold.woff2") format("woff2"); }
@font-face {
font-family: 'Lato';
font-weight: 700;
font-style: italic;
src: url("https://dhm5hy2vn8l0l.cloudfront.net/lato/lato-bolditalic.woff2") format("woff2"); }
h1,
.alpha {
font-size: 30px;
font-weight: 300;
line-height: 1.1; }
h2,
.beta {
font-size: 26px;
font-weight: 300;
line-height: 1.1; }
h3,
.gamma {
font-size: 20px;
font-weight: 400;
line-height: 1.1; }
h4,
.delta {
font-size: 18px; }
h5,
.epsilon {
font-size: 16px;
font-weight: 400; }
h6,
.zeta {
font-size: 14px;
font-weight: 500; }
h1 {
margin-bottom: 20px; }
h2 {
margin-bottom: 20px; }
h3 {
margin-bottom: 10px; }
.milli {
font-size: 13px !important; }
.micro {
font-size: 11px !important; }
.giga {
font-size: 65px !important; }
.mega {
font-size: 50px !important; }
.kilo {
font-size: 40px !important; }
.form__header {
margin-bottom: 20px; }
.form__footer {
margin-top: 30px; }
.form__title {
font-size: 20px;
margin-bottom: 10px;
line-height: 1; }
.form-fields,
.oui-form-fields {
list-style: none;
margin: 0; }
.form-field__item,
.oui-form-field__item {
margin-bottom: 15px; }
fieldset {
margin-bottom: 40px; }
.check-label,
.input-list .label,
.oui-input-list .oui-label {
display: table-cell;
padding-left: 10px;
font-weight: 400; }
.input-list,
.oui-input-list {
list-style: none;
margin: 0; }
.input-list > li,
.oui-input-list > li {
display: table;
margin-bottom: 5px; }
.input-list input,
.oui-input-list input {
display: table-cell; }
.input-list .label,
.input-list .oui-label,
.oui-input-list .label,
.oui-input-list .oui-label {
width: 100%; }
.input-list--horizontal > li,
.oui-input-list--horizontal > li {
padding-right: 20px;
display: inline-block; }
.input-list--horizontal .label,
.oui-input-list--horizontal .label {
display: inline;
padding-left: 6px; }
.or {
text-align: center;
color: #080738;
text-transform: uppercase;
margin: 15px auto;
position: relative; }
.or::before, .or::after {
content: '';
border-top: 1px dotted #e0e0e0;
width: 40%;
position: absolute;
left: 0;
top: 50%; }
.or::after {
left: auto;
right: 0; }
.icon-input {
display: flex;
align-items: center; }
.icon-input > input {
z-index: 1;
background: transparent; }
.icon-input .icon-input__icon {
margin-left: -25px;
line-height: 1; }
.form-note,
.oui-form-note {
padding-top: 5px;
font-size: 11px; }
.form-note--good-news,
.oui-form-good-news .oui-form-note {
color: #29a65e; }
.form-note--bad-news,
.oui-form-bad-news .oui-form-note {
color: #FF5B5B; }
.form-note--warning,
.oui-form-warning .oui-form-note {
color: #FFD233; }
.form-good-news .label {
color: #29a65e; }
.form-good-news .text-input,
.form-good-news .oui-text-input,
.form-good-news .select,
.form-good-news .textarea,
.form-good-news .oui-textarea {
border-color: #33CF76; }
.form-bad-news .label,
.form-bad-news .oui-label, .form-bad-news.oui-label,
.oui-form-bad-news .label,
.oui-form-bad-news .oui-label,
.oui-form-bad-news.oui-label {
color: #FF5B5B; }
.form-bad-news .text-input, .form-bad-news.oui-text-input,
.form-bad-news .oui-text-input,
.form-bad-news .oui-button--outline,
.form-bad-news.oui-dropdown-group .oui-button,
.form-bad-news .select,
.form-bad-news .textarea,
.form-bad-news .oui-textarea,
.oui-form-bad-news .text-input,
.oui-form-bad-news.oui-text-input,
.oui-form-bad-news .oui-text-input,
.oui-form-bad-news .oui-button--outline,
.oui-form-bad-news.oui-dropdown-group .oui-button,
.oui-form-bad-news .select,
.oui-form-bad-news .textarea,
.oui-form-bad-news .oui-textarea {
border-color: #FF5B5B; }
.form-bad-news .text-input:hover, .form-bad-news.oui-text-input:hover,
.form-bad-news .oui-text-input:hover,
.form-bad-news .oui-button--outline:hover,
.form-bad-news.oui-dropdown-group .oui-button:hover,
.form-bad-news .select:hover,
.form-bad-news .textarea:hover,
.form-bad-news .oui-textarea:hover,
.oui-form-bad-news .text-input:hover,
.oui-form-bad-news.oui-text-input:hover,
.oui-form-bad-news .oui-text-input:hover,
.oui-form-bad-news .oui-button--outline:hover,
.oui-form-bad-news.oui-dropdown-group .oui-button:hover,
.oui-form-bad-news .select:hover,
.oui-form-bad-news .textarea:hover,
.oui-form-bad-news .oui-textarea:hover {
border-color: #993737; }
.form-bad-news .text-input:focus, .form-bad-news.oui-text-input:focus,
.form-bad-news .oui-text-input:focus,
.form-bad-news .oui-button--outline:focus,
.form-bad-news.oui-dropdown-group .oui-button:focus,
.form-bad-news .select:focus,
.form-bad-news .textarea:focus,
.form-bad-news .oui-textarea:focus,
.oui-form-bad-news .text-input:focus,
.oui-form-bad-news.oui-text-input:focus,
.oui-form-bad-news .oui-text-input:focus,
.oui-form-bad-news .oui-button--outline:focus,
.oui-form-bad-news.oui-dropdown-group .oui-button:focus,
.oui-form-bad-news .select:focus,
.oui-form-bad-news .textarea:focus,
.oui-form-bad-news .oui-textarea:focus {
border-color: #ffbdbd; }
.form-warning .label {
color: #FFD233; }
.form-warning .text-input,
.form-warning .oui-text-input,
.form-warning .select,
.form-warning .textarea,
.form-warning .oui-textarea {
border-color: #FFD233; }
[required] {
box-shadow: none; }
.rule,
.oui-rule,
hr {
border: 0;
height: 0;
border-top: 1px solid #e0e0e0;
margin-top: 9px;
margin-bottom: 10px; }
.rule--dotted,
.oui-rule--dotted,
hr--dotted {
border-top-style: dotted; }
.rule--dashed,
.oui-rule--dashed,
hr--dashed {
border-top-style: dashed; }
img {
display: block;
max-width: 100%; }
figure > img {
display: block; }
a img {
border: 0; }
img[width],
img[height] {
max-width: none; }
.img--round {
border-radius: 5px; }
.img--circle {
border-radius: 100%; }
.img--border {
border: 1px solid #e0e0e0; }
.img--right {
float: right;
margin-bottom: 10px;
margin-left: 10px; }
.img--left {
float: left;
margin-right: 10px;
margin-bottom: 10px; }
.img--center {
display: block;
margin-right: auto;
margin-bottom: 10px;
margin-left: auto; }
a,
.link {
color: #4069FF;
transition: color 0.3s;
cursor: pointer; }
a:visited, a:active,
.link:visited,
.link:active {
color: #4069FF; }
a:hover,
.link:hover {
color: #0037FF; }
.link--dark {
color: #080738;
cursor: pointer; }
.link--dark:visited,
.link--dark:active {
color: #080738; }
.link--dark:hover {
color: #4069FF; }
.link--muted {
color: #83839B;
cursor: pointer; }
.link--muted:visited,
.link--muted:active {
color: #83839B; }
.link--muted:hover {
color: #4069FF; }
.link--bad-news {
color: #080738;
cursor: pointer; }
.link--bad-news:visited,
.link--bad-news:hover,
.link--bad-news:active {
color: #FF5B5B; }
.link--reverse {
color: #FFFFFF !important;
cursor: pointer; }
.link--reverse:hover {
color: white !important; }
.tabs--sub .tabs-nav__item.tab-disabled,
.tabs--sub .oui-tabs-nav__item.tab-disabled,
.oui-tabs--sub .tabs-nav__item.tab-disabled,
.oui-tabs--sub .oui-tabs-nav__item.tab-disabled, .oui-tabs--header .tabs-nav__item.tab-disabled,
.oui-tabs--header .oui-tabs-nav__item.tab-disabled, .toolbar__button[disabled], .toolbar__button--disabled, .toolbar__button--disabled:hover,
.link--disabled {
color: #83839B; }
.tabs--sub .tabs-nav__item.tab-disabled:visited,
.tabs--sub .oui-tabs-nav__item.tab-disabled:visited,
.oui-tabs--sub .tabs-nav__item.tab-disabled:visited,
.oui-tabs--sub .oui-tabs-nav__item.tab-disabled:visited, .oui-tabs--header .tabs-nav__item.tab-disabled:visited,
.oui-tabs--header .oui-tabs-nav__item.tab-disabled:visited, .toolbar__button:visited[disabled], .toolbar__button--disabled:visited, .tabs--sub .tabs-nav__item.tab-disabled:hover,
.tabs--sub .oui-tabs-nav__item.tab-disabled:hover,
.oui-tabs--sub .tabs-nav__item.tab-disabled:hover,
.oui-tabs--sub .oui-tabs-nav__item.tab-disabled:hover, .oui-tabs--header .tabs-nav__item.tab-disabled:hover,
.oui-tabs--header .oui-tabs-nav__item.tab-disabled:hover, .toolbar__button:hover[disabled], .toolbar__button--disabled:hover, .tabs--sub .tabs-nav__item.tab-disabled:active,
.tabs--sub .oui-tabs-nav__item.tab-disabled:active,
.oui-tabs--sub .tabs-nav__item.tab-disabled:active,
.oui-tabs--sub .oui-tabs-nav__item.tab-disabled:active, .oui-tabs--header .tabs-nav__item.tab-disabled:active,
.oui-tabs--header .oui-tabs-nav__item.tab-disabled:active, .toolbar__button:active[disabled], .toolbar__button--disabled:active,
.link--disabled:visited,
.link--disabled:hover,
.link--disabled:active {
color: #83839B;
cursor: default; }
.list {
margin-bottom: 10px; }
.list--bullet {
margin-left: 20px;
list-style-type: disc; }
.list--numbered {
margin-left: 25px;
list-style-type: decimal; }
.list--lower-alpha {
margin-left: 25px;
list-style-type: lower-alpha; }
.list--spaced > li {
margin-bottom: 5px; }
li > ul,
li > ol {
margin-bottom: 0; }
.scrollbars--visible {
overflow-y: scroll !important; }
.scrollbars--visible::-webkit-scrollbar {
-webkit-appearance: none;
appearance: none;
width: 7px;
background-color: rgba(0, 0, 0, 0.04); }
.scrollbars--visible::-webkit-scrollbar-thumb {
border-radius: 8px;
background-color: rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
box-shadow: 0 0 1px rgba(255, 255, 255, 0.5); }
.select,
.oui-select {
appearance: none;
-webkit-appearance: none;
transition: border-color 0.3s;
border: 1px solid #e0e0e0;
height: 34px;
border-radius: 5px;
font-size: 14px;
padding: 0 30px 0 7px;
outline: none;
cursor: pointer;
vertical-align: middle;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE1LjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhcGFfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgd2lkdGg9IjIwcHgiIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAwIDIwIDIwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMCAyMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+Cjxwb2x5Z29uIHBvaW50cz0iMTAsMTEuMiA2LjQsNy42IDQuMyw3LjYgMTAsMTMuMyAxNS43LDcuNiAxMy42LDcuNiAiLz4KPC9zdmc+Cg==);
background-position: right 7px center;
background-repeat: no-repeat;
background-size: auto 16px;
max-width: 100%; }
.select:hover:not([disabled]),
.oui-select:hover:not([disabled]) {
box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.16);
border-color: #999999; }
.select:disabled,
.oui-select:disabled {
cursor: default; }
.select--small,
.oui-select--small {
font-size: 11px;
height: 27px; }
.select--large,
.oui-select--large {
font-size: 15px;
height: 42px; }
.table,
.oui-disclose-table,
.oui-table {
width: 100%;
font-size: inherit; }
.table:not(.oui-table--loose) th,
.table:not(.oui-table--loose) td,
.oui-disclose-table:not(.oui-table--loose) th,
.oui-disclose-table:not(.oui-table--loose) td,
.oui-table:not(.oui-table--loose) th,
.oui-table:not(.oui-table--loose) td {
padding-left: 20px;
padding-top: 5px;
padding-bottom: 5px; }
.table:not(.oui-table--loose) th:first-child,
.table:not(.oui-table--loose) td:first-child,
.oui-disclose-table:not(.oui-table--loose) th:first-child,
.oui-disclose-table:not(.oui-table--loose) td:first-child,
.oui-table:not(.oui-table--loose) th:first-child,
.oui-table:not(.oui-table--loose) td:first-child {
padding-left: 0; }
.table th,
.oui-disclose-table th,
.oui-table th {
font-weight: 500;
font-size: 12px;
color: #83839B;
text-align: left; }
.table th[field],
.oui-disclose-table th[field],
.oui-table th[field] {
cursor: pointer; }
.table td,
.oui-disclose-table td,
.oui-table td {
vertical-align: top; }
.table [rowspan],
.oui-disclose-table [rowspan],
.oui-table [rowspan] {
vertical-align: middle; }
.table [rowspan="1"],
.oui-disclose-table [rowspan="1"],
.oui-table [rowspan="1"] {
vertical-align: top; }
.table .numerical,
.table .oui-numerical,
.oui-disclose-table .numerical,
.oui-disclose-table .oui-numerical,
.oui-table .numerical,
.oui-table .oui-numerical {
text-align: right; }
.table .cell-collapse,
.table .oui-cell-collapse,
.oui-disclose-table .cell-collapse,
.oui-disclose-table .oui-cell-collapse,
.oui-table .cell-collapse,
.oui-table .oui-cell-collapse {
width: 1%; }
.table--rule > thead > th,
.table--rule-no-bottom-border > thead > th,
.oui-table--rule > thead > th,
.oui-table--rule-no-bottom-border > thead > th {
padding-bottom: 10px; }
.table--rule > thead > tr,
.table--rule-no-bottom-border > thead > tr,
.oui-table--rule > thead > tr,
.oui-table--rule-no-bottom-border > thead > tr {
border-bottom: 1px solid #e0e0e0; }
.table--rule > tbody > tr,
.table--rule-no-bottom-border > tbody > tr,
.oui-table--rule > tbody > tr,
.oui-table--rule-no-bottom-border > tbody > tr {
border-bottom: 1px solid #f0f0f0; }
.table--rule > tbody > tr:first-child,
.table--rule-no-bottom-border > tbody > tr:first-child,
.oui-table--rule > tbody > tr:first-child,
.oui-table--rule-no-bottom-border > tbody > tr:first-child {
border-bottom: 1px solid #f0f0f0; }
.table--rule-no-bottom-border > tbody > tr:last-child,
.oui-table--rule-no-bottom-border > tbody > tr:last-child {
border-bottom: 0; }
.table--wall > thead > tr > th,
.table--wall > tbody > tr > td,
.oui-table--wall > thead > tr > th,
.oui-table--wall > tbody > tr > td {
border-left: 1px solid #f0f0f0;
padding-right: 10px; }
.table--wall > thead > tr > th:first-child,
.table--wall > tbody > tr > td:first-child,
.oui-table--wall > thead > tr > th:first-child,
.oui-table--wall > tbody > tr > td:first-child {
border-left: 0; }
.table--hover > tbody > tr:hover,
.oui-table--hover > tbody > tr:hover {
background-color: #d9e1ff;
cursor: pointer; }
.table--hover > thead > tr > th:first-child,
.table--hover > tbody > tr > td:first-child,
.oui-table--hover > thead > tr > th:first-child,
.oui-table--hover > tbody > tr > td:first-child {
padding-left: 10px; }
.table--hover > thead > tr > th:last-child,
.table--hover > tbody > tr > td:last-child,
.oui-table--hover > thead > tr > th:last-child,
.oui-table--hover > tbody > tr > td:last-child {
padding-right: 10px; }
.table--loose th,
.table--loose td,
.oui-table--loose th,
.oui-table--loose td {
padding-left: 10px;
padding-right: 10px; }
.table--loose th:first-child,
.table--loose td:first-child,
.oui-table--loose th:first-child,
.oui-table--loose td:first-child {
padding-left: 20px; }
.table--loose th:last-child,
.table--loose td:last-child,
.oui-table--loose th:last-child,
.oui-table--loose td:last-child {
padding-right: 20px; }
.table--loose th,
.oui-table--loose th {
padding-top: 5px;
padding-bottom: 5px; }
.table--loose td,
.oui-table--loose td {
padding-top: 10px;
padding-bottom: 10px; }
.table--add-row tbody > tr:first-child > td,
.oui-table--add-row tbody > tr:first-child > td {
padding-top: 0; }
.table--add-row td,
.oui-table--add-row td {
padding-bottom: 10px; }
.table--add-row__controls,
.oui-table--add-row__controls {
width: 1%;
white-space: nowrap; }
.table-row--active,
.oui-table-row--active {
background-color: #FFFFFF; }
.table--scroll,
.oui-table--scroll {
display: flex;
flex-direction: column;
width: 100%; }
.table--scroll thead,
.oui-table--scroll thead {
display: flex;
flex: none; }
.table--scroll tbody,
.oui-table--scroll tbody {
display: flex;
flex-direction: column;
flex: 1;
width: 100%;
overflow-y: auto;
min-height: 0;
-ms-overflow-style: -ms-autohiding-scrollbar; }
.table--scroll tr,
.oui-table--scroll tr {
display: flex;
flex: none;
width: 100%; }
.table--scroll th,
.table--scroll td,
.oui-table--scroll th,
.oui-table--scroll td {
display: block; }
.editable:hover {
color: #83839B; }
.editable:hover::after {
display: inline-block;
color: #83839B;
content: '\270E';
font-size: 1em;
padding-right: 5px;
transform: scaleX(-1); }
.monospace {
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; }
[data-lego-pseudo-content]::before {
content: attr(data-lego-pseudo-content); }
.number-display {
font-family: Lato, Helvetica, Verdana, sans-serif; }
.array {
display: flex; }
.array__item {
flex: 1;
margin-left: 10px;
margin-right: 10px; }
.array__item:first-child {
margin-left: 0; }
.array__item:last-child {
margin-right: 0; }
.button-group {
display: flex; }
.button-group > * {
margin-left: 0;
border-radius: 0; }
.button-group > *:not(:first-child) {
margin-left: -1px; }
.button-group > *:hover,
.button-group > *:focus {
position: relative; }
.button-group > *:first-child {
border-radius: 8px 0 0 8px; }
.button-group > *:last-child {
border-radius: 0 8px 8px 0; }
.button-group > .button--highlight,
.button-group > .oui-button--highlight {
position: relative; }
.button-group > .text-input,
.button-group > .oui-text-input {
flex: 1;
width: auto; }
.button-group .button--highlight,
.button-group .oui-button--highlight,
.button-group .button--danger,
.button-group .oui-button--danger {
z-index: 1; }
.button-row--left .button,
.button-row--left .oui-button,
.oui-button-row--left .button,
.oui-button-row--left .oui-button {
margin-right: 10px; }
.button-row--left .button:last-child,
.button-row--left .oui-button:last-child,
.oui-button-row--left .button:last-child,
.oui-button-row--left .oui-button:last-child {
margin-right: 0; }
.button-row--right,
.oui-button-row--right {
text-align: right; }
.button-row--right .button,
.button-row--right .oui-button,
.oui-button-row--right .button,
.oui-button-row--right .oui-button {
margin-left: 10px; }
.button-row--right .button:first-child,
.button-row--right .oui-button:first-child,
.oui-button-row--right .button:first-child,
.oui-button-row--right .oui-button:first-child {
margin-left: 0; }
.button-row--center,
.oui-button-row--center {
text-align: center; }
.button-row--center .button,
.button-row--center .oui-button,
.oui-button-row--center .button,
.oui-button-row--center .oui-button {
margin-left: 5px;
margin-right: 5px; }
.button-row--center .button:first-child,
.button-row--center .oui-button:first-child,
.oui-button-row--center .button:first-child,
.oui-button-row--center .oui-button:first-child {
margin-left: 0; }
.button-row--center .button:last-child,
.button-row--center .oui-button:last-child,
.oui-button-row--center .button:last-child,
.oui-button-row--center .oui-button:last-child {
margin-right: 0; }
.cf::after {
content: '';
display: table;
clear: both; }
.flex {
display: flex; }
.flex--row {
flex-direction: row; }
.flex--column {
flex-direction: column; }
.flex--1 {
flex: 1; }
.flex--none {
flex: none; }
.flex-shrink--none {
flex-shrink: 0; }
.flex-grow--none {
flex-grow: 0; }
.flex-align--start {
align-items: flex-start; }
.flex-align--center {
align-items: center; }
.flex-align--end {
align-items: flex-end; }
.flex-justified--start {
justify-content: flex-start; }
.flex-justified--center {
justify-content: center; }
.flex-justified--end {
justify-content: flex-end; }
.flex-justified--between {
justify-content: space-between; }
.flex-wrap {
flex-wrap: wrap; }
.flex-wrap--reverse {
flex-wrap: wrap-reverse; }
.flex-self--start {
align-self: flex-start; }
.flex-self--center {
align-self: center; }
.flex-self--end {
align-self: flex-end; }
.flex-overflow-fix {
min-height: 0;
min-width: 0; }
.flex--dead-center {
display: flex;
justify-content: center;
align-items: center; }
.matrix,
.grid {
display: flex;
flex-wrap: wrap;
margin-left: -20px; }
.grid__cell {
flex: 1;
padding-left: 20px; }
.grid--gutter--narrow {
margin-left: -10px; }
.grid--gutter--narrow > .grid__cell {
padding-left: 10px; }
.grid--gutter--wide {
margin-left: -40px; }
.grid--gutter--wide > .grid__cell {
padding-left: 40px; }
.grid--flush {
margin-left: 0; }
.grid--flush > .grid__cell {
padding-left: 0; }
.grid--natural > .grid__cell {
flex: none; }
.grid--center {
align-items: center; }
.grid--bottom {
align-items: flex-end; }
.grid__cell[class*="width-"] {
-webkit-flex: none;
-ms-flex: none;
flex: none; }
.island {
border: 1px solid #f0f0f0;
border-radius: 5px;
background: #FFFFFF;
padding: 10px; }
.island--center {
text-align: center; }
.matrix {
margin-left: -20px; }
.matrix > li {
padding-left: 20px; }
.matrix--1-2 > li {
width: 50%; }
.matrix {
margin-left: -20px; }
.matrix > li {
padding-left: 20px; }
.matrix--1-3 > li {
width: 33.33333%; }
.matrix {
margin-left: -20px; }
.matrix > li {
padding-left: 20px; }
.matrix--1-4 > li {
width: 25%; }
.reading-column {
max-width: 700px;
min-width: 700px;
margin: 40px auto;
padding-left: 20px;
padding-right: 20px; }
.accordion,
.accordion,
.oui-accordion {
display: flex;
flex-direction: column;
width: 100%; }
.accordion__react,
.accordion__react,
.oui-accordion__react {
background: #FFFFFF;
height: 100%; }
.accordion__link,
.accordion__link,
.oui-accordion__link {
transition-property: height;
transition-duration: 0.3s;
display: flex;
align-items: center;
letter-spacing: 1px;
font-size: 13px;
padding: 0 20px;
background: #FFFFFF;
line-height: 1;
height: 26px;
box-shadow: inset 0 1px 0 #e0e0e0;
font-weight: 500;
text-transform: uppercase; }
.accordion__link:hover,
.accordion__link:hover,
.oui-accordion__link:hover {
background: #f0f0f0;
color: #080738; }
.accordion__link:focus,
.accordion__link:focus,
.oui-accordion__link:focus {
outline: none; }
.accordion__link::before,
.accordion__link::before,
.oui-accordion__link::before {
content: '+';
margin-left: -10px;
width: 10px;
display: inline-block; }
.accordion__item,
.accordion__item,
.oui-accordion__item {
display: flex;
flex-direction: column;
min-height: 26px;
height: 26px;
overflow: hidden; }
.accordion__item__react,
.accordion__item__react,
.oui-accordion__item__react {
flex: 0.001;
transition: flex-grow 0.166s ease-in-out; }
.accordion__item:first-child .accordion__link,
.accordion__item:first-child .accordion__link,
.oui-accordion__item:first-child .accordion__link {
box-shadow: none; }
.accordion__item--empty .accordion__content-wrap,
.accordion__item--empty .accordion__content-wrap,
.oui-accordion__item--empty .accordion__content-wrap {
display: flex;
justify-content: center;
align-items: center; }
.accordion__item--empty .accordion__content,
.accordion__item--empty .accordion__content,
.oui-accordion__item--empty .accordion__content {
flex: 1; }
.accordion .is-active,
.accordion .is-active,
.oui-accordion .is-active {
flex: 1; }
.accordion .is-active .accordion__link,
.accordion .is-active .accordion__link,
.oui-accordion .is-active .accordion__link {
color: #080738;
cursor: default; }
.accordion .is-active .accordion__link:hover,
.accordion .is-active .accordion__link:hover,
.oui-accordion .is-active .accordion__link:hover {
background: #FFFFFF; }
.accordion .is-active .accordion__link::before,
.accordion .is-active .accordion__link::before,
.oui-accordion .is-active .accordion__link::before {
opacity: 0; }
.accordion__content-wrap,
.accordion__content-wrap,
.oui-accordion__content-wrap {
flex: 1;
overflow-y: auto; }
.accordion__content,
.accordion__content,
.oui-accordion__content {
padding: 20px; }
.arrow-inline--up,
.oui-arrow-inline--up,
.arrow-inline--down,
.oui-arrow-inline--down,
.arrow-inline--right,
.oui-arrow-inline--right,
.arrow-inline--left,
.oui-arrow-inline--left,
.disclose__symbol::before,
.oui-disclose__symbol::before,
.arrow-inline,
.oui-arrow-inline {
display: inline-block;
width: 7px;
height: 7px;
border: 1px solid currentColor;
border-top: none;
border-right: none;
vertical-align: middle;
margin-top: -4px;
margin-left: 3px; }
.arrow-inline--up,
.oui-arrow-inline--up {
transform: rotate(135deg);
vertical-align: -2%; }
.arrow-inline--down,
.oui-arrow-inline--down {
transform: rotate(-45deg);
vertical-align: 6%; }
.arrow-inline--right,
.oui-arrow-inline--right {
transform: rotate(-135deg); }
.arrow-inline--left,
.oui-arrow-inline--left {
transform: rotate(45deg); }
.arrow-inline--small,
.oui-arrow-inline--small {
width: 6px;
height: 6px;
vertical-align: 20%; }
.attention,
.oui-attention {
padding: 10px;
border-radius: 5px;
border: 1px solid #e0e0e0;
background: #FFFFFF; }
.attention--brand,
.oui-attention--brand {
border-color: #BFCDFF;
background-color: #d9e1ff; }
.attention--warning,
.oui-attention--warning {
border-color: #FFD233;
background-color: #fff6d6; }
.attention--good-news,
.oui-attention--good-news {
border-color: #33CF76;
background-color: #d6f5e4; }
.attention--bad-news,
.oui-attention--bad-news {
border-color: #FF5B5B;
background-color: #ffdede; }
.attention__close,
.oui-attention__close {
float: right;
margin-left: 10px;
cursor: pointer; }
.badge {
display: flex;
align-items: center;
white-space: nowrap; }
.badge > li {
height: 17px;
line-height: 13px;
background: #999999;
color: #FFFFFF;
min-width: 28px;
text-align: center;
margin-right: 5px;
border-radius: 17px;
font-size: 10px;
padding: 2px 10px !important;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase; }
.badge > li:last-child {
margin-right: 0; }
.oui-badge {
display: inline-block;
height: 17px;
line-height: 13px;
background: #999999;
color: #FFFFFF;
min-width: 28px;
text-align: center;
margin-right: 5px;
border-radius: 17px;
font-size: 10px;
padding: 2px 10px !important;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase; }
.badge > li.badge__draft,
.oui-badge--draft {
background: #FF9C33; }
.badge > li.badge__live,
.oui-badge--live {
background: #33CF76; }
.badge > li.badge__primary,
.oui-badge--primary {
background: #33A5FF; }
.badge > li.badge__plain,
.oui-badge--plain {
background: transparent;
color: #999999; }
.badge > li.badge__bad-news,
.oui-badge--bad-news {
background: #FF5B5B; }
.oui-shadow {
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); }
.oui-shadow--light {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
.oui-shadow--big {
box-shadow: 0 1px 8px rgba(0, 0, 0, 0.3); }
code {
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
font-size: 13px; }
.pre,
.oui-pre {
margin-bottom: 10px;
white-space: pre-wrap; }
.pre code,
.oui-pre code {
padding: 10px;
background: #FFFFFF;
overflow-x: auto;
display: block;
border-radius: 5px;
border: 1px solid #e0e0e0; }
.code,
.oui-code {
background: #FFFFFF;
border-radius: 5px;
border: 1px solid #e0e0e0;
padding: 1px 3px; }
.dropdown,
.oui-dropdown,
.block-list-group,
.block-list {
list-style: none;
margin-left: 0; }
.dropdown > li, .oui-dropdown > li, .block-list-group > li,
.block-list > li {
padding: 5px;
border-top: 1px solid #f0f0f0; }
.dropdown__block-link,
.oui-dropdown__block-link,
.block-list__link {
display: block;
cursor: pointer;
padding: 5px 15px;
margin-left: -5px;
margin-right: -5px;
border-radius: var(--border-radius); }
.dropdown__block-link:hover,
.oui-dropdown__block-link:hover,
.block-list__link:hover {
color: var(--light-blue-75);
background-color: var(--light-blue-6); }
.block-list__link--active {
background-color: #FFFFFF; }
.block-list--flush li {
padding-left: 0;
padding-right: 0; }
.block-list--all li:last-child {
border-bottom: 1px solid #f0f0f0; }
.block-list--no-border > li {
border-top: 0; }
.oui-block-list__category:not(:last-child) {
border-bottom: 1px solid #f0f0f0; }
.oui-block-list__category__name {
background: #FFFFFF;
color: #83839B;
font-size: 11px;
font-weight: 400;
border-bottom: 1px solid #f0f0f0; }
.oui-block-list__item {
padding: 5px 15px; }
.oui-block-list__link:hover,
.oui-block-list__link:focus {
background-color: var(--light-blue-6);
outline: none; }
.dropdown,
.oui-dropdown,
.block-list-group {
padding: 0;
border: 1px solid #e0e0e0;
border-radius: 5px; }
.dropdown > li:first-child, .oui-dropdown > li:first-child,
.block-list-group > li:first-child {
border: 0; }
.dropdown__item .dropdown__block-link {
margin: 0 !important; }
.oui-dropdown-children .oui-dropdown__block-link {
margin-left: 0;
margin-right: 0; }
.oui-dropdown-children .oui-block-list__category ul {
padding: 5px; }
.oui-dropdown-children, .oui-dropdown-children .oui-block-list__link {
border-radius: var(--border-radius); }
.dialog,
.oui-dialog {
position: relative;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
width: 700px; }
.dialog--narrow,
.oui-dialog--narrow {
width: 500px; }
.dialog--wide,
.oui-dialog--wide {
width: 900px; }
.dialog__header, .dialog__body, .dialog__footer,
.oui-dialog__header,
.oui-dialog__body,
.oui-dialog__footer {
padding: 20px; }
.dialog__header, .dialog__footer,
.oui-dialog__header,
.oui-dialog__footer {
background-color: #FFFFFF; }
.dialog__header,
.oui-dialog__header {
border-bottom: 1px solid #f0f0f0; }
.dialog__footer,
.oui-dialog__footer {
border-top: 1px solid #f0f0f0; }
.dialog__title,
.oui-dialog__title {
font-size: 26px;
color: #46456A;
line-height: 1; }
.dialog__body,
.oui-dialog__body {
background: #FFFFFF;
padding-bottom: 30px; }
.dialog__close,
.oui-dialog__close {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: -12px;
right: -12px;
width: 24px;
height: 24px;
border-radius: 50%;
cursor: pointer;
background: #000000;
color: #FFFFFF;
border: 2px solid #FFFFFF;
box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
z-index: 1; }
.disclose__link,
.oui-disclose__link {
display: block;
position: relative;
margin-bottom: 5px; }
.disclose__symbol,
.oui-disclose__symbol {
width: 10px;
display: inline-block;
pointer-events: none;
margin-right: 5px; }
.disclose__symbol::before,
.oui-disclose__symbol::before {
content: '';
transform: rotate(-135deg); }
.disclose--right .disclose__symbol,
.disclose--right .oui-disclose__symbol,
.oui-disclose--right .disclose__symbol,
.oui-disclose--right .oui-disclose__symbol {
float: right;
transform: rotate(180deg);
margin-right: 0;
margin-left: 5px; }
.disclose__content,
.oui-disclose__content {
display: none; }
.disclose__item,
.oui-disclose__item {
margin-bottom: 10px; }
.disclose.is-active .disclose__content,
.disclose.is-active .oui-disclose__content,
.oui-disclose.is-active .disclose__content,
.oui-disclose.is-active .oui-disclose__content,
.is-active.oui-disclose-table--row__toggle .disclose__content,
.is-active.oui-disclose-table--row__toggle .oui-disclose__content {
display: block; }
.disclose.is-active .oui-disclose__content > :last-child,
.oui-disclose.is-active .oui-disclose__content > :last-child,
.is-active.oui-disclose-table--row__toggle .oui-disclose__content > :last-child {
padding-bottom: 20px; }
.disclose.is-active .disclose__symbol,
.disclose.is-active .oui-disclose__symbol,
.oui-disclose.is-active .disclose__symbol,
.oui-disclose.is-active .oui-disclose__symbol,
.is-active.oui-disclose-table--row__toggle .disclose__symbol,
.is-active.oui-disclose-table--row__toggle .oui-disclose__symbol {
transform: rotate(90deg);
top: -4px;
position: relative; }
.oui-disclose-table > thead > th {
padding-bottom: 10px; }
.oui-disclose-table > thead > tr {
border-bottom: 1px solid #e0e0e0; }
.oui-disclose-table > tbody > tr {
border-top: 1px solid #f0f0f0; }
.oui-disclose-table > tbody > tr:first-child {
border-top: 0; }
.oui-disclose-table > tbody > tr:last-child {
border-bottom: 1px solid #f0f0f0; }
.oui-disclose-table--row__toggle {
border-left: 1px solid transparent;
border-right: 1px solid transparent; }
.oui-disclose-table--row__toggle:hover {
cursor: pointer;
background-color: #F3F6FF; }
.oui-disclose-table--row__toggle.is-active {
background-color: #f7f7f7; }
.dropdown-group,
.oui-dropdown-group {
font-size: 14px;
display: inline-block;
position: relative;
vertical-align: top; }
.dropdown-group.is-active .dropdown,
.dropdown-group.is-active .oui-dropdown,
.oui-dropdown-group.is-active .dropdown,
.oui-dropdown-group.is-active .oui-dropdown {
display: block; }
.dropdown,
.oui-dropdown {
background: #FFFFFF;
min-width: 100%;
position: absolute;
top: 100%;
left: auto;
z-index: 1;
margin-top: 2px;
text-align: left;
max-height: 320px;
line-height: 1.6;
font-weight: 400;
overflow-y: auto;
display: none;
border: 0;
box-shadow: var(--wide-shadow);
border-radius: var(--border-radius); }
.dropdown__item,
.oui-dropdown__item {
color: #080738;
padding: 5px 10px; }
.dropdown__item > div.isSelected,
.dropdown__item > div.micro,
.oui-dropdown__item > div.isSelected,
.oui-dropdown__item > div.micro {
padding: 5px 15px; }
.dropdown__item--active,
.oui-dropdown__item--active {
background: #FFFFFF; }
.dropdown--right,
.oui-dropdown--right {
right: 0;
left: auto; }
.dropdown--descriptive__header,
.oui-dropdown--descriptive__header {
color: var(--dark-blue-100); }
.dropdown--descriptive__content,
.oui-dropdown--descriptive__content {
font-size: 11px;
line-height: 1.4;
color: #83839B;
margin-bottom: 5px; }
.dropdown__block-link:hover .dropdown--descriptive__header,
.dropdown__block-link:hover .oui-dropdown--descriptive__header,
.dropdown__block-link:hover .dropdown--descriptive__content,
.dropdown__block-link:hover .oui-dropdown--descriptive__content,
.oui-dropdown__block-link:hover .dropdown--descriptive__header,
.oui-dropdown__block-link:hover .oui-dropdown--descriptive__header,
.oui-dropdown__block-link:hover .dropdown--descriptive__content,
.oui-dropdown__block-link:hover .oui-dropdown--descriptive__content {
color: var(--light-blue-75); }
.dropdown--up,
.oui-dropdown--up {
bottom: 100%;
top: initial; }
.oui-dropdown-children > div {
border-radius: var(--border-radius); }
/**
* ExampleComponent
*
* NOTE: If needed, scss files should be imported in src/oui/_oui-partials.scss
* (please use existing OUI classes when possible and consult UI Eng when adding styles is absolutely necessary)
*/
.example-component p, .oui-example-component p {
background-color: yellow; }
/**
* When a text search input is in .oui-filter-picker and not disabled or read-only, styles will be changed.
* This allows for a nice fit with the BlockList / FilterList items, but assumes those aren't present
* when disabled or read-only
*/
.filter-picker-list .text-input--search, .filter-picker-list .oui-text-input--search, .oui-filter-picker-list .text-input--search, .oui-filter-picker-list .oui-text-input--search {
border-bottom: 0 !important;
border-radius: 5px 5px 0px 0px !important; }
.help-dot {
background: #a6a6a6;
color: #FFFFFF;
width: 16px;
height: 16px;
line-height: 16px;
text-align: center;
display: inline-block;
border-radius: 50%;
font-size: 10px; }
.help-dot::after {
content: '?'; }
.icon,
.oui-icon {
width: 16px;
height: 16px;
display: inline-block;
fill: currentColor; }
.icon--small, .icon--12,
.oui-icon--small,
.oui-icon--12 {
width: 12px;
height: 12px; }
.icon--medium, .icon--24,
.oui-icon--medium,
.oui-icon--24 {
width: 24px;
height: 24px; }
.icon--large, .icon--32,
.oui-icon--large,
.oui-icon--32 {
width: 32px;
height: 32px; }
.icon + [class^="-arrow-inline"],
.icon + [class^="oui-arrow-inline"],
.oui-icon + [class^="-arrow-inline"],
.oui-icon + [class^="oui-arrow-inline"] {
vertical-align: super; }
.icon--text-align,
.oui-icon--text-align {
position: relative;
top: 2px; }
.button .icon,
.oui-button:not(.oui-button--unstyled) .oui-icon {
vertical-align: sub; }
.tabs-nav__item .icon,
.tabs-nav__item .oui-icon {
vertical-align: sub; }
.icon-status--active::before, .icon-status--bad-news::before, .icon-status--good-news::before, .icon-status--empty::before {
content: '';
border-radius: 50%;
display: inline-block;
width: 10px;
height: 10px; }
.icon-status--active::before {
background: #4069FF; }
.icon-status--bad-news::before {
background: #FF5B5B; }
.icon-status--good-news::before {
background: #33CF76; }
.icon-target {
padding: 6px;
border-radius: 50%;
box-sizing: content-box;
cursor: pointer; }
.icon-target:hover {
background: var(--light-blue-6);
color: var(--light-blue-75); }
.svg--non-scaling-stroke-path, .svg--non-scaling-stroke-circle, .svg--non-scaling-stroke-rect, .svg--non-scaling-stroke-line {
vector-effect: non-scaling-stroke; }
.text-input,
.oui-text-input {
transition: border-color 0.3s;
width: 100%;
border: 1px solid #e0e0e0;
border-radius: 5px;
padding: 7px;
vertical-align: middle;
line-height: 1.3; }
.text-input:hover,
.oui-text-input:hover {
border-color: #999999; }
.text-input:focus,
.oui-text-input:focus {
border-color: #BFCDFF; }
.text-input[disabled],
.oui-text-input[disabled] {
background-color: #FFFFFF;
color: #999999;
cursor: default; }
.text-input[disabled]:hover, .text-input[disabled]:focus,
.oui-text-input[disabled]:hover,
.oui-text-input[disabled]:focus {
border-color: #e0e0e0; }
.text-input[type="number"],
.oui-text-input[type="number"] {
text-align: right; }
.text-input--small,
.oui-text-input--small {
padding-top: 2px;
padding-bottom: 2px; }
.text-input--disabled,
.oui-text-input--disabled {
padding-top: 2px;
padding-bottom: 2px; }
.text-input--read-only:focus,
.oui-text-input--read-only:focus {
border-color: #999999; }
.input-icon {
position: relative; }
.input-icon__left, .input-icon__right {
transform: translateY(-50%);
pointer-events: none;
position: absolute;
top: 50%; }
.input-icon__left {
left: 10px; }
.input-icon__right {
right: 10px; }
.input-icon__muted {
fill: #999999; }
.label,
.oui-label {
display: block;
margin-bottom: 5px;
font-weight: 400; }
.label__optional,
.oui-label__optional {
margin-left: 5px;
color: #83839B;
font-size: 11px;
font-weight: 400; }
.label--required::after,
.oui-label--required::after {
content: '*';
margin-left: 5px;
color: #FF5B5B;
font-weight: 400;
font-size: 18px;
line-height: 1;
position: relative;
top: 2px; }
.label--rule,
.oui-label--rule {
border-bottom: 1px solid #e0e0e0;
padding-bottom: 5px; }
.label--disabled,
.oui-label--disabled {
color: #83839B;
cursor: default !important; }
.listgroup .listgroup__item:first-child,
.oui-listgroup .listgroup__item:first-child,
.listgroup .listgroup__item:first-child {
padding-top: 0 !important; }
.listgroup .listgroup__item:last-child,
.oui-listgroup .listgroup__item:last-child,
.listgroup .listgroup__item:last-child {
border: 0 !important; }
.media {
display: flex;
align-items: flex-start; }
.media__img {
margin-right: 10px;
margin-top: 0.7%; }
.media__img--rev {
margin-left: 10px;
margin-top: 0.7%; }
.media__body {
flex: 1; }
.nav {
display: flex; }
.nav > li {
margin-right: 10px; }
.nav > li > a {
display: block; }
.nav--stacked {
display: block; }
.nav--stacked > li {
margin-right: 0; }
.nav--center {
justify-content: center; }
.nav--center > li {
margin-left: 5px;
margin-right: 5px; }
.nav--fit {
display: flex; }
.nav--fit > li {
flex: 1; }
.nav--fit > li > a {
display: block; }
.pagination {
justify-content: center; }
.pagination > li {
padding: 5px; }
.pagination__first a::before {
content: '\AB' '\A0'; }
.pagination__last a::after {
content: '\A0' '\BB'; }
.pagination__current > a {
color: #080738; }
.pop--over,
.oui-pop--over {
border: 1px solid #e0e0e0;
border-radius: var(--border-radius);
background: #FFFFFF;
max-width: 350px;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
position: absolute;
opacity: 0;
display: none; }
.pop--over__content,
.oui-pop--over__content {
max-height: 100vh;
overflow-y: auto;
padding: 5px 10px; }
.pop--over__title,
.oui-pop--over__title {
font-weight: 500; }
.pop--over__body,
.oui-pop--over__body {
margin-top: 5px;
margin-bottom: 5px;
font-size: 13px;
line-height: 1.4; }
.pop--over__footer,
.oui-pop--over__footer {
margin-top: 5px;
font-size: 11px; }
.pop--over__close,
.oui-pop--over__close {
cursor: pointer;
position: absolute;
top: 5px;
right: 5px; }
.pop--over--arrow-top-left::before,
.oui-pop--over--arrow-top-left::before {
border-bottom-color: #e0e0e0; }
.pop--over--arrow-top-left::after,
.oui-pop--over--arrow-top-left::after {
border-bottom-color: #FFFFFF; }
.pop--over--arrow-top-center::before,
.oui-pop--over--arrow-top-center::before {
border-bottom-color: #e0e0e0; }
.pop--over--arrow-top-center::after,
.oui-pop--over--arrow-top-center::after {
border-bottom-color: #FFFFFF; }
.pop--over--arrow-top-right::before,
.oui-pop--over--arrow-top-right::before {
border-bottom-color: #e0e0e0; }
.pop--over--arrow-top-right::after,
.oui-pop--over--arrow-top-right::after {
border-bottom-color: #FFFFFF; }
.pop--over--arrow-right-top::before,
.oui-pop--over--arrow-right-top::before {
border-left-color: #e0e0e0; }
.pop--over--arrow-right-top::after,
.oui-pop--over--arrow-right-top::after {
border-left-color: #FFFFFF; }
.pop--over--arrow-right-center::before,
.oui-pop--over--arrow-right-center::before {
border-left-color: #e0e0e0; }
.pop--over--arrow-right-center::after,
.oui-pop--over--arrow-right-center::after {
border-left-color: #FFFFFF; }
.pop--over--arrow-right-bottom::before,
.oui-pop--over--arrow-right-bottom::before {
border-left-color: #e0e0e0; }
.pop--over--arrow-right-bottom::after,
.oui-pop--over--arrow-right-bottom::after {
border-left-color: #FFFFFF; }
.pop--over--arrow-bottom-right::before,
.oui-pop--over--arrow-bottom-right::before {
border-top-color: #e0e0e0; }
.pop--over--arrow-bottom-right::after,
.oui-pop--over--arrow-bottom-right::after {
border-top-color: #FFFFFF; }
.pop--over--arrow-bottom-center::before,
.oui-pop--over--arrow-bottom-center::before {
border-top-color: #e0e0e0; }
.pop--over--arrow-bottom-center::after,
.oui-pop--over--arrow-bottom-center::after {
border-top-color: #FFFFFF; }
.pop--over--arrow-bottom-left::before,
.oui-pop--over--arrow-bottom-left::before {
border-top-color: #e0e0e0; }
.pop--over--arrow-bottom-left::after,
.oui-pop--over--arrow-bottom-left::after {
border-top-color: #FFFFFF; }
.pop--over--arrow-left-bottom::before,
.oui-pop--over--arrow-left-bottom::before {
border-right-color: #e0e0e0; }
.pop--over--arrow-left-bottom::after,
.oui-pop--over--arrow-left-bottom::after {
border-right-color: #FFFFFF; }
.pop--over--arrow-left-center::before,
.oui-pop--over--arrow-left-center::before {
border-right-color: #e0e0e0; }
.pop--over--arrow-left-center::after,
.oui-pop--over--arrow-left-center::after {
border-right-color: #FFFFFF; }
.pop--over--arrow-left-top::before,
.oui-pop--over--arrow-left-top::before {
border-right-color: #e0e0e0; }
.pop--over--arrow-left-top::after,
.oui-pop--over--arrow-left-top::after {
border-right-color: #FFFFFF; }
.pop--tip,
.oui-pop--tip,
.tippy-popper {
border-radius: var(--border-radius); }
.pop--tip,
.oui-pop--tip {
background: #262626;
color: #FFFFFF;
font-size: 11px;
padding: 5px 10px;
max-width: 250px;
display: inline-block;
z-index: 100;
font-weight: 500;
position: absolute;
opacity: 0; }
.pop--tip--arrow-top-left::before,
.oui-pop--tip--arrow-top-left::before {
border-bottom-color: #262626; }
.pop--tip--arrow-top-left::after,
.oui-pop--tip--arrow-top-left::after {
border-bottom-color: #262626; }
.pop--tip--arrow-top-center::before,
.oui-pop--tip--arrow-top-center::before {
border-bottom-color: #262626; }
.pop--tip--arrow-top-center::after,
.oui-pop--tip--arrow-top-center::after {
border-bottom-color: #262626; }
.pop--tip--arrow-top-right::before,
.oui-pop--tip--arrow-top-right::before {
border-bottom-color: #262626; }
.pop--tip--arrow-top-right::after,
.oui-pop--tip--arrow-top-right::after {
border-bottom-color: #262626; }
.pop--tip--arrow-right-top::before,
.oui-pop--tip--arrow-right-top::before {
border-left-color: #262626; }
.pop--tip--arrow-right-top::after,
.oui-pop--tip--arrow-right-top::after {
border-left-color: #262626; }
.pop--tip--arrow-right-center::before,
.oui-pop--tip--arrow-right-center::before {
border-left-color: #262626; }
.pop--tip--arrow-right-center::after,
.oui-pop--tip--arrow-right-center::after {
border-left-color: #262626; }
.pop--tip--arrow-right-bottom::before,
.oui-pop--tip--arrow-right-bottom::before {
border-left-color: #262626; }
.pop--tip--arrow-right-bottom::after,
.oui-pop--tip--arrow-right-bottom::after {
border-left-color: #262626; }
.pop--tip--arrow-bottom-right::before,
.oui-pop--tip--arrow-bottom-right::before {
border-top-color: #262626; }
.pop--tip--arrow-bottom-right::after,
.oui-pop--tip--arrow-bottom-right::after {
border-top-color: #262626; }
.pop--tip--arrow-bottom-center::before,
.oui-pop--tip--arrow-bottom-center::before {
border-top-color: #262626; }
.pop--tip--arrow-bottom-center::after,
.oui-pop--tip--arrow-bottom-center::after {
border-top-color: #262626; }
.pop--tip--arrow-bottom-left::before,
.oui-pop--tip--arrow-bottom-left::before {
border-top-color: #262626; }
.pop--tip--arrow-bottom-left::after,
.oui-pop--tip--arrow-bottom-left::after {
border-top-color: #262626; }
.pop--tip--arrow-left-bottom::before,
.oui-pop--tip--arrow-left-bottom::before {
border-right-color: #262626; }
.pop--tip--arrow-left-bottom::after,
.oui-pop--tip--arrow-left-bottom::after {
border-right-color: #262626; }
.pop--tip--arrow-left-center::before,
.oui-pop--tip--arrow-left-center::before {
border-right-color: #262626; }
.pop--tip--arrow-left-center::after,
.oui-pop--tip--arrow-left-center::after {
border-right-color: #262626; }
.pop--tip--arrow-left-top::before,
.oui-pop--tip--arrow-left-top::before {
border-right-color: #262626; }
.pop--tip--arrow-left-top::after,
.oui-pop--tip--arrow-left-top::after {
border-right-color: #262626; }
.progress,
.oui-progress {
background: #FFFFFF;
height: 20px;
border-radius: 5px;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
overflow: hidden; }
.progress--bad-news .progress__bar,
.progress--bad-news .oui-progress__bar,
.oui-progress--bad-news .progress__bar,
.oui-progress--bad-news .oui-progress__bar {
background: #FF5B5B; }
.progress__bar,
.oui-progress__bar {
transition: width 0.3s;
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
height: 100%;
background: #4069FF;
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
color: #FFFFFF;
font-size: 13px;
min-width: 20px;
max-width: 100%; }
.progress__bar[aria-valuenow="0"],
.oui-progress__bar[aria-valuenow="0"] {
background: transparent;
box-shadow: none;
color: gray; }
.progress-dots,
.oui-progress-dots {
display: inline-block; }
.progress-dots li,
.oui-progress-dots li {
opacity: 0;
display: inline-block;
width: 7px;
height: 7px;
margin: 0 3px;
border-radius: 50%;
background: #4069FF;
animation: progress-pulse 2s infinite; }
.progress-dots li:nth-child(2),
.oui-progress-dots li:nth-child(2) {
animation-delay: 0.2s; }
.progress-dots li:nth-child(3),
.oui-progress-dots li:nth-child(3) {
animation-delay: 0.4s; }
.progress-dots--reverse li,
.oui-progress-dots--reverse li {
background: #FFFFFF; }
.progress-dots--small li,
.oui-progress-dots--small li {
width: 4px;
height: 4px;
margin: 0 1px; }
@keyframes progress-pulse {
0% {
opacity: 0; }
50% {
opacity: 1; }
100% {
opacity: 0; } }
.oui-rangeslider input[type="range"] {
-webkit-appearance: none;
height: 50px;
background: transparent; }
.oui-rangeslider input[type="range"]:focus {
outline: none; }
.oui-rangeslider input[type="range"]::-webkit-slider-runnable-track {
position: relative;
top: 16px; }
.oui-rangeslider input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
border: 4px solid white;
cursor: pointer;
margin-top: -0.3em;
width: 24px;
height: 24px;
background: white;
background-size: 100%;
background-image: linear-gradient(rgba(0, 0, 0, 0.13), rgba(255, 255, 255, 0));
box-shadow: 0 0 4px rgba(110, 110, 110, 0.8), 0 0 2px rgba(0, 0, 0, 0.3);
border-radius: 50%; }
.oui-rangeslider input[type="range"]:focus::-webkit-slider-thumb {
box-shadow: 0 0 8px rgba(0, 116, 180, 0.9); }
.oui-rangeslider .range-display {
height: 35px;
background-image: url('data:image/svg+xml;utf-8,');
background-size: 100% 100%;
background-repeat: no-repeat;
position: absolute;
left: 12px;
right: 11px; }
.oui-rangeslider.oui-rangeslider--disabled .range-display {
filter: grayscale(1) opacity(0.3); }
.oui-rangeslider.oui-rangeslider--disabled .range-grid .gridline, .oui-rangeslider.oui-rangeslider--disabled .range-labels {
opacity: 0.5; }
.oui-rangeslider .range-display.range-display-overlay {
background-color: white;
background-image: none;
left: 50%;
opacity: 0.9;
right: 0; }
.oui-rangeslider .range-display.range-display-overlay::after {
display: none; }
.oui-rangeslider .range-display::after {
content: '';
position: absolute;
left: 0;
right: 0px;
height: 8px;
background-color: #FFFFFF;
border: 1px solid #bfbfbf;
bottom: -8px;
border-bottom-left-radius: 100px;
border-bottom-right-radius: 100px;
border-top: none;
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2) inset; }
.oui-rangeslider .range-grid {
position: absolute;
width: calc(100% - 24px);
margin-left: 12px;
height: 38px;
top: 20px; }
.oui-rangeslider .range-grid .gridline {
background-color: #bfbfbf;
opacity: 1;
position: absolute;
left: 0px;
right: 0px;
width: 1px;
height: 95%;
bottom: 0px; }
.oui-rangeslider .range-grid .gridline.gridline-half {
left: 0px;
right: 0px;
width: 1px;
height: 50%; }
.oui-rangeslider .range-grid .gridline.grid-2 {
left: 25%; }
.oui-rangeslider .range-grid .gridline.grid-3 {
left: 50%; }
.oui-rangeslider .range-grid .gridline.grid-4 {
left: 75%; }
.oui-rangeslider .range-grid .gridline.grid-5 {
left: 100%; }
.oui-rangeslider .range-grid .gridline.grid-h1 {
left: 12.5%; }
.oui-rangeslider .range-grid .gridline.grid-h2 {
left: 37.5%; }
.oui-rangeslider .range-grid .gridline.grid-h3 {
left: 62.5%; }
.oui-rangeslider .range-grid .gridline.grid-h4 {
left: 87.5%; }
.search {
position: relative; }
.search .icon {
transform: translateY(-50%);
position: absolute;
top: 50%;
right: 10px;
cursor: pointer;
display: none; }
.text-input--search,
.oui-text-input--search {
padding-left: 30px;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-position: left 8px center;
background-size: 16px 16px; }
.search--active .icon {
display: block; }
.oui-sidebar {
transition: all 0.3s;
top: 0;
z-index: 99; }
.sortable__drag-placeholder,
.oui-sortable__drag-placeholder {
border: 2px dashed #c7c7c7 !important; }
.sortable__drag-placeholder *,
.oui-sortable__drag-placeholder * {
opacity: 0.0; }
.sortable__group,
.oui-sortable__group {
border-top: 1px solid #f0f0f0; }
.sortable__group__handle,
.oui-sortable__group__handle {
transform: rotate(90deg);
color: #c7c7c7;
box-sizing: content-box; }
.sortable__drag-preview,
.oui-sortable__drag-preview {
left: 0;
top: 0;
z-index: 9999; }
.overlay,
.oui-overlay {
display: flex;
justify-content: center;
align-items: center;
background: rgba(255, 255, 255, 0.6);
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
justify-content: center;
align-items: center; }
@keyframes spin-animate {
100% {
transform: rotate(360deg); } }
.spinner,
.oui-spinner {
animation: spin-animate 800ms infinite linear;
width: 40px;
height: 40px;
border: 4px solid #d9e1ff;
display: inline-block;
border-radius: 50%;
position: relative; }
.spinner::before,
.oui-spinner::before {
content: '';
width: 40px;
height: 40px;
border-radius: 50%;
display: block;
position: absolute;
left: -4px;
top: -4px;
border-width: 4px;
border-style: solid;
border-right-color: #d9e1ff;
border-top-color: #d9e1ff;
border-left-color: #4069FF;
border-bottom-color: #d9e1ff; }
.spinner--small, .spinner--small::before,
.oui-spinner--small,
.oui-spinner--small::before {
width: 26px;
height: 26px;
border-width: 3px;
left: -3px;
top: -3px; }
.spinner--tiny, .spinner--tiny::before,
.oui-spinner--tiny,
.oui-spinner--tiny::before {
width: 16px;
height: 16px;
border-width: 2px;
left: -2px;
top: -2px; }
.stat-group {
display: flex; }
.stat {
margin-right: 10px; }
.steps,
.oui-steps {
display: flex;
justify-content: center;
margin-left: auto;
margin-right: auto; }
.steps__dot,
.oui-steps__dot {
transform: translateX(-50%);
transition: all 0.3s;
position: absolute;
width: 16px;
height: 16px;
top: -7px;
left: 50%;
border-radius: 50%;
border: 3px solid #e0e0e0;
background: #FFFFFF;
z-index: 1; }
.steps__label,
.oui-steps__label {
text-align: center;
font-weight: 400;
color: #83839B; }
.steps__item,
.oui-steps__item {
flex: 1;
padding-top: 20px;
position: relative; }
.steps__item::before,
.oui-steps__item::before {
content: '';
height: 3px;
background: #e0e0e0;
width: 100%;
position: absolute;
top: 0;
right: 50%; }
.steps__item--active::before,
.oui-steps__item--active::before {
background: #4069FF; }
.steps__item--active .steps__dot,
.steps__item--active .oui-steps__dot,
.oui-steps__item--active .steps__dot,
.oui-steps__item--active .oui-steps__dot {
border-color: #4069FF; }
.steps__item--active .steps__label,
.steps__item--active .oui-steps__label,
.oui-steps__item--active .steps__label,
.oui-steps__item--active .oui-steps__label {
color: #4069FF; }
.steps__item--complete::before,
.oui-steps__item--complete::before {
background: #4069FF; }
.steps__item--complete .steps__dot,
.steps__item--complete .oui-steps__dot,
.oui-steps__item--complete .steps__dot,
.oui-steps__item--complete .oui-steps__dot {
background: #4069FF;
border-color: #4069FF; }
.steps__item--editable:hover,
.oui-steps__item--editable:hover {
cursor: pointer; }
.steps__item--editable:hover .steps__dot,
.steps__item--editable:hover .oui-steps__dot,
.oui-steps__item--editable:hover .steps__dot,
.oui-steps__item--editable:hover .oui-steps__dot {
border-color: #7391ff; }
.steps__item--editable:hover .steps__label,
.steps__item--editable:hover .oui-steps__label,
.oui-steps__item--editable:hover .steps__label,
.oui-steps__item--editable:hover .oui-steps__label {
color: #7391ff; }
.steps__item--editable:hover.oui-steps__item--complete .steps__dot,
.steps__item--editable:hover.oui-steps__item--complete .oui-steps__dot,
.oui-steps__item--editable:hover.oui-steps__item--complete .steps__dot,
.oui-steps__item--editable:hover.oui-steps__item--complete .oui-steps__dot {
background: #7391ff; }
.steps__item:first-child::before,
.oui-steps__item:first-child::before {
display: none; }
/* don't hide input from screen-readers and keyboard access */
.oui-switch {
position: absolute;
opacity: 0;
z-index: 3; }
.oui-switch:checked ~ span a {
right: 0%; }
.oui-switch + label {
font-size: 1em;
line-height: 1;
width: 4.3rem;
height: 2.3rem;
background-color: #E8E8E8;
background-image: none;
border-radius: 2rem;
padding: 0.1666666667rem;
cursor: pointer;
display: inline-block;
text-align: center;
position: relative;
-webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2) inset;
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2) inset;
font-family: inherit;
-webkit-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
-webkit-user-select: none;
border: 2px solid white; }
/* Label */
.oui-switch + label:before {
color: #888;
content: attr(data-off-label);
display: block;
font-family: inherit;
font-family: FontAwesome, inherit;
font-weight: 900;
font-size: 0.85rem;
line-height: 1.74rem;
position: absolute;
right: 0.2166666667rem;
margin: 0.2166666667rem;
top: 0;
text-align: center;
min-width: 1.6666666667rem;
overflow: hidden;
-webkit-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out; }
/* Slider */
.oui-switch + label:after {
content: '';
position: absolute;
left: 0.1666666667rem;
background-color: #f7f7f7;
-webkit-box-shadow: none;
box-shadow: none;
border-radius: 2rem;
height: 1.6666666667rem;
width: 1.6666666667rem;
-webkit-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out; }
.oui-switch:checked + label {
background-color: #4069FF; }
.oui-switch:checked + label:before {
color: #fff;
content: attr(data-on-label);
right: auto;
left: 0.2166666667rem; }
.oui-switch:checked + label:after {
left: 2.1666666667rem;
background-color: #f7f7f7;
-webkit-box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, 0.3);
box-shadow: 1px 1px 10px 0 rgba(0, 0, 0, 0.3); }
.oui-switch:focus + label, .oui-switch:active + label {
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2) inset, 0 0 0 1px var(--light-blue-25) !important; }
.oui-switch--disabled + label {
opacity: 0.4;
pointer-events: none; }
.oui-switch--disabled:checked + label {
opacity: 0.2; }
.tabs-nav,
.oui-tabs-nav {
display: flex;
border-bottom: 1px solid #f0f0f0; }
.tabs-nav__item,
.oui-tabs-nav__item {
position: relative;
text-align: center;
padding: 10px 15px;
border: 1px solid #e0e0e0;
border-right: 0;
border-bottom: 0;
color: var(--dark-blue-75);
font-weight: 400;
background-color: #FFFFFF;
cursor: pointer; }
.tabs-nav__item.link--muted,
.oui-tabs-nav__item.link--muted {
color: inherit; }
.tabs-nav__item:first-child,
.oui-tabs-nav__item:first-child {
border-top-left-radius: 8px; }
.tabs-nav__item:last-child,
.oui-tabs-nav__item:last-child {
border-top-right-radius: 8px;
border-right: 1px solid #e0e0e0; }
.tabs-nav__item:hover,
.oui-tabs-nav__item:hover {
color: var(--light-blue-75); }
.tabs-nav__item.is-active,
.oui-tabs-nav__item.is-active {
background-color: #FFFFFF;
cursor: default; }
.tabs-nav__item.is-active::after,
.oui-tabs-nav__item.is-active::after {
content: '';
display: block;
height: 3px;
background: var(--light-blue-75);
position: absolute;
left: 0;
right: 0;
bottom: -3px; }
.oui-tabs--left-pad .tabs-nav,
.oui-tabs--left-pad .oui-tabs-nav {
padding-left: 25px; }
.oui-tabs--plain .tabs-nav__item,
.oui-tabs--plain .oui-tabs-nav__item {
background-color: transparent;
border: 0; }
.tabs--small .tabs-nav,
.tabs--small .oui-tabs-nav,
.oui-tabs--small .tabs-nav,
.oui-tabs--small .oui-tabs-nav {
border-width: 1px; }
.tabs--small .tabs-nav__item,
.tabs--small .oui-tabs-nav__item,
.oui-tabs--small .tabs-nav__item,
.oui-tabs--small .oui-tabs-nav__item {
background-color: transparent;
padding: 5px 10px;
font-size: 11.5px;
letter-spacing: -0.3px; }
.tabs--small .tabs-nav__item.is-active::after,
.tabs--small .oui-tabs-nav__item.is-active::after,
.oui-tabs--small .tabs-nav__item.is-active::after,
.oui-tabs--small .oui-tabs-nav__item.is-active::after {
height: 1px;
bottom: -1px; }
.tabs--center .tabs-nav,
.tabs--center .oui-tabs-nav,
.oui-tabs--center .tabs-nav,
.oui-tabs--center .oui-tabs-nav {
justify-content: center; }
.tabs--center .tabs-nav__item:first-child,
.tabs--center .oui-tabs-nav__item:first-child,
.oui-tabs--center .tabs-nav__item:first-child,
.oui-tabs--center .oui-tabs-nav__item:first-child {
margin-left: 5px; }
.tabs--sub .tabs-nav__item,
.tabs--sub .oui-tabs-nav__item,
.oui-tabs--sub .tabs-nav__item,
.oui-tabs--sub .oui-tabs-nav__item {
border: 0; }
.tabs--sub .tabs-nav__item.is-active::after,
.tabs--sub .oui-tabs-nav__item.is-active::after,
.oui-tabs--sub .tabs-nav__item.is-active::after,
.oui-tabs--sub .oui-tabs-nav__item.is-active::after {
height: 2px;
bottom: -1px; }
.tabs--sub .tabs-nav__item.tab-disabled,
.tabs--sub .oui-tabs-nav__item.tab-disabled,
.oui-tabs--sub .tabs-nav__item.tab-disabled,
.oui-tabs--sub .oui-tabs-nav__item.tab-disabled {
cursor: default; }
.oui-tabs--header .tabs-nav__item.is-active::after,
.oui-tabs--header .oui-tabs-nav__item.is-active::after {
height: 1px;
bottom: -1px; }
.oui-tabs--header .tabs-nav__item.tab-disabled,
.oui-tabs--header .oui-tabs-nav__item.tab-disabled {
cursor: default; }
.tabs-pane__item,
.oui-tabs-pane__item {
display: none; }
.tabs-pane__item.is-active,
.oui-tabs-pane__item.is-active {
display: block; }
.dashboard-tabs,
.oui-tabs--dashboard {
margin-left: -40px;
margin-right: -40px; }
.dashboard-tabs--half,
.oui-tabs--dashboard--half {
margin-left: -20px;
margin-right: -20px; }
.dashboard-tabs .tabs-nav__item,
.dashboard-tabs .oui-tabs-nav__item,
.oui-tabs--dashboard .tabs-nav__item,
.oui-tabs--dashboard .oui-tabs-nav__item {
padding-top: 8px;
border: none;
background: none; }
.dashboard-tabs .tabs-nav__item:first-child,
.dashboard-tabs .oui-tabs-nav__item:first-child,
.oui-tabs--dashboard .tabs-nav__item:first-child,
.oui-tabs--dashboard .oui-tabs-nav__item:first-child {
margin-left: 25px; }
.textarea,
.oui-textarea {
transition: border-color 0.3s;
width: 100%;
border: 1px solid #e0e0e0;
border-radius: 5px;
padding: 7px;
vertical-align: middle;
line-height: 1.3;
height: 62px;
resize: vertical; }
.textarea:hover,
.oui-textarea:hover {
border-color: #999999; }
.textarea:focus,
.oui-textarea:focus {
border-color: #BFCDFF; }
.textarea[disabled],
.oui-textarea[disabled] {
background-color: #FFFFFF;
color: #999999;
cursor: default; }
.textarea[disabled]:hover, .textarea[disabled]:focus,
.oui-textarea[disabled]:hover,
.oui-textarea[disabled]:focus {
border-color: #e0e0e0; }
.textarea--tall,
.oui-textarea--tall {
height: 100px; }
.textarea--small,
.oui-textarea--small {
padding-top: 2px;
padding-bottom: 2px; }
.textarea--disabled,
.oui-textarea--disabled {
padding-top: 2px;
padding-bottom: 2px; }
.token-wrap,
.oui-token-wrap {
display: inline-flex;
padding: 4px; }
.token-wrap--well,
.oui-token-wrap--well {
background: #f0f0f0;
border-radius: 5px;
border: 1px solid #e0e0e0; }
.token-wrap--snug,
.oui-token-wrap--snug {
display: inline-flex;
padding: 2px; }
.token,
.oui-token {
display: inline-flex;
align-items: flex-start;
color: #FFFFFF;
line-height: 1;
padding: 5px 10px;
border-radius: 5px;
text-shadow: 0 0 1px rgba(0, 0, 0, 0.2); }
.token--primary,
.oui-token--primary {
background: #33A5FF; }
.token--secondary,
.oui-token--secondary {
background: #999999; }
.token--tertiary,
.oui-token--tertiary {
background: #E8E8E8; }
.token--error,
.oui-token--error {
background: #FF5B5B; }
.token--font-dark,
.oui-token--font-dark {
color: #080738; }
.token--font-light,
.oui-token--font-light {
color: #FFFFFF; }
.token-tool,
.oui-token-tool {
display: flex;
align-items: center;
cursor: move;
flex: none;
min-width: 0;
min-height: 0;
padding-left: 8px; }
.token__number,
.oui-token__number {
color: #bfbfbf;
font-size: 13px;
min-width: 10px; }
.token__move,
.oui-token__move {
transform: rotate(90deg);
color: #c7c7c7; }
.token__description,
.oui-token__description {
font-size: 11px;
margin-top: 5px; }
.token__close,
.oui-token__close {
color: #FFFFFF;
height: 12px;
width: 12px; }
.toolbar {
z-index: 1; }
.toolbar__left {
display: flex; }
.toolbar__left .toolbar__button[disabled], .toolbar__left .toolbar__button.toolbar__button--disabled, .toolbar__left .toolbar__button:not(:hover):not(:active):not(.is-active) {
border-right: 1px solid transparent; }
.toolbar__right {
display: flex;
margin-left: auto !important; }
.toolbar__right .toolbar__button[disabled], .toolbar__right .toolbar__button.toolbar__button--disabled, .toolbar__right .toolbar__button:not(:hover):not(:active):not(.is-active) {
border-left: 1px solid transparent; }
.toolbar__content {
flex: none;
min-width: 0;
min-height: 0;
display: flex;
align-items: center;
padding: 5px 10px;
border-bottom: 1px solid var(--grey-50);
position: relative;
background: var(--white); }
.toolbar__content:after {
content: '';
display: block;
height: 2px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
z-index: -1;
width: 100%;
position: absolute;
bottom: 0;
left: 0; }
.toolbar__button-group {
display: flex; }
.toolbar__button-group .toolbar__button {
margin-right: 10px; }
.toolbar__button-group .toolbar__button:last-child {
margin-right: 0; }
.toolbar__button {
background-color: transparent;
border-color: transparent;
border: 1px solid transparent; }
.toolbar__button:not(.is-active):hover {
color: var(--light-blue-75) !important;
border: 1px solid var(--light-blue-25);
box-shadow: none;
background-color: var(--white); }
.toolbar__button[disabled], .toolbar__button--disabled, .toolbar__button--disabled:hover {
box-shadow: none;
border-color: transparent !important;
background: none; }
.toolbar--icon {
width: 24px;
height: 24px; }
.background--white {
background-color: #FFFFFF !important; }
.background--faint {
background-color: #FFFFFF !important; }
.background--light {
background-color: #f0f0f0 !important; }
.background--muted {
background-color: #a6a6a6 !important; }
.background--medium {
background-color: gray !important; }
.background--charcoal {
background-color: #383838 !important; }
.background--brand {
background-color: #4069FF !important; }
.background--brand-dark {
background-color: #46456A !important; }
.background--warning {
background-color: #fff6d6 !important; }
.background--bad-news {
background-color: #ffdede !important; }
.background--good-news {
background-color: #d6f5e4 !important; }
.background--live {
background-color: #33CF76 !important; }
.background--draft {
background-color: #FF9C33 !important; }
.background--current-color {
background-color: currentColor !important; }
.background--none {
background-color: none !important; }
body:target *[data-oui-component],
.highlight-react--oui *[data-oui-component],
.highlight-react--oui[data-oui-component] {
outline: 2px solid hotpink; }
body:target *[data-oui-component] body:target *[data-oui-component],
.highlight-react--oui *[data-oui-component] body:target *[data-oui-component],
.highlight-react--oui[data-oui-component] body:target *[data-oui-component], body:target *[data-oui-component]
.highlight-react--oui *[data-oui-component],
.highlight-react--oui *[data-oui-component]
.highlight-react--oui *[data-oui-component],
.highlight-react--oui[data-oui-component]
.highlight-react--oui *[data-oui-component], body:target *[data-oui-component]
.highlight-react--oui[data-oui-component],
.highlight-react--oui *[data-oui-component]
.highlight-react--oui[data-oui-component],
.highlight-react--oui[data-oui-component]
.highlight-react--oui[data-oui-component] {
outline-width: 1px; }
.border--all {
border: 1px solid #e0e0e0 !important; }
.oui-disclose-table--row__toggle.is-active,
.border--ends,
.border--top {
border-top: 1px solid #e0e0e0 !important; }
.oui-disclose-table--row__content,
.border--ends,
.border--bottom {
border-bottom: 1px solid #e0e0e0 !important; }
.oui-disclose-table--row__toggle.is-active, .oui-disclose-table--row__content,
.border--sides,
.border--left {
border-left: 1px solid #e0e0e0 !important; }
.oui-disclose-table--row__toggle.is-active, .oui-disclose-table--row__content,
.border--sides,
.border--right {
border-right: 1px solid #e0e0e0 !important; }
.no-border {
border: 0 !important; }
.no-border--top {
border-top: none !important; }
.no-border--right {
border-right: none !important; }
.no-border--bottom {
border-bottom: none !important; }
.no-border--left {
border-left: none !important; }
:root {
--wide-shadow: 0 1px 3px rgba(0,0,0,0.10), 0 1px 2px rgba(0,0,0,0.17);
--border-radius: 5px;
--highlight: var(--light-blue-6);
--ron-project-badge: #7b81d1;
--white: #FFFFFF; }
:root {
--light-blue-100: #0037FF;
--light-blue-75: #4069FF;
--light-blue-50: #809BFF;
--light-blue-25: #BFCDFF;
--light-blue-10: #EAEDFA;
--light-blue-6: #F3F6FF;
--dark-blue-75: #46456A;
--gold: #FFD233;
--red: #FF5B5B;
--green: #33CF76;
--indigo: #8354FF;
--cyan: #33D4FF;
--blue: #33A5FF;
--orange: #FF9C33;
--dark-blue-100: #080738;
--dark-blue-50: #83839B;
--dark-blue-25: #C1C1CD;
--grey-50: #E8E8E8;
--grey-25: #F9F9F9;
--paper: #FDFDFD;
--white-40b: #999999; }
.background--light-blue-100 {
background-color: #0037FF;
color: white; }
.background--light-blue-75 {
background-color: #4069FF;
color: white; }
.background--light-blue-50 {
background-color: #809BFF;
color: white; }
.background--light-blue-25 {
background-color: #BFCDFF;
color: white; }
.background--light-blue-10 {
background-color: #EAEDFA;
color: white; }
.background--light-blue-6 {
background-color: #F3F6FF;
color: white; }
.background--dark-blue-75 {
background-color: #46456A;
color: white; }
.background--gold {
background-color: #FFD233;
color: white; }
.background--red {
background-color: #FF5B5B;
color: white; }
.background--green {
background-color: #33CF76;
color: white; }
.background--indigo {
background-color: #8354FF;
color: white; }
.background--cyan {
background-color: #33D4FF;
color: white; }
.background--blue {
background-color: #33A5FF;
color: white; }
.background--orange {
background-color: #FF9C33;
color: white; }
.background--dark-blue-100 {
background-color: #080738;
color: white; }
.background--dark-blue-50 {
background-color: #83839B;
color: white; }
.background--dark-blue-25 {
background-color: #C1C1CD;
color: white; }
.background--grey-50 {
background-color: #E8E8E8;
color: white; }
.background--grey-25 {
background-color: #F9F9F9;
color: white; }
.background--paper {
background-color: #FDFDFD;
color: white; }
.background--white-40b {
background-color: #999999;
color: white; }
.color--light-blue-100 {
color: #0037FF; }
.color--light-blue-75 {
color: #4069FF; }
.color--light-blue-50 {
color: #809BFF; }
.color--light-blue-25 {
color: #BFCDFF; }
.color--light-blue-10 {
color: #EAEDFA; }
.color--light-blue-6 {
color: #F3F6FF; }
.color--dark-blue-75 {
color: #46456A; }
.color--gold {
color: #FFD233; }
.color--red {
color: #FF5B5B; }
.color--green {
color: #33CF76; }
.color--indigo {
color: #8354FF; }
.color--cyan {
color: #33D4FF; }
.color--blue {
color: #33A5FF; }
.color--orange {
color: #FF9C33; }
.color--dark-blue-100 {
color: #080738; }
.color--dark-blue-50 {
color: #83839B; }
.color--dark-blue-25 {
color: #C1C1CD; }
.color--grey-50 {
color: #E8E8E8; }
.color--grey-25 {
color: #F9F9F9; }
.color--paper {
color: #FDFDFD; }
.color--white-40b {
color: #999999; }
.float--right {
float: right !important; }
.float--left {
float: left !important; }
.float--none {
float: none !important; }
.anchor--middle {
margin-right: auto !important;
margin-left: auto !important; }
.anchor--right {
margin-left: auto !important; }
.anchor--left {
margin-right: auto !important; }
.anchor--top {
margin-bottom: auto !important; }
.anchor--bottom {
margin-top: auto !important; }
.text--left {
text-align: left !important; }
.text--center,
.oui-text--center {
text-align: center !important; }
.text--right {
text-align: right !important; }
.display--block {
display: block !important; }
.display--inline-block {
display: inline-block !important; }
.display--inline {
display: inline !important; }
.display--none {
display: none !important; }
.faded {
opacity: 0.5 !important; }
.vertical-align--top {
vertical-align: top !important; }
.vertical-align--middle {
vertical-align: middle !important; }
.vertical-align--bottom {
vertical-align: bottom !important; }
.vertical-align--text-top {
vertical-align: text-top !important; }
.overflow--hidden {
overflow: hidden !important; }
.overflow-x--auto {
overflow-x: auto !important; }
.overflow-y--auto {
overflow-y: auto !important; }
.overflow-y--scroll {
overflow-y: scroll !important; }
.max-scroll--small {
max-height: 100px !important;
overflow-y: auto !important; }
.max-scroll--medium {
max-height: 200px !important;
overflow-y: auto !important; }
.max-scroll--large {
max-height: 300px !important;
overflow-y: auto !important; }
.max-width--large {
max-width: 800px !important; }
.cursor--auto {
cursor: auto !important; }
.cursor--default {
cursor: default !important; }
.cursor--help {
cursor: help !important; }
.cursor--move {
cursor: move !important; }
.cursor--pointer {
cursor: pointer !important; }
.cursor--text {
cursor: text !important; }
.pointer-events--none {
pointer-events: none !important; }
.no-resize {
resize: none !important; }
.position--relative {
position: relative !important; }
.position--absolute {
position: absolute !important; }
.position--fixed {
position: fixed !important; }
.visibility--hidden {
visibility: hidden !important; }
.unselectable {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none; }
.push {
margin: 10px !important; }
.push--top {
margin-top: 10px !important; }
.push--right {
margin-right: 10px !important; }
.push--bottom {
margin-bottom: 10px !important; }
.push--left {
margin-left: 10px !important; }
.push--ends {
margin-top: 10px !important;
margin-bottom: 10px !important; }
.push--sides {
margin-right: 10px !important;
margin-left: 10px !important; }
.push-half {
margin: 5px !important; }
.push-half--top {
margin-top: 5px !important; }
.push-half--right {
margin-right: 5px !important; }
.push-half--bottom {
margin-bottom: 5px !important; }
.push-half--left {
margin-left: 5px !important; }
.push-half--ends {
margin-top: 5px !important;
margin-bottom: 5px !important; }
.push-half--sides {
margin-right: 5px !important;
margin-left: 5px !important; }
.push-double {
margin: 20px !important; }
.push-double--top {
margin-top: 20px !important; }
.push-double--right {
margin-right: 20px !important; }
.push-double--bottom {
margin-bottom: 20px !important; }
.push-double--left {
margin-left: 20px !important; }
.push-double--ends {
margin-top: 20px !important;
margin-bottom: 20px !important; }
.push-double--sides {
margin-right: 20px !important;
margin-left: 20px !important; }
.push-triple {
margin: 30px !important; }
.push-triple--top {
margin-top: 30px !important; }
.push-triple--right {
margin-right: 30px !important; }
.push-triple--bottom {
margin-bottom: 30px !important; }
.push-triple--left {
margin-left: 30px !important; }
.push-triple--ends {
margin-top: 30px !important;
margin-bottom: 30px !important; }
.push-triple--sides {
margin-right: 30px !important;
margin-left: 30px !important; }
.push-quad {
margin: 40px !important; }
.push-quad--top {
margin-top: 40px !important; }
.push-quad--right {
margin-right: 40px !important; }
.push-quad--bottom {
margin-bottom: 40px !important; }
.push-quad--left {
margin-left: 40px !important; }
.push-quad--ends {
margin-top: 40px !important;
margin-bottom: 40px !important; }
.push-quad--sides {
margin-right: 40px !important;
margin-left: 40px !important; }
.flush {
margin: 0 !important; }
.flush--top {
margin-top: 0 !important; }
.flush--right {
margin-right: 0 !important; }
.flush--bottom {
margin-bottom: 0 !important; }
.flush--left {
margin-left: 0 !important; }
.flush--ends {
margin-top: 0 !important;
margin-bottom: 0 !important; }
.flush--sides {
margin-right: 0 !important;
margin-left: 0 !important; }
.form-fields > *:last-child, .oui-form-fields > *:last-child, .island > *:last-child, .attention > *:last-child, .oui-attention > *:last-child, .dialog__body > *:last-child, .oui-dialog__body > *:last-child, .disclose > *:last-child, .oui-disclose > *:last-child, .oui-disclose-table--row__toggle > *:last-child, .media__body > *:last-child, .pop--over__content > *:last-child, .oui-pop--over__content > *:last-child,
.form-fields > *:last-child > *:last-child,
.oui-form-fields > *:last-child > *:last-child,
.island > *:last-child > *:last-child,
.attention > *:last-child > *:last-child,
.oui-attention > *:last-child > *:last-child,
.dialog__body > *:last-child > *:last-child,
.oui-dialog__body > *:last-child > *:last-child,
.disclose > *:last-child > *:last-child,
.oui-disclose > *:last-child > *:last-child,
.oui-disclose-table--row__toggle > *:last-child > *:last-child,
.media__body > *:last-child > *:last-child,
.pop--over__content > *:last-child > *:last-child,
.oui-pop--over__content > *:last-child > *:last-child,
.form-fields > *:last-child > *:last-child > *:last-child,
.oui-form-fields > *:last-child > *:last-child > *:last-child,
.island > *:last-child > *:last-child > *:last-child,
.attention > *:last-child > *:last-child > *:last-child,
.oui-attention > *:last-child > *:last-child > *:last-child,
.dialog__body > *:last-child > *:last-child > *:last-child,
.oui-dialog__body > *:last-child > *:last-child > *:last-child,
.disclose > *:last-child > *:last-child > *:last-child,
.oui-disclose > *:last-child > *:last-child > *:last-child,
.oui-disclose-table--row__toggle > *:last-child > *:last-child > *:last-child,
.media__body > *:last-child > *:last-child > *:last-child,
.pop--over__content > *:last-child > *:last-child > *:last-child,
.oui-pop--over__content > *:last-child > *:last-child > *:last-child {
margin-bottom: 0; }
.soft {
padding: 10px !important; }
.soft--top {
padding-top: 10px !important; }
.soft--right {
padding-right: 10px !important; }
.soft--bottom {
padding-bottom: 10px !important; }
.soft--left {
padding-left: 10px !important; }
.soft--ends {
padding-top: 10px !important;
padding-bottom: 10px !important; }
.soft--sides {
padding-right: 10px !important;
padding-left: 10px !important; }
.soft-half {
padding: 5px !important; }
.soft-half--top {
padding-top: 5px !important; }
.soft-half--right {
padding-right: 5px !important; }
.soft-half--bottom {
padding-bottom: 5px !important; }
.soft-half--left {
padding-left: 5px !important; }
.soft-half--ends {
padding-top: 5px !important;
padding-bottom: 5px !important; }
.soft-half--sides {
padding-right: 5px !important;
padding-left: 5px !important; }
.soft-one-and-half--sides {
padding-right: 15px !important;
padding-left: 15px !important; }
.soft-double {
padding: 20px !important; }
.soft-double--top {
padding-top: 20px !important; }
.soft-double--right {
padding-right: 20px !important; }
.soft-double--bottom {
padding-bottom: 20px !important; }
.soft-double--left {
padding-left: 20px !important; }
.soft-double--ends {
padding-top: 20px !important;
padding-bottom: 20px !important; }
.soft-double--sides {
padding-right: 20px !important;
padding-left: 20px !important; }
.soft-triple {
padding: 30px !important; }
.soft-triple--top {
padding-top: 30px !important; }
.soft-triple--right {
padding-right: 30px !important; }
.soft-triple--bottom {
padding-bottom: 30px !important; }
.soft-triple--left {
padding-left: 30px !important; }
.soft-triple--ends {
padding-top: 30px !important;
padding-bottom: 30px !important; }
.soft-triple--sides {
padding-right: 30px !important;
padding-left: 30px !important; }
.soft-quad {
padding: 40px !important; }
.soft-quad--top {
padding-top: 40px !important; }
.soft-quad--right {
padding-right: 40px !important; }
.soft-quad--bottom {
padding-bottom: 40px !important; }
.soft-quad--left {
padding-left: 40px !important; }
.soft-quad--ends {
padding-top: 40px !important;
padding-bottom: 40px !important; }
.soft-quad--sides {
padding-right: 40px !important;
padding-left: 40px !important; }
.hard {
padding: 0 !important; }
.hard--top {
padding-top: 0 !important; }
.hard--right {
padding-right: 0 !important; }
.hard--bottom {
padding-bottom: 0 !important; }
.hard--left {
padding-left: 0 !important; }
.hard--ends {
padding-top: 0 !important;
padding-bottom: 0 !important; }
.hard--sides {
padding-right: 0 !important;
padding-left: 0 !important; }
.color--base {
color: #080738 !important; }
.color--brand {
color: #4069FF !important; }
.color--good-news {
color: #29a65e !important; }
.color--warning {
color: #FFD233 !important; }
.color--bad-news {
color: #FF5B5B !important; }
.color--charcoal {
color: #383838 !important; }
.color--draft {
color: #FF9C33 !important; }
.color--live {
color: #33CF76 !important; }
.weight--light {
font-weight: 300 !important; }
.weight--normal {
font-weight: 400 !important; }
.weight--bold {
font-weight: 500 !important; }
.style--italic {
font-style: italic !important; }
.style--normal {
font-style: normal !important; }
.underline {
text-decoration: underline !important; }
.strike {
text-decoration: line-through !important; }
.reverse {
color: #FFFFFF !important; }
.muted {
color: #83839B !important; }
.faint {
color: #e0e0e0 !important; }
.proceed {
text-align: right !important; }
.truncate {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; }
.go::after {
content: '\A0' '\BB' !important; }
.caps {
text-transform: uppercase !important; }
.force-break {
word-wrap: break-word !important; }
.nowrap {
white-space: nowrap !important; }
.wrap-text {
white-space: normal !important; }
.text--block {
display: block !important; }
.text--inline {
display: inline !important; }
.line--tight {
line-height: 1.4 !important; }
.line--loose {
line-height: 1.8 !important; }
.line--1 {
line-height: 1 !important; }
.word-break {
word-break: break-all !important; }
.width--1-1 {
width: 100% !important; }
.width--2-4, .width--3-6, .width--4-8, .width--5-10, .width--6-12,
.width--1-2 {
width: 50% !important; }
.width--2-6, .width--4-12,
.width--1-3 {
width: 33.333% !important; }
.width--4-6, .width--8-12,
.width--2-3 {
width: 66.666% !important; }
.width--2-8, .width--3-12,
.width--1-4 {
width: 25% !important; }
.width--6-8, .width--9-12,
.width--3-4 {
width: 75% !important; }
.width--2-10,
.width--1-5 {
width: 20% !important; }
.width--4-10,
.width--2-5 {
width: 40% !important; }
.width--6-10,
.width--3-5 {
width: 60% !important; }
.width--8-10,
.width--4-5 {
width: 80% !important; }
.width--2-12,
.width--1-6 {
width: 16.666% !important; }
.width--10-12,
.width--5-6 {
width: 83.333% !important; }
.width--1-8 {
width: 12.5% !important; }
.width--3-8 {
width: 37.5% !important; }
.width--5-8 {
width: 62.5% !important; }
.width--7-8 {
width: 87.5% !important; }
.width--1-10 {
width: 10% !important; }
.width--3-10 {
width: 30% !important; }
.width--7-10 {
width: 70% !important; }
.width--9-10 {
width: 90% !important; }
.width--1-12 {
width: 8.333% !important; }
.width--5-12 {
width: 41.666% !important; }
.width--7-12 {
width: 58.333% !important; }
.width--11-12 {
width: 91.666% !important; }
.width--50 {
width: 50px !important;
-ms-flex-preferred-size: 50px !important; }
.width--75 {
width: 75px !important;
-ms-flex-preferred-size: 75px !important; }
.width--100 {
width: 100px !important;
-ms-flex-preferred-size: 100px !important; }
.width--150 {
width: 150px !important;
-ms-flex-preferred-size: 150px !important; }
.width--200 {
width: 200px !important;
-ms-flex-preferred-size: 200px !important; }
.width--250 {
width: 250px !important;
-ms-flex-preferred-size: 250px !important; }
.width--300 {
width: 300px !important;
-ms-flex-preferred-size: 300px !important; }
.max-width--50 {
max-width: 50px !important; }
.max-width--75 {
max-width: 75px !important; }
.max-width--100 {
max-width: 100px !important; }
.max-width--150 {
max-width: 150px !important; }
.max-width--200 {
max-width: 200px !important; }
.max-width--250 {
max-width: 250px !important; }
.max-width--300 {
max-width: 300px !important; }
.min-width--50 {
min-width: 50px !important; }
.min-width--75 {
min-width: 75px !important; }
.min-width--100 {
min-width: 100px !important; }
.min-width--150 {
min-width: 150px !important; }
.min-width--200 {
min-width: 200px !important; }
.min-width--250 {
min-width: 250px !important; }
.min-width--300 {
min-width: 300px !important; }
.height--1-1 {
height: 100% !important; }
.height--50 {
height: 50px !important; }
.height--75 {
height: 75px !important; }
.height--100 {
height: 100px !important; }
.height--150 {
height: 150px !important; }
.height--200 {
height: 200px !important; }
.height--250 {
height: 250px !important; }
.height--300 {
height: 300px !important; }
.min-height--50 {
min-height: 50px !important; }
.min-height--75 {
min-height: 75px !important; }
.min-height--100 {
min-height: 100px !important; }
.min-height--150 {
min-height: 150px !important; }
.min-height--200 {
min-height: 200px !important; }
.min-height--250 {
min-height: 250px !important; }
.min-height--300 {
min-height: 300px !important; }
.admin--color {
color: #8354FF !important; }
.admin--border {
border-color: #8354FF !important; }
.admin--background {
background-color: #8354FF !important; }
/*
Docco style used in http://jashkenas.github.com/docco/ converted by Simon Madine (@thingsinjars)
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
color: #000;
background: #f8f8ff; }
.hljs-comment,
.hljs-quote {
color: #408080;
font-style: italic; }
.hljs-keyword,
.hljs-selector-tag,
.hljs-literal,
.hljs-subst {
color: #954121; }
.hljs-number {
color: #40a070; }
.hljs-string,
.hljs-doctag {
color: #219161; }
.hljs-selector-id,
.hljs-selector-class,
.hljs-section,
.hljs-type {
color: #19469d; }
.hljs-params {
color: #00f; }
.hljs-title {
color: #458;
font-weight: bold; }
.hljs-tag,
.hljs-name,
.hljs-attribute {
color: #000080;
font-weight: normal; }
.hljs-variable,
.hljs-template-variable {
color: #008080; }
.hljs-regexp,
.hljs-link {
color: #b68; }
.hljs-symbol,
.hljs-bullet {
color: #990073; }
.hljs-built_in,
.hljs-builtin-name {
color: #0086b3; }
.hljs-meta {
color: #999;
font-weight: bold; }
.hljs-deletion {
background: #fdd; }
.hljs-addition {
background: #dfd; }
.hljs-emphasis {
font-style: italic; }
.hljs-strong {
font-weight: bold; }
.tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left {
margin-left: -10px; }
.tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over {
margin-right: -1px; }
.tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::before {
border-left-color: #e0e0e0; }
.tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--over::after {
border-left-color: #FFFFFF; }
.tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::before {
border-left-color: #262626; }
.tether-element.tether-element-attached-middle.tether-element-attached-right.tether-target-attached-middle.tether-target-attached-left .oui-pop--tip::after {
border-left-color: #262626; }
.tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left {
margin-left: -10px; }
.tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over {
margin-right: -1px; }
.tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before {
border-left-color: #e0e0e0; }
.tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after {
border-left-color: #FFFFFF; }
.tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before {
border-left-color: #262626; }
.tether-element.tether-element-attached-top.tether-element-attached-right.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after {
border-left-color: #262626; }
.tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left {
margin-left: -10px; }
.tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over {
margin-right: -1px; }
.tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before {
border-left-color: #e0e0e0; }
.tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after {
border-left-color: #FFFFFF; }
.tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before {
border-left-color: #262626; }
.tether-element.tether-element-attached-bottom.tether-element-attached-right.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after {
border-left-color: #262626; }
.tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right {
margin-left: 10px; }
.tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over {
margin-left: -1px; }
.tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::before {
border-right-color: #e0e0e0; }
.tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--over::after {
border-right-color: #FFFFFF; }
.tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::before {
border-right-color: #262626; }
.tether-element.tether-element-attached-middle.tether-element-attached-left.tether-target-attached-middle.tether-target-attached-right .oui-pop--tip::after {
border-right-color: #262626; }
.tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right {
margin-left: 10px; }
.tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over {
margin-left: -1px; }
.tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before {
border-right-color: #e0e0e0; }
.tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after {
border-right-color: #FFFFFF; }
.tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before {
border-right-color: #262626; }
.tether-element.tether-element-attached-top.tether-element-attached-left.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after {
border-right-color: #262626; }
.tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right {
margin-left: 10px; }
.tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over {
margin-left: -1px; }
.tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before {
border-right-color: #e0e0e0; }
.tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after {
border-right-color: #FFFFFF; }
.tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before {
border-right-color: #262626; }
.tether-element.tether-element-attached-bottom.tether-element-attached-left.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after {
border-right-color: #262626; }
.tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center {
margin-top: 10px; }
.tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over {
margin-top: -1px; }
.tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::before {
border-bottom-color: #e0e0e0; }
.tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--over::after {
border-bottom-color: #FFFFFF; }
.tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::before {
border-bottom-color: #262626; }
.tether-element.tether-element-attached-center.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-center .oui-pop--tip::after {
border-bottom-color: #262626; }
.tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left {
margin-top: 10px; }
.tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over {
margin-top: -1px; }
.tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::before {
border-bottom-color: #e0e0e0; }
.tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--over::after {
border-bottom-color: #FFFFFF; }
.tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::before {
border-bottom-color: #262626; }
.tether-element.tether-element-attached-left.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-left .oui-pop--tip::after {
border-bottom-color: #262626; }
.tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right {
margin-top: 10px; }
.tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over {
margin-top: -1px; }
.tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::before {
border-bottom-color: #e0e0e0; }
.tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--over::after {
border-bottom-color: #FFFFFF; }
.tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::before {
border-bottom-color: #262626; }
.tether-element.tether-element-attached-right.tether-element-attached-top.tether-target-attached-bottom.tether-target-attached-right .oui-pop--tip::after {
border-bottom-color: #262626; }
.tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center {
margin-top: -10px; }
.tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over {
margin-bottom: -1px; }
.tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::before {
border-top-color: #e0e0e0; }
.tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--over::after {
border-top-color: #FFFFFF; }
.tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::before {
border-top-color: #262626; }
.tether-element.tether-element-attached-center.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-center .oui-pop--tip::after {
border-top-color: #262626; }
.tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left {
margin-top: -10px; }
.tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over {
margin-bottom: -1px; }
.tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::before {
border-top-color: #e0e0e0; }
.tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--over::after {
border-top-color: #FFFFFF; }
.tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::before {
border-top-color: #262626; }
.tether-element.tether-element-attached-left.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-left .oui-pop--tip::after {
border-top-color: #262626; }
.tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right {
margin-top: -10px; }
.tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over {
margin-bottom: -1px; }
.tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::before {
border-top-color: #e0e0e0; }
.tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--over::after {
border-top-color: #FFFFFF; }
.tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::before {
border-top-color: #262626; }
.tether-element.tether-element-attached-right.tether-element-attached-bottom.tether-target-attached-top.tether-target-attached-right .oui-pop--tip::after {
border-top-color: #262626; }
.tippy-touch {
cursor: pointer !important; }
.tippy-notransition {
transition: none !important; }
.tippy-popper {
max-width: 400px;
-webkit-perspective: 800px;
perspective: 800px;
z-index: 9999;
outline: 0;
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
pointer-events: none; }
.tippy-popper.html-template {
max-width: 96%;
max-width: calc(100% - 20px); }
.tippy-popper[x-placement^=top] [x-arrow] {
border-top: 7px solid #333;
border-right: 7px solid transparent;
border-left: 7px solid transparent;
bottom: -7px;
margin: 0 9px; }
.tippy-popper[x-placement^=top] [x-arrow].arrow-small {
border-top: 5px solid #333;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
bottom: -5px; }
.tippy-popper[x-placement^=top] [x-arrow].arrow-big {
border-top: 10px solid #333;
border-right: 10px solid transparent;
border-left: 10px solid transparent;
bottom: -10px; }
.tippy-popper[x-placement^=top] [x-circle] {
-webkit-transform-origin: 0 33%;
transform-origin: 0 33%; }
.tippy-popper[x-placement^=top] [x-circle].enter {
-webkit-transform: scale(1) translate(-50%, -55%);
transform: scale(1) translate(-50%, -55%);
opacity: 1; }
.tippy-popper[x-placement^=top] [x-circle].leave {
-webkit-transform: scale(0.15) translate(-50%, -50%);
transform: scale(0.15) translate(-50%, -50%);
opacity: 0; }
.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-circle] {
background-color: #fff; }
.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow] {
border-top: 7px solid #fff;
border-right: 7px solid transparent;
border-left: 7px solid transparent; }
.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow].arrow-small {
border-top: 5px solid #fff;
border-right: 5px solid transparent;
border-left: 5px solid transparent; }
.tippy-popper[x-placement^=top] .tippy-tooltip.light-theme [x-arrow].arrow-big {
border-top: 10px solid #fff;
border-right: 10px solid transparent;
border-left: 10px solid transparent; }
.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-circle] {
background-color: rgba(0, 0, 0, 0.7); }
.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow] {
border-top: 7px solid rgba(0, 0, 0, 0.7);
border-right: 7px solid transparent;
border-left: 7px solid transparent; }
.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow].arrow-small {
border-top: 5px solid rgba(0, 0, 0, 0.7);
border-right: 5px solid transparent;
border-left: 5px solid transparent; }
.tippy-popper[x-placement^=top] .tippy-tooltip.transparent-theme [x-arrow].arrow-big {
border-top: 10px solid rgba(0, 0, 0, 0.7);
border-right: 10px solid transparent;
border-left: 10px solid transparent; }
.tippy-popper[x-placement^=top] [data-animation=perspective] {
-webkit-transform-origin: bottom;
transform-origin: bottom; }
.tippy-popper[x-placement^=top] [data-animation=perspective].enter {
opacity: 1;
-webkit-transform: translateY(-10px) rotateX(0);
transform: translateY(-10px) rotateX(0); }
.tippy-popper[x-placement^=top] [data-animation=perspective].leave {
opacity: 0;
-webkit-transform: translateY(0) rotateX(90deg);
transform: translateY(0) rotateX(90deg); }
.tippy-popper[x-placement^=top] [data-animation=fade].enter {
opacity: 1;
-webkit-transform: translateY(-10px);
transform: translateY(-10px); }
.tippy-popper[x-placement^=top] [data-animation=fade].leave {
opacity: 0;
-webkit-transform: translateY(-10px);
transform: translateY(-10px); }
.tippy-popper[x-placement^=top] [data-animation=shift].enter {
opacity: 1;
-webkit-transform: translateY(-10px);
transform: translateY(-10px); }
.tippy-popper[x-placement^=top] [data-animation=shift].leave {
opacity: 0;
-webkit-transform: translateY(0);
transform: translateY(0); }
.tippy-popper[x-placement^=top] [data-animation=scale].enter {
opacity: 1;
-webkit-transform: translateY(-10px) scale(1);
transform: translateY(-10px) scale(1); }
.tippy-popper[x-placement^=top] [data-animation=scale].leave {
opacity: 0;
-webkit-transform: translateY(0) scale(0);
transform: translateY(0) scale(0); }
.tippy-popper[x-placement^=bottom] [x-arrow] {
border-bottom: 7px solid #333;
border-right: 7px solid transparent;
border-left: 7px solid transparent;
top: -7px;
margin: 0 9px; }
.tippy-popper[x-placement^=bottom] [x-arrow].arrow-small {
border-bottom: 5px solid #333;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
top: -5px; }
.tippy-popper[x-placement^=bottom] [x-arrow].arrow-big {
border-bottom: 10px solid #333;
border-right: 10px solid transparent;
border-left: 10px solid transparent;
top: -10px; }
.tippy-popper[x-placement^=bottom] [x-circle] {
-webkit-transform-origin: 0 -50%;
transform-origin: 0 -50%; }
.tippy-popper[x-placement^=bottom] [x-circle].enter {
-webkit-transform: scale(1) translate(-50%, -45%);
transform: scale(1) translate(-50%, -45%);
opacity: 1; }
.tippy-popper[x-placement^=bottom] [x-circle].leave {
-webkit-transform: scale(0.15) translate(-50%, -5%);
transform: scale(0.15) translate(-50%, -5%);
opacity: 0; }
.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-circle] {
background-color: #fff; }
.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-arrow] {
border-bottom: 7px solid #fff;
border-right: 7px solid transparent;
border-left: 7px solid transparent; }
.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-arrow].arrow-small {
border-bottom: 5px solid #fff;
border-right: 5px solid transparent;
border-left: 5px solid transparent; }
.tippy-popper[x-placement^=bottom] .tippy-tooltip.light-theme [x-arrow].arrow-big {
border-bottom: 10px solid #fff;
border-right: 10px solid transparent;
border-left: 10px solid transparent; }
.tippy-popper[x-placement^=bottom] .tippy-tooltip.transparent-theme [x-circle] {
background-color: rgba(0, 0, 0, 0.7); }
.tippy-popper[x-placement^=bottom] .tippy-tooltip.transparent-theme [x-arrow] {
border-bottom: 7px solid rgba(0, 0, 0, 0.7);
border-right: 7px solid transparent;
border-left: 7px solid transparent; }
.tippy-popper[x-placement^=bottom] .tippy-tooltip.transparent-theme [x-arrow].arrow-small {
border-bottom: 5px solid rgba(0, 0, 0, 0.7);
border-right: 5px solid transparent;
border-left: 5px solid transparent; }
.tippy-popper[x-placement^=bottom] .tippy-tooltip.transparent-theme [x-arrow].arrow-big {
border-bottom: 10px solid rgba(0, 0, 0, 0.7);
border-right: 10px solid transparent;
border-left: 10px solid transparent; }
.tippy-popper[x-placement^=bottom] [data-animation=perspective] {
-webkit-transform-origin: top;
transform-origin: top; }
.tippy-popper[x-placement^=bottom] [data-animation=perspective].enter {
opacity: 1;
-webkit-transform: translateY(10px) rotateX(0);
transform: translateY(10px) rotateX(0); }
.tippy-popper[x-placement^=bottom] [data-animation=perspective].leave {
opacity: 0;
-webkit-transform: translateY(0) rotateX(-90deg);
transform: translateY(0) rotateX(-90deg); }
.tippy-popper[x-placement^=bottom] [data-animation=fade].enter {
opacity: 1;
-webkit-transform: translateY(10px);
transform: translateY(10px); }
.tippy-popper[x-placement^=bottom] [data-animation=fade].leave {
opacity: 0;
-webkit-transform: translateY(10px);
transform: translateY(10px); }
.tippy-popper[x-placement^=bottom] [data-animation=shift].enter {
opacity: 1;
-webkit-transform: translateY(10px);
transform: translateY(10px); }
.tippy-popper[x-placement^=bottom] [data-animation=shift].leave {
opacity: 0;
-webkit-transform: translateY(0);
transform: translateY(0); }
.tippy-popper[x-placement^=bottom] [data-animation=scale].enter {
opacity: 1;
-webkit-transform: translateY(10px) scale(1);
transform: translateY(10px) scale(1); }
.tippy-popper[x-placement^=bottom] [data-animation=scale].leave {
opacity: 0;
-webkit-transform: translateY(0) scale(0);
transform: translateY(0) scale(0); }
.tippy-popper[x-placement^=left] [x-arrow] {
border-left: 7px solid #333;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent;
right: -7px;
margin: 6px 0; }
.tippy-popper[x-placement^=left] [x-arrow].arrow-small {
border-left: 5px solid #333;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
right: -5px; }
.tippy-popper[x-placement^=left] [x-arrow].arrow-big {
border-left: 10px solid #333;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
right: -10px; }
.tippy-popper[x-placement^=left] [x-circle] {
-webkit-transform-origin: 50% 0;
transform-origin: 50% 0; }
.tippy-popper[x-placement^=left] [x-circle].enter {
-webkit-transform: scale(1) translate(-50%, -50%);
transform: scale(1) translate(-50%, -50%);
opacity: 1; }
.tippy-popper[x-placement^=left] [x-circle].leave {
-webkit-transform: scale(0.15) translate(-50%, -50%);
transform: scale(0.15) translate(-50%, -50%);
opacity: 0; }
.tippy-popper[x-placement^=left] .tippy-tooltip.light-theme [x-circle] {
background-color: #fff; }
.tippy-popper[x-placement^=left] .tippy-tooltip.light-theme [x-arrow] {
border-left: 7px solid #fff;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent; }
.tippy-popper[x-placement^=left] .tippy-tooltip.light-theme [x-arrow].arrow-small {
border-left: 5px solid #fff;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent; }
.tippy-popper[x-placement^=left] .tippy-tooltip.light-theme [x-arrow].arrow-big {
border-left: 10px solid #fff;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent; }
.tippy-popper[x-placement^=left] .tippy-tooltip.transparent-theme [x-circle] {
background-color: rgba(0, 0, 0, 0.7); }
.tippy-popper[x-placement^=left] .tippy-tooltip.transparent-theme [x-arrow] {
border-left: 7px solid rgba(0, 0, 0, 0.7);
border-top: 7px solid transparent;
border-bottom: 7px solid transparent; }
.tippy-popper[x-placement^=left] .tippy-tooltip.transparent-theme [x-arrow].arrow-small {
border-left: 5px solid rgba(0, 0, 0, 0.7);
border-top: 5px solid transparent;
border-bottom: 5px solid transparent; }
.tippy-popper[x-placement^=left] .tippy-tooltip.transparent-theme [x-arrow].arrow-big {
border-left: 10px solid rgba(0, 0, 0, 0.7);
border-top: 10px solid transparent;
border-bottom: 10px solid transparent; }
.tippy-popper[x-placement^=left] [data-animation=perspective] {
-webkit-transform-origin: right;
transform-origin: right; }
.tippy-popper[x-placement^=left] [data-animation=perspective].enter {
opacity: 1;
-webkit-transform: translateX(-10px) rotateY(0);
transform: translateX(-10px) rotateY(0); }
.tippy-popper[x-placement^=left] [data-animation=perspective].leave {
opacity: 0;
-webkit-transform: translateX(0) rotateY(-90deg);
transform: translateX(0) rotateY(-90deg); }
.tippy-popper[x-placement^=left] [data-animation=fade].enter {
opacity: 1;
-webkit-transform: translateX(-10px);
transform: translateX(-10px); }
.tippy-popper[x-placement^=left] [data-animation=fade].leave {
opacity: 0;
-webkit-transform: translateX(-10px);
transform: translateX(-10px); }
.tippy-popper[x-placement^=left] [data-animation=shift].enter {
opacity: 1;
-webkit-transform: translateX(-10px);
transform: translateX(-10px); }
.tippy-popper[x-placement^=left] [data-animation=shift].leave {
opacity: 0;
-webkit-transform: translateX(0);
transform: translateX(0); }
.tippy-popper[x-placement^=left] [data-animation=scale].enter {
opacity: 1;
-webkit-transform: translateX(-10px) scale(1);
transform: translateX(-10px) scale(1); }
.tippy-popper[x-placement^=left] [data-animation=scale].leave {
opacity: 0;
-webkit-transform: translateX(0) scale(0);
transform: translateX(0) scale(0); }
.tippy-popper[x-placement^=right] [x-arrow] {
border-right: 7px solid #333;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent;
left: -7px;
margin: 6px 0; }
.tippy-popper[x-placement^=right] [x-arrow].arrow-small {
border-right: 5px solid #333;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
left: -5px; }
.tippy-popper[x-placement^=right] [x-arrow].arrow-big {
border-right: 10px solid #333;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
left: -10px; }
.tippy-popper[x-placement^=right] [x-circle] {
-webkit-transform-origin: -50% 0;
transform-origin: -50% 0; }
.tippy-popper[x-placement^=right] [x-circle].enter {
-webkit-transform: scale(1) translate(-50%, -50%);
transform: scale(1) translate(-50%, -50%);
opacity: 1; }
.tippy-popper[x-placement^=right] [x-circle].leave {
-webkit-transform: scale(0.15) translate(-50%, -50%);
transform: scale(0.15) translate(-50%, -50%);
opacity: 0; }
.tippy-popper[x-placement^=right] .tippy-tooltip.light-theme [x-circle] {
background-color: #fff; }
.tippy-popper[x-placement^=right] .tippy-tooltip.light-theme [x-arrow] {
border-right: 7px solid #fff;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent; }
.tippy-popper[x-placement^=right] .tippy-tooltip.light-theme [x-arrow].arrow-small {
border-right: 5px solid #fff;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent; }
.tippy-popper[x-placement^=right] .tippy-tooltip.light-theme [x-arrow].arrow-big {
border-right: 10px solid #fff;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent; }
.tippy-popper[x-placement^=right] .tippy-tooltip.transparent-theme [x-circle] {
background-color: rgba(0, 0, 0, 0.7); }
.tippy-popper[x-placement^=right] .tippy-tooltip.transparent-theme [x-arrow] {
border-right: 7px solid rgba(0, 0, 0, 0.7);
border-top: 7px solid transparent;
border-bottom: 7px solid transparent; }
.tippy-popper[x-placement^=right] .tippy-tooltip.transparent-theme [x-arrow].arrow-small {
border-right: 5px solid rgba(0, 0, 0, 0.7);
border-top: 5px solid transparent;
border-bottom: 5px solid transparent; }
.tippy-popper[x-placement^=right] .tippy-tooltip.transparent-theme [x-arrow].arrow-big {
border-right: 10px solid rgba(0, 0, 0, 0.7);
border-top: 10px solid transparent;
border-bottom: 10px solid transparent; }
.tippy-popper[x-placement^=right] [data-animation=perspective] {
-webkit-transform-origin: left;
transform-origin: left; }
.tippy-popper[x-placement^=right] [data-animation=perspective].enter {
opacity: 1;
-webkit-transform: translateX(10px) rotateY(0);
transform: translateX(10px) rotateY(0); }
.tippy-popper[x-placement^=right] [data-animation=perspective].leave {
opacity: 0;
-webkit-transform: translateX(0) rotateY(90deg);
transform: translateX(0) rotateY(90deg); }
.tippy-popper[x-placement^=right] [data-animation=fade].enter {
opacity: 1;
-webkit-transform: translateX(10px);
transform: translateX(10px); }
.tippy-popper[x-placement^=right] [data-animation=fade].leave {
opacity: 0;
-webkit-transform: translateX(10px);
transform: translateX(10px); }
.tippy-popper[x-placement^=right] [data-animation=shift].enter {
opacity: 1;
-webkit-transform: translateX(10px);
transform: translateX(10px); }
.tippy-popper[x-placement^=right] [data-animation=shift].leave {
opacity: 0;
-webkit-transform: translateX(0);
transform: translateX(0); }
.tippy-popper[x-placement^=right] [data-animation=scale].enter {
opacity: 1;
-webkit-transform: translateX(10px) scale(1);
transform: translateX(10px) scale(1); }
.tippy-popper[x-placement^=right] [data-animation=scale].leave {
opacity: 0;
-webkit-transform: translateX(0) scale(0);
transform: translateX(0) scale(0); }
.tippy-popper .tippy-tooltip.transparent-theme {
background-color: rgba(0, 0, 0, 0.7); }
.tippy-popper .tippy-tooltip.transparent-theme[data-animatefill] {
background-color: transparent; }
.tippy-popper .tippy-tooltip.light-theme {
color: #26323d;
box-shadow: 0 4px 20px 4px rgba(0, 20, 60, 0.1), 0 4px 80px -8px rgba(0, 20, 60, 0.2);
background-color: #fff; }
.tippy-popper .tippy-tooltip.light-theme[data-animatefill] {
background-color: transparent; }
.tippy-tooltip {
position: relative;
color: #fff;
border-radius: 4px;
font-size: .95rem;
padding: .4rem .8rem;
text-align: center;
will-change: transform;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
background-color: #333; }
.tippy-tooltip--small {
padding: .25rem .5rem;
font-size: .8rem; }
.tippy-tooltip--big {
padding: .6rem 1.2rem;
font-size: 1.2rem; }
.tippy-tooltip[data-animatefill] {
overflow: hidden;
background-color: transparent; }
.tippy-tooltip[data-interactive] {
pointer-events: auto; }
.tippy-tooltip[data-inertia] {
transition-timing-function: cubic-bezier(0.53, 2, 0.36, 0.85); }
.tippy-tooltip [x-arrow] {
position: absolute;
width: 0;
height: 0; }
.tippy-tooltip [x-circle] {
position: absolute;
will-change: transform;
background-color: #333;
border-radius: 50%;
width: 130%;
width: calc(110% + 2rem);
left: 50%;
top: 50%;
z-index: -1;
overflow: hidden;
transition: all ease; }
.tippy-tooltip [x-circle]:before {
content: "";
padding-top: 90%;
float: left; }
@media (max-width: 450px) {
.tippy-popper {
max-width: 96%;
max-width: calc(100% - 20px); } }
.tippy-popper {
max-width: 350px;
perspective: 700px;
z-index: 9999;
outline: 0;
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
pointer-events: none; }
.tippy-popper[data-html] {
max-width: 96%;
max-width: calc(100% - 20px); }
.tippy-tooltip {
background: #262626;
color: #FFFFFF;
border-radius: 5px;
font-size: 11px;
padding: 5px 10px;
max-width: 250px;
font-weight: 500;
position: relative;
text-align: center;
will-change: transform; }
.tippy-tooltip[data-interactive] {
pointer-events: auto; }
.tippy-arrow {
position: absolute;
width: 0;
height: 0; }
.tippy-backdrop {
position: absolute;
will-change: transform;
background-color: #333;
border-radius: 50%;
width: 26%;
left: 50%;
top: 50%;
z-index: -1;
transition: all cubic-bezier(0.46, 0.1, 0.52, 0.98);
backface-visibility: hidden; }
.tippy-backdrop::after {
content: '';
float: left;
padding-top: 100%; }
.tippy-popper .tippy-tooltip.light-theme {
border: 1px solid #e0e0e0;
border-radius: 5px;
background: #FFFFFF;
max-width: 350px;
box-shadow: 0 2px 22px rgba(0, 0, 0, 0.1) !important; }
.tippy-tooltip.bordered-theme {
border: 1px solid #e0e0e0;
box-shadow: none !important; }
.tippy-popper[x-placement^='top'] .tippy-tooltip.light-theme .arrow-regular {
border-top: 7px solid #e0e0e0; }
.tippy-popper[x-placement^='top'] .tippy-tooltip.light-theme .arrow-regular::after {
content: '';
position: absolute;
top: -7px;
left: -6px;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid white; }
.tippy-popper[x-placement^='bottom'] .tippy-tooltip.light-theme .arrow-regular {
border-bottom: 7px solid #e0e0e0; }
.tippy-popper[x-placement^='bottom'] .tippy-tooltip.light-theme .arrow-regular::after {
content: '';
position: absolute;
bottom: -7px;
left: -6px;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid white; }
.tippy-popper[x-placement^='left'] .tippy-tooltip.light-theme .arrow-regular {
border-left: 7px solid #e0e0e0; }
.tippy-popper[x-placement^='left'] .tippy-tooltip.light-theme .arrow-regular::after {
content: '';
position: absolute;
left: -7px;
top: -6px;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-left: 6px solid white; }
.tippy-popper[x-placement^='right'] .tippy-tooltip.light-theme .arrow-regular {
border-right: 7px solid #e0e0e0; }
.tippy-popper[x-placement^='right'] .tippy-tooltip.light-theme .arrow-regular::after {
content: '';
position: absolute;
right: -7px;
top: -6px;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
border-right: 6px solid white; }
/*# sourceMappingURL=styles.css.map*/
@media (min-width: 1200px){
#root>div>div>div>div{
display: flex;
flex-direction: row;
}
}
@media (max-width: 1200px){
#root>div>div>div>div>div{
float: left;
padding-left:0px !important;
padding-right: 0px !important;
}
}
@media (max-width: 650px){
#root>div>div>div>div>div{
width:100%!important
}
#root>div>div>div>div>div>div{
width:100%!important
}
.results>div>div{
width: 100% !important;
}
.your-app-code{
font-size: 10px !important;
width: 100% !important;
margin-left: 0px !important;
margin-right:0px !important;
}
#app-code>div>div{
width:100% !important
}
.flappy-bird-container{
padding-left:0px !important;
padding-right:0px !important;
}
}
@media (max-width: 320px){
#phoneBackground{
width:294px !important;
}
#gameContainer{
height: 472px !important;
margin-left: 2px !important;
margin-right: 2px !important;
}
}