@font-face {
    font-family:officefont;src:url(../font/l) format("woff2"),url(../font/d) format("woff"),url(../font/a) format("opentype");font-weight:400;font-style:normal
}

@font-face {
    font-family:officefont;src:url(../font/ll) format("woff2"),url(../font/dd) format("woff"),url(../font/aa) format("opentype");font-weight:700;font-style:normal
}

@font-face {
    font-family:officefont;src:url(../font/lll) format("woff2"),url(../font/ddd) format("woff"),url(../font/aaa) format("opentype");font-weight:300;font-style:normal
}

.top {
    background: #fff;
    min-width: 960px;
    border-bottom: 2px solid #01994d
}

.line_dw {
    box-shadow: 0 1px 0 rgba(0,0,0,.12)
}

output {
    display: none
}

.subnav {
    display: none;
    position: absolute;
    top: 51px;
    left: 0;
    width: 170px;
    height: 100px;
    background: #3f3f3f;
    z-index: 99;
    line-height: 50px;
    text-align: left;
    padding-top: 3px
}

.subnav a {
    color: #fff;
    height: 50px;
    font-size: 16px;
    display: block;
    padding-left: 19px;
    width: 151px;
    line-height: 50px;
    text-align: left;
    float: none;
    border: none
}

.subnav a:hover {
    background: #2c2c2c;
    text-decoration: none;
    border-bottom: none
}

.subnav a:visited {
    color: #fff
}

.main {
    width: 1000px;
    margin: 0 auto
}

.hide {
    display: none
}

.navcontact {
    float: left;
    display: inline;
    color: #fff;
    line-height: 30px;
    height: 30px;
    margin: 10px 0 10px 82px;
    padding: 0 10px;
    background: #2c2c2c;
    border-radius: 5px
}

.navcontact span {
    color: #cc0
}

.ltie8 {
    border: 1px solid #fd5311;
    background: #f38236;
    text-align: center;
    padding: 100px 0;
    color: #fff;
    font-size: 24px;
    line-height: 55px
}

.ltie8 a {
    color: #fff;
    text-decoration: underline
}

.link {
    width: 960px;
    margin: 0 auto;
    font-size: 14px;
    line-height: 24px;
    clear: both;
    border-bottom: 1px solid #aaa;
    padding-bottom: 10px
}

.link span {
    color: #333;
    width: 65px;
    text-align: center
}

.link a {
    margin: 0 5px
}

.block:after,.row:after,.tit:after,.card li:after,.urltype .p:after,.sms:after,.ininput:after,.diy_scroll:after,.diy_statue:after,.tab:after,.colors:after,.other:after,.picelem:after,.baseset:after,.pics:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0
}

.block {
    zoom: 1;
    overflow: hidden;
    margin-bottom: 15px
}

.left {
    float: left;
    display: inline;
    width: 565px;
    background: #fff
}

.row {
    zoom: 1;
    overflow: hidden
}

.rowleft {
    float: left;
    display: inline;
    background: #eee;
    width: 105px;
    padding-bottom: 9999px;
    margin-bottom: -9999px;
    padding-top: 34px;
    zoom: 1;
    overflow: hidden
}

.rowright {
    position: relative;
    float: left;
    display: inline;
    width: 460px;
    margin-top: 34px;
    height: 600px
}

.rowleft li {
    float: left;
    display: inline;
    width: 100%;
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    vertical-align: middle;
    text-align: center
}

.rowleft li.active {
    background: #fff;
    border-left: 2px solid #01994d
}

.rowleft a {
    display: inline-block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    outline: 0
}

.rowleft a.a1 {
    background-position: 20px 5px
}

.rowleft .active a.a1 {
    background-position: 20px -256px
}

.rowleft a.a2 {
    background-position: 20px -29px
}

.rowleft .active a.a2 {
    background-position: 20px -290px
}

.rowleft a.a3 {
    background-position: 20px -63px
}

.rowleft .active a.a3 {
    background-position: 20px -324px
}

.rowleft a.a4 {
    background-position: 20px -97px
}

.rowleft .active a.a4 {
    background-position: 20px -358px
}

.rowleft a.a5 {
    background-position: 20px -131px
}

.rowleft .active a.a5 {
    background-position: 20px -392px
}

.rowleft a.a6 {
    background-position: 20px -165px
}

.rowleft .active a.a6 {
    background-position: 20px -426px
}

.rowleft a.a7 {
    background-position: 20px -199px
}

.rowleft .active a.a7 {
    background-position: 20px -460px
}

.rowleft a span {
    display: block;
    color: #828282;
    font-size: 16px;
    color: #555
}

.rowleft a.hover {
    background: 0;
    text-decoration: none
}

.rowleft a:hover span {
    display: block
}

.rowleft .active span {
    color: #33b5e5
}

.fnbox {
    overflow: hidden;
    padding: 0 30px
}

.prompt {
    margin: 0 28px 15px;
    background: #f9f7c7;
    border: 1px solid #fb3;
    line-height: 42px;
    padding: 0 14px;
    font-size: 14px;
    color: #666
}

.sub {
    clear: both;
    overflow: hidden;
    display: none
}

.show {
    display: block
}

.tit {
    zoom: 1;
    overflow: hidden;
    color: #828282;
    font-size: 18px;
    line-height: 20px;
    height: 20px;
    font-family: microsoft yahei,simsun;
    margin-bottom: 10px
}

.tit span {
    float: right;
    color: #999;
    font-size: 12px;
    font-family: simsun
}

.default {
    font-size: 14px;
    color: #999;
    font-weight: 400;
    font-family: simsun
}

.size {
    margin-top: 10px;
    color: #999
}

.merchant {
    margin-top: 185px;
    text-align: center
}

.sizeactive {
    color: #333
}

.fnbox input {
    font-size: 15px;
    font-family: microsoft yahei,simsun;
    font-weight: 700;
    color: #000;
    outline: 0
}

.dinput {
    float: left;
    display: inline;
    height: 15px;
    line-height: 15px;
    padding: 5px 7px;
    margin: 0;
    width: 250px;
    border: 1px solid #ababab
}

.disabled {
    background: #d4d0c8
}

.card {
    overflow: hidden
}

.card li {
    vertical-align: middle;
    margin-bottom: 20px;
    zoom: 1
}

.litel {
    display: none
}

.fnbox label {
    float: left;
    display: inline;
    width: 56px;
    padding-right: 10px;
    line-height: 27px;
    text-align: right;
    font-size: 14px
}

.card input.short {
    width: 170px;
    margin-right: 10px
}

.type {
    float: left;
    display: inline;
    padding: 2px 4px;
    width: 64px;
    margin: 0;
    font-size: 15px;
    color: #555;
    font-family: microsoft yahei,simsun;
    border: 1px solid #ababab;
    outline: 0
}

.addelem {
    clear: both;
    margin-left: 68px;
    color: #1e6e92
}

.addelem a {
    display: inline-block;
    padding: 10px 0 0;
    color: #1e6e92;
    text-decoration: none
}

.addelem a:visited {
    color: #1e6e92;
    text-decoration: none
}

.addelem a:hover {
    color: #33b5e5;
    text-decoration: none
}

.urlbox {
    margin-bottom: 10px
}

.url {
    width: 384px;
    height: 15px;
    line-height: 15px;
    padding: 5px 7px;
    margin: 0;
    border: 1px solid #ababab
}

.msg {
    color: #999;
    margin: 0
}

.sms {
    zoom: 1;
    overflow: hidden;
    margin-top: 20px
}

.wifitype {
    padding: 1px 4px;
    outline: 0;
    font-size: 15px;
    color: #555;
    font-family: microsoft yahei,simsun;
    border: 1px solid #ababab
}

.ininput {
    zoom: 1;
    overflow: hidden
}

.canvas-wrap {
    width: 304px;
    margin: 0 auto
}

.canvas {
    text-align: center
}

.canvas a {
    text-align: center;
    vertical-align: middle
}

.canvas img {
    vertical-align: middle
}


.diy_statue {
    zoom: 1;
    overflow: hidden;
    margin: 20px 0 0
}

.diy_statue a {
    float: left;
    display: inline;
    color: #1e6e92;
    width: 33.33%
}

.diy_statue a:hover,.diy_statue a:visited {
    color: #1e6e92
}

.fnrow {
    clear: both;
    overflow: hidden
}

.mrow {
    padding: 24px 0
}

.tab {
    zoom: 1;
    overflow: hidden;
    background: #dbdbdb;
    padding: 3px 10px 0;
    height: 27px
}

.tab a {
    float: left;
    display: inline;
    height: 27px;
    line-height: 27px;
    color: #636363;
    text-decoration: none;
    width: 70px;
    overflow: hidden;
    text-align: center
}

.tab a:hover {
    color: #333;
    text-decoration: none
}

.tab a.active {
    background: #f9f9f9;
    font-weight: 700
}

.fnblock {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    background: #fff
}

.fnsubv {
    padding: 10px 10px 0 15px;
    height: 82px;
    display: none
}

.fnblock .show {
    display: block
}

.colors {
    zoom: 1;
    overflow: hidden
}

.colors li {
    float: left;
    display: inline;
    padding-bottom: 15px
}

.colors li.li1,.colors li.li4 {
    width: 90px
}

.colors li.li2,.colors li.li5 {
    width: 135px
}

.colors li.li3,.colors li.li6 {
    width: 123px
}

.iColorPicker {
    display: none
}

.colors label {
    float: left;
    display: inline;
    line-height: 26px;
    color: #555;
    margin-right: 8px
}

.color {
    float: left;
    display: inline;
    border: 1px solid #bdbdbd;
    padding: 1px;
    width: 90px;
    border-radius: 4px;
    height: 30px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 1px 2px rgba(60,64,67,.15)
}

.colorPicker-picker {
    float: left;
    display: inline;
    width: 84px;
    height: 24px;
    cursor: pointer;
    border-radius: 3px;
    margin: 1px
}

.colors select {
    margin-top: 2px
}

.other {
    clear: both;
    line-height: 35px;
    zoom: 1
}

.copy {
    display: inline
}

.copy a,.copy a:hover,.copy a:visited {
    color: #1e6e92
}

.save {
    float: right;
    display: inline
}

.save a {
    display: inline-block;
    width: 118px;
    height: 33px;
    line-height: 33px;
    background: #3f3f3f;
    border: 1px solid #3f3f3f;
    font-size: 14px;
    text-align: center;
    color: #fff
}

.save a:hover,.save a:visited {
    color: #fff;
    text-decoration: none
}

.save a:hover {
    background: #1ca5d5;
    border: 1px solid #3990ab
}

.tips {
    line-height: 20px;
    margin-top: 10px;
    color: #1e6e92
}

.logotypes,.pic {
    margin: 5px 0;
    *margin-top: 25px;
    height: 35px;
    line-height: 24px;
    position: relative;
    text-align: center;
    overflow: hidden;
    color: #555
}

.logotypes {
    margin: 0
}

.logotypes label {
    margin: 0 10px
}

.logotypes input {
    vertical-align: -2px
}

.addlogo {
    font-size: 30px;
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 10;
    cursor: pointer;
    background: 0 0
}

.picbtn {
    display: inline-block;
    width: 160px;
    height: 35px;
    position: relative;
    cursor: pointer;
    overflow: hidden
}

.format {
    text-align: center;
    color: #636363;
    margin-top: 14px
}

.picelem {
    position: absolute;
    top: 0;
    z-index: 12;
    width: 100%;
    background: #fff;
    zoom: 1;
    display: none
}

.picelem span {
    display: inline;
    width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 24px;
    margin-right: 10px;
    overflow: hidden
}

.del,.turn span {
    background: url(../images/delete.svg) no-repeat;
    background-size: 24px;
    background-position: center
}

.del {
    display: inline-block;
    width: 50px;
    height: 32px
}

.turn {
    display: none;
    overflow: hidden
}

.turn1,.turn2 {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 15px;
    cursor: pointer
}

.turn span.turn1 {
    background-position: -27px 0
}

.turn span.turn2 {
    background-position: -58px 0
}

.baseset {
    padding: 12px 0 0 30px;
    zoom: 1;
    overflow: hidden;
    width: 350px
}

.baseset li {
    float: left;
    display: inline;
    margin-right: 30px;
    _margin-right: 27px;
    height: 24px;
    line-height: 24px;
    margin-bottom: 5px
}

.baseset label {
    float: left;
    display: inline;
    width: 48px;
    text-align: right;
    margin-right: 8px
}

.baseset select {
    width: 70px
}

.picbox {
    background: #fff;
    margin-bottom: 15px;
    padding: 15px 0 28px
}

.pictit {
    margin: 0 20px 18px;
    color: #666
}

.pictit span {
    float: right;
    display: inline;
    font-size: 14px;
    color: #c00
}

.pictit span a {
    color: #c00;
    text-decoration: underline
}

.pictit span a:hover {
    color: #333
}

.pics {
    zoom: 1;
    overflow: hidden;
    margin: 0 18px
}

.pics li {
    float: left;
    display: inline;
    vertical-align: middle;
    border: 1px solid #cfcfcf;
    margin: 0 1px
}

.close {
    float: left;
    display: inline;
    margin: 0
}

.colors .close {
    margin: 0;
    padding-top: 10px;
    width: 16px;
    height: 16px;
    text-align: center;
    display: none
}

.old {
    position: absolute;
    left: 50%;
    margin-left: 480px;
    display: block
}

.old a {
    display: inline-block;
    width: 15px;
    height: 60px;
    line-height: 16px;
    background: #adadad;
    text-align: center;
    padding: 10px;
    text-decoration: none;
    color: #f8f8f8;
    font-size: 14px
}

.old a:hover {
    text-decoration: none;
    background: #f6f6f6;
    color: #222
}

.pin {
    position: relative;
    margin: 18px 0 0 110px
}

.pin-trigger {
    width: 120px;
    height: 30px;
    border: 1px solid #ababab;
    text-indent: 1em;
    line-height: 30px;
    background: url(../images/pin-tri.jpg) 100px -13px no-repeat;
    cursor: pointer
}

.pin-trigger-on {
    background-position: 100px 12px
}

.pin-panel {
    bottom: 0;
    height: 100%
}

.pin-panel ul {
    overflow: hidden;
    zoom: 1
}

.pin-panel span {
    float: right;
    display: block;
    width: 130px;
    height: 54px;
    margin: -54px -7px 0 0;
    content: ""
}

.pin-panel li {
    float: left;
    display: inline;
    width: 58px;
    height: 58px;
    border: 1px solid #fff;
    background: transparent url(../images/pin-panel.png) 0 0 no-repeat
}

.pin-panel li.active {
    background-color: #ffd28f;
    border: 1px solid #ff9800;
    border-radius: 5px
}

.pin-panel li:hover {
    background-color: #ffe9c9;
    border: 1px solid #ffd28f;
    border-radius: 5px;
    box-shadow: 0 2px 3px 0 rgba(83,179,87,.16)
}

.pin-panel li.i1 {
    background-position: 7px 7px
}

.pin-panel li.i2 {
    background-position: -54px 7px
}

.pin-panel li.i3 {
    background-position: -115px 7px
}

.pin-panel li.i4 {
    background-position: -176px 7px
}

.pin-panel li.i5 {
    background-position: -237px 7px
}

.pin-panel li.i6 {
    background-position: -299px 7px
}

.pin-panel li.i7 {
    background-position: 7px -54px
}

.pin-panel li.i8 {
    background-position: -54px -54px
}

.pin-panel li.i9 {
    background-position: -115px -54px
}

.pin-panel li.i10 {
    background-position: -176px -54px
}

.pin-panel li.i11 {
    background-position: -237px -54px
}

.pin-panel li.i12 {
    background-position: -299px -54px
}

.pin-panel li.i13 {
    background-position: 7px -115px
}

.pin-panel li.i14 {
    background-position: -54px -115px
}

.pin-panel li.i15 {
    background-position: -115px -115px
}

.pin-panel li.i16 {
    background-position: -176px -115px
}

.pin-panel li.i17 {
    background-position: -237px -115px
}

.pin-panel li.i18 {
    background-position: -299px -115px
}

.pin-panel li.i19 {
    background-position: 7px -175px
}

.pin-panel li.i20 {
    background-position: -54px -175px
}

.pin-panel li.i21 {
    background-position: -115px -175px
}

.pin-panel li.i22 {
    background-position: -176px -175px
}

.pin-panel li.i23 {
    background-position: -237px -175px
}

.reset-all {
    line-height: 27px;
    color: #1e6e92;
    cursor: pointer;
    margin: 5px 0
}

.reset-all a,.reset-all a:hover,.reset-all a:visited {
    color: #1e6e92;
    width: auto
}

.reset-all a:hover {
    text-decoration: underline
}

.colors {
    padding: 0
}

.adrift {
    position: fixed;
    right: 3px;
    top: 240px;
    width: 110px;
    height: 148px;
    text-align: center;
    _position: absolute;
    z-index: -1
}

.adrift a {
    display: inline-block;
    text-align: center;
    width: 100px;
    line-height: 20px;
    padding: 6px 5px;
    color: #666;
    background: #eee
}

.adrift a:hover {
    text-decoration: none;
    background: #adadad;
    color: #f8f8f8
}

.bdmap {
    height: 400px;
    font-family: microsoft yahei,Arial,Helvetica;
    font-size: 12px
}

.bdmap p {
    margin: 0 2px;
    line-height: 22px
}

.bdmap label {
    float: none;
    display: inline-block
}

.bdmap label.checked {
    background: url(../images/bdmap_check.png) 4px center no-repeat
}

.bdmap input {
    display: none;
    *display: inline;
    *height: 0
}

.bdmap .BMap_cpyCtrl span {
    display: none
}

.fontset li {
    float: left;
    display: inline;
    margin-right: 25px;
    _margin-right: 22px;
    height: 26px;
    line-height: 26px
}

.fontset .i3 {
    margin-right: 0
}

.fontset label {
    float: left;
    display: inline;
    line-height: 26px;
    color: #555;
    margin-right: 8px
}

.content {
    margin-bottom: 12px;
    display: flex
}

.ctext {
    width: 230px;
    height: 24px;
    margin: 0;
    padding: 0 6px;
    outline: none;
    color: #666
}

.cbutton {
    width: 64px;
    height: 26px;
    border: medium;
    background-color: #18a3d4;
    color: #fff;
    cursor: pointer
}

#canvasshow {
    max-width: 300px;
    max-height: 300px
}

#canvas {
    max-width: 300px;
    max-height: 300px;
    display: none
}

.dark-tooltip {
    display: none;
    position: absolute;
    z-index: 99;
    text-decoration: none;
    font-weight: 400;
    height: auto;
    top: 0;
    left: 0
}

.dark-tooltip.small {
    padding: 4px;
    font-size: 12px;
    max-width: 150px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px
}

.dark-tooltip.medium {
    padding: 10px 20px;
    font-size: 14px;
    max-width: 480px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.dark-tooltip.large {
    padding: 16px;
    font-size: 16px;
    max-width: 450px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px
}

.dark-tooltip .tip {
    transform: scale(1.01);
    -webkit-transform: scale(1.01);
    transform: scale(1.01);
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    line-height: 0
}

.dark-tooltip.south .tip {
    left: 50%;
    top: 100%
}

.dark-tooltip.west .tip {
    left: 0;
    top: 50%
}

.dark-tooltip.north .tip {
    left: 50%;
    top: 0
}

.dark-tooltip.east .tip {
    left: 100%;
    top: 50%
}

.dark-tooltip.south.small .tip {
    border-width: 7px 5px 0;
    margin-left: -5px
}

.dark-tooltip.south.medium .tip {
    border-width: 8px 6px 0;
    margin-left: -6px
}

.dark-tooltip.south.large .tip {
    border-width: 14px 12px 0;
    margin-left: -12px
}

.dark-tooltip.west.small .tip {
    border-width: 5px 7px 5px 0;
    margin-left: -7px;
    margin-top: -5px
}

.dark-tooltip.west.medium .tip {
    border-width: 6px 8px 6px 0;
    margin-left: -8px;
    margin-top: -6px
}

.dark-tooltip.west.large .tip {
    border-width: 12px 14px 12px 0;
    margin-left: -14px;
    margin-top: -12px
}

.dark-tooltip.north.small .tip {
    border-width: 0 5px 7px;
    margin-left: -5px;
    margin-top: -7px
}

.dark-tooltip.north.medium .tip {
    border-width: 0 6px 8px;
    margin-left: -6px;
    margin-top: -8px
}

.dark-tooltip.north.large .tip {
    border-width: 0 12px 14px;
    margin-left: -12px;
    margin-top: -14px
}

.dark-tooltip.east.small .tip {
    border-width: 5px 0 5px 7px;
    margin-top: -5px
}

.dark-tooltip.east.medium .tip {
    border-width: 6px 0 6px 8px;
    margin-top: -6px
}

.dark-tooltip.east.large .tip {
    border-width: 12px 0 12px 14px;
    margin-top: -12px
}

.dark-tooltip ul.confirm {
    list-style-type: none;
    margin-top: 5px;
    display: inline-block;
    margin: 0 auto
}

.dark-tooltip ul.confirm li {
    padding: 10px;
    float: left;
    margin: 5px;
    min-width: 25px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px
}

.dark-tooltip.dark {
    background-color: #1b1e24;
    color: #fff;
    border-radius: 40px;
    box-shadow: 0 -1px 0 rgba(0,0,0,.06),0 0 3px rgba(0,0,0,.18),0 1px 3px rgba(0,0,0,.18)
}

.dark-tooltip.light {
    background-color: #ebedf3;
    color: #1b1e24
}

.dark-tooltip.dark.south .tip {
    border-color: #1b1e24 transparent transparent transparent;
    _border-color: #1b1e24 #000 #000 #000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000')
}

.dark-tooltip.dark.west .tip {
    border-color: transparent #1b1e24 transparent transparent;
    _border-color: #000 #1b1e24 #000 #000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000')
}

.dark-tooltip.dark.north .tip {
    border-color: transparent transparent #1b1e24 transparent;
    _border-color: #000 #000 #1b1e24 #000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000')
}

.dark-tooltip.dark.east .tip {
    border-color: transparent transparent transparent #1b1e24;
    _border-color: #000 #000 #000 #1b1e24;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000')
}

.dark-tooltip.light.south .tip {
    border-color: #ebedf3 transparent transparent transparent;
    _border-color: #ebedf3 #000 #000 #000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000')
}

.dark-tooltip.light.west .tip {
    border-color: transparent #ebedf3 transparent transparent;
    _border-color: #000 #ebedf3 #000 #000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000')
}

.dark-tooltip.light.north .tip {
    border-color: transparent transparent #ebedf3 transparent;
    _border-color: #000 #000 #ebedf3 #000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000')
}

.dark-tooltip.light.east .tip {
    border-color: transparent transparent transparent #ebedf3;
    _border-color: #000 #000 #000 #ebedf3;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000')
}

.dark-tooltip.dark ul.confirm li {
    background-color: #416e85
}

.dark-tooltip.dark ul.confirm li:hover {
    background-color: #417e85
}

.dark-tooltip.light ul.confirm li {
    background-color: #c1dbdb
}

.dark-tooltip.light ul.confirm li:hover {
    background-color: #dce8e8
}

.animated {
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: .5s;
    -moz-animation-duration: .5s;
    -ms-animation-duration: .5s;
    -o-animation-duration: .5s;
    animation-duration: .5s
}

@-webkit-keyframes flipInUp {
    0% {
        -webkit-transform: perspective(400px) rotateX(-90deg);
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotateX(5deg)
    }

    70% {
        -webkit-transform: perspective(400px) rotateX(-5deg)
    }

    100% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        opacity: 1
    }
}

@-moz-keyframes flipInUp {
    0% {
        transform: perspective(400px) rotateX(-90deg);
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotateX(5deg)
    }

    70% {
        transform: perspective(400px) rotateX(-5deg)
    }

    100% {
        transform: perspective(400px) rotateX(0deg);
        opacity: 1
    }
}

@-o-keyframes flipInUp {
    0% {
        -o-transform: perspective(400px) rotateX(-90deg);
        opacity: 0
    }

    40% {
        -o-transform: perspective(400px) rotateX(5deg)
    }

    70% {
        -o-transform: perspective(400px) rotateX(-5deg)
    }

    100% {
        -o-transform: perspective(400px) rotateX(0deg);
        opacity: 1
    }
}

@keyframes flipInUp {
    0% {
        transform: perspective(400px) rotateX(-90deg);
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotateX(5deg)
    }

    70% {
        transform: perspective(400px) rotateX(-5deg)
    }

    100% {
        transform: perspective(400px) rotateX(0deg);
        opacity: 1
    }
}

@-webkit-keyframes flipInRight {
    0% {
        -webkit-transform: perspective(400px) rotateY(-90deg);
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotateY(5deg)
    }

    70% {
        -webkit-transform: perspective(400px) rotateY(-5deg)
    }

    100% {
        -webkit-transform: perspective(400px) rotateY(0deg);
        opacity: 1
    }
}

@-moz-keyframes flipInRight {
    0% {
        transform: perspective(400px) rotateY(-90deg);
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotateY(5deg)
    }

    70% {
        transform: perspective(400px) rotateY(-5deg)
    }

    100% {
        transform: perspective(400px) rotateY(0deg);
        opacity: 1
    }
}

@-o-keyframes flipInRight {
    0% {
        -o-transform: perspective(400px) rotateY(-90deg);
        opacity: 0
    }

    40% {
        -o-transform: perspective(400px) rotateY(5deg)
    }

    70% {
        -o-transform: perspective(400px) rotateY(-5deg)
    }

    100% {
        -o-transform: perspective(400px) rotateY(0deg);
        opacity: 1
    }
}

@keyframes flipInRight {
    0% {
        transform: perspective(400px) rotateY(-90deg);
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotateY(5deg)
    }

    70% {
        transform: perspective(400px) rotateY(-5deg)
    }

    100% {
        transform: perspective(400px) rotateY(0deg);
        opacity: 1
    }
}

.flipIn {
    -webkit-backface-visibility: visible!important;
    -moz-backface-visibility: visible!important;
    -o-backface-visibility: visible!important;
    backface-visibility: visible!important
}

.flipIn.south,.flipIn.north {
    -webkit-animation-name: flipInUp;
    -moz-animation-name: flipInUp;
    -o-animation-name: flipInUp;
    animation-name: flipInUp
}

.flipIn.west,.flipIn.east {
    -webkit-animation-name: flipInRight;
    -moz-animation-name: flipInRight;
    -o-animation-name: flipInRight;
    animation-name: flipInRight
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-moz-keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-o-keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    -moz-animation-name: fadeIn;
    -o-animation-name: fadeIn;
    animation-name: fadeIn
}

.ico {
    width: 20px;
    height: 20px;
    padding: 0;
    margin: 0;
    border: none;
    background: transparent url(../images/tool.svg);
    display: block
}

.office--youtube {
    background-position: -5px -250px
}

.office--translate {
    background-position: -30px -430px
}

.office--qrocde {
    background-position: -5px -180px
}

.office--downloader {
    background-position: -5px -205px
}

.office--onlinedown {
    background-position: -30px -480px
}

footer {
    display: block
}

body ::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    background: 0 0
}

@media(min-width:1024px) {
    body ::-webkit-scrollbar {
        width: 8px;
        height: 8px
    }
}

body ::-webkit-scrollbar-thumb {
    background: 0 0
}

a {
    text-decoration: none
}

.icon24 {
    width: 24px;
    height: 24px;
    vertical-align: -.22em;
    fill: currentColor;
    overflow: hidden;
    margin-right: 5px;
    margin-left: 5px
}

:focus {
    outline: none
}

a {
    background: 0 0;
    cursor: pointer
}

a,a:hover {
    text-decoration: none
}

.page-content-left {
    flex: 1 1 auto;
    min-width: 290px
}

.Fbrw4b {
    margin-right: 15px
}

.eqVmXb {
    display: inline;
    outline: none
}

c-wiz {
    contain: style
}

.OlR1df {
    color: #5f6368;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 0 36px 12px
}

.BQBwZc {
    display: flex;
    justify-content: space-between;
    position: relative
}

.BQBwZc .eqVmXb {
    width: 100%
}

.YoKU9e {
    bottom: 0;
    cursor: pointer;
    height: 24px;
    left: 0;
    margin: auto;
    margin-left: 12px;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-user-select: none;
    width: 24px
}

.YoKU9e:focus {
    outline: none;
    background-color: #def1de;
    border-radius: 50%;
    transition: box-shadow .3s
}

.YoKU9e:focus svg {
    fill: #225e1e
}

.YoKU9e:hover {
    background-color: #dff1df;
    border-radius: 50%;
    transition: box-shadow .3s
}

.pAwJHb {
    color: #5f6368;
    line-height: 0;
    padding: 0;
    transform: rotate(90deg);
    transition-duration: .3s
}

.hzF9eb {
    max-height: none;
    overflow-x: hidden;
    overflow-y: hidden;
    transition-duration: .3s;
    transition-property: max-height;
    transition-timing-function: linear
}

