meidu2021/daju/WebRoot/plug-in/planeui/dist/css/planeui.css

@charset "UTF-8";
/**
 *
 * PlaneUI
 *
 * A HTML5 Web Application UI Kit.
 *
 * @fileName    planeui.css
 * @version     0.1.0
 * @auther      Pandao
 * @license     MIT license
 * @link        https://github.com/pandao/planeui
 * @copyright   2014 All rights reserved.
 */
/*! Prefixes.scss v0.2.0 | CSS(3) prefixes mixins library for Sass/Scss, Custom you need CSS prefixes. | Author: Pandao | Copyright (c) 2015 Pandao, MIT License | https://github.com/pandao/prefixes.scss | 2015-06-19 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"], input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  box-sizing: content-box;
  /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/* ================  Basic  ================ */
@font-face {
  font-family: 'planeui-logo';
  src: url("../fonts/planeui-logo.eot?-rfliw7");
  src: url("../fonts/planeui-logo.eot?#iefix-rfliw7") format("embedded-opentype"), url("../fonts/planeui-logo.ttf?-rfliw7") format("truetype"), url("../fonts/planeui-logo.woff?-rfliw7") format("woff"), url("../fonts/planeui-logo.svg?-rfliw7#planeui-logo") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class*=pui-logo], [class*=planeui-logo] {
  font-family: 'planeui-logo';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  font-size: inherit;
  line-height: 1;
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.pui-logo:before,
.pui-logo-1x:before,
.pui-logo-2x:before,
.pui-logo-3x:before,
.pui-logo-4x:before,
.pui-logo-5x:before,
.pui-logo-6x:before,
.pui-logo-7x:before,
.pui-logo-8x:before,
.planeui-logo:before,
.planeui-logo-1x:before,
.planeui-logo-2x:before,
.planeui-logo-3x:before,
.planeui-logo-4x:before,
.planeui-logo-5x:before,
.planeui-logo-6x:before,
.planeui-logo-7x:before,
.planeui-logo-8x:before {
  content: "\e600";
}

.pui-logo-lg, .planeui-logo-lg {
  font-size: 1.4em;
}

.pui-logo-lg:before, .planeui-logo-lg:before {
  content: "\e600";
}

.pui-logo-1x, .planeui-logo-1x {
  font-size: 1em;
}

.pui-logo-2x, .planeui-logo-2x {
  font-size: 2em;
}

.pui-logo-3x, .planeui-logo-3x {
  font-size: 3em;
}

.pui-logo-4x, .planeui-logo-4x {
  font-size: 4em;
}

.pui-logo-5x, .planeui-logo-5x {
  font-size: 5em;
}

.pui-logo-6x, .planeui-logo-6x {
  font-size: 6em;
}

.pui-logo-7x, .planeui-logo-7x {
  font-size: 7em;
}

.pui-logo-8x, .planeui-logo-8x {
  font-size: 8em;
}

/* font-face: OpenSans-Regular-webfont */
@font-face {
  font-style: normal;
  font-weight: normal;
  font-family: 'OpenSansRegular';
  src: url("../fonts/OpenSans-Regular-webfont.eot");
  src: url("../fonts/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Regular-webfont.woff") format("woff"), url("../fonts/OpenSans-Regular-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Regular-webfont.svg#entypo") format("svg");
}

/* viewport settings */
@-webkit-viewport {
  width: device-width;
  user-zoom: fixed;
}

@-moz-viewport {
  width: device-width;
  user-zoom: fixed;
}

@media (max-width: 1024px) {
  @-ms-viewport {
    width: device-width;
    user-zoom: fixed;
  }
}

@-o-viewport {
  width: device-width;
  user-zoom: fixed;
}

@viewport {
  width: device-width;
  user-zoom: fixed;
}

/* reset */
* {
  margin: 0;
  padding: 0;
}

*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

::selection {
  background: #39f;
  color: #fff;
  text-shadow: none;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  margin: 0;
  padding: 0;
}

audio, canvas, video {
  display: inline-block;
}

html {
  font-size: 62.5%;
  -webkit-text-size-adjust: 100%;
  /* Chrome 27+ */
  -moz-text-size-adjust: 100%;
  /* Firefox */
  text-size-adjust: 100%;
  /* None yet */
  -webkit-tap-highlight-color: transparent;
}

body {
  color: #444;
  font-size: 12px;
  font-size: 1.2rem;
  /* 1.2rem=12px, 1rem=10px */
  line-height: 1.9;
  text-align: center;
  position: relative;
  background: #ffffff;
}

div {
  text-align: left;
}

body, button, input, select, textarea, strong, p, span, small {
  font-family: "Microsoft YaHei", "微软雅黑", "Hiragino Sans GB", STXihei, "华文细黑", STHeiti, "RobotoDraft", "Roboto", "Helvetica Neue", Helvetica, Tahoma, "Droid Sans", "wenquanyi micro hei", FreeSans, Arimo, Arial, SimSun, "宋体", Heiti, "黑体", sans-serif;
}

input, button, select, textarea {
  margin: 0;
  vertical-align: middle;
}

input[type="text"], input[type="password"], input[type="email"], input[type="number"],
input[type="url"], input[type="search"], select, textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
}

button, input[type="button"], input[type="reset"], input[type="submit"], select {
  cursor: pointer;
}

button, input {
  line-height: normal;
}

input, textarea, button {
  outline: none;
}

input:focus, input:active, textarea:focus, textarea:active, button:focus, button:active {
  outline: none;
}

input, textarea {
  text-align: left;
}

textarea {
  resize: none;
}

input[type="range"] {
  background: #ddd;
  height: 3px;
}

a, a:link, a:visited {
  color: #555;
  text-decoration: none;
}

html.no-touch a:hover, a.hover {
  color: #1C71FE;
  text-decoration: none;
}

img {
  border: none;
  vertical-align: middle;
}

img::selection {
  background: transparent;
}

img::-moz-selection {
  background: transparent;
}

ul, ol {
  margin-top: 0;
  padding-left: 18px;
  padding-left: 1.8rem;
}

ul > li > ul, ol > li > ol {
  margin-bottom: 0;
}

ul, ol, dl {
  margin-bottom: 15px;
  margin-bottom: 1.5rem;
}

ol {
  *margin-left: 5px;
  /* 解决IE7下数字序号被盖住的问题 */
}

dt {
  font-weight: bold;
}

p {
  margin-bottom: 0.6rem;
}

kbd {
  padding: 1px 3px;
  font-size: 90%;
  color: #fff;
  background-color: #333;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

code, kbd, pre, samp {
  font-family: Menlo, Monaco, Consolas, "Microsoft YaHei", "Hiragino Sans GB", "Courier New", monospace;
}

pre {
  color: #444;
  line-height: 1.5;
  display: block;
  padding: 6px;
  padding: 0.6rem;
  margin: 15px auto;
  margin: 1.5rem auto;
  word-break: break-all;
  word-wrap: break-word;
  border: 1px solid #ccc;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background-color: #f6f6f6;
}

p code {
  margin: 0 5px;
  margin: 0 0.5rem;
  text-align: center;
}

abbr[title], dfn[title] {
  color: #3BA03B;
  cursor: help;
  border-bottom: 1px dotted #777;
}

address {
  line-height: 1.5;
  font-style: normal;
}

small, .small {
  font-size: 12px;
  font-size: 1rem;
  font-size: 1.2rem\9;
  color: #999;
  font-weight: normal;
}

h1 > small, h2 > small, h3 > small, h4 > small, h5 > small, h6 > small {
  font-size: 70%;
  margin-left: 10ox;
  margin-left: 1rem;
}

mark, .mark, .highlight {
  padding: 2px 3px;
  background: #ffffcc;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

p mark, p .mark {
  margin: 0 5px;
  margin: 0 0.5rem;
}

q, blockquote {
  font-style: italic;
}

blockquote {
  font-size: 14px;
  font-size: 1.4rem;
  padding: 10px 12px;
  padding: 1rem 1.2rem;
  margin: 15px 0;
  margin: 1.5rem 0;
  border-left: 5px solid #eee;
}

blockquote p:last-child, blockquote ul:last-child, blockquote ol:last-child {
  margin-bottom: 0;
}

blockquote footer, blockquote small, blockquote .small {
  color: #999;
  display: block;
  font-size: 80%;
  line-height: 1.5;
}

table {
  display: table;
  table-layout: fixed;
  border-spacing: 0;
  border-collapse: collapse;
}

thead {
  display: table-header-group;
  vertical-align: middle;
}

tfoot {
  vertical-align: middle;
}

tbody {
  display: table-row-group;
}

tr {
  display: table-row;
}

td, th {
  text-align: left;
  display: table-cell;
}

th {
  font-weight: bold;
}

hr {
  height: 0px;
  margin: 15px auto;
  margin: 1.5rem auto;
  border: none;
  border-bottom: 1px solid #ddd;
  _display: block;
  _overflow: hidden;
}

iframe {
  border: none;
}

form {
  margin: 15px 0;
  margin: 1.5rem 0;
}

fieldset {
  margin: 15px auto;
  margin: 1.5rem auto;
  padding: 6px 10px 10px;
  padding: 0.6rem 1rem 1rem;
  border: 1px solid #eee;
}

legend {
  border: 0;
  font-size: 15px;
  font-size: 1.5rem;
  padding: 0 0.5rem;
}

label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  margin-bottom: 0.5rem;
}

/* scrollbar style for webkit */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-button {
  height: 0;
  width: 0;
}

::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {
  display: block;
}

::-webkit-scrollbar-button:vertical:start:increment, ::-webkit-scrollbar-button:vertical:end:decrement {
  display: none;
}

::-webkit-scrollbar-track:vertical, ::-webkit-scrollbar-track:horizontal, ::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-track:vertical, ::-webkit-scrollbar-track:horizontal, ::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
  border-style: solid;
  border-color: transparent;
  border-radius: 2px;
}

::-webkit-scrollbar-track:vertical, ::-webkit-scrollbar-track:horizontal {
  background-clip: padding-box;
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1), inset 0 -1px 0 rgba(0, 0, 0, 0.07);
  background-clip: padding-box;
  background-color: rgba(0, 0, 0, 0.2);
  min-height: 28px;
  padding-top: 100px;
}

::-webkit-scrollbar-thumb:hover {
  -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.25);
  background-color: rgba(0, 0, 0, 0.4);
}

::-webkit-scrollbar-thumb:active {
  -webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.35);
  background-color: rgba(0, 0, 0, 0.5);
}

::-webkit-scrollbar-track:vertical, ::-webkit-scrollbar-track:horizontal, ::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
  border-width: 0;
}

::-webkit-scrollbar-track:hover {
  -webkit-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.1);
  background-color: rgba(0, 0, 0, 0.05);
}

::-webkit-scrollbar-track:active {
  -webkit-box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.14), inset -1px -1px 0 rgba(0, 0, 0, 0.07);
  background-color: rgba(0, 0, 0, 0.05);
}

/* ================  Basic & Classes  ================ */
/* basic & classes */
.clearfix:before, .clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clear, .pui-clear {
  *zoom: 1;
  /* for IE 6/7 */
}

.clear:before, .clear:after, .pui-clear:before, .pui-clear:after {
  height: 0;
  font-size: 0;
  visibility: hidden;
  display: table;
  content: " ";
  line-height: 0;
  /* for Opera */
}

.clear:after, .pui-clear:after {
  clear: both;
}

.pui-cursor-default {
  cursor: default !important;
}

.pui-cursor-pointer {
  cursor: pointer !important;
}

.pui-cursor-undrop {
  cursor: no-drop !important;
}

.pui-cursor-disabled {
  cursor: not-allowed !important;
}

.pui-cursor-wait {
  cursor: wait !important;
}

.pui-cursor-text {
  cursor: text !important;
}

.pui-cursor-move {
  cursor: move !important;
}

.pui-cursor-help {
  cursor: help !important;
}

.pui-cursor-progress {
  cursor: progress !important;
}

.pui-cursor-auto {
  cursor: auto !important;
}

.pui-cursor-crosshair {
  cursor: crosshair !important;
}

.pui-cursor-e-resize {
  cursor: e-resize !important;
}

.pui-cursor-ne-resize {
  cursor: ne-resize !important;
}

.pui-cursor-nw-resize {
  cursor: nw-resize !important;
}

.pui-cursor-n-resize {
  cursor: n-resize !important;
}

.pui-cursor-se-resize {
  cursor: se-resize !important;
}

.pui-cursor-sw-resize {
  cursor: sw-resize !important;
}

.pui-cursor-s-resize {
  cursor: s-resize !important;
}

.pui-cursor-w-resize {
  cursor: w-resize !important;
}

.pui-link {
  color: #0093F2 !important;
}

.pui-underline,
html.no-touch .pui-hover-underline:hover,
.pui-hover-underline.hover {
  text-decoration: underline !important;
}

.pui-unlink {
  color: #444 !important;
}

html.no-touch .pui-unlink:hover, .pui-unlink.hover {
  color: red !important;
  cursor: not-allowed !important;
  text-decoration: line-through !important;
}

.pui-resize-none {
  resize: none !important;
}

.pui-resize-both {
  resize: both !important;
}

.pui-resize-x {
  resize: horizontal !important;
}

.pui-resize-y {
  resize: vertical !important;
}

.pui-hr-dashed {
  border-bottom: 1px dashed #ddd !important;
}

.pui-margin-none {
  margin: 0 !important;
}

.pui-margin-top-none {
  margin-top: 0 !important;
}

.pui-margin-right-none {
  margin-right: 0 !important;
}

.pui-margin-bottom-none {
  margin-bottom: 0 !important;
}

.pui-margin-left-none {
  margin-left: 0 !important;
}

.pui-padding-none {
  padding: 0 !important;
}

.pui-padding-top-none {
  padding-top: 0 !important;
}

.pui-padding-right-none {
  padding-right: 0 !important;
}

.pui-padding-bottom-none {
  padding-bottom: 0 !important;
}

.pui-padding-left-none {
  padding-left: 0 !important;
}

/* Positions */
.pui-pos-relative, .pui-position-relative {
  position: relative !important;
}

.pui-pos-absolute, .pui-position-absolute {
  position: absolute !important;
}

.pui-pos-fixed, .pui-position-fixed {
  position: fixed !important;
}

.pui-pos-static, .pui-position-static {
  position: static !important;
}

.pui-pos-tl,
.pui-position-tl {
  top: 0 !important;
  left: 0 !important;
  bottom: auto !important;
  right: auto !important;
}

.pui-pos-tr,
.pui-position-tr {
  top: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  left: auto !important;
}

.pui-pos-bl,
.pui-position-bl {
  bottom: 0 !important;
  left: 0 !important;
  top: auto !important;
  right: auto !important;
}

.pui-pos-br,
.pui-position-br {
  bottom: 0 !important;
  right: 0 !important;
  top: auto !important;
  left: auto !important;
}

/* code pre */
code, .pui-code, .pui-command, .pui-command-line {
  color: #fff;
  padding: 2px 4px;
  padding: 0.2rem 0.4rem;
  font-size: 12px;
  font-size: 1.2rem;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background-color: #7CD179;
}

.pui-pre-scrollable {
  height: 240px;
  overflow: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.pui-scrollable-vertical {
  height: 240px;
  overflow: auto;
  overflow-y: scroll;
  resize: vertical;
  -webkit-overflow-scrolling: touch;
}

.pui-scrollable-horizontal {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

/* float & align */
.pui-left {
  float: left !important;
}

.pui-right {
  float: right !important;
}

.pui-float-none {
  float: none !important;
}

.pui-center, .pui-block-center, .pui-center-all > *, .pui-block-center-all > * {
  clear: both !important;
  display: inherit !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.pui-block-center, .pui-block-center-all > * {
  display: block !important;
}

/* display */
.pui-show, .pui-show-all > * {
  display: block !important;
}

.pui-hide, .pui-hide-all > * {
  display: none !important;
  visibility: hidden !important;
}

.pui-visible, .pui-visible-all > * {
  visibility: visible !important;
}

.pui-invisible {
  visibility: hidden !important;
}

.pui-block, .pui-block-all > * {
  display: block !important;
}

.pui-inline, .pui-inline-all > * {
  display: inline !important;
}

.pui-inline-block, .pui-inline-block-all > * {
  display: inline-block !important;
}

.pui-hover-display:hover {
  display: block !important;
}

.pui-hover-display-inline:hover {
  display: inline-block !important;
}

.pui-hover-display-none:hover {
  display: none !important;
}

/* opacity */
.pui-transparent {
  opacity: 0 !important;
  filter: alpha(opacity=0) !important;
}

/* overflow */
.pui-overflow-auto {
  overflow: auto !important;
}

.pui-overflow-inherit {
  overflow: inherit !important;
}

.pui-overflow-hidden {
  overflow: hidden !important;
}

.pui-overflow-scroll {
  overflow: scroll !important;
}

.pui-overflow-visible {
  overflow: visible !important;
}

.pui-overflow-x-auto {
  overflow-x: auto !important;
}

.pui-overflow-x-inherit {
  overflow-x: inherit !important;
}

.pui-overflow-x-hidden {
  overflow-x: hidden !important;
}

.pui-overflow-x-scroll {
  overflow-x: scroll !important;
}

.pui-overflow-x-visible {
  overflow-x: visible !important;
}

.pui-overflow-y-auto {
  overflow-y: auto !important;
}

.pui-overflow-y-inherit {
  overflow-y: inherit !important;
}

.pui-overflow-y-hidden {
  overflow-y: hidden !important;
}

.pui-overflow-y-scroll {
  overflow-y: scroll !important;
}

.pui-overflow-y-visible {
  overflow-y: visible !important;
}

/* box-shadow */
.pui-box-shadow {
  -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.18) !important;
  /* Webkit browsers */
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.18) !important;
  /* IE9+, News */
}

.pui-box-shadow-plus {
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.18) !important;
  /* Webkit browsers */
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.18) !important;
  /* IE9+, News */
}

.pui-box-shadow-large {
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.18) !important;
  /* Webkit browsers */
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.18) !important;
  /* IE9+, News */
}

.pui-box-shadow-none {
  -webkit-box-shadow: none !important;
  /* Webkit browsers */
  box-shadow: none !important;
  /* IE9+, News */
}

.pui-box-shadow-top {
  -webkit-box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.18) !important;
  /* Webkit browsers */
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.18) !important;
  /* IE9+, News */
}

.pui-box-shadow-bottom {
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18) !important;
  /* Webkit browsers */
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18) !important;
  /* IE9+, News */
}

/* box shadow colors */
.pui-box-shadow-gary {
  -webkit-box-shadow: 1px 1px 1px rgba(221, 221, 221, 0.5) !important;
  /* Webkit browsers */
  box-shadow: 1px 1px 1px rgba(221, 221, 221, 0.5) !important;
  /* IE9+, News */
}

.pui-box-shadow-gary-inset {
  -webkit-box-shadow: inset 1px 1px 3px rgba(170, 170, 170, 0.8) !important;
  /* Webkit browsers */
  box-shadow: inset 1px 1px 3px rgba(170, 170, 170, 0.8) !important;
  /* IE9+, News */
}

.pui-box-shadow-primary {
  -webkit-box-shadow: 1px 1px 1px rgba(0, 142, 229, 0.5) !important;
  /* Webkit browsers */
  box-shadow: 1px 1px 1px rgba(0, 142, 229, 0.5) !important;
  /* IE9+, News */
}

.pui-box-shadow-primary-inset {
  -webkit-box-shadow: inset 1px 1px 3px rgba(0, 79, 127, 0.8) !important;
  /* Webkit browsers */
  box-shadow: inset 1px 1px 3px rgba(0, 79, 127, 0.8) !important;
  /* IE9+, News */
}

.pui-box-shadow-secondary {
  -webkit-box-shadow: 1px 1px 1px rgba(59, 180, 242, 0.5) !important;
  /* Webkit browsers */
  box-shadow: 1px 1px 1px rgba(59, 180, 242, 0.5) !important;
  /* IE9+, News */
}

.pui-box-shadow-secondary-inset {
  -webkit-box-shadow: inset 1px 1px 3px rgba(12, 128, 187, 0.8) !important;
  /* Webkit browsers */
  box-shadow: inset 1px 1px 3px rgba(12, 128, 187, 0.8) !important;
  /* IE9+, News */
}

.pui-box-shadow-info {
  -webkit-box-shadow: 1px 1px 1px rgba(46, 170, 198, 0.5) !important;
  /* Webkit browsers */
  box-shadow: 1px 1px 1px rgba(46, 170, 198, 0.5) !important;
  /* IE9+, News */
}

.pui-box-shadow-info-inset {
  -webkit-box-shadow: inset 1px 1px 3px rgba(27, 99, 115, 0.8) !important;
  /* Webkit browsers */
  box-shadow: inset 1px 1px 3px rgba(27, 99, 115, 0.8) !important;
  /* IE9+, News */
}

.pui-box-shadow-success {
  -webkit-box-shadow: 1px 1px 1px rgba(113, 180, 114, 0.5) !important;
  /* Webkit browsers */
  box-shadow: 1px 1px 1px rgba(113, 180, 114, 0.5) !important;
  /* IE9+, News */
}

.pui-box-shadow-success-inset {
  -webkit-box-shadow: inset 1px 1px 3px rgba(66, 125, 67, 0.8) !important;
  /* Webkit browsers */
  box-shadow: inset 1px 1px 3px rgba(66, 125, 67, 0.8) !important;
  /* IE9+, News */
}

.pui-box-shadow-warning {
  -webkit-box-shadow: 1px 1px 1px rgba(255, 183, 77, 0.5) !important;
  /* Webkit browsers */
  box-shadow: 1px 1px 1px rgba(255, 183, 77, 0.5) !important;
  /* IE9+, News */
}

.pui-box-shadow-warning-inset {
  -webkit-box-shadow: inset 1px 1px 3px rgba(230, 137, 0, 0.8) !important;
  /* Webkit browsers */
  box-shadow: inset 1px 1px 3px rgba(230, 137, 0, 0.8) !important;
  /* IE9+, News */
}

.pui-box-shadow-error {
  -webkit-box-shadow: 1px 1px 1px rgba(232, 116, 103, 0.5) !important;
  /* Webkit browsers */
  box-shadow: 1px 1px 1px rgba(232, 116, 103, 0.5) !important;
  /* IE9+, News */
}

.pui-box-shadow-error-inset {
  -webkit-box-shadow: inset 1px 1px 3px rgba(202, 48, 31, 0.8) !important;
  /* Webkit browsers */
  box-shadow: inset 1px 1px 3px rgba(202, 48, 31, 0.8) !important;
  /* IE9+, News */
}

/* blockquote */
.pui-blockquote-right {
  padding-right: 15px;
  padding-right: 1.5rem;
  padding-left: 0;
  text-align: right;
  border-right: 5px solid #eee;
  border-left: 0;
}

/* status */
.pui-gary {
  background-color: #DDDDDD !important;
}

.pui-primary {
  background-color: #008EE5 !important;
}

.pui-secondary {
  background-color: #3BB4F2 !important;
}

.pui-info {
  background-color: #2EAAC6 !important;
}

.pui-success {
  background-color: #71B472 !important;
}

.pui-warning {
  background-color: #FFB74D !important;
}

.pui-error {
  background-color: #E87467 !important;
}

/* background */
.pui-bg-color-none, *.pui-bg-color-none {
  background-color: none !important;
}

.pui-bg-color-white, *.pui-bg-color-white {
  background-color: white !important;
}

.pui-bg-color-red, *.pui-bg-color-red {
  background-color: red !important;
}

.pui-bg-color-green, *.pui-bg-color-green {
  background-color: green !important;
}

.pui-bg-color-orange, *.pui-bg-color-orange {
  background-color: orange !important;
}

.pui-bg-color-gray, *.pui-bg-color-gray {
  background-color: gray !important;
}

.pui-bg-color-black, *.pui-bg-color-black {
  background-color: black !important;
}

.pui-bg-color-yellow, *.pui-bg-color-yellow {
  background-color: yellow !important;
}

.pui-bg-color-purple, *.pui-bg-color-purple {
  background-color: purple !important;
}

.pui-bg-color-brown, *.pui-bg-color-brown {
  background-color: brown !important;
}

.pui-bg-color-beige, *.pui-bg-color-beige {
  background-color: beige !important;
}

.pui-bg-color-khaki, *.pui-bg-color-khaki {
  background-color: khaki !important;
}

.pui-bg-color-navy, *.pui-bg-color-navy {
  background-color: navy !important;
}

.pui-bg-color-pink, *.pui-bg-color-pink {
  background-color: pink !important;
}

.pui-bg-color-plum, *.pui-bg-color-plum {
  background-color: plum !important;
}

.pui-bg-color-teal, *.pui-bg-color-teal {
  background-color: teal !important;
}

.pui-bg-color-aqua, *.pui-bg-color-aqua {
  background-color: aqua !important;
}

.pui-bg-color-silver, *.pui-bg-color-silver {
  background-color: silver !important;
}

.pui-bg-color-fuchsia, *.pui-bg-color-fuchsia {
  background-color: fuchsia !important;
}

.pui-bg-color-maroon, *.pui-bg-color-maroon {
  background-color: maroon !important;
}

.pui-bg-color-olive, *.pui-bg-color-olive {
  background-color: olive !important;
}

.pui-bg-color-lime, *.pui-bg-color-lime {
  background-color: lime !important;
}

.pui-bg-none {
  background: none !important;
}

.pui-bg-transparent {
  background: transparent !important;
}

.pui-bg-scroll {
  background-attachment: scroll !important;
}

.pui-bg-fixed {
  background-attachment: fixed !important;
}

.pui-bg-pos-center {
  background-position: center center !important;
}

.pui-bg-pos-cl {
  background-position: center left !important;
}

.pui-bg-pos-cr {
  background-position: center right !important;
}

.pui-bg-pos-tl {
  background-position: top left !important;
}

.pui-bg-pos-tr {
  background-position: top right !important;
}

.pui-bg-pos-tc {
  background-position: top center !important;
}

.pui-bg-pos-bl {
  background-position: bottom left !important;
}

.pui-bg-pos-br {
  background-position: bottom right !important;
}

.pui-bg-pos-bc {
  background-position: bottom center !important;
}

.pui-bg-repeat {
  background-repeat: repeat !important;
}

.pui-bg-repeat-x {
  background-repeat: repeat-x !important;
}

.pui-bg-repeat-y {
  background-repeat: repeat-y !important;
}

.pui-bg-no-repeat {
  background-repeat: no-repeat !important;
}

.pui-bg-cover {
  background-size: cover !important;
}

.pui-blur, .pui-bg-blur, .pui-blur-all > * {
  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=12, MakeShadow=false);
  /* IE6~IE9 */
  -webkit-filter: blur(12px);
  /* Chrome, Opera, iOS, Safari */
  -moz-filter: blur(12px);
  /* Firefox(Old) */
  -ms-filter: blur(12px);
  filter: blur(12px);
}

/* REM width */
.pui-width-1rem {
  width: 1rem;
}

.pui-width-2rem {
  width: 2rem;
}

.pui-width-3rem {
  width: 3rem;
}

.pui-width-4rem {
  width: 4rem;
}

.pui-width-5rem {
  width: 5rem;
}

.pui-width-6rem {
  width: 6rem;
}

.pui-width-7rem {
  width: 7rem;
}

.pui-width-8rem {
  width: 8rem;
}

.pui-width-9rem {
  width: 9rem;
}

.pui-width-10rem {
  width: 10rem;
}

.pui-width-11rem {
  width: 11rem;
}

.pui-width-12rem {
  width: 12rem;
}

.pui-width-13rem {
  width: 13rem;
}

.pui-width-14rem {
  width: 14rem;
}

.pui-width-15rem {
  width: 15rem;
}

.pui-width-16rem {
  width: 16rem;
}

.pui-width-17rem {
  width: 17rem;
}

.pui-width-18rem {
  width: 18rem;
}

.pui-width-19rem {
  width: 19rem;
}

.pui-width-20rem {
  width: 20rem;
}

.pui-width-21rem {
  width: 21rem;
}

.pui-width-22rem {
  width: 22rem;
}

.pui-width-23rem {
  width: 23rem;
}

.pui-width-24rem {
  width: 24rem;
}

.pui-width-25rem {
  width: 25rem;
}

.pui-width-26rem {
  width: 26rem;
}

.pui-width-27rem {
  width: 27rem;
}

.pui-width-28rem {
  width: 28rem;
}

.pui-width-29rem {
  width: 29rem;
}

.pui-width-30rem {
  width: 30rem;
}

.pui-width-31rem {
  width: 31rem;
}

.pui-width-32rem {
  width: 32rem;
}

.pui-width-33rem {
  width: 33rem;
}

.pui-width-34rem {
  width: 34rem;
}

.pui-width-35rem {
  width: 35rem;
}

.pui-width-36rem {
  width: 36rem;
}

.pui-width-37rem {
  width: 37rem;
}

.pui-width-38rem {
  width: 38rem;
}

.pui-width-39rem {
  width: 39rem;
}

.pui-width-40rem {
  width: 40rem;
}

.pui-width-41rem {
  width: 41rem;
}

.pui-width-42rem {
  width: 42rem;
}

.pui-width-43rem {
  width: 43rem;
}

.pui-width-44rem {
  width: 44rem;
}

.pui-width-45rem {
  width: 45rem;
}

.pui-width-46rem {
  width: 46rem;
}

.pui-width-47rem {
  width: 47rem;
}

.pui-width-48rem {
  width: 48rem;
}

.pui-width-49rem {
  width: 49rem;
}

.pui-width-50rem {
  width: 50rem;
}

.pui-width-51rem {
  width: 51rem;
}

.pui-width-52rem {
  width: 52rem;
}

.pui-width-53rem {
  width: 53rem;
}

.pui-width-54rem {
  width: 54rem;
}

.pui-width-55rem {
  width: 55rem;
}

.pui-width-56rem {
  width: 56rem;
}

.pui-width-57rem {
  width: 57rem;
}

.pui-width-58rem {
  width: 58rem;
}

.pui-width-59rem {
  width: 59rem;
}

.pui-width-60rem {
  width: 60rem;
}

.pui-width-61rem {
  width: 61rem;
}

.pui-width-62rem {
  width: 62rem;
}

.pui-width-63rem {
  width: 63rem;
}

.pui-width-64rem {
  width: 64rem;
}

/* REM height */
.pui-height-1rem {
  height: 1rem;
}

.pui-height-2rem {
  height: 2rem;
}

.pui-height-3rem {
  height: 3rem;
}

.pui-height-4rem {
  height: 4rem;
}

.pui-height-5rem {
  height: 5rem;
}

.pui-height-6rem {
  height: 6rem;
}

.pui-height-7rem {
  height: 7rem;
}

.pui-height-8rem {
  height: 8rem;
}

.pui-height-9rem {
  height: 9rem;
}

.pui-height-10rem {
  height: 10rem;
}

.pui-height-11rem {
  height: 11rem;
}

.pui-height-12rem {
  height: 12rem;
}

.pui-height-13rem {
  height: 13rem;
}

.pui-height-14rem {
  height: 14rem;
}

.pui-height-15rem {
  height: 15rem;
}

.pui-height-16rem {
  height: 16rem;
}

.pui-height-17rem {
  height: 17rem;
}

.pui-height-18rem {
  height: 18rem;
}

.pui-height-19rem {
  height: 19rem;
}

.pui-height-20rem {
  height: 20rem;
}

.pui-height-21rem {
  height: 21rem;
}

.pui-height-22rem {
  height: 22rem;
}

.pui-height-23rem {
  height: 23rem;
}

.pui-height-24rem {
  height: 24rem;
}

.pui-height-25rem {
  height: 25rem;
}

.pui-height-26rem {
  height: 26rem;
}

.pui-height-27rem {
  height: 27rem;
}

.pui-height-28rem {
  height: 28rem;
}

.pui-height-29rem {
  height: 29rem;
}

.pui-height-30rem {
  height: 30rem;
}

.pui-height-31rem {
  height: 31rem;
}

.pui-height-32rem {
  height: 32rem;
}

.pui-height-33rem {
  height: 33rem;
}

.pui-height-34rem {
  height: 34rem;
}

.pui-height-35rem {
  height: 35rem;
}

.pui-height-36rem {
  height: 36rem;
}

.pui-height-37rem {
  height: 37rem;
}

.pui-height-38rem {
  height: 38rem;
}

.pui-height-39rem {
  height: 39rem;
}

.pui-height-40rem {
  height: 40rem;
}

.pui-height-41rem {
  height: 41rem;
}

.pui-height-42rem {
  height: 42rem;
}

.pui-height-43rem {
  height: 43rem;
}

.pui-height-44rem {
  height: 44rem;
}

.pui-height-45rem {
  height: 45rem;
}

.pui-height-46rem {
  height: 46rem;
}

.pui-height-47rem {
  height: 47rem;
}

.pui-height-48rem {
  height: 48rem;
}

.pui-height-49rem {
  height: 49rem;
}

.pui-height-50rem {
  height: 50rem;
}

.pui-height-51rem {
  height: 51rem;
}

.pui-height-52rem {
  height: 52rem;
}

.pui-height-53rem {
  height: 53rem;
}

.pui-height-54rem {
  height: 54rem;
}

.pui-height-55rem {
  height: 55rem;
}

.pui-height-56rem {
  height: 56rem;
}

.pui-height-57rem {
  height: 57rem;
}

.pui-height-58rem {
  height: 58rem;
}

.pui-height-59rem {
  height: 59rem;
}

.pui-height-60rem {
  height: 60rem;
}

.pui-height-61rem {
  height: 61rem;
}

.pui-height-62rem {
  height: 62rem;
}

.pui-height-63rem {
  height: 63rem;
}

.pui-height-64rem {
  height: 64rem;
}

/* Material Design Z-Depth */
.pui-z-depth-1 {
  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2) !important;
  /* Webkit browsers */
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2) !important;
  /* IE9+, News */
}

.pui-z-depth-2 {
  -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.24) !important;
  /* Webkit browsers */
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.24) !important;
  /* IE9+, News */
}

.pui-z-depth-3 {
  -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.24) !important;
  /* Webkit browsers */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.24) !important;
  /* IE9+, News */
}

.pui-z-depth-4 {
  -webkit-box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24) !important;
  /* Webkit browsers */
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.24) !important;
  /* IE9+, News */
}

.pui-z-depth-5 {
  -webkit-box-shadow: 0 12px 32px rgba(0, 0, 0, 0.24) !important;
  /* Webkit browsers */
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.24) !important;
  /* IE9+, News */
}

.pui-z-depth-6 {
  -webkit-box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28) !important;
  /* Webkit browsers */
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28) !important;
  /* IE9+, News */
}

/* Material Design colors */
.pui-bg-red-50 {
  color: #fff !important;
  border-color: #FFEBEE !important;
  background-color: #FFEBEE !important;
}

.pui-text-red-50 {
  color: #FFEBEE !important;
}

.pui-border-red-50 {
  border-color: #FFEBEE !important;
}

.pui-bg-red-100 {
  color: #fff !important;
  border-color: #FFCDD2 !important;
  background-color: #FFCDD2 !important;
}

.pui-text-red-100 {
  color: #FFCDD2 !important;
}

.pui-border-red-100 {
  border-color: #FFCDD2 !important;
}

.pui-bg-red-200 {
  color: #fff !important;
  border-color: #EF9A9A !important;
  background-color: #EF9A9A !important;
}

.pui-text-red-200 {
  color: #EF9A9A !important;
}

.pui-border-red-200 {
  border-color: #EF9A9A !important;
}

.pui-bg-red-300 {
  color: #fff !important;
  border-color: #E57373 !important;
  background-color: #E57373 !important;
}

.pui-text-red-300 {
  color: #E57373 !important;
}

.pui-border-red-300 {
  border-color: #E57373 !important;
}

.pui-bg-red-400 {
  color: #fff !important;
  border-color: #EF5350 !important;
  background-color: #EF5350 !important;
}

.pui-text-red-400 {
  color: #EF5350 !important;
}

.pui-border-red-400 {
  border-color: #EF5350 !important;
}

.pui-bg-red, .pui-bg-red-500 {
  color: #fff !important;
  border-color: #F44336 !important;
  background-color: #F44336 !important;
}

.pui-text-red, .pui-text-red-500 {
  color: #F44336 !important;
}

.pui-border-red, .pui-border-red-500 {
  border-color: #F44336 !important;
}

.pui-bg-red-600 {
  color: #fff !important;
  border-color: #E53935 !important;
  background-color: #E53935 !important;
}

.pui-text-red-600 {
  color: #E53935 !important;
}

.pui-border-red-600 {
  border-color: #E53935 !important;
}

.pui-bg-red-700 {
  color: #fff !important;
  border-color: #D32F2F !important;
  background-color: #D32F2F !important;
}

.pui-text-red-700 {
  color: #D32F2F !important;
}

.pui-border-red-700 {
  border-color: #D32F2F !important;
}

.pui-bg-red-800 {
  color: #fff !important;
  border-color: #C62828 !important;
  background-color: #C62828 !important;
}

.pui-text-red-800 {
  color: #C62828 !important;
}

.pui-border-red-800 {
  border-color: #C62828 !important;
}

.pui-bg-red-900 {
  color: #fff !important;
  border-color: #B71C1C !important;
  background-color: #B71C1C !important;
}

.pui-text-red-900 {
  color: #B71C1C !important;
}

.pui-border-red-900 {
  border-color: #B71C1C !important;
}

.pui-bg-red-A100 {
  color: #fff !important;
  border-color: #FF8A80 !important;
  background-color: #FF8A80 !important;
}

.pui-text-red-A100 {
  color: #FF8A80 !important;
}

.pui-border-red-A100 {
  border-color: #FF8A80 !important;
}

.pui-bg-red-A200 {
  color: #fff !important;
  border-color: #FF5252 !important;
  background-color: #FF5252 !important;
}

.pui-text-red-A200 {
  color: #FF5252 !important;
}

.pui-border-red-A200 {
  border-color: #FF5252 !important;
}

.pui-bg-red-A400 {
  color: #fff !important;
  border-color: #FF1744 !important;
  background-color: #FF1744 !important;
}

.pui-text-red-A400 {
  color: #FF1744 !important;
}

.pui-border-red-A400 {
  border-color: #FF1744 !important;
}

.pui-bg-red-A700 {
  color: #fff !important;
  border-color: #D50000 !important;
  background-color: #D50000 !important;
}

.pui-text-red-A700 {
  color: #D50000 !important;
}

.pui-border-red-A700 {
  border-color: #D50000 !important;
}

.pui-bg-pink-50 {
  color: #fff !important;
  border-color: #FCE4EC !important;
  background-color: #FCE4EC !important;
}

.pui-text-pink-50 {
  color: #FCE4EC !important;
}

.pui-border-pink-50 {
  border-color: #FCE4EC !important;
}

.pui-bg-pink-100 {
  color: #fff !important;
  border-color: #F8BBD0 !important;
  background-color: #F8BBD0 !important;
}

.pui-text-pink-100 {
  color: #F8BBD0 !important;
}

.pui-border-pink-100 {
  border-color: #F8BBD0 !important;
}

.pui-bg-pink-200 {
  color: #fff !important;
  border-color: #F48FB1 !important;
  background-color: #F48FB1 !important;
}

.pui-text-pink-200 {
  color: #F48FB1 !important;
}

.pui-border-pink-200 {
  border-color: #F48FB1 !important;
}

.pui-bg-pink-300 {
  color: #fff !important;
  border-color: #F06292 !important;
  background-color: #F06292 !important;
}

.pui-text-pink-300 {
  color: #F06292 !important;
}

.pui-border-pink-300 {
  border-color: #F06292 !important;
}

.pui-bg-pink-400 {
  color: #fff !important;
  border-color: #EC407A !important;
  background-color: #EC407A !important;
}

.pui-text-pink-400 {
  color: #EC407A !important;
}

.pui-border-pink-400 {
  border-color: #EC407A !important;
}

.pui-bg-pink, .pui-bg-pink-500 {
  color: #fff !important;
  border-color: #E91E63 !important;
  background-color: #E91E63 !important;
}

.pui-text-pink, .pui-text-pink-500 {
  color: #E91E63 !important;
}

.pui-border-pink, .pui-border-pink-500 {
  border-color: #E91E63 !important;
}

.pui-bg-pink-600 {
  color: #fff !important;
  border-color: #D81B60 !important;
  background-color: #D81B60 !important;
}

.pui-text-pink-600 {
  color: #D81B60 !important;
}

.pui-border-pink-600 {
  border-color: #D81B60 !important;
}

.pui-bg-pink-700 {
  color: #fff !important;
  border-color: #C2185B !important;
  background-color: #C2185B !important;
}

.pui-text-pink-700 {
  color: #C2185B !important;
}

.pui-border-pink-700 {
  border-color: #C2185B !important;
}

.pui-bg-pink-800 {
  color: #fff !important;
  border-color: #AD1457 !important;
  background-color: #AD1457 !important;
}

.pui-text-pink-800 {
  color: #AD1457 !important;
}

.pui-border-pink-800 {
  border-color: #AD1457 !important;
}

.pui-bg-pink-900 {
  color: #fff !important;
  border-color: #880E4F !important;
  background-color: #880E4F !important;
}

.pui-text-pink-900 {
  color: #880E4F !important;
}

.pui-border-pink-900 {
  border-color: #880E4F !important;
}

.pui-bg-pink-A100 {
  color: #fff !important;
  border-color: #FF80AB !important;
  background-color: #FF80AB !important;
}

.pui-text-pink-A100 {
  color: #FF80AB !important;
}

.pui-border-pink-A100 {
  border-color: #FF80AB !important;
}

.pui-bg-pink-A200 {
  color: #fff !important;
  border-color: #FF4081 !important;
  background-color: #FF4081 !important;
}

.pui-text-pink-A200 {
  color: #FF4081 !important;
}

.pui-border-pink-A200 {
  border-color: #FF4081 !important;
}

.pui-bg-pink-A400 {
  color: #fff !important;
  border-color: #F50057 !important;
  background-color: #F50057 !important;
}

.pui-text-pink-A400 {
  color: #F50057 !important;
}

.pui-border-pink-A400 {
  border-color: #F50057 !important;
}

.pui-bg-pink-A700 {
  color: #fff !important;
  border-color: #C51162 !important;
  background-color: #C51162 !important;
}

.pui-text-pink-A700 {
  color: #C51162 !important;
}

.pui-border-pink-A700 {
  border-color: #C51162 !important;
}

.pui-bg-purple-50 {
  color: #fff !important;
  border-color: #F3E5F5 !important;
  background-color: #F3E5F5 !important;
}

.pui-text-purple-50 {
  color: #F3E5F5 !important;
}

.pui-border-purple-50 {
  border-color: #F3E5F5 !important;
}

.pui-bg-purple-100 {
  color: #fff !important;
  border-color: #E1BEE7 !important;
  background-color: #E1BEE7 !important;
}

.pui-text-purple-100 {
  color: #E1BEE7 !important;
}

.pui-border-purple-100 {
  border-color: #E1BEE7 !important;
}

.pui-bg-purple-200 {
  color: #fff !important;
  border-color: #CE93D8 !important;
  background-color: #CE93D8 !important;
}

.pui-text-purple-200 {
  color: #CE93D8 !important;
}

.pui-border-purple-200 {
  border-color: #CE93D8 !important;
}

.pui-bg-purple-300 {
  color: #fff !important;
  border-color: #BA68C8 !important;
  background-color: #BA68C8 !important;
}

.pui-text-purple-300 {
  color: #BA68C8 !important;
}

.pui-border-purple-300 {
  border-color: #BA68C8 !important;
}

.pui-bg-purple-400 {
  color: #fff !important;
  border-color: #AB47BC !important;
  background-color: #AB47BC !important;
}

.pui-text-purple-400 {
  color: #AB47BC !important;
}

.pui-border-purple-400 {
  border-color: #AB47BC !important;
}

.pui-bg-purple, .pui-bg-purple-500 {
  color: #fff !important;
  border-color: #9C27B0 !important;
  background-color: #9C27B0 !important;
}

.pui-text-purple, .pui-text-purple-500 {
  color: #9C27B0 !important;
}

.pui-border-purple, .pui-border-purple-500 {
  border-color: #9C27B0 !important;
}

.pui-bg-purple-600 {
  color: #fff !important;
  border-color: #8E24AA !important;
  background-color: #8E24AA !important;
}

.pui-text-purple-600 {
  color: #8E24AA !important;
}

.pui-border-purple-600 {
  border-color: #8E24AA !important;
}

.pui-bg-purple-700 {
  color: #fff !important;
  border-color: #7B1FA2 !important;
  background-color: #7B1FA2 !important;
}

.pui-text-purple-700 {
  color: #7B1FA2 !important;
}

.pui-border-purple-700 {
  border-color: #7B1FA2 !important;
}

.pui-bg-purple-800 {
  color: #fff !important;
  border-color: #6A1B9A !important;
  background-color: #6A1B9A !important;
}

.pui-text-purple-800 {
  color: #6A1B9A !important;
}

.pui-border-purple-800 {
  border-color: #6A1B9A !important;
}

.pui-bg-purple-900 {
  color: #fff !important;
  border-color: #4A148C !important;
  background-color: #4A148C !important;
}

.pui-text-purple-900 {
  color: #4A148C !important;
}

.pui-border-purple-900 {
  border-color: #4A148C !important;
}

.pui-bg-purple-A100 {
  color: #fff !important;
  border-color: #EA80FC !important;
  background-color: #EA80FC !important;
}

.pui-text-purple-A100 {
  color: #EA80FC !important;
}

.pui-border-purple-A100 {
  border-color: #EA80FC !important;
}

.pui-bg-purple-A200 {
  color: #fff !important;
  border-color: #E040FB !important;
  background-color: #E040FB !important;
}

.pui-text-purple-A200 {
  color: #E040FB !important;
}

.pui-border-purple-A200 {
  border-color: #E040FB !important;
}

.pui-bg-purple-A400 {
  color: #fff !important;
  border-color: #D500F9 !important;
  background-color: #D500F9 !important;
}

.pui-text-purple-A400 {
  color: #D500F9 !important;
}

.pui-border-purple-A400 {
  border-color: #D500F9 !important;
}

.pui-bg-purple-A700 {
  color: #fff !important;
  border-color: #AA00FF !important;
  background-color: #AA00FF !important;
}

.pui-text-purple-A700 {
  color: #AA00FF !important;
}

.pui-border-purple-A700 {
  border-color: #AA00FF !important;
}

.pui-bg-deep-purple-50 {
  color: #fff !important;
  border-color: #EDE7F6 !important;
  background-color: #EDE7F6 !important;
}

.pui-text-deep-purple-50 {
  color: #EDE7F6 !important;
}

.pui-border-deep-purple-50 {
  border-color: #EDE7F6 !important;
}

.pui-bg-deep-purple-100 {
  color: #fff !important;
  border-color: #D1C4E9 !important;
  background-color: #D1C4E9 !important;
}

.pui-text-deep-purple-100 {
  color: #D1C4E9 !important;
}

.pui-border-deep-purple-100 {
  border-color: #D1C4E9 !important;
}

.pui-bg-deep-purple-200 {
  color: #fff !important;
  border-color: #B39DDB !important;
  background-color: #B39DDB !important;
}

.pui-text-deep-purple-200 {
  color: #B39DDB !important;
}

.pui-border-deep-purple-200 {
  border-color: #B39DDB !important;
}

.pui-bg-deep-purple-300 {
  color: #fff !important;
  border-color: #9575CD !important;
  background-color: #9575CD !important;
}

.pui-text-deep-purple-300 {
  color: #9575CD !important;
}

.pui-border-deep-purple-300 {
  border-color: #9575CD !important;
}

.pui-bg-deep-purple-400 {
  color: #fff !important;
  border-color: #7E57C2 !important;
  background-color: #7E57C2 !important;
}

.pui-text-deep-purple-400 {
  color: #7E57C2 !important;
}

.pui-border-deep-purple-400 {
  border-color: #7E57C2 !important;
}

.pui-bg-deep-purple, .pui-bg-deep-purple-500 {
  color: #fff !important;
  border-color: #673AB7 !important;
  background-color: #673AB7 !important;
}

.pui-text-deep-purple, .pui-text-deep-purple-500 {
  color: #673AB7 !important;
}

.pui-border-deep-purple, .pui-border-deep-purple-500 {
  border-color: #673AB7 !important;
}

.pui-bg-deep-purple-600 {
  color: #fff !important;
  border-color: #5E35B1 !important;
  background-color: #5E35B1 !important;
}

.pui-text-deep-purple-600 {
  color: #5E35B1 !important;
}

.pui-border-deep-purple-600 {
  border-color: #5E35B1 !important;
}

.pui-bg-deep-purple-700 {
  color: #fff !important;
  border-color: #512DA8 !important;
  background-color: #512DA8 !important;
}

.pui-text-deep-purple-700 {
  color: #512DA8 !important;
}

.pui-border-deep-purple-700 {
  border-color: #512DA8 !important;
}

.pui-bg-deep-purple-800 {
  color: #fff !important;
  border-color: #4527A0 !important;
  background-color: #4527A0 !important;
}

.pui-text-deep-purple-800 {
  color: #4527A0 !important;
}

.pui-border-deep-purple-800 {
  border-color: #4527A0 !important;
}

.pui-bg-deep-purple-900 {
  color: #fff !important;
  border-color: #311B92 !important;
  background-color: #311B92 !important;
}

.pui-text-deep-purple-900 {
  color: #311B92 !important;
}

.pui-border-deep-purple-900 {
  border-color: #311B92 !important;
}

.pui-bg-deep-purple-A100 {
  color: #fff !important;
  border-color: #B388FF !important;
  background-color: #B388FF !important;
}

.pui-text-deep-purple-A100 {
  color: #B388FF !important;
}

.pui-border-deep-purple-A100 {
  border-color: #B388FF !important;
}

.pui-bg-deep-purple-A200 {
  color: #fff !important;
  border-color: #7C4DFF !important;
  background-color: #7C4DFF !important;
}

.pui-text-deep-purple-A200 {
  color: #7C4DFF !important;
}

.pui-border-deep-purple-A200 {
  border-color: #7C4DFF !important;
}

.pui-bg-deep-purple-A400 {
  color: #fff !important;
  border-color: #651FFF !important;
  background-color: #651FFF !important;
}

.pui-text-deep-purple-A400 {
  color: #651FFF !important;
}

.pui-border-deep-purple-A400 {
  border-color: #651FFF !important;
}

.pui-bg-deep-purple-A700 {
  color: #fff !important;
  border-color: #6200EA !important;
  background-color: #6200EA !important;
}

.pui-text-deep-purple-A700 {
  color: #6200EA !important;
}

.pui-border-deep-purple-A700 {
  border-color: #6200EA !important;
}

.pui-bg-indigo-50 {
  color: #fff !important;
  border-color: #E8EAF6 !important;
  background-color: #E8EAF6 !important;
}

.pui-text-indigo-50 {
  color: #E8EAF6 !important;
}

.pui-border-indigo-50 {
  border-color: #E8EAF6 !important;
}

.pui-bg-indigo-100 {
  color: #fff !important;
  border-color: #C5CAE9 !important;
  background-color: #C5CAE9 !important;
}

.pui-text-indigo-100 {
  color: #C5CAE9 !important;
}

.pui-border-indigo-100 {
  border-color: #C5CAE9 !important;
}

.pui-bg-indigo-200 {
  color: #fff !important;
  border-color: #9FA8DA !important;
  background-color: #9FA8DA !important;
}

.pui-text-indigo-200 {
  color: #9FA8DA !important;
}

.pui-border-indigo-200 {
  border-color: #9FA8DA !important;
}

.pui-bg-indigo-300 {
  color: #fff !important;
  border-color: #7986CB !important;
  background-color: #7986CB !important;
}

.pui-text-indigo-300 {
  color: #7986CB !important;
}

.pui-border-indigo-300 {
  border-color: #7986CB !important;
}

.pui-bg-indigo-400 {
  color: #fff !important;
  border-color: #5C6BC0 !important;
  background-color: #5C6BC0 !important;
}

.pui-text-indigo-400 {
  color: #5C6BC0 !important;
}

.pui-border-indigo-400 {
  border-color: #5C6BC0 !important;
}

.pui-bg-indigo, .pui-bg-indigo-500 {
  color: #fff !important;
  border-color: #3F51B5 !important;
  background-color: #3F51B5 !important;
}

.pui-text-indigo, .pui-text-indigo-500 {
  color: #3F51B5 !important;
}

.pui-border-indigo, .pui-border-indigo-500 {
  border-color: #3F51B5 !important;
}

.pui-bg-indigo-600 {
  color: #fff !important;
  border-color: #3949AB !important;
  background-color: #3949AB !important;
}

.pui-text-indigo-600 {
  color: #3949AB !important;
}

.pui-border-indigo-600 {
  border-color: #3949AB !important;
}

.pui-bg-indigo-700 {
  color: #fff !important;
  border-color: #303F9F !important;
  background-color: #303F9F !important;
}

.pui-text-indigo-700 {
  color: #303F9F !important;
}

.pui-border-indigo-700 {
  border-color: #303F9F !important;
}

.pui-bg-indigo-800 {
  color: #fff !important;
  border-color: #283593 !important;
  background-color: #283593 !important;
}

.pui-text-indigo-800 {
  color: #283593 !important;
}

.pui-border-indigo-800 {
  border-color: #283593 !important;
}

.pui-bg-indigo-900 {
  color: #fff !important;
  border-color: #1A237E !important;
  background-color: #1A237E !important;
}

.pui-text-indigo-900 {
  color: #1A237E !important;
}

.pui-border-indigo-900 {
  border-color: #1A237E !important;
}

.pui-bg-indigo-A100 {
  color: #fff !important;
  border-color: #8C9EFF !important;
  background-color: #8C9EFF !important;
}

.pui-text-indigo-A100 {
  color: #8C9EFF !important;
}

.pui-border-indigo-A100 {
  border-color: #8C9EFF !important;
}

.pui-bg-indigo-A200 {
  color: #fff !important;
  border-color: #536DFE !important;
  background-color: #536DFE !important;
}

.pui-text-indigo-A200 {
  color: #536DFE !important;
}

.pui-border-indigo-A200 {
  border-color: #536DFE !important;
}

.pui-bg-indigo-A400 {
  color: #fff !important;
  border-color: #3D5AFE !important;
  background-color: #3D5AFE !important;
}

.pui-text-indigo-A400 {
  color: #3D5AFE !important;
}

.pui-border-indigo-A400 {
  border-color: #3D5AFE !important;
}

.pui-bg-indigo-A700 {
  color: #fff !important;
  border-color: #304FFE !important;
  background-color: #304FFE !important;
}

.pui-text-indigo-A700 {
  color: #304FFE !important;
}

.pui-border-indigo-A700 {
  border-color: #304FFE !important;
}

.pui-bg-blue-50 {
  color: #fff !important;
  border-color: #E3F2FD !important;
  background-color: #E3F2FD !important;
}

.pui-text-blue-50 {
  color: #E3F2FD !important;
}

.pui-border-blue-50 {
  border-color: #E3F2FD !important;
}

.pui-bg-blue-100 {
  color: #fff !important;
  border-color: #BBDEFB !important;
  background-color: #BBDEFB !important;
}

.pui-text-blue-100 {
  color: #BBDEFB !important;
}

.pui-border-blue-100 {
  border-color: #BBDEFB !important;
}

.pui-bg-blue-200 {
  color: #fff !important;
  border-color: #90CAF9 !important;
  background-color: #90CAF9 !important;
}

.pui-text-blue-200 {
  color: #90CAF9 !important;
}

.pui-border-blue-200 {
  border-color: #90CAF9 !important;
}

.pui-bg-blue-300 {
  color: #fff !important;
  border-color: #C54B3B !important;
  background-color: #C54B3B !important;
}

.pui-text-blue-300 {
  color: #64B5F6 !important;
}

.pui-border-blue-300 {
  border-color: #64B5F6 !important;
}

.pui-bg-blue-400 {
  color: #fff !important;
  border-color: #42A5F5 !important;
  background-color: #42A5F5 !important;
}

.pui-text-blue-400 {
  color: #42A5F5 !important;
}

.pui-border-blue-400 {
  border-color: #42A5F5 !important;
}

.pui-bg-blue, .pui-bg-blue-500 {
  color: #fff !important;
  border-color: #2196F3 !important;
  background-color: #2196F3 !important;
}

.pui-text-blue, .pui-text-blue-500 {
  color: #2196F3 !important;
}

.pui-border-blue, .pui-border-blue-500 {
  border-color: #2196F3 !important;
}

.pui-bg-blue-600 {
  color: #fff !important;
  border-color: #1E88E5 !important;
  background-color: #1E88E5 !important;
}

.pui-text-blue-600 {
  color: #1E88E5 !important;
}

.pui-border-blue-600 {
  border-color: #1E88E5 !important;
}

.pui-bg-blue-700 {
  color: #fff !important;
  border-color: #1976D2 !important;
  background-color: #1976D2 !important;
}

.pui-text-blue-700 {
  color: #1976D2 !important;
}

.pui-border-blue-700 {
  border-color: #1976D2 !important;
}

.pui-bg-blue-800 {
  color: #fff !important;
  border-color: #1565C0 !important;
  background-color: #1565C0 !important;
}

.pui-text-blue-800 {
  color: #1565C0 !important;
}

.pui-border-blue-800 {
  border-color: #1565C0 !important;
}

.pui-bg-blue-900 {
  color: #fff !important;
  border-color: #0D47A1 !important;
  background-color: #0D47A1 !important;
}

.pui-text-blue-900 {
  color: #0D47A1 !important;
}

.pui-border-blue-900 {
  border-color: #0D47A1 !important;
}

.pui-bg-blue-A100 {
  color: #fff !important;
  border-color: #82B1FF !important;
  background-color: #82B1FF !important;
}

.pui-text-blue-A100 {
  color: #82B1FF !important;
}

.pui-border-blue-A100 {
  border-color: #82B1FF !important;
}

.pui-bg-blue-A200 {
  color: #fff !important;
  border-color: #448AFF !important;
  background-color: #448AFF !important;
}

.pui-text-blue-A200 {
  color: #448AFF !important;
}

.pui-border-blue-A200 {
  border-color: #448AFF !important;
}

.pui-bg-blue-A400 {
  color: #fff !important;
  border-color: #2979FF !important;
  background-color: #2979FF !important;
}

.pui-text-blue-A400 {
  color: #2979FF !important;
}

.pui-border-blue-A400 {
  border-color: #2979FF !important;
}

.pui-bg-blue-A700 {
  color: #fff !important;
  border-color: #2962FF !important;
  background-color: #2962FF !important;
}

.pui-text-blue-A700 {
  color: #2962FF !important;
}

.pui-border-blue-A700 {
  border-color: #2962FF !important;
}

.pui-bg-light-blue-50 {
  color: #fff !important;
  border-color: #E1F5FE !important;
  background-color: #E1F5FE !important;
}

.pui-text-light-blue-50 {
  color: #E1F5FE !important;
}

.pui-border-light-blue-50 {
  border-color: #E1F5FE !important;
}

.pui-bg-light-blue-100 {
  color: #fff !important;
  border-color: #B3E5FC !important;
  background-color: #B3E5FC !important;
}

.pui-text-light-blue-100 {
  color: #B3E5FC !important;
}

.pui-border-light-blue-100 {
  border-color: #B3E5FC !important;
}

.pui-bg-light-blue-200 {
  color: #fff !important;
  border-color: #81D4FA !important;
  background-color: #81D4FA !important;
}

.pui-text-light-blue-200 {
  color: #81D4FA !important;
}

.pui-border-light-blue-200 {
  border-color: #81D4FA !important;
}

.pui-bg-light-blue-300 {
  color: #fff !important;
  border-color: #4FC3F7 !important;
  background-color: #4FC3F7 !important;
}

.pui-text-light-blue-300 {
  color: #4FC3F7 !important;
}

.pui-border-light-blue-300 {
  border-color: #4FC3F7 !important;
}

.pui-bg-light-blue-400 {
  color: #fff !important;
  border-color: #29B6F6 !important;
  background-color: #29B6F6 !important;
}

.pui-text-light-blue-400 {
  color: #29B6F6 !important;
}

.pui-border-light-blue-400 {
  border-color: #29B6F6 !important;
}

.pui-bg-light-blue, .pui-bg-light-blue-500 {
  color: #fff !important;
  border-color: #03A9F4 !important;
  background-color: #03A9F4 !important;
}

.pui-text-light-blue, .pui-text-light-blue-500 {
  color: #03A9F4 !important;
}

.pui-border-light-blue, .pui-border-light-blue-500 {
  border-color: #03A9F4 !important;
}

.pui-bg-light-blue-600 {
  color: #fff !important;
  border-color: #039BE5 !important;
  background-color: #039BE5 !important;
}

.pui-text-light-blue-600 {
  color: #039BE5 !important;
}

.pui-border-light-blue-600 {
  border-color: #039BE5 !important;
}

.pui-bg-light-blue-700 {
  color: #fff !important;
  border-color: #0288D1 !important;
  background-color: #0288D1 !important;
}

.pui-text-light-blue-700 {
  color: #0288D1 !important;
}

.pui-border-light-blue-700 {
  border-color: #0288D1 !important;
}

.pui-bg-light-blue-800 {
  color: #fff !important;
  border-color: #0277BD !important;
  background-color: #0277BD !important;
}

.pui-text-light-blue-800 {
  color: #0277BD !important;
}

.pui-border-light-blue-800 {
  border-color: #0277BD !important;
}

.pui-bg-light-blue-900 {
  color: #fff !important;
  border-color: #01579B !important;
  background-color: #01579B !important;
}

.pui-text-light-blue-900 {
  color: #01579B !important;
}

.pui-border-light-blue-900 {
  border-color: #01579B !important;
}

.pui-bg-light-blue-A100 {
  color: #fff !important;
  border-color: #80D8FF !important;
  background-color: #80D8FF !important;
}

.pui-text-light-blue-A100 {
  color: #80D8FF !important;
}

.pui-border-light-blue-A100 {
  border-color: #80D8FF !important;
}

.pui-bg-light-blue-A200 {
  color: #fff !important;
  border-color: #40C4FF !important;
  background-color: #40C4FF !important;
}

.pui-text-light-blue-A200 {
  color: #40C4FF !important;
}

.pui-border-light-blue-A200 {
  border-color: #40C4FF !important;
}

.pui-bg-light-blue-A400 {
  color: #fff !important;
  border-color: #00B0FF !important;
  background-color: #00B0FF !important;
}

.pui-text-light-blue-A400 {
  color: #00B0FF !important;
}

.pui-border-light-blue-A400 {
  border-color: #00B0FF !important;
}

.pui-bg-light-blue-A700 {
  color: #fff !important;
  border-color: #0091EA !important;
  background-color: #0091EA !important;
}

.pui-text-light-blue-A700 {
  color: #0091EA !important;
}

.pui-border-light-blue-A700 {
  border-color: #0091EA !important;
}

.pui-bg-cyan-50 {
  color: #fff !important;
  border-color: #E0F7FA !important;
  background-color: #E0F7FA !important;
}

.pui-text-cyan-50 {
  color: #E0F7FA !important;
}

.pui-border-cyan-50 {
  border-color: #E0F7FA !important;
}

.pui-bg-cyan-100 {
  color: #fff !important;
  border-color: #B2EBF2 !important;
  background-color: #B2EBF2 !important;
}

.pui-text-cyan-100 {
  color: #B2EBF2 !important;
}

.pui-border-cyan-100 {
  border-color: #B2EBF2 !important;
}

.pui-bg-cyan-200 {
  color: #fff !important;
  border-color: #80DEEA !important;
  background-color: #80DEEA !important;
}

.pui-text-cyan-200 {
  color: #80DEEA !important;
}

.pui-border-cyan-200 {
  border-color: #80DEEA !important;
}

.pui-bg-cyan-300 {
  color: #fff !important;
  border-color: #4DD0E1 !important;
  background-color: #4DD0E1 !important;
}

.pui-text-cyan-300 {
  color: #4DD0E1 !important;
}

.pui-border-cyan-300 {
  border-color: #4DD0E1 !important;
}

.pui-bg-cyan-400 {
  color: #fff !important;
  border-color: #26C6DA !important;
  background-color: #26C6DA !important;
}

.pui-text-cyan-400 {
  color: #26C6DA !important;
}

.pui-border-cyan-400 {
  border-color: #26C6DA !important;
}

.pui-bg-cyan, .pui-bg-cyan-500 {
  color: #fff !important;
  border-color: #00BCD4 !important;
  background-color: #00BCD4 !important;
}

.pui-text-cyan, .pui-text-cyan-500 {
  color: #00BCD4 !important;
}

.pui-border-cyan, .pui-border-cyan-500 {
  border-color: #00BCD4 !important;
}

.pui-bg-cyan-600 {
  color: #fff !important;
  border-color: #00ACC1 !important;
  background-color: #00ACC1 !important;
}

.pui-text-cyan-600 {
  color: #00ACC1 !important;
}

.pui-border-cyan-600 {
  border-color: #00ACC1 !important;
}

.pui-bg-cyan-700 {
  color: #fff !important;
  border-color: #0097A7 !important;
  background-color: #0097A7 !important;
}

.pui-text-cyan-700 {
  color: #0097A7 !important;
}

.pui-border-cyan-700 {
  border-color: #0097A7 !important;
}

.pui-bg-cyan-800 {
  color: #fff !important;
  border-color: #00838F !important;
  background-color: #00838F !important;
}

.pui-text-cyan-800 {
  color: #00838F !important;
}

.pui-border-cyan-800 {
  border-color: #00838F !important;
}

.pui-bg-cyan-900 {
  color: #fff !important;
  border-color: #006064 !important;
  background-color: #006064 !important;
}

.pui-text-cyan-900 {
  color: #006064 !important;
}

.pui-border-cyan-900 {
  border-color: #006064 !important;
}

.pui-bg-cyan-A100 {
  color: #fff !important;
  border-color: #84FFFF !important;
  background-color: #84FFFF !important;
}

.pui-text-cyan-A100 {
  color: #84FFFF !important;
}

.pui-border-cyan-A100 {
  border-color: #84FFFF !important;
}

.pui-bg-cyan-A200 {
  color: #fff !important;
  border-color: #18FFFF !important;
  background-color: #18FFFF !important;
}

.pui-text-cyan-A200 {
  color: #18FFFF !important;
}

.pui-border-cyan-A200 {
  border-color: #18FFFF !important;
}

.pui-bg-cyan-A400 {
  color: #fff !important;
  border-color: #00E5FF !important;
  background-color: #00E5FF !important;
}

.pui-text-cyan-A400 {
  color: #00E5FF !important;
}

.pui-border-cyan-A400 {
  border-color: #00E5FF !important;
}

.pui-bg-cyan-A700 {
  color: #fff !important;
  border-color: #00B8D4 !important;
  background-color: #00B8D4 !important;
}

.pui-text-cyan-A700 {
  color: #00B8D4 !important;
}

.pui-border-cyan-A700 {
  border-color: #00B8D4 !important;
}

.pui-bg-teal-50 {
  color: #fff !important;
  border-color: #E0F2F1 !important;
  background-color: #E0F2F1 !important;
}

.pui-text-teal-50 {
  color: #E0F2F1 !important;
}

.pui-border-teal-50 {
  border-color: #E0F2F1 !important;
}

.pui-bg-teal-100 {
  color: #fff !important;
  border-color: #B2DFDB !important;
  background-color: #B2DFDB !important;
}

.pui-text-teal-100 {
  color: #B2DFDB !important;
}

.pui-border-teal-100 {
  border-color: #B2DFDB !important;
}

.pui-bg-teal-200 {
  color: #fff !important;
  border-color: #80CBC4 !important;
  background-color: #80CBC4 !important;
}

.pui-text-teal-200 {
  color: #80CBC4 !important;
}

.pui-border-teal-200 {
  border-color: #80CBC4 !important;
}

.pui-bg-teal-300 {
  color: #fff !important;
  border-color: #4DB6AC !important;
  background-color: #4DB6AC !important;
}

.pui-text-teal-300 {
  color: #4DB6AC !important;
}

.pui-border-teal-300 {
  border-color: #4DB6AC !important;
}

.pui-bg-teal-400 {
  color: #fff !important;
  border-color: #26A69A !important;
  background-color: #26A69A !important;
}

.pui-text-teal-400 {
  color: #26A69A !important;
}

.pui-border-teal-400 {
  border-color: #26A69A !important;
}

.pui-bg-teal, .pui-bg-teal-500 {
  color: #fff !important;
  border-color: #009688 !important;
  background-color: #009688 !important;
}

.pui-text-teal, .pui-text-teal-500 {
  color: #009688 !important;
}

.pui-border-teal, .pui-border-teal-500 {
  border-color: #009688 !important;
}

.pui-bg-teal-600 {
  color: #fff !important;
  border-color: #00897B !important;
  background-color: #00897B !important;
}

.pui-text-teal-600 {
  color: #00897B !important;
}

.pui-border-teal-600 {
  border-color: #00897B !important;
}

.pui-bg-teal-700 {
  color: #fff !important;
  border-color: #00796B !important;
  background-color: #00796B !important;
}

.pui-text-teal-700 {
  color: #00796B !important;
}

.pui-border-teal-700 {
  border-color: #00796B !important;
}

.pui-bg-teal-800 {
  color: #fff !important;
  border-color: #00695C !important;
  background-color: #00695C !important;
}

.pui-text-teal-800 {
  color: #00695C !important;
}

.pui-border-teal-800 {
  border-color: #00695C !important;
}

.pui-bg-teal-900 {
  color: #fff !important;
  border-color: #004D40 !important;
  background-color: #004D40 !important;
}

.pui-text-teal-900 {
  color: #004D40 !important;
}

.pui-border-teal-900 {
  border-color: #004D40 !important;
}

.pui-bg-teal-A100 {
  color: #fff !important;
  border-color: #A7FFEB !important;
  background-color: #A7FFEB !important;
}

.pui-text-teal-A100 {
  color: #A7FFEB !important;
}

.pui-border-teal-A100 {
  border-color: #A7FFEB !important;
}

.pui-bg-teal-A200 {
  color: #fff !important;
  border-color: #64FFDA !important;
  background-color: #64FFDA !important;
}

.pui-text-teal-A200 {
  color: #64FFDA !important;
}

.pui-border-teal-A200 {
  border-color: #64FFDA !important;
}

.pui-bg-teal-A400 {
  color: #fff !important;
  border-color: #1DE9B6 !important;
  background-color: #1DE9B6 !important;
}

.pui-text-teal-A400 {
  color: #1DE9B6 !important;
}

.pui-border-teal-A400 {
  border-color: #1DE9B6 !important;
}

.pui-bg-teal-A700 {
  color: #fff !important;
  border-color: #00BFA5 !important;
  background-color: #00BFA5 !important;
}

.pui-text-teal-A700 {
  color: #00BFA5 !important;
}

.pui-border-teal-A700 {
  border-color: #00BFA5 !important;
}

.pui-bg-green-50 {
  color: #fff !important;
  border-color: #E8F5E9 !important;
  background-color: #E8F5E9 !important;
}

.pui-text-green-50 {
  color: #E8F5E9 !important;
}

.pui-border-green-50 {
  border-color: #E8F5E9 !important;
}

.pui-bg-green-100 {
  color: #fff !important;
  border-color: #C8E6C9 !important;
  background-color: #C8E6C9 !important;
}

.pui-text-green-100 {
  color: #C8E6C9 !important;
}

.pui-border-green-100 {
  border-color: #C8E6C9 !important;
}

.pui-bg-green-200 {
  color: #fff !important;
  border-color: #A5D6A7 !important;
  background-color: #A5D6A7 !important;
}

.pui-text-green-200 {
  color: #A5D6A7 !important;
}

.pui-border-green-200 {
  border-color: #A5D6A7 !important;
}

.pui-bg-green-300 {
  color: #fff !important;
  border-color: #81C784 !important;
  background-color: #81C784 !important;
}

.pui-text-green-300 {
  color: #81C784 !important;
}

.pui-border-green-300 {
  border-color: #81C784 !important;
}

.pui-bg-green-400 {
  color: #fff !important;
  border-color: #66BB6A !important;
  background-color: #66BB6A !important;
}

.pui-text-green-400 {
  color: #66BB6A !important;
}

.pui-border-green-400 {
  border-color: #66BB6A !important;
}

.pui-bg-green, .pui-bg-green-500 {
  color: #fff !important;
  border-color: #4CAF50 !important;
  background-color: #4CAF50 !important;
}

.pui-text-green, .pui-text-green-500 {
  color: #4CAF50 !important;
}

.pui-border-green, .pui-border-green-500 {
  border-color: #4CAF50 !important;
}

.pui-bg-green-600 {
  color: #fff !important;
  border-color: #43A047 !important;
  background-color: #43A047 !important;
}

.pui-text-green-600 {
  color: #43A047 !important;
}

.pui-border-green-600 {
  border-color: #43A047 !important;
}

.pui-bg-green-700 {
  color: #fff !important;
  border-color: #388E3C !important;
  background-color: #388E3C !important;
}

.pui-text-green-700 {
  color: #388E3C !important;
}

.pui-border-green-700 {
  border-color: #388E3C !important;
}

.pui-bg-green-800 {
  color: #fff !important;
  border-color: #2E7D32 !important;
  background-color: #2E7D32 !important;
}

.pui-text-green-800 {
  color: #2E7D32 !important;
}

.pui-border-green-800 {
  border-color: #2E7D32 !important;
}

.pui-bg-green-900 {
  color: #fff !important;
  border-color: #1B5E20 !important;
  background-color: #1B5E20 !important;
}

.pui-text-green-900 {
  color: #1B5E20 !important;
}

.pui-border-green-900 {
  border-color: #1B5E20 !important;
}

.pui-bg-green-A100 {
  color: #fff !important;
  border-color: #B9F6CA !important;
  background-color: #B9F6CA !important;
}

.pui-text-green-A100 {
  color: #B9F6CA !important;
}

.pui-border-green-A100 {
  border-color: #B9F6CA !important;
}

.pui-bg-green-A200 {
  color: #fff !important;
  border-color: #69F0AE !important;
  background-color: #69F0AE !important;
}

.pui-text-green-A200 {
  color: #69F0AE !important;
}

.pui-border-green-A200 {
  border-color: #69F0AE !important;
}

.pui-bg-green-A400 {
  color: #fff !important;
  border-color: #00E676 !important;
  background-color: #00E676 !important;
}

.pui-text-green-A400 {
  color: #00E676 !important;
}

.pui-border-green-A400 {
  border-color: #00E676 !important;
}

.pui-bg-green-A700 {
  color: #fff !important;
  border-color: #00C853 !important;
  background-color: #00C853 !important;
}

.pui-text-green-A700 {
  color: #00C853 !important;
}

.pui-border-green-A700 {
  border-color: #00C853 !important;
}

.pui-bg-light-green-50 {
  color: #fff !important;
  border-color: #F1F8E9 !important;
  background-color: #F1F8E9 !important;
}

.pui-text-light-green-50 {
  color: #F1F8E9 !important;
}

.pui-border-light-green-50 {
  border-color: #F1F8E9 !important;
}

.pui-bg-light-green-100 {
  color: #fff !important;
  border-color: #DCEDC8 !important;
  background-color: #DCEDC8 !important;
}

.pui-text-light-green-100 {
  color: #DCEDC8 !important;
}

.pui-border-light-green-100 {
  border-color: #DCEDC8 !important;
}

.pui-bg-light-green-200 {
  color: #fff !important;
  border-color: #C5E1A5 !important;
  background-color: #C5E1A5 !important;
}

.pui-text-light-green-200 {
  color: #C5E1A5 !important;
}

.pui-border-light-green-200 {
  border-color: #C5E1A5 !important;
}

.pui-bg-light-green-300 {
  color: #fff !important;
  border-color: #AED581 !important;
  background-color: #AED581 !important;
}

.pui-text-light-green-300 {
  color: #AED581 !important;
}

.pui-border-light-green-300 {
  border-color: #AED581 !important;
}

.pui-bg-light-green-400 {
  color: #fff !important;
  border-color: #9CCC65 !important;
  background-color: #9CCC65 !important;
}

.pui-text-light-green-400 {
  color: #9CCC65 !important;
}

.pui-border-light-green-400 {
  border-color: #9CCC65 !important;
}

.pui-bg-light-green, .pui-bg-light-green-500 {
  color: #fff !important;
  border-color: #8BC34A !important;
  background-color: #8BC34A !important;
}

.pui-text-light-green, .pui-text-light-green-500 {
  color: #8BC34A !important;
}

.pui-border-light-green, .pui-border-light-green-500 {
  border-color: #8BC34A !important;
}

.pui-bg-light-green-600 {
  color: #fff !important;
  border-color: #7CB342 !important;
  background-color: #7CB342 !important;
}

.pui-text-light-green-600 {
  color: #7CB342 !important;
}

.pui-border-light-green-600 {
  border-color: #7CB342 !important;
}

.pui-bg-light-green-700 {
  color: #fff !important;
  border-color: #689F38 !important;
  background-color: #689F38 !important;
}

.pui-text-light-green-700 {
  color: #689F38 !important;
}

.pui-border-light-green-700 {
  border-color: #689F38 !important;
}

.pui-bg-light-green-800 {
  color: #fff !important;
  border-color: #558B2F !important;
  background-color: #558B2F !important;
}

.pui-text-light-green-800 {
  color: #558B2F !important;
}

.pui-border-light-green-800 {
  border-color: #558B2F !important;
}

.pui-bg-light-green-900 {
  color: #fff !important;
  border-color: #33691E !important;
  background-color: #33691E !important;
}

.pui-text-light-green-900 {
  color: #33691E !important;
}

.pui-border-light-green-900 {
  border-color: #33691E !important;
}

.pui-bg-light-green-A100 {
  color: #fff !important;
  border-color: #CCFF90 !important;
  background-color: #CCFF90 !important;
}

.pui-text-light-green-A100 {
  color: #CCFF90 !important;
}

.pui-border-light-green-A100 {
  border-color: #CCFF90 !important;
}

.pui-bg-light-green-A200 {
  color: #fff !important;
  border-color: #B2FF59 !important;
  background-color: #B2FF59 !important;
}

.pui-text-light-green-A200 {
  color: #B2FF59 !important;
}

.pui-border-light-green-A200 {
  border-color: #B2FF59 !important;
}

.pui-bg-light-green-A400 {
  color: #fff !important;
  border-color: #76FF03 !important;
  background-color: #76FF03 !important;
}

.pui-text-light-green-A400 {
  color: #76FF03 !important;
}

.pui-border-light-green-A400 {
  border-color: #76FF03 !important;
}

.pui-bg-light-green-A700 {
  color: #fff !important;
  border-color: #64DD17 !important;
  background-color: #64DD17 !important;
}

.pui-text-light-green-A700 {
  color: #64DD17 !important;
}

.pui-border-light-green-A700 {
  border-color: #64DD17 !important;
}

.pui-bg-lime-50 {
  color: #fff !important;
  border-color: #F9FBE7 !important;
  background-color: #F9FBE7 !important;
}

.pui-text-lime-50 {
  color: #F9FBE7 !important;
}

.pui-border-lime-50 {
  border-color: #F9FBE7 !important;
}

.pui-bg-lime-100 {
  color: #fff !important;
  border-color: #F0F4C3 !important;
  background-color: #F0F4C3 !important;
}

.pui-text-lime-100 {
  color: #F0F4C3 !important;
}

.pui-border-lime-100 {
  border-color: #F0F4C3 !important;
}

.pui-bg-lime-200 {
  color: #fff !important;
  border-color: #E6EE9C !important;
  background-color: #E6EE9C !important;
}

.pui-text-lime-200 {
  color: #E6EE9C !important;
}

.pui-border-lime-200 {
  border-color: #E6EE9C !important;
}

.pui-bg-lime-300 {
  color: #fff !important;
  border-color: #DCE775 !important;
  background-color: #DCE775 !important;
}

.pui-text-lime-300 {
  color: #DCE775 !important;
}

.pui-border-lime-300 {
  border-color: #DCE775 !important;
}

.pui-bg-lime-400 {
  color: #fff !important;
  border-color: #D4E157 !important;
  background-color: #D4E157 !important;
}

.pui-text-lime-400 {
  color: #D4E157 !important;
}

.pui-border-lime-400 {
  border-color: #D4E157 !important;
}

.pui-bg-lime, .pui-bg-lime-500 {
  color: #fff !important;
  border-color: #CDDC39 !important;
  background-color: #CDDC39 !important;
}

.pui-text-lime, .pui-text-lime-500 {
  color: #CDDC39 !important;
}

.pui-border-lime, .pui-border-lime-500 {
  border-color: #CDDC39 !important;
}

.pui-bg-lime-600 {
  color: #fff !important;
  border-color: #C0CA33 !important;
  background-color: #C0CA33 !important;
}

.pui-text-lime-600 {
  color: #C0CA33 !important;
}

.pui-border-lime-600 {
  border-color: #C0CA33 !important;
}

.pui-bg-lime-700 {
  color: #fff !important;
  border-color: #AFB42B !important;
  background-color: #AFB42B !important;
}

.pui-text-lime-700 {
  color: #AFB42B !important;
}

.pui-border-lime-700 {
  border-color: #AFB42B !important;
}

.pui-bg-lime-800 {
  color: #fff !important;
  border-color: #9E9D24 !important;
  background-color: #9E9D24 !important;
}

.pui-text-lime-800 {
  color: #9E9D24 !important;
}

.pui-border-lime-800 {
  border-color: #9E9D24 !important;
}

.pui-bg-lime-900 {
  color: #fff !important;
  border-color: #827717 !important;
  background-color: #827717 !important;
}

.pui-text-lime-900 {
  color: #827717 !important;
}

.pui-border-lime-900 {
  border-color: #827717 !important;
}

.pui-bg-lime-A100 {
  color: #fff !important;
  border-color: #F4FF81 !important;
  background-color: #F4FF81 !important;
}

.pui-text-lime-A100 {
  color: #F4FF81 !important;
}

.pui-border-lime-A100 {
  border-color: #F4FF81 !important;
}

.pui-bg-lime-A200 {
  color: #fff !important;
  border-color: #EEFF41 !important;
  background-color: #EEFF41 !important;
}

.pui-text-lime-A200 {
  color: #EEFF41 !important;
}

.pui-border-lime-A200 {
  border-color: #EEFF41 !important;
}

.pui-bg-lime-A400 {
  color: #fff !important;
  border-color: #C6FF00 !important;
  background-color: #C6FF00 !important;
}

.pui-text-lime-A400 {
  color: #C6FF00 !important;
}

.pui-border-lime-A400 {
  border-color: #C6FF00 !important;
}

.pui-bg-lime-A700 {
  color: #fff !important;
  border-color: #AEEA00 !important;
  background-color: #AEEA00 !important;
}

.pui-text-lime-A700 {
  color: #AEEA00 !important;
}

.pui-border-lime-A700 {
  border-color: #AEEA00 !important;
}

.pui-bg-yellow-50 {
  color: #fff !important;
  border-color: #FFFDE7 !important;
  background-color: #FFFDE7 !important;
}

.pui-text-yellow-50 {
  color: #FFFDE7 !important;
}

.pui-border-yellow-50 {
  border-color: #FFFDE7 !important;
}

.pui-bg-yellow-100 {
  color: #fff !important;
  border-color: #FFF9C4 !important;
  background-color: #FFF9C4 !important;
}

.pui-text-yellow-100 {
  color: #FFF9C4 !important;
}

.pui-border-yellow-100 {
  border-color: #FFF9C4 !important;
}

.pui-bg-yellow-200 {
  color: #fff !important;
  border-color: #FFF59D !important;
  background-color: #FFF59D !important;
}

.pui-text-yellow-200 {
  color: #FFF59D !important;
}

.pui-border-yellow-200 {
  border-color: #FFF59D !important;
}

.pui-bg-yellow-300 {
  color: #fff !important;
  border-color: #FFF176 !important;
  background-color: #FFF176 !important;
}

.pui-text-yellow-300 {
  color: #FFF176 !important;
}

.pui-border-yellow-300 {
  border-color: #FFF176 !important;
}

.pui-bg-yellow-400 {
  color: #fff !important;
  border-color: #FFEE58 !important;
  background-color: #FFEE58 !important;
}

.pui-text-yellow-400 {
  color: #FFEE58 !important;
}

.pui-border-yellow-400 {
  border-color: #FFEE58 !important;
}

.pui-bg-yellow, .pui-bg-yellow-500 {
  color: #fff !important;
  border-color: #FFEB3B !important;
  background-color: #FFEB3B !important;
}

.pui-text-yellow, .pui-text-yellow-500 {
  color: #FFEB3B !important;
}

.pui-border-yellow, .pui-border-yellow-500 {
  border-color: #FFEB3B !important;
}

.pui-bg-yellow-600 {
  color: #fff !important;
  border-color: #FDD835 !important;
  background-color: #FDD835 !important;
}

.pui-text-yellow-600 {
  color: #FDD835 !important;
}

.pui-border-yellow-600 {
  border-color: #FDD835 !important;
}

.pui-bg-yellow-700 {
  color: #fff !important;
  border-color: #FBC02D !important;
  background-color: #FBC02D !important;
}

.pui-text-yellow-700 {
  color: #FBC02D !important;
}

.pui-border-yellow-700 {
  border-color: #FBC02D !important;
}

.pui-bg-yellow-800 {
  color: #fff !important;
  border-color: #F9A825 !important;
  background-color: #F9A825 !important;
}

.pui-text-yellow-800 {
  color: #F9A825 !important;
}

.pui-border-yellow-800 {
  border-color: #F9A825 !important;
}

.pui-bg-yellow-900 {
  color: #fff !important;
  border-color: #F57F17 !important;
  background-color: #F57F17 !important;
}

.pui-text-yellow-900 {
  color: #F57F17 !important;
}

.pui-border-yellow-900 {
  border-color: #F57F17 !important;
}

.pui-bg-yellow-A100 {
  color: #fff !important;
  border-color: #FFFF8D !important;
  background-color: #FFFF8D !important;
}

.pui-text-yellow-A100 {
  color: #FFFF8D !important;
}

.pui-border-yellow-A100 {
  border-color: #FFFF8D !important;
}

.pui-bg-yellow-A200 {
  color: #fff !important;
  border-color: #FFFF00 !important;
  background-color: #FFFF00 !important;
}

.pui-text-yellow-A200 {
  color: #FFFF00 !important;
}

.pui-border-yellow-A200 {
  border-color: #FFFF00 !important;
}

.pui-bg-yellow-A400 {
  color: #fff !important;
  border-color: #FFEA00 !important;
  background-color: #FFEA00 !important;
}

.pui-text-yellow-A400 {
  color: #FFEA00 !important;
}

.pui-border-yellow-A400 {
  border-color: #FFEA00 !important;
}

.pui-bg-yellow-A700 {
  color: #fff !important;
  border-color: #FFD600 !important;
  background-color: #FFD600 !important;
}

.pui-text-yellow-A700 {
  color: #FFD600 !important;
}

.pui-border-yellow-A700 {
  border-color: #FFD600 !important;
}

.pui-bg-amber-50 {
  color: #fff !important;
  border-color: #FFF8E1 !important;
  background-color: #FFF8E1 !important;
}

.pui-text-amber-50 {
  color: #FFF8E1 !important;
}

.pui-border-amber-50 {
  border-color: #FFF8E1 !important;
}

.pui-bg-amber-100 {
  color: #fff !important;
  border-color: #FFECB3 !important;
  background-color: #FFECB3 !important;
}

.pui-text-amber-100 {
  color: #FFECB3 !important;
}

.pui-border-amber-100 {
  border-color: #FFECB3 !important;
}

.pui-bg-amber-200 {
  color: #fff !important;
  border-color: #FFE082 !important;
  background-color: #FFE082 !important;
}

.pui-text-amber-200 {
  color: #FFE082 !important;
}

.pui-border-amber-200 {
  border-color: #FFE082 !important;
}

.pui-bg-amber-300 {
  color: #fff !important;
  border-color: #FFD54F !important;
  background-color: #FFD54F !important;
}

.pui-text-amber-300 {
  color: #FFD54F !important;
}

.pui-border-amber-300 {
  border-color: #FFD54F !important;
}

.pui-bg-amber-400 {
  color: #fff !important;
  border-color: #FFCA28 !important;
  background-color: #FFCA28 !important;
}

.pui-text-amber-400 {
  color: #FFCA28 !important;
}

.pui-border-amber-400 {
  border-color: #FFCA28 !important;
}

.pui-bg-amber, .pui-bg-amber-500 {
  color: #fff !important;
  border-color: #FFC107 !important;
  background-color: #FFC107 !important;
}

.pui-text-amber, .pui-text-amber-500 {
  color: #FFC107 !important;
}

.pui-border-amber, .pui-border-amber-500 {
  border-color: #FFC107 !important;
}

.pui-bg-amber-600 {
  color: #fff !important;
  border-color: #FFB300 !important;
  background-color: #FFB300 !important;
}

.pui-text-amber-600 {
  color: #FFB300 !important;
}

.pui-border-amber-600 {
  border-color: #FFB300 !important;
}

.pui-bg-amber-700 {
  color: #fff !important;
  border-color: #FFA000 !important;
  background-color: #FFA000 !important;
}

.pui-text-amber-700 {
  color: #FFA000 !important;
}

.pui-border-amber-700 {
  border-color: #FFA000 !important;
}

.pui-bg-amber-800 {
  color: #fff !important;
  border-color: #FF8F00 !important;
  background-color: #FF8F00 !important;
}

.pui-text-amber-800 {
  color: #FF8F00 !important;
}

.pui-border-amber-800 {
  border-color: #FF8F00 !important;
}

.pui-bg-amber-900 {
  color: #fff !important;
  border-color: #FF6F00 !important;
  background-color: #FF6F00 !important;
}

.pui-text-amber-900 {
  color: #FF6F00 !important;
}

.pui-border-amber-900 {
  border-color: #FF6F00 !important;
}

.pui-bg-amber-A100 {
  color: #fff !important;
  border-color: #FFE57F !important;
  background-color: #FFE57F !important;
}

.pui-text-amber-A100 {
  color: #FFE57F !important;
}

.pui-border-amber-A100 {
  border-color: #FFE57F !important;
}

.pui-bg-amber-A200 {
  color: #fff !important;
  border-color: #FFD740 !important;
  background-color: #FFD740 !important;
}

.pui-text-amber-A200 {
  color: #FFD740 !important;
}

.pui-border-amber-A200 {
  border-color: #FFD740 !important;
}

.pui-bg-amber-A400 {
  color: #fff !important;
  border-color: #FFC400 !important;
  background-color: #FFC400 !important;
}

.pui-text-amber-A400 {
  color: #FFC400 !important;
}

.pui-border-amber-A400 {
  border-color: #FFC400 !important;
}

.pui-bg-amber-A700 {
  color: #fff !important;
  border-color: #FFAB00 !important;
  background-color: #FFAB00 !important;
}

.pui-text-amber-A700 {
  color: #FFAB00 !important;
}

.pui-border-amber-A700 {
  border-color: #FFAB00 !important;
}

.pui-bg-orange-50 {
  color: #fff !important;
  border-color: #FFF3E0 !important;
  background-color: #FFF3E0 !important;
}

.pui-text-orange-50 {
  color: #FFF3E0 !important;
}

.pui-border-orange-50 {
  border-color: #FFF3E0 !important;
}

.pui-bg-orange-100 {
  color: #fff !important;
  border-color: #FFE0B2 !important;
  background-color: #FFE0B2 !important;
}

.pui-text-orange-100 {
  color: #FFE0B2 !important;
}

.pui-border-orange-100 {
  border-color: #FFE0B2 !important;
}

.pui-bg-orange-200 {
  color: #fff !important;
  border-color: #FFCC80 !important;
  background-color: #FFCC80 !important;
}

.pui-text-orange-200 {
  color: #FFCC80 !important;
}

.pui-border-orange-200 {
  border-color: #FFCC80 !important;
}

.pui-bg-orange-300 {
  color: #fff !important;
  border-color: #FFB74D !important;
  background-color: #FFB74D !important;
}

.pui-text-orange-300 {
  color: #FFB74D !important;
}

.pui-border-orange-300 {
  border-color: #FFB74D !important;
}

.pui-bg-orange-400 {
  color: #fff !important;
  border-color: #FFA726 !important;
  background-color: #FFA726 !important;
}

.pui-text-orange-400 {
  color: #FFA726 !important;
}

.pui-border-orange-400 {
  border-color: #FFA726 !important;
}

.pui-bg-orange, .pui-bg-orange-500 {
  color: #fff !important;
  border-color: #FF9800 !important;
  background-color: #FF9800 !important;
}

.pui-text-orange, .pui-text-orange-500 {
  color: #FF9800 !important;
}

.pui-border-orange, .pui-border-orange-500 {
  border-color: #FF9800 !important;
}

.pui-bg-orange-600 {
  color: #fff !important;
  border-color: #FB8C00 !important;
  background-color: #FB8C00 !important;
}

.pui-text-orange-600 {
  color: #FB8C00 !important;
}

.pui-border-orange-600 {
  border-color: #FB8C00 !important;
}

.pui-bg-orange-700 {
  color: #fff !important;
  border-color: #F57C00 !important;
  background-color: #F57C00 !important;
}

.pui-text-orange-700 {
  color: #F57C00 !important;
}

.pui-border-orange-700 {
  border-color: #F57C00 !important;
}

.pui-bg-orange-800 {
  color: #fff !important;
  border-color: #EF6C00 !important;
  background-color: #EF6C00 !important;
}

.pui-text-orange-800 {
  color: #EF6C00 !important;
}

.pui-border-orange-800 {
  border-color: #EF6C00 !important;
}

.pui-bg-orange-900 {
  color: #fff !important;
  border-color: #E65100 !important;
  background-color: #E65100 !important;
}

.pui-text-orange-900 {
  color: #E65100 !important;
}

.pui-border-orange-900 {
  border-color: #E65100 !important;
}

.pui-bg-orange-A100 {
  color: #fff !important;
  border-color: #FFD180 !important;
  background-color: #FFD180 !important;
}

.pui-text-orange-A100 {
  color: #FFD180 !important;
}

.pui-border-orange-A100 {
  border-color: #FFD180 !important;
}

.pui-bg-orange-A200 {
  color: #fff !important;
  border-color: #FFAB40 !important;
  background-color: #FFAB40 !important;
}

.pui-text-orange-A200 {
  color: #FFAB40 !important;
}

.pui-border-orange-A200 {
  border-color: #FFAB40 !important;
}

.pui-bg-orange-A400 {
  color: #fff !important;
  border-color: #FF9100 !important;
  background-color: #FF9100 !important;
}

.pui-text-orange-A400 {
  color: #FF9100 !important;
}

.pui-border-orange-A400 {
  border-color: #FF9100 !important;
}

.pui-bg-orange-A700 {
  color: #fff !important;
  border-color: #FF6D00 !important;
  background-color: #FF6D00 !important;
}

.pui-text-orange-A700 {
  color: #FF6D00 !important;
}

.pui-border-orange-A700 {
  border-color: #FF6D00 !important;
}

.pui-bg-deep-orange-50 {
  color: #fff !important;
  border-color: #FBE9E7 !important;
  background-color: #FBE9E7 !important;
}

.pui-text-deep-orange-50 {
  color: #FBE9E7 !important;
}

.pui-border-deep-orange-50 {
  border-color: #FBE9E7 !important;
}

.pui-bg-deep-orange-100 {
  color: #fff !important;
  border-color: #FFCCBC !important;
  background-color: #FFCCBC !important;
}

.pui-text-deep-orange-100 {
  color: #FFCCBC !important;
}

.pui-border-deep-orange-100 {
  border-color: #FFCCBC !important;
}

.pui-bg-deep-orange-200 {
  color: #fff !important;
  border-color: #FFAB91 !important;
  background-color: #FFAB91 !important;
}

.pui-text-deep-orange-200 {
  color: #FFAB91 !important;
}

.pui-border-deep-orange-200 {
  border-color: #FFAB91 !important;
}

.pui-bg-deep-orange-300 {
  color: #fff !important;
  border-color: #FF8A65 !important;
  background-color: #FF8A65 !important;
}

.pui-text-deep-orange-300 {
  color: #FF8A65 !important;
}

.pui-border-deep-orange-300 {
  border-color: #FF8A65 !important;
}

.pui-bg-deep-orange-400 {
  color: #fff !important;
  border-color: #FF7043 !important;
  background-color: #FF7043 !important;
}

.pui-text-deep-orange-400 {
  color: #FF7043 !important;
}

.pui-border-deep-orange-400 {
  border-color: #FF7043 !important;
}

.pui-bg-deep-orange, .pui-bg-deep-orange-500 {
  color: #fff !important;
  border-color: #FF5722 !important;
  background-color: #FF5722 !important;
}

.pui-text-deep-orange, .pui-text-deep-orange-500 {
  color: #FF5722 !important;
}

.pui-border-deep-orange, .pui-border-deep-orange-500 {
  border-color: #FF5722 !important;
}

.pui-bg-deep-orange-600 {
  color: #fff !important;
  border-color: #F4511E !important;
  background-color: #F4511E !important;
}

.pui-text-deep-orange-600 {
  color: #F4511E !important;
}

.pui-border-deep-orange-600 {
  border-color: #F4511E !important;
}

.pui-bg-deep-orange-700 {
  color: #fff !important;
  border-color: #E64A19 !important;
  background-color: #E64A19 !important;
}

.pui-text-deep-orange-700 {
  color: #E64A19 !important;
}

.pui-border-deep-orange-700 {
  border-color: #E64A19 !important;
}

.pui-bg-deep-orange-800 {
  color: #fff !important;
  border-color: #D84315 !important;
  background-color: #D84315 !important;
}

.pui-text-deep-orange-800 {
  color: #D84315 !important;
}

.pui-border-deep-orange-800 {
  border-color: #D84315 !important;
}

.pui-bg-deep-orange-900 {
  color: #fff !important;
  border-color: #BF360C !important;
  background-color: #BF360C !important;
}

.pui-text-deep-orange-900 {
  color: #BF360C !important;
}

.pui-border-deep-orange-900 {
  border-color: #BF360C !important;
}

.pui-bg-deep-orange-A100 {
  color: #fff !important;
  border-color: #FF9E80 !important;
  background-color: #FF9E80 !important;
}

.pui-text-deep-orange-A100 {
  color: #FF9E80 !important;
}

.pui-border-deep-orange-A100 {
  border-color: #FF9E80 !important;
}

.pui-bg-deep-orange-A200 {
  color: #fff !important;
  border-color: #FF6E40 !important;
  background-color: #FF6E40 !important;
}

.pui-text-deep-orange-A200 {
  color: #FF6E40 !important;
}

.pui-border-deep-orange-A200 {
  border-color: #FF6E40 !important;
}

.pui-bg-deep-orange-A400 {
  color: #fff !important;
  border-color: #FF3D00 !important;
  background-color: #FF3D00 !important;
}

.pui-text-deep-orange-A400 {
  color: #FF3D00 !important;
}

.pui-border-deep-orange-A400 {
  border-color: #FF3D00 !important;
}

.pui-bg-deep-orange-A700 {
  color: #fff !important;
  border-color: #DD2C00 !important;
  background-color: #DD2C00 !important;
}

.pui-text-deep-orange-A700 {
  color: #DD2C00 !important;
}

.pui-border-deep-orange-A700 {
  border-color: #DD2C00 !important;
}

.pui-bg-brown-50 {
  color: #fff !important;
  border-color: #EFEBE9 !important;
  background-color: #EFEBE9 !important;
}

.pui-text-brown-50 {
  color: #EFEBE9 !important;
}

.pui-border-brown-50 {
  border-color: #EFEBE9 !important;
}

.pui-bg-brown-100 {
  color: #fff !important;
  border-color: #D7CCC8 !important;
  background-color: #D7CCC8 !important;
}

.pui-text-brown-100 {
  color: #D7CCC8 !important;
}

.pui-border-brown-100 {
  border-color: #D7CCC8 !important;
}

.pui-bg-brown-200 {
  color: #fff !important;
  border-color: #BCAAA4 !important;
  background-color: #BCAAA4 !important;
}

.pui-text-brown-200 {
  color: #BCAAA4 !important;
}

.pui-border-brown-200 {
  border-color: #BCAAA4 !important;
}

.pui-bg-brown-300 {
  color: #fff !important;
  border-color: #A1887F !important;
  background-color: #A1887F !important;
}

.pui-text-brown-300 {
  color: #A1887F !important;
}

.pui-border-brown-300 {
  border-color: #A1887F !important;
}

.pui-bg-brown-400 {
  color: #fff !important;
  border-color: #8D6E63 !important;
  background-color: #8D6E63 !important;
}

.pui-text-brown-400 {
  color: #8D6E63 !important;
}

.pui-border-brown-400 {
  border-color: #8D6E63 !important;
}

.pui-bg-brown, .pui-bg-brown-500 {
  color: #fff !important;
  border-color: #795548 !important;
  background-color: #795548 !important;
}

.pui-text-brown, .pui-text-brown-500 {
  color: #795548 !important;
}

.pui-border-brown, .pui-border-brown-500 {
  border-color: #795548 !important;
}

.pui-bg-brown-600 {
  color: #fff !important;
  border-color: #6D4C41 !important;
  background-color: #6D4C41 !important;
}

.pui-text-brown-600 {
  color: #6D4C41 !important;
}

.pui-border-brown-600 {
  border-color: #6D4C41 !important;
}

.pui-bg-brown-700 {
  color: #fff !important;
  border-color: #5D4037 !important;
  background-color: #5D4037 !important;
}

.pui-text-brown-700 {
  color: #5D4037 !important;
}

.pui-border-brown-700 {
  border-color: #5D4037 !important;
}

.pui-bg-brown-800 {
  color: #fff !important;
  border-color: #4E342E !important;
  background-color: #4E342E !important;
}

.pui-text-brown-800 {
  color: #4E342E !important;
}

.pui-border-brown-800 {
  border-color: #4E342E !important;
}

.pui-bg-brown-900 {
  color: #fff !important;
  border-color: #3E2723 !important;
  background-color: #3E2723 !important;
}

.pui-text-brown-900 {
  color: #3E2723 !important;
}

.pui-border-brown-900 {
  border-color: #3E2723 !important;
}

.pui-bg-grey-50 {
  color: #fff !important;
  border-color: #FAFAFA !important;
  background-color: #FAFAFA !important;
}

.pui-text-grey-50 {
  color: #FAFAFA !important;
}

.pui-border-grey-50 {
  border-color: #FAFAFA !important;
}

.pui-bg-grey-100 {
  color: #fff !important;
  border-color: #F5F5F5 !important;
  background-color: #F5F5F5 !important;
}

.pui-text-grey-100 {
  color: #F5F5F5 !important;
}

.pui-border-grey-100 {
  border-color: #F5F5F5 !important;
}

.pui-bg-grey-200 {
  color: #fff !important;
  border-color: #EEEEEE !important;
  background-color: #EEEEEE !important;
}

.pui-text-grey-200 {
  color: #EEEEEE !important;
}

.pui-border-grey-200 {
  border-color: #EEEEEE !important;
}

.pui-bg-grey-300 {
  color: #fff !important;
  border-color: #E0E0E0 !important;
  background-color: #E0E0E0 !important;
}

.pui-text-grey-300 {
  color: #E0E0E0 !important;
}

.pui-border-grey-300 {
  border-color: #E0E0E0 !important;
}

.pui-bg-grey-400 {
  color: #fff !important;
  border-color: #BDBDBD !important;
  background-color: #BDBDBD !important;
}

.pui-text-grey-400 {
  color: #BDBDBD !important;
}

.pui-border-grey-400 {
  border-color: #BDBDBD !important;
}

.pui-bg-grey, .pui-bg-grey-500 {
  color: #fff !important;
  border-color: #9E9E9E !important;
  background-color: #9E9E9E !important;
}

.pui-text-grey, .pui-text-grey-500 {
  color: #9E9E9E !important;
}

.pui-border-grey, .pui-border-grey-500 {
  border-color: #9E9E9E !important;
}

.pui-bg-grey-600 {
  color: #fff !important;
  border-color: #757575 !important;
  background-color: #757575 !important;
}

.pui-text-grey-600 {
  color: #757575 !important;
}

.pui-border-grey-600 {
  border-color: #757575 !important;
}

.pui-bg-grey-700 {
  color: #fff !important;
  border-color: #616161 !important;
  background-color: #616161 !important;
}

.pui-text-grey-700 {
  color: #616161 !important;
}

.pui-border-grey-700 {
  border-color: #616161 !important;
}

.pui-bg-grey-800 {
  color: #fff !important;
  border-color: #424242 !important;
  background-color: #424242 !important;
}

.pui-text-grey-800 {
  color: #424242 !important;
}

.pui-border-grey-800 {
  border-color: #424242 !important;
}

.pui-bg-grey-900 {
  color: #fff !important;
  border-color: #212121 !important;
  background-color: #212121 !important;
}

.pui-text-grey-900 {
  color: #212121 !important;
}

.pui-border-grey-900 {
  border-color: #212121 !important;
}

.pui-bg-blue-grey-50 {
  color: #fff !important;
  border-color: #ECEFF1 !important;
  background-color: #ECEFF1 !important;
}

.pui-text-blue-grey-50 {
  color: #ECEFF1 !important;
}

.pui-border-blue-grey-50 {
  border-color: #ECEFF1 !important;
}

.pui-bg-blue-grey-100 {
  color: #fff !important;
  border-color: #CFD8DC !important;
  background-color: #CFD8DC !important;
}

.pui-text-blue-grey-100 {
  color: #CFD8DC !important;
}

.pui-border-blue-grey-100 {
  border-color: #CFD8DC !important;
}

.pui-bg-blue-grey-200 {
  color: #fff !important;
  border-color: #B0BEC5 !important;
  background-color: #B0BEC5 !important;
}

.pui-text-blue-grey-200 {
  color: #B0BEC5 !important;
}

.pui-border-blue-grey-200 {
  border-color: #B0BEC5 !important;
}

.pui-bg-blue-grey-300 {
  color: #fff !important;
  border-color: #90A4AE !important;
  background-color: #90A4AE !important;
}

.pui-text-blue-grey-300 {
  color: #90A4AE !important;
}

.pui-border-blue-grey-300 {
  border-color: #90A4AE !important;
}

.pui-bg-blue-grey-400 {
  color: #fff !important;
  border-color: #78909C !important;
  background-color: #78909C !important;
}

.pui-text-blue-grey-400 {
  color: #78909C !important;
}

.pui-border-blue-grey-400 {
  border-color: #78909C !important;
}

.pui-bg-blue-grey, .pui-bg-blue-grey-500 {
  color: #fff !important;
  border-color: #607D8B !important;
  background-color: #607D8B !important;
}

.pui-text-blue-grey, .pui-text-blue-grey-500 {
  color: #607D8B !important;
}

.pui-border-blue-grey, .pui-border-blue-grey-500 {
  border-color: #607D8B !important;
}

.pui-bg-blue-grey-600 {
  color: #fff !important;
  border-color: #546E7A !important;
  background-color: #546E7A !important;
}

.pui-text-blue-grey-600 {
  color: #546E7A !important;
}

.pui-border-blue-grey-600 {
  border-color: #546E7A !important;
}

.pui-bg-blue-grey-700 {
  color: #fff !important;
  border-color: #455A64 !important;
  background-color: #455A64 !important;
}

.pui-text-blue-grey-700 {
  color: #455A64 !important;
}

.pui-border-blue-grey-700 {
  border-color: #455A64 !important;
}

.pui-bg-blue-grey-800 {
  color: #fff !important;
  border-color: #37474F !important;
  background-color: #37474F !important;
}

.pui-text-blue-grey-800 {
  color: #37474F !important;
}

.pui-border-blue-grey-800 {
  border-color: #37474F !important;
}

.pui-bg-blue-grey-900 {
  color: #fff !important;
  border-color: #263238 !important;
  background-color: #263238 !important;
}

.pui-text-blue-grey-900 {
  color: #263238 !important;
}

.pui-border-blue-grey-900 {
  border-color: #263238 !important;
}

.pui-bg-black, .pui-bg-black-500 {
  color: #fff !important;
  border-color: #000000 !important;
  background-color: #000000 !important;
}

.pui-text-black, .pui-text-black-500 {
  color: #000000 !important;
}

.pui-border-black, .pui-border-black-500 {
  border-color: #000000 !important;
}

.pui-bg-white, .pui-bg-white-500 {
  color: #fff !important;
  border-color: #FFFFFF !important;
  background-color: #FFFFFF !important;
}

.pui-text-white, .pui-text-white-500 {
  color: #FFFFFF !important;
}

.pui-border-white, .pui-border-white-500 {
  border-color: #FFFFFF !important;
}

.pui-white, .pui-white-500 {
  color: #666 !important;
}

.pui-user-unselect {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* headers */
h1, h2, h3, h4, h5, h6, .pui-h1, .pui-h2, .pui-h3, .pui-h4, .pui-h5, .pui-h6 {
  margin-bottom: 10px;
  margin-bottom: 1rem;
  font-family: "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", STXihei, "华文细黑", STHeiti, "Helvetica Neue", Helvetica, Tahoma, "Droid Sans", "wenquanyi micro hei", Heiti, "黑体";
}

.pui-h1, h1 {
  font-size: 30px;
  font-size: 3rem;
}

.pui-h2, h2 {
  font-size: 24px;
  font-size: 2.4rem;
}

.pui-h3, h3 {
  font-size: 18px;
  font-size: 1.8rem;
}

.pui-h4, h4 {
  font-size: 18px;
  font-size: 1.8rem;
}

.pui-h5, h5 {
  font-size: 16px;
  font-size: 1.6rem;
}

.pui-h6, h6 {
  font-size: 14px;
  font-size: 1.4rem;
}

/* font-size */
.pui-f12 {
  font-size: 1.2 rem !important;
}

.pui-f13 {
  font-size: 1.3 rem !important;
}

.pui-f14 {
  font-size: 1.4 rem !important;
}

.pui-f15 {
  font-size: 1.5 rem !important;
}

.pui-f16 {
  font-size: 1.6 rem !important;
}

.pui-f17 {
  font-size: 1.7 rem !important;
}

.pui-f18 {
  font-size: 1.8 rem !important;
}

.pui-f19 {
  font-size: 1.9 rem !important;
}

.pui-f20 {
  font-size: 2 rem !important;
}

.pui-f21 {
  font-size: 2.1 rem !important;
}

.pui-f22 {
  font-size: 2.2 rem !important;
}

.pui-f23 {
  font-size: 2.3 rem !important;
}

.pui-f24 {
  font-size: 2.4 rem !important;
}

.pui-f25 {
  font-size: 2.5 rem !important;
}

.pui-f26 {
  font-size: 2.6 rem !important;
}

.pui-f27 {
  font-size: 2.7 rem !important;
}

.pui-f28 {
  font-size: 2.8 rem !important;
}

.pui-f29 {
  font-size: 2.9 rem !important;
}

.pui-f30 {
  font-size: 3 rem !important;
}

.pui-f31 {
  font-size: 3.1 rem !important;
}

.pui-f32 {
  font-size: 3.2 rem !important;
}

.pui-f33 {
  font-size: 3.3 rem !important;
}

.pui-f34 {
  font-size: 3.4 rem !important;
}

.pui-f35 {
  font-size: 3.5 rem !important;
}

.pui-f36 {
  font-size: 3.6 rem !important;
}

.pui-f37 {
  font-size: 3.7 rem !important;
}

.pui-f38 {
  font-size: 3.8 rem !important;
}

.pui-f39 {
  font-size: 3.9 rem !important;
}

.pui-f40 {
  font-size: 4 rem !important;
}

.pui-f41 {
  font-size: 4.1 rem !important;
}

.pui-f42 {
  font-size: 4.2 rem !important;
}

.pui-f43 {
  font-size: 4.3 rem !important;
}

.pui-f44 {
  font-size: 4.4 rem !important;
}

.pui-f45 {
  font-size: 4.5 rem !important;
}

.pui-f46 {
  font-size: 4.6 rem !important;
}

.pui-f47 {
  font-size: 4.7 rem !important;
}

.pui-f48 {
  font-size: 4.8 rem !important;
}

/* font family */
.pui-font-serif {
  font-fmaily: serif, "宋体" !important;
}

.pui-font-arial {
  font-fmaily: Arial, sans-serif, "宋体" !important;
}

.pui-font-shongti {
  font-fmaily: SimSun, "宋体" !important;
}

.pui-font-sans-serif {
  font-fmaily: sans-serif, "宋体" !important;
}

.pui-font-monospace {
  font-fmaily: monospace !important;
}

.pui-font-consolas {
  font-fmaily: consolas !important;
}

.pui-font-yahei {
  font-fmaily: Microsoft YaHei, "微软雅黑" !important;
}

.pui-font-kaiti {
  font-family: Kai, "Kaiti SC", "楷体", KaiTi,serif !important;
}

.pui-font-tahoma {
  font-family: Tahoma, Helvetica, Arial, "Helvetica Neue", sans-serif !important;
}

.pui-font-helvetica {
  font-family: Helvetica, "Helvetica Neue", Arial, Tahoma, sans-serif !important;
}

.pui-font-en {
  font-family: "OpenSansRegular", Helvetica, Tahoma, "Microsoft YaHei", Arial, SimSun, Heiti, sans-serif !important;
  font-weight: normal !important;
}

.pui-font-zh-cn {
  font-family: "Hiragino Sans GB", STXihei, "华文细黑", "Microsoft YaHei", "微软雅黑", "Droid Sans", "wenquanyi micro hei", Helvetica, Tahoma, Arial, SimSun, "宋体", Heiti, "黑体", sans-serif !important;
  font-weight: normal !important;
}

*.pui-font-open-sans-regular, .pui-font-open-sans-regular {
  font-family: 'OpenSansRegular' !important;
  font-weight: normal !important;
}

/* font weight */
.pui-font-normal, .pui-text-normal {
  font-weight: normal !important;
}

.pui-font-bold, .pui-text-bold {
  font-weight: bold !important;
}

.pui-font-bolder, .pui-text-bolder {
  font-weight: bolder !important;
}

.pui-font-lighter, .pui-text-lighter {
  font-weight: lighter !important;
}

/* text align */
.pui-text-left, .pui-text-left-all > * {
  text-align: left !important;
}

.pui-text-right, .pui-text-right-all > * {
  text-align: right !important;
}

.pui-text-center, .pui-text-center-all > * {
  text-align: center !important;
}

.pui-text-justify, .pui-text-justify-all > * {
  text-align: justify !important;
}

.pui-text-top, .pui-vertical-top {
  vertical-align: top !important;
}

.pui-text-middle, .pui-vertical-middle {
  vertical-align: middle !important;
}

.pui-text-bottom, .pui-vertical-bottom {
  vertical-align: bottom !important;
}

/* text colors */
.pui-text-none {
  color: none !important;
}

.pui-text-white {
  color: white !important;
}

.pui-text-red {
  color: red !important;
}

.pui-text-green {
  color: green !important;
}

.pui-text-orange {
  color: orange !important;
}

.pui-text-gray {
  color: gray !important;
}

.pui-text-black {
  color: black !important;
}

.pui-text-yellow {
  color: yellow !important;
}

.pui-text-purple {
  color: purple !important;
}

.pui-text-brown {
  color: brown !important;
}

.pui-text-beige {
  color: beige !important;
}

.pui-text-khaki {
  color: khaki !important;
}

.pui-text-navy {
  color: navy !important;
}

.pui-text-pink {
  color: pink !important;
}

.pui-text-plum {
  color: plum !important;
}

.pui-text-teal {
  color: teal !important;
}

.pui-text-aqua {
  color: aqua !important;
}

.pui-text-silver {
  color: silver !important;
}

.pui-text-fuchsia {
  color: fuchsia !important;
}

.pui-text-maroon {
  color: maroon !important;
}

.pui-text-olive {
  color: olive !important;
}

.pui-text-lime {
  color: lime !important;
}

.pui-text-gary {
  color: #DDDDDD !important;
}

.pui-text-primary {
  color: #008EE5 !important;
}

.pui-text-secondary {
  color: #3BB4F2 !important;
}

.pui-text-info {
  color: #2EAAC6 !important;
}

.pui-text-success {
  color: #71B472 !important;
}

.pui-text-warning {
  color: #FFB74D !important;
}

.pui-text-error {
  color: #E87467 !important;
}

.pui-text-indent {
  text-indent: 21pt;
}

/* text/font size */
.pui-text-xxs {
  font-size: 10px !important;
  font-size: 1rem !important;
}

.pui-text-xs {
  font-size: 12px !important;
  font-size: 1.2rem !important;
}

.pui-text-sm {
  font-size: 14px !important;
  font-size: 1.4rem !important;
}

.pui-text-md {
  font-size: 16px !important;
  font-size: 1.6rem !important;
}

.pui-text-lg {
  font-size: 18px !important;
  font-size: 1.8rem !important;
}

.pui-text-xl {
  font-size: 20px !important;
  font-size: 2rem !important;
}

.pui-text-xxl {
  font-size: 24px !important;
  font-size: 2.4rem !important;
}

.pui-text-xxxl {
  font-size: 32px !important;
  font-size: 3.2rem !important;
}

.pui-text-xxxxl {
  font-size: 40px !important;
  font-size: 4rem !important;
}

.pui-text-xxxxxl {
  font-size: 48px !important;
  font-size: 4.8rem !important;
}

/* text other */
.pui-text-shadow {
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4) !important;
}

.pui-text-shadow-white {
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.4) !important;
}

.pui-text-shadow-none {
  text-shadow: none !important;
}

.pui-text-shadow-gary {
  text-shadow: 0 1px 1px rgba(221, 221, 221, 0.4) !important;
}

.pui-text-shadow-primary {
  text-shadow: 0 1px 1px rgba(0, 142, 229, 0.4) !important;
}

.pui-text-shadow-secondary {
  text-shadow: 0 1px 1px rgba(59, 180, 242, 0.4) !important;
}

.pui-text-shadow-info {
  text-shadow: 0 1px 1px rgba(46, 170, 198, 0.4) !important;
}

.pui-text-shadow-success {
  text-shadow: 0 1px 1px rgba(113, 180, 114, 0.4) !important;
}

.pui-text-shadow-warning {
  text-shadow: 0 1px 1px rgba(255, 183, 77, 0.4) !important;
}

.pui-text-shadow-error {
  text-shadow: 0 1px 1px rgba(232, 116, 103, 0.4) !important;
}

.pui-text-nowrap {
  white-space: nowrap !important;
}

.pui-word-break {
  -ms-word-break: break-all !important;
  word-break: break-all !important;
  word-wrap: break-word !important;
}

.pui-text-lowercase {
  text-transform: lowercase !important;
}

.pui-text-uppercase {
  text-transform: uppercase !important;
}

.pui-text-capitalize {
  text-transform: capitalize !important;
}

.pui-text-none {
  text-transform: none !important;
}

.pui-text-ellipsis {
  overflow: hidden !important;
  word-wrap: normal !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

/* border colors */
.pui-border-gary {
  border-color: #DDDDDD !important;
}

.pui-border-primary {
  border-color: #008EE5 !important;
}

.pui-border-secondary {
  border-color: #3BB4F2 !important;
}

.pui-border-info {
  border-color: #2EAAC6 !important;
}

.pui-border-success {
  border-color: #71B472 !important;
}

.pui-border-warning {
  border-color: #FFB74D !important;
}

.pui-border-error {
  border-color: #E87467 !important;
}

.pui-border-none {
  border-color: none !important;
}

.pui-border-white {
  border-color: white !important;
}

.pui-border-red {
  border-color: red !important;
}

.pui-border-green {
  border-color: green !important;
}

.pui-border-orange {
  border-color: orange !important;
}

.pui-border-gray {
  border-color: gray !important;
}

.pui-border-black {
  border-color: black !important;
}

.pui-border-yellow {
  border-color: yellow !important;
}

.pui-border-purple {
  border-color: purple !important;
}

.pui-border-brown {
  border-color: brown !important;
}

.pui-border-beige {
  border-color: beige !important;
}

.pui-border-khaki {
  border-color: khaki !important;
}

.pui-border-navy {
  border-color: navy !important;
}

.pui-border-pink {
  border-color: pink !important;
}

.pui-border-plum {
  border-color: plum !important;
}

.pui-border-teal {
  border-color: teal !important;
}

.pui-border-aqua {
  border-color: aqua !important;
}

.pui-border-silver {
  border-color: silver !important;
}

.pui-border-fuchsia {
  border-color: fuchsia !important;
}

.pui-border-maroon {
  border-color: maroon !important;
}

.pui-border-olive {
  border-color: olive !important;
}

.pui-border-lime {
  border-color: lime !important;
}

/* border none */
.pui-border-none, .pui-unbordered, .pui-unbordered-all > * {
  border: none !important;
}

.pui-border-top-none {
  border-top: none !important;
}

.pui-border-right-none {
  border-right: none !important;
}

.pui-border-bottom-none {
  border-bottom: none !important;
}

.pui-border-left-none {
  border-left: none !important;
}

/* border 1px */
.pui-border-1px {
  border: 1px solid #ddd !important;
}

.pui-border-dashed-1px {
  border: 1px dashed #ddd !important;
}

.pui-border-left-1px {
  border-left: 1px solid #ddd !important;
}

.pui-border-left-dashed-1px {
  border-left: 1px dashed #ddd !important;
}

.pui-border-right-1px {
  border-right: 1px solid #ddd !important;
}

.pui-border-right-dashed-1px {
  border-right: 1px dashed #ddd !important;
}

.pui-border-top-1px {
  border-top: 1px solid #ddd !important;
}

.pui-border-top-dashed-1px {
  border-top: 1px dashed #ddd !important;
}

.pui-border-bottom-1px {
  border-bottom: 1px solid #ddd !important;
}

.pui-border-bottom-dashed-1px {
  border-bottom: 1px dashed #ddd !important;
}

/* border styles */
.pui-border-dotted {
  border-style: dotted !important;
}

.pui-border-top-dotted {
  border-top-style: dotted !important;
}

.pui-border-right-dotted {
  border-right-style: dotted !important;
}

.pui-border-bottom-dotted {
  border-bottom-style: dotted !important;
}

.pui-border-left-dotted {
  border-left-style: dotted !important;
}

.pui-border-dashed {
  border-style: dashed !important;
}

.pui-border-top-dashed {
  border-top-style: dashed !important;
}

.pui-border-right-dashed {
  border-right-style: dashed !important;
}

.pui-border-bottom-dashed {
  border-bottom-style: dashed !important;
}

.pui-border-left-dashed {
  border-left-style: dashed !important;
}

.pui-border-solid {
  border-style: solid !important;
}

.pui-border-top-solid {
  border-top-style: solid !important;
}

.pui-border-right-solid {
  border-right-style: solid !important;
}

.pui-border-bottom-solid {
  border-bottom-style: solid !important;
}

.pui-border-left-solid {
  border-left-style: solid !important;
}

.pui-border-double {
  border-style: double !important;
}

.pui-border-top-double {
  border-top-style: double !important;
}

.pui-border-right-double {
  border-right-style: double !important;
}

.pui-border-bottom-double {
  border-bottom-style: double !important;
}

.pui-border-left-double {
  border-left-style: double !important;
}

/* border transparent */
.pui-border-transparent {
  border-color: transparent !important;
}

.pui-border-left-transparent {
  border-left-color: transparent !important;
}

.pui-border-right-transparent {
  border-right-color: transparent !important;
}

.pui-border-top-transparent {
  border-top-color: transparent !important;
}

.pui-border-bottom-transparent {
  border-bottom-color: transparent !important;
}

/* border-radius */
.pui-circle, .pui-circle-all > *, .pui-round, .pui-round-all > * {
  text-align: center;
  -webkit-border-radius: 500px !important;
  border-radius: 500px !important;
}

.pui-square, .pui-square-all > * {
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important;
}

.pui-ellipse {
  text-align: center !important;
  -webkit-border-radius: 100% !important;
  border-radius: 100% !important;
}

.pui-radius-none, .pui-square, .pui-square-all > * {
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important;
}

.pui-radius, .pui-radius-all > * {
  -webkit-border-radius: 4px !important;
  border-radius: 4px !important;
}

.pui-radius-tr-none {
  -webkit-border-top-right-radius: 0 !important;
  border-top-right-radius: 0 !important;
}

.pui-radius-tl-none {
  -webkit-border-top-left-radius: 0 !important;
  border-top-left-radius: 0 !important;
}

.pui-radius-br-none {
  -webkit-border-bottom-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.pui-radius-bl-none {
  -webkit-border-bottom-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.pui-browsehappy {
  color: #fff;
  background: #FFA726;
  position: fixed;
  *position: absolute;
  text-align: center;
  padding: 4px 0 5px;
}

.pui-browsehappy .pui-close {
  color: #fff;
  float: right;
  padding: 10px;
}

/* ================  Layouts  ================ */
/* Layout */
.pui-layout, .pui-full-width {
  width: 100%;
}

.pui-grid, .pui-row, .pui-container, .pui-layout, .pui-full-width {
  margin: 0 auto;
}

.pui-grid:before, .pui-grid:after, .pui-row:before, .pui-row:after, .pui-container:before, .pui-container:after, .pui-layout:before, .pui-layout:after, .pui-full-width:before, .pui-full-width:after {
  content: " ";
  display: table;
}

.pui-grid:after, .pui-row:after, .pui-container:after, .pui-layout:after, .pui-full-width:after {
  clear: both;
}

.pui-container {
  padding: 0;
}

.pui-grid {
  position: relative;
  list-style: none;
  background: transparent;
}

.pui-grid > * > :last-child, .pui-grid > .pui-row:last-child {
  margin-bottom: 0;
}

.pui-row {
  position: relative;
  margin: 0 -10px 20px -10px;
  margin: 0 -1rem 2rem -1rem;
}

.pui-row:before, .pui-row:after {
  display: table;
  content: " ";
}

.pui-row:after {
  clear: both;
}

.pui-row:last-child {
  margin-bottom: 0;
}

[class*=pui-grid-] {
  float: left;
  padding: 0 10px;
  padding: 0 1rem;
  position: relative;
  min-height: 1px;
}

/* grids */
.pui-grid-xs-1 {
  width: 8.33333%;
}

.pui-grid-xs-2 {
  width: 16.66667%;
}

.pui-grid-xs-3 {
  width: 25%;
}

.pui-grid-xs-4 {
  width: 33.33333%;
}

.pui-grid-xs-5 {
  width: 41.66667%;
}

.pui-grid-xs-6 {
  width: 50%;
}

.pui-grid-xs-7 {
  width: 58.33333%;
}

.pui-grid-xs-8 {
  width: 66.66667%;
}

.pui-grid-xs-9 {
  width: 75%;
}

.pui-grid-xs-10 {
  width: 83.33333%;
}

.pui-grid-xs-11 {
  width: 91.66667%;
}

.pui-grid-xs-12 {
  width: 100%;
}

.pui-grid-xs-offset-0 {
  margin-left: 0%;
}

.pui-grid-xs-push-0 {
  left: 0%;
}

.pui-grid-xs-pull-0 {
  right: 0%;
}

.pui-grid-xs-offset-1 {
  margin-left: 8.33333%;
}

.pui-grid-xs-push-1 {
  left: 8.33333%;
}

.pui-grid-xs-pull-1 {
  right: 8.33333%;
}

.pui-grid-xs-offset-2 {
  margin-left: 16.66667%;
}

.pui-grid-xs-push-2 {
  left: 16.66667%;
}

.pui-grid-xs-pull-2 {
  right: 16.66667%;
}

.pui-grid-xs-offset-3 {
  margin-left: 25%;
}

.pui-grid-xs-push-3 {
  left: 25%;
}

.pui-grid-xs-pull-3 {
  right: 25%;
}

.pui-grid-xs-offset-4 {
  margin-left: 33.33333%;
}

.pui-grid-xs-push-4 {
  left: 33.33333%;
}

.pui-grid-xs-pull-4 {
  right: 33.33333%;
}

.pui-grid-xs-offset-5 {
  margin-left: 41.66667%;
}

.pui-grid-xs-push-5 {
  left: 41.66667%;
}

.pui-grid-xs-pull-5 {
  right: 41.66667%;
}

.pui-grid-xs-offset-6 {
  margin-left: 50%;
}

.pui-grid-xs-push-6 {
  left: 50%;
}

.pui-grid-xs-pull-6 {
  right: 50%;
}

.pui-grid-xs-offset-7 {
  margin-left: 58.33333%;
}

.pui-grid-xs-push-7 {
  left: 58.33333%;
}

.pui-grid-xs-pull-7 {
  right: 58.33333%;
}

.pui-grid-xs-offset-8 {
  margin-left: 66.66667%;
}

.pui-grid-xs-push-8 {
  left: 66.66667%;
}

.pui-grid-xs-pull-8 {
  right: 66.66667%;
}

.pui-grid-xs-offset-9 {
  margin-left: 75%;
}

.pui-grid-xs-push-9 {
  left: 75%;
}

.pui-grid-xs-pull-9 {
  right: 75%;
}

.pui-grid-xs-offset-10 {
  margin-left: 83.33333%;
}

.pui-grid-xs-push-10 {
  left: 83.33333%;
}

.pui-grid-xs-pull-10 {
  right: 83.33333%;
}

.pui-grid-xs-offset-11 {
  margin-left: 91.66667%;
}

.pui-grid-xs-push-11 {
  left: 91.66667%;
}

.pui-grid-xs-pull-11 {
  right: 91.66667%;
}

.pui-row > [class*="pui-grid-"].pui-grid-xs-uncentered {
  float: left;
  clear: none;
  margin: 0;
  padding: 0 1rem;
}

.pui-row > [class*="pui-grid-"].pui-grid-xs-center {
  padding: 0;
  float: none;
  clear: both;
  margin: 0 auto;
}

@media (min-width: 640px) {
  .pui-grid-sm-1 {
    width: 8.33333%;
  }
  .pui-grid-sm-2 {
    width: 16.66667%;
  }
  .pui-grid-sm-3 {
    width: 25%;
  }
  .pui-grid-sm-4 {
    width: 33.33333%;
  }
  .pui-grid-sm-5 {
    width: 41.66667%;
  }
  .pui-grid-sm-6 {
    width: 50%;
  }
  .pui-grid-sm-7 {
    width: 58.33333%;
  }
  .pui-grid-sm-8 {
    width: 66.66667%;
  }
  .pui-grid-sm-9 {
    width: 75%;
  }
  .pui-grid-sm-10 {
    width: 83.33333%;
  }
  .pui-grid-sm-11 {
    width: 91.66667%;
  }
  .pui-grid-sm-12 {
    width: 100%;
  }
  .pui-grid-sm-offset-0 {
    margin-left: 0%;
  }
  .pui-grid-sm-push-0 {
    left: 0%;
  }
  .pui-grid-sm-pull-0 {
    right: 0%;
  }
  .pui-grid-sm-offset-1 {
    margin-left: 8.33333%;
  }
  .pui-grid-sm-push-1 {
    left: 8.33333%;
  }
  .pui-grid-sm-pull-1 {
    right: 8.33333%;
  }
  .pui-grid-sm-offset-2 {
    margin-left: 16.66667%;
  }
  .pui-grid-sm-push-2 {
    left: 16.66667%;
  }
  .pui-grid-sm-pull-2 {
    right: 16.66667%;
  }
  .pui-grid-sm-offset-3 {
    margin-left: 25%;
  }
  .pui-grid-sm-push-3 {
    left: 25%;
  }
  .pui-grid-sm-pull-3 {
    right: 25%;
  }
  .pui-grid-sm-offset-4 {
    margin-left: 33.33333%;
  }
  .pui-grid-sm-push-4 {
    left: 33.33333%;
  }
  .pui-grid-sm-pull-4 {
    right: 33.33333%;
  }
  .pui-grid-sm-offset-5 {
    margin-left: 41.66667%;
  }
  .pui-grid-sm-push-5 {
    left: 41.66667%;
  }
  .pui-grid-sm-pull-5 {
    right: 41.66667%;
  }
  .pui-grid-sm-offset-6 {
    margin-left: 50%;
  }
  .pui-grid-sm-push-6 {
    left: 50%;
  }
  .pui-grid-sm-pull-6 {
    right: 50%;
  }
  .pui-grid-sm-offset-7 {
    margin-left: 58.33333%;
  }
  .pui-grid-sm-push-7 {
    left: 58.33333%;
  }
  .pui-grid-sm-pull-7 {
    right: 58.33333%;
  }
  .pui-grid-sm-offset-8 {
    margin-left: 66.66667%;
  }
  .pui-grid-sm-push-8 {
    left: 66.66667%;
  }
  .pui-grid-sm-pull-8 {
    right: 66.66667%;
  }
  .pui-grid-sm-offset-9 {
    margin-left: 75%;
  }
  .pui-grid-sm-push-9 {
    left: 75%;
  }
  .pui-grid-sm-pull-9 {
    right: 75%;
  }
  .pui-grid-sm-offset-10 {
    margin-left: 83.33333%;
  }
  .pui-grid-sm-push-10 {
    left: 83.33333%;
  }
  .pui-grid-sm-pull-10 {
    right: 83.33333%;
  }
  .pui-grid-sm-offset-11 {
    margin-left: 91.66667%;
  }
  .pui-grid-sm-push-11 {
    left: 91.66667%;
  }
  .pui-grid-sm-pull-11 {
    right: 91.66667%;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-sm-uncentered {
    float: left;
    clear: none;
    margin: 0;
    padding: 0 1rem;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-sm-center {
    padding: 0;
    float: none;
    clear: both;
    margin: 0 auto;
  }
}

@media (min-width: 768px) {
  .pui-grid-md-1 {
    width: 8.33333%;
  }
  .pui-grid-md-2 {
    width: 16.66667%;
  }
  .pui-grid-md-3 {
    width: 25%;
  }
  .pui-grid-md-4 {
    width: 33.33333%;
  }
  .pui-grid-md-5 {
    width: 41.66667%;
  }
  .pui-grid-md-6 {
    width: 50%;
  }
  .pui-grid-md-7 {
    width: 58.33333%;
  }
  .pui-grid-md-8 {
    width: 66.66667%;
  }
  .pui-grid-md-9 {
    width: 75%;
  }
  .pui-grid-md-10 {
    width: 83.33333%;
  }
  .pui-grid-md-11 {
    width: 91.66667%;
  }
  .pui-grid-md-12 {
    width: 100%;
  }
  .pui-grid-md-offset-0 {
    margin-left: 0%;
  }
  .pui-grid-md-push-0 {
    left: 0%;
  }
  .pui-grid-md-pull-0 {
    right: 0%;
  }
  .pui-grid-md-offset-1 {
    margin-left: 8.33333%;
  }
  .pui-grid-md-push-1 {
    left: 8.33333%;
  }
  .pui-grid-md-pull-1 {
    right: 8.33333%;
  }
  .pui-grid-md-offset-2 {
    margin-left: 16.66667%;
  }
  .pui-grid-md-push-2 {
    left: 16.66667%;
  }
  .pui-grid-md-pull-2 {
    right: 16.66667%;
  }
  .pui-grid-md-offset-3 {
    margin-left: 25%;
  }
  .pui-grid-md-push-3 {
    left: 25%;
  }
  .pui-grid-md-pull-3 {
    right: 25%;
  }
  .pui-grid-md-offset-4 {
    margin-left: 33.33333%;
  }
  .pui-grid-md-push-4 {
    left: 33.33333%;
  }
  .pui-grid-md-pull-4 {
    right: 33.33333%;
  }
  .pui-grid-md-offset-5 {
    margin-left: 41.66667%;
  }
  .pui-grid-md-push-5 {
    left: 41.66667%;
  }
  .pui-grid-md-pull-5 {
    right: 41.66667%;
  }
  .pui-grid-md-offset-6 {
    margin-left: 50%;
  }
  .pui-grid-md-push-6 {
    left: 50%;
  }
  .pui-grid-md-pull-6 {
    right: 50%;
  }
  .pui-grid-md-offset-7 {
    margin-left: 58.33333%;
  }
  .pui-grid-md-push-7 {
    left: 58.33333%;
  }
  .pui-grid-md-pull-7 {
    right: 58.33333%;
  }
  .pui-grid-md-offset-8 {
    margin-left: 66.66667%;
  }
  .pui-grid-md-push-8 {
    left: 66.66667%;
  }
  .pui-grid-md-pull-8 {
    right: 66.66667%;
  }
  .pui-grid-md-offset-9 {
    margin-left: 75%;
  }
  .pui-grid-md-push-9 {
    left: 75%;
  }
  .pui-grid-md-pull-9 {
    right: 75%;
  }
  .pui-grid-md-offset-10 {
    margin-left: 83.33333%;
  }
  .pui-grid-md-push-10 {
    left: 83.33333%;
  }
  .pui-grid-md-pull-10 {
    right: 83.33333%;
  }
  .pui-grid-md-offset-11 {
    margin-left: 91.66667%;
  }
  .pui-grid-md-push-11 {
    left: 91.66667%;
  }
  .pui-grid-md-pull-11 {
    right: 91.66667%;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-md-uncentered {
    float: left;
    clear: none;
    margin: 0;
    padding: 0 1rem;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-md-center {
    padding: 0;
    float: none;
    clear: both;
    margin: 0 auto;
  }
}

@media (min-width: 992px) {
  .pui-grid-lg-1 {
    width: 8.33333%;
  }
  .pui-grid-lg-2 {
    width: 16.66667%;
  }
  .pui-grid-lg-3 {
    width: 25%;
  }
  .pui-grid-lg-4 {
    width: 33.33333%;
  }
  .pui-grid-lg-5 {
    width: 41.66667%;
  }
  .pui-grid-lg-6 {
    width: 50%;
  }
  .pui-grid-lg-7 {
    width: 58.33333%;
  }
  .pui-grid-lg-8 {
    width: 66.66667%;
  }
  .pui-grid-lg-9 {
    width: 75%;
  }
  .pui-grid-lg-10 {
    width: 83.33333%;
  }
  .pui-grid-lg-11 {
    width: 91.66667%;
  }
  .pui-grid-lg-12 {
    width: 100%;
  }
  .pui-grid-lg-offset-0 {
    margin-left: 0%;
  }
  .pui-grid-lg-push-0 {
    left: 0%;
  }
  .pui-grid-lg-pull-0 {
    right: 0%;
  }
  .pui-grid-lg-offset-1 {
    margin-left: 8.33333%;
  }
  .pui-grid-lg-push-1 {
    left: 8.33333%;
  }
  .pui-grid-lg-pull-1 {
    right: 8.33333%;
  }
  .pui-grid-lg-offset-2 {
    margin-left: 16.66667%;
  }
  .pui-grid-lg-push-2 {
    left: 16.66667%;
  }
  .pui-grid-lg-pull-2 {
    right: 16.66667%;
  }
  .pui-grid-lg-offset-3 {
    margin-left: 25%;
  }
  .pui-grid-lg-push-3 {
    left: 25%;
  }
  .pui-grid-lg-pull-3 {
    right: 25%;
  }
  .pui-grid-lg-offset-4 {
    margin-left: 33.33333%;
  }
  .pui-grid-lg-push-4 {
    left: 33.33333%;
  }
  .pui-grid-lg-pull-4 {
    right: 33.33333%;
  }
  .pui-grid-lg-offset-5 {
    margin-left: 41.66667%;
  }
  .pui-grid-lg-push-5 {
    left: 41.66667%;
  }
  .pui-grid-lg-pull-5 {
    right: 41.66667%;
  }
  .pui-grid-lg-offset-6 {
    margin-left: 50%;
  }
  .pui-grid-lg-push-6 {
    left: 50%;
  }
  .pui-grid-lg-pull-6 {
    right: 50%;
  }
  .pui-grid-lg-offset-7 {
    margin-left: 58.33333%;
  }
  .pui-grid-lg-push-7 {
    left: 58.33333%;
  }
  .pui-grid-lg-pull-7 {
    right: 58.33333%;
  }
  .pui-grid-lg-offset-8 {
    margin-left: 66.66667%;
  }
  .pui-grid-lg-push-8 {
    left: 66.66667%;
  }
  .pui-grid-lg-pull-8 {
    right: 66.66667%;
  }
  .pui-grid-lg-offset-9 {
    margin-left: 75%;
  }
  .pui-grid-lg-push-9 {
    left: 75%;
  }
  .pui-grid-lg-pull-9 {
    right: 75%;
  }
  .pui-grid-lg-offset-10 {
    margin-left: 83.33333%;
  }
  .pui-grid-lg-push-10 {
    left: 83.33333%;
  }
  .pui-grid-lg-pull-10 {
    right: 83.33333%;
  }
  .pui-grid-lg-offset-11 {
    margin-left: 91.66667%;
  }
  .pui-grid-lg-push-11 {
    left: 91.66667%;
  }
  .pui-grid-lg-pull-11 {
    right: 91.66667%;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-lg-uncentered {
    float: left;
    clear: none;
    margin: 0;
    padding: 0 1rem;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-lg-center {
    padding: 0;
    float: none;
    clear: both;
    margin: 0 auto;
  }
}

@media (min-width: 1200px) {
  .pui-grid-xl-1 {
    width: 8.33333%;
  }
  .pui-grid-xl-2 {
    width: 16.66667%;
  }
  .pui-grid-xl-3 {
    width: 25%;
  }
  .pui-grid-xl-4 {
    width: 33.33333%;
  }
  .pui-grid-xl-5 {
    width: 41.66667%;
  }
  .pui-grid-xl-6 {
    width: 50%;
  }
  .pui-grid-xl-7 {
    width: 58.33333%;
  }
  .pui-grid-xl-8 {
    width: 66.66667%;
  }
  .pui-grid-xl-9 {
    width: 75%;
  }
  .pui-grid-xl-10 {
    width: 83.33333%;
  }
  .pui-grid-xl-11 {
    width: 91.66667%;
  }
  .pui-grid-xl-12 {
    width: 100%;
  }
  .pui-grid-xl-offset-0 {
    margin-left: 0%;
  }
  .pui-grid-xl-push-0 {
    left: 0%;
  }
  .pui-grid-xl-pull-0 {
    right: 0%;
  }
  .pui-grid-xl-offset-1 {
    margin-left: 8.33333%;
  }
  .pui-grid-xl-push-1 {
    left: 8.33333%;
  }
  .pui-grid-xl-pull-1 {
    right: 8.33333%;
  }
  .pui-grid-xl-offset-2 {
    margin-left: 16.66667%;
  }
  .pui-grid-xl-push-2 {
    left: 16.66667%;
  }
  .pui-grid-xl-pull-2 {
    right: 16.66667%;
  }
  .pui-grid-xl-offset-3 {
    margin-left: 25%;
  }
  .pui-grid-xl-push-3 {
    left: 25%;
  }
  .pui-grid-xl-pull-3 {
    right: 25%;
  }
  .pui-grid-xl-offset-4 {
    margin-left: 33.33333%;
  }
  .pui-grid-xl-push-4 {
    left: 33.33333%;
  }
  .pui-grid-xl-pull-4 {
    right: 33.33333%;
  }
  .pui-grid-xl-offset-5 {
    margin-left: 41.66667%;
  }
  .pui-grid-xl-push-5 {
    left: 41.66667%;
  }
  .pui-grid-xl-pull-5 {
    right: 41.66667%;
  }
  .pui-grid-xl-offset-6 {
    margin-left: 50%;
  }
  .pui-grid-xl-push-6 {
    left: 50%;
  }
  .pui-grid-xl-pull-6 {
    right: 50%;
  }
  .pui-grid-xl-offset-7 {
    margin-left: 58.33333%;
  }
  .pui-grid-xl-push-7 {
    left: 58.33333%;
  }
  .pui-grid-xl-pull-7 {
    right: 58.33333%;
  }
  .pui-grid-xl-offset-8 {
    margin-left: 66.66667%;
  }
  .pui-grid-xl-push-8 {
    left: 66.66667%;
  }
  .pui-grid-xl-pull-8 {
    right: 66.66667%;
  }
  .pui-grid-xl-offset-9 {
    margin-left: 75%;
  }
  .pui-grid-xl-push-9 {
    left: 75%;
  }
  .pui-grid-xl-pull-9 {
    right: 75%;
  }
  .pui-grid-xl-offset-10 {
    margin-left: 83.33333%;
  }
  .pui-grid-xl-push-10 {
    left: 83.33333%;
  }
  .pui-grid-xl-pull-10 {
    right: 83.33333%;
  }
  .pui-grid-xl-offset-11 {
    margin-left: 91.66667%;
  }
  .pui-grid-xl-push-11 {
    left: 91.66667%;
  }
  .pui-grid-xl-pull-11 {
    right: 91.66667%;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-xl-uncentered {
    float: left;
    clear: none;
    margin: 0;
    padding: 0 1rem;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-xl-center {
    padding: 0;
    float: none;
    clear: both;
    margin: 0 auto;
  }
}

@media (min-width: 1400px) {
  .pui-grid-xxl-1 {
    width: 8.33333%;
  }
  .pui-grid-xxl-2 {
    width: 16.66667%;
  }
  .pui-grid-xxl-3 {
    width: 25%;
  }
  .pui-grid-xxl-4 {
    width: 33.33333%;
  }
  .pui-grid-xxl-5 {
    width: 41.66667%;
  }
  .pui-grid-xxl-6 {
    width: 50%;
  }
  .pui-grid-xxl-7 {
    width: 58.33333%;
  }
  .pui-grid-xxl-8 {
    width: 66.66667%;
  }
  .pui-grid-xxl-9 {
    width: 75%;
  }
  .pui-grid-xxl-10 {
    width: 83.33333%;
  }
  .pui-grid-xxl-11 {
    width: 91.66667%;
  }
  .pui-grid-xxl-12 {
    width: 100%;
  }
  .pui-grid-xxl-offset-0 {
    margin-left: 0%;
  }
  .pui-grid-xxl-push-0 {
    left: 0%;
  }
  .pui-grid-xxl-pull-0 {
    right: 0%;
  }
  .pui-grid-xxl-offset-1 {
    margin-left: 8.33333%;
  }
  .pui-grid-xxl-push-1 {
    left: 8.33333%;
  }
  .pui-grid-xxl-pull-1 {
    right: 8.33333%;
  }
  .pui-grid-xxl-offset-2 {
    margin-left: 16.66667%;
  }
  .pui-grid-xxl-push-2 {
    left: 16.66667%;
  }
  .pui-grid-xxl-pull-2 {
    right: 16.66667%;
  }
  .pui-grid-xxl-offset-3 {
    margin-left: 25%;
  }
  .pui-grid-xxl-push-3 {
    left: 25%;
  }
  .pui-grid-xxl-pull-3 {
    right: 25%;
  }
  .pui-grid-xxl-offset-4 {
    margin-left: 33.33333%;
  }
  .pui-grid-xxl-push-4 {
    left: 33.33333%;
  }
  .pui-grid-xxl-pull-4 {
    right: 33.33333%;
  }
  .pui-grid-xxl-offset-5 {
    margin-left: 41.66667%;
  }
  .pui-grid-xxl-push-5 {
    left: 41.66667%;
  }
  .pui-grid-xxl-pull-5 {
    right: 41.66667%;
  }
  .pui-grid-xxl-offset-6 {
    margin-left: 50%;
  }
  .pui-grid-xxl-push-6 {
    left: 50%;
  }
  .pui-grid-xxl-pull-6 {
    right: 50%;
  }
  .pui-grid-xxl-offset-7 {
    margin-left: 58.33333%;
  }
  .pui-grid-xxl-push-7 {
    left: 58.33333%;
  }
  .pui-grid-xxl-pull-7 {
    right: 58.33333%;
  }
  .pui-grid-xxl-offset-8 {
    margin-left: 66.66667%;
  }
  .pui-grid-xxl-push-8 {
    left: 66.66667%;
  }
  .pui-grid-xxl-pull-8 {
    right: 66.66667%;
  }
  .pui-grid-xxl-offset-9 {
    margin-left: 75%;
  }
  .pui-grid-xxl-push-9 {
    left: 75%;
  }
  .pui-grid-xxl-pull-9 {
    right: 75%;
  }
  .pui-grid-xxl-offset-10 {
    margin-left: 83.33333%;
  }
  .pui-grid-xxl-push-10 {
    left: 83.33333%;
  }
  .pui-grid-xxl-pull-10 {
    right: 83.33333%;
  }
  .pui-grid-xxl-offset-11 {
    margin-left: 91.66667%;
  }
  .pui-grid-xxl-push-11 {
    left: 91.66667%;
  }
  .pui-grid-xxl-pull-11 {
    right: 91.66667%;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-xxl-uncentered {
    float: left;
    clear: none;
    margin: 0;
    padding: 0 1rem;
  }
  .pui-row > [class*="pui-grid-"].pui-grid-xxl-center {
    padding: 0;
    float: none;
    clear: both;
    margin: 0 auto;
  }
}

.pui-row > [class*="pui-grid-"].pui-grid-uncentered {
  float: left;
  clear: none;
  margin: 0;
  padding: 0 10px;
  padding: 0 1rem;
}

.pui-row > [class*="pui-grid-"].pui-grid-center {
  padding: 0;
  float: none;
  clear: both;
  margin: 0 auto;
}

/* grid margin */
.pui-grid.pui-grid-margin-none {
  width: 100%;
  padding: 0;
}

.pui-grid.pui-grid-margin-none .pui-row {
  margin: 0;
  padding: 0;
}

.pui-grid.pui-grid-margin-none .pui-row > [class*=pui-grid-] {
  padding: 0;
}

.pui-grid.pui-grid-margin-lg {
  width: 100%;
  padding: 0;
}

.pui-grid.pui-grid-margin-lg .pui-row {
  padding: 0;
  margin: 0 -15px 30px -15px;
  margin: 0 -1.5rem 3rem -1.5rem;
}

.pui-grid.pui-grid-margin-lg .pui-row > [class*=pui-grid-] {
  padding: 0 15px;
  padding: 0 1.5rem;
}

.pui-grid.pui-grid-margin-lg .pui-row:last-child {
  margin-bottom: 0;
}

.pui-grid > .pui-row > [class*=pui-grid-] > .pui-row:last-child, .pui-grid > .pui-row:last-child {
  margin-bottom: 0;
}

/* Layout Responsives */
@media (max-width: 240px) {
  .pui-row > [class*=pui-grid-] {
    width: 100%;
  }
}

/* Responsives Display */
.pui-xs-show, .pui-sm-show, .pui-md-show, .pui-lg-show, .pui-xl-show, .pui-xxl-show,
.pui-xs-block, .pui-sm-block, .pui-md-block, .pui-lg-block, .pui-xl-block, .pui-xxl-block,
.pui-xs-inline, .pui-sm-inline, .pui-md-inline, .pui-lg-inline, .pui-xl-inline, .pui-xxl-inline,
.pui-xs-inline-block, .pui-sm-inline-block, .pui-md-inline-block, .pui-lg-inline-block, .pui-xl-inline-block, .pui-xxl-inline-block {
  display: none !important;
}

@media (max-width: 639px) {
  .pui-xs-show {
    display: block !important;
  }
  .pui-xs-hide {
    display: none !important;
  }
  .pui-xs-block {
    display: block !important;
  }
  .pui-xs-inline {
    display: inline !important;
  }
  .pui-xs-inline-block {
    display: inline-block !important;
  }
  table.pui-xs-show {
    display: table !important;
  }
  tr.pui-xs-show {
    display: table-row !important;
  }
  th.pui-xs-show, td.pui-xs-show {
    display: table-cell !important;
  }
  .pui-xs-float-left {
    float: left !important;
  }
  .pui-xs-float-right {
    float: right !important;
  }
  .pui-xs-float-none {
    float: none !important;
  }
}

@media (min-width: 640px) and (max-width: 767px) {
  .pui-sm-show {
    display: block !important;
  }
  .pui-sm-hide {
    display: none !important;
  }
  .pui-sm-block {
    display: block !important;
  }
  .pui-sm-inline {
    display: inline !important;
  }
  .pui-sm-inline-block {
    display: inline-block !important;
  }
  table.pui-sm-show {
    display: table !important;
  }
  tr.pui-sm-show {
    display: table-row !important;
  }
  th.pui-sm-show, td.pui-sm-show {
    display: table-cell !important;
  }
  .pui-sm-float-left {
    float: left !important;
  }
  .pui-sm-float-right {
    float: right !important;
  }
  .pui-sm-float-none {
    float: none !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .pui-md-show {
    display: block !important;
  }
  .pui-md-hide {
    display: none !important;
  }
  .pui-md-block {
    display: block !important;
  }
  .pui-md-inline {
    display: inline !important;
  }
  .pui-md-inline-block {
    display: inline-block !important;
  }
  table.pui-md-show {
    display: table !important;
  }
  tr.pui-md-show {
    display: table-row !important;
  }
  th.pui-md-show, td.pui-md-show {
    display: table-cell !important;
  }
  .pui-md-float-left {
    float: left !important;
  }
  .pui-md-float-right {
    float: right !important;
  }
  .pui-md-float-none {
    float: none !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .pui-lg-show {
    display: block !important;
  }
  .pui-lg-hide {
    display: none !important;
  }
  .pui-lg-block {
    display: block !important;
  }
  .pui-lg-inline {
    display: inline !important;
  }
  .pui-lg-inline-block {
    display: inline-block !important;
  }
  table.pui-lg-show {
    display: table !important;
  }
  tr.pui-lg-show {
    display: table-row !important;
  }
  th.pui-lg-show, td.pui-lg-show {
    display: table-cell !important;
  }
  .pui-lg-float-left {
    float: left !important;
  }
  .pui-lg-float-right {
    float: right !important;
  }
  .pui-lg-float-none {
    float: none !important;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .pui-xl-show {
    display: block !important;
  }
  .pui-xl-hide {
    display: none !important;
  }
  .pui-xl-block {
    display: block !important;
  }
  .pui-xl-inline {
    display: inline !important;
  }
  .pui-xl-inline-block {
    display: inline-block !important;
  }
  table.pui-xl-show {
    display: table !important;
  }
  tr.pui-xl-show {
    display: table-row !important;
  }
  th.pui-xl-show, td.pui-xl-show {
    display: table-cell !important;
  }
  .pui-xl-float-left {
    float: left !important;
  }
  .pui-xl-float-right {
    float: right !important;
  }
  .pui-xl-float-none {
    float: none !important;
  }
}

@media (min-width: 1400px) {
  .pui-xxl-show {
    display: block !important;
  }
  .pui-xxl-hide {
    display: none !important;
  }
  .pui-xxl-block {
    display: block !important;
  }
  .pui-xxl-inline {
    display: inline !important;
  }
  .pui-xxl-inline-block {
    display: inline-block !important;
  }
  table.pui-xxl-show {
    display: table !important;
  }
  tr.pui-xxl-show {
    display: table-row !important;
  }
  th.pui-xxl-show, td.pui-xxl-show {
    display: table-cell !important;
  }
  .pui-xxl-float-left {
    float: left !important;
  }
  .pui-xxl-float-right {
    float: right !important;
  }
  .pui-xxl-float-none {
    float: none !important;
  }
}

/* Layout fixed width */
@media (min-width: 992px) {
  .pui-layout-fixed, .pui-layout-fixed-960 {
    max-width: 960px;
  }
  .pui-layout-fixed-980 {
    max-width: 980px;
  }
}

@media (min-width: 1001px) {
  .pui-layout-fixed {
    max-width: 1000px;
  }
}

@media (min-width: 1200px) {
  .pui-layout-fixed-1200 {
    max-width: 1200px;
  }
}

@media (min-width: 1400px) {
  .pui-layout-fixed-1360 {
    max-width: 1360px;
  }
  .pui-layout-fixed-1400 {
    max-width: 1400px;
  }
}

@media (min-width: 1600px) {
  .pui-layout-fixed-1500 {
    max-width: 1500px;
  }
}

@media (min-width: 1900px) {
  .pui-layout-fixed-1600 {
    max-width: 1600px;
  }
  .pui-layout-fixed-1700 {
    max-width: 1700px;
  }
  .pui-layout-fixed-1800 {
    max-width: 1800px;
  }
}

.pui-flexbox {
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-flex {
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-flex-inline {
  -webkit-inline-flex: 1;
  /* Chrome 21.0+ */
  -moz-inline-flex: 1;
  -ms-inline-flex: 1;
  inline-flex: 1;
  /* Firefox 20+, Opera 12.5 */
}

.pui-inline-flexbox {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: -moz-inline-flex;
  display: inline-flex;
}

.pui-flex-row {
  -webkit-box-direction: normal;
  -webkit-box-orient: horizontal;
  -webkit-flex-direction: row;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  /* Firefox 28+, IE11, Opera 12.10 */
}

.pui-flex-row-reverse {
  -webkit-box-direction: reverse;
  -webkit-box-orient: horizontal;
  -webkit-flex-direction: row-reverse;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  /* Firefox 28+, IE11, Opera 12.10 */
}

.pui-flex-column {
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /* Firefox 28+, IE11, Opera 12.10 */
}

.pui-flex-column-reverse {
  -webkit-box-direction: reverse;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column-reverse;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: column-reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  /* Firefox 28+, IE11, Opera 12.10 */
}

.pui-flex-wrap {
  -webkit-flex-wrap: wrap;
  /* Safari 6.1+, Chrome 21.0+, Android 4.4+, iOS 7.0+ */
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  /* Firefox 28+, IE11, Opera 12.10 */
}

.pui-flex-nowrap {
  -webkit-flex-wrap: nowrap;
  /* Safari 6.1+, Chrome 21.0+, Android 4.4+, iOS 7.0+ */
  -moz-flex-wrap: nowrap;
  -ms-flex-wrap: none;
  flex-wrap: nowrap;
  /* Firefox 28+, IE11, Opera 12.10 */
}

/* ================  Other ================ */
/* Article */
.pui-article > header, .pui-article-head {
  margin-bottom: 15px;
  margin-bottom: 1.5rem;
}

.pui-article-title {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 8px;
  margin-bottom: 0.8rem;
}

.pui-article-subtitle {
  font-size: 12px;
  font-size: 1.2rem;
  color: #999;
}

.pui-article-content {
  padding: 1.5rem 0;
}

.pui-article > section {
  margin: 15px 0;
  margin: 1.5rem 0;
}

.pui-article footer, .pui-article-foot {
  margin-top: 15px;
  margin-top: 1.5rem;
}

.pui-article:before, .pui-article:after, .pui-article-content:before, .pui-article-content:after, .pui-article-head:before, .pui-article-head:after, .pui-article-foot:before, .pui-article-foot:after {
  content: " ";
  display: table;
}

.pui-article:after, .pui-article-content:after, .pui-article-head:after, .pui-article-foot:after {
  clear: both;
}

/* Animations & Transform */
[class*=pui-animation-] {
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  /* Firefox 5.0~16.0 */
  animation-duration: 0.5s;
  -webkit-animation-timing-function: ease-out;
  -moz-animation-timing-function: ease-out;
  /* Firefox 5.0~16.0 */
  animation-timing-function: ease-out;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.pui-animation-fade-in {
  -webkit-animation-name: fade-in;
  -moz-animation-name: fade-in;
  /* Firefox 5.0~16.0 */
  animation-name: fade-in;
}

@-webkit-keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

.pui-animation-fade-out {
  -webkit-animation-name: fade-out;
  -moz-animation-name: fade-out;
  /* Firefox 5.0~16.0 */
  animation-name: fade-out;
}

@-webkit-keyframes scale-x {
  0% {
    opacity: 0;
    -webkit-transform: scaleX(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: scaleX(1);
  }
}

@keyframes scale-x {
  0% {
    opacity: 0;
    transform: scaleX(0);
  }
  100% {
    opacity: 1;
    transform: scaleX(1);
  }
}

.pui-animation-scale-x {
  -webkit-animation-name: scale-x;
  -moz-animation-name: scale-x;
  /* Firefox 5.0~16.0 */
  animation-name: scale-x;
}

@-webkit-keyframes scale-y {
  0% {
    opacity: 1;
    -webkit-transform: scaleY(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scaleY(0);
  }
}

@keyframes scale-y {
  0% {
    opacity: 1;
    transform: scaleY(1);
  }
  100% {
    opacity: 0;
    transform: scaleY(0);
  }
}

.pui-animation-scale-y {
  -webkit-animation-name: scale-y;
  -moz-animation-name: scale-y;
  /* Firefox 5.0~16.0 */
  animation-name: scale-y;
}

@-webkit-keyframes zoom-in {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
  }
}

@keyframes zoom-in {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.pui-animation-zoom-in {
  -webkit-animation-name: zoom-in;
  -moz-animation-name: zoom-in;
  /* Firefox 5.0~16.0 */
  animation-name: zoom-in;
}

@-webkit-keyframes zoom-out {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0);
  }
}

@keyframes zoom-out {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0);
  }
}

.pui-animation-zoom-out {
  -webkit-animation-name: zoom-out;
  -moz-animation-name: zoom-out;
  /* Firefox 5.0~16.0 */
  animation-name: zoom-out;
}

@-webkit-keyframes slide-up {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}

@keyframes slide-up {
  0% {
    opacity: 0;
    transform: translateY(-100%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.pui-animation-slide-up {
  -webkit-animation-name: slide-up;
  -moz-animation-name: slide-up;
  /* Firefox 5.0~16.0 */
  animation-name: slide-up;
}

@-webkit-keyframes slide-down {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}

@keyframes slide-down {
  0% {
    opacity: 0;
    transform: translateY(100%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.pui-animation-slide-down {
  -webkit-animation-name: slide-down;
  -moz-animation-name: slide-down;
  /* Firefox 5.0~16.0 */
  animation-name: slide-down;
}

@-webkit-keyframes slide-left {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
  }
}

@keyframes slide-left {
  0% {
    opacity: 0;
    transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.pui-animation-slide-left {
  -webkit-animation-name: slide-left;
  -moz-animation-name: slide-left;
  /* Firefox 5.0~16.0 */
  animation-name: slide-left;
}

@-webkit-keyframes slide-right {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
  }
}

@keyframes slide-right {
  0% {
    opacity: 0;
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.pui-animation-slide-right {
  -webkit-animation-name: slide-right;
  -moz-animation-name: slide-right;
  /* Firefox 5.0~16.0 */
  animation-name: slide-right;
}

@-webkit-keyframes shaking {
  0%, 100% {
    -webkit-transform: translateX(0);
  }
  10% {
    -webkit-transform: translateX(-9%);
  }
  20% {
    -webkit-transform: translateX(8%);
  }
  30% {
    -webkit-transform: translateX(-7%);
  }
  40% {
    -webkit-transform: translateX(6%);
  }
  50% {
    -webkit-transform: translateX(-5%);
  }
  60% {
    -webkit-transform: translateX(4%);
  }
  70% {
    -webkit-transform: translateX(-3%);
  }
  80% {
    -webkit-transform: translateX(2%);
  }
  90% {
    -webkit-transform: translateX(-1%);
  }
}

@keyframes shaking {
  0%, 100% {
    transform: translateX(0);
  }
  10% {
    transform: translateX(-9%);
  }
  20% {
    transform: translateX(8%);
  }
  30% {
    transform: translateX(-7%);
  }
  40% {
    transform: translateX(6%);
  }
  50% {
    transform: translateX(-5%);
  }
  60% {
    transform: translateX(4%);
  }
  70% {
    transform: translateX(-3%);
  }
  80% {
    transform: translateX(2%);
  }
  90% {
    transform: translateX(-1%);
  }
}

.pui-animation-shaking {
  -webkit-animation-name: shaking;
  -moz-animation-name: shaking;
  /* Firefox 5.0~16.0 */
  animation-name: shaking;
}

.pui-animation-shaking-x {
  -webkit-animation-name: shaking;
  -moz-animation-name: shaking;
  /* Firefox 5.0~16.0 */
  animation-name: shaking;
}

@-webkit-keyframes shaking-y {
  0%, 100% {
    -webkit-transform: translateY(0);
  }
  10% {
    -webkit-transform: translateY(-9%);
  }
  20% {
    -webkit-transform: translateY(8%);
  }
  30% {
    -webkit-transform: translateY(-7%);
  }
  40% {
    -webkit-transform: translateY(6%);
  }
  50% {
    -webkit-transform: translateY(-5%);
  }
  60% {
    -webkit-transform: translateY(4%);
  }
  70% {
    -webkit-transform: translateY(-3%);
  }
  80% {
    -webkit-transform: translateY(2%);
  }
  90% {
    -webkit-transform: translateY(-1%);
  }
}

@keyframes shaking-y {
  0%, 100% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(-9%);
  }
  20% {
    transform: translateY(8%);
  }
  30% {
    transform: translateY(-7%);
  }
  40% {
    transform: translateY(6%);
  }
  50% {
    transform: translateY(-5%);
  }
  60% {
    transform: translateY(4%);
  }
  70% {
    transform: translateY(-3%);
  }
  80% {
    transform: translateY(2%);
  }
  90% {
    transform: translateY(-1%);
  }
}

.pui-animation-shaking-y {
  -webkit-animation-name: shaking-y;
  -moz-animation-name: shaking-y;
  /* Firefox 5.0~16.0 */
  animation-name: shaking-y;
}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(360deg);
  }
  100% {
    -webkit-transform: rotate(0);
  }
}

@keyframes rotate {
  0% {
    transform: rotate(360deg);
  }
  100% {
    transform: rotate(0);
  }
}

.pui-animation-rotate {
  -webkit-animation-name: rotate;
  -moz-animation-name: rotate;
  /* Firefox 5.0~16.0 */
  animation-name: rotate;
}

@-webkit-keyframes rotate-x {
  0% {
    -webkit-transform: rotateX(360deg);
  }
  100% {
    -webkit-transform: rotateX(0);
  }
}

@keyframes rotate-x {
  0% {
    transform: rotateX(360deg);
  }
  100% {
    transform: rotateX(0);
  }
}

.pui-animation-rotate-x {
  -webkit-animation-name: rotate-x;
  -moz-animation-name: rotate-x;
  /* Firefox 5.0~16.0 */
  animation-name: rotate-x;
}

@-webkit-keyframes rotate-y {
  0% {
    -webkit-transform: rotateY(360deg);
  }
  100% {
    -webkit-transform: rotateY(0);
  }
}

@keyframes rotate-y {
  0% {
    transform: rotateY(360deg);
  }
  100% {
    transform: rotateY(0);
  }
}

.pui-animation-rotate-y {
  -webkit-animation-name: rotate-y;
  -moz-animation-name: rotate-y;
  /* Firefox 5.0~16.0 */
  animation-name: rotate-y;
}

@-webkit-keyframes stretch-left {
  0% {
    -webkit-transform: scaleX(0.3);
  }
  40% {
    -webkit-transform: scaleX(1.02);
  }
  60% {
    -webkit-transform: scaleX(0.98);
  }
  80% {
    -webkit-transform: scaleX(1.01);
  }
  100% {
    -webkit-transform: scaleX(0.98);
  }
  80% {
    -webkit-transform: scaleX(1.01);
  }
  100% {
    -webkit-transform: scaleX(1);
  }
}

@keyframes stretch-left {
  0% {
    transform: scaleX(0.3);
  }
  40% {
    transform: scaleX(1.02);
  }
  60% {
    transform: scaleX(0.98);
  }
  80% {
    transform: scaleX(1.01);
  }
  100% {
    transform: scaleX(0.98);
  }
  80% {
    transform: scaleX(1.01);
  }
  100% {
    transform: scaleX(1);
  }
}

.pui-animation-stretch-left {
  -webkit-animation-name: stretch-left;
  -moz-animation-name: stretch-left;
  /* Firefox 5.0~16.0 */
  animation-name: stretch-left;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1s;
  -webkit-transform-origin: 100% 0%;
  -moz-transform-origin: 100% 0%;
  /* Firefox 3.5~16.0 */
  -ms-transform-origin: 100% 0%;
  /* IE9~10 */
  -o-transform-origin: 100% 0%;
  /* Opera 10.5~12.10 */
  transform-origin: 100% 0%;
}

@-webkit-keyframes stretch-right {
  0% {
    -webkit-transform: scaleX(0.3);
  }
  40% {
    -webkit-transform: scaleX(1.02);
  }
  60% {
    -webkit-transform: scaleX(0.98);
  }
  80% {
    -webkit-transform: scaleX(1.01);
  }
  100% {
    -webkit-transform: scaleX(0.98);
  }
  80% {
    -webkit-transform: scaleX(1.01);
  }
  100% {
    -webkit-transform: scaleX(1);
  }
}

@keyframes stretch-right {
  0% {
    transform: scaleX(0.3);
  }
  40% {
    transform: scaleX(1.02);
  }
  60% {
    transform: scaleX(0.98);
  }
  80% {
    transform: scaleX(1.01);
  }
  100% {
    transform: scaleX(0.98);
  }
  80% {
    transform: scaleX(1.01);
  }
  100% {
    transform: scaleX(1);
  }
}

.pui-animation-stretch-right {
  -webkit-animation-name: stretch-right;
  -moz-animation-name: stretch-right;
  /* Firefox 5.0~16.0 */
  animation-name: stretch-right;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1s;
  -webkit-transform-origin: 0% 0%;
  -moz-transform-origin: 0% 0%;
  /* Firefox 3.5~16.0 */
  -ms-transform-origin: 0% 0%;
  /* IE9~10 */
  -o-transform-origin: 0% 0%;
  /* Opera 10.5~12.10 */
  transform-origin: 0% 0%;
}

@-webkit-keyframes stretch-up {
  0% {
    -webkit-transform: scaleY(0.1);
  }
  40% {
    -webkit-transform: scaleY(1.02);
  }
  60% {
    -webkit-transform: scaleY(0.98);
  }
  80% {
    -webkit-transform: scaleY(1.01);
  }
  100% {
    -webkit-transform: scaleY(0.98);
  }
  80% {
    -webkit-transform: scaleY(1.01);
  }
  100% {
    -webkit-transform: scaleY(1);
  }
}

@keyframes stretch-up {
  0% {
    transform: scaleY(0.1);
  }
  40% {
    transform: scaleY(1.02);
  }
  60% {
    transform: scaleY(0.98);
  }
  80% {
    transform: scaleY(1.01);
  }
  100% {
    transform: scaleY(0.98);
  }
  80% {
    transform: scaleY(1.01);
  }
  100% {
    transform: scaleY(1);
  }
}

.pui-animation-stretch-up {
  -webkit-animation-name: stretch-up;
  -moz-animation-name: stretch-up;
  /* Firefox 5.0~16.0 */
  animation-name: stretch-up;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1s;
  -webkit-transform-origin: 0% 100%;
  -moz-transform-origin: 0% 100%;
  /* Firefox 3.5~16.0 */
  -ms-transform-origin: 0% 100%;
  /* IE9~10 */
  -o-transform-origin: 0% 100%;
  /* Opera 10.5~12.10 */
  transform-origin: 0% 100%;
}

@-webkit-keyframes stretch-down {
  0% {
    -webkit-transform: scaleY(0.1);
  }
  40% {
    -webkit-transform: scaleY(1.02);
  }
  60% {
    -webkit-transform: scaleY(0.98);
  }
  80% {
    -webkit-transform: scaleY(0.98);
  }
  100% {
    -webkit-transform: scaleY(0.98);
  }
  80% {
    -webkit-transform: scaleY(0.98);
  }
  100% {
    -webkit-transform: scaleY(1);
  }
}

@keyframes stretch-down {
  0% {
    transform: scaleY(0.1);
  }
  40% {
    transform: scaleY(1.02);
  }
  60% {
    transform: scaleY(0.98);
  }
  80% {
    transform: scaleY(0.98);
  }
  100% {
    transform: scaleY(0.98);
  }
  80% {
    transform: scaleY(0.98);
  }
  100% {
    transform: scaleY(1);
  }
}

.pui-animation-stretch-down {
  -webkit-animation-name: stretch-down;
  -moz-animation-name: stretch-down;
  /* Firefox 5.0~16.0 */
  animation-name: stretch-down;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1s;
  -webkit-transform-origin: 100% 0%;
  -moz-transform-origin: 100% 0%;
  /* Firefox 3.5~16.0 */
  -ms-transform-origin: 100% 0%;
  /* IE9~10 */
  -o-transform-origin: 100% 0%;
  /* Opera 10.5~12.10 */
  transform-origin: 100% 0%;
}

@-webkit-keyframes tossing {
  0% {
    -webkit-transform: rotate(-5deg);
  }
  50% {
    -webkit-transform: rotate(5deg);
  }
  100% {
    -webkit-transform: rotate(-5deg);
  }
}

@keyframes tossing {
  0% {
    transform: rotate(-5deg);
  }
  50% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(-5deg);
  }
}

.pui-animation-tossing {
  -webkit-animation-name: tossing;
  -moz-animation-name: tossing;
  /* Firefox 5.0~16.0 */
  animation-name: tossing;
  -webkit-animation-duration: 2.5s;
  -moz-animation-duration: 2.5s;
  /* Firefox 5.0~16.0 */
  animation-duration: 2.5s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  /* Firefox 5.0~16.0 */
  animation-iteration-count: infinite;
}

@-webkit-keyframes floating {
  0% {
    -webkit-transform: translateY(0%);
  }
  50% {
    -webkit-transform: translateY(8%);
  }
  100% {
    -webkit-transform: translateY(0%);
  }
}

@keyframes floating {
  0% {
    transform: translateY(0%);
  }
  50% {
    transform: translateY(8%);
  }
  100% {
    transform: translateY(0%);
  }
}

.pui-animation-floating {
  -webkit-animation-name: floating;
  -moz-animation-name: floating;
  /* Firefox 5.0~16.0 */
  animation-name: floating;
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  /* Firefox 5.0~16.0 */
  animation-iteration-count: infinite;
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(0.9);
    opacity: 0.7;
  }
  50% {
    -webkit-transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0.9);
    opacity: 0.7;
  }
}

@keyframes pulse {
  0% {
    transform: scale(0.9);
    opacity: 0.7;
  }
  50% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(0.9);
    opacity: 0.7;
  }
}

.pui-animation-pulse {
  -webkit-animation-name: pulse;
  -moz-animation-name: pulse;
  /* Firefox 5.0~16.0 */
  animation-name: pulse;
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  /* Firefox 5.0~16.0 */
  animation-iteration-count: infinite;
}

@-webkit-keyframes pulse-plus {
  0% {
    -webkit-transform: scale(0.8);
    opacity: 0.6;
  }
  50% {
    -webkit-transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0.8);
    opacity: 0.6;
  }
}

@keyframes pulse-plus {
  0% {
    transform: scale(0.8);
    opacity: 0.6;
  }
  50% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(0.8);
    opacity: 0.6;
  }
}

.pui-animation-pulse-plus {
  -webkit-animation-name: pulse-plus;
  -moz-animation-name: pulse-plus;
  /* Firefox 5.0~16.0 */
  animation-name: pulse-plus;
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  /* Firefox 5.0~16.0 */
  animation-iteration-count: infinite;
}

@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translateY(0%) scaleY(0.6);
  }
  60% {
    -webkit-transform: translateY(-100%) scaleY(1.1);
  }
  70% {
    -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1.05);
  }
  80% {
    -webkit-transform: translateY(0%) scaleY(1.05) scaleX(1);
  }
  90% {
    -webkit-transform: translateY(0%) scaleY(0.95) scaleX(1);
  }
  100% {
    -webkit-transform: translateY(0%) scaleY(1) scaleX(1);
  }
}

@keyframes bounce {
  0% {
    transform: translateY(0%) scaleY(0.6);
  }
  60% {
    transform: translateY(-100%) scaleY(1.1);
  }
  70% {
    transform: translateY(0%) scaleY(0.95) scaleX(1.05);
  }
  80% {
    transform: translateY(0%) scaleY(1.05) scaleX(1);
  }
  90% {
    transform: translateY(0%) scaleY(0.95) scaleX(1);
  }
  100% {
    transform: translateY(0%) scaleY(1) scaleX(1);
  }
}

.pui-animation-bounce {
  -webkit-animation-name: bounce;
  -moz-animation-name: bounce;
  /* Firefox 5.0~16.0 */
  animation-name: bounce;
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1.5s;
  -webkit-animation-timing-function: ease;
  -moz-animation-timing-function: ease;
  /* Firefox 5.0~16.0 */
  animation-timing-function: ease;
  -webkit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  /* Firefox 3.5~16.0 */
  -ms-transform-origin: 50% 100%;
  /* IE9~10 */
  -o-transform-origin: 50% 100%;
  /* Opera 10.5~12.10 */
  transform-origin: 50% 100%;
}

@-webkit-keyframes expand-in {
  0% {
    -webkit-transform: scale(1.8);
  }
  50% {
    -webkit-transform: scale(0.95);
  }
  80% {
    -webkit-transform: scale(1.05);
  }
  90% {
    -webkit-transform: scale(0.98);
  }
  100% {
    -webkit-transform: scale(1);
  }
}

@keyframes expand-in {
  0% {
    transform: scale(1.8);
  }
  50% {
    transform: scale(0.95);
  }
  80% {
    transform: scale(1.05);
  }
  90% {
    transform: scale(0.98);
  }
  100% {
    transform: scale(1);
  }
}

.pui-animation-expand-in {
  -webkit-animation-name: expand-in;
  -moz-animation-name: expand-in;
  /* Firefox 5.0~16.0 */
  animation-name: expand-in;
  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1.2s;
  -webkit-animation-timing-function: ease-out;
  -moz-animation-timing-function: ease-out;
  /* Firefox 5.0~16.0 */
  animation-timing-function: ease-out;
  visibility: visible !important;
}

@-webkit-keyframes expand-out {
  0% {
    -webkit-transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.95);
  }
  80% {
    -webkit-transform: scale(1.8);
  }
  90% {
    -webkit-transform: scale(1.68);
  }
  100% {
    -webkit-transform: scale(1.8);
  }
}

@keyframes expand-out {
  0% {
    transform: scale(1);
  }
  20% {
    transform: scale(0.95);
  }
  80% {
    transform: scale(1.8);
  }
  90% {
    transform: scale(1.68);
  }
  100% {
    transform: scale(1.8);
  }
}

.pui-animation-expand-out {
  -webkit-animation-name: expand-out;
  -moz-animation-name: expand-out;
  /* Firefox 5.0~16.0 */
  animation-name: expand-out;
  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  /* Firefox 5.0~16.0 */
  animation-duration: 1.2s;
  -webkit-animation-timing-function: ease-in-out;
  -moz-animation-timing-function: ease-in-out;
  /* Firefox 5.0~16.0 */
  animation-timing-function: ease-in-out;
  visibility: visible !important;
}

.pui-animation-reverse {
  -webkit-animation-direction: reverse !important;
  -moz-animation-direction: reverse !important;
  /* Firefox 5.0~16.0 */
  animation-direction: reverse !important;
}

.pui-animation-stop, .pui-animation-paused {
  -webkit-animation-play-state: paused !important;
  -moz-animation-play-state: paused !important;
  /* Firefox 5.0~16.0 */
  animation-play-state: paused !important;
}

.pui-animation-repeat {
  -webkit-animation-iteration-count: infinite !important;
  -moz-animation-iteration-count: infinite !important;
  /* Firefox 5.0~16.0 */
  animation-iteration-count: infinite !important;
}

/* forms */
.pui-form {
  padding: 15px;
  padding: 1.5rem;
  font-size: 14px;
  font-size: 1.4rem;
}

.pui-form:before, .pui-form:after, .pui-form-group:before, .pui-form-group:after {
  content: " ";
  display: table;
}

.pui-form:after, .pui-form-group:after {
  clear: both;
}

.pui-form-group {
  position: relative;
  padding-top: 12px;
  padding-top: 1.2rem;
}

.pui-form-group.pui-form-group-underline, .pui-form-group.pui-form-group-underline-dashed {
  padding: 12px 0;
  padding: 1.2rem 0;
  border-bottom: 1px solid #eee;
}

.pui-form-group.pui-form-group-underline:last-child, .pui-form-group.pui-form-group-underline-dashed:last-child {
  border: none;
}

.pui-form-group.pui-form-group-underline-dashed {
  border-bottom-style: dashed;
}

input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="number"], input[type="search"],
input[type="date"], input[type="datetime"], input[type="time"] {
  width: 99.9%;
  padding: 10px;
  height: 36px;
  margin: 0 10px 7px 0;
  font-size: 14px;
  border: 1px solid #ddd;
}

input[type="text"].pui-input-underline, input[type="password"].pui-input-underline, input[type="email"].pui-input-underline, input[type="url"].pui-input-underline, input[type="number"].pui-input-underline, input[type="search"].pui-input-underline,
input[type="date"].pui-input-underline, input[type="datetime"].pui-input-underline, input[type="time"].pui-input-underline {
  border: none;
  border-bottom: 1px solid #ddd;
  padding-left: 0;
}

input[type="text"].pui-input-underline-dashed, input[type="password"].pui-input-underline-dashed, input[type="email"].pui-input-underline-dashed, input[type="url"].pui-input-underline-dashed, input[type="number"].pui-input-underline-dashed, input[type="search"].pui-input-underline-dashed,
input[type="date"].pui-input-underline-dashed, input[type="datetime"].pui-input-underline-dashed, input[type="time"].pui-input-underline-dashed {
  border: none;
  border-bottom: 1px dashed #ddd;
  padding-left: 0;
}

.pui-form-group > input[type="text"]:last-child, fieldset > input[type="text"]:last-child, .pui-form-group > input[type="password"]:last-child, fieldset > input[type="password"]:last-child, .pui-form-group > input[type="email"]:last-child, fieldset > input[type="email"]:last-child, .pui-form-group > input[type="url"]:last-child, fieldset > input[type="url"]:last-child, .pui-form-group > input[type="number"]:last-child, fieldset > input[type="number"]:last-child, .pui-form-group > input[type="search"]:last-child,
fieldset > input[type="search"]:last-child,
.pui-form-group > input[type="date"]:last-child, fieldset > input[type="date"]:last-child, .pui-form-group > input[type="datetime"]:last-child, fieldset > input[type="datetime"]:last-child, .pui-form-group > input[type="time"]:last-child, fieldset > input[type="time"]:last-child {
  margin-bottom: 0;
}

input[type="range"] {
  width: 100%;
  width: 99.7%\9;
  margin: 0 10px 10px 0;
  margin: 0 1rem 1rem 0;
  padding-left: 0;
  padding-right: 0;
}

.pui-form-group > input[type="range"]:last-child, fieldset > input[type="range"]:last-child {
  margin-bottom: 0;
}

input[type="submit"], input[type="reset"], input[type="button"] {
  text-align: center;
}

.pui-input-xs {
  width: 50px;
  width: 5rem;
}

.pui-input-sm {
  width: 100px;
  width: 10rem;
}

.pui-input-md {
  width: 200px;
  width: 20rem;
}

.pui-input-lg {
  width: 300px;
  width: 30rem;
}

.pui-input-xl {
  width: 400px;
  width: 40rem;
}

.pui-input-xxl {
  width: 500px;
  width: 50rem;
}

.pui-input-xxxl {
  width: 600px;
  width: 60rem;
}

.pui-form label {
  cursor: pointer;
  padding-right: 8px;
}

.pui-form-title {
  padding-bottom: 10px;
  padding-bottom: 1rem;
  margin-bottom: 10px;
  margin-bottom: 1rem;
  border-bottom: 1px solid #ddd;
}

.pui-form-title h1 {
  font-size: 18px;
  font-size: 1.8rem;
}

textarea, .pui-form textarea {
  width: 99.9%;
  height: 240px;
  padding: 6px;
  padding: 0.6rem;
  border: 1px solid #ddd;
}

fieldset.pui-fieldset-border-top, fieldset.pui-fieldset-border-top-dashed {
  padding-top: 10px;
  padding-top: 1rem;
  padding-bottom: 0;
  padding-bottom: 0;
  border: none;
  border-top: 1px solid #eee;
}

fieldset.pui-fieldset-border-top-dashed {
  border-top: 1px dashed #eee;
}

fieldset.pui-fieldset-border-dashed {
  border: 1px dashed #eee;
}

fieldset.pui-fieldset-unbordered {
  border: none;
}

fieldset.pui-fieldset-unbordered legend {
  padding: 0;
}

select {
  font-size: 14px;
  padding: 4px 6px;
  width: 99.9%;
  height: 35px;
  height: 34px\0;
  background: none;
  border: 1px solid #ddd;
  outline: none;
  position: relative;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background: #fff url(../images/select.png) no-repeat right center;
}

select[multiple] {
  background: none;
  min-height: 100px;
}

select::-ms-expand {
  display: none;
}

html.touch select {
  height: 33px;
  line-height: 31px;
  padding: 0 6px;
}

.pui-select {
  vertical-align: middle;
  display: inline-block;
  position: relative;
}

.pui-select:after {
  color: #999;
  position: absolute;
  top: 0.2rem;
  right: 1.5rem;
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  font-size: 1.6rem;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f107";
}

html.no-touch .pui-select:hover:after, .pui-select.hover:after {
  color: #666;
}

.pui-select select {
  background: none;
  padding-right: 2rem;
}

input[type="file"] {
  padding: 4px;
  padding: 0.4rem;
  border: 1px solid #ddd;
  background: none;
}

input[type="radio"], input[type="checkbox"] {
  margin-top: -2px;
  margin-top: -0.2rem;
}

.pui-form .pui-input-tips-text {
  font-size: 12px;
  font-size: 1.2rem;
  color: #ccc;
}

input[type="text"], input[type="password"], input[type="file"], textarea, .pui-form textarea,
input[type="email"], input[type="url"], input[type="number"], input[type="search"],
input[type="date"], input[type="datetime"], input[type="time"] {
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

input[type="text"], input[type="password"], input[type="file"], select, input[type="email"],
input[type="url"], input[type="number"], input[type="range"], input[type="search"],
input[type="date"], input[type="datetime"], input[type="time"] {
  margin-right: 5px;
  margin-right: 0.5rem;
}

form.pui-form-label-left label {
  float: left;
  width: 100px;
  display: block;
  padding: 5px 10px 15px;
  padding: 0.5rem 1rem 1.5rem;
}

form.pui-form-label-left br {
  clear: both;
}

[fv-role] > [type=normal], [fv-role] > [type=success], [fv-role] > [type=error], [fv-role] > [type=empty] {
  font-size: 12px;
  vertical-align: middle;
}

[fv-role] > [type=normal] {
  font-size: 12px;
  color: #ccc;
}

[fv-role] > [type=success], [fv-role] > [type=error], [fv-role] > [type=empty] {
  display: none;
}

[fv-role] > [type=success] {
  color: #15B952;
}

[fv-role] > [type=empty], [fv-role] > [type=error] {
  color: red;
}

[fv-role] > [type=normal] > .fa, [fv-role] > [type=success] > .fa, [fv-role] > [type=empty] > .fa, [fv-role] > [type=error] > .fa {
  font-size: 16px;
}

input.fv-error, select.fv-error, textarea.fv-error {
  color: red;
  border-color: red;
}

input.fv-success, select.fv-success, textarea.fv-success {
  color: #15B952;
  border-color: #15B952;
}

.pui-input-group {
  height: 36px;
}

.pui-input-group:before, .pui-input-group:after {
  content: " ";
  display: table;
}

.pui-input-group:after {
  clear: both;
}

.pui-input-group .pui-input-group-addon {
  float: left;
  font-size: 14px;
  line-height: 34px;
  padding: 0 8px;
  margin: 0;
  border: 1px solid #ddd;
  background: #f6f6f6;
}

.pui-input-group .pui-input-group-addon label {
  margin-bottom: 0;
}

.pui-input-group .pui-input-group-text-input {
  float: left;
  margin: 0;
  height: 100%;
  height: 36px;
  margin-left: -1px;
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-input-group .pui-input-group-text-input + .pui-input-group-text-input {
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-input-group select {
  margin: 0;
  float: left;
}

.pui-input-group .pui-input-group-addon:not(:first-child) {
  margin-left: -1px;
}

.pui-input-group select + select {
  margin-left: -2px;
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-input-group .pui-input-group-addon:first-child, .pui-input-group .pui-input-group-text-input:first-child {
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.pui-input-group .pui-input-group-addon:last-child {
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-input-group .pui-input-group-btn .pui-btn {
  font-size: 14px;
}

.pui-input-group .pui-input-group-text-input + .pui-input-group-btn > .pui-btn {
  margin-left: -1px;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
}

.pui-input-group select + .pui-input-group-btn > .pui-btn {
  margin-left: -2px;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
}

.pui-input-group > select:first-child {
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pui-input-group .pui-input-group-addon + select {
  margin-left: -1px;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
}

.pui-input-list {
  margin-bottom: 15px;
}

.pui-input-list input {
  margin-bottom: 0;
}

.pui-input-list input:not(first-child) {
  margin-top: -1px;
}

.pui-input-list input:not(:first-child), .pui-input-list input:not(:last-child) {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-input-list input:first-child {
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
}

.pui-input-list input:last-child {
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-input-list .pui-btn {
  width: 99.9%;
  height: 36px;
}

input.pui-input-round, textarea.pui-input-round, select.pui-input-round {
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

input.pui-input-square, textarea.pui-input-square, select.pui-input-square {
  border-radius: 0;
}

input.pui-input-unbordered, textarea.pui-input-unbordered, select.pui-input-unbordered {
  border: none;
  padding-left: 0;
  padding-right: 0;
}

input.pui-box-shadow, textarea.pui-box-shadow, select.pui-box-shadow {
  -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.15);
  /* Webkit browsers */
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.15);
  /* IE9+, News */
}

input.pui-box-shadow-inset, textarea.pui-box-shadow-inset, select.pui-box-shadow-inset {
  -webkit-box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.15);
  /* Webkit browsers */
  box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.15);
  /* IE9+, News */
}

input.pui-input-gary, textarea.pui-input-gary, select.pui-input-gary {
  color: #fff;
  border-color: #DDDDDD;
  background-color: #DDDDDD;
}

input.pui-input-border-gary, textarea.pui-input-border-gary, select.pui-input-border-gary {
  color: #DDDDDD;
  border-color: #DDDDDD;
}

input.pui-input-primary, textarea.pui-input-primary, select.pui-input-primary {
  color: #fff;
  border-color: #008EE5;
  background-color: #008EE5;
}

input.pui-input-border-primary, textarea.pui-input-border-primary, select.pui-input-border-primary {
  color: #008EE5;
  border-color: #008EE5;
}

input.pui-input-secondary, textarea.pui-input-secondary, select.pui-input-secondary {
  color: #fff;
  border-color: #3BB4F2;
  background-color: #3BB4F2;
}

input.pui-input-border-secondary, textarea.pui-input-border-secondary, select.pui-input-border-secondary {
  color: #3BB4F2;
  border-color: #3BB4F2;
}

input.pui-input-info, textarea.pui-input-info, select.pui-input-info {
  color: #fff;
  border-color: #2EAAC6;
  background-color: #2EAAC6;
}

input.pui-input-border-info, textarea.pui-input-border-info, select.pui-input-border-info {
  color: #2EAAC6;
  border-color: #2EAAC6;
}

input.pui-input-success, textarea.pui-input-success, select.pui-input-success {
  color: #fff;
  border-color: #71B472;
  background-color: #71B472;
}

input.pui-input-border-success, textarea.pui-input-border-success, select.pui-input-border-success {
  color: #71B472;
  border-color: #71B472;
}

input.pui-input-warning, textarea.pui-input-warning, select.pui-input-warning {
  color: #fff;
  border-color: #FFB74D;
  background-color: #FFB74D;
}

input.pui-input-border-warning, textarea.pui-input-border-warning, select.pui-input-border-warning {
  color: #FFB74D;
  border-color: #FFB74D;
}

input.pui-input-error, textarea.pui-input-error, select.pui-input-error {
  color: #fff;
  border-color: #E87467;
  background-color: #E87467;
}

input.pui-input-border-error, textarea.pui-input-border-error, select.pui-input-border-error {
  color: #E87467;
  border-color: #E87467;
}

.pui-form .pui-row {
  margin: 0;
}

.pui-form .pui-row.pui-form-group {
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 8px;
  padding-bottom: 0.8rem;
}

.pui-form .pui-row.pui-form-group:last-child {
  margin-bottom: 2rem;
}

.pui-form .pui-row [class*="pui-grid-"] {
  padding: 0;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) {
  select {
    background-image: url(../images/select@2x.png);
    background-size: 10%;
  }
  select[disabled] {
    background-image: none;
  }
}

@media only screen and (-webkit-min-device-pixel-ratio: 3) {
  select {
    background-image: url(../images/select@3x.png);
    background-size: 10%;
  }
  select[disabled] {
    background-image: none;
  }
}

@media only screen and (min-width: 1025px) {
  input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="number"], input[type="search"] {
    font-size: 12px;
  }
  .pui-input-list input {
    font-size: 12px;
  }
  select, .pui-form label {
    font-size: 12px;
  }
}

.pui-file-input {
  display: inline-block;
  position: relative;
  overflow: hidden;
  overflow-y: visible;
  padding-bottom: 2px;
  vertical-align: middle;
}

.pui-file-input > input[type="file"] {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0;
  /* W3C */
  filter: alpha(opacity=0);
  /* IE */
  cursor: pointer;
}

.pui-file-input > input[type="file"]::-webkit-file-upload-button {
  visibility: hidden;
}

[class*="pui-icon"], [class*="icon-"], [class*="fa-"] {
  vertical-align: middle;
}

/* images */
.pui-img-responsive, .pui-img-size-auto {
  height: auto;
  max-width: 100%;
}

.pui-img-full-width {
  width: 100%;
  height: auto;
}

.pui-img-radius {
  -webkit-border-radius: 6px;
  border-radius: 6px;
}

.pui-img-radius-plus {
  -webkit-border-radius: 12px;
  border-radius: 12px;
}

.pui-img-radius-plus-2 {
  -webkit-border-radius: 16px;
  border-radius: 16px;
}

.pui-img-radius-plus-3 {
  -webkit-border-radius: 24px;
  border-radius: 24px;
}

.pui-img-circle {
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.pui-img-thumbnail {
  padding: 4px;
  height: auto;
  max-width: 100%;
  display: inline-block;
  background-color: #fff;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.pui-img-thumbnail.pui-img-thumbnail-rect {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-img-thumbnail.plus {
  padding: 5px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
}

.pui-img-xxxs {
  width: 16px;
  width: 1.6rem;
}

.pui-img-xxs {
  width: 24px;
  width: 2.4rem;
}

.pui-img-xs {
  width: 32px;
  width: 3.2rem;
  padding: 3px;
}

.pui-img-sm {
  width: 48px;
  width: 4.8rem;
  padding: 3px;
}

.pui-img-md {
  width: 64px;
  width: 6.4rem;
}

.pui-img-lg {
  width: 96px;
  width: 9.6rem;
}

.pui-img-xl {
  width: 128px;
  width: 12.8rem;
}

.pui-img-xxl {
  width: 192px;
  width: 19.2rem;
}

.pui-img-xxxl {
  width: 256px;
  width: 25.6rem;
}

.pui-img-align-left {
  float: left;
  margin-right: 1rem;
  margin-bottom: 1rem;
}

.pui-img-align-right {
  float: right;
  margin-left: 1rem;
  margin-bottom: 1rem;
}

/* image grid list */
.pui-img-grid {
  margin-left: -5px;
  margin-right: -5px;
}

[class*=pui-img-grid-] {
  margin: 0;
  padding: 0;
  display: block;
  list-style: none;
}

/* List */
.pui-list {
  list-style: none;
  padding-left: 0;
}

.pui-list:before, .pui-list:after {
  content: " ";
  display: table;
}

.pui-list:after {
  clear: both;
}

.pui-list.pui-list-margin-bottom li {
  margin-bottom: 10px;
  margin-bottom: 1rem;
}

.pui-list.pui-list-bordered {
  border: 1px solid #ddd;
}

.pui-list.pui-list-bordered li {
  padding-left: 10px;
  padding-left: 1rem;
}

.pui-list-line > li, .pui-list-dashed-line > li {
  padding: 5px 0;
  padding: 0.5rem 0;
  display: block\0;
  margin-top: 0\0;
  padding: 5px 0 7px 0 \0;
  border-top: 1px solid #ddd \0;
}

.pui-list-line > li > h1, .pui-list-line > li > h2, .pui-list-line > li > h3, .pui-list-line > li > h4, .pui-list-line > li > h5, .pui-list-line > li > h6, .pui-list-dashed-line > li > h1, .pui-list-dashed-line > li > h2, .pui-list-dashed-line > li > h3, .pui-list-dashed-line > li > h4, .pui-list-dashed-line > li > h5, .pui-list-dashed-line > li > h6 {
  margin-bottom: 2px;
}

.pui-list-line > li:nth-child(n+2), .pui-list-dashed-line > li:nth-child(n+2) {
  border-top: 1px solid #ddd;
}

.pui-list-dashed-line > li:nth-child(n+2) {
  border-top: 1px dashed #ddd;
}

/* for IE9+ */
@media all and (min-width: 0) {
  .pui-list-line li {
    margin-top: 0\9;
    padding: 0.5rem 0 \9;
  }
}

.pui-list-line li:first-child {
  border-top: none\0;
  *border-top: none;
}

.pui-list-line-img > li {
  padding: 12px 0;
  padding: 1.2rem 0;
}

.pui-list-style-none {
  list-style: none;
}

.pui-list-inline {
  padding-left: 0;
  list-style: none;
}

.pui-list-inline > li {
  padding: 5px 0;
  padding: 0.5rem 0;
  display: inline-block;
}

.pui-list.pui-list-stripe > li {
  -webkit-transition: background-color 300ms ease-out;
  /* Safari, Chrome */
  -moz-transition: background-color 300ms ease-out;
  /* Firefox 4.0~16.0 */
  transition: background-color 300ms ease-out;
  /* IE >9, FF >15, Opera >12.0 */
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.pui-list.pui-list-stripe > li:nth-child(even) {
  background-color: #fafafa;
}

html.no-touch .pui-list.pui-list-stripe > li:hover, .pui-list.pui-list-stripe > li.hover {
  background-color: #ffffcc;
}

.pui-list-group {
  margin-bottom: 15px;
  margin-bottom: 1.5rem;
}

.pui-list-group .pui-list {
  margin-bottom: 7px;
  margin-bottom: 0.7rem;
}

.pui-dl-horizontal dt {
  width: 24%;
  float: left;
  clear: both;
  overflow: hidden;
  text-align: right;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.pui-dl-horizontal dd {
  margin-left: 26%;
}

.pui-dl-img-list > dl:not(:last-child) {
  padding-bottom: 10px;
  border-bottom: 1px solid #ddd;
}

.pui-dl-img-list.pui-underline-dashed > dl:not(:last-child) {
  padding-bottom: 10px;
  border-bottom: 1px dashed #ddd;
}

.pui-dl-img-list > dl {
  overflow: auto;
}

.pui-dl-img-list > dl > dt {
  width: 24%;
  float: left;
  clear: both;
  overflow: hidden;
  text-align: left;
}

.pui-dl-img-list > dl > dt > img, .pui-dl-img-list > dl > dt > a > img {
  margin-top: 6px;
}

.pui-dl-img-list > dl > dd {
  margin-left: 26%;
}

.pui-dl-list-line > dt:nth-child(n+2) {
  margin-top: 10px;
  margin-top: 1rem;
  padding-top: 10px;
  padding-top: 1rem;
  border-top: 1px solid #ddd;
}

.pui-dl-list-line > dt {
  font-size: 14px;
  font-size: 1.4rem;
  margin-top: 10px\0;
  padding-top: 10px\0;
  border-top: 1px solid #ddd \0;
}

.pui-dl-list-line > dt > img {
  margin-bottom: 10px;
}

.pui-dl-list-line > dt:first-child {
  border-top: 0\0;
}

.pui-dl-list-line > dd {
  color: #777;
}

.pui-list-column-2 {
  padding: 0;
}

.pui-list-column-2 > li {
  width: 49%;
  display: inline-block;
}

.pui-list-column-3 {
  padding: 0;
}

.pui-list-column-3 > li {
  width: 32%;
  display: inline-block;
}

.pui-list-column-4 {
  padding: 0;
}

.pui-list-column-4 > li {
  width: 24%;
  display: inline-block;
}

.pui-list-angle-right-type > li:before {
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  padding-right: 15px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f105";
}

@media (max-width: 640px) {
  .pui-dl-img-list > dl dd {
    margin-left: 28%;
  }
  .pui-dl-horizontal > dt {
    width: 28%;
  }
  .pui-dl-horizontal > dd {
    margin-left: 34%;
  }
}

@media (min-width: 768px) {
  .pui-dl-img-list > dl > dt {
    width: 18%;
  }
  .pui-dl-img-list > dl > dd {
    margin-left: 21%;
  }
}

/* Tables */
.pui-table {
  width: 100%;
  max-width: 100%;
  margin: 20px auto;
  margin: 2rem auto;
  background: #fff;
  table-layout: fixed;
  position: relative;
}

.pui-table th, .pui-table td {
  padding: 6px;
  padding: 0.6rem;
  vertical-align: top;
  border-bottom: 1px solid #ddd;
}

.pui-table tr.gary > td, .pui-table tr.gary > th, .pui-table th.gary, .pui-table td.gary {
  color: #fff;
  background-color: #DDDDDD;
  border-color: #DDDDDD;
}

.pui-table tr.primary > td, .pui-table tr.primary > th, .pui-table th.primary, .pui-table td.primary {
  color: #fff;
  background-color: #008EE5;
  border-color: #008EE5;
}

.pui-table tr.secondary > td, .pui-table tr.secondary > th, .pui-table th.secondary, .pui-table td.secondary {
  color: #fff;
  background-color: #3BB4F2;
  border-color: #3BB4F2;
}

.pui-table tr.info > td, .pui-table tr.info > th, .pui-table th.info, .pui-table td.info {
  color: #fff;
  background-color: #2EAAC6;
  border-color: #2EAAC6;
}

.pui-table tr.success > td, .pui-table tr.success > th, .pui-table th.success, .pui-table td.success {
  color: #fff;
  background-color: #71B472;
  border-color: #71B472;
}

.pui-table tr.warning > td, .pui-table tr.warning > th, .pui-table th.warning, .pui-table td.warning {
  color: #fff;
  background-color: #FFB74D;
  border-color: #FFB74D;
}

.pui-table tr.error > td, .pui-table tr.error > th, .pui-table th.error, .pui-table td.error {
  color: #fff;
  background-color: #E87467;
  border-color: #E87467;
}

.pui-table.pui-table-body-scroll > tbody {
  height: 100px;
  overflow: auto;
}

.pui-table.margin-none, .pui-table.pui-margin-none {
  margin: 0 auto;
}

.pui-table-bordered, .pui-table-bordered td, .pui-table-bordered th {
  border: 1px solid #ddd;
}

.pui-table-unbordered, .pui-table-unbordered td, .pui-table-unbordered th {
  border: none;
}

.pui-table.pui-table-border-vertical {
  border: none;
  border-left: 1px solid #ddd;
}

.pui-table.pui-table-border-vertical td, .pui-table.pui-table-border-vertical th {
  border: none;
  border-right: 1px solid #ddd;
}

.pui-table.pui-table-text-center td, .pui-table.pui-table-text-center th {
  text-align: center;
}

.pui-table.pui-table-text-left td, .pui-table.pui-table-text-left th {
  text-align: left;
}

.pui-table.pui-table-text-right td, .pui-table.pui-table-text-right th {
  text-align: right;
}

.pui-table.pui-table-thead-bg thead {
  background: #f6f6f6;
}

.pui-table.pui-table-interlaced-color tr:nth-child(even) {
  background: #fafafa;
}

.pui-table.pui-table-interlaced-color html.no-touch tr:hover, .pui-table.pui-table-interlaced-color tr.hover {
  background: #ffffcc;
}

.pui-table.pui-table-interlaced-color html.no-touch thead tr:hover, .pui-table.pui-table-interlaced-color thead tr.hover {
  background: #f6f6f6;
}

.pui-table.pui-table-uninterlaced-color tr {
  background: #fff;
}

.pui-table.pui-table-uninterlaced-color tr:nth-child(even), .pui-table.pui-table-uninterlaced-color tr:nth-child(odd), .pui-table.pui-table-uninterlaced-color tr:hover {
  background: #fff;
}

.pui-table.pui-table-compact td, .pui-table.pui-table-compact th {
  padding: 3px;
  padding: 0.3rem;
}

/* ================  Third party Components  ================ */
/*!
 *  Font Awesome 4.3.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: 'FontAwesome';
  src: url("../fonts/fontawesome-webfont.eot?v=4.3.0");
  src: url("../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0") format("embedded-opentype"), url("../fonts/fontawesome-webfont.woff2?v=4.3.0") format("woff2"), url("../fonts/fontawesome-webfont.woff?v=4.3.0") format("woff"), url("../fonts/fontawesome-webfont.ttf?v=4.3.0") format("truetype"), url("../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}

/* makes the font 33% larger relative to the icon container */
.fa-lg {
  font-size: 1.33333333em;
  line-height: 0.75em;
  vertical-align: -15%;
}

.fa-2x {
  font-size: 2em;
}

.fa-3x {
  font-size: 3em;
}

.fa-4x {
  font-size: 4em;
}

.fa-5x {
  font-size: 5em;
}

.fa-fw {
  width: 1.28571429em;
  text-align: center;
}

.fa-ul {
  padding-left: 0;
  margin-left: 2.14285714em;
  list-style-type: none;
}

.fa-ul > li {
  position: relative;
}

.fa-li {
  position: absolute;
  left: -2.14285714em;
  width: 2.14285714em;
  top: 0.14285714em;
  text-align: center;
}

.fa-li.fa-lg {
  left: -1.85714286em;
}

.fa-border {
  padding: 0.2em 0.25em 0.15em;
  border: solid 0.08em #eeeeee;
  border-radius: .1em;
}

.pull-right {
  float: right;
}

.pull-left {
  float: left;
}

.fa.pull-left {
  margin-right: .3em;
}

.fa.pull-right {
  margin-left: .3em;
}

.fa-spin {
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear;
}

.fa-pulse {
  -webkit-animation: fa-spin 1s infinite steps(8);
  animation: fa-spin 1s infinite steps(8);
}

@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

@keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

.fa-rotate-90 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.fa-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.fa-rotate-270 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}

.fa-flip-horizontal {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);
}

.fa-flip-vertical {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
  -webkit-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  transform: scale(1, -1);
}

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
  filter: none;
}

.fa-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
}

.fa-stack-1x,
.fa-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}

.fa-stack-1x {
  line-height: inherit;
}

.fa-stack-2x {
  font-size: 2em;
}

.fa-inverse {
  color: #ffffff;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.fa-glass:before {
  content: "\f000";
}

.fa-music:before {
  content: "\f001";
}

.fa-search:before {
  content: "\f002";
}

.fa-envelope-o:before {
  content: "\f003";
}

.fa-heart:before {
  content: "\f004";
}

.fa-star:before {
  content: "\f005";
}

.fa-star-o:before {
  content: "\f006";
}

.fa-user:before {
  content: "\f007";
}

.fa-film:before {
  content: "\f008";
}

.fa-th-large:before {
  content: "\f009";
}

.fa-th:before {
  content: "\f00a";
}

.fa-th-list:before {
  content: "\f00b";
}

.fa-check:before {
  content: "\f00c";
}

.fa-remove:before,
.fa-close:before,
.fa-times:before {
  content: "\f00d";
}

.fa-search-plus:before {
  content: "\f00e";
}

.fa-search-minus:before {
  content: "\f010";
}

.fa-power-off:before {
  content: "\f011";
}

.fa-signal:before {
  content: "\f012";
}

.fa-gear:before,
.fa-cog:before {
  content: "\f013";
}

.fa-trash-o:before {
  content: "\f014";
}

.fa-home:before {
  content: "\f015";
}

.fa-file-o:before {
  content: "\f016";
}

.fa-clock-o:before {
  content: "\f017";
}

.fa-road:before {
  content: "\f018";
}

.fa-download:before {
  content: "\f019";
}

.fa-arrow-circle-o-down:before {
  content: "\f01a";
}

.fa-arrow-circle-o-up:before {
  content: "\f01b";
}

.fa-inbox:before {
  content: "\f01c";
}

.fa-play-circle-o:before {
  content: "\f01d";
}

.fa-rotate-right:before,
.fa-repeat:before {
  content: "\f01e";
}

.fa-refresh:before {
  content: "\f021";
}

.fa-list-alt:before {
  content: "\f022";
}

.fa-lock:before {
  content: "\f023";
}

.fa-flag:before {
  content: "\f024";
}

.fa-headphones:before {
  content: "\f025";
}

.fa-volume-off:before {
  content: "\f026";
}

.fa-volume-down:before {
  content: "\f027";
}

.fa-volume-up:before {
  content: "\f028";
}

.fa-qrcode:before {
  content: "\f029";
}

.fa-barcode:before {
  content: "\f02a";
}

.fa-tag:before {
  content: "\f02b";
}

.fa-tags:before {
  content: "\f02c";
}

.fa-book:before {
  content: "\f02d";
}

.fa-bookmark:before {
  content: "\f02e";
}

.fa-print:before {
  content: "\f02f";
}

.fa-camera:before {
  content: "\f030";
}

.fa-font:before {
  content: "\f031";
}

.fa-bold:before {
  content: "\f032";
}

.fa-italic:before {
  content: "\f033";
}

.fa-text-height:before {
  content: "\f034";
}

.fa-text-width:before {
  content: "\f035";
}

.fa-align-left:before {
  content: "\f036";
}

.fa-align-center:before {
  content: "\f037";
}

.fa-align-right:before {
  content: "\f038";
}

.fa-align-justify:before {
  content: "\f039";
}

.fa-list:before {
  content: "\f03a";
}

.fa-dedent:before,
.fa-outdent:before {
  content: "\f03b";
}

.fa-indent:before {
  content: "\f03c";
}

.fa-video-camera:before {
  content: "\f03d";
}

.fa-photo:before,
.fa-image:before,
.fa-picture-o:before {
  content: "\f03e";
}

.fa-pencil:before {
  content: "\f040";
}

.fa-map-marker:before {
  content: "\f041";
}

.fa-adjust:before {
  content: "\f042";
}

.fa-tint:before {
  content: "\f043";
}

.fa-edit:before,
.fa-pencil-square-o:before {
  content: "\f044";
}

.fa-share-square-o:before {
  content: "\f045";
}

.fa-check-square-o:before {
  content: "\f046";
}

.fa-arrows:before {
  content: "\f047";
}

.fa-step-backward:before {
  content: "\f048";
}

.fa-fast-backward:before {
  content: "\f049";
}

.fa-backward:before {
  content: "\f04a";
}

.fa-play:before {
  content: "\f04b";
}

.fa-pause:before {
  content: "\f04c";
}

.fa-stop:before {
  content: "\f04d";
}

.fa-forward:before {
  content: "\f04e";
}

.fa-fast-forward:before {
  content: "\f050";
}

.fa-step-forward:before {
  content: "\f051";
}

.fa-eject:before {
  content: "\f052";
}

.fa-chevron-left:before {
  content: "\f053";
}

.fa-chevron-right:before {
  content: "\f054";
}

.fa-plus-circle:before {
  content: "\f055";
}

.fa-minus-circle:before {
  content: "\f056";
}

.fa-times-circle:before {
  content: "\f057";
}

.fa-check-circle:before {
  content: "\f058";
}

.fa-question-circle:before {
  content: "\f059";
}

.fa-info-circle:before {
  content: "\f05a";
}

.fa-crosshairs:before {
  content: "\f05b";
}

.fa-times-circle-o:before {
  content: "\f05c";
}

.fa-check-circle-o:before {
  content: "\f05d";
}

.fa-ban:before {
  content: "\f05e";
}

.fa-arrow-left:before {
  content: "\f060";
}

.fa-arrow-right:before {
  content: "\f061";
}

.fa-arrow-up:before {
  content: "\f062";
}

.fa-arrow-down:before {
  content: "\f063";
}

.fa-mail-forward:before,
.fa-share:before {
  content: "\f064";
}

.fa-expand:before {
  content: "\f065";
}

.fa-compress:before {
  content: "\f066";
}

.fa-plus:before {
  content: "\f067";
}

.fa-minus:before {
  content: "\f068";
}

.fa-asterisk:before {
  content: "\f069";
}

.fa-exclamation-circle:before {
  content: "\f06a";
}

.fa-gift:before {
  content: "\f06b";
}

.fa-leaf:before {
  content: "\f06c";
}

.fa-fire:before {
  content: "\f06d";
}

.fa-eye:before {
  content: "\f06e";
}

.fa-eye-slash:before {
  content: "\f070";
}

.fa-warning:before,
.fa-exclamation-triangle:before {
  content: "\f071";
}

.fa-plane:before {
  content: "\f072";
}

.fa-calendar:before {
  content: "\f073";
}

.fa-random:before {
  content: "\f074";
}

.fa-comment:before {
  content: "\f075";
}

.fa-magnet:before {
  content: "\f076";
}

.fa-chevron-up:before {
  content: "\f077";
}

.fa-chevron-down:before {
  content: "\f078";
}

.fa-retweet:before {
  content: "\f079";
}

.fa-shopping-cart:before {
  content: "\f07a";
}

.fa-folder:before {
  content: "\f07b";
}

.fa-folder-open:before {
  content: "\f07c";
}

.fa-arrows-v:before {
  content: "\f07d";
}

.fa-arrows-h:before {
  content: "\f07e";
}

.fa-bar-chart-o:before,
.fa-bar-chart:before {
  content: "\f080";
}

.fa-twitter-square:before {
  content: "\f081";
}

.fa-facebook-square:before {
  content: "\f082";
}

.fa-camera-retro:before {
  content: "\f083";
}

.fa-key:before {
  content: "\f084";
}

.fa-gears:before,
.fa-cogs:before {
  content: "\f085";
}

.fa-comments:before {
  content: "\f086";
}

.fa-thumbs-o-up:before {
  content: "\f087";
}

.fa-thumbs-o-down:before {
  content: "\f088";
}

.fa-star-half:before {
  content: "\f089";
}

.fa-heart-o:before {
  content: "\f08a";
}

.fa-sign-out:before {
  content: "\f08b";
}

.fa-linkedin-square:before {
  content: "\f08c";
}

.fa-thumb-tack:before {
  content: "\f08d";
}

.fa-external-link:before {
  content: "\f08e";
}

.fa-sign-in:before {
  content: "\f090";
}

.fa-trophy:before {
  content: "\f091";
}

.fa-github-square:before {
  content: "\f092";
}

.fa-upload:before {
  content: "\f093";
}

.fa-lemon-o:before {
  content: "\f094";
}

.fa-phone:before {
  content: "\f095";
}

.fa-square-o:before {
  content: "\f096";
}

.fa-bookmark-o:before {
  content: "\f097";
}

.fa-phone-square:before {
  content: "\f098";
}

.fa-twitter:before {
  content: "\f099";
}

.fa-facebook-f:before,
.fa-facebook:before {
  content: "\f09a";
}

.fa-github:before {
  content: "\f09b";
}

.fa-unlock:before {
  content: "\f09c";
}

.fa-credit-card:before {
  content: "\f09d";
}

.fa-rss:before {
  content: "\f09e";
}

.fa-hdd-o:before {
  content: "\f0a0";
}

.fa-bullhorn:before {
  content: "\f0a1";
}

.fa-bell:before {
  content: "\f0f3";
}

.fa-certificate:before {
  content: "\f0a3";
}

.fa-hand-o-right:before {
  content: "\f0a4";
}

.fa-hand-o-left:before {
  content: "\f0a5";
}

.fa-hand-o-up:before {
  content: "\f0a6";
}

.fa-hand-o-down:before {
  content: "\f0a7";
}

.fa-arrow-circle-left:before {
  content: "\f0a8";
}

.fa-arrow-circle-right:before {
  content: "\f0a9";
}

.fa-arrow-circle-up:before {
  content: "\f0aa";
}

.fa-arrow-circle-down:before {
  content: "\f0ab";
}

.fa-globe:before {
  content: "\f0ac";
}

.fa-wrench:before {
  content: "\f0ad";
}

.fa-tasks:before {
  content: "\f0ae";
}

.fa-filter:before {
  content: "\f0b0";
}

.fa-briefcase:before {
  content: "\f0b1";
}

.fa-arrows-alt:before {
  content: "\f0b2";
}

.fa-group:before,
.fa-users:before {
  content: "\f0c0";
}

.fa-chain:before,
.fa-link:before {
  content: "\f0c1";
}

.fa-cloud:before {
  content: "\f0c2";
}

.fa-flask:before {
  content: "\f0c3";
}

.fa-cut:before,
.fa-scissors:before {
  content: "\f0c4";
}

.fa-copy:before,
.fa-files-o:before {
  content: "\f0c5";
}

.fa-paperclip:before {
  content: "\f0c6";
}

.fa-save:before,
.fa-floppy-o:before {
  content: "\f0c7";
}

.fa-square:before {
  content: "\f0c8";
}

.fa-navicon:before,
.fa-reorder:before,
.fa-bars:before {
  content: "\f0c9";
}

.fa-list-ul:before {
  content: "\f0ca";
}

.fa-list-ol:before {
  content: "\f0cb";
}

.fa-strikethrough:before {
  content: "\f0cc";
}

.fa-underline:before {
  content: "\f0cd";
}

.fa-table:before {
  content: "\f0ce";
}

.fa-magic:before {
  content: "\f0d0";
}

.fa-truck:before {
  content: "\f0d1";
}

.fa-pinterest:before {
  content: "\f0d2";
}

.fa-pinterest-square:before {
  content: "\f0d3";
}

.fa-google-plus-square:before {
  content: "\f0d4";
}

.fa-google-plus:before {
  content: "\f0d5";
}

.fa-money:before {
  content: "\f0d6";
}

.fa-caret-down:before {
  content: "\f0d7";
}

.fa-caret-up:before {
  content: "\f0d8";
}

.fa-caret-left:before {
  content: "\f0d9";
}

.fa-caret-right:before {
  content: "\f0da";
}

.fa-columns:before {
  content: "\f0db";
}

.fa-unsorted:before,
.fa-sort:before {
  content: "\f0dc";
}

.fa-sort-down:before,
.fa-sort-desc:before {
  content: "\f0dd";
}

.fa-sort-up:before,
.fa-sort-asc:before {
  content: "\f0de";
}

.fa-envelope:before {
  content: "\f0e0";
}

.fa-linkedin:before {
  content: "\f0e1";
}

.fa-rotate-left:before,
.fa-undo:before {
  content: "\f0e2";
}

.fa-legal:before,
.fa-gavel:before {
  content: "\f0e3";
}

.fa-dashboard:before,
.fa-tachometer:before {
  content: "\f0e4";
}

.fa-comment-o:before {
  content: "\f0e5";
}

.fa-comments-o:before {
  content: "\f0e6";
}

.fa-flash:before,
.fa-bolt:before {
  content: "\f0e7";
}

.fa-sitemap:before {
  content: "\f0e8";
}

.fa-umbrella:before {
  content: "\f0e9";
}

.fa-paste:before,
.fa-clipboard:before {
  content: "\f0ea";
}

.fa-lightbulb-o:before {
  content: "\f0eb";
}

.fa-exchange:before {
  content: "\f0ec";
}

.fa-cloud-download:before {
  content: "\f0ed";
}

.fa-cloud-upload:before {
  content: "\f0ee";
}

.fa-user-md:before {
  content: "\f0f0";
}

.fa-stethoscope:before {
  content: "\f0f1";
}

.fa-suitcase:before {
  content: "\f0f2";
}

.fa-bell-o:before {
  content: "\f0a2";
}

.fa-coffee:before {
  content: "\f0f4";
}

.fa-cutlery:before {
  content: "\f0f5";
}

.fa-file-text-o:before {
  content: "\f0f6";
}

.fa-building-o:before {
  content: "\f0f7";
}

.fa-hospital-o:before {
  content: "\f0f8";
}

.fa-ambulance:before {
  content: "\f0f9";
}

.fa-medkit:before {
  content: "\f0fa";
}

.fa-fighter-jet:before {
  content: "\f0fb";
}

.fa-beer:before {
  content: "\f0fc";
}

.fa-h-square:before {
  content: "\f0fd";
}

.fa-plus-square:before {
  content: "\f0fe";
}

.fa-angle-double-left:before {
  content: "\f100";
}

.fa-angle-double-right:before {
  content: "\f101";
}

.fa-angle-double-up:before {
  content: "\f102";
}

.fa-angle-double-down:before {
  content: "\f103";
}

.fa-angle-left:before {
  content: "\f104";
}

.fa-angle-right:before {
  content: "\f105";
}

.fa-angle-up:before {
  content: "\f106";
}

.fa-angle-down:before {
  content: "\f107";
}

.fa-desktop:before {
  content: "\f108";
}

.fa-laptop:before {
  content: "\f109";
}

.fa-tablet:before {
  content: "\f10a";
}

.fa-mobile-phone:before,
.fa-mobile:before {
  content: "\f10b";
}

.fa-circle-o:before {
  content: "\f10c";
}

.fa-quote-left:before {
  content: "\f10d";
}

.fa-quote-right:before {
  content: "\f10e";
}

.fa-spinner:before {
  content: "\f110";
}

.fa-circle:before {
  content: "\f111";
}

.fa-mail-reply:before,
.fa-reply:before {
  content: "\f112";
}

.fa-github-alt:before {
  content: "\f113";
}

.fa-folder-o:before {
  content: "\f114";
}

.fa-folder-open-o:before {
  content: "\f115";
}

.fa-smile-o:before {
  content: "\f118";
}

.fa-frown-o:before {
  content: "\f119";
}

.fa-meh-o:before {
  content: "\f11a";
}

.fa-gamepad:before {
  content: "\f11b";
}

.fa-keyboard-o:before {
  content: "\f11c";
}

.fa-flag-o:before {
  content: "\f11d";
}

.fa-flag-checkered:before {
  content: "\f11e";
}

.fa-terminal:before {
  content: "\f120";
}

.fa-code:before {
  content: "\f121";
}

.fa-mail-reply-all:before,
.fa-reply-all:before {
  content: "\f122";
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
  content: "\f123";
}

.fa-location-arrow:before {
  content: "\f124";
}

.fa-crop:before {
  content: "\f125";
}

.fa-code-fork:before {
  content: "\f126";
}

.fa-unlink:before,
.fa-chain-broken:before {
  content: "\f127";
}

.fa-question:before {
  content: "\f128";
}

.fa-info:before {
  content: "\f129";
}

.fa-exclamation:before {
  content: "\f12a";
}

.fa-superscript:before {
  content: "\f12b";
}

.fa-subscript:before {
  content: "\f12c";
}

.fa-eraser:before {
  content: "\f12d";
}

.fa-puzzle-piece:before {
  content: "\f12e";
}

.fa-microphone:before {
  content: "\f130";
}

.fa-microphone-slash:before {
  content: "\f131";
}

.fa-shield:before {
  content: "\f132";
}

.fa-calendar-o:before {
  content: "\f133";
}

.fa-fire-extinguisher:before {
  content: "\f134";
}

.fa-rocket:before {
  content: "\f135";
}

.fa-maxcdn:before {
  content: "\f136";
}

.fa-chevron-circle-left:before {
  content: "\f137";
}

.fa-chevron-circle-right:before {
  content: "\f138";
}

.fa-chevron-circle-up:before {
  content: "\f139";
}

.fa-chevron-circle-down:before {
  content: "\f13a";
}

.fa-html5:before {
  content: "\f13b";
}

.fa-css3:before {
  content: "\f13c";
}

.fa-anchor:before {
  content: "\f13d";
}

.fa-unlock-alt:before {
  content: "\f13e";
}

.fa-bullseye:before {
  content: "\f140";
}

.fa-ellipsis-h:before {
  content: "\f141";
}

.fa-ellipsis-v:before {
  content: "\f142";
}

.fa-rss-square:before {
  content: "\f143";
}

.fa-play-circle:before {
  content: "\f144";
}

.fa-ticket:before {
  content: "\f145";
}

.fa-minus-square:before {
  content: "\f146";
}

.fa-minus-square-o:before {
  content: "\f147";
}

.fa-level-up:before {
  content: "\f148";
}

.fa-level-down:before {
  content: "\f149";
}

.fa-check-square:before {
  content: "\f14a";
}

.fa-pencil-square:before {
  content: "\f14b";
}

.fa-external-link-square:before {
  content: "\f14c";
}

.fa-share-square:before {
  content: "\f14d";
}

.fa-compass:before {
  content: "\f14e";
}

.fa-toggle-down:before,
.fa-caret-square-o-down:before {
  content: "\f150";
}

.fa-toggle-up:before,
.fa-caret-square-o-up:before {
  content: "\f151";
}

.fa-toggle-right:before,
.fa-caret-square-o-right:before {
  content: "\f152";
}

.fa-euro:before,
.fa-eur:before {
  content: "\f153";
}

.fa-gbp:before {
  content: "\f154";
}

.fa-dollar:before,
.fa-usd:before {
  content: "\f155";
}

.fa-rupee:before,
.fa-inr:before {
  content: "\f156";
}

.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
  content: "\f157";
}

.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
  content: "\f158";
}

.fa-won:before,
.fa-krw:before {
  content: "\f159";
}

.fa-bitcoin:before,
.fa-btc:before {
  content: "\f15a";
}

.fa-file:before {
  content: "\f15b";
}

.fa-file-text:before {
  content: "\f15c";
}

.fa-sort-alpha-asc:before {
  content: "\f15d";
}

.fa-sort-alpha-desc:before {
  content: "\f15e";
}

.fa-sort-amount-asc:before {
  content: "\f160";
}

.fa-sort-amount-desc:before {
  content: "\f161";
}

.fa-sort-numeric-asc:before {
  content: "\f162";
}

.fa-sort-numeric-desc:before {
  content: "\f163";
}

.fa-thumbs-up:before {
  content: "\f164";
}

.fa-thumbs-down:before {
  content: "\f165";
}

.fa-youtube-square:before {
  content: "\f166";
}

.fa-youtube:before {
  content: "\f167";
}

.fa-xing:before {
  content: "\f168";
}

.fa-xing-square:before {
  content: "\f169";
}

.fa-youtube-play:before {
  content: "\f16a";
}

.fa-dropbox:before {
  content: "\f16b";
}

.fa-stack-overflow:before {
  content: "\f16c";
}

.fa-instagram:before {
  content: "\f16d";
}

.fa-flickr:before {
  content: "\f16e";
}

.fa-adn:before {
  content: "\f170";
}

.fa-bitbucket:before {
  content: "\f171";
}

.fa-bitbucket-square:before {
  content: "\f172";
}

.fa-tumblr:before {
  content: "\f173";
}

.fa-tumblr-square:before {
  content: "\f174";
}

.fa-long-arrow-down:before {
  content: "\f175";
}

.fa-long-arrow-up:before {
  content: "\f176";
}

.fa-long-arrow-left:before {
  content: "\f177";
}

.fa-long-arrow-right:before {
  content: "\f178";
}

.fa-apple:before {
  content: "\f179";
}

.fa-windows:before {
  content: "\f17a";
}

.fa-android:before {
  content: "\f17b";
}

.fa-linux:before {
  content: "\f17c";
}

.fa-dribbble:before {
  content: "\f17d";
}

.fa-skype:before {
  content: "\f17e";
}

.fa-foursquare:before {
  content: "\f180";
}

.fa-trello:before {
  content: "\f181";
}

.fa-female:before {
  content: "\f182";
}

.fa-male:before {
  content: "\f183";
}

.fa-gittip:before,
.fa-gratipay:before {
  content: "\f184";
}

.fa-sun-o:before {
  content: "\f185";
}

.fa-moon-o:before {
  content: "\f186";
}

.fa-archive:before {
  content: "\f187";
}

.fa-bug:before {
  content: "\f188";
}

.fa-vk:before {
  content: "\f189";
}

.fa-weibo:before {
  content: "\f18a";
}

.fa-renren:before {
  content: "\f18b";
}

.fa-pagelines:before {
  content: "\f18c";
}

.fa-stack-exchange:before {
  content: "\f18d";
}

.fa-arrow-circle-o-right:before {
  content: "\f18e";
}

.fa-arrow-circle-o-left:before {
  content: "\f190";
}

.fa-toggle-left:before,
.fa-caret-square-o-left:before {
  content: "\f191";
}

.fa-dot-circle-o:before {
  content: "\f192";
}

.fa-wheelchair:before {
  content: "\f193";
}

.fa-vimeo-square:before {
  content: "\f194";
}

.fa-turkish-lira:before,
.fa-try:before {
  content: "\f195";
}

.fa-plus-square-o:before {
  content: "\f196";
}

.fa-space-shuttle:before {
  content: "\f197";
}

.fa-slack:before {
  content: "\f198";
}

.fa-envelope-square:before {
  content: "\f199";
}

.fa-wordpress:before {
  content: "\f19a";
}

.fa-openid:before {
  content: "\f19b";
}

.fa-institution:before,
.fa-bank:before,
.fa-university:before {
  content: "\f19c";
}

.fa-mortar-board:before,
.fa-graduation-cap:before {
  content: "\f19d";
}

.fa-yahoo:before {
  content: "\f19e";
}

.fa-google:before {
  content: "\f1a0";
}

.fa-reddit:before {
  content: "\f1a1";
}

.fa-reddit-square:before {
  content: "\f1a2";
}

.fa-stumbleupon-circle:before {
  content: "\f1a3";
}

.fa-stumbleupon:before {
  content: "\f1a4";
}

.fa-delicious:before {
  content: "\f1a5";
}

.fa-digg:before {
  content: "\f1a6";
}

.fa-pied-piper:before {
  content: "\f1a7";
}

.fa-pied-piper-alt:before {
  content: "\f1a8";
}

.fa-drupal:before {
  content: "\f1a9";
}

.fa-joomla:before {
  content: "\f1aa";
}

.fa-language:before {
  content: "\f1ab";
}

.fa-fax:before {
  content: "\f1ac";
}

.fa-building:before {
  content: "\f1ad";
}

.fa-child:before {
  content: "\f1ae";
}

.fa-paw:before {
  content: "\f1b0";
}

.fa-spoon:before {
  content: "\f1b1";
}

.fa-cube:before {
  content: "\f1b2";
}

.fa-cubes:before {
  content: "\f1b3";
}

.fa-behance:before {
  content: "\f1b4";
}

.fa-behance-square:before {
  content: "\f1b5";
}

.fa-steam:before {
  content: "\f1b6";
}

.fa-steam-square:before {
  content: "\f1b7";
}

.fa-recycle:before {
  content: "\f1b8";
}

.fa-automobile:before,
.fa-car:before {
  content: "\f1b9";
}

.fa-cab:before,
.fa-taxi:before {
  content: "\f1ba";
}

.fa-tree:before {
  content: "\f1bb";
}

.fa-spotify:before {
  content: "\f1bc";
}

.fa-deviantart:before {
  content: "\f1bd";
}

.fa-soundcloud:before {
  content: "\f1be";
}

.fa-database:before {
  content: "\f1c0";
}

.fa-file-pdf-o:before {
  content: "\f1c1";
}

.fa-file-word-o:before {
  content: "\f1c2";
}

.fa-file-excel-o:before {
  content: "\f1c3";
}

.fa-file-powerpoint-o:before {
  content: "\f1c4";
}

.fa-file-photo-o:before,
.fa-file-picture-o:before,
.fa-file-image-o:before {
  content: "\f1c5";
}

.fa-file-zip-o:before,
.fa-file-archive-o:before {
  content: "\f1c6";
}

.fa-file-sound-o:before,
.fa-file-audio-o:before {
  content: "\f1c7";
}

.fa-file-movie-o:before,
.fa-file-video-o:before {
  content: "\f1c8";
}

.fa-file-code-o:before {
  content: "\f1c9";
}

.fa-vine:before {
  content: "\f1ca";
}

.fa-codepen:before {
  content: "\f1cb";
}

.fa-jsfiddle:before {
  content: "\f1cc";
}

.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-saver:before,
.fa-support:before,
.fa-life-ring:before {
  content: "\f1cd";
}

.fa-circle-o-notch:before {
  content: "\f1ce";
}

.fa-ra:before,
.fa-rebel:before {
  content: "\f1d0";
}

.fa-ge:before,
.fa-empire:before {
  content: "\f1d1";
}

.fa-git-square:before {
  content: "\f1d2";
}

.fa-git:before {
  content: "\f1d3";
}

.fa-hacker-news:before {
  content: "\f1d4";
}

.fa-tencent-weibo:before {
  content: "\f1d5";
}

.fa-qq:before {
  content: "\f1d6";
}

.fa-wechat:before,
.fa-weixin:before {
  content: "\f1d7";
}

.fa-send:before,
.fa-paper-plane:before {
  content: "\f1d8";
}

.fa-send-o:before,
.fa-paper-plane-o:before {
  content: "\f1d9";
}

.fa-history:before {
  content: "\f1da";
}

.fa-genderless:before,
.fa-circle-thin:before {
  content: "\f1db";
}

.fa-header:before {
  content: "\f1dc";
}

.fa-paragraph:before {
  content: "\f1dd";
}

.fa-sliders:before {
  content: "\f1de";
}

.fa-share-alt:before {
  content: "\f1e0";
}

.fa-share-alt-square:before {
  content: "\f1e1";
}

.fa-bomb:before {
  content: "\f1e2";
}

.fa-soccer-ball-o:before,
.fa-futbol-o:before {
  content: "\f1e3";
}

.fa-tty:before {
  content: "\f1e4";
}

.fa-binoculars:before {
  content: "\f1e5";
}

.fa-plug:before {
  content: "\f1e6";
}

.fa-slideshare:before {
  content: "\f1e7";
}

.fa-twitch:before {
  content: "\f1e8";
}

.fa-yelp:before {
  content: "\f1e9";
}

.fa-newspaper-o:before {
  content: "\f1ea";
}

.fa-wifi:before {
  content: "\f1eb";
}

.fa-calculator:before {
  content: "\f1ec";
}

.fa-paypal:before {
  content: "\f1ed";
}

.fa-google-wallet:before {
  content: "\f1ee";
}

.fa-cc-visa:before {
  content: "\f1f0";
}

.fa-cc-mastercard:before {
  content: "\f1f1";
}

.fa-cc-discover:before {
  content: "\f1f2";
}

.fa-cc-amex:before {
  content: "\f1f3";
}

.fa-cc-paypal:before {
  content: "\f1f4";
}

.fa-cc-stripe:before {
  content: "\f1f5";
}

.fa-bell-slash:before {
  content: "\f1f6";
}

.fa-bell-slash-o:before {
  content: "\f1f7";
}

.fa-trash:before {
  content: "\f1f8";
}

.fa-copyright:before {
  content: "\f1f9";
}

.fa-at:before {
  content: "\f1fa";
}

.fa-eyedropper:before {
  content: "\f1fb";
}

.fa-paint-brush:before {
  content: "\f1fc";
}

.fa-birthday-cake:before {
  content: "\f1fd";
}

.fa-area-chart:before {
  content: "\f1fe";
}

.fa-pie-chart:before {
  content: "\f200";
}

.fa-line-chart:before {
  content: "\f201";
}

.fa-lastfm:before {
  content: "\f202";
}

.fa-lastfm-square:before {
  content: "\f203";
}

.fa-toggle-off:before {
  content: "\f204";
}

.fa-toggle-on:before {
  content: "\f205";
}

.fa-bicycle:before {
  content: "\f206";
}

.fa-bus:before {
  content: "\f207";
}

.fa-ioxhost:before {
  content: "\f208";
}

.fa-angellist:before {
  content: "\f209";
}

.fa-cc:before {
  content: "\f20a";
}

.fa-shekel:before,
.fa-sheqel:before,
.fa-ils:before {
  content: "\f20b";
}

.fa-meanpath:before {
  content: "\f20c";
}

.fa-buysellads:before {
  content: "\f20d";
}

.fa-connectdevelop:before {
  content: "\f20e";
}

.fa-dashcube:before {
  content: "\f210";
}

.fa-forumbee:before {
  content: "\f211";
}

.fa-leanpub:before {
  content: "\f212";
}

.fa-sellsy:before {
  content: "\f213";
}

.fa-shirtsinbulk:before {
  content: "\f214";
}

.fa-simplybuilt:before {
  content: "\f215";
}

.fa-skyatlas:before {
  content: "\f216";
}

.fa-cart-plus:before {
  content: "\f217";
}

.fa-cart-arrow-down:before {
  content: "\f218";
}

.fa-diamond:before {
  content: "\f219";
}

.fa-ship:before {
  content: "\f21a";
}

.fa-user-secret:before {
  content: "\f21b";
}

.fa-motorcycle:before {
  content: "\f21c";
}

.fa-street-view:before {
  content: "\f21d";
}

.fa-heartbeat:before {
  content: "\f21e";
}

.fa-venus:before {
  content: "\f221";
}

.fa-mars:before {
  content: "\f222";
}

.fa-mercury:before {
  content: "\f223";
}

.fa-transgender:before {
  content: "\f224";
}

.fa-transgender-alt:before {
  content: "\f225";
}

.fa-venus-double:before {
  content: "\f226";
}

.fa-mars-double:before {
  content: "\f227";
}

.fa-venus-mars:before {
  content: "\f228";
}

.fa-mars-stroke:before {
  content: "\f229";
}

.fa-mars-stroke-v:before {
  content: "\f22a";
}

.fa-mars-stroke-h:before {
  content: "\f22b";
}

.fa-neuter:before {
  content: "\f22c";
}

.fa-facebook-official:before {
  content: "\f230";
}

.fa-pinterest-p:before {
  content: "\f231";
}

.fa-whatsapp:before {
  content: "\f232";
}

.fa-server:before {
  content: "\f233";
}

.fa-user-plus:before {
  content: "\f234";
}

.fa-user-times:before {
  content: "\f235";
}

.fa-hotel:before,
.fa-bed:before {
  content: "\f236";
}

.fa-viacoin:before {
  content: "\f237";
}

.fa-train:before {
  content: "\f238";
}

.fa-subway:before {
  content: "\f239";
}

.fa-medium:before {
  content: "\f23a";
}

/*! Prefixes.scss v0.2.0 | CSS(3) prefixes mixins library for Sass/Scss, Custom you need CSS prefixes. | Author: Pandao | Copyright (c) 2015 Pandao, MIT License | https://github.com/pandao/prefixes.scss | 2015-06-19 */
/* ================  Components  ================ */
/* arrow */
.pui-arrow-up, .pui-arrow-down, .pui-arrow-left, .pui-arrow-right {
  margin-top: -1px;
  margin-left: 2px;
  display: inline-block;
  vertical-align: middle;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
}

.pui-arrow-up, .pui-arrow-down {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}

.pui-arrow-up {
  border-bottom: 4px solid;
}

.pui-arrow-down {
  border-top: 4px solid;
}

.pui-arrow-left, .pui-arrow-right {
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}

.pui-arrow-left {
  border-right: 4px solid;
}

.pui-arrow-right {
  border-left: 4px solid;
}

.pui-arrow-small {
  border-width: 4px;
}

.pui-arrow-medium {
  border-width: 5px;
}

.pui-arrow-large {
  border-width: 6px;
}

.pui-arrow-xlarge {
  border-width: 7px;
}

.pui-arrow-xxlarge {
  border-width: 8px;
}

.pui-symbol-gt:after, .pui-symbol-lt:after, .pui-symbol-gt-up:after, .pui-symbol-gt-down:after {
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.pui-symbol-gt:after {
  content: "\f105";
}

.pui-symbol-gt-up:after {
  content: "\f106";
}

.pui-symbol-gt-down:after {
  content: "\f107";
}

.pui-symbol-lt:after {
  content: "\f104";
}

html.pui-app {
  -ms-touch-action: none;
}

html.pui-app, html.pui-app > body {
  height: 100%;
  overflow: hidden;
}

.pui-app-layout {
  height: 100%;
  background: #333;
  position: relative;
}

.pui-app-layout > .pui-app-main, .pui-app-layout > .pui-side-slide-left, .pui-app-layout > .pui-side-slide-right,
.pui-app-layout > .pui-side-slide-top, .pui-app-layout > .pui-side-slide-bottom {
  position: relative;
  display: block;
  overflow: auto;
}

.pui-app-layout > .pui-side-slide-left, .pui-app-layout > .pui-side-slide-right,
.pui-app-layout > .pui-side-slide-top, .pui-app-layout > .pui-side-slide-bottom {
  display: none;
}

.pui-app-layout > .pui-side-slide-left {
  width: 240px;
  height: 100%;
  background: #333;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-box-shadow: inset -5px 0 10px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: inset -5px 0 10px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-app-layout > .pui-app-main {
  overflow: hidden;
  max-width: 100%;
  min-width: 100%;
  height: 100%;
  background: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /* Firefox 28+, IE11, Opera 12.10 */
}

.pui-app-layout > .pui-app-main > .pui-app-header {
  width: 100%;
  height: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0;
  border: none;
  vertical-align: middle;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
  -webkit-box-direction: normal;
  -webkit-box-orient: horizontal;
  -webkit-flex-direction: row;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  /* Firefox 28+, IE11, Opera 12.10 */
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  /* Safari 7.0+, Chrome 21.0+ */
  -moz-align-items: center;
  align-items: center;
  /* Firefox 20.0+, IE11+, Opera 12.10 */
  position: relative;
  z-index: 1000;
}

.pui-app-layout > .pui-app-main > .pui-app-main-container {
  width: 100%;
  overflow: auto;
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
  padding: 0;
  -webkit-overflow-scrolling: touch;
  z-index: 1;
}

.pui-app-layout > .pui-app-main > .pui-side-position-mask {
  z-index: 79;
}

.pui-app-layout > .pui-app-main > .pui-app-footer {
  width: 100%;
  height: 48px;
  height: 4.8rem;
  vertical-align: middle;
  -webkit-box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.15);
  /* Webkit browsers */
  box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.15);
  /* IE9+, News */
  z-index: 1000;
  position: relative;
}

.pui-app-layout > .pui-app-main > .pui-app-footer > .pui-button-sheet {
  border: none;
  vertical-align: middle;
}

.pui-app-layout > .pui-app-main > .pui-mask {
  display: none;
  z-index: 101;
}

.pui-app-layout > .pui-app-main-next {
  left: 100%;
  display: none;
}

.pui-app-layout > .pui-side-slide-right {
  width: 240px;
  height: 100%;
  background: #333;
  position: absolute;
  top: 0;
  right: 0;
  -webkit-box-shadow: inset 5px 0 10px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: inset 5px 0 10px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-app-layout > .pui-side-slide-top {
  max-width: 100%;
  min-width: 100%;
  height: 180px;
  background: #333;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-box-shadow: inset 0 -5px 10px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: inset 0 -5px 10px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-app-layout > .pui-side-slide-bottom {
  max-width: 100%;
  min-width: 100%;
  height: 180px;
  background: #333;
  position: absolute;
  bottom: 0;
  left: 0;
  -webkit-box-shadow: inset 0 5px 10px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: inset 0 5px 10px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

[pui-side-slide] {
  cursor: pointer;
}

.pui-side-position-left, .pui-side-position-right,
.pui-side-position-top, .pui-side-position-bottom {
  display: none;
  overflow: auto;
  width: 240px;
  margin: 48px 0;
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  z-index: 80;
  -webkit-overflow-scrolling: touch;
}

.pui-side-position-left {
  left: 0;
}

.pui-side-position-right {
  right: 0;
}

.pui-side-position-top, .pui-side-position-bottom {
  width: 100%;
  height: 240px;
  margin: 0;
  top: auto;
  left: 0;
  color: #666;
  background: #fff;
}

.pui-side-position-top {
  top: 0;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-side-position-bottom {
  bottom: 0;
  -webkit-box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-side-position-zindex-top {
  z-index: 101;
}

.pui-app-header-middle {
  text-align: center;
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-app-header-aside > a, .pui-app-header-offside > a {
  text-align: center;
  display: inline-block;
  padding: 12px;
  min-width: 48px;
}

html.no-touch .pui-app-header-aside > a:hover, .pui-app-header-aside > a.hover, html.no-touch .pui-app-header-offside > a:hover, .pui-app-header-offside > a.hover {
  background-color: rgba(0, 0, 0, 0.1);
}

.pui-app-scroller {
  width: 100%;
  z-index: 1;
  position: absolute;
  -webkit-tap-highlight-color: transparent;
  -webkit-transform: translateZ(0);
  /* Safari, Chrome */
  -moz-transform: translateZ(0);
  /* Firefox 3.5~16.0 */
  -ms-transform: translateZ(0);
  /* IE9~10 */
  -o-transform: translateZ(0);
  /* Opera 10.5~12.10 */
  transform: translateZ(0);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-text-size-adjust: none;
  /* Chrome 27+ */
  -moz-text-size-adjust: none;
  /* Firefox */
  text-size-adjust: none;
  /* None yet */
}

/* badge */
.pui-badge {
  cursor: pointer;
  min-width: 24px;
  padding: 0 2px 1px;
  padding: 0 0.2rem 1px;
  font-size: 10px;
  font-size: 1rem;
  text-align: center;
  border: 1px solid transparent;
  white-space: nowrap;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-transition: color 0.15s ease-out, border-color 0.15s ease-out, background-color 0.15s ease-out;
  /* Safari, Chrome */
  -moz-transition: color 0.15s ease-out, border-color 0.15s ease-out, background-color 0.15s ease-out;
  /* Firefox 4.0~16.0 */
  transition: color 0.15s ease-out, border-color 0.15s ease-out, background-color 0.15s ease-out;
  /* IE >9, FF >15, Opera >12.0 */
}

.pui-badge.pui-badge-default {
  color: #ccc;
  background: #fff;
  border: 1px solid #ddd;
}

.pui-badge.pui-badge-default a {
  color: #999;
}

html.no-touch .pui-badge.pui-badge-default:hover, .pui-badge.pui-badge-default.hover {
  color: #999;
  background-color: #f6f6f6;
}

.pui-badge.pui-badge-grey {
  color: #ccc;
  background: #f6f6f6;
  border: 1px solid #ddd;
}

.pui-badge.pui-badge-grey a {
  color: #ccc;
}

html.no-touch .pui-badge.pui-badge-grey:hover, .pui-badge.pui-badge-grey.hover {
  color: #ccc;
  background-color: #eee;
}

.pui-badge.pui-badge-gary {
  color: #fff;
  border-color: #DDDDDD;
  background-color: #DDDDDD;
}

.pui-badge.pui-badge-gary a {
  color: #fff;
}

html.no-touch .pui-badge.pui-badge-gary:hover, .pui-badge.pui-badge-gary.hover {
  color: #fff;
  background-color: #c4c4c4;
}

.pui-badge.pui-badge-border-gary {
  color: #DDDDDD;
  border-color: #DDDDDD;
}

html.no-touch .pui-badge.pui-badge-border-gary:hover, .pui-badge.pui-badge-border-gary.hover {
  color: #fff;
  background-color: #c4c4c4;
}

.pui-badge.pui-badge-primary {
  color: #fff;
  border-color: #008EE5;
  background-color: #008EE5;
}

.pui-badge.pui-badge-primary a {
  color: #fff;
}

html.no-touch .pui-badge.pui-badge-primary:hover, .pui-badge.pui-badge-primary.hover {
  color: #fff;
  background-color: #006eb2;
}

.pui-badge.pui-badge-border-primary {
  color: #008EE5;
  border-color: #008EE5;
}

html.no-touch .pui-badge.pui-badge-border-primary:hover, .pui-badge.pui-badge-border-primary.hover {
  color: #fff;
  background-color: #006eb2;
}

.pui-badge.pui-badge-secondary {
  color: #fff;
  border-color: #3BB4F2;
  background-color: #3BB4F2;
}

.pui-badge.pui-badge-secondary a {
  color: #fff;
}

html.no-touch .pui-badge.pui-badge-secondary:hover, .pui-badge.pui-badge-secondary.hover {
  color: #fff;
  background-color: #10a0ea;
}

.pui-badge.pui-badge-border-secondary {
  color: #3BB4F2;
  border-color: #3BB4F2;
}

html.no-touch .pui-badge.pui-badge-border-secondary:hover, .pui-badge.pui-badge-border-secondary.hover {
  color: #fff;
  background-color: #10a0ea;
}

.pui-badge.pui-badge-info {
  color: #fff;
  border-color: #C54B3B;
  background-color: #C54B3B;
}

.pui-badge.pui-badge-info a {
  color: #fff;
}

html.no-touch .pui-badge.pui-badge-info:hover, .pui-badge.pui-badge-info.hover {
  color: #fff;
  background-color: #24869d;
}

.pui-badge.pui-badge-border-info {
  color: #2EAAC6;
  border-color: #2EAAC6;
}

html.no-touch .pui-badge.pui-badge-border-info:hover, .pui-badge.pui-badge-border-info.hover {
  color: #fff;
  background-color: #24869d;
}

.pui-badge.pui-badge-success {
  color: #fff;
  border-color: #71B472;
  background-color: #71B472;
}

.pui-badge.pui-badge-success a {
  color: #fff;
}

html.no-touch .pui-badge.pui-badge-success:hover, .pui-badge.pui-badge-success.hover {
  color: #fff;
  background-color: #549e55;
}

.pui-badge.pui-badge-border-success {
  color: #71B472;
  border-color: #71B472;
}

html.no-touch .pui-badge.pui-badge-border-success:hover, .pui-badge.pui-badge-border-success.hover {
  color: #fff;
  background-color: #549e55;
}

.pui-badge.pui-badge-warning {
  color: #fff;
  border-color: #FFB74D;
  background-color: #FFB74D;
}

.pui-badge.pui-badge-warning a {
  color: #fff;
}

html.no-touch .pui-badge.pui-badge-warning:hover, .pui-badge.pui-badge-warning.hover {
  color: #fff;
  background-color: #ffa21a;
}

.pui-badge.pui-badge-border-warning {
  color: #FFB74D;
  border-color: #FFB74D;
}

html.no-touch .pui-badge.pui-badge-border-warning:hover, .pui-badge.pui-badge-border-warning.hover {
  color: #fff;
  background-color: #ffa21a;
}

.pui-badge.pui-badge-error {
  color: #fff;
  border-color: #E87467;
  background-color: #E87467;
}

.pui-badge.pui-badge-error a {
  color: #fff;
}

html.no-touch .pui-badge.pui-badge-error:hover, .pui-badge.pui-badge-error.hover {
  color: #fff;
  background-color: #e14b3b;
}

.pui-badge.pui-badge-border-error {
  color: #E87467;
  border-color: #E87467;
}

html.no-touch .pui-badge.pui-badge-border-error:hover, .pui-badge.pui-badge-border-error.hover {
  color: #fff;
  background-color: #e14b3b;
}

.pui-badge.pui-badge-unbordered {
  border: none;
}

.pui-badge.pui-badge-circle {
  -webkit-border-radius: 400px;
  border-radius: 400px;
}

.pui-badge.pui-badge-square {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-badge.pui-badge-dot {
  display: inline-block;
  width: 10px;
  min-width: 10px;
  height: 10px;
  padding: 0;
  line-height: 14px;
  text-indent: -9999em;
  border-radius: 5px;
}

/* Buttons */
.pui-btn {
  cursor: pointer;
  position: relative;
  margin: 0;
  padding: 6px 12px;
  padding: 0.6rem 1.2rem;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 1.428;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  vertical-align: middle;
  display: inline-block;
  background: none;
  border: 1px solid transparent;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-transition: color 0.15s ease-out, border-color 0.15s ease-out, background-color 0.15s ease-out;
  /* Safari, Chrome */
  -moz-transition: color 0.15s ease-out, border-color 0.15s ease-out, background-color 0.15s ease-out;
  /* Firefox 4.0~16.0 */
  transition: color 0.15s ease-out, border-color 0.15s ease-out, background-color 0.15s ease-out;
  /* IE >9, FF >15, Opera >12.0 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

html.no-touch .pui-btn:hover, .pui-btn:focus, .pui-btn.hover, .pui-btn.focus, .pui-btn.pui-hover, .pui-btn.pui-focus {
  text-decoration: none;
}

.pui-btn:active, .pui-btn.active, .pui-btn.pui-active {
  outline: 0;
  color: #fff;
  background-image: none;
  -webkit-box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15);
  /* Webkit browsers */
  box-shadow: inset 1px 2px 5px rgba(0, 0, 0, 0.15);
  /* IE9+, News */
}

.pui-btn .fa {
  margin-top: -3px;
  margin-top: -0.3rem;
}

*.disabled, *.pui-disabled, *[disabled], .pui-btn.disabled, .pui-btn.pui-disabled, .pui-btn[disabled], fieldset[disabled] .pui-btn,
input[type="text"].disabled, input[type="text"].pui-disabled, input[type="text"][disabled],
input[type="password"].disabled, input[type="password"].pui-disabled, input[type="password"][disabled],
input[type="email"].disabled, input[type="email"].pui-disabled, input[type="email"][disabled],
input[type="url"].disabled, input[type="url"].pui-disabled, input[type="url"][disabled],
input[type="number"].disabled, input[type="number"].pui-disabled, input[type="number"][disabled],
input[type="range"].disabled, input[type="range"].pui-disabled, input[type="range"][disabled],
input[type="date"].disabled, input[type="date"].pui-disabled, input[type="date"][disabled],
input[type="color"].disabled, input[type="color"].pui-disabled, input[type="color"][disabled],
input[type="search"].disabled, input[type="search"].pui-disabled, input[type="search"][disabled],
select.disabled, select.pui-disabled, select[disabled] {
  cursor: not-allowed;
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
  -webkit-box-shadow: none;
  /* Webkit browsers */
  box-shadow: none;
  /* IE9+, News */
}

.pui-btn-large, .pui-btn-group.pui-btn-large > .pui-btn {
  padding: 6px 16px;
  padding: 0.6rem 1.6rem;
  font-size: 16px;
  font-size: 1.6rem;
}

.pui-btn-medium, .pui-btn-group.pui-btn-medium > .pui-btn {
  padding: 6px 12px;
  padding: 0.6rem 1.2rem;
  font-size: 14px;
  font-size: 1.4rem;
}

.pui-btn-small, .pui-btn-xsmall, .pui-btn-group.pui-btn-small > .pui-btn, .pui-btn-group.pui-btn-xsmall > .pui-btn {
  padding: 5px 10px;
  padding: 0.5rem 1rem;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.5;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.pui-btn-xsmall, .pui-btn-group.pui-btn-xsmall > .pui-btn {
  padding: 1px 5px;
  padding: 0.1rem 0.5rem;
  line-height: 1.5;
}

.pui-btn-default {
  color: #666;
  border-color: #ddd;
  background-color: #fff;
}

html.no-touch .pui-btn-default:hover, .pui-btn-default.hover, .pui-btn-default.pui-hover {
  color: #333;
  border-color: #ccc;
  background-color: #eee;
}

.pui-btn-default:active, .pui-btn-default.active, .pui-btn-default.pui-active {
  color: #666;
}

.pui-btn-primary, .pui-btn-secondary, .pui-btn-info, .pui-btn-success, .pui-btn-warning, .pui-btn-error {
  color: #fff;
}

html.no-touch .pui-btn-primary:hover, .pui-btn-primary.hover, .pui-btn-primary.pui-hover, html.no-touch .pui-btn-secondary:hover, .pui-btn-secondary.hover, .pui-btn-secondary.pui-hover, html.no-touch .pui-btn-info:hover, .pui-btn-info.hover, .pui-btn-info.pui-hover, html.no-touch .pui-btn-success:hover, .pui-btn-success.hover, .pui-btn-success.pui-hover, html.no-touch .pui-btn-warning:hover, .pui-btn-warning.hover, .pui-btn-warning.pui-hover, html.no-touch .pui-btn-error:hover, .pui-btn-error.hover, .pui-btn-error.pui-hover {
  color: #fff;
}

.pui-btn-gary {
  border-color: #DDDDDD;
  background-color: #DDDDDD;
}

html.no-touch .pui-btn-gary:hover, .pui-btn-gary.hover, .pui-btn-gary.pui-hover {
  border-color: #c4c4c4;
  background-color: #c4c4c4;
}

.pui-btn-primary {
  color: #fff;
  border-color: #C54B3B;
  background-color: #C54B3B;
}

html.no-touch .pui-btn-primary:hover, .pui-btn-primary.hover, .pui-btn-primary.pui-hover {
  border-color: #006eb2;
  background-color: #006eb2;
}

.pui-btn-secondary {
  color: #fff;
  border-color: #3BB4F2;
  background-color: #3BB4F2;
}

html.no-touch .pui-btn-secondary:hover, .pui-btn-secondary.hover, .pui-btn-secondary.pui-hover {
  border-color: #10a0ea;
  background-color: #10a0ea;
}

.pui-btn-info {
  color: #fff;
  border-color: #2EAAC6;
  background-color: #2EAAC6;
}

html.no-touch .pui-btn-info:hover, .pui-btn-info.hover, .pui-btn-info.pui-hover {
  border-color: #24869d;
  background-color: #24869d;
}

.pui-btn-success {
  color: #fff;
  border-color: #71B472;
  background-color: #71B472;
}

html.no-touch .pui-btn-success:hover, .pui-btn-success.hover, .pui-btn-success.pui-hover {
  border-color: #549e55;
  background-color: #549e55;
}

.pui-btn-warning {
  color: #fff;
  border-color: #FFB74D;
  background-color: #FFB74D;
}

html.no-touch .pui-btn-warning:hover, .pui-btn-warning.hover, .pui-btn-warning.pui-hover {
  border-color: #ffa21a;
  background-color: #ffa21a;
}

.pui-btn-error {
  color: #fff;
  border-color: #E87467;
  background-color: #E87467;
}

html.no-touch .pui-btn-error:hover, .pui-btn-error.hover, .pui-btn-error.pui-hover {
  border-color: #e14b3b;
  background-color: #e14b3b;
}

a.pui-btn-primary {
  color: #fff;
}

a.pui-btn-secondary {
  color: #fff;
}

a.pui-btn-info {
  color: #fff;
}

a.pui-btn-success {
  color: #fff;
}

a.pui-btn-warning {
  color: #fff;
}

a.pui-btn-error {
  color: #fff;
}

.pui-btn-link {
  background: none;
  border-color: #fff;
}

html.no-touch .pui-btn-link:hover, .pui-btn-link.hover, .pui-btn-link.pui-hover {
  color: #0093F2;
  text-decoration: underline;
}

.pui-btn-link.active, .pui-btn-link.pui-active {
  color: #666;
}

/* button group */
.pui-btn-group {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  background: transparent;
}

.pui-btn-group > .pui-btn {
  float: left;
}

.pui-btn-group > .pui-btn-default + .pui-btn-default {
  border-left: none;
}

.pui-btn-group > .pui-btn:not(:first-child) {
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
}

.pui-btn-group > .pui-btn:not(:last-child) {
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pui-btn-group-vertical .pui-btn {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-btn-group-vertical .pui-btn-default + .pui-btn-default {
  border-top: none;
  border-left: 1px solid #ddd;
}

.pui-btn-group-vertical .pui-btn-group {
  margin-bottom: 1rem;
}

.pui-btn-group-vertical .pui-btn:first-child {
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
}

.pui-btn-group-vertical .pui-btn:last-child {
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.pui-btn-group-justify {
  width: 100%;
  background: transparent;
  -webkit-box-orient: horizontal;
  -moz-box-orient: horizontal;
  box-orient: horizontal;
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-btn-group-justify > .pui-btn {
  float: none;
  width: 100%;
  display: block;
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-btn-toolbar {
  background: transparent;
  margin-bottom: 15px;
  margin-bottom: 1.5rem;
}

.pui-btn-toolbar .pui-btn-group {
  float: left;
}

.pui-btn-toolbar > .pui-btn + .pui-btn, .pui-btn-toolbar > .pui-btn-group + .pui-btn, .pui-btn-toolbar > .pui-btn + .pui-btn-group, .pui-btn-toolbar > .pui-btn-group + .pui-btn-group {
  margin-left: 5px;
  margin-left: 0.5rem;
}

.pui-btn.round, .pui-btn-group.round > .pui-btn, .pui-btn-round {
  -webkit-border-radius: 500px;
  border-radius: 500px;
}

.pui-btn.square, .pui-btn-group.square > .pui-btn, .pui-btn-square {
  -webkit-border-radius: 0;
  border-radius: 0;
}

/* button box-shadow */
.pui-btn-default.pui-btn-shadow, .pui-btn-shadow .pui-btn-default {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  /* IE9+, News */
}

html.no-touch .pui-btn-default.pui-btn-shadow:hover, .pui-btn-default.pui-btn-shadow.hover, .pui-btn-default.pui-btn-shadow.pui-hover, html.no-touch .pui-btn-shadow .pui-btn-default:hover, .pui-btn-shadow .pui-btn-default.hover, .pui-btn-shadow .pui-btn-default.pui-hover {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-btn-gary.pui-btn-shadow, .pui-btn-shadow .pui-btn-gary {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
}

html.no-touch .pui-btn-gary.pui-btn-shadow:hover, .pui-btn-gary.pui-btn-shadow.hover, .pui-btn-gary.pui-btn-shadow.pui-hover, html.no-touch .pui-btn-shadow .pui-btn-gary:hover, .pui-btn-shadow .pui-btn-gary.hover, .pui-btn-shadow .pui-btn-gary.pui-hover {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* IE9+, News */
}

.pui-btn-primary.pui-btn-shadow, .pui-btn-shadow .pui-btn-primary {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
}

html.no-touch .pui-btn-primary.pui-btn-shadow:hover, .pui-btn-primary.pui-btn-shadow.hover, .pui-btn-primary.pui-btn-shadow.pui-hover, html.no-touch .pui-btn-shadow .pui-btn-primary:hover, .pui-btn-shadow .pui-btn-primary.hover, .pui-btn-shadow .pui-btn-primary.pui-hover {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* IE9+, News */
}

.pui-btn-secondary.pui-btn-shadow, .pui-btn-shadow .pui-btn-secondary {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
}

html.no-touch .pui-btn-secondary.pui-btn-shadow:hover, .pui-btn-secondary.pui-btn-shadow.hover, .pui-btn-secondary.pui-btn-shadow.pui-hover, html.no-touch .pui-btn-shadow .pui-btn-secondary:hover, .pui-btn-shadow .pui-btn-secondary.hover, .pui-btn-shadow .pui-btn-secondary.pui-hover {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* IE9+, News */
}

.pui-btn-info.pui-btn-shadow, .pui-btn-shadow .pui-btn-info {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
}

html.no-touch .pui-btn-info.pui-btn-shadow:hover, .pui-btn-info.pui-btn-shadow.hover, .pui-btn-info.pui-btn-shadow.pui-hover, html.no-touch .pui-btn-shadow .pui-btn-info:hover, .pui-btn-shadow .pui-btn-info.hover, .pui-btn-shadow .pui-btn-info.pui-hover {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* IE9+, News */
}

.pui-btn-success.pui-btn-shadow, .pui-btn-shadow .pui-btn-success {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
}

html.no-touch .pui-btn-success.pui-btn-shadow:hover, .pui-btn-success.pui-btn-shadow.hover, .pui-btn-success.pui-btn-shadow.pui-hover, html.no-touch .pui-btn-shadow .pui-btn-success:hover, .pui-btn-shadow .pui-btn-success.hover, .pui-btn-shadow .pui-btn-success.pui-hover {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* IE9+, News */
}

.pui-btn-warning.pui-btn-shadow, .pui-btn-shadow .pui-btn-warning {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
}

html.no-touch .pui-btn-warning.pui-btn-shadow:hover, .pui-btn-warning.pui-btn-shadow.hover, .pui-btn-warning.pui-btn-shadow.pui-hover, html.no-touch .pui-btn-shadow .pui-btn-warning:hover, .pui-btn-shadow .pui-btn-warning.hover, .pui-btn-shadow .pui-btn-warning.pui-hover {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* IE9+, News */
}

.pui-btn-error.pui-btn-shadow, .pui-btn-shadow .pui-btn-error {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
}

html.no-touch .pui-btn-error.pui-btn-shadow:hover, .pui-btn-error.pui-btn-shadow.hover, .pui-btn-error.pui-btn-shadow.pui-hover, html.no-touch .pui-btn-shadow .pui-btn-error:hover, .pui-btn-shadow .pui-btn-error.hover, .pui-btn-shadow .pui-btn-error.pui-hover {
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  /* IE9+, News */
}

.pui-btn-toolbar.pui-btn-shadow .pui-btn-group, .pui-btn-group-justify.pui-btn-shadow .pui-btn-group, .pui-btn-group.pui-btn-default > .pui-btn-default {
  -webkit-box-shadow: none;
  /* Webkit browsers */
  box-shadow: none;
  /* IE9+, News */
}

.pui-btn.pui-btn-block {
  width: 100%;
  display: block;
  text-align: center;
  margin-bottom: 15px;
  margin-bottom: 1.5rem;
}

.pui-btn.pui-btn-block:last-child {
  margin-bottom: 0;
}

.pui-btn .pui-badge-dot {
  margin-bottom: 0;
}

/* button dropdown menu */
.pui-btn-dropdown {
  display: inline-block;
  position: relative;
}

.pui-btn-dropdown .pui-btn {
  float: left;
}

.pui-btn-dropdown .pui-btn:first-child {
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pui-btn-dropdown .pui-btn + .pui-btn {
  padding-left: 0.8rem;
  padding-right: 0.8rem;
  margin-left: -1px;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
}

.pui-btn-dropdown .pui-btn-gary + .pui-btn-gary {
  border-left: 1px solid #c4c4c4;
}

.pui-btn-dropdown .pui-btn-primary + .pui-btn-primary {
  border-left: 1px solid #006eb2;
}

.pui-btn-dropdown .pui-btn-secondary + .pui-btn-secondary {
  border-left: 1px solid #10a0ea;
}

.pui-btn-dropdown .pui-btn-info + .pui-btn-info {
  border-left: 1px solid #24869d;
}

.pui-btn-dropdown .pui-btn-success + .pui-btn-success {
  border-left: 1px solid #549e55;
}

.pui-btn-dropdown .pui-btn-warning + .pui-btn-warning {
  border-left: 1px solid #ffa21a;
}

.pui-btn-dropdown .pui-btn-error + .pui-btn-error {
  border-left: 1px solid #e14b3b;
}

/* Button : close button */
.pui-close {
  padding: 3px 5px;
  cursor: pointer;
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  display: inline-block;
  color: #333;
  font-size: 16px;
  font-size: 1.6rem;
  text-rendering: auto;
  text-align: center;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-transition: opacity 300ms ease-out;
  /* Safari, Chrome */
  -moz-transition: opacity 300ms ease-out;
  /* Firefox 4.0~16.0 */
  transition: opacity 300ms ease-out;
  /* IE >9, FF >15, Opera >12.0 */
}

.pui-close:after {
  opacity: 0.3;
  /* W3C */
  filter: alpha(opacity=30);
  /* IE */
  content: "\f00d";
}

html.no-touch .pui-close:hover, .pui-close.hover {
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
}

.pui-close.disabled, .pui-close.pui-disabled {
  cursor: not-allowed;
}

.pui-close-bordered {
  border: 1px solid #ddd;
  background: #fff;
}

html.no-touch .pui-close-bordered:hover, .pui-close-bordered.hover {
  border-color: #ccc;
}

.pui-close-border-circle {
  border: 1px solid #ddd;
  -webkit-border-radius: 500px;
  border-radius: 500px;
}

.pui-close-circle {
  opacity: 0.4;
  /* W3C */
  filter: alpha(opacity=40);
  /* IE */
  font-size: 21px;
  font-size: 2.1rem;
  background: transparent;
}

html.no-touch .pui-close-circle:hover, .pui-close-circle.hover {
  opacity: 0.7;
  /* W3C */
  filter: alpha(opacity=70);
  /* IE */
}

.pui-close-circle:after {
  content: "\F057";
}

.pui-close-gary {
  color: #DDDDDD;
}

.pui-close-gary:after {
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
}

html.no-touch .pui-close-gary:hover, .pui-close-gary.hover {
  opacity: 0.8;
  /* W3C */
  filter: alpha(opacity=80);
  /* IE */
}

.pui-close-primary {
  color: #008EE5;
}

.pui-close-primary:after {
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
}

html.no-touch .pui-close-primary:hover, .pui-close-primary.hover {
  opacity: 0.8;
  /* W3C */
  filter: alpha(opacity=80);
  /* IE */
}

.pui-close-secondary {
  color: #3BB4F2;
}

.pui-close-secondary:after {
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
}

html.no-touch .pui-close-secondary:hover, .pui-close-secondary.hover {
  opacity: 0.8;
  /* W3C */
  filter: alpha(opacity=80);
  /* IE */
}

.pui-close-info {
  color: #2EAAC6;
}

.pui-close-info:after {
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
}

html.no-touch .pui-close-info:hover, .pui-close-info.hover {
  opacity: 0.8;
  /* W3C */
  filter: alpha(opacity=80);
  /* IE */
}

.pui-close-success {
  color: #71B472;
}

.pui-close-success:after {
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
}

html.no-touch .pui-close-success:hover, .pui-close-success.hover {
  opacity: 0.8;
  /* W3C */
  filter: alpha(opacity=80);
  /* IE */
}

.pui-close-warning {
  color: #FFB74D;
}

.pui-close-warning:after {
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
}

html.no-touch .pui-close-warning:hover, .pui-close-warning.hover {
  opacity: 0.8;
  /* W3C */
  filter: alpha(opacity=80);
  /* IE */
}

.pui-close-error {
  color: #E87467;
}

.pui-close-error:after {
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
}

html.no-touch .pui-close-error:hover, .pui-close-error.hover {
  opacity: 0.8;
  /* W3C */
  filter: alpha(opacity=80);
  /* IE */
}

.pui-close-sm {
  padding: 3px 4px;
  font-size: 12px;
}

.pui-close-md {
  font-size: 14px;
}

.pui-close-lg {
  padding: 3px 4.8px;
  font-size: 16px;
}

.pui-close-xl {
  padding: 3px 5px;
  font-size: 18px;
}

/* Button Sheets */
.pui-button-sheet {
  background: #fff;
  width: 100%;
  border-collapse: collapse;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-button-sheet-table {
  line-height: 1;
  display: table;
  border-collapse: collapse;
  border: 1px solid #ddd;
}

.pui-button-sheet-table-unbordered {
  border: none;
}

.pui-button-sheet-row {
  display: table-row;
  width: 100%;
}

.pui-button-sheet-row > a {
  color: #999;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  -webkit-transition: all 0.05s ease-in;
  /* Safari, Chrome */
  -moz-transition: all 0.05s ease-in;
  /* Firefox 4.0~16.0 */
  transition: all 0.05s ease-in;
  /* IE >9, FF >15, Opera >12.0 */
}

html.no-touch .pui-button-sheet-row > a:hover, .pui-button-sheet-row > a.hover {
  color: #157EE0;
  background: #f6f6f6;
}

.pui-button-sheet-row > a > [class*=pui-icon], .pui-button-sheet-row > a > [class*=icon-], .pui-button-sheet-row > a > [class*=fa-] {
  display: block;
}

.pui-button-sheet-hover-bg-none > .pui-button-sheet-row > a:hover {
  background: none;
}

.pui-button-sheet-bordered > .pui-button-sheet-row > a {
  border: 1px solid #ddd;
}

.pui-button-sheet-bordered-dashed > .pui-button-sheet-row > a {
  border: 1px dashed #ddd;
}

.pui-button-sheet-position-wrapper {
  padding: 20px 10px 0 10px;
  padding: 2rem 1rem 0 1rem;
  background: #fff;
}

.pui-button-sheet-position-bottom {
  width: 100%;
  -webkit-box-shadow: 0 -2px 7px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: 0 -2px 7px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 100;
}

.pui-button-sheet-wrapper {
  padding: 10px 5px;
  padding: 1rem 0.5rem;
  border: 1px solid #ddd;
  display: inline-block;
  background: #fff;
}

.pui-button-sheet-wrapper > .pui-button-sheet-table,
.pui-button-sheet-position-wrapper > .pui-button-sheet-table {
  border: none;
}

.pui-button-sheet-list {
  line-height: 0.91;
}

.pui-button-sheet-list > a {
  margin: 0;
  line-height: 1;
  display: inline-block;
  overflow: visible;
}

html.no-touch .pui-button-sheet-list > a:hover {
  outline: 3px solid #111;
  position: relative;
}

/* Breadcrumb */
.pui-breadcrumb {
  padding: 0.5rem;
  margin-bottom: 2rem;
  list-style: none;
  font-size: 12px;
  font-size: 1.2rem;
  background: transparent;
  -webkit-border-radius: 2px;
  border-radius: 2px;
}

.pui-breadcrumb li {
  display: inline-block;
}

.pui-breadcrumb li + li:before {
  color: #ddd;
  content: "/\00a0";
  padding: 0 6px;
  padding: 0 0.6rem;
}

.pui-breadcrumb li a {
  color: #0093F2;
}

html.no-touch .pui-breadcrumb li a:hover, .pui-breadcrumb li a.hover {
  text-decoration: underline;
}

.pui-breadcrumb-right .pui-breadcrumb {
  float: right;
}

.pui-breadcrumb-right:before, .pui-breadcrumb-right:after {
  content: " ";
  display: table;
}

.pui-breadcrumb-right:after {
  clear: both;
}

.pui-breadcrumb-arrow li + li:before {
  font-family: "FontAwesome";
  font-size: 16px;
  padding: 0 8px 0 7px;
  content: "\F105";
}

/* Card */
.pui-card {
  color: #666;
  display: block;
  position: relative;
  text-align: left;
  margin-bottom: 15px;
  margin-bottom: 1.5rem;
}

.pui-card p:last-child {
  margin-bottom: 0;
}

.pui-card-head, .pui-card-title, .pui-card-foot {
  position: relative;
  padding: 6px 15px;
  padding: 0.6rem 1.5rem;
}

.pui-card-head > h1, .pui-card-head > strong, .pui-card-title > h1, .pui-card-title > strong, .pui-card-foot > h1, .pui-card-foot > strong {
  margin: 0;
  font-size: 16px;
  font-size: 1.6rem;
}

.pui-card-head > h1 small, .pui-card-head > strong small, .pui-card-title > h1 small, .pui-card-title > strong small, .pui-card-foot > h1 small, .pui-card-foot > strong small {
  padding-left: 4px;
  padding-left: 0.4rem;
}

.pui-card-box {
  padding: 15px;
  padding: 1.5rem;
  overflow: auto;
  position: relative;
  color: #666;
}

.pui-card-box > h1 {
  font-size: 22px;
  font-size: 2.2rem;
}

.pui-card-head + .pui-card-box {
  padding-top: 5px;
}

.pui-card-default {
  background: #fff;
  border: 1px solid #ddd;
}

.pui-card-simple .pui-card-box {
  padding: 5px 15px;
  padding: 0.5rem 1.5rem;
}

.pui-card-unbordered {
  border: none;
}

.pui-card-unbordered .pui-card-title, .pui-card-unbordered .pui-card-head {
  padding-top: 0;
}

.pui-card-unbordered .pui-card-foot {
  padding-bottom: 0;
}

.pui-card-unbordered .pui-card-head, .pui-card-unbordered .pui-card-title, .pui-card-unbordered .pui-card-foot, .pui-card-unbordered .pui-card-box {
  padding-left: 0;
  padding-right: 0;
}

.pui-card-badge {
  display: inline-block;
  padding: 0 5px;
  background: #fff;
  font-size: 10px;
  font-size: 1rem;
  font-weight: 700;
  line-height: 14px;
  color: #fff;
  text-align: center;
  vertical-align: middle;
  text-transform: none;
  border: 1px solid #ddd;
  -webkit-border-radius: 2px;
  border-radius: 2px;
}

.pui-card-head-bg, .pui-card-title-bg, .pui-card-foot-bg {
  background: #fafafa;
}

.pui-card-title-left-border {
  margin-left: -16px;
  margin-left: -1.6rem;
}

.pui-card-title-left-border > h1, .pui-card-title-left-border > strong {
  padding: 0;
  border-left: 4px solid #008EE5;
  padding-left: 12px;
  padding-left: 1.2rem;
}

.pui-card-title-underline {
  padding-top: 4px;
  padding-top: 0.4rem;
  padding-bottom: 5px;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #ddd;
}

.pui-card-foot-topline {
  border-top: 1px solid #ddd;
}

.pui-card-title-right {
  float: right;
  color: #ccc;
  padding-top: 4px;
  padding-top: 0.4rem;
}

.pui-card-title-right a {
  color: #ccc;
}

html.no-touch .pui-card-title-right a:hover, .pui-card-title-right a.hover {
  color: #007CFF;
}

.pui-card-title-right html.no-touch .pui-badge:hover, .pui-card-title-right .pui-badge.hover {
  color: #fff;
}

.pui-card-title-right html.no-touch .pui-badge-default:hover, .pui-card-title-right .pui-badge-default.hover {
  color: #ccc;
}

.pui-card-gary {
  border-color: white;
}

.pui-card-gary .pui-card-head, .pui-card-gary .pui-card-title, .pui-card-gary .pui-card-foot {
  color: #DDDDDD;
  border-color: white;
  background-color: white;
}

.pui-card-gary .pui-card-head small, .pui-card-gary .pui-card-head span, .pui-card-gary .pui-card-head a, .pui-card-gary .pui-card-title small, .pui-card-gary .pui-card-title span, .pui-card-gary .pui-card-title a, .pui-card-gary .pui-card-foot small, .pui-card-gary .pui-card-foot span, .pui-card-gary .pui-card-foot a {
  color: #DDDDDD;
}

.pui-card-primary {
  border-color: #75caff;
}

.pui-card-primary .pui-card-head, .pui-card-primary .pui-card-title, .pui-card-primary .pui-card-foot {
  color: #008EE5;
  border-color: #75caff;
  background-color: #a8deff;
}

.pui-card-primary .pui-card-head small, .pui-card-primary .pui-card-head span, .pui-card-primary .pui-card-head a, .pui-card-primary .pui-card-title small, .pui-card-primary .pui-card-title span, .pui-card-primary .pui-card-title a, .pui-card-primary .pui-card-foot small, .pui-card-primary .pui-card-foot span, .pui-card-primary .pui-card-foot a {
  color: #008EE5;
}

.pui-card-secondary {
  border-color: #c1e7fb;
}

.pui-card-secondary .pui-card-head, .pui-card-secondary .pui-card-title, .pui-card-secondary .pui-card-foot {
  color: #3BB4F2;
  border-color: #c1e7fb;
  background-color: #f1fafe;
}

.pui-card-secondary .pui-card-head small, .pui-card-secondary .pui-card-head span, .pui-card-secondary .pui-card-head a, .pui-card-secondary .pui-card-title small, .pui-card-secondary .pui-card-title span, .pui-card-secondary .pui-card-title a, .pui-card-secondary .pui-card-foot small, .pui-card-secondary .pui-card-foot span, .pui-card-secondary .pui-card-foot a {
  color: #3BB4F2;
}

.pui-card-info {
  border-color: #9bdae8;
}

.pui-card-info .pui-card-head, .pui-card-info .pui-card-title, .pui-card-info .pui-card-foot {
  color: #2EAAC6;
  border-color: #9bdae8;
  background-color: #c4e9f1;
}

.pui-card-info .pui-card-head small, .pui-card-info .pui-card-head span, .pui-card-info .pui-card-head a, .pui-card-info .pui-card-title small, .pui-card-info .pui-card-title span, .pui-card-info .pui-card-title a, .pui-card-info .pui-card-foot small, .pui-card-info .pui-card-foot span, .pui-card-info .pui-card-foot a {
  color: #2EAAC6;
}

.pui-card-success {
  border-color: #cee5cf;
}

.pui-card-success .pui-card-head, .pui-card-success .pui-card-title, .pui-card-success .pui-card-foot {
  color: #71B472;
  border-color: #cee5cf;
  background-color: #f0f7f0;
}

.pui-card-success .pui-card-head small, .pui-card-success .pui-card-head span, .pui-card-success .pui-card-head a, .pui-card-success .pui-card-title small, .pui-card-success .pui-card-title span, .pui-card-success .pui-card-title a, .pui-card-success .pui-card-foot small, .pui-card-success .pui-card-foot span, .pui-card-success .pui-card-foot a {
  color: #71B472;
}

.pui-card-warning {
  border-color: #FAE5C4;
}

.pui-card-warning .pui-card-head, .pui-card-warning .pui-card-title, .pui-card-warning .pui-card-foot {
  color: #FFB74D;
  border-color: #FAE5C4;
  background-color: #FCF5E8;
}

.pui-card-warning .pui-card-head small, .pui-card-warning .pui-card-head span, .pui-card-warning .pui-card-head a, .pui-card-warning .pui-card-title small, .pui-card-warning .pui-card-title span, .pui-card-warning .pui-card-title a, .pui-card-warning .pui-card-foot small, .pui-card-warning .pui-card-foot span, .pui-card-warning .pui-card-foot a {
  color: #FFB74D;
}

.pui-card-error {
  border-color: #F7D1CB;
}

.pui-card-error .pui-card-head, .pui-card-error .pui-card-title, .pui-card-error .pui-card-foot {
  color: #E87467;
  border-color: #F7D1CB;
  background-color: #FFE8E3;
}

.pui-card-error .pui-card-head small, .pui-card-error .pui-card-head span, .pui-card-error .pui-card-head a, .pui-card-error .pui-card-title small, .pui-card-error .pui-card-title span, .pui-card-error .pui-card-title a, .pui-card-error .pui-card-foot small, .pui-card-error .pui-card-foot span, .pui-card-error .pui-card-foot a {
  color: #E87467;
}

.pui-card-radius {
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.pui-card-square {
  -webkit-border-radius: none;
  border-radius: none;
}

.pui-card-group .pui-card {
  margin-bottom: 8px;
  margin-bottom: 0.8rem;
}

.pui-card-group .pui-card-head, .pui-card-group .pui-card-title, .pui-card-group .pui-card-foot {
  background: #fafafa;
}

.pui-card-padding-none .pui-card-head, .pui-card-padding-none .pui-card-title, .pui-card-padding-none .pui-card-box, .pui-card-padding-none .pui-card-foot {
  padding-left: 0;
  padding-right: 0;
}

.pui-card-box.pui-card-box-underline {
  border: none;
  border-bottom: 1px solid #ddd;
  margin-bottom: -5px;
  margin-bottom: -0.5rem;
}

.pui-card-shadow {
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

html.no-touch .pui-card-shadow:hover, .pui-card-shadow.hover, .pui-card-shadow.pui-hover {
  -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.25);
  /* Webkit browsers */
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.25);
  /* IE9+, News */
}

.pui-row .pui-card:last-child {
  margin-bottom: 0;
}

.pui-card-image {
  overflow: auto;
  border: none;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.pui-card-head-bg {
  position: relative;
  padding: 0;
}

.pui-card-head-bg > h1 {
  color: #fff;
  position: absolute;
  left: 1.5rem;
  bottom: 1.5rem;
  margin: 0;
  font-size: 2.2rem;
}

.pui-card-head-bg > h1 > small {
  color: #fff;
}

.pui-card-head-img {
  width: 100%;
  height: auto;
  margin: 0 0 -0.6rem;
}

.pui-card-radius .pui-card-head-img {
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
}

.pui-card-column {
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
  -webkit-box-direction: normal;
  -webkit-box-orient: horizontal;
  -webkit-flex-direction: row;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  /* Firefox 28+, IE11, Opera 12.10 */
}

.pui-card-column > .pui-card-box {
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-card-left, .pui-card-right {
  position: relative;
}

.pui-card-left > p, .pui-card-right > p {
  margin-bottom: 0;
}

.pui-card-left > h1, .pui-card-right > h1 {
  color: #fff;
  position: absolute;
  left: 1.5rem;
  bottom: 1.5rem;
  margin: 0;
  font-size: 2.2rem;
  line-height: 1.4;
  text-align: left;
  -webkit-text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
}

.pui-card-left > h1 > small, .pui-card-right > h1 > small {
  color: #fff;
  display: block;
  margin: 0;
}

.pui-card-right > h1 {
  text-align: right;
}

.pui-card-box-left {
  float: left;
  margin-right: 2rem;
}

.pui-card-box-right {
  float: right;
  margin-left: 2rem;
}

@media (max-width: 360px) {
  .pui-card-column {
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    /* Firefox 28+, IE11, Opera 12.10 */
  }
  .pui-card-column > .pui-card-left {
    height: auto;
  }
}

/* Comment */
.pui-comment {
  width: 100%;
  padding: 1.5rem 0;
  position: relative;
  background: #fff;
  border-bottom: 1px solid #ddd;
}

.pui-comment:before, .pui-comment:after {
  content: " ";
  display: table;
}

.pui-comment:after {
  clear: both;
}

.pui-comment:last-child {
  border-bottom: none;
}

.pui-comment a {
  color: #999;
  padding: 0 0.5rem;
  display: inline-block;
}

.pui-comment a.pui-link, html.no-touch .pui-comment a:hover, .pui-comment a.hover {
  color: #296AEA;
}

.pui-comment-arrow, .pui-comment-arrow span {
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-top: 0;
  border-bottom: 8px solid #eee;
  position: absolute;
  top: -8px;
  left: 2.4rem;
}

.pui-comment-arrow span {
  border-bottom-color: #fff;
  display: block;
  top: 2px;
  left: -8px;
}

.pui-comment-avatar {
  text-align: center;
  padding-right: 2rem;
  float: left;
}

.pui-comment-container {
  width: 100%;
  float: left;
  position: relative;
}

.pui-comment-header {
  position: relative;
  display: block;
}

.pui-comment-title {
  width: 100%;
  font-size: 1.4rem;
  margin-bottom: 0;
  position: relative;
}

.pui-comment-title-right {
  float: right;
  color: #999;
}

.pui-comment-subtitle, .pui-comment-foot {
  color: #ccc;
  font-size: 1.2rem;
}

.pui-comment-foot {
  text-align: left;
}

.pui-comment-content {
  padding: 1rem 0;
}

.pui-comment-content blockquote {
  color: #ccc;
  font-size: 1.2rem;
  margin-top: 0.5rem;
  padding: 0.8rem 1.5rem;
}

.pui-comment-avatar-left .pui-comment-avatar {
  position: absolute;
  top: 1.6rem;
  left: 0;
}

.pui-comment-avatar-left .pui-comment-container {
  padding-left: 58px;
}

.pui-comment-main {
  border: 1px solid #eee;
  border-radius: 5px;
  padding: 15px;
}

[class*=pui-comment-arrow-]:before, [class*=pui-comment-arrow-]:after {
  width: 0;
  height: 0;
  display: block;
  content: "";
  border: 8px solid transparent;
  pointer-events: pointer-events;
  position: absolute;
}

.pui-comment-arrow-lt:before, .pui-comment-arrow-lt:after {
  border-right-color: #ddd;
  top: 15px;
  left: 43px;
}

.pui-comment-arrow-lt:after {
  border-right-color: #fff;
  left: 44px;
}

.pui-comment-arrow-rt:before, .pui-comment-arrow-rt:after {
  border-left-color: #ddd;
  top: 15px;
  right: 43px;
}

.pui-comment-arrow-rt:after {
  border-left-color: #fff;
  right: 44px;
}

.pui-comment-avatar-right > .pui-comment-avatar {
  position: absolute;
  top: 1.6rem;
  right: 0;
  padding-right: 0;
}

.pui-comment-avatar-right > .pui-comment-container {
  padding-right: 58px;
}

.pui-comment-reply .pui-comment {
  margin: 15px auto;
  padding: 10px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #eee;
  background: #fff;
}

.pui-comment-reply .pui-comment-avatar-left .pui-comment-avatar {
  top: 1.4rem;
  left: 1.4rem;
}

.pui-comment-reply .pui-comment:last-child {
  margin-bottom: 0;
}

@media (max-width: 640px) {
  .pui-comment-reply .pui-comment-reply-time {
    display: block;
  }
}

.pui-color-picker {
  position: relative;
}

.pui-color-picker:after {
  color: #000;
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  font-size: 1.5em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f200";
  opacity: 0.2;
  /* W3C */
  filter: alpha(opacity=20);
  /* IE */
  position: absolute;
  top: 0.2rem;
  right: 1rem;
}

.pui-color-picker > .pui-button-sheet-list {
  padding: 1rem;
  background: #fff;
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  /* Webkit browsers */
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
  /* IE9+, News */
  position: absolute;
  top: 100%;
  left: 0;
}

.pui-color-picker > .pui-button-sheet-list > a {
  width: 2rem;
  height: 2rem;
}

/* WebComponents : Custom Checkbox & Radio */
pui-checkbox, pui-radio {
  font-size: 14px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

pui-checkbox:before, pui-radio:before {
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  font-size: 18px;
  font-size: 1.8rem;
  padding-right: 5px;
  padding-right: 0.5rem;
  line-height: 1;
  vertical-align: middle;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #ddd;
  content: "\F096";
}

pui-checkbox > input, pui-radio > input {
  width: 0;
  height: 0;
  visibility: hidden;
}

pui-checkbox + pui-checkbox, pui-radio + pui-radio {
  margin-left: 10px;
  margin-left: 1rem;
}

pui-checkbox.checked:before {
  color: #71B472;
  content: "\F046";
}

pui-radio:before {
  content: "\F10C";
}

pui-radio.checked:before {
  color: #71B472;
  content: "\f192";
}

.pui-dialog {
  min-width: 120px;
  min-height: 120px;
  position: fixed;
  top: 10%;
  left: 25%;
  z-index: 1000;
  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.4);
  /* IE9+, News */
  background: #fff;
  display: box;
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-flex-direction: column;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  /* Firefox 28+, IE11, Opera 12.10 */
  -webkit-flex-flow: column;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-flow: column;
  -ms-flex-flow: column;
  flex-flow: column;
  /* Firefox 28+, IE11, Opera 12.10 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-dialog > header {
  text-align: center;
  width: 100%;
  height: 38px;
  line-height: 38px;
  border-bottom: 1px solid #ddd;
  background: #fff;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-dialog > header > strong {
  font-size: 16px;
  padding: 0 10px;
}

.pui-dialog > header > strong > small {
  padding-left: 10px;
}

.pui-dialog.pui-radius > header {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.pui-dialog > .pui-close {
  margin: 0;
  padding: 0;
  position: absolute;
  top: 11px;
  right: 11px;
}

.pui-dialog > .pui-close.pui-circle {
  padding: 2px 4px;
  border-radius: 50% !important;
  top: -10px;
  right: -10px;
  border: none;
  background: #fff;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
}

html.no-touch .pui-dialog > .pui-close.pui-circle:hover, .pui-dialog > .pui-close.pui-circle.hover {
  opacity: 1;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.6);
}

.pui-dialog > .pui-close-circle {
  top: -10px;
  right: -10px;
  opacity: 1;
}

.pui-dialog > section {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 10px;
  box-flex: 1;
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-dialog > section.has-iframe {
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  padding: 0;
}

.pui-dialog > section.has-iframe > iframe {
  width: 99.99%;
  height: 100%;
}

.pui-dialog.pui-radius > section, .pui-dialog.pui-radius > section.has-iframe > iframe {
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-dialog > footer {
  width: 100%;
  height: 38px;
  line-height: 38px;
  border-top: 1px solid #ddd;
}

.pui-dialog > footer > small {
  padding: 0 10px;
}

.pui-dialog[type="window"], .pui-dialog[type="iframe"] {
  min-width: 50%;
  min-height: 30%;
  left: 25%;
  top: 40%;
}

.pui-dialog[type="window"] > header, .pui-dialog[type="iframe"] > header {
  text-align: left;
}

.pui-dialog[type="window"] > header > strong > .fa, .pui-dialog[type="iframe"] > header > strong > .fa {
  margin-right: 7px;
  vertical-align: middle;
}

.pui-dialog[type="window"] > .pui-dialog-toolbar, .pui-dialog[type="iframe"] > .pui-dialog-toolbar {
  position: absolute;
  top: 7px;
  right: 9px;
}

.pui-dialog[type="window"] > .pui-dialog-toolbar > .fa, .pui-dialog[type="iframe"] > .pui-dialog-toolbar > .fa {
  font-size: 16px;
  opacity: 0.3;
  color: #000;
  cursor: pointer;
  vertical-align: middle;
}

html.no-touch .pui-dialog[type="window"] > .pui-dialog-toolbar > .fa:hover, .pui-dialog[type="window"] > .pui-dialog-toolbar > .fa.hover, html.no-touch .pui-dialog[type="iframe"] > .pui-dialog-toolbar > .fa:hover, .pui-dialog[type="iframe"] > .pui-dialog-toolbar > .fa.hover {
  opacity: 0.5;
}

.pui-dialog[type="window"] > .pui-dialog-toolbar > a + a, .pui-dialog[type="iframe"] > .pui-dialog-toolbar > a + a {
  display: inline-block;
  margin-left: 1rem;
}

.pui-dialog[type="window"] > .pui-dialog-toolbar .pui-dialog-blank, .pui-dialog[type="iframe"] > .pui-dialog-toolbar .pui-dialog-blank {
  margin-top: 2px;
}

.pui-dialog[type*="alert"], .pui-dialog[type*="confirm"], .pui-dialog[type*="prompt"] {
  width: 80%;
  left: 10%;
  top: 40%;
  overflow: hidden;
}

.pui-dialog > .pui-btn-center {
  border-radius: 0;
  text-align: center;
  padding: 12px 0;
}

.pui-dialog > .pui-btn-center > .pui-btn + .pui-btn {
  margin-left: 8px;
}

.pui-dialog > .pui-btn-group-justify {
  width: 100%;
  padding: 0;
  margin: 0;
}

.pui-dialog > .pui-btn-group-justify > .pui-btn {
  float: none;
  -webkit-border-radius: 0;
  border-radius: 0;
  border: none;
  border-top: 1px solid #eee;
  padding-left: 0;
  padding-right: 0;
  margin: 0;
}

.pui-dialog.pui-radius > .pui-btn-group-justify > .pui-btn {
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-dialog[type*="confirm"] > .pui-btn-group > .pui-btn, .pui-dialog[type*="prompt"] > .pui-btn-group > .pui-btn {
  border-bottom: 0;
  border-color: #eee;
  margin: 0;
}

.pui-dialog[type*="confirm"] > .pui-btn-group > .pui-btn:first-child, .pui-dialog[type*="prompt"] > .pui-btn-group > .pui-btn:first-child {
  border-left: none;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
}

.pui-dialog[type*="confirm"] > .pui-btn-group > .pui-btn:last-child, .pui-dialog[type*="prompt"] > .pui-btn-group > .pui-btn:last-child {
  border-right: none;
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
}

.pui-dialog[type*="confirm"] > .pui-btn-group > .pui-btn + .pui-btn, .pui-dialog[type*="prompt"] > .pui-btn-group > .pui-btn + .pui-btn {
  margin-left: -1px;
  border-left: 1px solid #eee;
}

.pui-dialog[type*="prompt"] > section > input[type="text"] {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-dialog[type*="prompt"].pui-radius > section > input[type="text"] {
  border-radius: 4px;
}

.pui-dialog[type="loading"], .pui-dialog[type="table"] {
  padding: 0;
  display: table;
}

.pui-dialog[type="loading"] > section, .pui-dialog[type="table"] > section {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

.pui-dialog > .pui-dialog-nav {
  width: 100%;
  display: table;
  padding: 0 1rem 1rem 1rem;
}

.pui-dialog > .pui-dialog-nav > a {
  display: table-cell;
  text-align: center;
}

.pui-dialog-dock {
  position: fixed;
  bottom: 0;
  left: 0;
  padding: 10px 10px 5px;
  width: 100%;
  background: #000 rgba(0, 0, 0, 0.5);
  background: #fff;
  z-index: 10001;
  overflow: hidden;
  box-shadow: 0 -3px 5px rgba(0, 0, 0, 0.2);
}

.pui-dialog-dock > a {
  display: inline-block;
  padding: 5px 12px;
  border: 1px solid #ddd;
  margin-bottom: 4px;
  background: #fff;
}

@media (min-width: 301px) and (max-width: 640px) {
  .pui-dialog[type*="alert"], .pui-dialog[type*="prompt"], .pui-dialog[type*="confirm"] {
    width: 60%;
    left: 20%;
  }
}

@media (min-width: 641px) and (max-width: 768px) {
  .pui-dialog[type*="alert"], .pui-dialog[type*="prompt"], .pui-dialog[type*="confirm"] {
    width: 48%;
    left: 26%;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .pui-dialog[type*="alert"], .pui-dialog[type*="prompt"], .pui-dialog[type*="confirm"] {
    width: 32%;
    left: 34%;
  }
}

@media (min-width: 1025px) and (max-width: 1440px) {
  .pui-dialog[type*="alert"], .pui-dialog[type*="prompt"], .pui-dialog[type*="confirm"] {
    width: 20%;
    left: 40%;
  }
}

@media (min-width: 1441px) {
  .pui-dialog[type*="alert"], .pui-dialog[type*="prompt"], .pui-dialog[type*="confirm"] {
    width: 16%;
    left: 42%;
  }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
  .pui-dialog .pui-btn-group-justify > .pui-btn {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
    font-size: 1.6rem;
    font-weight: normal;
  }
}

.pui-font-sizer {
  display: inline-block;
  margin-left: 10px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-font-sizer > span {
  padding: 2px 3px;
  border-radius: 3px;
  border: 1px solid #fff;
  line-height: 1;
  cursor: pointer;
  display: inline-block;
  -webkit-transition: all 300ms ease-out;
  /* Safari, Chrome */
  -moz-transition: all 300ms ease-out;
  /* Firefox 4.0~16.0 */
  transition: all 300ms ease-out;
  /* IE >9, FF >15, Opera >12.0 */
}

html.no-touch .pui-font-sizer > span:hover, .pui-font-sizer > span.hover {
  background: #fafafa;
  border: 1px solid #ddd;
}

/* TOP 10 List */
.pui-top10-list > li > a {
  display: block;
  padding: 3px;
}

.pui-top10-list > li > a:before {
  text-align: center;
  margin-right: 8px;
  padding: 0 5px;
  line-height: 1;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #999;
  background: #eee;
}

.pui-top10-list > li > a.pui-top-1:before {
  color: #fff;
  background: red;
  content: "1";
}

.pui-top10-list > li > a.pui-top-2:before {
  color: #fff;
  background: #ff6600;
  content: "2";
}

.pui-top10-list > li > a.pui-top-3:before {
  color: #fff;
  background: orange;
  content: "3";
}

.pui-top10-list > li > a.pui-top-4:before {
  content: "4";
}

.pui-top10-list > li > a.pui-top-5:before {
  content: "5";
}

.pui-top10-list > li > a.pui-top-6:before {
  content: "6";
}

.pui-top10-list > li > a.pui-top-7:before {
  content: "7";
}

.pui-top10-list > li > a.pui-top-8:before {
  content: "8";
}

.pui-top10-list > li > a.pui-top-9:before {
  content: "9";
}

.pui-top10-list > li > a.pui-top-10:before {
  padding: 0 2px;
  content: "10";
}

.pui-top10-list > li > a > .pui-top-count {
  color: #ccc;
  float: right;
}

.pui-top10-list-box {
  margin-left: 32px;
  margin-bottom: 5px;
}

.pui-top10-list-box > small {
  display: block;
  padding: 5px 10px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #f6f6f6;
  background: #fafafa;
}

.pui-top10-list-square > li > a:before {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-top10-list-circle > li > a:before {
  padding: 1px 6px;
  -webkit-border-radius: 500px;
  border-radius: 500px;
}

/* ListView */
.pui-list-view {
  margin: 0;
}

.pui-list-view > li {
  width: 100%;
  clear: both;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-list-view > li > div {
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
}

.pui-list-view > li > a {
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
  display: -webkit-box;
  /* Old - iOS 6-, Safari 3.1~6, Blackberry 7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* New - Safari 6.1+. iOS 7.1+, Blackberry 10 */
  display: -moz-flex;
  display: flex;
  /* New, Spec - Firefox, Chrome, Opera */
  -webkit-box-direction: normal;
  -webkit-box-orient: horizontal;
  -webkit-flex-direction: row;
  /* Chrome 21.0+, But Safari & Android & iOS Not supported. */
  -moz-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  /* Firefox 28+, IE11, Opera 12.10 */
  position: relative;
  padding: 10px;
  padding: 1rem;
  color: #666;
  -webkit-transition: background-color 0.1s ease-in;
  /* Safari, Chrome */
  -moz-transition: background-color 0.1s ease-in;
  /* Firefox 4.0~16.0 */
  transition: background-color 0.1s ease-in;
  /* IE >9, FF >15, Opera >12.0 */
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.pui-list-view > li > a:before, .pui-list-view > li > a:after {
  content: " ";
  display: table;
}

.pui-list-view > li > a:after {
  clear: both;
}

html.no-touch .pui-list-view > li > a:hover, .pui-list-view > li > a.hover {
  background-color: #f6f6f6;
}

.pui-list-view > li > a > img {
  width: 48px;
  height: 48px;
  position: relative;
}

.pui-list-view > li > a > .icon, .pui-list-view > li > a > .tb-icon, .pui-list-view > li > a > .fa {
  font-size: 48px;
  float: left;
  position: relative;
}

.pui-list-view > li > a > .pui-badge {
  position: absolute;
  top: 5px;
  left: 48px;
  padding: 2px 1px;
  min-width: 10px;
  min-height: 10px;
  line-height: 1;
}

.pui-list-view > li > a > .pui-badge-dot {
  top: 6px;
  left: 52px;
}

.pui-list-view > li > a > .pui-badge-right {
  top: 38%;
  left: auto;
  right: 10px;
  min-width: auto;
  min-height: auto;
}

.pui-list-view > li > a > .pui-badge-right:not(.pui-circle) {
  padding: 3px 3px 2px;
}

.pui-list-view > li > a > summary {
  -webkit-box-flex: 1;
  /* Old - iOS 6-, Safari 3.1~6 */
  -moz-box-flex: 1;
  -webkit-flex: 1;
  /* Safari 6.1+. iOS 7.1+, Blackberry 10 */
  -moz-flex: 1;
  -ms-flex: 1;
  /* IE 10 */
  flex: 1;
  /* New, Spec - Firefox, Chrome, Opera */
  height: 100%;
  padding: 3px 50px 0 0;
  margin-left: 1.2rem;
  vertical-align: middle;
}

html.no-touch .pui-list-view > li > a > summary {
  padding-top: 0;
}

.pui-list-view > li > a > summary > h6 {
  margin-top: -2px;
  margin-bottom: 0;
}

.pui-list-view > li > a > summary > h6 > small {
  margin-right: -50px;
  float: right;
  color: #ddd;
}

.pui-list-view > li > a > summary > small, .pui-list-view > li > a > summary > strong {
  display: block;
}

.pui-list-view > li:not(:last-child) > a {
  border-bottom: 1px solid #eee;
}

.pui-list-view > li.pui-list-view-header {
  color: #999;
  font-size: 12px;
  font-size: 1.2rem;
  margin: 0;
  padding: 0.5rem 0;
}

.pui-list-view-group > .pui-list-view:not(:last-child) {
  margin-bottom: 10px;
}

.pui-list-view-angle-right > li > a:after {
  width: 0;
  height: 40%;
  color: #ccc;
  line-height: 1;
  font-size: 24px;
  font-weight: normal;
  font-family: "FontAwesome";
  content: "\f105";
  position: absolute;
  top: 32%;
  right: 20px;
}

.pui-list-view-angle-right > li > a.no-angle-right:after, .pui-list-view-angle-right > li > a.pui-no-angle-right:after {
  content: "";
}

.pui-list-view-small > li > a {
  padding: 5px 10px;
}

.pui-list-view-small > li > a > img {
  width: 24px;
}

.pui-list-view-small > li > a > .icon, .pui-list-view-small > li > a > .pui-icon, .pui-list-view-small > li > a > .fa {
  font-size: 24px;
}

.pui-list-view-small > li > a > .pui-badge {
  top: 3px;
  left: 24px;
}

.pui-list-view-small > li > a > .pui-badge-dot {
  top: 3px;
  left: 28px;
}

html.no-touch .pui-list-view-small > li > a > .pui-badge-right {
  top: 8px;
  left: auto;
}

.pui-list-view-small > li > a > .pui-badge-right {
  top: 9px;
  left: auto;
}

.pui-list-view-small > li > a > summary {
  padding-top: 0;
  margin-left: 20px;
}

.pui-list-view-small > li > a > summary > h6 {
  margin-top: -1px;
}

.pui-list-view-small.pui-list-view-angle-right > li > a:after {
  top: 5px;
}

.pui-list-view-round > li > a > img, .pui-list-view-circle > li > a > img {
  -webkit-border-radius: 500px;
  border-radius: 500px;
}

.pui-list-view-radius > li > a > img {
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.pui-list-view-square > li > a > img {
  -webkit-border-radius: 0;
  border-radius: 0;
}

/* Loading */
.pui-loading {
  margin: 0 auto;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-loading > span, .pui-loading-flashing {
  background-color: #67CF22;
}

.pui-loading-stop {
  -webkit-animation-play-state: paused !important;
  -moz-animation-play-state: paused !important;
  /* Firefox 5.0~16.0 */
  animation-play-state: paused !important;
}

/* loading scale vertical bar */
.pui-loading-scale-vbar {
  height: 32px;
  list-style: none;
}

@-webkit-keyframes loading-scale-vbar {
  0%, 40%, 100% {
    -webkit-transform: scaleY(0.4);
    transform: scaleY(0.4);
  }
  20% {
    -webkit-transform: scaleY(0.8);
    transform: scaleY(0.8);
  }
}

@-moz-keyframes loading-scale-vbar {
  0%, 40%, 100% {
    -webkit-transform: scaleY(0.4);
    transform: scaleY(0.4);
  }
  20% {
    -webkit-transform: scaleY(0.8);
    transform: scaleY(0.8);
  }
}

@keyframes loading-scale-vbar {
  0%, 40%, 100% {
    -webkit-transform: scaleY(0.4);
    transform: scaleY(0.4);
  }
  20% {
    -webkit-transform: scaleY(0.8);
    transform: scaleY(0.8);
  }
}

.pui-loading-scale-vbar > span {
  width: 3px;
  height: 100%;
  display: inline-block;
  -webkit-animation: loading-scale-vbar 1.2s infinite ease-in-out;
  -moz-animation: loading-scale-vbar 1.2s infinite ease-in-out;
  /* Firefox 5.0~16.0 */
  animation: loading-scale-vbar 1.2s infinite ease-in-out;
  /* IE10+ */
}

.pui-loading-scale-vbar > span:last-child {
  margin-right: 0px;
}

.pui-loading-scale-vbar > span:nth-child(2) {
  -webkit-animation-delay: 0.1s;
  -moz-animation-delay: 0.1s;
  /* Firefox 5.0~16.0 */
  animation-delay: 0.1s;
}

.pui-loading-scale-vbar > span:nth-child(3) {
  -webkit-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
  /* Firefox 5.0~16.0 */
  animation-delay: 0.2s;
}

.pui-loading-scale-vbar > span:nth-child(4) {
  -webkit-animation-delay: 0.3s;
  -moz-animation-delay: 0.3s;
  /* Firefox 5.0~16.0 */
  animation-delay: 0.3s;
}

.pui-loading-scale-vbar > span:nth-child(5) {
  -webkit-animation-delay: 0.4s;
  -moz-animation-delay: 0.4s;
  /* Firefox 5.0~16.0 */
  animation-delay: 0.4s;
}

.pui-loading-scale-vbar[small] {
  height: 24px;
}

.pui-loading-scale-vbar[small] > span {
  width: 2px;
}

/* loading circle inline */
@-webkit-keyframes loading-circle-inline {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes loading-circle-inline {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes loading-circle-inline {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.pui-loading-circle-inline > span {
  display: inline-block;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  width: 12px;
  height: 12px;
  -webkit-animation: loading-circle-inline 1.4s infinite ease-in-out;
  -moz-animation: loading-circle-inline 1.4s infinite ease-in-out;
  /* Firefox 5.0~16.0 */
  animation: loading-circle-inline 1.4s infinite ease-in-out;
  /* IE10+ */
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}

.pui-loading-circle-inline > span:nth-child(2) {
  -webkit-animation-delay: 0.1s;
  -moz-animation-delay: 0.1s;
  /* Firefox 5.0~16.0 */
  animation-delay: 0.1s;
}

.pui-loading-circle-inline > span:nth-child(3) {
  -webkit-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
  /* Firefox 5.0~16.0 */
  animation-delay: 0.2s;
}

.pui-loading-circle-inline > span:nth-child(4) {
  -webkit-animation-delay: 0.3s;
  -moz-animation-delay: 0.3s;
  /* Firefox 5.0~16.0 */
  animation-delay: 0.3s;
}

.pui-loading-circle-inline > span:nth-child(5) {
  -webkit-animation-delay: 0.4s;
  -moz-animation-delay: 0.4s;
  /* Firefox 5.0~16.0 */
  animation-delay: 0.4s;
}

.pui-loading-circle-inline[small] > span {
  width: 8px;
  height: 8px;
}

/* Loading flashing */
@-webkit-keyframes loading-flashing {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes loading-flashing {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes loading-flashing {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.pui-loading-flashing {
  width: 40px;
  height: 40px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  -webkit-animation: loading-flashing 1s infinite ease-in-out;
  -moz-animation: loading-flashing 1s infinite ease-in-out;
  /* Firefox 5.0~16.0 */
  animation: loading-flashing 1s infinite ease-in-out;
  /* IE10+ */
}

/* Loading flashing double */
@-webkit-keyframes loading-flashing-double {
  0%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes loading-flashing-double {
  0%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes loading-flashing-double {
  0%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.pui-loading-flashing-double {
  position: relative;
  width: 32px;
  height: 32px;
}

.pui-loading-flashing-double > span {
  display: block;
  width: 100%;
  height: 100%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-animation: loading-flashing-double 2s infinite ease-in-out;
  -moz-animation: loading-flashing-double 2s infinite ease-in-out;
  /* Firefox 5.0~16.0 */
  animation: loading-flashing-double 2s infinite ease-in-out;
  /* IE10+ */
}

.pui-loading-flashing-double > span:nth-child(2) {
  -webkit-animation-delay: -1s;
  -moz-animation-delay: -1s;
  /* Firefox 5.0~16.0 */
  animation-delay: -1s;
}

/* loading full width bar */
.pui-loading-full-width {
  margin: 0;
  padding: 0;
}

.pui-loading-full-width.fixed-top, .pui-loading-full-width.fixed-bottom {
  width: 100%;
  position: fixed;
  left: 0;
}

.pui-loading-full-width.fixed-top {
  top: 0;
}

.pui-loading-full-width.fixed-bottom {
  bottom: 0;
}

.pui-loading-full-width > span {
  width: 100%;
  height: 3px;
  margin: 0;
  position: absolute;
  -webkit-animation: loading-full-width-bar 10s infinite ease-out;
  -moz-animation: loading-full-width-bar 10s infinite ease-out;
  /* Firefox 5.0~16.0 */
  animation: loading-full-width-bar 10s infinite ease-out;
  /* IE10+ */
}

@-webkit-keyframes loading-full-width-bar {
  0% {
    width: 0px;
  }
  10% {
    width: 10%;
  }
}

@-moz-keyframes loading-full-width-bar {
  0% {
    width: 0px;
  }
  10% {
    width: 10%;
  }
}

@keyframes loading-full-width-bar {
  0% {
    width: 0px;
  }
  10% {
    width: 10%;
  }
}

/* loading double circle rotation */
.pui-loading-double-circle-rotation {
  margin: 10px auto;
  width: 48px;
  height: 48px;
  position: relative;
  text-align: center;
  -webkit-animation: loading-double-circle-rotate 2s infinite linear;
  -moz-animation: loading-double-circle-rotate 2s infinite linear;
  /* Firefox 5.0~16.0 */
  animation: loading-double-circle-rotate 2s infinite linear;
  /* IE10+ */
}

.pui-loading-double-circle-rotation > span {
  width: 60%;
  height: 60%;
  display: inline-block;
  position: absolute;
  top: 0;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  -webkit-animation: loading-double-circle-scale 2s infinite ease-in-out;
  -moz-animation: loading-double-circle-scale 2s infinite ease-in-out;
  /* Firefox 5.0~16.0 */
  animation: loading-double-circle-scale 2s infinite ease-in-out;
  /* IE10+ */
}

.pui-loading-double-circle-rotation > span:nth-child(2) {
  top: auto;
  bottom: 0;
  -webkit-animation-delay: -1s;
  -moz-animation-delay: -1s;
  /* Firefox 5.0~16.0 */
  animation-delay: -1s;
}

@-webkit-keyframes loading-double-circle-rotate {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-moz-keyframes loading-double-circle-rotate {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes loading-double-circle-rotate {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes loading-double-circle-scale {
  0%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes loading-double-circle-scale {
  0%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes loading-double-circle-scale {
  0%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* Loading Ring Circle Rotate */
.pui-loading-ring, .pui-loading-ring-xxs, .pui-loading-ring-xsmall, .pui-loading-ring-small, .pui-loading-ring-large {
  display: block;
  background-color: transparent;
  border: 2px solid #67CF22;
  border-top-color: transparent;
  border-left-color: transparent;
  -webkit-border-radius: 500px;
  border-radius: 500px;
  margin: 0 auto;
  -webkit-animation: loading-ring-rotate 0.5s infinite linear;
  -moz-animation: loading-ring-rotate 0.5s infinite linear;
  /* Firefox 5.0~16.0 */
  animation: loading-ring-rotate 0.5s infinite linear;
  /* IE10+ */
}

.pui-loading-ring {
  width: 30px;
  height: 30px;
}

.pui-loading-ring-xxs {
  width: 12px;
  height: 12px;
}

.pui-loading-ring-xsmall {
  width: 16px;
  height: 16px;
}

.pui-loading-ring-small {
  width: 24px;
  height: 24px;
}

.pui-loading-ring-large {
  width: 40px;
  height: 40px;
}

@-webkit-keyframes loading-ring-rotate {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-moz-keyframes loading-ring-rotate {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes loading-ring-rotate {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes loading-ring-rotate-reverse {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

@-moz-keyframes loading-ring-rotate-reverse {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

@keyframes loading-ring-rotate-reverse {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

.pui-loading-ring-group > .pui-loading-ring-small,
.pui-loading-ring-group-large > .pui-loading-ring,
.pui-loading-ring-group-small > .pui-loading-ring-xsmall {
  position: relative;
  -webkit-animation: loading-ring-rotate-reverse 0.5s infinite linear;
  -moz-animation: loading-ring-rotate-reverse 0.5s infinite linear;
  /* Firefox 5.0~16.0 */
  animation: loading-ring-rotate-reverse 0.5s infinite linear;
  /* IE10+ */
}

.pui-loading-ring-group-large > .pui-loading-ring {
  top: -32px;
  width: 24px;
  height: 24px;
}

.pui-loading-ring-group > .pui-loading-ring-small {
  top: -24px;
  width: 18px;
  height: 18px;
}

.pui-loading-ring-group-small > .pui-loading-ring-xsmall {
  top: -19px;
  width: 14px;
  height: 14px;
}

.pui-loading-spinner {
  display: inline-block;
}

.pui-loading-spinner > span {
  color: #67CF22;
  background: none;
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
}

/* Menus */
.pui-menu {
  margin: 0 0 1.5rem 0;
  padding: 0;
  list-style: none;
  position: relative;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.pui-menu > li {
  position: relative;
}

.pui-menu > li > a {
  display: block;
  padding: 7px 15px;
  margin-bottom: 0.2rem;
  -webkit-transition: all 0.2s ease-out;
  /* Safari, Chrome */
  -moz-transition: all 0.2s ease-out;
  /* Firefox 4.0~16.0 */
  transition: all 0.2s ease-out;
  /* IE >9, FF >15, Opera >12.0 */
}

.pui-menu > li > a.active, .pui-menu > li > a.pui-active {
  background: #008EE5;
  color: #fff;
}

html.no-touch .pui-menu > li > a.active:hover, .pui-menu > li > a.active.hover, html.no-touch .pui-menu > li > a.pui-active:hover, .pui-menu > li > a.pui-active.hover {
  background: #007ecc;
}

html.no-touch .pui-menu > li > a:hover, .pui-menu > li > a.hover {
  background: #f6f6f6;
}

.pui-menu > li > a > [class*=icon-], .pui-menu > li > a > [class*=fa-], .pui-menu > li > a > [class*=pui-icon-] {
  font-size: 1.6rem;
  margin-right: 0.5rem;
}

.pui-menu > li > a > .pui-badge {
  padding-top: 0;
  padding-bottom: 0;
  margin-left: 0.5rem;
  margin-top: 0;
  min-width: 1.6rem;
  line-height: 1.6rem;
  font-size: 1rem;
  float: right;
}

.pui-menu > li.pui-menu-header-small, .pui-menu > li.pui-menu-header {
  padding: 0;
  font-size: 1.2rem;
  font-weight: bold;
  margin-bottom: 1rem;
}

.pui-menu > li.pui-menu-header-small {
  font-weight: normal;
  color: #ccc;
}

.pui-menu > li.pui-menu-header-frame {
  padding-left: 1.2rem;
  border-left: 3px solid #008EE5;
}

.pui-menu > li.pui-menu-divider {
  margin: 1.2rem 0;
  border-bottom: 1px solid #ddd;
}

.pui-menu > li.pui-menu-foot {
  margin: 1.2rem 0;
}

.pui-menu > li > .pui-badge-dot {
  position: absolute;
  top: 35%;
  right: 1.5rem;
}

.pui-menu .disabled, .pui-menu .pui-disabled {
  color: #ccc;
}

.pui-menu-small > li > a {
  padding: 5px 12px;
}

.pui-menu-radius > li > a {
  border-radius: 4px;
}

.pui-menu-round > li > a {
  border-radius: 500px;
}

.pui-menu-radius-top > li > a {
  border-radius: 0;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.pui-menu-radius-bottom > li > a {
  border-radius: 0;
  border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-menu-radius-left > li > a {
  border-radius: 0;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.pui-menu-radius-right > li > a {
  border-radius: 0;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-menu-link-color > li > a {
  color: #008EE5;
}

.pui-menu-active-underline {
  border-bottom: 2px solid #ddd;
}

.pui-menu-active-underline > li {
  margin-bottom: -4px;
}

.pui-menu-active-underline > li > a {
  padding-bottom: 7px;
}

.pui-menu-active-underline > li > a.active {
  color: #008EE5;
  background: none;
  border-bottom: 2px solid #008EE5;
}

html.no-touch .pui-menu-active-underline > li > a.active:hover, .pui-menu-active-underline > li > a.active.hover {
  background: #f6f6f6;
}

.pui-menu-inline > li {
  display: inline-block;
}

.pui-menu-inline > li.pui-menu-header {
  margin-right: 1.5rem;
}

.pui-menu-inline > li.pui-menu-divider {
  text-indent: -9999px;
  text-indent: -9999rem;
  margin: 0 1.2rem;
  border: none;
  border-left: 1px solid #ddd;
}

.pui-menu-inline > li > .pui-badge-dot + a {
  padding-right: 30px;
}

.pui-menu-simple > li > a {
  padding: 1px 0;
}

html.no-touch .pui-menu-simple > li > a:hover, .pui-menu-simple > li > a.hover {
  background: #fff;
}

.pui-menu-simple.pui-menu-inline {
  margin-left: -5px;
}

.pui-menu-simple.pui-menu-inline > li > a {
  padding: 0 5px;
}

.pui-menu-tab-style {
  border-right: 1px solid #ddd;
}

.pui-menu-tab-style > li > a {
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pui-menu-tab-style > li > a.active, .pui-menu-tab-style > li > a.pui-active {
  margin-right: -1px;
  background: none;
  color: inherit;
  border: 1px solid #ddd;
  border-right: 1px solid #fff;
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

html.no-touch .pui-menu-tab-style > li > a.active:hover, .pui-menu-tab-style > li > a.active.hover, html.no-touch .pui-menu-tab-style > li > a.pui-active:hover, .pui-menu-tab-style > li > a.pui-active.hover {
  color: #008EE5;
  background: none;
}

.pui-menu-tab-style.pui-menu-inline {
  border: none;
  border-bottom: 1px solid #ddd;
}

.pui-menu-tab-style.pui-menu-inline > li {
  margin-bottom: -3px;
}

.pui-menu-tab-style.pui-menu-inline > li + li {
  margin-right: 4px;
}

.pui-menu-tab-style.pui-menu-inline > li > a {
  padding-bottom: 7px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pui-menu-tab-style.pui-menu-inline > li > a.active {
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #fff;
}

.pui-menu-justify {
  width: 100%;
  display: table;
}

.pui-menu-justify > li {
  text-align: center;
  display: table-cell;
}

.pui-menu-justify.pui-menu-tab-style {
  border: none;
  border-bottom: 1px solid #ddd;
}

.pui-menu-justify.pui-menu-tab-style > li > a {
  margin-bottom: -1px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pui-menu-justify.pui-menu-tab-style > li > a.active, .pui-menu-justify.pui-menu-tab-style > li > a.pui-active {
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #fff;
}

.pui-menu-justify.pui-menu-tab-style > li + li > a {
  margin-left: 2px;
}

@media only screen and (max-width: 640px) {
  .pui-menu-justify > li {
    display: block;
  }
}

/* Menu dropdown */
.pui-menu-dropdown {
  position: absolute;
  top: 37px;
  left: 0;
  z-index: 999;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background: #fff;
  display: none;
  -webkit-animation: menu-dropdown-slide-down 0.3s ease-in;
  -moz-animation: menu-dropdown-slide-down 0.3s ease-in;
  /* Firefox 5.0~16.0 */
  animation: menu-dropdown-slide-down 0.3s ease-in;
  /* IE10+ */
  -webkit-animation-direction: reverse;
  -moz-animation-direction: reverse;
  /* Firefox 5.0~16.0 */
  animation-direction: reverse;
}

.pui-menu-dropdown > li {
  text-align: left;
}

.pui-menu-dropdown > li.pui-menu-header {
  padding: 5px 15px 0 15px;
  font-weight: normal;
  font-size: 12px;
  color: #ccc;
}

.pui-menu-dropdown > li:last-child {
  margin-bottom: 10px;
}

.pui-menu-dropdown > li > .pui-menu-dropdown {
  top: -4px;
  left: 92%;
}

.pui-menu-dropdown:before, .pui-menu-dropdown:after {
  pointer-events: pointer-events;
  position: absolute;
  left: 15px;
  top: -8px;
  display: block;
  content: "";
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-width: 0 8px 8px;
  z-index: 10;
}

.pui-menu-dropdown:before {
  border-bottom-color: #ccc;
}

.pui-menu-dropdown:after {
  border-bottom-color: #ffffff;
  top: -7px;
}

.pui-menu-dropdown > li > .pui-menu-dropdown:before,
.pui-menu-dropdown > li > .pui-menu-dropdown:after {
  border: 8px solid transparent;
  border-right: 8px solid #ccc;
  border-left: 0;
  left: -8px;
  top: 10px;
}

.pui-menu-dropdown > li > .pui-menu-dropdown:after {
  border-right-color: #fff;
  left: -7px;
}

@-webkit-keyframes menu-dropdown-slide-down {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-10%);
    transform: translateY(-10%);
  }
}

@-moz-keyframes menu-dropdown-slide-down {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-10%);
    transform: translateY(-10%);
  }
}

@keyframes menu-dropdown-slide-down {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-10%);
    transform: translateY(-10%);
  }
}

.pui-menu > li > .pui-menu-dropdown {
  display: none;
}

html.no-touch .pui-menu > li:hover > .pui-menu-dropdown {
  display: block;
}

.has-submenu:after {
  position: absolute;
  right: 10px;
  top: -1px;
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  font-size: 1.8rem;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\f105";
  color: #cccccc;
}

.pui-menu-bordered-radius > li:first-child a {
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
}

.pui-menu-bordered-radius > li:last-child a {
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-menu-bordered > li > a {
  border: 1px solid #ddd;
  margin: 0;
  margin-bottom: -1px;
}

.pui-menu-bordered > li > a.active, .pui-menu-bordered > li > a.pui-active {
  border-color: #008EE5;
}

.pui-menu-bordered.pui-menu-inline > li {
  float: left;
}

.pui-menu-bordered.pui-menu-inline > li > a {
  margin: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-menu-bordered.pui-menu-inline > li + li {
  margin-left: -1px;
}

.pui-menu-bordered.pui-menu-inline.pui-menu-bordered-radius > li:first-child a {
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.pui-menu-bordered.pui-menu-inline.pui-menu-bordered-radius > li:last-child a {
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-menu-justify.pui-menu-bordered > li > a {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-menu-justify.pui-menu-bordered > li + li > a {
  border-left: none;
}

.pui-menubar {
  width: 100%;
  display: table;
  padding: 2px 10px;
  margin-bottom: 15px;
  position: relative;
  background: #fff;
  border: 1px solid #ddd;
  vertical-align: middle;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.pui-menubar:before, .pui-menubar:after {
  content: " ";
  display: table;
}

.pui-menubar:after {
  clear: both;
}

.pui-menubar .pui-menu {
  padding: 2px 0 0;
  margin: 0;
  display: table-cell;
  vertical-align: middle;
}

.pui-menubar input {
  margin: 1px 0 0 0;
}

.pui-menubar .pui-btn-dropdown {
  margin: 0;
  padding-top: -5px;
}

.pui-menubar-header-style {
  padding: 6px 10px;
  padding: 0.5rem 1rem;
}

.pui-menubar-square {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-menubar-aside {
  text-align: left;
  vertical-align: middle;
  display: table-cell;
}

.pui-menubar-middle {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

.pui-menubar-offside {
  display: table-cell;
  text-align: right;
  vertical-align: middle;
}

.pui-menubar-top-fixed, .pui-menubar-bottom-fixed {
  position: fixed;
  left: 0;
  z-index: 1000;
  margin: 0;
  border: 0;
}

.pui-menubar-top-fixed {
  top: 0;
  border-bottom: 1px solid #ddd;
}

.pui-menubar-bottom-fixed {
  bottom: 0;
  border-top: 1px solid #ddd;
}

.pui-menu-dropdown-unarrow:before, .pui-menu-dropdown-unarrow:after {
  border: none;
}

.pui-menu-dropdown.pui-menu-dropdown-unarrow .pui-menu-dropdown {
  top: 0;
  left: 100%;
}

.pui-menu-dropdown.pui-menu-dropdown-unarrow > li .pui-menu-dropdown:before, .pui-menu-dropdown.pui-menu-dropdown-unarrow > li .pui-menu-dropdown:after {
  border: none;
}

.pui-menu-dropdown-left-top {
  top: 0;
  left: auto;
  right: 100%;
}

.pui-menu-dropdown-left-bottom {
  top: auto;
  left: auto;
  right: 100%;
  bottom: -19px;
}

.pui-menu-dropdown-right-top {
  top: 0;
  left: 100%;
  right: auto;
}

.pui-menu-dropdown-right-bottom {
  top: auto;
  left: 100%;
  right: auto;
  bottom: -19px;
}

.pui-menu-dropdown-bottom-right {
  top: 35px;
  left: auto;
  right: 0;
}

.pui-menu-dropdown-top-left {
  top: auto;
  left: 0;
  right: auto;
  bottom: 20px;
}

.pui-menu-dropdown-top-right {
  top: auto;
  left: auto;
  right: 0;
  bottom: 20px;
}

.pui-menu-column {
  width: 100%;
  display: table;
}

.pui-menu-column:before, .pui-menu-column:after {
  content: " ";
  display: table;
}

.pui-menu-column:after {
  clear: both;
}

.pui-menu-column > .pui-menu {
  display: table-cell;
}

.pui-menubar[class*=pui-bg-] > .pui-menu > li, .pui-menubar[class*=pui-bg-] > .pui-menu > li > a {
  color: #fff;
}

.pui-menubar[class*=pui-bg-] > .pui-menu > li > a {
  margin: 0;
  padding: 10px 16px;
  border-radius: 0;
}

.pui-menubar[class*=pui-bg-] > .pui-menu > li > a.active, .pui-menubar[class*=pui-bg-] > .pui-menu > li > a.pui-active {
  background-color: rgba(0, 0, 0, 0.2);
}

html.no-touch .pui-menubar[class*=pui-bg-] > .pui-menu > li > a:hover, .pui-menubar[class*=pui-bg-] > .pui-menu > li > a.hover {
  background-color: rgba(0, 0, 0, 0.1);
}

.pui-menubar[class*=pui-bg-] > .pui-menu > li + li {
  margin-left: -3px;
}

.pui-menubar-bg-color {
  padding: 0 10px 0 0;
  border: none;
}

.pui-menubar-bg-color > .pui-menu {
  padding: 0;
}

@media only screen and (max-width: 480px) {
  .pui-menu-inline > li {
    display: block;
  }
  .pui-menu > li > .pui-menu-dropdown {
    width: 100%;
  }
}

.pui-menu-accordion > li > a .fa-angle-right {
  padding-bottom: 1px;
}

.pui-menu-accordion > li > a .fa-angle-down {
  display: none;
}

html.no-touch .pui-menu-accordion > li:hover > a .fa-angle-right, .pui-menu-accordion > li.hover > a .fa-angle-right {
  display: none;
}

html.no-touch .pui-menu-accordion > li:hover > a .fa-angle-down, .pui-menu-accordion > li.hover > a .fa-angle-down, .pui-menu-accordion > li.submenu-open > a .fa-angle-down,
html.no-touch .pui-menu-accordion > li.submenu-open:hover > a .fa-angle-down,
.pui-menu-accordion > li.submenu-open.hover > a .fa-angle-down {
  padding-top: 3px;
  display: block;
}

.pui-menu-accordion > li.submenu-open > a .fa-angle-right, html.no-touch .pui-menu-accordion > li.submenu-open:hover > a .fa-angle-right,
.pui-menu-accordion > li.submenu-open.hover > a .fa-angle-right {
  display: none;
}

.pui-menu-accordion .pui-sub-menu {
  display: none;
  margin-bottom: 0;
}

.pui-menu-accordion .pui-sub-menu > li + li > a {
  margin-bottom: -1px;
}

.pui-menu-accordion .pui-sub-menu > li > a {
  padding-left: 36px;
}

.pui-menu-accordion .pui-sub-menu > li > .pui-sub-menu {
  border: 1px solid #ddd;
  border-bottom: none;
  margin-bottom: 0;
}

.pui-menu-accordion .pui-sub-menu > li.pui-menu-header {
  padding-left: 15px;
}

html.no-touch .pui-menu-accordion .pui-sub-menu > li:hover > .pui-sub-menu, .pui-menu-accordion .pui-sub-menu > li.hover > .pui-sub-menu {
  display: block;
}

/* Mask layer */
.pui-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.pui-mask-bg {
  background-color: #000;
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
  z-index: 99;
}

.pui-mask-fixed {
  position: fixed;
}

.pui-mask-top {
  top: 0;
  left: 0;
  bottom: auto;
  right: auto;
}

.pui-mask-bottom {
  top: auto;
  left: 0;
  bottom: 0;
  right: auto;
}

.pui-mask-left {
  left: 0;
  right: auto;
  top: 0;
  bottom: auto;
}

.pui-mask-right {
  left: auto;
  right: 0;
  top: 0;
  bottom: auto;
}

.pui-mask-bg-white {
  background-color: #fff;
}

.pui-mask-opacity-zero {
  opacity: 0;
  /* W3C */
  filter: alpha(opacity=0);
  /* IE */
}

.pui-mask-opacity-full {
  opacity: 1;
  /* W3C */
  filter: alpha(opacity=100);
  /* IE */
}

.pui-mask-container {
  display: table;
}

.pui-mask-row {
  display: table-row;
}

.pui-mask-content {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

/* Notices */
.pui-notice {
  min-width: 240px;
  min-width: 24rem;
  padding: 12px;
  padding: 1.2rem;
  margin-bottom: 10px;
  margin-bottom: 1rem;
  border: 1px solid #ddd;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  position: relative;
  background: #fff;
}

.pui-notice-head {
  margin-top: -6px;
}

.pui-notice-head-underline > .pui-notice-head {
  padding: 0 0 6px 0;
  padding: 0 0 0.6rem 0;
  margin-bottom: 10px;
  margin-bottom: 1rem;
  border-bottom: 1px solid #ddd;
}

.pui-notice-head > strong {
  font-size: 16px;
  font-size: 1.6ren;
}

.pui-notice-head > small {
  margin-left: 8px;
  margin-left: 0.8rem;
}

.pui-notice-content {
  padding: 0;
}

.pui-notice-content a {
  color: #0D79DE;
}

html.no-touch .pui-notice-content a:hover, .pui-notice-content a.hover {
  text-decoration: underline;
}

.pui-notice > p:last-child, .pui-notice-content > p:last-child {
  margin: 0;
}

.pui-notice-foot {
  text-align: right;
  color: #ccc;
}

.pui-notice:not(.pui-notice-head-underline) {
  padding-right: 36px;
  padding-right: 3.6rem;
}

.pui-notice > .pui-close {
  position: absolute;
  top: 6px;
  right: 6px;
}

.pui-notice > .pui-close-bordered {
  top: -1px;
  right: -1px;
}

.pui-notice > .pui-close-border-circle {
  top: -10px;
  right: -10px;
  background: #fff;
}

.pui-notice-not-foot, .pui-notice:not(.pui-notice-foot) .pui-notice-content {
  padding-bottom: 0;
}

.pui-notice-icon {
  min-height: 60px;
  min-height: 6rem;
}

.pui-notice-icon:before {
  min-width: 54px;
  min-width: 5.4rem;
  padding-left: 5px;
  padding-left: 0.5rem;
  display: block;
  float: left;
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 1;
  opacity: 0.5;
  /* W3C */
  filter: alpha(opacity=50);
  /* IE */
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.pui-notice-icon > .pui-notice-content {
  margin-left: 54px;
  margin-left: 5.4rem;
}

.pui-notice-icon.pui-shadow {
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-notice-icon.pui-square {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-notice-icon.pui-inline-block {
  display: inline-block;
}

.pui-notice-icon-gary, .pui-notice-icon-bg-gary {
  color: #DDDDDD;
  border-color: white;
  background-color: white;
}

.pui-notice-icon-gary > .pui-close:after {
  color: #DDDDDD;
  opacity: 0.8;
}

html.no-touch .pui-notice-icon-gary > .pui-close:hover, .pui-notice-icon-gary > .pui-close.hover {
  opacity: 1;
}

.pui-notice-icon-bg-gary > .pui-notice-head > small {
  color: white;
}

.pui-notice-icon-primary, .pui-notice-icon-bg-primary {
  color: #008EE5;
  border-color: #75caff;
  background-color: #a8deff;
}

.pui-notice-icon-primary > .pui-close:after {
  color: #008EE5;
  opacity: 0.8;
}

html.no-touch .pui-notice-icon-primary > .pui-close:hover, .pui-notice-icon-primary > .pui-close.hover {
  opacity: 1;
}

.pui-notice-icon-bg-primary > .pui-notice-head > small {
  color: #33b1ff;
}

.pui-notice-icon-secondary, .pui-notice-icon-bg-secondary {
  color: #3BB4F2;
  border-color: #c1e7fb;
  background-color: #f1fafe;
}

.pui-notice-icon-secondary > .pui-close:after {
  color: #3BB4F2;
  opacity: 0.8;
}

html.no-touch .pui-notice-icon-secondary > .pui-close:hover, .pui-notice-icon-secondary > .pui-close.hover {
  opacity: 1;
}

.pui-notice-icon-bg-secondary > .pui-notice-head > small {
  color: #83cff7;
}

.pui-notice-icon-info, .pui-notice-icon-bg-info {
  color: #2EAAC6;
  border-color: #9bdae8;
  background-color: #c4e9f1;
}

.pui-notice-icon-info > .pui-close:after {
  color: #2EAAC6;
  opacity: 0.8;
}

html.no-touch .pui-notice-icon-info > .pui-close:hover, .pui-notice-icon-info > .pui-close.hover {
  opacity: 1;
}

.pui-notice-icon-bg-info > .pui-notice-head > small {
  color: #65c6db;
}

.pui-notice-icon-success, .pui-notice-icon-bg-success {
  color: #71B472;
  border-color: #cee5cf;
  background-color: #f0f7f0;
}

.pui-notice-icon-success > .pui-close:after {
  color: #71B472;
  opacity: 0.8;
}

html.no-touch .pui-notice-icon-success > .pui-close:hover, .pui-notice-icon-success > .pui-close.hover {
  opacity: 1;
}

.pui-notice-icon-bg-success > .pui-notice-head > small {
  color: #a3cea4;
}

.pui-notice-icon-warning, .pui-notice-icon-bg-warning {
  color: #FFB74D;
  border-color: #FAE5C4;
  background-color: #FCF5E8;
}

.pui-notice-icon-warning > .pui-close:after {
  color: #FFB74D;
  opacity: 0.8;
}

html.no-touch .pui-notice-icon-warning > .pui-close:hover, .pui-notice-icon-warning > .pui-close.hover {
  opacity: 1;
}

.pui-notice-icon-bg-warning > .pui-notice-head > small {
  color: #ffd69a;
}

.pui-notice-icon-error, .pui-notice-icon-bg-error {
  color: #E87467;
  border-color: #F7D1CB;
  background-color: #FFE8E3;
}

.pui-notice-icon-error > .pui-close:after {
  color: #E87467;
  opacity: 0.8;
}

html.no-touch .pui-notice-icon-error > .pui-close:hover, .pui-notice-icon-error > .pui-close.hover {
  opacity: 1;
}

.pui-notice-icon-bg-error > .pui-notice-head > small {
  color: #f2b1a9;
}

.pui-notice-icon-success:before {
  color: #71B472;
  content: "\f058";
}

.pui-notice-icon-info:before {
  color: #2EAAC6;
  content: "\f05a";
}

.pui-notice-icon-warning:before {
  color: #FFB74D;
  font-size: 32px;
  font-size: 3.2rem;
  content: "\f071";
}

.pui-notice-icon-error:before {
  color: #E87467;
  content: "\f00d";
}

.pui-notice-icon-question {
  color: #5AA5EA;
  border-color: #92C9FB;
  background: #C9E5FF;
}

.pui-notice-icon-question:before {
  color: #2493F7;
  content: "\f059";
}

.pui-notice-icon-question > .pui-close:after {
  color: #5AA5EA;
  opacity: 0.8;
}

.pui-notice-icon-update:before,
.pui-notice-icon-upload:before {
  font-size: 33px;
  font-size: 3.3rem;
  color: #2EAAC6;
  content: "\f0ee";
}

.pui-notice-icon-download:before {
  font-size: 33px;
  font-size: 3.3rem;
  color: #2EAAC6;
  content: "\f0ed";
}

.pui-notice-icon-unlink:before {
  font-size: 34px;
  font-size: 3.4rem;
  color: #2EAAC6;
  content: "\f127";
}

.pui-notice-icon-loading:before,
.pui-notice-icon-waiting:before {
  color: #2EAAC6;
  content: "\f017";
}

.pui-notice-icon-email:before,
.pui-notice-icon-message:before {
  font-size: 32px;
  font-size: 3.2rem;
  color: #2EAAC6;
  content: "\f003";
}

.pui-notice-icon-comment:before {
  font-size: 35px;
  font-size: 3.5rem;
  color: #2EAAC6;
  content: "\f0e6";
}

.pui-notice-icon-tips:before {
  font-size: 38px;
  font-size: 3.8rem;
  color: #2EAAC6;
  content: "\f0eb";
}

.pui-notice-popup {
  width: 320px;
  width: 32rem;
  position: fixed;
  top: 10px;
  right: 10px;
  z-index: 1000;
}

.pui-notice-popup > .pui-notice {
  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-notice > .pui-badge {
  float: left;
  margin-top: 5px;
}

.pui-notice > .pui-badge + .pui-notice-content {
  margin-left: 48px;
  margin-left: 4.8rem;
}

.pui-notice > .pui-badge-dot + .pui-notice-content {
  margin-left: 24px;
  margin-left: 2.4rem;
}

.pui-notice-position-tl, .pui-notice-position-tr, .pui-notice-position-tc,
.pui-notice-position-bl, .pui-notice-position-br, .pui-notice-position-bc {
  position: fixed;
  z-index: 10001;
}

.pui-notice-position-tl {
  top: 10px;
  bottom: auto;
  left: 10px;
  right: auto;
}

.pui-notice-position-tr {
  top: 10px;
  right: 10px;
  left: auto;
  bottom: auto;
}

.pui-notice-position-tc {
  width: 40%;
  top: 10px;
  left: 30%;
  right: auto;
  bottom: auto;
}

.pui-notice-position-bl {
  top: auto;
  bottom: 10px;
  left: 10px;
  right: auto;
}

.pui-notice-position-br {
  top: auto;
  bottom: 10px;
  right: 10px;
  left: auto;
}

.pui-notice-position-bc {
  top: auto;
  width: 40%;
  bottom: 10px;
  left: 30%;
}

.pui-notice-content-scrollable {
  height: 160px;
  height: 16rem;
  margin-bottom: 5px;
  overflow-y: scroll;
}

.pui-notice-content-scrollable-x {
  margin-bottom: 5px;
  overflow-y: hidden;
  overflow-x: auto;
}

.pui-notice-content-scrollable-auto {
  height: 160px;
  height: 16rem;
  margin-bottom: 5px;
  overflow: auto;
}

/* Progress */
.pui-progress {
  font-size: 12px;
  font-size: 1.2rem;
  background: #f6f6f6;
  margin-bottom: 10px;
  margin-bottom: 1rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
  /* Webkit browsers */
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
  /* IE9+, News */
}

.pui-progress.pui-progress-unshadow {
  -webkit-box-shadow: none;
  /* Webkit browsers */
  box-shadow: none;
  /* IE9+, News */
}

html.no-touch .pui-progress:hover, .pui-progress.hover {
  background: #eee;
}

.pui-progress-bar {
  color: #fff;
  position: relative;
  text-align: center;
  padding: 0 5px;
  padding: 0 0.5rem;
  background: #008EE5;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.pui-progress-bar.pui-progress-shadow {
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
  /* Webkit browsers */
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
  /* IE9+, News */
}

.pui-progress-bar.pui-progress-mini-text, .pui-progress-bar.pui-progress-small-text {
  margin-top: 24px;
  margin-top: 2.4rem;
}

.pui-progress-bar.pui-progress-mini {
  height: 5px;
  height: 0.5rem;
}

.pui-progress-bar.pui-progress-small {
  height: 10px;
  height: 1rem;
}

.pui-progress-bar span {
  color: #666;
  display: block;
  width: 100%;
  position: absolute;
  top: -20px;
  top: -2rem;
  left: 0;
}

.pui-progress-bar.pui-progress-text-left {
  text-align: left;
}

.pui-progress-bar.pui-progress-text-right {
  text-align: right;
}

.pui-progress-bar.pui-progress-text-center {
  text-align: center;
}

.pui-progress-bar .pui-progress-gary, .pui-progress-bar.pui-progress-gary {
  background-color: #DDDDDD;
}

html.no-touch .pui-progress-bar .pui-progress-gary:hover, .pui-progress-bar .pui-progress-gary.hover, html.no-touch .pui-progress-bar.pui-progress-gary:hover, .pui-progress-bar.pui-progress-gary.hover {
  background-color: #c4c4c4;
}

.pui-progress-bar .pui-progress-primary, .pui-progress-bar.pui-progress-primary {
  background-color: #008EE5;
}

html.no-touch .pui-progress-bar .pui-progress-primary:hover, .pui-progress-bar .pui-progress-primary.hover, html.no-touch .pui-progress-bar.pui-progress-primary:hover, .pui-progress-bar.pui-progress-primary.hover {
  background-color: #006eb2;
}

.pui-progress-bar .pui-progress-secondary, .pui-progress-bar.pui-progress-secondary {
  background-color: #3BB4F2;
}

html.no-touch .pui-progress-bar .pui-progress-secondary:hover, .pui-progress-bar .pui-progress-secondary.hover, html.no-touch .pui-progress-bar.pui-progress-secondary:hover, .pui-progress-bar.pui-progress-secondary.hover {
  background-color: #10a0ea;
}

.pui-progress-bar .pui-progress-info, .pui-progress-bar.pui-progress-info {
  background-color: #2EAAC6;
}

html.no-touch .pui-progress-bar .pui-progress-info:hover, .pui-progress-bar .pui-progress-info.hover, html.no-touch .pui-progress-bar.pui-progress-info:hover, .pui-progress-bar.pui-progress-info.hover {
  background-color: #24869d;
}

.pui-progress-bar .pui-progress-success, .pui-progress-bar.pui-progress-success {
  background-color: #71B472;
}

html.no-touch .pui-progress-bar .pui-progress-success:hover, .pui-progress-bar .pui-progress-success.hover, html.no-touch .pui-progress-bar.pui-progress-success:hover, .pui-progress-bar.pui-progress-success.hover {
  background-color: #549e55;
}

.pui-progress-bar .pui-progress-warning, .pui-progress-bar.pui-progress-warning {
  background-color: #FFB74D;
}

html.no-touch .pui-progress-bar .pui-progress-warning:hover, .pui-progress-bar .pui-progress-warning.hover, html.no-touch .pui-progress-bar.pui-progress-warning:hover, .pui-progress-bar.pui-progress-warning.hover {
  background-color: #ffa21a;
}

.pui-progress-bar .pui-progress-error, .pui-progress-bar.pui-progress-error {
  background-color: #E87467;
}

html.no-touch .pui-progress-bar .pui-progress-error:hover, .pui-progress-bar .pui-progress-error.hover, html.no-touch .pui-progress-bar.pui-progress-error:hover, .pui-progress-bar.pui-progress-error.hover {
  background-color: #e14b3b;
}

.pui-progress-striped .pui-progress-bar, .pui-progress-striped-reverse .pui-progress-bar {
  background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-size: 28px 28px;
}

.pui-progress-striped-reverse .pui-progress-bar {
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

@-webkit-keyframes progress-bar-stripes {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 28px 0;
  }
}

@keyframes progress-bar-stripes {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 28px 0;
  }
}

.pui-progress-striped.pui-progress-active .pui-progress-bar, .pui-progress-striped-reverse.pui-progress-active .pui-progress-bar {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
  animation: progress-bar-stripes 2s linear infinite;
}

.pui-progress-group {
  position: relative;
  display: block;
  overflow: hidden;
}

.pui-progress-group .pui-progress-bar {
  float: left;
  display: inline-block;
}

.pui-progress-group .pui-progress-bar:not(:first-child) {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-progress-small-group, .pui-progress-mini-group {
  overflow: visible;
  margin-top: 24px;
  margin-top: 2.4rem;
}

.pui-progress-small-group .pui-progress-bar.pui-progress-group-end, .pui-progress-mini-group .pui-progress-bar.pui-progress-group-end {
  padding: 0;
  background: #f6f6f6;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
  /* Webkit browsers */
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
  /* IE9+, News */
}

.pui-progress-small-group .pui-progress-bar.pui-progress-group-end.pui-progress-group-end-unshadow, .pui-progress-mini-group .pui-progress-bar.pui-progress-group-end.pui-progress-group-end-unshadow {
  -webkit-box-shadow: none;
  /* Webkit browsers */
  box-shadow: none;
  /* IE9+, News */
}

html.no-touch .pui-progress-small-group .pui-progress-bar.pui-progress-group-end:hover, .pui-progress-small-group .pui-progress-bar.pui-progress-group-end.hover, html.no-touch .pui-progress-mini-group .pui-progress-bar.pui-progress-group-end:hover, .pui-progress-mini-group .pui-progress-bar.pui-progress-group-end.hover {
  background: #eee;
}

.pui-progress-text-group {
  overflow: auto;
  width: 100%;
  position: absolute;
  top: -20px;
  top: -2rem;
  left: 0;
}

.pui-progress-text-group span {
  display: block;
  float: left;
}

/* Pagination */
.pui-pagination {
  color: #666;
  list-style: none;
  font-size: 14px;
  font-size: 1.4rem;
  margin: 0;
  padding: 0;
  position: relative;
}

.pui-pagination:before, .pui-pagination:after {
  content: " ";
  display: table;
}

.pui-pagination:after {
  clear: both;
}

.pui-pagination li {
  *float: left;
  *margin-right: 3px;
  display: inline-block;
  vertical-align: middle;
}

.pui-pagination li a, .pui-pagination li span, .pui-pagination li input[type="button"] {
  padding: 0 8px;
  padding: 0 0.76rem;
  padding: 0 0.9rem \9;
  margin-bottom: 5px;
  line-height: 1.8;
  color: #666;
  text-align: center;
  display: inline-block;
}

.pui-pagination li input[type="button"] {
  background: #fff;
  border: 1px solid #ddd;
}

html.no-touch .pui-pagination li input[type="button"]:hover, .pui-pagination li input[type="button"].hover {
  background-color: #fafafa;
}

html.no-touch .pui-pagination li a:hover, .pui-pagination li a.hover {
  background: #f6f6f6;
}

html.no-touch .pui-pagination li a.disabled:hover, .pui-pagination li a.disabled.hover, html.no-touch .pui-pagination li a.pui-disabled:hover, .pui-pagination li a.pui-disabled.hover {
  background: none;
}

.pui-pagination li a.active, .pui-pagination li a.pui-active {
  color: #fff;
  cursor: default;
  border-color: #008EE5;
  background: #008EE5;
}

.pui-pagination li select {
  *width: 80px;
  padding: 0 12px;
  padding: 0 1.2rem;
  margin-bottom: 5px;
  font-size: 13px;
  font-size: 1.3rem;
  background-size: 15px;
  background: none\9;
}

.pui-pagination li select.unbordered, .pui-pagination li select.pui-unbordered {
  border: none;
}

.pui-pagination li.pui-input {
  padding-left: 10px;
  padding-left: 1rem;
  padding-right: 10px;
  padding-right: 1rem;
  text-align: center;
}

.pui-pagination li input[type="text"], .pui-pagination li input[type="number"] {
  width: 40px;
  text-align: center;
  margin-right: 0;
  padding-top: 4px;
  padding-top: 0.4rem;
  padding-bottom: 4px;
  padding-bottom: 0.4rem;
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: -1px;
}

.pui-pagination li input[type="number"] {
  width: 48px;
}

.pui-pagination.pui-pagination-bordered li a {
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.pui-pagination.pui-pagination-bordered li a.active, .pui-pagination.pui-pagination-bordered li a.pui-active {
  border-color: #008EE5;
}

.pui-pagination.pui-pagination-bordered li input[type="button"] {
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.pui-pagination.pui-pagination-border-square li a, .pui-pagination.pui-pagination-border-square li input[type="button"] {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-pagination.pui-pagination-left {
  float: left;
}

.pui-pagination.pui-pagination-right {
  float: right;
}

.pui-pagination.pui-pagination-circle li a {
  -webkit-border-radius: 500px;
  border-radius: 500px;
}

.pui-pagination.pui-pagination-prev-next li {
  margin: 0 auto;
}

.pui-pagination.pui-pagination-prev-next li span {
  text-align: center;
  margin: 0 auto;
}

.pui-pagination.pui-pagination-prev-next li:first-child {
  margin: 0;
  float: left;
}

.pui-pagination.pui-pagination-prev-next li:last-child {
  margin: 0;
  float: right;
}

.pui-pagination.pui-pagination-prev-next > .pui-pagination-nav {
  width: 50%;
  text-align: center;
  position: absolute;
  left: 25%;
  top: 0;
}

.pui-pagination.pui-pagination-center {
  margin: 0 auto;
  text-align: center;
}

.pui-pagination.pui-pagination-compact li {
  float: left;
}

.pui-pagination.pui-pagination-compact li a {
  border-radius: 0;
}

.pui-pagination.pui-pagination-compact li + li {
  margin-left: -1px;
}

@media (max-width: 768px) {
  .pui-pagination li a {
    padding: 0.2rem 1rem 0 1rem;
  }
  .pui-pagination li select {
    font-size: 1.4rem;
  }
}

/* Rating */
.pui-rating {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-rating > span {
  display: inline-block;
  padding: 0 1px;
  cursor: pointer;
}

.pui-rating > span:before {
  display: inline-block;
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #ddd;
  text-align: center;
  vertical-align: middle;
  font-size: 21px;
  font-size: 2.1rem;
  content: "\F006";
}

.pui-rating > span.half:before {
  color: #ff9900;
  content: "\F123";
}

.pui-rating > span.full:before {
  color: #ff9900;
  content: "\F005";
}

.pui-rating > small {
  vertical-align: middle;
  margin-left: 7px;
  margin-left: 0.7rem;
}

.pui-rating-xsmall > span:before {
  font-size: 12px;
  font-size: 1.2rem;
}

.pui-rating-small > span:before {
  font-size: 16px;
  font-size: 1.6rem;
}

.pui-rating-large > span:before {
  font-size: 25px;
  font-size: 2.5rem;
}

.pui-rating-xlarge > span:before {
  font-size: 30px;
  font-size: 3rem;
}

/* Search */
.pui-search {
  position: relative;
  margin: 0;
  padding: 0;
  text-align: left;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-search:before, .pui-search:after {
  content: " ";
  display: table;
}

.pui-search:after {
  clear: both;
}

.pui-search > .pui-search-keywords, .pui-search > .pui-search-submit {
  margin: 0;
  padding: 7px;
}

.pui-search > .pui-search-keywords {
  color: #666;
  background: #fff;
  padding-right: 34px;
}

.pui-search > .pui-search-submit {
  background: none;
  position: absolute;
  top: -1px;
  right: 0;
  width: 36px;
  border: none;
}

.pui-search > .pui-search-submit:before {
  display: inline-block;
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #ddd;
  text-align: center;
  vertical-align: middle;
  font-size: 18px;
  content: "\f002";
}

html.no-touch .pui-search > .pui-search-submit:hover:before, .pui-search > .pui-search-submit.hover:before {
  color: #008EE5;
}

.pui-search.square > .pui-search-keywords,
.pui-search.pui-square > .pui-search-keywords {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-search.round, .pui-search.pui-round {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-search.round > .pui-search-keywords, .pui-search.pui-round > .pui-search-keywords {
  padding-left: 15px;
  -webkit-border-radius: 500px;
  border-radius: 500px;
}

.pui-search.round > .pui-search-submit, .pui-search.pui-round > .pui-search-submit {
  width: 40px;
}

.pui-search-simple > .pui-search-keywords {
  border: none;
  background: none;
  padding-left: 0;
  padding-right: 0;
  margin: 0 0 0 36px;
}

.pui-search-simple > .pui-search-submit {
  top: -2px;
  left: 0;
}

.pui-search-large > .pui-search-keywords {
  padding: 9px;
}

.pui-search-large > .pui-search-submit {
  width: 40px;
  padding: 9px 0;
}

.pui-search-large > .pui-search-keywords {
  padding-right: 34px;
}

.pui-search-unbordered > .pui-search-keywords {
  border: none;
}

.pui-search.pui-search-white > .pui-search-keywords, .pui-search.pui-search-white > .pui-search-keywords::-webkit-input-placeholder {
  color: #fff;
}

.pui-search.pui-search-white > .pui-search-keywords::-moz-input-placeholder, .pui-search.pui-search-white > .pui-search-keywords:-ms-input-placeholder {
  color: #fff;
}

.pui-search.pui-search-white > .pui-search-submit:before {
  color: #fff;
}

html.no-touch .pui-search.pui-search-white > .pui-search-submit:before:hover:before, .pui-search.pui-search-white > .pui-search-submit:before.hover:before {
  opacity: 0.8;
  /* W3C */
  filter: alpha(opacity=80);
  /* IE */
}

.pui-search-auto-complete {
  width: 100%;
  position: absolute;
  top: auto;
  left: 0;
  z-index: 100;
  background: #fff;
  border: 1px solid #ddd;
  border-top: none;
}

.pui-search-auto-complete > li > a {
  display: block;
  padding: 5px 15px 5px 0;
}

html.no-touch .pui-search-auto-complete > li > a:hover, .pui-search-auto-complete > li > a.hover {
  background-color: #fafafa;
}

.pui-search-auto-complete > li > a:before {
  display: inline-block;
  font-family: "FontAwesome";
  font-weight: normal;
  font-style: normal;
  font-size: 14px;
  vertical-align: baseline;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #ddd;
  content: "\f002";
  padding: 0 10px;
}

.pui-search-auto-complete > li + li > a {
  border-top: 1px solid #eee;
}

.pui-search.round > .pui-search-auto-complete, .pui-search.pui-round > .pui-search-auto-complete {
  width: 90%;
  left: 5%;
  border-top: 1px solid #ddd;
}

.pui-search-auto-complete.shadow, .pui-search-auto-complete.pui-shadow {
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  /* Webkit browsers */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  /* IE9+, News */
}

@-webkit-keyframes search-keywords-slide {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@-moz-keyframes search-keywords-slide {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes search-keywords-slide {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@-webkit-keyframes search-keywords-slide-reverse {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@-moz-keyframes search-keywords-slide-reverse {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
}

@keyframes search-keywords-slide-reverse {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }
}

.pui-search-single-button > .pui-search-keywords {
  visibility: hidden;
}

.pui-search-single-button > .pui-search-keywords.pui-search-keywords-slide {
  visibility: visible;
  -webkit-animation: search-keywords-slide 0.5s;
  -moz-animation: search-keywords-slide 0.5s;
  /* Firefox 5.0~16.0 */
  animation: search-keywords-slide 0.5s;
  /* IE10+ */
}

.pui-search-single-button > .pui-search-keywords.pui-search-keywords-slide-reverse {
  -webkit-animation: search-keywords-slide-reverse 0.5s;
  -moz-animation: search-keywords-slide-reverse 0.5s;
  /* Firefox 5.0~16.0 */
  animation: search-keywords-slide-reverse 0.5s;
  /* IE10+ */
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}

/* Custom Switch Button */
pui-switch {
  cursor: pointer;
  font-size: 12px;
  font-size: 1.2rem;
  overflow: hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

pui-switch + pui-switch {
  margin-left: 10px;
  margin-left: 1rem;
}

pui-switch > switches > span {
  min-width: 36px;
  min-width: 3.6rem;
  padding: 2px 6px;
  padding: 0.2rem 0.6rem;
  text-align: center;
  display: inline-block;
  background: #fff;
  border: 1px solid #ddd;
  -webkit-transition: all 100ms ease-in;
  /* Safari, Chrome */
  -moz-transition: all 100ms ease-in;
  /* Firefox 4.0~16.0 */
  transition: all 100ms ease-in;
  /* IE >9, FF >15, Opera >12.0 */
}

html.no-touch pui-switch > switches > span:hover, pui-switch > switches > span.hover {
  background: #f6f6f6;
}

pui-switch > switches > span:first-child {
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

pui-switch > switches > span:last-child {
  -webkit-border-top-right-radius: 5px;
  border-top-right-radius: 5px;
  -webkit-border-bottom-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

pui-switch > switches > span + span {
  margin-left: -1px;
}

pui-switch > switches > .switched, pui-switch > switches > .pui-switched {
  color: #fff;
  background: #2191F6;
  border-color: #2191F6;
}

html.no-touch pui-switch > switches > .switched:hover, pui-switch > switches > .switched.hover, html.no-touch pui-switch > switches > .pui-switched:hover, pui-switch > switches > .pui-switched.hover {
  background: #1279D8;
  border-color: #1279D8;
}

pui-switch > switches > .switched + span, pui-switch > switches > .pui-switched + span {
  border-left-color: #2191F6;
}

pui-switch[disabled] > switches > .pui-switched {
  color: #777;
  background: #ddd;
  border-color: #ddd;
}

pui-switch[disabled] > switches > .pui-switched + span {
  border-left-color: #ddd;
}

pui-switch > input[type="hidden"] {
  width: 0;
  height: 0;
}

pui-switch > small {
  margin-left: 15px;
  margin-left: 1.5rem;
}

pui-switch.pui-switch-sm > switches > span {
  min-width: 16px;
  min-width: 1.6rem;
  min-height: 16px;
  min-height: 1.6rem;
  padding: 0 3px;
  padding: 0 0.3rem;
}

pui-switch.pui-switch-lg > switches > span {
  padding: 2px 10px;
  padding: 0.2rem 1rem;
}

pui-switch.square > switches > span,
pui-switch.pui-square > switches > span {
  -webkit-border-radius: 0;
  border-radius: 0;
}

pui-switch.round > switches > span:first-child,
pui-switch.pui-round > switches > span:first-child {
  -webkit-border-top-left-radius: 500px;
  border-top-left-radius: 500px;
  -webkit-border-bottom-left-radius: 500px;
  border-bottom-left-radius: 500px;
}

pui-switch.round > switches > span:last-child,
pui-switch.pui-round > switches > span:last-child {
  -webkit-border-top-right-radius: 500px;
  border-top-right-radius: 500px;
  -webkit-border-bottom-right-radius: 500px;
  border-bottom-right-radius: 500px;
}

/* Custom Switch Slide Button */
pui-switch-slide {
  width: 72px;
  padding: 2px;
  display: inline-block;
  color: #2191F6;
  background: #2191F6;
  overflow: hidden;
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
  -webkit-border-radius: 4px;
  border-radius: 4px;
  vertical-align: middle;
  cursor: pointer;
}

pui-switch-slide + pui-switch-slide {
  margin-left: 3px;
}

pui-switch-slide span {
  float: left;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 1px 9px;
  padding: 0.1rem 0.9rem;
  background: #fff;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  text-align: center;
}

pui-switch-slide span.off {
  float: right;
}

pui-switch-slide.square, pui-switch-slide.square span,
pui-switch-slide.pui-square, pui-switch-slide.pui-square span {
  -webkit-border-radius: 0;
  border-radius: 0;
}

pui-switch-slide.round, pui-switch-slide.round span,
pui-switch-slide.pui-round, pui-switch-slide.pui-round span {
  -webkit-border-radius: 100px;
  border-radius: 100px;
}

html.no-touch pui-switch-slide:hover span, pui-switch-slide.hover span {
  background: #f6f6f6;
}

pui-switch-slide[disabled] {
  color: #ccc;
  background: #ddd;
}

pui-switch-slide.animated span,
pui-switch-slide.pui-switch-slide-animation span {
  -webkit-animation: switch-slide-right 0.5s;
  -moz-animation: switch-slide-right 0.5s;
  /* Firefox 5.0~16.0 */
  animation: switch-slide-right 0.5s;
  /* IE10+ */
}

pui-switch-slide.animated span.off,
pui-switch-slide.pui-switch-slide-animation span.off {
  -webkit-animation: switch-slide-left 0.5s;
  -moz-animation: switch-slide-left 0.5s;
  /* Firefox 5.0~16.0 */
  animation: switch-slide-left 0.5s;
  /* IE10+ */
}

@-webkit-keyframes switch-slide-right {
  0% {
    -webkit-transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(0);
  }
}

@keyframes switch-slide-right {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0);
  }
}

@-webkit-keyframes switch-slide-left {
  0% {
    -webkit-transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0);
  }
}

@keyframes switch-slide-left {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}

/* Tabs */
.pui-tab, .pui-tab-head, .pui-tab-container, .pui-tab-box, .pui-tab-foot {
  position: relative;
}

.pui-tab {
  margin-bottom: 15px;
  margin-bottom: 1.5rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-tab:before, .pui-tab:after {
  display: table;
  content: " ";
}

.pui-tab:after {
  clear: both;
}

.pui-tab-head {
  margin: 0;
  padding: 0;
  list-style: none;
}

.pui-tab-head > li {
  cursor: pointer;
  padding: 6px 12px;
  padding: 0.6rem 1.2rem;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  display: inline-block;
  -webkit-transition: background-color 300ms ease-out, border-color 300ms ease-out;
  /* Safari, Chrome */
  -moz-transition: background-color 300ms ease-out, border-color 300ms ease-out;
  /* Firefox 4.0~16.0 */
  transition: background-color 300ms ease-out, border-color 300ms ease-out;
  /* IE >9, FF >15, Opera >12.0 */
}

html.no-touch .pui-tab-head > li:hover, .pui-tab-head > li.hover {
  background: #f6f6f6;
}

.pui-tab-head > li.active, .pui-tab-head > li.pui-active {
  color: #fff;
  background: #C54B3B;
}

.pui-tab-head > li.disabled, .pui-tab-head > li.pui-disabled {
  cursor: not-allowed;
}

.pui-tab-box {
  display: none;
  padding: 10px 0;
  padding: 1rem 0;
}

.pui-tab-foot {
  border-top: 1px solid #ddd;
  padding: 8px 0;
  padding: 0.8rem 0;
  color: #999;
}

.pui-tab-foot-bordered {
  padding: 8px 10px;
  padding: 0.8rem 1rem;
  border: 1px solid #ddd;
  border-top: none;
}

.pui-tab-foot-unbordered {
  border: none;
}

.pui-tab-square > li {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-tab-ellipse > li {
  -webkit-border-radius: 500px;
  border-radius: 500px;
}

.pui-tab-bordered > .pui-tab-head {
  border-bottom: 1px solid #ddd;
}

.pui-tab-bordered > .pui-tab-head > li {
  padding-left: 15px;
  padding-left: 1.5rem;
  padding-right: 15px;
  padding-right: 1.5rem;
  margin-bottom: -1px;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
  transition: none;
}

.pui-tab-bordered > .pui-tab-head > li.active, .pui-tab-bordered > .pui-tab-head > li.pui-active {
  color: #666;
  background: #fff;
  border: 1px solid #ddd;
  border-bottom-color: #fff;
}

.pui-tab-box-bordered > .pui-tab-box {
  padding: 15px;
  border: 1px solid #ddd;
  border-top: 0;
}

.pui-tab-box-radius > .pui-tab-box {
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-tab-underline > .pui-tab-head {
  border-bottom: 2px solid #C54B3B;
}

.pui-tab-underline > .pui-tab-head > li {
  padding-left: 15px;
  padding-left: 1.5rem;
  padding-right: 15px;
  padding-right: 1.5rem;
  margin-bottom: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pui-tab-justify > .pui-tab-head {
  width: 100%;
  display: table;
}

.pui-tab-justify > .pui-tab-head > li {
  text-align: center;
  display: table-cell;
}

.pui-tab-bordered.pui-tab-justify > .pui-tab-head {
  border: none;
}

.pui-tab-bordered.pui-tab-justify > .pui-tab-head > li {
  border-bottom: 1px solid #ddd;
}

.pui-tab-bordered.pui-tab-justify > .pui-tab-head > li.active, .pui-tab-bordered.pui-tab-justify > .pui-tab-head > li.pui-active {
  border-bottom: none;
}

.pui-tab-left {
  width: 100%;
  display: table;
}

.pui-tab-left > .pui-tab-head {
  width: 20%;
  display: table-cell;
}

.pui-tab-left > .pui-tab-head > li {
  display: block;
}

.pui-tab-left > .pui-tab-container {
  width: 80%;
  display: table-cell;
}

.pui-tab-left > .pui-tab-container > .pui-tab-box {
  padding: 0 15px;
  padding: 0 1.5rem;
}

.pui-tab-right {
  width: 100%;
  display: table;
}

.pui-tab-right > .pui-tab-head {
  width: 20%;
  display: table-cell;
}

.pui-tab-right > .pui-tab-head > li {
  display: block;
}

.pui-tab-right > .pui-tab-container {
  width: 80%;
  display: table-cell;
}

.pui-tab-right > .pui-tab-container > .pui-tab-box {
  padding: 0 15px 0 0;
  padding: 0 1.5rem 0 0;
}

.pui-tab-bottom > .pui-tab-container > .pui-tab-box {
  padding: 15px 0;
  padding: 1.5rem 0;
}

.pui-tab-underline.pui-tab-left > .pui-tab-head {
  border: none;
  border-right: 2px solid #008EE5;
}

.pui-tab-underline.pui-tab-left > .pui-tab-head > li {
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.pui-tab-underline.pui-tab-right > .pui-tab-head {
  border: none;
  border-left: 2px solid #008EE5;
}

.pui-tab-underline.pui-tab-right > .pui-tab-head > li {
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-tab-underline.pui-tab-bottom > .pui-tab-head {
  border: none;
  border-top: 2px solid #008EE5;
}

.pui-tab-underline.pui-tab-bottom > .pui-tab-head > li {
  -webkit-border-radius: 0;
  border-radius: 0;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-tab-bordered.pui-tab-left > .pui-tab-head {
  border: none;
  border-right: 1px solid #ddd;
}

.pui-tab-bordered.pui-tab-left > .pui-tab-head > li {
  margin: 0;
  -webkit-border-top-right-radius: 0;
  border-top-right-radius: 0;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.pui-tab-bordered.pui-tab-left > .pui-tab-head > li.active, .pui-tab-bordered.pui-tab-left > .pui-tab-head > li.pui-active {
  margin-right: -2px;
  border-right-color: #fff;
  border-bottom-color: #ddd;
}

.pui-tab-left > .pui-tab-box-bordered > .pui-tab-box {
  padding: 15px;
  padding: 1.5rem;
  border-top: 1px solid #ddd;
  border-left: none;
}

.pui-tab-left > .pui-tab-box-radius > .pui-tab-box {
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
}

.pui-tab-bordered.pui-tab-right {
  width: 100%;
}

.pui-tab-bordered.pui-tab-right > .pui-tab-head {
  border: none;
  border-left: 1px solid #ddd;
}

.pui-tab-bordered.pui-tab-right > .pui-tab-head > li {
  margin: 0;
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-tab-bordered.pui-tab-right > .pui-tab-head > li.active, .pui-tab-bordered.pui-tab-right > .pui-tab-head > li.pui-active {
  margin-left: -2px;
  border-left-color: #fff;
  border-bottom-color: #ddd;
}

.pui-tab-right > .pui-tab-box-bordered > .pui-tab-box {
  padding: 1.5rem;
  border-top: 1px solid #ddd;
  border-right: none;
}

.pui-tab-right > .pui-tab-box-radius > .pui-tab-box {
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pui-tab-bordered.pui-tab-bottom > .pui-tab-head {
  border: none;
  border-top: 1px solid #ddd;
}

.pui-tab-bordered.pui-tab-bottom > .pui-tab-head > li {
  -webkit-border-radius: 0;
  border-radius: 0;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-tab-bordered.pui-tab-bottom > .pui-tab-head > li.active, .pui-tab-bordered.pui-tab-bottom > .pui-tab-head > li.pui-active {
  margin-top: -1px;
  border-top-color: #fff;
  border-bottom: 1px solid #ddd;
}

.pui-tab-bottom > .pui-tab-box-bordered > .pui-tab-box {
  padding: 15px;
  padding: 1.5rem;
  border-top: 1px solid #ddd;
  border-bottom: none;
}

.pui-tab-bottom > .pui-tab-box-radius > .pui-tab-box {
  -webkit-border-radius: 0;
  border-radius: 0;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
}

.pui-tab-bordered.pui-tab-group-style > .pui-tab-head {
  border: none;
}

.pui-tab-bordered.pui-tab-group-style > .pui-tab-head > li {
  float: left;
  border: 1px solid #ddd;
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-tab-bordered.pui-tab-group-style > .pui-tab-head > li.active, .pui-tab-bordered.pui-tab-group-style > .pui-tab-head > li.pui-active {
  color: #fff;
  background: #008EE5;
  border-color: #008EE5;
}

.pui-tab-bordered.pui-tab-group-style > .pui-tab-head > li:first-child {
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.pui-tab-bordered.pui-tab-group-style > .pui-tab-head > li:last-child {
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.pui-tab-bordered.pui-tab-group-style > .pui-tab-head > li + li {
  margin-left: -1px;
}

.pui-tab-bordered.pui-tab-group-style > .pui-tab-head > li.active + li, .pui-tab-bordered.pui-tab-group-style > .pui-tab-head > li.pui-active + li {
  border-left-color: #008EE5;
}

.pui-tab > .pui-tab-scroll-x, .pui-tab > .pui-tab-scroll-y {
  overflow: hidden;
}

.pui-tab > .pui-tab-scroll-x {
  width: 100%;
  height: auto;
}

.pui-tab > .pui-tab-scroll-x > .pui-tab-container {
  width: 40000px;
  height: auto;
}

.pui-tab > .pui-tab-scroll-x > .pui-tab-container > .pui-tab-box {
  width: 769px;
  height: auto;
  float: left;
  display: block;
}

.pui-tab > .pui-tab-scroll-y {
  width: 100%;
  height: 100px;
  min-height: 100px;
}

.pui-tab > .pui-tab-scroll-y > .pui-tab-container {
  width: 100%;
  min-height: 1000px;
}

.pui-tab > .pui-tab-scroll-y > .pui-tab-container > .pui-tab-box {
  width: 100%;
  min-height: 100px;
  display: block;
}

/* Tooltips */
.pui-tooltip {
  position: relative;
  display: inline-block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.pui-tooltip.square, .pui-tooltip.pui-square {
  -webkit-border-radius: 0;
  border-radius: 0;
}

.pui-tooltip.shadow, .pui-tooltip.pui-shadow {
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  /* Webkit browsers */
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  /* IE9+, News */
}

.pui-tooltip-bordered {
  padding: 8px 12px;
  padding: 0.8rem 1.2rem;
  background: #fff;
  border: 1px solid #ddd;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.pui-tooltip-opacity {
  color: #fff;
  background: #000;
  border-color: #000;
  opacity: 0.7;
  /* W3C */
  filter: alpha(opacity=70);
  /* IE */
}

.pui-tooltip-opacity-1 {
  opacity: 1;
  /* W3C */
  filter: alpha(opacity=100);
  /* IE */
}

.pui-tooltip-viewer {
  display: inline-block;
  background: #fff;
  border: 1px solid #ddd;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.pui-tooltip-context {
  position: relative;
}

.pui-tooltip-context > img + p {
  margin-top: 5px;
}

.pui-tooltip-context > p:last-child {
  margin-bottom: 0;
}

[class*=pui-tooltip-arrow-]:before, [class*=pui-tooltip-arrow-]:after {
  width: 0;
  height: 0;
  display: block;
  content: "";
  border: 7px solid transparent;
  pointer-events: pointer-events;
  position: absolute;
}

/* Top */
[class*=pui-tooltip-arrow-t]:before, [class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: #ccc;
  top: -14px;
}

[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: #fff;
  top: -13px;
}

.pui-tooltip-arrow-tl:before, .pui-tooltip-arrow-tl:after {
  left: 8%;
}

.pui-tooltip-arrow-tc:before, .pui-tooltip-arrow-tc:after {
  left: 49%;
}

.pui-tooltip-arrow-tr:before, .pui-tooltip-arrow-tr:after {
  right: 8%;
}

/* Bottom */
[class*=pui-tooltip-arrow-b]:before, [class*=pui-tooltip-arrow-b]:after {
  border-top-color: #ccc;
  bottom: -14px;
}

[class*=pui-tooltip-arrow-b]:after {
  border-top-color: #fff;
  bottom: -13px;
}

.pui-tooltip-arrow-bl:before, .pui-tooltip-arrow-bl:after {
  left: 8%;
}

.pui-tooltip-arrow-bc:before, .pui-tooltip-arrow-bc:after {
  left: 49%;
}

.pui-tooltip-arrow-br:before, .pui-tooltip-arrow-br:after {
  right: 8%;
}

/* left */
[class*=pui-tooltip-arrow-l]:before, [class*=pui-tooltip-arrow-l]:after {
  border-right-color: #ccc;
  left: -14px;
}

[class*=pui-tooltip-arrow-l]:after {
  border-right-color: #fff;
  left: -13px;
}

.pui-tooltip-arrow-lt:before, .pui-tooltip-arrow-lt:after {
  top: 12px;
}

.pui-tooltip-arrow-lc:before, .pui-tooltip-arrow-lc:after {
  top: 46%;
}

.pui-tooltip-arrow-lb:before, .pui-tooltip-arrow-lb:after {
  bottom: 12px;
}

/* right */
[class*=pui-tooltip-arrow-r]:before, [class*=pui-tooltip-arrow-r]:after {
  border-left-color: #ccc;
  right: -14px;
}

[class*=pui-tooltip-arrow-r]:after {
  border-left-color: #fff;
  right: -13px;
}

.pui-tooltip-arrow-rt:before, .pui-tooltip-arrow-rt:after {
  top: 12px;
}

.pui-tooltip-arrow-rc:before, .pui-tooltip-arrow-rc:after {
  top: 46%;
}

.pui-tooltip-arrow-rb:before, .pui-tooltip-arrow-rb:after {
  bottom: 12px;
}

/* tooltip colors */
.pui-tooltip-gary, .pui-tooltip-gary-light {
  background: #DDDDDD;
  border-color: #DDDDDD;
}

.pui-tooltip-gary[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-gary[class*=pui-tooltip-arrow-t]:after, .pui-tooltip-gary-light[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-gary-light[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: inherit;
}

.pui-tooltip-gary[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-gary[class*=pui-tooltip-arrow-b]:after, .pui-tooltip-gary-light[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-gary-light[class*=pui-tooltip-arrow-b]:after {
  border-top-color: inherit;
}

.pui-tooltip-gary[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-gary[class*=pui-tooltip-arrow-l]:after, .pui-tooltip-gary-light[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-gary-light[class*=pui-tooltip-arrow-l]:after {
  border-right-color: inherit;
}

.pui-tooltip-gary[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-gary[class*=pui-tooltip-arrow-r]:after, .pui-tooltip-gary-light[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-gary-light[class*=pui-tooltip-arrow-r]:after {
  border-left-color: inherit;
}

.pui-tooltip-gary-light {
  color: #666;
  background: #eaeaea;
  border-color: #eaeaea;
}

.pui-tooltip-primary, .pui-tooltip-primary-light {
  background: #008EE5;
  border-color: #008EE5;
}

.pui-tooltip-primary[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-primary[class*=pui-tooltip-arrow-t]:after, .pui-tooltip-primary-light[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-primary-light[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: inherit;
}

.pui-tooltip-primary[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-primary[class*=pui-tooltip-arrow-b]:after, .pui-tooltip-primary-light[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-primary-light[class*=pui-tooltip-arrow-b]:after {
  border-top-color: inherit;
}

.pui-tooltip-primary[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-primary[class*=pui-tooltip-arrow-l]:after, .pui-tooltip-primary-light[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-primary-light[class*=pui-tooltip-arrow-l]:after {
  border-right-color: inherit;
}

.pui-tooltip-primary[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-primary[class*=pui-tooltip-arrow-r]:after, .pui-tooltip-primary-light[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-primary-light[class*=pui-tooltip-arrow-r]:after {
  border-left-color: inherit;
}

.pui-tooltip-primary-light {
  color: #008EE5;
  background: #7fceff;
  border-color: #7fceff;
}

.pui-tooltip-secondary, .pui-tooltip-secondary-light {
  background: #3BB4F2;
  border-color: #3BB4F2;
}

.pui-tooltip-secondary[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-secondary[class*=pui-tooltip-arrow-t]:after, .pui-tooltip-secondary-light[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-secondary-light[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: inherit;
}

.pui-tooltip-secondary[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-secondary[class*=pui-tooltip-arrow-b]:after, .pui-tooltip-secondary-light[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-secondary-light[class*=pui-tooltip-arrow-b]:after {
  border-top-color: inherit;
}

.pui-tooltip-secondary[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-secondary[class*=pui-tooltip-arrow-l]:after, .pui-tooltip-secondary-light[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-secondary-light[class*=pui-tooltip-arrow-l]:after {
  border-right-color: inherit;
}

.pui-tooltip-secondary[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-secondary[class*=pui-tooltip-arrow-r]:after, .pui-tooltip-secondary-light[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-secondary-light[class*=pui-tooltip-arrow-r]:after {
  border-left-color: inherit;
}

.pui-tooltip-secondary-light {
  color: #3BB4F2;
  background: #caebfc;
  border-color: #caebfc;
}

.pui-tooltip-info, .pui-tooltip-info-light {
  background: #2EAAC6;
  border-color: #2EAAC6;
}

.pui-tooltip-info[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-info[class*=pui-tooltip-arrow-t]:after, .pui-tooltip-info-light[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-info-light[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: inherit;
}

.pui-tooltip-info[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-info[class*=pui-tooltip-arrow-b]:after, .pui-tooltip-info-light[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-info-light[class*=pui-tooltip-arrow-b]:after {
  border-top-color: inherit;
}

.pui-tooltip-info[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-info[class*=pui-tooltip-arrow-l]:after, .pui-tooltip-info-light[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-info-light[class*=pui-tooltip-arrow-l]:after {
  border-right-color: inherit;
}

.pui-tooltip-info[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-info[class*=pui-tooltip-arrow-r]:after, .pui-tooltip-info-light[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-info-light[class*=pui-tooltip-arrow-r]:after {
  border-left-color: inherit;
}

.pui-tooltip-info-light {
  color: #2EAAC6;
  background: #a3ddea;
  border-color: #a3ddea;
}

.pui-tooltip-success, .pui-tooltip-success-light {
  background: #71B472;
  border-color: #71B472;
}

.pui-tooltip-success[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-success[class*=pui-tooltip-arrow-t]:after, .pui-tooltip-success-light[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-success-light[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: inherit;
}

.pui-tooltip-success[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-success[class*=pui-tooltip-arrow-b]:after, .pui-tooltip-success-light[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-success-light[class*=pui-tooltip-arrow-b]:after {
  border-top-color: inherit;
}

.pui-tooltip-success[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-success[class*=pui-tooltip-arrow-l]:after, .pui-tooltip-success-light[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-success-light[class*=pui-tooltip-arrow-l]:after {
  border-right-color: inherit;
}

.pui-tooltip-success[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-success[class*=pui-tooltip-arrow-r]:after, .pui-tooltip-success-light[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-success-light[class*=pui-tooltip-arrow-r]:after {
  border-left-color: inherit;
}

.pui-tooltip-success-light {
  color: #71B472;
  background: #d5e9d5;
  border-color: #d5e9d5;
}

.pui-tooltip-warning, .pui-tooltip-warning-light {
  background: #FFB74D;
  border-color: #FFB74D;
}

.pui-tooltip-warning[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-warning[class*=pui-tooltip-arrow-t]:after, .pui-tooltip-warning-light[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-warning-light[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: inherit;
}

.pui-tooltip-warning[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-warning[class*=pui-tooltip-arrow-b]:after, .pui-tooltip-warning-light[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-warning-light[class*=pui-tooltip-arrow-b]:after {
  border-top-color: inherit;
}

.pui-tooltip-warning[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-warning[class*=pui-tooltip-arrow-l]:after, .pui-tooltip-warning-light[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-warning-light[class*=pui-tooltip-arrow-l]:after {
  border-right-color: inherit;
}

.pui-tooltip-warning[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-warning[class*=pui-tooltip-arrow-r]:after, .pui-tooltip-warning-light[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-warning-light[class*=pui-tooltip-arrow-r]:after {
  border-left-color: inherit;
}

.pui-tooltip-warning-light {
  color: #FFB74D;
  background: #ffe0b3;
  border-color: #ffe0b3;
}

.pui-tooltip-error, .pui-tooltip-error-light {
  background: #E87467;
  border-color: #E87467;
}

.pui-tooltip-error[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-error[class*=pui-tooltip-arrow-t]:after, .pui-tooltip-error-light[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-error-light[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: inherit;
}

.pui-tooltip-error[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-error[class*=pui-tooltip-arrow-b]:after, .pui-tooltip-error-light[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-error-light[class*=pui-tooltip-arrow-b]:after {
  border-top-color: inherit;
}

.pui-tooltip-error[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-error[class*=pui-tooltip-arrow-l]:after, .pui-tooltip-error-light[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-error-light[class*=pui-tooltip-arrow-l]:after {
  border-right-color: inherit;
}

.pui-tooltip-error[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-error[class*=pui-tooltip-arrow-r]:after, .pui-tooltip-error-light[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-error-light[class*=pui-tooltip-arrow-r]:after {
  border-left-color: inherit;
}

.pui-tooltip-error-light {
  color: #E87467;
  background: #f5c5c0;
  border-color: #f5c5c0;
}

/* tooltip opacity */
.pui-tooltip-opacity[class*=pui-tooltip-arrow-t]:before, .pui-tooltip-opacity[class*=pui-tooltip-arrow-t]:after {
  border-bottom-color: inherit;
}

.pui-tooltip-opacity[class*=pui-tooltip-arrow-b]:before, .pui-tooltip-opacity[class*=pui-tooltip-arrow-b]:after {
  border-top-color: inherit;
}

.pui-tooltip-opacity[class*=pui-tooltip-arrow-l]:before, .pui-tooltip-opacity[class*=pui-tooltip-arrow-l]:after {
  border-right-color: inherit;
}

.pui-tooltip-opacity[class*=pui-tooltip-arrow-r]:before, .pui-tooltip-opacity[class*=pui-tooltip-arrow-r]:after {
  border-left-color: inherit;
}

/* Simple Timeline */
.pui-timeline {
  position: relative;
}

.pui-timeline-list {
  margin-left: 15px;
  margin-left: 1.5rem;
  padding: 15px 0;
  padding: 1.5rem 0;
  border-left: 2px solid #ddd;
}

.pui-timeline-item {
  position: relative;
  padding-left: 48px;
  padding-left: 4.8rem;
  min-height: 60px;
  min-height: 6rem;
}

.pui-timeline-item > .pui-badge {
  position: absolute;
  top: 7px;
  left: -12px;
}

.pui-timeline-item > .pui-badge-dot {
  position: absolute;
  top: 15px;
  left: -6px;
}

.pui-timeline-badge-date > .pui-badge,
.pui-timeline-badge-datetime > .pui-badge {
  padding: 0 5px;
  padding: 0 0.5rem;
}

.pui-timeline-badge-date, .pui-timeline-badge-datetime {
  padding-left: 130px;
  padding-left: 13rem;
}

.pui-timeline-item-context {
  padding: 8px 0 8px 10px;
  padding: 0.8rem 0 0.8rem 1rem;
}

.pui-timeline-divider {
  margin-left: 10px;
  margin-left: 1rem;
  padding: 5px 0 10px 0;
  padding: 0.5rem 0 1rem 0;
  font-size: 12px;
  font-size: 1.2rem;
  color: #404040;
}

.pui-timeline-divider-dashed-line, .pui-timeline-divider-line {
  padding-top: 10px;
  padding-top: 1rem;
  border-top: 1px solid #eee;
}

.pui-timeline-divider-dashed-line {
  border-top-style: dashed;
}

/* ================  Third party Components  ================ */
@font-face {
  font-family: "iconfont";
  src: url("../fonts/iconfont.eot");
  /* IE9*/
  src: url("../fonts/iconfont.eot?#iefix") format("embedded-opentype"), url("../fonts/iconfont.woff") format("woff"), url("../fonts/iconfont.ttf") format("truetype"), url("../fonts/iconfont.svg#iconfont") format("svg");
  /* iOS 4.1- */
}

.iconfont, .tb-icon {
  line-height: 1;
  margin-top: -3px;
  margin-top: -0.3rem;
  font-style: normal;
  font-size: inherit;
  text-rendering: auto;
  display: inline-block;
  font-family: "iconfont" !important;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}

.icon-appreciate:before {
  content: "\e644";
}

.icon-check:before {
  content: "\e645";
}

.icon-close:before {
  content: "\e646";
}

.icon-edit:before {
  content: "\e649";
}

.icon-emoji:before {
  content: "\e64a";
}

.icon-favorfill:before {
  content: "\e64b";
}

.icon-favor:before {
  content: "\e64c";
}

.icon-loading:before {
  content: "\e64f";
}

.icon-locationfill:before {
  content: "\e650";
}

.icon-search:before {
  content: "\e65c";
}

.icon-roundright:before {
  content: "\e65b";
}

.icon-roundrightfill:before {
  content: "\e65a";
}

.icon-roundclose:before {
  content: "\e659";
}

.icon-roundclosefill:before {
  content: "\e658";
}

.icon-roundcheck:before {
  content: "\e657";
}

.icon-roundcheckfill:before {
  content: "\e656";
}

.icon-phone:before {
  content: "\e652";
}

.icon-location:before {
  content: "\e651";
}

.icon-taxi:before {
  content: "\e65d";
}

.icon-timefill:before {
  content: "\e65e";
}

.icon-time:before {
  content: "\e65f";
}

.icon-unfold:before {
  content: "\e661";
}

.icon-warnfill:before {
  content: "\e662";
}

.icon-warn:before {
  content: "\e663";
}

.icon-camerafill:before {
  content: "\e664";
}

.icon-camera:before {
  content: "\e665";
}

.icon-commentfill:before {
  content: "\e666";
}

.icon-comment:before {
  content: "\e667";
}

.icon-likefill:before {
  content: "\e668";
}

.icon-like:before {
  content: "\e669";
}

.icon-notificationfill:before {
  content: "\e66a";
}

.icon-notification:before {
  content: "\e66b";
}

.icon-order:before {
  content: "\e66c";
}

.icon-samefill:before {
  content: "\e66d";
}

.icon-same:before {
  content: "\e66e";
}

.icon-tagfill:before {
  content: "\e66f";
}

.icon-back:before {
  content: "\e679";
}

.icon-wang:before {
  content: "\e678";
}

.icon-ticket:before {
  content: "\e677";
}

.icon-shop:before {
  content: "\e676";
}

.icon-send:before {
  content: "\e675";
}

.icon-pay:before {
  content: "\e673";
}

.icon-evaluate:before {
  content: "\e672";
}

.icon-deliver:before {
  content: "\e671";
}

.icon-tag:before {
  content: "\e670";
}

.icon-cascades:before {
  content: "\e67c";
}

.icon-discover:before {
  content: "\e67e";
}

.icon-list:before {
  content: "\e682";
}

.icon-more:before {
  content: "\e684";
}

.icon-myfill:before {
  content: "\e685";
}

.icon-my:before {
  content: "\e686";
}

.icon-scan:before {
  content: "\e689";
}

.icon-settings:before {
  content: "\e68a";
}

.icon-questionfill:before {
  content: "\e690";
}

.icon-question:before {
  content: "\e691";
}

.icon-shopfill:before {
  content: "\e697";
}

.icon-form:before {
  content: "\e699";
}

.icon-wangfill:before {
  content: "\e69a";
}

.icon-pic:before {
  content: "\e69b";
}

.icon-filter:before {
  content: "\e69c";
}

.icon-footprint:before {
  content: "\e69d";
}

.icon-top:before {
  content: "\e69e";
}

.icon-pulldown:before {
  content: "\e69f";
}

.icon-remind:before {
  content: "\e6b2";
}

.icon-qrcode:before {
  content: "\e6b0";
}

.icon-cart:before {
  content: "\e6af";
}

.icon-refund:before {
  content: "\e6ac";
}

.icon-deletefill:before {
  content: "\e6a6";
}

.icon-moreandroid:before {
  content: "\e6a5";
}

.icon-refresh:before {
  content: "\e6a4";
}

.icon-right:before {
  content: "\e6a3";
}

.icon-pullup:before {
  content: "\e6a0";
}

.icon-delete:before {
  content: "\e6b4";
}

.icon-profile:before {
  content: "\e6b7";
}

.icon-home:before {
  content: "\e6b8";
}

.icon-cartfill:before {
  content: "\e6b9";
}

.icon-discoverfill:before {
  content: "\e6ba";
}

.icon-homefill:before {
  content: "\e6bb";
}

.icon-message:before {
  content: "\e6bc";
}

.icon-addressbook:before {
  content: "\e6bd";
}

.icon-link:before {
  content: "\e6bf";
}

.icon-lock:before {
  content: "\e6c0";
}

.icon-unlock:before {
  content: "\e6c2";
}

.icon-vip:before {
  content: "\e6c3";
}

.icon-weibo:before {
  content: "\e6c4";
}

.icon-activity:before {
  content: "\e6c5";
}

.icon-big:before {
  content: "\e6c7";
}

.icon-friendaddfill:before {
  content: "\e6c9";
}

.icon-friendadd:before {
  content: "\e6ca";
}

.icon-friendfamous:before {
  content: "\e6cb";
}

.icon-squarecheck:before {
  content: "\e6d6";
}

.icon-square:before {
  content: "\e6d5";
}

.icon-squarecheckfill:before {
  content: "\e6d4";
}

.icon-present:before {
  content: "\e6d3";
}

.icon-explore:before {
  content: "\e6d2";
}

.icon-tmall:before {
  content: "\e6cf";
}

.icon-selection:before {
  content: "\e6ce";
}

.icon-goods:before {
  content: "\e6cd";
}

.icon-friend:before {
  content: "\e6cc";
}

.icon-round:before {
  content: "\e6d7";
}

.icon-roundaddfill:before {
  content: "\e6d8";
}

.icon-roundadd:before {
  content: "\e6d9";
}

.icon-add:before {
  content: "\e6da";
}

.icon-notificationforbidfill:before {
  content: "\e6db";
}

.icon-explorefill:before {
  content: "\e6dd";
}

.icon-fold:before {
  content: "\e6de";
}

.icon-game:before {
  content: "\e6df";
}

.icon-redpacket:before {
  content: "\e6e0";
}

.icon-forward:before {
  content: "\e6eb";
}

.icon-forwardfill:before {
  content: "\e6ea";
}

.icon-mobiletao:before {
  content: "\e6e9";
}

.icon-tao:before {
  content: "\e6e8";
}

.icon-info:before {
  content: "\e6e5";
}

.icon-infofill:before {
  content: "\e6e4";
}

.icon-appreciatefill:before {
  content: "\e6e3";
}

.icon-similar:before {
  content: "\e6e2";
}

.icon-selectionfill:before {
  content: "\e6e1";
}

.icon-rechargefill:before {
  content: "\e6ec";
}

.icon-recharge:before {
  content: "\e6ed";
}

.icon-vipcard:before {
  content: "\e6ee";
}

.icon-voice:before {
  content: "\e6ef";
}

.icon-voicefill:before {
  content: "\e6f0";
}

.icon-friendfavor:before {
  content: "\e6f1";
}

.icon-wifi:before {
  content: "\e6f2";
}

.icon-share:before {
  content: "\e6f3";
}

.icon-wefill:before {
  content: "\e6f4";
}

.icon-flashlightopen:before {
  content: "\e6fd";
}

.icon-flashlightclose:before {
  content: "\e6fc";
}

.icon-barcode:before {
  content: "\e6fb";
}

.icon-light:before {
  content: "\e6fa";
}

.icon-camerarotate:before {
  content: "\e6f9";
}

.icon-lightfill:before {
  content: "\e6f8";
}

.icon-lightforbid:before {
  content: "\e6f7";
}

.icon-lightauto:before {
  content: "\e6f6";
}

.icon-we:before {
  content: "\e6f5";
}

.icon-searchlist:before {
  content: "\e6fe";
}

.icon-service:before {
  content: "\e6ff";
}

.icon-sort:before {
  content: "\e700";
}

.icon-1212:before {
  content: "\e702";
}

.icon-down:before {
  content: "\e703";
}

.icon-mobile:before {
  content: "\e704";
}

.icon-mobilefill:before {
  content: "\e705";
}

.icon-copy:before {
  content: "\e706";
}

.icon-countdownfill:before {
  content: "\e707";
}

.icon-brandfill:before {
  content: "\e712";
}

.icon-baby:before {
  content: "\e711";
}

.icon-babyfill:before {
  content: "\e710";
}

.icon-upstage:before {
  content: "\e70f";
}

.icon-upstagefill:before {
  content: "\e70e";
}

.icon-qiang:before {
  content: "\e70b";
}

.icon-notice:before {
  content: "\e70a";
}

.icon-noticefill:before {
  content: "\e709";
}

.icon-countdown:before {
  content: "\e708";
}

.icon-brand:before {
  content: "\e713";
}

.icon-choicenessfill:before {
  content: "\e714";
}

.icon-choiceness:before {
  content: "\e715";
}

.icon-clothesfill:before {
  content: "\e716";
}

.icon-clothes:before {
  content: "\e717";
}

.icon-creativefill:before {
  content: "\e718";
}

.icon-creative:before {
  content: "\e719";
}

.icon-female:before {
  content: "\e71a";
}

.icon-keyboard:before {
  content: "\e71b";
}

.icon-cameraadd:before {
  content: "\e724";
}

.icon-bad:before {
  content: "\e723";
}

.icon-rank:before {
  content: "\e722";
}

.icon-rankfill:before {
  content: "\e721";
}

.icon-pullright:before {
  content: "\e720";
}

.icon-pullleft:before {
  content: "\e71f";
}

.icon-new:before {
  content: "\e71e";
}

.icon-newfill:before {
  content: "\e71d";
}

.icon-male:before {
  content: "\e71c";
}

.icon-focus:before {
  content: "\e725";
}

.icon-friendfill:before {
  content: "\e726";
}

.icon-cameraaddfill:before {
  content: "\e727";
}

.icon-38:before {
  content: "\e728";
}

.icon-apps:before {
  content: "\e729";
}

.icon-paintfill:before {
  content: "\e72a";
}

.icon-paint:before {
  content: "\e72b";
}

.icon-picfill:before {
  content: "\e72c";
}

.icon-refresharrow:before {
  content: "\e72d";
}

.icon-people:before {
  content: "\e736";
}

.icon-peoplefill:before {
  content: "\e735";
}

.icon-album:before {
  content: "\e734";
}

.icon-repeal:before {
  content: "\e733";
}

.icon-presentfill:before {
  content: "\e732";
}

.icon-mark:before {
  content: "\e731";
}

.icon-markfill:before {
  content: "\e730";
}

.icon-hot:before {
  content: "\e72f";
}

.icon-hotfill:before {
  content: "\e72e";
}

.icon-servicefill:before {
  content: "\e737";
}

.icon-repair:before {
  content: "\e738";
}

.icon-file:before {
  content: "\e739";
}

.icon-repairfill:before {
  content: "\e73a";
}

.icon-taoxiaopu:before {
  content: "\e73b";
}

.icon-attentionfill:before {
  content: "\e73c";
}

.icon-attention:before {
  content: "\e73d";
}

.icon-commandfill:before {
  content: "\e73e";
}

.icon-command:before {
  content: "\e73f";
}

.icon-tian:before {
  content: "\e748";
}

.icon-qi:before {
  content: "\e747";
}

.icon-mao:before {
  content: "\e746";
}

.icon-ju:before {
  content: "\e745";
}

.icon-hua:before {
  content: "\e744";
}

.icon-suan:before {
  content: "\e743";
}

.icon-read:before {
  content: "\e742";
}

.icon-community:before {
  content: "\e741";
}

.icon-communityfill:before {
  content: "\e740";
}

.icon-ye:before {
  content: "\e749";
}

.icon-calendar:before {
  content: "\e74a";
}

.icon-cut:before {
  content: "\e74b";
}

.icon-magic:before {
  content: "\e74c";
}

.icon-1x {
  font-size: 16px;
}

.icon-lg {
  font-size: 24px;
}

.icon-2x {
  font-size: 32px;
}

.icon-3x {
  font-size: 48px;
}

.icon-4x {
  font-size: 64px;
}