.matx-option-panel-box{display:block!important;position:fixed;top:0;right:-242px;width:242px;z-index:99999999999;height:100%;-webkit-transition:right .3s ease;-o-transition:right .3s ease;-moz-transition:right .3s ease;transition:right .3s ease}.matx-option-panel-box.active-panel{right:0}.matx-option-panel-box .matx-option-panel-toggle{display:block;width:40px;height:40px;-webkit-border-radius:3px 0 0 3px;-moz-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;background:#fff;font-size:18px;position:absolute;top:20%;right:100%;text-align:center;line-height:40px;-webkit-box-shadow:-3px 0 5px -2px rgba(0,0,0,.14);-moz-box-shadow:-3px 0 5px -2px rgba(0,0,0,.14);box-shadow:-3px 0 5px -2px rgba(0,0,0,.14);color:#ff5252}.matx-option-panel-box .matx-option-panel-toggle i{line-height:40px}.matx-option-panel-box .matx-option-panel-container{background:#fff;padding:30px;height:100%;overflow:hidden;overflow-y:auto;-webkit-box-shadow:-3px 0 50px -2px rgba(0,0,0,.14);-moz-box-shadow:-3px 0 50px -2px rgba(0,0,0,.14);box-shadow:-3px 0 50px -2px rgba(0,0,0,.14);text-align:center}.matx-option-panel-container .mdl-button{margin-bottom:30px;width:100%}.matx-option-panel-box .matx-option-panel-title{font-family:Roboto,sans-serif;font-weight:700;font-size:14px;color:#333;line-height:1.3;text-transform:uppercase;margin:0 0 15px}.matx-option-panel-box .matx-option-panel-des{line-height:1.5;font-size:11px;margin-bottom:20px;color:#555}.matx-option-panel-box .matx-colors{display:table;line-height:1;margin-top:25px;margin-bottom:20px}.matx-option-panel-box .matx-colors li{display:inline-block;list-style:none;margin-bottom:20px;margin-right:20px}.matx-option-panel-box .matx-colors li:nth-child(4n+4){margin-right:0}.matx-option-panel-box .matx-colors li a{display:block;width:25px;height:25px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-transition:all .25s ease;-o-transition:all .25s ease;-moz-transition:all .25s ease;transition:all .25s ease}.matx-colors li.color-scheme-red a{background-color:#ff5252}.matx-colors li.color-scheme-cyan a{background-color:#00BCD4}.matx-colors li.color-scheme-indigo a{background-color:#3F51B5}.matx-colors li.color-scheme-deep-purple a{background-color:#673AB7}.matx-colors li.color-scheme-pink a{background-color:#E91E63}.matx-colors li.color-scheme-blue a{background-color:#2196F3}.matx-colors li.color-scheme-green a{background-color:#4CAF50}.matx-colors li.color-scheme-deep-orange a{background-color:#FF5722}.matx-colors li.color-scheme-blue-grey a{background-color:#607D8B}.matx-colors li.color-scheme-teal a{background-color:#009688}.matx-colors li.color-scheme-purple a{background-color:#9C27B0}.matx-colors li.color-scheme-light-green a{background-color:#8BC34A}.matx-option-panel-box .matx-colors li a.active,.matx-option-panel-box .matx-colors li a:hover{-webkit-box-shadow:0 3px 7px 0 rgba(0,0,0,.18),0 2px 11px 0 rgba(0,0,0,.15);-moz-box-shadow:0 3px 7px 0 rgba(0,0,0,.18),0 2px 11px 0 rgba(0,0,0,.15);box-shadow:0 3px 7px 0 rgba(0,0,0,.18),0 2px 11px 0 rgba(0,0,0,.15)}.matx-custom-color-form .matx-color-field{width:100%;margin-right:5px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;border:1px solid #ddd;outline:0;color:#777;padding:6px 10px;display:block;vertical-align:middle;background:#fafafa;margin-bottom:15px}.matx-custom-color-form .matx-color-try-button{border:none;-webkit-box-shadow:0 3px 4.7px .3px rgba(0,0,0,.24);-moz-box-shadow:0 3px 4.7px .3px rgba(0,0,0,.24);box-shadow:0 3px 4.7px .3px rgba(0,0,0,.24);background:#333;color:#fff;padding:7px 25px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;text-transform:uppercase;outline:0!important;display:inline-block;vertical-align:middle;font-weight:500}