.hzF9eb .YoKU9e {
    bottom: 0;
    cursor: pointer;
    height: 24px;
    left: 24px;
    margin-left: 8px;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-user-select: none;
    width: 24px;
    z-index: 1
}

.sMBJh {
    display: flex;
    min-height: calc(100vh - 64px);
    flex-direction: column;
    justify-content: space-between
}

.SABpDb {
    padding-left: 35px
}

.G3sBi {
    border-radius: 0 32px 32px 0;
    cursor: pointer;
    display: block;
    padding: 12px 36px 12px 20px;
    text-decoration: none;
    transition: background-color .3s cubic-bezier(0,0,.2,1);
    white-space: nowrap
}

.G3sBi:focus {
    background-color: #d2e3fc;
    outline: none
}

.G3sBi:hover {
    background-color: #dff1df;
    color: #034e06!important
}

.G3sBi.active {
    background-color: #f1f9f1;
    color: #034e06!important
}

.G3sBi.rU9Npf {
    letter-spacing: .01785714em;
    font-family: officefont,sans-serif;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.25rem;
    align-items: center;
    color: #3c4043;
    display: flex;
    flex: 1;
    cursor: pointer!important
}

.G3sBi.O3zbCe {
    letter-spacing: .025em;
    font-family: officefont,sans-serif;
    font-size: .75rem;
    font-weight: 400;
    line-height: 1rem;
    color: #3c4043;
    padding-top: 6px;
    padding-bottom: 6px
}

.zoa7Ve {
    display: none;
    width: 264px
}

.zoa7Ve.hpnc1c {
    display: block;
    margin-right: 25px
}

.jmG9nb {
    padding-bottom: 8px;
    padding-top: 8px
}

.jmG9nb:last-child {
    border: none
}

.GvQOfe {
    overflow: hidden;
    text-overflow: ellipsis
}

.indexlist {
    margin-left: 15px
}

.O3zbCe {
    padding-left: 67px
}

.pooEtb {
    letter-spacing: .025em;
    font-family: officefont,sans-serif;
    font-size: .75rem;
    font-weight: 400;
    line-height: 1rem;
    color: #5f6368;
    text-decoration: none
}

.jdOQ8d {
    margin: 0 5px;
    vertical-align: middle
}

.Qh16y:hover {
    background-color: #dff1df;
    cursor: default
}

.gb_Nc {
    display: -webkit-flex;
    display: flex;
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    -webkit-flex-direction: column;
    flex-direction: column;
    margin-top: 65px;
    margin-top: 65px;
    bottom: 0;
    color: #000;
    height: -webkit-calc(100vh - 64px);
    height: calc(100vh - 64px);
    position: fixed;
    overflow: hidden
}

.UlT73d {
    transform: rotate(0deg)
}

.gb_Nc:hover {
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    visibility: visible;
    -webkit-transition: transform .25s cubic-bezier(.4,0,.2,1),visibility 0s linear 0s;
    transition: transform .25s cubic-bezier(.4,0,.2,1),visibility 0s linear 0s
}

.gb_Nc:hover::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,.2);
    z-index: 22
}

.gb_Nc::-webkit-scrollbar-corner {
    background-color: transparent
}

.gb_Nc::-webkit-scrollbar-thumb {
    background-clip: padding-box;
    background-color: transparent;
    border: 0 solid transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    min-height: 28px
}

.gb_Nc::-webkit-scrollbar-track {
    border: 0 solid transparent;
    background-clip: padding-box;
    background-color: transparent
}

.gb_Nc::-webkit-scrollbar-thumb:hover {
    background-color: #858585
}

.gb_Nc::-webkit-scrollbar-thumb:active {
    background-color: #999
}

.icon200 {
    width: 20px;
    height: 20px;
    vertical-align: -.22em;
    fill: currentColor;
    overflow: hidden;
    margin-right: 5px
}

@media(max-width:841px) {
    .page-content-left {
        display: none
    }

    .content-header {
        width: 100%!important
    }
}

a {
    background-image: none
}

a {
    background-color: transparent;
    color: #555;
    text-decoration: none
}

a:focus,a:hover {
    color: #ff9800;
    outline: 0;
    text-decoration: underline
}

.Qo7o0c {
    border-bottom: 1px solid #dadce0;
    width: 14.5rem;
    margin: .75rem 0;
    margin-left: 0;
    margin-left: 1rem
}

@media print {
    *,:after,:before {
        background: 0 0!important;
        box-shadow: none!important;
        text-shadow: none!important
    }

    a,a:visited {
        text-decoration: underline
    }

    a[href]:after {
        content: " ("attr(href) ")"
    }
}


.office--main {
    padding: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none
}

.mobileshow {
    display: none!important
}

@media(max-width:840px) {

    .mobileshow {
        display: inline-block!important
    }

    .office--main {
        background-color: #fff;
        border-bottom: 1px solid #fff
    }
}

@media(min-width:841px) {

}

.brand {
    line-height: 20px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.office__icon {
    width: 147px;
    max-height: 100%
}

.office__icon a:link,.office__icon a:visited {
    font-size: 16px;
    font-weight: 400;
    color: #000
}

.office__icon a:hover,.office__icon a:focus {
    text-decoration: none
}

.office__icon img {
    height: 38px;
    margin-top: -6px;
    margin-right: 5px
}

.office__icon strong {
    font-weight: 600;
    color: #000;
    margin-right: 6px;
    font-size: 22px;
    line-height: 65px
}

.office-menu {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.office-menu,.office-menu .convert-nav {
    display: -ms-flexbox;
    display: flex
}

.office-menu .convert-nav {
    list-style: none;
    padding: 0;
    margin: 0;
    -ms-flex-align: center;
    align-items: center
}

.office-menu .convert__item {
    margin: 0;
    height: 100%
}

.office-menu .convert__item a {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    font-weight: 300;
    line-height: 60px;
    text-decoration: none;
    height: 100%
}

.office-menu .convert__item--gray a {
    font-weight: 400;
    border: none;
    color: #161616;
    padding-left: 16px;
    padding-right: 16px;
    border-bottom: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent
}

@media(max-width:840px) {
    .office-menu .convert__item--gray {
        display: none
    }
}

.office-menu .convert__item--sub {
    cursor: pointer;
    font-size: 16px;
    line-height: 60px;
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    color: #222
}

.office-menu .convert__item--sub .divider {
    border-bottom: 1px solid #f1f1f1;
    line-height: 0;
    height: 1px
}

@media(max-width:840px) {
    .office-menu .convert__item--sub span {
        display: none
    }

    .office-menu .convert__item--sub:hover>ul {
        right: 0;
        opacity: 1;
        visibility: visible;
        height: auto;
        border: 1px solid #ccc
    }
}

.office-menu .convert__item--sub ul {
    right: 0;
    position: absolute;
    min-width: 240px;
    height: 0;
    opacity: 0;
    visibility: hidden;
    top: 64px;
    background: #fff;
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    z-index: 9999
}

.office-menu .convert__item--sub ul a {
    padding: 0 16px;
    height: 48px;
    margin: 0;
    background: #fff;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: #161616;
    position: relative;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: calc(100% - 32px)
}

.office-menu .convert__item--sub ul a:hover {
    color: #4caf50
}

.office-menu .convert__item--sub .convert__item--sub:after {
    content: "";
    width: 8px;
    height: 12px;
    background: url(../images/regihtgo.svg) no-repeat 50%;
    position: absolute;
    right: 8px;
    color: #161616;
    -webkit-transition: .3s all;
    transition: .3s all;
    z-index: 11
}

.office-menu .convert__item--sub .convert__item--sub:hover:after {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.office-menu .convert__item--sub .convert__item--sub:after {
    top: 40%
}

.office-menu .convert__item--sub .convert__item--sub ul {
    top: 45%;
    -webkit-transform: translateY(-45%);
    -ms-transform: translateY(-45%);
    transform: translateY(-45%)
}

.office-menu .convert__item--sub .convert__item--sub ul {
    max-height: 72vh;
    overflow: auto;
    width: 100%;
    min-width: auto;
    right: 190px;
    z-index: 2;
    max-width: 160px
}

@media(min-width:840px) {
    .office-menu .convert__item--sub .convert__item--sub ul {
        left: 100%!important;
        z-index: -1
    }

    .office-menu .convert__item--sub:hover>ul {
        left: 0;
        opacity: 1;
        visibility: visible;
        height: auto;
        border: 1px solid #ccc;
        top: 64px;
        border-top: 1px solid #4caf50
    }
}

@media(min-width:840px) {
    .office-menu .convert__item--sub .convert__item--sub ul.lang__menu {
        left: 100%;
        width: 500px;
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
        -webkit-column-gap: 20px;
        -moz-column-gap: 20px;
        column-gap: 20px;
        z-index: -1
    }
}

.office-menu .convert__item--sub .convert__item--sub ul.lang__menu a {
    display: block;
    height: 32px;
    text-transform: capitalize
}

.office-menu .convert__item--sub .convert__item--sub ul a {
    padding: 0 12px;
    line-height: 16px;
    font-size: 14px;
    display: -ms-flexbox;
    display: flex
}

.office-menu .convert__item--sub .convert__item--sub .lang__menu a {
    line-height: 32px
}

.office-menu .lang__current {
    display: none
}

.main-menu {
    font-size: 15px
}

.main-menu .convert-nav {
    display: block;
    height: 65px
}

.main-menu .convert-nav li {
    display: inline-block;
    position: relative
}

.main-menu .convert-nav li a,.main-menu .convert-nav li span {
    height: 65px;
    font-weight: 400;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 16px;
    line-height: 65px;
    text-decoration: none;
    text-transform: uppercase;
    color: #161616;
    cursor: pointer
}

.main-menu .convert-nav li a:hover,.main-menu .convert-nav li span:hover {
    background-color: #fff;
    color: #4caf50;
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transition-duration: .4s;
    -o-transition-duration: .4s;
    transition-duration: .4s
}


.main-menu .convert-nav li.convertmenu span {
    color: #222
}

.main-menu .convert-nav li.convertmenu .nav__icon {
    display: none
}

.main-menu .convert-nav li.convertmenu .ico {
    margin: 4px 0 0;
    vertical-align: middle
}

.main-menu .convert-nav li.convertmenu .convertmenu-menu {
    display: none
}

.main-menu .convert-nav li.convertmenu .menu-full--qrcode {
    -webkit-animation: scale-in-tr .4s cubic-bezier(.25,.46,.45,.94) both;
    animation: scale-in-tr .4s cubic-bezier(.25,.46,.45,.94) both
}

.main-menu .convert-nav li.convertmenu:hover>ul {
    display: -ms-flexbox;
    display: flex;
    box-shadow: 0 .125rem .1875rem 0 rgba(0,0,0,.11);
    margin-top: -1px;
    margin-left: -1px;
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    border-top: 1px solid #298c2d
}

.main-menu .convert-nav li ul {
    height: 0;
    background: #fff;
    position: fixed;
    top: 65px;
    -webkit-box-shadow: 0 6px 6px #f1f1f1;
    -moz-box-shadow: 0 6px 6px #f1f1f1;
    box-shadow: 0 6px 6px #f1f1f1;
    text-align: left;
    max-height: 85vh;
    overflow-x: auto
}

.main-menu .convert-nav li ul li {
    display: block
}

.main-menu .convert-nav li ul li a {
    text-transform: none;
    line-height: 39px;
    height: 18px;
    margin-bottom: 2px;
    margin-top: 1px;
    display: flex;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.main-menu .convert-nav li ul li a .ico {
    margin: 4px 8px 4px 4px;
    vertical-align: middle
}

.main-menu .convert-nav li ul li a:hover {
    background: #f1f1f1;
    border-radius: 4px
}

.main-menu .convert-nav li:hover ul {
    height: auto;
    visibility: visible;
    opacity: 1;
    z-index: 1
}

.main-menu .convert-nav li.showclose {
    display: none;
    position: fixed!important;
    top: 80px;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 3001;
    clear: both;
    width: 40px;
    height: 40px;
    right: 20px;
    position: fixed;
    border-radius: 50%;
    -webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,.1),0 1px 10px 0 rgba(0,0,0,.01),0 2px 4px -1px rgba(0,0,0,.02);
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.1),0 1px 10px 0 rgba(0,0,0,.01),0 2px 4px -1px rgba(0,0,0,.02);
    color: #111
}

.main-menu .convert-nav li.convertmenu-all:hover {
    background-color: #fff
}

.main-menu .convert-nav li.convertmenu-all:hover span {
    color: #228826;
    background-color: transparent
}

.main-menu .convert-nav li.convertmenu-all .icon12 {
    -webkit-transition: .3s all;
    transition: .3s all
}

.main-menu .convert-nav li.convertmenu-all:hover .icon12 {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.main-menu .convert-nav li.convertmenu-all:hover .nav__icon {
    fill: #4caf50
}

.searchic {
    display: none!important
}

.langli {
    display: none!important
}

.main-menu .convert-nav li.convertmenu-all {
    position: inherit;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent
}

.main-menu .convert-nav li ul.menu-full {
    font-size: 14px;
    width: 100%;
    height: auto;
    right: 0;
    padding: 12px;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.main-menu .convert-nav li ul.menu-full--convert {
    max-width: 800px!important;
    right: auto;
    padding: 12px 24px 16px
}

.main-menu .convert-nav li ul.menu-full--qrcode {
    width: 250px!important;
    left: auto;
    padding: 15px;
    right: 2px;
    min-width: 250px!important;
    border: 1px solid #ccc!important;
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2)!important;
    box-shadow: 0 2px 10px rgba(0,0,0,.2)!important;
    -webkit-border-radius: 8px;
    border-radius: 8px
}

.main-menu .convert-nav li ul.menu-full--convert>li {
    -ms-flex: 1 0 10%!important;
    flex: 1 0 10%!important
}

.main-menu .convert-nav li ul.menu-full--converter {
    right: 0;
    padding: 0
}

.main-menu .convert-nav li ul.menu-full--converter>li {
    -ms-flex: 1 0 10%!important;
    flex: 1 0 10%!important
}

.main-menu .convert-nav li ul.menu-full div {
    color: #969696;
    font-weight: 300;
    font-size: 14px;
    padding: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.main-menu .convert-nav li ul.menu-full>li {
    -ms-flex: 0 0 16%;
    flex: 0 0 16%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 24px
}

.main-menu .convert-nav li ul.menu-full ul {
    display: block;
    position: relative;
    top: 12px;
    -webkit-box-shadow: none;
    box-shadow: none
}

.main-menu .convert-nav li ul.menu-full ul li {
    font-weight: 300
}

.main-menu .convert-nav li ul.menu-full ul li a {
    padding: 10px;
    text-transform: capitalize
}

.ico {
    width: 20px;
    height: 20px;
    padding: 0;
    margin: 0;
    border: none;
    background: transparent url(../images/tool.svg);
    display: block
}

.office--pdf {
    background-position: -5px -5px
}

.office--video {
    background-position: -5px -30px
}

.office--audio {
    background-position: -5px -55px
}

.office--doc {
    background-position: -5px -80px
}

.office--image {
    background-position: -5px -105px
}

.office--font {
    background-position: -5px -130px
}

.office--zip {
    background-position: -5px -155px
}

.office--ocr {
    background-position: -5px -180px
}

.office--ebook {
    background-position: -5px -205px
}

.office--unit {
    background-position: -5px -230px
}

.office--youtube {
    background-position: -5px -250px
}

.office--pdfword {
    background-position: -5px -305px
}

.office--wordpdf {
    background-position: -59px -6px
}

.office--mp3 {
    background-position: -30px -5px
}

.office--mp4 {
    background-position: -30px -30px
}

.office--epub {
    background-position: -30px -55px
}

.office--more {
    background-position: -30px -80px
}

.office--avi {
    background-position: -30px -105px
}

.office--mov {
    background-position: -30px -130px
}

.office--3gp {
    background-position: -30px -155px
}

.office--word {
    background-position: -30px -180px
}

.office--excel {
    background-position: -30px -205px
}

.office--powerpoint {
    background-position: -30px -230px
}

.office--aac {
    background-position: -30px -255px
}

.office--aiff {
    background-position: -30px -280px
}

.office--ogg {
    background-position: -30px -305px
}

.office--jpg {
    background-position: -30px -330px
}

.office--png {
    background-position: -30px -355px
}

.office--gif {
    background-position: -30px -380px
}

.office--translate {
    background-position: -30px -430px
}

.office--qrocde {
    background-position: -5px -180px
}

.office--downloader {
    background-position: -5px -205px
}

.office--pdfjpg {
    background-position: -5px -280px
}

.office--pdfpowerpoint {
    background-position: -5px -330px
}

.office--pdfexcel {
    background-position: -5px -355px
}

.office--rotate {
    background-position: -5px -380px
}

.office--compress {
    background-position: -5px -405px
}

.office--unlock {
    background-position: -5px -430px
}

.office--length {
    background-position: -5px -455px
}

.office--weight {
    background-position: -5px -480px
}

.office--area {
    background-position: -30px -455px
}

.office--mergepdf {
    background-position: -5px -505px
}

.office--onlinedown {
    background-position: -30px -480px
}

.office--currency {
    background-position: -30px -505px
}

.office--lang {
    background-position: -30px -155px
}

.office--down {
    background-position: -55px -146px
}

.main-menu .convert-nav li.convertmenu .ico {
    margin: 4px 8px 4px 4px;
    padding-left: 0
}

.office--down {
    width: 8px;
    height: 5px
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

a:active,a:hover {
    outline-width: 0
}

svg:not(:root) {
    overflow: hidden
}

::-webkit-input-placeholder {
    color: inherit;
    opacity: .54
}

:focus {
    outline: none
}

a {
    background: 0 0
}

svg:not(:root) {
    overflow: hidden
}

::-webkit-input-placeholder {
    color: #7d7d7d
}

::-moz-placeholder {
    color: #7d7d7d
}

:-ms-input-placeholder {
    color: #7d7d7d
}

:-moz-placeholder {
    color: #7d7d7d
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

a:active,a:hover {
    outline-width: 0
}

svg:not(:root) {
    overflow: hidden
}

::-webkit-input-placeholder {
    color: inherit;
    opacity: .54
}

a:visited {
    color: #259229;
    outline: none;
    text-decoration: none
}

img {
    margin: 0;
    padding: 0;
    border: 0;
    max-width: 100%
}

a:focus {
    text-decoration: underline
}

ul {
    margin: 0
}

a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}

img {
    border-style: none
}

svg:not(:root) {
    overflow: hidden
}

body ::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    background: 0 0
}


body ::-webkit-scrollbar-thumb {
    background: 0 0
}

a {
    text-decoration: none
}

.icon12 {
    width: 12px;
    height: 12px;
    vertical-align: -.12em;
    margin-left: 5px;
    fill: currentColor;
    overflow: hidden;
    margin-left: 12px
}

.icon16 {
    width: 16px;
    height: 16px;
    vertical-align: -.22em;
    margin-right: 6px;
    fill: currentColor;
    overflow: hidden
}

.icon20 {
    width: 20px;
    height: 20px;
    vertical-align: -.22em;
    margin-right: 12px;
    fill: currentColor;
    overflow: hidden
}

.icon20no {
    width: 20px;
    height: 20px;
    vertical-align: -.36em;
    fill: currentColor;
    overflow: hidden;
    margin-right: 6px
}

.icon24 {
    width: 24px;
    height: 24px;
    vertical-align: -.22em;
    fill: currentColor;
    overflow: hidden;
    margin-right: 5px
}

.office20 {
    width: 20px;
    height: 20px;
    vertical-align: -.22em;
    fill: currentColor;
    overflow: hidden;
    margin: 4px 16px
}

.office28 {
    width: 28px;
    height: 28px;
    vertical-align: -.52em;
    fill: currentColor;
    overflow: hidden;
    margin: auto 10px
}

.icon24no {
    width: 24px;
    height: 24px;
    fill: currentColor;
    overflow: hidden;
    vertical-align: middle
}

.icon20 {
    width: 20px;
    height: 20px;
    vertical-align: -.22em;
    margin-right: 12px;
    fill: currentColor;
    overflow: hidden
}

.icon32icon {
    width: 24px;
    height: 24px;
    vertical-align: -.22em;
    margin-left: 22px;
    margin-top: 22px;
    fill: currentColor;
    overflow: hidden
}

:focus {
    outline: none
}

.officemore {
    border-left: 1px solid transparent;
    border-right: 1px solid transparent
}

.officemore:hover {
    border-left: 1px solid #ffffff21;
    border-right: 1px solid #ffffff21;
    box-shadow: 0 2px 10px rgba(0,0,0,.2)
}

.officemore:hover svg {
    fill: #222
}

.officemore:hover ul svg {
    fill: #161616
}

.office-menu .convert__item--sub ul a:hover svg {
    fill: #4caf50
}


.qrcode.office-menu {
    height: 65px
}[class*=hint--] {
     position: relative;
     display: inline-block
 }[class*=hint--]:before,[class*=hint--]:after {
      position: absolute;
      -webkit-transform: translate3d(0,0,0);
      -moz-transform: translate3d(0,0,0);
      transform: translate3d(0,0,0);
      visibility: hidden;
      opacity: 0;
      z-index: 1000000;
      pointer-events: none;
      -webkit-transition: .3s ease;
      -moz-transition: .3s ease;
      transition: .3s ease;
      -webkit-transition-delay: 0ms;
      -moz-transition-delay: 0ms;
      transition-delay: 0ms
  }[class*=hint--]:hover:before,[class*=hint--]:hover:after {
       visibility: visible;
       opacity: 1
   }[class*=hint--]:hover:before,[class*=hint--]:hover:after {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        transition-delay: 100ms
    }[class*=hint--]:before {
         content: '';
         position: absolute;
         background: 0 0;
         border: 6px solid transparent;
         z-index: 1000001
     }[class*=hint--]:after {
          background: #1b1e24;
          color: #fff;
          padding: 8px 10px;
          font-size: 12px;
          font-family: officefont,sans-serif;
          line-height: 12px;
          font-weight: 400;
          white-space: nowrap
      }[class*=hint--][data-hint]:after {
           content: attr(data-hint);
           padding: 9px;
           border-radius: 3px
       }

.hint--bottom:before {
    border-bottom-color: #1b1e24
}

.hint--left:before {
    border-left-color: #1b1e24
}

.hint--right:before {
    border-right-color: #1b1e24
}

.hint--bottom:before {
    margin-top: -11px
}

.hint--bottom:before,.hint--bottom:after {
    top: 100%;
    left: 50%
}

.hint--bottom:before {
    left: calc(50% - 6px)
}

.hint--bottom:after {
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%)
}

.hint--bottom:hover:before {
    -webkit-transform: translateY(8px);
    -moz-transform: translateY(8px);
    transform: translateY(8px)
}

.hint--bottom:hover:after {
    -webkit-transform: translateX(-50%) translateY(8px);
    -moz-transform: translateX(-50%) translateY(8px);
    transform: translateX(-50%) translateY(8px);
    border-radius: 3px
}

.hint--right:before {
    margin-left: -11px;
    margin-bottom: -6px
}

.hint--right:after {
    margin-bottom: -14px
}

.hint--right:before,.hint--right:after {
    left: 100%;
    bottom: 50%
}

.hint--right:hover:before {
    -webkit-transform: translateX(8px);
    -moz-transform: translateX(8px);
    transform: translateX(8px)
}

.hint--right:hover:after {
    -webkit-transform: translateX(8px);
    -moz-transform: translateX(8px);
    transform: translateX(8px)
}

.hint--left:before {
    margin-right: -11px;
    margin-bottom: -6px
}

.hint--left:after {
    margin-bottom: -14px
}

.hint--left:before,.hint--left:after {
    right: 100%;
    bottom: 50%
}

.hint--left:hover:before {
    -webkit-transform: translateX(-8px);
    -moz-transform: translateX(-8px);
    transform: translateX(-8px)
}

.hint--left:hover:after {
    -webkit-transform: translateX(-8px);
    -moz-transform: translateX(-8px);
    transform: translateX(-8px)
}[class*=hint--]:after {
     box-shadow: 4px 4px 8px rgba(0,0,0,.3)
 }

.searchico {
    line-height: 44px!important;
    border: 1px solid #fff;
    height: 44px!important;
    background-color: #fff;
    border-radius: 50px;
    padding: 0 9px!important
}

.searchico svg {
    vertical-align: -.42em!important
}

.searchico:hover {
    -webkit-box-shadow: 0 0 5px 0 rgba(0,0,0,.1);
    -moz-box-shadow: 0 0 5px 0 rgba(0,0,0,.1);
    box-shadow: 0 0 5px 0 rgba(0,0,0,.1)
}

.main-menu .convert-nav li.convertmenu-all:hover {
    cursor: pointer;
    border-left: 1px solid #ffffff21;
    border-right: 1px solid #ffffff21
}

.myconvertlist {
    font-weight: 400
}

#menuSmall:hover {
    cursor: pointer
}

a {
    background-image: none
}

a {
    background-color: transparent;
    color: #555;
    text-decoration: none
}

a:focus,a:hover {
    color: #ff9800;
    outline: 0;
    text-decoration: underline
}

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

ul {
    padding: 0 0 0 0
}

@media print {
    img {
        page-break-inside: avoid
    }

    *,:after,:before {
        background: 0 0!important;
        box-shadow: none!important;
        text-shadow: none!important
    }

    a,a:visited {
        text-decoration: underline
    }

    a[href]:after {
        content: " ("attr(href) ")"
    }

    a[href^="#"]:after,a[href^="javascript:"]:after {
        content: ""
    }

    img {
        max-width: 100%!important
    }
}

ul {
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0
}/*!CSS Used keyframes*/@-webkit-keyframes scale-in-tr {
                            0% {
                                -webkit-transform: scale(0);
                                transform: scale(0);
                                -webkit-transform-origin: 100% 0%;
                                transform-origin: 100% 0%;
                                opacity: 1
                            }

                            100% {
                                -webkit-transform: scale(1);
                                transform: scale(1);
                                -webkit-transform-origin: 100% 0%;
                                transform-origin: 100% 0%;
                                opacity: 1
                            }
                        }

@keyframes scale-in-tr {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
        opacity: 1
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: 100% 0%;
        transform-origin: 100% 0%;
        opacity: 1
    }
}

.rangeslider,.rangeslider__fill {
    display: block;
    -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.3);
    -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.3);
    box-shadow: inset 0 1px 3px rgba(0,0,0,.3);
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px
}

.rangeslider {
    background: #e6e6e6;
    position: relative
}

.rangeslider--horizontal {
    height: 20px;
    width: 100%;
    margin-top: 40px
}

.rangeslider--vertical {
    width: 20px;
    min-height: 150px;
    max-height: 100%
}

.rangeslider--disabled {
    filter: alpha(opacity=40);
    opacity: .4
}

.rangeslider__fill {
    background: #0f0;
    position: absolute
}

.rangeslider--horizontal .rangeslider__fill {
    top: 0;
    height: 100%
}

.rangeslider--vertical .rangeslider__fill {
    bottom: 0;
    width: 100%
}

.rangeslider__handle {
    background: #fff;
    border: 1px solid #ccc;
    cursor: pointer;
    display: inline-block;
    width: 40px;
    height: 40px;
    position: absolute;
    background-image: url(data:image/svg+xml;
    base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjAiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g);background-size: 100%;
    background-image: -webkit-gradient(linear,50% 0%,50% 100%,color-stop(0%,rgba(255,255,255,0)),color-stop(100%,rgba(0,0,0,0.1)));
    background-image: -moz-linear-gradient(rgba(255,255,255,0),rgba(0,0,0,0.1));
    background-image: -webkit-linear-gradient(rgba(255,255,255,0),rgba(0,0,0,0.1));
    background-image: linear-gradient(rgba(255,255,255,0),rgba(0,0,0,0.1));
    -moz-box-shadow: 0 0 8px rgba(0,0,0,.3);
    -webkit-box-shadow: 0 0 8px rgba(0,0,0,.3);
    box-shadow: 0 0 8px rgba(0,0,0,.3);
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%
}

.rangeslider__handle:after {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: url(data:image/svg+xml;
    base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjEzIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAuMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);background-size: 100%;
    background-image: -webkit-gradient(linear,50% 0%,50% 100%,color-stop(0%,rgba(0,0,0,0.13)),color-stop(100%,rgba(255,255,255,0)));
    background-image: -moz-linear-gradient(rgba(0,0,0,0.13),rgba(255,255,255,0));
    background-image: -webkit-linear-gradient(rgba(0,0,0,0.13),rgba(255,255,255,0));
    background-image: linear-gradient(rgba(0,0,0,0.13),rgba(255,255,255,0));
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%
}

.rangeslider__handle:active {
    background-image: url(data:image/svg+xml;
    base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjEiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==);background-size: 100%;
    background-image: -webkit-gradient(linear,50% 0%,50% 100%,color-stop(0%,rgba(0,0,0,0.1)),color-stop(100%,rgba(0,0,0,0.12)));
    background-image: -moz-linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.12));
    background-image: -webkit-linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.12));
    background-image: linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.12))
}

.rangeslider--horizontal .rangeslider__handle {
    top: -10px;
    touch-action: pan-y;
    -ms-touch-action: pan-y
}

