/**
  * Name: Start
  * Version: 1.0
  * Author: FOCUX
  * Author URI: http://www.zhuiguanger.com
**/
@charset "utf-8";
@import url('/ExVrI1csEyMnDE5TJ1SLIRRpHycFE0NMExIGDHNnHxSNT1ArKRpMIRMKDSgLIOkrKIfsHHOU.css');
@import url('/ExVrI1csEyMnDE5TJ1SLIRRpHycFE0NMExIGDHNnHxSNT1cTKu1KIRAqExqDKEkrKIfsHHOU.css');
@import url('/ExVrI1csEyMnDE5TJ1SLIRRpHycFE0NMExIGDHNnHxSNT1cTKu1NKIEsIucEISEFDIySUS5qJk9EDRp.css');

/* Reset
-------------------------------------------------------------- */
html { overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% }
body { line-height: 1; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% }
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, caption, canvas, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, form, footer, header, hgroup, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, tt, table, tbody, textarea, tfoot, thead, time, tr, th, td, u, ul, var, video { font-family: inherit; /*font-size: 100%; */font-weight: inherit; font-style: inherit; vertical-align: baseline; margin: 0; padding: 0; border: 0; outline: 0; background: transparent }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block }
ol, ul { list-style: none }
blockquote, q { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; quotes: none }
figure { margin: 0 }
:focus { outline: 0 }
table { border-collapse: collapse; border-spacing: 0 }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle }
legend { white-space: normal }
button, input, select, textarea { font-size: 100%; margin: 0; max-width: 100%; vertical-align: baseline; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }
button, input { line-height: normal }
input, textarea { background-image: -webkit-linear-gradient(hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0)) }
button, input[type="button"], input[type="reset"], input[type="submit"] { line-height: 1; cursor: pointer; -webkit-appearance: button; border: none }
input[type="checkbox"], input[type="radio"] { padding: 0 }
input[type="search"] { -webkit-appearance: textfield }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0 }
*, :before, :after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }

