/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[1].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[5].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[5].rules[1].use[1]!./src/theme/variables.scss ***! \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ /*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[1].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[5].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[5].rules[1].use[1]!./src/global.scss ***! \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ @charset "UTF-8"; /* * App Global CSS * ---------------------------------------------------------------------------- * Put style rules here that you want to apply globally. These styles are for * the entire app and not just one component. Additionally, this file can be * used as an entry point to import other CSS/Sass files to be included in the * output CSS. * For more information on global stylesheets, visit the documentation: * https://ionicframework.com/docs/layout/global-stylesheets */ /* Core CSS required for Ionic components to work properly */ @font-face { font-family: 'anypicker-font'; src: url('anypicker-font.eot'); } @font-face { font-family: 'anypicker-font'; src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SAvQAAAC8AAAAYGNtYXDmP+C4AAABHAAAAFxnYXNwAAAAEAAAAXgAAAAIZ2x5Zk9FXHgAAAGAAAAEFGhlYWQGjJupAAAFlAAAADZoaGVhB8IDzQAABcwAAAAkaG10eCYAAAAAAAXwAAAAMGxvY2EEPgMmAAAGIAAAABptYXhwABAAUQAABjwAAAAgbmFtZTvtFloAAAZcAAABznBvc3QAAwAAAAAILAAAACAAAwPHAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADmAwPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAQAAAAAwACAACAAQAAQAg4APmA//9//8AAAAAACDgAOYA//3//wAB/+MgBBoIAAMAAQAAAAAAAAAAAAAAAAABAAH//wAPAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAADABAACwAADAAAlIQkBBAD8AAIAAgDAAgD+AAAAAQAAAHcEAAMJAAUAAAEnCQEHAQQAkf6R/pGRAgACd5L+kQFvkv4AAAEAAADABAACwAACAAATCQEAAgACAALA/gACAAABAAAAcgP6AwgAGwAACQEmIgcBDgEVFBYfAR4BMzI2NwkBFjI/ATY0JwP6/hUGEgb+FQMDAwOIAwcEBAgDAVUBVQYSBYgGBgEdAesGBv4VAwgEBAgCiAMDAwMBVf6rBgaIBhEGAAAAAAMAAP/ABAADwAAUACkAPwAAASIOAhUUHgIzMj4CNTQuAiMRIi4CNTQ+AjMyHgIVFA4CIxMjNTQmKwEiBh0BFBY7ATI2PQE0JiMCAGq7i1BQi7tqaruLUFCLu2pYmnJDQ3KaWFiackNDcppYvZAUDhYOFBQOyA4UFA4DwFCLu2pqu4tQUIu7amq7i1D8WUNymlhYmnJDQ3KaWFiackMB1KYOFBQO3g4UFA4WDhQAAAAAAwAA/8AEAAPAABQAKQBLAAABIg4CFRQeAjMyPgI1NC4CIxEiLgI1ND4CMzIeAhUUDgIjEyYiDwEnJiIPAQYUHwEUMBUXFDIxFxYyPwE+AT8BNjQvAQIAaruLUFCLu2pqu4tQUIu7aliackNDcppYWJpyQ0NymlipChsKm1oKHAoQCgpxEAECChwKEAMEAagKChADwFCLu2pqu4tQUIu7amq7i1D8WUNymlhYmnJDQ3KaWFiackMCHQoKm1oKChAKHApwAQEPAQIKChECBwSoChwJEAADAAD/wAQAA8AAFAApAE4AAAEiDgIVFB4CMzI+AjU0LgIjESIuAjU0PgIzMh4CFRQOAiMTJyYiDwEnJiIPAQYUHwEHBhQfARYyPwEXFjI/ATY0LwE3NjQnAgBqu4tQUIu7amq7i1BQi7tqWJpyQ0NymlhYmnJDQ3KaWKMQChwJZGQJHAoQCQlkZAkJEAocCWRkCRwKEAkJZGQJCQPAUIu7amq7i1BQi7tqaruLUPxZQ3KaWFiackNDcppYWJpyQwI6EAkJZGQJCRAKHAlkZAkcChAJCWRkCQkQChwJZGQJHAoAAAADAAD/wAQAA8AAFAApADoAAAEiDgIVFB4CMzI+AjU0LgIjESIuAjU0PgIzMh4CFRQOAiMTISIGHQEUFjMhMjY9ATQmIwIAaruLUFCLu2pqu4tQUIu7aliackNDcppYWJpyQ0Nymlin/rIOExMOAU4OExMOA8BQi7tqaruLUFCLu2pqu4tQ/FlDcppYWJpyQ0NymlhYmnJDAdQUDhYOFBQOFg4UAAEAAAABGZrL7g4nXw889QALBAAAAAAA0baeyQAAAADRtp7JAAD/wAQAA8AAAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAABAAAAQAAAAAAAAAAAAAAAAAAAAwEAAAAAAAAAAAAAAACAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAAAAAAAAoAFAAeAC4AQgBQAIQA3AFGAbgCCgAAAAEAAAAMAE8AAwAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQANAAAAAQAAAAAAAgAHAJYAAQAAAAAAAwANAEgAAQAAAAAABAANAKsAAQAAAAAABQALACcAAQAAAAAABgANAG8AAQAAAAAACgAaANIAAwABBAkAAQAaAA0AAwABBAkAAgAOAJ0AAwABBAkAAwAaAFUAAwABBAkABAAaALgAAwABBAkABQAWADIAAwABBAkABgAaAHwAAwABBAkACgA0AOxBbnlQaWNrZXJGb250AEEAbgB5AFAAaQBjAGsAZQByAEYAbwBuAHRWZXJzaW9uIDEuMQBWAGUAcgBzAGkAbwBuACAAMQAuADFBbnlQaWNrZXJGb250AEEAbgB5AFAAaQBjAGsAZQByAEYAbwBuAHRBbnlQaWNrZXJGb250AEEAbgB5AFAAaQBjAGsAZQByAEYAbwBuAHRSZWd1bGFyAFIAZQBnAHUAbABhAHJBbnlQaWNrZXJGb250AEEAbgB5AFAAaQBjAGsAZQByAEYAbwBuAHRGb250IGdlbmVyYXRlZCBieSBJY29Nb29uLgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype'); font-weight: normal; font-style: normal; } [class^="ap-icon-"], [class*=" ap-icon-"] { font-family: 'anypicker-font'; speak: none; font-style: normal; font-weight: normal; font-feature-settings: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ap-icon-now:before { content: "\e600"; } .ap-icon-set:before { content: "\e601"; } .ap-icon-cancel:before { content: "\e602"; } .ap-icon-clear:before { content: "\e603"; } .ap-icon-arrow-up-filled:before { content: "\e000"; } .ap-icon-arrow-down:before { content: "\e001"; } .ap-icon-arrow-down-filled:before { content: "\e002"; } .ap-icon-arrow-up:before { content: "\e003"; } /* ----------------------------------------------------------------------------- AnyPicker - Customizable Picker for Mobile OS Version 2.0.9 Copyright (c)2017 Lajpat Shah Contributors : https://github.com/nehakadam/AnyPicker/contributors Repository : https://github.com/nehakadam/AnyPicker Homepage : https://nehakadam.github.io/AnyPicker ----------------------------------------------------------------------------- */ body.noscroll{overflow:hidden} .ap-overlay{display:none;z-index:2000;min-width:250px;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;backface-visibility:hidden;transform-style:preserve-3d;perspective:1000px} .ap-layout-popup{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5)} .ap-layout-fixed,.ap-layout-popover{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5)} .ap-layout-relative,.ap-layout-inline{position:fixed;top:0;left:0;width:100%;height:100%} .ap-overlay *{-ms-box-sizing:border-box;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)} .ap-bg{width:100%;height:100%;font-family:sans-serif;font-size:22px} .ap-cont{margin:0 auto;background:#FFF} .ap-theme-default:not(.ap-layout-inline):not(.ap-layout-relative) .ap-cont{box-shadow:0 16px 28px 0 rgba(0,0,0,.22),0 25px 55px 0 rgba(0,0,0,.21)} .ap-layout-popup .ap-cont{position:relative;top:50%;max-width:500px;width:95%;transform:translateY(-50%)} .ap-layout-relative .ap-cont{max-width:500px;width:97%;border:1px solid #ECF0F1} .ap-layout-inline .ap-cont{border:1px solid #ECF0F1} .ap-layout-fixed .ap-cont{width:100%;position:fixed} .ap-header{height:50px;line-height:50px;text-align:left;font-size:.9em;padding:0 16px} .ap-dir-rtl .ap-header{text-align:right} .ap-theme-default .ap-header{height:60px;line-height:60px} .ap-content{max-width:320px;margin:0 auto} .ap-content-top{height:50px;padding:8px 16px;color:#555;text-align:center} .ap-content-switch{margin-top:8px;margin-bottom:8px;text-align:center} .ap-content-switch-tab{border:1px solid #009688;padding:5px 16px;cursor:pointer;font-size:.6em;color:#009688} .ap-dir-ltr .ap-content-switch-date{border-top-left-radius:2px;border-bottom-left-radius:2px} .ap-dir-rtl .ap-content-switch-date{border-top-right-radius:2px;border-bottom-right-radius:2px;margin-left:-1px} .ap-dir-ltr .ap-content-switch-time{border-top-right-radius:2px;border-bottom-right-radius:2px;margin-left:-1px} .ap-dir-rtl .ap-content-switch-time{border-top-left-radius:2px;border-bottom-left-radius:2px} .ap-content-switch-selected{background:#009688;color:#FFF} .ap-content-middle{min-height:120px;padding-top:20px;padding-bottom:20px} .ap-content-bottom{height:50px;padding:8px 16px;color:#555;text-align:center} .ap-theme-default .ap-content-top,.ap-theme-default .ap-content-bottom{font-size:.7em} .ap-footer{display:table;table-layout:fixed;width:100%;height:50px;text-align:center} .ap-theme-default .ap-footer{padding:0 16px} .ap-theme-default .ap-footer-top{line-height:55px} .ap-theme-default .ap-footer-bottom{line-height:45px} .ap-header__title{color:#000;font-size:1.2em} .ap-theme-default .ap-button{cursor:pointer;letter-spacing:0;text-align:center;font-size:.8em;padding:8px 12px;margin:8px;color:#009688;background:rgba(255,255,255,1);text-transform:uppercase} .ap-theme-default .ap-button-cont{float:right} .ap-theme-default.ap-dir-rtl .ap-button-cont{float:left} .ap-show{opacity:0;animation:ap-anim-show ease .5s;animation-iteration-count:1;-webkit-animation:ap-anim-show ease .5s;-webkit-animation-iteration-count:1;-moz-animation:ap-anim-show ease .5s;-moz-animation-iteration-count:1;-o-animation:ap-anim-show ease .5s;-o-animation-iteration-count:1;-ms-animation:ap-anim-show ease .5s;-ms-animation-iteration-count:1;animation-fill-mode:forwards} @keyframes ap-anim-show{0%{opacity:0}100%{opacity:1}} .ap-hide{animation:ap-anim-hide ease .5s;animation-iteration-count:1;animation-fill-mode:forwards;-webkit-animation:ap-anim-hide ease .5s;-webkit-animation-iteration-count:1;-moz-animation:ap-anim-hide ease .5s;-moz-animation-iteration-count:1;-o-animation:ap-anim-hide ease .5s;-o-animation-iteration-count:1;-ms-animation:ap-anim-hide ease .5s;-ms-animation-iteration-count:1} @keyframes ap-anim-hide{0%{opacity:1}100%{opacity:0}} .ap-bottom-slide-up{opacity:0;animation:ap-anim-bottom-slide-up ease .5s;animation-iteration-count:1;-webkit-animation:ap-anim-bottom-slide-up ease .5s;-webkit-animation-iteration-count:1;-moz-animation:ap-anim-bottom-slide-up ease .5s;-moz-animation-iteration-count:1;-o-animation:ap-anim-bottom-slide-up ease .5s;-o-animation-iteration-count:1;-ms-animation:ap-anim-bottom-slide-up ease .5s;-ms-animation-iteration-count:1;animation-fill-mode:forwards} @keyframes ap-anim-bottom-slide-up{100%{opacity:1;bottom:0}} .ap-bottom-slide-down{opacity:1;animation:ap-anim-bottom-slide-down ease .5s;animation-iteration-count:1;-webkit-animation:ap-anim-bottom-slide-down ease .5s;-webkit-animation-iteration-count:1;-moz-animation:ap-anim-bottom-slide-down ease .5s;-moz-animation-iteration-count:1;-o-animation:ap-anim-bottom-slide-down ease .5s;-o-animation-iteration-count:1;-ms-animation:ap-anim-bottom-slide-down ease .5s;-ms-animation-iteration-count:1;animation-fill-mode:forwards} @keyframes ap-anim-bottom-slide-down{100%{opacity:0;bottom:-1000px}} .ap-top-slide-down{opacity:0;animation:ap-anim-top-slide-down ease .5s;animation-iteration-count:1;-webkit-animation:ap-anim-top-slide-down ease .5s;-webkit-animation-iteration-count:1;-moz-animation:ap-anim-top-slide-down ease .5s;-moz-animation-iteration-count:1;-o-animation:ap-anim-top-slide-down ease .5s;-o-animation-iteration-count:1;-ms-animation:ap-anim-top-slide-down ease .5s;-ms-animation-iteration-count:1;animation-fill-mode:forwards} @keyframes ap-anim-top-slide-down{100%{opacity:1;top:0}} .ap-top-slide-up{opacity:1;animation:ap-anim-top-slide-up ease .5s;animation-iteration-count:1;-webkit-animation:ap-anim-top-slide-up ease .5s;-webkit-animation-iteration-count:1;-moz-animation:ap-anim-top-slide-up ease .5s;-moz-animation-iteration-count:1;-o-animation:ap-anim-top-slide-up ease .5s;-o-animation-iteration-count:1;-ms-animation:ap-anim-top-slide-up ease .5s;-ms-animation-iteration-count:1;animation-fill-mode:forwards} @keyframes ap-anim-top-slide-up{100%{opacity:0;top:-1000px}} .ap-theme-default .ap-button-active{animation:ap-anim-default-button-active ease .5s;animation-iteration-count:1;animation-fill-mode:forwards;-webkit-animation:ap-anim-default-button-active ease .5s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-moz-animation:ap-anim-default-button-active ease .5s;-moz-animation-iteration-count:1;-moz-animation-fill-mode:forwards;-o-animation:ap-anim-default-button-active ease .5s;-o-animation-iteration-count:1;-o-animation-fill-mode:forwards;-ms-animation:ap-anim-default-button-active ease .5s;-ms-animation-iteration-count:1;-ms-animation-fill-mode:forwards} @keyframes ap-anim-default-button-active{100%{background:#E0F2F1}} .ap-component-section{display:table;table-layout:fixed;width:100%;background:#FFF} .ap-loading{width:100%;height:100%;z-index:2;background:#FFF} .ap-component-section,ap-component-section *{box-sizing:border-box;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-user-select:none;-moz-user-select:none;user-select:none;-ms-touch-select:none;touch-action:none} .ap-component{display:table-cell} .ap-component-label{text-align:center;font-size:.7em} .ap-theme-default{color:#009688} .ap-component-plus,.ap-component-minus{background:#FFF;color:#BDBDBD;width:100%;height:40px;line-height:40px;text-align:center;font-size:15px;cursor:pointer} .ap-component-cont{position:relative;overflow:hidden} .ap-component-data{position:absolute;left:0;top:0;width:100%;backface-visibility:hidden;transform-style:preserve-3d;transform:translate3d(0,0,0);perspective:1000px} .ap-row{height:40px;line-height:40px;text-align:center;overflow:hidden;text-overflow:clip;white-space:nowrap;cursor:pointer;color:#000} .ap-row-invalid{color:#FFCDD2} .ap-row-hidden{opacity:0} .ap-component-selector{position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;height:40px;border-top:1px solid #009688;border-bottom:1px solid #009688} .ap-theme-default .ap-component-selector{left:10%;width:80%} .ap-component-gradient{position:absolute;top:-1px;left:0;width:100%;height:102%;cursor:pointer;background:rgba(255,255,255,.8);background:-webkit-gradient(left top,left bottom,color-stop(0%,rgba(255,255,255,.8)),color-stop(30%,rgba(255,255,255,.8)),color-stop(45%,rgba(255,255,255,0)),color-stop(55%,rgba(255,255,255,0)),color-stop(70%,rgba(255,255,255,.8)),color-stop(100%,rgba(255,255,255,.8)));background:linear-gradient(to bottom,rgba(255,255,255,.8) 0,rgba(255,255,255,.8) 30%,rgba(255,255,255,0) 45%,rgba(255,255,255,0) 55%,rgba(255,255,255,.8) 70%,rgba(255,255,255,.8) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0)} .ap-theme-ios.ap-layout-popup .ap-cont,.ap-theme-ios.ap-layout-popover .ap-cont{max-width:320px;width:90%;border-radius:10px;border:1px solid #D7D7D7} .ap-theme-ios.ap-layout-popup,.ap-theme-ios.ap-layout-fixed,.ap-theme-ios.ap-layout-popover{background:rgba(0,0,0,.4)} .ap-theme-ios .ap-tooltip,.ap-theme-ios .ap-tooltip:after{display:inline-block;width:0;height:0;position:absolute;border-width:11px;border-style:solid;z-index:6} .ap-theme-ios .ap-tooltip:after{content:" ";border-width:10px} .ap-theme-ios .ap-tooltip-bottom{top:-22px;left:10px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) #D7D7D7} .ap-dir-rtl.ap-theme-ios .ap-tooltip-bottom{right:10px} .ap-theme-ios .ap-tooltip-bottom:after{top:-8px;left:-10px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) #FFF} .ap-theme-ios .ap-tooltip-top{bottom:-21px;left:16px;border-color:#D7D7D7 rgba(0,0,0,0) rgba(0,0,0,0)} .ap-dir-rtl.ap-theme-ios .ap-tooltip-top{right:16px} .ap-theme-ios .ap-tooltip-top:after{bottom:-8px;left:-10px;border-color:#FFF rgba(0,0,0,0) rgba(0,0,0,0)} .ap-theme-ios .ap-tooltip-left{top:50%;left:-22px;border-color:rgba(0,0,0,0) #D7D7D7 rgba(0,0,0,0) rgba(0,0,0,0);transform:translateY(-50%)} .ap-theme-ios .ap-tooltip-left:after{top:-10px;left:-9px;border-color:rgba(0,0,0,0) #FFF rgba(0,0,0,0) rgba(0,0,0,0)} .ap-theme-ios .ap-tooltip-right{top:50%;right:-22px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0) #D7D7D7;transform:translateY(-50%)} .ap-theme-ios .ap-tooltip-right:after{top:-10px;left:-11px;border-color:rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0) #FFF} .ap-theme-ios .ap-bg{font-size:18px;font-family:sans-serif} .ap-theme-ios .ap-header{height:45px;line-height:45px;text-align:center;border-bottom:1px solid #D7D7D7} .ap-theme-ios .ap-header__title{color:#FF3B30;font-size:1.2em} .ap-theme-ios .ap-button{display:inline-block;cursor:pointer;letter-spacing:0;text-align:center;font-size:1em;height:43px;line-height:47px;background:rgba(255,255,255,1)} .ap-theme-ios .ap-content-top,.ap-theme-ios .ap-content-bottom{font-size:.9em} .ap-theme-ios .ap-footer{padding:0 16px} .ap-theme-ios .ap-footer-top .ap-button{display:inline-block} .ap-theme-ios .ap-button:last-child{float:right;padding:0 0 0 16px;color:#007AFF} .ap-dir-rtl.ap-theme-ios .ap-button:last-child{float:left;padding:0 16px 0 0} .ap-theme-ios .ap-button:not(:last-child){float:left;padding:0 16px 0 0;color:#007AFF} .ap-dir-rtl.ap-theme-ios .ap-button:not(:last-child){float:right;padding:0 0 0 16px} .ap-theme-ios .ap-component-gradient{background:rgba(255,255,255,.7);background:-webkit-gradient(left top,left bottom,color-stop(0%,rgba(255,255,255,.7)),color-stop(40%,rgba(255,255,255,.7)),color-stop(45%,rgba(255,255,255,0)),color-stop(55%,rgba(255,255,255,0)),color-stop(60%,rgba(255,255,255,.7)),color-stop(100%,rgba(255,255,255,.7)));background:linear-gradient(to bottom,rgba(255,255,255,.7) 0,rgba(255,255,255,.7) 40%,rgba(255,255,255,0) 45%,rgba(255,255,255,0) 55%,rgba(255,255,255,.7) 60%,rgba(255,255,255,.7) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0)} .ap-theme-ios .ap-content-middle{padding:10px 25px} .ap-theme-ios .ap-content-switch-tab{border:1px solid #007AFF;font-size:.7em;color:#007AFF} .ap-dir-ltr.ap-theme-ios .ap-content-switch-date{border-top-left-radius:5px;border-bottom-left-radius:5px} .ap-dir-rtl.ap-theme-ios .ap-content-switch-date{border-top-right-radius:5px;border-bottom-right-radius:5px;margin-left:-1px} .ap-dir-ltr.ap-theme-ios .ap-content-switch-time{border-top-right-radius:5px;border-bottom-right-radius:5px;margin-left:-1px} .ap-dir-rtl.ap-theme-ios .ap-content-switch-time{border-top-left-radius:5px;border-bottom-left-radius:5px} .ap-theme-ios .ap-content-switch-selected{background:#007AFF;color:#FFF} .ap-theme-ios .ap-component-plus,.ap-theme-ios .ap-component-minus{color:#BDBDBD} .ap-theme-ios .ap-component-label{color:#007AFF} .ap-theme-ios .ap-row{color:#000;font-size:1.2em} .ap-theme-ios .ap-row-disabled{color:#9E9E9E} .ap-theme-ios .ap-component-selector{left:0;width:100%;border-top:1px solid #D7D7D7;border-bottom:1px solid #D7D7D7} .ap-theme-android.ap-layout-popup,.ap-theme-android .ap-layout-fixed{background:rgba(0,0,0,.6)} .ap-theme-android .ap-bg{font-size:16px;font-family:sans-serif} .ap-theme-android.ap-layout-popup .ap-cont{max-width:300px} .ap-theme-android:not(.ap-layout-inline):not(.ap-layout-relative) .ap-cont{box-shadow:0 3px 5px #111,0 0 5px #111} .ap-theme-android.ap-layout-popup .ap-cont{width:85%} .ap-theme-android .ap-header{text-align:left;height:65px;line-height:65px;border-bottom:2px solid #33B5E5} .ap-dir-rtl.ap-theme-android .ap-header{text-align:right} .ap-theme-android .ap-header__title{color:#33B5E5;font-size:1.45em} .ap-theme-android .ap-footer{height:45px} .ap-theme-android .ap-button{display:table-cell;cursor:pointer;letter-spacing:0;text-align:center;font-size:.9em;height:45px;line-height:45px;color:#000;background:rgba(255,255,255,1);border-top:1px solid #DCDCDC} .ap-theme-android .ap-footer-bottom .ap-button{border-top:1px solid #DCDCDC} .ap-theme-android .ap-footer-top{border-bottom:1px solid #DCDCDC} .ap-dir-ltr.ap-theme-android .ap-button:not(:last-child){border-right:1px solid #DCDCDC} .ap-dir-rtl.ap-theme-android .ap-button:not(:last-child){border-left:1px solid #DCDCDC} .ap-theme-android .ap-footer-top .ap-button{display:table-cell;cursor:pointer;letter-spacing:0;text-align:center;font-size:.8em;height:40px;line-height:40px;padding:0 16px;color:#000;background:rgba(255,255,255,1)} .ap-dir-ltr.ap-theme-android .ap-layout-fixed .ap-button:not(:last-child){border-right:0;float:left} .ap-dir-rtl.ap-theme-android .ap-layout-fixed .ap-button:not(:last-child){border-left:0;float:right} .ap-theme-android .ap-component-gradient{background:rgba(255,255,255,1);background:-webkit-gradient(left top,left bottom,color-stop(0%,rgba(255,255,255,1)),color-stop(5%,rgba(255,255,255,.85)),color-stop(24%,rgba(255,255,255,.45)),color-stop(25%,rgba(255,255,255,0)),color-stop(43%,rgba(255,255,255,0)),color-stop(51%,rgba(255,255,255,0)),color-stop(71%,rgba(255,255,255,0)),color-stop(75%,rgba(255,255,255,0)),color-stop(76%,rgba(255,255,255,.45)),color-stop(95%,rgba(255,255,255,.85)),color-stop(100%,rgba(255,255,255,1)));background:linear-gradient(to bottom,rgba(255,255,255,1) 0,rgba(255,255,255,.85) 5%,rgba(255,255,255,.45) 24%,rgba(255,255,255,0) 25%,rgba(255,255,255,0) 43%,rgba(255,255,255,0) 51%,rgba(255,255,255,0) 71%,rgba(255,255,255,0) 75%,rgba(255,255,255,.45) 76%,rgba(255,255,255,.85) 95%,rgba(255,255,255,1) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0)} .ap-theme-android .ap-content-middle{padding:25px 32px} .ap-theme-android .ap-content-switch-tab{border:1px solid #6BC8E9;font-size:.7em;color:#6BC8E9;text-transform:uppercase} .ap-theme-android .ap-content-switch-selected{background:#6BC8E9;color:#FFF} .ap-theme-android .ap-component-plus,.ap-theme-android .ap-component-minus{color:#BDBDBD} .ap-theme-android .ap-component-label{color:#6BC8E9;font-size:.85em} .ap-theme-android .ap-row{color:#000;font-size:1.1em} .ap-theme-android .ap-row-disabled{color:#9E9E9E} .ap-theme-android .ap-component-selector{left:10%;width:80%;border-top:2px solid #6BC8E9;border-bottom:2px solid #6BC8E9} .ap-theme-android .ap-button-active{animation:ap-anim-android-button-active ease .5s;animation-iteration-count:1;animation-fill-mode:forwards;-webkit-animation:ap-anim-android-button-active ease .5s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-moz-animation:ap-anim-android-button-active ease .5s;-moz-animation-iteration-count:1;-moz-animation-fill-mode:forwards;-o-animation:ap-anim-android-button-active ease .5s;-o-animation-iteration-count:1;-o-animation-fill-mode:forwards;-ms-animation:ap-anim-android-button-active ease .5s;-ms-animation-iteration-count:1;-ms-animation-fill-mode:forwards} @keyframes ap-anim-android-button-active{100%{background:#F5F5F5}} .ap-theme-windows.ap-layout-popup,.ap-theme-windows.ap-layout-popup *{background:#181C18} .ap-theme-windows.ap-layout-popup .ap-cont{width:100%;height:100%;max-width:100%} .ap-theme-windows .ap-bg{font-size:18px;font-family:sans-serif} .ap-theme-windows .ap-header{position:absolute;top:0;left:0;width:100%;height:60px;line-height:75px;text-align:left;text-transform:uppercase;z-index:2} .ap-theme-windows .ap-header__title{color:#FFF;font-size:1em} .ap-theme-windows .ap-button{display:inline-block;cursor:pointer;letter-spacing:0;text-align:center;font-size:1em;height:30px;max-width:50px;margin-left:4px;margin-right:4px;color:#FFF} .ap-theme-windows .ap-button-icon{height:32px;font-size:32px;position:relative;bottom:-8px} .ap-theme-windows .ap-button-text{display:inline-block;width:100%;font-size:.5em;text-transform:lowercase;position:relative;bottom:0} .ap-theme-windows .ap-content{position:absolute;top:0;left:0;height:100%;width:100%;z-index:1;max-width:none} .ap-theme-windows .ap-content-top,.ap-theme-windows .ap-content-bottom{font-size:.9em} .ap-theme-windows .ap-content-top{position:absolute;top:60px;width:100%;z-index:2;height:auto;padding:4px 16px} .ap-theme-windows .ap-content-bottom{position:absolute;bottom:59px;width:100%;z-index:2;height:auto;padding:2px 16px} .ap-theme-windows .ap-footer{position:absolute;bottom:0;left:0;width:100%;height:50px;padding:0 16px;text-align:center;z-index:2} .ap-theme-windows .ap-component-gradient{background:transparent} .ap-theme-windows .ap-content-middle{padding:0 10px} .ap-theme-windows .ap-content-switch{display:inline-block;height:0;float:right;margin-right:2px;margin-top:0;margin-bottom:0} .ap-theme-windows .ap-content-switch-tab{border:1px solid #ADADAD;font-size:.7em;color:#ADADAD} .ap-dir-ltr.ap-theme-windows .ap-content-switch-date{border-top-left-radius:0;border-bottom-left-radius:0} .ap-dir-rtl.ap-theme-windows .ap-content-switch-date{border-top-right-radius:0;border-bottom-right-radius:0;margin-left:-1px} .ap-dir-ltr.ap-theme-windows .ap-content-switch-time{border-top-right-radius:0;border-bottom-right-radius:0;margin-left:-2px} .ap-dir-rtl.ap-theme-windows .ap-content-switch-time{border-top-left-radius:0;border-bottom-left-radius:0} .ap-theme-windows .ap-content-switch-selected{background:#ADADAD!important;color:#181C18} .ap-theme-windows .ap-component-plus,.ap-theme-ios .ap-component-minus{color:#BDBDBD} .ap-theme-windows .ap-component-label{color:#007AFF} .ap-theme-windows .ap-row{color:#FFF} .ap-theme-windows .ap-row-content{background:transparent;font-size:1.8em;text-align:left;width:100%;height:80px;line-height:80px;padding-left:4px;position:absolute;bottom:0;left:0} .ap-theme-windows .ap-row-label{background:transparent;font-size:.7em;text-transform:lowercase;text-align:left;padding-left:3px;width:100%;height:20px;line-height:20px;position:absolute;bottom:0;left:0} .ap-theme-windows .ap-row-bg{position:relative;margin:4px;border:2px solid #181C18} .ap-theme-windows .ap-row-selected .ap-row-bg{background:#4B4D4A!important;border:2px solid #4B4D4A} .ap-theme-windows .ap-row-selected .ap-row-content{color:#FFF!important} .ap-theme-windows .ap-row-selected .ap-row-label{color:#A7A8A7!important} .ap-theme-windows .ap-component:not(.ap-component-modifying) .ap-row-content{color:transparent} .ap-theme-windows .ap-component:not(.ap-component-modifying) .ap-row-label{color:transparent} .ap-theme-windows .ap-component.ap-component-modifying .ap-row-bg{border:2px solid #4B4D4A} .ap-theme-windows .ap-component.ap-component-modifying .ap-row-content{color:#ADADAD} .ap-theme-windows .ap-component.ap-component-modifying .ap-row-label{color:#5F5F5F} .ap-theme-windows .ap-component.ap-component-modifying .ap-row-content{color:#ADADAD} .ap-theme-windows .ap-component.ap-component-modifying .ap-row-bg{color:#000} .ap-theme-windows .ap-row-disabled{color:#9E9E9E} .ap-theme-windows .ap-component-selector{left:0;width:100%;border-top:0;border-bottom:0;background:transparent} @media only screen and (orientation :landscape){.ap-theme-windows .ap-header{height:40px;line-height:40px}.ap-theme-windows .ap-content-top{top:31px}.ap-theme-windows .ap-content-bottom{bottom:60px}.ap-theme-windows .ap-row-content{font-size:1.3em;height:60px;line-height:60px}.ap-theme-windows .ap-row-label{font-size:.6em}.ap-theme-windows .ap-button-icon{height:24px;font-size:24px;position:relative;bottom:-12px}} @font-face{font-family:anypicker-font;src:url('anypicker-font.eot')} @font-face{font-family:anypicker-font;src:url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SAvQAAAC8AAAAYGNtYXDmP+C4AAABHAAAAFxnYXNwAAAAEAAAAXgAAAAIZ2x5Zk9FXHgAAAGAAAAEFGhlYWQGjJupAAAFlAAAADZoaGVhB8IDzQAABcwAAAAkaG10eCYAAAAAAAXwAAAAMGxvY2EEPgMmAAAGIAAAABptYXhwABAAUQAABjwAAAAgbmFtZTvtFloAAAZcAAABznBvc3QAAwAAAAAILAAAACAAAwPHAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADmAwPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAQAAAAAwACAACAAQAAQAg4APmA//9//8AAAAAACDgAOYA//3//wAB/+MgBBoIAAMAAQAAAAAAAAAAAAAAAAABAAH//wAPAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAADABAACwAADAAAlIQkBBAD8AAIAAgDAAgD+AAAAAQAAAHcEAAMJAAUAAAEnCQEHAQQAkf6R/pGRAgACd5L+kQFvkv4AAAEAAADABAACwAACAAATCQEAAgACAALA/gACAAABAAAAcgP6AwgAGwAACQEmIgcBDgEVFBYfAR4BMzI2NwkBFjI/ATY0JwP6/hUGEgb+FQMDAwOIAwcEBAgDAVUBVQYSBYgGBgEdAesGBv4VAwgEBAgCiAMDAwMBVf6rBgaIBhEGAAAAAAMAAP/ABAADwAAUACkAPwAAASIOAhUUHgIzMj4CNTQuAiMRIi4CNTQ+AjMyHgIVFA4CIxMjNTQmKwEiBh0BFBY7ATI2PQE0JiMCAGq7i1BQi7tqaruLUFCLu2pYmnJDQ3KaWFiackNDcppYvZAUDhYOFBQOyA4UFA4DwFCLu2pqu4tQUIu7amq7i1D8WUNymlhYmnJDQ3KaWFiackMB1KYOFBQO3g4UFA4WDhQAAAAAAwAA/8AEAAPAABQAKQBLAAABIg4CFRQeAjMyPgI1NC4CIxEiLgI1ND4CMzIeAhUUDgIjEyYiDwEnJiIPAQYUHwEUMBUXFDIxFxYyPwE+AT8BNjQvAQIAaruLUFCLu2pqu4tQUIu7aliackNDcppYWJpyQ0NymlipChsKm1oKHAoQCgpxEAECChwKEAMEAagKChADwFCLu2pqu4tQUIu7amq7i1D8WUNymlhYmnJDQ3KaWFiackMCHQoKm1oKChAKHApwAQEPAQIKChECBwSoChwJEAADAAD/wAQAA8AAFAApAE4AAAEiDgIVFB4CMzI+AjU0LgIjESIuAjU0PgIzMh4CFRQOAiMTJyYiDwEnJiIPAQYUHwEHBhQfARYyPwEXFjI/ATY0LwE3NjQnAgBqu4tQUIu7amq7i1BQi7tqWJpyQ0NymlhYmnJDQ3KaWKMQChwJZGQJHAoQCQlkZAkJEAocCWRkCRwKEAkJZGQJCQPAUIu7amq7i1BQi7tqaruLUPxZQ3KaWFiackNDcppYWJpyQwI6EAkJZGQJCRAKHAlkZAkcChAJCWRkCQkQChwJZGQJHAoAAAADAAD/wAQAA8AAFAApADoAAAEiDgIVFB4CMzI+AjU0LgIjESIuAjU0PgIzMh4CFRQOAiMTISIGHQEUFjMhMjY9ATQmIwIAaruLUFCLu2pqu4tQUIu7aliackNDcppYWJpyQ0Nymlin/rIOExMOAU4OExMOA8BQi7tqaruLUFCLu2pqu4tQ/FlDcppYWJpyQ0NymlhYmnJDAdQUDhYOFBQOFg4UAAEAAAABGZrL7g4nXw889QALBAAAAAAA0baeyQAAAADRtp7JAAD/wAQAA8AAAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAABAAAAQAAAAAAAAAAAAAAAAAAAAwEAAAAAAAAAAAAAAACAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAAAAAAAAoAFAAeAC4AQgBQAIQA3AFGAbgCCgAAAAEAAAAMAE8AAwAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQANAAAAAQAAAAAAAgAHAJYAAQAAAAAAAwANAEgAAQAAAAAABAANAKsAAQAAAAAABQALACcAAQAAAAAABgANAG8AAQAAAAAACgAaANIAAwABBAkAAQAaAA0AAwABBAkAAgAOAJ0AAwABBAkAAwAaAFUAAwABBAkABAAaALgAAwABBAkABQAWADIAAwABBAkABgAaAHwAAwABBAkACgA0AOxBbnlQaWNrZXJGb250AEEAbgB5AFAAaQBjAGsAZQByAEYAbwBuAHRWZXJzaW9uIDEuMQBWAGUAcgBzAGkAbwBuACAAMQAuADFBbnlQaWNrZXJGb250AEEAbgB5AFAAaQBjAGsAZQByAEYAbwBuAHRBbnlQaWNrZXJGb250AEEAbgB5AFAAaQBjAGsAZQByAEYAbwBuAHRSZWd1bGFyAFIAZQBnAHUAbABhAHJBbnlQaWNrZXJGb250AEEAbgB5AFAAaQBjAGsAZQByAEYAbwBuAHRGb250IGdlbmVyYXRlZCBieSBJY29Nb29uLgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype');font-weight:400;font-style:normal} [class^=ap-icon-],[class*=" ap-icon-"]{font-family:anypicker-font;speak:none;font-style:normal;font-weight:400;font-feature-settings:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale} .ap-icon-now:before{content:"\e600"} .ap-icon-set:before{content:"\e601"} .ap-icon-cancel:before{content:"\e602"} .ap-icon-clear:before{content:"\e603"} .ap-icon-arrow-up-filled:before{content:"\e000"} .ap-icon-arrow-down:before{content:"\e001"} .ap-icon-arrow-down-filled:before{content:"\e002"} .ap-icon-arrow-up:before{content:"\e003"} .swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1} .swiper-container-no-flexbox .swiper-slide{float:left} .swiper-container-vertical>.swiper-wrapper{flex-direction:column} .swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box} .swiper-container-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)} .swiper-container-multirow>.swiper-wrapper{flex-wrap:wrap} .swiper-container-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto} .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform} .swiper-invisible-blank-slide{visibility:hidden} .swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto} .swiper-container-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height} .swiper-container-3d{perspective:1200px} .swiper-container-3d .swiper-wrapper,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-cube-shadow{transform-style:preserve-3d} .swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10} .swiper-container-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,0.5),rgba(0,0,0,0))} .swiper-container-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,0.5),rgba(0,0,0,0))} .swiper-container-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,0.5),rgba(0,0,0,0))} .swiper-container-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,0.5),rgba(0,0,0,0))} .swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{touch-action:pan-y} .swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{touch-action:pan-x} .swiper-button-prev,.swiper-button-next{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat} .swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none} .swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:10px;right:auto} .swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:10px;left:auto} .swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNyA0NCI+PHBhdGggZD0iTTAgMjIgMjIgMGwyLjEgMi4xTDQuMiAyMmwxOS45IDE5LjlMMjIgNDQgMCAyMnYwIDB6IiBmaWxsPSIjZmZmIi8+PC9zdmc+)} .swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNyA0NCI+PHBhdGggZD0iTTI3IDIydjBMNSA0NGwtMi4xLTIuMUwyMi44IDIyIDIuOSAyLjEgNSAwIDI3IDIydjB6IiBmaWxsPSIjZmZmIi8+PC9zdmc+)} .swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNyA0NCI+PHBhdGggZD0iTTAgMjIgMjIgMGwyLjEgMi4xTDQuMiAyMmwxOS45IDE5LjlMMjIgNDQgMCAyMnYwIDB6IiBmaWxsPSIjMDAwIi8+PC9zdmc+)} .swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNyA0NCI+PHBhdGggZD0iTTI3IDIydjBMNSA0NGwtMi4xLTIuMUwyMi44IDIyIDIuOSAyLjEgNSAwIDI3IDIydjB6IiBmaWxsPSIjMDAwIi8+PC9zdmc+)} .swiper-button-lock{display:none} .swiper-pagination{position:absolute;text-align:center;transition:300ms opacity;transform:translate3d(0,0,0);z-index:10} .swiper-pagination.swiper-pagination-hidden{opacity:0} .swiper-pagination-fraction,.swiper-pagination-custom,.swiper-container-horizontal>.swiper-pagination-bullets{bottom:10px;left:0;width:100%} .swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)} .swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2} button.swiper-pagination-bullet{border:0;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none} .swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer} .swiper-pagination-bullet-active{opacity:1;background:#007aff} .swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)} .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block} .swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px} .swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:200ms transform,200ms top} .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px} .swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap} .swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:200ms transform,200ms left} .swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:200ms transform,200ms right} .swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute} .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top} .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top} .swiper-container-horizontal>.swiper-pagination-progressbar{width:100%;height:4px;left:0;top:0} .swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0} .swiper-pagination-white .swiper-pagination-bullet-active{background:#fff} .swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255,255,255,.25)} .swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#fff} .swiper-pagination-black .swiper-pagination-bullet-active{background:#000} .swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0,0,0,.25)} .swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000} .swiper-pagination-lock{display:none} .swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)} .swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%} .swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%} .swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0} .swiper-scrollbar-cursor-drag{cursor:move} .swiper-scrollbar-lock{display:none} .swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center} .swiper-zoom-container>img,.swiper-zoom-container>svg,.swiper-zoom-container>canvas{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain} .swiper-slide-zoomed{cursor:move} .swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;animation:swiper-preloader-spin 1s steps(12,end) infinite} .swiper-lazy-preloader:after{display:block;content:'';width:100%;height:100%;background-image:url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTIwIDEyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PGRlZnM+PHBhdGggaWQ9ImwiIGQ9Ik02MCA3VjI3eiIgc3Ryb2tlPSIjNmM2YzZjIiBzdHJva2Utd2lkdGg9IjExIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L2RlZnM+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjI3Ii8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjI3IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCA2MCw2MCkiLz48dXNlIHhsaW5rOmhyZWY9IiNsIiBvcGFjaXR5PSIuMjciIHRyYW5zZm9ybT0icm90YXRlKDYwIDYwLDYwKSIvPjx1c2UgeGxpbms6aHJlZj0iI2wiIG9wYWNpdHk9Ii4yNyIgdHJhbnNmb3JtPSJyb3RhdGUoOTAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjI3IiB0cmFuc2Zvcm09InJvdGF0ZSgxMjAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjI3IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjM3IiB0cmFuc2Zvcm09InJvdGF0ZSgxODAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjQ2IiB0cmFuc2Zvcm09InJvdGF0ZSgyMTAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjU2IiB0cmFuc2Zvcm09InJvdGF0ZSgyNDAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjY2IiB0cmFuc2Zvcm09InJvdGF0ZSgyNzAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjc1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMDAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjg1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMzAgNjAsNjApIi8+PC9zdmc+);background-position:50%;background-size:100%;background-repeat:no-repeat} .swiper-lazy-preloader-white:after{background-image:url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTIwIDEyMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PGRlZnM+PHBhdGggaWQ9ImwiIGQ9Ik02MCA3VjI3eiIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjExIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz48L2RlZnM+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjI3Ii8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjI3IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCA2MCw2MCkiLz48dXNlIHhsaW5rOmhyZWY9IiNsIiBvcGFjaXR5PSIuMjciIHRyYW5zZm9ybT0icm90YXRlKDYwIDYwLDYwKSIvPjx1c2UgeGxpbms6aHJlZj0iI2wiIG9wYWNpdHk9Ii4yNyIgdHJhbnNmb3JtPSJyb3RhdGUoOTAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjI3IiB0cmFuc2Zvcm09InJvdGF0ZSgxMjAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjI3IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjM3IiB0cmFuc2Zvcm09InJvdGF0ZSgxODAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjQ2IiB0cmFuc2Zvcm09InJvdGF0ZSgyMTAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjU2IiB0cmFuc2Zvcm09InJvdGF0ZSgyNDAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjY2IiB0cmFuc2Zvcm09InJvdGF0ZSgyNzAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjc1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMDAgNjAsNjApIi8+PHVzZSB4bGluazpocmVmPSIjbCIgb3BhY2l0eT0iLjg1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMzAgNjAsNjApIi8+PC9zdmc+)} @keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}} .swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000} .swiper-container-fade.swiper-container-free-mode .swiper-slide{transition-timing-function:ease-out} .swiper-container-fade .swiper-slide{pointer-events:none;transition-property:opacity} .swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none} .swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-container-cube{overflow:visible} .swiper-container-cube .swiper-slide{pointer-events:none;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%} .swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none} .swiper-container-cube.swiper-container-rtl .swiper-slide{transform-origin:100% 0} .swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-prev,.swiper-container-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible} .swiper-container-cube .swiper-slide-shadow-top,.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right{z-index:0;backface-visibility:hidden} .swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;filter:blur(50px);z-index:0} .swiper-container-flip{overflow:visible} .swiper-container-flip .swiper-slide{pointer-events:none;backface-visibility:hidden;z-index:1} .swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none} .swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-container-flip .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right{z-index:0;backface-visibility:hidden} .swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px} @font-face { font-family: 'primeicons'; font-display: auto; src: url('primeicons.eot'); src: url('primeicons.eot?#iefix') format('embedded-opentype'), url('primeicons.ttf') format('truetype'), url('primeicons.woff') format('woff'), url('primeicons.svg?#primeicons') format('svg'); font-weight: normal; font-style: normal; } .pi { font-family: 'primeicons'; speak: none; font-style: normal; font-weight: normal; font-feature-settings: normal; font-variant: normal; text-transform: none; line-height: 1; display: inline-block; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .pi:before { --webkit-backface-visibility:hidden; backface-visibility: hidden; } .pi-fw { width: 1.28571429em; text-align: center; } .pi-spin { animation: fa-spin 2s infinite linear; } @keyframes fa-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(359deg); } } .pi-send:before { content: "\e9ca"; } .pi-slack:before { content: "\e9c9"; } .pi-sun:before { content: "\e9c8"; } .pi-moon:before { content: "\e9c7"; } .pi-vimeo:before { content: "\e9c6"; } .pi-youtube:before { content: "\e9c5"; } .pi-flag:before { content: "\e9c4"; } .pi-wallet:before { content: "\e9c3"; } .pi-map:before { content: "\e9c2"; } .pi-link:before { content: "\e9c1"; } .pi-credit-card:before { content: "\e9bf"; } .pi-discord:before { content: "\e9c0"; } .pi-percentage:before { content: "\e9be"; } .pi-euro:before { content: "\e9bd"; } .pi-book:before { content: "\e9ba"; } .pi-shield:before { content: "\e9b9"; } .pi-paypal:before { content: "\e9bb"; } .pi-amazon:before { content: "\e9bc"; } .pi-phone:before { content: "\e9b8"; } .pi-filter-slash:before { content: "\e9b7"; } .pi-facebook:before { content: "\e9b4"; } .pi-github:before { content: "\e9b5"; } .pi-twitter:before { content: "\e9b6"; } .pi-step-backward-alt:before { content: "\e9ac"; } .pi-step-forward-alt:before { content: "\e9ad"; } .pi-forward:before { content: "\e9ae"; } .pi-backward:before { content: "\e9af"; } .pi-fast-backward:before { content: "\e9b0"; } .pi-fast-forward:before { content: "\e9b1"; } .pi-pause:before { content: "\e9b2"; } .pi-play:before { content: "\e9b3"; } .pi-compass:before { content: "\e9ab"; } .pi-id-card:before { content: "\e9aa"; } .pi-ticket:before { content: "\e9a9"; } .pi-file-o:before { content: "\e9a8"; } .pi-reply:before { content: "\e9a7"; } .pi-directions-alt:before { content: "\e9a5"; } .pi-directions:before { content: "\e9a6"; } .pi-thumbs-up:before { content: "\e9a3"; } .pi-thumbs-down:before { content: "\e9a4"; } .pi-sort-numeric-down-alt:before { content: "\e996"; } .pi-sort-numeric-up-alt:before { content: "\e997"; } .pi-sort-alpha-down-alt:before { content: "\e998"; } .pi-sort-alpha-up-alt:before { content: "\e999"; } .pi-sort-numeric-down:before { content: "\e99a"; } .pi-sort-numeric-up:before { content: "\e99b"; } .pi-sort-alpha-down:before { content: "\e99c"; } .pi-sort-alpha-up:before { content: "\e99d"; } .pi-sort-alt:before { content: "\e99e"; } .pi-sort-amount-up:before { content: "\e99f"; } .pi-sort-amount-down:before { content: "\e9a0"; } .pi-sort-amount-down-alt:before { content: "\e9a1"; } .pi-sort-amount-up-alt:before { content: "\e9a2"; } .pi-palette:before { content: "\e995"; } .pi-undo:before { content: "\e994"; } .pi-desktop:before { content: "\e993"; } .pi-sliders-v:before { content: "\e991"; } .pi-sliders-h:before { content: "\e992"; } .pi-search-plus:before { content: "\e98f"; } .pi-search-minus:before { content: "\e990"; } .pi-file-excel:before { content: "\e98e"; } .pi-file-pdf:before { content: "\e98d"; } .pi-check-square:before { content: "\e98c"; } .pi-chart-line:before { content: "\e98b"; } .pi-user-edit:before { content: "\e98a"; } .pi-exclamation-circle:before { content: "\e989"; } .pi-android:before { content: "\e985"; } .pi-google:before { content: "\e986"; } .pi-apple:before { content: "\e987"; } .pi-microsoft:before { content: "\e988"; } .pi-heart:before { content: "\e984"; } .pi-mobile:before { content: "\e982"; } .pi-tablet:before { content: "\e983"; } .pi-key:before { content: "\e981"; } .pi-shopping-cart:before { content: "\e980"; } .pi-comments:before { content: "\e97e"; } .pi-comment:before { content: "\e97f"; } .pi-briefcase:before { content: "\e97d"; } .pi-bell:before { content: "\e97c"; } .pi-paperclip:before { content: "\e97b"; } .pi-share-alt:before { content: "\e97a"; } .pi-envelope:before { content: "\e979"; } .pi-volume-down:before { content: "\e976"; } .pi-volume-up:before { content: "\e977"; } .pi-volume-off:before { content: "\e978"; } .pi-eject:before { content: "\e975"; } .pi-money-bill:before { content: "\e974"; } .pi-images:before { content: "\e973"; } .pi-image:before { content: "\e972"; } .pi-sign-in:before { content: "\e970"; } .pi-sign-out:before { content: "\e971"; } .pi-wifi:before { content: "\e96f"; } .pi-sitemap:before { content: "\e96e"; } .pi-chart-bar:before { content: "\e96d"; } .pi-camera:before { content: "\e96c"; } .pi-dollar:before { content: "\e96b"; } .pi-lock-open:before { content: "\e96a"; } .pi-table:before { content: "\e969"; } .pi-map-marker:before { content: "\e968"; } .pi-list:before { content: "\e967"; } .pi-eye-slash:before { content: "\e965"; } .pi-eye:before { content: "\e966"; } .pi-folder-open:before { content: "\e964"; } .pi-folder:before { content: "\e963"; } .pi-video:before { content: "\e962"; } .pi-inbox:before { content: "\e961"; } .pi-lock:before { content: "\e95f"; } .pi-unlock:before { content: "\e960"; } .pi-tags:before { content: "\e95d"; } .pi-tag:before { content: "\e95e"; } .pi-power-off:before { content: "\e95c"; } .pi-save:before { content: "\e95b"; } .pi-question-circle:before { content: "\e959"; } .pi-question:before { content: "\e95a"; } .pi-copy:before { content: "\e957"; } .pi-file:before { content: "\e958"; } .pi-clone:before { content: "\e955"; } .pi-calendar-times:before { content: "\e952"; } .pi-calendar-minus:before { content: "\e953"; } .pi-calendar-plus:before { content: "\e954"; } .pi-ellipsis-v:before { content: "\e950"; } .pi-ellipsis-h:before { content: "\e951"; } .pi-bookmark:before { content: "\e94e"; } .pi-globe:before { content: "\e94f"; } .pi-replay:before { content: "\e94d"; } .pi-filter:before { content: "\e94c"; } .pi-print:before { content: "\e94b"; } .pi-align-right:before { content: "\e946"; } .pi-align-left:before { content: "\e947"; } .pi-align-center:before { content: "\e948"; } .pi-align-justify:before { content: "\e949"; } .pi-cog:before { content: "\e94a"; } .pi-cloud-download:before { content: "\e943"; } .pi-cloud-upload:before { content: "\e944"; } .pi-cloud:before { content: "\e945"; } .pi-pencil:before { content: "\e942"; } .pi-users:before { content: "\e941"; } .pi-clock:before { content: "\e940"; } .pi-user-minus:before { content: "\e93e"; } .pi-user-plus:before { content: "\e93f"; } .pi-trash:before { content: "\e93d"; } .pi-external-link:before { content: "\e93c"; } .pi-window-maximize:before { content: "\e93b"; } .pi-window-minimize:before { content: "\e93a"; } .pi-refresh:before { content: "\e938"; } .pi-user:before { content: "\e939"; } .pi-exclamation-triangle:before { content: "\e922"; } .pi-calendar:before { content: "\e927"; } .pi-chevron-circle-left:before { content: "\e928"; } .pi-chevron-circle-down:before { content: "\e929"; } .pi-chevron-circle-right:before { content: "\e92a"; } .pi-chevron-circle-up:before { content: "\e92b"; } .pi-angle-double-down:before { content: "\e92c"; } .pi-angle-double-left:before { content: "\e92d"; } .pi-angle-double-right:before { content: "\e92e"; } .pi-angle-double-up:before { content: "\e92f"; } .pi-angle-down:before { content: "\e930"; } .pi-angle-left:before { content: "\e931"; } .pi-angle-right:before { content: "\e932"; } .pi-angle-up:before { content: "\e933"; } .pi-upload:before { content: "\e934"; } .pi-download:before { content: "\e956"; } .pi-ban:before { content: "\e935"; } .pi-star-o:before { content: "\e936"; } .pi-star:before { content: "\e937"; } .pi-chevron-left:before { content: "\e900"; } .pi-chevron-right:before { content: "\e901"; } .pi-chevron-down:before { content: "\e902"; } .pi-chevron-up:before { content: "\e903"; } .pi-caret-left:before { content: "\e904"; } .pi-caret-right:before { content: "\e905"; } .pi-caret-down:before { content: "\e906"; } .pi-caret-up:before { content: "\e907"; } .pi-search:before { content: "\e908"; } .pi-check:before { content: "\e909"; } .pi-check-circle:before { content: "\e90a"; } .pi-times:before { content: "\e90b"; } .pi-times-circle:before { content: "\e90c"; } .pi-plus:before { content: "\e90d"; } .pi-plus-circle:before { content: "\e90e"; } .pi-minus:before { content: "\e90f"; } .pi-minus-circle:before { content: "\e910"; } .pi-circle-on:before { content: "\e911"; } .pi-circle-off:before { content: "\e912"; } .pi-sort-down:before { content: "\e913"; } .pi-sort-up:before { content: "\e914"; } .pi-sort:before { content: "\e915"; } .pi-step-backward:before { content: "\e916"; } .pi-step-forward:before { content: "\e917"; } .pi-th-large:before { content: "\e918"; } .pi-arrow-down:before { content: "\e919"; } .pi-arrow-left:before { content: "\e91a"; } .pi-arrow-right:before { content: "\e91b"; } .pi-arrow-up:before { content: "\e91c"; } .pi-bars:before { content: "\e91d"; } .pi-arrow-circle-down:before { content: "\e91e"; } .pi-arrow-circle-left:before { content: "\e91f"; } .pi-arrow-circle-right:before { content: "\e920"; } .pi-arrow-circle-up:before { content: "\e921"; } .pi-info:before { content: "\e923"; } .pi-info-circle:before { content: "\e924"; } .pi-home:before { content: "\e925"; } .pi-spinner:before { content: "\e926"; } :root { --surface-a:#ffffff; --surface-b:#f8f9fa; --surface-c:#e9ecef; --surface-d:#dee2e6; --surface-e:#ffffff; --surface-f:#ffffff; --text-color:#495057; --text-color-secondary:#6c757d; --primary-color:#2196F3; --primary-color-text:#ffffff; --font-family:-apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; } * { box-sizing: border-box; } .p-component { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 1rem; font-weight: normal; } .p-component-overlay { background-color: rgba(0, 0, 0, 0.4); transition-duration: 0.2s; } .p-disabled, .p-component:disabled { opacity: 0.6; } .p-error, .p-invalid { color: #f44336; } .p-text-secondary { color: #6c757d; } .pi { font-size: 1rem; } .p-link { font-size: 1rem; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; border-radius: 3px; } .p-link:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-autocomplete .p-autocomplete-loader { right: 0.5rem; } .p-autocomplete.p-autocomplete-dd .p-autocomplete-loader { right: 2.857rem; } .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container { padding: 0.25rem 0.5rem; } .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover { border-color: #2196F3; } .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: #2196F3; } .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container .p-autocomplete-input-token { padding: 0.25rem 0; } .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container .p-autocomplete-input-token input { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 1rem; color: #495057; padding: 0; margin: 0; } .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container .p-autocomplete-token { padding: 0.25rem 0.5rem; margin-right: 0.5rem; background: #E3F2FD; color: #495057; border-radius: 3px; } .p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon { margin-left: 0.5rem; } .p-autocomplete.p-error > .p-inputtext, .p-autocomplete.p-invalid > .p-inputtext { border-color: #f44336; } p-autocomplete.ng-dirty.ng-invalid > .p-autocomplete > .p-inputtext { border-color: #f44336; } .p-autocomplete-panel { background: #ffffff; color: #495057; border: 0 none; border-radius: 3px; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-autocomplete-panel .p-autocomplete-items { padding: 0.5rem 0; } .p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item { margin: 0; padding: 0.5rem 1rem; border: 0 none; color: #495057; background: transparent; transition: box-shadow 0.2s; border-radius: 0; } .p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item:hover { color: #495057; background: #e9ecef; } .p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item.p-highlight { color: #495057; background: #E3F2FD; } .p-calendar.p-error > .p-inputtext, .p-calendar.p-invalid > .p-inputtext { border-color: #f44336; } p-calendar.ng-dirty.ng-invalid > .p-calendar > .p-inputtext { border-color: #f44336; } .p-datepicker { padding: 0.5rem; background: #ffffff; color: #495057; border: 1px solid #ced4da; border-radius: 3px; } .p-datepicker:not(.p-datepicker-inline) { background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-datepicker:not(.p-datepicker-inline) .p-datepicker-header { background: #ffffff; } .p-datepicker .p-datepicker-header { padding: 0.5rem; color: #495057; background: #ffffff; font-weight: 600; margin: 0; border-bottom: 1px solid #dee2e6; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-datepicker .p-datepicker-header .p-datepicker-prev, .p-datepicker .p-datepicker-header .p-datepicker-next { width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-datepicker .p-datepicker-header .p-datepicker-prev:enabled:hover, .p-datepicker .p-datepicker-header .p-datepicker-next:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-datepicker .p-datepicker-header .p-datepicker-prev:focus, .p-datepicker .p-datepicker-header .p-datepicker-next:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-datepicker .p-datepicker-header .p-datepicker-title { line-height: 2rem; } .p-datepicker .p-datepicker-header .p-datepicker-title select { transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .p-datepicker .p-datepicker-header .p-datepicker-title select:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: #2196F3; } .p-datepicker .p-datepicker-header .p-datepicker-title .p-datepicker-month { margin-right: 0.5rem; } .p-datepicker table { font-size: 1rem; margin: 0.5rem 0; } .p-datepicker table th { padding: 0.5rem; } .p-datepicker table th > span { width: 2.5rem; height: 2.5rem; } .p-datepicker table td { padding: 0.5rem; } .p-datepicker table td > span { width: 2.5rem; height: 2.5rem; border-radius: 50%; transition: box-shadow 0.2s; border: 1px solid transparent; } .p-datepicker table td > span.p-highlight { color: #495057; background: #E3F2FD; } .p-datepicker table td > span:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-datepicker table td.p-datepicker-today > span { background: #ced4da; color: #495057; border-color: transparent; } .p-datepicker table td.p-datepicker-today > span.p-highlight { color: #495057; background: #E3F2FD; } .p-datepicker .p-datepicker-buttonbar { padding: 1rem 0; border-top: 1px solid #dee2e6; } .p-datepicker .p-datepicker-buttonbar .p-button { width: auto; } .p-datepicker .p-timepicker { border-top: 1px solid #dee2e6; padding: 0.5rem; } .p-datepicker .p-timepicker button { width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-datepicker .p-timepicker button:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-datepicker .p-timepicker button:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-datepicker .p-timepicker button:last-child { margin-top: 0.2em; } .p-datepicker .p-timepicker span { font-size: 1.25rem; } .p-datepicker .p-timepicker > div { padding: 0 0.5rem; } .p-datepicker.p-datepicker-timeonly .p-timepicker { border-top: 0 none; } .p-datepicker .p-monthpicker { margin: 0.5rem 0; } .p-datepicker .p-monthpicker .p-monthpicker-month { padding: 0.5rem; transition: box-shadow 0.2s; border-radius: 3px; } .p-datepicker .p-monthpicker .p-monthpicker-month.p-highlight { color: #495057; background: #E3F2FD; } .p-datepicker.p-datepicker-multiple-month .p-datepicker-group { border-right: 1px solid #dee2e6; padding-right: 0.5rem; padding-left: 0.5rem; padding-top: 0; padding-bottom: 0; } .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:first-child { padding-left: 0; } .p-datepicker.p-datepicker-multiple-month .p-datepicker-group:last-child { padding-right: 0; border-right: 0 none; } .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled):hover { background: #e9ecef; } .p-datepicker:not(.p-disabled) table td span:not(.p-highlight):not(.p-disabled):focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-datepicker:not(.p-disabled) .p-monthpicker .p-monthpicker-month:not(.p-highlight):not(.p-disabled):hover { background: #e9ecef; } .p-datepicker:not(.p-disabled) .p-monthpicker .p-monthpicker-month:not(.p-highlight):not(.p-disabled):focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } @media screen and (max-width: 769px) { .p-datepicker table th, .p-datepicker table td { padding: 0; } } .p-checkbox { width: 20px; height: 20px; } .p-checkbox .p-checkbox-box { border: 2px solid #ced4da; background: #ffffff; width: 20px; height: 20px; color: #495057; border-radius: 3px; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .p-checkbox .p-checkbox-box .p-checkbox-icon { transition-duration: 0.2s; color: #ffffff; font-size: 14px; } .p-checkbox .p-checkbox-box.p-highlight { border-color: #2196F3; background: #2196F3; } .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box:hover { border-color: #2196F3; } .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: #2196F3; } .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-highlight:hover { border-color: #0b7ad1; background: #0b7ad1; color: #ffffff; } .p-checkbox.p-error > .p-checkbox-box, .p-checkbox.p-invalid > .p-checkbox-box { border-color: #f44336; } p-checkbox.ng-dirty.ng-invalid > .p-checkbox > .p-checkbox-box { border-color: #f44336; } .p-input-filled .p-checkbox .p-checkbox-box { background-color: #f8f9fa; } .p-input-filled .p-checkbox .p-checkbox-box:not(.p-checkbox-disabled):hover { background-color: #f8f9fa; } .p-input-filled .p-checkbox .p-checkbox-box.p-highlight { background: #2196F3; } .p-input-filled .p-checkbox .p-checkbox-box.p-highlight:not(.p-checkbox-disabled):hover { background: #0b7ad1; } .p-input-filled .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box:hover { background-color: #f8f9fa; } .p-input-filled .p-checkbox:not(.p-checkbox-disabled) .p-checkbox-box.p-highlight:hover { background: #0b7ad1; } .p-checkbox-label { margin-left: 0.5rem; } .p-chips .p-chips-multiple-container { padding: 0.25rem 0.5rem; } .p-chips .p-chips-multiple-container:not(.p-disabled):hover { border-color: #2196F3; } .p-chips .p-chips-multiple-container:not(.p-disabled).p-focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: #2196F3; } .p-chips .p-chips-multiple-container .p-chips-token { padding: 0.25rem 0.5rem; margin-right: 0.5rem; background: #E3F2FD; color: #495057; border-radius: 3px; } .p-chips .p-chips-multiple-container .p-chips-token .p-chips-token-icon { margin-left: 0.5rem; } .p-chips .p-chips-multiple-container .p-chips-input-token { padding: 0.25rem 0; } .p-chips .p-chips-multiple-container .p-chips-input-token input { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 1rem; color: #495057; padding: 0; margin: 0; } .p-chips.p-error > .p-inputtext, .p-chips.p-invalid > .p-inputtext { border-color: #f44336; } p-chips.ng-dirty.ng-invalid > .p-chips > .p-inputtext { border-color: #f44336; } .p-colorpicker-preview { width: 2rem; height: 2rem; } .p-colorpicker-panel { background: #323232; border-color: #191919; } .p-colorpicker-panel .p-colorpicker-color-handle, .p-colorpicker-panel .p-colorpicker-hue-handle { border-color: #ffffff; } .p-colorpicker-overlay-panel { box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-dropdown { background: #ffffff; border: 1px solid #ced4da; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; border-radius: 3px; } .p-dropdown:not(.p-disabled):hover { border-color: #2196F3; } .p-dropdown:not(.p-disabled).p-focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: #2196F3; } .p-dropdown.p-dropdown-clearable .p-dropdown-label { padding-right: 1.5rem; } .p-dropdown .p-dropdown-label { background: transparent; border: 0 none; } .p-dropdown .p-dropdown-label.p-placeholder { color: #6c757d; } .p-dropdown .p-dropdown-label:enabled:focus { outline: 0 none; box-shadow: none; } .p-dropdown .p-dropdown-trigger { background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .p-dropdown .p-dropdown-clear-icon { color: #6c757d; right: 2.357rem; } .p-dropdown-panel { background: #ffffff; color: #495057; border: 0 none; border-radius: 3px; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-dropdown-panel .p-dropdown-header { padding: 0.5rem 1rem; border-bottom: 0 none; color: #495057; background: #f8f9fa; margin: 0; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-dropdown-panel .p-dropdown-header .p-dropdown-filter { padding-right: 1.5rem; } .p-dropdown-panel .p-dropdown-header .p-dropdown-filter-icon { right: 0.5rem; color: #6c757d; } .p-dropdown-panel .p-dropdown-items { padding: 0.5rem 0; } .p-dropdown-panel .p-dropdown-items .p-dropdown-item { margin: 0; padding: 0.5rem 1rem; border: 0 none; color: #495057; background: transparent; transition: box-shadow 0.2s; border-radius: 0; } .p-dropdown-panel .p-dropdown-items .p-dropdown-item.p-highlight { color: #495057; background: #E3F2FD; } .p-dropdown-panel .p-dropdown-items .p-dropdown-item:not(.p-highlight):not(.p-disabled):hover { color: #495057; background: #e9ecef; } .p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message { padding: 0.5rem 1rem; color: #495057; background: transparent; } .p-dropdown-panel .p-dropdown-items .p-dropdown-item-group { margin: 0; padding: 0.75rem 1rem; color: #495057; background: #ffffff; font-weight: 600; } .p-dropdown-panel.p-error, .p-dropdown-panel.p-invalid { border-color: #f44336; } p-dropdown.ng-dirty.ng-invalid > .p-dropdown { border-color: #f44336; } .p-input-filled .p-dropdown { background: #f8f9fa; } .p-input-filled .p-dropdown:not(.p-disabled):hover { background-color: #f8f9fa; } .p-input-filled .p-dropdown:not(.p-disabled).p-focus { background-color: #ffffff; } .p-editor-container .p-editor-toolbar { background: #f8f9fa; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-editor-container .p-editor-toolbar.ql-snow { border: 1px solid #dee2e6; } .p-editor-container .p-editor-toolbar.ql-snow .ql-stroke { stroke: #6c757d; } .p-editor-container .p-editor-toolbar.ql-snow .ql-fill { fill: #6c757d; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label { border: 0 none; color: #6c757d; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover { color: #495057; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover .ql-stroke { stroke: #495057; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover .ql-fill { fill: #495057; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label { color: #495057; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke { stroke: #495057; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill { fill: #495057; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options { background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); border-radius: 3px; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item { color: #495057; padding: 0.5rem 1rem; border-radius: 3px; } .p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item:hover { color: #495057; background: #e9ecef; } .p-editor-container .p-editor-content { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-editor-container .p-editor-content.ql-snow { border: 1px solid #dee2e6; } .p-editor-container .p-editor-content .ql-editor { background: #ffffff; color: #495057; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-editor-container .ql-snow.ql-toolbar button:hover, .p-editor-container .ql-snow.ql-toolbar button:focus { color: #495057; } .p-editor-container .ql-snow.ql-toolbar button:hover .ql-stroke, .p-editor-container .ql-snow.ql-toolbar button:focus .ql-stroke { stroke: #495057; } .p-editor-container .ql-snow.ql-toolbar button:hover .ql-fill, .p-editor-container .ql-snow.ql-toolbar button:focus .ql-fill { fill: #495057; } .p-editor-container .ql-snow.ql-toolbar button.ql-active, .p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active, .p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected { color: #2196F3; } .p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-stroke, .p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke, .p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke { stroke: #2196F3; } .p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-fill, .p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill, .p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill { fill: #2196F3; } .p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-picker-label, .p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-picker-label, .p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-picker-label { color: #2196F3; } .p-inputgroup-addon { background: #e9ecef; color: #6c757d; border-top: 1px solid #ced4da; border-left: 1px solid #ced4da; border-bottom: 1px solid #ced4da; padding: 0.5rem 0.5rem; min-width: 2.357rem; } .p-inputgroup-addon:last-child { border-right: 1px solid #ced4da; } .p-inputgroup > .p-component, .p-inputgroup > .p-float-label > .p-component { border-radius: 0; margin: 0; } .p-inputgroup > .p-component + .p-inputgroup-addon, .p-inputgroup > .p-float-label > .p-component + .p-inputgroup-addon { border-left: 0 none; } .p-inputgroup > .p-component:focus, .p-inputgroup > .p-float-label > .p-component:focus { z-index: 1; } .p-inputgroup > .p-component:focus ~ label, .p-inputgroup > .p-float-label > .p-component:focus ~ label { z-index: 1; } .p-inputgroup-addon:first-child, .p-inputgroup button:first-child, .p-inputgroup input:first-child { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .p-inputgroup .p-float-label:first-child input { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .p-inputgroup-addon:last-child, .p-inputgroup button:last-child, .p-inputgroup input:last-child { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .p-inputgroup .p-float-label:last-child input { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .p-fluid .p-inputgroup .p-button { width: auto; } .p-fluid .p-inputgroup .p-button.p-button-icon-only { width: 2.357rem; } p-inputmask.ng-dirty.ng-invalid > .p-inputtext { border-color: #f44336; } p-inputnumber.ng-dirty.ng-invalid > .p-inputnumber > .p-inputtext { border-color: #f44336; } .p-inputswitch { width: 3rem; height: 1.75rem; } .p-inputswitch .p-inputswitch-slider { background: #ced4da; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; border-radius: 30px; } .p-inputswitch .p-inputswitch-slider:before { background: #ffffff; width: 1.25rem; height: 1.25rem; left: 0.25rem; margin-top: -0.625rem; border-radius: 50%; transition-duration: 0.2s; } .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider:before { transform: translateX(1.25rem); } .p-inputswitch.p-focus .p-inputswitch-slider { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-inputswitch:not(.p-disabled):hover .p-inputswitch-slider { background: #b6bfc8; } .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider { background: #2196F3; } .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider:before { background: #ffffff; } .p-inputswitch.p-inputswitch-checked:not(.p-disabled):hover .p-inputswitch-slider { background: #0d89ec; } .p-inputswitch.p-error, .p-inputswitch.p-invalid { border-color: #f44336; } p-inputswitch.ng-dirty.ng-invalid > .p-inputswitch { border-color: #f44336; } .p-inputtext { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-size: 1rem; color: #495057; background: #ffffff; padding: 0.5rem 0.5rem; border: 1px solid #ced4da; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 3px; } .p-inputtext:enabled:hover { border-color: #2196F3; } .p-inputtext:enabled:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: #2196F3; } .p-inputtext.p-error, .p-inputtext.p-invalid, .p-inputtext.ng-dirty.ng-invalid { border-color: #f44336; } .p-inputtext.p-inputtext-sm { font-size: 0.875rem; padding: 0.4375rem 0.4375rem; } .p-inputtext.p-inputtext-lg { font-size: 1.25rem; padding: 0.625rem 0.625rem; } .p-float-label > label { left: 0.5rem; color: #6c757d; transition-duration: 0.2s; } .p-input-icon-left > i:first-of-type { left: 0.5rem; color: #6c757d; } .p-input-icon-left > .p-inputtext { padding-left: 2rem; } .p-input-icon-right > i:last-of-type { right: 0.5rem; color: #6c757d; } .p-input-icon-right > .p-inputtext { padding-right: 2rem; } ::-webkit-input-placeholder { color: #6c757d; } :-moz-placeholder { color: #6c757d; } ::-moz-placeholder { color: #6c757d; } :-ms-input-placeholder { color: #6c757d; } .p-input-filled .p-inputtext { background-color: #f8f9fa; } .p-input-filled .p-inputtext:enabled:hover { background-color: #f8f9fa; } .p-input-filled .p-inputtext:enabled:focus { background-color: #ffffff; } .p-inputtext-sm .p-inputtext { font-size: 0.875rem; padding: 0.4375rem 0.4375rem; } .p-inputtext-lg .p-inputtext { font-size: 1.25rem; padding: 0.625rem 0.625rem; } .p-listbox { background: #ffffff; color: #495057; border: 1px solid #ced4da; border-radius: 3px; } .p-listbox .p-listbox-header { padding: 0.5rem 1rem; border-bottom: 0 none; color: #495057; background: #f8f9fa; margin: 0; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-listbox .p-listbox-header .p-listbox-filter { padding-right: 1.5rem; } .p-listbox .p-listbox-header .p-listbox-filter-icon { right: 0.5rem; color: #6c757d; } .p-listbox .p-listbox-header .p-checkbox { margin-right: 0.5rem; } .p-listbox .p-listbox-list { padding: 0.5rem 0; } .p-listbox .p-listbox-list .p-listbox-item { margin: 0; padding: 0.5rem 1rem; border: 0 none; color: #495057; transition: box-shadow 0.2s; border-radius: 0; } .p-listbox .p-listbox-list .p-listbox-item.p-highlight { color: #495057; background: #E3F2FD; } .p-listbox .p-listbox-list .p-listbox-item:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-listbox .p-listbox-list .p-listbox-item .p-checkbox { margin-right: 0.5rem; } .p-listbox:not(.p-disabled) .p-listbox-item:not(.p-highlight):not(.p-disabled):hover { color: #495057; background: #e9ecef; } .p-listbox.p-error, .p-listbox.p-invalid { border-color: #f44336; } p-listbox.ng-dirty.ng-invalid > .p-listbox { border-color: #f44336; } .p-multiselect { background: #ffffff; border: 1px solid #ced4da; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; border-radius: 3px; } .p-multiselect:not(.p-disabled):hover { border-color: #2196F3; } .p-multiselect:not(.p-disabled).p-focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: #2196F3; } .p-multiselect .p-multiselect-label { padding: 0.5rem 0.5rem; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .p-multiselect .p-multiselect-label.p-placeholder { color: #6c757d; } .p-multiselect .p-multiselect-trigger { background: transparent; color: #6c757d; width: 2.357rem; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .p-multiselect.p-error, .p-multiselect.p-invalid { border-color: #f44336; } .p-multiselect-panel { background: #ffffff; color: #495057; border: 0 none; border-radius: 3px; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-multiselect-panel .p-multiselect-header { padding: 0.5rem 1rem; border-bottom: 0 none; color: #495057; background: #f8f9fa; margin: 0; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-inputtext { padding-right: 1.5rem; } .p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-multiselect-filter-icon { right: 0.5rem; color: #6c757d; } .p-multiselect-panel .p-multiselect-header .p-checkbox { margin-right: 0.5rem; } .p-multiselect-panel .p-multiselect-header .p-multiselect-close { margin-left: 0.5rem; width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-multiselect-panel .p-multiselect-header .p-multiselect-close:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-multiselect-panel .p-multiselect-header .p-multiselect-close:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-multiselect-panel .p-multiselect-items { padding: 0.5rem 0; } .p-multiselect-panel .p-multiselect-items .p-multiselect-item { margin: 0; padding: 0.5rem 1rem; border: 0 none; color: #495057; background: transparent; transition: box-shadow 0.2s; border-radius: 0; } .p-multiselect-panel .p-multiselect-items .p-multiselect-item.p-highlight { color: #495057; background: #E3F2FD; } .p-multiselect-panel .p-multiselect-items .p-multiselect-item:not(.p-highlight):not(.p-disabled):hover { color: #495057; background: #e9ecef; } .p-multiselect-panel .p-multiselect-items .p-multiselect-item:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox { margin-right: 0.5rem; } .p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message { padding: 0.5rem 1rem; color: #495057; background: transparent; } p-multiselect.ng-dirty.ng-invalid > .p-multiselect { border-color: #f44336; } .p-input-filled .p-multiselect { background: #f8f9fa; } .p-input-filled .p-multiselect:not(.p-disabled):hover { background-color: #f8f9fa; } .p-input-filled .p-multiselect:not(.p-disabled).p-focus { background-color: #ffffff; } .p-password-panel { padding: 1rem; background: #ffffff; color: #495057; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); border-radius: 3px; } .p-password-panel .p-password-meter { margin-bottom: 0.5rem; } .p-radiobutton { width: 20px; height: 20px; } .p-radiobutton .p-radiobutton-box { border: 2px solid #ced4da; background: #ffffff; width: 20px; height: 20px; color: #495057; border-radius: 50%; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .p-radiobutton .p-radiobutton-box:not(.p-disabled):not(.p-highlight):hover { border-color: #2196F3; } .p-radiobutton .p-radiobutton-box:not(.p-disabled).p-focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: #2196F3; } .p-radiobutton .p-radiobutton-box .p-radiobutton-icon { width: 12px; height: 12px; transition-duration: 0.2s; background-color: #ffffff; } .p-radiobutton .p-radiobutton-box.p-highlight { border-color: #2196F3; background: #2196F3; } .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover { border-color: #0b7ad1; background: #0b7ad1; color: #ffffff; } .p-radiobutton.p-error > .p-radiobutton-box, .p-radiobutton.p-invalid > .p-radiobutton-box { border-color: #f44336; } p-radiobutton.ng-dirty.ng-invalid > .p-radiobutton > .p-radiobutton-box { border-color: #f44336; } .p-input-filled .p-radiobutton .p-radiobutton-box { background-color: #f8f9fa; } .p-input-filled .p-radiobutton .p-radiobutton-box:not(.p-disabled):hover { background-color: #f8f9fa; } .p-input-filled .p-radiobutton .p-radiobutton-box.p-highlight { background: #2196F3; } .p-input-filled .p-radiobutton .p-radiobutton-box.p-highlight:not(.p-disabled):hover { background: #0b7ad1; } .p-radiobutton-label { margin-left: 0.5rem; } .p-rating .p-rating-icon { color: #495057; margin-left: 0.5rem; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; font-size: 1.143rem; } .p-rating .p-rating-icon.p-rating-cancel { color: #e74c3c; } .p-rating .p-rating-icon:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-rating .p-rating-icon:first-child { margin-left: 0; } .p-rating .p-rating-icon.pi-star { color: #2196F3; } .p-rating:not(.p-disabled):not(.p-readonly) .p-rating-icon:hover { color: #2196F3; } .p-rating:not(.p-disabled):not(.p-readonly) .p-rating-icon.p-rating-cancel:hover { color: #c0392b; } .p-selectbutton .p-button { background: #ffffff; border: 1px solid #ced4da; color: #495057; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .p-selectbutton .p-button .p-button-icon-left, .p-selectbutton .p-button .p-button-icon-right { color: #6c757d; } .p-selectbutton .p-button:not(.p-disabled):not(.p-highlight):hover { background: #e9ecef; border-color: #ced4da; color: #495057; } .p-selectbutton .p-button:not(.p-disabled):not(.p-highlight):hover .p-button-icon-left, .p-selectbutton .p-button:not(.p-disabled):not(.p-highlight):hover .p-button-icon-right { color: #6c757d; } .p-selectbutton .p-button.p-highlight { background: #2196F3; border-color: #2196F3; color: #ffffff; } .p-selectbutton .p-button.p-highlight .p-button-icon-left, .p-selectbutton .p-button.p-highlight .p-button-icon-right { color: #ffffff; } .p-selectbutton .p-button.p-highlight:hover { background: #0d89ec; border-color: #0d89ec; color: #ffffff; } .p-selectbutton .p-button.p-highlight:hover .p-button-icon-left, .p-selectbutton .p-button.p-highlight:hover .p-button-icon-right { color: #ffffff; } .p-selectbutton.p-error > .p-button, .p-selectbutton.p-invalid > .p-button { border-color: #f44336; } p-selectbutton.ng-dirty.ng-invalid > .p-selectbutton > .p-button { border-color: #f44336; } .p-slider { background: #dee2e6; border: 0 none; border-radius: 3px; } .p-slider.p-slider-horizontal { height: 0.286rem; } .p-slider.p-slider-horizontal .p-slider-handle { margin-top: -0.5715rem; margin-left: -0.5715rem; } .p-slider.p-slider-vertical { width: 0.286rem; } .p-slider.p-slider-vertical .p-slider-handle { margin-left: -0.5715rem; margin-bottom: -0.5715rem; } .p-slider .p-slider-handle { height: 1.143rem; width: 1.143rem; background: #ffffff; border: 2px solid #2196F3; border-radius: 50%; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .p-slider .p-slider-handle:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-slider .p-slider-range { background: #2196F3; } .p-slider:not(.p-disabled) .p-slider-handle:hover { background: #2196F3; border-color: #2196F3; } .p-slider.p-slider-animate.p-slider-horizontal .p-slider-handle { transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s, left 0.2s; } .p-slider.p-slider-animate.p-slider-horizontal .p-slider-range { transition: width 0.2s; } .p-slider.p-slider-animate.p-slider-vertical .p-slider-handle { transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s, bottom 0.2s; } .p-slider.p-slider-animate.p-slider-vertical .p-slider-range { transition: height 0.2s; } .p-togglebutton.p-button { background: #ffffff; border: 1px solid #ced4da; color: #495057; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .p-togglebutton.p-button .p-button-icon-left, .p-togglebutton.p-button .p-button-icon-right { color: #6c757d; } .p-togglebutton.p-button:not(.p-disabled):not(.p-highlight):hover { background: #e9ecef; border-color: #ced4da; color: #495057; } .p-togglebutton.p-button:not(.p-disabled):not(.p-highlight):hover .p-button-icon-left, .p-togglebutton.p-button:not(.p-disabled):not(.p-highlight):hover .p-button-icon-right { color: #6c757d; } .p-togglebutton.p-button.p-highlight { background: #2196F3; border-color: #2196F3; color: #ffffff; } .p-togglebutton.p-button.p-highlight .p-button-icon-left, .p-togglebutton.p-button.p-highlight .p-button-icon-right { color: #ffffff; } .p-togglebutton.p-button.p-highlight:hover { background: #0d89ec; border-color: #0d89ec; color: #ffffff; } .p-togglebutton.p-button.p-highlight:hover .p-button-icon-left, .p-togglebutton.p-button.p-highlight:hover .p-button-icon-right { color: #ffffff; } .p-togglebutton.p-button.p-error, .p-togglebutton.p-button.p-invalid { border-color: #f44336; } p-togglebutton.ng-dirty.ng-invalid > .p-togglebutton.p-button { border-color: #f44336; } .p-button { color: #ffffff; background: #2196F3; border: 1px solid #2196F3; padding: 0.5rem 1rem; font-size: 1rem; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; border-radius: 3px; } .p-button:enabled:hover { background: #0d89ec; color: #ffffff; border-color: #0d89ec; } .p-button:enabled:active { background: #0b7ad1; color: #ffffff; border-color: #0b7ad1; } .p-button.p-button-outlined { background-color: transparent; color: #2196F3; border: 1px solid; } .p-button.p-button-outlined:enabled:hover { background: rgba(33, 150, 243, 0.04); color: #2196F3; border: 1px solid; } .p-button.p-button-outlined:enabled:active { background: rgba(33, 150, 243, 0.16); color: #2196F3; border: 1px solid; } .p-button.p-button-outlined.p-button-plain { color: #6c757d; border-color: #6c757d; } .p-button.p-button-outlined.p-button-plain:enabled:hover { background: #e9ecef; color: #6c757d; } .p-button.p-button-outlined.p-button-plain:enabled:active { background: #dee2e6; color: #6c757d; } .p-button.p-button-text { background-color: transparent; color: #2196F3; border-color: transparent; } .p-button.p-button-text:enabled:hover { background: rgba(33, 150, 243, 0.04); color: #2196F3; border-color: transparent; } .p-button.p-button-text:enabled:active { background: rgba(33, 150, 243, 0.16); color: #2196F3; border-color: transparent; } .p-button.p-button-text.p-button-plain { color: #6c757d; } .p-button.p-button-text.p-button-plain:enabled:hover { background: #e9ecef; color: #6c757d; } .p-button.p-button-text.p-button-plain:enabled:active { background: #dee2e6; color: #6c757d; } .p-button:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-button .p-button-icon-left { margin-right: 0.5rem; } .p-button .p-button-icon-right { margin-left: 0.5rem; } .p-button .p-button-icon-bottom { margin-top: 0.5rem; } .p-button .p-button-icon-top { margin-bottom: 0.5rem; } .p-button .p-badge { margin-left: 0.5rem; min-width: 1rem; height: 1rem; line-height: 1rem; color: #ffffff; background-color: #2196F3; } .p-button.p-button-raised { box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12); } .p-button.p-button-rounded { border-radius: 2rem; } .p-button.p-button-icon-only { width: 2.357rem; padding: 0.5rem 0; } .p-button.p-button-icon-only .p-button-icon-left, .p-button.p-button-icon-only .p-button-icon-right { margin: 0; } .p-button.p-button-icon-only.p-button-rounded { border-radius: 50%; height: 2.357rem; } .p-button.p-button-sm { font-size: 0.875rem; padding: 0.4375rem 0.875rem; } .p-button.p-button-sm .p-button-icon { font-size: 0.875rem; } .p-button.p-button-lg { font-size: 1.25rem; padding: 0.625rem 1.25rem; } .p-button.p-button-lg .p-button-icon { font-size: 1.25rem; } .p-fluid .p-button { width: 100%; } .p-fluid .p-button-icon-only { width: 2.357rem; } .p-fluid .p-buttonset { display: flex; } .p-fluid .p-buttonset .p-button { flex: 1; } .p-button.p-button-secondary, .p-buttonset.p-button-secondary > .p-button, .p-splitbutton.p-button-secondary > .p-button { color: #ffffff; background: #607D8B; border: 1px solid #607D8B; } .p-button.p-button-secondary:enabled:hover, .p-buttonset.p-button-secondary > .p-button:enabled:hover, .p-splitbutton.p-button-secondary > .p-button:enabled:hover { background: #56717d; color: #ffffff; border-color: #56717d; } .p-button.p-button-secondary:enabled:focus, .p-buttonset.p-button-secondary > .p-button:enabled:focus, .p-splitbutton.p-button-secondary > .p-button:enabled:focus { box-shadow: 0 0 0 0.2rem #beccd2; } .p-button.p-button-secondary:enabled:active, .p-buttonset.p-button-secondary > .p-button:enabled:active, .p-splitbutton.p-button-secondary > .p-button:enabled:active { background: #4d646f; color: #ffffff; border-color: #4d646f; } .p-button.p-button-secondary.p-button-outlined, .p-buttonset.p-button-secondary > .p-button.p-button-outlined, .p-splitbutton.p-button-secondary > .p-button.p-button-outlined { background-color: transparent; color: #607D8B; border: 1px solid; } .p-button.p-button-secondary.p-button-outlined:enabled:hover, .p-buttonset.p-button-secondary > .p-button.p-button-outlined:enabled:hover, .p-splitbutton.p-button-secondary > .p-button.p-button-outlined:enabled:hover { background: rgba(96, 125, 139, 0.04); color: #607D8B; border: 1px solid; } .p-button.p-button-secondary.p-button-outlined:enabled:active, .p-buttonset.p-button-secondary > .p-button.p-button-outlined:enabled:active, .p-splitbutton.p-button-secondary > .p-button.p-button-outlined:enabled:active { background: rgba(96, 125, 139, 0.16); color: #607D8B; border: 1px solid; } .p-button.p-button-secondary.p-button-text, .p-buttonset.p-button-secondary > .p-button.p-button-text, .p-splitbutton.p-button-secondary > .p-button.p-button-text { background-color: transparent; color: #607D8B; border-color: transparent; } .p-button.p-button-secondary.p-button-text:enabled:hover, .p-buttonset.p-button-secondary > .p-button.p-button-text:enabled:hover, .p-splitbutton.p-button-secondary > .p-button.p-button-text:enabled:hover { background: rgba(96, 125, 139, 0.04); border-color: transparent; color: #607D8B; } .p-button.p-button-secondary.p-button-text:enabled:active, .p-buttonset.p-button-secondary > .p-button.p-button-text:enabled:active, .p-splitbutton.p-button-secondary > .p-button.p-button-text:enabled:active { background: rgba(96, 125, 139, 0.16); border-color: transparent; color: #607D8B; } .p-button.p-button-info, .p-buttonset.p-button-info > .p-button, .p-splitbutton.p-button-info > .p-button { color: #ffffff; background: #0288D1; border: 1px solid #0288D1; } .p-button.p-button-info:enabled:hover, .p-buttonset.p-button-info > .p-button:enabled:hover, .p-splitbutton.p-button-info > .p-button:enabled:hover { background: #027abc; color: #ffffff; border-color: #027abc; } .p-button.p-button-info:enabled:focus, .p-buttonset.p-button-info > .p-button:enabled:focus, .p-splitbutton.p-button-info > .p-button:enabled:focus { box-shadow: 0 0 0 0.2rem #89d4fe; } .p-button.p-button-info:enabled:active, .p-buttonset.p-button-info > .p-button:enabled:active, .p-splitbutton.p-button-info > .p-button:enabled:active { background: #026da7; color: #ffffff; border-color: #026da7; } .p-button.p-button-info.p-button-outlined, .p-buttonset.p-button-info > .p-button.p-button-outlined, .p-splitbutton.p-button-info > .p-button.p-button-outlined { background-color: transparent; color: #0288D1; border: 1px solid; } .p-button.p-button-info.p-button-outlined:enabled:hover, .p-buttonset.p-button-info > .p-button.p-button-outlined:enabled:hover, .p-splitbutton.p-button-info > .p-button.p-button-outlined:enabled:hover { background: rgba(2, 136, 209, 0.04); color: #0288D1; border: 1px solid; } .p-button.p-button-info.p-button-outlined:enabled:active, .p-buttonset.p-button-info > .p-button.p-button-outlined:enabled:active, .p-splitbutton.p-button-info > .p-button.p-button-outlined:enabled:active { background: rgba(2, 136, 209, 0.16); color: #0288D1; border: 1px solid; } .p-button.p-button-info.p-button-text, .p-buttonset.p-button-info > .p-button.p-button-text, .p-splitbutton.p-button-info > .p-button.p-button-text { background-color: transparent; color: #0288D1; border-color: transparent; } .p-button.p-button-info.p-button-text:enabled:hover, .p-buttonset.p-button-info > .p-button.p-button-text:enabled:hover, .p-splitbutton.p-button-info > .p-button.p-button-text:enabled:hover { background: rgba(2, 136, 209, 0.04); border-color: transparent; color: #0288D1; } .p-button.p-button-info.p-button-text:enabled:active, .p-buttonset.p-button-info > .p-button.p-button-text:enabled:active, .p-splitbutton.p-button-info > .p-button.p-button-text:enabled:active { background: rgba(2, 136, 209, 0.16); border-color: transparent; color: #0288D1; } .p-button.p-button-success, .p-buttonset.p-button-success > .p-button, .p-splitbutton.p-button-success > .p-button { color: #ffffff; background: #689F38; border: 1px solid #689F38; } .p-button.p-button-success:enabled:hover, .p-buttonset.p-button-success > .p-button:enabled:hover, .p-splitbutton.p-button-success > .p-button:enabled:hover { background: #5e8f32; color: #ffffff; border-color: #5e8f32; } .p-button.p-button-success:enabled:focus, .p-buttonset.p-button-success > .p-button:enabled:focus, .p-splitbutton.p-button-success > .p-button:enabled:focus { box-shadow: 0 0 0 0.2rem #c2e0a8; } .p-button.p-button-success:enabled:active, .p-buttonset.p-button-success > .p-button:enabled:active, .p-splitbutton.p-button-success > .p-button:enabled:active { background: #537f2d; color: #ffffff; border-color: #537f2d; } .p-button.p-button-success.p-button-outlined, .p-buttonset.p-button-success > .p-button.p-button-outlined, .p-splitbutton.p-button-success > .p-button.p-button-outlined { background-color: transparent; color: #689F38; border: 1px solid; } .p-button.p-button-success.p-button-outlined:enabled:hover, .p-buttonset.p-button-success > .p-button.p-button-outlined:enabled:hover, .p-splitbutton.p-button-success > .p-button.p-button-outlined:enabled:hover { background: rgba(104, 159, 56, 0.04); color: #689F38; border: 1px solid; } .p-button.p-button-success.p-button-outlined:enabled:active, .p-buttonset.p-button-success > .p-button.p-button-outlined:enabled:active, .p-splitbutton.p-button-success > .p-button.p-button-outlined:enabled:active { background: rgba(104, 159, 56, 0.16); color: #689F38; border: 1px solid; } .p-button.p-button-success.p-button-text, .p-buttonset.p-button-success > .p-button.p-button-text, .p-splitbutton.p-button-success > .p-button.p-button-text { background-color: transparent; color: #689F38; border-color: transparent; } .p-button.p-button-success.p-button-text:enabled:hover, .p-buttonset.p-button-success > .p-button.p-button-text:enabled:hover, .p-splitbutton.p-button-success > .p-button.p-button-text:enabled:hover { background: rgba(104, 159, 56, 0.04); border-color: transparent; color: #689F38; } .p-button.p-button-success.p-button-text:enabled:active, .p-buttonset.p-button-success > .p-button.p-button-text:enabled:active, .p-splitbutton.p-button-success > .p-button.p-button-text:enabled:active { background: rgba(104, 159, 56, 0.16); border-color: transparent; color: #689F38; } .p-button.p-button-warning, .p-buttonset.p-button-warning > .p-button, .p-splitbutton.p-button-warning > .p-button { color: #212529; background: #FBC02D; border: 1px solid #FBC02D; } .p-button.p-button-warning:enabled:hover, .p-buttonset.p-button-warning > .p-button:enabled:hover, .p-splitbutton.p-button-warning > .p-button:enabled:hover { background: #fab710; color: #212529; border-color: #fab710; } .p-button.p-button-warning:enabled:focus, .p-buttonset.p-button-warning > .p-button:enabled:focus, .p-splitbutton.p-button-warning > .p-button:enabled:focus { box-shadow: 0 0 0 0.2rem #fde6ab; } .p-button.p-button-warning:enabled:active, .p-buttonset.p-button-warning > .p-button:enabled:active, .p-splitbutton.p-button-warning > .p-button:enabled:active { background: #e8a704; color: #212529; border-color: #e8a704; } .p-button.p-button-warning.p-button-outlined, .p-buttonset.p-button-warning > .p-button.p-button-outlined, .p-splitbutton.p-button-warning > .p-button.p-button-outlined { background-color: transparent; color: #FBC02D; border: 1px solid; } .p-button.p-button-warning.p-button-outlined:enabled:hover, .p-buttonset.p-button-warning > .p-button.p-button-outlined:enabled:hover, .p-splitbutton.p-button-warning > .p-button.p-button-outlined:enabled:hover { background: rgba(251, 192, 45, 0.04); color: #FBC02D; border: 1px solid; } .p-button.p-button-warning.p-button-outlined:enabled:active, .p-buttonset.p-button-warning > .p-button.p-button-outlined:enabled:active, .p-splitbutton.p-button-warning > .p-button.p-button-outlined:enabled:active { background: rgba(251, 192, 45, 0.16); color: #FBC02D; border: 1px solid; } .p-button.p-button-warning.p-button-text, .p-buttonset.p-button-warning > .p-button.p-button-text, .p-splitbutton.p-button-warning > .p-button.p-button-text { background-color: transparent; color: #FBC02D; border-color: transparent; } .p-button.p-button-warning.p-button-text:enabled:hover, .p-buttonset.p-button-warning > .p-button.p-button-text:enabled:hover, .p-splitbutton.p-button-warning > .p-button.p-button-text:enabled:hover { background: rgba(251, 192, 45, 0.04); border-color: transparent; color: #FBC02D; } .p-button.p-button-warning.p-button-text:enabled:active, .p-buttonset.p-button-warning > .p-button.p-button-text:enabled:active, .p-splitbutton.p-button-warning > .p-button.p-button-text:enabled:active { background: rgba(251, 192, 45, 0.16); border-color: transparent; color: #FBC02D; } .p-button.p-button-help, .p-buttonset.p-button-help > .p-button, .p-splitbutton.p-button-help > .p-button { color: #ffffff; background: #9C27B0; border: 1px solid #9C27B0; } .p-button.p-button-help:enabled:hover, .p-buttonset.p-button-help > .p-button:enabled:hover, .p-splitbutton.p-button-help > .p-button:enabled:hover { background: #8c239e; color: #ffffff; border-color: #8c239e; } .p-button.p-button-help:enabled:focus, .p-buttonset.p-button-help > .p-button:enabled:focus, .p-splitbutton.p-button-help > .p-button:enabled:focus { box-shadow: 0 0 0 0.2rem #df9eea; } .p-button.p-button-help:enabled:active, .p-buttonset.p-button-help > .p-button:enabled:active, .p-splitbutton.p-button-help > .p-button:enabled:active { background: #7d1f8d; color: #ffffff; border-color: #7d1f8d; } .p-button.p-button-help.p-button-outlined, .p-buttonset.p-button-help > .p-button.p-button-outlined, .p-splitbutton.p-button-help > .p-button.p-button-outlined { background-color: transparent; color: #9C27B0; border: 1px solid; } .p-button.p-button-help.p-button-outlined:enabled:hover, .p-buttonset.p-button-help > .p-button.p-button-outlined:enabled:hover, .p-splitbutton.p-button-help > .p-button.p-button-outlined:enabled:hover { background: rgba(156, 39, 176, 0.04); color: #9C27B0; border: 1px solid; } .p-button.p-button-help.p-button-outlined:enabled:active, .p-buttonset.p-button-help > .p-button.p-button-outlined:enabled:active, .p-splitbutton.p-button-help > .p-button.p-button-outlined:enabled:active { background: rgba(156, 39, 176, 0.16); color: #9C27B0; border: 1px solid; } .p-button.p-button-help.p-button-text, .p-buttonset.p-button-help > .p-button.p-button-text, .p-splitbutton.p-button-help > .p-button.p-button-text { background-color: transparent; color: #9C27B0; border-color: transparent; } .p-button.p-button-help.p-button-text:enabled:hover, .p-buttonset.p-button-help > .p-button.p-button-text:enabled:hover, .p-splitbutton.p-button-help > .p-button.p-button-text:enabled:hover { background: rgba(156, 39, 176, 0.04); border-color: transparent; color: #9C27B0; } .p-button.p-button-help.p-button-text:enabled:active, .p-buttonset.p-button-help > .p-button.p-button-text:enabled:active, .p-splitbutton.p-button-help > .p-button.p-button-text:enabled:active { background: rgba(156, 39, 176, 0.16); border-color: transparent; color: #9C27B0; } .p-button.p-button-danger, .p-buttonset.p-button-danger > .p-button, .p-splitbutton.p-button-danger > .p-button { color: #ffffff; background: #D32F2F; border: 1px solid #D32F2F; } .p-button.p-button-danger:enabled:hover, .p-buttonset.p-button-danger > .p-button:enabled:hover, .p-splitbutton.p-button-danger > .p-button:enabled:hover { background: #c02929; color: #ffffff; border-color: #c02929; } .p-button.p-button-danger:enabled:focus, .p-buttonset.p-button-danger > .p-button:enabled:focus, .p-splitbutton.p-button-danger > .p-button:enabled:focus { box-shadow: 0 0 0 0.2rem #edacac; } .p-button.p-button-danger:enabled:active, .p-buttonset.p-button-danger > .p-button:enabled:active, .p-splitbutton.p-button-danger > .p-button:enabled:active { background: #aa2424; color: #ffffff; border-color: #aa2424; } .p-button.p-button-danger.p-button-outlined, .p-buttonset.p-button-danger > .p-button.p-button-outlined, .p-splitbutton.p-button-danger > .p-button.p-button-outlined { background-color: transparent; color: #D32F2F; border: 1px solid; } .p-button.p-button-danger.p-button-outlined:enabled:hover, .p-buttonset.p-button-danger > .p-button.p-button-outlined:enabled:hover, .p-splitbutton.p-button-danger > .p-button.p-button-outlined:enabled:hover { background: rgba(211, 47, 47, 0.04); color: #D32F2F; border: 1px solid; } .p-button.p-button-danger.p-button-outlined:enabled:active, .p-buttonset.p-button-danger > .p-button.p-button-outlined:enabled:active, .p-splitbutton.p-button-danger > .p-button.p-button-outlined:enabled:active { background: rgba(211, 47, 47, 0.16); color: #D32F2F; border: 1px solid; } .p-button.p-button-danger.p-button-text, .p-buttonset.p-button-danger > .p-button.p-button-text, .p-splitbutton.p-button-danger > .p-button.p-button-text { background-color: transparent; color: #D32F2F; border-color: transparent; } .p-button.p-button-danger.p-button-text:enabled:hover, .p-buttonset.p-button-danger > .p-button.p-button-text:enabled:hover, .p-splitbutton.p-button-danger > .p-button.p-button-text:enabled:hover { background: rgba(211, 47, 47, 0.04); border-color: transparent; color: #D32F2F; } .p-button.p-button-danger.p-button-text:enabled:active, .p-buttonset.p-button-danger > .p-button.p-button-text:enabled:active, .p-splitbutton.p-button-danger > .p-button.p-button-text:enabled:active { background: rgba(211, 47, 47, 0.16); border-color: transparent; color: #D32F2F; } .p-button.p-button-link { color: #0b7ad1; background: transparent; border: transparent; } .p-button.p-button-link:enabled:hover { background: transparent; color: #0b7ad1; border-color: transparent; } .p-button.p-button-link:enabled:hover .p-button-label { text-decoration: underline; } .p-button.p-button-link:enabled:focus { background: transparent; box-shadow: 0 0 0 0.2rem #a6d5fa; border-color: transparent; } .p-button.p-button-link:enabled:active { background: transparent; color: #0b7ad1; border-color: transparent; } .p-carousel .p-carousel-content .p-carousel-prev, .p-carousel .p-carousel-content .p-carousel-next { width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; margin: 0.5rem; } .p-carousel .p-carousel-content .p-carousel-prev:enabled:hover, .p-carousel .p-carousel-content .p-carousel-next:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-carousel .p-carousel-content .p-carousel-prev:focus, .p-carousel .p-carousel-content .p-carousel-next:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-carousel .p-carousel-indicators { padding: 1rem; } .p-carousel .p-carousel-indicators .p-carousel-indicator { margin-right: 0.5rem; margin-bottom: 0.5rem; } .p-carousel .p-carousel-indicators .p-carousel-indicator button { background-color: #e9ecef; width: 2rem; height: 0.5rem; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; border-radius: 0; } .p-carousel .p-carousel-indicators .p-carousel-indicator button:hover { background: #dee2e6; } .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button { background: #E3F2FD; color: #495057; } .p-datatable .p-paginator-top { border-width: 0 0 1px 0; border-radius: 0; } .p-datatable .p-paginator-bottom { border-width: 0 0 1px 0; border-radius: 0; } .p-datatable .p-datatable-header { background: #f8f9fa; color: #495057; border: 1px solid #e9ecef; border-width: 1px 0 1px 0; padding: 1rem 1rem; font-weight: 600; } .p-datatable .p-datatable-footer { background: #f8f9fa; color: #495057; border: 1px solid #e9ecef; border-width: 0 0 1px 0; padding: 1rem 1rem; font-weight: 600; } .p-datatable .p-datatable-thead > tr > th { text-align: left; padding: 1rem 1rem; border: 1px solid #e9ecef; border-width: 0 0 1px 0; font-weight: 600; color: #495057; background: #f8f9fa; transition: box-shadow 0.2s; } .p-datatable .p-datatable-tfoot > tr > td { text-align: left; padding: 1rem 1rem; border: 1px solid #e9ecef; border-width: 0 0 1px 0; font-weight: 600; color: #495057; background: #f8f9fa; } .p-datatable .p-sortable-column { outline-color: #a6d5fa; } .p-datatable .p-sortable-column .p-sortable-column-icon { color: #6c757d; margin-left: 0.5rem; } .p-datatable .p-sortable-column .p-sortable-column-badge { border-radius: 50%; height: 1.143rem; min-width: 1.143rem; line-height: 1.143rem; color: #495057; background: #E3F2FD; margin-left: 0.5rem; } .p-datatable .p-sortable-column:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-datatable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon { color: #6c757d; } .p-datatable .p-sortable-column.p-highlight { background: #f8f9fa; color: #2196F3; } .p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon { color: #2196F3; } .p-datatable .p-sortable-column.p-highlight:hover { background: #e9ecef; color: #2196F3; } .p-datatable .p-sortable-column.p-highlight:hover .p-sortable-column-icon { color: #2196F3; } .p-datatable .p-sortable-column:focus { box-shadow: inset 0 0 0 0.2rem #a6d5fa; outline: 0 none; } .p-datatable .p-datatable-tbody > tr { background: #ffffff; color: #495057; transition: box-shadow 0.2s; outline-color: #a6d5fa; } .p-datatable .p-datatable-tbody > tr > td { text-align: left; border: 1px solid #e9ecef; border-width: 0 0 1px 0; padding: 1rem 1rem; } .p-datatable .p-datatable-tbody > tr > td .p-row-toggler, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-init, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-save, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-cancel { width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-datatable .p-datatable-tbody > tr > td .p-row-toggler:enabled:hover, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-init:enabled:hover, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-save:enabled:hover, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-cancel:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-datatable .p-datatable-tbody > tr > td .p-row-toggler:focus, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-init:focus, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-save:focus, .p-datatable .p-datatable-tbody > tr > td .p-row-editor-cancel:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-datatable .p-datatable-tbody > tr > td .p-row-editor-save { margin-right: 0.5rem; } .p-datatable .p-datatable-tbody > tr.p-highlight { background: #E3F2FD; color: #495057; } .p-datatable .p-datatable-tbody > tr.p-datatable-dragpoint-top > td { box-shadow: inset 0 2px 0 0 #E3F2FD; } .p-datatable .p-datatable-tbody > tr.p-datatable-dragpoint-bottom > td { box-shadow: inset 0 -2px 0 0 #E3F2FD; } .p-datatable.p-datatable-hoverable-rows .p-datatable-tbody > tr:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-datatable .p-column-resizer-helper { background: #2196F3; } .p-datatable .p-datatable-scrollable-header, .p-datatable .p-datatable-scrollable-footer { background: #f8f9fa; } .p-datatable .p-datatable-loading-icon { font-size: 2rem; } .p-datatable.p-datatable-gridlines .p-datatable-header { border-width: 1px 1px 0 1px; } .p-datatable.p-datatable-gridlines .p-datatable-footer { border-width: 0 1px 1px 1px; } .p-datatable.p-datatable-gridlines .p-paginator-top { border-width: 0 1px 0 1px; } .p-datatable.p-datatable-gridlines .p-paginator-bottom { border-width: 0 1px 1px 1px; } .p-datatable.p-datatable-gridlines .p-datatable-thead > tr > th { border-width: 1px 1px 1px 1px; } .p-datatable.p-datatable-gridlines .p-datatable-tbody > tr > td { border-width: 1px; } .p-datatable.p-datatable-gridlines .p-datatable-tfoot > tr > td { border-width: 1px; } .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) { background: #fcfcfc; } .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight { background: #E3F2FD; color: #495057; } .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler { color: #495057; } .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover { color: #495057; } .p-datatable.p-datatable-sm .p-datatable-header { padding: 0.5rem 0.5rem; } .p-datatable.p-datatable-sm .p-datatable-thead > tr > th { padding: 0.5rem 0.5rem; } .p-datatable.p-datatable-sm .p-datatable-tbody > tr > td { padding: 0.5rem 0.5rem; } .p-datatable.p-datatable-sm .p-datatable-tfoot > tr > td { padding: 0.5rem 0.5rem; } .p-datatable.p-datatable-sm .p-datatable-footer { padding: 0.5rem 0.5rem; } .p-datatable.p-datatable-lg .p-datatable-header { padding: 1.25rem 1.25rem; } .p-datatable.p-datatable-lg .p-datatable-thead > tr > th { padding: 1.25rem 1.25rem; } .p-datatable.p-datatable-lg .p-datatable-tbody > tr > td { padding: 1.25rem 1.25rem; } .p-datatable.p-datatable-lg .p-datatable-tfoot > tr > td { padding: 1.25rem 1.25rem; } .p-datatable.p-datatable-lg .p-datatable-footer { padding: 1.25rem 1.25rem; } .p-dataview .p-paginator-top { border-width: 0 0 1px 0; border-radius: 0; } .p-dataview .p-paginator-bottom { border-width: 0 0 1px 0; border-radius: 0; } .p-dataview .p-dataview-header { background: #f8f9fa; color: #495057; border: 1px solid #e9ecef; border-width: 1px 0 1px 0; padding: 1rem 1rem; font-weight: 600; } .p-dataview .p-dataview-content { background: #ffffff; color: #495057; border: 0 none; padding: 0; } .p-dataview.p-dataview-list .p-dataview-content > .p-grid > div { border: solid #e9ecef; border-width: 0 0 1px 0; } .p-dataview .p-dataview-footer { background: #f8f9fa; color: #495057; border: 1px solid #e9ecef; border-width: 0 0 1px 0; padding: 1rem 1rem; font-weight: 600; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } .p-dataview .p-dataview-loading-icon { font-size: 2rem; } .p-dataview .p-dataview-emptymessage { padding: 1rem; } .fc .fc-view-container th { background: #f8f9fa; border: 1px solid #dee2e6; color: #495057; } .fc .fc-view-container td.fc-widget-content { background: #ffffff; border: 1px solid #dee2e6; color: #495057; } .fc .fc-view-container td.fc-head-container { border: 1px solid #dee2e6; } .fc .fc-view-container .fc-row { border-right: 1px solid #dee2e6; } .fc .fc-view-container .fc-event { background: #0d89ec; border: 1px solid #0d89ec; color: #ffffff; } .fc .fc-view-container .fc-divider { background: #f8f9fa; border: 1px solid #dee2e6; } .fc .fc-toolbar .fc-button { color: #ffffff; background: #2196F3; border: 1px solid #2196F3; font-size: 1rem; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; border-radius: 3px; display: flex; align-items: center; } .fc .fc-toolbar .fc-button:enabled:hover { background: #0d89ec; color: #ffffff; border-color: #0d89ec; } .fc .fc-toolbar .fc-button:enabled:active { background: #0b7ad1; color: #ffffff; border-color: #0b7ad1; } .fc .fc-toolbar .fc-button:enabled:active:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .fc .fc-toolbar .fc-button .fc-icon-chevron-left { font-family: "PrimeIcons" !important; text-indent: 0; font-size: 1rem; } .fc .fc-toolbar .fc-button .fc-icon-chevron-left:before { content: ""; } .fc .fc-toolbar .fc-button .fc-icon-chevron-right { font-family: "PrimeIcons" !important; text-indent: 0; font-size: 1rem; } .fc .fc-toolbar .fc-button .fc-icon-chevron-right:before { content: ""; } .fc .fc-toolbar .fc-button:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .fc .fc-toolbar .fc-button.fc-dayGridMonth-button, .fc .fc-toolbar .fc-button.fc-timeGridWeek-button, .fc .fc-toolbar .fc-button.fc-timeGridDay-button { background: #ffffff; border: 1px solid #ced4da; color: #495057; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .fc .fc-toolbar .fc-button.fc-dayGridMonth-button:hover, .fc .fc-toolbar .fc-button.fc-timeGridWeek-button:hover, .fc .fc-toolbar .fc-button.fc-timeGridDay-button:hover { background: #e9ecef; border-color: #ced4da; color: #495057; } .fc .fc-toolbar .fc-button.fc-dayGridMonth-button.fc-button-active, .fc .fc-toolbar .fc-button.fc-timeGridWeek-button.fc-button-active, .fc .fc-toolbar .fc-button.fc-timeGridDay-button.fc-button-active { background: #2196F3; border-color: #2196F3; color: #ffffff; } .fc .fc-toolbar .fc-button.fc-dayGridMonth-button.fc-button-active:hover, .fc .fc-toolbar .fc-button.fc-timeGridWeek-button.fc-button-active:hover, .fc .fc-toolbar .fc-button.fc-timeGridDay-button.fc-button-active:hover { background: #0d89ec; border-color: #0d89ec; color: #ffffff; } .fc .fc-toolbar .fc-button.fc-dayGridMonth-button:focus, .fc .fc-toolbar .fc-button.fc-timeGridWeek-button:focus, .fc .fc-toolbar .fc-button.fc-timeGridDay-button:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; z-index: 1; } .fc .fc-toolbar .fc-button-group .fc-button { border-radius: 0; } .fc .fc-toolbar .fc-button-group .fc-button:first-child { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .fc .fc-toolbar .fc-button-group .fc-button:last-child { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .p-orderlist .p-orderlist-controls { padding: 1rem; } .p-orderlist .p-orderlist-controls .p-button { margin-bottom: 0.5rem; } .p-orderlist .p-orderlist-header { background: #f8f9fa; color: #495057; border: 1px solid #dee2e6; padding: 1rem; border-bottom: 0 none; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-orderlist .p-orderlist-header .p-orderlist-title { font-weight: 600; } .p-orderlist .p-orderlist-filter-container { padding: 1rem; background: #ffffff; border: 1px solid #dee2e6; border-bottom: 0 none; } .p-orderlist .p-orderlist-filter-container .p-orderlist-filter-input { padding-right: 1.5rem; } .p-orderlist .p-orderlist-filter-container .p-orderlist-filter-icon { right: 0.5rem; color: #6c757d; } .p-orderlist .p-orderlist-list { border: 1px solid #dee2e6; background: #ffffff; color: #495057; padding: 0.5rem 0; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-orderlist .p-orderlist-list .p-orderlist-item { padding: 0.5rem 1rem; margin: 0; border: 0 none; color: #495057; background: transparent; transition: transform 0.2s, box-shadow 0.2s; } .p-orderlist .p-orderlist-list .p-orderlist-item:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-orderlist .p-orderlist-list .p-orderlist-item:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-orderlist .p-orderlist-list .p-orderlist-item.p-highlight { color: #495057; background: #E3F2FD; } .p-orderlist .p-orderlist-list .p-orderlist-droppoint.p-orderlist-droppoint-highlight { background-color: #89c8f7; } @media screen and (max-width: 769px) { .p-orderlist { flex-direction: column; } .p-orderlist .p-orderlist-controls { padding: 1rem; flex-direction: row; } .p-orderlist .p-orderlist-controls .p-button { margin-right: 0.5rem; margin-bottom: 0; } .p-orderlist .p-orderlist-controls .p-button:last-child { margin-right: 0; } } .p-organizationchart .p-organizationchart-node-content.p-organizationchart-selectable-node:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-organizationchart .p-organizationchart-node-content.p-highlight { background: #E3F2FD; color: #495057; } .p-organizationchart .p-organizationchart-node-content.p-highlight .p-node-toggler i { color: #6cbbf5; } .p-organizationchart .p-organizationchart-line-down { background: #dee2e6; } .p-organizationchart .p-organizationchart-line-left { border-right: 1px solid #dee2e6; border-color: #dee2e6; } .p-organizationchart .p-organizationchart-line-top { border-top: 1px solid #dee2e6; border-color: #dee2e6; } .p-organizationchart .p-organizationchart-node-content { border: 1px solid #dee2e6; background: #ffffff; color: #495057; padding: 1rem; } .p-organizationchart .p-organizationchart-node-content .p-node-toggler { background: inherit; color: inherit; border-radius: 50%; } .p-organizationchart .p-organizationchart-node-content .p-node-toggler:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-paginator { background: #ffffff; color: #6c757d; border: solid #e9ecef; border-width: 0; padding: 0.5rem 1rem; border-radius: 3px; } .p-paginator .p-paginator-first, .p-paginator .p-paginator-prev, .p-paginator .p-paginator-next, .p-paginator .p-paginator-last { background-color: transparent; border: 0 none; color: #6c757d; min-width: 2.357rem; height: 2.357rem; margin: 0.143rem; transition: box-shadow 0.2s; border-radius: 3px; } .p-paginator .p-paginator-first:not(.p-disabled):not(.p-highlight):hover, .p-paginator .p-paginator-prev:not(.p-disabled):not(.p-highlight):hover, .p-paginator .p-paginator-next:not(.p-disabled):not(.p-highlight):hover, .p-paginator .p-paginator-last:not(.p-disabled):not(.p-highlight):hover { background: #e9ecef; border-color: transparent; color: #495057; } .p-paginator .p-paginator-first { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .p-paginator .p-paginator-last { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .p-paginator .p-dropdown { margin-left: 0.5rem; height: 2.357rem; } .p-paginator .p-dropdown .p-dropdown-label { padding-right: 0; } .p-paginator .p-paginator-current { background-color: transparent; border: 0 none; color: #6c757d; min-width: 2.357rem; height: 2.357rem; margin: 0.143rem; padding: 0 0.5rem; } .p-paginator .p-paginator-pages .p-paginator-page { background-color: transparent; border: 0 none; color: #6c757d; min-width: 2.357rem; height: 2.357rem; margin: 0.143rem; transition: box-shadow 0.2s; border-radius: 3px; } .p-paginator .p-paginator-pages .p-paginator-page.p-highlight { background: #E3F2FD; border-color: #E3F2FD; color: #495057; } .p-paginator .p-paginator-pages .p-paginator-page:not(.p-highlight):hover { background: #e9ecef; border-color: transparent; color: #495057; } .p-picklist .p-picklist-buttons { padding: 1rem; } .p-picklist .p-picklist-buttons .p-button { margin-bottom: 0.5rem; } .p-picklist .p-picklist-header { background: #f8f9fa; color: #495057; border: 1px solid #dee2e6; padding: 1rem; border-bottom: 0 none; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-picklist .p-picklist-header .p-picklist-title { font-weight: 600; } .p-picklist .p-picklist-filter-container { padding: 1rem; background: #ffffff; border: 1px solid #dee2e6; border-bottom: 0 none; } .p-picklist .p-picklist-filter-container .p-picklist-filter-input { padding-right: 1.5rem; } .p-picklist .p-picklist-filter-container .p-picklist-filter-icon { right: 0.5rem; color: #6c757d; } .p-picklist .p-picklist-list { border: 1px solid #dee2e6; background: #ffffff; color: #495057; padding: 0.5rem 0; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-picklist .p-picklist-list .p-picklist-item { padding: 0.5rem 1rem; margin: 0; border: 0 none; color: #495057; background: transparent; transition: transform 0.2s, box-shadow 0.2s; } .p-picklist .p-picklist-list .p-picklist-item:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-picklist .p-picklist-list .p-picklist-item:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-picklist .p-picklist-list .p-picklist-item.p-highlight { color: #495057; background: #E3F2FD; } .p-picklist .p-picklist-list .p-picklist-droppoint.p-picklist-droppoint-highlight { background-color: #89c8f7; } .p-picklist .p-picklist-list .p-picklist-empty-message { padding: 0.5rem 1rem; color: #495057; } @media screen and (max-width: 769px) { .p-picklist { flex-direction: column; } .p-picklist .p-picklist-buttons { padding: 1rem; flex-direction: row; } .p-picklist .p-picklist-buttons .p-button { margin-right: 0.5rem; margin-bottom: 0; } .p-picklist .p-picklist-buttons .p-button:last-child { margin-right: 0; } .p-picklist .p-picklist-transfer-buttons .pi-angle-right:before { content: ""; } .p-picklist .p-picklist-transfer-buttons .pi-angle-double-right:before { content: ""; } .p-picklist .p-picklist-transfer-buttons .pi-angle-left:before { content: ""; } .p-picklist .p-picklist-transfer-buttons .pi-angle-double-left:before { content: ""; } } .p-tree { border: 1px solid #dee2e6; background: #ffffff; color: #495057; padding: 1rem; border-radius: 3px; } .p-tree .p-tree-container .p-treenode { padding: 0.143rem; } .p-tree .p-tree-container .p-treenode .p-treenode-content { border-radius: 3px; transition: box-shadow 0.2s; padding: 0.5rem; } .p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler { margin-right: 0.5rem; width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-tree .p-tree-container .p-treenode .p-treenode-content .p-tree-toggler:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-tree .p-tree-container .p-treenode .p-treenode-content .p-treenode-icon { margin-right: 0.5rem; color: #6c757d; } .p-tree .p-tree-container .p-treenode .p-treenode-content .p-checkbox { margin-right: 0.5rem; } .p-tree .p-tree-container .p-treenode .p-treenode-content .p-checkbox .p-indeterminate .p-checkbox-icon { color: #495057; } .p-tree .p-tree-container .p-treenode .p-treenode-content:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-tree .p-tree-container .p-treenode .p-treenode-content.p-highlight { background: #E3F2FD; color: #495057; } .p-tree .p-tree-container .p-treenode .p-treenode-content.p-highlight .p-tree-toggler, .p-tree .p-tree-container .p-treenode .p-treenode-content.p-highlight .p-treenode-icon { color: #495057; } .p-tree .p-tree-container .p-treenode .p-treenode-content.p-treenode-selectable:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-tree .p-tree-container .p-treenode .p-treenode-content.p-treenode-dragover { background: #e9ecef; color: #495057; } .p-tree .p-tree-filter-container { margin-bottom: 0.5rem; } .p-tree .p-tree-filter-container .p-tree-filter { width: 100%; padding-right: 1.5rem; } .p-tree .p-tree-filter-container .p-tree-filter-icon { right: 0.5rem; color: #6c757d; } .p-tree .p-treenode-children { padding: 0 0 0 1rem; } .p-tree .p-tree-loading-icon { font-size: 2rem; } .p-tree .p-treenode-droppoint.p-treenode-droppoint-active { background-color: #89c8f7; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content { border-radius: 3px; border: 1px solid #dee2e6; background-color: #ffffff; color: #495057; padding: 0.5rem; transition: box-shadow 0.2s; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content.p-highlight { background-color: #E3F2FD; color: #495057; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content.p-highlight .p-treenode-icon { color: #495057; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content .p-tree-toggler { margin-right: 0.5rem; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content .p-treenode-icon { color: #6c757d; margin-right: 0.5rem; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content .p-checkbox { margin-right: 0.5rem; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content .p-treenode-label:not(.p-highlight):hover { background-color: inherit; color: inherit; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content.p-treenode-selectable:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-tree.p-tree-horizontal .p-treenode .p-treenode-content:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-treetable .p-paginator-top { border-width: 0 0 1px 0; border-radius: 0; } .p-treetable .p-paginator-bottom { border-width: 0 0 1px 0; border-radius: 0; } .p-treetable .p-treetable-header { background: #f8f9fa; color: #495057; border: 1px solid #e9ecef; border-width: 1px 0 1px 0; padding: 1rem 1rem; font-weight: 600; } .p-treetable .p-treetable-footer { background: #f8f9fa; color: #495057; border: 1px solid #e9ecef; border-width: 0 0 1px 0; padding: 1rem 1rem; font-weight: 600; } .p-treetable .p-treetable-thead > tr > th { text-align: left; padding: 1rem 1rem; border: 1px solid #e9ecef; border-width: 0 0 1px 0; font-weight: 600; color: #495057; background: #f8f9fa; transition: box-shadow 0.2s; } .p-treetable .p-treetable-tfoot > tr > td { text-align: left; padding: 1rem 1rem; border: 1px solid #e9ecef; border-width: 0 0 1px 0; font-weight: 600; color: #495057; background: #f8f9fa; } .p-treetable .p-sortable-column { outline-color: #a6d5fa; } .p-treetable .p-sortable-column .p-sortable-column-icon { color: #6c757d; margin-left: 0.5rem; } .p-treetable .p-sortable-column .p-sortable-column-badge { border-radius: 50%; height: 1.143rem; min-width: 1.143rem; line-height: 1.143rem; color: #495057; background: #E3F2FD; margin-left: 0.5rem; } .p-treetable .p-sortable-column:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-treetable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon { color: #6c757d; } .p-treetable .p-sortable-column.p-highlight { background: #f8f9fa; color: #2196F3; } .p-treetable .p-sortable-column.p-highlight .p-sortable-column-icon { color: #2196F3; } .p-treetable .p-treetable-tbody > tr { background: #ffffff; color: #495057; transition: box-shadow 0.2s; outline-color: #a6d5fa; } .p-treetable .p-treetable-tbody > tr > td { text-align: left; border: 1px solid #e9ecef; border-width: 0 0 1px 0; padding: 1rem 1rem; } .p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler { width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; margin-right: 0.5rem; } .p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-treetable .p-treetable-tbody > tr > td .p-treetable-toggler:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-treetable .p-treetable-tbody > tr > td p-treetablecheckbox .p-checkbox { margin-right: 0.5rem; } .p-treetable .p-treetable-tbody > tr > td p-treetablecheckbox .p-checkbox .p-indeterminate .p-checkbox-icon { color: #495057; } .p-treetable .p-treetable-tbody > tr.p-highlight { background: #E3F2FD; color: #495057; } .p-treetable .p-treetable-tbody > tr.p-highlight .p-treetable-toggler { color: #495057; } .p-treetable .p-treetable-tbody > tr.p-highlight .p-treetable-toggler:hover { color: #495057; } .p-treetable.p-treetable-hoverable-rows .p-treetable-tbody > tr:not(.p-highlight):hover { background: #e9ecef; color: #495057; } .p-treetable.p-treetable-hoverable-rows .p-treetable-tbody > tr:not(.p-highlight):hover .p-treetable-toggler { color: #495057; } .p-treetable .p-column-resizer-helper { background: #2196F3; } .p-treetable .p-treetable-scrollable-header, .p-treetable .p-treetable-scrollable-footer { background: #f8f9fa; } .p-treetable .p-treetable-loading-icon { font-size: 2rem; } .p-treetable.p-treetable-gridlines .p-datatable-header { border-width: 1px 1px 0 1px; } .p-treetable.p-treetable-gridlines .p-treetable-footer { border-width: 0 1px 1px 1px; } .p-treetable.p-treetable-gridlines .p-treetable-top { border-width: 0 1px 0 1px; } .p-treetable.p-treetable-gridlines .p-treetable-bottom { border-width: 0 1px 1px 1px; } .p-treetable.p-treetable-gridlines .p-treetable-thead > tr > th { border-width: 1px; } .p-treetable.p-treetable-gridlines .p-treetable-tbody > tr > td { border-width: 1px; } .p-treetable.p-treetable-gridlines .p-treetable-tfoot > tr > td { border-width: 1px; } .p-treetable.p-treetable-sm .p-treetable-header { padding: 0.875rem 0.875rem; } .p-treetable.p-treetable-sm .p-treetable-thead > tr > th { padding: 0.5rem 0.5rem; } .p-treetable.p-treetable-sm .p-treetable-tbody > tr > td { padding: 0.5rem 0.5rem; } .p-treetable.p-treetable-sm .p-treetable-tfoot > tr > td { padding: 0.5rem 0.5rem; } .p-treetable.p-treetable-sm .p-treetable-footer { padding: 0.5rem 0.5rem; } .p-treetable.p-treetable-lg .p-treetable-header { padding: 1.25rem 1.25rem; } .p-treetable.p-treetable-lg .p-treetable-thead > tr > th { padding: 1.25rem 1.25rem; } .p-treetable.p-treetable-lg .p-treetable-tbody > tr > td { padding: 1.25rem 1.25rem; } .p-treetable.p-treetable-lg .p-treetable-tfoot > tr > td { padding: 1.25rem 1.25rem; } .p-treetable.p-treetable-lg .p-treetable-footer { padding: 1.25rem 1.25rem; } .p-virtualscroller .p-virtualscroller-header { background: #f8f9fa; color: #495057; border: 1px solid #e9ecef; border-width: 1px 0 1px 0; padding: 1rem 1rem; font-weight: 600; } .p-virtualscroller .p-virtualscroller-content { background: #ffffff; color: #495057; border: 0 none; padding: 0; } .p-virtualscroller .p-virtualscroller-footer { background: #f8f9fa; color: #495057; border: 1px solid #e9ecef; border-width: 0 0 1px 0; padding: 1rem 1rem; font-weight: 600; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } .p-accordion .p-accordion-header .p-accordion-header-link { padding: 1rem; border: 1px solid #dee2e6; color: #495057; background: #f8f9fa; font-weight: 600; border-radius: 3px; transition: box-shadow 0.2s; } .p-accordion .p-accordion-header .p-accordion-header-link .p-accordion-toggle-icon { margin-right: 0.5rem; } .p-accordion .p-accordion-header:not(.p-disabled) .p-accordion-header-link:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-accordion .p-accordion-header:not(.p-highlight):not(.p-disabled):hover .p-accordion-header-link { background: #e9ecef; border-color: #dee2e6; color: #495057; } .p-accordion .p-accordion-header:not(.p-disabled).p-highlight .p-accordion-header-link { background: #f8f9fa; border-color: #dee2e6; color: #495057; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .p-accordion .p-accordion-header:not(.p-disabled).p-highlight:hover .p-accordion-header-link { border-color: #dee2e6; background: #e9ecef; color: #495057; } .p-accordion .p-accordion-content { padding: 1rem; border: 1px solid #dee2e6; background: #ffffff; color: #495057; border-top: 0; border-top-right-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-accordion p-accordiontab .p-accordion-tab { margin-bottom: 0; } .p-accordion p-accordiontab .p-accordion-header .p-accordion-header-link { border-radius: 0; } .p-accordion p-accordiontab .p-accordion-content { border-radius: 0; } .p-accordion p-accordiontab:not(:first-child) .p-accordion-header .p-accordion-header-link { border-top: 0 none; } .p-accordion p-accordiontab:not(:first-child) .p-accordion-header:not(.p-highlight):not(.p-disabled):hover .p-accordion-header-link, .p-accordion p-accordiontab:not(:first-child) .p-accordion-header:not(.p-disabled).p-highlight:hover .p-accordion-header-link { border-top: 0 none; } .p-accordion p-accordiontab:first-child .p-accordion-header .p-accordion-header-link { border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-accordion p-accordiontab:last-child .p-accordion-header:not(.p-highlight) .p-accordion-header-link { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-accordion p-accordiontab:last-child .p-accordion-content { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-card { background: #ffffff; color: #495057; box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12); border-radius: 3px; } .p-card .p-card-body { padding: 1rem; } .p-card .p-card-title { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.5rem; } .p-card .p-card-subtitle { font-weight: 400; margin-bottom: 0.5rem; color: #6c757d; } .p-card .p-card-content { padding: 1rem 0; } .p-card .p-card-footer { padding: 1rem 0 0 0; } .p-fieldset { border: 1px solid #dee2e6; background: #ffffff; color: #495057; border-radius: 3px; } .p-fieldset .p-fieldset-legend { padding: 1rem; border: 1px solid #dee2e6; color: #495057; background: #f8f9fa; font-weight: 600; border-radius: 3px; } .p-fieldset.p-fieldset-toggleable .p-fieldset-legend { padding: 0; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-fieldset.p-fieldset-toggleable .p-fieldset-legend a { padding: 1rem; color: #495057; border-radius: 3px; transition: box-shadow 0.2s; } .p-fieldset.p-fieldset-toggleable .p-fieldset-legend a .p-fieldset-toggler { margin-right: 0.5rem; } .p-fieldset.p-fieldset-toggleable .p-fieldset-legend a:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-fieldset.p-fieldset-toggleable .p-fieldset-legend:hover { background: #e9ecef; border-color: #dee2e6; color: #495057; } .p-fieldset .p-fieldset-content { padding: 1rem; } .p-panel .p-panel-header { border: 1px solid #dee2e6; padding: 1rem; background: #f8f9fa; color: #495057; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-panel .p-panel-header .p-panel-title { font-weight: 600; } .p-panel .p-panel-header .p-panel-header-icon { width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-panel .p-panel-header .p-panel-header-icon:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-panel .p-panel-header .p-panel-header-icon:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-panel.p-panel-toggleable .p-panel-header { padding: 0.5rem 1rem; } .p-panel .p-panel-content { padding: 1rem; border: 1px solid #dee2e6; background: #ffffff; color: #495057; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; border-top: 0 none; } .p-panel .p-panel-footer { padding: 0.5rem 1rem; border: 1px solid #dee2e6; background: #ffffff; color: #495057; border-top: 0 none; } .p-scrollpanel .p-scrollpanel-bar { background: #f8f9fa; border: 0 none; } .p-tabview .p-tabview-nav { background: #ffffff; border: 1px solid #dee2e6; border-width: 0 0 2px 0; } .p-tabview .p-tabview-nav li { margin-right: 0; } .p-tabview .p-tabview-nav li .p-tabview-nav-link { border: solid #dee2e6; border-width: 0 0 2px 0; border-color: transparent transparent #dee2e6 transparent; background: #ffffff; color: #6c757d; padding: 1rem; font-weight: 600; border-top-right-radius: 3px; border-top-left-radius: 3px; transition: box-shadow 0.2s; margin: 0 0 -2px 0; } .p-tabview .p-tabview-nav li .p-tabview-nav-link:not(.p-disabled):focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-tabview .p-tabview-nav li:not(.p-highlight):not(.p-disabled):hover .p-tabview-nav-link { background: #ffffff; border-color: #6c757d; color: #6c757d; } .p-tabview .p-tabview-nav li.p-highlight .p-tabview-nav-link { background: #ffffff; border-color: #2196F3; color: #2196F3; } .p-tabview .p-tabview-left-icon { margin-right: 0.5rem; } .p-tabview .p-tabview-right-icon { margin-left: 0.5rem; } .p-tabview .p-tabview-close { margin-left: 0.5rem; } .p-tabview .p-tabview-panels { background: #ffffff; padding: 1rem; border: 0 none; color: #495057; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-toolbar { background: #f8f9fa; border: 1px solid #dee2e6; padding: 1rem; border-radius: 3px; } .p-toolbar .p-toolbar-separator { margin: 0 0.5rem; } .p-dialog { border-radius: 3px; box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); border: 0 none; } .p-dialog .p-dialog-header { border-bottom: 0 none; background: #ffffff; color: #495057; padding: 1.5rem; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-dialog .p-dialog-header .p-dialog-title { font-weight: 600; font-size: 1.25rem; } .p-dialog .p-dialog-header .p-dialog-header-icon { width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; margin-right: 0.5rem; } .p-dialog .p-dialog-header .p-dialog-header-icon:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-dialog .p-dialog-header .p-dialog-header-icon:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-dialog .p-dialog-header .p-dialog-header-icon:last-child { margin-right: 0; } .p-dialog .p-dialog-content { background: #ffffff; color: #495057; padding: 0 1.5rem 2rem 1.5rem; } .p-dialog .p-dialog-footer { border-top: 0 none; background: #ffffff; color: #495057; padding: 0 1.5rem 1.5rem 1.5rem; text-align: right; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-dialog .p-dialog-footer button { margin: 0 0.5rem 0 0; width: auto; } .p-dialog.p-confirm-dialog .p-confirm-dialog-icon { font-size: 2rem; } .p-dialog.p-confirm-dialog .p-confirm-dialog-message { margin-left: 1rem; } .p-dialog-mask.p-component-overlay { background-color: rgba(0, 0, 0, 0.4); } .p-overlaypanel { background: #ffffff; color: #495057; border: 0 none; border-radius: 3px; box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); } .p-overlaypanel .p-overlaypanel-content { padding: 1rem; } .p-overlaypanel .p-overlaypanel-close { background: #2196F3; color: #ffffff; width: 2rem; height: 2rem; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; border-radius: 50%; position: absolute; top: -1rem; right: -1rem; } .p-overlaypanel .p-overlaypanel-close:enabled:hover { background: #0d89ec; color: #ffffff; } .p-overlaypanel:after { border: solid transparent; border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; } .p-overlaypanel:before { border: solid transparent; border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; } .p-overlaypanel.p-overlaypanel-flipped:after { border-top-color: #ffffff; } .p-overlaypanel.p-overlaypanel-flipped:before { border-top-color: #ffffff; } .p-sidebar { background: #ffffff; color: #495057; padding: 1rem; border: 0 none; box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); } .p-sidebar .p-sidebar-close { width: 2rem; height: 2rem; color: #6c757d; border: 0 none; background: transparent; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-sidebar .p-sidebar-close:enabled:hover { color: #495057; border-color: transparent; background: #e9ecef; } .p-sidebar .p-sidebar-close:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-sidebar-mask.p-component-overlay { background: rgba(0, 0, 0, 0.4); } .p-tooltip .p-tooltip-text { background: #495057; color: #ffffff; padding: 0.5rem 0.5rem; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); border-radius: 3px; } .p-tooltip.p-tooltip-right .p-tooltip-arrow { border-right-color: #495057; } .p-tooltip.p-tooltip-left .p-tooltip-arrow { border-left-color: #495057; } .p-tooltip.p-tooltip-top .p-tooltip-arrow { border-top-color: #495057; } .p-tooltip.p-tooltip-bottom .p-tooltip-arrow { border-bottom-color: #495057; } .p-fileupload .p-fileupload-buttonbar { background: #f8f9fa; padding: 1rem; border: 1px solid #dee2e6; color: #495057; border-bottom: 0 none; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-fileupload .p-fileupload-buttonbar .p-button { margin-right: 0.5rem; } .p-fileupload .p-fileupload-buttonbar .p-button.p-fileupload-choose.p-focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-fileupload .p-fileupload-content { background: #ffffff; padding: 2rem 1rem; border: 1px solid #dee2e6; color: #495057; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-fileupload .p-progressbar { height: 0.25rem; } .p-fileupload .p-fileupload-row > div { padding: 1rem 1rem; } .p-fileupload.p-fileupload-advanced .p-message { margin-top: 0; } .p-fileupload-choose:not(.p-disabled):hover { background: #0d89ec; color: #ffffff; border-color: #0d89ec; } .p-fileupload-choose:not(.p-disabled):active { background: #0b7ad1; color: #ffffff; border-color: #0b7ad1; } .p-breadcrumb { background: #ffffff; border: 1px solid #dee2e6; border-radius: 3px; padding: 1rem; } .p-breadcrumb ul li .p-menuitem-link { transition: box-shadow 0.2s; border-radius: 3px; } .p-breadcrumb ul li .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-breadcrumb ul li .p-menuitem-link .p-menuitem-text { color: #495057; } .p-breadcrumb ul li .p-menuitem-link .p-menuitem-icon { color: #6c757d; } .p-breadcrumb ul li.p-breadcrumb-chevron { margin: 0 0.5rem 0 0.5rem; color: #495057; } .p-breadcrumb ul li:last-child .p-menuitem-text { color: #495057; } .p-breadcrumb ul li:last-child .p-menuitem-icon { color: #6c757d; } .p-contextmenu { padding: 0.25rem 0; background: #ffffff; color: #495057; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); width: 12.5rem; } .p-contextmenu .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 0; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-contextmenu .p-menuitem-link .p-menuitem-text { color: #495057; } .p-contextmenu .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-contextmenu .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-contextmenu .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-contextmenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-contextmenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-contextmenu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-contextmenu .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-contextmenu .p-submenu-list { padding: 0.25rem 0; background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-contextmenu .p-menuitem.p-menuitem-active > .p-menuitem-link { background: #e9ecef; } .p-contextmenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-text { color: #495057; } .p-contextmenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon, .p-contextmenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-contextmenu .p-menu-separator { border-top: 1px solid #dee2e6; margin: 0.25rem 0; } .p-contextmenu .p-submenu-icon { font-size: 0.875rem; } .p-megamenu { padding: 0.5rem; background: #f8f9fa; color: #495057; border: 1px solid #dee2e6; border-radius: 3px; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 3px; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link .p-menuitem-text { color: #495057; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link .p-submenu-icon { color: #6c757d; margin-left: 0.5rem; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-megamenu .p-megamenu-root-list > .p-menuitem > .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-megamenu .p-megamenu-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link, .p-megamenu .p-megamenu-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-megamenu .p-megamenu-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-text, .p-megamenu .p-megamenu-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-megamenu .p-megamenu-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon, .p-megamenu .p-megamenu-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-megamenu .p-megamenu-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon, .p-megamenu .p-megamenu-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-megamenu .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 0; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-megamenu .p-menuitem-link .p-menuitem-text { color: #495057; } .p-megamenu .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-megamenu .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-megamenu .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-megamenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-megamenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-megamenu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-megamenu .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-megamenu .p-megamenu-panel { background: #ffffff; color: #495057; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-megamenu .p-megamenu-submenu-header { margin: 0; padding: 0.75rem 1rem; color: #495057; background: #ffffff; font-weight: 600; border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-megamenu .p-megamenu-submenu { padding: 0.25rem 0; width: 12.5rem; } .p-megamenu .p-megamenu-submenu .p-menu-separator { border-top: 1px solid #dee2e6; margin: 0.25rem 0; } .p-megamenu .p-menuitem.p-menuitem-active > .p-menuitem-link { background: #e9ecef; } .p-megamenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-text { color: #495057; } .p-megamenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon, .p-megamenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-megamenu.p-megamenu-vertical { width: 12.5rem; padding: 0.25rem 0; } .p-menu { padding: 0.25rem 0; background: #ffffff; color: #495057; border: 1px solid #dee2e6; border-radius: 3px; width: 12.5rem; } .p-menu .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 0; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-menu .p-menuitem-link .p-menuitem-text { color: #495057; } .p-menu .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-menu .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-menu .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-menu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-menu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-menu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-menu .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-menu.p-menu-overlay { background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-menu .p-submenu-header { margin: 0; padding: 0.75rem 1rem; color: #495057; background: #ffffff; font-weight: 600; border-top-right-radius: 0; border-top-left-radius: 0; } .p-menu .p-menu-separator { border-top: 1px solid #dee2e6; margin: 0.25rem 0; } .p-menubar { padding: 0.5rem; background: #f8f9fa; color: #495057; border: 1px solid #dee2e6; border-radius: 3px; } .p-menubar .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 0; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-menubar .p-menuitem-link .p-menuitem-text { color: #495057; } .p-menubar .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-menubar .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-menubar .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-menubar .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-menubar .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-menubar .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-menubar .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 3px; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link .p-menuitem-text { color: #495057; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link .p-submenu-icon { color: #6c757d; margin-left: 0.5rem; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link, .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-text, .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon, .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon, .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-menubar .p-submenu-list { padding: 0.25rem 0; background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); width: 12.5rem; } .p-menubar .p-submenu-list .p-menu-separator { border-top: 1px solid #dee2e6; margin: 0.25rem 0; } .p-menubar .p-submenu-list .p-submenu-icon { font-size: 0.875rem; } .p-menubar .p-menuitem.p-menuitem-active > .p-menuitem-link { background: #e9ecef; } .p-menubar .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-text { color: #495057; } .p-menubar .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon, .p-menubar .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon { color: #6c757d; } @media screen and (max-width: 960px) { .p-menubar { position: relative; } .p-menubar .p-menubar-button { display: flex; width: 2rem; height: 2rem; color: #6c757d; border-radius: 50%; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-menubar .p-menubar-button:hover { color: #6c757d; background: #e9ecef; } .p-menubar .p-menubar-button:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-menubar .p-menubar-root-list { position: absolute; display: none; padding: 0.25rem 0; background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); width: 100%; } .p-menubar .p-menubar-root-list .p-menu-separator { border-top: 1px solid #dee2e6; margin: 0.25rem 0; } .p-menubar .p-menubar-root-list .p-submenu-icon { font-size: 0.875rem; } .p-menubar .p-menubar-root-list > .p-menuitem { width: 100%; position: static; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 0; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link .p-menuitem-text { color: #495057; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-menubar .p-menubar-root-list > .p-menuitem > .p-menuitem-link > .p-submenu-icon { margin-left: auto; transition: transform 0.2s; } .p-menubar .p-menubar-root-list > .p-menuitem.p-menuitem-active > .p-menuitem-link > .p-submenu-icon { transform: rotate(-180deg); } .p-menubar .p-menubar-root-list .p-submenu-list { width: 100%; position: static; box-shadow: none; border: 0 none; } .p-menubar .p-menubar-root-list .p-submenu-list .p-submenu-icon { transition: transform 0.2s; transform: rotate(90deg); } .p-menubar .p-menubar-root-list .p-submenu-list .p-menuitem-active > .p-menuitem-link > .p-submenu-icon { transform: rotate(-90deg); } .p-menubar .p-menubar-root-list .p-menuitem { width: 100%; position: static; } .p-menubar .p-menubar-root-list ul li a { padding-left: 2.25rem; } .p-menubar .p-menubar-root-list ul li ul li a { padding-left: 3.75rem; } .p-menubar .p-menubar-root-list ul li ul li ul li a { padding-left: 5.25rem; } .p-menubar .p-menubar-root-list ul li ul li ul li ul li a { padding-left: 6.75rem; } .p-menubar .p-menubar-root-list ul li ul li ul li ul li ul li a { padding-left: 8.25rem; } .p-menubar.p-menubar-mobile-active .p-menubar-root-list { display: flex; flex-direction: column; top: 100%; left: 0; z-index: 1; } } .p-panelmenu .p-panelmenu-header > a { padding: 1rem; border: 1px solid #dee2e6; color: #495057; background: #f8f9fa; font-weight: 600; border-radius: 3px; transition: box-shadow 0.2s; } .p-panelmenu .p-panelmenu-header > a .p-panelmenu-icon { margin-right: 0.5rem; } .p-panelmenu .p-panelmenu-header > a .p-menuitem-icon { margin-right: 0.5rem; } .p-panelmenu .p-panelmenu-header > a:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-panelmenu .p-panelmenu-header:not(.p-highlight):not(.p-disabled) > a:hover { background: #e9ecef; border-color: #dee2e6; color: #495057; } .p-panelmenu .p-panelmenu-header.p-highlight { margin-bottom: 0; } .p-panelmenu .p-panelmenu-header.p-highlight > a { background: #f8f9fa; border-color: #dee2e6; color: #495057; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .p-panelmenu .p-panelmenu-header.p-highlight:not(.p-disabled) > a:hover { border-color: #dee2e6; background: #e9ecef; color: #495057; } .p-panelmenu .p-panelmenu-content { padding: 0.25rem 0; border: 1px solid #dee2e6; background: #ffffff; color: #495057; margin-bottom: 0; border-top: 0; border-top-right-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 0; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link .p-menuitem-text { color: #495057; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-panelmenu .p-panelmenu-content .p-menuitem .p-menuitem-link .p-panelmenu-icon { margin-right: 0.5rem; } .p-panelmenu .p-panelmenu-content .p-submenu-list:not(.p-panelmenu-root-submenu) { padding: 0 0 0 1rem; } .p-panelmenu .p-panelmenu-panel { margin-bottom: 0; } .p-panelmenu .p-panelmenu-panel .p-panelmenu-header > a { border-radius: 0; } .p-panelmenu .p-panelmenu-panel .p-panelmenu-content { border-radius: 0; } .p-panelmenu .p-panelmenu-panel:not(:first-child) .p-panelmenu-header > a { border-top: 0 none; } .p-panelmenu .p-panelmenu-panel:not(:first-child) .p-panelmenu-header:not(.p-highlight):not(.p-disabled):hover > a, .p-panelmenu .p-panelmenu-panel:not(:first-child) .p-panelmenu-header:not(.p-disabled).p-highlight:hover > a { border-top: 0 none; } .p-panelmenu .p-panelmenu-panel:first-child .p-panelmenu-header > a { border-top-right-radius: 3px; border-top-left-radius: 3px; } .p-panelmenu .p-panelmenu-panel:last-child .p-panelmenu-header:not(.p-highlight) > a { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-panelmenu .p-panelmenu-panel:last-child .p-panelmenu-content { border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .p-slidemenu { padding: 0.25rem 0; background: #ffffff; color: #495057; border: 1px solid #dee2e6; border-radius: 3px; width: 12.5rem; } .p-slidemenu .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 0; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-slidemenu .p-menuitem-link .p-menuitem-text { color: #495057; } .p-slidemenu .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-slidemenu .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-slidemenu .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-slidemenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-slidemenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-slidemenu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-slidemenu .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-slidemenu.p-slidemenu-overlay { background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-slidemenu .p-slidemenu-list { padding: 0.25rem 0; background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-slidemenu .p-slidemenu.p-slidemenu-active > .p-slidemenu-link { background: #e9ecef; } .p-slidemenu .p-slidemenu.p-slidemenu-active > .p-slidemenu-link .p-slidemenu-text { color: #495057; } .p-slidemenu .p-slidemenu.p-slidemenu-active > .p-slidemenu-link .p-slidemenu-icon, .p-slidemenu .p-slidemenu.p-slidemenu-active > .p-slidemenu-link .p-slidemenu-icon { color: #6c757d; } .p-slidemenu .p-slidemenu-separator { border-top: 1px solid #dee2e6; margin: 0.25rem 0; } .p-slidemenu .p-slidemenu-icon { font-size: 0.875rem; } .p-slidemenu .p-slidemenu-backward { padding: 0.75rem 1rem; color: #495057; } .p-steps .p-steps-item .p-menuitem-link { background: transparent; transition: box-shadow 0.2s; border-radius: 3px; background: #ffffff; } .p-steps .p-steps-item .p-menuitem-link .p-steps-number { color: #495057; border: 1px solid #e9ecef; background: #ffffff; min-width: 2rem; height: 2rem; line-height: 2rem; font-size: 1.143rem; z-index: 1; border-radius: 50%; } .p-steps .p-steps-item .p-menuitem-link .p-steps-title { margin-top: 0.5rem; color: #6c757d; } .p-steps .p-steps-item .p-menuitem-link:not(.p-disabled):focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-steps .p-steps-item.p-highlight .p-steps-number { background: #E3F2FD; color: #495057; } .p-steps .p-steps-item.p-highlight .p-steps-title { font-weight: 600; color: #495057; } .p-steps .p-steps-item:before { content: " "; border-top: 1px solid #dee2e6; width: 100%; top: 50%; left: 0; display: block; position: absolute; margin-top: -1rem; } .p-tabmenu .p-tabmenu-nav { background: #ffffff; border: 1px solid #dee2e6; border-width: 0 0 2px 0; } .p-tabmenu .p-tabmenu-nav .p-tabmenuitem { margin-right: 0; } .p-tabmenu .p-tabmenu-nav .p-tabmenuitem .p-menuitem-link { border: solid #dee2e6; border-width: 0 0 2px 0; border-color: transparent transparent #dee2e6 transparent; background: #ffffff; color: #6c757d; padding: 1rem; font-weight: 600; border-top-right-radius: 3px; border-top-left-radius: 3px; transition: box-shadow 0.2s; margin: 0 0 -2px 0; } .p-tabmenu .p-tabmenu-nav .p-tabmenuitem .p-menuitem-link .p-menuitem-icon { margin-right: 0.5rem; } .p-tabmenu .p-tabmenu-nav .p-tabmenuitem .p-menuitem-link:not(.p-disabled):focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-tabmenu .p-tabmenu-nav .p-tabmenuitem:not(.p-highlight):not(.p-disabled):hover .p-menuitem-link { background: #ffffff; border-color: #6c757d; color: #6c757d; } .p-tabmenu .p-tabmenu-nav .p-tabmenuitem.p-highlight .p-menuitem-link { background: #ffffff; border-color: #2196F3; color: #2196F3; } .p-tieredmenu { padding: 0.25rem 0; background: #ffffff; color: #495057; border: 1px solid #dee2e6; border-radius: 3px; width: 12.5rem; } .p-tieredmenu .p-menuitem-link { padding: 0.75rem 1rem; color: #495057; border-radius: 0; transition: box-shadow 0.2s; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .p-tieredmenu .p-menuitem-link .p-menuitem-text { color: #495057; } .p-tieredmenu .p-menuitem-link .p-menuitem-icon { color: #6c757d; margin-right: 0.5rem; } .p-tieredmenu .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-tieredmenu .p-menuitem-link:not(.p-disabled):hover { background: #e9ecef; } .p-tieredmenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-text { color: #495057; } .p-tieredmenu .p-menuitem-link:not(.p-disabled):hover .p-menuitem-icon { color: #6c757d; } .p-tieredmenu .p-menuitem-link:not(.p-disabled):hover .p-submenu-icon { color: #6c757d; } .p-tieredmenu .p-menuitem-link:focus { outline: 0 none; outline-offset: 0; box-shadow: inset 0 0 0 0.15rem #a6d5fa; } .p-tieredmenu.p-tieredmenu-overlay { background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-tieredmenu .p-submenu-list { padding: 0.25rem 0; background: #ffffff; border: 0 none; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); } .p-tieredmenu .p-menuitem.p-menuitem-active > .p-menuitem-link { background: #e9ecef; } .p-tieredmenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-text { color: #495057; } .p-tieredmenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-menuitem-icon, .p-tieredmenu .p-menuitem.p-menuitem-active > .p-menuitem-link .p-submenu-icon { color: #6c757d; } .p-tieredmenu .p-menu-separator { border-top: 1px solid #dee2e6; margin: 0.25rem 0; } .p-tieredmenu .p-submenu-icon { font-size: 0.875rem; } .p-inline-message { padding: 0.5rem 0.5rem; margin: 0; border-radius: 3px; } .p-inline-message.p-inline-message-info { background: #B3E5FC; border: solid #0891cf; border-width: 0px; color: #044868; } .p-inline-message.p-inline-message-info .p-inline-message-icon { color: #044868; } .p-inline-message.p-inline-message-success { background: #C8E6C9; border: solid #439446; border-width: 0px; color: #224a23; } .p-inline-message.p-inline-message-success .p-inline-message-icon { color: #224a23; } .p-inline-message.p-inline-message-warn { background: #FFECB3; border: solid #d9a300; border-width: 0px; color: #6d5100; } .p-inline-message.p-inline-message-warn .p-inline-message-icon { color: #6d5100; } .p-inline-message.p-inline-message-error { background: #FFCDD2; border: solid #e60017; border-width: 0px; color: #73000c; } .p-inline-message.p-inline-message-error .p-inline-message-icon { color: #73000c; } .p-inline-message .p-inline-message-icon { font-size: 1rem; margin-right: 0.5rem; } .p-inline-message .p-inline-message-text { font-size: 1rem; } .p-inline-message.p-inline-message-icon-only .p-inline-message-icon { margin-right: 0; } .p-message { margin: 1rem 0; border-radius: 3px; } .p-message .p-message-wrapper { padding: 1rem 1.5rem; } .p-message .p-message-close { width: 2rem; height: 2rem; border-radius: 50%; background: transparent; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-message .p-message-close:hover { background: rgba(255, 255, 255, 0.3); } .p-message .p-message-close:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-message.p-message-info { background: #B3E5FC; border: solid #0891cf; border-width: 0 0 0 6px; color: #044868; } .p-message.p-message-info .p-message-icon { color: #044868; } .p-message.p-message-info .p-message-close { color: #044868; } .p-message.p-message-success { background: #C8E6C9; border: solid #439446; border-width: 0 0 0 6px; color: #224a23; } .p-message.p-message-success .p-message-icon { color: #224a23; } .p-message.p-message-success .p-message-close { color: #224a23; } .p-message.p-message-warn { background: #FFECB3; border: solid #d9a300; border-width: 0 0 0 6px; color: #6d5100; } .p-message.p-message-warn .p-message-icon { color: #6d5100; } .p-message.p-message-warn .p-message-close { color: #6d5100; } .p-message.p-message-error { background: #FFCDD2; border: solid #e60017; border-width: 0 0 0 6px; color: #73000c; } .p-message.p-message-error .p-message-icon { color: #73000c; } .p-message.p-message-error .p-message-close { color: #73000c; } .p-message .p-message-text { font-size: 1rem; font-weight: 500; } .p-message .p-message-icon { font-size: 1.5rem; margin-right: 0.5rem; } .p-message .p-message-summary { font-weight: 700; } .p-message .p-message-detail { margin-left: 0.5rem; } .p-toast { opacity: 0.9; } .p-toast .p-toast-message { margin: 0 0 1rem 0; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); border-radius: 3px; } .p-toast .p-toast-message .p-toast-message-content { padding: 1rem; border-width: 0 0 0 6px; } .p-toast .p-toast-message .p-toast-message-content .p-toast-message-text { margin: 0 0 0 1rem; } .p-toast .p-toast-message .p-toast-message-content .p-toast-message-icon { font-size: 2rem; } .p-toast .p-toast-message .p-toast-message-content .p-toast-summary { font-weight: 700; } .p-toast .p-toast-message .p-toast-message-content .p-toast-detail { margin: 0.5rem 0 0 0; } .p-toast .p-toast-message .p-toast-icon-close { width: 2rem; height: 2rem; border-radius: 50%; background: transparent; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; } .p-toast .p-toast-message .p-toast-icon-close:hover { background: rgba(255, 255, 255, 0.3); } .p-toast .p-toast-message .p-toast-icon-close:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-toast .p-toast-message.p-toast-message-info { background: #B3E5FC; border: solid #0891cf; border-width: 0 0 0 6px; color: #044868; } .p-toast .p-toast-message.p-toast-message-info .p-toast-message-icon, .p-toast .p-toast-message.p-toast-message-info .p-toast-icon-close { color: #044868; } .p-toast .p-toast-message.p-toast-message-success { background: #C8E6C9; border: solid #439446; border-width: 0 0 0 6px; color: #224a23; } .p-toast .p-toast-message.p-toast-message-success .p-toast-message-icon, .p-toast .p-toast-message.p-toast-message-success .p-toast-icon-close { color: #224a23; } .p-toast .p-toast-message.p-toast-message-warn { background: #FFECB3; border: solid #d9a300; border-width: 0 0 0 6px; color: #6d5100; } .p-toast .p-toast-message.p-toast-message-warn .p-toast-message-icon, .p-toast .p-toast-message.p-toast-message-warn .p-toast-icon-close { color: #6d5100; } .p-toast .p-toast-message.p-toast-message-error { background: #FFCDD2; border: solid #e60017; border-width: 0 0 0 6px; color: #73000c; } .p-toast .p-toast-message.p-toast-message-error .p-toast-message-icon, .p-toast .p-toast-message.p-toast-message-error .p-toast-icon-close { color: #73000c; } .p-galleria .p-galleria-close { margin: 0.5rem; background: transparent; color: #f8f9fa; width: 4rem; height: 4rem; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; border-radius: 50%; } .p-galleria .p-galleria-close .p-galleria-close-icon { font-size: 2rem; } .p-galleria .p-galleria-close:hover { background: rgba(255, 255, 255, 0.1); color: #f8f9fa; } .p-galleria .p-galleria-item-nav { background: transparent; color: #f8f9fa; width: 4rem; height: 4rem; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; border-radius: 3px; margin: 0 0.5rem; } .p-galleria .p-galleria-item-nav .p-galleria-item-prev-icon, .p-galleria .p-galleria-item-nav .p-galleria-item-next-icon { font-size: 2rem; } .p-galleria .p-galleria-item-nav:not(.p-disabled):hover { background: rgba(255, 255, 255, 0.1); color: #f8f9fa; } .p-galleria .p-galleria-caption { background: rgba(0, 0, 0, 0.5); color: #f8f9fa; padding: 1rem; } .p-galleria .p-galleria-indicators { padding: 1rem; } .p-galleria .p-galleria-indicators .p-galleria-indicator button { background-color: #e9ecef; width: 1rem; height: 1rem; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; border-radius: 50%; } .p-galleria .p-galleria-indicators .p-galleria-indicator button:hover { background: #dee2e6; } .p-galleria .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: #E3F2FD; color: #495057; } .p-galleria.p-galleria-indicators-bottom .p-galleria-indicator, .p-galleria.p-galleria-indicators-top .p-galleria-indicator { margin-right: 0.5rem; } .p-galleria.p-galleria-indicators-left .p-galleria-indicator, .p-galleria.p-galleria-indicators-right .p-galleria-indicator { margin-bottom: 0.5rem; } .p-galleria.p-galleria-indicator-onitem .p-galleria-indicators { background: rgba(0, 0, 0, 0.5); } .p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator button { background: rgba(255, 255, 255, 0.4); } .p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator button:hover { background: rgba(255, 255, 255, 0.6); } .p-galleria.p-galleria-indicator-onitem .p-galleria-indicators .p-galleria-indicator.p-highlight button { background: #E3F2FD; color: #495057; } .p-galleria .p-galleria-thumbnail-container { background: rgba(0, 0, 0, 0.9); padding: 1rem 0.25rem; } .p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-prev, .p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-next { margin: 0.5rem; background-color: transparent; color: #f8f9fa; width: 2rem; height: 2rem; transition: background-color 0.2s, color 0.2s, box-shadow 0.2s; border-radius: 50%; } .p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-prev:hover, .p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-next:hover { background: rgba(255, 255, 255, 0.1); color: #f8f9fa; } .p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-item-content { transition: box-shadow 0.2s; } .p-galleria .p-galleria-thumbnail-container .p-galleria-thumbnail-item-content:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-galleria-mask.p-component-overlay { background-color: rgba(0, 0, 0, 0.9); } .p-inplace .p-inplace-display { padding: 0.5rem 0.5rem; border-radius: 3px; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; } .p-inplace .p-inplace-display:not(.p-disabled):hover { background: #e9ecef; color: #495057; } .p-inplace .p-inplace-display:focus { outline: 0 none; outline-offset: 0; box-shadow: 0 0 0 0.2rem #a6d5fa; } .p-progressbar { border: 0 none; height: 1.5rem; background: #dee2e6; border-radius: 3px; } .p-progressbar .p-progressbar-value { border: 0 none; margin: 0; background: #2196F3; } .p-progressbar .p-progressbar-label { color: #495057; line-height: 1.5rem; } .p-terminal { background: #ffffff; color: #495057; border: 1px solid #dee2e6; padding: 1rem; } .p-terminal .p-terminal-input { font-size: 1rem; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; } .p-blockui.p-component-overlay { background: rgba(0, 0, 0, 0.4); } .p-badge { background: #2196F3; color: #ffffff; font-size: 0.75rem; font-weight: 700; min-width: 1.5rem; height: 1.5rem; line-height: 1.5rem; } .p-badge.p-badge-secondary { background-color: #607D8B; color: #ffffff; } .p-badge.p-badge-success { background-color: #689F38; color: #ffffff; } .p-badge.p-badge-info { background-color: #0288D1; color: #ffffff; } .p-badge.p-badge-warning { background-color: #FBC02D; color: #212529; } .p-badge.p-badge-danger { background-color: #D32F2F; color: #ffffff; } .p-badge.p-badge-lg { font-size: 1.125rem; min-width: 2.25rem; height: 2.25rem; line-height: 2.25rem; } .p-badge.p-badge-xl { font-size: 1.5rem; min-width: 3rem; height: 3rem; line-height: 3rem; } .p-tag { background: #2196F3; color: #ffffff; font-size: 0.75rem; font-weight: 700; padding: 0.25rem 0.4rem; border-radius: 3px; } .p-tag.p-tag-success { background-color: #689F38; color: #ffffff; } .p-tag.p-tag-info { background-color: #0288D1; color: #ffffff; } .p-tag.p-tag-warning { background-color: #FBC02D; color: #212529; } .p-tag.p-tag-danger { background-color: #D32F2F; color: #ffffff; } /* Customizations to the designer theme should be defined here */ .p-component,.p-component *{box-sizing:border-box} .p-hidden{display:none} .p-hidden-accessible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px} .p-hidden-accessible input,.p-hidden-accessible select{transform:scale(0)} .p-reset{margin:0;padding:0;border:0;outline:0;text-decoration:none;font-size:100%;list-style:none} .p-disabled,.p-disabled *{cursor:default !important} .p-component-overlay{position:fixed;top:0;left:0;width:100%;height:100%} .p-overflow-hidden{overflow:hidden} .p-unselectable-text{-webkit-user-select:none;-moz-user-select:none;user-select:none} .p-scrollbar-measure{width:100px;height:100px;overflow:scroll;position:absolute;top:-9999px} @keyframes p-fadein{0%{opacity:0}100%{opacity:1}} input[type="button"],input[type="submit"],input[type="reset"],input[type="file"]::-webkit-file-upload-button,button{border-radius:0} .p-link{text-align:left;background-color:transparent;margin:0;padding:0;border:0;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none} .p-sr-only{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal !important} .p-connected-overlay{opacity:0;transform:scaleY(0.8);transition:transform .12s cubic-bezier(0,0,0.2,1),opacity .12s cubic-bezier(0,0,0.2,1)} .p-connected-overlay-visible{opacity:1;transform:scaleY(1)} .p-connected-overlay-hidden{opacity:0;transform:scaleY(1);transition:opacity .1s linear} .p-toggleable-content.ng-animating{overflow:hidden} .p-badge{display:inline-block;border-radius:50%;text-align:center} .p-tag{display:inline-block;text-align:center;line-height:1.5} .p-tag.p-tag-rounded{border-radius:10rem} .p-overlay-badge{position:relative;display:inline-block} .p-overlay-badge .p-badge{position:absolute;top:0;right:0;transform:translate(1em,-1em);margin:0} .p-button{margin:0;display:inline-flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;vertical-align:bottom;text-align:center;overflow:hidden;position:relative} .p-button-label{flex:1 1 auto} .p-button-icon-right{order:1} .p-button:disabled{cursor:default} .p-button-icon-only{justify-content:center} .p-button-icon-only .p-button-label{visibility:hidden;width:0;flex:0 0 auto} .p-button-vertical{flex-direction:column} .p-button-icon-bottom{order:2} .p-buttonset .p-button{margin:0} .p-buttonset .p-button:not(:last-child){border-right:0 none} .p-buttonset .p-button:not(:first-of-type):not(:last-of-type){border-radius:0} .p-buttonset .p-button:first-of-type{border-top-right-radius:0;border-bottom-right-radius:0} .p-buttonset .p-button:last-of-type{border-top-left-radius:0;border-bottom-left-radius:0} .p-buttonset .p-button:focus{position:relative;z-index:1} .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:bottom} .p-checkbox-box{display:flex;justify-content:center;align-items:center} p-checkbox{display:inline-flex;vertical-align:bottom;align-items:center} .p-checkbox-label{line-height:1} .p-colorpicker-panel .p-colorpicker-color{background:transparent url('color.png') no-repeat left top} .p-colorpicker-panel .p-colorpicker-hue{background:transparent url('hue.png') no-repeat left top} .p-inputtext{margin:0} .p-fluid .p-inputtext{width:100%} .p-inputgroup{display:flex;align-items:stretch;width:100%} .p-inputgroup-addon{display:flex;align-items:center;justify-content:center} .p-inputgroup .p-float-label{display:flex;align-items:stretch;width:100%} .p-inputgroup .p-inputtext,.p-fluid .p-inputgroup .p-inputtext{flex:1 1 auto;width:1%} .p-float-label{display:block;position:relative} .p-float-label label{position:absolute;pointer-events:none;top:50%;margin-top:-.5rem;transition-property:all;transition-timing-function:ease;line-height:1} .p-float-label textarea ~ label{top:1rem} .p-float-label input:focus ~ label,.p-float-label input.p-filled ~ label,.p-float-label textarea:focus ~ label,.p-float-label textarea.p-filled ~ label,.p-float-label .p-inputwrapper-focus ~ label,.p-float-label .p-inputwrapper-filled ~ label{top:-.75rem;font-size:12px} .p-float-label .input:-webkit-autofill ~ label{top:-20px;font-size:12px} .p-input-icon-left,.p-input-icon-right{position:relative;display:inline-block} .p-input-icon-left>i,.p-input-icon-right>i{position:absolute;top:50%;margin-top:-.5rem} .p-fluid .p-input-icon-left,.p-fluid .p-input-icon-right{display:block;width:100%} .p-inputtextarea-resizable{overflow:hidden;resize:none} .p-fluid .p-inputtextarea{width:100%} .p-password-meter{background:transparent url('password-meter.png') no-repeat left top;height:10px} .p-password-panel-overlay{position:absolute;display:none} .p-radiobutton{display:inline-flex;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:bottom} .p-radiobutton-box{display:flex;justify-content:center;align-items:center} .p-radiobutton-icon{backface-visibility:hidden;transform:translateZ(0) scale(.1);border-radius:50%;visibility:hidden} .p-radiobutton-box.p-highlight .p-radiobutton-icon{transform:translateZ(0) scale(1.0,1.0);visibility:visible} p-radiobutton{display:inline-flex;vertical-align:bottom;align-items:center} .p-radiobutton-label{line-height:1} .p-ripple{overflow:hidden;position:relative} .p-ink{display:block;position:absolute;background:rgba(255,255,255,0.5);border-radius:100%;transform:scale(0)} .p-ink-active{animation:ripple .4s linear} .p-ripple-disabled .p-ink{display:none !important} @keyframes ripple{100%{opacity:0;transform:scale(2.5)}} .p-tooltip{position:absolute;display:none;padding:.25em .5rem;max-width:12.5rem} .p-tooltip.p-tooltip-right,.p-tooltip.p-tooltip-left{padding:0 .25rem} .p-tooltip.p-tooltip-top,.p-tooltip.p-tooltip-bottom{padding:.25em 0} .p-tooltip .p-tooltip-text{white-space:pre-line} .p-tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid} .p-tooltip-right .p-tooltip-arrow{top:50%;left:0;margin-top:-.25rem;border-width:.25em .25em .25em 0} .p-tooltip-left .p-tooltip-arrow{top:50%;right:0;margin-top:-.25rem;border-width:.25em 0 .25em .25rem} .p-tooltip.p-tooltip-top{padding:.25em 0} .p-tooltip-top .p-tooltip-arrow{bottom:0;left:50%;margin-left:-.25rem;border-width:.25em .25em 0} .p-tooltip-bottom .p-tooltip-arrow{top:0;left:50%;margin-left:-.25rem;border-width:0 .25em .25rem} html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { margin: 0; font-family: "UnileverShilling" !important; font-size: 100%; font-weight: normal; line-height: 1.3; color: #333333; text-align: left; background-color: #ffffff; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #000; } body.modal-open { overflow: hidden; } /*////////////////////////////////////////////////////////////////// [ FONT ]*/ /*** Unilever Shilling***/ @font-face { font-family: "UnileverShilling"; src: url('UnileverShilling-Bd.eot'); /* IE9 Compat Modes */ src: url('UnileverShilling-Bd.eot?#iefix') format("embedded-opentype"), url('UnileverShilling-Bd.svg') format("svg"), url('UnileverShilling-Bd.ttf') format("truetype"), url('UnileverShilling-Bd.woff') format("woff"), url('UnileverShilling-Bd.woff2') format("woff2"); /* Modern Browsers */ font-weight: 900; font-style: normal; } @font-face { font-family: "UnileverShilling"; src: url('UnileverShilling-Md.eot'); /* IE9 Compat Modes */ src: url('UnileverShilling-Md.eot?#iefix') format("embedded-opentype"), url('UnileverShilling-Md.svg') format("svg"), url('UnileverShilling-Md.ttf') format("truetype"), url('UnileverShilling-Md.woff') format("woff"), url('UnileverShilling-Md.woff2') format("woff2"); /* Modern Browsers */ font-weight: 500; font-style: normal; } @font-face { font-family: "UnileverShilling"; src: url('UnileverShilling.eot'); /* IE9 Compat Modes */ src: url('UnileverShilling.eot?#iefix') format("embedded-opentype"), url('UnileverShilling.svg') format("svg"), url('UnileverShilling.ttf') format("truetype"), url('UnileverShilling.woff') format("woff"), url('UnileverShilling.woff2') format("woff2"); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: "UnileverShilling"; src: url('UnileverShillingBold.eot'); /* IE9 Compat Modes */ src: url('UnileverShillingBold.eot?#iefix') format("embedded-opentype"), url('UnileverShillingBold.svg') format("svg"), url('UnileverShillingBold.ttf') format("truetype"), url('UnileverShillingBold.woff') format("woff"), url('UnileverShillingBold.woff2') format("woff2"); /* Modern Browsers */ font-weight: bold; font-style: normal; } @font-face { font-family: "UnileverShilling"; src: url('UnileverShillingItalic.eot'); /* IE9 Compat Modes */ src: url('UnileverShillingItalic.eot?#iefix') format("embedded-opentype"), url('UnileverShillingItalic.svg') format("svg"), url('UnileverShillingItalic.ttf') format("truetype"), url('UnileverShillingItalic.woff') format("woff"), url('UnileverShillingItalic.woff2') format("woff2"); /* Modern Browsers */ font-weight: normal; font-style: italic; } /*////////////////////////////////////////////////////////////////// [ RESTYLE TAG ]*/ *, *::before, *::after { box-sizing: border-box; } article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; vertical-align: baseline; } /*---------------------------------------------*/ h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 0; } p { margin-top: 0; margin-bottom: 0; } img { vertical-align: middle; border-style: none; max-width: 100%; } /*---------------------------------------------*/ ul, li { margin: 0px; list-style-type: none; } button { outline: none !important; border: none; background: transparent; } button:hover { cursor: pointer; } iframe { border: none !important; } .hide { display: none !important; } .text-red { color: #ff5450; } a { color: #4285F4; text-decoration: none; background-color: transparent; -webkit-text-decoration-skip: objects; } a:hover { color: #0675D6; text-decoration: none; } a:not([href]):not([tabindex]) { color: inherit; text-decoration: none; } a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus { color: inherit; text-decoration: none; } a:not([href]):not([tabindex]):focus { outline: 0; } /*---------------------------------------------*/ input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-transition: background-color 5000s ease-in-out 0s; transition: background-color 5000s ease-in-out 0s; -webkit-box-shadow: 0 0 0px 1000px transparent inset; color: #005eef !important; } input, select, textarea { box-shadow: none; background-color: transparent; border-radius: 0; outline: none; -webkit-appearance: none; color: #000000; } input::-webkit-input-placeholder, select::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #adadad; } input:-moz-placeholder, select:-moz-placeholder, textarea:-moz-placeholder { color: #adadad; } input::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder { color: #adadad; } input:-ms-input-placeholder, select:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #adadad; } input:focus, select:focus, textarea:focus { outline: none; border-color: transparent; } input:focus::-webkit-input-placeholder, select:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { color: transparent; } input:focus:-moz-placeholder, select:focus:-moz-placeholder, textarea:focus:-moz-placeholder { color: transparent; } input:focus::-moz-placeholder, select:focus::-moz-placeholder, textarea:focus::-moz-placeholder { color: transparent; } input:focus:-ms-input-placeholder, select:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { color: transparent; } input:disabled, select:disabled, textarea:disabled { color: #1d2431; } ::-webkit-scrollbar { width: 6px; height: 6px; border-radius: 100px; } ::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.1); } ::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.3); border-radius: 100px; opacity: 0; } ::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, 0.4); opacity: 1; } .title-select { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #ffffff; margin-bottom: 4.2666666667vw; } .title-block { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #002083; margin-bottom: 4.5333333333vw; text-align: center; } .custom-select { position: relative; } .custom-select .select-selected { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #ccd2e6; padding-left: 4.2666666667vw; height: 13.3333333333vw; line-height: 13.3333333333vw; padding-right: 10.6666666667vw; border: 1px solid transparent; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; background-color: #ffffff; position: relative; border-radius: 1.8666666667vw; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .custom-select .select-selected:after { position: absolute; content: ""; top: 5.3333333333vw; right: 2.6666666667vw; width: 0; height: 0; border: 1.6vw solid transparent; border-color: #001f82 transparent transparent transparent; } .custom-select .select-selected.active { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; } .custom-select .select-selected.select-arrow-active:after { border-color: transparent transparent #001f82 transparent; top: 4vw; } .custom-select .dropdown-select { position: absolute; background-color: #ffffff; left: 0; right: 0; z-index: 99; top: 15.4666666667vw; width: 100%; border-bottom-right-radius: 1.8666666667vw; border-bottom-left-radius: 1.8666666667vw; box-shadow: 1px 0.5333333333vw 2.1333333333vw rgba(0, 0, 0, 0.2); } .custom-select .dropdown-select ul { max-height: 56vw; overflow: auto; } .custom-select .dropdown-select .select-active { padding: 0 4vw; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; } .custom-select .dropdown-select li { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; padding: 4vw; border-bottom: 1px solid #e7eaf3; } .custom-select .dropdown-select li .checkbox { display: flex; } .custom-select .dropdown-select li .checkbox label::before { top: 50%; transform: translate(0, -50%); } .custom-select .dropdown-select li .checkbox label::after { top: 49%; transform: translate(0, -49%) rotate(-45deg); } .custom-select .dropdown-select li:last-child { border-bottom: 0; } .custom-select .dropdown-select li.active { position: relative; } .custom-select .dropdown-select li.active:after { content: ""; width: 4.8vw; height: 4.8vw; display: inline-block; -o-object-fit: contain; object-fit: contain; background-image: url('check-2.png'); background-position: center; background-repeat: no-repeat; background-size: 80%; right: 0; position: absolute; } .custom-select .dropdown-select.select-hide { display: none; top: 100%; } .custom-check-select { margin-bottom: 4.5333333333vw; } .custom-check-select .title-select { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #002083; } .custom-check-select .dropdown-select { padding: 0; } .custom-check-select .dropdown-select ul { padding-bottom: 13.3333333333vw; } .custom-check-select .select-selected { border: 1px solid #001f82; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding-right: 8vw; } .custom-check-select .custom-select .dropdown-select li { padding: 0 4vw; } .custom-check-select .select-active { position: absolute; bottom: 0; display: flex; justify-content: space-between; align-items: center; background-color: #e7eaf3; left: 0; width: 100%; } .custom-check-select .btn-group-active .del { color: #b8c1dc; margin-right: 4.2666666667vw; } .form-group { margin-top: 5.3333333333vw; } .form-group .title-form { font-family: "UnileverShilling"; font-weight: 900; font-size: 4vw; color: #001f82; display: block; margin-bottom: 1.3333333333vw; } .form-group .title-form.survey-title { margin-bottom: 4vw; } .form-group .form-control { width: 100%; border: 0; border-bottom: 1px solid #e5e8f2; padding: 2.1333333333vw 0; padding-left: 3.2vw; display: flex; align-items: center; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.8vw; color: #005eef; } .form-group .form-control::-moz-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.8vw; opacity: 1; } .form-group .form-control:-ms-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.8vw; } .form-group .form-control::-webkit-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.8vw; } .form-group .form-control[readonly] { opacity: 0.5; color: #001f82; background-color: #d8d8d8 !important; border-radius: 13.3333333333vw; cursor: not-allowed; } .form-group .form-control[readonly]:-webkit-autofill, .form-group .form-control[readonly]:-webkit-autofill:hover, .form-group .form-control[readonly]:-webkit-autofill:focus { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.8vw; color: #777777; } .form-group .form-control.disable { opacity: 0.5; color: #001f82; background-color: #d8d8d8 !important; border-radius: 13.3333333333vw; } .form-group .form-control.survey-other { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.7333333333vw; color: #001f82; } .form-group .form-control.survey-other::-moz-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4vw; opacity: 1; } .form-group .form-control.survey-other:-ms-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4vw; } .form-group .form-control.survey-other::-webkit-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4vw; } .form-group .form-field.has-tel { position: relative; } .form-group .form-field.has-tel::before { content: attr(data-tell); font-family: "UnileverShilling"; font-weight: 400; font-size: 4.8vw; color: #001f82; position: absolute; top: 0; bottom: 0; align-items: center; display: flex; left: 3.2vw; } .form-group .form-field.has-tel .form-control { padding-left: 12.8vw; } .form-group .form-field.hasicon-r { position: relative; } .form-group .form-field.hasicon-r.icon-list::before { display: none; } .form-group .form-field.hasicon-r.icon-list .icon-phone { position: absolute; top: 50%; right: 5.3333333333vw; transform: translateY(-50%); height: 5.8666666667vw; width: 5.3333333333vw; } .form-group .form-field.hasicon-r.icon-list .icon-phone::before { background-size: contain; background-position: 2.1333333333vw; padding-left: 9.3333333333vw; height: 5.8666666667vw; width: 5.3333333333vw; background-repeat: no-repeat; content: ""; background-image: url('Vector.png') !important; } .form-group .form-field.hasicon-r.icon-list .form-control[readonly] { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.8vw; color: #777777; } .form-group .form-field.hasicon-r.icon-list .form-control[readonly]:-webkit-autofill, .form-group .form-field.hasicon-r.icon-list .form-control[readonly]:-webkit-autofill:hover, .form-group .form-field.hasicon-r.icon-list .form-control[readonly]:-webkit-autofill:focus { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.8vw; color: #777777; } .form-group .form-field.hasicon-r.icon-list .form-control:-webkit-autofill, .form-group .form-field.hasicon-r.icon-list .form-control:-webkit-autofill:hover, .form-group .form-field.hasicon-r.icon-list .form-control:-webkit-autofill:focus { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #005eef; } .form-group .form-field.hasicon-r.icon-list .form-control::-moz-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; opacity: 1; } .form-group .form-field.hasicon-r.icon-list .form-control:-ms-input-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; } .form-group .form-field.hasicon-r.icon-list .form-control::-webkit-input-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; } .form-group .form-field.hasicon-r::before { content: ""; background-image: url('phone.png'); background-size: contain; background-position: 2.1333333333vw; padding-left: 9.3333333333vw; background-repeat: no-repeat; position: absolute; top: 50%; right: 0; transform: translateY(-50%); height: 5.8666666667vw; width: 3.4666666667vw; } .form-group .form-field.hasicon-r .form-control { padding-right: 10.1333333333vw; font-family: "UnileverShilling"; font-weight: 400; font-size: 4.2666666667vw; color: #001f82; } .form-group .form-field.border-form { border: 1px solid #001f82; background: #ffffff; border-radius: 1.8666666667vw; padding: 2.1333333333vw 4vw; margin-top: 4vw; } .form-group .form-field.border-form .form-control { border: 0; } .form-group.form-share { position: relative; } .form-group.form-share .form-control { border: 0; height: 13.3333333333vw; border-radius: 1.8666666667vw; background-color: #e5eefd; padding-left: 4.2666666667vw; padding-right: 21.3333333333vw; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; letter-spacing: 0.2em; } .form-group.form-share .btn-text { position: absolute; top: 2.6666666667vw; right: 2.6666666667vw; font-family: "UnileverShilling"; font-weight: 400; font-size: 3.7333333333vw; color: #001f82; height: 8.5333333333vw; line-height: 8.5333333333vw; background-color: #ffffff; border-radius: 1.8666666667vw; padding: 0 10px; cursor: pointer; } .form-group.form-share .btn-text.active::before { content: ""; background-image: url('check-3.png'); position: absolute; width: 4.8vw; height: 3.7333333333vw; background-size: contain; background-repeat: no-repeat; right: 18.6666666667vw; top: 0; bottom: 0; margin: auto; } .radio-inline { display: flex; } .radio-inline .radio-item { margin-top: 4.2666666667vw; } .radio-inline .radio-item + .radio-item { margin-left: 10.6666666667vw; } .radio-item { font-size: 2.9333333333vw; line-height: normal; color: #002083; } .radio-item label { font-size: 4vw; line-height: 18px; letter-spacing: 0.05px; width: 100%; display: flex; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; align-items: center; } .radio-item label input { position: absolute; opacity: 0; cursor: pointer; } .radio-item p { font-size: 3.4666666667vw; line-height: normal; color: #002083; margin-left: 8.5333333333vw; } .radio-item .survey-item { font-size: 3.7333333333vw !important; } .radio-item .checkmark { position: absolute; left: 0; width: 4vw; height: 4vw; background: transparent; border-radius: 50%; border: 2px solid #d5d5d5; } .radio-item .checkmark:after { content: ""; position: absolute; display: none; } .radio-item label input:checked ~ .checkmark { border: 3px solid #005eee; } .radio-item label input:checked ~ .checkmark:after { display: block; } .radio-item label input[type=checkbox] ~ .checkmark { width: 4.8vw; height: 4.8vw; background: transparent; border-radius: 1.3333333333vw; border: 2px solid #d5d5d5; } .radio-item label input[type=checkbox] ~ .checkmark:after { content: ""; width: 4.8vw; height: 4.8vw; display: inline-block; -o-object-fit: contain; object-fit: contain; background-image: url('check.png'); background-size: 40%; border-radius: 50%; background-position: center; background-repeat: no-repeat; display: none; } .radio-item label input[type=checkbox]:checked ~ .checkmark { border: 0; background-color: #005eee; } .radio-item label input[type=checkbox]:checked ~ .checkmark:after { display: block; } .checkbox { position: relative; padding: 3.7333333333vw 0; border-bottom: 1px solid #f2f2f2; } .checkbox input { border: none; } .checkbox:last-child { border-bottom: 0; } .checkbox label { padding-left: 9.3333333333vw; position: relative; } .checkbox label::before, .checkbox label::after { position: absolute; content: ""; /*Needed for the line-height to take effect*/ display: inline-block; } .checkbox label::before { height: 4.8vw; width: 4.8vw; border: 2px solid rgba(0, 31, 130, 0.2); left: 0px; border-radius: 0.8vw; top: 0.5333333333vw; } .checkbox label::after { height: 1.6vw; width: 2.6666666667vw; border-left: 0.5333333333vw solid #ffffff; border-bottom: 0.5333333333vw solid #ffffff; transform: rotate(-45deg); left: 1.0666666667vw; top: 1.8666666667vw; } .checkbox input[type=checkbox] + label::after { content: none; } .checkbox input[type=checkbox]:checked + label::after { content: ""; } .checkbox input[type=checkbox]:checked + label::before { content: ""; background: #0d009d; border: 2px solid #0d009d; } .checkbox-item input[type=text] { height: 11.7333333333vw; margin-top: 3.2vw; margin-bottom: 2.1333333333vw; border-radius: 2.6666666667vw; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #2A2B2A; letter-spacing: 0.04em; width: 100%; border: 1px solid #3e3e3e; padding: 0 4.2666666667vw; background-color: #ffffff; } .checkbox-item input[type=text]:-webkit-autofill, .checkbox-item input[type=text]:-webkit-autofill:hover, .checkbox-item input[type=text]:-webkit-autofill:focus { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #2A2B2A; -webkit-text-fill-color: #2A2B2A; } .checkbox-item input[type=text]:focus { border: 1px solid #3e3e3e; } .checkbox-item label { width: 100%; display: flex; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; align-items: center; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.7333333333vw; color: #121212; } .checkbox-item label input[type=checkbox], .checkbox-item label input[type=radio] { position: absolute; opacity: 0; cursor: pointer; } @media (min-width: 992px) { .checkbox-item label { font-size: 0.3078037299vw; } } .checkbox-item p { margin-left: 8.5333333333vw; } .checkbox-item p a { color: #001f82; } @media (min-width: 992px) { .checkbox-item p { margin-left: 0.5793952562vw; } } .checkbox-item .checkmark { position: absolute; left: 0; } .checkbox-item .checkmark:after { content: ""; position: absolute; display: none; } .checkbox-item label input[type=checkbox] ~ .checkmark { width: 4.8vw; height: 4.8vw; background: transparent; border-radius: 1.0666666667vw; border: 1.2px solid #001f82; } @media (min-width: 992px) { .checkbox-item label input[type=checkbox] ~ .checkmark { width: 0.3259098316vw; height: 0.3259098316vw; border-radius: 0.072424407vw; } } .checkbox-item label input[type=checkbox] ~ .checkmark:after { content: ""; height: 1.6vw; width: 2.6666666667vw; border-left: 0.5333333333vw solid #ffffff; border-bottom: 0.5333333333vw solid #ffffff; transform: rotate(-45deg); left: 24%; top: 30%; display: none; } @media (min-width: 992px) { .checkbox-item label input[type=checkbox] ~ .checkmark:after { height: 0.1086366105vw; width: 0.1810610176vw; border-left: 0.0362122035vw solid #307379; border-bottom: 0.0362122035vw solid #307379; } } .checkbox-item label input[type=checkbox]:checked ~ .checkmark { border: 0; background-color: #001f82; } .checkbox-item label input[type=checkbox]:checked ~ .checkmark:after { display: block; } .checkbox-item label input[type=radio] ~ .checkmark { width: 4.8vw; height: 4.8vw; background: transparent; border-radius: 50%; border: 1.2px solid #001f82; } .checkbox-item label input[type=radio] ~ .checkmark:after { content: ""; height: 2.6666666667vw; width: 2.6666666667vw; background-color: #ffffff; border-radius: 50%; left: 0; right: 0; top: 0; bottom: 0; margin: auto; display: none; } .checkbox-item label input[type=radio]:checked ~ .checkmark { border: 0; background-color: #001f82; } .checkbox-item label input[type=radio]:checked ~ .checkmark:after { display: block; } .checkbox-item.right { display: inline-block; } .checkbox-item.right p { margin-left: 0; margin-right: 6.6666666667vw; } .checkbox-item.right .checkmark { left: auto; right: 0; } .group-checkbox { margin-top: 0.5431830527vw; } @media (max-width: 991.98px) { .group-checkbox { margin-top: 5.3333333333vw; } } .group-checkbox .checkbox-item + .checkbox-item { margin-top: 2.9333333333vw; } @media (min-width: 992px) { .group-checkbox .checkbox-item + .checkbox-item { margin-top: 0.2715915263vw; } } button.disabled { background: #c5c5c5; pointer-events: none; } button.single { width: 100% !important; } .p-autocomplete, .p-multiselect { height: 11.7333333333vw; line-height: 11.7333333333vw; background-color: #ffffff; border-radius: 1.8666666667vw; width: 100%; margin-bottom: 4.2666666667vw; } .p-autocomplete .pi-chevron-down::before, .p-multiselect .pi-chevron-down::before { position: absolute; content: "" !important; top: 5.3333333333vw; right: 4vw; width: 0; height: 0; border: 1.6vw solid transparent; border-color: #001f82 transparent transparent transparent; } .p-autocomplete .p-inputtext:enabled:focus, .p-autocomplete .p-button:focus, .p-autocomplete .p-inputtext:hover, .p-autocomplete .p-inputtext:hover, .p-multiselect .p-inputtext:enabled:focus, .p-multiselect .p-button:focus, .p-multiselect .p-inputtext:hover, .p-multiselect .p-inputtext:hover { box-shadow: none; border: 0; } .p-autocomplete .p-button, .p-autocomplete .p-inputtext, .p-autocomplete .p-button:hover, .p-multiselect .p-button, .p-multiselect .p-inputtext, .p-multiselect .p-button:hover { background-color: transparent; border: 0; } .p-autocomplete .p-button, .p-autocomplete .p-button:enabled:hover, .p-multiselect .p-button, .p-multiselect .p-button:enabled:hover { color: #001f82; } .p-autocomplete .p-autocomplete-items, .p-multiselect .p-autocomplete-items { padding: 4vw; } .p-autocomplete .p-autocomplete-item, .p-multiselect .p-autocomplete-item { text-align: left; padding: 0 !important; } .p-autocomplete .p-autocomplete-item + .p-autocomplete-item, .p-multiselect .p-autocomplete-item + .p-autocomplete-item { border-top: 1px solid #e7eaf3; } .p-autocomplete .p-autocomplete-item:hover, .p-multiselect .p-autocomplete-item:hover { background-color: transparent !important; } .p-autocomplete .p-autocomplete-item .ng-star-inserted, .p-multiselect .p-autocomplete-item .ng-star-inserted { white-space: pre-line; line-height: 1.5; padding-top: 2.1333333333vw; padding-bottom: 2.1333333333vw; padding-right: 5.3333333333vw; } .p-autocomplete .p-autocomplete-item .active, .p-multiselect .p-autocomplete-item .active { position: relative; } .p-autocomplete .p-autocomplete-item .active:after, .p-multiselect .p-autocomplete-item .active:after { content: ""; width: 4.8vw; height: 4.8vw; display: inline-block; -o-object-fit: contain; object-fit: contain; background-image: url('check-2.png'); background-position: center; background-repeat: no-repeat; background-size: 80%; right: 0; top: 0; bottom: 0; margin: auto; position: absolute; } .p-autocomplete .p-inputtext, .p-multiselect .p-inputtext { font-family: "UnileverShilling"; font-weight: normal; font-size: 16px; color: #001f82; padding-left: 4.2666666667vw; border: 1px solid transparent; cursor: pointer; position: relative; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .p-autocomplete .p-inputtext::-moz-placeholder, .p-multiselect .p-inputtext::-moz-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; opacity: 1; } .p-autocomplete .p-inputtext:-ms-input-placeholder, .p-multiselect .p-inputtext:-ms-input-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; } .p-autocomplete .p-inputtext::-webkit-input-placeholder, .p-multiselect .p-inputtext::-webkit-input-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; } .p-multiselect { border-color: #001f82; margin-bottom: 0; } .p-multiselect span.ng-star-inserted { word-break: break-all; white-space: normal; line-height: 1.3; max-width: 100%; } .p-multiselect.p-multiselect:not(.p-disabled):hover { border-color: #001f82; } .p-multiselect .p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-inputtext { border: 1px solid #ced4da; } .p-multiselect .p-multiselect-label { padding-top: 0; padding-bottom: 0; font-family: "UnileverShilling"; font-weight: normal; font-size: 16px; color: #001f82; } .btn { display: inline-block; text-align: center; white-space: nowrap; vertical-align: middle; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; -webkit-user-select: none; -moz-user-select: none; user-select: none; line-height: 1.2; margin-bottom: 0; padding: 2.6666666667vw 3.2vw; border-radius: 5.3333333333vw; font-family: "UnileverShilling"; font-weight: 500; font-size: 4vw; color: #fff; } .btn.btn-primary { background-color: #001f82; color: #fff; margin-left: 0; } .btn.btn-primary.btn-border { background-color: #fff; color: #001f82; border: 1px solid #001f82; } .btn.btn-warning { background-color: #c60034; color: #fff; } .btn.btn-success { background-color: #78d109; color: #fff; } .btn.btn-info { background-color: #005eee; color: #fff; } .btn.btn-confirm { background-color: #01b1ff; color: #fff; } .btn.btn-cancel { font-family: "UnileverShilling"; font-weight: 500; font-size: 2.9333333333vw; color: rgba(0, 32, 131, 0.5); border: 1px solid rgba(0, 32, 131, 0.5); width: 16vw; } .btn.btn-guide { font-family: "UnileverShilling"; font-weight: 500; font-size: 2.9333333333vw; color: rgba(0, 32, 131, 0.5); background-color: #dde1ec; } .btn.disable { color: #fff !important; pointer-events: none; background-color: #ccd2e6 !important; } .btn.disabled { color: #fff !important; pointer-events: none; background-color: #ccd2e6 !important; } .btn.btn-default { color: #fff; background-color: #ccd2e6; } .btn.btn-upload::before { content: ""; width: 5.3333333333vw; height: 5.3333333333vw; background-image: url('upload.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; margin-bottom: -1.3333333333vw; margin-right: 2.1333333333vw; } .btn.btn-upload:after { display: none; } .btn.btn-link { background-color: transparent; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; text-decoration: underline; position: relative; } .btn.btn-link:after { content: ""; width: 3.4666666667vw; height: 3.4666666667vw; background-image: url('next.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; margin-bottom: -0.5333333333vw; margin-left: 1.3333333333vw; } .btn.btn-link.btn-guide-camera { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #005eee; } .btn.btn-link.btn-guide-camera::before { content: ""; width: 5.3333333333vw; height: 5.3333333333vw; background-image: url('info.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; margin-bottom: -1.3333333333vw; margin-right: 2.1333333333vw; } .btn.btn-link.btn-guide-camera:after { display: none; } .btn.btn-sm { font-size: 3.2vw; } .btn.btn-block { display: block; width: 100%; } .btn.btn-bold { font-weight: 900; } .btn.btn-lucky-custom { text-align: center; background-color: #c60034; width: 100%; height: 10.6666666667vw; } .btn.btn-lucky-custom span { background-image: url('present-box-2.png'); background-size: 5.3333333333vw; background-position: 0; padding-left: 9.3333333333vw; background-repeat: no-repeat; } .btn.btn-go-gift { text-align: center; width: 100%; height: 10.6666666667vw; } .btn.btn-go-gift span { background-image: url('warehouse.png'); background-size: 5.3333333333vw; background-position: 0; padding-left: 9.3333333333vw; background-repeat: no-repeat; } .btn.btn-camera-custom.btn-camera-2 { background-image: url('camera-pic.png'); background-repeat: no-repeat; background-size: 4.5333333333vw; background-position: 4vw; padding-left: 9.3333333333vw; } .btn.btn-camera-custom.btn-gift-2 { width: 35.7333333333vw; background-color: #001f82; background-image: url('group-gift.png'); background-repeat: no-repeat; background-size: 4.8vw; background-position: 8vw; padding-left: 9.3333333333vw; font-family: "UnileverShilling"; font-weight: normal; font-size: 4vw; color: #ffffff; } .btn.btn-save-custom { background-image: url('icon-save.png'); background-repeat: no-repeat; background-size: 4.5333333333vw; background-position: 4vw; padding-left: 9.3333333333vw; } .btn-wrapper { position: relative; margin-top: 11.7333333333vw; z-index: 2; } .btn-wrapper .btn + .btn { margin-top: 2.6666666667vw; } .btn-right { text-align: right; } .group-btn-inline { margin-top: 5.3333333333vw; display: flex; justify-content: space-between; position: relative; z-index: 2; } .group-btn-inline.btn-center { display: block; justify-content: space-between; } .group-btn-inline.btn-center .btn { margin: auto; margin-bottom: 3.2vw; width: 56.2666666667vw; display: block; } .group-btn-inline.btn-center .btn.btn-gift-2 { background-position: 10.6666666667vw; padding-left: 10.6666666667vw; } .group-btn-inline .btn { width: 49%; display: block; } .btn-send-gift { background-color: #001f82; height: 10.6666666667vw; padding-top: 0; padding-bottom: 0; } .btn-send-gift span { background-image: url('send-gift.png'); background-repeat: no-repeat; background-size: 4.5333333333vw; background-position: 0; padding-left: 8vw; } .group-btn-inline-3 { margin-top: 5.0666666667vw; margin-bottom: 2.1333333333vw; text-align: center; position: relative; z-index: 2; } .group-btn-inline-3 .btn-camera-custom { background-color: #005eef; background-image: url('camera-pic.png'); background-size: 4.5333333333vw; background-position: 3.2vw; padding-left: 9.3333333333vw; background-repeat: no-repeat; height: 10.6666666667vw; } .group-btn-inline-3 .group-btn-inline .btn-camera-custom { padding-top: 0; padding-bottom: 0; } .group-btn-inline-3 .btn-cancel { width: 21.3333333333vw; } .group-btn-inline-3 .btn-send-gift { background-color: #001f82; background-image: url('send-gift.png'); background-repeat: no-repeat; background-size: 4.5333333333vw; background-position: 8vw; padding-left: 9.3333333333vw; font-size: 3.4666666667vw; height: 10.6666666667vw; padding-top: 0; padding-bottom: 0; } .group-btn-inline-3 .group-btn-inline { margin-top: 3.2vw; margin-bottom: 4.2666666667vw; } .btn-inline-center { text-align: center; } .btn-inline-center button { min-width: 37.3333333333vw; } .overlay { display: none; position: fixed; top: 0%; left: 50%; transform: translate(-50%, 0%); width: 100%; height: 110%; background: rgba(34, 34, 34, 0.1); z-index: 99999; } .overlay.overlay-inner { position: fixed; background: rgba(21, 21, 21, 0.5); } .overlay.overlay-inner .inner { top: 45%; } .overlay.overlay-inner .inner .spinner { display: block; position: relative; width: 20vw; height: 20vw; border-radius: 50%; border: 0.8vw solid transparent; border-top: 0.8vw solid #1f3a82; animation: spinv2 1s linear infinite; } .overlay.overlay-inner .inner .spinner::before, .overlay.overlay-inner .inner .spinner::after { content: ""; position: absolute; border-radius: 50%; border: 0.8vw solid transparent; } .overlay.overlay-inner .inner .spinner::before { top: 0.8vw; left: 0.8vw; right: 0.8vw; bottom: 0.8vw; border-top-width: 1.0666666667vw; border-top-color: #3a5ab1; animation: spinv2 2.25s linear infinite; } .overlay.overlay-inner .inner .spinner::after { top: 2.6666666667vw; left: 2.6666666667vw; right: 2.6666666667vw; bottom: 2.6666666667vw; border-top-width: 1.3333333333vw; border-top-color: #6985d0; animation: spinv2 0.75s linear infinite; } .overlay .inner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .overlay.show { display: block; } @keyframes spinv2 { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .popup-overlay { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.7); transition: opacity 500ms; visibility: visible; opacity: 1; z-index: 9999; } .popup-overlay.hidden { visibility: hidden; opacity: 0; } .popup-overlay .bg-overlay { display: block; opacity: 0; } .popup-warp { margin: 0 auto; width: 90%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .popup-warp .pad-popup { padding: 4.8vw 4vw; } .popup-inner { background: #fff; border-radius: 5.3333333333vw; } .popup-inner.popup-bottom { width: 100%; top: auto; bottom: 0; transform: translate(-50%, 0); border-radius: 6.1333333333vw; border-bottom-left-radius: 0; border-bottom-right-radius: 0; padding-top: 5.3333333333vw; } .popup-inner.popup-bottom .header-popup { font-size: 3.7333333333vw; font-weight: 600; margin-bottom: 6.6666666667vw; text-align: center; display: flex; justify-content: space-between; align-items: center; } .popup-inner.popup-bottom .header-popup .name-popup, .popup-inner.popup-bottom .header-popup .done-btn, .popup-inner.popup-bottom .header-popup .cancel-btn { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #c97a7a; } .popup-inner.popup-bottom .header-popup .name-popup { font-weight: 500; margin: 0; } .popup-inner.popup-bottom .header-popup .cancel-btn { color: #001f82; } .popup-inner .listradio li { background-color: #f2fcff; padding: 6.6666666667vw 3.4666666667vw; margin-bottom: 2.1333333333vw; border-radius: 4vw; } .popup-inner .img-popup img { width: 100%; border-radius: 5.3333333333vw; } .popup-inner .text-popup { text-align: center; padding: 4vw 0; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.4666666667vw; color: #002083; } .popup-inner .text-popup .phone-number { font-family: "UnileverShilling"; font-weight: 500; font-size: 5.8666666667vw; color: #01b1ff; display: block; text-align: center; margin: 1.3333333333vw; } .popup-inner .text-popup .time-on { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.4666666667vw; color: #7786b4; display: block; text-align: center; margin: 1.3333333333vw; } .popup-inner .text-popup strong, .popup-inner .text-popup .link-text { font-weight: 500; } .popup-inner .text-popup .link-text { text-decoration: underline; overflow-wrap: break-word; } .popup-inner .name-popup { font-family: "UnileverShilling"; font-weight: 900; font-size: 6.6666666667vw; color: #002083; text-align: center; margin: 4.8vw 0; } .popup-inner .noti-info { margin: 4.8vw 0; } .icon-popup { width: 16vw; height: 16vw; position: absolute; top: -8vw; right: 0; left: 0; margin: auto; } .close-popup { width: 18px; height: 18px; background-image: url('close.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; position: absolute; top: 20px; right: 20px; margin: auto; cursor: pointer; } .des-popup { padding: 8vw 0; text-align: center; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; } .modal-default .pad-popup { padding-top: 4vw; } .modal-default .name-popup { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #002083; text-align: left; margin: 0; } .modal-confirm .des-hasimg { padding: 0; padding-top: 8vw; text-align: center; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; } .modal-camera select.device { border: 0; padding-left: 20px; margin-top: 10px; color: #8a8a8a; } .modal-camera .name-QRcode { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; margin-top: 2.6666666667vw; margin-bottom: 4.2666666667vw; text-align: center; } .modal-camera .text-barcode { text-align: center; } .modal-camera .text-barcode .name-code { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #005eef; padding-top: 5.3333333333vw; margin-bottom: 1.3333333333vw; } .modal-camera .text-barcode .bar-code { font-family: "UnileverShilling"; font-weight: 500; font-size: 8.5333333333vw; color: #001f82; letter-spacing: 0.2em; } .modal-camera .text-popup { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: rgba(0, 32, 131, 0.75); text-align: center; } .modal-camera .picture-bill { height: 55vh; width: 100%; margin: auto; border: 0.5333333333vw solid #02b2ff; border-radius: 4vw; overflow: hidden; } .modal-camera .picture-bill img { width: 100%; } .modal-camera .picture-bill.QRCode { height: 35vh; width: 90%; margin-bottom: 4.2666666667vw; } .confirm-bill .content-popup { max-height: 70vh; overflow: auto; margin-top: 5.3333333333vw; } .confirm-bill .title-name { font-family: "UnileverShilling"; font-weight: 500; font-size: 3.4666666667vw; color: #002083; margin-top: 4.5333333333vw; } .confirm-bill .title-name:first-child { margin-top: 0; } .confirm-bill .block-feature textarea { border: 1px solid #001f82; border-radius: 1.3333333333vw; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.4666666667vw; color: #001f82; width: 100%; padding: 1.3333333333vw 2.6666666667vw; margin-top: 2.6666666667vw; } .confirm-bill table th { font-family: "UnileverShilling"; font-weight: 500; font-size: 2.9333333333vw; color: #001f82; white-space: nowrap; border-bottom: 1px solid #f5f5f5; padding: 2.6666666667vw 0; } .confirm-bill table th:last-child { text-align: right; } .confirm-bill table td { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000; padding: 2.6666666667vw 1.3333333333vw; border-bottom: 1px solid #f5f5f5; } .confirm-bill table td:last-child { text-align: right; } .modal-bill .text-popup { font-family: "UnileverShilling"; font-weight: 500; font-size: 3.4666666667vw; color: #002083; margin-bottom: 4.5333333333vw; text-align: center; } .modal-bill .picture-bill { height: 55vh; width: auto; border: 0.5333333333vw solid #02b2ff; border-radius: 4vw; overflow: auto; text-align: center; margin: auto; } .modal-bill .picture-bill img { border-bottom: 0.6666666667vw dashed #002083; margin-bottom: 1.3333333333vw; padding-bottom: 1.3333333333vw; } .guide-bill .swiper-slide { text-align: center; } .guide-bill .swiper-slide img { height: 70vh; } .guide-bill .list-des { padding: 0; padding-top: 13.3333333333vw; } .guide-bill .list-des li { padding: 4vw; background-color: #ffffff; border-radius: 1.8666666667vw; margin-bottom: 2.6666666667vw; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.7333333333vw; color: #005eef; position: relative; padding-left: 14.6666666667vw; min-height: 11.7333333333vw; display: flex; align-items: center; box-shadow: 0 0.5333333333vw 2.6666666667vw rgba(175, 175, 175, 0.23); } .guide-bill .list-des li strong { font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #005eef; } .guide-bill .list-des li .text-des p { padding-top: 2.1333333333vw; display: inline-block; } .guide-bill .list-des .number { width: 8vw; height: 8vw; display: inline-flex; justify-content: center; align-items: center; border-radius: 50%; background-color: rgba(0, 94, 239, 0.12); font-family: "UnileverShilling"; font-weight: 500; font-size: 3.4666666667vw; color: #005eef; position: absolute; top: 0; bottom: 0; left: 2.6666666667vw; margin: auto; } .guide-bill .title { text-align: center; margin: 15px 0; } .guide-bill .title.true { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #001f82; } .guide-bill .title.false { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #ff5555; } .infor-bill .block-title { display: flex; justify-content: space-between; align-items: center; margin-top: 1.3333333333vw; } .infor-bill .block-title:first-child { margin-top: 4.2666666667vw; } .infor-bill .title, .infor-bill .value { font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #001f82; } .infor-bill .title { font-weight: normal; } .infor-bill .popup-inner { border-radius: 0; border-bottom-left-radius: 2.6666666667vw; border-bottom-right-radius: 2.6666666667vw; } .infor-bill .pic-bill { max-height: 65vh; overflow: auto; text-align: center; border-radius: 2.6666666667vw; } .infor-bill .pic-bill img { max-width: 100%; max-width: 100%; border-bottom: 0.8vw dashed #002083; margin-bottom: 1.3333333333vw; padding-bottom: 1.3333333333vw; } .infor-bill .header-bill { position: relative; border-radius: 0; border-top-left-radius: 2.6666666667vw; border-top-right-radius: 2.6666666667vw; margin-bottom: 5.0666666667vw; } .infor-bill .header-bill::after { content: ""; height: 8vw; width: 100%; position: absolute; background-image: url('group-3.png'); left: 0; bottom: -7.7333333333vw; background-size: contain; background-repeat: no-repeat; } .modal-phone .pic-popup img { max-height: 53.3333333333vw; } .modal-phone .name-popup { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; margin: 0; margin-bottom: 2.6666666667vw; } .modal-phone .des-popup { font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #151515; padding: 0; } .modal-phone .des-popup span { display: inline-block; border-left: 1px solid #d7d7d7; padding-left: 4.2666666667vw; margin-left: 4.2666666667vw; } @font-face { font-family: "pignose-calendar-icon"; src: url('pignose.calendar.eot?gpa4vl'); src: url('pignose.calendar.eot?gpa4vl#iefix') format("embedded-opentype"), url('pignose.calendar.ttf?gpa4vl') format("truetype"), url('pignose.calendar.woff?gpa4vl') format("woff"); font-weight: normal; font-style: normal; } .calendar { margin-top: 1px; } .pignose-calendar .icon-arrow-left, .pignose-calendar .icon-arrow-right { font-family: "pignose-calendar-icon" !important; speak: none; font-style: normal; font-weight: normal; font-feature-settings: normal; font-variant: normal; text-transform: none; line-height: 1; } .pignose-calendar .icon-arrow-left:before { content: ""; } .pignose-calendar .icon-arrow-right:before { content: ""; } .pignose-calendar-wrapper { display: none; position: fixed; width: 100%; max-width: 96vw; top: 50%; left: 50%; border-radius: 2px; z-index: 50001; overflow: hidden; box-shadow: 0 4px 16px #000000; transform: translate3d(0, 160px, 0); opacity: 0; transition: opacity 0.3s ease, transform 0.5s ease-out; } .pignose-calendar-wrapper.pignose-calendar-wrapper-active { opacity: 1; transform: translate3d(0, 0, 0); } .pignose-calendar-wrapper .pignose-calendar { max-width: auto; width: 100%; border: none; } .pignose-calendar-wrapper .pignose-calendar .pignose-calendar-button-group { border-top: 1px solid #e2e2e2; overflow: hidden; } .pignose-calendar-wrapper .pignose-calendar .pignose-calendar-button-group .pignose-calendar-button { width: 50%; display: block; float: left; height: 3.2em; text-align: center; line-height: 3.2em; color: #333333; font-weight: 600; text-decoration: none; transition: background-color 0.3s ease; box-sizing: border-box; } .pignose-calendar-wrapper .pignose-calendar .pignose-calendar-button-group .pignose-calendar-button:hover { background-color: #efefef; } .pignose-calendar-wrapper .pignose-calendar .pignose-calendar-button-group .pignose-calendar-button-apply { color: #ffffff; background-color: #2fabb7; } .pignose-calendar-wrapper .pignose-calendar .pignose-calendar-button-group .pignose-calendar-button-apply:hover { background-color: #49c4d0; } .pignose-calendar-wrapper-overlay { background-color: #000000; opacity: 0; transition: opacity 0.3s ease; position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 50000; } .pignose-calendar-wrapper-overlay.pignose-calendar-wrapper-overlay-active { opacity: 0.7; } .pignose-calendar { margin-top: 1px; width: 100%; max-width: 96vw; padding: 4.2666666667vw 1.3333333333vw 1.6vw 1.3333333333vw; background-color: #ffffff; border-top-right-radius: 1.8666666667vw; border-top-left-radius: 1.8666666667vw; font-size: 100%; margin: 0 auto; } .pignose-calendar .pignose-calendar-top { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; margin-left: 10.6666666667vw; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-year { font-size: 4.2666666667vw; font-weight: 600; letter-spacing: 0.27px; color: #151515; display: inline-block; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-month { font-size: 4.2666666667vw; font-weight: 600; letter-spacing: 0.27px; color: #151515; display: inline-block; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-nav { display: inline-block; width: 1.6em; height: 1.6em; position: relative; z-index: 5; text-decoration: none; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-nav .pignose-calendar-top-value { display: inline-block; color: #777777; font-size: 115%; font-weight: 600; vertical-align: middle; margin-top: -10px; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-nav .pignose-calendar-top-icon { color: #000000; font-size: 6.6666666667vw; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-nav.pignose-calendar-top-prev { float: left; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-nav.pignose-calendar-top-prev .pignose-calendar-top-value { margin-left: 0.2em; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-nav.pignose-calendar-top-next { float: right; margin-right: 1.6em; } .pignose-calendar .pignose-calendar-top .pignose-calendar-top-nav.pignose-calendar-top-next .pignose-calendar-top-value { margin-right: 0.2em; } .pignose-calendar .pignose-calendar-header { padding: 0; margin-top: 1.3333333333vw; overflow: hidden; } .pignose-calendar .pignose-calendar-header .pignose-calendar-week { float: left; width: 14.28%; text-align: center; line-height: 2.8em; box-sizing: border-box; color: #7f7f7f; font-size: 3.7333333333vw; } .pignose-calendar .pignose-calendar-header .pignose-calendar-week:last-child { width: 14.32%; } .pignose-calendar .pignose-calendar-body .pignose-calendar-row { overflow: hidden; } .pignose-calendar .pignose-calendar-unit { float: left; display: block; height: 10.6666666667vw; width: 14.28%; text-align: center; font-size: 3.7333333333vw; line-height: 2.8em; box-sizing: border-box; } .pignose-calendar .pignose-calendar-unit:last-child { width: 14.32%; } .pignose-calendar .pignose-calendar-unit.disabled-click { pointer-events: none; } .pignose-calendar .pignose-calendar-unit .pignose-calendar-button-schedule-container { line-height: 0.5em; } .pignose-calendar .pignose-calendar-unit .pignose-calendar-button-schedule-container .pignose-calendar-button-schedule-pin { display: inline-block; background-color: #777777; width: 0.5em; height: 0.5em; border-radius: 50%; margin-right: 0.2em; } .pignose-calendar .pignose-calendar-unit .pignose-calendar-button-schedule-container .pignose-calendar-button-schedule-pin:last-child { margin-right: 0; } .pignose-calendar .pignose-calendar-unit a { display: inline-block; width: 2.4em; height: 2.4em; border-radius: 50%; color: #151515; line-height: 2.4em; text-align: center; text-decoration: none; transition: background-color 0.3s ease, color 0.3s ease; } .pignose-calendar .pignose-calendar-unit a:active { background-color: #d8d8d8; } .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-disabled a { opacity: 0.5; background-color: #fff2cf; } .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-active a { background-color: #001f82; color: #ffffff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); } .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-active.pignose-calendar-unit-sun a, .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-active.pignose-calendar-unit-sat a { color: #151515; } .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-range a { background-color: #e5e8f2; border-radius: 0; width: 100%; } .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-range.pignose-calendar-unit-disabled a { color: #b2b9bb; background-color: #e1e1e1; } .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-range.pignose-calendar-unit-range-first a { border-top-left-radius: 1.2em; border-bottom-left-radius: 1.2em; } .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-range.pignose-calendar-unit-range-last a { border-top-right-radius: 1.2em; border-bottom-right-radius: 1.2em; } .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-sun a, .pignose-calendar .pignose-calendar-unit.pignose-calendar-unit-sat a { color: #080807; } .pignose-calendar.pignose-calendar-default .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-toggle-active a, .pignose-calendar.pignose-calendar-default.pignose-calendar-reverse .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-toggle-inactive a { color: #cccccc !important; } .pignose-calendar.pignose-calendar-dark { border-color: #323537; background-color: #4b4f51; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.5); } .pignose-calendar.pignose-calendar-dark .pignose-calendar-top { background-color: #3f4244; border-bottom-color: #323537; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.175); } .pignose-calendar.pignose-calendar-dark .pignose-calendar-top .pignose-calendar-top-month { color: #ffffff; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-top .pignose-calendar-top-year { color: #bdc2c5; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-top .pignose-calendar-top-nav .pignose-calendar-top-value, .pignose-calendar.pignose-calendar-dark .pignose-calendar-top .pignose-calendar-top-nav .pignose-calendar-top-icon { color: #a2a9ab; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-header .pignose-calendar-week { color: #bdc2c5; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-header.pignose-calendar-week-sun, .pignose-calendar.pignose-calendar-dark .pignose-calendar-header.pignose-calendar-week-sat { color: #151515; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit a { color: #151515; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-sun a, .pignose-calendar.pignose-calendar-dark .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-sat a { color: #151515; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-disabled a { color: #868e8f; background-color: #5d6365; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-active a { color: #ffffff; background-color: #001f82; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.75); } .pignose-calendar.pignose-calendar-dark .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-toggle a { color: #8b8f94; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-range a { background-color: #5a5d62; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-range.pignose-calendar-unit-disabled a { color: #727a7c; background-color: #4f5558; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-button-group { border-top: 1px solid #323537; overflow: hidden; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-button-group .pignose-calendar-button { color: #ffffff; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-button-group .pignose-calendar-button:hover { background-color: #5a5d62; } .pignose-calendar.pignose-calendar-dark .pignose-calendar-button-group .pignose-calendar-button-apply { color: #ffffff; background-color: #31bbbf; } .pignose-calendar.pignose-calendar-blue { background-color: #fafafa; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-top { background-color: #009fe3; border-bottom-color: #e1e1e1; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-top .pignose-calendar-top-month, .pignose-calendar.pignose-calendar-blue .pignose-calendar-top .pignose-calendar-top-year { color: #ffffff; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-top .pignose-calendar-top-nav .pignose-calendar-top-value, .pignose-calendar.pignose-calendar-blue .pignose-calendar-top .pignose-calendar-top-nav .pignose-calendar-top-icon { color: #ffffff; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-header .pignose-calendar-week { color: #5c6270; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-header .pignose-calendar-week.pignose-calendar-week-sun, .pignose-calendar.pignose-calendar-blue .pignose-calendar-header .pignose-calendar-week.pignose-calendar-week-sat { color: #fa4832; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit a { color: #5c6270; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-sun a, .pignose-calendar.pignose-calendar-blue .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-sat a { color: #fa4832; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-disabled a { background-color: #efefef; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-active a { color: #ffffff; background-color: #001f82; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.75); } .pignose-calendar.pignose-calendar-blue .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-toggle a { color: #cccccc; } .pignose-calendar.pignose-calendar-blue .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-range a, .pignose-calendar.pignose-calendar-blue .pignose-calendar-body .pignose-calendar-row .pignose-calendar-unit.pignose-calendar-unit-range.pignose-calendar-unit-disabled a { background-color: #efefef; } .login .logo-img { width: 36.2666666667vw; display: block; margin: 0 auto 9.0666666667vw auto; } .login .container { padding: 5.3333333333vw; display: flex; flex-direction: column; justify-content: center; } .login .container .form-group { margin-bottom: 8.5333333333vw; } .login .container .form-group label { letter-spacing: 0.027em; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; display: block; } .login .container .form-group input { display: block; border-top: 0; border-left: 0; border-right: 0; outline: none; width: 100%; font-size: 3.7333333333vw; letter-spacing: 0.23px; color: #0d009d; padding-top: 2.6666666667vw; padding-bottom: 0.8vw; border-bottom: 1px solid #e6e6e6; background-color: transparent; border-radius: 0; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #005eef; } .login .container .form-group input::-moz-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; opacity: 1; } .login .container .form-group input:-ms-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .login .container .form-group input::-webkit-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .login .container .form-group input:focus { border-bottom: 1px solid #0d009d; } .login .btn-wrapper { margin-top: 2.6666666667vw; } .login .btn-wrapper button { width: 100%; } .group-radio { margin-top: 5.3333333333vw; } .group-radio .radio-item + .radio-item { margin-top: 2.9333333333vw; } .group-radio .radio-item p { font-size: 2.9333333333vw; } .group-radio .radio-item a { color: #001f82; text-decoration: underline; font-weight: 500; } .box-code { text-transform: uppercase; font-size: 4.2666666667vw; color: #000; letter-spacing: 0.4rem; padding: 3.2vw 0; } .box-code.disable { font-size: 3.7333333333vw; letter-spacing: 0.03em; } .box-code-1 { background-color: blue; border-radius: 5.3333333333vw; font-size: 4.2666666667vw; color: #fff; padding: 3.2vw 0; } .box-code-1.disable { background-color: #ced4da; font-size: 3.7333333333vw; } .register-form .group-radio .radio-item + .radio-item { margin-top: 2.1333333333vw; } .register-form .group-radio .radio-item p { font-size: 2.9333333333vw; } .register-form .group-radio .radio-item a { color: #001f82; text-decoration: underline; font-weight: 500; } .register-form .btn-wrapper { margin: 5.3333333333vw 0; } .login-form .img-login, .manual-banker .img-login { width: 42.6666666667vw; margin: auto; margin-top: 5.3333333333vw; margin-bottom: 4.2666666667vw; } .login-form .title-form, .manual-banker .title-form { text-align: center; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; display: block; } .login-form .title-form.pos-title, .manual-banker .title-form.pos-title { text-align: left; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #001f82; display: block; } .login-form .form-control, .manual-banker .form-control { height: 13.3333333333vw; border: 1px solid rgba(0, 94, 239, 0.2); padding: 0; font-size: 6vw; text-align: center; margin-top: 4vw; border-radius: 13.3333333333vw; width: 100%; padding: 1.3333333333vw 0; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #005eef; } .login-form .form-control::-moz-placeholder, .manual-banker .form-control::-moz-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; opacity: 1; } .login-form .form-control:-ms-input-placeholder, .manual-banker .form-control:-ms-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .login-form .form-control::-webkit-input-placeholder, .manual-banker .form-control::-webkit-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .login-form .note-login, .manual-banker .note-login { text-align: center; margin-top: 4vw; font-family: "UnileverShilling"; font-weight: normal; font-size: 2.9333333333vw; color: rgba(0, 32, 131, 0.5); } .login-otp .login-form { position: unset; margin-top: 13.3333333333vw; } .login-otp ul { display: flex; justify-content: space-between; width: 100%; margin-top: 6.4vw; margin: auto; } .login-otp ul li { width: calc(100%/6); height: 13.3333333333vw; position: relative; } .login-otp ul li input { width: 80%; background: transparent; font-size: 4.2666666667vw; display: block; padding-bottom: 0; border: none; position: absolute; text-align: center; left: 50%; top: 50%; transform: translate(-50%, -50%); font-family: "UnileverShilling"; font-weight: normal; font-size: 5.3333333333vw; color: #001f82; border-bottom: 2px solid #001f82; padding: 0; padding-bottom: 2.6666666667vw; } .login-otp ul li input::-moz-placeholder { color: #001f82; font-size: 5.3333333333vw; opacity: 1; } .login-otp ul li input:-ms-input-placeholder { color: #001f82; font-size: 5.3333333333vw; } .login-otp ul li input::-webkit-input-placeholder { color: #001f82; font-size: 5.3333333333vw; } .login-otp .btn-wrapper { margin-top: 13.3333333333vw; } .form-group-inlne { display: flex; margin-bottom: 13.3333333333vw; } .form-group-inlne .form-group + .form-group { padding-left: 2.6666666667vw; width: 100%; } .form-group-inlne input[type=date], .form-group-inlne #birthday { display: block; text-align: center; position: relative; margin-top: 4.2666666667vw; padding: 1.7333333333vw; padding-left: 5.3333333333vw; width: 100%; height: 9.3333333333vw; font-size: 3.4666666667vw; font-family: "UnileverShilling"; text-transform: uppercase; border: 1px solid #e5e8f2; background-color: transparent; border-radius: 5.3333333333vw; color: #001f82; cursor: pointer; } .form-group-inlne input[type=date], .form-group-inlne #birthday:focus { outline: none; } .form-group-inlne ::-webkit-datetime-edit-month-field, .form-group-inlne ::-webkit-datetime-edit-day-field { border-right: 1px solid #e5e8f2; padding-right: 2.6666666667vw; } .form-group-inlne ::-webkit-datetime-edit-month-field:hover, .form-group-inlne ::-webkit-datetime-edit-day-field:hover, .form-group-inlne ::-webkit-datetime-edit-year-field:hover { background: rgba(0, 120, 250, 0.1); } .form-group-inlne ::-webkit-datetime-edit-text { opacity: 0; } .form-group-inlne ::-webkit-clear-button, .form-group-inlne ::-webkit-inner-spin-button { display: none; } .form-group-inlne ::-webkit-calendar-picker-indicator { position: absolute; width: 100%; height: 100%; top: 0; right: 0; bottom: 0; opacity: 0; cursor: pointer; color: #0078fa; background: #0078fa; } .form-group-inlne::-webkit-input-placeholder { color: #000; } .form-group-inlne:-moz-placeholder { color: #000; } .form-group-inlne::-moz-placeholder { color: #000; } .form-group-inlne:-ms-input-placeholder { color: #000; } .radio-custom { width: 34.6666666667vw; margin-top: 4vw; display: flex; align-items: center; } .radio-custom .radio-item { width: 100%; } .radio-custom .radio-item label { height: 9.3333333333vw; width: 17.3333333333vw; font-size: 4vw; justify-content: center; } .radio-custom .radio-item label .checkmark { border: 1px solid #e5e8f2; border-radius: 5.3333333333vw; border-top-right-radius: 0; border-bottom-right-radius: 0; } .radio-custom .radio-item label input:checked ~ .checkmark { background-color: #005eef; border: 0; } .radio-custom .radio-item label input:checked ~ p { color: #fff; } .radio-custom .radio-item + .radio-item .checkmark { border-radius: 5.3333333333vw; border-top-left-radius: 0; border-bottom-left-radius: 0; } .radio-custom .radio-item p { margin-left: 0; } .radio-custom .checkmark { position: absolute; z-index: -1; left: 0; width: 100%; height: 100%; border-radius: 0; } .radio-custom.disable { opacity: 0.5; color: #001f82; background-color: #d8d8d8 !important; border-radius: 5.3333333333vw; } .disablebirthday { opacity: 0.5; color: #001f82; background-color: #d8d8d8 !important; border-radius: 5.3333333333vw; } .p-dropdown.p-component { width: 100%; margin-top: 2.1333333333vw; border-radius: 1.8666666667vw; border: solid 1px #001f82; } .p-dropdown.p-component:not(.p-disabled) { border-color: #001f82; } .p-dropdown.p-component:not(.p-disabled).p-focus { box-shadow: none; } .p-dropdown.p-component .pi-chevron-down::before { position: absolute; content: ""; top: 5.3333333333vw; right: 2.6666666667vw; width: 0; height: 0; border: 1.6vw solid transparent; border-color: #001f82 transparent transparent transparent; } .p-dropdown.p-component.p-disabled { opacity: 0.5; color: #001f82; background-color: #d8d8d8 !important; border-radius: 5px; border-color: #d8d8d8 !important; } .p-dropdown .p-dropdown-label.p-placeholder, .p-inputtext { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; height: 10.6666666667vw; padding: 0; padding-left: 4.2666666667vw; line-height: 10.6666666667vw; } .p-dropdown-panel .p-dropdown-items .p-dropdown-item { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; padding: 4vw; border-bottom: 1px solid #e7eaf3; } .p-dropdown-panel .p-dropdown-items .p-dropdown-item:not(.p-highlight):not(.p-disabled):hover { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; } .age-user { margin-top: 5.8666666667vw; display: flex; align-items: center; justify-content: space-between; } .age-user label { letter-spacing: 0.027em; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; display: block; } .age-user .custom-select { width: 70%; border-radius: 1.8666666667vw; border: solid 1px #001f82; } .age-user .custom-select .select-selected { height: 10.6666666667vw; color: #001f82; line-height: 10.6666666667vw; } .age-user .custom-select .select-selected:after { top: 4.8vw; } .age-user .custom-select .select-selected.select-arrow-active:after { top: 2.6666666667vw; } .age-user .custom-select .dropdown-select { top: 11.2vw; } .input-icon-group { position: relative; } .showhidePass { width: 9.0666666667vw; height: 9.0666666667vw; background-image: url('ic-visibility-off.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; position: absolute; right: 0; bottom: 1.3333333333vw; background-size: 75%; } .showhidePass.active { width: 9.0666666667vw; height: 9.0666666667vw; background-image: url('ic-visibility.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; background-size: 75%; } .ap-theme-default { color: #002083; } .ap-component-selector { border-color: #002083; } .ap-cont { border-radius: 2.1333333333vw; } .form-group-ticket .note-check { margin-top: 8vw; margin-bottom: 10.6666666667vw; } .form-group-ticket input[type=date], .form-group-ticket #ticketDateTime { display: block; text-align: center; position: relative; margin-top: 4.2666666667vw; padding: 1.7333333333vw; padding-left: 8vw; width: 100%; height: 13.3333333333vw; font-size: 4.2666666667vw; font-family: "UnileverShilling"; text-transform: uppercase; border: 1px solid #e5e8f2; background-color: transparent; border-radius: 13.3333333333vw; color: #001f82; cursor: pointer; } .form-group-ticket input[type=date], .form-group-ticket #ticketDateTime:focus { outline: none; } .form-group-ticket ::-webkit-datetime-edit-month-field, .form-group-ticket ::-webkit-datetime-edit-day-field { border-right: 1px solid #e5e8f2; padding-right: 2.6666666667vw; } .form-group-ticket ::-webkit-datetime-edit-month-field:hover, .form-group-ticket ::-webkit-datetime-edit-day-field:hover, .form-group-ticket ::-webkit-datetime-edit-year-field:hover { background: rgba(0, 120, 250, 0.1); } .form-group-ticket ::-webkit-datetime-edit-text { opacity: 0; } .form-group-ticket ::-webkit-clear-button, .form-group-ticket ::-webkit-inner-spin-button { display: none; } .form-group-ticket ::-webkit-calendar-picker-indicator { position: absolute; width: 100%; height: 100%; top: 0; right: 0; bottom: 0; opacity: 0; cursor: pointer; color: #0078fa; background: #0078fa; } .form-group-ticket::-webkit-input-placeholder { color: #000; } .form-group-ticket:-moz-placeholder { color: #000; } .form-group-ticket::-moz-placeholder { color: #000; } .form-group-ticket:-ms-input-placeholder { color: #000; } .register-form .p-autocomplete, .register-form .p-multiselect { height: 11.7333333333vw; line-height: 11.7333333333vw; background-color: #ffffff; border-radius: 1.8666666667vw; width: 100%; margin-top: 1.3333333333vw; margin-bottom: 0vw; border: solid 1px #001f82; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; } .register-form .p-autocomplete .pi-chevron-down::before, .register-form .p-multiselect .pi-chevron-down::before { position: absolute; content: "" !important; top: 5.3333333333vw; right: 4vw; width: 0; height: 0; border: 1.6vw solid transparent; border-color: #001f82 transparent transparent transparent; } .register-form .p-autocomplete .p-inputtext:enabled:focus, .register-form .p-autocomplete .p-button:focus, .register-form .p-autocomplete .p-inputtext:hover, .register-form .p-autocomplete .p-inputtext:hover, .register-form .p-multiselect .p-inputtext:enabled:focus, .register-form .p-multiselect .p-button:focus, .register-form .p-multiselect .p-inputtext:hover, .register-form .p-multiselect .p-inputtext:hover { box-shadow: none; border: 0; } .register-form .p-autocomplete .p-button, .register-form .p-autocomplete .p-inputtext, .register-form .p-autocomplete .p-button:hover, .register-form .p-multiselect .p-button, .register-form .p-multiselect .p-inputtext, .register-form .p-multiselect .p-button:hover { background-color: transparent; border: 0; } .register-form .p-autocomplete .p-button, .register-form .p-autocomplete .p-button:enabled:hover, .register-form .p-multiselect .p-button, .register-form .p-multiselect .p-button:enabled:hover { color: #001f82; } .register-form .p-autocomplete .p-autocomplete-items, .register-form .p-multiselect .p-autocomplete-items { padding: 0vw; } .register-form .p-autocomplete .p-autocomplete-item, .register-form .p-multiselect .p-autocomplete-item { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; text-align: left; } .register-form .p-autocomplete .p-autocomplete-item + .p-autocomplete-item, .register-form .p-multiselect .p-autocomplete-item + .p-autocomplete-item { border-top: 1px solid #e7eaf3; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; padding: 4vw; border-bottom: 1px solid #e7eaf3; } .register-form .p-autocomplete .p-autocomplete-item + .p-autocomplete-item:not(.p-highlight):not(.p-disabled):hover, .register-form .p-multiselect .p-autocomplete-item + .p-autocomplete-item:not(.p-highlight):not(.p-disabled):hover { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; } .register-form .p-autocomplete .p-autocomplete-item:hover, .register-form .p-multiselect .p-autocomplete-item:hover { background-color: transparent !important; } .register-form .p-autocomplete .p-autocomplete-item .ng-star-inserted, .register-form .p-multiselect .p-autocomplete-item .ng-star-inserted { padding: 4vw !important; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; white-space: pre-line; line-height: 1.5; padding-top: 2.1333333333vw; padding-bottom: 2.1333333333vw; padding-right: 5.3333333333vw; } .register-form .p-autocomplete .p-autocomplete-item .active, .register-form .p-multiselect .p-autocomplete-item .active { position: relative; } .register-form .p-autocomplete .p-autocomplete-item .active:after, .register-form .p-multiselect .p-autocomplete-item .active:after { content: ""; width: 4.8vw; height: 4.8vw; display: inline-block; -o-object-fit: contain; object-fit: contain; background-image: none; background-position: center; background-repeat: no-repeat; background-size: 80%; right: 0; top: 0; bottom: 0; margin: auto; position: absolute; } .register-form .p-autocomplete .p-autocomplete-item > .active, .register-form .p-multiselect .p-autocomplete-item > .active { color: #ffffff; background: #2196F3; } .register-form .p-autocomplete .p-inputtext, .register-form .p-multiselect .p-inputtext { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; padding-left: 4.2666666667vw; border: 1px solid transparent; cursor: pointer; position: relative; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .register-form .p-autocomplete .p-inputtext::-moz-placeholder, .register-form .p-multiselect .p-inputtext::-moz-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; opacity: 1; } .register-form .p-autocomplete .p-inputtext:-ms-input-placeholder, .register-form .p-multiselect .p-inputtext:-ms-input-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; } .register-form .p-autocomplete .p-inputtext::-webkit-input-placeholder, .register-form .p-multiselect .p-inputtext::-webkit-input-placeholder { color: #ccd2e6; font-size: 4.2666666667vw; } .register-form .p-multiselect { border-color: #001f82; margin-bottom: 0; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; } .register-form .p-multiselect span.ng-star-inserted { word-break: break-all; white-space: normal; line-height: 1.3; max-width: 100%; } .register-form .p-multiselect.p-multiselect:not(.p-disabled):hover { border-color: #001f82; } .register-form .p-multiselect .p-multiselect-panel .p-multiselect-header .p-multiselect-filter-container .p-inputtext { border: 1px solid #ced4da; } .register-form .p-multiselect .p-multiselect-label { padding-top: 0; padding-bottom: 0; } .register-form p-autoComplete.disabled > .p-autocomplete { opacity: 0.5; color: #001f82; background-color: #d8d8d8 !important; border-radius: 5px; border-color: #d8d8d8 !important; pointer-events: none; cursor: default; } .bgr-home { background-image: url('bgr-body.png'); background-repeat: no-repeat; background-position: center; background-size: cover; height: 100vh; } .bgr-home .home-page .logo-img { width: 36.2666666667vw; display: block; margin: 0 auto 9.0666666667vw auto; } .bgr-home .home-page .header-page { background-image: unset; height: 0; } .bgr-home .home-page .header-page::after { content: ""; display: none; } .bgr-gray { background-color: #efefef; background-image: url('bgr-gift.png'); background-repeat: no-repeat; background-size: contain; background-position: bottom; height: 100vh; } .bgr-gray .header-page::after { background-color: #efefef; } .bgr-gray .title-select { color: #001f82; } .home-page .block-inner { position: relative; display: flex; align-items: center; margin-top: 5.3333333333vw; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #001f82; } .home-page .block-inner .gift-img, .home-page .block-inner .user-img, .home-page .block-inner .qrcode-img { width: 13.3333333333vw; height: 13.3333333333vw; background-repeat: no-repeat; background-position: center; background-size: contain; display: inline-block; margin-right: 5.3333333333vw; } .home-page .block-inner .gift-img { background-image: url('present-2.png'); } .home-page .block-inner .user-img { background-image: url('call-center-agen.png'); } .home-page .block-inner .qrcode-img { background-image: url('qrcode.png'); } .block-inner { text-align: center; margin: auto; background-color: #ffffff; margin-top: 5.3333333333vw; padding: 2.6666666667vw; border-radius: 2.6666666667vw; position: relative; display: flex; align-items: center; margin-top: 5.3333333333vw; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #001f82; } .block-inner .gift-list-img, .block-inner .gift-report-img { width: 13.3333333333vw; height: 13.3333333333vw; background-repeat: no-repeat; background-position: center; background-size: contain; display: inline-block; margin-right: 5.3333333333vw; } .block-inner .gift-list-img { background-image: url('shelf.png'); } .block-inner .gift-report-img { background-image: url('shop-3.png'); } .block-inner.skipPII { text-align: left !important; } .checkQA { background-color: red; color: #fff; padding: 1.6vw 2.6666666667vw; text-align: center; } @media (min-width: 992px) { .checkQA { display: none; } } span.tab { background-color: #F2F4F6; padding: 1.6vw 2.6666666667vw; margin-right: 1.3333333333vw; border-radius: 1.8666666667vw; } .list-tab { margin-top: 5.3333333333vw; text-align: right; } .selected-tap { background-color: #001f82 !important; color: white; } .vertical-menu { display: block; position: fixed; top: 0; height: 100%; z-index: 999999; width: 85.3333333333vw; max-width: 100%; padding-bottom: 8vw; overflow-x: hidden; overflow-y: auto; font-size: 3.7333333333vw; background-color: #ffffff; height: 100vh; color: #707070; -webkit-overflow-scrolling: touch; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; transition: left 0.3s ease 0s; z-index: 9999; left: -85.3333333333vw; } .vertical-menu::before { content: ""; height: 22.6666666667vw; width: 100%; background-color: #e5e8f2; border-bottom-right-radius: 8vw; position: absolute; top: 0; left: 0; } .vertical-menu::after { content: ""; height: 40vw; width: 40vw; background-image: url('unilever-logo-left-menu.png'); background-size: contain; background-position: center; background-repeat: no-repeat; position: absolute; bottom: 8vw; right: 8vw; } .vertical-menu.left { left: 0; transition: left 0.3s ease 0s; } .vertical-menu.left .sidr-overlay { display: none; } .vertical-menu .sidr-overlay { display: none; content: ""; position: fixed; top: 0; left: 0; height: 100%; width: 100%; background: rgba(255, 255, 255, 0.3); z-index: 8; transform: translateZ(0); } .vertical-menu .nav-close { width: 5.3333333333vw; height: 5.3333333333vw; background-image: url('close.png'); background-size: 35%; background-position: center; background-repeat: no-repeat; position: absolute; z-index: 10; right: 0; top: 0; padding: 3.7333333333vw; box-sizing: content-box; } .vertical-menu .user-wrapper { display: flex; align-items: center; } .vertical-menu .user-wrapper .user-avatar { width: 14.6666666667vw; height: 11.7333333333vw; border-radius: 100%; margin-right: 3.2vw; } .vertical-menu .user-wrapper .user-avatar img { width: 100%; border-radius: 100%; } .vertical-menu .user-wrapper .user-info h3 { font-family: "UnileverShilling"; font-weight: 500; font-size: 5.3333333333vw; color: #001f82; letter-spacing: 0.033em; text-align: left; word-break: break-word; } .vertical-menu .menu-list { position: relative; z-index: 9; } .vertical-menu .menu-list > li { padding: 5.3333333333vw 0; padding-left: 5.3333333333vw; padding-right: 9.0666666667vw; border-bottom: 1px solid #e5e9f2; font-family: "UnileverShilling"; font-weight: 500; font-size: 5.3333333333vw; color: #001f82; width: 100%; } .vertical-menu .menu-list > li a { padding: 2.6666666667vw; } .vertical-menu .menu-list > li:first-child { border-bottom: 0; } .vertical-menu .menu-list > li ul.sub-warp { display: none; position: static; width: 100%; } .vertical-menu .menu-list > li ul.sub-warp li { padding: 2.6666666667vw 0; padding-left: 4vw; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.8vw; color: #001f82; } .vertical-menu .menu-list > li.sub-menu { position: relative; } .vertical-menu .menu-list > li.sub-menu:hover .sub-warp { display: none; } .vertical-menu .menu-list > li.sub-menu.active::before { content: ""; width: 5.8666666667vw; height: 5.8666666667vw; background-image: url('next.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; transform: rotate(-90deg); } .vertical-menu .menu-list > li.sub-menu.active .sub-warp { display: block; position: static; width: 100%; } .vertical-menu .menu-list > li.sub-menu.active .sub-warp li { padding-left: 4vw; } .vertical-menu .menu-list > li.sub-menu::before { content: ""; width: 5.8666666667vw; height: 5.8666666667vw; background-image: url('next.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; transform: rotate(90deg); right: 2.6666666667vw; top: 5.3333333333vw; position: absolute; } .header-page { height: 24vw; background-image: url('bg-topbar.png'); background-position: center; background-repeat: no-repeat; background-size: cover; display: flex; justify-content: center; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #ffffff; position: relative; padding-top: 5.3333333333vw; } .header-page::after { content: ""; position: absolute; bottom: -0.2666666667vw; height: 6.6666666667vw; width: 100%; background-color: #ffffff; border-top-left-radius: 5.3333333333vw; border-top-right-radius: 5.3333333333vw; } .header-page .nav-icon { width: 5.3333333333vw; height: 5.3333333333vw; background-image: url('burger.png'); background-size: 40%; background-position: center; background-repeat: no-repeat; position: absolute; left: 0; top: 2.6666666667vw; padding: 3.7333333333vw; box-sizing: content-box; } .header-page .back-icon { width: 5.3333333333vw; height: 5.3333333333vw; background-image: url('arrow.png'); background-size: 20%; background-position: center; background-repeat: no-repeat; position: absolute; left: 0; top: 2.6666666667vw; padding: 3.7333333333vw; box-sizing: content-box; } .header-page .export-icon { width: 5.3333333333vw; height: 5.3333333333vw; background-image: url('ic-mode.png'); background-size: 40%; background-position: center; background-repeat: no-repeat; position: absolute; right: 0; top: 2.6666666667vw; padding: 3.7333333333vw; box-sizing: content-box; } .container { padding: 0 5.3333333333vw; } .customer-infor .title-select { color: #001f82; border-top: solid #e5e8f2; text-align: left; border-width: 1px; padding-top: 4vw; } .customer-infor .select-selected, .customer-infor .disable-select { background-color: #f1f1f1; text-align: left; } .customer-infor .dropdown-select { text-align: left; } .content-infor { text-align: center; margin: 8vw 0; margin-top: 0; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; } .content-infor p { margin-bottom: 5.3333333333vw; } .content-infor .icon-tick { width: 16vw; height: 16vw; background-image: url('tick.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; margin-bottom: 2.6666666667vw; } .content-infor .img-content { margin-bottom: 2.6666666667vw; } .content-infor .img-content img { max-height: 40vw; max-width: 100%; } .number-time-gift { font-size: 3.4666666667vw; } .number-time-gift .number-time { display: flex; align-items: center; justify-content: space-between; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #001f82; margin: 2.6666666667vw 0; } .number-time-gift .number-time input { border: 1px solid rgba(0, 31, 130, 0.2); width: 12vw; height: 8vw; border-radius: 1.3333333333vw; text-align: center; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; background: #ffffff; opacity: 1; margin: 0; margin-right: 2.6666666667vw; } #video, #camera { width: 100%; height: 100%; border-radius: 4vw; } .customer-camera .picture-bill { height: 104vw; width: 72%; margin: auto; border: 0.5333333333vw solid #02b2ff; border-radius: 4vw; overflow: hidden; } .customer-camera .picture-bill img { width: 100%; } .customer-camera .picture-bill.picture { display: flex; justify-content: center; align-items: center; border: 0; } .customer-lucky { position: relative; transition: 2s; } .customer-lucky.pledge::before { content: ""; background-image: url('pledge.png'); background-repeat: no-repeat; background-position: center; background-size: contain; width: 100%; height: 100%; position: absolute; top: 5.3333333333vw; z-index: 1; left: 0; animation: pledge 2s; animation-iteration-count: infinite; } .customer-lucky::after { content: ""; background-image: url('group-balloons.png'); background-repeat: no-repeat; background-position: bottom; background-size: contain; width: 100%; height: 100%; position: fixed; bottom: 0; z-index: 1; left: 0; } .customer-lucky.active .gift-lucky { animation: pulse 2.5s; animation-iteration-count: infinite; } .customer-lucky.active .shake { animation: shake 0.8s; animation-iteration-count: infinite; } .customer-lucky.active::before { content: ""; background-image: url('group-star.png'); background-repeat: no-repeat; background-position: center; background-size: contain; width: 100%; height: 100%; position: absolute; top: -21.3333333333vw; z-index: 1; left: 0; animation: stretch 0.8s; animation-iteration-count: infinite; } .customer-lucky .gift-lucky { max-width: 53.3333333333vw; max-height: 71.7333333333vw; margin: auto; margin-bottom: 8vw; position: relative; z-index: 2; } .customer-lucky .gift-lucky .data-img { display: none; overflow: hidden; } .customer-lucky .gift-lucky .ramdom-img { opacity: 0; visibility: hidden; height: 0; } .customer-lucky .gift-lucky .ramdom-img.active { opacity: 1; visibility: visible; height: auto; } .customer-lucky .gift-lucky .show-gift { display: block; margin: auto; } .customer-lucky .gift-lucky .show-gift.animate__zoomIn { animation: zoomIn 1.8s; } .customer-lucky .gift-lucky.spinning .show-gift { display: block; } .customer-lucky .gift-lucky.spinning .data-img { display: inline-flex; overflow: hidden; max-width: 53.3333333333vw; height: 58.1333333333vw; margin: auto; margin-bottom: 8vw; position: relative; z-index: -2; } .customer-lucky .gift-lucky.spinning .data-img img { width: 53.3333333333vw; animation-name: images; animation-duration: 0.8s; animation-iteration-count: 5; } @keyframes images { 0% { transform: translateX(0); } 10% { transform: translateX(-13.3333333333vw); } 20% { transform: translateX(-53.3333333333vw); } 30% { transform: translateX(-66.6666666667vw); } 40% { transform: translateX(-80vw); } 50% { transform: translateX(-93.3333333333vw); } 60% { transform: translateX(-106.6666666667vw); } 70% { transform: translateX(-120vw); } 80% { transform: translateX(-133.3333333333vw); } 90% { transform: translateX(-146.6666666667vw); } 100% { transform: translateX(-750px); } } @keyframes randomizer { 100% { transform: translateX(-50%); } } @keyframes zoomIn { 0% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } @keyframes shake { 0% { transform: translate(1px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -2px) rotate(-1deg); } 20% { transform: translate(-3px, 0px) rotate(1deg); } 30% { transform: translate(3px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 2px) rotate(-1deg); } 60% { transform: translate(-3px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-1px, -1px) rotate(1deg); } 90% { transform: translate(1px, 2px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } } @keyframes stretch { 0% { transform: scale(0.3); border-radius: 100%; } 70% { transform: scale(0.9); } 100% { transform: scale(1.5); } } @keyframes pledge { 0% { opacity: 0; } 100% { opacity: 1; } } .gift-list-wrapper .block-content { padding-top: 4.8vw; padding-bottom: 17.3333333333vw; } .gift-list-wrapper .block-content .block-item { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ededed; padding: 3.7333333333vw 0; position: relative; } .gift-list-wrapper .block-content .block-item.tag-blue::before { position: absolute; content: ""; left: 8vw; top: 5.3333333333vw; width: 16.2666666667vw; height: 4.5333333333vw; background-image: url('tag1.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .gift-list-wrapper .block-content .block-item.tag-red::before { position: absolute; content: ""; left: 8vw; top: 5.3333333333vw; width: 16.2666666667vw; height: 4.5333333333vw; background-image: url('tag2.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .gift-list-wrapper .block-content .block-item:last-child { border-bottom: 0; } .gift-list-wrapper .block-content .block-item.disabled img.img-product { filter: grayscale(1); opacity: 0.8; } .gift-list-wrapper .block-content .block-item.disabled .desc-txt { color: #8e8e8e; } .gift-list-wrapper .block-content .block-item.disabled .desc-txt span, .gift-list-wrapper .block-content .block-item.disabled .desc-txt .note-sent { color: #8e8e8e; } .gift-list-wrapper .block-content .checkbox { margin-right: 8vw; } .gift-list-wrapper .block-content .checkbox input { display: none; } .gift-list-wrapper .block-content .checkbox input:checked ~ label::before { border-color: #0d009d; } .gift-list-wrapper .block-content .checkbox label { padding: unset; } .gift-list-wrapper .block-content .checkbox label::before { top: 0; border-color: #e9e9e9; } .gift-list-wrapper .block-content .checkbox label::after { top: 1.0666666667vw; } .gift-list-wrapper .block-content .desc-txt { margin-left: 4.2666666667vw; width: 42.6666666667vw; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.4666666667vw; color: #001f82; } .gift-list-wrapper .block-content .desc-txt span { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #151515; } .gift-list-wrapper .block-content .desc-txt .note-sent { font-family: "UnileverShilling"; font-weight: normal; font-size: 2.9333333333vw; color: #151515; font-style: italic; } .gift-list-wrapper .block-content .desc-txt .note-sent strong { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: red; } .gift-list-wrapper .block-content .desc-txt .warning-status { position: relative; padding-left: 4.2666666667vw; } .gift-list-wrapper .block-content .desc-txt .warning-status span { color: #f66405; } .gift-list-wrapper .block-content .desc-txt .warning-status::before { position: absolute; content: ""; left: 0; top: 1.0666666667vw; width: 3.2vw; height: 3.4666666667vw; background-image: url('warning.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .gift-list-wrapper .block-content .input-range { margin-left: 2.6666666667vw; } .gift-list-wrapper .block-content .input-range form, .gift-list-wrapper .block-content .input-range .qtySelector { display: flex; } .gift-list-wrapper .block-content .input-range input { border: 0; width: 13.3333333333vw; text-align: center; font-size: 3.7333333333vw; background: transparent; opacity: 1; margin: 0; } .gift-list-wrapper .block-content .input-range input:focus { border: 1px solid #ccc !important; } .gift-list-wrapper .block-content .input-range .value-button { width: 5.3333333333vw; height: 5.3333333333vw; position: relative; font-size: 3.2vw; line-height: 4.8vw; text-align: center; background: #0d009d; border-radius: 50%; color: #ffffff; display: flex; justify-content: center; align-items: center; } .gift-list-wrapper .block-content .input-range .value-button.fa-minus { background-color: #005eef; } .gift-list-wrapper .block-content .input-range .value-button.disabled { opacity: 0.5; pointer-events: none; background: #a6a6a6; } .gift-list-wrapper .block-content .input-range.disabled { opacity: 0.5; pointer-events: none; } .gift-list-wrapper .block-content .input-range.disabled .value-button { background: #a6a6a6; } .gift-list-wrapper .block-content .input-range.disabled input { color: #a6a6a6; } .gift-list-wrapper .block-content .img-product { max-width: 21.6vw; height: auto; width: auto; max-height: 17.8666666667vw; } .gift-list-wrapper .btn-wrapper { margin-top: 9.8666666667vw; margin-bottom: 4vw; } .gift-list-wrapper .btn-wrapper.btn-fixed { position: fixed; bottom: 0; width: 100%; left: 0; padding: 20px 20px; margin-bottom: 0; margin-top: 0; background-color: #ffffff; padding-top: 0; } .gift-report-wrapper .container { padding: 2.6666666667vw; } .gift-report-wrapper td, .gift-report-wrapper th { border: 0; padding: 1.6vw; word-break: break-word; max-width: 18.1333333333vw; } .gift-report-wrapper th { font-weight: 700; } .gift-report-wrapper table, .gift-report-wrapper th, .gift-report-wrapper td { border: 0; border-collapse: collapse; text-align: left; } .gift-report-wrapper .sort { position: relative; } .gift-report-wrapper .sort:after { position: absolute; content: ""; top: 2.6666666667vw; right: 2.6666666667vw; width: 0; height: 0; border: 1.0666666667vw solid transparent; border-color: #001f82 transparent transparent transparent; } .gift-report-wrapper .sort.select-arrow-active:after { border-color: transparent transparent #001f82 transparent; top: 1.3333333333vw; } .gift-report-wrapper .table-warp .title-block { text-align: left; margin-top: 5.3333333333vw; } .gift-report-wrapper .table-warp th { text-transform: uppercase; font-family: "UnileverShilling"; font-weight: 500; font-size: 2.6666666667vw; color: #001f82; } .gift-report-wrapper .table-warp td { padding: 3.2vw 2.6666666667vw; } .gift-report-wrapper .table-warp td:nth-child(2n) { background-color: #f8f8f8; } .gift-report-wrapper .table-warp td:first-child { font-weight: 500; max-width: 18.1333333333vw; } .gift-report-wrapper .table-warp td:nth-child(3) { max-width: 18.1333333333vw; } .gift-report-wrapper .table-warp tr { border-bottom: 1px solid #cdd3d9; font-family: "UnileverShilling"; font-weight: 400; font-size: 3.2vw; color: #000000; } .gift-report-wrapper .select-daytime { padding: 4.2666666667vw; padding-top: 0; border-bottom: 1px solid #cdd3d9; } .gift-report-wrapper .select-daytime .calender-action { display: flex; background: #ffffff; border-radius: 1.8666666667vw; padding: 3.2vw 4vw; align-items: center; border: 1px solid #001f82; justify-content: space-between; } .gift-report-wrapper .select-daytime .calender-action img { width: 5.3333333333vw; height: 5.3333333333vw; display: block; } .gift-report-wrapper .select-daytime .calender-action p { letter-spacing: 0.23px; font-family: "UnileverShilling"; font-weight: 400; font-size: 4.2666666667vw; color: #ccd2e6; margin-top: 0.5333333333vw; } .gift-report-wrapper .select-daytime .calender-action p.active { font-family: "UnileverShilling"; font-weight: 400; font-size: 3.7333333333vw; color: #001f82; } .gift-report-wrapper .select-daytime .calender-title { display: flex; background: #ffffff; margin-bottom: 2.6666666667vw; } .gift-report-wrapper .select-daytime .calender-title img { width: 5.3333333333vw; height: 5.3333333333vw; display: block; margin-right: 3.4666666667vw; } .gift-report-wrapper .select-daytime .calender-title p { font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #001f82; letter-spacing: 0.23px; margin-top: 0.5333333333vw; } .gift-report-wrapper .select-daytime .calendar-content { background: #ffffff; margin-top: 1px; border-radius: 1.8666666667vw; box-shadow: 1px 0.5333333333vw 2.1333333333vw rgba(0, 0, 0, 0.2); position: absolute; margin: 2.6666666667vw; margin-top: 0; left: 0; right: 0; z-index: 999; } .gift-report-wrapper .select-daytime .calendar-content .close-icon { display: block; width: 4vw; height: 4vw; position: absolute; left: 4.2666666667vw; top: 5.0666666667vw; filter: sepia(1); } .gift-report-wrapper .select-daytime .calendar-content .calendar-function { display: flex; justify-content: space-between; padding: 3.4666666667vw 4.8vw 6.6666666667vw 4.8vw; border-top: 1px solid #e7e7e7; } .gift-report-wrapper .select-daytime .calendar-content .calendar-function p, .gift-report-wrapper .select-daytime .calendar-content .calendar-function span { font-size: 4.2666666667vw; font-weight: 500; letter-spacing: 0.27px; } .gift-report-wrapper .select-daytime .calendar-content .calendar-function p { color: #979797; } .gift-report-wrapper .select-daytime .calendar-content .calendar-function span { color: #001f82; display: block; } .gift-report-wrapper .sum-gift { padding: 1.3333333333vw 2.6666666667vw; display: flex; justify-content: space-between; margin-top: 5.3333333333vw; font-family: "UnileverShilling"; font-weight: 600; font-size: 4.2666666667vw; color: #001f82; } .send-gift .title-select { color: #001f82; margin-bottom: 0; } .send-gift .detailGiftLoyalty { background-color: #001f82; border-radius: 4vw; padding: 4vw 5.3333333333vw; margin-bottom: 5.3333333333vw; } .send-gift .detailGiftLoyalty p { display: flex; color: #fff; justify-content: space-between; } .send-gift .detailGiftLoyalty p + p { padding-top: 2.6666666667vw; } .manual-banker .checkbox { display: flex; border: none; } .gift-list-code .list-gift-code { padding: 0; margin-top: 5.3333333333vw; } .gift-list-code .list-gift-code .block-item { justify-content: flex-start; border: 0; border-radius: 2.6666666667vw; margin-top: 4.2666666667vw; box-shadow: 1px 2px 8px rgba(0, 0, 0, 0.1); } .gift-list-code .title-form { text-align: left; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; margin-top: 10.6666666667vw; } .gift-list-code .btn-wrapper { margin-top: 6.1333333333vw; } .page-404 .content-infor .img-content img { max-height: 71.2vw; } .page-404 .content-support { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.7333333333vw; color: #001f82; margin-top: 3.2vw; margin-bottom: 9.0666666667vw; } .page-404 .content-support a { color: #005eef; text-decoration: underline; } textarea#InputTextArea-table { border: none; width: 100%; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.7333333333vw; color: #000000; } .infor-product .list-luckyTurn li { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #c60034; margin-top: 2.1333333333vw; } .infor-product .numberAround { margin-top: 0; } .infor-product .numberAround .form-control { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.7333333333vw; color: #000000; margin-top: 4.2666666667vw; margin-bottom: 4.2666666667vw; font-size: 3.7333333333vw; height: 10.6666666667vw; line-height: 10.6666666667vw; text-align: left; border: 1px solid #001f82; background-color: #fff; border-radius: 1.8666666667vw; width: 100% !important; padding: 0 2.1333333333vw; } .infor-product .numberAround .form-control[readonly] { background-color: #7676763d; border-color: transparent; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.7333333333vw; color: #9e9e9e; } .infor-product .group-btn-inline { margin-bottom: 5.3333333333vw; } .infor-product table { width: 100%; } .infor-product thead, .infor-product tbody tr { display: table; width: 100%; table-layout: fixed; } .infor-product tbody { display: block; } .infor-product .sumTable { display: flex; justify-content: space-between; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.2vw; color: #001f82; background-color: #e5e8f2; margin-bottom: 4vw; padding: 4vw; } .infor-product .table-responsive .inputTT { position: relative; padding-right: 9.3333333333vw; text-align: right !important; } .infor-product .table-responsive .inputTT input { width: 100%; text-align: right !important; } .infor-product .table-responsive .inputTT::before { position: absolute; right: 0; top: 30%; margin: auto; } .infor-product .table-responsive .inputTT .textMulti { position: absolute; right: 0; top: 30%; margin: auto; } .infor-product .table-responsive.hideSL th:nth-child(2), .infor-product .table-responsive.hideSL td:nth-child(2) { display: none; } .infor-product .table-responsive.hideSKU th:nth-child(1), .infor-product .table-responsive.hideSKU td:nth-child(1) { display: none; } .infor-product .table-responsive.hideTT th:nth-child(3), .infor-product .table-responsive.hideTT td:nth-child(3) { display: none; } .infor-product .table-responsive.hideTT td:nth-child(1) { width: 14.6666666667vw; } .infor-product .table-responsive .title-block { text-align: left; } .infor-product .table-responsive th { font-family: "UnileverShilling"; font-weight: 500; font-size: 3.2vw; color: #001f82; white-space: nowrap; padding-bottom: 2.6666666667vw; } .infor-product .table-responsive th:nth-child(1) { width: 38.4vw; text-align: left; } .infor-product .table-responsive td, .infor-product .table-responsive th { border: 0; word-break: break-word; } .infor-product .table-responsive table, .infor-product .table-responsive th, .infor-product .table-responsive td { border: 0; border-collapse: collapse; text-align: right; } .infor-product .table-responsive:nth-child(2n) { background-color: #f8f8f8; } .infor-product .table-responsive .hasError { background-color: #ff000033; } .infor-product .table-responsive .hasError:hover td { background-color: transparent; } .infor-product .table-responsive .hasError td:nth-child(2n) { background-color: transparent; } .infor-product .table-responsive td:nth-child(2n) { background-color: #f8f8f8; } .infor-product .table-responsive td:nth-child(1) { width: 38.4vw; } .infor-product .table-responsive td:nth-child(4) { width: 9.0666666667vw; text-align: center; } .infor-product .table-responsive tr { border-bottom: 1px solid #cdd3d9; font-family: "UnileverShilling"; font-weight: 400; font-size: 3.2vw; color: #000000; } .infor-product .table-responsive tr:last-child { border-bottom: 0; } .infor-product .table-responsive tr:hover td { background-color: #ecedef; } .infor-product .table-responsive tr.no-data td { background-color: #ecedef; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000; text-align: center; } .infor-product .container { padding: 0 2.6666666667vw; } .infor-product table th { font-family: "UnileverShilling"; font-weight: 500; font-size: 2.9333333333vw; color: #001f82; white-space: nowrap; } .infor-product table th:nth-child(2) { text-align: left; } .infor-product table th:nth-child(3) { text-align: right; } .infor-product table th:nth-child(4) { width: 13.3333333333vw; text-align: right; } .infor-product table td { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000; padding: 2.6666666667vw 1.3333333333vw; } .infor-product table td:nth-child(2) { text-align: center; width: 14.6666666667vw; } .infor-product table td:nth-child(2) input { text-align: center; } .infor-product table td:nth-child(3) input { text-align: right; } .infor-product table td:nth-child(4) input { text-align: right; } .infor-product table td input { font-size: 3.2vw; height: 10.6666666667vw; line-height: 10.6666666667vw; text-align: left; border: 1px solid #001f82; background-color: #fff; border-radius: 1.8666666667vw; width: 100% !important; padding: 0 2.1333333333vw; } .infor-product table td input[readonly] { border: 0; } .infor-product table td input.p-inputtext { border: 0; padding-left: 2.6666666667vw; } .infor-product table td input.p-inputtext::-moz-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 3.2vw; opacity: 1; } .infor-product table td input.p-inputtext:-ms-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 3.2vw; } .infor-product table td input.p-inputtext::-webkit-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 3.2vw; } .infor-product table td .p-autocomplete { height: 10.6666666667vw; line-height: 10.6666666667vw; box-shadow: 1px 0.5333333333vw 2.1333333333vw rgba(0, 0, 0, 0.09); margin-bottom: 0; } .infor-product table td .select-selected, .infor-product table td .disable-select { font-size: 3.2vw; height: 10.6666666667vw; line-height: 10.6666666667vw; padding-left: 1.3333333333vw; padding-right: 5.3333333333vw; box-shadow: 1px 0.5333333333vw 2.1333333333vw rgba(0, 0, 0, 0.09); } .infor-product table td .select-selected:focus, .infor-product table td .disable-select:focus { border: 1px solid #001f82; border-radius: 1.8666666667vw; } .infor-product table td .select-selected.active, .infor-product table td .disable-select.active { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000000; border: 0; border-radius: 1.8666666667vw; } .infor-product table td .disable-select { line-height: 1.5; height: auto; padding: 10px; min-height: 10.6666666667vw; display: flex; align-items: center; } .infor-product table td .custom-select { border: 0; } .infor-product table td .custom-select .dropdown-select li { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000000; } .infor-product table .custom-select { width: 37.3333333333vw; } .infor-product .custom-select { border: 1px solid #001f82; border-radius: 1.8666666667vw; } .infor-product .custom-select .dropdown-select li { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000000; } .infor-product .custom-select .dropdown-select li.active:after { right: 1.3333333333vw; top: 40%; } .infor-product .title-select { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; } .infor-product .edit-icon { width: 4.2666666667vw; height: 4.2666666667vw; background-image: url('ic-mode-edit.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .infor-product .del-icon { width: 3.2vw; height: 4.2666666667vw; background-image: url('ic-mode-del.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .infor-product .add-icon { width: 6.4vw; height: 6.4vw; background-image: url('mask-more.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .infor-product .add-more { display: inline-flex; align-items: center; padding: 4vw; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.7333333333vw; color: #001f82; } .infor-product .add-more .add-icon { margin-right: 2.6666666667vw; } .infor-product .note-check { display: flex; justify-content: space-between; box-shadow: 1px 0.5333333333vw 2.1333333333vw rgba(0, 0, 0, 0.09); padding: 2.6666666667vw 4vw; border-radius: 1.8666666667vw; } .infor-product .note-check .notepad-icon { width: 5.6vw; height: 7.4666666667vw; background-image: url('notepad.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .infor-product .note-check .des-note { position: relative; display: inline-block; padding-right: 8vw; } .infor-product .note-check .des-note.active span { font-family: "UnileverShilling"; font-weight: 500; font-size: 3.2vw; color: #001f82; display: inline-block; background-color: transparent; padding: 1.3333333333vw 6.6666666667vw; border-radius: 5.3333333333vw; display: inline-block; max-width: 66.6666666667vw; } .infor-product .note-check .des-note span { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #a8b9f2; display: inline-block; background-color: #e5e8f2; padding: 1.3333333333vw 6.6666666667vw; border-radius: 5.3333333333vw; } .infor-product .note-check .des-note::after { content: ""; width: 4vw; height: 4vw; background-image: url('next.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; margin-left: 10px; position: absolute; top: 0; bottom: 0; margin: auto; margin-left: 10px; } .invoice-ocr .container { padding: 2.1333333333vw; margin-top: -6.6666666667vw; position: relative; } .invoice-ocr .bgr-select-group { background-color: #001f82; border-radius: 4vw; padding: 2.6666666667vw; } .invoice-ocr .bgr-select-group .block-title { display: flex; justify-content: space-between; align-items: center; margin-top: 1.3333333333vw; } .invoice-ocr .bgr-select-group .block-title:first-child { margin-top: 0; } .invoice-ocr .bgr-select-group .block-title .title { color: #a4afd2; width: 45%; margin-right: 5.3333333333vw; font-size: 3.7333333333vw; } .invoice-ocr .bgr-select-group .block-title .input-code, .invoice-ocr .bgr-select-group .block-title .datetime, .invoice-ocr .bgr-select-group .block-title .dateID, .invoice-ocr .bgr-select-group .block-title select { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000000; text-align: left; width: 55%; } .invoice-ocr .bgr-select-group .block-title select::-ms-expand { display: none; } .invoice-ocr .bgr-select-group .block-title select { background-image: url('arrow-drop-down.png'); background-repeat: no-repeat; background-position: 95% 55%; background-size: 3.2vw; } .invoice-ocr .bgr-select-group .block-title .p-calendar .p-inputtext, .invoice-ocr .bgr-select-group .block-title input[type=datetime-local] { background-image: url('date-range.png'); background-repeat: no-repeat; background-position: 95% 55%; background-size: 4vw 4.5333333333vw; } .invoice-ocr .bgr-select-group .block-title .p-calendar .p-inputtext::-webkit-calendar-picker-indicator, .invoice-ocr .bgr-select-group .block-title input[type=datetime-local]::-webkit-calendar-picker-indicator { color: transparent; background: none; z-index: 1; } .invoice-ocr .bgr-select-group .block-title input[readonly], .invoice-ocr .bgr-select-group .block-title select[disabled] { border: none; opacity: 1; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.7333333333vw; color: #ffffff; text-align: right; width: auto; max-width: 55%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .invoice-ocr .bgr-select-group .block-title select:not([disabled]) { padding-right: 8vw !important; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .invoice-ocr .bgr-select-group .block-title select:not([disabled]), .invoice-ocr .bgr-select-group .block-title input:not([readonly]) { -webkit-appearance: none; /*webkit browsers */ -moz-appearance: none; /*Firefox */ appearance: none; /* modern browsers */ background-color: #fff; height: 9.6vw; padding: 0 2.1333333333vw; border: 0; border-radius: 1.8666666667vw; } .invoice-ocr .bgr-select-group .block-title input[type=datetime-local][readonly]::-webkit-calendar-picker-indicator { display: none; } .invoice-ocr .header-table { display: flex; justify-content: space-between; align-items: center; } .invoice-ocr .header-table .title-table { font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #001f82; } .invoice-ocr .header-table .btn-link { font-size: 3.7333333333vw; } .invoice-ocr .table-responsive th { font-family: "UnileverShilling"; font-weight: 500; font-size: 2.6666666667vw; color: #001f82; white-space: nowrap; } .invoice-ocr .table-responsive th:nth-child(2n) { text-align: center; } .invoice-ocr .table-responsive th:nth-child(1) { width: 40.5333333333vw; text-align: left; } .invoice-ocr .table-responsive td { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000000; padding: 3.2vw 0; } .invoice-ocr .table-responsive table, .invoice-ocr .table-responsive th, .invoice-ocr .table-responsive td { border: 0; border-collapse: collapse; text-align: right; } .invoice-ocr .table-responsive td:nth-child(2n) { background-color: #f8f8f8; text-align: center; } .invoice-ocr .table-responsive td:nth-child(1) { width: 40.5333333333vw; text-align: left; } .invoice-ocr .table-responsive tr { border-bottom: 1px solid #cdd3d9; font-family: "UnileverShilling"; font-weight: 400; font-size: 3.2vw; color: #000000; } .invoice-ocr .table-responsive tr th { padding: 3.2vw 0; } .invoice-ocr .table-responsive tr:hover td { background-color: #ecedef; } .invoice-ocr .table-responsive tr.no-data td { background-color: #ecedef; font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #000; text-align: center; } .invoice-ocr .table-responsive table { width: 100%; } .invoice-ocr .table-responsive thead, .invoice-ocr .table-responsive tbody tr { display: table; width: 100%; table-layout: fixed; } .invoice-ocr .table-responsive tbody { display: block; overflow-y: auto; table-layout: fixed; max-height: 35vh; } .invoice-ocr .sumTable { display: flex; justify-content: space-between; align-items: center; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.2vw; color: #001f82; background-color: #e5e8f2; margin-bottom: 4vw; padding: 2.1333333333vw; } .invoice-ocr .sumTable .name-sum { width: 34.6666666667vw; } .invoice-ocr .sumTable .sum-value { width: 26.6666666667vw; text-align: right; height: 9.6vw; border: 1px solid #001f82; padding: 0 2.1333333333vw; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.2vw; color: #001f82; border-radius: 2.1333333333vw; } .invoice-ocr .sumTable .sum-value[readonly] { border: 0; } .list-mechanic .block-content { padding-top: 2.6666666667vw; padding-bottom: 2.6666666667vw; } .list-mechanic .block-content .block-item { display: flex; justify-content: flex-start; align-items: center; padding: 4.8vw 1.0666666667vw 4.8vw 0; position: relative; } .list-mechanic .block-content .block-item label { padding-left: 2vw; text-align: left; margin-top: 0; line-height: 1.5; font-family: "UnileverShilling"; font-weight: 100; font-size: 4.2666666667vw; color: #001f82; } .list-mechanic .block-content .block-item.tag-blue::before { position: absolute; content: ""; left: 8vw; top: 5.3333333333vw; width: 16.2666666667vw; height: 4.5333333333vw; background-image: url('tag1.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .list-mechanic .block-content .block-item.tag-red::before { position: absolute; content: ""; left: 8vw; top: 5.3333333333vw; width: 16.2666666667vw; height: 4.5333333333vw; background-image: url('tag2.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .list-mechanic .block-content .block-item:last-child { border-bottom: 0; } .list-mechanic .block-content .block-item.disabled img.img-product { filter: grayscale(1); opacity: 0.8; } .list-mechanic .block-content .block-item.disabled .desc-txt { color: #8e8e8e; } .list-mechanic .block-content .block-item.disabled .desc-txt span, .list-mechanic .block-content .block-item.disabled .desc-txt .note-sent { color: #8e8e8e; } .loyalty-message { z-index: 2; position: relative; } .ticket-info .form-control { border-radius: 13.3333333333vw !important; color: #001f82; } .ticket-info input[readonly] { background-color: #e4e4e4 !important; border: 0px; } .ticket-info .group-btn-inline { margin-top: 10.6666666667vw !important; } .ticket-info .group-btn-inline .btn.disabled { color: #fff !important; pointer-events: none; background-color: #ccd2e6 !important; border: none; } .ticket-info .block-title { display: flex; justify-content: space-between; align-items: center; margin-top: 1.3333333333vw; } .ticket-info .block-title:first-child { margin-top: 0; } .ticket-info .block-title .title { color: #a4afd2; width: 45%; margin-right: 5.3333333333vw; font-size: 4.2666666667vw; } .ticket-info .block-title .input-code, .ticket-info .block-title .datetime, .ticket-info .block-title .dateID, .ticket-info .block-title select { font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #000000; text-align: left; width: 55%; } .ticket-info .block-title select::-ms-expand { display: none; } .ticket-info .block-title select { background-image: url('arrow-drop-down.png'); background-repeat: no-repeat; background-position: 95% 55%; background-size: 3.2vw; } .ticket-info .block-title .p-calendar .p-inputtext, .ticket-info .block-title input[type=datetime-local] { background-image: url('date-range.png'); background-repeat: no-repeat; background-position: 95% 55%; background-size: 4vw 4.5333333333vw; } .ticket-info .block-title .p-calendar .p-inputtext::-webkit-calendar-picker-indicator, .ticket-info .block-title input[type=datetime-local]::-webkit-calendar-picker-indicator { color: transparent; background: none; z-index: 1; } .ticket-info .block-title input[readonly], .ticket-info .block-title select[disabled] { border: none; opacity: 1; font-family: "UnileverShilling"; font-weight: 500; font-size: 4.2666666667vw; color: #b9b9b9; text-align: right; width: auto; max-width: 55%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .ticket-info .block-title select:not([disabled]) { padding-right: 8vw !important; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .ticket-info .block-title select:not([disabled]), .ticket-info .block-title input:not([readonly]) { -webkit-appearance: none; /*webkit browsers */ -moz-appearance: none; /*Firefox */ appearance: none; /* modern browsers */ background-color: #fff; height: 9.6vw; padding: 0 2.1333333333vw; border: 0; border-radius: 1.8666666667vw; } .ticket-info .block-title input[type=datetime-local][readonly]::-webkit-calendar-picker-indicator { display: none; } .ticket-info .p-calendar { width: 100%; margin-top: 5.3333333333vw !important; height: 13.3333333333vw; border: 1px solid rgba(0, 94, 239, 0.2); padding: 0; font-size: 6vw; text-align: center; margin-top: 4vw; border-radius: 13.3333333333vw; width: 100%; padding: 1.3333333333vw 0; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; } .ticket-info .p-calendar::-moz-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; opacity: 1; } .ticket-info .p-calendar:-ms-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .ticket-info .p-calendar::-webkit-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .ticket-info .p-inputtext { color: #495057; background: #ffffff; border: none; transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s; -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; padding: 0; font-size: 6vw; text-align: center; border-radius: 13.3333333333vw; padding: 1.3333333333vw 0; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; } .ticket-info .p-inputtext::-moz-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; opacity: 1; } .ticket-info .p-inputtext:-ms-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .ticket-info .p-inputtext::-webkit-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .ticket-info .block-feature textarea { border: 1px solid #ced4da; border-radius: 1.3333333333vw; font-family: "UnileverShilling"; font-weight: normal; font-size: 4.2666666667vw; color: #001f82; width: 100%; padding: 1.3333333333vw 2.6666666667vw; margin-top: 2.6666666667vw; } .ticket-info .block-feature textarea::-moz-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; opacity: 1; } .ticket-info .block-feature textarea:-ms-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .ticket-info .block-feature textarea::-webkit-input-placeholder { color: rgba(0, 32, 131, 0.25); font-size: 4.2666666667vw; } .gift-sampl-wrapper h3 { font-family: "UnileverShilling"; font-weight: 600; font-size: 4.2666666667vw; color: #151515; } .gift-sampl-wrapper .block-content { margin-bottom: 8vw; } .gift-sampl-wrapper .block-content .block-item { display: flex; justify-content: space-between; align-items: center; border-bottom: 0.5px solid #D3D3D3; padding: 3.7333333333vw 0; position: relative; } .gift-sampl-wrapper .block-content .block-item.tag-blue::before { position: absolute; content: ""; left: 8vw; top: 5.3333333333vw; width: 16.2666666667vw; height: 4.5333333333vw; background-image: url('tag1.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .gift-sampl-wrapper .block-content .block-item.tag-red::before { position: absolute; content: ""; left: 8vw; top: 5.3333333333vw; width: 16.2666666667vw; height: 4.5333333333vw; background-image: url('tag2.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .gift-sampl-wrapper .block-content .block-item.disabled img.img-product { filter: grayscale(1); opacity: 0.8; } .gift-sampl-wrapper .block-content .block-item.disabled .desc-txt { color: #8e8e8e; } .gift-sampl-wrapper .block-content .block-item.disabled .desc-txt span, .gift-sampl-wrapper .block-content .block-item.disabled .desc-txt .note-sent { color: #8e8e8e; } .gift-sampl-wrapper .block-content .checkbox { margin-right: 8vw; } .gift-sampl-wrapper .block-content .checkbox input { display: none; } .gift-sampl-wrapper .block-content .checkbox input:checked ~ label::before { border-color: #0d009d; } .gift-sampl-wrapper .block-content .checkbox label { padding: unset; } .gift-sampl-wrapper .block-content .checkbox label::before { top: 0; border-color: #e9e9e9; } .gift-sampl-wrapper .block-content .checkbox label::after { top: 1.0666666667vw; } .gift-sampl-wrapper .block-content .desc-txt { margin-left: 4.2666666667vw; width: 42.6666666667vw; font-family: "UnileverShilling"; font-weight: 500; font-size: 3.4666666667vw; color: #245BE5; } .gift-sampl-wrapper .block-content .desc-txt span { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: #151515; } .gift-sampl-wrapper .block-content .desc-txt .note-sent { font-family: "UnileverShilling"; font-weight: normal; font-size: 2.9333333333vw; color: #151515; font-style: italic; } .gift-sampl-wrapper .block-content .desc-txt .note-sent strong { font-family: "UnileverShilling"; font-weight: normal; font-size: 3.2vw; color: red; } .gift-sampl-wrapper .block-content .desc-txt .warning-status { position: relative; padding-left: 4.2666666667vw; } .gift-sampl-wrapper .block-content .desc-txt .warning-status span { color: #f66405; } .gift-sampl-wrapper .block-content .desc-txt .warning-status::before { position: absolute; content: ""; left: 0; top: 1.0666666667vw; width: 3.2vw; height: 3.4666666667vw; background-image: url('warning.png'); background-size: 90%; background-position: center; background-repeat: no-repeat; display: inline-block; } .gift-sampl-wrapper .block-content .input-range { margin-left: 2.6666666667vw; } .gift-sampl-wrapper .block-content .input-range form, .gift-sampl-wrapper .block-content .input-range .qtySelector { display: flex; } .gift-sampl-wrapper .block-content .input-range input { border: 0; width: 13.3333333333vw; text-align: center; font-size: 3.7333333333vw; background: transparent; opacity: 1; margin: 0; } .gift-sampl-wrapper .block-content .input-range input:focus { border: 1px solid #ccc !important; } .gift-sampl-wrapper .block-content .input-range .value-button { width: 5.3333333333vw; height: 5.3333333333vw; position: relative; font-size: 3.2vw; line-height: 4.8vw; text-align: center; background: #0d009d; border-radius: 50%; color: #ffffff; display: flex; justify-content: center; align-items: center; } .gift-sampl-wrapper .block-content .input-range .value-button.fa-minus { background-color: #005eef; } .gift-sampl-wrapper .block-content .input-range .value-button.disabled { opacity: 0.5; pointer-events: none; background: #a6a6a6; } .gift-sampl-wrapper .block-content .input-range.disabled { opacity: 0.5; pointer-events: none; } .gift-sampl-wrapper .block-content .input-range.disabled .value-button { background: #a6a6a6; } .gift-sampl-wrapper .block-content .input-range.disabled input { color: #a6a6a6; } .gift-sampl-wrapper .block-content .img-product { max-width: 21.6vw; height: auto; width: auto; max-height: 17.8666666667vw; } .gift-sampl-wrapper .head-center { text-align: center; } .gift-sampl-wrapper .head-center h2 { font-family: "UnileverShilling"; font-weight: 600; font-size: 4.2666666667vw; color: #151515; margin-bottom: 2.6666666667vw; } .gift-sampl-wrapper .head-center h4 { font-family: "UnileverShilling"; font-weight: 400; font-size: 3.7333333333vw; color: #151515; } .gift-sampl-wrapper .hithere { animation: hithere 2s ease infinite; } @keyframes hithere { 0% { opacity: 0; transform: scale(0.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(0.9); } 100% { transform: scale(1); } } .gift-sampl-wrapper .box-gird { display: flex; flex-flow: row wrap; min-width: 0; margin-top: 5.3333333333vw; grid-row-gap: 4.2666666667vw; row-gap: 4.2666666667vw; margin-left: -2.1333333333vw; margin-right: -2.1333333333vw; } .gift-sampl-wrapper .box-gird .item { padding-left: 8px; padding-right: 8px; display: block; flex: 0 0 33.33333333%; max-width: 33.33333333%; } .gift-sampl-wrapper .box-gird .item .item-inner { display: flex; justify-content: center; align-items: center; width: 100%; height: 26.6666666667vw; border: 0.4vw solid #1B45A7; box-shadow: 0.5333333333vw 0.5333333333vw 4.2666666667vw rgba(0, 0, 0, 0.1); border-radius: 3.2vw; } .gift-sampl-wrapper .box-gird .item img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .gift-sampl-wrapper .btn-wrapper { margin-top: 9.8666666667vw; margin-bottom: 4vw; } .gift-sampl-wrapper .btn-wrapper.btn-fixed { position: fixed; bottom: 0; width: 100%; left: 0; padding: 20px 20px; margin-bottom: 0; margin-top: 0; background-color: #ffffff; padding-top: 0; } .bgr-desktop { background-image: url('desk-bgr.jpg'); background-color: #001f82; background-repeat: no-repeat; background-size: cover; background-position: bottom; } .bgr-desktop .logo { width: 17.1102661597vw; margin-bottom: 2vh; } .landing-desktop { display: flex; justify-content: space-between; height: 100vh; overflow: hidden; padding-bottom: 0; position: relative; } .landing-desktop::before { display: block; position: absolute; content: ""; top: 0; left: -50%; width: 200%; height: 100%; z-index: -1; background-size: 40rem 40rem; background-image: url('falling-snow2.png'); animation: snow 28s linear infinite; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; opacity: 0.2; filter: alpha(opacity=0); transition: opacity 10s; } @keyframes snow { 0% { background-position-x: 0; background-position-y: 0; } 50% { background-position-y: 40rem; } 100% { background-position-x: 40rem; background-position-y: 80rem; } } .landing-desktop .left-main { padding-top: 1.9373528879vw; margin-left: 3.7479630636vw; font-size: 2.3vh; font-weight: 400; color: #fff; position: relative; height: 100%; width: 40%; } .landing-desktop .left-main .qrCode { position: relative; padding-left: 4.8886474742vw; margin-top: 1vh; } .landing-desktop .left-main .qrCode img { width: 14.1589715734vw; height: 13.3623030961vw; } .landing-desktop .left-main .qrCode::before { content: ""; width: 4.8886474742vw; height: 5.0697084918vw; background-image: url('desk-guide.png'); background-repeat: no-repeat; background-size: contain; position: absolute; left: 0; top: 0; } .landing-desktop .left-main ul { margin-top: 4vh; margin-left: 0.9053050878vw; } .landing-desktop .left-main ul li { list-style: disc; margin-bottom: 1vh; } .landing-desktop .left-main ul li a { text-decoration: none; color: #fff; font-weight: 400; } .landing-desktop .left-main ul li a:hover { text-decoration: underline; opacity: 0.8; } .landing-desktop .left-main .noteps { position: absolute; bottom: 2vh; } .landing-desktop .right-main { width: 60%; text-align: right; background-image: url('desk-kv.png'); background-repeat: no-repeat; background-size: contain; background-position: bottom; } .landing-desktop .right-main img { max-width: 100%; height: 100vh; }