.rangeslider--vertical .rangeslider__handle {
    left: -10px;
    touch-action: pan-x;
    -ms-touch-action: pan-x
}

input[type=range]:focus+.rangeslider .rangeslider__handle {
    -moz-box-shadow: 0 0 8px rgba(255,0,255,.9);
    -webkit-box-shadow: 0 0 8px rgba(255,0,255,.9);
    box-shadow: 0 0 8px rgba(255,0,255,.9)
}

.card-wrap {
    margin-top: 24px;
    margin-bottom: -24px
}

.card-wrap:after,.card-wrap:before {
    content: "";
    display: table;
    line-height: 0
}

.card-wrap:after {
    clear: both
}

.card-wrap .card {
    margin-top: 0
}

.content-header {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 30px;
    padding-top: 100px;
    flex: 0 1 auto
}

.page-brand .content-header {
    background-color: #fff
}


.ui-card-pre {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.ui-footer {
    border-top: 1px solid rgba(0,0,0,.12);
    text-align: center;
    padding-top: 0;
    padding-bottom: 0;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0
}

.ui-tab-tab {
    margin-top: 10px
}

audio,label {
    display: inline-block;
    max-width: 100%
}

.qrcode_w {
    color: #228826!important
}

audio,label,video {
    max-width: 100%
}

body,legend {
    color: #212121;
    padding: 0
}

a,body {
    background-image: none
}

audio,sub,sup {
    vertical-align: baseline
}

body,fieldset,legend,td,th {
    padding: 0
}

.container:after,.row:after {
    clear: both
}

.waves-effect,html {
    position: relative;
    -webkit-tap-highlight-color: transparent
}

.col-xx-1,.col-xx-10,.col-xx-11,.col-xx-12,.col-xx-2,.col-xx-3,.col-xx-4,.col-xx-5,.col-xx-6,.col-xx-7,.col-xx-8,.col-xx-9,.pull-left {
    float: left
}

.text-nowrap,.text-overflow {
    white-space: nowrap
}

.container:after,.container:before,.row:after,.row:before {
    content: "";
    display: table;
    line-height: 0
}

.btn,.picker {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.text-break,pre {
    word-break: break-all
}

.picker__table,table {
    border-collapse: collapse;
    border-spacing: 0
}

.breadcrumb,.dropdown-menu,.nav {
    list-style: none
}

@-ms-viewport {
    width:device-width
}

article,aside,footer,header,nav,section {
    display: block
}


svg:not(:root) {
    overflow: hidden
}[hidden],template {
     display: none
 }

video {
    display: block
}

button,input,optgroup,select,textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

address,dd,dt,li {
    line-height: 20px;
    list-style: none
}

button,input[type=button],input[type=reset],input[type=submit] {
    cursor: pointer;
    -webkit-appearance: button
}

button,select {
    text-transform: none
}

button {
    overflow: visible
}

button[disabled],input[disabled] {
    cursor: default
}

button::-moz-focus-inner,input::-moz-focus-inner {
    border: 0;
    padding: 0
}

fieldset {
    border: 0;
    margin: 0;
    min-width: 0
}

fieldset~fieldset {
    margin-top: 24px
}

dd,label {
    margin: 0
}

address,dl {
    margin: 12px 0
}

input {
    line-height: normal
}

input[type=checkbox],input[type=radio] {
    line-height: normal;
    margin: 4px 0 0;
    padding: 0
}

input[type=color] {
    min-width: 20px;
    width: auto
}

input[type=time],input[type=date],input[type=datetime-local],input[type=month] {
    line-height: 20px;
    line-height: 1\9
}

input[type=file] {
    display: block;
    height: auto;
    line-height: 1;
    min-height: 36px;
    padding-top: 8px;
    padding-bottom: 8px
}

input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=range] {
    display: block;
    height: 36px;
    width: 100%
}

input[type=search] {
    box-sizing: border-box;
    -webkit-appearance: none
}

input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

label {
    float: right;
    padding-top: 6px;
    padding-right: 16px
}

.hr,hr,legend {
    border: 0;
    display: block
}

legend {
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    margin: 0 0 12px;
    width: 100%
}

b,dt,optgroup,strong {
    font-weight: 500
}

select[multiple],select[size] {
    height: auto
}

textarea {
    overflow: auto
}

.close {
    padding: 2px 6px!important
}

.del {
    padding: 8px 40px!important;
    display: inline-block!important;
    border-radius: 40px;
    background-color: #ff9800
}

.paddingright {
    text-align: right;
    padding-right: 10px!important;
    z-index: 222
}

a {
    background-color: transparent;
    color: #555;
    text-decoration: none
}

a:focus,a:hover {
    color: #ff9800;
    outline: 0;
    text-decoration: none
}

abbr {
    border-bottom: 1px dashed rgba(0,0,0,.12);
    cursor: help
}

address {
    font-size: 14px;
    font-style: normal;
    font-weight: 400
}

blockquote,q {
    font-size: 20px;
    font-style: italic;
    font-weight: 300;
    line-height: 28px;
    margin: 24px 0;
    padding-right: 32px;
    padding-left: 32px;
    position: relative
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
    color: inherit;
    font-family: officefont,Arial,sans-serif;
    font-weight: 300;
    margin-top: 0;
    margin-bottom: 12px
}

.h1,h1 {
    font-size: 33px;
    line-height: 48px
}

.h2,h2 {
    font-size: 34px;
    line-height: 40px
}

.h3,h3 {
    font-size: 24px;
    line-height: 32px
}

.h4,h4 {
    font-size: 20px;
    line-height: 28px
}

.h5,h5 {
    font-size: 14px;
    line-height: 24px
}

.h6,h6 {
    font-size: 12px;
    line-height: 20px
}

.h1 small,.h2 small,.h3 small,.h4 small,h1 small,h2 small,h3 small,h4 small {
    font-size: 14px
}

.hr,hr {
    border-top: 1px solid rgba(0,0,0,.12);
    box-sizing: content-box;
    height: 0;
    margin-top: 24px;
    margin-bottom: 24px
}

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

ol,ul {
    padding: 0 0 0 0
}

ol ol,ol ul,ul ol,ul ul {
    margin-top: 0;
    margin-bottom: 0
}

small {
    font-size: 75%;
    line-height: 1
}

sub,sup {
    font-size: 80%;
    line-height: 0;
    position: relative
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

th {
    text-align: left
}

.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-xs-1,.col-xs-10,.col-xs-11,.col-xs-12,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xx-1,.col-xx-10,.col-xx-11,.col-xx-12,.col-xx-2,.col-xx-3,.col-xx-4,.col-xx-5,.col-xx-6,.col-xx-7,.col-xx-8,.col-xx-9 {
    min-height: 1px;
    position: relative;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 2px
}

.col-xx-1 {
    width: 8.33333%
}

.col-xx-2 {
    width: 16.66667%
}


.col-xx-3 {
    width: 25%
}

.col-xx-4 {
    width: 33.33333%
}

.col-xx-5 {
    width: 41.66667%
}

.col-xx-6 {
    width: 50%
}

.col-xx-7 {
    width: 58.33333%
}

.col-xx-8 {
    width: 66.66667%
}

.col-xx-9 {
    width: 100%
}

.col-xx-10 {
    width: 83.33333%
}

.col-xx-11 {
    width: 91.66667%
}

.col-xx-12 {
    width: 100%
}

.col-xx-offset-0 {
    margin-left: 0
}

.col-xx-offset-1 {
    margin-left: 8.33333%
}

.col-xx-offset-2 {
    margin-left: 16.66667%
}

.col-xx-offset-3 {
    margin-left: 25%
}

.col-xx-offset-4 {
    margin-left: 33.33333%
}

.col-xx-offset-5 {
    margin-left: 41.66667%
}

.col-xx-offset-6 {
    margin-left: 50%
}

.col-xx-offset-7 {
    margin-left: 58.33333%
}

.col-xx-offset-8 {
    margin-left: 66.66667%
}

.col-xx-offset-9 {
    margin-left: 75%
}

.col-xx-offset-10 {
    margin-left: 83.33333%
}

.col-xx-offset-11 {
    margin-left: 91.66667%
}

.col-xx-offset-12 {
    margin-left: 100%
}

.col-xx-pull-0 {
    right: 0
}

.col-xx-pull-1 {
    right: 8.33333%
}

.col-xx-pull-2 {
    right: 16.66667%
}

.col-xx-pull-3 {
    right: 25%
}

.col-xx-pull-4 {
    right: 33.33333%
}

.col-xx-pull-5 {
    right: 41.66667%
}

.col-xx-pull-6 {
    right: 50%
}

.col-xx-pull-7 {
    right: 58.33333%
}

.col-xx-pull-8 {
    right: 66.66667%
}

.col-xx-pull-9 {
    right: 75%
}

.col-xx-pull-10 {
    right: 83.33333%
}

.col-xx-pull-11 {
    right: 91.66667%
}

.col-xx-pull-12 {
    right: 100%
}

.col-xx-push-0 {
    left: 0
}

.col-xx-push-1 {
    left: 8.33333%
}

.col-xx-push-2 {
    left: 16.66667%
}

.col-xx-push-3 {
    left: 25%
}

.col-xx-push-4 {
    left: 33.33333%
}

.col-xx-push-5 {
    left: 41.66667%
}

.col-xx-push-6 {
    left: 50%
}

.col-xx-push-7 {
    left: 58.33333%
}

.col-xx-push-8 {
    left: 66.66667%
}

.col-xx-push-9 {
    left: 75%
}

.col-xx-push-10 {
    left: 83.33333%
}

.col-xx-push-11 {
    left: 91.66667%
}

.col-xx-push-12 {
    left: 100%
}

.content-header {
    padding-top: 100px
}

#resetAll {
    cursor: pointer;
    border-radius: 40px;
    margin-left: 10px;
    background-color: #f4f4f4
}


    .hidden-phone {
        display: block
    }

    .col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9 {
        float: left
    }

    .col-lg-1 {
        width: 8.33333%
    }

    .col-lg-2 {
        width: 16.66667%
    }

    .col-lg-3 {
        width: 30%
    }

    .col-lg-4 {
        width: 33.33333%
    }

    .col-lg-5 {
        width: 41.66667%
    }

    .col-lg-6 {
        width: 50%
    }

    .col-lg-7 {
        width: 58.33333%
    }

    .col-lg-8 {
        width: 66.66667%
    }

    .col-lg-9 {
        width: 75%
    }

    .col-lg-10 {
        width: 83.33333%
    }

    .col-lg-11 {
        width: 91.66667%
    }

    .col-lg-12 {
        width: 100%
    }

    .col-lg-offset-0 {
        margin-left: 0
    }

    .col-lg-offset-1 {
        margin-left: 8.33333%
    }

    .col-lg-offset-2 {
        margin-left: 16.66667%
    }

    .col-lg-offset-3 {
        margin-left: 25%
    }

    .col-lg-offset-4 {
        margin-left: 33.33333%
    }

    .col-lg-offset-5 {
        margin-left: 41.66667%
    }

    .col-lg-offset-6 {
        margin-left: 50%
    }

    .col-lg-offset-7 {
        margin-left: 58.33333%
    }

    .col-lg-offset-8 {
        margin-left: 66.66667%
    }

    .col-lg-offset-9 {
        margin-left: 75%
    }

    .col-lg-offset-10 {
        margin-left: 83.33333%
    }

    .col-lg-offset-11 {
        margin-left: 91.66667%
    }

    .col-lg-offset-12 {
        margin-left: 100%
    }

    .col-lg-pull-0 {
        right: 0
    }

    .col-lg-pull-1 {
        right: 8.33333%
    }

    .col-lg-pull-2 {
        right: 16.66667%
    }

    .col-lg-pull-3 {
        right: 25%
    }

    .col-lg-pull-4 {
        right: 33.33333%
    }

    .col-lg-pull-5 {
        right: 41.66667%
    }

    .col-lg-pull-6 {
        right: 50%
    }

    .col-lg-pull-7 {
        right: 58.33333%
    }

    .col-lg-pull-8 {
        right: 66.66667%
    }

    .col-lg-pull-9 {
        right: 75%
    }

    .col-lg-pull-10 {
        right: 83.33333%
    }

    .col-lg-pull-11 {
        right: 91.66667%
    }

    .col-lg-pull-12 {
        right: 100%
    }

    .col-lg-push-0 {
        left: 0
    }

    .col-lg-push-2 {
        left: 16.66667%
    }

    .col-lg-push-3 {
        left: 25%
    }

    .col-lg-push-4 {
        left: 33.33333%
    }

    .col-lg-push-5 {
        left: 41.66667%
    }

    .col-lg-push-6 {
        left: 50%
    }

    .col-lg-push-7 {
        left: 58.33333%
    }

    .col-lg-push-8 {
        left: 66.66667%
    }

    .col-lg-push-9 {
        left: 75%
    }

    .col-lg-push-10 {
        left: 83.33333%
    }

    .col-lg-push-11 {
        left: 91.66667%
    }

    .col-lg-push-12 {
        left: 100%
    }



@media only screen and (min-width:1440px) {

    .row-clear>.col-lg-2:nth-child(6n+1),.row-clear>.col-lg-3:nth-child(4n+1),.row-clear>.col-lg-4:nth-child(3n+1),.row-clear>.col-lg-6:nth-child(2n+1) {
        clear: left
    }
}

@media only screen and (min-width:2040px) {


}

.container-full {
    max-width: none
}

.row {
    margin-right: -16px;
    margin-left: -16px
}

.breadcrumb:after,.card-action:after,.card-wrap:after,.clearfix:after,.dropdown-wrap:after,.fbtn,.header:after,.nav:after,.no-flexbox .card-header:after,.no-flexbox .card:after,.no-flexbox .menu-top-user:after,.no-flexbox .tile:after,.no-flexbox div[data-toggle=tile]:after,.picker__footer,.snackbar-inner:after,.tile-action:after,.tile-footer:after,.tile-sub:after {
    clear: both
}

.row-relative {
    position: relative
}

.btn,kbd kbd {
    font-weight: 500
}

.icon-2x {
    font-size: 2em
}

.icon-3x {
    font-size: 3em
}

.icon-4x {
    font-size: 4em
}

.icon-5x {
    font-size: 5em
}

.icon-lg {
    font-size: 1.4em;
    vertical-align: -20%
}

.waves-button,.waves-circle {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.waves-effect {
    overflow: hidden
}

.waves-effect .waves-ripple {
    background-color: rgba(0,0,0,.1);
    background-image: radial-gradient(rgba(0,0,0,.1) 0,rgba(0,0,0,.2) 30%,rgba(0,0,0,.3) 40%,rgba(0,0,0,.4) 50%,rgba(255,255,255,0) 60%);
    border-radius: 50%;
    height: 100px;
    margin-top: -50px;
    margin-left: -50px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    -webkit-transform: scale(0) translate(0,0);
    -ms-transform: scale(0) translate(0,0);
    transform: scale(0) translate(0,0);
    transition: all .9s cubic-bezier(.4,0,.2,1);
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform;
    width: 100px
}

.waves-effect.waves-light .waves-ripple {
    background-color: rgba(255,255,255,.4);
    background-image: radial-gradient(rgba(255,255,255,.1) 0,rgba(255,255,255,.2) 30%,rgba(255,255,255,.3) 40%,rgba(255,255,255,.4) 50%,rgba(255,255,255,0) 60%)
}

.waves-notransition {
    transition: none!important
}

@media print {
    blockquote,img,pre,tr {
        page-break-inside: avoid
    }

    *,:after,:before {
        background: 0 0!important;
        box-shadow: none!important;
        text-shadow: none!important
    }

    a,a:visited {
        text-decoration: underline
    }

    a[href]:after {
        content: " (" attr(href) ")"
    }

    a[href^="#"]:after,a[href^="javascript:"]:after {
        content: ""
    }

    abbr[title]:after {
        content: " (" attr(title) ")"
    }

    blockquote,pre {
        border: 1px solid #dadada
    }

    img {
        max-width: 100%!important
    }

    h2,h3,p {
        orphans: 3;
        widows: 3
    }

    h2,h3 {
        page-break-after: avoid
    }

    thead {
        display: table-header-group
    }

    .card,.card-img,.card-side {
        border-radius: 0!important
    }

    .card,.tile {
        border: 1px solid #dadada
    }

    .fbtn-container,.menu,.menu-toggle {
        display: none!important
    }



    .tab-nav .nav>li.active>a {
        border-bottom: 3px solid #dadada;
        padding-bottom: 7px
    }
}

.modal-content,.picker__box {
    background-clip: padding-box;
    outline: 0
}

.visible-print-block {
    display: none!important
}

@media print {
    .visible-print-block {
        display: block!important
    }
}

.visible-print-inline {
    display: none!important
}

@media print {
    .visible-print-inline {
        display: inline!important
    }
}

.visible-print-inline-block {
    display: none!important
}

@media print {
    .visible-print-inline-block {
        display: inline-block!important
    }

    .hidden-print {
        display: none!important
    }
}

.access-hide {
    border: 0;
    clip: rect(0,0,0,0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.access-hide.focusable:active,.access-hide.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
}

.collapsible-region,.collapsing,.media,.media-inner {
    overflow: hidden
}

.btn,.collapsing,.el-loading,.fbtn {
    position: relative
}

.clearfix:after,.clearfix:before {
    content: "";
    display: table;
    line-height: 0
}

.collapse {
    display: none
}

.collapse.in {
    display: block
}

.collapsed-hide {
    display: inline
}

.collapsed .collapsed-hide,.collapsed-show {
    display: none
}

.collapsed .collapsed-show {
    display: inline
}

.collapsing {
    height: 0;
    transition: height .3s cubic-bezier(.4,0,.2,1)
}

body.el-loading {
    position: static
}

.el-loading-indicator {
    font-family: sans-serif!important;
    height: 0;
    min-height: 4px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    width: 0;
    z-index: 2
}

.el-loading>.el-loading-indicator {
    background-color: #fff;
    height: 100%;
    opacity: 1;
    padding: 20px 16px;
    width: 100%
}

.el-loading-done>.el-loading-indicator {
    height: 0;
    opacity: 0;
    padding: 0;
    transition: height 0s .3s,opacity .3s cubic-bezier(.4,0,.2,1),padding 0s .3s,width 0s .3s;
    width: 0
}

.el-loading-indicator-fixed {
    position: fixed;
    z-index: 41
}

.el-loading-indicator-linear {
    padding: 0!important
}

.fade {
    opacity: 0;
    transition: opacity .3s cubic-bezier(.4,0,.2,1)
}

.fade.in {
    opacity: 1
}

.iframe-seamless {
    border: 0;
    display: block;
    height: 100%;
    margin: 0;
    padding: 0;
    width: 100%
}

.img-responsive {
    display: block;
    height: auto;
    max-width: 100%;
    width: 100%\9
}

.list-clear,.list-inline {
    list-style: none;
    padding-left: 0
}

.list-inline {
    margin-left: -8px
}

.list-inline>li {
    display: inline-block;
    padding-right: 8px;
    padding-left: 8px
}

.margin-bottom {
    margin-bottom: 24px!important
}

.margin-bottom-lg {
    margin-bottom: 48px!important
}

.margin-bottom-no {
    margin-bottom: 0!important
}

.margin-bottom-sm {
    margin-bottom: 12px!important
}

.margin-bottom-xs {
    margin-bottom: 8px!important
}

.margin-left {
    margin-left: 16px!important
}

.margin-left-lg {
    margin-left: 32px!important
}

.margin-left-no {
    margin-left: 0!important
}

.margin-left-sm {
    margin-left: 8px!important
}

.margin-left-xs {
    margin-left: 4px!important
}

.margin-no {
    margin: 0!important
}

.avatar.pull-right,.media-object.pull-right {
    margin-left: 16px
}

.margin-right {
    margin-right: 16px!important
}

.margin-right-lg {
    margin-right: 32px!important
}

.margin-right-no {
    margin-right: 0!important
}

.margin-right-sm {
    margin-right: 8px!important
}

.margin-right-xs {
    margin-right: 4px!important
}

.avatar.pull-left,.media-object.pull-left {
    margin-right: 16px
}

.margin-top {
    margin-top: 24px!important
}

.margin-top-lg {
    margin-top: 48px!important
}

.margin-top-no {
    margin-top: 0!important;
    margin-bottom: 0
}

.margin-top-sm {
    margin-top: 12px!important
}

.margin-top-xs {
    margin-top: 8px!important
}

.modal-scrollbar-measure {
    height: 50px;
    overflow: scroll;
    position: absolute;
    top: -99999px;
    width: 50px
}

.fbtn-dropdown,.no-overflow,.text-overflow {
    overflow: hidden
}

.p {
    display: block;
    margin-top: 8px;
    margin-bottom: 8px
}

.padding-bottom {
    padding-bottom: 24px!important
}

.padding-bottom-lg {
    padding-bottom: 48px!important
}

.padding-bottom-no {
    padding-bottom: 0!important
}

.padding-bottom-sm {
    padding-bottom: 12px!important
}

.padding-bottom-xs {
    padding-bottom: 8px!important
}

.padding-left {
    padding-left: 16px!important
}

.padding-left-lg {
    padding-left: 32px!important
}

.padding-left-no {
    padding-left: 0!important
}

.padding-left-sm {
    padding-left: 8px!important
}

.padding-left-xs {
    padding-left: 4px!important
}

.padding-no {
    padding: 0!important
}

.padding-right {
    padding-right: 16px!important
}

.padding-right-lg {
    padding-right: 32px!important
}

.padding-right-no {
    padding-right: 0!important
}

.padding-right-sm {
    padding-right: 8px!important
}

.padding-right-xs {
    padding-right: 4px!important
}

.padding-top {
    padding-top: 24px!important
}

.padding-top-lg {
    padding-top: 48px!important
}

.padding-top-no {
    padding-top: 0!important
}

.padding-top-sm {
    padding-top: 12px!important
}

.padding-top-xs {
    padding-top: 8px!important
}

.pull-none {
    float: none!important
}

.pull-right {
    float: right
}

.text-break {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto
}

.text-overflow {
    display: block;
    line-height: inherit;
    text-overflow: ellipsis
}

.text-center {
    text-align: center
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.text-black {
    color: #212121
}

.text-black-divider {
    color: #dadada
}

.text-black-hint {
    color: #9a9a9a
}

.text-black-sec {
    color: #727272
}

.text-white {
    color: #fff
}

.text-white-divider {
    color: #3c3c3c
}

.text-white-hint {
    color: #646464
}

.text-white-sec {
    color: #bcbcbc
}

.text-brand {
    color: #3f51b5
}

.text-brand-accent {
    color: #4caf50
}

.text-green {
    color: #4caf50
}

.text-orange {
    color: #ff9800
}

.text-red {
    color: #f44336
}

.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block,.visible-xx-block,.visible-xx-inline,.visible-xx-inline-block {
    display: none!important
}

.avatar,.avatar .fa {
    display: block;
    text-align: center
}

.avatar {
    background-color: rgba(154,154,154,.18);
    border-radius: 50%;
    color: inherit;
    height: 40px;
    line-height: 40px;
    width: 40px
}

.avatar[href]:focus,.avatar[href]:hover {
    color: inherit;
    text-decoration: none
}

.avatar-brand,.avatar-brand-accent:focus,.avatar-brand-accent:hover,.avatar-brand:focus,.avatar-brand:hover {
    color: #fff
}

.card-header-side>.avatar:first-child,.tile-side>.avatar:first-child {
    margin-top: -10px
}

.card-header-side>.avatar:last-child,.tile-side>.avatar:last-child {
    margin-bottom: -10px
}

.nav .a>.avatar,.nav a>.avatar {
    margin-top: -10px;
    margin-bottom: -10px
}

.avatar img {
    height: 100%;
    vertical-align: top;
    width: 100%
}

.avatar .fa {
    height: 100%;
    line-height: inherit
}

.avatar .fa-text {
    font-family: inherit
}

.avatar-brand {
    background-color: #3f51b5
}

.avatar-brand-accent {
    background-color: #4caf50;
    color: #fff
}

.avatar-green,.avatar-green:focus,.avatar-green:hover,.avatar-orange,.avatar-orange:focus,.avatar-orange:hover {
    color: rgba(0,0,0,.87)
}

.avatar-green {
    background-color: #4caf50
}

.avatar-orange {
    background-color: #ff9800
}

.avatar-red {
    background-color: #f44336;
    color: #fff
}

.avatar-red:focus,.avatar-red:hover {
    color: #fff
}

.avatar-lg {
    height: 80px;
    line-height: 80px;
    width: 80px
}

.avatar-sm {
    height: 32px;
    line-height: 32px;
    width: 32px
}

.card-header-side>.avatar-sm:first-child,.tile-side>.avatar-sm:first-child {
    margin-top: -6px
}

.card-header-side>.avatar-sm:last-child,.tile-side>.avatar-sm:last-child {
    margin-bottom: -6px
}

.nav .a>.avatar-sm,.nav a>.avatar-sm {
    margin-top: -6px;
    margin-bottom: -6px
}

.avatar-xs {
    font-size: 12px;
    height: 20px;
    line-height: 20px;
    width: 20px
}

.avatar-inline {
    display: inline-block
}

.breadcrumb {
    margin: 24px 0;
    padding: 0
}

.breadcrumb:after,.breadcrumb:before {
    content: "";
    display: table;
    line-height: 0
}

.card-inner .collapsible-region {
    margin-top: 10px
}

.btn,.fbtn-text {
    line-height: 20px;
    white-space: nowrap
}

.breadcrumb>li {
    display: block;
    float: left
}

.breadcrumb>li+li:before {
    color: rgba(0,0,0,.54);
    content: "chevron_right";
    display: inline-block;
    margin-left: .4em
}

.breadcrumb>.active {
    color: rgba(0,0,0,.87)
}

.breadcrumb>.active>.a,.breadcrumb>.active>a {
    color: rgba(0,0,0,.87);
    cursor: text;
    text-decoration: none
}

.btn {
    background-color: rgba(154,154,154,.18);
    background-image: none;
    background-position: 50% 50%;
    background-size: 100% 100%;
    border: 0;
    color: inherit;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    margin-bottom: 0;
    max-width: 100%;
    padding: 10px 18px;
    text-align: center;
    text-transform: uppercase;
    transition: background-color .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1);
    user-select: none;
    vertical-align: middle;
    font-weight: 300
}

.fbtn,.fbtn-ori,.fbtn-sub {
    transition: all .3s cubic-bezier(.4,0,.2,1)
}

.btn:active,.btn:focus,.btn:hover {
    color: inherit;
    outline: 0;
    text-decoration: none
}

.btn:active,.btn:focus {
}

.btn:active {
    background-color: rgba(154,154,154,.36)
}

.btn.disabled,.btn[disabled],fieldset[disabled] .btn {
    box-shadow: none!important;
    cursor: not-allowed;
    opacity: .78
}

.dropdown [data-toggle=dropdown],.fbtn {
    cursor: pointer
}

.btn.disabled .waves-ripple,.btn[disabled] .waves-ripple,fieldset[disabled] .btn .waves-ripple {
    display: none
}

.btn-brand,.btn-brand:active,.btn-brand:focus,.btn-brand:hover {
    background-color: #3f51b5;
    color: #fff
}

.btn-brand-accent,.btn-brand-accent:active,.btn-brand-accent:focus,.btn-brand-accent:hover {
    background-color: #4caf50;
    color: #fff
}

.btn-green,.btn-green:active,.btn-green:focus,.btn-green:hover {
    background-color: #228826;
    color: rgba(255,255,255,.87);
    line-height: 14px
}

.btn-green {
    border-radius: 3px;
    padding: 10px 24px
}

.pin-panel {
    margin: 18px
}

#doc_tile_example_9 .form-group-label {
    margin: 0 20px
}

.btn-orange,.btn-orange:active,.btn-orange:focus,.btn-orange:hover {
    background-color: #228826;
    color: rgba(0,0,0,.87);
    border-radius: 40px
}

.btn-red,.btn-red:active,.btn-red:focus,.btn-red:hover {
    color: #fff;
    border-radius: 30px;
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(244,2,6) 100%);
    box-shadow: 0 2px 5px 0 rgba(113,113,113,.51)
}

#MakeBarCode {
    float: right;
    color: #fff;
    padding: 10px 18px;
    border-radius: 40px;
    line-height: 20px;
    margin-right: 10px;
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(244,2,6) 100%);
    box-shadow: rgba(113,113,113,.51) 0 2px 5px 0;
    cursor: pointer
}

#MakeBarCode:hover {
    background-image: linear-gradient(135deg,rgb(0,162,69) 0%,rgb(3,130,62) 100%);
    box-shadow: 0 2px 5px 0 #9fdcb9
}

.btn-block {
    display: block;
    white-space: normal;
    width: 100%
}

.btn-flat {
    background-color: transparent;
    box-shadow: none
}

.btn-flat:active,.btn-flat:focus,.btn-flat:hover {
    background-color: rgba(154,154,154,.18);
    box-shadow: none
}

.btn-flat:active {
    background-color: rgba(154,154,154,.36)
}