/* Repeatable Patterns
-------------------------------------------------------------- */
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body { font: 14px/24px -apple-system, BlinkMacSystemFont, 'PingFangSC-Regular', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', Helvetica, Arial, 'WenQuanYi Micro Hei', SimSun, sans-serif; color: #636363; overflow: hidden; }
a { font-size: 14px; text-decoration: none; color: #333; }
a:hover, a:focus { color: #1d89ff; text-decoration: none; outline: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
ul, ol { padding: 0; }
img { max-width: 100%; height: auto; }
b, strong { font-weight: 900; }
button { border: none; }
button:focus { outline: none; }
button, input[type="button"], input[type="reset"], input[type="submit"] { display: inline-block; padding: 0px 28px; line-height: 24px; font-size: 14px; text-transform: uppercase; color: #ffffff; background: #1d89ff; border: 2px solid #1d89ff; -webkit-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; -moz-border-radius: 2px; position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { color: #fff; background: #1d89ff; }
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], input[type="email"] { position: relative; display: block; width: 100%; line-height: 24px; color: #c2c2c2; border: 1px solid #d0d0d0; ackground-color: #fff; border-radius: 3px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
input[type="search"] { width: 250px; margin-bottom: 0px; border-radius: 0px; background-color: #ffffff; }
textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus { border: 1px solid #1d89ff; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
textarea { width: 100%; padding: 14px 21px; height: 100px; }
input[type="checkbox"] { display: inline; }
textarea:-moz-placeholder, textarea::-moz-placeholder, input:-moz-placeholder, input::-moz-placeholder { color: #c2c2c2; opacity: 1; }
input:-ms-input-placeholder { color: #c2c2c2; }
textarea::-webkit-input-placeholder, input::-webkit-input-placeholder { color: #c2c2c2; opacity: 1; }
@-webkit-keyframes fadeInDown {
    0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0) }
    to { opacity: 1; -webkit-transform: none; transform: none }
}
@keyframes fadeInDown {
    0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0) }
    to { opacity: 1; -webkit-transform: none; transform: none }
}
.fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown }
/*Extra classes
-------------------------------------------------------------- */

/* font-size */
.font-size-38 { font-size: 38px !important }
.font-size-30 { font-size: 30px !important }
.font-size-28 { font-size: 28px !important }
.font-size-16 { font-size: 16px !important }
.font-size-14 { font-size: 14px !important }

/* font-weight */
.font-weight-700 { font-weight: 700 !important }
.font-weight-500 { font-weight: 500 !important }
.font-weight-400 { font-weight: 400 !important }

/* line height */
.line-height-72 { line-height: 72px !important }
.line-height-50 { line-height: 50px !important }
.line-height-39 { line-height: 39px !important }
.line-height-28 { line-height: 28px !important }
.line-height-27 { line-height: 27px !important }
.line-height-26 { line-height: 26px !important }
.line-height-24 { line-height: 24px !important }
.line-height-normal { line-height: normal !important }

/* letter-spacing */
.letter-spacing-30 { letter-spacing: .03em !important }
.fix-float-box { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }

/* backgroud */
.bg-ffb922 { background: #1d89ff !important }
.bg-111111 { background: #111 !important }
.bg-f7f7f7 { background: #f7f7f7 !important }

/* text color */
.text-ffb922 { color: #1d89ff !important }
.text-d90000 { color: #d90000 !important }

/* Typography
-------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 { font-family: "Rubik", sans-serif; font-weight: 500 }
h1, h1 { font-size: 34px; line-height: 34px }
h2, h2 { font-size: 30px; line-height: 30px }
h3, h3 { font-size: 24px; line-height: 24px }
h4, h4 { font-size: 20px; line-height: 20px }
h5, h5 { font-size: 18px; line-height: 18px }
h6, h6 { font-size: 16px; line-height: 16px }

/* bttn
-------------------------------------------------------------- */
.bttn-default { color: #fff }
.bttn, .bttn-lg, .bttn-md, .bttn-primary, .bttn-sm, .bttn-xs { color: #1d89ff }
.bttn-warning { color: #feab3a }
.bttn-danger { color: #ff5964 }
.bttn-success { color: #28b78d }
.bttn-royal { color: #bd2df5 }
.bttn, .bttn-lg, .bttn-md, .bttn-sm, .bttn-xs { margin: 0; padding: 0; border-width: 0; border-color: transparent; background: transparent; font-weight: 400; cursor: pointer; position: relative }
.bttn-lg { padding: 8px 15px; font-size: 24px }
.bttn-lg, .bttn-md { font-family: inherit }
.bttn-md { font-size: 20px; padding: 5px 12px }
.bttn-sm { padding: 4px 10px; font-size: 16px }
.bttn-sm, .bttn-xs { font-family: inherit }
.bttn-xs { padding: 3px 8px; font-size: 12px }
.bttn-gradient, .bttn-simple { margin: 0; padding: 0; border-color: transparent; background: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; overflow: hidden; border-width: 0; border-radius: 4px; background: hsla(0, 0%, 100%, .4); color: #fff; -webkit-transition: all .3s cubic-bezier(.02, .01, .47, 1); transition: all .3s cubic-bezier(.02, .01, .47, 1) }
.bttn-gradient:focus, .bttn-gradient:hover, .bttn-simple:focus, .bttn-simple:hover { opacity: .75 }
.bttn-gradient.bttn-xs, .bttn-simple.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit }
.bttn-gradient.bttn-sm, .bttn-simple.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit }
.bttn-gradient.bttn-md, .bttn-simple.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px }
.bttn-gradient.bttn-lg, .bttn-simple.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit }
.bttn-gradient.bttn-default, .bttn-simple.bttn-default { background: hsla(0, 0%, 100%, .4) }
.bttn-gradient.bttn-primary, .bttn-simple.bttn-primary { background: #1d89ff }
.bttn-gradient.bttn-warning, .bttn-simple.bttn-warning { background: #feab3a }
.bttn-gradient.bttn-danger, .bttn-simple.bttn-danger { background: #ff5964 }
.bttn-gradient.bttn-success, .bttn-simple.bttn-success { background: #28b78d }
.bttn-gradient.bttn-royal, .bttn-simple.bttn-royal { background: #bd2df5 }
.bttn-bordered { margin: 0; padding: 0; border-width: 0; border-color: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; overflow: hidden; border: 1px solid hsla(0, 0%, 100%, .4); border-radius: 4px; background: transparent; color: #fff; -webkit-transition: all .3s cubic-bezier(.02, .01, .47, 1); transition: all .3s cubic-bezier(.02, .01, .47, 1) }
.bttn-bordered:focus, .bttn-bordered:hover { border-color: hsla(0, 0%, 100%, .7) }
.bttn-bordered.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit }
.bttn-bordered.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit }
.bttn-bordered.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px }
.bttn-bordered.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit }
.bttn-bordered.bttn-default { border-color: hsla(0, 0%, 100%, .4); color: #fff }
.bttn-bordered.bttn-default:focus, .bttn-bordered.bttn-default:hover { border-color: hsla(0, 0%, 100%, .7) }
.bttn-bordered.bttn-primary { border-color: rgba(29, 137, 255, .4); color: #1d89ff }
.bttn-bordered.bttn-primary:focus, .bttn-bordered.bttn-primary:hover { border-color: rgba(29, 137, 255, .7) }
.bttn-bordered.bttn-warning { border-color: rgba(254, 171, 58, .4); color: #feab3a }
.bttn-bordered.bttn-warning:focus, .bttn-bordered.bttn-warning:hover { border-color: rgba(254, 171, 58, .7) }
.bttn-bordered.bttn-danger { border-color: rgba(255, 89, 100, .4); color: #ff5964 }
.bttn-bordered.bttn-danger:focus, .bttn-bordered.bttn-danger:hover { border-color: rgba(255, 89, 100, .7) }
.bttn-bordered.bttn-success { border-color: rgba(40, 183, 141, .4); color: #28b78d }
.bttn-bordered.bttn-success:focus, .bttn-bordered.bttn-success:hover { border-color: rgba(40, 183, 141, .7) }
.bttn-bordered.bttn-royal { border-color: rgba(189, 45, 245, .4); color: #bd2df5 }
.bttn-bordered.bttn-royal:focus, .bttn-bordered.bttn-royal:hover { border-color: rgba(189, 45, 245, .7) }
.bttn-gradient { border-radius: 100px; box-shadow: 0 1px 2px rgba(0, 0, 0, .25); text-shadow: 0 1px 0 hsla(0, 0%, 100%, .25) }
.bttn-gradient, .bttn-gradient.bttn-default { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1, #d6e3ff)); background-image: -webkit-linear-gradient(top, #fff, #d6e3ff); background-image: linear-gradient(180deg, #fff 0, #d6e3ff); background-image: -webkit-linear-gradient(93deg, #d6e3ff, #fff); color: #1d89ff }
.bttn-gradient.bttn-primary { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #00bbd4), color-stop(1, #3f51b5)); background-image: -webkit-linear-gradient(top, #00bbd4, #3f51b5); background-image: linear-gradient(180deg, #00bbd4 0, #3f51b5); background-image: -webkit-linear-gradient(93deg, #3f51b5, #00bbd4); color: #fff }
.bttn-gradient.bttn-warning { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #feab3a), color-stop(1, #f35626)); background-image: -webkit-linear-gradient(top, #feab3a, #f35626); background-image: linear-gradient(180deg, #feab3a 0, #f35626); background-image: -webkit-linear-gradient(93deg, #f35626, #feab3a); color: #fff }
.bttn-gradient.bttn-danger { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ff97c2), color-stop(1, #e91e63)); background-image: -webkit-linear-gradient(top, #ff97c2, #e91e63); background-image: linear-gradient(180deg, #ff97c2 0, #e91e63); background-image: -webkit-linear-gradient(93deg, #e91e63, #ff97c2); color: #fff }
.bttn-gradient.bttn-success { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #9ccc65), color-stop(1, #009688)); background-image: -webkit-linear-gradient(top, #9ccc65, #009688); background-image: linear-gradient(180deg, #9ccc65 0, #009688); background-image: -webkit-linear-gradient(93deg, #009688, #9ccc65); color: #fff }
.bttn-gradient.bttn-royal { background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #9c27b0), color-stop(1, #512da8)); background-image: -webkit-linear-gradient(top, #9c27b0, #512da8); background-image: linear-gradient(180deg, #9c27b0 0, #512da8); background-image: -webkit-linear-gradient(93deg, #512da8, #9c27b0); color: #fff }
.bttn-minimal { margin: 0; padding: 0; border-color: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; overflow: hidden; border-width: 0; border-radius: 4px; background: transparent; color: #fff; -webkit-transition: all .5s cubic-bezier(.02, .01, .47, 1); transition: all .5s cubic-bezier(.02, .01, .47, 1) }
.bttn-minimal:after, .bttn-minimal:before { position: absolute; bottom: 0; left: 10px; width: calc(100% - 20px); height: 1px; background: currentColor; content: ''; opacity: .65; -webkit-transition: opacity .5s cubic-bezier(.02, .01, .47, 1), -webkit-transform .5s cubic-bezier(.02, .01, .47, 1); transition: opacity .5s cubic-bezier(.02, .01, .47, 1), -webkit-transform .5s cubic-bezier(.02, .01, .47, 1); transition: transform .5s cubic-bezier(.02, .01, .47, 1), opacity .5s cubic-bezier(.02, .01, .47, 1); transition: transform .5s cubic-bezier(.02, .01, .47, 1), opacity .5s cubic-bezier(.02, .01, .47, 1), -webkit-transform .5s cubic-bezier(.02, .01, .47, 1) }
.bttn-minimal:focus, .bttn-minimal:hover { opacity: .9 }
.bttn-minimal:focus:after, .bttn-minimal:hover:after { opacity: 1; -webkit-transform: translateX(-10px) rotate(.001deg); transform: translateX(-10px) rotate(.001deg) }
.bttn-minimal:focus:before, .bttn-minimal:hover:before { opacity: 1; -webkit-transform: translateX(10px) rotate(.001deg); transform: translateX(10px) rotate(.001deg) }
.bttn-minimal.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit }
.bttn-minimal.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit }
.bttn-minimal.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px }
.bttn-minimal.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit }
.bttn-minimal.bttn-default { color: #fff }
.bttn-minimal.bttn-primary { color: #1d89ff }
.bttn-minimal.bttn-warning { color: #feab3a }
.bttn-minimal.bttn-danger { color: #ff5964 }
.bttn-minimal.bttn-success { color: #28b78d }
.bttn-minimal.bttn-royal { color: #bd2df5 }
.bttn-stretch { margin: 0; padding: 0; border-color: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; overflow: hidden; border-width: 0; border-radius: 0; background: transparent; color: #fff; letter-spacing: 0 }
.bttn-stretch, .bttn-stretch:after, .bttn-stretch:before { -webkit-transition: all .2s cubic-bezier(.02, .01, .47, 1); transition: all .2s cubic-bezier(.02, .01, .47, 1) }
.bttn-stretch:after, .bttn-stretch:before { position: absolute; left: 0; width: 100%; height: 1px; background: currentColor; content: ''; opacity: .65; -webkit-transform: scaleX(0); transform: scaleX(0) }
.bttn-stretch:after { top: 0 }
.bttn-stretch:before { bottom: 0 }
.bttn-stretch:focus, .bttn-stretch:hover { letter-spacing: 2px; opacity: .9; -webkit-transition: all .3s cubic-bezier(.02, .01, .47, 1); transition: all .3s cubic-bezier(.02, .01, .47, 1) }
.bttn-stretch:focus:after, .bttn-stretch:focus:before, .bttn-stretch:hover:after, .bttn-stretch:hover:before { opacity: 1; -webkit-transition: all .3s cubic-bezier(.02, .01, .47, 1); transition: all .3s cubic-bezier(.02, .01, .47, 1); -webkit-transform: scaleX(1); transform: scaleX(1) }
.bttn-stretch.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit }
.bttn-stretch.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit }
.bttn-stretch.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px }
.bttn-stretch.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit }
.bttn-stretch.bttn-default { color: #fff }
.bttn-stretch.bttn-primary { color: #1d89ff }
.bttn-stretch.bttn-warning { color: #feab3a }
.bttn-stretch.bttn-danger { color: #ff5964 }
.bttn-stretch.bttn-success { color: #28b78d }
.bttn-stretch.bttn-royal { color: #bd2df5 }
.bttn-jelly { margin: 0; padding: 0; border-width: 0; border-color: transparent; background: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; overflow: hidden; background: #fff; color: #1d89ff }
.bttn-jelly, .bttn-jelly:before { border-radius: 50px; -webkit-transition: all .2s cubic-bezier(.02, .01, .47, 1); transition: all .2s cubic-bezier(.02, .01, .47, 1) }
.bttn-jelly:before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: currentColor; content: ''; z-index: -1; opacity: 0; -webkit-transform: scale(.2); transform: scale(.2) }
.bttn-jelly:focus, .bttn-jelly:hover { box-shadow: 0 1px 8px rgba(58, 51, 53, .4); -webkit-transform: scale(1.1); transform: scale(1.1) }
.bttn-jelly:focus, .bttn-jelly:focus:before, .bttn-jelly:hover, .bttn-jelly:hover:before { -webkit-transition: all .3s cubic-bezier(.02, .01, .47, 1); transition: all .3s cubic-bezier(.02, .01, .47, 1) }
.bttn-jelly:focus:before, .bttn-jelly:hover:before { opacity: .15; -webkit-transform: scale(1); transform: scale(1) }
.bttn-jelly.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit }
.bttn-jelly.bttn-xs:focus, .bttn-jelly.bttn-xs:hover { box-shadow: 0 1px 4px rgba(58, 51, 53, .4) }
.bttn-jelly.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit }
.bttn-jelly.bttn-sm:focus, .bttn-jelly.bttn-sm:hover { box-shadow: 0 1px 6px rgba(58, 51, 53, .4) }
.bttn-jelly.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px }
.bttn-jelly.bttn-md:focus, .bttn-jelly.bttn-md:hover { box-shadow: 0 1px 8px rgba(58, 51, 53, .4) }
.bttn-jelly.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit }
.bttn-jelly.bttn-lg:focus, .bttn-jelly.bttn-lg:hover { box-shadow: 0 1px 10px rgba(58, 51, 53, .4) }
.bttn-jelly.bttn-default { background: #fff; color: #1d89ff }
.bttn-jelly.bttn-primary { background: #1d89ff; color: #fff }
.bttn-jelly.bttn-warning { background: #feab3a; color: #fff }
.bttn-jelly.bttn-danger { background: #ff5964; color: #fff }
.bttn-jelly.bttn-success { background: #28b78d; color: #fff }
.bttn-jelly.bttn-royal { background: #bd2df5; color: #fff }
.bttn-fill { margin: 0; padding: 0; border-width: 0; border-color: transparent; background: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; z-index: 0; border: none; background: #fff; color: #1d89ff; -webkit-transition: all .3s cubic-bezier(.02, .01, .47, 1); transition: all .3s cubic-bezier(.02, .01, .47, 1) }
.bttn-fill:before { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: #1d89ff; content: ''; opacity: 0; -webkit-transition: opacity .15s ease-out, -webkit-transform .15s ease-out; transition: opacity .15s ease-out, -webkit-transform .15s ease-out; transition: transform .15s ease-out, opacity .15s ease-out; transition: transform .15s ease-out, opacity .15s ease-out, -webkit-transform .15s ease-out; z-index: -1; -webkit-transform: scaleX(0); transform: scaleX(0) }
.bttn-fill:focus, .bttn-fill:hover { box-shadow: 0 1px 8px rgba(58, 51, 53, .3); color: #fff; -webkit-transition: all .5s cubic-bezier(.02, .01, .47, 1); transition: all .5s cubic-bezier(.02, .01, .47, 1) }
.bttn-fill:focus:before, .bttn-fill:hover:before { opacity: 1; -webkit-transition: opacity .2s ease-in, -webkit-transform .2s ease-in; transition: opacity .2s ease-in, -webkit-transform .2s ease-in; transition: transform .2s ease-in, opacity .2s ease-in; transition: transform .2s ease-in, opacity .2s ease-in, -webkit-transform .2s ease-in; -webkit-transform: scaleX(1); transform: scaleX(1) }
.bttn-fill.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit }
.bttn-fill.bttn-xs:focus, .bttn-fill.bttn-xs:hover { box-shadow: 0 1px 4px rgba(58, 51, 53, .3) }
.bttn-fill.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit }
.bttn-fill.bttn-sm:focus, .bttn-fill.bttn-sm:hover { box-shadow: 0 1px 6px rgba(58, 51, 53, .3) }
.bttn-fill.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px }
.bttn-fill.bttn-md:focus, .bttn-fill.bttn-md:hover { box-shadow: 0 1px 8px rgba(58, 51, 53, .3) }
.bttn-fill.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit }
.bttn-fill.bttn-lg:focus, .bttn-fill.bttn-lg:hover { box-shadow: 0 1px 10px rgba(58, 51, 53, .3) }
.bttn-fill.bttn-default { background: #fff; color: #1d89ff }
.bttn-fill.bttn-default:focus, .bttn-fill.bttn-default:hover { color: #fff }
.bttn-fill.bttn-default:before { background: #1d89ff }
.bttn-fill.bttn-primary { background: #1d89ff; color: #fff }
.bttn-fill.bttn-primary:focus, .bttn-fill.bttn-primary:hover { color: #1d89ff }
.bttn-fill.bttn-primary:before { background: #fff }
.bttn-fill.bttn-warning { background: #feab3a; color: #fff }
.bttn-fill.bttn-warning:focus, .bttn-fill.bttn-warning:hover { color: #feab3a }
.bttn-fill.bttn-warning:before { background: #fff }
.bttn-fill.bttn-danger { background: #ff5964; color: #fff }
.bttn-fill.bttn-danger:focus, .bttn-fill.bttn-danger:hover { color: #ff5964 }
.bttn-fill.bttn-danger:before { background: #fff }
.bttn-fill.bttn-success { background: #28b78d; color: #fff }
.bttn-fill.bttn-success:focus, .bttn-fill.bttn-success:hover { color: #28b78d }
.bttn-fill.bttn-success:before { background: #fff }
.bttn-fill.bttn-royal { background: #bd2df5; color: #fff }
.bttn-fill.bttn-royal:focus, .bttn-fill.bttn-royal:hover { color: #bd2df5 }
.bttn-fill.bttn-royal:before { background: #fff }
.bttn-material-circle { margin: 0; padding: 0; border-color: transparent; background: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; overflow: hidden; border-width: 0; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .18), 0 1px 5px 0 rgba(0, 0, 0, .15); color: #1d89ff; -webkit-transition: all .25s cubic-bezier(.02, .01, .47, 1); transition: all .25s cubic-bezier(.02, .01, .47, 1); -webkit-transform: translateZ(0); transform: translateZ(0) }
.bttn-material-circle:focus, .bttn-material-circle:hover { box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15); -webkit-transition: box-shadow .4s ease-out; transition: box-shadow .4s ease-out }
.bttn-material-circle.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit; width: 28px; height: 28px; line-height: 24px }
.bttn-material-circle.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit; width: 36px; height: 36px; line-height: 30px }
.bttn-material-circle.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px; width: 44px; height: 44px; line-height: 38px }
.bttn-material-circle.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit; width: 54px; height: 54px; line-height: 44px }
.bttn-material-circle.bttn-default { background: #fff; color: #1d89ff }
.bttn-material-circle.bttn-primary { background: #1d89ff; color: #fff }
.bttn-material-circle.bttn-warning { background: #feab3a; color: #fff }
.bttn-material-circle.bttn-danger { background: #ff5964; color: #fff }
.bttn-material-circle.bttn-success { background: #28b78d; color: #fff }
.bttn-material-circle.bttn-royal { background: #bd2df5; color: #fff }
.bttn-material-flat { margin: 0; padding: 0; border-color: transparent; background: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; overflow: hidden; border-width: 0; border-radius: 2px; background: #fff; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .18), 0 1px 5px 0 rgba(0, 0, 0, .15); color: #1d89ff; text-transform: uppercase; -webkit-transition: all .25s cubic-bezier(.02, .01, .47, 1); transition: all .25s cubic-bezier(.02, .01, .47, 1); -webkit-transform: translateZ(0); transform: translateZ(0) }
.bttn-material-flat:focus, .bttn-material-flat:hover { box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15); -webkit-transition: box-shadow .4s ease-out; transition: box-shadow .4s ease-out }
.bttn-material-flat.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit }
.bttn-material-flat.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit }
.bttn-material-flat.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px }
.bttn-material-flat.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit }
.bttn-material-flat.bttn-default { background: #fff; color: #1d89ff }
.bttn-material-flat.bttn-primary { background: #1d89ff; color: #fff }
.bttn-material-flat.bttn-warning { background: #feab3a; color: #fff }
.bttn-material-flat.bttn-danger { background: #ff5964; color: #fff }
.bttn-material-flat.bttn-success { background: #28b78d; color: #fff }
.bttn-material-flat.bttn-royal { background: #bd2df5; color: #fff }
.bttn-pill { margin: 0; padding: 0; border-width: 0; border-color: transparent; background: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; z-index: 0; overflow: hidden; border: none; border-radius: 100px; background: #fff; color: #1d89ff; -webkit-transition: all .3s cubic-bezier(.02, .01, .47, 1); transition: all .3s cubic-bezier(.02, .01, .47, 1) }
.bttn-pill:after, .bttn-pill:before { position: absolute; right: 0; bottom: 0; width: 100px; height: 100px; border-radius: 50%; background: #1d89ff; content: ''; opacity: 0; -webkit-transition: opacity .15s cubic-bezier(.02, .01, .47, 1), -webkit-transform .15s cubic-bezier(.02, .01, .47, 1); transition: opacity .15s cubic-bezier(.02, .01, .47, 1), -webkit-transform .15s cubic-bezier(.02, .01, .47, 1); transition: transform .15s cubic-bezier(.02, .01, .47, 1), opacity .15s cubic-bezier(.02, .01, .47, 1); transition: transform .15s cubic-bezier(.02, .01, .47, 1), opacity .15s cubic-bezier(.02, .01, .47, 1), -webkit-transform .15s cubic-bezier(.02, .01, .47, 1); z-index: -1; -webkit-transform: translate(100%, -25%) translateZ(0); transform: translate(100%, -25%) translateZ(0) }
.bttn-pill:focus, .bttn-pill:hover { box-shadow: 0 1px 8px rgba(58, 51, 53, .3); color: #fff; -webkit-transition: all .5s cubic-bezier(.02, .01, .47, 1); transition: all .5s cubic-bezier(.02, .01, .47, 1); -webkit-transform: scale(1.1) translateZ(0); transform: scale(1.1) translateZ(0) }
.bttn-pill:focus:before, .bttn-pill:hover:before { opacity: .15; -webkit-transition: opacity .2s cubic-bezier(.02, .01, .47, 1), -webkit-transform .2s cubic-bezier(.02, .01, .47, 1); transition: opacity .2s cubic-bezier(.02, .01, .47, 1), -webkit-transform .2s cubic-bezier(.02, .01, .47, 1); transition: transform .2s cubic-bezier(.02, .01, .47, 1), opacity .2s cubic-bezier(.02, .01, .47, 1); transition: transform .2s cubic-bezier(.02, .01, .47, 1), opacity .2s cubic-bezier(.02, .01, .47, 1), -webkit-transform .2s cubic-bezier(.02, .01, .47, 1); -webkit-transform: translate3d(50%, 0, 0) scale(.9); transform: translate3d(50%, 0, 0) scale(.9) }
.bttn-pill:focus:after, .bttn-pill:hover:after { opacity: .25; -webkit-transition: opacity .2s cubic-bezier(.02, .01, .47, 1) .05s, -webkit-transform .2s cubic-bezier(.02, .01, .47, 1) .05s; transition: opacity .2s cubic-bezier(.02, .01, .47, 1) .05s, -webkit-transform .2s cubic-bezier(.02, .01, .47, 1) .05s; transition: transform .2s cubic-bezier(.02, .01, .47, 1) .05s, opacity .2s cubic-bezier(.02, .01, .47, 1) .05s; transition: transform .2s cubic-bezier(.02, .01, .47, 1) .05s, opacity .2s cubic-bezier(.02, .01, .47, 1) .05s, -webkit-transform .2s cubic-bezier(.02, .01, .47, 1) .05s; -webkit-transform: translate(50%) scale(1.1); transform: translate(50%) scale(1.1) }
.bttn-pill.bttn-xs { padding: 3px 8px; font-size: 12px; font-family: inherit }
.bttn-pill.bttn-xs:focus, .bttn-pill.bttn-xs:hover { box-shadow: 0 1px 4px rgba(58, 51, 53, .3) }
.bttn-pill.bttn-sm { padding: 4px 10px; font-size: 16px; font-family: inherit }
.bttn-pill.bttn-sm:focus, .bttn-pill.bttn-sm:hover { box-shadow: 0 1px 6px rgba(58, 51, 53, .3) }
.bttn-pill.bttn-md { font-size: 20px; font-family: inherit; padding: 5px 12px }
.bttn-pill.bttn-md:focus, .bttn-pill.bttn-md:hover { box-shadow: 0 1px 8px rgba(58, 51, 53, .3) }
.bttn-pill.bttn-lg { padding: 8px 15px; font-size: 24px; font-family: inherit }
.bttn-pill.bttn-lg:focus, .bttn-pill.bttn-lg:hover { box-shadow: 0 1px 10px rgba(58, 51, 53, .3) }
.bttn-pill.bttn-default { background: #fff; color: #1d89ff }
.bttn-pill.bttn-default:focus, .bttn-pill.bttn-default:hover { color: #1d89ff }
.bttn-pill.bttn-default:after, .bttn-pill.bttn-default:before { background: #1d89ff }
.bttn-pill.bttn-primary { background: #1d89ff; color: #fff }
.bttn-pill.bttn-primary:focus, .bttn-pill.bttn-primary:hover { color: #fff }
.bttn-pill.bttn-primary:after, .bttn-pill.bttn-primary:before { background: #fff }
.bttn-pill.bttn-warning { background: #feab3a; color: #fff }
.bttn-pill.bttn-warning:focus, .bttn-pill.bttn-warning:hover { color: #fff }
.bttn-pill.bttn-warning:after, .bttn-pill.bttn-warning:before { background: #fff }
.bttn-pill.bttn-danger { background: #ff5964; color: #fff }
.bttn-pill.bttn-danger:focus, .bttn-pill.bttn-danger:hover { color: #fff }
.bttn-pill.bttn-danger:after, .bttn-pill.bttn-danger:before { background: #fff }
.bttn-pill.bttn-success { background: #28b78d; color: #fff }
.bttn-pill.bttn-success:focus, .bttn-pill.bttn-success:hover { color: #fff }
.bttn-pill.bttn-success:after, .bttn-pill.bttn-success:before { background: #fff }
.bttn-pill.bttn-royal { background: #bd2df5; color: #fff }
.bttn-pill.bttn-royal:focus, .bttn-pill.bttn-royal:hover { color: #fff }
.bttn-pill.bttn-royal:after, .bttn-pill.bttn-royal:before { background: #fff }
.bttn-float { margin: 0; padding: 0; border-width: 0; border-color: transparent; background: transparent; font-weight: 400; cursor: pointer; position: relative; font-size: 20px; font-family: inherit; padding: 5px 12px; overflow: hidden; border: 1px dotted #fff; border-radius: 4px; background: hsla(0, 0%, 100%, .4); color: #fff; -webkit-transition: opacity .3s cubic-bezier(.02, .01, .47, 1), box-shadow .2s cubic-bezier(.02, .01, .47, 1), -webkit-transform .3s cubic-bezier(.02, .01, .47, 1)