UNPKG

@ishitatsuyuki/oruga-next

Version:

UI components for Vue.js and CSS framework agnostic

1,904 lines (1,860 loc) 91.8 kB
/*! Oruga v0.5.5 | MIT License | github.com/oruga-ui/oruga */ @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .fadeOut { animation-name: fadeOut; } @keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; transform: translate3d(0, 100%, 0); } } .fadeOutDown { animation-name: fadeOutDown; } @keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; transform: translate3d(0, -100%, 0); } } .fadeOutUp { animation-name: fadeOutUp; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fadeIn { animation-name: fadeIn; } @keyframes fadeInDown { from { opacity: 0; transform: translate3d(0, -100%, 0); } to { opacity: 1; transform: none; } } .fadeInDown { animation-name: fadeInDown; } @keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: none; } } .fadeInUp { animation-name: fadeInUp; } @keyframes append-animate { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } } /** * Vue Transitions */ .fade-enter-active, .fade-leave-active { transition: opacity 150ms ease-out; } .fade-enter, .fade-enter-from, .fade-leave-to { opacity: 0; } .zoom-in-enter-active, .zoom-in-leave-active { transition: opacity 150ms ease-out; } .zoom-in-enter-active .animation-content, .zoom-in-enter-active .animation-content, .zoom-in-leave-active .animation-content, .zoom-in-leave-active .animation-content { transition: transform 150ms ease-out; } .zoom-in-enter, .zoom-in-enter-from, .zoom-in-leave-active { opacity: 0; } .zoom-in-enter .animation-content, .zoom-in-enter .animation-content, .zoom-in-enter-from .animation-content, .zoom-in-enter-from .animation-content, .zoom-in-leave-active .animation-content, .zoom-in-leave-active .animation-content { transform: scale(0.95); } .zoom-out-enter-active, .zoom-out-leave-active { transition: opacity 150ms ease-out; } .zoom-out-enter-active .animation-content, .zoom-out-enter-active .animation-content, .zoom-out-leave-active .animation-content, .zoom-out-leave-active .animation-content { transition: transform 150ms ease-out; } .zoom-out-enter, .zoom-out-enter-from, .zoom-out-leave-active { opacity: 0; } .zoom-out-enter .animation-content, .zoom-out-enter .animation-content, .zoom-out-enter-from .animation-content, .zoom-out-enter-from .animation-content, .zoom-out-leave-active .animation-content, .zoom-out-leave-active .animation-content { transform: scale(1.05); } .slide-next-enter-active, .slide-next-leave-active, .slide-prev-enter-active, .slide-prev-leave-active { transition: transform 250ms cubic-bezier(0.785, 0.135, 0.15, 0.86); } .slide-prev-leave-to, .slide-next-enter { transform: translate3d(-100%, 0, 0); position: absolute; width: 100%; } .slide-prev-enter, .slide-prev-enter-from, .slide-next-leave-to { transform: translate3d(100%, 0, 0); position: absolute; width: 100%; } .slide-down-enter-active, .slide-down-leave-active, .slide-up-enter-active, .slide-up-leave-active { transition: transform 250ms cubic-bezier(0.785, 0.135, 0.15, 0.86); } .slide-up-leave-to, .slide-down-enter { transform: translate3d(0, -100%, 0); position: absolute; height: 100%; } .slide-up-enter, .slide-up-enter-from, .slide-down-leave-to { transform: translate3d(0, 100%, 0); position: absolute; height: 100%; } .slide-enter-active { transition: 150ms ease-out; } .slide-leave-active { transition: 150ms ease-out; transition-timing-function: cubic-bezier(0, 1, 0.5, 1); } .slide-enter-to, .slide-leave { max-height: 100px; overflow: hidden; } .slide-enter, .slide-leave-to { overflow: hidden; max-height: 0; } *, :after, :before { box-sizing: inherit; } html { box-sizing: border-box; } .o-noscroll { position: fixed; overflow-y: hidden; width: 100%; bottom: 0; overflow-x: hidden; overflow-y: scroll; } .o-clipped { overflow: hidden; } /* @docs */ /* @docs */ .o-acp { position: relative; } .o-acp__menu { display: block; width: 100%; position: absolute; left: 0; top: 100%; overflow: auto; z-index: 20; background-color: #ffffff; border-radius: 4px; box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02); padding: 0.5rem 0 0.5rem 0; margin: 0; max-height: 200px; } .o-acp__menu--top { top: auto; bottom: 100%; } .o-acp__item { display: block; position: relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; color: #000000; font-size: 1rem; line-height: 1.5; padding: 0.375rem 1rem; } .o-acp__item-group-title, .o-acp__item--empty { pointer-events: none; opacity: 0.5; } .o-acp__item--hover, .o-acp__item:hover { background: #f5f5f5; color: #000000; } .o-acp--expanded { width: 100%; } /* @docs */ /* @docs */ .o-btn { -moz-appearance: none; -webkit-appearance: none; position: relative; display: inline-flex; cursor: pointer; text-align: center; white-space: nowrap; align-items: center; justify-content: center; vertical-align: top; text-decoration: none; outline: none; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: #445e00; color: #ffffff; padding: calc(0.375em - 1px) 0.75em; border: 1px solid #445e00; border-radius: 4px; box-shadow: none; font-size: 1rem; font-weight: 400; line-height: 1.5; margin: 0; height: 2.25em; } .o-btn__wrapper { margin-left: -0.1875em; margin-right: -0.1875em; display: inline-flex; align-items: center; justify-content: center; position: relative; width: 100%; } .o-btn__wrapper > * { margin-left: 0.1875em; margin-right: 0.1875em; } .o-btn__label { width: 100%; } .o-btn--expanded { width: 100%; } .o-btn--rounded { border-radius: 9999px; } .o-btn--disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; } .o-btn--small { font-size: 0.75rem; } .o-btn--medium { font-size: 1.25rem; } .o-btn--large { font-size: 1.5rem; } .o-btn--primary { border-color: transparent; background-color: #445e00; color: #ffffff; } .o-btn--primary:hover { filter: brightness(97.5%); } .o-btn--danger { border-color: transparent; background-color: #b60000; color: #ffffff; } .o-btn--danger:hover { filter: brightness(97.5%); } .o-btn--warning { border-color: transparent; background-color: #f4c300; color: #000000; } .o-btn--warning:hover { filter: brightness(97.5%); } .o-btn--success { border-color: transparent; background-color: #006724; color: #ffffff; } .o-btn--success:hover { filter: brightness(97.5%); } .o-btn--info { border-color: transparent; background-color: #005c98; color: #ffffff; } .o-btn--info:hover { filter: brightness(97.5%); } .o-btn--outlined { background-color: transparent; border-color: #445e00; color: #445e00; } .o-btn--outlined:hover { border-color: transparent; background-color: #445e00; color: #ffffff; } .o-btn--outlined-primary { background-color: transparent; border-color: #445e00; color: #445e00; } .o-btn--outlined-primary:hover { border-color: transparent; background-color: #445e00; color: #ffffff; } .o-btn--outlined-danger { background-color: transparent; border-color: #b60000; color: #b60000; } .o-btn--outlined-danger:hover { border-color: transparent; background-color: #b60000; color: #ffffff; } .o-btn--outlined-warning { background-color: transparent; border-color: #f4c300; color: #f4c300; } .o-btn--outlined-warning:hover { border-color: transparent; background-color: #f4c300; color: #000000; } .o-btn--outlined-success { background-color: transparent; border-color: #006724; color: #006724; } .o-btn--outlined-success:hover { border-color: transparent; background-color: #006724; color: #ffffff; } .o-btn--outlined-info { background-color: transparent; border-color: #005c98; color: #005c98; } .o-btn--outlined-info:hover { border-color: transparent; background-color: #005c98; color: #ffffff; } .o-btn--inverted { background-color: #ffffff; border-color: #ffffff; color: #445e00; } .o-btn--inverted:hover { filter: brightness(95%); } .o-btn--inverted-primary { background-color: #ffffff; border-color: #ffffff; color: #445e00; } .o-btn--inverted-primary:hover { filter: brightness(95%); } .o-btn--inverted-danger { background-color: #ffffff; border-color: #ffffff; color: #b60000; } .o-btn--inverted-danger:hover { filter: brightness(95%); } .o-btn--inverted-warning { background-color: #000000; border-color: #000000; color: #f4c300; } .o-btn--inverted-warning:hover { filter: brightness(95%); } .o-btn--inverted-success { background-color: #ffffff; border-color: #ffffff; color: #006724; } .o-btn--inverted-success:hover { filter: brightness(95%); } .o-btn--inverted-info { background-color: #ffffff; border-color: #ffffff; color: #005c98; } .o-btn--inverted-info:hover { filter: brightness(95%); } /* @docs */ /* @docs */ .o-car { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: relative; overflow: hidden; width: 100%; } .o-car__overlay { bottom: 0; left: 0; right: 0; top: 0; align-items: center; flex-direction: column; justify-content: center; display: flex; max-height: 100vh; position: fixed; background-color: rgba(10, 10, 10, 0.86); z-index: 40; } .o-car__scene { position: relative; width: 100%; } .o-car__items { display: flex; width: 100%; } .o-car__items:not(.o-car__items--dragging) { transition: all 250ms ease-out 0s; } .o-car__item { border: 2px solid transparent; flex-shrink: 0; } .o-car__indicators { width: 100%; display: flex; align-items: center; justify-content: center; padding: 0.5rem; background: rgba(255, 255, 255, 0.5); } .o-car__indicators--inside { position: absolute; } .o-car__indicators--inside--bottom { bottom: 0; } .o-car__indicators--inside--top { top: 0; } .o-car__indicator:not(:last-child) { margin: 0 0.5rem 0 0; } .o-car__indicator__item { display: block; outline: none; border: 1px solid #445e00; background: #ffffff; transition: 150ms ease-out; } .o-car__indicator__item--active, .o-car__indicator__item :hover { background: #445e00; border: 1px solid #445e00; } .o-car__indicator__item--boxes { width: 10px; height: 10px; } .o-car__indicator__item--dots { border-radius: 4px; width: 10px; height: 10px; } .o-car__indicator__item---lines { width: 5px; height: 25px; } .o-car__arrow__icon { cursor: pointer; outline: 0; background: #ffffff; color: #445e00; width: 1.5rem; height: 1.5rem; border-radius: 9999px; border: 1px solid #ffffff; transition: 150ms ease-out; } .o-car__arrow__icon-prev, .o-car__arrow__icon-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; } .o-car__arrow__icon-prev { left: 1.5rem; } .o-car__arrow__icon-next { right: 1.5rem; } /* @docs */ /* @docs */ .o-chk { outline: none; display: inline-flex; align-items: center; cursor: pointer; position: relative; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; line-height: 1.5; margin-right: 0.5em; } .o-chk__check { width: 1rem; height: 1rem; outline: none; margin: 0; vertical-align: top; background-position: center; background-size: contain; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-print-color-adjust: exact; color-adjust: exact; flex-shrink: 0; cursor: pointer; background-repeat: no-repeat; background: #445e00; border-radius: 4px; border-width: 2px; border-color: #445e00; border-style: solid; transition-property: background; transition-duration: 150ms; transition-timing-function: ease-out; } .o-chk__check--checked { background-color: #445e00; border-color: #445e00; background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:%23ffffff' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk__check--indeterminate { background-color: #445e00; border-color: #445e00; background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:%23ffffff' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk__label { padding: 0 0 0 0.5em; } .o-chk--disabled { opacity: 0.5; } .o-chk--small { font-size: 0.75rem; } .o-chk--medium { font-size: 1.25rem; } .o-chk--large { font-size: 1.5rem; } .o-chk--primary .o-chk__check { border-color: #445e00; background-color: #445e00; } .o-chk--primary .o-chk__check--checked { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:%23ffffff' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--primary .o-chk__check--indeterminate { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:%23ffffff' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--danger .o-chk__check { border-color: #b60000; background-color: #b60000; } .o-chk--danger .o-chk__check--checked { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:%23ffffff' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--danger .o-chk__check--indeterminate { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:%23ffffff' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--warning .o-chk__check { border-color: #f4c300; background-color: #f4c300; } .o-chk--warning .o-chk__check--checked { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:%23000000' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--warning .o-chk__check--indeterminate { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:%23000000' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--success .o-chk__check { border-color: #006724; background-color: #006724; } .o-chk--success .o-chk__check--checked { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:%23ffffff' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--success .o-chk__check--indeterminate { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:%23ffffff' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--info .o-chk__check { border-color: #005c98; background-color: #005c98; } .o-chk--info .o-chk__check--checked { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 234 225' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(3.13817,0,0,3.13817,-69.2796,-49.5156)'%3E%3Cpath style='fill:%23ffffff' d='M22.504,26.219L28.637,32.386L39.494,18.284L37.348,16.379L28,27.725L24.46,24.196L22.504,26.219Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .o-chk--info .o-chk__check--indeterminate { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 417 417' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.16667,0,0,4.16667,0,0)'%3E%3Cg transform='matrix(6.96176,0,0,20.5682,-118.661,-806.753)'%3E%3Cpath style='fill:%23ffffff' d='M31.265,41.654C31.265,41.324 30.474,41.057 29.5,41.057L18.953,41.057C17.979,41.057 17.188,41.324 17.188,41.654C17.188,41.984 17.979,42.252 18.953,42.252L29.5,42.252C30.474,42.252 31.265,41.984 31.265,41.654Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } /* @docs */ /* @docs */ .o-clps__trigger { cursor: pointer; } .o-clps__content { display: inherit; } /* @docs */ /* @docs */ .o-dpck { font-size: 1rem; } .o-dpck--small { font-size: 0.75rem; } .o-dpck--medium { font-size: 1.25rem; } .o-dpck--large { font-size: 1.5rem; } .o-dpck__dropdown { width: 100%; } .o-dpck__box { display: block; position: relative; outline: none; line-height: 1.5; padding: 0.375rem 1rem; } .o-dpck__header { padding: 0 0 0.875rem 0; margin: 0 0 0.875rem 0; border-bottom: 1px solid #dbdbdb; } .o-dpck__header__buttons { align-items: center; display: flex; justify-content: center; text-align: center; } .o-dpck__header__buttons--small { font-size: 0.75rem; } .o-dpck__header__buttons--medium { font-size: 1.25rem; } .o-dpck__header__buttons--large { font-size: 1.5rem; } .o-dpck__header__previous, .o-dpck__header__next { justify-content: center; text-align: center; text-decoration: none; cursor: pointer; -moz-appearance: none; -webkit-appearance: none; align-items: center; box-shadow: none; display: inline-flex; position: relative; vertical-align: top; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; line-height: 1.5; border: 1px solid transparent; border-radius: 4px; border-color: #dbdbdb; color: #363636; min-width: 2.25em; height: 2.25em; padding: 0.5em 0.5em; margin: 0.25rem; } .o-dpck__header__previous:hover, .o-dpck__header__next:hover { text-decoration: none; border-color: #b5b5b5; color: #363636; } .o-dpck__header__previous { order: 1; } .o-dpck__header__next { order: 3; } .o-dpck__header__list { order: 2; align-items: center; display: flex; justify-content: center; text-align: center; list-style: none; flex-wrap: wrap; margin: 0; padding: 0; margin-left: -0.125rem; margin-right: -0.125rem; } .o-dpck__header__list > * { margin-left: 0.125rem; margin-right: 0.125rem; } .o-dpck__footer { padding: 0.875rem 0.5rem 0 0.5rem; margin: 0.875rem 0 0.875rem 0; border-top: 1px solid #dbdbdb; } .o-dpck__table, .o-dpck__month { display: table; margin: 0 auto 0 auto; } .o-dpck__table__head, .o-dpck__month__head { display: table-header-group; padding: 0 0 0.875rem 0; margin: 0 0 0.875rem 0; border-bottom: 1px solid #dbdbdb; } .o-dpck__table__body, .o-dpck__month__body { display: table-row-group; } .o-dpck__table__row, .o-dpck__month__row { display: table-row; } .o-dpck__table__head-cell, .o-dpck__month__head-cell { padding: #7a7a7a; font-weight: 600; } .o-dpck__table__cell, .o-dpck__month__cell { text-align: center; vertical-align: middle; display: table-cell; text-decoration: none; border-radius: 4px; padding: 0.5rem 0.75rem; } .o-dpck__table__cell--unselectable, .o-dpck__month__cell--unselectable { color: #b5b5b5; } .o-dpck__table__cell--today, .o-dpck__month__cell--today { border: solid 1px rgba(68, 94, 0, 0.5); } .o-dpck__table__cell--selectable, .o-dpck__month__cell--selectable { color: #4a4a4a; } .o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered { background-color: #7a7a7a; color: #dbdbdb; border-bottom-right-radius: 0; border-top-right-radius: 0; } .o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered { background-color: rgba(122, 122, 122, 0.5); color: #dbdbdb; border-radius: 0; } .o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered { background-color: #7a7a7a; color: #dbdbdb; border-bottom-left-radius: 0; border-top-left-radius: 0; } .o-dpck__table__cell--selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered), .o-dpck__month__cell--selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered) { background-color: #445e00; color: #ffffff; } .o-dpck__table__cell--first-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered), .o-dpck__month__cell--first-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered) { background-color: #445e00; color: #ffffff; border-bottom-right-radius: 0; border-top-right-radius: 0; } .o-dpck__table__cell--within-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered), .o-dpck__month__cell--within-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered) { background-color: rgba(68, 94, 0, 0.5); border-radius: 0; } .o-dpck__table__cell--last-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered), .o-dpck__month__cell--last-selected:not(.o-dpck__table__cell--first-hovered, .o-dpck__month__cell--first-hovered):not(.o-dpck__table__cell--within-hovered, .o-dpck__month__cell--within-hovered):not(.o-dpck__table__cell--last-hovered, .o-dpck__month__cell--last-hovered) { background-color: #445e00; color: #ffffff; border-bottom-left-radius: 0; border-top-left-radius: 0; } .o-dpck__table__cell--nearby:not(.o-dpck__table__cell--selected, .o-dpck__month__cell--selected), .o-dpck__month__cell--nearby:not(.o-dpck__table__cell--selected, .o-dpck__month__cell--selected) { color: #b5b5b5; } .o-dpck__table__cell--invisible, .o-dpck__month__cell--invisible { visibility: hidden; } .o-dpck__table__cell--events, .o-dpck__month__cell--events { padding: 0.3rem 0.75rem 0.75rem; position: relative; } .o-dpck__table__events, .o-dpck__month__events { display: flex; justify-content: center; position: absolute; width: 100%; left: 0; bottom: 15%; } .o-dpck__table__event, .o-dpck__month__event { background-color: #b5b5b5; } .o-dpck__table__event--primary, .o-dpck__month__event--primary { background-color: #445e00; background-color: #445e00; } .o-dpck__table__event--danger, .o-dpck__month__event--danger { background-color: #b60000; background-color: #b60000; } .o-dpck__table__event--warning, .o-dpck__month__event--warning { background-color: #f4c300; background-color: #f4c300; } .o-dpck__table__event--success, .o-dpck__month__event--success { background-color: #006724; background-color: #006724; } .o-dpck__table__event--info, .o-dpck__month__event--info { background-color: #005c98; background-color: #005c98; } .o-dpck__table__event--dots, .o-dpck__month__event--dots { border-radius: 50%; margin: 0 0.1em; height: 0.35em; width: 0.35em; } .o-dpck__table__event--bars, .o-dpck__month__event--bars { height: 0.25em; width: 100%; } .o-dpck__month__table { display: inline-flex; flex-wrap: wrap; flex-direction: row; width: 17rem; } .o-dpck__month__cell { display: flex; align-items: center; justify-content: center; width: 33.33%; height: 2.5rem; } .o-dpck--mobile .o-dpck__header__previous { order: 1; flex-grow: 1; flex-shrink: 1; } .o-dpck--mobile .o-dpck__header__next { order: 3; flex-grow: 1; flex-shrink: 1; } .o-dpck--mobile .o-dpck__header__list { order: 2; flex-grow: 1; flex-shrink: 1; } /* @docs */ /* @docs */ .o-dtpck__time { display: flex; justify-content: center; align-items: center; } /* @docs */ /* @docs */ .o-drop { display: inline-flex; position: relative; vertical-align: top; } .o-drop--inline { display: inline; } .o-drop--inline .o-drop__menu { position: static; display: inline-block; padding: 0; } .o-drop__overlay { position: fixed; bottom: 0; left: 0; right: 0; top: 0; cursor: pointer; display: none; background-color: rgba(0, 0, 0, 0.86); z-index: 40; } .o-drop__trigger { width: 100%; } .o-drop__menu { position: absolute; left: 0; top: 100%; display: block; min-width: 12rem; z-index: 20; background-color: #ffffff; border-radius: 4px; box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02); padding: 0.5rem 0 0.5rem 0; margin: 0; } .o-drop__menu--top-left { top: auto; bottom: 100%; right: 0; left: auto; } .o-drop__menu--bottom-left { right: 0; left: auto; } .o-drop__menu--top-right { top: auto; bottom: 100%; } .o-drop__item { display: block; position: relative; outline: none; cursor: pointer; color: #000000; font-size: 1rem; font-weight: 400; line-height: 1.5; padding: 0.375rem 1rem; } .o-drop__item--disabled { opacity: 0.5; pointer-events: none; } .o-drop__item--active { background-color: #445e00; color: #ffffff; } .o-drop__item:hover:not(.o-drop__item--active) { background-color: #f5f5f5; color: #000000; } .o-drop--expanded { width: 100%; } .o-drop--expanded .o-drop__menu { width: 100%; } .o-drop--disabled { opacity: 0.5; pointer-events: none; } .o-drop--mobile > .o-drop__menu { position: fixed; top: 25%; left: 50%; bottom: auto; right: auto; transform: translate3d(-50%, -25%, 0); overflow-y: auto; width: calc(100vw - 40px); max-width: 460px; max-height: calc(100vh - 120px); z-index: 50; } .o-drop--mobile > .o-drop__overlay { display: block; } /* @docs */ /* @docs */ .o-field { flex-grow: 1; } .o-field:not(:last-child) { margin-bottom: 0.75rem; } .o-field__label { display: block; color: #363636; font-size: 1rem; font-weight: 600; } .o-field__label-small { font-size: 0.75rem; } .o-field__label-medium { font-size: 1.25rem; } .o-field__label-large { font-size: 1.5rem; } .o-field__message { display: block; font-size: 0.75rem; margin-top: 0.25rem; } .o-field__message-primary { color: #445e00; } .o-field__message-danger { color: #b60000; } .o-field__message-warning { color: #f4c300; } .o-field__message-success { color: #006724; } .o-field__message-info { color: #005c98; } .o-field--addons { display: flex; justify-content: flex-start; } .o-field--addons > *:first-child:not(:only-child) button, .o-field--addons > button:first-child, .o-field--addons > *:first-child:not(:only-child) input, .o-field--addons > input:first-child, .o-field--addons > *:first-child:not(:only-child) select, .o-field--addons > select:first-child { border-bottom-right-radius: 0; border-top-right-radius: 0; } .o-field--addons > *:last-child:not(:only-child) button, .o-field--addons > button:last-child, .o-field--addons > *:last-child:not(:only-child) input, .o-field--addons > input:last-child, .o-field--addons > *:last-child:not(:only-child) select, .o-field--addons > select:last-child { border-bottom-left-radius: 0; border-top-left-radius: 0; } .o-field--addons > *:not(:first-child):not(:last-child) button, .o-field--addons > button:not(:first-child):not(:last-child), .o-field--addons > *:not(:first-child):not(:last-child) input, .o-field--addons > input:not(:first-child):not(:last-child), .o-field--addons > *:not(:first-child):not(:last-child) select, .o-field--addons > select:not(:first-child):not(:last-child) { border-radius: 0; } .o-field--grouped { display: flex; margin-left: -0.37rem; margin-right: -0.37rem; } .o-field--grouped > * { margin-left: 0.37rem; margin-right: 0.37rem; } .o-field--grouped-multiline { flex-wrap: wrap; } .o-field--grouped-multiline:last-child { margin-bottom: -0.75rem; } .o-field__horizontal-body { display: flex; flex-basis: 0; flex-grow: 5; flex-shrink: 1; margin-left: -0.37rem; margin-right: -0.37rem; } .o-field__horizontal-body > * { margin-left: 0.37rem; margin-right: 0.37rem; } .o-field--horizontal { display: flex; } .o-field__horizontal-label { flex-basis: 0; flex-grow: 1; flex-shrink: 0; margin: 0 1.5rem 0 0; text-align: right; } .o-field--mobile .o-field__horizontal-body { all: unset; } .o-field--mobile.o-field--horizontal { all: unset; } .o-field--mobile .o-field__horizontal-label { all: unset; } /* @docs */ /* @docs */ @keyframes icon-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } .o-icon { align-items: center; display: inline-flex; justify-content: center; transition: transform 150ms ease-out, opacity 300ms ease-out; } .o-icon--small { font-size: 0.75rem; } .o-icon--medium { font-size: 1.25rem; } .o-icon--large { font-size: 1.5rem; } .o-icon--primary { color: #445e00; } .o-icon--danger { color: #b60000; } .o-icon--warning { color: #f4c300; } .o-icon--success { color: #006724; } .o-icon--info { color: #005c98; } .o-icon--clickable { pointer-events: auto; cursor: pointer; } .o-icon--spin { animation-name: icon-spin; animation-iteration-count: infinite; animation-timing-function: linear; animation-duration: 2s; } /* @docs */ /* @docs */ .o-ctrl-input { display: block; position: relative; } .o-ctrl-input--expanded { width: 100%; flex-grow: 1; flex-shrink: 1; } .o-input { -moz-appearance: none; -webkit-appearance: none; display: inline-flex; position: relative; vertical-align: top; outline: none; width: 100%; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); max-width: 100%; background-color: #ffffff; border-color: #dbdbdb; border-style: solid; border-width: 1px; border-radius: 4px; color: #363636; font-size: 1rem; height: 2.25em; line-height: 1.5; padding: calc(0.375em - 1px) calc(0.625em - 1px); margin: 0; } .o-input-iconspace-left { padding-left: 2.25em; } .o-input-iconspace-right { padding-right: 2.25em; } .o-input--rounded { border-radius: 9999px; } .o-input--small { font-size: 0.75rem; } .o-input--medium { font-size: 1.25rem; } .o-input--large { font-size: 1.5rem; } .o-input--primary { border-color: #445e00; } .o-input--danger { border-color: #b60000; } .o-input--warning { border-color: #f4c300; } .o-input--success { border-color: #006724; } .o-input--info { border-color: #005c98; } .o-input__textarea { display: block; max-width: 100%; min-width: 100%; height: auto; resize: vertical; padding: 0.625em; } .o-input__textarea:not([rows]) { max-height: 600px; min-height: 120px; } .o-input__counter { display: block; float: right; font-size: 0.75rem; margin: 0.25rem 0 0 0.5rem; } .o-input__icon-left, .o-input__icon-right { position: absolute; top: 0; height: 100%; width: 2.25em; z-index: 4; } .o-input__icon-right { right: 0; } .o-input__icon-left { left: 0; } /* @docs */ /* @docs */ .o-inputit { display: block; } .o-inputit__container { display: flex; align-items: center; justify-content: flex-start; position: relative; vertical-align: top; flex-wrap: wrap; max-width: 100%; width: 100%; padding: calc(.275em - 1px) 0 0; background-color: #ffffff; border-color: #dbdbdb; border-style: solid; border-width: 1px; border-radius: 4px; color: #363636; font-size: 1rem; line-height: 1.5; box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1); } .o-inputit__container--small { font-size: 0.75rem; } .o-inputit__container--medium { font-size: 1.25rem; } .o-inputit__container--large { font-size: 1.5rem; } .o-inputit__autocomplete { position: static; flex: 1; } .o-inputit__input { border: none; box-shadow: none; } .o-inputit__input:focus { box-shadow: none; } .o-inputit__item { display: inline-flex; justify-content: center; align-items: center; position: relative; margin-left: -0.1875em; margin-right: -0.1875em; background-color: #445e00; color: #ffffff; border-radius: 4px; margin: 0 0 0 0.275em; padding: 0 0.75em 0 0.75em; } .o-inputit__item > * { margin-left: 0.1875em; margin-right: 0.1875em; } .o-inputit__item--primary { background-color: #445e00; color: #ffffff; } .o-inputit__item--danger { background-color: #b60000; color: #ffffff; } .o-inputit__item--warning { background-color: #f4c300; color: #000000; } .o-inputit__item--success { background-color: #006724; color: #ffffff; } .o-inputit__item--info { background-color: #005c98; color: #ffffff; } .o-inputit__counter { display: block; float: right; font-size: 0.75rem; margin: 0.25rem 0 0 0.5rem; } .o-inputit--expanded { width: 100%; flex-grow: 1; flex-shrink: 1; } /* @docs */ /* @docs */ .o-load { position: absolute; bottom: 0; left: 0; right: 0; top: 0; align-items: center; display: flex; justify-content: center; overflow: hidden; z-index: 29; } .o-load--fullpage { position: fixed; z-index: 999; } .o-load__overlay { position: absolute; bottom: 0; left: 0; right: 0; top: 0; background: #7f7f7f; background: rgba(255, 255, 255, 0.5); } /* @docs */ /* @docs */ .o-modal { display: flex; flex-direction: column; justify-content: center; align-items: center; overflow: hidden; position: fixed; bottom: 0; left: 0; right: 0; top: 0; z-index: 40; } .o-modal__overlay { bottom: 0; left: 0; position: absolute; right: 0; top: 0; background-color: rgba(10, 10, 10, 0.86); } .o-modal__content { position: relative; max-height: calc(100vh - 160px); overflow: auto; margin: 0 auto; max-height: calc(100vh - 160px); background-color: #ffffff; padding: 10px; border-radius: 4px; } .o-modal__content--full-screen { width: 100%; height: 100%; max-height: 100vh; margin: 0; background-color: #f5f5f5; } .o-modal__close { background: none; position: fixed; border: none; display: inline-block; outline: none; vertical-align: top; border-radius: 9999px; right: 20px; top: 20px; height: 32px; width: 32px; color: #ffffff; } .o-modal--mobile .o-modal__content { width: 100%; } /* @docs */ /* @docs */ .o-notification { background-color: #445e00; color: #ffffff; border-radius: 4px; padding: 1.75em 1.75em; margin-bottom: 1.5rem; position: relative; transform-origin: 50% 0; } .o-notification__content { flex-basis: auto; flex-grow: 1; flex-shrink: 1; text-align: inherit; overflow-y: hidden; overflow-x: auto; } .o-notification__wrapper { align-items: flex-start; display: flex; text-align: inherit; padding-top: 0; border: 0; } .o-notification__icon { flex-basis: auto; flex-grow: 0; flex-shrink: 0; margin-right: 1rem; } .o-notification__close { position: absolute; border: none; cursor: pointer; pointer-events: auto; display: flex; justify-content: center; align-items: center; flex-grow: 0; flex-shrink: 0; outline: none; vertical-align: top; background-color: rgba(10, 10, 10, 0.2); border-radius: 9999px; right: 0.5rem; top: 0.5rem; height: 20px; width: 20px; color: #ffffff; } .o-notification--primary { border-color: transparent; background-color: #445e00; color: #ffffff; } .o-notification--primary:hover { filter: brightness(97.5%); } .o-notification--danger { border-color: transparent; background-color: #b60000; color: #ffffff; } .o-notification--danger:hover { filter: brightness(97.5%); } .o-notification--warning { border-color: transparent; background-color: #f4c300; color: #000000; } .o-notification--warning:hover { filter: brightness(97.5%); } .o-notification--success { border-color: transparent; background-color: #006724; color: #ffffff; } .o-notification--success:hover { filter: brightness(97.5%); } .o-notification--info { border-color: transparent; background-color: #005c98; color: #ffffff; } .o-notification--info:hover { filter: brightness(97.5%); } .o-notices { position: fixed; display: flex; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; pointer-events: none; padding: 2em; z-index: 1000; } .o-notices .o-notification { pointer-events: stroke; max-width: 600px; animation: append-animate 0.3s linear; } .o-notices .o-notification--top, .o-notices .o-notification--bottom { align-self: center; } .o-notices .o-notification--top-right, .o-notices .o-notification--bottom-right { align-self: flex-end; } .o-notices .o-notification--top-left, .o-notices .o-notification--bottom-left { align-self: flex-start; } .o-notices--top { flex-direction: column; } .o-notices--bottom { flex-direction: column-reverse; } .o-notices--bottom .o-notification { margin-bottom: 0; } .o-notices--bottom .o-notification:not(:first-child) { margin-bottom: 1.5rem; } .o-notices.has-custom-container { position: absolute; } /* @docs */ /* @docs */ .o-pag { align-items: center; display: flex; justify-content: center; text-align: center; justify-content: space-between; font-size: 1rem; margin: -0.25rem; } .o-pag--small { font-size: 0.75rem; } .o-pag--medium { font-size: 1.25rem; } .o-pag--large { font-size: 1.5rem; } .o-pag__link { -moz-appearance: none; -webkit-appearance: none; align-items: center; box-shadow: none; display: inline-flex; position: relative; vertical-align: top; justify-content: center; text-align: center; text-decoration: none; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; line-height: 1.5; border: 1px solid transparent; border-radius: 4px; border-color: #dbdbdb; color: #363636; min-width: 2.25em; height: 2.25em; padding: 0.5em 0.5em; margin: 0.25rem; } .o-pag__link:hover { text-decoration: none; border-color: #b5b5b5; } .o-pag__link--rounded { border-radius: 9999px; } .o-pag__link--disabled { pointer-events: none; opacity: 0.5; } .o-pag__link--current { pointer-events: none; background-color: #445e00; border-color: #445e00; color: #fff; } .o-pag__ellipsis { justify-content: center; text-align: center; pointer-events: none; margin: 0.25rem; color: #b5b5b5; } .o-pag--simple { justify-content: normal; } .o-pag--centered { justify-content: center; } .o-pag--centered .o-pag__previous { order: 1; } .o-pag--centered .o-pag__next { order: 3; } .o-pag--centered .o-pag__list { justify-content: center; order: 2; } .o-pag--right { justify-content: flex-end; } .o-pag--right .o-pag__previous { order: 1; } .o-pag--right .o-pag__next { order: 2; } .o-pag--right .o-pag__list { justify-content: flex-end; order: 2; } .o-pag__next { order: 3; } .o-pag__previous { order: 2; } .o-pag__list { align-items: center; display: flex; justify-content: center; text-align: center; list-style: none; flex-wrap: wrap; margin: 0; padding: 0; flex-grow: 1; flex-shrink: 1; justify-content: flex-start; order: 1; } .o-pag--mobile { justify-content: flex-start; flex-wrap: wrap; } .o-pag--mobile .o-pag__link { flex-grow: 1; flex-shrink: 1; } .o-pag--mobile .o-pag__previous { flex-grow: 1; flex-shrink: 1; order: 0; } .o-pag--mobile .o-pag__next { flex-grow: 1; flex-shrink: 1; order: 0; } .o-pag--mobile .o-pag__ellipsis { flex-grow: 1; flex-shrink: 1; } .o-pag--mobile .o-pag__list { order: 0; } /* @docs */ /* @docs */ .o-radio { outline: none; display: inline-flex; align-items: center; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; line-height: 1.25; margin-right: 0.5em; } .o-radio__check { width: 1rem; height: 1rem; margin: 0; vertical-align: top; outline: none; background-position: center; background-size: contain; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-print-color-adjust: exact; color-adjust: exact; border-radius: 50%; cursor: pointer; background-repeat: no-repeat; transition-property: background; transition-duration: 150ms; transition-timing-function: ease-out; background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:%23445e00;'/%3E%3C/g%3E%3C/svg%3E"); } .o-radio__check--checked { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:%23445e00;'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:transparent;'/%3E%3C/g%3E%3C/svg%3E"); } .o-radio__label { padding: 0 0 0 0.5em; } .o-radio--disabled { opacity: 0.5; } .o-radio--small { font-size: 0.75rem; } .o-radio--medium { font-size: 1.25rem; } .o-radio--large { font-size: 1.5rem; } .o-radio--primary .o-radio__check { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.85' style='fill:%23445e00;'/%3E%3C/g%3E%3C/svg%3E"); } .o-radio--primary .o-radio__check--checked { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(4.38544,0,0,4.38544,-94.4336,-58.9876)'%3E%3Cpath d='M32.935,13.679C39.102,13.679 44.108,18.685 44.108,24.852C44.108,31.019 39.102,36.025 32.935,36.025C26.768,36.025 21.761,31.019 21.761,24.852C21.761,18.685 26.768,13.679 32.935,13.679ZM32.798,17.05C37.105,17.05 40.601,20.546 40.601,24.852C40.601,29.158 37.105,32.655 32.798,32.655C28.492,32.655 24.996,29.158 24.996,24.852C24.996,20.546 28.492,17.05 32.798,17.05Z' style='fill:%23445e00;'/%3E%3Ccircle cx='32.84' cy='24.8' r='7.9' style='fill:%23ffffff;'/%3E%3C/g%3E%3C/svg%3E"); } .o-radio--danger .o-radio__check { background-image: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 100 100' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'%3E%3Cg transform='matrix(10.1032,0,0,10.1032,-255.068,-313.298)'%3E%3Ccircle cx='30.195' cy='35.959' r='4.8