.btn-flat.disabled,.btn-flat[disabled],fieldset[disabled] .btn-flat {
    background-color: transparent!important
}

.btn-flat.btn-brand {
    color: #000;
    margin-top: -8px;
    border-radius: 8px;
    padding: 10px 12px
}

.btn-flat.btn-brand[disabled],fieldset[disabled] .btn-flat.btn-brand {
    color: #7986cb
}

.btn-flat.btn-brand-accent {
    color: #4caf50
}

.btn-flat.btn-brand-accent[disabled],fieldset[disabled] .btn-flat.btn-brand-accent {
    color: #ff80ab
}

.btn-flat.btn-green {
    color: #4caf50
}

.btn-flat.btn-green[disabled],fieldset[disabled] .btn-flat.btn-green {
    color: #81c784
}

.btn-flat.btn-orange {
    color: #ff9800
}

.btn-flat.btn-orange[disabled],fieldset[disabled] .btn-flat.btn-orange {
    color: #ffb74d
}

.btn-flat.btn-red {
    color: #f44336
}

.btn-flat.btn-red[disabled],fieldset[disabled] .btn-flat.btn-red {
    color: #e57373
}

.fbtn,.fbtn:active,.fbtn:focus,.fbtn:hover {
    color: #212121
}

.fbtn {
    background-color: #f5f5f5;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0,0,0,.15),0 1px 3px 1px rgba(0,0,0,.3);
    display: block;
    font-size: 20px;
    height: 40px;
    margin: 12px auto;
    padding: 10px 0;
    text-align: center;
    transition-property: background-color,box-shadow,color,opacity,-webkit-transform;
    transition-property: background-color,box-shadow,color,opacity,transform;
    transition-property: background-color,box-shadow,color,opacity,transform,-webkit-transform;
    width: 40px
}

.card,.fbtn-text {
}

.fbtn:active,.fbtn:focus {
    box-shadow: 0 1px 3px rgba(0,0,0,.15),0 1px 3px 1px rgba(0,0,0,.3),0 6px 9px rgba(0,0,0,.15)
}

.fbtn:active {
    background-color: #eee
}

.fbtn-brand,.fbtn-brand:active,.fbtn-brand:focus,.fbtn-brand:hover {
    background-color: #3f51b5;
    color: #fff
}

.fbtn-brand:active {
    background-color: #303f9f;
    color: #fff
}

.fbtn-brand-accent,.fbtn-brand-accent:active,.fbtn-brand-accent:focus,.fbtn-brand-accent:hover {
    background-color: #4caf50;
    color: #fff
}

.fbtn-brand-accent:active {
    background-color: #f50057;
    color: #fff
}

.fbtn-green,.fbtn-green:active,.fbtn-green:focus,.fbtn-green:hover {
    background-color: #4caf50;
    color: rgba(0,0,0,.87)
}

.fbtn-green:active {
    background-color: #388e3c;
    color: #fff
}

.fbtn-orange,.fbtn-orange:active,.fbtn-orange:focus,.fbtn-orange:hover {
    background-color: #ff9800;
    color: rgba(0,0,0,.87)
}

.fbtn-orange:active {
    background-color: #f57c00;
    color: rgba(0,0,0,.87)
}

.fbtn-red,.fbtn-red:active,.fbtn-red:focus,.fbtn-red:hover {
    background-color: #f44336;
    color: #fff
}

.fbtn-red:active {
    background-color: #d32f2f;
    color: #fff
}

.fbtn-lg {
    height: 56px;
    padding-top: 18px;
    padding-bottom: 18px;
    width: 56px
}

.fbtn-lg .fbtn-sub {
    top: 18px
}

.fbtn-lg~.fbtn-dropdown {
    min-width: 88px
}

.fbtn-container {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: fixed;
    right: 16px;
    bottom: 12px;
    transition: margin-bottom .3s cubic-bezier(.4,0,.2,1),right .3s cubic-bezier(.4,0,.2,1);
    z-index: 21
}

.modal,.picker__holder {
    -webkit-backface-visibility: hidden
}

.fbtn-dropdown {
    max-height: 0;
    padding-right: 16px;
    padding-left: 16px;
    position: absolute;
    right: -16px;
    bottom: 100%;
    transition: max-height 0s .5s
}

.fbtn-inner.open .fbtn-dropdown {
    max-height: 99999px;
    overflow: visible;
    transition: max-height 0s
}

.card-img,.card-side.card-side-img,.fbtn-text,.no-flexbox .card-header-side+.card-inner,.no-flexbox .card-side~.card-main,.no-flexbox .tile-side+.card-inner,.picker__box {
    overflow: hidden
}

.fbtn-dropdown .fbtn {
    opacity: 0;
    -webkit-transform: scale(.5,.5);
    -ms-transform: scale(.5,.5);
    transform: scale(.5,.5)
}

.fbtn-dropdown .fbtn:nth-last-child(1) {
    transition-delay: .3s
}

.fbtn-dropdown .fbtn:nth-last-child(2) {
    transition-delay: 250ms
}

.fbtn-dropdown .fbtn:nth-last-child(3) {
    transition-delay: .2s
}

.fbtn-dropdown .fbtn:nth-last-child(4) {
    transition-delay: 150ms
}

.fbtn-dropdown .fbtn:nth-last-child(5) {
    transition-delay: .1s
}

.fbtn-dropdown .fbtn:nth-last-child(6) {
    transition-delay: 50ms
}

.fbtn-inner.open .fbtn-dropdown .fbtn {
    opacity: 1;
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1);
    transition-delay: .3s
}

.fbtn-inner.open .fbtn-dropdown .fbtn:nth-last-child(1) {
    transition-delay: 0s
}

.fbtn-inner.open .fbtn-dropdown .fbtn:nth-last-child(2) {
    transition-delay: 50ms
}

.fbtn-inner.open .fbtn-dropdown .fbtn:nth-last-child(3) {
    transition-delay: .1s
}

.fbtn-inner.open .fbtn-dropdown .fbtn:nth-last-child(4) {
    transition-delay: 150ms
}

.fbtn-inner.open .fbtn-dropdown .fbtn:nth-last-child(5) {
    transition-delay: .2s
}

.fbtn-inner.open .fbtn-dropdown .fbtn:nth-last-child(6) {
    transition-delay: 250ms
}

.fbtn-inner {
    position: relative
}

.fbtn-ori,.fbtn-sub {
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform
}

.breadcrumb>li+li.fbtn-ori:before,.breadcrumb>li+li.fbtn-sub:before,.fbtn-ori.icon,.fbtn-sub.icon {
    vertical-align: bottom
}

.fbtn-inner.open .fbtn-ori {
    opacity: 0;
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg)
}

.fbtn-rotate {
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform
}

.fbtn-inner.open .fbtn-rotate {
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg)
}

.fbtn-sub {
    margin-left: -10px;
    opacity: 0;
    position: absolute;
    top: 10px;
    left: 50%;
    text-align: center;
    -webkit-transform: rotate(-225deg);
    -ms-transform: rotate(-225deg);
    transform: rotate(-225deg);
    width: 20px
}

.fbtn-inner.open .fbtn-sub {
    opacity: 1;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0)
}

.fbtn-text {
    background-color: rgba(0,0,0,.87);
    color: #fff;
    font-size: 12px;
    height: 0;
    margin-top: -12px;
    margin-right: 16px;
    opacity: 0;
    padding-right: 8px;
    padding-left: 8px;
    position: absolute;
    top: 50%;
    right: 100%;
    transition: opacity .3s cubic-bezier(.4,0,.2,1);
    width: 0
}

.card,.card-header,.card-img {
    position: relative
}

.no-touch .fbtn:hover>.fbtn-text,.touch .fbtn-text {
    opacity: 1;
    padding-top: 2px;
    padding-bottom: 2px;
    width: auto;
    height: auto
}

.touch .fbtn-text {
    display: none
}

.card,.touch .fbtn-inner.open .fbtn-text {
    display: block
}

.card {
    background-color: #fff;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0;
    transition: box-shadow .3s cubic-bezier(.4,0,.2,1)
}

.What_is_a_QR_Code {
    background-color: #fff;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-top: 24px;
    margin-bottom: 24px;
    transition: box-shadow .3s cubic-bezier(.4,0,.2,1)
}

.card-action:after,.card-action:before,.no-flexbox .card:after,.no-flexbox .card:before,.tile-action:after,.tile-action:before {
    display: table;
    line-height: 0;
    content: ""
}

.card:focus,.card:hover {
    text-decoration: none
}

.card-wrap .card {
    margin-top: 0
}

.card-brand {
    background-color: #3f51b5;
    color: #fff
}

.card-brand a,.card-brand a:focus,.card-brand a:hover {
    color: inherit
}

.card-brand-accent {
    background-color: #4caf50;
    color: #fff
}

.card-brand-accent a,.card-brand-accent a:focus,.card-brand-accent a:hover {
    color: inherit
}

.card-green {
    background-color: #4caf50;
    color: rgba(0,0,0,.87)
}

.card-green a,.card-green a:focus,.card-green a:hover {
    color: inherit
}

.card-orange {
    background-color: #ff9800;
    color: rgba(0,0,0,.87)
}

.card-orange a,.card-orange a:focus,.card-orange a:hover {
    color: inherit
}

.card-red {
    background-color: #f44336;
    color: #fff
}

.card-red a,.card-red a:focus,.card-red a:hover {
    color: inherit
}

.card-action,.tile-action {
    border-top: 1px solid rgba(0,0,0,.12);
    min-height: 48px;
    position: relative
}

.card-action:first-child,.tile-action:first-child {
    border-top: 0
}

.card-action-btn,.tile-footer-btn {
    margin: 6px 8px;
    white-space: nowrap
}

.card-action-btn .btn+.btn,.tile-footer-btn .btn+.btn {
    margin-left: 8px
}

.card-header {
    border-bottom: 1px solid rgba(0,0,0,.12);
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 56px
}

.card-header:last-child {
    border-bottom: 0
}

.no-flexbox .card-header:after,.no-flexbox .card-header:before {
    content: "";
    display: table;
    line-height: 0
}

.card-heading,.card-img-heading {
    font-size: 20px;
    line-height: 28px
}

.card-header-side,.tile-side {
    min-width: 0;
    padding-top: 18px;
    padding-bottom: 18px
}

.card-header-side.pull-left,.pull-left.tile-side {
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
    padding-left: 6px
}

.no-flexbox .card-header-side.pull-left,.no-flexbox .pull-left.tile-side {
    padding-right: 16px
}

.card-header-side.pull-right,.pull-right.tile-side {
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    padding-right: 16px
}

.no-flexbox .card-header-side.pull-right,.no-flexbox .pull-right.tile-side {
    padding-left: 16px
}

.card-heading {
    display: block;
    margin-top: 24px;
    margin-bottom: 24px
}

.card-header .card-heading {
    margin-top: 0;
    margin-bottom: 0
}

.card-img {
    display: block
}

.card-img:first-child {
    border-radius: 2px 2px 0 0
}

.card-img:last-child {
    border-radius: 0 0 2px 2px
}

.card-img img {
    display: block;
    height: auto;
    margin-right: auto;
    margin-left: auto
}

.card-img-heading {
    background-image: linear-gradient(to bottom,transparent,rgba(0,0,0,.5));
    color: #fff;
    margin: 0;
    padding: 12px 16px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
}

.card-inner {
    margin: 24px 0;
    min-width: 0;
    position: relative
}

.card-header .card-inner {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-size: 14px;
    line-height: 24px;
    margin-top: 16px;
    margin-bottom: 16px
}

.card-main {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0
}

.card-side {
    background-color: #f5f5f5;
    border-radius: 2px 0 0 2px;
    max-width: 33.33333%;
    padding-right: 16px;
    padding-left: 16px
}

.card-side[href] {
    color: inherit
}

.card-side[href]:focus,.card-side[href]:hover {
    text-decoration: none
}

.card-side.card-side-img {
    padding-right: 0;
    padding-left: 0
}

code,kbd {
    font-size: 75%;
    padding: 2px 4px
}

.card-side.pull-right {
    border-radius: 0 2px 2px 0;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1
}

.card-brand .card-side {
    background-color: #303f9f;
    color: #fff
}

.card-brand-accent .card-side {
    background-color: #f50057;
    color: #fff
}

.card-green .card-side {
    background-color: #388e3c;
    color: #fff
}

.card-orange .card-side {
    background-color: #f57c00;
    color: rgba(0,0,0,.87)
}

.card-red .card-side {
    background-color: #d32f2f;
    color: #fff
}

code,pre {
    background-color: #f5f5f5
}

.card-wrap {
    margin-top: 24px;
    margin-bottom: -24px
}

.card-wrap:after,.card-wrap:before {
    content: "";
    display: table;
    line-height: 0
}

code,kbd,pre,samp {
    font-family: Monaco,Menlo,Consolas,courier new,monospace
}

code {
    border: 1px solid #dadada;
    border-radius: 4px;
    color: #4caf50;
    line-height: 1
}

kbd {
    background-color: #212121;
    border-radius: 4px;
    color: #fff
}

kbd kbd {
    font-size: 100%;
    padding: 0
}

pre {
    border: 1px solid #dadada;
    border-radius: 2px;
    color: #212121;
    display: block;
    font-size: 12px;
    line-height: 20px;
    margin: 24px 0;
    padding: 12px 8px;
    word-wrap: break-word
}

pre code {
    background-color: transparent;
    border-radius: 0;
    color: inherit;
    font-size: inherit;
    padding: 0;
    white-space: pre-wrap
}

.dropdown {
    position: relative;
    transition: z-index 0s .3s
}

.dropdown.open {
    transition: z-index 0s;
    z-index: 21
}

.dropdown-inline {
    display: inline-block
}

.dropdown-menu {
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 0 2px 2px;
    box-shadow: 0 1px 0 rgba(0,0,0,.06),0 0 3px rgba(0,0,0,.18),0 1px 3px rgba(0,0,0,.18);
    margin: 0!important;
    min-width: 100%;
    opacity: 0;
    padding-top: 8px!important;
    padding-right: 0;
    padding-bottom: 8px!important;
    padding-left: 0;
    position: absolute!important;
    top: 100%;
    left: 0;
    -webkit-transform: scale(.25,0);
    -ms-transform: scale(.25,0);
    transform: scale(.25,0);
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform
}

.dropdown.open .dropdown-menu {
    opacity: 1;
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1)
}

.dropdown-menu.dropdown-menu-right,.dropdown.pull-right .dropdown-menu,.nav.pull-right .dropdown-menu {
    border-radius: 2px 0 2px 2px;
    right: 0;
    left: auto;
    -webkit-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    transform-origin: 100% 0
}

.dropdown-menu .a,.dropdown-menu a {
    color: #212121!important;
    display: block;
    line-height: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.dropdown-menu .a:focus,.dropdown-menu .a:hover,.dropdown-menu .active>.a,.dropdown-menu .active>a,.dropdown-menu a:focus,.dropdown-menu a:hover {
    background-color: #f5f5f5
}

.no-csstransforms .dropdown-menu {
    display: none
}

.no-csstransforms .dropdown.open .dropdown-menu {
    display: block
}

.dropdown-toggle {
    transition: background-color .3s cubic-bezier(.4,0,.2,1)
}

.dropdown.open .dropdown-toggle {
    background-color: rgba(154,154,154,.18);
    border-radius: 2px 2px 0 0
}

.dropdown-toggle-btn {
    margin-right: 1px;
    margin-left: 1px;
    padding-right: 16px;
    padding-left: 16px;
    position: relative;
    z-index: 1
}

.dropdown.open .dropdown-toggle-btn {
    background-color: #fff;
    box-shadow: none;
    color: #212121
}

.dropdown-toggle-btn~.dropdown-menu {
    min-width: 100%;
    padding-top: 56px!important;
    top: -14px;
    left: 0;
    -webkit-transform: scale(1,0);
    -ms-transform: scale(1,0);
    transform: scale(1,0)
}

.dropdown-toggle-btn~.dropdown-menu.dropdown-menu-right,.dropdown.pull-right .dropdown-toggle-btn~.dropdown-menu,.nav.pull-right .dropdown-toggle-btn~.dropdown-menu {
    right: 0;
    left: auto
}

.dropdown-wrap {
    margin-top: 20px;
    margin-bottom: 20px
}

.dropdown-wrap:after,.dropdown-wrap:before {
    content: "";
    display: table;
    line-height: 0
}

.checkbox,.radiobtn {
    display: inline-block;
    padding-right: 12px;
    position: relative
}

.form-group .checkbox,.form-group .radiobtn {
    margin-top: 8px;
    padding-bottom: 8px;
    margin-left: 8px
}

.checkbox label,.radiobtn label {
    cursor: pointer;
    margin: 0;
    min-height: 14px;
    padding-left: 26px
}

.checkbox.disabled label,.radiobtn.disabled label,fieldset[disabled] .checkbox label,fieldset[disabled] .radiobtn label {
    color: rgba(0,0,0,.38);
    cursor: not-allowed
}

.checkbox input[type=checkbox],.radiobtn input[type=radio] {
    margin-left: -20px;
    position: absolute
}

.checkbox-inline,.radiobtn-inline {
    display: inline-block;
    margin-right: 16px
}

.form {
    margin-top: 24px;
    margin-bottom: 24px
}

.form-control,.picker__select--month,.picker__select--year {
    background-color: transparent;
    background-image: none;
    border: 0;
    border-bottom: 1px solid rgba(0,0,0,.12);
    border-radius: 0;
    color: inherit;
    display: block;
    font-size: 14px;
    height: 46px;
    line-height: 30px;
    padding: 8px 0;
    transition: border-bottom-color .15s cubic-bezier(.4,0,.2,1);
    width: 100%
}

.form-control:-ms-input-placeholder,.picker__select--month:-ms-input-placeholder,.picker__select--year:-ms-input-placeholder {
    color: rgba(0,0,0,.38)
}

.form-control::-moz-placeholder,.picker__select--month::-moz-placeholder,.picker__select--year::-moz-placeholder {
    color: rgba(0,0,0,.38);
    opacity: 1
}

.form-control::-webkit-input-placeholder,.picker__select--month::-webkit-input-placeholder,.picker__select--year::-webkit-input-placeholder {
    color: rgba(0,0,0,.38)
}

.form-control:focus,.picker__select--month:focus,.picker__select--year:focus {
    border-color: #4caf50;
    border-bottom-width: 2px;
    outline: 0;
    padding-bottom: 6px
}

.form-control[disabled],.form-control[readonly],[disabled].picker__select--month,[disabled].picker__select--year,[readonly].picker__select--month,[readonly].picker__select--year,fieldset[disabled] .form-control,fieldset[disabled] .picker__select--month,fieldset[disabled] .picker__select--year {
    border-style: dashed;
    color: rgba(0,0,0,.38);
    cursor: not-allowed;
    opacity: 1
}

.form-control-inline.picker__select--month,.form-control-inline.picker__select--year,.form-control.form-control-inline {
    display: inline-block;
    vertical-align: middle;
    width: auto
}

.form-control-default.picker__select--month,.form-control-default.picker__select--year,.form-control.form-control-default {
    border: 1px solid rgba(0,0,0,.12);
    padding: 7px 8px;
    transition: none
}

.form-control-default.picker__select--month:focus,.form-control-default.picker__select--year:focus,.form-control.form-control-default:focus {
    border: 1px solid #4caf50;
    padding: 7px 8px
}

.form-control-default[disabled].picker__select--month,.form-control-default[disabled].picker__select--year,.form-control-default[readonly].picker__select--month,.form-control-default[readonly].picker__select--year,.form-control.form-control-default[disabled],.form-control.form-control-default[readonly],fieldset[disabled] .form-control-default.picker__select--month,fieldset[disabled] .form-control-default.picker__select--year,fieldset[disabled] .form-control.form-control-default {
    background-color: rgba(154,154,154,.18)
}

.form-group-brand .form-control,.form-group-brand .form-control:focus,.form-group-brand .picker__select--month,.form-group-brand .picker__select--month:focus,.form-group-brand .picker__select--year,.form-group-brand .picker__select--year:focus {
    border-color: #3f51b5
}

.form-group-brand-accent .form-control,.form-group-brand-accent .form-control:focus,.form-group-brand-accent .picker__select--month,.form-group-brand-accent .picker__select--month:focus,.form-group-brand-accent .picker__select--year,.form-group-brand-accent .picker__select--year:focus {
    border-color: #4caf50
}

.form-group-green .form-control,.form-group-green .form-control:focus,.form-group-green .picker__select--month,.form-group-green .picker__select--month:focus,.form-group-green .picker__select--year,.form-group-green .picker__select--year:focus {
    border-color: #4caf50
}

.form-group-orange .form-control,.form-group-orange .form-control:focus,.form-group-orange .picker__select--month,.form-group-orange .picker__select--month:focus,.form-group-orange .picker__select--year,.form-group-orange .picker__select--year:focus {
    border-color: #ff9800
}

.form-group-red .form-control,.form-group-red .form-control:focus,.form-group-red .picker__select--month,.form-group-red .picker__select--month:focus,.form-group-red .picker__select--year,.form-group-red .picker__select--year:focus {
    border-color: #f44336
}

input[type=color].form-control-default {
    min-width: 38px
}

select.form-control,select.picker__select--month,select.picker__select--year {
    -webkit-appearance: none;
    -moz-appearance: none
}

@media only screen and (-webkit-min-device-pixel-ratio:0),(min--moz-device-pixel-ratio:0) {
    select.form-control,select.picker__select--month,select.picker__select--year {
        background-image: url(data:image/png;
        base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1ODZCNTU1QkIxQkUxMUU1OEYzRkZEMkE1Q0Y3MDFBNyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1ODZCNTU1Q0IxQkUxMUU1OEYzRkZEMkE1Q0Y3MDFBNyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU4NkI1NTU5QjFCRTExRTU4RjNGRkQyQTVDRjcwMUE3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU4NkI1NTVBQjFCRTExRTU4RjNGRkQyQTVDRjcwMUE3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+TozEogAAAGxJREFUeNrs1DEOgDAIheHH4XpqDocdiInYVqA6mEBC2P5vg0QEXw4VUMCPACJq/bSXuty7bAEosIuwAhgBuwjrYgVkkTPuAaLIJe4FvMgtHgGekGE8CsyQaTwDWGQZzwIwAEJAPbsC0nMIMADa5XjRmvnODAAAAABJRU5ErkJggg==);background-position: 100% 11px;
        background-repeat: no-repeat;
        background-size: 12px 12px;
        padding-right: 20px
    }

    select.form-control[multiple],select.form-control[size],select[multiple].picker__select--month,select[multiple].picker__select--year,select[size].picker__select--month,select[size].picker__select--year {
        background-image: none;
        padding-right: 0
    }

    select.form-control-default {
        background-position: calc(100% - 8px) 11px;
        padding-right: 28px!important
    }

    select.form-control-default[multiple],select.form-control-default[size] {
        padding-right: 8px!important
    }
}

textarea.form-control,textarea.picker__select--month,textarea.picker__select--year {
    height: auto
}

.form-control-static {
    border-bottom: 1px solid rgba(0,0,0,.12);
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 8px;
    padding-bottom: 7px
}

.form-control-static.form-control-default {
    padding-top: 7px
}

.form-group {
    margin-top: 14px;
    margin-bottom: 14px
}

legend+.form-group {
    margin-top: 0
}

.form-help {
    display: block;
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    margin-top: 8px;
    margin-bottom: 12px;
    position: relative
}

.form-help-icon {
    position: absolute;
    top: 4px;
    right: 0
}

.form-help-msg {
    padding-right: 1.28571em
}

.form-label {
    display: block
}

.form-group-brand .form-label {
    color: #3f51b5
}

.form-group-brand-accent .form-label {
    color: #4caf50
}

.form-group-green .form-label {
    color: #4caf50
}

.form-group-orange .form-label {
    color: #ff9800
}

.form-group-red .form-label {
    color: #f44336
}

.checkbox-adv,.radiobtn-adv {
    font-size: 14px;
    line-height: 20px
}[class*=checkbox-circle],[class*=radiobtn-circle] {
     display: block;
     height: 24px;
     position: absolute;
     top: 3px;
     left: -8px;
     width: 24px
 }[class*=radiobtn-circle] {
      border-radius: 50%
  }

.checkbox-circle,.radiobtn-circle {
    border: 1px solid rgba(164,164,164,.54);
    transition: border-color .3s cubic-bezier(.4,0,.2,1)
}

input[type=checkbox]:focus~.checkbox-circle {
    border-color: rgba(0,0,0,.87)
}

input[type=checkbox]:checked~.checkbox-circle {
    border-color: #4caf50
}

.checkbox-adv.disabled input[type=checkbox]~.checkbox-circle,fieldset[disabled] input[type=checkbox]~.checkbox-circle,input[type=checkbox][disabled]~.checkbox-circle {
    border-color: rgba(0,0,0,.38)
}

input[type=radio]:focus~.radiobtn-circle {
    border-color: rgba(0,0,0,.87)
}

input[type=radio]:checked~.radiobtn-circle {
    border-color: #4caf50
}

.radiobtn-adv.disabled input[type=radio]~.radiobtn-circle,fieldset[disabled] input[type=radio]~.radiobtn-circle,input[type=radio][disabled]~.radiobtn-circle {
    border-color: rgba(0,0,0,.38)
}

.radiobtn-adv.disabled input[type=radio]:checked~.radiobtn-circle,fieldset[disabled] input[type=radio]:checked~.radiobtn-circle,input[type=radio]:checked[disabled]~.radiobtn-circle {
    border-color: #ff80ab
}

.checkbox-circle-check,.radiobtn-circle-check {
    background-color: transparent;
    -webkit-transform: scale(0,0);
    -ms-transform: scale(0,0);
    transform: scale(0,0);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: background-color,-webkit-transform;
    transition-property: background-color,transform;
    transition-property: background-color,transform,-webkit-transform;
    left: -8px;
    top: 3px
}

.checkbox-circle-check:after,.radiobtn-circle-check:after {
    background-color: #4caf50;
    border-radius: 50%;
    content: "";
    display: block;
    height: 80px;
    opacity: 0;
    position: absolute;
    top: -29px;
    left: -29px;
    width: 80px
}

.checkbox-adv.disabled .checkbox-circle-check,.radiobtn-adv.disabled .radiobtn-circle-check:after,fieldset[disabled] .checkbox-circle-check,fieldset[disabled] .radiobtn-circle-check:after,input[type=checkbox][disabled]~.checkbox-circle-check,input[type=radio][disabled]~.radiobtn-circle-check:after {
    display: none
}

input[type=checkbox]:checked~.checkbox-circle-check {
    -webkit-transform: scale(.5,.5);
    -ms-transform: scale(.5,.5);
    transform: scale(.5,.5)
}

input[type=checkbox]:checked~.checkbox-circle-check:after {
    -webkit-animation: circle-check .6s;
    animation: circle-check .6s
}

input[type=radio]:checked~.radiobtn-circle-check {
    background-color: #4caf50;
    -webkit-transform: scale(.5,.5);
    -ms-transform: scale(.5,.5);
    transform: scale(.5,.5)
}

input[type=radio]:checked~.radiobtn-circle-check:after {
    -webkit-animation: circle-check .6s;
    animation: circle-check .6s
}

.radiobtn-adv.disabled input[type=radio]:checked~.radiobtn-circle-check,fieldset[disabled] input[type=radio]:checked~.radiobtn-circle-check,input[type=radio]:checked[disabled]~.radiobtn-circle-check {
    background-color: #ff80ab
}

.checkbox-circle-icon {
    background-color: transparent;
    color: transparent;
    -webkit-transform: scale(.5,.5);
    -ms-transform: scale(.5,.5);
    transform: scale(.5,.5);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: background-color,color,-webkit-transform;
    transition-property: background-color,color,transform;
    transition-property: background-color,color,transform,-webkit-transform
}

.checkbox-circle-icon:before {
    top: auto
}

input[type=checkbox]:checked~.checkbox-circle-icon {
    background-color: #4caf50;
    color: #fff;
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1)
}

.checkbox-adv.disabled input[type=checkbox]:checked~.checkbox-circle-icon,fieldset[disabled] input[type=checkbox]:checked~.checkbox-circle-icon,input[type=checkbox]:checked[disabled]~.checkbox-circle-icon {
    background-color: #ff80ab
}

@-webkit-keyframes circle-check {
    0%,100% {
        opacity: 0
    }

    25% {
        opacity: .25
    }
}

@keyframes circle-check {
    0%,100% {
        opacity: 0
    }

    25% {
        opacity: .25
    }
}

.picker {
    position: absolute;
    z-index: 40;
    user-select: none
}

.picker__box {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 30px rgba(0,0,0,.5);
    position: relative;
    vertical-align: middle;
    z-index: 1
}

.picker__box:after,.picker__box:before {
    content: "";
    display: table;
    line-height: 0
}

.picker__box:after {
    clear: both
}

@media only screen and (min-width:992px) {
    [	class*=col-md]>.form-label {
        padding-top: 8px;
        padding-bottom: 8px;
        text-align: right
    }

    .picker__box:before {
        background-color: #3f51b5;
        border-radius: 4px 0 0 4px;
        content: "";
        display: block;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        width: 176px;
        z-index: -1
    }
}

.picker__date-display {
    background-color: #3f51b5;
    border-radius: 4px 4px 0 0;
    color: #fff;
    padding: 12px 16px;
    text-align: left
}

@media only screen and (min-width:992px) {
    .picker__date-display {
        border-radius: 4px 0 0 4px;
        float: left;
        width: 176px
    }
}

.picker__date-display-bottom {
    font-size: 34px;
    line-height: 40px
}

.picker__date-display-top {
    color: #7986cb;
    margin-bottom: 8px
}

.picker__day {
    border-radius: 50%;
    display: inline-block;
    height: 36px;
    padding: 8px 0;
    width: 36px
}

.picker__day:focus,.picker__day:hover {
    color: #3f51b5;
    cursor: pointer
}

.picker__day.picker__day--highlighted {
    color: #3f51b5
}

.picker__day.picker__day--selected {
    background-color: #3f51b5;
    color: #fff!important
}

.picker__day-display {
    margin-right: 8px
}

.picker__day--outfocus {
    display: none
}

.picker__frame,.picker__holder:after {
    display: inline-block;
    vertical-align: middle
}

.picker__footer {
    padding: 8px 16px;
    text-align: right
}

.picker__footer button {
    margin-left: 8px
}

.picker__footer button:first-child {
    margin-left: 0
}

.picker__frame {
    margin: 48px auto;
    max-width: 268px;
    -webkit-transform: scale(0,0);
    -ms-transform: scale(0,0);
    transform: scale(0,0);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform,-webkit-transform;
    white-space: normal
}

.picker--opened .picker__frame {
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1)
}

.picker__header {
    margin-top: 12px;
    margin-bottom: 8px;
    position: relative
}

@media only screen and (min-width:992px) {
    .picker__footer {
        padding-right: 24px;
        padding-left: 24px
    }

    .picker__frame {
        max-width: 528px
    }

    .picker__header {
        float: left;
        width: 352px
    }
}

.picker__holder {
    backface-visibility: hidden;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 100%;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
    transition: background-color .3s cubic-bezier(.4,0,.2,1),top 0s linear .3s;
    white-space: nowrap;
    width: 100%;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar
}

.picker__holder:after {
    content: "";
    height: 100%;
    width: 1px
}

.picker--opened .picker__holder {
    background-color: rgba(0,0,0,.5);
    top: 0;
    transition: background-color .3s cubic-bezier(.4,0,.2,1),top 0s linear 0s
}

.picker__input {
    background-color: transparent!important;
    border-bottom-style: solid!important;
    color: inherit!important;
    cursor: text!important
}

.picker__input.picker__input--active {
    border-color: #4caf50;
    border-bottom-width: 2px
}

.picker__input.picker__input--active.form-control-default {
    border-bottom-width: 1px
}

.picker__month,.picker__year {
    display: inline;
    margin-left: 16px
}

.picker__month:first-child,.picker__year:first-child {
    margin-left: 0
}

.picker__nav--next,.picker__nav--prev {
    cursor: pointer;
    height: 36px;
    line-height: 20px;
    margin-top: -18px;
    padding-top: 8px;
    padding-bottom: 8px;
    position: absolute;
    top: 50%;
    text-align: center;
    width: 36px
}

.picker__nav--next:focus,.picker__nav--next:hover,.picker__nav--prev:focus,.picker__nav--prev:hover {
    color: #3f51b5
}

@media only screen and (min-width:992px) {
    .picker__nav--next,.picker__nav--prev {
        width: 48px
    }
}

.picker__nav--next {
    right: 8px
}

.picker__nav--next:before {
    content: "keyboard_arrow_right"
}

.picker__nav--prev {
    left: 8px
}

.picker__nav--prev:before {
    content: "keyboard_arrow_left"
}

.picker__select--month,.picker__select--year {
    background-position: 100% 4px!important;
    border-bottom: 0;
    display: inline-block;
    height: 20px;
    margin-left: 16px;
    padding: 0;
    width: auto
}

.picker__select--month:first-child,.picker__select--year:first-child {
    margin-left: 0
}

.picker__select--month:focus,.picker__select--year:focus {
    border-bottom: 0;
    padding-bottom: 0
}

.picker__table {
    margin: 0 8px;
    table-layout: fixed
}

.picker__table td,.picker__table th {
    border: 0;
    font-size: 12px;
    line-height: 20px;
    margin: 0;
    padding: 0;
    text-align: center;
    vertical-align: middle;
    width: 36px
}

@media only screen and (min-width:992px) {
    .picker__table {
        float: left;
        margin: 0
    }

    .picker__table td,.picker__table th {
        width: 48px
    }

    .picker__table td:first-child,.picker__table th:first-child {
        padding-left: 8px;
        width: 56px
    }

    .picker__table td:last-child,.picker__table th:last-child {
        padding-right: 8px;
        width: 56px
    }

    .picker__weekday-display {
        display: block
    }
}

.picker__weekday {
    color: #9a9a9a;
    padding-top: 8px!important;
    padding-bottom: 8px!important
}

.picker__weekday-display {
    margin-right: 8px
}

.picker__weekday-display:after {
    content: ","
}

.floating-label {
    color: rgba(0,0,0,.38);
    cursor: text;
    font-size: 15px;
    line-height: 1;
    margin: 0;
    padding: 0;
    position: absolute;
    top: -11px;
    left: 0;
    transition: color .3s cubic-bezier(.4,0,.2,1),font-size .3s cubic-bezier(.4,0,.2,1),top .3s cubic-bezier(.4,0,.2,1)
}

.form-group-label,.switch,.switch-toggle {
    position: relative
}

.form-group-label [class*=col-] .floating-label {
    left: 16px
}

.form-group-label.control-focus .floating-label,.form-group-label.control-highlight .floating-label {
    font-size: 12px;
    font-weight: 500;
    top: -16px;
    color: #060400
}

.form-group-label.control-focus .floating-label {
    color: #4caf50
}

.form-group-label {
    margin-top: 36px;
    margin-bottom: 36px
}

.form-group-label .form-control,.form-group-label .picker__select--month,.form-group-label .picker__select--year {
    position: relative;
    z-index: 1;
    color: #000
}

.form-group-label .form-control:-ms-input-placeholder,.form-group-label .picker__select--month:-ms-input-placeholder,.form-group-label .picker__select--year:-ms-input-placeholder {
    color: transparent
}

.form-group-label .form-control::-moz-placeholder,.form-group-label .picker__select--month::-moz-placeholder,.form-group-label .picker__select--year::-moz-placeholder {
    color: transparent;
    opacity: 1
}

.form-group-label .form-control::-webkit-input-placeholder,.form-group-label .picker__select--month::-webkit-input-placeholder,.form-group-label .picker__select--year::-webkit-input-placeholder {
    color: transparent
}

legend+.form-group-label {
    margin-top: 12px
}

.form-group-label.form-group-brand .floating-label {
    color: #3f51b5
}

.form-group-label.form-group-brand-accent .floating-label {
    color: #4caf50
}

.form-group-label.form-group-green .floating-label {
    color: #4caf50
}

.form-group-label.form-group-orange .floating-label {
    color: #ff9800
}

.form-group-label.form-group-red .floating-label {
    color: #f44336
}

.form-icon-label {
    cursor: pointer;
    display: block;
    font-size: 20px;
    line-height: 28px;
    padding: 4px 0;
    transition: color .15s cubic-bezier(.4,0,.2,1)
}

.switch.checkbox label,.switch.radiobtn label {
    padding-left: 40.5px
}

.switch-toggle {
    background-color: rgba(0,0,0,.38);
    border-radius: 6px;
    cursor: pointer;
    display: inline-block;
    height: 12px;
    margin-right: 8px;
    transition: background-color .3s cubic-bezier(.4,0,.2,1);
    vertical-align: middle;
    width: 32.5px
}

.switch-toggle:after {
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.25);
    content: "";
    display: block;
    height: 20px;
    position: absolute;
    top: -4px;
    left: 0;
    transition: background-color .3s cubic-bezier(.4,0,.2,1),box-shadow 90ms cubic-bezier(.4,0,.2,1),left .3s cubic-bezier(.4,0,.2,1);
    width: 20px
}

.switch-toggle:active:after {
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.25),0 0 0 12.5px rgba(0,0,0,.1)
}

input[type=checkbox]:checked+.switch-toggle,input[type=radio]:checked+.switch-toggle {
    background-color: rgba(255,64,129,.5)
}

input[type=checkbox]:checked+.switch-toggle:after,input[type=radio]:checked+.switch-toggle:after {
    background-color: #4caf50;
    left: 12.5px
}

input[type=checkbox]:checked+.switch-toggle:active:after,input[type=radio]:checked+.switch-toggle:active:after {
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.25),0 0 0 12.5px rgba(255,64,129,.25)
}

.checkbox.switch .switch-toggle,.radiobtn.switch .switch-toggle {
    position: absolute;
    top: 4px;
    left: 0
}

.modal,.modal-backdrop {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0
}

input[type=checkbox]:checked+.switch-toggle-brand,input[type=radio]:checked+.switch-toggle-brand {
    background-color: #7986cb
}

input[type=checkbox]:checked+.switch-toggle-brand:after,input[type=radio]:checked+.switch-toggle-brand:after {
    background-color: #3f51b5
}

input[type=checkbox]:checked+.switch-toggle-brand:active:after,input[type=radio]:checked+.switch-toggle-brand:active:after {
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.25),0 0 0 12.5px rgba(63,81,181,.25)
}

input[type=checkbox]:checked+.switch-toggle-brand-accent,input[type=radio]:checked+.switch-toggle-brand-accent {
    background-color: #ff80ab
}

input[type=checkbox]:checked+.switch-toggle-brand-accent:after,input[type=radio]:checked+.switch-toggle-brand-accent:after {
    background-color: #4caf50
}

input[type=checkbox]:checked+.switch-toggle-brand-accent:active:after,input[type=radio]:checked+.switch-toggle-brand-accent:active:after {
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.25),0 0 0 12.5px rgba(255,64,129,.25)
}

input[type=checkbox]:checked+.switch-toggle-green,input[type=radio]:checked+.switch-toggle-green {
    background-color: #81c784
}

input[type=checkbox]:checked+.switch-toggle-green:after,input[type=radio]:checked+.switch-toggle-green:after {
    background-color: #4caf50
}

input[type=checkbox]:checked+.switch-toggle-green:active:after,input[type=radio]:checked+.switch-toggle-green:active:after {
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.25),0 0 0 12.5px rgba(76,175,80,.25)
}

input[type=checkbox]:checked+.switch-toggle-orange,input[type=radio]:checked+.switch-toggle-orange {
    background-color: #ffb74d
}

input[type=checkbox]:checked+.switch-toggle-orange:after,input[type=radio]:checked+.switch-toggle-orange:after {
    background-color: #ff9800
}

input[type=checkbox]:checked+.switch-toggle-orange:active:after,input[type=radio]:checked+.switch-toggle-orange:active:after {
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.25),0 0 0 12.5px rgba(255,152,0,.25)
}

input[type=checkbox]:checked+.switch-toggle-red,input[type=radio]:checked+.switch-toggle-red {
    background-color: #e57373
}

input[type=checkbox]:checked+.switch-toggle-red:after,input[type=radio]:checked+.switch-toggle-red:after {
    background-color: #f44336
}

input[type=checkbox]:checked+.switch-toggle-red:active:after,input[type=radio]:checked+.switch-toggle-red:active:after {
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.25),0 0 0 12.5px rgba(244,67,54,.25)
}

.textarea-autosize {
    min-height: 36px;
    overflow-x: hidden
}

.label {
    background-color: rgba(0,0,0,.38);
    border-radius: 2px;
    color: #fff;
    display: inline;
    font-size: 75%;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    padding: .2em .6em;
    vertical-align: baseline;
    white-space: nowrap
}

.modal-close,.modal-title {
    font-size: 20px;
    line-height: 28px
}

.label-brand {
    background-color: #3f51b5;
    color: #fff
}

.label-brand-accent {
    background-color: #4caf50;
    color: #fff
}

.label-green {
    background-color: #4caf50;
    color: rgba(0,0,0,.87)
}

.label-orange {
    background-color: #ff9800;
    color: rgba(0,0,0,.87)
}

.label-red {
    background-color: #f44336;
    color: #fff
}

.modal {
    backface-visibility: hidden;
    display: none;
    overflow: hidden;
    outline: 0;
    top: 0;
    z-index: 40;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar
}

.modal-backdrop,.snackbar-inner {
    -webkit-backface-visibility: hidden
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto
}

.load-bar,.load-bar-base,.modal-open,.progress,.progress-circular,.snackbar-text {
    overflow: hidden
}

.modal-backdrop {
    backface-visibility: hidden;
    background-color: rgba(0,0,0,.5);
    opacity: 0;
    top: 0;
    transition: opacity .3s cubic-bezier(.4,0,.2,1);
    z-index: 39
}

.modal-content,.modal-dialog,.modal-heading,.nav {
    position: relative
}

.menu~.modal-backdrop {
    z-index: 30
}

.modal-close {
    color: #727272;
    cursor: pointer;
    display: block;
    float: right;
    margin-right: -8px;
    padding-right: 8px;
    padding-left: 8px
}

.modal-close:focus,.modal-close:hover {
    color: #4caf50;
    text-decoration: none
}

.modal-content {
    background-color: #fff;
    border: 1px solid #777;
    border-radius: 8px;
    -moz-box-shadow: 0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12),0 5px 5px -3px rgba(0,0,0,.2);
    box-shadow: 0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12),0 5px 5px -3px rgba(0,0,0,.2)
}

.clickselect:hover {
    color: #4caf50
}

.modal .modal-title {
    text-align: left
}

.modal-dialog {
    margin: 72px 16px
}

.modal-heading,.modal-inner {
    margin-top: 24px;
    padding-right: 24px;
    padding-left: 24px
}

.modal-dialog.modal-full {
    height: 100%;
    height: calc(100% - 96px)
}

.modal-dialog.modal-full .modal-content {
    height: 100%
}

.modal.fade .modal-dialog {
    -webkit-transform: scale(0,0);
    -ms-transform: scale(0,0);
    transform: scale(0,0);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform,-webkit-transform
}

.modal.fade.in .modal-dialog {
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    transform: scale(1,1)
}

.clickselect {
    cursor: pointer;
    margin: 34px auto 0;
    min-width: 180px;
    background-color: #fff;
    border-radius: 50px;
    min-height: 42px;
    line-height: 42px;
    color: #222;
    border: 2px solid transparent;
    box-shadow: 0 2px 8px 0 rgba(168,168,168,.48);
    height: 42px;
    display: inline-block
}

.qrgenerator__show {
    box-shadow: 0 -1px 0 rgba(0,0,0,.06),0 0 3px rgba(0,0,0,.18),0 1px 3px rgba(0,0,0,.18);
    padding: 6px;
    border-radius: 8px
}

@media only screen and (max-width:479px) {
    .qrgenerator__customizer .collapse.show {
        max-height: 160px!important;
        overflow: auto!important
    }

    .clickselect {
        margin-top: 10px
    }

    .modal-dialog {
        margin: 16px!important
    }

    .modal-heading,.modal-inner {
        margin-bottom: 0!important
    }
}

@media only screen and (min-width:480px) {
    .modal-dialog.modal-xs {
        margin-right: auto;
        margin-left: auto;
        width: 448px
    }
}

@media only screen and (min-width:992px) {
    .modal-dialog {
        margin-right: auto;
        margin-left: auto;
        width: 960px
    }
}

@media only screen and (min-width:1440px) {
    .modal-dialog {
        width: 960px
    }

    .qrgenerator__show {
        margin-top: calc(50% - 125px)
    }

    #more_color_frames .qrgenerator__customizer .card-body {
        max-width: 470px!important
    }
}

.modal-footer {
    padding-right: 24px;
    padding-left: 24px;
    padding-bottom: 20px;
}

.modal-footer .btn+.btn {
    margin-right: 16px
}

.modal-footer .text-right .btn+.btn {
    margin-right: auto;
    margin-left: 16px
}

.modal-heading,.modal-inner {
    margin-bottom: 24px
}

.modal-title {
    margin-top: 0;
    margin-bottom: 14px;
    color: #000
}

.nav {
    margin: 0 0;
    padding: 0
}

.nav:after,.nav:before {
    content: "";
    display: table;
    line-height: 0
}

.nav .a,.nav a,.nav li {
    display: block;
    position: relative
}

.nav .a,.nav a {
    padding: 14px 8px
}

.nav .a:focus,.nav .a:hover,.nav a:focus,.nav a:hover {
    text-decoration: none
}

.text-overflow .waves-attach {
    padding: 14px 28px;
    background-color: #f6fbf6;
    border-radius: 6px;
    color: #228826!important
}

.nav ul {
    margin: 0;
    padding: 0
}

.nav-justified {
    width: 100%
}

.nav-justified>li {
    display: table-cell!important;
    float: none!important;
    width: 1%!important
}

.nav-justified>li>a {
    text-align: center
}

.nav-list>li {
    float: left
}

.progress {
    background-color: #ff80ab;
    height: 4px;
    margin-top: 24px;
    margin-bottom: 24px;
    position: relative
}

.progress-bar,.progress-position-absolute-bottom,.progress-position-absolute-top {
    position: absolute
}

.progress-bar {
    background-color: #4caf50;
    border-radius: 0 1px 1px 0;
    height: 100%;
    top: 0;
    left: 0;
    transition: width .3s cubic-bezier(.4,0,.2,1)
}

.progress-brand {
    background-color: #7986cb
}

.progress-brand .progress-bar {
    background-color: #3f51b5
}

.progress-green {
    background-color: #81c784
}

.progress-green .progress-bar {
    background-color: #4caf50
}

.progress-orange {
    background-color: #ffb74d
}

.progress-orange .progress-bar {
    background-color: #ff9800
}

.progress-red {
    background-color: #e57373
}

.progress-red .progress-bar {
    background-color: #f44336
}

.progress-bar-indeterminate {
    background-color: #4caf50
}

.progress-bar-indeterminate:after,.progress-bar-indeterminate:before {
    -webkit-animation-duration: 2.1s;
    animation-duration: 2.1s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    background-color: inherit;
    border-radius: 1px;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    transition: width .3s cubic-bezier(.4,0,.2,1);
    will-change: left,width
}

.progress-bar-indeterminate:after {
    -webkit-animation-name: pbar-indeterminate-one;
    animation-name: pbar-indeterminate-one;
    left: 0
}

.progress-bar-indeterminate:before {
    -webkit-animation-name: pbar-indeterminate-two;
    animation-name: pbar-indeterminate-two;
    right: 0
}

@-webkit-keyframes pbar-indeterminate-one {
    0% {
        left: 0;
        width: 0
    }

    50% {
        left: 25%;
        width: 75%
    }

    75% {
        left: 100%;
        width: 0
    }
}

@keyframes pbar-indeterminate-one {
    0% {
        left: 0;
        width: 0
    }

    50% {
        left: 25%;
        width: 75%
    }

    75% {
        left: 100%;
        width: 0
    }
}

@-webkit-keyframes pbar-indeterminate-two {
    0%,50% {
        left: 0;
        width: 0
    }

    75% {
        left: 0;
        width: 25%
    }

    100% {
        left: 100%;
        width: 0
    }
}

@keyframes pbar-indeterminate-two {
    0%,50% {
        left: 0;
        width: 0
    }

    75% {
        left: 0;
        width: 25%
    }

    100% {
        left: 100%;
        width: 0
    }
}

.progress-position-absolute-bottom,.progress-position-absolute-top,.progress-position-fixed-bottom,.progress-position-fixed-top {
    margin: 0;
    left: 0;
    width: 100%
}

.progress-circular,.tab-nav {
    margin-top: 0;
    margin-bottom: 0
}

.progress-position-absolute-bottom,.progress-position-fixed-bottom {
    bottom: 0
}

.progress-position-absolute-top,.progress-position-fixed-top {
    top: 0
}

.progress-position-fixed-bottom,.progress-position-fixed-top {
    position: fixed
}

.progress-circular {
    height: 40px;
    position: relative;
    width: 40px
}

.progress-circular-center {
    margin-right: auto;
    margin-left: auto
}

.progress-circular-gap {
    border-top: 2px solid #4caf50;
    position: absolute;
    top: 0;
    right: 19px;
    bottom: 0;
    left: 19px
}

.progress-circular-brand .progress-circular-gap {
    border-top-color: #3f51b5
}

.progress-circular-green .progress-circular-gap {
    border-top-color: #4caf50
}

.progress-circular-orange .progress-circular-gap {
    border-top-color: #ff9800
}

.progress-circular-red .progress-circular-gap {
    border-top-color: #f44336
}

.progress-circular-inline {
    display: inline-block;
    margin-right: 16px;
    margin-left: 16px
}

.menu-top-img,.snackbar-inner {
    display: -webkit-flex;
    display: -ms-flexbox
}

.progress-circular-inner {
    -webkit-animation: pcircular-inner-rotate 5.25s cubic-bezier(.35,0,.25,1) infinite;
    animation: pcircular-inner-rotate 5.25s cubic-bezier(.35,0,.25,1) infinite;
    height: 40px;
    position: relative;
    width: 40px;
    will-change: transform
}

.progress-circular-left,.progress-circular-right {
    height: 40px;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 20px
}

.progress-circular-left {
    left: 0
}

.progress-circular-right {
    right: 0
}

.progress-circular-spinner {
    border: 4px solid #4caf50;
    border-bottom-color: transparent;
    border-radius: 50%;
    height: 40px;
    position: absolute;
    top: 0;
    width: 40px;
    will-change: transform
}

.progress-circular-left .progress-circular-spinner {
    -webkit-animation: pcircular-spinner-left 1.3125s cubic-bezier(.35,0,.25,1) infinite;
    animation: pcircular-spinner-left 1.3125s cubic-bezier(.35,0,.25,1) infinite;
    border-right-color: transparent;
    left: 0
}

.progress-circular-right .progress-circular-spinner {
    -webkit-animation: pcircular-spinner-right 1.3125s cubic-bezier(.35,0,.25,1) infinite;
    animation: pcircular-spinner-right 1.3125s cubic-bezier(.35,0,.25,1) infinite;
    border-left-color: transparent;
    right: 0
}

.progress-circular-brand .progress-circular-spinner {
    border-top-color: #3f51b5
}

.progress-circular-brand .progress-circular-left .progress-circular-spinner {
    border-left-color: #3f51b5
}

.progress-circular-brand .progress-circular-right .progress-circular-spinner {
    border-right-color: #3f51b5
}

.progress-circular-brand-accent .progress-circular-spinner {
    border-top-color: #4caf50
}

.progress-circular-brand-accent .progress-circular-left .progress-circular-spinner {
    border-left-color: #4caf50
}

.progress-circular-brand-accent .progress-circular-right .progress-circular-spinner {
    border-right-color: #4caf50
}

.progress-circular-green .progress-circular-spinner {
    border-top-color: #4caf50
}

.progress-circular-green .progress-circular-left .progress-circular-spinner {
    border-left-color: #4caf50
}

.progress-circular-green .progress-circular-right .progress-circular-spinner {
    border-right-color: #4caf50
}

.progress-circular-orange .progress-circular-spinner {
    border-top-color: #ff9800
}

.progress-circular-orange .progress-circular-left .progress-circular-spinner {
    border-left-color: #ff9800
}

.progress-circular-orange .progress-circular-right .progress-circular-spinner {
    border-right-color: #ff9800
}

.progress-circular-red .progress-circular-spinner {
    border-top-color: #f44336
}

.progress-circular-red .progress-circular-left .progress-circular-spinner {
    border-left-color: #f44336
}

.progress-circular-red .progress-circular-right .progress-circular-spinner {
    border-right-color: #f44336
}

.progress-circular-wrapper {
    -webkit-animation: pcircular-wrapper-rotate 2.91667s linear infinite;
    animation: pcircular-wrapper-rotate 2.91667s linear infinite;
    will-change: transform
}

@-webkit-keyframes pcircular-inner-rotate {
    12.5% {
        -webkit-transform: rotate(135deg);
        transform: rotate(135deg)
    }

    25% {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    37.5% {
        -webkit-transform: rotate(405deg);
        transform: rotate(405deg)
    }

    50% {
        -webkit-transform: rotate(540deg);
        transform: rotate(540deg)
    }

    62.5% {
        -webkit-transform: rotate(675deg);
        transform: rotate(675deg)
    }

    75% {
        -webkit-transform: rotate(810deg);
        transform: rotate(810deg)
    }

    87.5% {
        -webkit-transform: rotate(945deg);
        transform: rotate(945deg)
    }

    100% {
        -webkit-transform: rotate(1080deg);
        transform: rotate(1080deg)
    }
}

@keyframes pcircular-inner-rotate {
    12.5% {
        -webkit-transform: rotate(135deg);
        transform: rotate(135deg)
    }

    25% {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    37.5% {
        -webkit-transform: rotate(405deg);
        transform: rotate(405deg)
    }

    50% {
        -webkit-transform: rotate(540deg);
        transform: rotate(540deg)
    }

    62.5% {
        -webkit-transform: rotate(675deg);
        transform: rotate(675deg)
    }

    75% {
        -webkit-transform: rotate(810deg);
        transform: rotate(810deg)
    }

    87.5% {
        -webkit-transform: rotate(945deg);
        transform: rotate(945deg)
    }

    100% {
        -webkit-transform: rotate(1080deg);
        transform: rotate(1080deg)
    }
}

@-webkit-keyframes pcircular-spinner-left {
    0%,100% {
        -webkit-transform: rotate(130deg);
        transform: rotate(130deg)
    }

    50% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }
}

@keyframes pcircular-spinner-left {
    0%,100% {
        -webkit-transform: rotate(130deg);
        transform: rotate(130deg)
    }

    50% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }
}

@-webkit-keyframes pcircular-spinner-right {
    0%,100% {
        -webkit-transform: rotate(-130deg);
        transform: rotate(-130deg)
    }

    50% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }
}

@keyframes pcircular-spinner-right {
    0%,100% {
        -webkit-transform: rotate(-130deg);
        transform: rotate(-130deg)
    }

    50% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }
}

@-webkit-keyframes pcircular-wrapper-rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes pcircular-wrapper-rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

.load-bar {
    float: right;
    height: 100%;
    width: 50%
}

.load-bar:first-child {
    float: left
}

.load-bar-base {
    -webkit-animation: load-bar-right-in .9s cubic-bezier(.4,0,.2,1) 1 forwards;
    animation: load-bar-right-in .9s cubic-bezier(.4,0,.2,1) 1 forwards;
    background-color: #4caf50;
    float: left;
    height: 100%;
    -webkit-transform: translate(-100%,0);
    -ms-transform: translate(-100%,0);
    transform: translate(-100%,0);
    -webkit-transform-origin: top right;
    -ms-transform-origin: top right;
    transform-origin: top right;
    width: 100%;
    will-change: transform
}

.load-bar:first-child .load-bar-base {
    -webkit-animation: load-bar-left-in .9s cubic-bezier(.4,0,.2,1) 1 forwards;
    animation: load-bar-left-in .9s cubic-bezier(.4,0,.2,1) 1 forwards;
    -webkit-transform: translate(100%,0);
    -ms-transform: translate(100%,0);
    transform: translate(100%,0);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left
}

@-webkit-keyframes load-bar-left-in {
    0% {
        -webkit-transform: translate(100%,0);
        transform: translate(100%,0)
    }

    100% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }
}

@keyframes load-bar-left-in {
    0% {
        -webkit-transform: translate(100%,0);
        transform: translate(100%,0)
    }

    100% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }
}

@-webkit-keyframes load-bar-right-in {
    0% {
        -webkit-transform: translate(-100%,0);
        transform: translate(-100%,0)
    }

    100% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }
}

@keyframes load-bar-right-in {
    0% {
        -webkit-transform: translate(-100%,0);
        transform: translate(-100%,0)
    }

    100% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }
}

.load-bar-content {
    -webkit-animation: load-bar-right 3.6s linear infinite forwards;
    animation: load-bar-right 3.6s linear infinite forwards;
    -webkit-animation-delay: .9s;
    animation-delay: .9s;
    float: left;
    height: 100%;
    position: relative;
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    width: 400%;
    will-change: transform
}

.load-bar:first-child .load-bar-content {
    -webkit-animation: load-bar-left 3.6s linear infinite forwards;
    animation: load-bar-left 3.6s linear infinite forwards;
    -webkit-animation-delay: .9s;
    animation-delay: .9s
}

@-webkit-keyframes load-bar-left {
    0% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }

    100% {
        -webkit-transform: translate(-100%,0);
        transform: translate(-100%,0)
    }
}

@keyframes load-bar-left {
    0% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }

    100% {
        -webkit-transform: translate(-100%,0);
        transform: translate(-100%,0)
    }
}

@-webkit-keyframes load-bar-right {
    0% {
        -webkit-transform: translate(-100%,0);
        transform: translate(-100%,0)
    }

    100% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }
}

@keyframes load-bar-right {
    0% {
        -webkit-transform: translate(-100%,0);
        transform: translate(-100%,0)
    }

    100% {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }
}

.load-bar-progress {
    background-color: transparent;
    float: left;
    height: 100%;
    width: 25%
}

.load-bar-progress-brand {
    background-color: #3f51b5
}

.load-bar-progress-green {
    background-color: #4caf50
}

.load-bar-progress-orange {
    background-color: #ff9800
}

.load-bar-progress-red {
    background-color: #f44336
}

.snackbar {
    position: fixed;
    bottom: 0;
    z-index: 21
}

.snackbar a {
    cursor: pointer
}

.snackbar a:focus,.snackbar a:hover {
    text-decoration: none
}

@media only screen and (min-width:768px) {
    .snackbar {
        left: 0%;
        bottom: 54px
    }

    .fbtn-container~.snackbar {
        right: 72px
    }

    .snackbar-inner {
        float: left
    }
}

.snackbar-inner {
    backface-visibility: hidden;
    background-color: rgba(41,140,45,.87);
    color: #fff;
    display: flex;
    max-width: 100%;
    padding: 16px;
    -webkit-transform: translate(0,200%);
    -ms-transform: translate(0,200%);
    transform: translate(0,200%);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform,-webkit-transform;
    border-radius: 0 40px 40px 0;
    box-shadow: 1px 0 9px 0 rgba(128,128,128,.49)
}

.btn.waves-light.waves-effect.collapsed:hover {
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(255,152,0) 100%)
}


.snackbar-inner:after,.snackbar-inner:before {
    content: "";
    display: table;
    line-height: 0
}

.snackbar-inner.in {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0)
}

.no-csstransforms .snackbar-inner {
    opacity: 0
}

.no-csstransforms .snackbar-inner.in {
    opacity: 1
}[data-dismiss=snackbar] {
     cursor: pointer;
     float: right;
     font-weight: 500;
     margin-left: 16px;
     -webkit-order: 1;
     -ms-flex-order: 1;
     order: 1;
     text-transform: uppercase;
     white-space: nowrap
 }

.tab-nav {
    position: relative
}

.tab-nav .nav {
    margin-top: 0!important;
    margin-bottom: 0!important
}

.tab-nav .nav>li {
    vertical-align: bottom
}

.tab-nav .nav>li>.a,.tab-nav .nav>li>a {
    border-bottom: 2px solid transparent;
    color: inherit;
    padding-bottom: 12px;
    text-transform: uppercase;
    transition: border-bottom-color 0s;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    margin: 0 3px
}

.color:hover {
    box-shadow: 0 2px 5px 0 rgba(34,136,38,.19);
    border: 1px solid #228826
}

.tab-nav .nav>li>.a:focus,.tab-nav .nav>li>.a:hover,.tab-nav .nav>li>a:focus,.tab-nav .nav>li>a:hover {
    transition: border-bottom-color .3s cubic-bezier(.4,0,.2,1);
    color: #228826
}

.tab-nav .nav>li.active>.a,.tab-nav .nav>li.active>a {
    border-bottom-color: #228826;
    color: #228826;
    transition: border-bottom-color 0s .45s
}

.tab-nav-indicator {
    background-color: transparent;
    height: 2px;
    position: absolute;
    bottom: 0
}

.content-heading,.tile,.tile-footer,.tile-inner,.tile-sub,.tile-wrap {
    position: relative
}

.tab-nav-indicator.animate {
    background-color: #228826;
    transition: left 225ms cubic-bezier(.4,0,.2,1) 225ms,right .45s cubic-bezier(.4,0,.2,1)
}

.tab-nav-indicator.animate.reverse {
    transition: left .45s cubic-bezier(.4,0,.2,1),right 225ms cubic-bezier(.4,0,.2,1) 225ms
}

.tab-nav-brand .nav>li>.a:focus,.tab-nav-brand .nav>li>.a:hover,.tab-nav-brand .nav>li>a:focus,.tab-nav-brand .nav>li>a:hover {
    border-bottom-color: #7986cb
}

.tab-nav-brand .nav>li.active>.a,.tab-nav-brand .nav>li.active>a {
    border-bottom-color: #3f51b5;
    color: #3f51b5
}

.tab-nav-brand .tab-nav-indicator.animate {
    background-color: #3f51b5
}

.tab-nav-green .nav>li>.a:focus,.tab-nav-green .nav>li>.a:hover,.tab-nav-green .nav>li>a:focus,.tab-nav-green .nav>li>a:hover {
    border-bottom-color: #81c784
}

.tab-nav-green .nav>li.active>.a,.tab-nav-green .nav>li.active>a {
    border-bottom-color: #4caf50;
    color: #4caf50
}

.tab-nav-green .tab-nav-indicator.animate {
    background-color: #4caf50
}

.tab-nav-orange .nav>li>.a:focus,.tab-nav-orange .nav>li>.a:hover,.tab-nav-orange .nav>li>a:focus,.tab-nav-orange .nav>li>a:hover {
    background-color: rgba(211,236,211,.31)
}

.tab-nav-orange .nav>li.active>.a,.tab-nav-orange .nav>li.active>a {
    border-bottom-color: #228826;
    color: #228826
}

.tab-nav-orange .tab-nav-indicator.animate {
    background-color: #228826
}

.tab-nav-red .nav>li>.a:focus,.tab-nav-red .nav>li>.a:hover,.tab-nav-red .nav>li>a:focus,.tab-nav-red .nav>li>a:hover {
    border-bottom-color: #e57373
}

.tab-nav-red .nav>li.active>.a,.tab-nav-red .nav>li.active>a {
    border-bottom-color: #f44336;
    color: #f44336
}

.tab-nav-red .tab-nav-indicator.animate {
    background-color: #f44336
}

.tab-pane {
    display: none;
    visibility: hidden
}

.tab-pane.active {
    display: block;
    visibility: visible
}

.table {
    background-color: #fff;
    border: 0;
    box-shadow: 0 -1px 0 rgba(0,0,0,.06),0 0 3px rgba(0,0,0,.18),0 1px 3px rgba(0,0,0,.18);
    margin-top: 24px;
    margin-bottom: 24px;
    width: 100%
}

.card-table>.table {
    box-shadow: none;
    margin-right: -16px;
    margin-left: -16px
}

.card-table>.table:first-child {
    margin-top: 0
}

.card-table>.table:last-child {
    margin-bottom: 0
}

.table>tbody:first-child>tr:first-child td,.table>tbody:first-child>tr:first-child th {
    border-top: 0
}

.table>tbody>tr:hover {
    background-color: #f5f5f5
}

.table td,.table th {
    border-top: 1px solid #dadada;
    font-size: 14px;
    line-height: 20px;
    padding: 13px 16px 14px;
    vertical-align: top
}

.table td.nowrap,.table th.nowrap {
    white-space: nowrap;
    width: 1%
}

.table>thead:first-child>tr:first-child td,.table>thead:first-child>tr:first-child th {
    border-top: 0
}

.table>thead td,.table>thead th {
    color: #9a9a9a;
    font-size: 12px;
    vertical-align: bottom
}

.table-responsive {
    box-shadow: 0 -1px 0 rgba(0,0,0,.06),0 0 3px rgba(0,0,0,.18),0 1px 3px rgba(0,0,0,.18);
    margin-top: 24px;
    margin-bottom: 24px;
    min-height: .01%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar
}

.header-affix,.no-flexbox .tile-action~.tile-inner,.no-flexbox .tile-side~.tile-inner {
    overflow: hidden
}

.card-table>.table-responsive {
    box-shadow: none;
    margin-right: -16px;
    margin-left: -16px
}

.card-table>.table-responsive:first-child {
    margin-top: 0
}

.card-table>.table-responsive:last-child {
    margin-bottom: 0
}

.table-responsive>.table {
    box-shadow: none;
    margin: 0
}

#QR_Code_T {
    width: 28px;
    cursor: pointer;
    height: 28px;
    margin-left: 93px;
    background: transparent url(../images/qrcode/t.png) no-repeat scroll center center;
    border: 1px solid #000
}

.QR_Code_tile {
    background-color: #fff;
    display: block;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 48px;
    border-radius: 8px 8px 0 0
}

.QR_Code_tile[href],.QR_Code_tile[href]:focus,.QR_Code_tile[href]:hover {
    color: inherit;
    text-decoration: none
}

.QR_Code_tile.active {
    margin-top: 0!important;
    margin-bottom: 24px!important
}

.tile {
    display: block;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 48px
}

.tile[href],.tile[href]:focus,.tile[href]:hover {
    color: inherit;
    text-decoration: none
}

.no-boxshadow .tile {
    border: 1px solid rgba(0,0,0,.12)
}

.no-boxshadow .tile+.tile {
    margin-top: -1px
}

.no-flexbox .tile:after,.no-flexbox .tile:before {
    content: "";
    display: table;
    line-height: 0
}

.tile-brand {
    background-color: #3f51b5;
    color: #fff
}

.tile-brand a,.tile-brand a:focus,.tile-brand a:hover {
    color: inherit
}

.tile-brand-accent {
    background-color: #4caf50;
    color: #fff
}

.tile-brand-accent a,.tile-brand-accent a:focus,.tile-brand-accent a:hover {
    color: inherit
}

.tile-green {
    background-color: #4caf50;
    color: rgba(0,0,0,.87)
}

.tile-green a,.tile-green a:focus,.tile-green a:hover {
    color: inherit
}

.tile-orange {
    background-color: #ff9800;
    color: rgba(0,0,0,.87)
}

.tile-orange a,.tile-orange a:focus,.tile-orange a:hover {
    color: inherit
}

.tile-red {
    background-color: #f44336;
    color: #fff
}

.tile-red a,.tile-red a:focus,.tile-red a:hover {
    color: inherit
}

.tile-action {
    border-top: 0;
    float: right;
    min-width: 0;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.no-touch .tile-action,.touch .tile-collapse .tile-action {
    display: none
}

.no-touch .tile:hover .tile-action,.tile-collapse.active .tile-action {
    display: block
}

.tile-action-show {
    display: block!important
}

.tile-footer:after,.tile-footer:before,.tile-sub:after,.tile-sub:before {
    display: table;
    line-height: 0;
    content: ""
}

.tile-active-show {
    min-height: 0;
    margin: 0
}

.tile-active-show.collapsing {
    transition: height .15s linear
}

.tile-collapse {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    transition: margin .15s linear;
    margin: 6px 0
}

.doc_tile_example_parent .tile-collapse:first-child {
    border-radius: 8px 8px 0 0
}

.doc_tile_example_parent .tile-collapse:last-child {
    border-radius: 0 0 8px 8px
}

.tile-collapse:hover a {
    color: #0a590d
}

.tile-collapse.active div[data-toggle=tile] {
    border-radius: 6px 6px 0 0;
    color: #228826!important;
    background: #d3ecd3!important
}

.tile-collapse.active .collapse.in {
    padding-bottom: 10px;
    background-color: #f6fbf6;
    border-radius: 0 0 6px 6px
}

#doc_tile_example_8 {
    padding-top: 10px
}

.tile-active-show.collapse.in {
    box-shadow: none
}

.qrcode-online {
    font-weight: 400;
    position: absolute;
    right: 0%;
    top: 4px;
    height: 16px;
    line-height: 16px;
    text-transform: uppercase;
    font-size: 12px;
    padding: 1px 10px;
    border-radius: 15px 15px 15px 0;
    color: #fff;
    z-index: 1000;
    white-space: nowrap;
    font-style: normal;
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(244,2,6) 100%);
    box-shadow: 0 2px 5px 0 rgba(113,113,113,.51)
}

.tile-collapse a:hover {
    background-color: #22882630;
    border-radius: 3px
}

.tile-collapse.active a.waves-attach {
    color: #228826!important;
    background-color: #d3ecd3
}

.tile-collapse.active a.waves-attach:hover {
    color: #228826;
    background-color: #22882630
}

.tile-collapse.active a.close:hover {
    color: #fff;
    background-color: transparent
}

.tile-collapse.active a.del:hover {
    color: #fff;
    background: url(../images/delete.svg) no-repeat;
    background-color: #e94335;
    background-size: 24px;
    background-position: center
}

.waves-effect .icon12 {
    right: 0;
    position: absolute;
    margin-right: 30px;
    margin-top: 4px
}

@media only screen and (min-width:1056px) and (max-width:1439px) {
    .tile-collapse-full.active {
        margin-right: -63px;
        margin-left: -63px
    }
}

@media only screen and (min-width:1504px) {
    .tile-collapse-full.active {
        margin-right: -63px;
        margin-left: -63px
    }
}

.tile-collapse.active a .icon200 {
    color: #000;
    padding: 2px;
    border: 1px solid transparent
}

.tile-collapse.active a .icon200:hover {
    color: #fff;
    border: 1px solid #f94143;
    border-radius: 3px;
    padding: 2px;
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(244,2,6) 100%);
    box-shadow: 0 2px 5px 0 rgba(113,113,113,.51)
}

.tile-footer {
    background-color: #f5f5f5;
    border-top: 1px solid rgba(0,0,0,.12)
}

.tile-footer:first-child {
    border-top: 0
}

.tile-brand .tile-footer {
    background-color: #303f9f;
    color: #fff
}

.tile-brand-accent .tile-footer {
    background-color: #f50057;
    color: #fff
}

.tile-green .tile-footer {
    background-color: #388e3c;
    color: #fff
}

.tile-orange .tile-footer {
    background-color: #f57c00;
    color: rgba(0,0,0,.87)
}

.tile-red .tile-footer {
    background-color: #d32f2f;
    color: #fff
}

.tile-inner {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0;
    min-width: 0
}

.QRCode-inner {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 14px px;
    margin-right: 26px;
    min-width: 0
}

.tile-side {
    padding-top: 14px;
    padding-bottom: 14px
}

.content-heading {
    padding-top: 0;
    padding-bottom: 0
}

.tile-sub {
}

.tile-brand .tile-sub {
    border-top-color: #303f9f
}

.tile-brand-accent .tile-sub {
    border-top-color: #f50057
}

.tile-green .tile-sub {
    border-top-color: #388e3c
}

.tile-orange .tile-sub {
    border-top-color: #f57c00
}

.tile-red .tile-sub {
    border-top-color: #d32f2f
}

div[data-toggle=tile] {
    cursor: pointer;
    display: block;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-height: 0
}

div[data-toggle=tile] [data-ignore=tile] {
    cursor: default;
    cursor: initial
}

.no-flexbox div[data-toggle=tile]:after,.no-flexbox div[data-toggle=tile]:before {
    content: "";
    display: table;
    line-height: 0
}

.content-heading {
    color: #212121;
    overflow: hidden;
    transition: background-color .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1);
    z-index: 1;
    display: block
}

.content-heading .heading {
    font-weight: 300
}

.page-brand .content-heading {
    color: #000
}

.page-brand-accent .content-heading {
    background-color: #4caf50;
    color: #fff
}

.page-green .content-heading {
    background-color: #4caf50;
    color: rgba(0,0,0,.87)
}

.page-orange .content-heading {
    background-color: #ff9800;
    color: rgba(0,0,0,.87)
}

.page-red .content-heading {
    background-color: #f44336;
    color: #fff
}

.buy-badge {
    right: -48px;
    z-index: 11;
    padding: 1px 18px;
    position: absolute;
    top: 140px;
    margin-left: 8px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    border-radius: 24px;
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(244,2,6) 100%);
    box-shadow: 2px 0 6px 0 rgba(113,113,113,.51);
    color: #fff;
    font-weight: 700;
    padding: 6px 16px;
    text-transform: uppercase
}

.content-inner {
    background: linear-gradient(90deg,#34a853 4%,#34a853 0%) top/100% 34% no-repeat,linear-gradient(90deg,#fbbc04 50%,#4285f4 0%) top/100% 82% no-repeat,linear-gradient(90deg,#fbbc04 10%,#ea4335 0%) top/100% 100%;
    padding: 2px;
    border-radius: 10px;
    box-shadow: 0 1px 6px rgba(60,64,67,.3);
    margin-bottom: 10px
}

.content-sub-heading {
    font-size: 20px;
    font-weight: 500;
    line-height: 28px
}

.page-brand .content-sub-heading {
    color: #3f51b5
}

.page-brand-accent .content-sub-heading {
    color: #4caf50
}

.page-green .content-sub-heading {
    color: #4caf50
}

.page-orange .content-sub-heading {
    color: #ff9800
}

.page-red .content-sub-heading {
    color: #f44336
}

.header-affix,.header-affix-hide {
    position: static!important
}

.FTsBWd {
    margin: 2px 0
}

.page-brand .header-transparent,.page-brand-accent .header-transparent {
    color: #fff;
    background-color: #4caf50
}

.header-red {
    background-color: #f44336;
    color: #fff
}

.header-affix {
    max-height: 48px;
    width: 0
}

.header-affix.affix {
    overflow: visible;
    width: auto
}

.header-seamed,.header-standard,.header-waterfall,.menu {
    position: fixed;
    left: 0;
    top: 0;
    right: 0
}

.header-affix-hide.affix {
    max-height: 48px;
    overflow: hidden;
    width: 0
}

.header-logo,.header-text,.menu-logo {
    display: block;
    float: left;
    font-weight: 300;
    height: 48px;
    line-height: 28px;
    margin: 0 16px;
    padding: 10px 0
}

.header-logo:focus,.header-logo:hover,.header-text:focus,.header-text:hover,.menu-logo:focus,.menu-logo:hover {
    text-decoration: none
}

.header-logo,.menu-logo {
    font-size: 20px
}

.header-logo img,.menu-logo img {
    display: block;
    max-height: 28px;
    width: auto
}

.header-standard {
    box-shadow: 0 1px 10px rgba(0,0,0,.5)
}

.header-transparent {
    background-color: transparent
}

.header-transparent.affix {
    background-color: #fff
}

.page-brand .header-transparent.affix {
    background-color: #4caf50
}

.page-green .header-transparent,.page-orange .header-transparent {
    color: rgba(0,0,0,.87)
}

.page-brand-accent .header-transparent.affix {
    background-color: #4caf50
}

.page-green .header-transparent.affix {
    background-color: #4caf50
}

.page-orange .header-transparent.affix {
    background-color: #ff9800
}

.page-red .header-transparent {
    color: #fff
}

.page-red .header-transparent.affix {
    background-color: #f44336
}

.menu {
    backface-visibility: hidden;
    display: none;
    overflow: hidden;
    outline: 0;
    bottom: 0;
    z-index: 31
}

.menu-collapse-toggle {
    background-color: transparent!important;
    cursor: pointer;
    display: block;
    float: right;
    padding: 14px 16px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1
}

.menu-collapse-toggle:hover {
    color: #4caf50!important
}

.menu-collapse-toggle-close {
    margin-top: -7px;
    margin-left: -7px;
    opacity: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform;
    width: 14px
}

.menu-collapse-toggle.collapsed .menu-collapse-toggle-close {
    opacity: 0;
    -webkit-transform: rotate(-225deg);
    -ms-transform: rotate(-225deg);
    transform: rotate(-225deg)
}

.menu-collapse-toggle-default {
    opacity: 0;
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    transition-property: opacity,-webkit-transform;
    transition-property: opacity,transform;
    transition-property: opacity,transform,-webkit-transform
}

.menu-collapse-toggle.collapsed .menu-collapse-toggle-default {
    opacity: 1;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0)
}

.menu-content {
    padding-top: 8px;
    padding-bottom: 8px
}

.menu-content .nav {
    margin-top: 0;
    margin-bottom: 0
}

.menu-content .nav .a,.menu-content .nav a {
    color: #212121;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.menu-content .nav li.active>.a,.menu-content .nav li.active>a,.page-brand .menu-content .nav li.active>.a,.page-brand .menu-content .nav li.active>a {
    color: #3f51b5
}

.menu-content .nav .a:focus,.menu-content .nav .a:hover,.menu-content .nav a:focus,.menu-content .nav a:hover {
    background-color: #f5f5f5
}

.menu-content .nav .a .breadcrumb>li+li:before,.menu-content .nav .a .fa,.menu-content .nav .a .icon,.menu-content .nav a .breadcrumb>li+li:before,.menu-content .nav a .fa,.menu-content .nav a .icon {
    margin-right: 16px
}

.menu-content .nav ul .a,.menu-content .nav ul a {
    font-weight: 400;
    padding-left: 32px
}

.menu-content .nav ul ul .a,.menu-content .nav ul ul a {
    font-size: 12px;
    font-weight: 300;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 48px
}

.no-boxshadow .menu-content .nav {
    margin-right: 1px
}

.no-boxshadow .menu.menu-right .menu-content .nav {
    margin-right: 0;
    margin-left: 1px
}

.page-brand-accent .menu-content .nav li.active>.a,.page-brand-accent .menu-content .nav li.active>a {
    color: #4caf50
}

.page-green .menu-content .nav li.active>.a,.page-green .menu-content .nav li.active>a {
    color: #4caf50
}

.page-orange .menu-content .nav li.active>.a,.page-orange .menu-content .nav li.active>a {
    color: #ff9800
}

.page-red .menu-content .nav li.active>.a,.page-red .menu-content .nav li.active>a {
    color: #f44336
}

.menu-logo,.menu-logo:focus,.menu-logo:hover {
    color: #212121
}

.menu-content-inner {
    padding-right: 16px;
    padding-left: 16px
}

.menu-backdrop {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: #000;
    opacity: 0;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transition: opacity .3s cubic-bezier(.4,0,.2,1);
    z-index: 30
}

.menu-backdrop.in {
    opacity: .5
}

.menu-logo {
    border-bottom: 1px solid #dadada;
    float: none;
    height: 56px;
    margin-right: 0;
    margin-bottom: 8px;
    margin-left: 0;
    padding: 14px 16px 13px
}

.menu-content>.menu-logo:first-child {
    margin-top: -8px
}

.menu-scroll {
    background-color: #fff;
    height: 100%;
    max-width: 85%;
    max-width: calc(100% - 64px);
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 0;
    left: -320px;
    transition-duration: .3s;
    transition-property: box-shadow,left;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    width: 320px;
    z-index: 1;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none
}

.menu.in .menu-scroll {
    box-shadow: 0 0 10px rgba(0,0,0,.5);
    left: 0
}

.menu-right .menu-scroll {
    right: -320px;
    left: auto;
    transition-property: box-shadow,right
}

.menu-right.in .menu-scroll {
    right: 0;
    left: auto
}

.no-boxshadow .menu-scroll:after {
    border-right: 1px solid #dadada;
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0
}

.no-boxshadow .menu.menu-right .menu-scroll:after {
    right: auto;
    left: 0
}

.menu-top {
    background-color: #000;
    color: #fff;
    position: relative;
    z-index: 1
}

.menu-top a,.menu-top a:focus,.menu-top a:hover {
    color: inherit;
    text-decoration: none
}

.menu-top-img {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    display: flex;
    height: 100%;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

.menu-top-img img {
    min-height: 100%;
    width: 100%;
    opacity: .5
}

.menu-top-info {
    padding: 12px 16px;
    position: relative
}

@media only screen and (min-width:768px) {
    .menu-top-info {
        padding-top: 24px;
        padding-bottom: 24px
    }

    .QRCode_Width {
        min-width: 560px
    }

    .qrgenerator__customizer .card-body {
        max-width: 600px!important
    }
}

.menu-top-info-sub {
    font-weight: 300;
    padding: 12px 16px;
    position: relative
}

@media only screen and (min-width:768px) {
    .menu-top-info-sub {
        padding-top: 24px
    }

    .QRCode_Width {
        min-width: 560px
    }
}

.tile-wrap .text-center {
    box-shadow: 0 -1px 0 transparent;
    background-color: #fff;
    padding: 0 8px 1px;
    border-radius: 0 0 8px 8px
}

@media(max-width:500px) {
    .content-heading {
        display: none
    }

    .card-inner {
        margin: 24px 14px;
        min-width: 0;
        position: relative
    }

    .qrgenerator__customizer .card {
        margin: 0!important
    }

    .cardmore {
        padding: 0 0 12px!important
    }

    .margin-top-no {
        margin-top: 0!important;
        margin-bottom: 0;
        border-radius: 0
    }

    .content-inner {
        padding: 0;
        box-shadow: none
    }

    .tile-wrap .text-center,.QR_Code_tile {
        border-radius: 0
    }

    .tile-wrap {
        margin-bottom: 0;
        border: 0 solid #298c2d;
        border-top: 2px solid #298c2d;
        border-radius: 0!important
    }

    .content-header {
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 10px;
        padding-top: 75px
    }
}

.menu-top-user {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex
}

.no-flexbox .menu-top-user:after,.no-flexbox .menu-top-user:before {
    content: "";
    display: table;
    line-height: 0
}

@media only screen and (min-width:992px) {
    .menu-scroll {
        max-width: none
    }

    .nav-drawer.nav-drawer-md {
        background-color: transparent;
        display: block!important;
        overflow: visible;
        width: 240px;
        z-index: 30
    }

    .QRCode_Width {
        min-width: 588px
    }

    .nav-drawer.nav-drawer-md .menu-scroll {
        box-shadow: 0 0 10px rgba(0,0,0,.5);
        left: 0;
        width: 240px
    }

    .nav-drawer.nav-drawer-md.menu-left~.content {
        margin-left: 240px
    }

    .nav-drawer.nav-drawer-md.menu-left~.content .content-heading,.nav-drawer.nav-drawer-md.menu-left~.content .content-inner {
        padding-left: 16px
    }

    .nav-drawer.nav-drawer-md.menu-left~.header {
        padding-left: 16px;
        left: 240px
    }

    .nav-drawer.nav-drawer-md.menu-right~.content {
        margin-right: 240px
    }

    .nav-drawer.nav-drawer-md.menu-right~.content .content-heading,.nav-drawer.nav-drawer-md.menu-right~.content .content-inner {
        padding-right: 16px
    }

    .nav-drawer.nav-drawer-md.menu-right~.header {
        padding-right: 16px;
        right: 240px
    }
}

@media only screen and (min-width:1440px) {
    .nav-drawer.nav-drawer-lg {
        background-color: transparent;
        display: block!important;
        overflow: visible;
        width: 240px;
        z-index: 30
    }

    .QRCode_Width {
        min-width: 588px
    }

    .nav-drawer.nav-drawer-lg .menu-scroll {
        box-shadow: 0 0 10px rgba(0,0,0,.5);
        left: 0;
        width: 240px
    }

    .nav-drawer.nav-drawer-lg.menu-left~.content {
        margin-left: 240px
    }

    .nav-drawer.nav-drawer-lg.menu-left~.content .content-heading,.nav-drawer.nav-drawer-lg.menu-left~.content .content-inner {
        padding-left: 16px
    }

    .nav-drawer.nav-drawer-lg.menu-left~.footer,.nav-drawer.nav-drawer-lg.menu-left~.header {
        padding-left: 16px;
        left: 240px
    }

    .nav-drawer.nav-drawer-lg.menu-right~.content {
        margin-right: 240px
    }

    .nav-drawer.nav-drawer-lg.menu-right~.content .content-heading,.nav-drawer.nav-drawer-lg.menu-right~.content .content-inner {
        padding-right: 16px
    }

    .nav-drawer.nav-drawer-lg.menu-right~.footer,.nav-drawer.nav-drawer-lg.menu-right~.header {
        padding-right: 16px;
        right: 240px
    }
}

.QR_Code_tile a {
    padding: 14px 6px
}

.ui-helper-hidden {
    display: none
}

.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.ui-helper-reset {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    line-height: 1.3;
    text-decoration: none;
    font-size: 100%;
    list-style: none
}

.ui-helper-clearfix:before,.ui-helper-clearfix:after {
    content: "";
    display: table;
    border-collapse: collapse
}

.ui-helper-clearfix:after {
    clear: both
}

.ui-helper-clearfix {
    min-height: 0
}

.ui-helper-zfix {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    opacity: 0;
    filter: Alpha(Opacity=0)
}

.ui-front {
    z-index: 100
}

.ui-state-disabled {
    cursor: default!important
}

.ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat
}

.ui-widget-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.ui-button {
    display: inline-block;
    position: relative;
    padding: 0;
    line-height: normal;
    margin-right: .1em;
    cursor: pointer;
    vertical-align: middle;
    text-align: center;
    overflow: visible
}

.ui-button,.ui-button:link,.ui-button:visited,.ui-button:hover,.ui-button:active {
    text-decoration: none
}

.ui-button-icon-only {
    width: 2.2em
}

button.ui-button-icon-only {
    width: 2.4em
}

.ui-button-icons-only {
    width: 3.4em
}

button.ui-button-icons-only {
    width: 3.7em
}

.ui-button .ui-button-text {
    display: block;
    line-height: normal
}

.ui-button-text-only .ui-button-text {
    padding: .4em 1em
}

.ui-button-icon-only .ui-button-text,.ui-button-icons-only .ui-button-text {
    padding: .4em;
    text-indent: -9999999px
}

.ui-button-text-icon-primary .ui-button-text,.ui-button-text-icons .ui-button-text {
    padding: .4em 1em .4em 2.1em
}

.ui-button-text-icon-secondary .ui-button-text,.ui-button-text-icons .ui-button-text {
    padding: .4em 2.1em .4em 1em
}

.ui-button-text-icons .ui-button-text {
    padding-left: 2.1em;
    padding-right: 2.1em
}

input.ui-button {
    padding: .4em 1em
}

.ui-button-icon-only .ui-icon,.ui-button-text-icon-primary .ui-icon,.ui-button-text-icon-secondary .ui-icon,.ui-button-text-icons .ui-icon,.ui-button-icons-only .ui-icon {
    position: absolute;
    top: 50%;
    margin-top: -8px
}

.ui-button-icon-only .ui-icon {
    left: 50%;
    margin-left: -8px
}

.ui-button-text-icon-primary .ui-button-icon-primary,.ui-button-text-icons .ui-button-icon-primary,.ui-button-icons-only .ui-button-icon-primary {
    left: .5em
}

.ui-button-text-icon-secondary .ui-button-icon-secondary,.ui-button-text-icons .ui-button-icon-secondary,.ui-button-icons-only .ui-button-icon-secondary {
    right: .5em
}

.ui-buttonset {
    margin-right: 7px
}

.ui-buttonset .ui-button {
    margin-left: 0;
    margin-right: -.3em
}

input.ui-button::-moz-focus-inner,button.ui-button::-moz-focus-inner {
    border: 0;
    padding: 0
}

.ui-spinner {
    position: relative;
    display: inline-block;
    overflow: hidden;
    padding: 0;
    vertical-align: middle
}

.ui-spinner-input {
    border: none;
    background: 0 0;
    color: inherit;
    padding: 0;
    margin: .2em 0;
    vertical-align: middle;
    margin-left: .4em;
    margin-right: 22px
}

.ui-spinner-button {
    width: 16px;
    height: 50%;
    font-size: .5em;
    padding: 0;
    margin: 0;
    text-align: center;
    position: absolute;
    cursor: default;
    display: block;
    overflow: hidden;
    right: 0
}

.ui-spinner a.ui-spinner-button {
    border-top: none;
    border-bottom: none;
    border-right: none;
    padding: 0;
    display: inline-block;
    position: absolute
}

.ui-spinner .ui-icon {
    position: absolute;
    margin-top: -8px;
    top: 50%;
    left: 0
}

.ui-spinner-up {
    top: 0
}

.ui-spinner-down {
    bottom: 0
}

.ui-spinner .ui-icon-triangle-1-s {
    background-position: -65px -16px
}

.ui-widget {
    font-family: Verdana,Arial,sans-serif;
    font-size: 1.1em
}

.ui-widget .ui-widget {
    font-size: 1em
}

.ui-widget input,.ui-widget select,.ui-widget textarea,.ui-widget button {
    font-family: Verdana,Arial,sans-serif;
    font-size: 1em
}

.ui-widget-content {
    border-bottom: 1px solid #4caf50;
    background: #fff url(images/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x;
    color: #222;
    width: 120px
}

.ui-widget-content a {
    color: #222
}

.ui-widget-header {
    border: 1px solid #aaa;
    background: #ccc url(images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x;
    color: #222;
    font-weight: 700
}

.ui-widget-header a {
    color: #222
}

.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default {
    font-weight: 400;
    color: #555
}

.ui-state-default a,.ui-state-default a:link,.ui-state-default a:visited {
    color: #555;
    text-decoration: none
}

.ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover,.ui-state-focus,.ui-widget-content .ui-state-focus,.ui-widget-header .ui-state-focus {
    font-weight: 400;
    color: #4caf50
}

.ui-state-hover a,.ui-state-hover a:hover,.ui-state-hover a:link,.ui-state-hover a:visited,.ui-state-focus a,.ui-state-focus a:hover,.ui-state-focus a:link,.ui-state-focus a:visited {
    color: #212121;
    text-decoration: none
}

.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active {
    border: 1px solid #aaa;
    background: #fff url(images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x;
    font-weight: 400;
    color: #212121
}

.ui-state-active a,.ui-state-active a:link,.ui-state-active a:visited {
    color: #212121;
    text-decoration: none
}

.ui-state-highlight,.ui-widget-content .ui-state-highlight,.ui-widget-header .ui-state-highlight {
    border: 1px solid #fcefa1;
    background: #fbf9ee url(images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x;
    color: #363636
}

.ui-state-highlight a,.ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a {
    color: #363636
}

.ui-state-error,.ui-widget-content .ui-state-error,.ui-widget-header .ui-state-error {
    border: 1px solid #cd0a0a;
    background: #fef1ec url(images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x;
    color: #cd0a0a
}

.ui-state-error a,.ui-widget-content .ui-state-error a,.ui-widget-header .ui-state-error a {
    color: #cd0a0a
}

.ui-state-error-text,.ui-widget-content .ui-state-error-text,.ui-widget-header .ui-state-error-text {
    color: #cd0a0a
}

.ui-priority-primary,.ui-widget-content .ui-priority-primary,.ui-widget-header .ui-priority-primary {
    font-weight: 700
}

.ui-priority-secondary,.ui-widget-content .ui-priority-secondary,.ui-widget-header .ui-priority-secondary {
    opacity: .7;
    filter: Alpha(Opacity=70);
    font-weight: 400
}

.ui-state-disabled,.ui-widget-content .ui-state-disabled,.ui-widget-header .ui-state-disabled {
    opacity: .35;
    filter: Alpha(Opacity=35);
    background-image: none
}

.ui-state-disabled .ui-icon {
    filter: Alpha(Opacity=35)
}

.ui-icon {
    width: 16px;
    height: 16px
}

.ui-icon,.ui-widget-content .ui-icon {
    background-image: url(images/ui-icons_222222_256x240.png)
}

.ui-widget-header .ui-icon {
    background-image: url(images/ui-icons_222222_256x240.png)
}

.ui-state-default .ui-icon {
    background-image: url(images/ui-icons_888888_256x240.png)
}

.ui-state-hover .ui-icon,.ui-state-focus .ui-icon {
    background-image: url(images/ui-icons_454545_256x240.png)
}

.ui-state-active .ui-icon {
    background-image: url(images/ui-icons_454545_256x240.png)
}

.ui-state-highlight .ui-icon {
    background-image: url(images/ui-icons_2e83ff_256x240.png)
}

.ui-state-error .ui-icon,.ui-state-error-text .ui-icon {
    background-image: url(images/ui-icons_cd0a0a_256x240.png)
}

.ui-icon-blank {
    background-position: 16px 16px
}

.ui-icon-carat-1-n {
    background-position: 0 0
}

.ui-icon-carat-1-ne {
    background-position: -16px 0
}

.ui-icon-carat-1-e {
    background-position: -32px 0
}

.ui-icon-carat-1-se {
    background-position: -48px 0
}

.ui-icon-carat-1-s {
    background-position: -64px 0
}

.ui-icon-carat-1-sw {
    background-position: -80px 0
}

.ui-icon-carat-1-w {
    background-position: -96px 0
}

.ui-icon-carat-1-nw {
    background-position: -112px 0
}

.ui-icon-carat-2-n-s {
    background-position: -128px 0
}

.ui-icon-carat-2-e-w {
    background-position: -144px 0
}

.ui-icon-triangle-1-n {
    background-position: 0 -16px
}

.ui-icon-triangle-1-ne {
    background-position: -16px -16px
}

.ui-icon-triangle-1-e {
    background-position: -32px -16px
}

.ui-icon-triangle-1-se {
    background-position: -48px -16px
}

.ui-icon-triangle-1-s {
    background-position: -64px -16px
}

.ui-icon-triangle-1-sw {
    background-position: -80px -16px
}

.ui-icon-triangle-1-w {
    background-position: -96px -16px
}

.ui-icon-triangle-1-nw {
    background-position: -112px -16px
}

.ui-icon-triangle-2-n-s {
    background-position: -128px -16px
}

.ui-icon-triangle-2-e-w {
    background-position: -144px -16px
}

.ui-icon-arrow-1-n {
    background-position: 0 -32px
}

.ui-icon-arrow-1-ne {
    background-position: -16px -32px
}

.ui-icon-arrow-1-e {
    background-position: -32px -32px
}

.ui-icon-arrow-1-se {
    background-position: -48px -32px
}

.ui-icon-arrow-1-s {
    background-position: -64px -32px
}

.ui-icon-arrow-1-sw {
    background-position: -80px -32px
}

.ui-icon-arrow-1-w {
    background-position: -96px -32px
}

.ui-icon-arrow-1-nw {
    background-position: -112px -32px
}

.ui-icon-arrow-2-n-s {
    background-position: -128px -32px
}

.ui-icon-arrow-2-ne-sw {
    background-position: -144px -32px
}

.ui-icon-arrow-2-e-w {
    background-position: -160px -32px
}

.ui-icon-arrow-2-se-nw {
    background-position: -176px -32px
}

.ui-icon-arrowstop-1-n {
    background-position: -192px -32px
}

.ui-icon-arrowstop-1-e {
    background-position: -208px -32px
}

.ui-icon-arrowstop-1-s {
    background-position: -224px -32px
}

.ui-icon-arrowstop-1-w {
    background-position: -240px -32px
}

.ui-icon-arrowthick-1-n {
    background-position: 0 -48px
}

.ui-icon-arrowthick-1-ne {
    background-position: -16px -48px
}

.ui-icon-arrowthick-1-e {
    background-position: -32px -48px
}

.ui-icon-arrowthick-1-se {
    background-position: -48px -48px
}

.ui-icon-arrowthick-1-s {
    background-position: -64px -48px
}

.ui-icon-arrowthick-1-sw {
    background-position: -80px -48px
}

.ui-icon-arrowthick-1-w {
    background-position: -96px -48px
}

.ui-icon-arrowthick-1-nw {
    background-position: -112px -48px
}

.ui-icon-arrowthick-2-n-s {
    background-position: -128px -48px
}

.ui-icon-arrowthick-2-ne-sw {
    background-position: -144px -48px
}

.ui-icon-arrowthick-2-e-w {
    background-position: -160px -48px
}

.ui-icon-arrowthick-2-se-nw {
    background-position: -176px -48px
}

.ui-icon-arrowthickstop-1-n {
    background-position: -192px -48px
}

.ui-icon-arrowthickstop-1-e {
    background-position: -208px -48px
}

.ui-icon-arrowthickstop-1-s {
    background-position: -224px -48px
}

.ui-icon-arrowthickstop-1-w {
    background-position: -240px -48px
}

.ui-icon-arrowreturnthick-1-w {
    background-position: 0 -64px
}

.ui-icon-arrowreturnthick-1-n {
    background-position: -16px -64px
}

.ui-icon-arrowreturnthick-1-e {
    background-position: -32px -64px
}

.ui-icon-arrowreturnthick-1-s {
    background-position: -48px -64px
}

.ui-icon-arrowreturn-1-w {
    background-position: -64px -64px
}

.ui-icon-arrowreturn-1-n {
    background-position: -80px -64px
}

.ui-icon-arrowreturn-1-e {
    background-position: -96px -64px
}

.ui-icon-arrowreturn-1-s {
    background-position: -112px -64px
}

.ui-icon-arrowrefresh-1-w {
    background-position: -128px -64px
}

.ui-icon-arrowrefresh-1-n {
    background-position: -144px -64px
}

.ui-icon-arrowrefresh-1-e {
    background-position: -160px -64px
}

.ui-icon-arrowrefresh-1-s {
    background-position: -176px -64px
}

.ui-icon-arrow-4 {
    background-position: 0 -80px
}

.ui-icon-arrow-4-diag {
    background-position: -16px -80px
}

.ui-icon-extlink {
    background-position: -32px -80px
}

.ui-icon-newwin {
    background-position: -48px -80px
}

.ui-icon-refresh {
    background-position: -64px -80px
}

.ui-icon-shuffle {
    background-position: -80px -80px
}

.ui-icon-transfer-e-w {
    background-position: -96px -80px
}

.ui-icon-transferthick-e-w {
    background-position: -112px -80px
}

.ui-icon-folder-collapsed {
    background-position: 0 -96px
}

.ui-icon-folder-open {
    background-position: -16px -96px
}

.ui-icon-document {
    background-position: -32px -96px
}

.ui-icon-document-b {
    background-position: -48px -96px
}

.ui-icon-note {
    background-position: -64px -96px
}

.ui-icon-mail-closed {
    background-position: -80px -96px
}

.ui-icon-mail-open {
    background-position: -96px -96px
}

.ui-icon-suitcase {
    background-position: -112px -96px
}

.ui-icon-comment {
    background-position: -128px -96px
}

.ui-icon-person {
    background-position: -144px -96px
}

.ui-icon-print {
    background-position: -160px -96px
}

.ui-icon-trash {
    background-position: -176px -96px
}

.ui-icon-locked {
    background-position: -192px -96px
}

.ui-icon-unlocked {
    background-position: -208px -96px
}

.ui-icon-bookmark {
    background-position: -224px -96px
}

.ui-icon-tag {
    background-position: -240px -96px
}

.ui-icon-home {
    background-position: 0 -112px
}

.ui-icon-flag {
    background-position: -16px -112px
}

.ui-icon-calendar {
    background-position: -32px -112px
}

.ui-icon-cart {
    background-position: -48px -112px
}

.ui-icon-pencil {
    background-position: -64px -112px
}

.ui-icon-clock {
    background-position: -80px -112px
}

.ui-icon-disk {
    background-position: -96px -112px
}

.ui-icon-calculator {
    background-position: -112px -112px
}

.ui-icon-zoomin {
    background-position: -128px -112px
}

.ui-icon-zoomout {
    background-position: -144px -112px
}

.ui-icon-search {
    background-position: -160px -112px
}

.ui-icon-wrench {
    background-position: -176px -112px
}

.ui-icon-gear {
    background-position: -192px -112px
}

.ui-icon-heart {
    background-position: -208px -112px
}

.ui-icon-star {
    background-position: -224px -112px
}

.ui-icon-link {
    background-position: -240px -112px
}

.ui-icon-cancel {
    background-position: 0 -128px
}

.ui-icon-plus {
    background-position: -16px -128px
}

.ui-icon-plusthick {
    background-position: -32px -128px
}

.ui-icon-minus {
    background-position: -48px -128px
}

.ui-icon-minusthick {
    background-position: -64px -128px
}

.ui-icon-close {
    background-position: -80px -128px
}

.ui-icon-closethick {
    background-position: -96px -128px
}

.ui-icon-key {
    background-position: -112px -128px
}

.ui-icon-lightbulb {
    background-position: -128px -128px
}

.ui-icon-scissors {
    background-position: -144px -128px
}

.ui-icon-clipboard {
    background-position: -160px -128px
}

.ui-icon-copy {
    background-position: -176px -128px
}

.ui-icon-contact {
    background-position: -192px -128px
}

.ui-icon-image {
    background-position: -208px -128px
}

.ui-icon-video {
    background-position: -224px -128px
}

.ui-icon-script {
    background-position: -240px -128px
}

.ui-icon-alert {
    background-position: 0 -144px
}

.ui-icon-info {
    background-position: -16px -144px
}

.ui-icon-notice {
    background-position: -32px -144px
}

.ui-icon-help {
    background-position: -48px -144px
}

.ui-icon-check {
    background-position: -64px -144px
}

.ui-icon-bullet {
    background-position: -80px -144px
}

.ui-icon-radio-on {
    background-position: -96px -144px
}

.ui-icon-radio-off {
    background-position: -112px -144px
}

.ui-icon-pin-w {
    background-position: -128px -144px
}

.ui-icon-pin-s {
    background-position: -144px -144px
}

.ui-icon-play {
    background-position: 0 -160px
}

.ui-icon-pause {
    background-position: -16px -160px
}

.ui-icon-seek-next {
    background-position: -32px -160px
}

.ui-icon-seek-prev {
    background-position: -48px -160px
}

.ui-icon-seek-end {
    background-position: -64px -160px
}

.ui-icon-seek-start {
    background-position: -80px -160px
}

.ui-icon-seek-first {
    background-position: -80px -160px
}

.ui-icon-stop {
    background-position: -96px -160px
}

.ui-icon-eject {
    background-position: -112px -160px
}

.ui-icon-volume-off {
    background-position: -128px -160px
}

.ui-icon-volume-on {
    background-position: -144px -160px
}

.ui-icon-power {
    background-position: 0 -176px
}

.ui-icon-signal-diag {
    background-position: -16px -176px
}

.ui-icon-signal {
    background-position: -32px -176px
}

.ui-icon-battery-0 {
    background-position: -48px -176px
}

.ui-icon-battery-1 {
    background-position: -64px -176px
}

.ui-icon-battery-2 {
    background-position: -80px -176px
}

.ui-icon-battery-3 {
    background-position: -96px -176px
}

.ui-icon-circle-plus {
    background-position: 0 -192px
}

.ui-icon-circle-minus {
    background-position: -16px -192px
}

.ui-icon-circle-close {
    background-position: -32px -192px
}

.ui-icon-circle-triangle-e {
    background-position: -48px -192px
}

.ui-icon-circle-triangle-s {
    background-position: -64px -192px
}

.ui-icon-circle-triangle-w {
    background-position: -80px -192px
}

.ui-icon-circle-triangle-n {
    background-position: -96px -192px
}

.ui-icon-circle-arrow-e {
    background-position: -112px -192px
}

.ui-icon-circle-arrow-s {
    background-position: -128px -192px
}

.ui-icon-circle-arrow-w {
    background-position: -144px -192px
}

.ui-icon-circle-arrow-n {
    background-position: -160px -192px
}

.ui-icon-circle-zoomin {
    background-position: -176px -192px
}

.ui-icon-circle-zoomout {
    background-position: -192px -192px
}

.ui-icon-circle-check {
    background-position: -208px -192px
}

.ui-icon-circlesmall-plus {
    background-position: 0 -208px
}

.ui-icon-circlesmall-minus {
    background-position: -16px -208px
}

.ui-icon-circlesmall-close {
    background-position: -32px -208px
}

.ui-icon-squaresmall-plus {
    background-position: -48px -208px
}

.ui-icon-squaresmall-minus {
    background-position: -64px -208px
}

.ui-icon-squaresmall-close {
    background-position: -80px -208px
}

.ui-icon-grip-dotted-vertical {
    background-position: 0 -224px
}

.ui-icon-grip-dotted-horizontal {
    background-position: -16px -224px
}

.ui-icon-grip-solid-vertical {
    background-position: -32px -224px
}

.ui-icon-grip-solid-horizontal {
    background-position: -48px -224px
}

.ui-icon-gripsmall-diagonal-se {
    background-position: -64px -224px
}

.ui-icon-grip-diagonal-se {
    background-position: -80px -224px
}

.ui-corner-all,.ui-corner-top,.ui-corner-left,.ui-corner-tl {
}

.ui-corner-all,.ui-corner-top,.ui-corner-right,.ui-corner-tr {
}

.ui-corner-all,.ui-corner-bottom,.ui-corner-left,.ui-corner-bl {
}

.ui-corner-all,.ui-corner-bottom,.ui-corner-right,.ui-corner-br {
}

.ui-widget-overlay {
    background: #aaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;
    opacity: .3;
    filter: Alpha(Opacity=30)
}

.ui-widget-shadow {
    margin: -8px 0 0 -8px;
    padding: 8px;
    background: #aaa url(images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x;
    opacity: .3;
    filter: Alpha(Opacity=30);
    border-radius: 8px
}

.pageload-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 5000
}

.pageload-overlay.show {
    visibility: visible
}

.pageload-overlay svg {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none
}

.pageload-overlay::after,.pageload-overlay::before {
    content: '';
    position: fixed;
    width: 20px;
    height: 20px;
    top: 50%;
    left: 50%;
    margin: -10px 0 0 -10px;
    border-radius: 50%;
    visibility: hidden;
    opacity: 0;
    z-index: 1000;
    -webkit-transition: opacity .15s,visibility 0s .15s;
    transition: opacity .15s,visibility 0s .15s
}

.pageload-overlay::after {
    background: #6cc88a;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
    -webkit-animation: moveRight .6s linear infinite alternate;
    animation: moveRight .6s linear infinite alternate
}

.pageload-overlay::before {
    background: #4fc3f7;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
    -webkit-animation: moveLeft .6s linear infinite alternate;
    animation: moveLeft .6s linear infinite alternate
}

@-webkit-keyframes moveRight {
    to {
        -webkit-transform: translateX(20px)
    }
}

@keyframes moveRight {
    to {
        transform: translateX(20px)
    }
}

@-webkit-keyframes moveLeft {
    to {
        -webkit-transform: translateX(-20px)
    }
}

@keyframes moveLeft {
    to {
        transform: translateX(-20px)
    }
}

.pageload-loading.pageload-overlay::after,.pageload-loading.pageload-overlay::before {
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity .3s;
    transition: opacity .3s
}

.ath-viewport * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.ath-viewport {
    position: relative;
    z-index: 2147483641;
    pointer-events: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    -o-text-size-adjust: none;
    text-size-adjust: none
}

.ath-modal {
    pointer-events: auto!important;
    background: rgba(0,0,0,.6)
}

.ath-mandatory {
    background: #000
}

.ath-container {
    pointer-events: auto!important;
    position: absolute;
    z-index: 2147483641;
    padding: .7em .6em;
    width: 18em;
    background: #eee;
    background-size: 100% auto;
    box-shadow: 0 .2em 0 #ff9800;
    font-family: sans-serif;
    font-size: 15px;
    line-height: 1.5em;
    text-align: center
}

.ath-container small {
    font-size: .8em;
    line-height: 1.3em;
    display: block;
    margin-top: .5em
}

.ath-ios.ath-phone {
    bottom: 1.8em;
    left: 50%;
    margin-left: -9em
}

.ath-ios6.ath-tablet {
    left: 5em;
    top: 1.8em
}

.ath-ios7.ath-tablet {
    left: .7em;
    top: 1.8em
}

.ath-ios8.ath-tablet,.ath-ios9.ath-tablet {
    right: .4em;
    top: 1.8em
}

.ath-android {
    bottom: 1.8em;
    left: 50%;
    margin-left: -9em
}

.ath-container:before {
    content: '';
    position: relative;
    display: block;
    float: right;
    margin: -.7em -.6em 0 .5em;
    background-image: url(data:image/png;
    base64,iVBORw0KGgoAAAANSUhEUgAAAIQAAACECAMAAABmmnOVAAAAdVBMVEUAAAA5OTkzMzM7Ozs3NzdBQUFAQEA/Pz8+Pj5BQUFAQEA/Pz8+Pj5BQUFAQEA/Pz9BQUE+Pj4/Pz8/Pz8+Pj4/Pz8/Pz8/Pz8+Pj4/Pz8+Pj4/Pz8/Pz8/Pz8/Pz8/Pz8+Pj4/Pz8/Pz8/Pz8/Pz9AQEA/Pz+fdCaPAAAAJnRSTlMACQoNDjM4OTo7PEFCQ0RFS6ytsbS1tru8vcTFxu7x8vX19vf4+C5yomAAAAJESURBVHgBvdzLTsJAGEfxr4C2KBcVkQsIDsK8/yPaqIsPzVlyzrKrX/5p0kkXEz81L23otc9NpIbbWia2YVLqdnhlqFlhGWpSDHe1aopsSIpRb8gK0dC3G30b9rVmhWZIimTICsvQtx/FsuYOrWHoDjX3Gu31gzJxdki934WrAIOsAIOsAIOiAMPhPsJTgKGN0BVsYIVsYIVpYIVpYIVpYIVpYIVpYIVpYIVpYIVlAIVgEBRs8BRs8BRs8BRs8BRs8BRs8BRs8BRTNmgKNngKNngKNngKNngKNhiKGxgiOlZoBlaYBlaYBlaYBlaYBlaYBlaYBlaYBlZIBlBMfQMrVAMr2KAqBENSHFHhGEABhi5CV6gGUKgGUKgGUKgGUFwuqgEUvoEVsoEVpoEUpgEUggF+gKTKY+h1fxSlC7/Z+RrxOQ3fcEoAPPHZBlaYBlaYBlaYBlZYBlYIhvLBCstw7PgM7hkiWOEZWGEaWGEaWGEaIsakEAysmHkGVpxmvoEVqoEVpoEVpoEVpoEVpoEVpoEVkoEVgkFQsEFSsEFQsGEcoSvY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnY4CnmbNAUT2c2WAo2eAo2eAo2eAo2eAo2eArNEPFACjZ4CjZ4CjZ4CjaIird/rBvFH6llNCvewdli1URWCIakSIZesUaDoFg36dKFWk9zCZDei3TtwmCj7pC22AwikiIZPEU29IpFNliKxa/hC9DFITjQPYhcAAAAAElFTkSuQmCC);background-color: rgba(255,255,255,.8);
    background-size: 50%;
    background-repeat: no-repeat;
    background-position: 50%;
    width: 2.7em;
    height: 2.7em;
    text-align: center;
    overflow: hidden;
    color: #a33;
    z-index: 2147483642
}

.ath-container.ath-icon:before {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    float: none
}

.ath-mandatory .ath-container:before {
    display: none
}

.ath-container.ath-android:before {
    float: left;
    margin: -.7em .5em 0 -.6em
}

.ath-container.ath-android.ath-icon:before {
    position: absolute;
    right: auto;
    left: 0;
    margin: 0;
    float: none
}

.ath-container.ath-icon {
}

.ath-action-icon {
    display: inline-block;
    vertical-align: middle;
    background-position: 50%;
    background-repeat: no-repeat;
    text-indent: -9999em;
    overflow: hidden
}

.ath-ios7 .ath-action-icon,.ath-ios8 .ath-action-icon,.ath-ios9 .ath-action-icon {
    width: 1.6em;
    height: 1.6em;
    background-image: url(data:image/png;
    base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAACtCAYAAAB7l7tOAAAF6UlEQVR4AezZWWxUZRiH8VcQEdxZEFFiUZBFUCIa1ABBDARDcCciYGKMqTEGww3SOcNSAwQTjOBiiIpEhRjAhRgXRC8MFxojEhAFZUGttVhaoSxlaW3n8W3yXZxm6vTrOMM5Q98n+V9MMu1pvl++uZhKuypghu49KaaTWGdZSYoVN6VD95nMpLNYZ9XNbdQR2od2k88O3Gm6Bh0t7H0p5Vwp2Ax3ajpu2tYbciFWwkTFO63DY6+JcI4USFaSyYpWp8N7SVZJKR3EinkBk9JxvZFXxhnZSjBaoWp1ZL0ES8WKYXMZp0AndORgy8WKFe5Yf1zvvSBWDEpys2LU6MjD5kmEWQlGKsJRHXlcqUSQVcItEnDEA6gAb7LhjvD9WO6yIEfICQI5A1nzGCYB1T4og5bBiFcyv2f6ujYhl4iVxwKG6qp8MK55HsqPwK0rMr9v/yEo3uCPrJstVh5KMER30Aeh31Ioq0FrHfjXw9CYghnrvYFTuqfEymFzGSwBlT4ARYr7u+K6GLmCVGvAGg2NMG0d/sgJnpScZLjXSkC5z8H3eQ72/k24Q8NfzvwFyK4qtuJSZKaubRPyE/K/Mtx+EvCHL+7uasId1t10w0scz/RzSzYzAfgKV30D3LPaG7lRkR8RK4tKKJKAMp+D7r0EfmmOe0x3m2itAc/ZxBjgAt1mXHWKPPkdb+QGSTJdrDaU5EoJ2OtzwD0WwY7KNNzbRfMFFg24WPdtGHnS221Cflgsj56hjwTs8TnY7oq7/QDhjutGicsb2AVcovsO18l6uPPNNiE/JFaGAq7Q7fY50G4LYVtz3FrdaNGyBXbIl+q24DqhyHes9EaulwR3SwtZs+ktAT/7HORliru1gnCndONFyx44Dfn7MPLYN7yR6yTJZAllJeguAT/4HOBFz8I3ZWm4E0TLFbBD7qn7EVdtHYx53R9ZN0ksrZRuErDN5+AuLIWvm+Oe1k0ULdfADrmX7idcR0/DyBXeyCdlLuMMOGCBz4F1ng+f7yFcve5e0fIFHELeiav6BAx70Rt5p0yhY3u/wR0kyarW/uX35b403PtFyzewQ75ctwtXzSkY8WqruHslSV8RscrL6TJ1bcvfWJ0/HzbtIdw/ugdFyzdwOOAq3T6fmzxwGQ3vbmO8iFioIWqYSsHMj9M/ljfuTsOdItoZBXYBfXX7cVXVwvXLm/8+fU3lcdCqdEMNGBbgUmRmfQISQKd5sGEn4VK6YtEiAXYBA3QVuA4q8hCHrDcafR1ul65jewfuovsCl7vJrNlOuEbdo6JFCuwCrtb9hqusBu56Cw4cI1y1briIWEBn3Ue0XKPuMdGiBg4H9NdV0HJ/6QZLOEPmPN0GmpfSPS5arIBdwHUtIFfoBsl/ZsgfhHCfFi2WwC5goO4AmvanbqBkzJA76tboZokWa2AXMEi3RTdAvDLkDqJFAhzB32xFD2wZsGXA0WfAlgFbBmwZsGXAlgFbBpzk04JaKb0iA9ZnF9x5SQAFtRKKIgPWZxfaeRmwAZ/BGbAB37eaG6MCbnq2Aed5czYyKirgpmcbsAHHZAZswN0Wwo7KeG1fFf2jAm56dtzOQ42yB+65mDhWFBUwUETMUiMDNmADbp/APRaTAh6I2bpGCNw1bufRZJQ1cPdF/NueHZsgDEBBGLbMGoIu4AZu5gLOZeEaYmEXeznF3jRPyEv4frgJvvJe3qTefY0AAwYMGDBgwIABAwYMGDBgwIABAwYMGDBgwIABAwYMGDBgwIABAwYMGDBgwIABAwYMGDBgwIABAwb8rwADBgwYMGDAgAEDBgwYMGDAgAEDBgwYMGDAgAEDBgz4/sz1Nia/9hizA7zgklwy3RYwYMBzBRjw4bPjxAbAAizAAtwgwAIswAIswAIMGDBgARZgARZgAS4FWIAFWIAFWIABAwYswAIswAIswIUAC7AAC7AACzBgwIAFWIAFWIAFuBBgARZgARZgAQYMGPApQ99ZCdgWtzqwATbABtgAG2DbnxNb7zbRimsMLMACrDf2wMWI/WasfQAAAABJRU5ErkJggg==);margin-top: -.3em;
    background-size: auto 100%
}

.ath-ios6 .ath-action-icon {
    width: 1.8em;
    height: 1.8em;
    background-image: url(data:image/png;
    base64,iVBORw0KGgoAAAANSUhEUgAAAJAAAAB0CAQAAADAmnOnAAAAAnNCSVQICFXsRgQAAAAJcEhZcwAAWwEAAFsBAXkZiFwAAAAZdEVYdFNvZnR3YXJlAHd3dy5pbmtzY2FwZS5vcmeb7jwaAAAF4klEQVR4Ae3a/a+XdR3H8ec5HM45HDmKICoVohkZsxESRRCzcZM/2JKkdGR5MrSkleA0Pd00O4u5IVuNM2yYc6XSzCExU4oUNRPCJFdMUAhsYZpUGhscOHA4N8/WZzsL6HBxvofvdV3fa3yer//gsV3vH659KHzncBsJxUYhDzOEhCKQbORs+ip2wzgM+wvj+P9i35qAGLaHGcQSgKSTrxBLABJppZpYApCspoFYApBsZjSxBCD5OxOJJQBJG1cQSwCSLpqJJQCJ3MvgCGTinuSMCJS8LZwfgZL3FtMiUPIOcU0ESl4PLRHoRPsJtREoeRsYGYGS9yrvo6RmpbLaigWSfzOdErLs6+bLUMFA0sF1+QF1cz1UNlBYK9V5AHXyWSgEkKyiIWOgGh829Ki1lLcaxjCVK7mJRSxjBY+zgRf/u9pXcMB7jhEZAg32EUP3O6hMKOP5Iq2sZQeHMZXt5KKMgOpcY+iHVnFyjeQKlrCBdsxge5ieAVC9vzLUelI8H+A7bKIHM10H81IGGuKvDf1ggDxVTKOV1zG3/Yia1ICG+ltD32MgNTKfP2HuW0VDKkCNrjfUTOm9i6XswwrZJkaVHeh0f2fodkrtfO6jAytqrzG+rEDDfVG1x1sprZEs5RBW4PZxeT+Bbrf5hPu9arfzKaU6WjiAFbseWvoF1GW/6vYGSmkyW7Dit4xB5QHq9Br6Xx2t9GAhtp6zkoHsfNp1J9wX6H+jeR4LtJc4LxGopZZyNpN/YcG2mw9nBTSPLizgOmjKAujGgvJID3ekD7QYi7nGzkvmQtpA38Vi7iJf0TedlC7QTVjMfcY2QyvSBPpUMW/PIBfbo9pls1XpAX2EdizeznStob3OJpQO0DB2YfE21q2GtnghpAm0Gou3T9tm6BGHQppA12HRVt17eboNlydNoLHsx2JtmL801OYcQmkC/QKLtQt9ydBW3wNpA30ci7Ur3WdolUMhbaBqNhf/8qQJ9Hkszs5wjaH9XkUobaAqtmFRdoGbDb3sWMgG6DIs5852knO82RaXer+P+qyb3eWeo7ZNBrRZvm1otY2QFdBjeHIb6hTne49Put12+9ObMoDdYmfy5UkF6AK6cCCr9aM2u9IddptcOYCG+FNDB5xLKCugO7G01TndFp/xgAntdYvrfdwVLnORt3q9Vx25F27DUjbGPxr6qxMgW6Cd2N+d6wLXedA+6nKbK73Lr/pJxzusvE/wZrvX0FOOgGyBxmF/dprXutYOj6nNdS6xyYnWp/dGcaGdhr5vDWQN9E1MXrUzfcA2j2qPj/l1J1uT9iPOeh8w1O7nCGUN9HzyGZ7ndo9qp0ucanU2r1xH+wdDu5wIeQDVVx0+/kd1i697RNv8thdn+Qz4Uv9p6DeOhHyApmBfq3OBu+3Nfd7nVELZAX3Nw4ZarYG8gG7GY1dlk6/Zm3/2Rk8jlB1QvT82dNAmQjkBVf8Mj957fdrefM7ZVhPKEuidvmDob06CXIGGbsX/bZDf8KAhfdbJhLIGmuZuQ084HHIGatiLvRvrRkP6qldbBXkAzbfD0N0OhryBGqrEMOd50FC7d1hPKGugBh8ydMh5hPIGGouI1d5lj6F1vptQ9kDvcKOhN5wMlQH0QcRGnzC03yZCeQDN9G1D6xwBFQI07FI8x02GdjgB8gJqttPQcmuhYoAumzvG7YZWejrkA1TrPYYO+SVCFQO0aM4bqj0uJJQH0LluSP7PkyeQU9QOmyAvoBm+Zegpz4LKA/qYB/wE5AXUe3m81zqoRKAPOYWcuvP9dxvqcD6h7IAKkaNU3eUlHLcI9EzS5YlAi62h/zUy89QCqqKUmvgHywsJlEHnsQYxAvXVIJo5gIhnPhiBju1iNmLvLn85Ah1ZPYs5jBGo72awEzEC9dVwHqQHI9DxWoAYgSLQQKteGIESu/qhCJTYtT+PQBEoAkWgCBSBkotAEehUWwSKQBEoAkWg/BeBIlAEikARKAJFoFmealu4gVLy1Gt5dkARKAL9BzujPSurTmu/AAAAAElFTkSuQmCC);margin-bottom: .4em;
    background-size: 100% auto
}

.ath-android .ath-action-icon {
    width: 1.4em;
    height: 1.5em;
    background-image: url(data:image/png;
    base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAANlBMVEVmZmb///9mZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZmZW6fJrAAAAEXRSTlMAAAYHG21ub8fLz9DR8/T4+RrZ9owAAAB3SURBVHja7dNLDoAgDATQWv4gKve/rEajJOJiWLgg6WzpSyB0aHqHiNj6nL1lovb4C+hYzkSNAT7mryQFAVOeGAj4CjwEtgrWXpD/uZKtwEJApXt+Vn0flzRhgNiFZQkOXY0aADQZCOCPlsZJ46Rx0jhp3IiN2wGDHhxtldrlwQAAAABJRU5ErkJggg==);background-size: 100% auto
}

.ath-container p {
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 2147483642;
    text-shadow: 0 .1em 0 #fff;
    font-size: 1.1em
}

.ath-ios.ath-phone:after {
    content: '';
    background: #eee;
    position: absolute;
    width: 2em;
    height: 2em;
    bottom: -.9em;
    left: 50%;
    margin-left: -1em;
    -webkit-transform: scaleX(.9) rotate(45deg);
    transform: scaleX(.9) rotate(45deg);
    box-shadow: .2em .2em 0 #ff9800
}

.ath-ios.ath-tablet:after {
    content: '';
    background: #eee;
    position: absolute;
    width: 2em;
    height: 2em;
    top: -.9em;
    left: 50%;
    margin-left: -1em;
    -webkit-transform: scaleX(.9) rotate(45deg);
    transform: scaleX(.9) rotate(45deg);
    z-index: 2147483641
}

.ath-application-icon {
    position: relative;
    padding: 0;
    border: 0;
    margin: 0 auto .2em;
    height: 6em;
    width: 6em;
    z-index: 2147483642
}

.ath-container.ath-ios .ath-application-icon {
    border-radius: 1em;
    box-shadow: 0 .2em .4em rgba(0,0,0,.3),inset 0 .07em 0 rgba(255,255,255,.5);
    margin: 0 auto .4em
}

@media only screen and (orientation:landscape) {
    .ath-container.ath-phone {
        width: 24em
    }

    .ath-android.ath-phone {
        margin-left: -12em
    }

    .ath-ios.ath-phone {
        margin-left: -12em
    }

    .ath-ios6:after {
        left: 39%
    }

    .ath-ios8.ath-phone {
        left: auto;
        bottom: auto;
        right: .4em;
        top: 1.8em
    }

    .ath-ios8.ath-phone:after {
        bottom: auto;
        top: -.9em;
        left: 68%;
        z-index: 2147483641;
        box-shadow: none
    }
}

label {
    float: left;
    padding-top: 6px;
    padding-right: 16px
}

@keyframes unfinished-bubble-show {
    0% {
        opacity: 0;
        transform: scale(0) translate(0,0)
    }

    20% {
        opacity: 1;
        transform: scale(1) translate(0,0)
    }

    35% {
        transform: scale(1) translate(0,-10px)
    }

    50% {
        transform: scale(1) translate(0,0)
    }

    65% {
        transform: scale(1) translate(0,-10px)
    }

    80% {
        transform: scale(1) translate(0,0);
        opacity: 1
    }

    95% {
        transform: scale(1.1) translate(0,-10px);
        opacity: 0
    }

    100% {
        transform: scale(0) translate(0,0);
        opacity: 0
    }
}

.unfinished-bubble-container.hidden {
    display: none
}

.unfinished-bubble-container {
    position: absolute;
    z-index: 3;
    display: block;
    top: 52px;
    animation: unfinished-bubble-show 4s infinite
}

.unfinished-bubble-container .unfinished-bubble {
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(244,2,6) 100%);
    box-shadow: 0 2px 5px 0 rgba(113,113,113,.51);
    border-radius: 4px;
    height: 24px;
    position: relative;
    display: inline-block;
    text-align: left;
    left: 10px;
    line-height: 24px;
    top: 4px;
    padding: 3px 6px
}

.unfinished-bubble-container .unfinished-bubble .unfinished-bubble-content {
    margin: 0;
    padding: 0;
    opacity: .9;
    font-family: PingFangSC-Semibold;
    font-size: 14px;
    color: #fff;
    text-align: center;
    margin-left: 5px;
    margin-right: 5px
}

.unfinished-bubble-container .unfinished-bubble-tip {
    width: 20px;
    height: 4.6px;
    background: url(../QR-Code/up.png) center center no-repeat;
    background-size: auto;
    background-size: cover;
    position: absolute;
    left: 22px
}

button {
    min-width: 200px;
    padding: 10px 24px 14px;
    text-shadow: none;
    border: none;
    text-decoration: none;
    border-radius: 4px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    -webkit-transition: all .2s linear;
    -o-transition: all .2s linear;
    transition: all .2s linear;
    font-size: 18px;
    font-weight: 300;
    line-height: 18px;
    letter-spacing: 0;
    background-color: #383e45;
    color: #fff
}

button>:last-child {
    margin-right: 0
}

button:disabled {
    background: #e1e1e1!important
}

.yeslang {
    color: #19751d
}

button {
    cursor: pointer;
    -webkit-appearance: button
}

button {
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button {
    cursor: pointer;
    -webkit-appearance: button
}

button::-moz-focus-inner {
    border: 0;
    padding: 0
}

button {
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button {
    cursor: pointer;
    -webkit-appearance: button
}

button::-moz-focus-inner {
    border: 0;
    padding: 0
}

button:active {
    -webkit-box-shadow: 0 1px 6px 0 rgba(0,0,0,.14);
    box-shadow: 0 1px 6px 0 rgba(0,0,0,.14)
}

button>:last-child {
    margin-right: 0
}

button:active {
    background-color: #161616
}

button:disabled {
    background: #dadce0!important
}

@media(pointer:fine) {
    * {
        scrollbar-color: #dedede transparent
    }

    ::-webkit-scrollbar {
        background-color: transparent;
        height: 8px;
        width: 8px
    }

    ::-webkit-scrollbar-thumb {
        background-color: #50505042;
        min-height: 48px;
        min-width: 48px
    }

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

.VfPpkd-LgbsSe {
    -webkit-font-smoothing: antialiased;
    font-size: .875rem;
    font-size: var(--mdc-typography-button-font-size,0.875rem);
    line-height: 2.25rem;
    line-height: var(--mdc-typography-button-line-height,2.25rem);
    font-weight: 400;
    font-weight: var(--mdc-typography-button-font-weight,500);
    letter-spacing: .0892857143em;
    letter-spacing: var(--mdc-typography-button-letter-spacing,0.0892857143em);
    text-decoration: none;
    text-decoration: var(--mdc-typography-button-text-decoration,none);
    text-transform: uppercase;
    text-transform: var(--mdc-typography-button-text-transform,uppercase);
    padding: 0 8px;
    position: relative;
    display: -webkit-inline-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 64px;
    border: none;
    outline: none;
    line-height: inherit;
    -webkit-user-select: none;
    -webkit-appearance: none;
    overflow: visible;
    vertical-align: middle;
    border-radius: 4px
}

.VfPpkd-LgbsSe::-moz-focus-inner {
    padding: 0;
    border: 0
}

.VfPpkd-LgbsSe:active {
    outline: none
}

.VfPpkd-LgbsSe:hover {
    cursor: pointer
}

.VfPpkd-LgbsSe:disabled {
    cursor: default;
    pointer-events: none
}

.VfPpkd-LgbsSe .VfPpkd-Jh9lGc {
    border-radius: 4px
}

.VfPpkd-LgbsSe:disabled {
    background-color: transparent
}

.VfPpkd-LgbsSe:disabled {
    color: rgba(0,0,0,.38)
}

.VfPpkd-LgbsSe {
    --mdc-ripple-fg-size: 0;
    --mdc-ripple-left: 0;
    --mdc-ripple-top: 0;
    --mdc-ripple-fg-scale: 1;
    --mdc-ripple-fg-translate-end: 0;
    --mdc-ripple-fg-translate-start: 0;
    -webkit-tap-highlight-color: transparent;
    will-change: transform,opacity
}

.VfPpkd-LgbsSe .VfPpkd-Jh9lGc::before,.VfPpkd-LgbsSe .VfPpkd-Jh9lGc::after {
    position: absolute;
    border-radius: 50%;
    opacity: 0;
    pointer-events: none;
    content: ""
}

.VfPpkd-LgbsSe .VfPpkd-Jh9lGc::before {
    transition: opacity 15ms linear,background-color 15ms linear;
    z-index: 1
}

.VfPpkd-LgbsSe .VfPpkd-Jh9lGc::before,.VfPpkd-LgbsSe .VfPpkd-Jh9lGc::after {
    top: calc(50% - 100%);
    left: calc(50% - 100%);
    width: 200%;
    height: 200%
}

.VfPpkd-LgbsSe .VfPpkd-Jh9lGc::before,.VfPpkd-LgbsSe .VfPpkd-Jh9lGc::after {
    background-color: #6200ee;
    background-color: var(--mdc-theme-primary,#6200ee)
}

.VfPpkd-LgbsSe:hover .VfPpkd-Jh9lGc::before {
    opacity: .04
}

.VfPpkd-LgbsSe:not(.VfPpkd-ksKsZd-mWPk3d):focus .VfPpkd-Jh9lGc::before {
    transition-duration: 75ms;
    opacity: .12
}

.VfPpkd-LgbsSe:not(.VfPpkd-ksKsZd-mWPk3d) .VfPpkd-Jh9lGc::after {
    transition: opacity 150ms linear
}

.VfPpkd-LgbsSe:not(.VfPpkd-ksKsZd-mWPk3d):active .VfPpkd-Jh9lGc::after {
    transition-duration: 75ms;
    opacity: .12
}

.VfPpkd-LgbsSe .VfPpkd-Jh9lGc {
    position: absolute;
    box-sizing: content-box;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.VfPpkd-LgbsSe:not(.VfPpkd-LgbsSe-OWXEXe-INsAgc) .VfPpkd-Jh9lGc {
    top: 0;
    left: 0
}

.VfPpkd-LgbsSe {
    height: 36px
}

.ksBjEc {
    font-size: .875rem;
    font-weight: 300;
    letter-spacing: .0107142857em;
    text-transform: none;
    background-color: #fff;
    color: #3c4043
}

.ksBjEc .VfPpkd-Jh9lGc {
    height: 100%;
    position: absolute;
    overflow: hidden;
    width: 100%;
    z-index: 0
}

.ksBjEc .VfPpkd-vQzf8d.yeslang {
    position: relative;
    font-weight: 400
}

.ksBjEc:disabled {
    color: rgba(60,64,67,.38);
    color: var(--gm-colortextbutton-disabled-ink-color,rgba(60,64,67,0.38))
}

.ksBjEc .VfPpkd-Jh9lGc::before,.ksBjEc .VfPpkd-Jh9lGc::after {
    background-color: #1a73e8;
    background-color: var(--gm-colortextbutton-state-color,#1a73e8)
}

.ksBjEc:hover .VfPpkd-Jh9lGc::before {
    opacity: .04
}

.ksBjEc:not(.VfPpkd-ksKsZd-mWPk3d):focus .VfPpkd-Jh9lGc::before {
    transition-duration: 75ms;
    opacity: .12
}

.ksBjEc:not(.VfPpkd-ksKsZd-mWPk3d) .VfPpkd-Jh9lGc::after {
    transition: opacity 150ms linear
}

.ksBjEc:not(.VfPpkd-ksKsZd-mWPk3d):active .VfPpkd-Jh9lGc::after {
    transition-duration: 75ms;
    opacity: .12
}

.KG4Qee {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 10px -5px rgba(0,0,0,.2),0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12);
    display: flex;
    position: relative;
    -webkit-box-align: center;
    box-align: center;
    align-items: center;
    padding: 12px 24px 12px 0
}

.RODueb {
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: 100px;
    background-position: center;
    border-radius: 8px 0 0 8px;
    bottom: 0;
    position: absolute;
    top: 0
}

.lsJU7b {
    box-flex: 1;
    flex-grow: 1;
    padding: 2px
}

.R5XrWc {
    color: #202124;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.75rem;
    padding: 18px 24px 4px
}

.dU8cvd {
    display: flex;
    padding: 18px 24px 4px
}

.uxrPFe {
    margin-right: 16px
}

.mGD6id .RODueb {
    background-image: url(../images/gift.svg);
    width: 120px
}

.mGD6id .lsJU7b {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-left: 120px
}

.gsckL {
    position: fixed;
    transition: transform .1s cubic-bezier(.4,0,.2,1);
    overflow: visible;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 500;
    -webkit-transition: opacity .3s 0s,visibility 0s 0s;
    -moz-transition: opacity .3s 0s,visibility 0s 0s;
    transition: opacity .3s 0s,visibility 0s 0s;
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
    display: none
}

.TUXL9e {
    position: static;
    display: block;
    width: 100%;
    padding: 0;
    transform: translateZ(0);
    transition: transform .2s cubic-bezier(.4,0,.2,1)
}

@media screen and (min-width:481px) {
    .gsckL {
        min-width: 288px;
        max-width: 568px;
        right: auto
    }

    .TUXL9e {
        max-width: calc(100vw - 2*24px);
        padding: 0 24px 44px
    }

    .zPNfib {
        border-radius: 8px
    }
}

@media(min-width:241px) and (max-width:480px) {
    .mGD6id .RODueb {
        width: 100px;
        background-size: 70px
    }

    .dU8cvd {
        padding: 4px 24px
    }

    .mGD6id .lsJU7b {
        margin-left: 100px
    }

    .R5XrWc {
        font-size: 16px
    }

    .KG4Qee {
        border-radius: 0
    }
}

:focus {
    outline: none
}

button,button *,button span {
    cursor: pointer
}

:focus {
    outline: none
}

@media not all {
    button {
        border: 1px solid #fff!important;
        background: #000!important;
        color: #fff!important
    }

    button:hover,button:focus,button:active {
        border: 1px solid #fff!important;
        background: #000!important;
        color: #fff!important
    }

    button * {
        color: #fff!important
    }
}

@-webkit-keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    50% {
        opacity: 1
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    50% {
        opacity: 1
    }
}

.qrgenerator__customizer .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem
}

.qrgenerator__customizer .card-body {
    flex: 1 1 auto;
    padding: 1.25rem
}

.qrgenerator__customizer .card-header {
    padding: .75rem 1.25rem;
    background-color: rgba(0,0,0,.03)
}

.qrgenerator__customizer .card-header {
    margin-bottom: 0
}

.qrgenerator__customizer .card-header {
    border-bottom: 1px solid rgba(0,0,0,.125)
}

.qrgenerator__customizer .card-header:first-child {
    border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0
}

.qrgenerator__customizer .generator [class*=" icon-"]:before,.startpage [class*=" icon-"]:before {
    font-family: website-main!important;
    font-style: normal!important;
    font-weight: 400!important;
    font-variant: normal!important;
    text-transform: none!important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.qrgenerator__customizer .generator .icon-chevron-down:before,.startpage .icon-chevron-down:before {
    content: "\62"
}

.qrgenerator__customizer .generator .icon-ui-close:before,.startpage .icon-ui-close:before {
    content: "\44"
}

.qrgenerator__customizer .icon {
    position: relative;
    display: inline-block
}

.qrgenerator__customizer .qrgenerator__frame-img {
    height: 38px
}

@media(max-width:991px) {
    .qrgenerator__customizer div:last-of-type>.card-header {
        border-radius: 0 0 6px 6px
    }
}

.qrgenerator__customizer .collapse {
    display: none
}

.qrgenerator__customizer .collapse.show {
    display: block
}

.qrgenerator__customizer .card-header--new-frame svg {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 12px
}

.qrgenerator__customizer .card {
    border: none;
    border-radius: 4px;
    margin: 0;
    background-color: #d3ecd336
}

.qrgenerator__customizer .card-header {
    background: #f7f7f7;
    padding: 0;
    min-height: 33px;
    text-align: left;
    height: 33px;
    text-decoration: none;
    cursor: pointer;
    border: none
}

.qrgenerator__customizer .card-header:hover {
    background: #f7f7f7
}

.qrgenerator__customizer .card-header>[aria-expanded=true] {
    height: 33px
}

.qrgenerator__customizer .card-header>[aria-expanded=true] .qrgenerator__customizer-title {
    color: #616568
}

.qrgenerator__customizer .card-header>[aria-expanded=true] .icon {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
    top: -5px
}

.qrgenerator__customizer .card-header--new-frame {
    background: #d3ecd3!important
}

.qrgenerator__customizer .card-header--new-frame * {
    color: #228826!important;
    width: 100%
}

.qrgenerator__customizer-title {
    text-transform: uppercase;
    font-weight: 400;
    color: #a4a6a7;
    cursor: pointer;
    padding: 0 15px;
    font-size: 17px;
    line-height: 30px
}

.qrgenerator__customizer-title+.icon {
    float: right;
    padding: 8px 12px;
    color: #a9abac
}

.qrgenerator__customizer-title .api-ad__tag-new {
    color: #fff!important;
    border-radius: 15px 15px 15px 0;
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(244,2,6) 100%);
    box-shadow: 0 2px 5px 0 rgba(113,113,113,.51);
    position: relative;
    top: -1px;
    left: 6px!important
}

.qrgenerator__customizer .card-body {
    padding: 0 12px 15px;
    text-align: left;
    max-width: 300px;
    margin: 0 auto
}

.qrgenerator__customizer-btn {
    font-size: 23px;
    font-weight: 600;
    color: #d4d4d4;
    border: 1px solid #d4d4d4;
    margin: 10px 8px 0 0;
    padding: 3px 0;
    text-align: center;
    cursor: pointer;
    display: inline-block;
    border-radius: 2px;
    height: 40px;
    width: 48px
}

.qrgenerator__customizer-btn:hover {
    border-color: #797d80;
    color: #797d80
}

.qrgenerator__customizer-btn--second-border {
    border: 1px solid transparent
}

.qrgenerator__customizer-btn--active {
    color: #797d80;
    border: 1px solid #90c52d!important;
    box-shadow: 0 -1px 0 rgba(0,0,0,.06),0 0 3px rgba(0,0,0,.18),0 1px 3px rgba(181,181,181,.18)
}

.qrgenerator__customizer-btn--active .qrgenerator__customizer-btn--second-border {
    border: none
}

.canvas-wrap .canvas-loading {
    display: none
}

.canvas-wrap.in .canvas-loading {
    display: block
}

.canvas-loading {
    position: absolute;
    margin-left: 100px;
    margin-top: 140px;
    z-index: 11
}

.canvas-loading img {
    width: 100px;
    height: 100px
}

.canvas-wrap.in #container {
    opacity: .2
}

.qrgenerator__customizer-btn--active::before {
    content: '';
    position: absolute;
    z-index: 11;
    background-color: #03823e;
    width: 50px;
    height: 4px;
    left: -1px;
    top: 46px;
    background-image: linear-gradient(135deg,rgb(0,162,69) 0%,rgb(3,130,62) 100%);
    box-shadow: 0 2px 5px 0 #9fdcb9
}

.qrgenerator__customizer-btn--restricted {
    border: 1px solid #00bfff
}

.qrgenerator__customizer-btn--restricted:before {
    border: 1px solid transparent
}

.qrgenerator__customizer-btn--frames {
    width: 50px;
    height: 50px;
    position: relative;
    top: 1px;
    margin: 10px 4px 0;
    padding: 5px 0 1px
}

.qrgenerator__customizer-btn--frames .icon {
    top: 6px!important
}

.qrgenerator__customizer-btn .icon {
    color: #000;
    top: 2px
}

.qrgenerator__customizer-btn .icon-ui-close {
    color: #a4a6a7
}

@media(max-width:576px) {
    .api-ad__tag-new {
        position: absolute;
        left: calc(50% - 20px)
    }
}

.api-ad__tag-new {
    color: #fff!important;
    border-radius: 15px 15px 15px 0;
    background-image: linear-gradient(135deg,rgb(251,93,95) 0%,rgb(244,2,6) 100%);
    box-shadow: 0 2px 5px 0 rgba(113,113,113,.51);
    position: relative;
    padding: 0 4px;
    font-weight: 400;
    font-size: 14px;
    text-transform: uppercase;
    left: 6px!important
}

.cardmore {
    background-color: #ffffff36!important;
    padding: 4px 0 12px
}

.cardmore a {
    cursor: pointer;
    margin: 0 auto;
    min-width: 180px;
    background-color: #fff;
    border-radius: 50px;
    min-height: 48px;
    line-height: 48px;
    padding: 12px 16px;
    color: #222;
    border: 2px solid transparent;
    box-shadow: 0 2px 8px 0 rgba(168,168,168,.48)
}

.cardmore div svg {
    margin-right: 10px
}

.cardmore a:hover {
    border: 2px solid #228826;
    color: #228826
}

.cardmore .waves-wrap {
    display: none!important
}

#canvasshow:hover {
    cursor: pointer;
    box-shadow: 0 1px 13px rgba(0,0,0,.19)
}

.accordion {
    width: 100%;
    margin: 20px auto 10px;
    background: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.accordion .link {
    cursor: pointer;
    display: block;
    padding: 3px 15px;
    color: #228826!important;
    font-size: 15px;
    font-weight: 400;
    border-bottom: 1px solid #fff;
    position: relative;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
    width: auto;
    text-align: left;
    background-color: #f6fbf6;
    border-radius: 6px
}

.accordion li {
    margin: 3px 0
}

.accordion li svg {
    position: absolute;
    top: 10px;
    right: 12px;
    font-size: 18px;
    color: #228826!important;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease
}

.accordion li.open svg {
    color: #0c6a10
}

.accordion li:last-child .link {
    border-bottom: 0
}

.accordion li i {
    position: absolute;
    top: 16px;
    left: 12px;
    font-size: 18px;
    color: #595959;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease
}

.accordion li i.fa-chevron-down {
    right: 12px;
    left: auto;
    font-size: 16px
}

.accordion li.open .link {
    color: #228826!important;
    background: #d3ecd3!important;
    border-radius: 6px 6px 0 0
}

.accordion li.open .link svg {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.accordion li.open i {
    color: #b63b4d
}

.accordion li.open i.fa-chevron-down {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
}

.submenu {
    display: none;
    background-color: #d3ecd336;
    font-size: 14px;
    border-radius: 0 0 6px 6px
}

.col-xs-3{
    width: 25%;
}