@charset "UTF-8";
/*!
 * Bootstrap v3.3.6 (http://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/../third_party/bootstrap-sass/assets/stylesheets/bootstrap/blob/master/LICENSE)
 */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block; }

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline; }

audio:not([controls]) {
  display: none;
  height: 0; }

[hidden],
template {
  display: none; }

a {
  background-color: transparent; }

a:active,
a:hover {
  outline: 0; }

abbr[title] {
  border-bottom: 1px dotted; }

b,
strong {
  font-weight: bold; }

dfn {
  font-style: italic; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

mark {
  background: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  border: 0; }

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

figure {
  margin: 1em 40px; }

hr {
  box-sizing: content-box;
  height: 0; }

pre {
  overflow: auto; }

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

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

button {
  overflow: visible; }

button,
select {
  text-transform: none; }

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

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

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

input {
  line-height: normal; }

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

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

input[type="search"] {
  -webkit-appearance: textfield;
  box-sizing: content-box; }

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

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

legend {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto; }

optgroup {
  font-weight: bold; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }

/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important; }

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

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

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

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

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid; }

  thead {
    display: table-header-group; }

  tr,
  img {
    page-break-inside: avoid; }

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

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

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

  .navbar {
    display: none; }

  .btn > .caret,
  .dropup > .btn > .caret {
    border-top-color: #000 !important; }

  .label {
    border: 1px solid #000; }

  .table {
    border-collapse: collapse !important; }
    .table td,
    .table th {
      background-color: #fff !important; }

  .table-bordered th,
  .table-bordered td {
    border: 1px solid #ddd !important; } }
@font-face {
  font-family: 'Glyphicons Halflings';
  src: url("../fonts/bootstrap/glyphicons-halflings-regular.eot");
  src: url("../fonts/bootstrap/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/bootstrap/glyphicons-halflings-regular.woff2") format("woff2"), url("../fonts/bootstrap/glyphicons-halflings-regular.woff") format("woff"), url("../fonts/bootstrap/glyphicons-halflings-regular.ttf") format("truetype"), url("../fonts/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg"); }
.glyphicon, .toggleShowPassword {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.glyphicon-asterisk:before {
  content: "\002a"; }

.glyphicon-plus:before {
  content: "\002b"; }

.glyphicon-euro:before,
.glyphicon-eur:before {
  content: "\20ac"; }

.glyphicon-minus:before {
  content: "\2212"; }

.glyphicon-cloud:before {
  content: "\2601"; }

.glyphicon-envelope:before {
  content: "\2709"; }

.glyphicon-pencil:before {
  content: "\270f"; }

.glyphicon-glass:before {
  content: "\e001"; }

.glyphicon-music:before {
  content: "\e002"; }

.glyphicon-search:before {
  content: "\e003"; }

.glyphicon-heart:before {
  content: "\e005"; }

.glyphicon-star:before {
  content: "\e006"; }

.glyphicon-star-empty:before {
  content: "\e007"; }

.glyphicon-user:before {
  content: "\e008"; }

.glyphicon-film:before {
  content: "\e009"; }

.glyphicon-th-large:before {
  content: "\e010"; }

.glyphicon-th:before {
  content: "\e011"; }

.glyphicon-th-list:before {
  content: "\e012"; }

.glyphicon-ok:before {
  content: "\e013"; }

.glyphicon-remove:before {
  content: "\e014"; }

.glyphicon-zoom-in:before {
  content: "\e015"; }

.glyphicon-zoom-out:before {
  content: "\e016"; }

.glyphicon-off:before {
  content: "\e017"; }

.glyphicon-signal:before {
  content: "\e018"; }

.glyphicon-cog:before {
  content: "\e019"; }

.glyphicon-trash:before {
  content: "\e020"; }

.glyphicon-home:before {
  content: "\e021"; }

.glyphicon-file:before {
  content: "\e022"; }

.glyphicon-time:before {
  content: "\e023"; }

.glyphicon-road:before {
  content: "\e024"; }

.glyphicon-download-alt:before {
  content: "\e025"; }

.glyphicon-download:before {
  content: "\e026"; }

.glyphicon-upload:before {
  content: "\e027"; }

.glyphicon-inbox:before {
  content: "\e028"; }

.glyphicon-play-circle:before {
  content: "\e029"; }

.glyphicon-repeat:before {
  content: "\e030"; }

.glyphicon-refresh:before {
  content: "\e031"; }

.glyphicon-list-alt:before {
  content: "\e032"; }

.glyphicon-lock:before {
  content: "\e033"; }

.glyphicon-flag:before {
  content: "\e034"; }

.glyphicon-headphones:before {
  content: "\e035"; }

.glyphicon-volume-off:before {
  content: "\e036"; }

.glyphicon-volume-down:before {
  content: "\e037"; }

.glyphicon-volume-up:before {
  content: "\e038"; }

.glyphicon-qrcode:before {
  content: "\e039"; }

.glyphicon-barcode:before {
  content: "\e040"; }

.glyphicon-tag:before {
  content: "\e041"; }

.glyphicon-tags:before {
  content: "\e042"; }

.glyphicon-book:before {
  content: "\e043"; }

.glyphicon-bookmark:before {
  content: "\e044"; }

.glyphicon-print:before {
  content: "\e045"; }

.glyphicon-camera:before {
  content: "\e046"; }

.glyphicon-font:before {
  content: "\e047"; }

.glyphicon-bold:before {
  content: "\e048"; }

.glyphicon-italic:before {
  content: "\e049"; }

.glyphicon-text-height:before {
  content: "\e050"; }

.glyphicon-text-width:before {
  content: "\e051"; }

.glyphicon-align-left:before {
  content: "\e052"; }

.glyphicon-align-center:before {
  content: "\e053"; }

.glyphicon-align-right:before {
  content: "\e054"; }

.glyphicon-align-justify:before {
  content: "\e055"; }

.glyphicon-list:before {
  content: "\e056"; }

.glyphicon-indent-left:before {
  content: "\e057"; }

.glyphicon-indent-right:before {
  content: "\e058"; }

.glyphicon-facetime-video:before {
  content: "\e059"; }

.glyphicon-picture:before {
  content: "\e060"; }

.glyphicon-map-marker:before {
  content: "\e062"; }

.glyphicon-adjust:before {
  content: "\e063"; }

.glyphicon-tint:before {
  content: "\e064"; }

.glyphicon-edit:before {
  content: "\e065"; }

.glyphicon-share:before {
  content: "\e066"; }

.glyphicon-check:before {
  content: "\e067"; }

.glyphicon-move:before {
  content: "\e068"; }

.glyphicon-step-backward:before {
  content: "\e069"; }

.glyphicon-fast-backward:before {
  content: "\e070"; }

.glyphicon-backward:before {
  content: "\e071"; }

.glyphicon-play:before {
  content: "\e072"; }

.glyphicon-pause:before {
  content: "\e073"; }

.glyphicon-stop:before {
  content: "\e074"; }

.glyphicon-forward:before {
  content: "\e075"; }

.glyphicon-fast-forward:before {
  content: "\e076"; }

.glyphicon-step-forward:before {
  content: "\e077"; }

.glyphicon-eject:before {
  content: "\e078"; }

.glyphicon-chevron-left:before {
  content: "\e079"; }

.glyphicon-chevron-right:before {
  content: "\e080"; }

.glyphicon-plus-sign:before {
  content: "\e081"; }

.glyphicon-minus-sign:before {
  content: "\e082"; }

.glyphicon-remove-sign:before {
  content: "\e083"; }

.glyphicon-ok-sign:before {
  content: "\e084"; }

.glyphicon-question-sign:before {
  content: "\e085"; }

.glyphicon-info-sign:before {
  content: "\e086"; }

.glyphicon-screenshot:before {
  content: "\e087"; }

.glyphicon-remove-circle:before {
  content: "\e088"; }

.glyphicon-ok-circle:before {
  content: "\e089"; }

.glyphicon-ban-circle:before {
  content: "\e090"; }

.glyphicon-arrow-left:before {
  content: "\e091"; }

.glyphicon-arrow-right:before {
  content: "\e092"; }

.glyphicon-arrow-up:before {
  content: "\e093"; }

.glyphicon-arrow-down:before {
  content: "\e094"; }

.glyphicon-share-alt:before {
  content: "\e095"; }

.glyphicon-resize-full:before {
  content: "\e096"; }

.glyphicon-resize-small:before {
  content: "\e097"; }

.glyphicon-exclamation-sign:before {
  content: "\e101"; }

.glyphicon-gift:before {
  content: "\e102"; }

.glyphicon-leaf:before {
  content: "\e103"; }

.glyphicon-fire:before {
  content: "\e104"; }

.glyphicon-eye-open:before, .toggleShowPassword:before {
  content: "\e105"; }

.glyphicon-eye-close:before {
  content: "\e106"; }

.glyphicon-warning-sign:before {
  content: "\e107"; }

.glyphicon-plane:before {
  content: "\e108"; }

.glyphicon-calendar:before {
  content: "\e109"; }

.glyphicon-random:before {
  content: "\e110"; }

.glyphicon-comment:before {
  content: "\e111"; }

.glyphicon-magnet:before {
  content: "\e112"; }

.glyphicon-chevron-up:before {
  content: "\e113"; }

.glyphicon-chevron-down:before {
  content: "\e114"; }

.glyphicon-retweet:before {
  content: "\e115"; }

.glyphicon-shopping-cart:before {
  content: "\e116"; }

.glyphicon-folder-close:before {
  content: "\e117"; }

.glyphicon-folder-open:before {
  content: "\e118"; }

.glyphicon-resize-vertical:before {
  content: "\e119"; }

.glyphicon-resize-horizontal:before {
  content: "\e120"; }

.glyphicon-hdd:before {
  content: "\e121"; }

.glyphicon-bullhorn:before {
  content: "\e122"; }

.glyphicon-bell:before {
  content: "\e123"; }

.glyphicon-certificate:before {
  content: "\e124"; }

.glyphicon-thumbs-up:before {
  content: "\e125"; }

.glyphicon-thumbs-down:before {
  content: "\e126"; }

.glyphicon-hand-right:before {
  content: "\e127"; }

.glyphicon-hand-left:before {
  content: "\e128"; }

.glyphicon-hand-up:before {
  content: "\e129"; }

.glyphicon-hand-down:before {
  content: "\e130"; }

.glyphicon-circle-arrow-right:before {
  content: "\e131"; }

.glyphicon-circle-arrow-left:before {
  content: "\e132"; }

.glyphicon-circle-arrow-up:before {
  content: "\e133"; }

.glyphicon-circle-arrow-down:before {
  content: "\e134"; }

.glyphicon-globe:before {
  content: "\e135"; }

.glyphicon-wrench:before {
  content: "\e136"; }

.glyphicon-tasks:before {
  content: "\e137"; }

.glyphicon-filter:before {
  content: "\e138"; }

.glyphicon-briefcase:before {
  content: "\e139"; }

.glyphicon-fullscreen:before {
  content: "\e140"; }

.glyphicon-dashboard:before {
  content: "\e141"; }

.glyphicon-paperclip:before {
  content: "\e142"; }

.glyphicon-heart-empty:before {
  content: "\e143"; }

.glyphicon-link:before {
  content: "\e144"; }

.glyphicon-phone:before {
  content: "\e145"; }

.glyphicon-pushpin:before {
  content: "\e146"; }

.glyphicon-usd:before {
  content: "\e148"; }

.glyphicon-gbp:before {
  content: "\e149"; }

.glyphicon-sort:before {
  content: "\e150"; }

.glyphicon-sort-by-alphabet:before {
  content: "\e151"; }

.glyphicon-sort-by-alphabet-alt:before {
  content: "\e152"; }

.glyphicon-sort-by-order:before {
  content: "\e153"; }

.glyphicon-sort-by-order-alt:before {
  content: "\e154"; }

.glyphicon-sort-by-attributes:before {
  content: "\e155"; }

.glyphicon-sort-by-attributes-alt:before {
  content: "\e156"; }

.glyphicon-unchecked:before {
  content: "\e157"; }

.glyphicon-expand:before {
  content: "\e158"; }

.glyphicon-collapse-down:before {
  content: "\e159"; }

.glyphicon-collapse-up:before {
  content: "\e160"; }

.glyphicon-log-in:before {
  content: "\e161"; }

.glyphicon-flash:before {
  content: "\e162"; }

.glyphicon-log-out:before {
  content: "\e163"; }

.glyphicon-new-window:before {
  content: "\e164"; }

.glyphicon-record:before {
  content: "\e165"; }

.glyphicon-save:before {
  content: "\e166"; }

.glyphicon-open:before {
  content: "\e167"; }

.glyphicon-saved:before {
  content: "\e168"; }

.glyphicon-import:before {
  content: "\e169"; }

.glyphicon-export:before {
  content: "\e170"; }

.glyphicon-send:before {
  content: "\e171"; }

.glyphicon-floppy-disk:before {
  content: "\e172"; }

.glyphicon-floppy-saved:before {
  content: "\e173"; }

.glyphicon-floppy-remove:before {
  content: "\e174"; }

.glyphicon-floppy-save:before {
  content: "\e175"; }

.glyphicon-floppy-open:before {
  content: "\e176"; }

.glyphicon-credit-card:before {
  content: "\e177"; }

.glyphicon-transfer:before {
  content: "\e178"; }

.glyphicon-cutlery:before {
  content: "\e179"; }

.glyphicon-header:before {
  content: "\e180"; }

.glyphicon-compressed:before {
  content: "\e181"; }

.glyphicon-earphone:before {
  content: "\e182"; }

.glyphicon-phone-alt:before {
  content: "\e183"; }

.glyphicon-tower:before {
  content: "\e184"; }

.glyphicon-stats:before {
  content: "\e185"; }

.glyphicon-sd-video:before {
  content: "\e186"; }

.glyphicon-hd-video:before {
  content: "\e187"; }

.glyphicon-subtitles:before {
  content: "\e188"; }

.glyphicon-sound-stereo:before {
  content: "\e189"; }

.glyphicon-sound-dolby:before {
  content: "\e190"; }

.glyphicon-sound-5-1:before {
  content: "\e191"; }

.glyphicon-sound-6-1:before {
  content: "\e192"; }

.glyphicon-sound-7-1:before {
  content: "\e193"; }

.glyphicon-copyright-mark:before {
  content: "\e194"; }

.glyphicon-registration-mark:before {
  content: "\e195"; }

.glyphicon-cloud-download:before {
  content: "\e197"; }

.glyphicon-cloud-upload:before {
  content: "\e198"; }

.glyphicon-tree-conifer:before {
  content: "\e199"; }

.glyphicon-tree-deciduous:before {
  content: "\e200"; }

.glyphicon-cd:before {
  content: "\e201"; }

.glyphicon-save-file:before {
  content: "\e202"; }

.glyphicon-open-file:before {
  content: "\e203"; }

.glyphicon-level-up:before {
  content: "\e204"; }

.glyphicon-copy:before {
  content: "\e205"; }

.glyphicon-paste:before {
  content: "\e206"; }

.glyphicon-alert:before {
  content: "\e209"; }

.glyphicon-equalizer:before {
  content: "\e210"; }

.glyphicon-king:before {
  content: "\e211"; }

.glyphicon-queen:before {
  content: "\e212"; }

.glyphicon-pawn:before {
  content: "\e213"; }

.glyphicon-bishop:before {
  content: "\e214"; }

.glyphicon-knight:before {
  content: "\e215"; }

.glyphicon-baby-formula:before {
  content: "\e216"; }

.glyphicon-tent:before {
  content: "\26fa"; }

.glyphicon-blackboard:before {
  content: "\e218"; }

.glyphicon-bed:before {
  content: "\e219"; }

.glyphicon-apple:before {
  content: "\f8ff"; }

.glyphicon-erase:before {
  content: "\e221"; }

.glyphicon-hourglass:before {
  content: "\231b"; }

.glyphicon-lamp:before {
  content: "\e223"; }

.glyphicon-duplicate:before {
  content: "\e224"; }

.glyphicon-piggy-bank:before {
  content: "\e225"; }

.glyphicon-scissors:before {
  content: "\e226"; }

.glyphicon-bitcoin:before {
  content: "\e227"; }

.glyphicon-btc:before {
  content: "\e227"; }

.glyphicon-xbt:before {
  content: "\e227"; }

.glyphicon-yen:before {
  content: "\00a5"; }

.glyphicon-jpy:before {
  content: "\00a5"; }

.glyphicon-ruble:before {
  content: "\20bd"; }

.glyphicon-rub:before {
  content: "\20bd"; }

.glyphicon-scale:before {
  content: "\e230"; }

.glyphicon-ice-lolly:before {
  content: "\e231"; }

.glyphicon-ice-lolly-tasted:before {
  content: "\e232"; }

.glyphicon-education:before {
  content: "\e233"; }

.glyphicon-option-horizontal:before {
  content: "\e234"; }

.glyphicon-option-vertical:before {
  content: "\e235"; }

.glyphicon-menu-hamburger:before {
  content: "\e236"; }

.glyphicon-modal-window:before {
  content: "\e237"; }

.glyphicon-oil:before {
  content: "\e238"; }

.glyphicon-grain:before {
  content: "\e239"; }

.glyphicon-sunglasses:before {
  content: "\e240"; }

.glyphicon-text-size:before {
  content: "\e241"; }

.glyphicon-text-color:before {
  content: "\e242"; }

.glyphicon-text-background:before {
  content: "\e243"; }

.glyphicon-object-align-top:before {
  content: "\e244"; }

.glyphicon-object-align-bottom:before {
  content: "\e245"; }

.glyphicon-object-align-horizontal:before {
  content: "\e246"; }

.glyphicon-object-align-left:before {
  content: "\e247"; }

.glyphicon-object-align-vertical:before {
  content: "\e248"; }

.glyphicon-object-align-right:before {
  content: "\e249"; }

.glyphicon-triangle-right:before {
  content: "\e250"; }

.glyphicon-triangle-left:before {
  content: "\e251"; }

.glyphicon-triangle-bottom:before {
  content: "\e252"; }

.glyphicon-triangle-top:before {
  content: "\e253"; }

.glyphicon-console:before {
  content: "\e254"; }

.glyphicon-superscript:before {
  content: "\e255"; }

.glyphicon-subscript:before {
  content: "\e256"; }

.glyphicon-menu-left:before {
  content: "\e257"; }

.glyphicon-menu-right:before {
  content: "\e258"; }

.glyphicon-menu-down:before {
  content: "\e259"; }

.glyphicon-menu-up:before {
  content: "\e260"; }

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

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

html {
  font-size: 10px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.428571429;
  color: #333333;
  background-color: #fff; }

input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit; }

a {
  color: #337ab7;
  text-decoration: none; }
  a:hover, a:focus {
    color: #23527c;
    text-decoration: underline; }
  a:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px; }

figure {
  margin: 0; }

img {
  vertical-align: middle; }

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

.img-rounded {
  border-radius: 6px; }

.img-thumbnail {
  padding: 4px;
  line-height: 1.428571429;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  display: inline-block;
  max-width: 100%;
  height: auto; }

.img-circle {
  border-radius: 50%; }

hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eeeeee; }

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

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

[role="button"] {
  cursor: pointer; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit; }
  h1 small,
  h1 .small, h2 small,
  h2 .small, h3 small,
  h3 .small, h4 small,
  h4 .small, h5 small,
  h5 .small, h6 small,
  h6 .small,
  .h1 small,
  .h1 .small, .h2 small,
  .h2 .small, .h3 small,
  .h3 .small, .h4 small,
  .h4 .small, .h5 small,
  .h5 .small, .h6 small,
  .h6 .small {
    font-weight: normal;
    line-height: 1;
    color: #777777; }

h1, .h1,
h2, .h2,
h3, .h3 {
  margin-top: 20px;
  margin-bottom: 10px; }
  h1 small,
  h1 .small, .h1 small,
  .h1 .small,
  h2 small,
  h2 .small, .h2 small,
  .h2 .small,
  h3 small,
  h3 .small, .h3 small,
  .h3 .small {
    font-size: 65%; }

h4, .h4,
h5, .h5,
h6, .h6 {
  margin-top: 10px;
  margin-bottom: 10px; }
  h4 small,
  h4 .small, .h4 small,
  .h4 .small,
  h5 small,
  h5 .small, .h5 small,
  .h5 .small,
  h6 small,
  h6 .small, .h6 small,
  .h6 .small {
    font-size: 75%; }

h1, .h1 {
  font-size: 36px; }

h2, .h2 {
  font-size: 30px; }

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

h4, .h4 {
  font-size: 18px; }

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

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

p {
  margin: 0 0 10px; }

.lead {
  margin-bottom: 20px;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.4; }
  @media (min-width: 768px) {
    .lead {
      font-size: 21px; } }

small,
.small {
  font-size: 85%; }

mark,
.mark {
  background-color: #fcf8e3;
  padding: .2em; }

.text-left {
  text-align: left; }

.text-right {
  text-align: right; }

.text-center {
  text-align: center; }

.text-justify {
  text-align: justify; }

.text-nowrap {
  white-space: nowrap; }

.text-lowercase {
  text-transform: lowercase; }

.text-uppercase, .initialism {
  text-transform: uppercase; }

.text-capitalize {
  text-transform: capitalize; }

.text-muted {
  color: #777777; }

.text-primary {
  color: #337ab7; }

a.text-primary:hover,
a.text-primary:focus {
  color: #286090; }

.text-success {
  color: #3c763d; }

a.text-success:hover,
a.text-success:focus {
  color: #2b542c; }

.text-info {
  color: #31708f; }

a.text-info:hover,
a.text-info:focus {
  color: #245269; }

.text-warning {
  color: #8a6d3b; }

a.text-warning:hover,
a.text-warning:focus {
  color: #66512c; }

.text-danger {
  color: #a94442; }

a.text-danger:hover,
a.text-danger:focus {
  color: #843534; }

.bg-primary {
  color: #fff; }

.bg-primary {
  background-color: #337ab7; }

a.bg-primary:hover,
a.bg-primary:focus {
  background-color: #286090; }

.bg-success {
  background-color: #dff0d8; }

a.bg-success:hover,
a.bg-success:focus {
  background-color: #c1e2b3; }

.bg-info {
  background-color: #d9edf7; }

a.bg-info:hover,
a.bg-info:focus {
  background-color: #afd9ee; }

.bg-warning {
  background-color: #fcf8e3; }

a.bg-warning:hover,
a.bg-warning:focus {
  background-color: #f7ecb5; }

.bg-danger {
  background-color: #f2dede; }

a.bg-danger:hover,
a.bg-danger:focus {
  background-color: #e4b9b9; }

.page-header {
  padding-bottom: 9px;
  margin: 40px 0 20px;
  border-bottom: 1px solid #eeeeee; }

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

.list-unstyled {
  padding-left: 0;
  list-style: none; }

.list-inline {
  padding-left: 0;
  list-style: none;
  margin-left: -5px; }
  .list-inline > li {
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px; }

dl {
  margin-top: 0;
  margin-bottom: 20px; }

dt,
dd {
  line-height: 1.428571429; }

dt {
  font-weight: bold; }

dd {
  margin-left: 0; }

.dl-horizontal dd:before, .dl-horizontal dd:after {
  content: " ";
  display: table; }
.dl-horizontal dd:after {
  clear: both; }
@media (min-width: 768px) {
  .dl-horizontal dt {
    float: left;
    width: 160px;
    clear: left;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  .dl-horizontal dd {
    margin-left: 180px; } }

abbr[title],
abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted #777777; }

.initialism {
  font-size: 90%; }

blockquote {
  padding: 10px 20px;
  margin: 0 0 20px;
  font-size: 17.5px;
  border-left: 5px solid #eeeeee; }
  blockquote p:last-child,
  blockquote ul:last-child,
  blockquote ol:last-child {
    margin-bottom: 0; }
  blockquote footer,
  blockquote small,
  blockquote .small {
    display: block;
    font-size: 80%;
    line-height: 1.428571429;
    color: #777777; }
    blockquote footer:before,
    blockquote small:before,
    blockquote .small:before {
      content: '\2014 \00A0'; }

.blockquote-reverse,
blockquote.pull-right {
  padding-right: 15px;
  padding-left: 0;
  border-right: 5px solid #eeeeee;
  border-left: 0;
  text-align: right; }
  .blockquote-reverse footer:before,
  .blockquote-reverse small:before,
  .blockquote-reverse .small:before,
  blockquote.pull-right footer:before,
  blockquote.pull-right small:before,
  blockquote.pull-right .small:before {
    content: ''; }
  .blockquote-reverse footer:after,
  .blockquote-reverse small:after,
  .blockquote-reverse .small:after,
  blockquote.pull-right footer:after,
  blockquote.pull-right small:after,
  blockquote.pull-right .small:after {
    content: '\00A0 \2014'; }

address {
  margin-bottom: 20px;
  font-style: normal;
  line-height: 1.428571429; }

code,
kbd,
pre,
samp {
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace; }

code {
  padding: 2px 4px;
  font-size: 90%;
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 4px; }

kbd {
  padding: 2px 4px;
  font-size: 90%;
  color: #fff;
  background-color: #333;
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25); }
  kbd kbd {
    padding: 0;
    font-size: 100%;
    font-weight: bold;
    box-shadow: none; }

pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.428571429;
  word-break: break-all;
  word-wrap: break-word;
  color: #333333;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px; }
  pre code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    background-color: transparent;
    border-radius: 0; }

.pre-scrollable {
  max-height: 340px;
  overflow-y: scroll; }

.container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 10px;
  padding-right: 10px; }
  .container:before, .container:after {
    content: " ";
    display: table; }
  .container:after {
    clear: both; }
  @media (min-width: 768px) {
    .container {
      width: 740px; } }
  @media (min-width: 992px) {
    .container {
      width: 960px; } }
  @media (min-width: 1200px) {
    .container {
      width: 1100px; } }

.container-fluid {
  margin-right: auto;
  margin-left: auto;
  padding-left: 10px;
  padding-right: 10px; }
  .container-fluid:before, .container-fluid:after {
    content: " ";
    display: table; }
  .container-fluid:after {
    clear: both; }

.row {
  margin-left: -10px;
  margin-right: -10px; }
  .row:before, .row:after {
    content: " ";
    display: table; }
  .row:after {
    clear: both; }

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

.col-xs-1, .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-xs-10, .col-xs-11, .col-xs-12 {
  float: left; }

.col-xs-1 {
  width: 8.3333333333%; }

.col-xs-2 {
  width: 16.6666666667%; }

.col-xs-3 {
  width: 25%; }

.col-xs-4 {
  width: 33.3333333333%; }

.col-xs-5 {
  width: 41.6666666667%; }

.col-xs-6 {
  width: 50%; }

.col-xs-7 {
  width: 58.3333333333%; }

.col-xs-8 {
  width: 66.6666666667%; }

.col-xs-9 {
  width: 75%; }

.col-xs-10 {
  width: 83.3333333333%; }

.col-xs-11 {
  width: 91.6666666667%; }

.col-xs-12 {
  width: 100%; }

.col-xs-pull-0 {
  right: auto; }

.col-xs-pull-1 {
  right: 8.3333333333%; }

.col-xs-pull-2 {
  right: 16.6666666667%; }

.col-xs-pull-3 {
  right: 25%; }

.col-xs-pull-4 {
  right: 33.3333333333%; }

.col-xs-pull-5 {
  right: 41.6666666667%; }

.col-xs-pull-6 {
  right: 50%; }

.col-xs-pull-7 {
  right: 58.3333333333%; }

.col-xs-pull-8 {
  right: 66.6666666667%; }

.col-xs-pull-9 {
  right: 75%; }

.col-xs-pull-10 {
  right: 83.3333333333%; }

.col-xs-pull-11 {
  right: 91.6666666667%; }

.col-xs-pull-12 {
  right: 100%; }

.col-xs-push-0 {
  left: auto; }

.col-xs-push-1 {
  left: 8.3333333333%; }

.col-xs-push-2 {
  left: 16.6666666667%; }

.col-xs-push-3 {
  left: 25%; }

.col-xs-push-4 {
  left: 33.3333333333%; }

.col-xs-push-5 {
  left: 41.6666666667%; }

.col-xs-push-6 {
  left: 50%; }

.col-xs-push-7 {
  left: 58.3333333333%; }

.col-xs-push-8 {
  left: 66.6666666667%; }

.col-xs-push-9 {
  left: 75%; }

.col-xs-push-10 {
  left: 83.3333333333%; }

.col-xs-push-11 {
  left: 91.6666666667%; }

.col-xs-push-12 {
  left: 100%; }

.col-xs-offset-0 {
  margin-left: 0%; }

.col-xs-offset-1 {
  margin-left: 8.3333333333%; }

.col-xs-offset-2 {
  margin-left: 16.6666666667%; }

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

.col-xs-offset-4 {
  margin-left: 33.3333333333%; }

.col-xs-offset-5 {
  margin-left: 41.6666666667%; }

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

.col-xs-offset-7 {
  margin-left: 58.3333333333%; }

.col-xs-offset-8 {
  margin-left: 66.6666666667%; }

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

.col-xs-offset-10 {
  margin-left: 83.3333333333%; }

.col-xs-offset-11 {
  margin-left: 91.6666666667%; }

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

@media (min-width: 768px) {
  .col-sm-1, .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-sm-10, .col-sm-11, .col-sm-12 {
    float: left; }

  .col-sm-1 {
    width: 8.3333333333%; }

  .col-sm-2 {
    width: 16.6666666667%; }

  .col-sm-3 {
    width: 25%; }

  .col-sm-4 {
    width: 33.3333333333%; }

  .col-sm-5 {
    width: 41.6666666667%; }

  .col-sm-6 {
    width: 50%; }

  .col-sm-7 {
    width: 58.3333333333%; }

  .col-sm-8 {
    width: 66.6666666667%; }

  .col-sm-9 {
    width: 75%; }

  .col-sm-10 {
    width: 83.3333333333%; }

  .col-sm-11 {
    width: 91.6666666667%; }

  .col-sm-12 {
    width: 100%; }

  .col-sm-pull-0 {
    right: auto; }

  .col-sm-pull-1 {
    right: 8.3333333333%; }

  .col-sm-pull-2 {
    right: 16.6666666667%; }

  .col-sm-pull-3 {
    right: 25%; }

  .col-sm-pull-4 {
    right: 33.3333333333%; }

  .col-sm-pull-5 {
    right: 41.6666666667%; }

  .col-sm-pull-6 {
    right: 50%; }

  .col-sm-pull-7 {
    right: 58.3333333333%; }

  .col-sm-pull-8 {
    right: 66.6666666667%; }

  .col-sm-pull-9 {
    right: 75%; }

  .col-sm-pull-10 {
    right: 83.3333333333%; }

  .col-sm-pull-11 {
    right: 91.6666666667%; }

  .col-sm-pull-12 {
    right: 100%; }

  .col-sm-push-0 {
    left: auto; }

  .col-sm-push-1 {
    left: 8.3333333333%; }

  .col-sm-push-2 {
    left: 16.6666666667%; }

  .col-sm-push-3 {
    left: 25%; }

  .col-sm-push-4 {
    left: 33.3333333333%; }

  .col-sm-push-5 {
    left: 41.6666666667%; }

  .col-sm-push-6 {
    left: 50%; }

  .col-sm-push-7 {
    left: 58.3333333333%; }

  .col-sm-push-8 {
    left: 66.6666666667%; }

  .col-sm-push-9 {
    left: 75%; }

  .col-sm-push-10 {
    left: 83.3333333333%; }

  .col-sm-push-11 {
    left: 91.6666666667%; }

  .col-sm-push-12 {
    left: 100%; }

  .col-sm-offset-0 {
    margin-left: 0%; }

  .col-sm-offset-1 {
    margin-left: 8.3333333333%; }

  .col-sm-offset-2 {
    margin-left: 16.6666666667%; }

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

  .col-sm-offset-4 {
    margin-left: 33.3333333333%; }

  .col-sm-offset-5 {
    margin-left: 41.6666666667%; }

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

  .col-sm-offset-7 {
    margin-left: 58.3333333333%; }

  .col-sm-offset-8 {
    margin-left: 66.6666666667%; }

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

  .col-sm-offset-10 {
    margin-left: 83.3333333333%; }

  .col-sm-offset-11 {
    margin-left: 91.6666666667%; }

  .col-sm-offset-12 {
    margin-left: 100%; } }
@media (min-width: 992px) {
  .col-md-1, .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-md-10, .col-md-11, .col-md-12 {
    float: left; }

  .col-md-1 {
    width: 8.3333333333%; }

  .col-md-2 {
    width: 16.6666666667%; }

  .col-md-3 {
    width: 25%; }

  .col-md-4 {
    width: 33.3333333333%; }

  .col-md-5 {
    width: 41.6666666667%; }

  .col-md-6 {
    width: 47%; }

  .col-md-7 {
    width: 58.3333333333%; }

  .col-md-8 {
    width: 66.6666666667%; }

  .col-md-9 {
    width: 75%; }

  .col-md-10 {
    width: 83.3333333333%; }

  .col-md-11 {
    width: 91.6666666667%; }

  .col-md-12 {
    width: 100%; }

  .col-md-pull-0 {
    right: auto; }

  .col-md-pull-1 {
    right: 8.3333333333%; }

  .col-md-pull-2 {
    right: 16.6666666667%; }

  .col-md-pull-3 {
    right: 25%; }

  .col-md-pull-4 {
    right: 33.3333333333%; }

  .col-md-pull-5 {
    right: 41.6666666667%; }

  .col-md-pull-6 {
    right: 50%; }

  .col-md-pull-7 {
    right: 58.3333333333%; }

  .col-md-pull-8 {
    right: 66.6666666667%; }

  .col-md-pull-9 {
    right: 75%; }

  .col-md-pull-10 {
    right: 83.3333333333%; }

  .col-md-pull-11 {
    right: 91.6666666667%; }

  .col-md-pull-12 {
    right: 100%; }

  .col-md-push-0 {
    left: auto; }

  .col-md-push-1 {
    left: 8.3333333333%; }

  .col-md-push-2 {
    left: 16.6666666667%; }

  .col-md-push-3 {
    left: 25%; }

  .col-md-push-4 {
    left: 33.3333333333%; }

  .col-md-push-5 {
    left: 41.6666666667%; }

  .col-md-push-6 {
    left: 50%; }

  .col-md-push-7 {
    left: 58.3333333333%; }

  .col-md-push-8 {
    left: 66.6666666667%; }

  .col-md-push-9 {
    left: 75%; }

  .col-md-push-10 {
    left: 83.3333333333%; }

  .col-md-push-11 {
    left: 91.6666666667%; }

  .col-md-push-12 {
    left: 100%; }

  .col-md-offset-0 {
    margin-left: 0%; }

  .col-md-offset-1 {
    margin-left: 8.3333333333%; }

  .col-md-offset-2 {
    margin-left: 16.6666666667%; }

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

  .col-md-offset-4 {
    margin-left: 33.3333333333%; }

  .col-md-offset-5 {
    margin-left: 41.6666666667%; }

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

  .col-md-offset-7 {
    margin-left: 58.3333333333%; }

  .col-md-offset-8 {
    margin-left: 66.6666666667%; }

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

  .col-md-offset-10 {
    margin-left: 83.3333333333%; }

  .col-md-offset-11 {
    margin-left: 91.6666666667%; }

  .col-md-offset-12 {
    margin-left: 100%; } }
@media (min-width: 1200px) {
  .col-lg-1, .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-lg-10, .col-lg-11, .col-lg-12 {
    float: left; }

  .col-lg-1 {
    width: 8.3333333333%; }

  .col-lg-2 {
    width: 16.6666666667%; }

  .col-lg-3 {
    width: 25%; }

  .col-lg-4 {
    width: 33.3333333333%; }

  .col-lg-5 {
    width: 41.6666666667%; }

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

  .col-lg-7 {
    width: 58.3333333333%; }

  .col-lg-8 {
    width: 66.6666666667%; }

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

  .col-lg-10 {
    width: 83.3333333333%; }

  .col-lg-11 {
    width: 91.6666666667%; }

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

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

  .col-lg-pull-1 {
    right: 8.3333333333%; }

  .col-lg-pull-2 {
    right: 16.6666666667%; }

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

  .col-lg-pull-4 {
    right: 33.3333333333%; }

  .col-lg-pull-5 {
    right: 41.6666666667%; }

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

  .col-lg-pull-7 {
    right: 58.3333333333%; }

  .col-lg-pull-8 {
    right: 66.6666666667%; }

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

  .col-lg-pull-10 {
    right: 83.3333333333%; }

  .col-lg-pull-11 {
    right: 91.6666666667%; }

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

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

  .col-lg-push-1 {
    left: 8.3333333333%; }

  .col-lg-push-2 {
    left: 16.6666666667%; }

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

  .col-lg-push-4 {
    left: 33.3333333333%; }

  .col-lg-push-5 {
    left: 41.6666666667%; }

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

  .col-lg-push-7 {
    left: 58.3333333333%; }

  .col-lg-push-8 {
    left: 66.6666666667%; }

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

  .col-lg-push-10 {
    left: 83.3333333333%; }

  .col-lg-push-11 {
    left: 91.6666666667%; }

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

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

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

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

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

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

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

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

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

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

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

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

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

  .col-lg-offset-12 {
    margin-left: 100%; } }
table {
  background-color: transparent; }

caption {
  padding-top: 8px;
  padding-bottom: 8px;
  color: #777777;
  text-align: left; }

th {
  text-align: left; }

.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px; }
  .table > thead > tr > th,
  .table > thead > tr > td,
  .table > tbody > tr > th,
  .table > tbody > tr > td,
  .table > tfoot > tr > th,
  .table > tfoot > tr > td {
    padding: 8px;
    line-height: 1.428571429;
    vertical-align: top;
    border-top: 1px solid #ddd; }
  .table > thead > tr > th {
    vertical-align: bottom;
    border-bottom: 2px solid #ddd; }
  .table > caption + thead > tr:first-child > th,
  .table > caption + thead > tr:first-child > td,
  .table > colgroup + thead > tr:first-child > th,
  .table > colgroup + thead > tr:first-child > td,
  .table > thead:first-child > tr:first-child > th,
  .table > thead:first-child > tr:first-child > td {
    border-top: 0; }
  .table > tbody + tbody {
    border-top: 2px solid #ddd; }
  .table .table {
    background-color: #fff; }

.table-condensed > thead > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > th,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > th,
.table-condensed > tfoot > tr > td {
  padding: 5px; }

.table-bordered {
  border: 1px solid #ddd; }
  .table-bordered > thead > tr > th,
  .table-bordered > thead > tr > td,
  .table-bordered > tbody > tr > th,
  .table-bordered > tbody > tr > td,
  .table-bordered > tfoot > tr > th,
  .table-bordered > tfoot > tr > td {
    border: 1px solid #ddd; }
  .table-bordered > thead > tr > th,
  .table-bordered > thead > tr > td {
    border-bottom-width: 2px; }

.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #f9f9f9; }

.table-hover > tbody > tr:hover {
  background-color: #f5f5f5; }

table col[class*="col-"] {
  position: static;
  float: none;
  display: table-column; }

table td[class*="col-"],
table th[class*="col-"] {
  position: static;
  float: none;
  display: table-cell; }

.table > thead > tr > td.active,
.table > thead > tr > th.active, .table > thead > tr.active > td, .table > thead > tr.active > th,
.table > tbody > tr > td.active,
.table > tbody > tr > th.active,
.table > tbody > tr.active > td,
.table > tbody > tr.active > th,
.table > tfoot > tr > td.active,
.table > tfoot > tr > th.active,
.table > tfoot > tr.active > td,
.table > tfoot > tr.active > th {
  background-color: #f5f5f5; }

.table-hover > tbody > tr > td.active:hover,
.table-hover > tbody > tr > th.active:hover, .table-hover > tbody > tr.active:hover > td, .table-hover > tbody > tr:hover > .active, .table-hover > tbody > tr.active:hover > th {
  background-color: #e8e8e8; }

.table > thead > tr > td.success,
.table > thead > tr > th.success, .table > thead > tr.success > td, .table > thead > tr.success > th,
.table > tbody > tr > td.success,
.table > tbody > tr > th.success,
.table > tbody > tr.success > td,
.table > tbody > tr.success > th,
.table > tfoot > tr > td.success,
.table > tfoot > tr > th.success,
.table > tfoot > tr.success > td,
.table > tfoot > tr.success > th {
  background-color: #dff0d8; }

.table-hover > tbody > tr > td.success:hover,
.table-hover > tbody > tr > th.success:hover, .table-hover > tbody > tr.success:hover > td, .table-hover > tbody > tr:hover > .success, .table-hover > tbody > tr.success:hover > th {
  background-color: #d0e9c6; }

.table > thead > tr > td.info,
.table > thead > tr > th.info, .table > thead > tr.info > td, .table > thead > tr.info > th,
.table > tbody > tr > td.info,
.table > tbody > tr > th.info,
.table > tbody > tr.info > td,
.table > tbody > tr.info > th,
.table > tfoot > tr > td.info,
.table > tfoot > tr > th.info,
.table > tfoot > tr.info > td,
.table > tfoot > tr.info > th {
  background-color: #d9edf7; }

.table-hover > tbody > tr > td.info:hover,
.table-hover > tbody > tr > th.info:hover, .table-hover > tbody > tr.info:hover > td, .table-hover > tbody > tr:hover > .info, .table-hover > tbody > tr.info:hover > th {
  background-color: #c4e3f3; }

.table > thead > tr > td.warning,
.table > thead > tr > th.warning, .table > thead > tr.warning > td, .table > thead > tr.warning > th,
.table > tbody > tr > td.warning,
.table > tbody > tr > th.warning,
.table > tbody > tr.warning > td,
.table > tbody > tr.warning > th,
.table > tfoot > tr > td.warning,
.table > tfoot > tr > th.warning,
.table > tfoot > tr.warning > td,
.table > tfoot > tr.warning > th {
  background-color: #fcf8e3; }

.table-hover > tbody > tr > td.warning:hover,
.table-hover > tbody > tr > th.warning:hover, .table-hover > tbody > tr.warning:hover > td, .table-hover > tbody > tr:hover > .warning, .table-hover > tbody > tr.warning:hover > th {
  background-color: #faf2cc; }

.table > thead > tr > td.danger,
.table > thead > tr > th.danger, .table > thead > tr.danger > td, .table > thead > tr.danger > th,
.table > tbody > tr > td.danger,
.table > tbody > tr > th.danger,
.table > tbody > tr.danger > td,
.table > tbody > tr.danger > th,
.table > tfoot > tr > td.danger,
.table > tfoot > tr > th.danger,
.table > tfoot > tr.danger > td,
.table > tfoot > tr.danger > th {
  background-color: #f2dede; }

.table-hover > tbody > tr > td.danger:hover,
.table-hover > tbody > tr > th.danger:hover, .table-hover > tbody > tr.danger:hover > td, .table-hover > tbody > tr:hover > .danger, .table-hover > tbody > tr.danger:hover > th {
  background-color: #ebcccc; }

.table-responsive {
  overflow-x: auto;
  min-height: 0.01%; }
  @media screen and (max-width: 767px) {
    .table-responsive {
      width: 100%;
      margin-bottom: 15px;
      overflow-y: hidden;
      -ms-overflow-style: -ms-autohiding-scrollbar;
      border: 1px solid #ddd; }
      .table-responsive > .table {
        margin-bottom: 0; }
        .table-responsive > .table > thead > tr > th,
        .table-responsive > .table > thead > tr > td,
        .table-responsive > .table > tbody > tr > th,
        .table-responsive > .table > tbody > tr > td,
        .table-responsive > .table > tfoot > tr > th,
        .table-responsive > .table > tfoot > tr > td {
          white-space: nowrap; }
      .table-responsive > .table-bordered {
        border: 0; }
        .table-responsive > .table-bordered > thead > tr > th:first-child,
        .table-responsive > .table-bordered > thead > tr > td:first-child,
        .table-responsive > .table-bordered > tbody > tr > th:first-child,
        .table-responsive > .table-bordered > tbody > tr > td:first-child,
        .table-responsive > .table-bordered > tfoot > tr > th:first-child,
        .table-responsive > .table-bordered > tfoot > tr > td:first-child {
          border-left: 0; }
        .table-responsive > .table-bordered > thead > tr > th:last-child,
        .table-responsive > .table-bordered > thead > tr > td:last-child,
        .table-responsive > .table-bordered > tbody > tr > th:last-child,
        .table-responsive > .table-bordered > tbody > tr > td:last-child,
        .table-responsive > .table-bordered > tfoot > tr > th:last-child,
        .table-responsive > .table-bordered > tfoot > tr > td:last-child {
          border-right: 0; }
        .table-responsive > .table-bordered > tbody > tr:last-child > th,
        .table-responsive > .table-bordered > tbody > tr:last-child > td,
        .table-responsive > .table-bordered > tfoot > tr:last-child > th,
        .table-responsive > .table-bordered > tfoot > tr:last-child > td {
          border-bottom: 0; } }

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

legend {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: 20px;
  font-size: 21px;
  line-height: inherit;
  color: #333333;
  border: 0;
  border-bottom: 1px solid #e5e5e5; }

label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px;
  font-weight: bold; }

input[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

input[type="radio"],
input[type="checkbox"] {
  margin: 4px 0 0;
  margin-top: 1px \9;
  line-height: normal; }

input[type="file"] {
  display: block; }

input[type="range"] {
  display: block;
  width: 100%; }

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

input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px; }

output {
  display: block;
  padding-top: 7px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #555555; }

.form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #555555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; }
  .form-control:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); }
  .form-control::-moz-placeholder {
    color: #999;
    opacity: 1; }
  .form-control:-ms-input-placeholder {
    color: #999; }
  .form-control::-webkit-input-placeholder {
    color: #999; }
  .form-control::-ms-expand {
    border: 0;
    background-color: transparent; }
  .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
    background-color: #eeeeee;
    opacity: 1; }
  .form-control[disabled], fieldset[disabled] .form-control {
    cursor: not-allowed; }

textarea.form-control {
  height: auto; }

input[type="search"] {
  -webkit-appearance: none; }

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  input[type="date"].form-control,
  input[type="time"].form-control,
  input[type="datetime-local"].form-control,
  input[type="month"].form-control {
    line-height: 34px; }
  input[type="date"].input-sm, .input-group-sm > input[type="date"].form-control,
  .input-group-sm > input[type="date"].input-group-addon,
  .input-group-sm > .input-group-btn > input[type="date"].btn, .input-group-sm input[type="date"],
  input[type="time"].input-sm,
  .input-group-sm > input[type="time"].form-control,
  .input-group-sm > input[type="time"].input-group-addon,
  .input-group-sm > .input-group-btn > input[type="time"].btn,
  .input-group-sm input[type="time"],
  input[type="datetime-local"].input-sm,
  .input-group-sm > input[type="datetime-local"].form-control,
  .input-group-sm > input[type="datetime-local"].input-group-addon,
  .input-group-sm > .input-group-btn > input[type="datetime-local"].btn,
  .input-group-sm input[type="datetime-local"],
  input[type="month"].input-sm,
  .input-group-sm > input[type="month"].form-control,
  .input-group-sm > input[type="month"].input-group-addon,
  .input-group-sm > .input-group-btn > input[type="month"].btn,
  .input-group-sm input[type="month"] {
    line-height: 30px; }
  input[type="date"].input-lg, .input-group-lg > input[type="date"].form-control,
  .input-group-lg > input[type="date"].input-group-addon,
  .input-group-lg > .input-group-btn > input[type="date"].btn, .input-group-lg input[type="date"], input[type="time"].input-lg, .input-group-lg > input[type="time"].form-control,
  .input-group-lg > input[type="time"].input-group-addon,
  .input-group-lg > .input-group-btn > input[type="time"].btn, .input-group-lg input[type="time"], input[type="datetime-local"].input-lg, .input-group-lg > input[type="datetime-local"].form-control,
  .input-group-lg > input[type="datetime-local"].input-group-addon,
  .input-group-lg > .input-group-btn > input[type="datetime-local"].btn, .input-group-lg input[type="datetime-local"], input[type="month"].input-lg, .input-group-lg > input[type="month"].form-control,
  .input-group-lg > input[type="month"].input-group-addon,
  .input-group-lg > .input-group-btn > input[type="month"].btn, .input-group-lg input[type="month"] {
    line-height: 46px; } }
.form-group {
  margin-bottom: 15px; }

.radio,
.checkbox {
  position: relative;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px; }
  .radio label,
  .checkbox label {
    min-height: 20px;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: normal;
    cursor: pointer; }

.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  position: absolute;
  margin-left: -20px;
  margin-top: 4px \9; }

.radio + .radio,
.checkbox + .checkbox {
  margin-top: -5px; }

.radio-inline,
.checkbox-inline {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  margin-bottom: 0;
  vertical-align: middle;
  font-weight: normal;
  cursor: pointer; }

.radio-inline + .radio-inline,
.checkbox-inline + .checkbox-inline {
  margin-top: 0;
  margin-left: 10px; }

input[type="radio"][disabled], input[type="radio"].disabled, fieldset[disabled] input[type="radio"],
input[type="checkbox"][disabled],
input[type="checkbox"].disabled,
fieldset[disabled] input[type="checkbox"] {
  cursor: not-allowed; }

.radio-inline.disabled, fieldset[disabled] .radio-inline,
.checkbox-inline.disabled,
fieldset[disabled] .checkbox-inline {
  cursor: not-allowed; }

.radio.disabled label, fieldset[disabled] .radio label,
.checkbox.disabled label,
fieldset[disabled] .checkbox label {
  cursor: not-allowed; }

.form-control-static {
  padding-top: 7px;
  padding-bottom: 7px;
  margin-bottom: 0;
  min-height: 34px; }
  .form-control-static.input-lg, .input-group-lg > .form-control-static.form-control,
  .input-group-lg > .form-control-static.input-group-addon,
  .input-group-lg > .input-group-btn > .form-control-static.btn, .form-control-static.input-sm, .input-group-sm > .form-control-static.form-control,
  .input-group-sm > .form-control-static.input-group-addon,
  .input-group-sm > .input-group-btn > .form-control-static.btn {
    padding-left: 0;
    padding-right: 0; }

.input-sm, .input-group-sm > .form-control,
.input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .btn {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px; }

select.input-sm, .input-group-sm > select.form-control,
.input-group-sm > select.input-group-addon,
.input-group-sm > .input-group-btn > select.btn {
  height: 30px;
  line-height: 30px; }

textarea.input-sm, .input-group-sm > textarea.form-control,
.input-group-sm > textarea.input-group-addon,
.input-group-sm > .input-group-btn > textarea.btn,
select[multiple].input-sm,
.input-group-sm > select[multiple].form-control,
.input-group-sm > select[multiple].input-group-addon,
.input-group-sm > .input-group-btn > select[multiple].btn {
  height: auto; }

.form-group-sm .form-control {
  height: 30px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px; }
.form-group-sm select.form-control {
  height: 30px;
  line-height: 30px; }
.form-group-sm textarea.form-control,
.form-group-sm select[multiple].form-control {
  height: auto; }
.form-group-sm .form-control-static {
  height: 30px;
  min-height: 32px;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.5; }

.input-lg, .input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
  height: 46px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px; }

select.input-lg, .input-group-lg > select.form-control,
.input-group-lg > select.input-group-addon,
.input-group-lg > .input-group-btn > select.btn {
  height: 46px;
  line-height: 46px; }

textarea.input-lg, .input-group-lg > textarea.form-control,
.input-group-lg > textarea.input-group-addon,
.input-group-lg > .input-group-btn > textarea.btn,
select[multiple].input-lg,
.input-group-lg > select[multiple].form-control,
.input-group-lg > select[multiple].input-group-addon,
.input-group-lg > .input-group-btn > select[multiple].btn {
  height: auto; }

.form-group-lg .form-control {
  height: 46px;
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px; }
.form-group-lg select.form-control {
  height: 46px;
  line-height: 46px; }
.form-group-lg textarea.form-control,
.form-group-lg select[multiple].form-control {
  height: auto; }
.form-group-lg .form-control-static {
  height: 46px;
  min-height: 38px;
  padding: 11px 16px;
  font-size: 18px;
  line-height: 1.3333333; }

.has-feedback {
  position: relative; }
  .has-feedback .form-control {
    padding-right: 42.5px; }

.form-control-feedback {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  display: block;
  width: 34px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  pointer-events: none; }

.input-lg + .form-control-feedback, .input-group-lg > .form-control + .form-control-feedback,
.input-group-lg > .input-group-addon + .form-control-feedback,
.input-group-lg > .input-group-btn > .btn + .form-control-feedback,
.input-group-lg + .form-control-feedback,
.form-group-lg .form-control + .form-control-feedback {
  width: 46px;
  height: 46px;
  line-height: 46px; }

.input-sm + .form-control-feedback, .input-group-sm > .form-control + .form-control-feedback,
.input-group-sm > .input-group-addon + .form-control-feedback,
.input-group-sm > .input-group-btn > .btn + .form-control-feedback,
.input-group-sm + .form-control-feedback,
.form-group-sm .form-control + .form-control-feedback {
  width: 30px;
  height: 30px;
  line-height: 30px; }

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline, .has-success.radio label, .has-success.checkbox label, .has-success.radio-inline label, .has-success.checkbox-inline label {
  color: #3c763d; }
.has-success .form-control {
  border-color: #3c763d;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
  .has-success .form-control:focus {
    border-color: #2b542c;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168; }
.has-success .input-group-addon {
  color: #3c763d;
  border-color: #3c763d;
  background-color: #dff0d8; }
.has-success .form-control-feedback {
  color: #3c763d; }

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline, .has-warning.radio label, .has-warning.checkbox label, .has-warning.radio-inline label, .has-warning.checkbox-inline label {
  color: #8a6d3b; }
.has-warning .form-control {
  border-color: #8a6d3b;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
  .has-warning .form-control:focus {
    border-color: #66512c;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b; }
.has-warning .input-group-addon {
  color: #8a6d3b;
  border-color: #8a6d3b;
  background-color: #fcf8e3; }
.has-warning .form-control-feedback {
  color: #8a6d3b; }

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline, .has-error.radio label, .has-error.checkbox label, .has-error.radio-inline label, .has-error.checkbox-inline label {
  color: #a94442; }
.has-error .form-control {
  border-color: #a94442;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); }
  .has-error .form-control:focus {
    border-color: #843534;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483; }
.has-error .input-group-addon {
  color: #a94442;
  border-color: #a94442;
  background-color: #f2dede; }
.has-error .form-control-feedback {
  color: #a94442; }

.has-feedback label ~ .form-control-feedback {
  top: 25px; }
.has-feedback label.sr-only ~ .form-control-feedback {
  top: 0; }

.help-block {
  display: block;
  margin-top: 5px;
  margin-bottom: 10px;
  color: #737373; }

@media (min-width: 768px) {
  .form-inline .form-group {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle; }
  .form-inline .form-control {
    display: inline-block;
    width: auto;
    vertical-align: middle; }
  .form-inline .form-control-static {
    display: inline-block; }
  .form-inline .input-group {
    display: inline-table;
    vertical-align: middle; }
    .form-inline .input-group .input-group-addon,
    .form-inline .input-group .input-group-btn,
    .form-inline .input-group .form-control {
      width: auto; }
  .form-inline .input-group > .form-control {
    width: 100%; }
  .form-inline .control-label {
    margin-bottom: 0;
    vertical-align: middle; }
  .form-inline .radio,
  .form-inline .checkbox {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    vertical-align: middle; }
    .form-inline .radio label,
    .form-inline .checkbox label {
      padding-left: 0; }
  .form-inline .radio input[type="radio"],
  .form-inline .checkbox input[type="checkbox"] {
    position: relative;
    margin-left: 0; }
  .form-inline .has-feedback .form-control-feedback {
    top: 0; } }

.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 7px; }
.form-horizontal .radio,
.form-horizontal .checkbox {
  min-height: 27px; }
.form-horizontal .form-group {
  margin-left: -10px;
  margin-right: -10px; }
  .form-horizontal .form-group:before, .form-horizontal .form-group:after {
    content: " ";
    display: table; }
  .form-horizontal .form-group:after {
    clear: both; }
@media (min-width: 768px) {
  .form-horizontal .control-label {
    text-align: right;
    margin-bottom: 0;
    padding-top: 7px; } }
.form-horizontal .has-feedback .form-control-feedback {
  right: 10px; }
@media (min-width: 768px) {
  .form-horizontal .form-group-lg .control-label {
    padding-top: 11px;
    font-size: 18px; } }
@media (min-width: 768px) {
  .form-horizontal .form-group-sm .control-label {
    padding-top: 6px;
    font-size: 12px; } }

.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.428571429;
  border-radius: 4px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .btn:focus, .btn.focus, .btn:active:focus, .btn:active.focus, .btn.active:focus, .btn.active.focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px; }
  .btn:hover, .btn:focus, .btn.focus {
    color: #333;
    text-decoration: none; }
  .btn:active, .btn.active {
    outline: 0;
    background-image: none;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); }
  .btn.disabled, .btn[disabled], fieldset[disabled] .btn {
    cursor: not-allowed;
    opacity: 0.65;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none; }

a.btn.disabled, fieldset[disabled] a.btn {
  pointer-events: none; }

.btn-default {
  color: #333;
  background-color: #fff;
  border-color: #ccc; }
  .btn-default:focus, .btn-default.focus {
    color: #333;
    background-color: #e6e6e6;
    border-color: #8c8c8c; }
  .btn-default:hover {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad; }
  .btn-default:active, .btn-default.active, .open > .btn-default.dropdown-toggle {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad; }
    .btn-default:active:hover, .btn-default:active:focus, .btn-default:active.focus, .btn-default.active:hover, .btn-default.active:focus, .btn-default.active.focus, .open > .btn-default.dropdown-toggle:hover, .open > .btn-default.dropdown-toggle:focus, .open > .btn-default.dropdown-toggle.focus {
      color: #333;
      background-color: #d4d4d4;
      border-color: #8c8c8c; }
  .btn-default:active, .btn-default.active, .open > .btn-default.dropdown-toggle {
    background-image: none; }
  .btn-default.disabled:hover, .btn-default.disabled:focus, .btn-default.disabled.focus, .btn-default[disabled]:hover, .btn-default[disabled]:focus, .btn-default[disabled].focus, fieldset[disabled] .btn-default:hover, fieldset[disabled] .btn-default:focus, fieldset[disabled] .btn-default.focus {
    background-color: #fff;
    border-color: #ccc; }
  .btn-default .badge {
    color: #fff;
    background-color: #333; }

.btn-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4; }
  .btn-primary:focus, .btn-primary.focus {
    color: #fff;
    background-color: #286090;
    border-color: #122b40; }
  .btn-primary:hover {
    color: #fff;
    background-color: #286090;
    border-color: #204d74; }
  .btn-primary:active, .btn-primary.active, .open > .btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #286090;
    border-color: #204d74; }
    .btn-primary:active:hover, .btn-primary:active:focus, .btn-primary:active.focus, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary.active.focus, .open > .btn-primary.dropdown-toggle:hover, .open > .btn-primary.dropdown-toggle:focus, .open > .btn-primary.dropdown-toggle.focus {
      color: #fff;
      background-color: #204d74;
      border-color: #122b40; }
  .btn-primary:active, .btn-primary.active, .open > .btn-primary.dropdown-toggle {
    background-image: none; }
  .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary:hover, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary.focus {
    background-color: #337ab7;
    border-color: #2e6da4; }
  .btn-primary .badge {
    color: #337ab7;
    background-color: #fff; }

.btn-success {
  color: #fff;
  background-color: #5cb85c;
  border-color: #4cae4c; }
  .btn-success:focus, .btn-success.focus {
    color: #fff;
    background-color: #449d44;
    border-color: #255625; }
  .btn-success:hover {
    color: #fff;
    background-color: #449d44;
    border-color: #398439; }
  .btn-success:active, .btn-success.active, .open > .btn-success.dropdown-toggle {
    color: #fff;
    background-color: #449d44;
    border-color: #398439; }
    .btn-success:active:hover, .btn-success:active:focus, .btn-success:active.focus, .btn-success.active:hover, .btn-success.active:focus, .btn-success.active.focus, .open > .btn-success.dropdown-toggle:hover, .open > .btn-success.dropdown-toggle:focus, .open > .btn-success.dropdown-toggle.focus {
      color: #fff;
      background-color: #398439;
      border-color: #255625; }
  .btn-success:active, .btn-success.active, .open > .btn-success.dropdown-toggle {
    background-image: none; }
  .btn-success.disabled:hover, .btn-success.disabled:focus, .btn-success.disabled.focus, .btn-success[disabled]:hover, .btn-success[disabled]:focus, .btn-success[disabled].focus, fieldset[disabled] .btn-success:hover, fieldset[disabled] .btn-success:focus, fieldset[disabled] .btn-success.focus {
    background-color: #5cb85c;
    border-color: #4cae4c; }
  .btn-success .badge {
    color: #5cb85c;
    background-color: #fff; }

.btn-info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da; }
  .btn-info:focus, .btn-info.focus {
    color: #fff;
    background-color: #31b0d5;
    border-color: #1b6d85; }
  .btn-info:hover {
    color: #fff;
    background-color: #31b0d5;
    border-color: #269abc; }
  .btn-info:active, .btn-info.active, .open > .btn-info.dropdown-toggle {
    color: #fff;
    background-color: #31b0d5;
    border-color: #269abc; }
    .btn-info:active:hover, .btn-info:active:focus, .btn-info:active.focus, .btn-info.active:hover, .btn-info.active:focus, .btn-info.active.focus, .open > .btn-info.dropdown-toggle:hover, .open > .btn-info.dropdown-toggle:focus, .open > .btn-info.dropdown-toggle.focus {
      color: #fff;
      background-color: #269abc;
      border-color: #1b6d85; }
  .btn-info:active, .btn-info.active, .open > .btn-info.dropdown-toggle {
    background-image: none; }
  .btn-info.disabled:hover, .btn-info.disabled:focus, .btn-info.disabled.focus, .btn-info[disabled]:hover, .btn-info[disabled]:focus, .btn-info[disabled].focus, fieldset[disabled] .btn-info:hover, fieldset[disabled] .btn-info:focus, fieldset[disabled] .btn-info.focus {
    background-color: #5bc0de;
    border-color: #46b8da; }
  .btn-info .badge {
    color: #5bc0de;
    background-color: #fff; }

.btn-warning {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #eea236; }
  .btn-warning:focus, .btn-warning.focus {
    color: #fff;
    background-color: #ec971f;
    border-color: #985f0d; }
  .btn-warning:hover {
    color: #fff;
    background-color: #ec971f;
    border-color: #d58512; }
  .btn-warning:active, .btn-warning.active, .open > .btn-warning.dropdown-toggle {
    color: #fff;
    background-color: #ec971f;
    border-color: #d58512; }
    .btn-warning:active:hover, .btn-warning:active:focus, .btn-warning:active.focus, .btn-warning.active:hover, .btn-warning.active:focus, .btn-warning.active.focus, .open > .btn-warning.dropdown-toggle:hover, .open > .btn-warning.dropdown-toggle:focus, .open > .btn-warning.dropdown-toggle.focus {
      color: #fff;
      background-color: #d58512;
      border-color: #985f0d; }
  .btn-warning:active, .btn-warning.active, .open > .btn-warning.dropdown-toggle {
    background-image: none; }
  .btn-warning.disabled:hover, .btn-warning.disabled:focus, .btn-warning.disabled.focus, .btn-warning[disabled]:hover, .btn-warning[disabled]:focus, .btn-warning[disabled].focus, fieldset[disabled] .btn-warning:hover, fieldset[disabled] .btn-warning:focus, fieldset[disabled] .btn-warning.focus {
    background-color: #f0ad4e;
    border-color: #eea236; }
  .btn-warning .badge {
    color: #f0ad4e;
    background-color: #fff; }

.btn-danger {
  color: #fff;
  background-color: #d9534f;
  border-color: #d43f3a; }
  .btn-danger:focus, .btn-danger.focus {
    color: #fff;
    background-color: #c9302c;
    border-color: #761c19; }
  .btn-danger:hover {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925; }
  .btn-danger:active, .btn-danger.active, .open > .btn-danger.dropdown-toggle {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925; }
    .btn-danger:active:hover, .btn-danger:active:focus, .btn-danger:active.focus, .btn-danger.active:hover, .btn-danger.active:focus, .btn-danger.active.focus, .open > .btn-danger.dropdown-toggle:hover, .open > .btn-danger.dropdown-toggle:focus, .open > .btn-danger.dropdown-toggle.focus {
      color: #fff;
      background-color: #ac2925;
      border-color: #761c19; }
  .btn-danger:active, .btn-danger.active, .open > .btn-danger.dropdown-toggle {
    background-image: none; }
  .btn-danger.disabled:hover, .btn-danger.disabled:focus, .btn-danger.disabled.focus, .btn-danger[disabled]:hover, .btn-danger[disabled]:focus, .btn-danger[disabled].focus, fieldset[disabled] .btn-danger:hover, fieldset[disabled] .btn-danger:focus, fieldset[disabled] .btn-danger.focus {
    background-color: #d9534f;
    border-color: #d43f3a; }
  .btn-danger .badge {
    color: #d9534f;
    background-color: #fff; }

.btn-link {
  color: #337ab7;
  font-weight: normal;
  border-radius: 0; }
  .btn-link, .btn-link:active, .btn-link.active, .btn-link[disabled], fieldset[disabled] .btn-link {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none; }
  .btn-link, .btn-link:hover, .btn-link:focus, .btn-link:active {
    border-color: transparent; }
  .btn-link:hover, .btn-link:focus {
    color: #23527c;
    text-decoration: underline;
    background-color: transparent; }
  .btn-link[disabled]:hover, .btn-link[disabled]:focus, fieldset[disabled] .btn-link:hover, fieldset[disabled] .btn-link:focus {
    color: #777777;
    text-decoration: none; }

.btn-lg, .btn-group-lg > .btn {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 6px; }

.btn-sm, .btn-group-sm > .btn {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px; }

.btn-xs, .btn-group-xs > .btn {
  padding: 1px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px; }

.btn-block {
  display: block;
  width: 100%; }

.btn-block + .btn-block {
  margin-top: 5px; }

input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
  width: 100%; }

.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear; }
  .fade.in {
    opacity: 1; }

.collapse {
  display: none; }
  .collapse.in {
    display: block; }

tr.collapse.in {
  display: table-row; }

tbody.collapse.in {
  display: table-row-group; }

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition-property: height, visibility;
  transition-property: height, visibility;
  -webkit-transition-duration: 0.35s;
  transition-duration: 0.35s;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease; }

.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid \9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent; }

.dropup,
.dropdown {
  position: relative; }

.dropdown-toggle:focus {
  outline: 0; }

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  list-style: none;
  font-size: 14px;
  text-align: left;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  background-clip: padding-box; }
  .dropdown-menu.pull-right {
    right: 0;
    left: auto; }
  .dropdown-menu .divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5; }
  .dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
    color: #333333;
    white-space: nowrap; }

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
  text-decoration: none;
  color: #262626;
  background-color: #f5f5f5; }

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
  color: #fff;
  text-decoration: none;
  outline: 0;
  background-color: #337ab7; }

.dropdown-menu > .disabled > a, .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {
  color: #777777; }
.dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {
  text-decoration: none;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  cursor: not-allowed; }

.open > .dropdown-menu {
  display: block; }
.open > a {
  outline: 0; }

.dropdown-menu-right {
  left: auto;
  right: 0; }

.dropdown-menu-left {
  left: 0;
  right: auto; }

.dropdown-header {
  display: block;
  padding: 3px 20px;
  font-size: 12px;
  line-height: 1.428571429;
  color: #777777;
  white-space: nowrap; }

.dropdown-backdrop {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 990; }

.pull-right > .dropdown-menu {
  right: 0;
  left: auto; }

.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
  border-top: 0;
  border-bottom: 4px dashed;
  border-bottom: 4px solid \9;
  content: ""; }
.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-bottom: 2px; }

@media (min-width: 768px) {
  .navbar-right .dropdown-menu {
    right: 0;
    left: auto; }
  .navbar-right .dropdown-menu-left {
    left: 0;
    right: auto; } }
.btn-group,
.btn-group-vertical {
  position: relative;
  display: inline-block;
  vertical-align: middle; }
  .btn-group > .btn,
  .btn-group-vertical > .btn {
    position: relative;
    float: left; }
    .btn-group > .btn:hover, .btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active,
    .btn-group-vertical > .btn:hover,
    .btn-group-vertical > .btn:focus,
    .btn-group-vertical > .btn:active,
    .btn-group-vertical > .btn.active {
      z-index: 2; }

.btn-group .btn + .btn,
.btn-group .btn + .btn-group,
.btn-group .btn-group + .btn,
.btn-group .btn-group + .btn-group {
  margin-left: -1px; }

.btn-toolbar {
  margin-left: -5px; }
  .btn-toolbar:before, .btn-toolbar:after {
    content: " ";
    display: table; }
  .btn-toolbar:after {
    clear: both; }
  .btn-toolbar .btn,
  .btn-toolbar .btn-group,
  .btn-toolbar .input-group {
    float: left; }
  .btn-toolbar > .btn,
  .btn-toolbar > .btn-group,
  .btn-toolbar > .input-group {
    margin-left: 5px; }

.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
  border-radius: 0; }

.btn-group > .btn:first-child {
  margin-left: 0; }
  .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0; }

.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0; }

.btn-group > .btn-group {
  float: left; }

.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0; }

.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0; }

.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0; }

.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
  outline: 0; }

.btn-group > .btn + .dropdown-toggle {
  padding-left: 8px;
  padding-right: 8px; }

.btn-group > .btn-lg + .dropdown-toggle, .btn-group-lg.btn-group > .btn + .dropdown-toggle {
  padding-left: 12px;
  padding-right: 12px; }

.btn-group.open .dropdown-toggle {
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); }
  .btn-group.open .dropdown-toggle.btn-link {
    -webkit-box-shadow: none;
    box-shadow: none; }

.btn .caret {
  margin-left: 0; }

.btn-lg .caret, .btn-group-lg > .btn .caret {
  border-width: 5px 5px 0;
  border-bottom-width: 0; }

.dropup .btn-lg .caret, .dropup .btn-group-lg > .btn .caret {
  border-width: 0 5px 5px; }

.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group,
.btn-group-vertical > .btn-group > .btn {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%; }
.btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after {
  content: " ";
  display: table; }
.btn-group-vertical > .btn-group:after {
  clear: both; }
.btn-group-vertical > .btn-group > .btn {
  float: none; }
.btn-group-vertical > .btn + .btn,
.btn-group-vertical > .btn + .btn-group,
.btn-group-vertical > .btn-group + .btn,
.btn-group-vertical > .btn-group + .btn-group {
  margin-top: -1px;
  margin-left: 0; }

.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
  border-radius: 0; }
.btn-group-vertical > .btn:first-child:not(:last-child) {
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0; }
.btn-group-vertical > .btn:last-child:not(:first-child) {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px; }

.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
  border-radius: 0; }

.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child,
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0; }

.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
  border-top-right-radius: 0;
  border-top-left-radius: 0; }

.btn-group-justified {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: separate; }
  .btn-group-justified > .btn,
  .btn-group-justified > .btn-group {
    float: none;
    display: table-cell;
    width: 1%; }
  .btn-group-justified > .btn-group .btn {
    width: 100%; }
  .btn-group-justified > .btn-group .dropdown-menu {
    left: auto; }

[data-toggle="buttons"] > .btn input[type="radio"],
[data-toggle="buttons"] > .btn input[type="checkbox"],
[data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
[data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none; }

.input-group {
  position: relative;
  display: table;
  border-collapse: separate; }
  .input-group[class*="col-"] {
    float: none;
    padding-left: 0;
    padding-right: 0; }
  .input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0; }
    .input-group .form-control:focus {
      z-index: 3; }

.input-group-addon,
.input-group-btn,
.input-group .form-control {
  display: table-cell; }
  .input-group-addon:not(:first-child):not(:last-child),
  .input-group-btn:not(:first-child):not(:last-child),
  .input-group .form-control:not(:first-child):not(:last-child) {
    border-radius: 0; }

.input-group-addon,
.input-group-btn {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle; }

.input-group-addon {
  padding: 6px 12px;
  font-size: 14px;
  font-weight: normal;
  line-height: 1;
  color: #555555;
  text-align: center;
  background-color: #eeeeee;
  border: 1px solid #ccc;
  border-radius: 4px; }
  .input-group-addon.input-sm,
  .input-group-sm > .input-group-addon,
  .input-group-sm > .input-group-btn > .input-group-addon.btn {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 3px; }
  .input-group-addon.input-lg,
  .input-group-lg > .input-group-addon,
  .input-group-lg > .input-group-btn > .input-group-addon.btn {
    padding: 10px 16px;
    font-size: 18px;
    border-radius: 6px; }
  .input-group-addon input[type="radio"],
  .input-group-addon input[type="checkbox"] {
    margin-top: 0; }

.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group > .btn,
.input-group-btn:first-child > .dropdown-toggle,
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0; }

.input-group-addon:first-child {
  border-right: 0; }

.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle,
.input-group-btn:first-child > .btn:not(:first-child),
.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0; }

.input-group-addon:last-child {
  border-left: 0; }

.input-group-btn {
  position: relative;
  font-size: 0;
  white-space: nowrap; }
  .input-group-btn > .btn {
    position: relative; }
    .input-group-btn > .btn + .btn {
      margin-left: -1px; }
    .input-group-btn > .btn:hover, .input-group-btn > .btn:focus, .input-group-btn > .btn:active {
      z-index: 2; }
  .input-group-btn:first-child > .btn,
  .input-group-btn:first-child > .btn-group {
    margin-right: -1px; }
  .input-group-btn:last-child > .btn,
  .input-group-btn:last-child > .btn-group {
    z-index: 2;
    margin-left: -1px; }

.nav {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none; }
  .nav:before, .nav:after {
    content: " ";
    display: table; }
  .nav:after {
    clear: both; }
  .nav > li {
    position: relative;
    display: block; }
    .nav > li > a {
      position: relative;
      display: block;
      padding: 10px 15px; }
      .nav > li > a:hover, .nav > li > a:focus {
        text-decoration: none;
        background-color: #eeeeee; }
    .nav > li.disabled > a {
      color: #777777; }
      .nav > li.disabled > a:hover, .nav > li.disabled > a:focus {
        color: #777777;
        text-decoration: none;
        background-color: transparent;
        cursor: not-allowed; }
  .nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background-color: #eeeeee;
    border-color: #337ab7; }
  .nav .nav-divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5; }
  .nav > li > a > img {
    max-width: none; }

.nav-tabs {
  border-bottom: 1px solid #ddd; }
  .nav-tabs > li {
    float: left;
    margin-bottom: -1px; }
    .nav-tabs > li > a {
      margin-right: 2px;
      line-height: 1.428571429;
      border: 1px solid transparent;
      border-radius: 4px 4px 0 0; }
      .nav-tabs > li > a:hover {
        border-color: #eeeeee #eeeeee #ddd; }
    .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
      color: #555555;
      background-color: #fff;
      border: 1px solid #ddd;
      border-bottom-color: transparent;
      cursor: default; }

.nav-pills > li {
  float: left; }
  .nav-pills > li > a {
    border-radius: 4px; }
  .nav-pills > li + li {
    margin-left: 2px; }
  .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: #fff;
    background-color: #337ab7; }

.nav-stacked > li {
  float: none; }
  .nav-stacked > li + li {
    margin-top: 2px;
    margin-left: 0; }

.nav-justified, .nav-tabs.nav-justified {
  width: 100%; }
  .nav-justified > li, .nav-tabs.nav-justified > li {
    float: none; }
    .nav-justified > li > a, .nav-tabs.nav-justified > li > a {
      text-align: center;
      margin-bottom: 5px; }
  .nav-justified > .dropdown .dropdown-menu {
    top: auto;
    left: auto; }
  @media (min-width: 768px) {
    .nav-justified > li, .nav-tabs.nav-justified > li {
      display: table-cell;
      width: 1%; }
      .nav-justified > li > a, .nav-tabs.nav-justified > li > a {
        margin-bottom: 0; } }

.nav-tabs-justified, .nav-tabs.nav-justified {
  border-bottom: 0; }
  .nav-tabs-justified > li > a, .nav-tabs.nav-justified > li > a {
    margin-right: 0;
    border-radius: 4px; }
  .nav-tabs-justified > .active > a, .nav-tabs.nav-justified > .active > a,
  .nav-tabs-justified > .active > a:hover,
  .nav-tabs.nav-justified > .active > a:hover,
  .nav-tabs-justified > .active > a:focus,
  .nav-tabs.nav-justified > .active > a:focus {
    border: 1px solid #ddd; }
  @media (min-width: 768px) {
    .nav-tabs-justified > li > a, .nav-tabs.nav-justified > li > a {
      border-bottom: 1px solid #ddd;
      border-radius: 4px 4px 0 0; }
    .nav-tabs-justified > .active > a, .nav-tabs.nav-justified > .active > a,
    .nav-tabs-justified > .active > a:hover,
    .nav-tabs.nav-justified > .active > a:hover,
    .nav-tabs-justified > .active > a:focus,
    .nav-tabs.nav-justified > .active > a:focus {
      border-bottom-color: #fff; } }

.tab-content > .tab-pane {
  display: none; }
.tab-content > .active {
  display: block; }

.nav-tabs .dropdown-menu {
  margin-top: -1px;
  border-top-right-radius: 0;
  border-top-left-radius: 0; }

.navbar {
  position: relative;
  min-height: 50px;
  margin-bottom: 20px;
  border: 1px solid transparent; }
  .navbar:before, .navbar:after {
    content: " ";
    display: table; }
  .navbar:after {
    clear: both; }
  @media (min-width: 768px) {
    .navbar {
      border-radius: 4px; } }

.navbar-header:before, .navbar-header:after {
  content: " ";
  display: table; }
.navbar-header:after {
  clear: both; }
@media (min-width: 768px) {
  .navbar-header {
    float: left; } }

.navbar-collapse {
  overflow-x: visible;
  padding-right: 10px;
  padding-left: 10px;
  border-top: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-overflow-scrolling: touch; }
  .navbar-collapse:before, .navbar-collapse:after {
    content: " ";
    display: table; }
  .navbar-collapse:after {
    clear: both; }
  .navbar-collapse.in {
    overflow-y: auto; }
  @media (min-width: 768px) {
    .navbar-collapse {
      width: auto;
      border-top: 0;
      box-shadow: none; }
      .navbar-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important; }
      .navbar-collapse.in {
        overflow-y: visible; }
      .navbar-fixed-top .navbar-collapse, .navbar-static-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
        padding-left: 0;
        padding-right: 0; } }

.navbar-fixed-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
  max-height: 340px; }
  @media (max-device-width: 480px) and (orientation: landscape) {
    .navbar-fixed-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
      max-height: 200px; } }

.container > .navbar-header,
.container > .navbar-collapse,
.container-fluid > .navbar-header,
.container-fluid > .navbar-collapse {
  margin-right: -10px;
  margin-left: -10px; }
  @media (min-width: 768px) {
    .container > .navbar-header,
    .container > .navbar-collapse,
    .container-fluid > .navbar-header,
    .container-fluid > .navbar-collapse {
      margin-right: 0;
      margin-left: 0; } }

.navbar-static-top {
  z-index: 1000;
  border-width: 0 0 1px; }
  @media (min-width: 768px) {
    .navbar-static-top {
      border-radius: 0; } }

.navbar-fixed-top,
.navbar-fixed-bottom {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1030; }
  @media (min-width: 768px) {
    .navbar-fixed-top,
    .navbar-fixed-bottom {
      border-radius: 0; } }

.navbar-fixed-top {
  top: 0;
  border-width: 0 0 1px; }

.navbar-fixed-bottom {
  bottom: 0;
  margin-bottom: 0;
  border-width: 1px 0 0; }

.navbar-brand {
  float: left;
  padding: 15px 10px;
  font-size: 18px;
  line-height: 20px;
  height: 50px; }
  .navbar-brand:hover, .navbar-brand:focus {
    text-decoration: none; }
  .navbar-brand > img {
    display: block; }
  @media (min-width: 768px) {
    .navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {
      margin-left: -10px; } }

.navbar-toggle {
  position: relative;
  float: right;
  margin-right: 10px;
  padding: 9px 10px;
  margin-top: 8px;
  margin-bottom: 8px;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px; }
  .navbar-toggle:focus {
    outline: 0; }
  .navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px; }
  .navbar-toggle .icon-bar + .icon-bar {
    margin-top: 4px; }
  @media (min-width: 768px) {
    .navbar-toggle {
      display: none; } }

.navbar-nav {
  margin: 7.5px -10px; }
  .navbar-nav > li > a {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px; }
  @media (max-width: 767px) {
    .navbar-nav .open .dropdown-menu {
      position: static;
      float: none;
      width: auto;
      margin-top: 0;
      background-color: transparent;
      border: 0;
      box-shadow: none; }
      .navbar-nav .open .dropdown-menu > li > a,
      .navbar-nav .open .dropdown-menu .dropdown-header {
        padding: 5px 15px 5px 25px; }
      .navbar-nav .open .dropdown-menu > li > a {
        line-height: 20px; }
        .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-nav .open .dropdown-menu > li > a:focus {
          background-image: none; } }
  @media (min-width: 768px) {
    .navbar-nav {
      float: left;
      margin: 0; }
      .navbar-nav > li {
        float: left; }
        .navbar-nav > li > a {
          padding-top: 15px;
          padding-bottom: 15px; } }

.navbar-form {
  margin-left: -10px;
  margin-right: -10px;
  padding: 10px 10px;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
  margin-top: 8px;
  margin-bottom: 8px; }
  @media (min-width: 768px) {
    .navbar-form .form-group {
      display: inline-block;
      margin-bottom: 0;
      vertical-align: middle; }
    .navbar-form .form-control {
      display: inline-block;
      width: auto;
      vertical-align: middle; }
    .navbar-form .form-control-static {
      display: inline-block; }
    .navbar-form .input-group {
      display: inline-table;
      vertical-align: middle; }
      .navbar-form .input-group .input-group-addon,
      .navbar-form .input-group .input-group-btn,
      .navbar-form .input-group .form-control {
        width: auto; }
    .navbar-form .input-group > .form-control {
      width: 100%; }
    .navbar-form .control-label {
      margin-bottom: 0;
      vertical-align: middle; }
    .navbar-form .radio,
    .navbar-form .checkbox {
      display: inline-block;
      margin-top: 0;
      margin-bottom: 0;
      vertical-align: middle; }
      .navbar-form .radio label,
      .navbar-form .checkbox label {
        padding-left: 0; }
    .navbar-form .radio input[type="radio"],
    .navbar-form .checkbox input[type="checkbox"] {
      position: relative;
      margin-left: 0; }
    .navbar-form .has-feedback .form-control-feedback {
      top: 0; } }
  @media (max-width: 767px) {
    .navbar-form .form-group {
      margin-bottom: 5px; }
      .navbar-form .form-group:last-child {
        margin-bottom: 0; } }
  @media (min-width: 768px) {
    .navbar-form {
      width: auto;
      border: 0;
      margin-left: 0;
      margin-right: 0;
      padding-top: 0;
      padding-bottom: 0;
      -webkit-box-shadow: none;
      box-shadow: none; } }

.navbar-nav > li > .dropdown-menu {
  margin-top: 0;
  border-top-right-radius: 0;
  border-top-left-radius: 0; }

.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
  margin-bottom: 0;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0; }

.navbar-btn {
  margin-top: 8px;
  margin-bottom: 8px; }
  .navbar-btn.btn-sm, .btn-group-sm > .navbar-btn.btn {
    margin-top: 10px;
    margin-bottom: 10px; }
  .navbar-btn.btn-xs, .btn-group-xs > .navbar-btn.btn {
    margin-top: 14px;
    margin-bottom: 14px; }

.navbar-text {
  margin-top: 15px;
  margin-bottom: 15px; }
  @media (min-width: 768px) {
    .navbar-text {
      float: left;
      margin-left: 10px;
      margin-right: 10px; } }

@media (min-width: 768px) {
  .navbar-left {
    float: left !important; }

  .navbar-right {
    float: right !important;
    margin-right: -10px; }
    .navbar-right ~ .navbar-right {
      margin-right: 0; } }
.navbar-default {
  background-color: #f8f8f8;
  border-color: #e7e7e7; }
  .navbar-default .navbar-brand {
    color: #777; }
    .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
      color: #5e5e5e;
      background-color: transparent; }
  .navbar-default .navbar-text {
    color: #777; }
  .navbar-default .navbar-nav > li > a {
    color: #777; }
    .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
      color: #333;
      background-color: transparent; }
  .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #555;
    background-color: #e7e7e7; }
  .navbar-default .navbar-nav > .disabled > a, .navbar-default .navbar-nav > .disabled > a:hover, .navbar-default .navbar-nav > .disabled > a:focus {
    color: #ccc;
    background-color: transparent; }
  .navbar-default .navbar-toggle {
    border-color: #ddd; }
    .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
      background-color: #ddd; }
    .navbar-default .navbar-toggle .icon-bar {
      background-color: #888; }
  .navbar-default .navbar-collapse,
  .navbar-default .navbar-form {
    border-color: #e7e7e7; }
  .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    background-color: #e7e7e7;
    color: #555; }
  @media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
      color: #777; }
      .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
        color: #333;
        background-color: transparent; }
    .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
      color: #555;
      background-color: #e7e7e7; }
    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
      color: #ccc;
      background-color: transparent; } }
  .navbar-default .navbar-link {
    color: #777; }
    .navbar-default .navbar-link:hover {
      color: #333; }
  .navbar-default .btn-link {
    color: #777; }
    .navbar-default .btn-link:hover, .navbar-default .btn-link:focus {
      color: #333; }
    .navbar-default .btn-link[disabled]:hover, .navbar-default .btn-link[disabled]:focus, fieldset[disabled] .navbar-default .btn-link:hover, fieldset[disabled] .navbar-default .btn-link:focus {
      color: #ccc; }

.navbar-inverse {
  background-color: #222;
  border-color: #090909; }
  .navbar-inverse .navbar-brand {
    color: #9d9d9d; }
    .navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus {
      color: #fff;
      background-color: transparent; }
  .navbar-inverse .navbar-text {
    color: #9d9d9d; }
  .navbar-inverse .navbar-nav > li > a {
    color: #9d9d9d; }
    .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
      color: #fff;
      background-color: transparent; }
  .navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
    color: #fff;
    background-color: #090909; }
  .navbar-inverse .navbar-nav > .disabled > a, .navbar-inverse .navbar-nav > .disabled > a:hover, .navbar-inverse .navbar-nav > .disabled > a:focus {
    color: #444;
    background-color: transparent; }
  .navbar-inverse .navbar-toggle {
    border-color: #333; }
    .navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
      background-color: #333; }
    .navbar-inverse .navbar-toggle .icon-bar {
      background-color: #fff; }
  .navbar-inverse .navbar-collapse,
  .navbar-inverse .navbar-form {
    border-color: #101010; }
  .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
    background-color: #090909;
    color: #fff; }
  @media (max-width: 767px) {
    .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
      border-color: #090909; }
    .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
      background-color: #090909; }
    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
      color: #9d9d9d; }
      .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
        color: #fff;
        background-color: transparent; }
    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
      color: #fff;
      background-color: #090909; }
    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
      color: #444;
      background-color: transparent; } }
  .navbar-inverse .navbar-link {
    color: #9d9d9d; }
    .navbar-inverse .navbar-link:hover {
      color: #fff; }
  .navbar-inverse .btn-link {
    color: #9d9d9d; }
    .navbar-inverse .btn-link:hover, .navbar-inverse .btn-link:focus {
      color: #fff; }
    .navbar-inverse .btn-link[disabled]:hover, .navbar-inverse .btn-link[disabled]:focus, fieldset[disabled] .navbar-inverse .btn-link:hover, fieldset[disabled] .navbar-inverse .btn-link:focus {
      color: #444; }

.breadcrumb {
  padding: 8px 15px;
  margin-bottom: 20px;
  list-style: none;
  background-color: #f5f5f5;
  border-radius: 4px; }
  .breadcrumb > li {
    display: inline-block; }
    .breadcrumb > li + li:before {
      content: "/ ";
      padding: 0 5px;
      color: #ccc; }
  .breadcrumb > .active {
    color: #777777; }

.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 20px 0;
  border-radius: 4px; }
  .pagination > li {
    display: inline; }
    .pagination > li > a,
    .pagination > li > span {
      position: relative;
      float: left;
      padding: 6px 12px;
      line-height: 1.428571429;
      text-decoration: none;
      color: #337ab7;
      background-color: #fff;
      border: 1px solid #ddd;
      margin-left: -1px; }
    .pagination > li:first-child > a,
    .pagination > li:first-child > span {
      margin-left: 0;
      border-bottom-left-radius: 4px;
      border-top-left-radius: 4px; }
    .pagination > li:last-child > a,
    .pagination > li:last-child > span {
      border-bottom-right-radius: 4px;
      border-top-right-radius: 4px; }
  .pagination > li > a:hover, .pagination > li > a:focus,
  .pagination > li > span:hover,
  .pagination > li > span:focus {
    z-index: 2;
    color: #23527c;
    background-color: #eeeeee;
    border-color: #ddd; }
  .pagination > .active > a, .pagination > .active > a:hover, .pagination > .active > a:focus,
  .pagination > .active > span,
  .pagination > .active > span:hover,
  .pagination > .active > span:focus {
    z-index: 3;
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7;
    cursor: default; }
  .pagination > .disabled > span,
  .pagination > .disabled > span:hover,
  .pagination > .disabled > span:focus,
  .pagination > .disabled > a,
  .pagination > .disabled > a:hover,
  .pagination > .disabled > a:focus {
    color: #777777;
    background-color: #fff;
    border-color: #ddd;
    cursor: not-allowed; }

.pagination-lg > li > a,
.pagination-lg > li > span {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333; }
.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
  border-bottom-left-radius: 6px;
  border-top-left-radius: 6px; }
.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
  border-bottom-right-radius: 6px;
  border-top-right-radius: 6px; }

.pagination-sm > li > a,
.pagination-sm > li > span {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5; }
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
  border-bottom-left-radius: 3px;
  border-top-left-radius: 3px; }
.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px; }

.pager {
  padding-left: 0;
  margin: 20px 0;
  list-style: none;
  text-align: center; }
  .pager:before, .pager:after {
    content: " ";
    display: table; }
  .pager:after {
    clear: both; }
  .pager li {
    display: inline; }
    .pager li > a,
    .pager li > span {
      display: inline-block;
      padding: 5px 14px;
      background-color: #fff;
      border: 1px solid #ddd;
      border-radius: 15px; }
    .pager li > a:hover,
    .pager li > a:focus {
      text-decoration: none;
      background-color: #eeeeee; }
  .pager .next > a,
  .pager .next > span {
    float: right; }
  .pager .previous > a,
  .pager .previous > span {
    float: left; }
  .pager .disabled > a,
  .pager .disabled > a:hover,
  .pager .disabled > a:focus,
  .pager .disabled > span {
    color: #777777;
    background-color: #fff;
    cursor: not-allowed; }

.label {
  display: inline;
  padding: .2em .6em .3em;
  font-size: 75%;
  font-weight: bold;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: .25em; }
  .label:empty {
    display: none; }
  .btn .label {
    position: relative;
    top: -1px; }

a.label:hover, a.label:focus {
  color: #fff;
  text-decoration: none;
  cursor: pointer; }

.label-default {
  background-color: #777777; }
  .label-default[href]:hover, .label-default[href]:focus {
    background-color: #5e5e5e; }

.label-primary {
  background-color: #337ab7; }
  .label-primary[href]:hover, .label-primary[href]:focus {
    background-color: #286090; }

.label-success {
  background-color: #5cb85c; }
  .label-success[href]:hover, .label-success[href]:focus {
    background-color: #449d44; }

.label-info {
  background-color: #5bc0de; }
  .label-info[href]:hover, .label-info[href]:focus {
    background-color: #31b0d5; }

.label-warning {
  background-color: #f0ad4e; }
  .label-warning[href]:hover, .label-warning[href]:focus {
    background-color: #ec971f; }

.label-danger {
  background-color: #d9534f; }
  .label-danger[href]:hover, .label-danger[href]:focus {
    background-color: #c9302c; }

.badge {
  display: inline-block;
  min-width: 10px;
  padding: 3px 7px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  line-height: 1;
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
  background-color: #777777;
  border-radius: 10px; }
  .badge:empty {
    display: none; }
  .btn .badge {
    position: relative;
    top: -1px; }
  .btn-xs .badge, .btn-group-xs > .btn .badge, .btn-group-xs > .btn .badge {
    top: 0;
    padding: 1px 5px; }
  .list-group-item.active > .badge, .nav-pills > .active > a > .badge {
    color: #337ab7;
    background-color: #fff; }
  .list-group-item > .badge {
    float: right; }
  .list-group-item > .badge + .badge {
    margin-right: 5px; }
  .nav-pills > li > a > .badge {
    margin-left: 3px; }

a.badge:hover, a.badge:focus {
  color: #fff;
  text-decoration: none;
  cursor: pointer; }

.jumbotron {
  padding-top: 30px;
  padding-bottom: 30px;
  margin-bottom: 30px;
  color: inherit;
  background-color: #eeeeee; }
  .jumbotron h1,
  .jumbotron .h1 {
    color: inherit; }
  .jumbotron p {
    margin-bottom: 15px;
    font-size: 21px;
    font-weight: 200; }
  .jumbotron > hr {
    border-top-color: #d5d5d5; }
  .container .jumbotron, .container-fluid .jumbotron {
    border-radius: 6px;
    padding-left: 10px;
    padding-right: 10px; }
  .jumbotron .container {
    max-width: 100%; }
  @media screen and (min-width: 768px) {
    .jumbotron {
      padding-top: 48px;
      padding-bottom: 48px; }
      .container .jumbotron, .container-fluid .jumbotron {
        padding-left: 60px;
        padding-right: 60px; }
      .jumbotron h1,
      .jumbotron .h1 {
        font-size: 63px; } }

.thumbnail {
  display: block;
  padding: 4px;
  margin-bottom: 20px;
  line-height: 1.428571429;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: border 0.2s ease-in-out;
  -o-transition: border 0.2s ease-in-out;
  transition: border 0.2s ease-in-out; }
  .thumbnail > img,
  .thumbnail a > img {
    display: block;
    max-width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto; }
  .thumbnail .caption {
    padding: 9px;
    color: #333333; }

a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
  border-color: #337ab7; }

.alert {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px; }
  .alert h4 {
    margin-top: 0;
    color: inherit; }
  .alert .alert-link {
    font-weight: bold; }
  .alert > p,
  .alert > ul {
    margin-bottom: 0; }
  .alert > p + p {
    margin-top: 5px; }

.alert-dismissable,
.alert-dismissible {
  padding-right: 35px; }
  .alert-dismissable .close,
  .alert-dismissible .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit; }

.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d; }
  .alert-success hr {
    border-top-color: #c9e2b3; }
  .alert-success .alert-link {
    color: #2b542c; }

.alert-info {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #31708f; }
  .alert-info hr {
    border-top-color: #a6e1ec; }
  .alert-info .alert-link {
    color: #245269; }

.alert-warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b; }
  .alert-warning hr {
    border-top-color: #f7e1b5; }
  .alert-warning .alert-link {
    color: #66512c; }

.alert-danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442; }
  .alert-danger hr {
    border-top-color: #e4b9c0; }
  .alert-danger .alert-link {
    color: #843534; }

@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0; }
  to {
    background-position: 0 0; } }
@keyframes progress-bar-stripes {
  from {
    background-position: 40px 0; }
  to {
    background-position: 0 0; } }
.progress {
  overflow: hidden;
  height: 20px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); }

.progress-bar {
  float: left;
  width: 0%;
  height: 100%;
  font-size: 12px;
  line-height: 20px;
  color: #fff;
  text-align: center;
  background-color: #337ab7;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  -webkit-transition: width 0.6s ease;
  -o-transition: width 0.6s ease;
  transition: width 0.6s ease; }

.progress-striped .progress-bar,
.progress-bar-striped {
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-size: 40px 40px; }

.progress.active .progress-bar,
.progress-bar.active {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
  -o-animation: progress-bar-stripes 2s linear infinite;
  animation: progress-bar-stripes 2s linear infinite; }

.progress-bar-success {
  background-color: #5cb85c; }
  .progress-striped .progress-bar-success {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); }

.progress-bar-info {
  background-color: #5bc0de; }
  .progress-striped .progress-bar-info {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); }

.progress-bar-warning {
  background-color: #f0ad4e; }
  .progress-striped .progress-bar-warning {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); }

.progress-bar-danger {
  background-color: #d9534f; }
  .progress-striped .progress-bar-danger {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); }

.media {
  margin-top: 15px; }
  .media:first-child {
    margin-top: 0; }

.media,
.media-body {
  zoom: 1;
  overflow: hidden; }

.media-body {
  width: 10000px; }

.media-object {
  display: block; }
  .media-object.img-thumbnail {
    max-width: none; }

.media-right,
.media > .pull-right {
  padding-left: 10px; }

.media-left,
.media > .pull-left {
  padding-right: 10px; }

.media-left,
.media-right,
.media-body {
  display: table-cell;
  vertical-align: top; }

.media-middle {
  vertical-align: middle; }

.media-bottom {
  vertical-align: bottom; }

.media-heading {
  margin-top: 0;
  margin-bottom: 5px; }

.media-list {
  padding-left: 0;
  list-style: none; }

.list-group {
  margin-bottom: 20px;
  padding-left: 0; }

.list-group-item {
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: #fff;
  border: 1px solid #ddd; }
  .list-group-item:first-child {
    border-top-right-radius: 4px;
    border-top-left-radius: 4px; }
  .list-group-item:last-child {
    margin-bottom: 0;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px; }

a.list-group-item,
button.list-group-item {
  color: #555; }
  a.list-group-item .list-group-item-heading,
  button.list-group-item .list-group-item-heading {
    color: #333; }
  a.list-group-item:hover, a.list-group-item:focus,
  button.list-group-item:hover,
  button.list-group-item:focus {
    text-decoration: none;
    color: #555;
    background-color: #f5f5f5; }

button.list-group-item {
  width: 100%;
  text-align: left; }

.list-group-item.disabled, .list-group-item.disabled:hover, .list-group-item.disabled:focus {
  background-color: #eeeeee;
  color: #777777;
  cursor: not-allowed; }
  .list-group-item.disabled .list-group-item-heading, .list-group-item.disabled:hover .list-group-item-heading, .list-group-item.disabled:focus .list-group-item-heading {
    color: inherit; }
  .list-group-item.disabled .list-group-item-text, .list-group-item.disabled:hover .list-group-item-text, .list-group-item.disabled:focus .list-group-item-text {
    color: #777777; }
.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
  z-index: 2;
  color: #fff;
  background-color: #337ab7;
  border-color: #337ab7; }
  .list-group-item.active .list-group-item-heading,
  .list-group-item.active .list-group-item-heading > small,
  .list-group-item.active .list-group-item-heading > .small, .list-group-item.active:hover .list-group-item-heading,
  .list-group-item.active:hover .list-group-item-heading > small,
  .list-group-item.active:hover .list-group-item-heading > .small, .list-group-item.active:focus .list-group-item-heading,
  .list-group-item.active:focus .list-group-item-heading > small,
  .list-group-item.active:focus .list-group-item-heading > .small {
    color: inherit; }
  .list-group-item.active .list-group-item-text, .list-group-item.active:hover .list-group-item-text, .list-group-item.active:focus .list-group-item-text {
    color: #c7ddef; }

.list-group-item-success {
  color: #3c763d;
  background-color: #dff0d8; }

a.list-group-item-success,
button.list-group-item-success {
  color: #3c763d; }
  a.list-group-item-success .list-group-item-heading,
  button.list-group-item-success .list-group-item-heading {
    color: inherit; }
  a.list-group-item-success:hover, a.list-group-item-success:focus,
  button.list-group-item-success:hover,
  button.list-group-item-success:focus {
    color: #3c763d;
    background-color: #d0e9c6; }
  a.list-group-item-success.active, a.list-group-item-success.active:hover, a.list-group-item-success.active:focus,
  button.list-group-item-success.active,
  button.list-group-item-success.active:hover,
  button.list-group-item-success.active:focus {
    color: #fff;
    background-color: #3c763d;
    border-color: #3c763d; }

.list-group-item-info {
  color: #31708f;
  background-color: #d9edf7; }

a.list-group-item-info,
button.list-group-item-info {
  color: #31708f; }
  a.list-group-item-info .list-group-item-heading,
  button.list-group-item-info .list-group-item-heading {
    color: inherit; }
  a.list-group-item-info:hover, a.list-group-item-info:focus,
  button.list-group-item-info:hover,
  button.list-group-item-info:focus {
    color: #31708f;
    background-color: #c4e3f3; }
  a.list-group-item-info.active, a.list-group-item-info.active:hover, a.list-group-item-info.active:focus,
  button.list-group-item-info.active,
  button.list-group-item-info.active:hover,
  button.list-group-item-info.active:focus {
    color: #fff;
    background-color: #31708f;
    border-color: #31708f; }

.list-group-item-warning {
  color: #8a6d3b;
  background-color: #fcf8e3; }

a.list-group-item-warning,
button.list-group-item-warning {
  color: #8a6d3b; }
  a.list-group-item-warning .list-group-item-heading,
  button.list-group-item-warning .list-group-item-heading {
    color: inherit; }
  a.list-group-item-warning:hover, a.list-group-item-warning:focus,
  button.list-group-item-warning:hover,
  button.list-group-item-warning:focus {
    color: #8a6d3b;
    background-color: #faf2cc; }
  a.list-group-item-warning.active, a.list-group-item-warning.active:hover, a.list-group-item-warning.active:focus,
  button.list-group-item-warning.active,
  button.list-group-item-warning.active:hover,
  button.list-group-item-warning.active:focus {
    color: #fff;
    background-color: #8a6d3b;
    border-color: #8a6d3b; }

.list-group-item-danger {
  color: #a94442;
  background-color: #f2dede; }

a.list-group-item-danger,
button.list-group-item-danger {
  color: #a94442; }
  a.list-group-item-danger .list-group-item-heading,
  button.list-group-item-danger .list-group-item-heading {
    color: inherit; }
  a.list-group-item-danger:hover, a.list-group-item-danger:focus,
  button.list-group-item-danger:hover,
  button.list-group-item-danger:focus {
    color: #a94442;
    background-color: #ebcccc; }
  a.list-group-item-danger.active, a.list-group-item-danger.active:hover, a.list-group-item-danger.active:focus,
  button.list-group-item-danger.active,
  button.list-group-item-danger.active:hover,
  button.list-group-item-danger.active:focus {
    color: #fff;
    background-color: #a94442;
    border-color: #a94442; }

.list-group-item-heading {
  margin-top: 0;
  margin-bottom: 5px; }

.list-group-item-text {
  margin-bottom: 0;
  line-height: 1.3; }

.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05); }

.panel-body {
  padding: 15px; }
  .panel-body:before, .panel-body:after {
    content: " ";
    display: table; }
  .panel-body:after {
    clear: both; }

.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px; }
  .panel-heading > .dropdown .dropdown-toggle {
    color: inherit; }

.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  color: inherit; }
  .panel-title > a,
  .panel-title > small,
  .panel-title > .small,
  .panel-title > small > a,
  .panel-title > .small > a {
    color: inherit; }

.panel-footer {
  padding: 10px 15px;
  background-color: #f5f5f5;
  border-top: 1px solid #ddd;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px; }

.panel > .list-group,
.panel > .panel-collapse > .list-group {
  margin-bottom: 0; }
  .panel > .list-group .list-group-item,
  .panel > .panel-collapse > .list-group .list-group-item {
    border-width: 1px 0;
    border-radius: 0; }
  .panel > .list-group:first-child .list-group-item:first-child,
  .panel > .panel-collapse > .list-group:first-child .list-group-item:first-child {
    border-top: 0;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px; }
  .panel > .list-group:last-child .list-group-item:last-child,
  .panel > .panel-collapse > .list-group:last-child .list-group-item:last-child {
    border-bottom: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px; }
.panel > .panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
  border-top-right-radius: 0;
  border-top-left-radius: 0; }

.panel-heading + .list-group .list-group-item:first-child {
  border-top-width: 0; }

.list-group + .panel-footer {
  border-top-width: 0; }

.panel > .table,
.panel > .table-responsive > .table,
.panel > .panel-collapse > .table {
  margin-bottom: 0; }
  .panel > .table caption,
  .panel > .table-responsive > .table caption,
  .panel > .panel-collapse > .table caption {
    padding-left: 15px;
    padding-right: 15px; }
.panel > .table:first-child,
.panel > .table-responsive:first-child > .table:first-child {
  border-top-right-radius: 3px;
  border-top-left-radius: 3px; }
  .panel > .table:first-child > thead:first-child > tr:first-child,
  .panel > .table:first-child > tbody:first-child > tr:first-child,
  .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child,
  .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child {
    border-top-left-radius: 3px;
    border-top-right-radius: 3px; }
    .panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
    .panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
    .panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
    .panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
    .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
    .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
    .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
    .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
      border-top-left-radius: 3px; }
    .panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
    .panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
    .panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
    .panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
    .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
    .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
    .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
    .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
      border-top-right-radius: 3px; }
.panel > .table:last-child,
.panel > .table-responsive:last-child > .table:last-child {
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px; }
  .panel > .table:last-child > tbody:last-child > tr:last-child,
  .panel > .table:last-child > tfoot:last-child > tr:last-child,
  .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child,
  .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px; }
    .panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
    .panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
    .panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
    .panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
    .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
    .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
    .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
    .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
      border-bottom-left-radius: 3px; }
    .panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
    .panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
    .panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
    .panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
    .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
    .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
    .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
    .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
      border-bottom-right-radius: 3px; }
.panel > .panel-body + .table,
.panel > .panel-body + .table-responsive,
.panel > .table + .panel-body,
.panel > .table-responsive + .panel-body {
  border-top: 1px solid #ddd; }
.panel > .table > tbody:first-child > tr:first-child th,
.panel > .table > tbody:first-child > tr:first-child td {
  border-top: 0; }
.panel > .table-bordered,
.panel > .table-responsive > .table-bordered {
  border: 0; }
  .panel > .table-bordered > thead > tr > th:first-child,
  .panel > .table-bordered > thead > tr > td:first-child,
  .panel > .table-bordered > tbody > tr > th:first-child,
  .panel > .table-bordered > tbody > tr > td:first-child,
  .panel > .table-bordered > tfoot > tr > th:first-child,
  .panel > .table-bordered > tfoot > tr > td:first-child,
  .panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
  .panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
  .panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
  .panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
  .panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
  .panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
    border-left: 0; }
  .panel > .table-bordered > thead > tr > th:last-child,
  .panel > .table-bordered > thead > tr > td:last-child,
  .panel > .table-bordered > tbody > tr > th:last-child,
  .panel > .table-bordered > tbody > tr > td:last-child,
  .panel > .table-bordered > tfoot > tr > th:last-child,
  .panel > .table-bordered > tfoot > tr > td:last-child,
  .panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
  .panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
  .panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
  .panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
  .panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
  .panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
    border-right: 0; }
  .panel > .table-bordered > thead > tr:first-child > td,
  .panel > .table-bordered > thead > tr:first-child > th,
  .panel > .table-bordered > tbody > tr:first-child > td,
  .panel > .table-bordered > tbody > tr:first-child > th,
  .panel > .table-responsive > .table-bordered > thead > tr:first-child > td,
  .panel > .table-responsive > .table-bordered > thead > tr:first-child > th,
  .panel > .table-responsive > .table-bordered > tbody > tr:first-child > td,
  .panel > .table-responsive > .table-bordered > tbody > tr:first-child > th {
    border-bottom: 0; }
  .panel > .table-bordered > tbody > tr:last-child > td,
  .panel > .table-bordered > tbody > tr:last-child > th,
  .panel > .table-bordered > tfoot > tr:last-child > td,
  .panel > .table-bordered > tfoot > tr:last-child > th,
  .panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
  .panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
  .panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td,
  .panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th {
    border-bottom: 0; }
.panel > .table-responsive {
  border: 0;
  margin-bottom: 0; }

.panel-group {
  margin-bottom: 20px; }
  .panel-group .panel {
    margin-bottom: 0;
    border-radius: 4px; }
    .panel-group .panel + .panel {
      margin-top: 5px; }
  .panel-group .panel-heading {
    border-bottom: 0; }
    .panel-group .panel-heading + .panel-collapse > .panel-body,
    .panel-group .panel-heading + .panel-collapse > .list-group {
      border-top: 1px solid #ddd; }
  .panel-group .panel-footer {
    border-top: 0; }
    .panel-group .panel-footer + .panel-collapse .panel-body {
      border-bottom: 1px solid #ddd; }

.panel-default {
  border-color: #ddd; }
  .panel-default > .panel-heading {
    color: #333333;
    background-color: #f5f5f5;
    border-color: #ddd; }
    .panel-default > .panel-heading + .panel-collapse > .panel-body {
      border-top-color: #ddd; }
    .panel-default > .panel-heading .badge {
      color: #f5f5f5;
      background-color: #333333; }
  .panel-default > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #ddd; }

.panel-primary {
  border-color: #337ab7; }
  .panel-primary > .panel-heading {
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7; }
    .panel-primary > .panel-heading + .panel-collapse > .panel-body {
      border-top-color: #337ab7; }
    .panel-primary > .panel-heading .badge {
      color: #337ab7;
      background-color: #fff; }
  .panel-primary > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #337ab7; }

.panel-success {
  border-color: #d6e9c6; }
  .panel-success > .panel-heading {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6; }
    .panel-success > .panel-heading + .panel-collapse > .panel-body {
      border-top-color: #d6e9c6; }
    .panel-success > .panel-heading .badge {
      color: #dff0d8;
      background-color: #3c763d; }
  .panel-success > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #d6e9c6; }

.panel-info {
  border-color: #bce8f1; }
  .panel-info > .panel-heading {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1; }
    .panel-info > .panel-heading + .panel-collapse > .panel-body {
      border-top-color: #bce8f1; }
    .panel-info > .panel-heading .badge {
      color: #d9edf7;
      background-color: #31708f; }
  .panel-info > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #bce8f1; }

.panel-warning {
  border-color: #faebcc; }
  .panel-warning > .panel-heading {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc; }
    .panel-warning > .panel-heading + .panel-collapse > .panel-body {
      border-top-color: #faebcc; }
    .panel-warning > .panel-heading .badge {
      color: #fcf8e3;
      background-color: #8a6d3b; }
  .panel-warning > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #faebcc; }

.panel-danger {
  border-color: #ebccd1; }
  .panel-danger > .panel-heading {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1; }
    .panel-danger > .panel-heading + .panel-collapse > .panel-body {
      border-top-color: #ebccd1; }
    .panel-danger > .panel-heading .badge {
      color: #f2dede;
      background-color: #a94442; }
  .panel-danger > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: #ebccd1; }

.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden; }
  .embed-responsive .embed-responsive-item,
  .embed-responsive iframe,
  .embed-responsive embed,
  .embed-responsive object,
  .embed-responsive video {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    border: 0; }

.embed-responsive-16by9 {
  padding-bottom: 56.25%; }

.embed-responsive-4by3 {
  padding-bottom: 75%; }

.well {
  min-height: 20px;
  padding: 19px;
  margin-bottom: 20px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); }
  .well blockquote {
    border-color: #ddd;
    border-color: rgba(0, 0, 0, 0.15); }

.well-lg {
  padding: 24px;
  border-radius: 6px; }

.well-sm {
  padding: 9px;
  border-radius: 3px; }

.close {
  float: right;
  font-size: 21px;
  font-weight: bold;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: 0.2;
  filter: alpha(opacity=20); }
  .close:hover, .close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: 0.5;
    filter: alpha(opacity=50); }

button.close {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none; }

.modal-open {
  overflow: hidden; }

.modal {
  display: none;
  overflow: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  -webkit-overflow-scrolling: touch;
  outline: 0; }
  .modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    -o-transform: translate(0, -25%);
    transform: translate(0, -25%);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out; }
  .modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0); }

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto; }

.modal-dialog {
  position: relative;
  width: auto;
  margin: 10px; }

.modal-content {
  position: relative;
  background-color: #fff;
  border: 1px solid #999;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  background-clip: padding-box;
  outline: 0; }

.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000; }
  .modal-backdrop.fade {
    opacity: 0;
    filter: alpha(opacity=0); }
  .modal-backdrop.in {
    opacity: 0.5;
    filter: alpha(opacity=50); }

.modal-header {
  padding: 15px;
  border-bottom: 1px solid #e5e5e5; }
  .modal-header:before, .modal-header:after {
    content: " ";
    display: table; }
  .modal-header:after {
    clear: both; }

.modal-header .close {
  margin-top: -2px; }

.modal-title {
  margin: 0;
  line-height: 1.428571429; }

.modal-body {
  position: relative;
  padding: 15px; }

.modal-footer {
  padding: 15px;
  text-align: right;
  border-top: 1px solid #e5e5e5; }
  .modal-footer:before, .modal-footer:after {
    content: " ";
    display: table; }
  .modal-footer:after {
    clear: both; }
  .modal-footer .btn + .btn {
    margin-left: 5px;
    margin-bottom: 0; }
  .modal-footer .btn-group .btn + .btn {
    margin-left: -1px; }
  .modal-footer .btn-block + .btn-block {
    margin-left: 0; }

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

@media (min-width: 768px) {
  .modal-dialog {
    width: 600px;
    margin: 30px auto; }

  .modal-content {
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); }

  .modal-sm {
    width: 300px; } }
@media (min-width: 992px) {
  .modal-lg {
    width: 900px; } }
.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: normal;
  line-break: auto;
  line-height: 1.428571429;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  font-size: 12px;
  opacity: 0;
  filter: alpha(opacity=0); }
  .tooltip.in {
    opacity: 0.9;
    filter: alpha(opacity=90); }
  .tooltip.top {
    margin-top: -3px;
    padding: 5px 0; }
  .tooltip.right {
    margin-left: 3px;
    padding: 0 5px; }
  .tooltip.bottom {
    margin-top: 3px;
    padding: 5px 0; }
  .tooltip.left {
    margin-left: -3px;
    padding: 0 5px; }

.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #fff;
  text-align: center;
  background-color: #000;
  border-radius: 4px; }

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid; }

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000; }
.tooltip.top-left .tooltip-arrow {
  bottom: 0;
  right: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000; }
.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  left: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000; }
.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000; }
.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000; }
.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000; }
.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  right: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000; }
.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  left: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000; }

.popover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1060;
  display: none;
  max-width: 276px;
  padding: 1px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: normal;
  letter-spacing: normal;
  line-break: auto;
  line-height: 1.428571429;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  white-space: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  font-size: 14px;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); }
  .popover.top {
    margin-top: -10px; }
  .popover.right {
    margin-left: 10px; }
  .popover.bottom {
    margin-top: 10px; }
  .popover.left {
    margin-left: -10px; }

.popover-title {
  margin: 0;
  padding: 8px 14px;
  font-size: 14px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  border-radius: 5px 5px 0 0; }

.popover-content {
  padding: 9px 14px; }

.popover > .arrow, .popover > .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid; }

.popover > .arrow {
  border-width: 11px; }

.popover > .arrow:after {
  border-width: 10px;
  content: ""; }

.popover.top > .arrow {
  left: 50%;
  margin-left: -11px;
  border-bottom-width: 0;
  border-top-color: #999999;
  border-top-color: rgba(0, 0, 0, 0.25);
  bottom: -11px; }
  .popover.top > .arrow:after {
    content: " ";
    bottom: 1px;
    margin-left: -10px;
    border-bottom-width: 0;
    border-top-color: #fff; }
.popover.right > .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-left-width: 0;
  border-right-color: #999999;
  border-right-color: rgba(0, 0, 0, 0.25); }
  .popover.right > .arrow:after {
    content: " ";
    left: 1px;
    bottom: -10px;
    border-left-width: 0;
    border-right-color: #fff; }
.popover.bottom > .arrow {
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999999;
  border-bottom-color: rgba(0, 0, 0, 0.25);
  top: -11px; }
  .popover.bottom > .arrow:after {
    content: " ";
    top: 1px;
    margin-left: -10px;
    border-top-width: 0;
    border-bottom-color: #fff; }
.popover.left > .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999999;
  border-left-color: rgba(0, 0, 0, 0.25); }
  .popover.left > .arrow:after {
    content: " ";
    right: 1px;
    border-right-width: 0;
    border-left-color: #fff;
    bottom: -10px; }

.carousel {
  position: relative; }

.carousel-inner {
  position: relative;
  overflow: hidden;
  width: 100%; }
  .carousel-inner > .item {
    display: none;
    position: relative;
    -webkit-transition: 0.6s ease-in-out left;
    -o-transition: 0.6s ease-in-out left;
    transition: 0.6s ease-in-out left; }
    .carousel-inner > .item > img,
    .carousel-inner > .item > a > img {
      display: block;
      max-width: 100%;
      height: auto;
      line-height: 1; }
    @media all and (transform-3d), (-webkit-transform-3d) {
      .carousel-inner > .item {
        -webkit-transition: -webkit-transform 0.6s ease-in-out;
        -moz-transition: -moz-transform 0.6s ease-in-out;
        -o-transition: -o-transform 0.6s ease-in-out;
        transition: transform 0.6s ease-in-out;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-perspective: 1000px;
        -moz-perspective: 1000px;
        perspective: 1000px; }
        .carousel-inner > .item.next, .carousel-inner > .item.active.right {
          -webkit-transform: translate3d(100%, 0, 0);
          transform: translate3d(100%, 0, 0);
          left: 0; }
        .carousel-inner > .item.prev, .carousel-inner > .item.active.left {
          -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);
          left: 0; }
        .carousel-inner > .item.next.left, .carousel-inner > .item.prev.right, .carousel-inner > .item.active {
          -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
          left: 0; } }
  .carousel-inner > .active,
  .carousel-inner > .next,
  .carousel-inner > .prev {
    display: block; }
  .carousel-inner > .active {
    left: 0; }
  .carousel-inner > .next,
  .carousel-inner > .prev {
    position: absolute;
    top: 0;
    width: 100%; }
  .carousel-inner > .next {
    left: 100%; }
  .carousel-inner > .prev {
    left: -100%; }
  .carousel-inner > .next.left,
  .carousel-inner > .prev.right {
    left: 0; }
  .carousel-inner > .active.left {
    left: -100%; }
  .carousel-inner > .active.right {
    left: 100%; }

.carousel-control {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 15%;
  opacity: 0.5;
  filter: alpha(opacity=50);
  font-size: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  background-color: rgba(0, 0, 0, 0); }
  .carousel-control.left {
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1); }
  .carousel-control.right {
    left: auto;
    right: 0;
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1); }
  .carousel-control:hover, .carousel-control:focus {
    outline: 0;
    color: #fff;
    text-decoration: none;
    opacity: 0.9;
    filter: alpha(opacity=90); }
  .carousel-control .icon-prev,
  .carousel-control .icon-next,
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .glyphicon-chevron-right {
    position: absolute;
    top: 50%;
    margin-top: -10px;
    z-index: 5;
    display: inline-block; }
  .carousel-control .icon-prev,
  .carousel-control .glyphicon-chevron-left {
    left: 50%;
    margin-left: -10px; }
  .carousel-control .icon-next,
  .carousel-control .glyphicon-chevron-right {
    right: 50%;
    margin-right: -10px; }
  .carousel-control .icon-prev,
  .carousel-control .icon-next {
    width: 20px;
    height: 20px;
    line-height: 1;
    font-family: serif; }
  .carousel-control .icon-prev:before {
    content: '\2039'; }
  .carousel-control .icon-next:before {
    content: '\203a'; }

.carousel-indicators {
  position: absolute;
  bottom: 10px;
  left: 50%;
  z-index: 15;
  width: 60%;
  margin-left: -30%;
  padding-left: 0;
  list-style: none;
  text-align: center; }
  .carousel-indicators li {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    border: 1px solid #fff;
    border-radius: 10px;
    cursor: pointer;
    background-color: #000 \9;
    background-color: rgba(0, 0, 0, 0); }
  .carousel-indicators .active {
    margin: 0;
    width: 12px;
    height: 12px;
    background-color: #fff; }

.carousel-caption {
  position: absolute;
  left: 15%;
  right: 15%;
  bottom: 20px;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); }
  .carousel-caption .btn {
    text-shadow: none; }

@media screen and (min-width: 768px) {
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-prev,
  .carousel-control .icon-next {
    width: 30px;
    height: 30px;
    margin-top: -10px;
    font-size: 30px; }
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .icon-prev {
    margin-left: -10px; }
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-next {
    margin-right: -10px; }

  .carousel-caption {
    left: 20%;
    right: 20%;
    padding-bottom: 30px; }

  .carousel-indicators {
    bottom: 20px; } }
.clearfix:before, .clearfix:after {
  content: " ";
  display: table; }
.clearfix:after {
  clear: both; }

.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto; }

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

.pull-left {
  float: left !important; }

.hide {
  display: none !important; }

.show {
  display: block !important; }

.invisible {
  visibility: hidden; }

.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0; }

.hidden {
  display: none !important; }

.affix {
  position: fixed; }

@-ms-viewport {
  width: device-width; }
.visible-xs {
  display: none !important; }

.visible-sm {
  display: none !important; }

.visible-md {
  display: none !important; }

.visible-lg {
  display: none !important; }

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

@media (max-width: 767px) {
  .visible-xs {
    display: block !important; }

  table.visible-xs {
    display: table !important; }

  tr.visible-xs {
    display: table-row !important; }

  th.visible-xs,
  td.visible-xs {
    display: table-cell !important; } }
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important; } }

@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important; } }

@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important; } }

@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important; }

  table.visible-sm {
    display: table !important; }

  tr.visible-sm {
    display: table-row !important; }

  th.visible-sm,
  td.visible-sm {
    display: table-cell !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-block {
    display: block !important; } }

@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline {
    display: inline !important; } }

@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline-block {
    display: inline-block !important; } }

@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important; }

  table.visible-md {
    display: table !important; }

  tr.visible-md {
    display: table-row !important; }

  th.visible-md,
  td.visible-md {
    display: table-cell !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important; } }

@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important; } }

@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important; } }

@media (min-width: 1200px) {
  .visible-lg {
    display: block !important; }

  table.visible-lg {
    display: table !important; }

  tr.visible-lg {
    display: table-row !important; }

  th.visible-lg,
  td.visible-lg {
    display: table-cell !important; } }
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important; } }

@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important; } }

@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important; } }

@media (max-width: 767px) {
  .hidden-xs {
    display: none !important; } }
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important; } }
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important; } }
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important; } }
.visible-print {
  display: none !important; }

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

  table.visible-print {
    display: table !important; }

  tr.visible-print {
    display: table-row !important; }

  th.visible-print,
  td.visible-print {
    display: table-cell !important; } }
.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; } }

@media print {
  .hidden-print {
    display: none !important; } }
/*p {
  @include font-size(14px)
}*/
/*body {
  @include background-image('pattern');
}*/
/*
@include keyframes(slide-down) {
  0% { opacity: 1; }
  90% { opacity: 0; }
}

.element {
  width: 100px;
  height: 100px;
  background: black;
  @include animation('slide-down 5s 3');
}*/
/*
.faded-text {
  @include opacity(0.8);
}
*/
.c-primary {
  color: #6ecbe6; }

.c-normal {
  color: #2d3940; }

.c-green {
  color: #00bf9d; }

.c-light-green {
  color: #0ee085; }

.c-blue {
  color: #729bf3; }

.c-violet {
  color: #4687e3; }

.c-light-blue {
  color: #9fd9e7; }

.c-orange {
  color: #ff9a24; }

.c-yellow {
  color: #fffd3c; }

.c-brown {
  color: #e9c785; }

.c-brown-border {
  color: #d1b377; }

.c-pink {
  color: #ff7e7e; }

.c-light-pink {
  color: #ff7e7e; }

.c-blue-light {
  color: #60c1d4; }

.c-green-dark {
  color: #3e8093; }

.c-red {
  color: #ff7e7e; }

.c-navy {
  color: #40547e; }

.c-red-dark {
  color: #db5940; }

.c-blue-dark {
  color: #295990; }

.c-white {
  color: #fff; }

.c-purple {
  color: #8e24aa; }

@font-face {
  font-family: 'el-icons';
  src: url("../fonts/el-icons/icomoon.eot?58z5wa");
  src: url("../fonts/el-icons/icomoon.eot?58z5wa#iefix") format("embedded-opentype"), url("../fonts/el-icons/icomoon.ttf?58z5wa") format("truetype"), url("../fonts/el-icons/icomoon.woff?58z5wa") format("woff"), url("../fonts/el-icons/icomoon.svg?58z5wa#icomoon") format("svg");
  font-weight: normal;
  font-style: normal; }
.el-icons {
  font-family: "el-icons" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.el-check2:before {
  content: "\f03a"; }

.el-chevron-down2:before {
  content: "\f0a3"; }

.el-chevron-left2:before {
  content: "\f0a4"; }

.el-chevron-right2:before {
  content: "\f078"; }

.el-chevron-up2:before {
  content: "\f0a2"; }

.el-hubot:before {
  content: "\f09d"; }

.el-list-unordered:before {
  content: "\f061"; }

.el-triangle-down:before {
  content: "\f05b"; }

.el-triangle-left:before {
  content: "\f044"; }

.el-triangle-right:before {
  content: "\f05a"; }

.el-triangle-up:before {
  content: "\f0aa"; }

.el-x:before {
  content: "\f081"; }

.el-headphones:before {
  content: "\e900"; }

.el-bell:before {
  content: "\e901"; }

.el-list-numbered:before {
  content: "\e902"; }

.el-list:before {
  content: "\e903"; }

.el-list2:before {
  content: "\e904"; }

.el-heart:before {
  content: "\e90c"; }

.el-heart-broken:before {
  content: "\e90d"; }

.el-heart2:before {
  content: "\f004"; }

.el-check:before {
  content: "\f00c"; }

.el-close:before {
  content: "\f00d"; }

.el-remove:before {
  content: "\f00d"; }

.el-times:before {
  content: "\f00d"; }

.el-trash-o:before {
  content: "\f014"; }

.el-chevron-left:before {
  content: "\f053"; }

.el-chevron-right:before {
  content: "\f054"; }

.el-plus:before {
  content: "\f067"; }

.el-minus:before {
  content: "\f068"; }

.el-chevron-up:before {
  content: "\f077"; }

.el-chevron-down:before {
  content: "\f079"; }

.el-twitter:before {
  content: "\f099"; }

.el-facebook:before {
  content: "\f09a"; }

.el-facebook-f:before {
  content: "\f09a"; }

.el-list-ul:before {
  content: "\f0ca"; }

.el-list-ol:before {
  content: "\f0cb"; }

.el-user-md:before {
  content: "\f0f0"; }

.el-angle-double-left:before {
  content: "\f100"; }

.el-angle-double-right:before {
  content: "\f101"; }

.el-angle-double-up:before {
  content: "\f102"; }

.el-angle-double-down:before {
  content: "\f103"; }

.el-angle-left:before {
  content: "\f104"; }

.el-angle-right:before {
  content: "\f105"; }

.el-angle-up:before {
  content: "\f106"; }

.el-angle-down:before {
  content: "\f107"; }

.el-circle-o:before {
  content: "\f10c"; }

.el-circle:before {
  content: "\f111"; }

.el-play-circle:before {
  content: "\f144"; }

.el-history:before {
  content: "\f1da"; }

.el-reload:before {
  content: "\e905"; }

.el-refresh:before {
  content: "\e906"; }

.el-book:before {
  content: "\e907"; }

.el-user:before {
  content: "\e908"; }

.el-user2:before {
  content: "\e909"; }

.el-user-female:before {
  content: "\e000"; }

.el-user-follow:before {
  content: "\e002"; }

.el-user-following:before {
  content: "\e003"; }

.el-user-unfollow:before {
  content: "\e004"; }

.el-user3:before {
  content: "\e005"; }

.el-earphones-alt:before {
  content: "\e03c"; }

.el-earphones:before {
  content: "\e03d"; }

.el-book-open:before {
  content: "\e04c"; }

.el-basket-loaded:before {
  content: "\e04d"; }

.el-basket:before {
  content: "\e04e"; }

.el-action-undo:before {
  content: "\e050"; }

.el-action-redo:before {
  content: "\e051"; }

.el-share-alt:before {
  content: "\e05a"; }

.el-logout:before {
  content: "\e065"; }

.el-login:before {
  content: "\e066"; }

.el-list3:before {
  content: "\e067"; }

.el-heart3:before {
  content: "\e08a"; }

.el-reload2:before {
  content: "\e099"; }

.el-settings:before {
  content: "\e09a"; }

.el-users:before {
  content: "\e001"; }

.el-heart4:before {
  content: "\e90e"; }

.el-user4:before {
  content: "\e90a"; }

.el-news:before {
  content: "\e90b"; }

.el-square:before {
  content: "\f0c8"; }

.el-action-undo:before {
  content: "\e050"; }

.fz30 {
  font-size: 30px !important; }

.fz29 {
  font-size: 29px !important; }

.fz28 {
  font-size: 28px !important; }

.fz27 {
  font-size: 27px !important; }

.fz26 {
  font-size: 26px !important; }

.fz25 {
  font-size: 25px !important; }

.fz24 {
  font-size: 24px !important; }

.fz23 {
  font-size: 23px !important; }

.fz22 {
  font-size: 22px !important; }

.fz21 {
  font-size: 21px !important; }

.fz20 {
  font-size: 20px !important; }

.fz19 {
  font-size: 19px !important; }

.fz18 {
  font-size: 18px !important; }

.fz17 {
  font-size: 17px !important; }

.fz16 {
  font-size: 16px !important; }

.fz15 {
  font-size: 15px !important; }

.fz14 {
  font-size: 14px !important; }

.fz13 {
  font-size: 13px !important; }

.fz12 {
  font-size: 12px !important; }

.fz11 {
  font-size: 11px !important; }

.fz10 {
  font-size: 10px !important; }

.fz9 {
  font-size: 9px !important; }

.m50 {
  margin: 50px !important; }

.mt50 {
  margin-top: 50px !important; }

.mr50 {
  margin-right: 50px !important; }

.mb50 {
  margin-bottom: 50px !important; }

.ml50 {
  margin-left: 50px !important; }

.p50 {
  padding: 50px !important; }

.pt50 {
  padding-top: 50px !important; }

.pr50 {
  padding-right: 50px !important; }

.pb50 {
  padding-bottom: 50px !important; }

.pl50 {
  padding-left: 50px !important; }

.m45 {
  margin: 45px !important; }

.mt45 {
  margin-top: 45px !important; }

.mr45 {
  margin-right: 45px !important; }

.mb45 {
  margin-bottom: 45px !important; }

.ml45 {
  margin-left: 45px !important; }

.p45 {
  padding: 45px !important; }

.pt45 {
  padding-top: 45px !important; }

.pr45 {
  padding-right: 45px !important; }

.pb45 {
  padding-bottom: 45px !important; }

.pl45 {
  padding-left: 45px !important; }

.m40 {
  margin: 40px !important; }

.mt40 {
  margin-top: 40px !important; }

.mr40 {
  margin-right: 40px !important; }

.mb40 {
  margin-bottom: 40px !important; }

.ml40 {
  margin-left: 40px !important; }

.p40 {
  padding: 40px !important; }

.pt40 {
  padding-top: 40px !important; }

.pr40 {
  padding-right: 40px !important; }

.pb40 {
  padding-bottom: 40px !important; }

.pl40 {
  padding-left: 40px !important; }

.m35 {
  margin: 35px !important; }

.mt35 {
  margin-top: 35px !important; }

.mr35 {
  margin-right: 35px !important; }

.mb35 {
  margin-bottom: 35px !important; }

.ml35 {
  margin-left: 35px !important; }

.p35 {
  padding: 35px !important; }

.pt35 {
  padding-top: 35px !important; }

.pr35 {
  padding-right: 35px !important; }

.pb35 {
  padding-bottom: 35px !important; }

.pl35 {
  padding-left: 35px !important; }

.m30 {
  margin: 30px !important; }

.mt30 {
  margin-top: 30px !important; }

.mr30 {
  margin-right: 30px !important; }

.mb30 {
  margin-bottom: 30px !important; }

.ml30 {
  margin-left: 30px !important; }

.p30 {
  padding: 30px !important; }

.pt30 {
  padding-top: 30px !important; }

.pr30 {
  padding-right: 30px !important; }

.pb30 {
  padding-bottom: 30px !important; }

.pl30 {
  padding-left: 30px !important; }

.m25 {
  margin: 25px !important; }

.mt25 {
  margin-top: 25px !important; }

.mr25 {
  margin-right: 25px !important; }

.mb25 {
  margin-bottom: 25px !important; }

.ml25 {
  margin-left: 25px !important; }

.p25 {
  padding: 25px !important; }

.pt25 {
  padding-top: 25px !important; }

.pr25 {
  padding-right: 25px !important; }

.pb25 {
  padding-bottom: 25px !important; }

.pl25 {
  padding-left: 25px !important; }

.m20 {
  margin: 20px !important; }

.mt20 {
  margin-top: 20px !important; }

.mr20 {
  margin-right: 20px !important; }

.mb20 {
  margin-bottom: 20px !important; }

.ml20 {
  margin-left: 20px !important; }

.p20 {
  padding: 20px !important; }

.pt20 {
  padding-top: 20px !important; }

.pr20 {
  padding-right: 20px !important; }

.pb20 {
  padding-bottom: 20px !important; }

.pl20 {
  padding-left: 20px !important; }

.m15 {
  margin: 15px !important; }

.mt15 {
  margin-top: 15px !important; }

.mr15 {
  margin-right: 15px !important; }

.mb15 {
  margin-bottom: 15px !important; }

.ml15 {
  margin-left: 15px !important; }

.p15 {
  padding: 15px !important; }

.pt15 {
  padding-top: 15px !important; }

.pr15 {
  padding-right: 15px !important; }

.pb15 {
  padding-bottom: 15px !important; }

.pl15 {
  padding-left: 15px !important; }

.m10 {
  margin: 10px !important; }

.mt10 {
  margin-top: 10px !important; }

.mr10 {
  margin-right: 10px !important; }

.mb10 {
  margin-bottom: 10px !important; }

.ml10 {
  margin-left: 10px !important; }

.p10 {
  padding: 10px !important; }

.pt10 {
  padding-top: 10px !important; }

.pr10 {
  padding-right: 10px !important; }

.pb10 {
  padding-bottom: 10px !important; }

.pl10 {
  padding-left: 10px !important; }

.m5 {
  margin: 5px !important; }

.mt5 {
  margin-top: 5px !important; }

.mr5 {
  margin-right: 5px !important; }

.mb5 {
  margin-bottom: 5px !important; }

.ml5 {
  margin-left: 5px !important; }

.p5 {
  padding: 5px !important; }

.pt5 {
  padding-top: 5px !important; }

.pr5 {
  padding-right: 5px !important; }

.pb5 {
  padding-bottom: 5px !important; }

.pl5 {
  padding-left: 5px !important; }

.m0 {
  margin: 0px !important; }

.mt0 {
  margin-top: 0px !important; }

.mr0 {
  margin-right: 0px !important; }

.mb0 {
  margin-bottom: 0px !important; }

.ml0 {
  margin-left: 0px !important; }

.p0 {
  padding: 0px !important; }

.pt0 {
  padding-top: 0px !important; }

.pr0 {
  padding-right: 0px !important; }

.pb0 {
  padding-bottom: 0px !important; }

.pl0 {
  padding-left: 0px !important; }

@media screen and (min-width: 768px) {
  .m50-sm {
    margin: 50px !important; }

  .mt50-sm {
    margin-top: 50px !important; }

  .mr50-sm {
    margin-right: 50px !important; }

  .mb50-sm {
    margin-bottom: 50px !important; }

  .ml50-sm {
    margin-left: 50px !important; }

  .p50-sm {
    padding: 50px !important; }

  .pt50-sm {
    padding-top: 50px !important; }

  .pr50-sm {
    padding-right: 50px !important; }

  .pb50-sm {
    padding-bottom: 50px !important; }

  .pl50-sm {
    padding-left: 50px !important; }

  .m45-sm {
    margin: 45px !important; }

  .mt45-sm {
    margin-top: 45px !important; }

  .mr45-sm {
    margin-right: 45px !important; }

  .mb45-sm {
    margin-bottom: 45px !important; }

  .ml45-sm {
    margin-left: 45px !important; }

  .p45-sm {
    padding: 45px !important; }

  .pt45-sm {
    padding-top: 45px !important; }

  .pr45-sm {
    padding-right: 45px !important; }

  .pb45-sm {
    padding-bottom: 45px !important; }

  .pl45-sm {
    padding-left: 45px !important; }

  .m40-sm {
    margin: 40px !important; }

  .mt40-sm {
    margin-top: 40px !important; }

  .mr40-sm {
    margin-right: 40px !important; }

  .mb40-sm {
    margin-bottom: 40px !important; }

  .ml40-sm {
    margin-left: 40px !important; }

  .p40-sm {
    padding: 40px !important; }

  .pt40-sm {
    padding-top: 40px !important; }

  .pr40-sm {
    padding-right: 40px !important; }

  .pb40-sm {
    padding-bottom: 40px !important; }

  .pl40-sm {
    padding-left: 40px !important; }

  .m35-sm {
    margin: 35px !important; }

  .mt35-sm {
    margin-top: 35px !important; }

  .mr35-sm {
    margin-right: 35px !important; }

  .mb35-sm {
    margin-bottom: 35px !important; }

  .ml35-sm {
    margin-left: 35px !important; }

  .p35-sm {
    padding: 35px !important; }

  .pt35-sm {
    padding-top: 35px !important; }

  .pr35-sm {
    padding-right: 35px !important; }

  .pb35-sm {
    padding-bottom: 35px !important; }

  .pl35-sm {
    padding-left: 35px !important; }

  .m30-sm {
    margin: 30px !important; }

  .mt30-sm {
    margin-top: 30px !important; }

  .mr30-sm {
    margin-right: 30px !important; }

  .mb30-sm {
    margin-bottom: 30px !important; }

  .ml30-sm {
    margin-left: 30px !important; }

  .p30-sm {
    padding: 30px !important; }

  .pt30-sm {
    padding-top: 30px !important; }

  .pr30-sm {
    padding-right: 30px !important; }

  .pb30-sm {
    padding-bottom: 30px !important; }

  .pl30-sm {
    padding-left: 30px !important; }

  .m25-sm {
    margin: 25px !important; }

  .mt25-sm {
    margin-top: 25px !important; }

  .mr25-sm {
    margin-right: 25px !important; }

  .mb25-sm {
    margin-bottom: 25px !important; }

  .ml25-sm {
    margin-left: 25px !important; }

  .p25-sm {
    padding: 25px !important; }

  .pt25-sm {
    padding-top: 25px !important; }

  .pr25-sm {
    padding-right: 25px !important; }

  .pb25-sm {
    padding-bottom: 25px !important; }

  .pl25-sm {
    padding-left: 25px !important; }

  .m20-sm {
    margin: 20px !important; }

  .mt20-sm {
    margin-top: 20px !important; }

  .mr20-sm {
    margin-right: 20px !important; }

  .mb20-sm {
    margin-bottom: 20px !important; }

  .ml20-sm {
    margin-left: 20px !important; }

  .p20-sm {
    padding: 20px !important; }

  .pt20-sm {
    padding-top: 20px !important; }

  .pr20-sm {
    padding-right: 20px !important; }

  .pb20-sm {
    padding-bottom: 20px !important; }

  .pl20-sm {
    padding-left: 20px !important; }

  .m15-sm {
    margin: 15px !important; }

  .mt15-sm {
    margin-top: 15px !important; }

  .mr15-sm {
    margin-right: 15px !important; }

  .mb15-sm {
    margin-bottom: 15px !important; }

  .ml15-sm {
    margin-left: 15px !important; }

  .p15-sm {
    padding: 15px !important; }

  .pt15-sm {
    padding-top: 15px !important; }

  .pr15-sm {
    padding-right: 15px !important; }

  .pb15-sm {
    padding-bottom: 15px !important; }

  .pl15-sm {
    padding-left: 15px !important; }

  .m10-sm {
    margin: 10px !important; }

  .mt10-sm {
    margin-top: 10px !important; }

  .mr10-sm {
    margin-right: 10px !important; }

  .mb10-sm {
    margin-bottom: 10px !important; }

  .ml10-sm {
    margin-left: 10px !important; }

  .p10-sm {
    padding: 10px !important; }

  .pt10-sm {
    padding-top: 10px !important; }

  .pr10-sm {
    padding-right: 10px !important; }

  .pb10-sm {
    padding-bottom: 10px !important; }

  .pl10-sm {
    padding-left: 10px !important; }

  .m5-sm {
    margin: 5px !important; }

  .mt5-sm {
    margin-top: 5px !important; }

  .mr5-sm {
    margin-right: 5px !important; }

  .mb5-sm {
    margin-bottom: 5px !important; }

  .ml5-sm {
    margin-left: 5px !important; }

  .p5-sm {
    padding: 5px !important; }

  .pt5-sm {
    padding-top: 5px !important; }

  .pr5-sm {
    padding-right: 5px !important; }

  .pb5-sm {
    padding-bottom: 5px !important; }

  .pl5-sm {
    padding-left: 5px !important; }

  .m0-sm {
    margin: 0px !important; }

  .mt0-sm {
    margin-top: 0px !important; }

  .mr0-sm {
    margin-right: 0px !important; }

  .mb0-sm {
    margin-bottom: 0px !important; }

  .ml0-sm {
    margin-left: 0px !important; }

  .p0-sm {
    padding: 0px !important; }

  .pt0-sm {
    padding-top: 0px !important; }

  .pr0-sm {
    padding-right: 0px !important; }

  .pb0-sm {
    padding-bottom: 0px !important; }

  .pl0-sm {
    padding-left: 0px !important; } }
body {
  background-color: #EEE; }

body.inverse {
  background: #333; }

body.inverse, body.inverse .form-control {
  color: rgba(255, 255, 255, 0.84); }

body.inverse .card, body.inverse .card .form-control, body.inverse .modal, body.inverse .modal .form-control, body.inverse .panel-default, body.inverse .panel-default .form-control {
  background-color: initial;
  color: initial; }

.h1, .h2, .h3, .h4, body, h1, h2, h3, h4, h5, h6 {
  font-family: Roboto, Helvetica, Arial, sans-serif;
  font-weight: 300; }

h5, h6 {
  font-weight: 400; }

a, a:focus, a:hover {
  color: #009688; }

a .material-icons, a:focus .material-icons, a:hover .material-icons {
  vertical-align: middle; }

body .container .well.well-sm, body .container-fluid .well.well-sm {
  padding: 10px; }

body .container .well.well-lg, body .container-fluid .well.well-lg {
  padding: 26px; }

body .container .jumbotron, body .container .well, body .container-fluid .jumbotron, body .container-fluid .well {
  background-color: #fff;
  padding: 19px;
  margin-bottom: 20px;
  -webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  border-radius: 2px;
  border: 0; }

body .container .jumbotron p, body .container .well p, body .container-fluid .jumbotron p, body .container-fluid .well p {
  font-weight: 300; }

body .container .jumbotron, body .container .jumbotron-default, body .container .well, body .container .well-default, body .container-fluid .jumbotron, body .container-fluid .jumbotron-default, body .container-fluid .well, body .container-fluid .well-default {
  background-color: #fff; }

body .container .jumbotron-inverse, body .container .well-inverse, body .container-fluid .jumbotron-inverse, body .container-fluid .well-inverse {
  background-color: #3f51b5; }

body .container .jumbotron-primary, body .container .well-primary, body .container-fluid .jumbotron-primary, body .container-fluid .well-primary {
  background-color: #009688; }

body .container .jumbotron-success, body .container .well-success, body .container-fluid .jumbotron-success, body .container-fluid .well-success {
  background-color: #4caf50; }

body .container .jumbotron-info, body .container .well-info, body .container-fluid .jumbotron-info, body .container-fluid .well-info {
  background-color: #03a9f4; }

body .container .jumbotron-warning, body .container .well-warning, body .container-fluid .jumbotron-warning, body .container-fluid .well-warning {
  background-color: #ff5722; }

body .container .jumbotron-danger, body .container .well-danger, body .container-fluid .jumbotron-danger, body .container-fluid .well-danger {
  background-color: #f44336; }

.btn, .input-group-btn .btn {
  border: none;
  border-radius: 2px;
  position: relative;
  padding: 8px 30px;
  margin: 10px 1px;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0;
  will-change: box-shadow, transform;
  -webkit-transition: -webkit-box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  -o-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  outline: 0;
  cursor: pointer;
  text-decoration: none;
  background: 0 0; }

.btn::-moz-focus-inner, .input-group-btn .btn::-moz-focus-inner {
  border: 0; }

.btn:not(.btn-raised), .input-group-btn .btn:not(.btn-raised) {
  -webkit-box-shadow: none;
  box-shadow: none; }

.btn:not(.btn-raised).btn-inverse, .input-group-btn .btn:not(.btn-raised).btn-inverse {
  color: #3f51b5; }

.btn:not(.btn-raised).btn-primary, .input-group-btn .btn:not(.btn-raised).btn-primary {
  color: #009688; }

.btn:not(.btn-raised).btn-success, .input-group-btn .btn:not(.btn-raised).btn-success {
  color: #4caf50; }

.btn:not(.btn-raised).btn-info, .input-group-btn .btn:not(.btn-raised).btn-info {
  color: #03a9f4; }

.btn:not(.btn-raised).btn-warning, .input-group-btn .btn:not(.btn-raised).btn-warning {
  color: #ff5722; }

.btn:not(.btn-raised).btn-danger, .input-group-btn .btn:not(.btn-raised).btn-danger {
  color: #f44336; }

.theme-dark .btn:not(.btn-raised):not(.btn-link):focus, .theme-dark .btn:not(.btn-raised):not(.btn-link):hover, .theme-dark .input-group-btn .btn:not(.btn-raised):not(.btn-link):focus, .theme-dark .input-group-btn .btn:not(.btn-raised):not(.btn-link):hover {
  background-color: rgba(204, 204, 204, 0.15); }

.btn.btn-fab, .btn.btn-fab.btn-default, .btn.btn-raised, .btn.btn-raised.btn-default, .input-group-btn .btn.btn-fab, .input-group-btn .btn.btn-fab.btn-default, .input-group-btn .btn.btn-raised, .input-group-btn .btn.btn-raised.btn-default {
  background-color: transparent;
  color: rgba(0, 0, 0, 0.87); }

.btn.btn-fab.btn-inverse, .btn.btn-raised.btn-inverse, .input-group-btn .btn.btn-fab.btn-inverse, .input-group-btn .btn.btn-raised.btn-inverse {
  background-color: #3f51b5;
  color: #fff; }

.btn.btn-fab.btn-primary, .btn.btn-raised.btn-primary, .input-group-btn .btn.btn-fab.btn-primary, .input-group-btn .btn.btn-raised.btn-primary {
  background-color: #009688;
  color: rgba(255, 255, 255, 0.84); }

.btn.btn-fab.btn-success, .btn.btn-raised.btn-success, .input-group-btn .btn.btn-fab.btn-success, .input-group-btn .btn.btn-raised.btn-success {
  background-color: #4caf50;
  color: rgba(255, 255, 255, 0.84); }

.btn.btn-fab.btn-info, .btn.btn-raised.btn-info, .input-group-btn .btn.btn-fab.btn-info, .input-group-btn .btn.btn-raised.btn-info {
  background-color: #03a9f4;
  color: rgba(255, 255, 255, 0.84); }

.btn.btn-fab.btn-warning, .btn.btn-raised.btn-warning, .input-group-btn .btn.btn-fab.btn-warning, .input-group-btn .btn.btn-raised.btn-warning {
  background-color: #ff5722;
  color: rgba(255, 255, 255, 0.84); }

.btn.btn-fab.btn-danger, .btn.btn-raised.btn-danger, .input-group-btn .btn.btn-fab.btn-danger, .input-group-btn .btn.btn-raised.btn-danger {
  background-color: #f44336;
  color: rgba(255, 255, 255, 0.84); }

.btn.btn-raised:not(.btn-link), .input-group-btn .btn.btn-raised:not(.btn-link) {
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }

.btn.btn-raised:not(.btn-link).active, .btn.btn-raised:not(.btn-link):active, .input-group-btn .btn.btn-raised:not(.btn-link).active, .input-group-btn .btn.btn-raised:not(.btn-link):active {
  -webkit-box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2); }

.btn.btn-raised:not(.btn-link):focus:not(:active), .input-group-btn .btn.btn-raised:not(.btn-link):focus:not(:active) {
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.18), 0 8px 16px rgba(0, 0, 0, 0.36); }

.btn.btn-fab, .input-group-btn .btn.btn-fab {
  border-radius: 50%;
  font-size: 24px;
  height: 56px;
  margin: auto;
  min-width: 56px;
  width: 56px;
  padding: 0;
  overflow: hidden;
  -webkit-box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
  box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, 0.12), 0 1px 1px 0 rgba(0, 0, 0, 0.24);
  position: relative;
  line-height: normal; }

.btn.btn-fab .ripple-container, .input-group-btn .btn.btn-fab .ripple-container {
  border-radius: 50%; }

.btn-group-sm .btn.btn-fab, .btn-group-sm .input-group-btn .btn.btn-fab, .btn.btn-fab.btn-fab-mini, .input-group-btn .btn.btn-fab.btn-fab-mini {
  height: 40px;
  min-width: 40px;
  width: 40px; }

.btn-group-sm .btn.btn-fab.material-icons, .btn-group-sm .input-group-btn .btn.btn-fab.material-icons, .btn.btn-fab.btn-fab-mini.material-icons, .input-group-btn .btn.btn-fab.btn-fab-mini.material-icons {
  top: 0;
  left: 0; }

.btn.btn-fab i.material-icons, .input-group-btn .btn.btn-fab i.material-icons {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-12px, -12px);
  -ms-transform: translate(-12px, -12px);
  -o-transform: translate(-12px, -12px);
  transform: translate(-12px, -12px);
  line-height: 24px;
  width: 24px; }

.btn i.material-icons, .input-group-btn .btn i.material-icons {
  vertical-align: middle; }

.btn-group-vertical.disabled, .btn-group-vertical:disabled, .btn-group-vertical[disabled][disabled], .btn-group.disabled, .btn-group:disabled, .btn-group[disabled][disabled], .btn.disabled, .btn:disabled, .btn[disabled][disabled], .input-group-btn .btn.disabled, .input-group-btn .btn:disabled, .input-group-btn .btn[disabled][disabled], fieldset[disabled][disabled] .btn, fieldset[disabled][disabled] .btn-group, fieldset[disabled][disabled] .btn-group-vertical, fieldset[disabled][disabled] .input-group-btn .btn {
  color: rgba(0, 0, 0, 0.26);
  background: 0 0; }

.theme-dark .btn-group-vertical.disabled, .theme-dark .btn-group-vertical:disabled, .theme-dark .btn-group-vertical[disabled][disabled], .theme-dark .btn-group.disabled, .theme-dark .btn-group:disabled, .theme-dark .btn-group[disabled][disabled], .theme-dark .btn.disabled, .theme-dark .btn:disabled, .theme-dark .btn[disabled][disabled], .theme-dark .input-group-btn .btn.disabled, .theme-dark .input-group-btn .btn:disabled, .theme-dark .input-group-btn .btn[disabled][disabled], .theme-dark fieldset[disabled][disabled] .btn, .theme-dark fieldset[disabled][disabled] .btn-group, .theme-dark fieldset[disabled][disabled] .btn-group-vertical, .theme-dark fieldset[disabled][disabled] .input-group-btn .btn {
  color: rgba(255, 255, 255, 0.3); }

.btn-group-vertical.disabled.btn-group-raised, .btn-group-vertical.disabled.btn-group-raised.active, .btn-group-vertical.disabled.btn-group-raised:active, .btn-group-vertical.disabled.btn-group-raised:focus:not(:active), .btn-group-vertical.disabled.btn-raised, .btn-group-vertical.disabled.btn-raised.active, .btn-group-vertical.disabled.btn-raised:active, .btn-group-vertical.disabled.btn-raised:focus:not(:active), .btn-group-vertical:disabled.btn-group-raised, .btn-group-vertical:disabled.btn-group-raised.active, .btn-group-vertical:disabled.btn-group-raised:active, .btn-group-vertical:disabled.btn-group-raised:focus:not(:active), .btn-group-vertical:disabled.btn-raised, .btn-group-vertical:disabled.btn-raised.active, .btn-group-vertical:disabled.btn-raised:active, .btn-group-vertical:disabled.btn-raised:focus:not(:active), .btn-group-vertical[disabled][disabled].btn-group-raised, .btn-group-vertical[disabled][disabled].btn-group-raised.active, .btn-group-vertical[disabled][disabled].btn-group-raised:active, .btn-group-vertical[disabled][disabled].btn-group-raised:focus:not(:active), .btn-group-vertical[disabled][disabled].btn-raised, .btn-group-vertical[disabled][disabled].btn-raised.active, .btn-group-vertical[disabled][disabled].btn-raised:active, .btn-group-vertical[disabled][disabled].btn-raised:focus:not(:active), .btn-group.disabled.btn-group-raised, .btn-group.disabled.btn-group-raised.active, .btn-group.disabled.btn-group-raised:active, .btn-group.disabled.btn-group-raised:focus:not(:active), .btn-group.disabled.btn-raised, .btn-group.disabled.btn-raised.active, .btn-group.disabled.btn-raised:active, .btn-group.disabled.btn-raised:focus:not(:active), .btn-group:disabled.btn-group-raised, .btn-group:disabled.btn-group-raised.active, .btn-group:disabled.btn-group-raised:active, .btn-group:disabled.btn-group-raised:focus:not(:active), .btn-group:disabled.btn-raised, .btn-group:disabled.btn-raised.active, .btn-group:disabled.btn-raised:active, .btn-group:disabled.btn-raised:focus:not(:active), .btn-group[disabled][disabled].btn-group-raised, .btn-group[disabled][disabled].btn-group-raised.active, .btn-group[disabled][disabled].btn-group-raised:active, .btn-group[disabled][disabled].btn-group-raised:focus:not(:active), .btn-group[disabled][disabled].btn-raised, .btn-group[disabled][disabled].btn-raised.active, .btn-group[disabled][disabled].btn-raised:active, .btn-group[disabled][disabled].btn-raised:focus:not(:active), .btn.disabled.btn-group-raised, .btn.disabled.btn-group-raised.active, .btn.disabled.btn-group-raised:active, .btn.disabled.btn-group-raised:focus:not(:active), .btn.disabled.btn-raised, .btn.disabled.btn-raised.active, .btn.disabled.btn-raised:active, .btn.disabled.btn-raised:focus:not(:active), .btn:disabled.btn-group-raised, .btn:disabled.btn-group-raised.active, .btn:disabled.btn-group-raised:active, .btn:disabled.btn-group-raised:focus:not(:active), .btn:disabled.btn-raised, .btn:disabled.btn-raised.active, .btn:disabled.btn-raised:active, .btn:disabled.btn-raised:focus:not(:active), .btn[disabled][disabled].btn-group-raised, .btn[disabled][disabled].btn-group-raised.active, .btn[disabled][disabled].btn-group-raised:active, .btn[disabled][disabled].btn-group-raised:focus:not(:active), .btn[disabled][disabled].btn-raised, .btn[disabled][disabled].btn-raised.active, .btn[disabled][disabled].btn-raised:active, .btn[disabled][disabled].btn-raised:focus:not(:active), .input-group-btn .btn.disabled.btn-group-raised, .input-group-btn .btn.disabled.btn-group-raised.active, .input-group-btn .btn.disabled.btn-group-raised:active, .input-group-btn .btn.disabled.btn-group-raised:focus:not(:active), .input-group-btn .btn.disabled.btn-raised, .input-group-btn .btn.disabled.btn-raised.active, .input-group-btn .btn.disabled.btn-raised:active, .input-group-btn .btn.disabled.btn-raised:focus:not(:active), .input-group-btn .btn:disabled.btn-group-raised, .input-group-btn .btn:disabled.btn-group-raised.active, .input-group-btn .btn:disabled.btn-group-raised:active, .input-group-btn .btn:disabled.btn-group-raised:focus:not(:active), .input-group-btn .btn:disabled.btn-raised, .input-group-btn .btn:disabled.btn-raised.active, .input-group-btn .btn:disabled.btn-raised:active, .input-group-btn .btn:disabled.btn-raised:focus:not(:active), .input-group-btn .btn[disabled][disabled].btn-group-raised, .input-group-btn .btn[disabled][disabled].btn-group-raised.active, .input-group-btn .btn[disabled][disabled].btn-group-raised:active, .input-group-btn .btn[disabled][disabled].btn-group-raised:focus:not(:active), .input-group-btn .btn[disabled][disabled].btn-raised, .input-group-btn .btn[disabled][disabled].btn-raised.active, .input-group-btn .btn[disabled][disabled].btn-raised:active, .input-group-btn .btn[disabled][disabled].btn-raised:focus:not(:active), fieldset[disabled][disabled] .btn-group-vertical.btn-group-raised, fieldset[disabled][disabled] .btn-group-vertical.btn-group-raised.active, fieldset[disabled][disabled] .btn-group-vertical.btn-group-raised:active, fieldset[disabled][disabled] .btn-group-vertical.btn-group-raised:focus:not(:active), fieldset[disabled][disabled] .btn-group-vertical.btn-raised, fieldset[disabled][disabled] .btn-group-vertical.btn-raised.active, fieldset[disabled][disabled] .btn-group-vertical.btn-raised:active, fieldset[disabled][disabled] .btn-group-vertical.btn-raised:focus:not(:active), fieldset[disabled][disabled] .btn-group.btn-group-raised, fieldset[disabled][disabled] .btn-group.btn-group-raised.active, fieldset[disabled][disabled] .btn-group.btn-group-raised:active, fieldset[disabled][disabled] .btn-group.btn-group-raised:focus:not(:active), fieldset[disabled][disabled] .btn-group.btn-raised, fieldset[disabled][disabled] .btn-group.btn-raised.active, fieldset[disabled][disabled] .btn-group.btn-raised:active, fieldset[disabled][disabled] .btn-group.btn-raised:focus:not(:active), fieldset[disabled][disabled] .btn.btn-group-raised, fieldset[disabled][disabled] .btn.btn-group-raised.active, fieldset[disabled][disabled] .btn.btn-group-raised:active, fieldset[disabled][disabled] .btn.btn-group-raised:focus:not(:active), fieldset[disabled][disabled] .btn.btn-raised, fieldset[disabled][disabled] .btn.btn-raised.active, fieldset[disabled][disabled] .btn.btn-raised:active, fieldset[disabled][disabled] .btn.btn-raised:focus:not(:active), fieldset[disabled][disabled] .input-group-btn .btn.btn-group-raised, fieldset[disabled][disabled] .input-group-btn .btn.btn-group-raised.active, fieldset[disabled][disabled] .input-group-btn .btn.btn-group-raised:active, fieldset[disabled][disabled] .input-group-btn .btn.btn-group-raised:focus:not(:active), fieldset[disabled][disabled] .input-group-btn .btn.btn-raised, fieldset[disabled][disabled] .input-group-btn .btn.btn-raised.active, fieldset[disabled][disabled] .input-group-btn .btn.btn-raised:active, fieldset[disabled][disabled] .input-group-btn .btn.btn-raised:focus:not(:active) {
  -webkit-box-shadow: none;
  box-shadow: none; }

.btn-group, .btn-group-vertical {
  position: relative;
  margin: 10px 1px; }

.btn-group-vertical.open > .dropdown-toggle.btn.btn-inverse, .btn-group.open > .dropdown-toggle.btn.btn-inverse {
  background-color: #3f51b5; }

.btn-group-vertical.open > .dropdown-toggle.btn.btn-primary, .btn-group.open > .dropdown-toggle.btn.btn-primary {
  background-color: #009688; }

.btn-group-vertical.open > .dropdown-toggle.btn.btn-success, .btn-group.open > .dropdown-toggle.btn.btn-success {
  background-color: #4caf50; }

.btn-group-vertical.open > .dropdown-toggle.btn.btn-info, .btn-group.open > .dropdown-toggle.btn.btn-info {
  background-color: #03a9f4; }

.btn-group-vertical.open > .dropdown-toggle.btn.btn-warning, .btn-group.open > .dropdown-toggle.btn.btn-warning {
  background-color: #ff5722; }

.btn-group-vertical.open > .dropdown-toggle.btn.btn-danger, .btn-group.open > .dropdown-toggle.btn.btn-danger {
  background-color: #f44336; }

.btn-group .dropdown-menu, .btn-group-vertical .dropdown-menu {
  border-radius: 0 0 2px 2px; }

.btn-group-vertical.btn-group-raised, .btn-group.btn-group-raised {
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }

.btn-group .btn, .btn-group .btn + .btn, .btn-group .btn-group, .btn-group .btn:active, .btn-group-vertical .btn, .btn-group-vertical .btn + .btn, .btn-group-vertical .btn-group, .btn-group-vertical .btn:active {
  margin: 0; }

.checkbox label {
  cursor: pointer;
  padding-left: 0;
  color: rgba(0, 0, 0, 0.54); }

.checkbox input[type=checkbox] {
  opacity: 0;
  position: absolute;
  margin: 0;
  z-index: -1;
  width: 0;
  height: 0;
  overflow: hidden;
  left: 0;
  pointer-events: none; }

.checkbox .checkbox-material {
  vertical-align: middle;
  position: relative;
  top: 3px; }

.checkbox .checkbox-material:before {
  display: block;
  position: absolute;
  left: 0;
  content: "";
  background-color: rgba(0, 0, 0, 0.84);
  height: 20px;
  width: 20px;
  border-radius: 100%;
  z-index: 1;
  opacity: 0;
  margin: 0;
  -webkit-transform: scale3d(2.3, 2.3, 1);
  transform: scale3d(2.3, 2.3, 1); }

.checkbox .checkbox-material .check {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid rgba(0, 0, 0, 0.54);
  overflow: hidden;
  z-index: 1; }

.checkbox .checkbox-material .check:before {
  position: absolute;
  content: "";
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  display: block;
  margin-top: -4px;
  margin-left: 6px;
  width: 0;
  height: 0;
  -webkit-box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset;
  box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset;
  -webkit-animation: checkbox-off .3s forwards;
  -o-animation: checkbox-off .3s forwards;
  animation: checkbox-off 0.3s forwards; }

.checkbox input[type=checkbox]:focus + .checkbox-material .check:after {
  opacity: 0.2; }

.checkbox input[type=checkbox]:checked + .checkbox-material .check {
  color: #4caf50;
  border-color: #4caf50; }

.checkbox input[type=checkbox]:checked + .checkbox-material .check:before {
  color: #4caf50;
  -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px;
  box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px;
  -webkit-animation: checkbox-on .3s forwards;
  -o-animation: checkbox-on .3s forwards;
  animation: checkbox-on 0.3s forwards; }

.checkbox input[type=checkbox]:checked + .checkbox-material:before {
  -webkit-animation: rippleOn .5s;
  -o-animation: rippleOn .5s;
  animation: rippleOn 0.5s; }

.checkbox input[type=checkbox]:checked + .checkbox-material .check:after {
  -webkit-animation: rippleOn .5s forwards;
  -o-animation: rippleOn .5s forwards;
  animation: rippleOn 0.5s forwards; }

.checkbox input[type=checkbox]:not(:checked) + .checkbox-material:before {
  -webkit-animation: rippleOff .5s;
  -o-animation: rippleOff .5s;
  animation: rippleOff 0.5s; }

.checkbox input[type=checkbox]:not(:checked) + .checkbox-material .check:after {
  -webkit-animation: rippleOff .5s forwards;
  -o-animation: rippleOff .5s forwards;
  animation: rippleOff 0.5s forwards; }

.checkbox input[type=checkbox][disabled] + .circle, .checkbox input[type=checkbox][disabled]:not(:checked) ~ .checkbox-material .check, .checkbox input[type=checkbox][disabled]:not(:checked) ~ .checkbox-material .check:before, fieldset[disabled] .checkbox, fieldset[disabled] .checkbox input[type=checkbox] {
  opacity: 0.5; }

.checkbox input[type=checkbox][disabled] + .checkbox-material .check:after {
  background-color: rgba(0, 0, 0, 0.87);
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg); }

@-webkit-keyframes checkbox-on {
  0% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px; }
  50% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px 2px 0 11px;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px 2px 0 11px; }
  100% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px; } }
@-o-keyframes checkbox-on {
  0% {
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px; }
  50% {
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px 2px 0 11px; }
  100% {
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px; } }
@keyframes checkbox-on {
  0% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px; }
  50% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px 2px 0 11px;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px 2px 0 11px; }
  100% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px; } }
@-webkit-keyframes checkbox-off {
  0% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset; }
  25% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset; }
  50% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -4px;
    margin-left: 6px;
    width: 0;
    height: 0;
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px, 0 0 0 0 inset;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px, 0 0 0 0 inset; }
  51% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    margin-top: -2px;
    margin-left: -2px;
    width: 20px;
    height: 20px;
    -webkit-box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 10px inset;
    box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 10px inset; }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    margin-top: -2px;
    margin-left: -2px;
    width: 20px;
    height: 20px;
    -webkit-box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset;
    box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset; } }
@-o-keyframes checkbox-off {
  0% {
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset; }
  25% {
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset; }
  50% {
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -4px;
    margin-left: 6px;
    width: 0;
    height: 0;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px, 0 0 0 0 inset; }
  51% {
    -o-transform: rotate(0);
    transform: rotate(0);
    margin-top: -2px;
    margin-left: -2px;
    width: 20px;
    height: 20px;
    box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 10px inset; }
  100% {
    -o-transform: rotate(0);
    transform: rotate(0);
    margin-top: -2px;
    margin-left: -2px;
    width: 20px;
    height: 20px;
    box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset; } }
@keyframes checkbox-off {
  0% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset; }
  25% {
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px, 0 0 0 0 inset; }
  50% {
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: -4px;
    margin-left: 6px;
    width: 0;
    height: 0;
    -webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px, 0 0 0 0 inset;
    box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px, 0 0 0 0 inset; }
  51% {
    -webkit-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
    margin-top: -2px;
    margin-left: -2px;
    width: 20px;
    height: 20px;
    -webkit-box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 10px inset;
    box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 10px inset; }
  100% {
    -webkit-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);
    margin-top: -2px;
    margin-left: -2px;
    width: 20px;
    height: 20px;
    -webkit-box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset;
    box-shadow: 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0, 0 0 0 0 inset; } }
@-webkit-keyframes rippleOn {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.2; }
  100% {
    opacity: 0; } }
@-o-keyframes rippleOn {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.2; }
  100% {
    opacity: 0; } }
@keyframes rippleOn {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.2; }
  100% {
    opacity: 0; } }
@-webkit-keyframes rippleOff {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.2; }
  100% {
    opacity: 0; } }
@-o-keyframes rippleOff {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.2; }
  100% {
    opacity: 0; } }
@keyframes rippleOff {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.2; }
  100% {
    opacity: 0; } }
.togglebutton {
  vertical-align: middle; }

.togglebutton, .togglebutton .toggle, .togglebutton input, .togglebutton label {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.togglebutton label {
  cursor: pointer;
  color: rgba(0, 0, 0, 0.54); }

.togglebutton label input[type=checkbox] {
  opacity: 0;
  width: 0;
  height: 0; }

.togglebutton label .toggle, .togglebutton label input[type=checkbox][disabled] + .toggle {
  content: "";
  display: inline-block;
  width: 30px;
  height: 15px;
  background-color: rgba(80, 80, 80, 0.7);
  border-radius: 15px;
  margin-right: 15px;
  -webkit-transition: background .3s ease;
  -o-transition: background .3s ease;
  transition: background .3s ease;
  vertical-align: middle; }

.togglebutton label .toggle:after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #F1F1F1;
  border-radius: 20px;
  position: relative;
  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
  left: -5px;
  top: -2px;
  -webkit-transition: left .3s ease, background .3s ease, -webkit-box-shadow .1s ease;
  -o-transition: left .3s ease, background .3s ease, box-shadow .1s ease;
  transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease; }

.togglebutton label input[type=checkbox][disabled] + .toggle:after, .togglebutton label input[type=checkbox][disabled]:checked + .toggle:after {
  background-color: #BDBDBD; }

.togglebutton label input[type=checkbox] + .toggle:active:after, .togglebutton label input[type=checkbox][disabled] + .toggle:active:after {
  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1); }

.togglebutton label input[type=checkbox]:checked + .toggle:after {
  left: 15px; }

.togglebutton label label input[type=checkbox]:checked + .toggle {
  background-color: rgba(0, 150, 136, 0.5); }

.togglebutton label label input[type=checkbox]:checked + .toggle:after {
  background-color: #009688; }

.togglebutton label label input[type=checkbox]:checked + .toggle:active:after {
  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 150, 136, 0.1);
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 150, 136, 0.1); }

.radio label {
  cursor: pointer;
  padding-left: 45px;
  position: relative;
  color: rgba(0, 0, 0, 0.54); }

.radio label span {
  display: block;
  position: absolute;
  left: 10px;
  top: 2px;
  -webkit-transition-duration: .2s;
  -o-transition-duration: .2s;
  transition-duration: 0.2s; }

.radio label .circle {
  border: 2px solid rgba(0, 0, 0, 0.54);
  height: 15px;
  width: 15px;
  border-radius: 100%; }

.radio label .check {
  height: 15px;
  width: 15px;
  border-radius: 100%;
  background-color: #009688;
  -webkit-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0); }

.radio label .check:after {
  display: block;
  position: absolute;
  content: "";
  background-color: rgba(0, 0, 0, 0.87);
  left: -18px;
  top: -18px;
  height: 50px;
  width: 50px;
  border-radius: 100%;
  z-index: 1;
  opacity: 0;
  margin: 0;
  -webkit-transform: scale3d(1.5, 1.5, 1);
  transform: scale3d(1.5, 1.5, 1); }

.radio label input[type=radio]:not(:checked) ~ .check:after {
  -webkit-animation: rippleOff .5s;
  -o-animation: rippleOff .5s;
  animation: rippleOff 0.5s; }

.radio label input[type=radio]:checked ~ .check:after {
  -webkit-animation: rippleOn .5s;
  -o-animation: rippleOn .5s;
  animation: rippleOn 0.5s; }

.radio input[type=radio] {
  opacity: 0;
  height: 0;
  width: 0;
  overflow: hidden; }

.radio input[type=radio]:checked ~ .check, .radio input[type=radio]:checked ~ .circle {
  opacity: 1; }

.radio input[type=radio]:checked ~ .check {
  background-color: #009688; }

.radio input[type=radio]:checked ~ .circle {
  border-color: #009688; }

.radio input[type=radio]:checked ~ .check {
  -webkit-transform: scale3d(0.55, 0.55, 1);
  transform: scale3d(0.55, 0.55, 1); }

.radio input[type=radio][disabled] ~ .check, .radio input[type=radio][disabled] ~ .circle {
  opacity: 0.26; }

.radio input[type=radio][disabled] ~ .check {
  background-color: #000; }

.radio input[type=radio][disabled] ~ .circle {
  border-color: #000; }

.theme-dark .radio input[type=radio][disabled] ~ .check, .theme-dark .radio input[type=radio][disabled] ~ .circle {
  opacity: 0.3; }

.theme-dark .radio input[type=radio][disabled] ~ .check {
  background-color: #fff; }

.theme-dark .radio input[type=radio][disabled] ~ .circle {
  border-color: #fff; }

@keyframes rippleOn {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.2; }
  100% {
    opacity: 0; } }
@keyframes rippleOff {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.2; }
  100% {
    opacity: 0; } }
legend {
  margin-bottom: 22px;
  font-size: 24px; }

output {
  padding-top: 8px;
  font-size: 16px;
  line-height: 1.42857143; }

.form-control {
  height: 38px;
  padding: 7px 0;
  font-size: 16px;
  line-height: 1.42857143; }

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  input[type=date].form-control, input[type=time].form-control, input[type=datetime-local].form-control, input[type=month].form-control {
    line-height: 38px; }

  .input-group-sm input[type=date], .input-group-sm input[type=time], .input-group-sm input[type=datetime-local], .input-group-sm input[type=month], input[type=date].input-sm, .input-group-sm > input[type=date].form-control,
  .input-group-sm > input[type=date].input-group-addon,
  .input-group-sm > .input-group-btn > input[type=date].btn, input[type=time].input-sm, .input-group-sm > input[type=time].form-control,
  .input-group-sm > input[type=time].input-group-addon,
  .input-group-sm > .input-group-btn > input[type=time].btn, input[type=datetime-local].input-sm, .input-group-sm > input[type=datetime-local].form-control,
  .input-group-sm > input[type=datetime-local].input-group-addon,
  .input-group-sm > .input-group-btn > input[type=datetime-local].btn, input[type=month].input-sm, .input-group-sm > input[type=month].form-control,
  .input-group-sm > input[type=month].input-group-addon,
  .input-group-sm > .input-group-btn > input[type=month].btn {
    line-height: 24px; }

  .input-group-lg input[type=date], .input-group-lg input[type=time], .input-group-lg input[type=datetime-local], .input-group-lg input[type=month], input[type=date].input-lg, .input-group-lg > input[type=date].form-control,
  .input-group-lg > input[type=date].input-group-addon,
  .input-group-lg > .input-group-btn > input[type=date].btn, input[type=time].input-lg, .input-group-lg > input[type=time].form-control,
  .input-group-lg > input[type=time].input-group-addon,
  .input-group-lg > .input-group-btn > input[type=time].btn, input[type=datetime-local].input-lg, .input-group-lg > input[type=datetime-local].form-control,
  .input-group-lg > input[type=datetime-local].input-group-addon,
  .input-group-lg > .input-group-btn > input[type=datetime-local].btn, input[type=month].input-lg, .input-group-lg > input[type=month].form-control,
  .input-group-lg > input[type=month].input-group-addon,
  .input-group-lg > .input-group-btn > input[type=month].btn {
    line-height: 44px; } }
.checkbox label {
  padding-left: 25px; }

.radio label {
  padding-left: 30px; }

.checkbox label, .radio label {
  min-height: 22px; }
  .checkbox label .checkbox-material, .radio label .checkbox-material {
    position: absolute;
    left: 0; }

.form-control-static {
  padding-top: 8px;
  padding-bottom: 8px;
  min-height: 38px; }

.input-sm .input-sm, .input-group-sm > .form-control .input-sm,
.input-group-sm > .input-group-addon .input-sm,
.input-group-sm > .input-group-btn > .btn .input-sm, .input-sm .input-group-sm > .form-control, .input-group-sm > .form-control .input-group-sm > .form-control,
.input-group-sm > .input-group-addon .input-group-sm > .form-control,
.input-group-sm > .input-group-btn > .btn .input-group-sm > .form-control,
.input-sm .input-group-sm > .input-group-addon,
.input-group-sm > .form-control .input-group-sm > .input-group-addon,
.input-group-sm > .input-group-addon .input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .btn .input-group-sm > .input-group-addon,
.input-sm .input-group-sm > .input-group-btn > .btn,
.input-group-sm > .form-control .input-group-sm > .input-group-btn > .btn,
.input-group-sm > .input-group-addon .input-group-sm > .input-group-btn > .btn,
.input-group-sm > .input-group-btn > .btn .input-group-sm > .input-group-btn > .btn {
  height: 24px;
  padding: 3px 0;
  font-size: 11px;
  line-height: 1.5;
  border-radius: 0; }

.input-sm select.input-sm, .input-group-sm > .form-control select.input-sm,
.input-group-sm > .input-group-addon select.input-sm,
.input-group-sm > .input-group-btn > .btn select.input-sm, .input-sm .input-group-sm > select.form-control, .input-group-sm > .form-control .input-group-sm > select.form-control,
.input-group-sm > .input-group-addon .input-group-sm > select.form-control,
.input-group-sm > .input-group-btn > .btn .input-group-sm > select.form-control,
.input-sm .input-group-sm > select.input-group-addon,
.input-group-sm > .form-control .input-group-sm > select.input-group-addon,
.input-group-sm > .input-group-addon .input-group-sm > select.input-group-addon,
.input-group-sm > .input-group-btn > .btn .input-group-sm > select.input-group-addon,
.input-sm .input-group-sm > .input-group-btn > select.btn,
.input-group-sm > .form-control .input-group-sm > .input-group-btn > select.btn,
.input-group-sm > .input-group-addon .input-group-sm > .input-group-btn > select.btn,
.input-group-sm > .input-group-btn > .btn .input-group-sm > .input-group-btn > select.btn {
  height: 24px;
  line-height: 24px; }

.input-sm select[multiple].input-sm, .input-group-sm > .form-control select[multiple].input-sm,
.input-group-sm > .input-group-addon select[multiple].input-sm,
.input-group-sm > .input-group-btn > .btn select[multiple].input-sm, .input-sm .input-group-sm > select[multiple].form-control, .input-group-sm > .form-control .input-group-sm > select[multiple].form-control,
.input-group-sm > .input-group-addon .input-group-sm > select[multiple].form-control,
.input-group-sm > .input-group-btn > .btn .input-group-sm > select[multiple].form-control,
.input-sm .input-group-sm > select[multiple].input-group-addon,
.input-group-sm > .form-control .input-group-sm > select[multiple].input-group-addon,
.input-group-sm > .input-group-addon .input-group-sm > select[multiple].input-group-addon,
.input-group-sm > .input-group-btn > .btn .input-group-sm > select[multiple].input-group-addon,
.input-sm .input-group-sm > .input-group-btn > select[multiple].btn,
.input-group-sm > .form-control .input-group-sm > .input-group-btn > select[multiple].btn,
.input-group-sm > .input-group-addon .input-group-sm > .input-group-btn > select[multiple].btn,
.input-group-sm > .input-group-btn > .btn .input-group-sm > .input-group-btn > select[multiple].btn, .input-sm textarea.input-sm, .input-group-sm > .form-control textarea.input-sm,
.input-group-sm > .input-group-addon textarea.input-sm,
.input-group-sm > .input-group-btn > .btn textarea.input-sm, .input-sm .input-group-sm > textarea.form-control, .input-group-sm > .form-control .input-group-sm > textarea.form-control,
.input-group-sm > .input-group-addon .input-group-sm > textarea.form-control,
.input-group-sm > .input-group-btn > .btn .input-group-sm > textarea.form-control,
.input-sm .input-group-sm > textarea.input-group-addon,
.input-group-sm > .form-control .input-group-sm > textarea.input-group-addon,
.input-group-sm > .input-group-addon .input-group-sm > textarea.input-group-addon,
.input-group-sm > .input-group-btn > .btn .input-group-sm > textarea.input-group-addon,
.input-sm .input-group-sm > .input-group-btn > textarea.btn,
.input-group-sm > .form-control .input-group-sm > .input-group-btn > textarea.btn,
.input-group-sm > .input-group-addon .input-group-sm > .input-group-btn > textarea.btn,
.input-group-sm > .input-group-btn > .btn .input-group-sm > .input-group-btn > textarea.btn {
  height: auto; }

.form-group-sm .form-control {
  height: 24px;
  padding: 3px 0;
  font-size: 11px;
  line-height: 1.5; }

.form-group-sm select.form-control {
  height: 24px;
  line-height: 24px; }

.form-group-sm select[multiple].form-control, .form-group-sm textarea.form-control {
  height: auto; }

.form-group-sm .form-control-static {
  height: 24px;
  min-height: 33px;
  padding: 4px 0;
  font-size: 11px;
  line-height: 1.5; }

.input-lg .input-lg, .input-group-lg > .form-control .input-lg,
.input-group-lg > .input-group-addon .input-lg,
.input-group-lg > .input-group-btn > .btn .input-lg, .input-lg .input-group-lg > .form-control, .input-group-lg > .form-control .input-group-lg > .form-control,
.input-group-lg > .input-group-addon .input-group-lg > .form-control,
.input-group-lg > .input-group-btn > .btn .input-group-lg > .form-control,
.input-lg .input-group-lg > .input-group-addon,
.input-group-lg > .form-control .input-group-lg > .input-group-addon,
.input-group-lg > .input-group-addon .input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn .input-group-lg > .input-group-addon,
.input-lg .input-group-lg > .input-group-btn > .btn,
.input-group-lg > .form-control .input-group-lg > .input-group-btn > .btn,
.input-group-lg > .input-group-addon .input-group-lg > .input-group-btn > .btn,
.input-group-lg > .input-group-btn > .btn .input-group-lg > .input-group-btn > .btn {
  height: 44px;
  padding: 9px 0;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 0; }

.input-lg select.input-lg, .input-group-lg > .form-control select.input-lg,
.input-group-lg > .input-group-addon select.input-lg,
.input-group-lg > .input-group-btn > .btn select.input-lg, .input-lg .input-group-lg > select.form-control, .input-group-lg > .form-control .input-group-lg > select.form-control,
.input-group-lg > .input-group-addon .input-group-lg > select.form-control,
.input-group-lg > .input-group-btn > .btn .input-group-lg > select.form-control,
.input-lg .input-group-lg > select.input-group-addon,
.input-group-lg > .form-control .input-group-lg > select.input-group-addon,
.input-group-lg > .input-group-addon .input-group-lg > select.input-group-addon,
.input-group-lg > .input-group-btn > .btn .input-group-lg > select.input-group-addon,
.input-lg .input-group-lg > .input-group-btn > select.btn,
.input-group-lg > .form-control .input-group-lg > .input-group-btn > select.btn,
.input-group-lg > .input-group-addon .input-group-lg > .input-group-btn > select.btn,
.input-group-lg > .input-group-btn > .btn .input-group-lg > .input-group-btn > select.btn {
  height: 44px;
  line-height: 44px; }

.input-lg select[multiple].input-lg, .input-group-lg > .form-control select[multiple].input-lg,
.input-group-lg > .input-group-addon select[multiple].input-lg,
.input-group-lg > .input-group-btn > .btn select[multiple].input-lg, .input-lg .input-group-lg > select[multiple].form-control, .input-group-lg > .form-control .input-group-lg > select[multiple].form-control,
.input-group-lg > .input-group-addon .input-group-lg > select[multiple].form-control,
.input-group-lg > .input-group-btn > .btn .input-group-lg > select[multiple].form-control,
.input-lg .input-group-lg > select[multiple].input-group-addon,
.input-group-lg > .form-control .input-group-lg > select[multiple].input-group-addon,
.input-group-lg > .input-group-addon .input-group-lg > select[multiple].input-group-addon,
.input-group-lg > .input-group-btn > .btn .input-group-lg > select[multiple].input-group-addon,
.input-lg .input-group-lg > .input-group-btn > select[multiple].btn,
.input-group-lg > .form-control .input-group-lg > .input-group-btn > select[multiple].btn,
.input-group-lg > .input-group-addon .input-group-lg > .input-group-btn > select[multiple].btn,
.input-group-lg > .input-group-btn > .btn .input-group-lg > .input-group-btn > select[multiple].btn, .input-lg textarea.input-lg, .input-group-lg > .form-control textarea.input-lg,
.input-group-lg > .input-group-addon textarea.input-lg,
.input-group-lg > .input-group-btn > .btn textarea.input-lg, .input-lg .input-group-lg > textarea.form-control, .input-group-lg > .form-control .input-group-lg > textarea.form-control,
.input-group-lg > .input-group-addon .input-group-lg > textarea.form-control,
.input-group-lg > .input-group-btn > .btn .input-group-lg > textarea.form-control,
.input-lg .input-group-lg > textarea.input-group-addon,
.input-group-lg > .form-control .input-group-lg > textarea.input-group-addon,
.input-group-lg > .input-group-addon .input-group-lg > textarea.input-group-addon,
.input-group-lg > .input-group-btn > .btn .input-group-lg > textarea.input-group-addon,
.input-lg .input-group-lg > .input-group-btn > textarea.btn,
.input-group-lg > .form-control .input-group-lg > .input-group-btn > textarea.btn,
.input-group-lg > .input-group-addon .input-group-lg > .input-group-btn > textarea.btn,
.input-group-lg > .input-group-btn > .btn .input-group-lg > .input-group-btn > textarea.btn {
  height: auto; }

.form-group-lg .form-control {
  height: 44px;
  padding: 9px 0;
  font-size: 18px;
  line-height: 1.3333333; }

.form-group-lg select.form-control {
  height: 44px;
  line-height: 44px; }

.form-group-lg select[multiple].form-control, .form-group-lg textarea.form-control {
  height: auto; }

.form-group-lg .form-control-static {
  height: 44px;
  min-height: 40px;
  padding: 10px 0;
  font-size: 18px;
  line-height: 1.3333333; }

.form-horizontal .checkbox, .form-horizontal .checkbox-inline, .form-horizontal .radio, .form-horizontal .radio-inline {
  padding-top: 8px; }

.form-horizontal .checkbox, .form-horizontal .radio {
  min-height: 30px; }

@media (min-width: 768px) {
  .form-horizontal .control-label {
    padding-top: 8px; } }
@media (min-width: 768px) {
  .form-horizontal .form-group-lg .control-label {
    padding-top: 13px;
    font-size: 18px; } }
@media (min-width: 768px) {
  .form-horizontal .form-group-sm .control-label {
    padding-top: 4px;
    font-size: 11px; } }
.label {
  border-radius: 1px; }

.label, .label.label-default {
  background-color: #9e9e9e; }

.label.label-inverse {
  background-color: #3f51b5; }

.label.label-primary {
  background-color: #009688; }

.label.label-success {
  background-color: #4caf50; }

.label.label-info {
  background-color: #03a9f4; }

.label.label-warning {
  background-color: #ff5722; }

.label.label-danger {
  background-color: #f44336; }

.form-control, .form-group .form-control {
  border: 0;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#009688), to(#009688)), -webkit-gradient(linear, left top, left bottom, from(#D2D2D2), to(#D2D2D2));
  background-image: -webkit-linear-gradient(#009688, #009688), -webkit-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: -o-linear-gradient(#009688, #009688), -o-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: linear-gradient(#009688, #009688), linear-gradient(#D2D2D2, #D2D2D2);
  -webkit-background-size: 0 2px, 100% 1px;
  background-size: 0 2px, 100% 1px;
  background-repeat: no-repeat;
  background-position: center bottom, center -webkit-calc(100% - 1px);
  background-position: center bottom, center calc(100% - 1px);
  background-color: rgba(0, 0, 0, 0);
  -webkit-transition: background 0s ease-out;
  -o-transition: background 0s ease-out;
  transition: background 0s ease-out;
  float: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 0; }

.form-control::-moz-placeholder, .form-group .form-control::-moz-placeholder {
  color: #BDBDBD;
  font-weight: 400; }

.form-control:-ms-input-placeholder, .form-group .form-control:-ms-input-placeholder {
  color: #BDBDBD;
  font-weight: 400; }

.form-control::-webkit-input-placeholder, .form-group .form-control::-webkit-input-placeholder {
  color: #BDBDBD;
  font-weight: 400; }

.form-control[disabled], .form-control[readonly], .form-group .form-control[disabled], .form-group .form-control[readonly], fieldset[disabled] .form-control, fieldset[disabled] .form-group .form-control {
  background-color: rgba(0, 0, 0, 0); }

.form-control[disabled], .form-group .form-control[disabled], fieldset[disabled] .form-control, fieldset[disabled] .form-group .form-control {
  background-image: none;
  border-bottom: 1px dotted #D2D2D2; }

.form-group {
  position: relative; }

.form-group.label-floating label.control-label, .form-group.label-placeholder label.control-label, .form-group.label-static label.control-label {
  position: absolute;
  pointer-events: none;
  -webkit-transition: .3s ease all;
  -o-transition: .3s ease all;
  transition: 0.3s ease all; }

.form-group.label-floating label.control-label {
  will-change: left, top, contents; }

.form-group.label-placeholder:not(.is-empty) label.control-label {
  display: none; }

.form-group .help-block {
  position: absolute;
  display: none; }

.form-group.is-focused .form-control {
  outline: 0;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#009688), to(#009688)), -webkit-gradient(linear, left top, left bottom, from(#D2D2D2), to(#D2D2D2));
  background-image: -webkit-linear-gradient(#009688, #009688), -webkit-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: -o-linear-gradient(#009688, #009688), -o-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: linear-gradient(#009688, #009688), linear-gradient(#D2D2D2, #D2D2D2);
  -webkit-background-size: 100% 2px, 100% 1px;
  background-size: 100% 2px, 100% 1px;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-transition-duration: .3s;
  -o-transition-duration: .3s;
  transition-duration: 0.3s; }

.form-group.is-focused .form-control .material-input:after {
  background-color: #009688; }

.form-group.is-focused label, .form-group.is-focused label.control-label {
  color: #009688; }

.form-group.is-focused.label-placeholder label, .form-group.is-focused.label-placeholder label.control-label {
  color: #BDBDBD; }

.form-group.is-focused .help-block {
  display: block; }

.form-group.has-warning .form-control {
  -webkit-box-shadow: none;
  box-shadow: none; }

.form-group.has-warning.is-focused .form-control {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff5722), to(#ff5722)), -webkit-gradient(linear, left top, left bottom, from(#D2D2D2), to(#D2D2D2));
  background-image: -webkit-linear-gradient(#ff5722, #ff5722), -webkit-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: -o-linear-gradient(#ff5722, #ff5722), -o-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: linear-gradient(#ff5722, #ff5722), linear-gradient(#D2D2D2, #D2D2D2); }

.form-group.has-warning .help-block, .form-group.has-warning label.control-label {
  color: #ff5722; }

.form-group.has-error .form-control {
  -webkit-box-shadow: none;
  box-shadow: none; }

.form-group.has-error.is-focused .form-control {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f44336), to(#f44336)), -webkit-gradient(linear, left top, left bottom, from(#D2D2D2), to(#D2D2D2));
  background-image: -webkit-linear-gradient(#f44336, #f44336), -webkit-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: -o-linear-gradient(#f44336, #f44336), -o-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: linear-gradient(#f44336, #f44336), linear-gradient(#D2D2D2, #D2D2D2); }

.form-group.has-error .help-block, .form-group.has-error label.control-label {
  color: #f44336; }

.form-group.has-success .form-control {
  -webkit-box-shadow: none;
  box-shadow: none; }

.form-group.has-success.is-focused .form-control {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#4caf50), to(#4caf50)), -webkit-gradient(linear, left top, left bottom, from(#D2D2D2), to(#D2D2D2));
  background-image: -webkit-linear-gradient(#4caf50, #4caf50), -webkit-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: -o-linear-gradient(#4caf50, #4caf50), -o-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: linear-gradient(#4caf50, #4caf50), linear-gradient(#D2D2D2, #D2D2D2); }

.form-group.has-success .help-block, .form-group.has-success label.control-label {
  color: #4caf50; }

.form-group.has-info .form-control {
  -webkit-box-shadow: none;
  box-shadow: none; }

.form-group.has-info.is-focused .form-control {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#03a9f4), to(#03a9f4)), -webkit-gradient(linear, left top, left bottom, from(#D2D2D2), to(#D2D2D2));
  background-image: -webkit-linear-gradient(#03a9f4, #03a9f4), -webkit-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: -o-linear-gradient(#03a9f4, #03a9f4), -o-linear-gradient(#D2D2D2, #D2D2D2);
  background-image: linear-gradient(#03a9f4, #03a9f4), linear-gradient(#D2D2D2, #D2D2D2); }

.form-group.has-info .help-block, .form-group.has-info label.control-label {
  color: #03a9f4; }

.form-group textarea {
  resize: none; }

.form-group textarea ~ .form-control-highlight {
  margin-top: -11px; }

.form-group select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

.form-group select ~ .material-input:after {
  display: none; }

.form-control {
  margin-bottom: 7px; }

.form-control::-moz-placeholder {
  font-size: 16px;
  line-height: 1.42857143;
  color: #BDBDBD;
  font-weight: 400; }

.form-control:-ms-input-placeholder {
  font-size: 16px;
  line-height: 1.42857143;
  color: #BDBDBD;
  font-weight: 400; }

.form-control::-webkit-input-placeholder {
  font-size: 16px;
  line-height: 1.42857143;
  color: #BDBDBD;
  font-weight: 400; }

.checkbox label, .radio label, label {
  font-size: 16px;
  line-height: 1.42857143;
  color: #BDBDBD;
  font-weight: 400; }

label.control-label {
  font-size: 12px;
  line-height: 1.07142857;
  color: #BDBDBD;
  font-weight: 400;
  margin: 16px 0 0 0; }

.help-block {
  margin-top: 0;
  font-size: 12px; }

.form-group {
  padding-bottom: 7px;
  margin: 28px 0 0 0; }

.form-group .form-control {
  margin-bottom: 7px; }

.form-group .form-control::-moz-placeholder {
  font-size: 16px;
  line-height: 1.42857143;
  color: #BDBDBD;
  font-weight: 400; }

.form-group .form-control:-ms-input-placeholder {
  font-size: 16px;
  line-height: 1.42857143;
  color: #BDBDBD;
  font-weight: 400; }

.form-group .form-control::-webkit-input-placeholder {
  font-size: 16px;
  line-height: 1.42857143;
  color: #BDBDBD;
  font-weight: 400; }

.form-group .checkbox label, .form-group .radio label, .form-group label {
  font-size: 14px;
  line-height: 1.42857143;
  font-weight: 400;
  color: #2d3940; }

.form-group label.control-label {
  font-size: 12px;
  line-height: 1.07142857;
  color: #BDBDBD;
  font-weight: 400;
  margin: 16px 0 0 0; }

.form-group .help-block {
  margin-top: 0;
  font-size: 12px; }

.form-group.label-floating label.control-label, .form-group.label-placeholder label.control-label {
  top: -7px;
  font-size: 16px;
  line-height: 1.42857143; }

.form-group.label-floating.is-focused label.control-label, .form-group.label-floating:not(.is-empty) label.control-label, .form-group.label-static label.control-label {
  top: -30px;
  left: 0;
  font-size: 12px;
  line-height: 1.07142857; }

.form-group.label-floating input.form-control:-webkit-autofill ~ label.control-label label.control-label {
  top: -30px;
  left: 0;
  font-size: 12px;
  line-height: 1.07142857; }

.form-group.form-group-sm {
  padding-bottom: 3px;
  margin: 21px 0 0 0; }

.form-group.form-group-sm .form-control {
  margin-bottom: 3px; }

.form-group.form-group-sm .form-control::-moz-placeholder {
  font-size: 11px;
  line-height: 1.5;
  color: #BDBDBD;
  font-weight: 400; }

.form-group.form-group-sm .form-control:-ms-input-placeholder {
  font-size: 11px;
  line-height: 1.5;
  color: #BDBDBD;
  font-weight: 400; }

.form-group.form-group-sm .form-control::-webkit-input-placeholder {
  font-size: 11px;
  line-height: 1.5;
  color: #BDBDBD;
  font-weight: 400; }

.form-group.form-group-sm .checkbox label, .form-group.form-group-sm .radio label, .form-group.form-group-sm label {
  font-size: 11px;
  line-height: 1.5;
  color: #BDBDBD;
  font-weight: 400; }

.form-group.form-group-sm label.control-label {
  font-size: 9px;
  line-height: 1.125;
  color: #BDBDBD;
  font-weight: 400;
  margin: 16px 0 0 0; }

.form-group.form-group-sm .help-block {
  margin-top: 0;
  font-size: 9px; }

.form-group.form-group-sm.label-floating label.control-label, .form-group.form-group-sm.label-placeholder label.control-label {
  top: -11px;
  font-size: 11px;
  line-height: 1.5; }

.form-group.form-group-sm.label-floating.is-focused label.control-label, .form-group.form-group-sm.label-floating:not(.is-empty) label.control-label, .form-group.form-group-sm.label-static label.control-label {
  top: -25px;
  left: 0;
  font-size: 9px;
  line-height: 1.125; }

.form-group.form-group-sm.label-floating input.form-control:-webkit-autofill ~ label.control-label label.control-label {
  top: -25px;
  left: 0;
  font-size: 9px;
  line-height: 1.125; }

.form-group.form-group-lg {
  padding-bottom: 9px;
  margin: 30px 0 0 0; }

.form-group.form-group-lg .form-control {
  margin-bottom: 9px; }

.form-group.form-group-lg .form-control::-moz-placeholder {
  font-size: 18px;
  line-height: 1.3333333;
  color: #BDBDBD;
  font-weight: 400; }

.form-group.form-group-lg .form-control:-ms-input-placeholder {
  font-size: 18px;
  line-height: 1.3333333;
  color: #BDBDBD;
  font-weight: 400; }

.form-group.form-group-lg .form-control::-webkit-input-placeholder {
  font-size: 18px;
  line-height: 1.3333333;
  color: #BDBDBD;
  font-weight: 400; }

.form-group.form-group-lg .checkbox label, .form-group.form-group-lg .radio label, .form-group.form-group-lg label {
  font-size: 18px;
  line-height: 1.3333333;
  color: #BDBDBD;
  font-weight: 400; }

.form-group.form-group-lg label.control-label {
  font-size: 14px;
  line-height: .99999998;
  color: #BDBDBD;
  font-weight: 400;
  margin: 16px 0 0 0; }

.form-group.form-group-lg .help-block {
  margin-top: 0;
  font-size: 14px; }

.form-group.form-group-lg.label-floating label.control-label, .form-group.form-group-lg.label-placeholder label.control-label {
  top: -5px;
  font-size: 18px;
  line-height: 1.3333333; }

.form-group.form-group-lg.label-floating.is-focused label.control-label, .form-group.form-group-lg.label-floating:not(.is-empty) label.control-label, .form-group.form-group-lg.label-static label.control-label {
  top: -32px;
  left: 0;
  font-size: 14px;
  line-height: 0.99999998; }

.form-group.form-group-lg.label-floating input.form-control:-webkit-autofill ~ label.control-label label.control-label {
  top: -32px;
  left: 0;
  font-size: 14px;
  line-height: 0.99999998; }

select.form-control {
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  border-radius: 0; }

.form-group.is-focused select.form-control {
  -webkit-box-shadow: none;
  box-shadow: none;
  border-color: #D2D2D2; }

.form-group.is-focused select.form-control[multiple], select.form-control[multiple] {
  height: 85px; }

.input-group-btn .btn {
  margin: 0 0 7px 0; }

.form-group.form-group-sm .input-group-btn .btn {
  margin: 0 0 3px 0; }

.form-group.form-group-lg .input-group-btn .btn {
  margin: 0 0 9px 0; }

.input-group .input-group-btn {
  padding: 0 12px; }

.input-group .input-group-addon {
  border: 0;
  background: 0 0; }

.form-group input[type=file] {
  opacity: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100; }

.form-horizontal .checkbox, .form-horizontal .checkbox-inline, .form-horizontal .radio, .form-horizontal .radio-inline {
  padding-top: 0; }

.form-horizontal .radio {
  margin-bottom: 10px; }

.form-horizontal label {
  text-align: right; }

.form-horizontal label.control-label {
  margin: 0; }

legend {
  border-bottom: 0; }

.list-group {
  border-radius: 0; }

.list-group .list-group-item {
  background-color: transparent;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  padding: 0 16px; }

.list-group .list-group-item.baseline {
  border-bottom: 1px solid #cecece; }

.list-group .list-group-item.baseline:last-child {
  border-bottom: none; }

.list-group .list-group-item .row-action-primary, .list-group .list-group-item .row-picture {
  display: inline-block;
  padding-right: 16px; }

.list-group .list-group-item .row-action-primary i, .list-group .list-group-item .row-action-primary img, .list-group .list-group-item .row-action-primary label, .list-group .list-group-item .row-picture i, .list-group .list-group-item .row-picture img, .list-group .list-group-item .row-picture label {
  display: block;
  width: 56px;
  height: 56px; }

.list-group .list-group-item .row-action-primary img, .list-group .list-group-item .row-picture img {
  background: rgba(0, 0, 0, 0.1);
  padding: 1px; }

.list-group .list-group-item .row-action-primary img.circle, .list-group .list-group-item .row-picture img.circle {
  border-radius: 100%; }

.list-group .list-group-item .row-action-primary i, .list-group .list-group-item .row-picture i {
  background: rgba(0, 0, 0, 0.25);
  border-radius: 100%;
  text-align: center;
  line-height: 56px;
  font-size: 20px;
  color: #fff; }

.list-group .list-group-item .row-action-primary label, .list-group .list-group-item .row-picture label {
  margin-left: 7px;
  margin-right: -7px;
  margin-top: 5px;
  margin-bottom: -5px; }

.list-group .list-group-item .row-action-primary label .checkbox-material, .list-group .list-group-item .row-picture label .checkbox-material {
  left: -10px; }

.list-group .list-group-item .row-content {
  display: inline-block;
  width: -webkit-calc(100% - 92px);
  width: calc(100% - 92px);
  min-height: 66px; }

.list-group .list-group-item .row-content .action-secondary {
  position: absolute;
  right: 16px;
  top: 16px; }

.list-group .list-group-item .row-content .action-secondary i {
  font-size: 20px;
  color: rgba(0, 0, 0, 0.25);
  cursor: pointer; }

.list-group .list-group-item .row-content .action-secondary ~ * {
  max-width: -webkit-calc(100% - 30px);
  max-width: calc(100% - 30px); }

.list-group .list-group-item .row-content .least-content {
  position: absolute;
  right: 16px;
  top: 0;
  color: rgba(0, 0, 0, 0.54);
  font-size: 14px; }

.list-group .list-group-item .list-group-item-heading {
  color: rgba(0, 0, 0, 0.77);
  font-size: 20px;
  line-height: 29px; }

.list-group .list-group-item.active:focus, .list-group .list-group-item.active:hover {
  background: rgba(0, 0, 0, 0.15);
  outline: 10px solid rgba(0, 0, 0, 0.15); }

.list-group .list-group-item.active .list-group-item-heading, .list-group .list-group-item.active .list-group-item-text {
  color: rgba(0, 0, 0, 0.87); }

.list-group .list-group-separator {
  clear: both;
  overflow: hidden;
  margin-top: 10px;
  margin-bottom: 10px; }

.list-group .list-group-separator:before {
  content: "";
  width: -webkit-calc(100% - 90px);
  width: calc(100% - 90px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  float: right; }

.navbar {
  background-color: #009688;
  border: 0;
  border-radius: 0; }

.navbar .navbar-brand {
  position: relative;
  height: 60px;
  line-height: 30px;
  color: inherit; }

.navbar .navbar-brand:focus, .navbar .navbar-brand:hover {
  color: inherit;
  background-color: transparent; }

.navbar .navbar-text {
  color: inherit;
  margin-top: 20px;
  margin-bottom: 20px; }

.navbar .navbar-nav > li > a {
  color: inherit;
  padding-top: 20px;
  padding-bottom: 20px; }

.navbar .navbar-nav > li > a:focus, .navbar .navbar-nav > li > a:hover {
  color: inherit;
  background-color: transparent; }

.navbar .navbar-nav > .active > a, .navbar .navbar-nav > .active > a:focus, .navbar .navbar-nav > .active > a:hover {
  color: inherit;
  background-color: rgba(255, 255, 255, 0.1); }

.navbar .navbar-nav > .disabled > a, .navbar .navbar-nav > .disabled > a:focus, .navbar .navbar-nav > .disabled > a:hover {
  color: inherit;
  background-color: transparent;
  opacity: 0.9; }

.navbar .navbar-toggle {
  border: 0; }

.navbar .navbar-toggle:focus, .navbar .navbar-toggle:hover {
  background-color: transparent; }

.navbar .navbar-toggle .icon-bar {
  background-color: inherit;
  border: 1px solid; }

.navbar .navbar-default .navbar-toggle, .navbar .navbar-inverse .navbar-toggle {
  border-color: transparent; }

.navbar .navbar-collapse, .navbar .navbar-form {
  border-color: rgba(0, 0, 0, 0.1); }

.navbar .navbar-nav > .open > a, .navbar .navbar-nav > .open > a:focus, .navbar .navbar-nav > .open > a:hover {
  background-color: transparent;
  color: inherit; }

@media (max-width: 767px) {
  .navbar .navbar-nav .navbar-text {
    color: inherit;
    margin-top: 15px;
    margin-bottom: 15px; }

  .navbar .navbar-nav .open .dropdown-menu > .dropdown-header {
    border: 0;
    color: inherit; }

  .navbar .navbar-nav .open .dropdown-menu .divider {
    border-bottom: 1px solid;
    opacity: 0.08; }

  .navbar .navbar-nav .open .dropdown-menu > li > a {
    color: inherit; }

  .navbar .navbar-nav .open .dropdown-menu > li > a:focus, .navbar .navbar-nav .open .dropdown-menu > li > a:hover {
    color: inherit;
    background-color: transparent; }

  .navbar .navbar-nav .open .dropdown-menu > .active > a, .navbar .navbar-nav .open .dropdown-menu > .active > a:focus, .navbar .navbar-nav .open .dropdown-menu > .active > a:hover {
    color: inherit;
    background-color: transparent; }

  .navbar .navbar-nav .open .dropdown-menu > .disabled > a, .navbar .navbar-nav .open .dropdown-menu > .disabled > a:focus, .navbar .navbar-nav .open .dropdown-menu > .disabled > a:hover {
    color: inherit;
    background-color: transparent; } }
.navbar .navbar-link {
  color: inherit; }

.navbar .navbar-link:hover {
  color: inherit; }

.navbar .btn-link {
  color: inherit; }

.navbar .btn-link:focus, .navbar .btn-link:hover {
  color: inherit; }

.navbar .btn-link[disabled]:focus, .navbar .btn-link[disabled]:hover, fieldset[disabled] .navbar .btn-link:focus, fieldset[disabled] .navbar .btn-link:hover {
  color: inherit; }

.navbar .navbar-form {
  margin-top: 16px; }

.navbar .navbar-form .form-group {
  margin: 0;
  padding: 0; }

.navbar .navbar-form .form-group .material-input:before, .navbar .navbar-form .form-group.is-focused .material-input:after {
  background-color: inherit; }

.navbar .navbar-form .form-control, .navbar .navbar-form .form-group .form-control {
  border-color: inherit;
  color: inherit;
  padding: 0;
  margin: 0;
  height: 28px;
  font-size: 14px;
  line-height: 1.42857143; }

.navbar, .navbar.navbar-default {
  background-color: #009688;
  color: rgba(255, 255, 255, 0.84); }

.navbar .navbar-form .form-group input.form-control::-moz-placeholder, .navbar .navbar-form input.form-control::-moz-placeholder, .navbar.navbar-default .navbar-form .form-group input.form-control::-moz-placeholder, .navbar.navbar-default .navbar-form input.form-control::-moz-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar .navbar-form .form-group input.form-control:-ms-input-placeholder, .navbar .navbar-form input.form-control:-ms-input-placeholder, .navbar.navbar-default .navbar-form .form-group input.form-control:-ms-input-placeholder, .navbar.navbar-default .navbar-form input.form-control:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar .navbar-form .form-group input.form-control::-webkit-input-placeholder, .navbar .navbar-form input.form-control::-webkit-input-placeholder, .navbar.navbar-default .navbar-form .form-group input.form-control::-webkit-input-placeholder, .navbar.navbar-default .navbar-form input.form-control::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar .dropdown-menu, .navbar.navbar-default .dropdown-menu {
  border-radius: 2px; }

.navbar .dropdown-menu li > a, .navbar.navbar-default .dropdown-menu li > a {
  font-size: 16px;
  padding: 13px 16px; }

.navbar .dropdown-menu li > a:focus, .navbar .dropdown-menu li > a:hover, .navbar.navbar-default .dropdown-menu li > a:focus, .navbar.navbar-default .dropdown-menu li > a:hover {
  color: #009688;
  background-color: #eee; }

.navbar .dropdown-menu .active > a, .navbar.navbar-default .dropdown-menu .active > a {
  background-color: #009688;
  color: rgba(255, 255, 255, 0.84); }

.navbar .dropdown-menu .active > a:focus, .navbar .dropdown-menu .active > a:hover, .navbar.navbar-default .dropdown-menu .active > a:focus, .navbar.navbar-default .dropdown-menu .active > a:hover {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-inverse {
  background-color: #3f51b5;
  color: #fff; }

.navbar.navbar-inverse .navbar-form .form-group input.form-control::-moz-placeholder, .navbar.navbar-inverse .navbar-form input.form-control::-moz-placeholder {
  color: #fff; }

.navbar.navbar-inverse .navbar-form .form-group input.form-control:-ms-input-placeholder, .navbar.navbar-inverse .navbar-form input.form-control:-ms-input-placeholder {
  color: #fff; }

.navbar.navbar-inverse .navbar-form .form-group input.form-control::-webkit-input-placeholder, .navbar.navbar-inverse .navbar-form input.form-control::-webkit-input-placeholder {
  color: #fff; }

.navbar.navbar-inverse .dropdown-menu {
  border-radius: 2px; }

.navbar.navbar-inverse .dropdown-menu li > a {
  font-size: 16px;
  padding: 13px 16px; }

.navbar.navbar-inverse .dropdown-menu li > a:focus, .navbar.navbar-inverse .dropdown-menu li > a:hover {
  color: #3f51b5;
  background-color: #eee; }

.navbar.navbar-inverse .dropdown-menu .active > a {
  background-color: #3f51b5;
  color: #fff; }

.navbar.navbar-inverse .dropdown-menu .active > a:focus, .navbar.navbar-inverse .dropdown-menu .active > a:hover {
  color: #fff; }

.navbar.navbar-primary {
  background-color: #009688;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-primary .navbar-form .form-group input.form-control::-moz-placeholder, .navbar.navbar-primary .navbar-form input.form-control::-moz-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-primary .navbar-form .form-group input.form-control:-ms-input-placeholder, .navbar.navbar-primary .navbar-form input.form-control:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-primary .navbar-form .form-group input.form-control::-webkit-input-placeholder, .navbar.navbar-primary .navbar-form input.form-control::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-primary .dropdown-menu {
  border-radius: 2px; }

.navbar.navbar-primary .dropdown-menu li > a {
  font-size: 16px;
  padding: 13px 16px; }

.navbar.navbar-primary .dropdown-menu li > a:focus, .navbar.navbar-primary .dropdown-menu li > a:hover {
  color: #009688;
  background-color: #eee; }

.navbar.navbar-primary .dropdown-menu .active > a {
  background-color: #009688;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-primary .dropdown-menu .active > a:focus, .navbar.navbar-primary .dropdown-menu .active > a:hover {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-success {
  background-color: #4caf50;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-success .navbar-form .form-group input.form-control::-moz-placeholder, .navbar.navbar-success .navbar-form input.form-control::-moz-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-success .navbar-form .form-group input.form-control:-ms-input-placeholder, .navbar.navbar-success .navbar-form input.form-control:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-success .navbar-form .form-group input.form-control::-webkit-input-placeholder, .navbar.navbar-success .navbar-form input.form-control::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-success .dropdown-menu {
  border-radius: 2px; }

.navbar.navbar-success .dropdown-menu li > a {
  font-size: 16px;
  padding: 13px 16px; }

.navbar.navbar-success .dropdown-menu li > a:focus, .navbar.navbar-success .dropdown-menu li > a:hover {
  color: #4caf50;
  background-color: #eee; }

.navbar.navbar-success .dropdown-menu .active > a {
  background-color: #4caf50;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-success .dropdown-menu .active > a:focus, .navbar.navbar-success .dropdown-menu .active > a:hover {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-info {
  background-color: #03a9f4;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-info .navbar-form .form-group input.form-control::-moz-placeholder, .navbar.navbar-info .navbar-form input.form-control::-moz-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-info .navbar-form .form-group input.form-control:-ms-input-placeholder, .navbar.navbar-info .navbar-form input.form-control:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-info .navbar-form .form-group input.form-control::-webkit-input-placeholder, .navbar.navbar-info .navbar-form input.form-control::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-info .dropdown-menu {
  border-radius: 2px; }

.navbar.navbar-info .dropdown-menu li > a {
  font-size: 16px;
  padding: 13px 16px; }

.navbar.navbar-info .dropdown-menu li > a:focus, .navbar.navbar-info .dropdown-menu li > a:hover {
  color: #03a9f4;
  background-color: #eee; }

.navbar.navbar-info .dropdown-menu .active > a {
  background-color: #03a9f4;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-info .dropdown-menu .active > a:focus, .navbar.navbar-info .dropdown-menu .active > a:hover {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-warning {
  background-color: #ff5722;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-warning .navbar-form .form-group input.form-control::-moz-placeholder, .navbar.navbar-warning .navbar-form input.form-control::-moz-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-warning .navbar-form .form-group input.form-control:-ms-input-placeholder, .navbar.navbar-warning .navbar-form input.form-control:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-warning .navbar-form .form-group input.form-control::-webkit-input-placeholder, .navbar.navbar-warning .navbar-form input.form-control::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-warning .dropdown-menu {
  border-radius: 2px; }

.navbar.navbar-warning .dropdown-menu li > a {
  font-size: 16px;
  padding: 13px 16px; }

.navbar.navbar-warning .dropdown-menu li > a:focus, .navbar.navbar-warning .dropdown-menu li > a:hover {
  color: #ff5722;
  background-color: #eee; }

.navbar.navbar-warning .dropdown-menu .active > a {
  background-color: #ff5722;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-warning .dropdown-menu .active > a:focus, .navbar.navbar-warning .dropdown-menu .active > a:hover {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-danger {
  background-color: #f44336;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-danger .navbar-form .form-group input.form-control::-moz-placeholder, .navbar.navbar-danger .navbar-form input.form-control::-moz-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-danger .navbar-form .form-group input.form-control:-ms-input-placeholder, .navbar.navbar-danger .navbar-form input.form-control:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-danger .navbar-form .form-group input.form-control::-webkit-input-placeholder, .navbar.navbar-danger .navbar-form input.form-control::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-danger .dropdown-menu {
  border-radius: 2px; }

.navbar.navbar-danger .dropdown-menu li > a {
  font-size: 16px;
  padding: 13px 16px; }

.navbar.navbar-danger .dropdown-menu li > a:focus, .navbar.navbar-danger .dropdown-menu li > a:hover {
  color: #f44336;
  background-color: #eee; }

.navbar.navbar-danger .dropdown-menu .active > a {
  background-color: #f44336;
  color: rgba(255, 255, 255, 0.84); }

.navbar.navbar-danger .dropdown-menu .active > a:focus, .navbar.navbar-danger .dropdown-menu .active > a:hover {
  color: rgba(255, 255, 255, 0.84); }

.navbar-inverse {
  background-color: #3f51b5; }

@media (max-width: 1199px) {
  .navbar .navbar-brand {
    height: 50px;
    padding: 10px 15px; }

  .navbar .navbar-form {
    margin-top: 10px; }

  .navbar .navbar-nav > li > a {
    padding-top: 15px;
    padding-bottom: 15px; } }
.dropdown-menu {
  border: 0;
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }

.dropdown-menu .divider {
  background-color: rgba(229, 229, 229, 0.12); }

.dropdown-menu li {
  overflow: hidden;
  position: relative; }

.dropdown-menu li a:hover {
  background-color: transparent;
  color: #009688; }

.alert {
  border: 0;
  border-radius: 0; }

.alert, .alert.alert-default {
  background-color: rgba(255, 255, 255, 0.84);
  color: rgba(255, 255, 255, 0.84); }

.alert .alert-link, .alert a, .alert.alert-default .alert-link, .alert.alert-default a {
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-inverse {
  background-color: #3f51b5;
  color: #fff; }

.alert.alert-inverse .alert-link, .alert.alert-inverse a {
  color: #fff; }

.alert.alert-primary {
  background-color: #009688;
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-primary .alert-link, .alert.alert-primary a {
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-success {
  background-color: #4caf50;
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-success .alert-link, .alert.alert-success a {
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-info {
  background-color: #03a9f4;
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-info .alert-link, .alert.alert-info a {
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-warning {
  background-color: #ff5722;
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-warning .alert-link, .alert.alert-warning a {
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-danger {
  background-color: #f44336;
  color: rgba(255, 255, 255, 0.84); }

.alert.alert-danger .alert-link, .alert.alert-danger a {
  color: rgba(255, 255, 255, 0.84); }

.alert-danger, .alert-info, .alert-success, .alert-warning {
  color: rgba(255, 255, 255, 0.84); }

.alert-default .alert-link, .alert-default a {
  color: rgba(0, 0, 0, 0.87); }

.progress-wrapper {
  margin-bottom: 30px; }
  .progress-wrapper .progress {
    margin-bottom: 10px; }
    @media (max-width: 767px) {
      .progress-wrapper .progress {
        height: 10px; } }
  .progress-wrapper .progress-text {
    font-size: 21px;
    font-weight: 700; }
    @media (max-width: 767px) {
      .progress-wrapper .progress-text {
        font-size: 10px; } }

.progress {
  -webkit-box-shadow: none;
  box-shadow: none;
  background: #c8c8c8;
  border-radius: 50px; }

.progress .progress-bar {
  -webkit-box-shadow: none;
  box-shadow: none; }

.progress .progress-bar, .progress .progress-bar.progress-bar-default {
  background-color: #009688; }

.progress .progress-bar.progress-bar-inverse {
  background-color: #3f51b5; }

.progress .progress-bar.progress-bar-primary {
  background-color: #009688; }

.progress .progress-bar.progress-bar-success {
  background-color: #4caf50; }

.progress .progress-bar.progress-bar-info {
  background-color: #03a9f4; }

.progress .progress-bar.progress-bar-warning {
  background-color: #ff5722; }

.progress .progress-bar.progress-bar-danger {
  background-color: #f44336; }

.text-warning {
  color: #ff5722; }

.text-primary {
  color: #009688; }

.text-danger {
  color: #f44336; }

.text-success {
  color: #4caf50; }

.text-info {
  color: #03a9f4; }

.nav-tabs {
  background: #009688; }

.nav-tabs > li > a {
  color: #FFF;
  border: 0;
  margin: 0; }

.nav-tabs > li > a:hover {
  background-color: transparent;
  border: 0; }

.nav-tabs > li > a, .nav-tabs > li > a:focus, .nav-tabs > li > a:hover {
  background-color: transparent !important;
  border: 0 !important;
  color: #FFF !important;
  font-weight: 500; }

.nav-tabs > li.disabled > a, .nav-tabs > li.disabled > a:hover {
  color: rgba(255, 255, 255, 0.5); }

.popover, .tooltip-inner {
  color: #ececec;
  line-height: 1em;
  background: rgba(101, 101, 101, 0.9);
  border: none;
  border-radius: 2px;
  -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12); }

.tooltip, .tooltip.in {
  opacity: 1; }

.popover .arrow, .popover .tooltip-arrow, .tooltip .arrow, .tooltip .tooltip-arrow {
  display: none; }

.card {
  display: inline-block;
  position: relative;
  width: 100%;
  border-radius: 2px;
  color: rgba(0, 0, 0, 0.87);
  background: #fff;
  -webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }

.card .card-height-indicator {
  margin-top: 100%; }

.card .card-content {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0; }

.card .card-image {
  height: 60%;
  position: relative;
  overflow: hidden; }

.card .card-image img {
  width: 100%;
  height: 100%;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  pointer-events: none; }

.card .card-image .card-image-headline {
  position: absolute;
  bottom: 16px;
  left: 18px;
  color: #fff;
  font-size: 2em; }

.card .card-body {
  height: 30%;
  padding: 18px; }

.card .card-footer {
  height: 10%;
  padding: 18px; }

.card .card-footer button {
  margin: 0 !important;
  position: relative;
  bottom: 25px;
  width: auto; }

.card .card-footer button:first-child {
  left: -15px; }

.modal-content {
  -webkit-box-shadow: 0 27px 24px 0 rgba(0, 0, 0, 0.2), 0 40px 77px 0 rgba(0, 0, 0, 0.22);
  box-shadow: 0 27px 24px 0 rgba(0, 0, 0, 0.2), 0 40px 77px 0 rgba(0, 0, 0, 0.22);
  border-radius: 2px;
  border: none; }

.modal-content .modal-header {
  border-bottom: none;
  padding-top: 24px;
  padding-right: 24px;
  padding-bottom: 0;
  padding-left: 24px; }

.modal-content .modal-body {
  padding-top: 24px;
  padding-right: 24px;
  padding-bottom: 16px;
  padding-left: 24px; }

.modal-content .modal-footer {
  border-top: none;
  padding: 7px; }

.modal-content .modal-footer button.pull-left {
  padding-left: 5px;
  padding-right: 5px;
  position: relative;
  left: -5px; }

.modal-content .modal-footer button + button {
  margin-bottom: 16px; }

.modal-backdrop {
  background: rgba(0, 0, 0, 0.3); }

hr.on-dark {
  color: #1a1a1a; }

hr.on-light {
  color: #fff; }

@media (-webkit-min-device-pixel-ratio: 0.75), (min--moz-device-pixel-ratio: 0.75), (-o-device-pixel-ratio: 3 / 4), (min-device-pixel-ratio: 0.75), (-o-min-device-pixel-ratio: 3 / 4), (min-resolution: 0.75dppx), (-webkit-min-device-pixel-ratio: 1.25), (-o-min-device-pixel-ratio: 5 / 4), (min-resolution: 120dpi) {
  hr {
    height: 0.75px; } }
@media (-webkit-min-device-pixel-ratio: 1), (min--moz-device-pixel-ratio: 1), (-o-device-pixel-ratio: 1), (min-device-pixel-ratio: 1), (-o-min-device-pixel-ratio: 1 / 1), (min-resolution: 1dppx), (-webkit-min-device-pixel-ratio: 1.6666666667), (-o-min-device-pixel-ratio: 5 / 3), (min-resolution: 160dpi) {
  hr {
    height: 1px; } }
@media (-webkit-min-device-pixel-ratio: 1.33), (min--moz-device-pixel-ratio: 1.33), (-o-device-pixel-ratio: 133 / 100), (min-device-pixel-ratio: 1.33), (-o-min-device-pixel-ratio: 133 / 100), (min-resolution: 1.33dppx), (-webkit-min-device-pixel-ratio: 2.21875), (-o-min-device-pixel-ratio: 71 / 32), (min-resolution: 213dpi) {
  hr {
    height: 1.33px; } }
@media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-device-pixel-ratio: 3 / 2), (min-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3 / 2), (min-resolution: 1.5dppx), (-webkit-min-device-pixel-ratio: 2.5), (-o-min-device-pixel-ratio: 5 / 2), (min-resolution: 240dpi) {
  hr {
    height: 1.5px; } }
@media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (-o-device-pixel-ratio: 2 / 1), (min-device-pixel-ratio: 2), (-o-min-device-pixel-ratio: 2 / 1), (min-resolution: 2dppx), (-webkit-min-device-pixel-ratio: 3.9583333333), (-o-min-device-pixel-ratio: 95 / 24), (min-resolution: 380dpi) {
  hr {
    height: 2px; } }
@media (-webkit-min-device-pixel-ratio: 3), (min--moz-device-pixel-ratio: 3), (-o-device-pixel-ratio: 3 / 1), (min-device-pixel-ratio: 3), (-o-min-device-pixel-ratio: 3 / 1), (min-resolution: 3dppx), (-webkit-min-device-pixel-ratio: 5), (-o-min-device-pixel-ratio: 5 / 1), (min-resolution: 480dpi) {
  hr {
    height: 3px; } }
@media (-webkit-min-device-pixel-ratio: 4), (min--moz-device-pixel-ratio: 4), (-o-device-pixel-ratio: 4 / 1), (min-device-pixel-ratio: 3), (-o-min-device-pixel-ratio: 4 / 1), (min-resolution: 4dppx), (-webkit-min-device-pixel-ratio: 6.6666666667), (-o-min-device-pixel-ratio: 20 / 3), (min-resolution: 640dpi) {
  hr {
    height: 4px; } }
* {
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  -webkit-tap-highlight-color: transparent; }

:focus {
  outline: 0; }

.snackbar {
  background-color: #323232;
  color: rgba(255, 255, 255, 0.84);
  font-size: 14px;
  border-radius: 2px;
  -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
  height: 0;
  -webkit-transition: -webkit-transform .2s ease-in-out, opacity .2s ease-in, height 0 linear .2s, padding 0 linear .2s, height 0 linear .2s;
  -o-transition: -o-transform .2s ease-in-out, opacity .2s ease-in, height 0 linear .2s, padding 0 linear .2s, height 0 linear .2s;
  transition: transform .2s ease-in-out, opacity .2s ease-in, height 0 linear .2s, padding 0 linear .2s, height 0 linear .2s;
  -webkit-transform: translateY(200%);
  -ms-transform: translateY(200%);
  -o-transform: translateY(200%);
  transform: translateY(200%); }

.snackbar.snackbar-opened {
  padding: 14px 15px;
  margin-bottom: 20px;
  height: auto;
  -webkit-transition: -webkit-transform .2s ease-in-out, opacity .2s ease-in, height 0 linear .2s, height 0 linear .2s;
  -o-transition: -o-transform .2s ease-in-out, opacity .2s ease-in, height 0 linear .2s, height 0 linear .2s;
  transition: transform .2s ease-in-out, opacity .2s ease-in, height 0 linear .2s, height 0 linear .2s;
  -webkit-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none; }

.snackbar.toast {
  border-radius: 200px; }

.noUi-target, .noUi-target * {
  -webkit-touch-callout: none;
  -ms-touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.noUi-base {
  width: 100%;
  height: 100%;
  position: relative; }

.noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0; }

.noUi-handle {
  position: relative;
  z-index: 1;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.noUi-stacking .noUi-handle {
  z-index: 10; }

.noUi-state-tap .noUi-origin {
  -webkit-transition: left .3s, top .3s;
  -o-transition: left .3s, top .3s;
  transition: left 0.3s, top 0.3s; }

.noUi-state-drag * {
  cursor: inherit !important; }

.noUi-horizontal {
  height: 10px; }

.noUi-handle {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  left: -10px;
  top: -5px;
  cursor: ew-resize;
  border-radius: 100%;
  -webkit-transition: all .2s ease-out;
  -o-transition: all .2s ease-out;
  transition: all .2s ease-out;
  border: 1px solid; }

.noUi-vertical .noUi-handle {
  margin-left: 5px;
  cursor: ns-resize; }

.noUi-horizontal.noUi-extended {
  padding: 0 15px; }

.noUi-horizontal.noUi-extended .noUi-origin {
  right: -15px; }

.noUi-background {
  height: 2px;
  margin: 20px 0; }

.noUi-origin {
  margin: 0;
  border-radius: 0;
  height: 2px;
  background: #c8c8c8; }

.noUi-origin[style^="left: 0"] .noUi-handle {
  background-color: #fff;
  border: 2px solid #c8c8c8; }

.noUi-origin[style^="left: 0"] .noUi-handle.noUi-active {
  border-width: 1px; }

.noUi-target {
  border-radius: 2px; }

.noUi-horizontal {
  height: 2px;
  margin: 15px 0; }

.noUi-vertical {
  height: 100%;
  width: 2px;
  margin: 0 15px;
  display: inline-block; }

.noUi-handle.noUi-active {
  -webkit-transform: scale3d(2.5, 2.5, 1);
  transform: scale3d(2.5, 2.5, 1); }

[disabled].noUi-slider {
  opacity: 0.5; }

[disabled] .noUi-handle {
  cursor: not-allowed; }

.slider {
  background: #c8c8c8; }

.slider.noUi-connect, .slider.slider-default.noUi-connect {
  background-color: #009688; }

.slider.slider-inverse.noUi-connect {
  background-color: #3f51b5; }

.slider.slider-primary.noUi-connect {
  background-color: #009688; }

.slider.slider-success.noUi-connect {
  background-color: #4caf50; }

.slider.slider-info.noUi-connect {
  background-color: #03a9f4; }

.slider.slider-warning.noUi-connect {
  background-color: #ff5722; }

.slider.slider-danger.noUi-connect {
  background-color: #f44336; }

.slider .noUi-connect, .slider.slider-default .noUi-connect {
  background-color: #009688; }

.slider.slider-inverse .noUi-connect {
  background-color: #3f51b5; }

.slider.slider-primary .noUi-connect {
  background-color: #009688; }

.slider.slider-success .noUi-connect {
  background-color: #4caf50; }

.slider.slider-info .noUi-connect {
  background-color: #03a9f4; }

.slider.slider-warning .noUi-connect {
  background-color: #ff5722; }

.slider.slider-danger .noUi-connect {
  background-color: #f44336; }

.slider .noUi-handle, .slider.slider-default .noUi-handle {
  background-color: #009688; }

.slider.slider-inverse .noUi-handle {
  background-color: #3f51b5; }

.slider.slider-primary .noUi-handle {
  background-color: #009688; }

.slider.slider-success .noUi-handle {
  background-color: #4caf50; }

.slider.slider-info .noUi-handle {
  background-color: #03a9f4; }

.slider.slider-warning .noUi-handle {
  background-color: #ff5722; }

.slider.slider-danger .noUi-handle {
  background-color: #f44336; }

.slider .noUi-handle, .slider.slider-default .noUi-handle {
  border-color: #009688; }

.slider.slider-inverse .noUi-handle {
  border-color: #3f51b5; }

.slider.slider-primary .noUi-handle {
  border-color: #009688; }

.slider.slider-success .noUi-handle {
  border-color: #4caf50; }

.slider.slider-info .noUi-handle {
  border-color: #03a9f4; }

.slider.slider-warning .noUi-handle {
  border-color: #ff5722; }

.slider.slider-danger .noUi-handle {
  border-color: #f44336; }

.selectize-control.multi, .selectize-control.single {
  padding: 0; }

.selectize-control.multi .selectize-input, .selectize-control.multi .selectize-input.input-active, .selectize-control.single .selectize-input, .selectize-control.single .selectize-input.input-active {
  cursor: text;
  background: 0 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 0;
  padding: 0;
  height: 100%;
  font-size: 14px;
  line-height: 30px; }

.selectize-control.multi .selectize-input .has-items, .selectize-control.multi .selectize-input.input-active .has-items, .selectize-control.single .selectize-input .has-items, .selectize-control.single .selectize-input.input-active .has-items {
  padding: 0; }

.selectize-control.multi .selectize-input.input-active:after, .selectize-control.multi .selectize-input:after, .selectize-control.single .selectize-input.input-active:after, .selectize-control.single .selectize-input:after {
  right: 5px;
  position: absolute;
  font-size: 7px;
  content: "\e894";
  font-family: Material-Design-Icons;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 4;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.selectize-control.multi .selectize-input input, .selectize-control.multi .selectize-input.input-active input, .selectize-control.single .selectize-input input, .selectize-control.single .selectize-input.input-active input {
  font-size: 14px;
  outline: 0;
  border: 0;
  background: 0 0; }

.selectize-control.multi .selectize-input.input-active.label-floating-fix input, .selectize-control.multi .selectize-input.label-floating-fix input, .selectize-control.single .selectize-input.input-active.label-floating-fix input, .selectize-control.single .selectize-input.label-floating-fix input {
  opacity: 0; }

.selectize-control.multi .selectize-input.input-active > .item, .selectize-control.multi .selectize-input.input-active > div, .selectize-control.multi .selectize-input > .item, .selectize-control.multi .selectize-input > div, .selectize-control.single .selectize-input.input-active > .item, .selectize-control.single .selectize-input.input-active > div, .selectize-control.single .selectize-input > .item, .selectize-control.single .selectize-input > div {
  display: inline-block;
  margin: 0 8px 3px 0;
  padding: 0;
  background: 0 0;
  border: 0; }

.selectize-control.multi .selectize-input.input-active > .item:after, .selectize-control.multi .selectize-input.input-active > div:after, .selectize-control.multi .selectize-input > .item:after, .selectize-control.multi .selectize-input > div:after, .selectize-control.single .selectize-input.input-active > .item:after, .selectize-control.single .selectize-input.input-active > div:after, .selectize-control.single .selectize-input > .item:after, .selectize-control.single .selectize-input > div:after {
  content: ","; }

.selectize-control.multi .selectize-input.input-active > .item:last-of-type:after, .selectize-control.multi .selectize-input.input-active > div:last-of-type:after, .selectize-control.multi .selectize-input > .item:last-of-type:after, .selectize-control.multi .selectize-input > div:last-of-type:after, .selectize-control.single .selectize-input.input-active > .item:last-of-type:after, .selectize-control.single .selectize-input.input-active > div:last-of-type:after, .selectize-control.single .selectize-input > .item:last-of-type:after, .selectize-control.single .selectize-input > div:last-of-type:after {
  content: ""; }

.selectize-control.multi .selectize-input.input-active > .item.active, .selectize-control.multi .selectize-input.input-active > div.active, .selectize-control.multi .selectize-input > .item.active, .selectize-control.multi .selectize-input > div.active, .selectize-control.single .selectize-input.input-active > .item.active, .selectize-control.single .selectize-input.input-active > div.active, .selectize-control.single .selectize-input > .item.active, .selectize-control.single .selectize-input > div.active {
  font-weight: 700;
  background: 0 0;
  border: 0; }

.selectize-control.multi .selectize-dropdown, .selectize-control.single .selectize-dropdown {
  position: absolute;
  z-index: 1000;
  border: 0;
  width: 100% !important;
  left: 0 !important;
  height: auto;
  background-color: #FFF;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  border-radius: 2px;
  padding: 0;
  margin-top: 3px; }

.selectize-control.multi .selectize-dropdown .active, .selectize-control.single .selectize-dropdown .active {
  background-color: inherit; }

.selectize-control.multi .selectize-dropdown .highlight, .selectize-control.single .selectize-dropdown .highlight {
  background-color: #d5d8ff; }

.selectize-control.multi .selectize-dropdown .selected, .selectize-control.multi .selectize-dropdown .selected.active, .selectize-control.single .selectize-dropdown .selected, .selectize-control.single .selectize-dropdown .selected.active {
  background-color: #EEE; }

.selectize-control.multi .selectize-dropdown .optgroup-header, .selectize-control.multi .selectize-dropdown [data-selectable], .selectize-control.single .selectize-dropdown .optgroup-header, .selectize-control.single .selectize-dropdown [data-selectable] {
  padding: 10px 20px;
  cursor: pointer; }

.selectize-control.multi .dropdown-active ~ .selectize-dropdown, .selectize-control.single .dropdown-active ~ .selectize-dropdown {
  display: block; }

.dropdownjs:after {
  right: 5px;
  top: 3px;
  font-size: 25px;
  position: absolute;
  content: "\e8ac";
  font-family: Material-Design-Icons;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  pointer-events: none;
  color: #757575; }

.withripple {
  position: relative; }

.ripple-container {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: inherit;
  pointer-events: none; }

.ripple {
  position: absolute;
  width: 20px;
  height: 20px;
  margin-left: -10px;
  margin-top: -10px;
  border-radius: 100%;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.05);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transform-origin: 50%;
  -ms-transform-origin: 50%;
  -o-transform-origin: 50%;
  transform-origin: 50%;
  opacity: 0;
  pointer-events: none; }

.ripple.ripple-on {
  -webkit-transition: opacity 0.15s ease-in 0s, -webkit-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
  -o-transition: opacity 0.15s ease-in 0s, -o-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
  transition: opacity 0.15s ease-in 0s, transform 0.5s cubic-bezier(0.4, 0, 0.2, 1) 0.1s;
  opacity: .1; }

.ripple.ripple-out {
  -webkit-transition: opacity 0.1s linear 0s !important;
  -o-transition: opacity 0.1s linear 0s !important;
  transition: opacity 0.1s linear 0s !important;
  opacity: 0; }

.bg-triangle {
  background-image: url("../images/background/bg-triangle.jpg"); }
  @media (max-width: 767px) {
    .bg-triangle {
      background-size: 120px auto; } }

.bg-triangle-light {
  background-image: url("../images/background/bg-triangle-light.jpg"); }
  @media (max-width: 767px) {
    .bg-triangle-light {
      background-size: 120px auto; } }

.bg-triangle-blue {
  background-image: url("../images/background/bg-triangle-blue.jpg"); }
  @media (max-width: 767px) {
    .bg-triangle-blue {
      background-size: 120px auto; } }

.bg-triangle-yellow-light {
  background-image: url("../images/background/bg-triangle-yellow-light.jpg"); }
  @media (max-width: 767px) {
    .bg-triangle-yellow-light {
      background-size: 120px auto; } }

.bg-shining-yellow {
  position: relative;
  background: #f3d102; }
  .bg-shining-yellow .bg-inner {
    height: 100%;
    background: url("../images/background/bg-shining-yellow.jpg") left top no-repeat;
    background-size: 100% auto; }
    @media (max-width: 767px) {
      .bg-shining-yellow .bg-inner {
        background-size: 160% auto;
        background-position: center top; } }

.bg-gray {
  background-color: #f4f4f4; }

.bg-green {
  background-color: #54dfaa; }
  .bg-green.bg-subject {
    background-color: #a6fada; }

.bg-blue {
  background-color: #51d1ea; }
  .bg-blue.bg-subject {
    background-color: #a8c2fb; }

.bg-light-blue {
  background-color: #3bdfff; }
  .bg-light-blue.bg-subject {
    background-color: #a4e8f5; }

.bg-violet {
  background-color: #82a3ea; }
  .bg-violet.bg-subject {
    background-color: #9fb9f4; }

.bg-orange {
  background-color: #ffa32f; }
  .bg-orange.bg-subject {
    background-color: #ffc77f; }

.bg-white {
  background-color: #fff; }

.bg-light-yellow {
  background-color: #ffffc6; }

.bg-yellow {
  background-color: #f4c000; }
  .bg-yellow.bg-subject {
    background-color: #f7e677; }

.bg-pink {
  background-color: #ff7e7e; }
  .bg-pink.bg-subject {
    background-color: #f7b6b6; }

.bg-light-pink {
  background-color: #ff7e7e; }
  .bg-light-pink.bg-subject {
    background-color: #f7b6b6; }

.bg-brown {
  background-color: #d8a84c; }
  .bg-brown.bg-subject {
    background-color: #f4e3c2; }

.bg-purple {
  background-color: #8e24aa; }
  .bg-purple.bg-subject {
    background-color: #CEAFF4; }

.bg-yellow {
  background-color: #fffd3c; }

.bg-transparent {
  background-color: transparent !important;
  border: 0 !important; }

.hexagon-img {
  width: 86px;
  margin-left: -22px; }
  .hexagon-img img {
    width: 100%;
    height: auto; }
  @media (max-width: 767px) {
    .hexagon-img {
      width: 52px;
      margin-left: -15px; } }

input::-webkit-input-placeholder {
  line-height: normal; }
input::-moz-placeholder {
  line-height: normal; }
input:-ms-input-placeholder {
  line-height: normal; }

.form-horizontal {
  margin-bottom: 100px; }
  .content-frame .form-horizontal {
    margin-bottom: 0; }
  .form-horizontal label.control-label {
    line-height: 1.5;
    display: block;
    font-size: 18px;
    color: #2d3940;
    font-weight: 700; }
    .form-horizontal label.control-label.text-left {
      text-align: left; }
    .form-horizontal label.control-label.text-center {
      text-align: center; }
    @media (min-width: 768px) {
      .form-horizontal label.control-label {
        padding-top: 8px; } }
  .form-horizontal .current-value {
    display: table-cell;
    vertical-align: middle;
    font-size: 18px;
    color: #2d3940;
    font-weight: bold;
    padding-top: 9px;
    padding-bottom: 9px; }
    .form-horizontal .current-value .small {
      font-size: 14px; }

.radiocheckbox-img-wrap {
  margin-bottom: 20px;
  text-align: center; }
  .radiocheckbox-img-wrap .radiocheckbox-img {
    margin-top: 10px; }
    .radiocheckbox-img-wrap .radiocheckbox-img img {
      max-width: 100%; }

.result-box {
  height: 490px;
  overflow-y: scroll;
  padding: 15px 40px;
  border: 1px solid #d2d2d2; }
  .result-box .radio label {
    text-align: left; }
  .result-box .no-item {
    height: 100%; }
    .result-box .no-item .box {
      height: auto;
      padding-top: 60px; }
  @media (max-width: 767px) {
    .result-box {
      height: 360px;
      padding: 25px 20px; } }

.form-caption {
  font-size: 20px;
  color: #2d3940;
  margin-top: 0;
  margin-bottom: 30px;
  text-align: center; }

.form-group:before, .form-group:after {
  content: " ";
  display: table; }
.form-group:after {
  clear: both; }

.selectbox-parent .form-group {
  margin: 0; }

.form-steps {
  position: relative;
  z-index: 3;
  text-align: center;
  margin-bottom: 15px; }
  @media (max-width: 991px) {
    .form-steps {
      margin-bottom: 0; } }
  .form-steps ul {
    counter-reset: section;
    display: inline-block; }
    .form-steps ul:before, .form-steps ul:after {
      content: " ";
      display: table; }
    .form-steps ul:after {
      clear: both; }
  .form-steps li {
    width: 130px;
    height: 130px;
    border: 5px solid #82d9ed;
    border-radius: 50%;
    background-color: #fff;
    text-align: center;
    float: left;
    color: #3e8093;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    position: relative;
    padding-top: 65px;
    line-height: 18px; }
    .form-steps li:before {
      content: 'Step';
      color: #24a6cc;
      font-size: 10px;
      position: absolute;
      top: 5px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%); }
    .form-steps li:after {
      counter-increment: section;
      content: counter(section);
      font-family: Arial, sans-serif;
      color: #24a6cc;
      font-size: 38px;
      position: absolute;
      top: 28px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%); }
    .form-steps li:nth-child(2), .form-steps li:nth-child(3) {
      padding-top: 60px; }
    .form-steps li.active {
      border: 5px solid #e2e036;
      background-color: #fffd3b; }
    .form-steps li + li {
      margin-left: 50px; }
    @media (max-width: 991px) {
      .form-steps li + li {
        margin-left: 20px; } }
    @media (max-width: 767px) {
      .form-steps li {
        margin-bottom: 20px;
        width: 106px;
        height: 106px;
        font-size: 13px;
        line-height: 13px;
        padding-top: 60px; }
        .form-steps li:nth-child(3) {
          clear: both;
          margin-left: 0; }
        .form-steps li:nth-child(2), .form-steps li:nth-child(3) {
          padding-top: 55px; } }

@media (max-width: 767px) {
  .form-title .h2 {
    font-size: 20px; }
  .form-title .h4 {
    font-size: 16px; } }

.links-group {
  font-size: 14px;
  margin-top: -20px;
  margin-bottom: -10px; }
  .links-group li {
    padding: 0 15px;
    display: inline-block; }

.select-box {
  position: relative; }
  .select-box:before, .select-box:after {
    content: '';
    display: block !important;
    position: absolute;
    width: 0;
    height: 0;
    right: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent; }
  .select-box:before {
    border-bottom: 10px solid #333;
    top: 0; }
  .select-box:after {
    border-top: 10px solid #333;
    top: 15px; }

/*.avatar-radio {
  -webkit-touch-callout: none; !* iOS Safari *!
  -webkit-user-select: none; !* Chrome/Safari/Opera *!
  -khtml-user-select: none; !* Konqueror *!
  -moz-user-select: none; !* Firefox *!
  -ms-user-select: none; !* IE/Edge *!
  user-select: none;

  input[type="radio"] {
    display: block;
    overflow: hidden;
    visibility: hidden;
    &:checked + img {
      display: none;
    }
    &:checked + img + img.selected {
      display: block !important;
    }
  }

  label {
    display: inline-block;
    img {
      pointer-events: none;
    }
  }
  .selected {
    display: none;
  }
}*/
.toggleShowPassword {
  display: inline-block;
  position: relative;
  cursor: pointer;
  float: right;
  height: 0;
  width: 0;
  z-index: 2; }
  .toggleShowPassword:before {
    position: absolute;
    bottom: -25px;
    right: 0; }

.form-message .message-block {
  padding: 0px 7px 0px 0px; }
.form-message .button-block {
  padding: 0px;
  height: 88px; }
  @media (max-width: 767px) {
    .form-message .button-block {
      height: 44px; } }
.form-message .message-area {
  height: 88px;
  border: none;
  resize: none;
  border-radius: 4px; }
.form-message .btn-send {
  background-color: #fffd3c !important;
  height: 100%;
  padding: 3px 9px;
  border: 3px solid #a0d8e8 !important;
  margin: 0px;
  width: 100%; }
  @media (max-width: 767px) {
    .form-message .btn-send {
      font-size: 13px; } }
.form-message .message-area {
  width: 100%;
  padding: 10px; }
  @media (max-width: 767px) {
    .form-message .message-area {
      height: 44px; } }

.dis-bl {
  display: block !important; }

.dis-inbl {
  display: inline-block !important; }

.dis-in {
  display: inline !important; }

@media (min-width: 768px) {
  .dis-bl-sm {
    display: block !important; }

  .dis-inbl-sm {
    display: inline-block !important; }

  .dis-in-sm {
    display: inline !important; } }
@media (min-width: 992px) {
  .dis-bl-md {
    display: block !important; }

  .dis-inbl-md {
    display: inline-block !important; }

  .dis-in-md {
    display: inline !important; } }
@media (min-width: 1200px) {
  .dis-bl-lg {
    display: block !important; }

  .dis-inbl-lg {
    display: inline-block !important; }

  .dis-in-lg {
    display: inline !important; } }
.btn {
  max-width: 100%; }
  .btn:focus, .btn.focus, .btn:active:focus, .btn:active.focus, .btn.active:focus, .btn.active.focus {
    outline: 0 none !important; }
  .btn:hover, .btn:focus, .btn.focus {
    outline: 0 none !important; }

/*Color*/
.btn, .btn:not(.btn-raised) {
  color: #3e8093;
  border-radius: 4px;
  font-weight: 700;
  text-transform: none;
  background-color: #fff;
  border: 3px solid #ababab; }
.btn.btn-green {
  background-color: #00bf9d;
  border: 3px solid #00bf9d;
  color: #fff; }
.btn.btn-dark-blue {
  background-color: #3eaae2;
  border: 0;
  border-bottom: 3px solid #3290bf;
  color: #fff;
  font-weight: normal; }
.btn.btn-light-green {
  background-color: #0ee085;
  border: 3px solid #0ee085;
  color: #fff; }
.btn.btn-blue {
  background-color: #729bf3;
  border: 3px solid #729bf3;
  color: #fff; }
.btn.btn-violet {
  background-color: #82a3ea;
  border: 3px solid #82a3ea;
  color: #fff; }
.btn.btn-light-blue {
  background-color: #6ecbe6;
  border: 3px solid #6ecbe6;
  color: #fff; }
.btn.btn-gray {
  background-color: #ababab;
  border: 3px solid #ababab;
  color: #fff; }
.btn.btn-orange {
  background-color: #ff9a24;
  border: 3px solid #ff9a24;
  color: #fff; }
.btn.btn-light-pink {
  background-color: #fe7e7d;
  border: 3px solid #fe7e7d;
  color: #fff; }
.btn.btn-yellow {
  background-color: #fffd3c;
  border: 3px solid #fffd3c; }
.btn.btn-red {
  background-color: #e23258;
  border: 3px solid #e23258;
  color: #fff; }
.btn.btn-brown {
  background-color: #e9c785;
  border: 3px solid #e9c785;
  color: #fff; }
.btn.btn-outline {
  background-color: #fff;
  border: 3px solid #9fd9e7;
  color: #3e8093; }
  .btn.btn-outline.btn-yellow {
    background-color: #fffd3c;
    border: 3px solid #ffe400; }
  .btn.btn-outline.btn-orange {
    background-color: #ff9a24;
    border: 3px solid #e58100;
    color: #fff; }
    .btn.btn-outline.btn-orange.white-bg {
      color: #e58100; }
  .btn.btn-outline.btn-red {
    background-color: #ff7e7e;
    border: 3px solid #e57171;
    color: #fff; }
    .btn.btn-outline.btn-red.white-bg {
      color: #d52f4f; }
  .btn.btn-outline.btn-brown {
    background-color: #e9c785;
    border: 3px solid #d1b377;
    color: #fff; }
    .btn.btn-outline.btn-brown.white-bg {
      color: #d1b377; }
  .btn.btn-outline.btn-blue {
    background-color: #729bf3;
    border: 3px solid #0b90cb;
    color: #fff; }
    .btn.btn-outline.btn-blue.white-bg {
      color: #0b90cb; }
  .btn.btn-outline.btn-green {
    background-color: #00bf9d;
    border: 3px solid #2fd696;
    color: #fff; }
    .btn.btn-outline.btn-green.white-bg {
      color: #2fd696; }
  .btn.btn-outline.btn-light-green {
    background-color: #0ee085;
    border: 3px solid #2fd696;
    color: #fff; }
    .btn.btn-outline.btn-light-green.white-bg {
      color: #2fd696; }
  .btn.btn-outline.white-bg {
    background-color: #fff; }

/*Size*/
.btn {
  font-size: 18px;
  padding-top: 9px;
  padding-bottom: 10px;
  line-height: 26px; }
  @media (max-width: 767px) {
    .btn {
      width: 100%;
      white-space: normal;
      font-size: 16px;
      padding: 6px 10px; } }

.btn-lg, .btn-group-lg > .btn {
  font-size: 20px;
  padding-bottom: 9px; }

.btn-md {
  padding-top: 6px;
  padding-bottom: 7px; }

.btn-sm, .btn-group-sm > .btn {
  font-size: 16px;
  border-width: 2px !important;
  padding: 1px 15px; }

.btn-link {
  padding-top: 9px;
  padding-bottom: 10px;
  border: 0 none !important;
  background-color: transparent !important; }

/*Layout*/
.btn-right-arrow {
  position: relative;
  padding-left: 50px;
  padding-right: 50px; }
  .btn-right-arrow:after {
    position: absolute;
    content: '\f105';
    font-size: 25px;
    font-family: "el-icons";
    font-weight: 700;
    top: 50%;
    right: 12px;
    height: 30px;
    line-height: 30px;
    margin-top: -15px; }

.btn-circle {
  border-radius: 200px !important; }

/*Btn Social Networks*/
.btn.btn-sns {
  padding-left: 80px;
  padding-right: 50px;
  border: 0 none;
  background-color: #ababab;
  color: #fff;
  position: relative; }
  .btn.btn-sns:before {
    display: block;
    font-family: "el-icons";
    font-size: 23px;
    width: 50px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    content: '';
    font-weight: 400;
    border-right: 2px solid rgba(255, 255, 255, 0.5);
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -17px; }
  .btn.btn-sns.btn-sns-facebook {
    background-color: #3c5a99; }
    .btn.btn-sns.btn-sns-facebook:before {
      content: '\f09a'; }
  .btn.btn-sns.btn-sns-twitter {
    background-color: black; 
  }
    .btn.btn-sns.btn-sns-twitter:before {
      /* XはFont Awesomeを使用していない */
      background-image: url("../../images/icons/x-white.png");
      background-size: 35%; /* 画像が疑似要素のサイズに合うように調整 */
      background-position: center; /* 画像が中央に来るように */
      background-repeat: no-repeat; /* 画像が繰り返されないように */
      content: ''; /* 疑似要素が表示されるように空のcontentを設定 */
      width: 50px; /* 必要に応じてサイズを調整 */
      height: 34px; /* 必要に応じてサイズを調整 */
    }
  @media (max-width: 767px) {
    .btn.btn-sns {
      padding-left: 60px;
      padding-right: 15px;
      font-size: 15px; } }

/*Button with register*/
.btn.btn-register {
  position: relative; }
  .btn.btn-register:before {
    content: '';
    display: block;
    position: absolute;
    bottom: -3px;
    top: auto;
    left: 20px; }
  .btn.btn-register.btn-register-parent-child:before {
    background-image: url("../images/icons/register-parent-and-child.png");
    width: 83px;
    height: 63px;
    left: 12px; }
  .btn.btn-register.btn-register-child:before {
    background-image: url("../images/icons/register-child.png");
    width: 51px;
    height: 58px; }
  .btn.btn-register.btn-register-parent:before {
    background-image: url("../images/icons/register-parent.png");
    width: 50px;
    height: 63px; }
  .btn.btn-register.btn-sm:before, .btn-group-sm > .btn.btn-register:before {
    bottom: -2px; }
  @media (max-width: 767px) {
    .btn.btn-register {
      font-size: 14px;
      padding-left: 65px; }
      .btn.btn-register:before {
        left: 12px; } }

.label-status {
  display: inline-block;
  width: 130px;
  height: 32px;
  color: #2c3941;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  padding: 4px 0;
  background: #fff;
  border: 2px solid #898e91;
  border-radius: 4px; }
  .label-status.in-progress {
    color: #3d8093;
    background: #ffd7d7;
    border-color: #feb8ba; }
    .label-status.in-progress img {
      margin-top: -4px; }
      @media (max-width: 767px) {
        .label-status.in-progress img {
          margin-top: -3px;
          width: 10px; } }
  .label-status.done {
    color: #3e7f91;
    background: #fffc3b;
    border-color: #e2e035; }
  @media (max-width: 767px) {
    .label-status {
      font-size: 11px;
      width: 80px;
      height: 25px;
      padding: 2px 0; } }

.label-subject {
  color: #fff;
  font-size: 18px;
  padding-top: 9px;
  padding-bottom: 10px;
  line-height: 26px;
  font-weight: 700;
  text-align: center;
  border-radius: 4px;
  background-color: #fff;
  border: 3px solid #ababab; }
  @media (max-width: 767px) {
    .label-subject {
      width: 100px;
      white-space: normal;
      font-size: 16px;
      padding: 6px 10px;
      margin: 0 auto; } }
  .label-subject.label-orange {
    background-color: #ff8a23;
    border-color: #ff8a23; }
  .label-subject.label-yellow {
    background-color: #f5c000;
    border-color: #f5c000; }
  .label-subject.label-blue {
    background-color: #82a3ea;
    border-color: #82a3ea; }
  .label-subject.label-light-pink {
    background-color: #fe7e7d;
    border-color: #fe7e7d; }
  .label-subject.label-brown {
    background-color: #d9a84c;
    border-color: #d9a84c; }
  .label-subject.label-light-blue {
    background-color: #3be0fe;
    border-color: #3be0fe; }
  .label-subject.label-green {
    background-color: #2de8a1;
    border-color: #2de8a1; }
  .label-subject.label-purple {
    background-color: #8e24aa;
    border-color: #8e24aa; }

.img-circle-wrap {
  display: inline-block;
  overflow: hidden; }

/*Modal*/
.modal-backdrop {
  background-color: rgba(0, 0, 0, 0.6); }

.modal-dialog {
  width: 800px; }
  @media (max-width: 991px) {
    .modal-dialog {
      width: 600px; } }
  @media (max-width: 767px) {
    .modal-dialog {
      width: auto;
      margin-top: 65px; } }

.modal-questions label {
  color: #253c42; }

.modal-content {
  border-radius: 5px !important; }
  .modal-content.yellow {
    background: #ffffbd; }
  .modal-content .close {
    width: 80px;
    height: 80px;
    display: block;
    opacity: 1;
    border-radius: 50%;
    font-size: 0;
    font-weight: 100;
    line-height: 80px;
    text-align: center;
    position: absolute;
    top: 0;
    left: auto;
    right: -190px;
    background-image: url("/images/icons/modal-close.png");
    background-repeat: no-repeat;
    color: transparent;
    z-index: 10; }
    .modal-content .close:hover {
      opacity: 0.6; }
    @media (max-width: 1199px) {
      .modal-content .close {
        right: -80px; } }
    @media (max-width: 767px) {
      .modal-content .close {
        width: 40px;
        height: 40px;
        background-size: 100% auto;
        right: 0;
        top: -50px; } }
  .modal-content .modal-header {
    padding: 0;
    position: relative; }
    .modal-content .modal-header .modal-title {
      background-image: url("../images/modal/bg-title.jpg");
      font-size: 30px;
      color: #fff;
      font-weight: 700;
      text-align: center;
      padding: 20px 30px 18px;
      background-size: cover;
      border-top-left-radius: 5px;
      -webkit-border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      -webkit-border-top-right-radius: 5px; }
      .modal-content .modal-header .modal-title.yellow {
        color: #3e8093;
        background-image: url("../images/modal/bg-title-yellow.jpg"); }
      @media (max-width: 767px) {
        .modal-content .modal-header .modal-title {
          font-size: 16px; } }
    .modal-content .modal-header .modal-ranking-title {
      background-image: url("../images/modal/bg-ranking-title.png");
      font-size: 24px;
      color: #fff;
      font-weight: 700;
      text-align: center;
      padding: 20px 30px 18px;
      background-size: cover;
      min-height: 150px; }
      @media (max-width: 767px) {
        .modal-content .modal-header .modal-ranking-title {
          font-size: 14px; } }
      .modal-content .modal-header .modal-ranking-title .circle-text {
        border: 5px solid #82d9ed;
        display: inline-block;
        height: 70px;
        line-height: 60px;
        border-radius: 200px;
        background-color: #fff;
        padding: 0 105px;
        color: #00bf9d;
        vertical-align: baseline; }
        .modal-content .modal-header .modal-ranking-title .circle-text b, .modal-content .modal-header .modal-ranking-title .circle-text strong {
          font-size: 48px; }
      @media (max-width: 991px) {
        .modal-content .modal-header .modal-ranking-title {
          font-size: 15px; }
          .modal-content .modal-header .modal-ranking-title .circle-text {
            height: 50px;
            line-height: 40px;
            padding: 0 80px; }
            .modal-content .modal-header .modal-ranking-title .circle-text b,
            .modal-content .modal-header .modal-ranking-title .circle-text strong {
              font-size: 30px; } }
    .modal-content .modal-header .modal-basic-title {
      font-size: 24px;
      font-weight: 700;
      color: #000;
      text-align: center;
      padding: 25px 30px 25px;
      position: relative; }
      @media (max-width: 767px) {
        .modal-content .modal-header .modal-basic-title {
          font-size: 14px; } }
      .modal-content .modal-header .modal-basic-title:after {
        content: '';
        position: absolute;
        left: 30px;
        right: 30px;
        border-top: 1px solid #b7b7b7;
        display: block;
        top: auto;
        bottom: 0; }
      .modal-content .modal-header .modal-basic-title-left {
        font-size: 24px;
        font-weight: 700;
        color: #000;
        text-align: left;
        padding: 25px 30px 25px;
        position: relative; }
      @media (max-width: 767px) {
        .modal-content .modal-header .modal-basic-title-left {
           font-size: 14px; } }
      .modal-content .modal-header .modal-basic-title-left:after {
        content: '';
        position: absolute;
        left: 30px;
        right: 30px;
        border-top: 1px solid #b7b7b7;
        display: block;
        top: auto;
        bottom: 0; }
  .modal-content .modal-body {
    padding: 30px;
    position: relative; }
    .modal-content .modal-body.disable {
      cursor: pointer;
      pointer-events: none;
      -moz-user-select: none;
      /* Firefox */
      -ms-user-select: none;
      /* Internet Explorer */
      -khtml-user-select: none;
      /* KHTML browsers (e.g. Konqueror) */
      -webkit-user-select: none;
      /* Chrome, Safari, and Opera */
      -webkit-touch-callout: none;
      /* Disable Android and iOS callouts*/ }
      .modal-content .modal-body.disable:after {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        content: "";
        z-index: 9;
        background-color: #b7b7b7;
        opacity: 0.3; }
    .modal-content .modal-body.timeout {
      height: 100px;
      overflow: hidden; }
      .modal-content .modal-body.timeout:before {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        content: "";
        z-index: 10;
        background-image: url(../images/modal/timeout.png); }
  .modal-content .modal-footer {
    border-bottom-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    padding: 30px;
    position: relative; }
    .modal-content .modal-footer:before {
      content: '';
      position: absolute;
      left: 30px;
      right: 30px;
      border-top: 1px dashed #b7b7b7;
      display: block;
      top: 0; }
    @media (max-width: 991px) {
      .modal-content .modal-footer .media-left, .modal-content .modal-footer .media-right, .modal-content .modal-footer .media-body {
        display: block;
        width: 100%; }
      .modal-content .modal-footer .media-body {
        margin-bottom: 20px; }
      .modal-content .modal-footer .media-right {
        padding-left: 0; } }
  @media (max-width: 767px) {
    .modal-content .modal-body,
    .modal-content .modal-footer {
      padding: 15px; } }

.modal-header .timer {
  background-color: #6ecbe6;
  padding: 30px 30px 25px;
  text-align: center;
  position: relative;
  border-top-left-radius: 5px;
  -webkit-border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  -webkit-border-top-right-radius: 5px; }
  .modal-header .timer.paused .airplane-wrapper .dots .dots-active,
  .modal-header .timer.paused .airplane-wrapper .airplane {
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
    animation-play-state: paused;
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    -ms-transition: none !important;
    transition: none !important; }
  .modal-header .timer.start .airplane-wrapper .dots .dots-active,
  .modal-header .timer.start .airplane-wrapper .airplane {
    width: 100%; }
  .modal-header .timer.in-timeout-section {
    background-color: #e4566d;
    -webkit-animation: timeoutSectionBackgroundChange 1s ease infinite;
    animation: timeoutSectionBackgroundChange 1s ease infinite; }
@-webkit-keyframes timeoutSectionBackgroundChange {
  0% {
    background-color: #e4566d; }
  50% {
    background-color: #6ecbe6; } }
@keyframes timeoutSectionBackgroundChange {
  0% {
    background-color: #e4566d; }
  50% {
    background-color: #6ecbe6; } }
  .modal-header .timer.end-timeout-section {
    background-color: #e4566d; }
  .modal-header .timer.in-warning-section .airplane-wrapper .airplane:before {
    border-color: #fffd3b; }
  .modal-header .timer.in-timeout-section .airplane-wrapper .airplane:before, .modal-header .timer.end-timeout-section .airplane-wrapper .airplane:before {
    border-color: #ff8400; }
.modal-header .timer-content {
  display: inline-block; }
.modal-header .text {
  font-size: 24px;
  font-weight: 400;
  font-family: 'Carter One', Arial, sans-serif;
  color: #fff;
  text-transform: uppercase; }
  .modal-header .text.active {
    color: #fffd3b; }
  @media (max-width: 991px) {
    .modal-header .text {
      font-size: 15px; } }
.modal-header .airplane-wrapper {
  position: relative;
  margin: 13px 10px 0; }
  .modal-header .airplane-wrapper .airplane {
    width: 50px;
    /*transition: width 10s linear;
    -webkit-transition: width 10s linear;*/
    left: 0;
    top: 0;
    position: absolute;
    height: 100%; }
    .modal-header .airplane-wrapper .airplane:before {
      content: '';
      display: block;
      width: 52px;
      height: 52px;
      position: absolute;
      background-image: url("../images/icons/hedgehog.png");
      background-color: #fff;
      background-position: center center;
      top: 50%;
      margin-top: -26px;
      right: 0;
      background-repeat: no-repeat;
      border-radius: 50%;
      border: 3px solid #2aae62; }
  .modal-header .airplane-wrapper .dots {
    display: block;
    width: 470px;
    height: 11px;
    background-image: url("../images/icons/timer.png");
    position: relative;
    overflow: hidden; }
    .modal-header .airplane-wrapper .dots .dots-active {
      width: 0;
      height: 100%;
      position: absolute;
      background-image: url("../images/icons/timer-active.png");
      transition: width 10s linear;
      -webkit-transition: width 10s linear; }
  @media (max-width: 991px) {
    .modal-header .airplane-wrapper {
      margin-top: 4px; }
      .modal-header .airplane-wrapper .dots {
        width: 330px;
        background-image: url("../images/icons/timer-tb.png"); }
        .modal-header .airplane-wrapper .dots .dots-active {
          background-image: url("../images/icons/timer-tb-active.png"); } }
  @media (max-width: 767px) {
    .modal-header .airplane-wrapper .dots {
      width: 240px;
      background-image: url("../images/icons/timer-sp.png"); }
      .modal-header .airplane-wrapper .dots .dots-active {
        background-image: url("../images/icons/timer-sp-active.png"); } }
.modal-header .countdown {
  position: absolute;
  font-family: 'Carter One', Arial, sans-serif;
  font-size: 40px;
  color: #fff;
  right: 20px;
  height: 40px;
  top: 50%;
  margin-top: -20px;
  line-height: 1; }
  @media (max-width: 767px) {
    .modal-header .countdown {
      font-size: 30px;
      right: 15px;
      margin-top: -15px;
      height: 30px; } }
@media (max-width: 767px) {
  .modal-header .timer-content {
    display: block;
    width: 240px;
    margin-left: auto;
    margin-right: auto; }
  .modal-header .text {
    display: none; }
  .modal-header .airplane-wrapper {
    float: none !important;
    margin: 0 auto; }
    .modal-header .airplane-wrapper .dots {
      margin: 0 auto; } }

.answer-incorrect .modal-result-wrapper {
  overflow: visible;
  background-color: #5fcdf8;
  background-image: url("/images/background/answer-incorrect.jpg");
  background-position: center bottom; }
  .answer-incorrect .modal-result-wrapper:before {
    content: '';
    display: block;
    position: absolute;
    width: 565px;
    height: 73px;
    background-image: url("/images/background/answer-incorrect-rainy.png");
    top: 0;
    right: 50px; }
.answer-incorrect .modal-result {
  color: #1d5ba1; }
.answer-incorrect .score {
  color: #1d5ba1; }
.answer-incorrect .modal-footer {
  background-color: #afe8fd; }
@media (max-width: 767px) {
  .answer-incorrect .modal-result-wrapper {
    padding: 10px 15px 10px 15px; }
    .answer-incorrect .modal-result-wrapper .score {
      width: 135px; }
  .answer-incorrect .modal-result .el-icons.el-x {
    font-size: 95px;
    width: 50px;
    height: 50px; } }

.answer-correct .modal-result-wrapper {
  overflow: visible;
  background-color: #fbce04;
  background-image: url("/images/background/answer-correct.jpg");
  background-position: center bottom; }
  .answer-correct .modal-result-wrapper:before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("/images/background/answer-correct-stars.png");
    top: 0;
    left: 0; }
.answer-correct .modal-result {
  color: #ef375b; }
.answer-correct .score {
  color: #ef375b; }
.answer-correct .modal-footer {
  background-color: #ffe63c; }
@media (max-width: 991px) {
  .answer-correct .modal-result-wrapper {
    padding: 28px 25px 17px 25px; }
  .answer-correct .answer-incorrect .modal-result-wrapper:before {
    right: 30px; } }
@media (max-width: 767px) {
  .answer-correct .modal-result-wrapper {
    padding: 10px 15px 10px 10px; }
  .answer-correct .el-icons.el-circle-o {
    font-size: 60px !important;
    width: 57px !important;
    height: 57px !important; } }

.modal-result-wrapper {
  width: 100%;
  position: relative;
  padding: 28px 85px 17px 76px;
  border-top-left-radius: 5px;
  -webkit-border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  overflow: hidden; }
  .modal-result-wrapper:before, .modal-result-wrapper:after {
    content: " ";
    display: table; }
  .modal-result-wrapper:after {
    clear: both; }
  .modal-result-wrapper > * {
    z-index: 1;
    position: relative; }
  .modal-result-wrapper .bunny {
    position: absolute;
    bottom: 0;
    left: 330px; }
    @media (max-width: 1199px) {
      .modal-result-wrapper .bunny {
        left: 50%;
        margin-left: -55px; } }
    @media (max-width: 639px) {
      .modal-result-wrapper .bunny {
        display: none; } }
  .modal-result-wrapper .score {
    display: table;
    width: auto;
    background-color: #fff;
    border-top: 2px solid #56240e;
    border-right: 5px solid #56240e;
    border-bottom: 5px solid #56240e;
    border-left: 2px solid #56240e;
    padding: 10px 30px 5px;
    border-radius: 5px;
    position: absolute;
    right: 30px;
    top: 30px;
    -webkit-transform: rotate(1deg);
    -moz-transform: rotate(1deg);
    -ms-transform: rotate(1deg);
    -o-transform: rotate(1deg);
    transform: rotate(1deg); }
    .modal-result-wrapper .score:before {
      content: '';
      display: block;
      position: absolute;
      background-image: url("/images/icons/answer-score.png");
      background-repeat: no-repeat;
      width: 123px;
      height: 23px;
      top: -15px;
      left: 50%;
      margin-left: -61px; }
    .modal-result-wrapper .score .text,
    .modal-result-wrapper .score .number {
      display: table-cell;
      vertical-align: middle;
      font-weight: 700; }
    .modal-result-wrapper .score .text {
      color: #56240e;
      font-size: 20px; }
    .modal-result-wrapper .score .number {
      font-size: 60px;
      line-height: 50px;
      padding-left: 10px;
      font-family: Arial, sans-serif; }
      @media (max-width: 991px) {
        .modal-result-wrapper .score .number {
          font-size: 50px; } }
      @media (max-width: 767px) {
        .modal-result-wrapper .score .number {
          font-size: 40px; } }
  @media (max-width: 991px) {
    .modal-result-wrapper .score {
      padding: 5px 5px 0;
      width: 170px;
      right: 10px;
      top: 20px; }
      .modal-result-wrapper .score .text {
        font-size: 14px; }
      .modal-result-wrapper .score .number {
        font-size: 35px;
        line-height: 40px;
        padding-left: 5px; } }

.modal-footer .media-body {
  color: #2d3940;
  font-size: 16px;
  text-align: justify; }
.modal-footer .media-right {
  padding-left: 20px; }

.modal-result {
  float: left;
  display: table; }
  .modal-result .el-icons {
    font-size: 84px;
    font-weight: 700;
    line-height: 74px;
    width: 74px;
    height: 74px;
    text-align: center;
    display: table-cell;
    vertical-align: middle; }
    .modal-result .el-icons.el-x {
      font-size: 115px;
      font-weight: 100; }
  .modal-result .modal-result-txt {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    padding: 10px;
    font-size: 18px; }
    .modal-result .modal-result-txt .bold {
      font-size: 32px;
      margin-bottom: 0;
      font-weight: 700; }
    .modal-result .modal-result-txt .modal-result-ans {
      color: #000; }
  @media (max-width: 767px) {
    .modal-result .modal-result-txt {
      padding: 4px; }
      .modal-result .modal-result-txt .bold {
        font-size: 23px; } }

/*Modal ranking*/
.modal-ranking .modal-body,
.modal-ranking .modal-footer {
  padding-left: 100px;
  padding-right: 100px; }
.modal-ranking .modal-body {
  padding-top: 0; }
.modal-ranking .modal-footer {
  padding-bottom: 50px; }
  .modal-ranking .modal-footer:before {
    left: 100px;
    right: 100px; }
.modal-ranking .panel {
  margin-bottom: 20px; }
  .modal-ranking .panel .panel-heading {
    margin-bottom: 20px; }
.modal-ranking .tweet-buttons .btn-link {
  cursor: auto; }
.modal-ranking .input-group {
  width: 100%; }
  .modal-ranking .input-group .form-group {
    margin-top: 0;
    padding-bottom: 0;
    display: table-cell; }
  .modal-ranking .input-group .form-control {
    height: 52px;
    border: 2px solid #ccc;
    background-image: none;
    margin: 0;
    border-radius: 4px !important;
    padding: 0 5px;
    line-height: 1;
    display: block; }
  .modal-ranking .input-group .input-group-btn {
    padding-right: 0;
    padding-left: 10px;
    width: 32.3232323232%;
    vertical-align: top; }
    .modal-ranking .input-group .input-group-btn .btn {
      margin: 0;
      padding-top: 10px;
      padding-bottom: 10px;
      border-radius: 4px !important; }
.modal-ranking .help-text {
  text-align: left; }
.modal-ranking .modal-footer .h1 {
  font-size: 22px;
  font-weight: 700;
  margin-top: 10px;
  margin-bottom: 20px; }
@media (max-width: 991px) {
  .modal-ranking .panel .panel-title {
    font-size: 18px; }
  .modal-ranking .modal-body {
    padding-top: 0;
    margin-top: -40px; }
  .modal-ranking .modal-footer {
    padding-top: 20px; }
    .modal-ranking .modal-footer .h1 {
      font-size: 16px;
      margin-top: 0px;
      margin-bottom: 10px; } }
@media (max-width: 767px) {
  .modal-ranking .modal-header .modal-ranking-title {
    font-size: 15px;
    padding: 10px 15px;
    min-height: 0; }
  .modal-ranking .modal-body,
  .modal-ranking .modal-footer {
    padding-left: 15px;
    padding-right: 15px; }
  .modal-ranking .modal-body {
    margin-top: 0; }
  .modal-ranking .panel,
  .modal-ranking .panel-heading {
    margin-bottom: 10px; }
  .modal-ranking .modal-footer .h1 {
    font-size: 14px; }
  .modal-ranking .input-group .input-group-btn {
    width: 25%; }
    .modal-ranking .input-group .input-group-btn .btn {
      padding: 10px 10px; } }

/*Modal tutorial*/
#modalDrill-tut .modal-content .modal-header {
  z-index: 3; }
#modalDrill-tut .modal-tutorial-title-text {
  font-size: 30px; }
@media (max-width: 767px) {
  #modalDrill-tut .modal-content .modal-header .modal-ranking-title {
    min-height: 100px; }
  #modalDrill-tut .modal-tutorial-title-text {
    font-size: 25px;
    display: block; } }

.modal-body-tut {
  background-image: url(../images/modal/bg-body-tut.png);
  -webkit-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin-top: -95px; }
  .modal-body-tut:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    background-image: url(../images/modal/modal_tut_item.png);
    background-repeat: no-repeat;
    background-position: right center; }
  .modal-body-tut .modal-body-tut-item {
    margin-top: 85px;
    position: relative;
    z-index: 2;
    text-align: center; }

.modal-content .modal-footer-tut.modal-footer:before {
  display: none; }
.modal-content .modal-footer-tut.modal-footer {
  text-align: center;
  background-image: url(../images/modal/bg-ranking-footer.png);
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover; }

#modalDrill-interest .modal-content .modal-header .modal-basic-title .modal-basic-title-left {
  padding-bottom: 0; }
  @media (max-width: 767px) {
    #modalDrill-interest .modal-content .modal-header .modal-basic-title .modal-basic-title-left {
      padding: 10px 15px 0; } }
  #modalDrill-interest .modal-content .modal-header .modal-basic-title:after .modal-basic-title-left {
    display: none; }
#modalDrill-interest .modal-content .modal-footer {
  text-align: center; }
  #modalDrill-interest .modal-content .modal-footer:before {
    border-top-style: solid; }
#modalDrill-interest .modal-body-interest-item {
  background-color: #ffffd5;
  text-align: center;
  padding: 20px 15px;
  display: table;
  width: 100%;
  table-layout: fixed; }
  #modalDrill-interest .modal-body-interest-item img {
    margin: auto; }
  #modalDrill-interest .modal-body-interest-item .image-left,
  #modalDrill-interest .modal-body-interest-item .image-right {
    display: table-cell;
    vertical-align: middle;
    padding: 0 15px; }
  #modalDrill-interest .modal-body-interest-item .image-right {
    width: 75%; }
  @media (max-width: 767px) {
    #modalDrill-interest .modal-body-interest-item {
      display: block; }
      #modalDrill-interest .modal-body-interest-item .image-left,
      #modalDrill-interest .modal-body-interest-item .image-right {
        display: block;
        width: 100%; }
      #modalDrill-interest .modal-body-interest-item .image-left img {
        width: 50px; }
      #modalDrill-interest .modal-body-interest-item .image-right {
        padding: 0;
        margin-top: 15px; }
      #modalDrill-interest .modal-body-interest-item .text-center {
        font-size: 12px; } }

#modalLeadToRegister .first {
  margin: 0 0 15px; }
#modalLeadToRegister .title {
  font-size: 18px;
  font-weight: bold;
  margin: 0 0 5px; }
#modalLeadToRegister p {
  font-size: 16px;
  margin: 0; }
@media (max-width: 767px) {
  #modalLeadToRegister .first {
    margin: 0 0 10px; }
  #modalLeadToRegister .title,
  #modalLeadToRegister p {
    font-size: 13px; }
  #modalLeadToRegister .title {
    margin: 0 0 2px; } }
#modalLeadToRegister .modal-footer .btn {
  margin: 0 auto; }
  @media (max-width: 767px) {
    #modalLeadToRegister .modal-footer .btn {
      margin: 0 0 5px; } }

/*Modal bootbox*/
.bootbox.modal .bootbox-body {
  font-size: 24px;
  text-align: center; }
  @media (max-width: 767px) {
    .bootbox.modal .bootbox-body {
      font-size: 16px; } }
.bootbox.modal .modal-footer .btn {
  margin: 0 5px; }
  @media (max-width: 767px) {
    .bootbox.modal .modal-footer .btn {
      margin: 0 0 5px; } }

.modal-footer-btngroup {
  text-align: center !important; }
  .modal-footer-btngroup .btn {
    margin: 0px 5px 5px 5px;
    min-width: 300px; }
    @media (max-width: 991px) {
      .modal-footer-btngroup .btn {
        min-width: 100px; } }
  .modal-footer-btngroup .btn + .btn {
    margin: 0px 5px 5px 5px; }

.modal-dialog-result {
  width: 600px; }
  .modal-dialog-result .modal-body {
    padding: 0; }
  @media (max-width: 767px) {
    .modal-dialog-result {
      width: auto; } }
  .modal-dialog-result #get_trophy_image {
    width: 40%; }

.middle-resultMatch-lose {
  overflow: hidden;
  margin-top: -35px; }
  .middle-resultMatch-lose .rt-score-wrap {
    position: relative;
    z-index: 2; }
  .middle-resultMatch-lose:before {
    content: "";
    background-image: url(../images/modal/bg-resultLose.png);
    position: absolute;
    z-index: 1;
    left: 0px;
    top: 0px;
    right: 0;
    height: 112px; }
  .middle-resultMatch-lose:after {
    content: "";
    width: 102px;
    height: 190px;
    background-image: url(../images/icons/result-left-lose.png);
    -webkit-background-size: cover;
    background-size: cover;
    position: absolute;
    left: 0;
    bottom: 40px; }
    @media (max-width: 767px) {
      .middle-resultMatch-lose:after {
        top: 100px;
        bottom: auto;
        left: 8px;
        width: 51px;
        height: 95px; } }

.middle-resultMatch-draw {
  overflow: hidden;
  margin-top: -35px; }
  .middle-resultMatch-draw .rt-score-wrap {
    position: relative;
    z-index: 2; }
  .middle-resultMatch-draw:after {
    content: "";
    width: 67px;
    height: 140px;
    background-image: url(../images/modal/draw-rabi.png);
    -webkit-background-size: cover;
    background-size: cover;
    position: absolute;
    right: 26px;
    bottom: 66px; }
    @media (max-width: 767px) {
      .middle-resultMatch-draw:after {
        top: 100px;
        bottom: auto;
        right: 44px;
        width: 45px;
        height: 95px; } }

.middle-resultMatch {
  overflow: hidden; }
  .middle-resultMatch:before, .middle-resultMatch:after {
    content: "";
    width: 127px;
    height: 163px;
    position: absolute;
    top: 50px;
    -webkit-background-size: cover;
    background-size: cover; }
    @media (max-width: 767px) {
      .middle-resultMatch:before, .middle-resultMatch:after {
        width: 64px;
        height: 82px;
        top: 100px; } }
  .middle-resultMatch:before {
    background-image: url(../images/icons/result-left.png);
    left: -25px; }
    @media (max-width: 767px) {
      .middle-resultMatch:before {
        left: -5px; } }
  .middle-resultMatch:after {
    background-image: url(../images/icons/result-right.png);
    right: -30px; }
    @media (max-width: 767px) {
      .middle-resultMatch:after {
        right: -10px; } }

.rt-score-wrap {
  max-width: 422px;
  margin-left: auto;
  margin-right: auto; }

.rt-titleimg {
  text-align: center; }
  .rt-titleimg.rt-titlematch {
    margin-top: -95px; }
  .rt-titleimg span {
    display: block;
    font-weight: bold;
    font-size: 18px; }

.rt-score {
  font-size: 36px;
  color: #295990;
  font-weight: bold;
  text-align: center;
  line-height: 50px;
  margin-bottom: 0; }
  .rt-score span {
    display: inline-block;
    font-size: 60px; }
    @media (max-width: 767px) {
      .rt-score span {
        font-size: 40px; } }

.rt-addmorescore {
  max-width: 280px;
  margin: 0 auto 10px;
  padding: 0;
  list-style-type: none; }
  .rt-addmorescore li {
    margin-bottom: 5px;
    padding: 5px 10px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background-color: #fff;
    border: solid 3px #4dbad9;
    overflow: hidden;
    color: #295990;
    font-weight: bold; }
    .rt-addmorescore li .rt-ico {
      padding-left: 35px;
      -webkit-background-size: 30px 30px;
      background-size: 30px 30px;
      line-height: 30px;
      background-repeat: no-repeat;
      background-position: 0 center;
      float: left; }
      .rt-addmorescore li .rt-ico.rt-ico-point {
        background-image: url(../images/icons/rt-ico-point.png); }
      .rt-addmorescore li .rt-ico.rt-ico-carrot {
        background-image: url(../images/icons/rt-ico-carrot.png); }
    .rt-addmorescore li .rt-point {
      float: right;
      font-size: 18px;
      line-height: 30px; }
      .rt-addmorescore li .rt-point span {
        font-size: 32px;
        line-height: 30px;
        display: inline-block;
        vertical-align: middle; }
  .rt-addmorescore li.rt-reason-list {
    position: relative;
    background: none;
    border: none;
    padding: 0;
    display: block;
    margin: 10px 0 15px; }
    .rt-addmorescore li.rt-reason-list .rt-reason-row {
      position: relative;
      display: block; }
      .rt-addmorescore li.rt-reason-list .rt-reason-row p {
        margin-bottom: 3px; }
      .rt-addmorescore li.rt-reason-list .rt-reason-row .rowLeft {
        font-size: 11px;
        font-weight: bold;
        display: block;
        position: relative;
        padding-right: 70px; }
      .rt-addmorescore li.rt-reason-list .rt-reason-row .rowRight {
        float: right;
        position: absolute;
        top: 0;
        right: 0;
        font-size: 11px; }

.rt-board {
  color: #295990;
  font-weight: bold;
  margin-bottom: 20px; }
  .rt-board dt {
    text-align: center;
    margin-bottom: 5px; }
  .rt-board dd {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background-color: #1e6fbe;
    -webkit-box-shadow: 0 2px 0 1px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 2px 0 1px rgba(0, 0, 0, 0.15);
    box-shadow: 0 2px 0 1px rgba(0, 0, 0, 0.15);
    color: #ffffff;
    padding: 3px; }
    .rt-board dd .rt-board-in {
      padding: 10px 20px;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      background-color: #3db0e7;
      -webkit-box-shadow: 0 -1px 2px 1px rgba(0, 0, 0, 0.25);
      -moz-box-shadow: 0 -1px 2px 1px rgba(0, 0, 0, 0.25);
      box-shadow: 0 -1px 2px 1px rgba(0, 0, 0, 0.25); }
    .rt-board dd table {
      margin-bottom: 0; }
      .rt-board dd table td {
        border-width: 0;
        padding-top: 2px;
        padding-bottom: 2px;
        color: #fff; }
        .rt-board dd table td span {
          color: #fff; }
    .rt-board dd .rt-board-list {
      margin: 0;
      padding: 0 0 0 5px;
      list-style-type: none; }
      .rt-board dd .rt-board-list li {
        display: table;
        width: 100%;
        font-size: 12px; }
        .rt-board dd .rt-board-list li .avatar, .rt-board dd .rt-board-list li .title, .rt-board dd .rt-board-list li .score {
          display: table-cell;
          vertical-align: middle;
          color: #ffffff; }
        .rt-board dd .rt-board-list li .score {
          text-align: right;
          font-size: 14px; }
          .rt-board dd .rt-board-list li .score span {
            font-size: 24px;
            color: #ffffff; }
      .rt-board dd .rt-board-list .hexagon {
        /*this smushes a square into a 60deg/120deg rhombus*/
        position: relative;
        height: 42px;
        width: 24.248711306px;
        background-size: auto 66.248711306px;
        background-position: center center;
        border-top: solid 4px #6ecbe6;
        border-bottom: solid 4px #6ecbe6;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
        background-color: #fff;
        box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
        /*cover up the box shadows */ }
        .rt-board dd .rt-board-list .hexagon .hex1,
        .rt-board dd .rt-board-list .hexagon .hex2 {
          position: absolute;
          overflow: hidden;
          width: 29.6984848098px;
          height: 29.6984848098px;
          top: 2.0621778265px;
          /*for some reason this 1px correction is needed */
          background: inherit;
          box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
          -webkit-transform: scaleX(0.5773502692) rotate(45deg);
          -moz-transform: scaleX(0.5773502692) rotate(45deg);
          -ms-transform: scaleX(0.5773502692) rotate(45deg);
          -o-transform: scaleX(0.5773502692) rotate(45deg);
          transform: scaleX(0.5773502692) rotate(45deg); }
          .rt-board dd .rt-board-list .hexagon .hex1:after,
          .rt-board dd .rt-board-list .hexagon .hex2:after {
            /*counter rotate and un-scale the bg image*/
            content: "";
            position: absolute;
            top: -7.0621778265px;
            /*same correction as up above */
            height: 42px;
            width: 29.6984848098px;
            left: 0;
            background: inherit;
            -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
            -moz-transform: rotate(-45deg) scaleX(1.7320508076);
            -ms-transform: rotate(-45deg) scaleX(1.7320508076);
            -o-transform: rotate(-45deg) scaleX(1.7320508076);
            transform: rotate(-45deg) scaleX(1.7320508076); }
        .rt-board dd .rt-board-list .hexagon .hex1 {
          left: -14.8492424049px;
          border-left: solid 6.9282032303px #6ecbe6;
          border-bottom: solid 6.9282032303px #6ecbe6;
          backface-visibility: hidden;
          -webkit-backface-visibility: hidden; }
          .rt-board dd .rt-board-list .hexagon .hex1:after {
            background-position: 17% center;
            margin-left: -6.9282032303px; }
        .rt-board dd .rt-board-list .hexagon .hex2 {
          right: -14.8492424049px;
          border-top: solid 6.9282032303px #6ecbe6;
          border-right: solid 6.9282032303px #6ecbe6;
          backface-visibility: hidden;
          -webkit-backface-visibility: hidden; }
          .rt-board dd .rt-board-list .hexagon .hex2:after {
            background-position: 83% center;
            margin-top: -5.9282032303px;
            /*that pesky single pixel correction again*/ }
        .rt-board dd .rt-board-list .hexagon:after {
          content: "";
          position: absolute;
          left: 2.8284271247px;
          right: 0;
          top: 0;
          bottom: 0;
          width: 18.5918570565px;
          background: inherit; }

.rt-button-group {
  text-align: center; }
  .rt-button-group .btn {
    margin: 0 10px; }
    @media (min-width: 768px) {
      .rt-button-group .btn {
        min-width: 200px; } }
  .rt-button-group.no-coin .btn {
    width: 100%; }
    .rt-button-group.no-coin .btn:first-child {
      margin-bottom: 10px; }
  @media (max-width: 767px) {
    .rt-button-group .btn {
      margin: 0 0 10px; } }

.modal-basic-tt {
  color: #2d3940;
  font-weight: bold;
  font-size: 18px;
  text-align: center;
  margin-bottom: 30px; }

.modal-basic-boxgrey {
  color: #2d3940;
  font-weight: bold;
  font-size: 24px;
  text-align: center;
  padding: 15px 0;
  background: #f4f4f4;
  border: 2px solid #e2e5e8; }

.modal-question-total {
  font-size: 20px;
  font-weight: bold;
  color: #ffffff;
  padding: 15px;
  text-align: center;
  background-color: #6ecbe6;
  margin: 40px 30px 0; }
  .modal-question-total span {
    font-size: 28px; }

#delete-friend-modal .friend-name {
  font-size: 18px;
  font-weight: bold;
  margin-top: 10px; }
  @media (max-width: 767px) {
    #delete-friend-modal .friend-name {
      font-size: 16px; } }

/*
modal change ranking
*/
#modalChangeRanking .ranking-list {
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    #modalChangeRanking .ranking-list {
      margin-bottom: 14px; } }
@media (max-width: 767px) {
  #modalChangeRanking .rt-titleimg img {
    width: 194px; } }
#modalChangeRanking .item {
  display: block;
  width: 100%;
  height: 85px;
  background: #37a8e6;
  border: 4px solid #1e6fbe;
  border-radius: 4px;
  color: #fff;
  margin-bottom: 15px;
  box-shadow: 0px 3px 0 0 rgba(0, 72, 113, 0.22); }
  @media (min-width: 768px) {
    #modalChangeRanking .item:nth-child(2) {
      width: 96%;
      margin-left: 10px; } }
  @media (max-width: 767px) {
    #modalChangeRanking .item:nth-child(2) {
      width: 100%;
      margin-left: 0; } }
  #modalChangeRanking .item.top:before {
    color: #f0a907;
    background-image: url("../images/icons/ranking-top.png"); }
  @media (max-width: 767px) {
    #modalChangeRanking .item {
      height: 73px;
      margin-bottom: 10px; } }
  #modalChangeRanking .item:before {
    margin-left: 10px;
    background: none;
    color: white; }
  #modalChangeRanking .item.item-down {
    margin-left: 10px;
    width: 94%; }
    #modalChangeRanking .item.item-down:before {
      color: #fff;
      background: transparent; }
  #modalChangeRanking .item a {
    height: 85px;
    padding-top: 14px;
    padding-left: 85px; }
    @media (max-width: 767px) {
      #modalChangeRanking .item a {
        padding-left: 48px;
        height: 68px;
        padding-top: 12px; } }
@media (min-width: 768px) {
  #modalChangeRanking .avatar-box {
    width: 70px; } }
@media (max-width: 767px) {
  #modalChangeRanking .avatar-box {
    width: 45px; } }
#modalChangeRanking .avatar {
  width: 100%; }
  @media (min-width: 768px) {
    #modalChangeRanking .avatar {
      min-width: 50px; } }
  @media (max-width: 767px) {
    #modalChangeRanking .avatar {
      padding-right: 3px; } }
#modalChangeRanking .description {
  padding-left: 5px;
  padding-right: 5px;
  text-align: left; }
#modalChangeRanking .up:after {
  content: "";
  background: url("../images/icons/ic-up.png") no-repeat;
  right: -30px;
  top: -26px;
  width: 54px;
  height: 56px;
  background-size: 99%;
  position: absolute; }
  @media (max-width: 767px) {
    #modalChangeRanking .up:after {
      right: -26px;
      top: -14px;
      width: 45px;
      height: 56px;
      background-size: 80%; } }
#modalChangeRanking .up .name, #modalChangeRanking .up .score, #modalChangeRanking .up .num {
  color: #fffd3c !important; }
#modalChangeRanking .down:before {
  content: "";
  background: url("../images/icons/ic-down.png") no-repeat;
  left: -30px;
  bottom: -26px;
  width: 54px;
  height: 56px;
  background-size: 99%;
  position: absolute; }
  @media (max-width: 767px) {
    #modalChangeRanking .down:before {
      left: -18px;
      bottom: -19px;
      width: 45px;
      height: 56px;
      background-size: 80%; } }
#modalChangeRanking .down .name, #modalChangeRanking .down .score, #modalChangeRanking .down .num {
  color: #fff !important; }
#modalChangeRanking .name {
  position: absolute; }
  @media (min-width: 768px) {
    #modalChangeRanking .name {
      font-size: 16px;
      width: 116px;
      top: 33%; } }
  @media (max-width: 767px) {
    #modalChangeRanking .name {
      font-size: 12px;
      width: 85px;
      top: 36%; } }
#modalChangeRanking .score {
  position: absolute;
  text-align: right; }
  @media (min-width: 768px) {
    #modalChangeRanking .score {
      top: 26%;
      right: 14px;
      width: 30%;
      font-size: 17px; } }
  @media (max-width: 767px) {
    #modalChangeRanking .score {
      top: 34%;
      right: 12px;
      width: 31%;
      font-size: 14px; } }
#modalChangeRanking .num {
  font-size: 27px; }
  @media (max-width: 767px) {
    #modalChangeRanking .num {
      font-size: 17px; } }

/* get trophy */
#modalGetTrophy .trophy-title {
  position: relative;
  height: 190px;
  margin: auto; }
  #modalGetTrophy .trophy-title:before {
    content: "";
    position: absolute;
    width: 100%;
    margin: auto;
    height: 180px;
    right: 0;
    background: url("../images/modal/get-trophy-title.png") no-repeat center; }
  #modalGetTrophy .trophy-title div {
    position: absolute;
    top: 65%;
    left: 24%;
    font-size: 20px;
    font-weight: 600;
    width: 220px;
    line-height: 1.2;
    height: 54px;
    overflow: hidden; }
    @media (max-width: 767px) {
      #modalGetTrophy .trophy-title div {
        width: 100%;
        left: 0;
        text-align: center; } }
  #modalGetTrophy .trophy-title p {
    vertical-align: middle;
    display: block;
    padding: 16px 5px;
    height: 100%;
    color: #fff;
    text-shadow: 4px 4px 2px #32363b; }

#modalDrill-cancelModal .btn {
  margin: 0 5px; }
  @media (max-width: 767px) {
    #modalDrill-cancelModal .btn {
      margin: 5px 0; } }

#modalMemorization .modal-dialog {
  margin-top: 60px; }
  @media (max-width: 767px) {
    #modalMemorization .modal-dialog {
      margin-top: 90px; } }
#modalMemorization .modal-content .ribbon-img-title {
  top: -75px; }
  @media (max-width: 767px) {
    #modalMemorization .modal-content .ribbon-img-title {
      height: auto; } }
  #modalMemorization .modal-content .ribbon-img-title .memorize-title {
    display: block;
    overflow: hidden;
    clear: both;
    width: 31%;
    margin: -50px auto 0;
    font-size: 24px;
    color: #fff;
    font-weight: bold; }
    @media (max-width: 767px) {
      #modalMemorization .modal-content .ribbon-img-title .memorize-title {
        font-size: 20px; } }
#modalMemorization .modal-content .sub-title {
  display: block;
  margin-top: 95px;
  font-size: 18px;
  color: #295990; }
  @media (max-width: 767px) {
    #modalMemorization .modal-content .sub-title {
      font-size: 16px;
      margin-top: 85px; } }
#modalMemorization .modal-content .sub-title-second {
  display: block;
  color: #295990;
  font-weight: bold;
  font-size: 40px;
  margin-top: 10px; }
  @media (max-width: 767px) {
    #modalMemorization .modal-content .sub-title-second {
      font-size: 22px;
      margin-bottom: 15px; } }
#modalMemorization .modal-content .list-vocabulary {
  max-height: auto;
  overflow-y: hidden; }
#modalMemorization .pd50 {
  padding: 8px 50px; }

.model-icon {
  top: 10%; }
  .model-icon .modal-xs {
    width: 350px; }
    .model-icon .modal-xs .modal-content {
      border-radius: 20px !important; }
      .model-icon .modal-xs .modal-content img {
        width: 40%; }
      .model-icon .modal-xs .modal-content p {
        text-align: center;
        font-size: 24px;
        font-weight: bold; }

#modalPoint .point-name,
#modalPointVideo .point-name {
  font-size: 24px;
  font-weight: bold; }
  @media (max-width: 767px) {
    #modalPoint .point-name,
    #modalPointVideo .point-name {
      font-size: 18px; } }
#modalPoint .point,
#modalPointVideo .point {
  font-size: 18px;
  margin: 0; }
  @media (max-width: 767px) {
    #modalPoint .point,
    #modalPointVideo .point {
      font-size: 14px; } }
#modalPoint .num,
#modalPointVideo .num {
  font-size: 24px; }
  @media (max-width: 767px) {
    #modalPoint .num,
    #modalPointVideo .num {
      font-size: 20px; } }
#modalPoint .detail-list,
#modalPointVideo .detail-list {
  background: #FDFDE0;
  padding: 15px;
  width: 400px;
  margin: 0 auto 10px; }
  @media (max-width: 767px) {
    #modalPoint .detail-list,
    #modalPointVideo .detail-list {
      width: 260px;
      font-size: 10px; } }
#modalPoint .point-detail,
#modalPointVideo .point-detail {
  float: right; }

#modalConfirmBattle .modal-footer a, #modalStartBattle .modal-footer a {
  display: inline-block;
  margin: 10px;
  padding: 15px 75px;
  border: none; }
  @media (max-width: 767px) {
    #modalConfirmBattle .modal-footer a, #modalStartBattle .modal-footer a {
      margin: 5px 0; } }
#modalConfirmBattle .modal-footer .btn-green:hover, #modalStartBattle .modal-footer .btn-green:hover {
  background-color: #02B797; }
#modalConfirmBattle .modal-footer .btn-gray:hover, #modalStartBattle .modal-footer .btn-gray:hover {
  background-color: #999999; }

#modalStartBattle .modal-dialog {
  width: 500px; }
  @media (max-width: 1199px) {
    #modalStartBattle .modal-dialog {
      width: 480px; } }
  @media (max-width: 991px) {
    #modalStartBattle .modal-dialog {
      width: 360px; } }
  @media (max-width: 767px) {
    #modalStartBattle .modal-dialog {
      max-width: 360px;
      width: auto;
      margin-left: auto;
      margin-right: auto; } }
#modalStartBattle .modal-body {
  position: relative;
  padding: 0; }
#modalStartBattle .team-battle-box .crown {
  top: 80px; }
  @media (max-width: 991px) {
    #modalStartBattle .team-battle-box .crown {
      top: 100px; } }
#modalStartBattle .text-large {
  font-size: 28px;
  color: #e1444b;
  font-weight: bold;
  margin: 0;
  padding-top: 15px; }
  @media (max-width: 991px) {
    #modalStartBattle .text-large {
      font-size: 22px; } }
  @media (max-width: 767px) {
    #modalStartBattle .text-large {
      font-size: 17px;
      padding-top: 25px; } }
#modalStartBattle .text-small {
  font-size: 14px;
  color: #e1444b; }

@media (max-width: 767px) {
  #battleScoreModal .content-frame-designed-corner.green {
    margin-left: 0;
    margin-right: 0; }
    #battleScoreModal .content-frame-designed-corner.green .frame-padding {
      padding: 0 10px; } }
#battleScoreModal .content-frame-designed-corner.green.lose .head, #battleScoreModal .content-frame-designed-corner.green.draw .head {
  height: 114px;
  background: url("../../images/background/content_frame_designed_corner/bg-head-green-drip.png") left top no-repeat;
  background-size: 100% auto; }
  @media (max-width: 767px) {
    #battleScoreModal .content-frame-designed-corner.green.lose .head, #battleScoreModal .content-frame-designed-corner.green.draw .head {
      display: block;
      height: 100px;
      background: url("../../images/background/content_frame_designed_corner/bg-head-green-drip-sp.png") left top no-repeat;
      background-size: 100% 100%; } }
#battleScoreModal .modal-content {
  background: none;
  box-shadow: none; }
#battleScoreModal .head {
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  left: 0; }
#battleScoreModal .foot {
  position: absolute;
  bottom: 0;
  left: 0; }
#battleScoreModal .layer {
  top: 0;
  left: 0;
  z-index: 1; }
#battleScoreModal .result {
  position: relative;
  text-align: center;
  margin-top: -50px; }
  #battleScoreModal .result .text {
    position: absolute;
    bottom: 18px;
    display: block;
    width: 100%;
    font-size: 24px;
    color: #fff; }
  @media (max-width: 767px) {
    #battleScoreModal .result img {
      width: 180px; }
    #battleScoreModal .result .text {
      bottom: 17px;
      font-size: 18px; } }
#battleScoreModal #battleRoomMsg .message-lose1 {
  color: #cc383d;
  font-size: 25px;
  text-align: center;
  font-weight: bold;
  margin: 20px 0 5px; }
  @media (max-width: 767px) {
    #battleScoreModal #battleRoomMsg .message-lose1 {
      font-size: 18px;
      margin: 14px 0 5px; } }
#battleScoreModal #battleRoomMsg .message-lose2 {
  color: #295990;
  font-size: 14px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px; }
#battleScoreModal #battleRoomMsg .message-win1 {
  color: #295990;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  margin: 20px 0 10px; }
  @media (max-width: 767px) {
    #battleScoreModal #battleRoomMsg .message-win1 {
      font-size: 15px; } }
#battleScoreModal #battleRoomMsg .message-win2 {
  color: #295990;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  margin: -5px 0 10px; }
#battleScoreModal .team-battle-box-result {
  width: 300px;
  margin: 0 auto; }
  @media (max-width: 991px) {
    #battleScoreModal .team-battle-box-result {
      width: 350px; } }
  @media (max-width: 767px) {
    #battleScoreModal .team-battle-box-result {
      width: 260px; }
      #battleScoreModal .team-battle-box-result .corner {
        display: none; }
      #battleScoreModal .team-battle-box-result .item {
        padding: 0; }
      #battleScoreModal .team-battle-box-result .item-inner {
        border-radius: 6px; } }
  #battleScoreModal .team-battle-box-result .crown {
    top: 10px; }
  #battleScoreModal .team-battle-box-result .team-block {
    padding-top: 15px; }
  #battleScoreModal .team-battle-box-result .ribbon .point {
    color: #fff; }
#battleScoreModal .btn-box {
  position: relative;
  z-index: 1; }
  #battleScoreModal .btn-box .btn {
    width: 49%;
    text-align: center;
    padding-right: 0;
    padding-left: 0; }
    @media (max-width: 767px) {
      #battleScoreModal .btn-box .btn {
        width: 100%; } }

#modalUsername .modal-body {
  padding: 0; }
  @media (max-width: 767px) {
    #modalUsername .modal-body {
      padding: 15px 15px 0; } }
#modalUsername .form-horizontal {
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    #modalUsername .form-horizontal {
      margin: 0; } }
#modalUsername .modal-footer {
  padding: 15px; }
  @media (max-width: 767px) {
    #modalUsername .modal-footer {
      padding: 0 15px 15px; }
      #modalUsername .modal-footer .btn {
        margin: 0; } }
@media (max-width: 767px) {
  #modalUsername .modal-dialog {
    margin-top: 20px; }
  #modalUsername .form-group {
    margin: 5px 0 0 0; } }

@media (max-width: 767px) {
  #modalGetDeck .modal-basic-tt {
    margin-bottom: 10px; }
  #modalGetDeck .modal-basic-boxgrey {
    font-size: 16px;
    padding: 15px 10px 5px; }

  #modalCantGetDeck .modal-basic-tt {
    font-size: 16px;
    margin-bottom: 10px; }
  #modalCantGetDeck .modal-basic-boxgrey {
    font-size: 16px;
    padding: 15px 10px 5px; }
    #modalCantGetDeck .modal-basic-boxgrey + .modal-basic-tt {
      font-size: 14px;
      margin-top: 10px !important; } }
.panel {
  border: 0 none;
  border-radius: 0;
  box-shadow: none;
  -webkit-box-shadow: none;
  background-color: transparent;
  margin-bottom: 60px; }
  .panel .panel-heading {
    border-radius: 0;
    padding: 6px 15px 6px 85px;
    margin-bottom: 60px; }
    .panel .panel-heading:before, .panel .panel-heading:after {
      content: " ";
      display: table; }
    .panel .panel-heading:after {
      clear: both; }
  .panel .panel-title {
    color: #fff;
    font-weight: 700;
    font-size: 27px;
    float: left; }
  .panel .panel-image {
    position: absolute;
    top: 50%;
    margin-top: -38px;
    left: 5px; }
    .panel .panel-image .hex-icon {
      width: 197%;
      height: 115%;
      position: absolute;
      top: -7%;
      right: -46%; }
  .panel .panel-action {
    float: right; }
    .panel .panel-action .btn {
      margin: 4px 0 0; }
  .panel .panel-body {
    padding: 0; }

.panel-blue .panel-heading {
  position: relative;
  background-color: #65c7e4; }
  .panel-blue .panel-heading .panel-title {
    padding: 0; }
  .panel-blue .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #3cb5d8;
    border-bottom: solid 4px #3cb5d8;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-blue .panel-heading .hexagon .hex1,
    .panel-blue .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-blue .panel-heading .hexagon .hex1:after,
      .panel-blue .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-blue .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #3cb5d8;
      border-bottom: solid 6.9282032303px #3cb5d8;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-blue .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-blue .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #3cb5d8;
      border-right: solid 6.9282032303px #3cb5d8;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-blue .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-blue .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }

.panel-pink-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #da3051, #ee375a);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #da3051, #ee375a);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #da3051, #ee375a);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #da3051, #ee375a);
  /* Standard syntax */
  background-color: #ee375a; }
  .panel-pink-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-pink-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #d52f4f;
    border-bottom: solid 4px #d52f4f;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-pink-linear-gradient .panel-heading .hexagon .hex1,
    .panel-pink-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-pink-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-pink-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-pink-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #d52f4f;
      border-bottom: solid 6.9282032303px #d52f4f;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-pink-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-pink-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #d52f4f;
      border-right: solid 6.9282032303px #d52f4f;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-pink-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-pink-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-pink-linear-gradient .panel-heading .btn {
    color: #fe5e5e;
    border-color: #e57171; }

.panel-blue-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #0776bd, #0ca0e2);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #0776bd, #0ca0e2);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #0776bd, #0ca0e2);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #0776bd, #0ca0e2);
  /* Standard syntax */
  background-color: #0ca0e2; }
  .panel-blue-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-blue-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #0379ad;
    border-bottom: solid 4px #0379ad;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-blue-linear-gradient .panel-heading .hexagon .hex1,
    .panel-blue-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-blue-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-blue-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-blue-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #0379ad;
      border-bottom: solid 6.9282032303px #0379ad;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-blue-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-blue-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #0379ad;
      border-right: solid 6.9282032303px #0379ad;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-blue-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-blue-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-blue-linear-gradient .panel-heading .btn {
    color: #248ebe;
    border-color: #0a91cb; }

.panel-violet-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #4689e4, #729bf3);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #4689e4, #729bf3);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #4689e4, #729bf3);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #4689e4, #729bf3);
  /* Standard syntax */
  background-color: #729bf3; }
  .panel-violet-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-violet-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #4689e4;
    border-bottom: solid 4px #4689e4;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-violet-linear-gradient .panel-heading .hexagon .hex1,
    .panel-violet-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-violet-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-violet-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-violet-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #4689e4;
      border-bottom: solid 6.9282032303px #4689e4;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-violet-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-violet-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #4689e4;
      border-right: solid 6.9282032303px #4689e4;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-violet-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-violet-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-violet-linear-gradient .panel-heading .btn {
    color: #5285fa;
    border-color: #668bdb; }

.panel-orange-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #ee6700, #ff9000);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #ee6700, #ff9000);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #ee6700, #ff9000);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #ee6700, #ff9000);
  /* Standard syntax */
  background-color: #ff9000; }
  .panel-orange-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-orange-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #ee6700;
    border-bottom: solid 4px #ee6700;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-orange-linear-gradient .panel-heading .hexagon .hex1,
    .panel-orange-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-orange-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-orange-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-orange-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #ee6700;
      border-bottom: solid 6.9282032303px #ee6700;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-orange-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-orange-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #ee6700;
      border-right: solid 6.9282032303px #ee6700;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-orange-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-orange-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-orange-linear-gradient .panel-heading .btn {
    color: #ff8f00;
    border-color: #e48100; }

.panel-yellow-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #f1bb00, #ffd800);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #f1bb00, #ffd800);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #f1bb00, #ffd800);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #f1bb00, #ffd800);
  /* Standard syntax */
  background-color: #ffd800; }
  .panel-yellow-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-yellow-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #f1bb00;
    border-bottom: solid 4px #f1bb00;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-yellow-linear-gradient .panel-heading .hexagon .hex1,
    .panel-yellow-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-yellow-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-yellow-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-yellow-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #f1bb00;
      border-bottom: solid 6.9282032303px #f1bb00;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-yellow-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-yellow-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #f1bb00;
      border-right: solid 6.9282032303px #f1bb00;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-yellow-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-yellow-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-yellow-linear-gradient .panel-heading .btn {
    color: #ffa700;
    border-color: #e4c200; }

.panel-purple-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #8334A4, #AF6EC3);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #8334A4, #AF6EC3);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #8334A4, #AF6EC3);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #8334A4, #AF6EC3);
  /* Standard syntax */
  background-color: #AF6EC3; }
  .panel-purple-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-purple-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #f1bb00;
    border-bottom: solid 4px #f1bb00;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-purple-linear-gradient .panel-heading .hexagon .hex1,
    .panel-purple-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-purple-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-purple-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-purple-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #f1bb00;
      border-bottom: solid 6.9282032303px #f1bb00;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-purple-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-purple-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #f1bb00;
      border-right: solid 6.9282032303px #f1bb00;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-purple-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-purple-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-purple-linear-gradient .panel-heading .btn {
    color: #73009B;
    border-color: #70009A; }

.panel-light-pink-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #ff5e5e, #ff7e7e);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #ff5e5e, #ff7e7e);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #ff5e5e, #ff7e7e);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #ff5e5e, #ff7e7e);
  /* Standard syntax */
  background-color: #ff7e7e; }
  .panel-light-pink-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-light-pink-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #ff5e5e;
    border-bottom: solid 4px #ff5e5e;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-light-pink-linear-gradient .panel-heading .hexagon .hex1,
    .panel-light-pink-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-light-pink-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-light-pink-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-light-pink-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #ff5e5e;
      border-bottom: solid 6.9282032303px #ff5e5e;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-light-pink-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-light-pink-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #ff5e5e;
      border-right: solid 6.9282032303px #ff5e5e;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-light-pink-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-light-pink-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-light-pink-linear-gradient .panel-heading .btn {
    color: #fe5e5e;
    border-color: #e57171; }

.panel-brown-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #d8a84c, #e9c785);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #d8a84c, #e9c785);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #d8a84c, #e9c785);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #d8a84c, #e9c785);
  /* Standard syntax */
  background-color: #e9c785; }
  .panel-brown-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-brown-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #d8a84c;
    border-bottom: solid 4px #d8a84c;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-brown-linear-gradient .panel-heading .hexagon .hex1,
    .panel-brown-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-brown-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-brown-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-brown-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #d8a84c;
      border-bottom: solid 6.9282032303px #d8a84c;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-brown-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-brown-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #d8a84c;
      border-right: solid 6.9282032303px #d8a84c;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-brown-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-brown-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-brown-linear-gradient .panel-heading .btn {
    color: #d6a74b;
    border-color: #d1b377; }

.panel-light-blue-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #3cadf4, #5be2fc);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #3cadf4, #5be2fc);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #3cadf4, #5be2fc);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #3cadf4, #5be2fc);
  /* Standard syntax */
  background-color: #5be2fc; }
  .panel-light-blue-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-light-blue-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #3cadf4;
    border-bottom: solid 4px #3cadf4;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-light-blue-linear-gradient .panel-heading .hexagon .hex1,
    .panel-light-blue-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-light-blue-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-light-blue-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-light-blue-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #3cadf4;
      border-bottom: solid 6.9282032303px #3cadf4;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-light-blue-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-light-blue-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #3cadf4;
      border-right: solid 6.9282032303px #3cadf4;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-light-blue-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-light-blue-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-light-blue-linear-gradient .panel-heading .btn {
    color: #2dc8e4;
    border-color: #53cbe3; }

.panel-green-linear-gradient .panel-heading {
  position: relative;
  background-image: -webkit-linear-gradient(left, #08cd82, #71e9bb);
  /* For Safari 5.1 to 6.0 */
  background-image: -o-linear-gradient(right, #08cd82, #71e9bb);
  /* For Opera 11.1 to 12.0 */
  background-image: -moz-linear-gradient(right, #08cd82, #71e9bb);
  /* For Firefox 3.6 to 15 */
  background-image: linear-gradient(to right, #08cd82, #71e9bb);
  /* Standard syntax */
  background-color: #71e9bb; }
  .panel-green-linear-gradient .panel-heading .panel-title {
    padding: 0; }
  .panel-green-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #08cd82;
    border-bottom: solid 4px #08cd82;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-green-linear-gradient .panel-heading .hexagon .hex1,
    .panel-green-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-green-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-green-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-green-linear-gradient .panel-heading .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #08cd82;
      border-bottom: solid 6.9282032303px #08cd82;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-green-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-green-linear-gradient .panel-heading .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #08cd82;
      border-right: solid 6.9282032303px #08cd82;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-green-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-green-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  .panel-green-linear-gradient .panel-heading .btn {
    color: #4ce8a7;
    border-color: #30d696; }

@media (max-width: 767px) {
  .panel {
    margin-bottom: 25px; }
    .panel .panel-heading {
      padding-right: 10px;
      padding-top: 2px;
      padding-bottom: 2px;
      padding-left: 50px;
      margin-bottom: 20px; }
      .panel .panel-heading .panel-image {
        margin-top: -23px; }
      .panel .panel-heading .panel-title {
        font-size: 14px;
        line-height: 26px; }
      .panel .panel-heading .panel-action .btn {
        font-size: 10px;
        margin-top: 3px;
        line-height: 1;
        padding: 3px 10px; }

  .panel-blue .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #3cb5d8;
    border-bottom: solid 4px #3cb5d8;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-blue .panel-heading .hexagon .hex1,
    .panel-blue .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-blue .panel-heading .hexagon .hex1:after,
      .panel-blue .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-blue .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #3cb5d8;
      border-bottom: solid 6.9282032303px #3cb5d8;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-blue .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-blue .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #3cb5d8;
      border-right: solid 6.9282032303px #3cb5d8;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-blue .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-blue .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; }

  .panel-pink-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #d52f4f;
    border-bottom: solid 4px #d52f4f;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-pink-linear-gradient .panel-heading .hexagon .hex1,
    .panel-pink-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-pink-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-pink-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-pink-linear-gradient .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #d52f4f;
      border-bottom: solid 6.9282032303px #d52f4f;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-pink-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-pink-linear-gradient .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #d52f4f;
      border-right: solid 6.9282032303px #d52f4f;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-pink-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-pink-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; }

  .panel-blue-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #0379ad;
    border-bottom: solid 4px #0379ad;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-blue-linear-gradient .panel-heading .hexagon .hex1,
    .panel-blue-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-blue-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-blue-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-blue-linear-gradient .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #0379ad;
      border-bottom: solid 6.9282032303px #0379ad;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-blue-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-blue-linear-gradient .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #0379ad;
      border-right: solid 6.9282032303px #0379ad;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-blue-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-blue-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; }

  .panel-orange-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #ee6700;
    border-bottom: solid 4px #ee6700;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-orange-linear-gradient .panel-heading .hexagon .hex1,
    .panel-orange-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-orange-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-orange-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-orange-linear-gradient .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #ee6700;
      border-bottom: solid 6.9282032303px #ee6700;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-orange-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-orange-linear-gradient .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #ee6700;
      border-right: solid 6.9282032303px #ee6700;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-orange-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-orange-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; }

  .panel-yellow-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #f1bb00;
    border-bottom: solid 4px #f1bb00;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-yellow-linear-gradient .panel-heading .hexagon .hex1,
    .panel-yellow-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-yellow-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-yellow-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-yellow-linear-gradient .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #f1bb00;
      border-bottom: solid 6.9282032303px #f1bb00;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-yellow-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-yellow-linear-gradient .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #f1bb00;
      border-right: solid 6.9282032303px #f1bb00;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-yellow-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-yellow-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; }

  .panel-light-pink-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #ff5e5e;
    border-bottom: solid 4px #ff5e5e;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-light-pink-linear-gradient .panel-heading .hexagon .hex1,
    .panel-light-pink-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-light-pink-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-light-pink-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-light-pink-linear-gradient .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #ff5e5e;
      border-bottom: solid 6.9282032303px #ff5e5e;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-light-pink-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-light-pink-linear-gradient .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #ff5e5e;
      border-right: solid 6.9282032303px #ff5e5e;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-light-pink-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-light-pink-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; }

  .panel-brown-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #d8a84c;
    border-bottom: solid 4px #d8a84c;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-brown-linear-gradient .panel-heading .hexagon .hex1,
    .panel-brown-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-brown-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-brown-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-brown-linear-gradient .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #d8a84c;
      border-bottom: solid 6.9282032303px #d8a84c;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-brown-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-brown-linear-gradient .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #d8a84c;
      border-right: solid 6.9282032303px #d8a84c;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-brown-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-brown-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; }

  .panel-light-blue-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #3cadf4;
    border-bottom: solid 4px #3cadf4;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-light-blue-linear-gradient .panel-heading .hexagon .hex1,
    .panel-light-blue-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-light-blue-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-light-blue-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-light-blue-linear-gradient .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #3cadf4;
      border-bottom: solid 6.9282032303px #3cadf4;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-light-blue-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-light-blue-linear-gradient .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #3cadf4;
      border-right: solid 6.9282032303px #3cadf4;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-light-blue-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-light-blue-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; }

  .panel-green-linear-gradient .panel-heading .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 47px;
    width: 27.1354626519px;
    background-size: auto 74.1354626519px;
    background-position: center center;
    border-top: solid 4px #08cd82;
    border-bottom: solid 4px #08cd82;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .panel-green-linear-gradient .panel-heading .hexagon .hex1,
    .panel-green-linear-gradient .panel-heading .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 33.2340187158px;
      height: 33.2340187158px;
      top: 2.783865663px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .panel-green-linear-gradient .panel-heading .hexagon .hex1:after,
      .panel-green-linear-gradient .panel-heading .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -7.783865663px;
        /*same correction as up above */
        height: 47px;
        width: 33.2340187158px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .panel-green-linear-gradient .panel-heading .hexagon .hex1 {
      left: -16.6170093579px;
      border-left: solid 6.9282032303px #08cd82;
      border-bottom: solid 6.9282032303px #08cd82;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-green-linear-gradient .panel-heading .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .panel-green-linear-gradient .panel-heading .hexagon .hex2 {
      right: -16.6170093579px;
      border-top: solid 6.9282032303px #08cd82;
      border-right: solid 6.9282032303px #08cd82;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .panel-green-linear-gradient .panel-heading .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .panel-green-linear-gradient .panel-heading .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 21.4786084024px;
      background: inherit; } }
.current-progress {
  padding: 25px 35px;
  border: 3px solid #c1c4c5;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  background-color: #fff;
  margin-bottom: 30px; }
  .current-progress.orange {
    border-color: #ff5500; }
  @media (max-width: 767px) {
    .current-progress {
      border-width: 2px;
      border-radius: 3px;
      padding: 10px;
      margin-bottom: 20px; } }
  .current-progress .progress-subject {
    font-size: 24px;
    margin-bottom: 5px; }
    @media (max-width: 767px) {
      .current-progress .progress-subject {
        font-size: 14px; } }
  .current-progress .description {
    font-size: 15px; }
  .current-progress .progress-wrapper {
    margin-top: 30px;
    margin-bottom: 0; }
    @media (max-width: 767px) {
      .current-progress .progress-wrapper {
        margin-top: 10px; } }
    .current-progress .progress-wrapper .progress-text .text {
      width: 48%;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
      .current-progress .progress-wrapper .progress-text .text.pull-right {
        text-align: right; }

.points-list {
  counter-reset: section;
  margin-top: 20px; }
  .points-list li {
    position: relative;
    color: #2d3940;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.7;
    padding: 10px 0 10px 90px; }
    .points-list li:before {
      position: absolute;
      top: 10px;
      left: 0;
      width: 85px;
      height: 30px;
      content: 'Point';
      font-size: 14px;
      text-transform: uppercase;
      background-color: #6ecbe6;
      border-radius: 100px;
      -webkit-border-radius: 100px;
      display: inline-block;
      color: #fff;
      padding: 4px 20px;
      font-family: Arial, sans-serif; }
    @media (max-width: 767px) {
      .points-list li {
        font-size: 12px;
        line-height: 1.5;
        padding: 0 0 0 52px; }
        .points-list li:before {
          font-size: 10px;
          width: 50px;
          height: 16px;
          padding: 0;
          text-align: center;
          top: 3px; } }
  .points-list.orange li:before {
    background-color: #ff5500; }

.video-boxes-wrapper {
  margin-left: -10px;
  margin-right: -10px; }
  .video-boxes-wrapper:before, .video-boxes-wrapper:after {
    content: " ";
    display: table; }
  .video-boxes-wrapper:after {
    clear: both; }
  .video-boxes-wrapper .video-boxes.owl-carousel {
    margin-bottom: 40px; }
    .video-boxes-wrapper .video-boxes.owl-carousel .item-wrapper {
      margin-bottom: 10px; }
  .video-boxes-wrapper .video-boxes .top-subject .subject {
    position: absolute;
    top: 10px;
    left: 10px; }
  .video-boxes-wrapper .video-boxes .bottom-subject .subject {
    position: absolute;
    top: auto;
    bottom: 0;
    right: 0;
    margin-bottom: 0; }
    .video-boxes-wrapper .video-boxes .bottom-subject .subject.with-progress {
      bottom: 20px; }
  .video-boxes-wrapper .video-boxes .item {
    padding-left: 10px;
    padding-right: 10px; }
  .video-boxes-wrapper .video-boxes .item-wrapper {
    position: relative;
    background-color: #fff;
    padding: 10px;
    margin-bottom: 40px; }
    .video-boxes-wrapper .video-boxes .item-wrapper:hover {
      background-color: #86eac4;
      box-shadow: 10px 10px 0 0 #b7b7b7; }
      .video-boxes-wrapper .video-boxes .item-wrapper:hover .top-icon {
        border-top-color: #86eac4; }
      .video-boxes-wrapper .video-boxes .item-wrapper:hover .subject {
        background-color: #fff;
        color: #2d3940; }
      .video-boxes-wrapper .video-boxes .item-wrapper:hover .title,
      .video-boxes-wrapper .video-boxes .item-wrapper:hover .small-title {
        color: #fff; }
  .video-boxes-wrapper .video-boxes .thumbnail-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    margin-bottom: 10px; }
    .video-boxes-wrapper .video-boxes .thumbnail-wrapper a {
      display: block;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      text-decoration: none;
      background-color: #fde8cc; }
      .video-boxes-wrapper .video-boxes .thumbnail-wrapper a:before {
        content: '';
        width: 56px;
        height: 56px;
        display: block;
        background-image: url("../images/icons/video-play-md.png");
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -28px;
        margin-left: -28px;
        z-index: 2;
        opacity: 1; }
        @media (max-width: 767px) {
          .video-boxes-wrapper .video-boxes .thumbnail-wrapper a:before {
            width: 28px;
            height: 28px;
            margin-top: -14px;
            margin-left: -14px;
            background-image: url("../images/icons/video-play-xs.png"); } }
      .video-boxes-wrapper .video-boxes .thumbnail-wrapper a:hover:before {
        opacity: 0.7; }
  .video-boxes-wrapper .video-boxes .thumbnail {
    border: 0 none;
    border-radius: 0;
    -webkit-border-radius: 0;
    padding: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    margin-bottom: 0; }
  .video-boxes-wrapper .video-boxes .progress-wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    padding: 5px;
    background: rgba(0, 0, 0, 0.65);
    margin: 0; }
    .video-boxes-wrapper .video-boxes .progress-wrapper .progress {
      height: 10px;
      margin: 0; }
  .video-boxes-wrapper .video-boxes .subject {
    display: inline-block;
    line-height: 20px;
    padding: 0 25px;
    font-size: 12px;
    color: #fff;
    margin-bottom: 10px; }
  .video-boxes-wrapper .video-boxes .small-title {
    height: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    font-size: 14px; }
  .video-boxes-wrapper .video-boxes .title {
    font-size: 20px;
    color: #2d3940;
    height: 60px;
    overflow: hidden; }
  @media (max-width: 767px) {
    .video-boxes-wrapper .video-boxes .textbook.top-subject .subject {
      top: 7px;
      left: 7px; } }
  .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper {
    padding: 0;
    margin-bottom: 0; }
    .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a {
      position: static;
      height: 150px;
      padding-top: 20px; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a:before {
        display: none; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a:after {
        content: '';
        display: block;
        border-bottom: 13px solid #ff8a23;
        border-left: 13px solid transparent;
        position: absolute;
        bottom: 0;
        right: 0; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a .text-wrapper {
        display: inline-block;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 95%;
        text-align: center;
        overflow: hidden; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a .h3,
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a .h4 {
        display: block;
        color: #2d3940;
        font-weight: 700;
        overflow: hidden; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a .h3 {
        max-height: 50px;
        font-size: 24px;
        margin: 0 0 10px; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a .h4 {
        max-height: 38px;
        font-size: 18px;
        margin: 0 0 0; }
  @media (max-width: 767px) {
    .video-boxes-wrapper .video-boxes .textbook .item-wrapper {
      padding: 6px; }
    .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a {
      height: 85px; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a .text-wrapper {
        padding-top: 10px; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a .h3 {
        max-height: 32px;
        font-size: 16px;
        margin: 0 0 5px; }
      .video-boxes-wrapper .video-boxes .textbook .thumbnail-wrapper a .h4 {
        max-height: 14px;
        font-size: 12px; } }
  .video-boxes-wrapper .video-boxes .owl-controls,
  .video-boxes-wrapper .video-boxes .owl-buttons {
    position: static;
    margin: 0; }
  .video-boxes-wrapper .video-boxes .owl-controls .owl-buttons .owl-prev,
  .video-boxes-wrapper .video-boxes .owl-controls .owl-buttons .owl-next {
    position: absolute;
    background-color: #aeadac;
    opacity: 1;
    border-radius: 0 !important;
    width: 24px;
    margin: 0;
    top: 0;
    bottom: 10px;
    left: -40px;
    display: block;
    padding: 0;
    text-align: center; }
    .video-boxes-wrapper .video-boxes .owl-controls .owl-buttons .owl-prev .el-icons,
    .video-boxes-wrapper .video-boxes .owl-controls .owl-buttons .owl-next .el-icons {
      font-size: 25px;
      line-height: 25px;
      height: 25px;
      position: absolute;
      top: 50%;
      margin-top: -12.5px;
      width: 100%;
      left: 50%;
      margin-left: -12px; }
  .video-boxes-wrapper .video-boxes .owl-controls .owl-buttons .owl-next {
    left: auto;
    right: -40px; }
  .video-boxes-wrapper .video-boxes .button-box {
    padding: 0 5px; }
    .video-boxes-wrapper .video-boxes .button-box .btn {
      color: #fff;
      background-color: #aeadab;
      height: 20px;
      line-height: 20px;
      padding: 0;
      border-radius: 0; }
      .video-boxes-wrapper .video-boxes .button-box .btn .el-icons {
        line-height: normal;
        margin-top: -2px;
        display: inline-block; }
  @media (max-width: 767px) {
    .video-boxes-wrapper {
      margin-left: -5px;
      margin-right: -5px; }
      .video-boxes-wrapper:before, .video-boxes-wrapper:after {
        content: " ";
        display: table; }
      .video-boxes-wrapper:after {
        clear: both; }
      .video-boxes-wrapper .video-boxes .item-wrapper {
        padding: 6px;
        margin-bottom: 10px; }
        .video-boxes-wrapper .video-boxes .item-wrapper:hover {
          box-shadow: 6px 6px 0 0 #b7b7b7; }
      .video-boxes-wrapper .video-boxes .item {
        padding-left: 5px;
        padding-right: 5px; }
      .video-boxes-wrapper .video-boxes .subject {
        font-size: 10px;
        padding: 0 15px; }
      .video-boxes-wrapper .video-boxes .title {
        font-size: 13px;
        margin-bottom: 0; } }

.video-boxes-with-more-details {
  margin: 40px 0; }
  @media (max-width: 767px) {
    .video-boxes-with-more-details {
      margin-top: 20px; } }
  .video-boxes-with-more-details .video-boxes {
    margin-bottom: 0; }
    .video-boxes-with-more-details .video-boxes > li {
      display: table;
      width: 100%;
      background-color: #fff; }
      .video-boxes-with-more-details .video-boxes > li + li {
        margin-top: 35px; }
        @media (max-width: 767px) {
          .video-boxes-with-more-details .video-boxes > li + li {
            margin-top: 15px; } }
  .video-boxes-with-more-details .thumbnail-wrapper {
    display: table-cell;
    vertical-align: middle;
    width: 1%;
    padding: 15px; }
    .video-boxes-with-more-details .thumbnail-wrapper a {
      position: relative;
      display: block;
      width: 240px;
      height: auto; }
      .video-boxes-with-more-details .thumbnail-wrapper a:before {
        content: '';
        width: 56px;
        height: 56px;
        display: block;
        background-image: url("../images/icons/video-play-md.png");
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -28px;
        margin-left: -28px;
        z-index: 2;
        opacity: 1; }
        @media (max-width: 767px) {
          .video-boxes-with-more-details .thumbnail-wrapper a:before {
            width: 28px;
            height: 28px;
            margin-top: -14px;
            margin-left: -14px;
            background-image: url("../images/icons/video-play-xs.png"); } }
      .video-boxes-with-more-details .thumbnail-wrapper a:hover:before {
        opacity: 0.7; }
    .video-boxes-with-more-details .thumbnail-wrapper img {
      width: 100%;
      height: auto;
      margin: 0;
      padding: 0;
      border: 0;
      border-radius: 0; }
  .video-boxes-with-more-details .details-wrapper {
    display: table-cell;
    vertical-align: top;
    padding: 15px 15px 15px 0; }
    .video-boxes-with-more-details .details-wrapper .status {
      margin-bottom: 10px; }
    .video-boxes-with-more-details .details-wrapper .unit-and-chapter {
      font-size: 14px;
      margin-bottom: 2px; }
    .video-boxes-with-more-details .details-wrapper .title {
      font-size: 24px;
      font-weight: bold;
      margin: 0 0 10px; }
    .video-boxes-with-more-details .details-wrapper .points-list {
      margin-top: 0; }
      .video-boxes-with-more-details .details-wrapper .points-list li:last-child {
        padding-bottom: 0; }
  @media (max-width: 767px) {
    .video-boxes-with-more-details .video-boxes li {
      display: block; }
    .video-boxes-with-more-details .thumbnail-wrapper,
    .video-boxes-with-more-details .details-wrapper {
      display: block;
      width: 100%;
      padding: 6px; }
    .video-boxes-with-more-details .thumbnail-wrapper > a {
      position: relative;
      width: 100%;
      height: auto;
      padding-bottom: 56.25%; }
      .video-boxes-with-more-details .thumbnail-wrapper > a img {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0; }
    .video-boxes-with-more-details .details-wrapper {
      padding-top: 0; }
      .video-boxes-with-more-details .details-wrapper .status {
        float: right;
        position: relative;
        top: -42px;
        right: 5px; }
      .video-boxes-with-more-details .details-wrapper .unit-and-chapter {
        font-size: 12px; }
      .video-boxes-with-more-details .details-wrapper .title {
        font-size: 16px;
        margin: 0 0 5px; } }

.pagination-wrapper {
  text-align: center; }
  .pagination-wrapper .pagination {
    display: inline-block;
    margin-bottom: 40px; }
    .pagination-wrapper .pagination:before, .pagination-wrapper .pagination:after {
      content: " ";
      display: table; }
    .pagination-wrapper .pagination:after {
      clear: both; }
    .pagination-wrapper .pagination > li > a {
      border: 0 none;
      border-radius: 4px;
      text-transform: lowercase;
      background-color: #6ecbe6;
      margin-left: 3px;
      margin-right: 3px;
      color: #fff;
      font-size: 15px;
      font-weight: 400;
      font-family: Arial, sans-serif; }
      .pagination-wrapper .pagination > li > a:hover {
        opacity: 0.8; }
      @media (max-width: 767px) {
        .pagination-wrapper .pagination > li > a {
          font-size: 12px;
          padding: 3px 7px; } }

.news-list li.item {
  border-bottom: 1px solid #c6ccd2;
  padding: 10px 0; }
  .news-list li.item + li {
    margin-top: 30px; }
  .news-list li.item a.link {
    font-size: 16px;
    color: #26a4c8;
    font-weight: 700; }
  .news-list li.item .date-time {
    display: block;
    font-size: 14px;
    color: #2d3940; }

.settings-list ul {
  display: table;
  width: 100%;
  margin-bottom: 0; }
.settings-list li {
  display: table-row; }
  .settings-list li > div {
    display: table-cell;
    vertical-align: middle;
    padding-top: 10px;
    padding-bottom: 10px; }
    .settings-list li > div .btn {
      margin-top: 0;
      margin-bottom: 0; }
  .settings-list li .name,
  .settings-list li .description {
    font-size: 16px;
    color: #2d3940;
    padding-right: 30px; }
  .settings-list li .name {
    width: 26.2195121951%;
    font-weight: 700; }
  .settings-list li .description {
    width: 51.8292682927%; }
  .settings-list li .avatar {
    width: 90px;
    height: auto; }
.settings-list div.child-setting {
  max-width: 784px;
  border: 2px solid #a8e0f0;
  padding: 20px 30px;
  margin: 10px 0; }
  @media (max-width: 767px) {
    .settings-list div.child-setting {
      margin: 20px 0; } }
  .settings-list div.child-setting .user-name {
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: #2d3940; }
  .settings-list div.child-setting li .name {
    width: 27.4234693878%; }
  .settings-list div.child-setting li .description {
    width: 54.2091836735%; }
  .settings-list div.child-setting .label-status {
    padding: 7px 0;
    margin-top: -3px; }
    @media (max-width: 767px) {
      .settings-list div.child-setting .label-status {
        padding: 5px 0;
        margin-top: -1px; } }
@media (max-width: 767px) {
  .settings-list ul {
    display: block; }
    .settings-list ul.second {
      border-top: 1px solid #ccc;
      padding-top: 20px;
      margin-top: 25px; }
  .settings-list li {
    display: block;
    padding: 25px 0; }
    .settings-list li:first-child {
      padding-top: 0; }
    .settings-list li:last-child {
      padding-bottom: 0; }
    .settings-list li + li {
      border-top: 1px solid #ccc; }
    .settings-list li > div {
      display: block; }
    .settings-list li .name,
    .settings-list li .description {
      width: 100% !important;
      padding: 0; }
    .settings-list li .name {
      margin-bottom: 5px; }
    .settings-list li .link {
      text-align: center;
      padding: 20px 0 0; } }

.ui-avatar {
  /*this smushes a square into a 60deg/120deg rhombus*/
  position: relative;
  height: 76px;
  width: 43.8786204584px;
  background-size: auto 119.8786204584px;
  background-position: center center;
  border-top: solid 4px #a0d8e8;
  border-bottom: solid 4px #a0d8e8;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  background-color: #fff;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  /*cover up the box shadows */ }
  .ui-avatar .hex1,
  .ui-avatar .hex2 {
    position: absolute;
    overflow: hidden;
    width: 53.7401153702px;
    height: 53.7401153702px;
    top: 6.9696551146px;
    /*for some reason this 1px correction is needed */
    background: inherit;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform: scaleX(0.5773502692) rotate(45deg);
    -moz-transform: scaleX(0.5773502692) rotate(45deg);
    -ms-transform: scaleX(0.5773502692) rotate(45deg);
    -o-transform: scaleX(0.5773502692) rotate(45deg);
    transform: scaleX(0.5773502692) rotate(45deg); }
    .ui-avatar .hex1:after,
    .ui-avatar .hex2:after {
      /*counter rotate and un-scale the bg image*/
      content: "";
      position: absolute;
      top: -11.9696551146px;
      /*same correction as up above */
      height: 76px;
      width: 53.7401153702px;
      left: 0;
      background: inherit;
      -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
      -moz-transform: rotate(-45deg) scaleX(1.7320508076);
      -ms-transform: rotate(-45deg) scaleX(1.7320508076);
      -o-transform: rotate(-45deg) scaleX(1.7320508076);
      transform: rotate(-45deg) scaleX(1.7320508076); }
  .ui-avatar .hex1 {
    left: -26.8700576851px;
    border-left: solid 6.9282032303px #a0d8e8;
    border-bottom: solid 6.9282032303px #a0d8e8;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden; }
    .ui-avatar .hex1:after {
      background-position: 17% center;
      margin-left: -6.9282032303px; }
  .ui-avatar .hex2 {
    right: -26.8700576851px;
    border-top: solid 6.9282032303px #a0d8e8;
    border-right: solid 6.9282032303px #a0d8e8;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden; }
    .ui-avatar .hex2:after {
      background-position: 83% center;
      margin-top: -5.9282032303px;
      /*that pesky single pixel correction again*/ }
  .ui-avatar:after {
    content: "";
    position: absolute;
    left: 2.8284271247px;
    right: 0;
    top: 0;
    bottom: 0;
    width: 38.2217662089px;
    background: inherit; }

.btn-group.open .dropdown-toggle {
  box-shadow: none !important;
  -webkit-box-shadow: none !important; }

.has-tooltip .tooltip-content {
  display: none !important; }

.qtip {
  width: 244px;
  background-color: #fff;
  border: 0 none;
  box-shadow: 10px 10px 0 0 #b7b7b7; }
  .qtip .qtip-tip {
    width: 0 !important;
    height: 0 !important;
    overflow: visible; }
    .qtip .qtip-tip:before {
      content: '';
      display: block;
      width: 0 !important;
      height: 0 !important;
      border-left: 9px solid transparent !important;
      border-right: 9px solid transparent !important;
      border-top: 14px solid #fff !important;
      position: absolute;
      top: -8px; }
    .qtip .qtip-tip canvas {
      display: none !important; }

.video-details-tooltip .h3 {
  font-size: 20px;
  color: #2d3940; }
.video-details-tooltip .points-list {
  margin-top: 0;
  background-color: #83e0bd;
  border-radius: 5px; }
  .video-details-tooltip .points-list li {
    font-size: 14px;
    color: #fff;
    font-weight: 400;
    padding: 10px 15px;
    border: 0 none; }
    .video-details-tooltip .points-list li:before {
      background-color: transparent;
      border-radius: 0;
      display: inline;
      padding: 0;
      text-transform: capitalize; }
    .video-details-tooltip .points-list li + li {
      padding-top: 0; }
    .video-details-tooltip .points-list li > div {
      display: inline; }
.video-details-tooltip .other {
  display: table; }
  .video-details-tooltip .other li {
    display: table-row; }
    .video-details-tooltip .other li div {
      display: table-cell;
      font-size: 12px;
      padding: 5px 0; }
      .video-details-tooltip .other li div + div {
        padding-left: 10px; }

.tweet-buttons {
  display: none;
  border: 3px solid #6ecbe6;
  border-radius: 5px;
  background-color: #fff;
  width: 124px;
  padding: 20px 15px 10px; }
  .tweet-buttons .h2 {
    font-size: 20px;
    color: #2fd696;
    margin-top: 0;
    font-weight: 700; }
  .tweet-buttons .h3 {
    margin-top: 0;
    text-align: center;
    color: #da202e;
    border-bottom: 1px solid #52bede;
    padding-bottom: 10px; }
    .tweet-buttons .h3 span {
      display: block;
      font-size: 18px; }
    .tweet-buttons .h3 .bold {
      font-size: 25px;
      font-weight: 700; }
  .tweet-buttons ul {
    margin-bottom: 0;
    text-align: center; }
  .tweet-buttons li {
    position: relative; }
  .tweet-buttons .count {
    position: absolute;
    display: block;
    border: 2px solid #fff;
    color: #fff;
    font-size: 15px;
    background-color: #da202e;
    border-radius: 50%;
    height: 27px;
    line-height: 23px;
    min-width: 27px;
    text-align: center;
    padding: 0 3px;
    font-weight: 700;
    bottom: 0;
    right: 0; }
  .tweet-buttons .btn-link.on-click {
    pointer-events: none;
    -webkit-animation: tweetButtonOnClick 0.5s ease 1;
    animation: tweetButtonOnClick 0.5s ease 1; }
@keyframes tweetButtonOnClick {
  0% {
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    transform: scale(1, 1); }
  50% {
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1); } }
@-webkit-keyframes tweetButtonOnClick {
  0% {
    -webkit-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -o-transform: scale(1, 1);
    transform: scale(1, 1); }
  50% {
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1); } }
  @media (max-width: 767px) {
    .tweet-buttons {
      padding: 10px 10px 5px; }
      .tweet-buttons .h3 span {
        font-size: 14px; }
      .tweet-buttons .h3 .bold {
        font-size: 20px; }
      .tweet-buttons .count {
        font-size: 12px;
        height: 20px;
        min-width: 20px;
        line-height: 16px; }
      .tweet-buttons .btn-link {
        padding: 0; }
      .tweet-buttons .btn-link img {
        max-width: 60px;
        width: 100%; } }
  @media (max-width: 767px) {
    .modal-ranking .tweet-buttons .btn-link img {
      max-width: 50px; } }

.tweet-buttons-horizontal {
  width: auto;
  display: table; }
  .tweet-buttons-horizontal:before, .tweet-buttons-horizontal:after {
    content: " ";
    display: table; }
  .tweet-buttons-horizontal:after {
    clear: both; }
  .tweet-buttons-horizontal .h3 {
    display: table-cell;
    vertical-align: middle;
    padding-bottom: 0;
    border-bottom: 0;
    border-right: 1px solid #52bede;
    padding-right: 10px;
    text-align: left; }
  .tweet-buttons-horizontal ul {
    display: table-cell;
    vertical-align: middle;
    padding-left: 10px; }
  .tweet-buttons-horizontal li {
    float: left; }

.tweet-buttons-block .h3,
.tweet-buttons-block ul {
  display: block; }
.modal .tweet-buttons-block {
  display: table !important; }
  @media (max-width: 767px) {
    .modal .tweet-buttons-block {
      display: none !important; } }

.vjs-big-play-button {
  display: none !important; }

/*
.vjs-ended {
  .vjs-big-play-button {
    display: block !important;
    top: 50% !important;
    left: 50% !important;
    margin-left: -78px !important;
    margin-top: -52px !important;
    &:before {
      content: '\f116' !important;
      margin-top: 25px;
    }
    &:after {
      content: "もう一度見る";
      margin-top: -30px;
      display: block;
      font-size: 14px;
      font-weight: bold;
    }
  }
}*/
.btn-pageRefresh {
  position: absolute;
  top: 50% !important;
  left: 50% !important;
  z-index: 20;
  margin-left: -78px !important;
  margin-top: -52px !important;
  width: 156px;
  height: 105px;
  display: none;
  background: #000;
  border-radius: 21px;
  cursor: pointer;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  color: #ffffff;
  padding: 1px; }
  .btn-pageRefresh .btn-pageRefresh-reload {
    display: block;
    margin-left: auto;
    margin-right: auto;
    font-size: 20px; 
    z-index: 2; /* ボタンをオーバーレイよりも前面に表示 */
    position: relative;}
    .btn-pageRefresh .btn-pageRefresh-reload:before {
      content: '\f116';
      color: #fff;
      display: block;
      font-family: VideoJS;
      font-size: 23px;
      line-height: 27px;
      margin: 24px auto 8px;
      opacity: .8;
      text-align: center;
      width: 23px;
      font-style: normal; }
  .btn-pageRefresh.buttonShow {
    display: block; }
  .btn-pageRefresh:hover {
    box-shadow: 0 0 15px 3px #FFF; }
#overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0); /* 完全に透明 */
  z-index: 1; /* オーバーレイをビデオの上に表示 */
}
.video-js .vjs-fullscreen-control {
  display: none;
}
.video-js .vjs-picture-in-picture-control {
  display: none;
}
.btn-skip-al {
  position: absolute;
  bottom: -80px;
  right: 0;
  z-index: 20;
  border: 3px solid #62c2de !important;
  color: #62c2de !important;
  border-radius: 4px;
  cursor: pointer; }
  .btn-skip-al .el-icons {
    font-weight: bold;
    margin-left: 8px; }
  @media (max-width: 1279px) {
    .btn-skip-al {
      bottom: -70px; } }
  @media (max-width: 767px) {
    .btn-skip-al {
      bottom: -68px;
      width: 100%;
      font-size: 13px; } }

.deck-list {
  margin-left: -10px;
  margin-right: -10px; }
  .deck-list:before, .deck-list:after {
    content: " ";
    display: table; }
  .deck-list:after {
    clear: both; }
  .deck-list .item {
    float: left;
    width: 16.6666666667%;
    padding: 0 10px;
    margin-top: 30px; }
  .deck-list .content {
    color: #2d3940;
    text-align: center; }
    @media (min-width: 768px) {
      .bg-triangle-blue .deck-list .content {
        color: #fff; } }
    .deck-list .content:hover {
      text-decoration: none; }
    .deck-list .content .thumb {
      width: 120px;
      max-width: 100%;
      height: 120px;
      overflow: hidden;
      margin: 0 auto; }
      .deck-list .content .thumb .img-cover-center {
        object-fit: cover;
        object-position: center;
        height: 100%;
        width: 100%; }
    .deck-list .content .title {
      font-size: 14px;
      font-weight: 700;
      margin: 5px 0 5px;
      height: 67px; }
    .deck-list .content .subject {
      font-size: 14px;
      font-weight: 700;
      color: #fff;
      border-radius: 100px;
      display: inline-block;
      padding: 0 25px; }
    @media (max-width: 991px) {
      .deck-list .content .thumb {
        height: 110px; } }
  @media (max-width: 767px) {
    .deck-list {
      margin: 0 -15px;
      background: #fff; }
      .deck-list .item {
        width: 100%;
        margin-top: 0px; }
        .deck-list .item:last-child .content {
          border-bottom: none; }
      .deck-list .content {
        display: table;
        width: 100%;
        padding: 10px 0;
        text-align: left;
        border-bottom: 1px solid #d9d9d9; }
        .deck-list .content .cell-sp {
          display: table-cell;
          vertical-align: top; }
          .deck-list .content .cell-sp.first {
            width: 75px;
            padding-right: 15px; }
        .deck-list .content .thumb {
          width: 50px;
          height: 50px; }
        .deck-list .content .title {
          height: auto;
          font-size: 12px; }
        .deck-list .content .subject {
          width: 50px;
          height: 20px;
          font-size: 10px;
          border-radius: 10px;
          padding: 3px 0;
          margin-right: 5px;
          text-align: center; } }

.deck-list-line .item {
  margin-bottom: 10px; }
  .deck-list-line .item .item-inner {
    display: table;
    width: 100%;
    height: 85px;
    background: #fff;
    padding: 12px 20px;
    border-radius: 10px;
    border: 5px solid #1b6abd; }
    .deck-list-line .item .item-inner:hover {
      text-decoration: none; }
  .deck-list-line .item .left {
    display: table-cell;
    width: 60px;
    vertical-align: top; }
    .deck-list-line .item .left .thumb {
      width: 100%;
      height: 60px; }
      .deck-list-line .item .left .thumb img {
        height: 100%;
        object-fit: cover;
        object-position: center; }
  .deck-list-line .item .right {
    display: table-cell;
    padding-left: 20px;
    vertical-align: top; }
  .deck-list-line .item .title {
    color: #45515b !important;
    font-size: 18px !important;
    margin: 0 0 2px !important;
    width: 100% !important; }
  .deck-list-line .item .subject {
    display: inline-block;
    min-width: 100px;
    height: 30px;
    color: #fff;
    font-size: 14px;
    text-align: center;
    padding: 6px 10px;
    border-radius: 15px; }

.activity-content {
  background-color: #fff; }
  .activity-content .head {
    display: table;
    width: 100%;
    padding: 15px 30px;
    border-bottom: 1px solid #ebebeb; }
    .activity-content .head .thumb {
      display: table-cell;
      vertical-align: middle;
      width: 1%; }
      .activity-content .head .thumb img {
        max-width: 75px; }
    .activity-content .head .user-name {
      display: table-cell;
      vertical-align: middle;
      font-size: 24px;
      color: #38454f;
      font-weight: 700;
      text-align: left;
      padding-left: 20px;
      padding-right: 10px;
      width: 72%; }
    .activity-content .head .time {
      display: table-cell;
      vertical-align: middle;
      text-align: right;
      font-size: 13px;
      color: #878e9a;
      width: 26%; }
  .activity-content .content {
    padding: 30px 0;
    display: table;
    width: 100%; }
    .activity-content .content .trophy-image {
      display: table-cell;
      vertical-align: middle;
      padding-left: 30px;
      padding-right: 15px;
      width: 1%; }
      .activity-content .content .trophy-image img {
        width: 100px;
        height: 100px;
        object-fit: cover;
        object-position: center;
        border-radius: 5px; }
        @media (max-width: 991px) {
          .activity-content .content .trophy-image img {
            width: 80px;
            height: 80px; } }
    .activity-content .content .content-cell {
      display: table-cell;
      vertical-align: middle;
      padding-right: 30px; }
      .activity-content .content .content-cell .title {
        font-size: 20px; }
        @media (max-width: 991px) {
          .activity-content .content .content-cell .title {
            font-size: 17px; } }
      .activity-content .content .content-cell .desc {
        font-size: 18px;
        word-break: break-word; }
        .is-ie .activity-content .content .content-cell .desc {
          word-break: break-all; }
        @media (max-width: 991px) {
          .activity-content .content .content-cell .desc {
            font-size: 15px; } }
  .activity-content .bg-lbl {
    background-color: #fff;
    padding: 5px 14px;
    border-radius: 16px; }
  .activity-content .current-good {
    padding-right: 10px; }
  .activity-content .current-comment {
    padding-left: 20px;
    position: relative; }
    .activity-content .current-comment:before {
      content: '';
      background: url("../images/icons/ic-cm-navy.png") no-repeat;
      width: 19px;
      height: 15px;
      left: -1px;
      top: 0px;
      position: absolute; }
  .activity-content .foot {
    background-color: #6dcbe5;
    box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.15) inset;
    padding: 10px 30px 8px; }
    .activity-content .foot a {
      color: #fff;
      text-transform: uppercase;
      font-size: 14px;
      display: inline-block; }
      .activity-content .foot a + a {
        margin-left: 10px; }
      .activity-content .foot a .el-comment {
        padding-left: 20px;
        position: relative; }
        .activity-content .foot a .el-comment:before {
          content: '';
          background: url("../images/icons/ic-cm-blue.png") no-repeat;
          width: 19px;
          height: 15px;
          left: -1px;
          top: 0px;
          position: absolute; }
    .activity-content .foot .active span.el-icons {
      color: #db5940; }
    .activity-content .foot .disable {
      background-color: #fffd3c; }
  @media (max-width: 767px) {
    .activity-content .head {
      padding: 10px; }
      .activity-content .head .thumb img {
        width: 45px;
        height: 40px;
        object-fit: cover; }
      .activity-content .head .user-name {
        padding-left: 10px;
        font-size: 14px; }
      .activity-content .head .time {
        font-size: 10px; }
    .activity-content .content {
      padding: 10px 0; }
      .activity-content .content .trophy-image {
        padding-left: 15px;
        padding-right: 15px; }
      .activity-content .content .content-cell {
        padding-right: 15px;
        font-size: 13px; }
      .activity-content .content .title {
        margin: 0; }
      .activity-content .content .desc {
        font-size: 12px;
        margin: 0; }
      .activity-content .content .current-good,
      .activity-content .content .current-comment {
        font-size: 10px; }
        .activity-content .content .current-good .el-heart:before,
        .activity-content .content .current-comment .el-heart:before {
          font-size: 13px; }
    .activity-content .foot {
      padding: 5px 15px 5px; }
      .activity-content .foot a {
        float: left;
        font-size: 12px;
        background: #fff;
        color: #6DCBE5;
        padding: 2px 8px;
        border-radius: 12px; }
        .activity-content .foot a + a {
          margin-left: 5px; }
        .activity-content .foot a .el-heart:before {
          font-size: 13px; } }

.activity-list {
  margin-top: 35px;
  margin-bottom: 40px; }
  @media (max-width: 767px) {
    .activity-list {
      margin-top: 0px;
      margin-bottom: 20px; }
      .activity-list li {
        position: relative !important;
        top: inherit !important;
        left: inherit !important; } }
  .activity-list .activity-content {
    margin-bottom: 20px; }
    @media (max-width: 767px) {
      .activity-list .activity-content {
        margin-bottom: 5px; } }

.rabi-balloon-wrapper {
  height: 240px;
  overflow: hidden; }
  @media (max-width: 767px) {
    .rabi-balloon-wrapper {
      height: auto;
      overflow: visible; } }
  .rabi-balloon-wrapper .rabi-balloon {
    position: relative; }
    .rabi-balloon-wrapper .rabi-balloon:before, .rabi-balloon-wrapper .rabi-balloon:after {
      content: " ";
      display: table; }
    .rabi-balloon-wrapper .rabi-balloon:after {
      clear: both; }
    .rabi-balloon-wrapper .rabi-balloon .rabi {
      position: absolute;
      left: 90px;
      top: 40px;
      width: 206px;
      height: 298px;
      background: url("../images/rabi-balloon/rabi.png") left top no-repeat;
      background-size: 100% auto; }
      @media (max-width: 1279px) {
        .rabi-balloon-wrapper .rabi-balloon .rabi {
          left: 40px; } }
      @media (max-width: 1199px) {
        .rabi-balloon-wrapper .rabi-balloon .rabi {
          left: -50px; } }
      @media (max-width: 767px) {
        .rabi-balloon-wrapper .rabi-balloon .rabi {
          width: 90px;
          height: 85px;
          top: auto;
          bottom: 0;
          left: -10px; } }
    .rabi-balloon-wrapper .rabi-balloon .balloon {
      float: right;
      width: 762px;
      height: 415px;
      background: url("../images/rabi-balloon/balloon.png") left top no-repeat;
      background-size: 100% auto;
      padding: 115px 110px 100px 100px;
      margin-top: -80px; }
      @media (max-width: 991px) {
        .rabi-balloon-wrapper .rabi-balloon .balloon {
          float: right;
          width: 620px;
          height: 335px;
          padding: 75px 90px 100px 100px;
          margin-top: -50px;
          margin-right: -40px; } }
      @media (max-width: 767px) {
        .rabi-balloon-wrapper .rabi-balloon .balloon {
          width: 100%;
          height: auto;
          margin: 15px 0px 30px;
          padding: 10px 10px 30px;
          background-image: none;
          background-color: rgba(255, 255, 255, 0.7);
          border-radius: 3px; } }
    .rabi-balloon-wrapper .rabi-balloon .title {
      color: #60c1d4;
      font-size: 34px;
      font-weight: bold;
      margin: 0 0 20px; }
      @media (max-width: 767px) {
        .rabi-balloon-wrapper .rabi-balloon .title {
          font-size: 22px;
          margin: 0 0 10px; } }
    .rabi-balloon-wrapper .rabi-balloon p {
      color: #2d3940;
      font-size: 18px;
      font-weight: bold;
      margin-bottom: 10px; }
      @media (max-width: 767px) {
        .rabi-balloon-wrapper .rabi-balloon p {
          font-size: 13px;
          margin-bottom: 5px; } }
  @media (min-width: 768px) {
    .rabi-balloon-wrapper.higher {
      height: 320px; } }
  @media (min-width: 992px) {
    .rabi-balloon-wrapper.higher .rabi-balloon .balloon {
      padding: 80px 110px 100px 100px;
      margin-top: -50px; } }
  @media (min-width: 768px) and (max-width: 991px) {
    .rabi-balloon-wrapper.higher .rabi-balloon .balloon {
      padding: 60px 110px 100px 100px;
      margin-top: -20px;
      width: 710px;
      margin-right: -100px; } }
  @media (min-width: 992px) and (max-width: 1199px) {
    .rabi-balloon-wrapper.higher .rabi-balloon .rabi {
      left: -10px; } }
  .rabi-balloon-wrapper .btn {
    width: 280px; }
    @media (max-width: 767px) {
      .rabi-balloon-wrapper .btn {
        width: 100%; } }

.no-item {
  position: relative;
  height: 600px; }
  .no-item.small {
    height: 400px; }
    @media (max-width: 767px) {
      .no-item.small {
        height: 220px; } }
  @media (max-width: 767px) {
    .no-item {
      height: 360px; } }
  .no-item .box {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    height: 220px; }
    .no-item .box .rabi {
      width: 97px;
      height: 181px;
      background: url("../images/no-item.png") left top no-repeat;
      background-size: 100% auto;
      margin: 0 auto 10px; }
      @media (max-width: 767px) {
        .no-item .box .rabi {
          width: 67px;
          height: 134px; } }
    .no-item .box .text {
      color: #56240e;
      font-size: 18px;
      text-align: center; }
      @media (max-width: 767px) {
        .no-item .box .text {
          font-size: 12px; } }

.match-player-list {
  max-width: 442px;
  width: 90%;
  margin: 0 auto 10px; }
  .match-player-list .item .item-in {
    display: block;
    width: 100%;
    min-height: 70px;
    background: #37a8e6;
    border: 4px solid #1e6fbe;
    border-radius: 4px;
    color: #fff;
    padding: 7px 15px;
    margin-bottom: 15px;
    box-shadow: 0px 3px 0 0 rgba(0, 72, 113, 0.22); }
  .match-player-list .item .thumb {
    width: 50px; }
  .match-player-list .item .tb-score {
    width: 100%; }
    .match-player-list .item .tb-score .td-image {
      padding-top: 3px;
      width: 55px;
      vertical-align: middle; }
    .match-player-list .item .tb-score .td-score {
      width: 36%;
      max-width: 138px; }
      .match-player-list .item .tb-score .td-score .ic-group {
        padding-top: 9%; }
    .match-player-list .item .tb-score .td-username {
      padding-top: 5px;
      padding-left: 7px;
      word-wrap: break-word;
      white-space: normal;
      display: inline-block;
      word-break: break-all;
      display: table-cell; }
  .match-player-list .item .user-name {
    color: #fff;
    font-size: 14px; }
    @media (max-width: 767px) {
      .match-player-list .item .user-name {
        font-size: 13px; } }
  .match-player-list .item .icon-group {
    display: inline-block;
    width: 20px;
    height: 23px;
    background: url("/images/icons/icon-group.png") left top no-repeat;
    background-size: 100% auto;
    margin: 13px 5px; }
  .match-player-list .item .score {
    float: right;
    color: #fff;
    font-size: 16px;
    padding-top: 4px; }
    .match-player-list .item .score .num {
      color: #fff;
      font-size: 26px;
      font-weight: bold;
      padding-left: 5px; }
      @media (max-width: 767px) {
        .match-player-list .item .score .num {
          font-size: 16px; } }

.stage-list .item {
  margin-bottom: 10px; }
  .stage-list .item .item-inner {
    display: block;
    width: 100%;
    height: 120px;
    padding: 14px 20px;
    background: #fff;
    border: 5px solid #1b6abd;
    border-radius: 10px; }
    @media (max-width: 767px) {
      .stage-list .item .item-inner {
        padding: 10px; } }
    @media (max-width: 560px) {
      .stage-list .item .item-inner {
        height: auto; } }
  .stage-list .item .left {
    float: left;
    width: 65%;
    padding-right: 15px;
    color: #45515b;
    text-align: left; }
    @media (max-width: 767px) {
      .stage-list .item .left {
        width: 67%;
        padding-right: 10px; } }
    .stage-list .item .left .label {
      height: 22px;
      color: #fff;
      font-size: 12px;
      background: #1e6fbe;
      border-radius: 0 10px 10px 0;
      padding: 4px 15px 4px 18px;
      margin-left: -20px;
      text-overflow: ellipsis;
      overflow: hidden;
      width: 105px;
      text-align: left; }
      @media (max-width: 767px) {
        .stage-list .item .left .label {
          width: 75px;
          height: 18px;
          font-size: 10px;
          border-radius: 0 9px 9px 0;
          padding: 4px 10px 4px 8px;
          margin-left: -10px; } }
    .stage-list .item .left .time {
      font-size: 12px;
      padding-top: 2px; }
      @media (max-width: 767px) {
        .stage-list .item .left .time {
          font-size: 10px;
          text-align: right;
          margin-top: -5px;
          line-height: 1.2; } }
    .stage-list .item .left .stage-title {
      height: 65px;
      font-size: 18px;
      overflow: hidden;
      margin-top: 10px; }
      @media (max-width: 767px) {
        .stage-list .item .left .stage-title {
          font-size: 15px;
          margin-top: 5px; } }
  @media (max-width: 560px) {
    .stage-list .item .left-xs {
      width: 100%;
      padding-right: 0; } }
  @media (max-width: 560px) {
    .stage-list .item .left-xs .stage-title {
      height: auto; } }
  .stage-list .item .right {
    float: right;
    width: 35%;
    height: 100%;
    text-align: right;
    font-weight: bold;
    border-left: 1px solid #1e6fbe;
    color: #295990;
    min-height: 82px; }
    @media (max-width: 767px) {
      .stage-list .item .right {
        width: 33%; } }
    .stage-list .item .right .text {
      font-size: 14px; }
      @media (max-width: 767px) {
        .stage-list .item .right .text {
          display: block;
          font-size: 11px;
          line-height: 1.2; } }
      @media (max-width: 374px) {
        .stage-list .item .right .text {
          font-size: 10px; } }
    .stage-list .item .right .score {
      font-size: 20px;
      padding-top: 20px; }
      @media (max-width: 767px) {
        .stage-list .item .right .score {
          font-size: 12px;
          padding-top: 52px; } }
      @media (max-width: 374px) {
        .stage-list .item .right .score {
          font-size: 10px;
          padding-top: 62px; } }
      .stage-list .item .right .score .num {
        font-size: 30px; }
        @media (max-width: 767px) {
          .stage-list .item .right .score .num {
            font-size: 16px; } }
        @media (max-width: 374px) {
          .stage-list .item .right .score .num {
            font-size: 14px; } }
    .stage-list .item .right dl dt {
      width: 85%;
      float: left;
      text-align: left;
      padding-left: 15px;
      font-size: 14px;
      font-weight: normal; }
      .stage-list .item .right dl dt .circle {
        background: url("/images/play/icon-circle.png") center center no-repeat;
        width: 13px;
        height: 20px;
        float: left;
        margin-right: 7px; }
      .stage-list .item .right dl dt .triangle {
        background: url("/images/play/icon-triangle.png") center center no-repeat;
        width: 13px;
        height: 20px;
        float: left;
        margin-right: 7px; }
      .stage-list .item .right dl dt .horizontal {
        background: url("/images/play/icon-horizontal.png") center center no-repeat;
        width: 13px;
        height: 20px;
        float: left;
        margin-right: 7px; }
      .stage-list .item .right dl dt .cross {
        background: url("/images/play/icon-cross.png") center center no-repeat;
        width: 13px;
        height: 20px;
        float: left;
        margin-right: 7px; }
    .stage-list .item .right dl dd {
      float: left;
      width: 13%;
      text-align: right;
      font-size: 14px;
      font-weight: normal; }
  .stage-list .item .right-xs {
    border-left: 2px solid #1e6fbe; }
    @media (max-width: 560px) {
      .stage-list .item .right-xs {
        width: 100%;
        padding-top: 10px;
        border-left: none;
        border-top: 2px solid #1e6fbe; } }
    @media (max-width: 560px) {
      .stage-list .item .right-xs dt {
        padding-left: 0 !important; } }
.stage-list.stage-list-status .item-inner {
  height: 100%; }
.stage-list.stage-list-status .left {
  width: 100%; }
  .stage-list.stage-list-status .left .stage-title {
    height: 54px;
    margin-top: 0px;
    padding-left: 10px;
    padding-right: 10px;
    word-wrap: break-word;
    word-break: break-all;
    position: relative; }
    .stage-list.stage-list-status .left .stage-title.has-arrow:after {
      position: absolute;
      content: "\f105";
      font-family: "el-icons" !important;
      right: 0;
      top: 0;
      font-size: 24px;
      color: #295990;
      font-weight: bold; }
.stage-list.stage-list-status .col-yellow {
  background-color: #fefad3;
  padding: 15px 10px 5px 10px;
  position: relative;
  margin-bottom: 5px; }
  .stage-list.stage-list-status .col-yellow .stage-text {
    line-height: 1.4;
    padding-left: 35px;
    padding-bottom: 5px;
    position: relative; }
    @media (min-width: 768px) {
      .stage-list.stage-list-status .col-yellow .stage-text {
        font-size: 18px; } }
    @media (max-width: 767px) {
      .stage-list.stage-list-status .col-yellow .stage-text .bold {
        font-size: 19px; } }
    @media (min-width: 768px) {
      .stage-list.stage-list-status .col-yellow .stage-text .bold {
        font-size: 22px; } }
  .stage-list.stage-list-status .col-yellow .stage-icon:before {
    left: 10px; }

.friend-list a {
  position: relative;
  display: block;
  width: 100%;
  height: 115px;
  padding: 18px 40px 18px 8px;
  background: #fff;
  border-bottom: 1px dashed #b7b7b7; }
  .friend-list a:hover {
    background: #e9f1fc;
    text-decoration: none; }
  .friend-list a .item-content {
    border-bottom: none;
    padding: 7px 30px; }
    @media (max-width: 767px) {
      .friend-list a .item-content {
        padding: 15px 5px; } }
@media (max-width: 767px) {
  .friend-list .content-xs {
    float: left;
    width: 100%;
    padding: 15px 0; } }
.friend-list .thumb {
  float: left;
  width: 90px; }
  .friend-list .thumb img {
    width: 100%; }
@media (max-width: 767px) {
  .friend-list .thumb-xs {
    width: 60px !important; } }
.friend-list .name {
  color: #2d3940;
  font-size: 24px;
  float: left;
  padding: 19px 0 0 50px; }
  .friend-list .name .text {
    display: block;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; }
@media (max-width: 767px) {
  .friend-list .name-xs {
    padding: 25px !important;
    font-size: 18px !important; } }
.friend-list .padding1 {
  padding: 7px 0 0px 50px !important; }
.friend-list .padding2 {
  padding: 18px 0 0px 50px !important; }
.friend-list .note {
  position: absolute;
  left: 150px;
  bottom: 28px;
  color: #E23258;
  font-size: 18px;
  font-weight: bold;
  z-index: 10; }
  @media (max-width: 767px) {
    .friend-list .note {
      top: 7px;
      left: 54px;
      bottom: auto;
      font-size: 10px; } }
.friend-list .el-icons {
  position: absolute;
  top: 50%;
  right: 24px;
  font-size: 24px;
  color: #000;
  margin-top: -12px; }
@media (max-width: 767px) {
  .friend-list a {
    height: 60px;
    padding: 11px 0; }
  .friend-list .thumb {
    width: 44px; }
  .friend-list .name {
    font-size: 16px;
    padding: 10px 0 8px 10px !important; }
  .friend-list .el-icons {
    right: 0px;
    font-size: 16px;
    margin-top: -8px; } }

.ranking-list {
  counter-reset: section;
  margin-bottom: -30px; }
  .ranking-list li {
    display: table;
    width: 100%;
    position: relative;
    padding: 18px 15px 18px 125px; }
    .ranking-list li:before {
      counter-increment: section;
      content: counter(section);
      font-size: 24px;
      font-weight: 700;
      position: absolute;
      left: 15px;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -moz-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      transform: translateY(-50%);
      width: 52px;
      height: 47px;
      display: table-cell;
      line-height: 58px;
      text-align: center; }
    .ranking-list li.no-auto:before {
      content: attr(data-number); }
    .ranking-list li:nth-child(1):before, .ranking-list li:nth-child(2):before, .ranking-list li:nth-child(3):before {
      color: #f0a907;
      background-image: url("../images/icons/ranking-top.png"); }
    .ranking-list li + li {
      border-top: 1px dashed #b7b7b7; }
    .ranking-list li .avatar,
    .ranking-list li .title,
    .ranking-list li .score {
      display: table-cell;
      vertical-align: middle;
      font-size: 24px;
      font-weight: 700; }
      @media (min-width: 768px) {
        .ranking-list li .avatar,
        .ranking-list li .title,
        .ranking-list li .score {
          min-width: 100px; } }
    .ranking-list li .avatar {
      width: 100px;
      padding-right: 10px; }
    .ranking-list li .score {
      text-align: right; }
    .ranking-list li .friend-icon {
      position: absolute;
      top: 50%;
      right: 38px;
      width: 32px;
      margin-top: -14px; }
  .ranking-list .hexagon {
    /*this smushes a square into a 60deg/120deg rhombus*/
    position: relative;
    height: 76px;
    width: 43.8786204584px;
    background-size: auto 119.8786204584px;
    background-position: center center;
    border-top: solid 4px #23ab97;
    border-bottom: solid 4px #23ab97;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #fff;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
    /*cover up the box shadows */ }
    .ranking-list .hexagon .hex1,
    .ranking-list .hexagon .hex2 {
      position: absolute;
      overflow: hidden;
      width: 53.7401153702px;
      height: 53.7401153702px;
      top: 6.9696551146px;
      /*for some reason this 1px correction is needed */
      background: inherit;
      box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
      -webkit-transform: scaleX(0.5773502692) rotate(45deg);
      -moz-transform: scaleX(0.5773502692) rotate(45deg);
      -ms-transform: scaleX(0.5773502692) rotate(45deg);
      -o-transform: scaleX(0.5773502692) rotate(45deg);
      transform: scaleX(0.5773502692) rotate(45deg); }
      .ranking-list .hexagon .hex1:after,
      .ranking-list .hexagon .hex2:after {
        /*counter rotate and un-scale the bg image*/
        content: "";
        position: absolute;
        top: -11.9696551146px;
        /*same correction as up above */
        height: 76px;
        width: 53.7401153702px;
        left: 0;
        background: inherit;
        -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
        -moz-transform: rotate(-45deg) scaleX(1.7320508076);
        -ms-transform: rotate(-45deg) scaleX(1.7320508076);
        -o-transform: rotate(-45deg) scaleX(1.7320508076);
        transform: rotate(-45deg) scaleX(1.7320508076); }
    .ranking-list .hexagon .hex1 {
      left: -26.8700576851px;
      border-left: solid 6.9282032303px #23ab97;
      border-bottom: solid 6.9282032303px #23ab97;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .ranking-list .hexagon .hex1:after {
        background-position: 17% center;
        margin-left: -6.9282032303px; }
    .ranking-list .hexagon .hex2 {
      right: -26.8700576851px;
      border-top: solid 6.9282032303px #23ab97;
      border-right: solid 6.9282032303px #23ab97;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden; }
      .ranking-list .hexagon .hex2:after {
        background-position: 83% center;
        margin-top: -5.9282032303px;
        /*that pesky single pixel correction again*/ }
    .ranking-list .hexagon:after {
      content: "";
      position: absolute;
      left: 2.8284271247px;
      right: 0;
      top: 0;
      bottom: 0;
      width: 38.2217662089px;
      background: inherit; }
  @media (max-width: 991px) {
    .ranking-list li {
      padding: 18px 15px 18px 65px; }
      .ranking-list li:before {
        transform: translateY(-50%) scale(0.6, 0.6);
        -webkit-transform: translateY(-50%) scale(0.6, 0.6);
        -ms-transform: translateY(-50%) scale(0.6, 0.6);
        -moz-transform: translateY(-50%) scale(0.6, 0.6);
        left: -10px; }
      .ranking-list li .avatar {
        width: 60px; }
      .ranking-list li .avatar,
      .ranking-list li .title,
      .ranking-list li .score {
        font-size: 14px; }
    .ranking-list .hexagon {
      /*this smushes a square into a 60deg/120deg rhombus*/
      position: relative;
      height: 50px;
      width: 28.8675134595px;
      background-size: auto 78.8675134595px;
      background-position: center center;
      border-top: solid 4px #23ab97;
      border-bottom: solid 4px #23ab97;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      background-color: #fff;
      box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
      /*cover up the box shadows */ }
      .ranking-list .hexagon .hex1,
      .ranking-list .hexagon .hex2 {
        position: absolute;
        overflow: hidden;
        width: 35.3553390593px;
        height: 35.3553390593px;
        top: 3.2168783649px;
        /*for some reason this 1px correction is needed */
        background: inherit;
        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
        -webkit-transform: scaleX(0.5773502692) rotate(45deg);
        -moz-transform: scaleX(0.5773502692) rotate(45deg);
        -ms-transform: scaleX(0.5773502692) rotate(45deg);
        -o-transform: scaleX(0.5773502692) rotate(45deg);
        transform: scaleX(0.5773502692) rotate(45deg); }
        .ranking-list .hexagon .hex1:after,
        .ranking-list .hexagon .hex2:after {
          /*counter rotate and un-scale the bg image*/
          content: "";
          position: absolute;
          top: -8.2168783649px;
          /*same correction as up above */
          height: 50px;
          width: 35.3553390593px;
          left: 0;
          background: inherit;
          -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
          -moz-transform: rotate(-45deg) scaleX(1.7320508076);
          -ms-transform: rotate(-45deg) scaleX(1.7320508076);
          -o-transform: rotate(-45deg) scaleX(1.7320508076);
          transform: rotate(-45deg) scaleX(1.7320508076); }
      .ranking-list .hexagon .hex1 {
        left: -17.6776695297px;
        border-left: solid 6.9282032303px #23ab97;
        border-bottom: solid 6.9282032303px #23ab97;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden; }
        .ranking-list .hexagon .hex1:after {
          background-position: 17% center;
          margin-left: -6.9282032303px; }
      .ranking-list .hexagon .hex2 {
        right: -17.6776695297px;
        border-top: solid 6.9282032303px #23ab97;
        border-right: solid 6.9282032303px #23ab97;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden; }
        .ranking-list .hexagon .hex2:after {
          background-position: 83% center;
          margin-top: -5.9282032303px;
          /*that pesky single pixel correction again*/ }
      .ranking-list .hexagon:after {
        content: "";
        position: absolute;
        left: 2.8284271247px;
        right: 0;
        top: 0;
        bottom: 0;
        width: 23.21065921px;
        background: inherit; } }
  @media (max-width: 767px) {
    .ranking-list li {
      padding: 8px 0px 8px 55px; }
      .ranking-list li .avatar {
        width: 60px;
        padding-right: 10px; }
        .ranking-list li .avatar img {
          width: 50px; }
      .ranking-list li .friend-icon {
        width: 20px;
        margin-top: -9px;
        right: 17px; } }
  .ranking-list.list-stage li {
    padding: 0; }
  .ranking-list.list-stage a, .ranking-list.list-stage .item-content {
    position: relative;
    display: block;
    height: 120px;
    padding: 20px 20px 20px 100px; }
  .ranking-list.list-stage a:hover {
    text-decoration: none; }
  .ranking-list.list-stage .avatar-box,
  .ranking-list.list-stage .description {
    display: table-cell;
    vertical-align: middle;
    line-height: 1; }
  .ranking-list.list-stage .description {
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 37px; }
  .ranking-list.list-stage .avatar-box {
    width: 90px; }
  .ranking-list.list-stage .avatar {
    width: 90px; }
  .ranking-list.list-stage .name {
    color: #878e9a;
    font-size: 14px;
    margin: 0 0 3px;
    word-break: break-all; }
  .ranking-list.list-stage .score {
    display: block;
    color: #2d3940;
    font-size: 24px;
    text-align: left;
    margin: 0 0 5px; }
    .ranking-list.list-stage .score .num {
      font-size: 32px; }
  .ranking-list.list-stage .deck-name {
    color: #2d3940;
    font-size: 18px;
    margin: 0 0 5px; }
  .ranking-list.list-stage .subject-name {
    display: inline-block;
    width: 60px;
    height: 20px;
    color: #fff;
    text-align: center;
    padding: 3px 0;
    border-radius: 10px; }
  .ranking-list.list-stage .el-icons {
    position: absolute;
    right: 20px;
    top: 50%;
    font-size: 24px;
    color: #000;
    margin-top: -12px; }
  .ranking-list.list-stage .p-t-3 {
    padding-top: 3px !important; }
  @media (max-width: 767px) {
    .ranking-list.list-stage a {
      height: auto;
      padding: 10px 10px 10px 40px; }
    .ranking-list.list-stage .avatar-box,
    .ranking-list.list-stage .avatar {
      width: 50px; }
    .ranking-list.list-stage .description {
      padding-left: 10px;
      padding-right: 25px; }
    .ranking-list.list-stage .name {
      font-size: 12px; }
    .ranking-list.list-stage .score {
      font-size: 12px; }
      .ranking-list.list-stage .score .num {
        font-size: 24px; }
    .ranking-list.list-stage .deck-name {
      font-size: 12px; }
    .ranking-list.list-stage .subject-name {
      width: 50px;
      height: 17px;
      padding: 3px 0;
      font-size: 10px; }
    .ranking-list.list-stage .el-icons {
      right: 0;
      font-size: 16px;
      margin-top: -8px; } }

#header {
  position: relative;
  z-index: 1000; }
  #header .container-main {
    height: 105px;
    background-color: #6ecbe6;
    -webkit-box-shadow: 2px 4px 7px 0 rgba(0, 0, 0, 0.4);
    box-shadow: 2px 4px 7px 0 rgba(0, 0, 0, 0.4); }
  #header .logo {
    margin-bottom: -15px;
    float: left;
    position: absolute;
    top: 0;
    background-color: #ffffff;
    padding: 30px 20px 33px;
    border: 3px solid #6ecbe6;
    border-top-width: 0;
    border-bottom-width: 7px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    border-bottom-right-radius: 9px;
    border-bottom-left-radius: 9px;
    -webkit-box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.3);
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.3); }
  #header .menu-head {
    width: auto;
    padding-left: 272px; }
  #header .menu-user {
    float: right;
    padding-top: 10px;
    font-size: 18px;
    color: #ffffff; }
    #header .menu-user li {
      float: left; }
    #header .menu-user .user-name {
      text-align: right;
      margin-top: 29px; }
    #header .menu-user.student .user-name {
      margin-top: 17px; }
    #header .menu-user a {
      color: #ffffff; }
    #header .menu-user .ellipsis {
      display: block;
      width: 160px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
      @media (max-width: 1199px) {
        #header .menu-user .ellipsis {
          width: 80px; } }
    #header .menu-user .avatar {
      width: 90px;
      height: auto;
      margin-left: 10px; }
  #header .dropdown-menu {
    text-align: center;
    padding: 15px;
    border: 3px solid #a0d8e8;
    border-radius: 5px; }
    #header .dropdown-menu:before {
      content: '';
      position: absolute;
      top: -18px;
      left: 50%;
      display: block;
      width: 0;
      height: 0;
      border: 8px solid transparent;
      border-bottom: 10px solid #FFFFFF;
      margin-left: -5px; }
    #header .dropdown-menu li {
      float: none;
      margin: 0 0 10px; }
      #header .dropdown-menu li:last-child {
        margin: 0; }
    #header .dropdown-menu a {
      color: #3e8093;
      font-size: 16px;
      padding: 0; }
  #header .menu-action-wrapper {
    float: left;
    width: 385px;
    padding-top: 14px; }
    #header .menu-action-wrapper.student {
      padding-top: 30px; }
    #header .menu-action-wrapper .icon-dashboard {
      margin: -2px -4px 0 0; }
  #header .select-student {
    display: block;
    width: 100%;
    height: auto;
    color: #3e8093;
    font-size: 14px;
    padding: 6px 12px;
    line-height: 1;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    margin-bottom: 10px; }
  #header .menu-notification {
    float: left;
    padding: 38px 0 0 0px;
    margin: 0; }
    #header .menu-notification li {
      float: left;
      margin: 0 7px; }
    #header .menu-notification a {
      position: relative;
      display: block; }
    #header .menu-notification img {
      width: auto;
      height: 24px; }
    #header .menu-notification .badge {
      position: absolute;
      top: -3px;
      right: -5px;
      font-size: 10px;
      color: #E23258;
      font-weight: bold;
      background: #fff;
      padding: 3px 4px;
      border: 1px solid #6ECBE6;
      border-radius: 50%; }
  #header .menu-action,
  #header .menu-login {
    margin: 0; }
    #header .menu-action li,
    #header .menu-login li {
      float: left; }
  #header .menu-login {
    float: right;
    padding-top: 30px; }
    #header .menu-login .btn {
      padding: 8px 30px; }
      @media (min-width: 992px) {
        #header .menu-login .btn {
          margin-left: 10px; } }
    #header .menu-login .btn-link {
      padding: 10px 30px; }
  #header .btn-link {
    padding: 7px 10px;
    margin: 0; }
  #header .btn-header {
    color: #fff;
    background: #6dcbe5;
    border-color: transparent;
    padding: 4px 10px;
    margin: 0; }
    @media (min-width: 992px) {
      #header .btn-header.active {
        color: #3e8093;
        background-color: #fff;
        border: 3px solid #9fd9e7; } }
    @media (max-width: 991px) {
      #header .btn-header {
        display: block;
        width: 100%;
        font-size: 24px;
        color: #3c8191;
        background: #fff;
        border-radius: 0;
        padding: 19px 10px;
        margin: 0; }
        #header .btn-header.active {
          color: #fff;
          background: #62C2DE;
          border: 3px solid #62C2DE; } }
    @media (max-width: 767px) {
      #header .btn-header {
        font-size: 10px;
        padding: 2px 5px; } }
    #header .btn-header.btn-login {
      color: #3d8091;
      background: #fffd39; }
      #header .btn-header.btn-login.active {
        background: #fff;
        border-color: #e1e036; }
  @media (min-width: 992px) {
    #header .btn-link {
      color: #fff; } }
  @media (max-width: 991px) {
    #header .btn-link {
      float: right;
      width: auto;
      padding: 15px 0 0;
      margin: 0; } }
  @media (max-width: 767px) {
    #header .btn-link {
      font-size: 13px;
      padding: 0; } }
  #header .notification {
    padding: 19px 0;
    border-bottom: 1px solid #fff; }
    #header .notification.recommend-action {
      background-color: #d87800; }
    #header .notification.complete-action {
      background-color: #00d88d; }
    #header .notification.news {
      background-color: #fff151; }
      #header .notification.news .notification-text, #header .notification.news .notification-text a {
        color: #3e8093; }
    #header .notification .notification-text {
      padding-left: 272px;
      font-size: 18px; }
      #header .notification .notification-text, #header .notification .notification-text a {
        color: #fff; }
  #header .header-title {
    padding: 43px 0 30px;
    background-image: url("../../images/header-title-bg.png");
    background-repeat: no-repeat;
    background-position: center right;
    min-height: 100px; }
    #header .header-title .h1 {
      margin: 0;
      font-size: 24px;
      color: #253c42; }
  @media (max-width: 991px) {
    #header .container-main {
      height: auto;
      padding: 0;
      background-color: #fff;
      max-height: none;
      box-shadow: none; }
    #header .menu-head {
      position: relative; }
    #header .logo {
      width: 100%;
      position: static;
      margin-bottom: 0;
      border: 0 none;
      border-radius: 0;
      box-shadow: none;
      padding: 25px 0 25px; }
      #header .logo img {
        width: 200px;
        height: auto; }
      #header .logo .logo-link {
        float: left;
        display: block; }
    #header .bg-light-blue-sp {
      background: #62C2DE;
      padding: 10px 0; }
    #header .select-student {
      float: left;
      width: 400px;
      margin: 0; }
    #header .menu-notification {
      float: right;
      padding: 3px 0; }
    #header .menu-action-wrapper-sp {
      background: #62C2DE;
      border-bottom: 5px solid #3c8191; }
      #header .menu-action-wrapper-sp.border-top {
        border-top: 5px solid #3c8191; }
    #header .menu-action {
      display: table;
      width: 100%;
      table-layout: fixed; }
      #header .menu-action li {
        float: none;
        display: table-cell;
        width: 33.33333%;
        margin: 0; }
    #header .menu-user {
      position: absolute;
      color: #3e8093;
      right: 0;
      top: 0; }
      #header .menu-user a {
        color: #3e8093; }
      #header .menu-user .ellipsis {
        width: 300px; }
    #header .menu-login {
      float: none;
      padding: 0;
      width: 100%; }
      #header .menu-login li {
        float: left;
        width: 50%; }
      #header .menu-login .btn-header {
        color: #fff;
        padding: 15px 30px;
        background: #6dcbe5; }
      #header .menu-login .btn-login {
        color: #3d8091;
        background: #fffd39; }
    #header .notification .notification-text {
      padding-left: 0;
      text-align: left; } }
  @media (max-width: 767px) {
    #header .logo {
      padding: 12px 0 12px; }
      #header .logo img {
        width: 100px;
        height: auto; }
    #header .select-student {
      width: 70%;
      font-size: 10px; }
    #header .menu-user {
      padding-top: 3px; }
      #header .menu-user li {
        font-size: 11px; }
        #header .menu-user li .bold {
          font-size: 14px; }
      #header .menu-user .user-name {
        margin-top: 12px; }
      #header .menu-user .ellipsis {
        width: 120px; }
      #header .menu-user.student .user-name {
        margin-top: 8px; }
      #header .menu-user .avatar {
        width: 45px; }
    #header .menu-action .icon-dashboard {
      width: 13px;
      margin: -1px -1px 0 0; }
    #header .menu-login .btn-header {
      padding: 4px 15px; }
    #header .notification {
      padding: 5px 0; }
      #header .notification .notification-text {
        font-size: 12px; } }

#footer {
  text-align: center;
  color: #232323;
  padding: 33px 0 23px;
  border-bottom: 10px solid #6ecbe6; }
  #footer .footer-nav {
    margin-bottom: 27px; }
    #footer .footer-nav ul {
      margin: 0;
      padding: 0;
      display: inline-block; }
      #footer .footer-nav ul li {
        list-style-type: none;
        float: left;
        font-size: 15px;
        margin: 0 10px; }
        #footer .footer-nav ul li a {
          font-weight: bold;
          color: #232323; }
  #footer .footer-logo a {
    display: inline-block; }
  #footer .footer-logo p {
    margin-top: 27px;
    font-size: 10px;
    margin-bottom: 0; }
  @media (max-width: 991px) {
    #footer .footer-nav ul li {
      margin: 0 5px; } }
  @media (max-width: 767px) {
    #footer {
      padding: 15px 0 6px;
      border-bottom-width: 3px; }
      #footer .footer-nav ul li {
        float: none;
        display: inline-block;
        font-size: 10px; }
        #footer .footer-nav ul li:nth-child(6) {
          display: block;
          opacity: 0;
          overflow: hidden;
          height: 0; }
      #footer .footer-logo img {
        width: 115px;
        height: auto; }
      #footer .footer-logo p {
        margin-top: 13px; } }

.el-wrapper {
  overflow: hidden; }
  .el-wrapper .date-header {
    padding-top: 10px; }

.loading-wrap {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 0.8);
  background-image: url(../images/Preloader_1.gif);
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 2000; }

.page-title {
  text-align: center;
  margin-bottom: 30px; }
  .page-title .h1 {
    font-size: 34px;
    color: #3e8093;
    display: inline-block;
    border-bottom: 3px solid #3e8093;
    font-weight: 700;
    padding: 0 10px 5px;
    margin-top: 60px;
    margin-bottom: 0; }
  .page-title .caption {
    font-size: 18px;
    color: #2d3940;
    margin-top: 25px;
    margin-bottom: 0; }
  @media (max-width: 767px) {
    .page-title .h1 {
      font-size: 21px;
      margin-top: 30px; }
    .page-title .caption {
      font-size: 16px;
      margin-top: 10px; } }

.section-title {
  background-color: #6ecbe6;
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  padding: 13px 0; }
  .section-title:before, .section-title:after {
    content: " ";
    display: table; }
  .section-title:after {
    clear: both; }

.section-title-top {
  font-size: 24px;
  font-weight: 700;
  padding: 13px 0; }
  .section-title-top:before, .section-title-top:after {
    content: " ";
    display: table; }
  .section-title-top:after {
    clear: both; }

.title-triangle-yellow-bg {
  height: 100px;
  color: #3e8093;
  font-size: 34px;
  text-align: center;
  background-image: url("../images/background/bg-triangle-yellow.jpg");
  padding: 32px 0;
  margin: 0 0 50px; }
  @media (max-width: 767px) {
    .title-triangle-yellow-bg {
      height: 50px;
      font-size: 20px;
      background-size: cover;
      padding: 14px 0;
      margin: 0 0 25px; } }

.title-yellow-bg {
  color: #3e8093;
  font-size: 18px;
  padding: 8px 10px;
  background: #fffd3c; }
  @media (max-width: 767px) {
    .title-yellow-bg {
      font-size: 14px;
      padding: 5px 15px; } }
  .title-yellow-bg .text {
    float: left;
    display: block;
    padding: 7px 0 0; }
    @media (max-width: 767px) {
      .title-yellow-bg .text {
        padding-top: 5px; } }
  .title-yellow-bg .btn-circle {
    font-size: 12px;
    margin: 0; }
    @media (max-width: 767px) {
      .title-yellow-bg .btn-circle {
        font-size: 10px;
        line-height: 1.7; } }

.title-light-blue-bg {
  color: #fff;
  font-size: 18px;
  padding: 8px 10px;
  background: #6ecbe6; }
  @media (max-width: 767px) {
    .title-light-blue-bg {
      font-size: 14px;
      padding: 5px 15px; } }

.title-green-bg {
  color: #fff;
  font-size: 18px;
  padding: 8px 10px;
  background: #00bf9d; }
  @media (max-width: 767px) {
    .title-green-bg {
      font-size: 14px;
      padding: 5px 15px; } }

.divider {
  border-top: 1px solid #c6ccd2;
  margin-top: 30px;
  margin-bottom: 10px; }
  .divider.dashed {
    border-top: 1px dashed #c6ccd2; }
  .divider.white {
    border-color: #fff; }
  .divider.dark {
    border-color: #8a8b8b; }

.tab-title {
  margin-bottom: 60px;
  background-image: url("../../images/header-title-bg.png");
  background-repeat: no-repeat;
  background-position: center right;
  padding-top: 50px; }
  @media (max-width: 767px) {
    .tab-title {
      padding-top: 20px; } }
  .tab-title ul {
    position: relative;
    display: table;
    width: 100%;
    margin: 0; }
  .tab-title li {
    display: table-cell;
    width: 1%;
    border: 4px solid #333;
    border-bottom: 0 none;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    position: static;
    background-color: #fff; }
    .tab-title li.active .title {
      display: block;
      z-index: 2; }
    .tab-title li.active a {
      color: #fff; }
    .tab-title li.active.yellow {
      background-color: #ffd800; }
    .tab-title li.active.orange {
      background-color: #ff8a23; }
    .tab-title li.active.green {
      background-color: #4df5b5; }
    .tab-title li.active.light-blue {
      background-color: #5be2fc; }
    .tab-title li.active.blue {
      background-color: #5186f8; }
    .tab-title li.active.light-pink {
      background-color: #ff7e7e; }
    .tab-title li.active.brown {
      background-color: #e9c785; }
    .tab-title li.active.violet {
      background-color: #82a3ea; }
    .tab-title li.active.purple {
      background-color: #8e24aa; }
    .tab-title li.yellow {
      border-color: #ffd800; }
      .tab-title li.yellow .title, .tab-title li.yellow .title:before, .tab-title li.yellow .title:after {
        background-color: #ffd800; }
    .tab-title li.orange {
      border-color: #ff8a23; }
      .tab-title li.orange .title, .tab-title li.orange .title:before, .tab-title li.orange .title:after {
        background-color: #ff8a23; }
    .tab-title li.green {
      border-color: #4df5b5; }
      .tab-title li.green .title, .tab-title li.green .title:before, .tab-title li.green .title:after {
        background-color: #4df5b5; }
    .tab-title li.light-blue {
      border-color: #5be2fc; }
      .tab-title li.light-blue .title, .tab-title li.light-blue .title:before, .tab-title li.light-blue .title:after {
        background-color: #5be2fc; }
    .tab-title li.blue {
      border-color: #5186f8; }
      .tab-title li.blue .title, .tab-title li.blue .title:before, .tab-title li.blue .title:after {
        background-color: #5186f8; }
    .tab-title li.light-pink {
      border-color: #ff7e7e; }
      .tab-title li.light-pink .title, .tab-title li.light-pink .title:before, .tab-title li.light-pink .title:after {
        background-color: #ff7e7e; }
    .tab-title li.brown {
      border-color: #e9c785; }
      .tab-title li.brown .title, .tab-title li.brown .title:before, .tab-title li.brown .title:after {
        background-color: #e9c785; }
    .tab-title li.violet {
      border-color: #82a3ea; }
      .tab-title li.violet .title, .tab-title li.violet .title:before, .tab-title li.violet .title:after {
        background-color: #82a3ea; }
    .tab-title li.purple {
      border-color: #8e24aa; }
      .tab-title li.purple .title, .tab-title li.purple .title:before, .tab-title li.purple .title:after {
        background-color: #8e24aa; }
    .tab-title li > a {
      display: block;
      text-align: center;
      text-decoration: none;
      line-height: 50px;
      font-size: 24px;
      font-weight: 700;
      color: #3e8093; }
    .tab-title li .title {
      display: none;
      position: absolute;
      background-color: #333;
      color: #fff;
      font-size: 24px;
      margin: 0;
      padding: 17px 0;
      width: 100%;
      left: 0;
      top: 100%;
      z-index: 1; }
      .tab-title li .title:before, .tab-title li .title:after {
        content: '';
        display: block;
        width: 100%;
        height: 100%;
        top: 0;
        left: auto;
        right: auto;
        background-color: #333;
        position: absolute; }
      .tab-title li .title:before {
        left: 100%; }
      .tab-title li .title:after {
        right: 100%; }
      .tab-title li .title .textbook-name {
        font-weight: bold; }
      @media (max-width: 767px) {
        .tab-title li .title .publisher {
          display: block;
          margin-top: 5px;
          font-size: 16px; } }
      .tab-title li .title span.change-previous a {
        display: block;
        float: right;
        padding: 3px 1em;
        color: #3e8093;
        background: #fff;
        font-size: 80%; }
        @media (max-width: 767px) {
          .tab-title li .title span.change-previous a {
            font-size: 60%;
            position: relative;
            padding: 3px 6px;
            margin-bottom: -30px; } }

.tab {
  display: table;
  width: 100%;
  table-layout: fixed;
  border-bottom: 3px solid #6ecbe6; }
  .tab li {
    display: table-cell; }
  .tab a {
    display: block;
    height: 50px;
    background: #dedddb;
    color: #2d3940;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin-right: 2px;
    padding: 14px 0;
    border-radius: 7px 7px 0 0; }
    .tab a:hover, .tab a:active {
      text-decoration: none; }
    .tab a.active {
      color: #fffc00;
      background: #6ecbe6; }
    @media (max-width: 767px) {
      .tab a {
        height: 42px;
        font-size: 12px; } }
  .tab li.active a {
    color: #fffc00;
    background: #6ecbe6; }
  .tab li:last-child a {
    margin-right: 0; }

@media (max-width: 767px) {
  .container {
    padding-left: 15px;
    padding-right: 15px; } }

.middle-auto {
  margin-left: auto;
  margin-right: auto; }

.ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.content-frame {
  border: 6px solid #6ecbe6;
  background-color: #fff;
  padding: 94px;
  position: relative;
  margin-bottom: 100px; }
  .content-frame.yellow {
    border-color: #fffd3c; }
  @media (max-width: 1199px) {
    .content-frame {
      padding: 50px; } }
  @media (max-width: 767px) {
    .content-frame {
      padding: 25px 20px;
      margin: 0 -15px;
      border-right: none;
      border-left: none; }
      .content-frame .content-frame-bottom .btn-link {
        padding-left: 0;
        padding-right: 0;
        font-size: 15px; } }
  .content-frame .head {
    padding: 30px;
    margin: -94px -94px 50px; }
    @media (max-width: 1199px) {
      .content-frame .head {
        margin: -50px -50px 50px; } }
    @media (max-width: 767px) {
      .content-frame .head {
        margin: -25px -20px 30px; } }
  .content-frame .frame-inner {
    background: #EFEEEC;
    padding: 20px; }

.content-frame-polygon-bg {
  position: relative;
  padding-top: 45px; }
  .content-frame-polygon-bg .polygon-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto; }
    .content-frame-polygon-bg .polygon-bg img {
      width: 100%; }
  .content-frame-polygon-bg .polygon-bg-static {
    height: 160px;
    background: url(/images/background/content-frame-polygon.png) left top no-repeat;
    background-size: 100% 100%;
    margin: -45px -95px 0;
    padding-top: 40px; }
    @media (max-width: 1199px) {
      .content-frame-polygon-bg .polygon-bg-static {
        margin: -45px -50px 0; } }

.content-frame-designed-corner {
  width: 600px;
  padding: 10px;
  background: #fff;
  border-radius: 5px;
  margin: 0 auto 20px; }
  @media (max-width: 767px) {
    .content-frame-designed-corner {
      width: 100%; } }
  .content-frame-designed-corner.with-ribbon-title .frame-inner .middle {
    padding-top: 20px; }
    @media (max-width: 767px) {
      .content-frame-designed-corner.with-ribbon-title .frame-inner .middle {
        padding-top: 30px; } }
  .content-frame-designed-corner .frame-inner {
    position: relative;
    background: url("../../images/background/content_frame_designed_corner/bg-middle.png") left top repeat-y;
    background-size: 100% auto; }
    @media (max-width: 767px) {
      .content-frame-designed-corner .frame-inner {
        background-color: #6ECBE6;
        padding: 1px; } }
    .content-frame-designed-corner .frame-inner .layer {
      position: absolute;
      width: 100%;
      height: 100%;
      background: url("../../images/background/content_frame_designed_corner/bg-layer.png") center top no-repeat;
      background-size: cover; }
    .content-frame-designed-corner .frame-inner .head {
      width: 100%;
      height: 35px;
      background: url("../../images/background/content_frame_designed_corner/bg-head.jpg") left top no-repeat;
      background-size: 100% auto; }
      @media (max-width: 767px) {
        .content-frame-designed-corner .frame-inner .head {
          display: none; } }
    .content-frame-designed-corner .frame-inner .foot {
      width: 100%;
      height: 39px;
      background: url("../../images/background/content_frame_designed_corner/bg-foot.jpg") left top no-repeat;
      background-size: 100% auto; }
      @media (max-width: 767px) {
        .content-frame-designed-corner .frame-inner .foot {
          display: none; } }
    .content-frame-designed-corner .frame-inner .middle {
      position: relative;
      width: 100%;
      padding: 0 40px; }
      @media (max-width: 767px) {
        .content-frame-designed-corner .frame-inner .middle {
          padding: 20px 15px 20px;
          background-image: none;
          background-color: #6ECBE6;
          border: 1px solid #fff; } }
  @media (max-width: 767px) {
    .content-frame-designed-corner.green {
      width: auto;
      margin-left: -15px;
      margin-right: -15px; } }
  .content-frame-designed-corner.green .frame-inner {
    background: url("../../images/background/content_frame_designed_corner/bg-middle-green.jpg") -1px top repeat-y;
    background-size: 100% auto; }
    @media (max-width: 767px) {
      .content-frame-designed-corner.green .frame-inner {
        background: #8cdbc0;
        padding: 1px; } }
    .content-frame-designed-corner.green .frame-inner .head {
      background: url("../../images/background/content_frame_designed_corner/bg-head-green.jpg") left top no-repeat;
      background-size: 100% auto; }
    .content-frame-designed-corner.green .frame-inner .foot {
      background: url("../../images/background/content_frame_designed_corner/bg-foot-green.jpg") left top no-repeat;
      background-size: 100% auto; }
  .content-frame-designed-corner .frame-padding {
    padding: 0 40px; }
    @media (max-width: 767px) {
      .content-frame-designed-corner .frame-padding {
        padding: 0 20px; } }
  .content-frame-designed-corner .ribbon-img-title {
    position: absolute;
    top: -80px;
    left: 0;
    width: 100%;
    text-align: center; }
    @media (max-width: 767px) {
      .content-frame-designed-corner .ribbon-img-title {
        top: -40px;
        height: 40px; }
        .content-frame-designed-corner .ribbon-img-title img {
          width: auto;
          height: 100%; } }
  .content-frame-designed-corner * {
    color: #295990; }

.wrapper-loading {
  position: relative;
  height: 33px;
  margin: 0px 0px 10px 0px; }

.loading-icon {
  background-color: rgba(255, 255, 255, 0.8);
  background-image: url(../images/Preloader_1.gif);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 33px;
  z-index: 2000; }

.loading {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  display: none; }

.loading-send {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  display: none; }

body {
  background-color: #fff; }

.bold {
  font-weight: bold; }

/*
* Edit avatar
*/
.row-edit-avatar > div {
  margin-bottom: 30px; }

/*
* Search textbook
*/
@media (max-width: 767px) {
  .textbook-search-page .input-group {
    width: 100%; }
    .textbook-search-page .input-group .input-group-btn {
      padding: 0 12px;
      display: block;
      width: 100%;
      margin: 10px 0 30px; }
  .textbook-search-page .textbook-school-item {
    margin-top: 10px; } }

@media (max-width: 767px) {
  .school-search-page .textbook-school-item {
    margin-top: 10px; } }

/*
* Fix bug: can not click image to change avatar in IE 11
*/
.avatar-radio label {
  display: inline-block !important;
  position: relative; }
  .avatar-radio label span {
    text-indent: -9999px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    text-align: left; }
  .avatar-radio label input {
    opacity: 0;
    filter: alpha(opacity=0); }
  .avatar-radio label img {
    pointer-events: none; }
    .avatar-radio label img.selected {
      display: none; }

body > .jqselection-selectable {
  position: absolute;
  z-index: 2147483647;
  opacity: .66; }

.dr-box {
  background-color: #666666;
  display: block;
  padding: 10px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  color: #ffffff;
  cursor: pointer;
  min-width: 177px; }

.dr-box-img img {
  max-width: 60px;
  height: auto; }

.modal-questions-ans {
  margin-bottom: 30px; }
  .modal-questions-ans figure {
    text-align: center; }
    .modal-questions-ans figure img {
      display: block;
      margin: auto;
      max-width: 100%; }

.questions-dataCorrect {
  text-align: center;
  font-weight: bold;
  padding: 30px 0;
  font-size: 16px;
  color: #161616; }

.modal-questions-que.row > .col-xs-2:nth-child(6n+1) {
  clear: both; }
.modal-questions-que.row > .col-xs-3:nth-child(4n+1) {
  clear: both; }

.modal-questions-que .jqdragndrop-drop {
  min-height: 100px;
  margin-left: -5px;
  margin-right: -5px; }
  .modal-questions-que .jqdragndrop-drop:after {
    content: "";
    display: block;
    clear: both; }
  .modal-questions-que .jqdragndrop-drop .jqselection-selectable {
    float: left;
    min-width: 25%;
    padding: 5px; }
    .modal-questions-que .jqdragndrop-drop .jqselection-selectable.dr-box-img {
      font-variant: normal;
      width: auto;
      display: inline-block;
      min-width: inherit; }
    @media (max-width: 767px) {
      .modal-questions-que .jqdragndrop-drop .jqselection-selectable {
        width: 100%; } }

.jqdragndrop-group .jqdragndrop-drop {
  min-height: 200px;
  border: 4px solid #eeeeee; }
  .jqdragndrop-group .jqdragndrop-drop .jqselection-selectable {
    margin-bottom: 10px;
    display: block; }
    .jqdragndrop-group .jqdragndrop-drop .jqselection-selectable.dr-box-img {
      display: inline-block; }
    .jqdragndrop-group .jqdragndrop-drop .jqselection-selectable .dr-box {
      background-color: #00bf9d;
      min-width: inherit; }

.jqdragndrop-sort {
  margin-bottom: 10px; }
  .jqdragndrop-sort > span {
    float: left;
    width: 20px;
    font-size: 16px;
    line-height: 45px; }
  .jqdragndrop-sort .jqdragndrop-drop {
    margin-left: 30px;
    min-height: 47px;
    overflow: hidden;
    border: 1px solid #cdcdcd; }
    .jqdragndrop-sort .jqdragndrop-drop .jqselection-selectable .dr-box {
      background-color: #00bf9d;
      min-width: inherit; }

@media (max-width: 991px) {
  .drill-groupshow-in {
    padding: 20px;
    border: 1px solid #cdcdcd;
    background-color: #fff;
    margin-bottom: 20px; } }

/*dragula-specific*/
.gu-mirror {
  position: fixed !important;
  margin: 0 !important;
  z-index: 9999 !important;
  opacity: 0.8;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  filter: alpha(opacity=80); }

.gu-hide {
  display: none !important; }

.gu-unselectable {
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important; }

.gu-transit {
  opacity: 0.2;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
  filter: alpha(opacity=20); }

.gu-mirror {
  transition: opacity 0.4s ease-in-out; }

.gu-mirror {
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing; }

.subject-detail-page .current-textbook {
  text-align: center;
  font-weight: 700;
  padding: 30px 0 30px; }
  .subject-detail-page .current-textbook:before, .subject-detail-page .current-textbook:after {
    content: " ";
    display: table; }
  .subject-detail-page .current-textbook:after {
    clear: both; }
  .subject-detail-page .current-textbook .h4 {
    font-size: 18px;
    font-weight: 700;
    margin-top: 0; }
    @media (max-width: 767px) {
      .subject-detail-page .current-textbook .h4 {
        font-size: 16px;
        margin-bottom: 6px; } }
  .subject-detail-page .current-textbook .h1 {
    font-size: 38px;
    font-weight: 700;
    margin: 0; }
    @media (max-width: 767px) {
      .subject-detail-page .current-textbook .h1 {
        font-size: 24px; } }
  .subject-detail-page .current-textbook .btn {
    margin-bottom: 0; }
.subject-detail-page .video-banner {
  background-color: #1b171a;
  background-repeat: no-repeat;
  position: relative;
  margin-bottom: 0; }
  .subject-detail-page .video-banner .video-banner-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
    height: 100%;
    z-index: 2; }
    .subject-detail-page .video-banner .video-banner-bg.bg-2 {
      top: -155px;
      left: 20px; }
    .subject-detail-page .video-banner .video-banner-bg.bg-3 {
      top: 59px;
      right: 0;
      left: auto; }
    @media (max-width: 991px) {
      .subject-detail-page .video-banner .video-banner-bg {
        left: -260px; }
        .subject-detail-page .video-banner .video-banner-bg.bg-2 {
          top: -85px;
          left: 0px; }
        .subject-detail-page .video-banner .video-banner-bg.bg-3 {
          top: 59px;
          right: 0;
          left: auto; } }
    @media (max-width: 991px) {
      .subject-detail-page .video-banner .video-banner-bg.bg-2 {
        top: -50px;
        left: -50px; }
      .subject-detail-page .video-banner .video-banner-bg.bg-3 {
        top: 45px;
        right: -50px; } }
  .subject-detail-page .video-banner .video-banner-wrapper {
    position: relative; }
    .subject-detail-page .video-banner .video-banner-wrapper:before, .subject-detail-page .video-banner .video-banner-wrapper:after {
      content: " ";
      display: table; }
    .subject-detail-page .video-banner .video-banner-wrapper:after {
      clear: both; }
    @media (max-width: 991px) {
      .subject-detail-page .video-banner .video-banner-wrapper {
        margin: 0 -15px; } }
  .subject-detail-page .video-banner .video-image {
    position: relative;
    width: 69.1176470588%;
    z-index: 2; }
    @media (min-width: 992px) {
      .subject-detail-page .video-banner .video-image {
        float: right; } }
    @media (max-width: 991px) {
      .subject-detail-page .video-banner .video-image {
        width: 100%; } }
    .subject-detail-page .video-banner .video-image a {
      display: block;
      padding-bottom: 56.25%;
      position: relative; }
      .subject-detail-page .video-banner .video-image a:before {
        content: '';
        display: block;
        width: 84px;
        height: 84px;
        background-image: url("../images/icons/video-play-lg.png");
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -42px;
        margin-left: -42px;
        z-index: 2;
        opacity: 1; }
      .subject-detail-page .video-banner .video-image a:hover:before {
        opacity: 0.7; }
      .subject-detail-page .video-banner .video-image a img {
        position: absolute;
        width: 100%;
        height: auto;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        left: 0;
        top: 50%; }
.subject-detail-page .textbook-description .unit-and-chapter {
  font-size: 18px;
  margin: 0; }
.subject-detail-page .textbook-description .title {
  font-size: 30px;
  font-weight: 700; }
@media (min-width: 992px) {
  .subject-detail-page .textbook-description {
    position: absolute;
    z-index: 3;
    padding-top: 28px; }
    .subject-detail-page .textbook-description .unit-and-chapter {
      color: #6ECBE6; }
    .subject-detail-page .textbook-description .title {
      max-width: 600px;
      background-color: #6ecbe6;
      display: inline-block;
      color: #fff;
      padding: 16px 20px;
      margin: 0 0 40px; }
    .subject-detail-page .textbook-description .point {
      font-weight: bold;
      font-size: 20px;
      margin-bottom: 5px; }
    .subject-detail-page .textbook-description .point-text {
      width: 325px;
      background: #fff;
      padding: 5px; } }
@media (max-width: 991px) {
  .subject-detail-page .textbook-description {
    position: static;
    margin-bottom: 60px; }
    .subject-detail-page .textbook-description .unit-and-chapter {
      display: inline-block;
      background: #fff;
      padding: 5px 10px;
      border-radius: 4px;
      margin-bottom: 8px; }
    .subject-detail-page .textbook-description .title {
      margin: 0 0 10px; }
    .subject-detail-page .textbook-description .points-list {
      margin-top: 0; } }
@media (max-width: 767px) {
  .subject-detail-page .textbook-description {
    margin-bottom: 40px; }
    .subject-detail-page .textbook-description .unit-and-chapter {
      font-size: 12px; }
    .subject-detail-page .textbook-description .title {
      font-size: 24px; } }
.subject-detail-page .main-content {
  padding-top: 110px; }
  @media (max-width: 991px) {
    .subject-detail-page .main-content {
      padding-top: 30px; } }
  @media (max-width: 767px) {
    .subject-detail-page .main-content {
      padding-top: 15px; } }

.video-detail-page .video-banner {
  background-color: #080708; }
  @media (max-width: 1279px) {
    .video-detail-page .video-banner {
      border-bottom: 70px solid #52bede; } }
  @media (max-width: 767px) {
    .video-detail-page .video-banner {
      border-bottom-width: 0; } }
  @media (max-width: 767px) {
    .video-detail-page .video-banner {
      border-bottom-width: 0; } }
  .video-detail-page .video-banner .video-banner-wrapper {
    text-align: center; }
  .video-detail-page .video-banner .video-image {
    display: inline-block;
    position: relative; }
    .video-detail-page .video-banner .video-image a {
      display: block; }
      .video-detail-page .video-banner .video-image a:before {
        content: '';
        display: block;
        width: 84px;
        height: 84px;
        background-image: url("../images/icons/video-play-lg.png");
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -42px;
        margin-left: -42px;
        z-index: 2;
        opacity: 1; }
      .video-detail-page .video-banner .video-image a:hover:before {
        opacity: 0.7; }
  .video-detail-page .video-banner #drill-screen {
    position: relative; }
  .video-detail-page .video-banner .tweet-buttons {
    position: absolute;
    right: -120px;
    top: 60px;
    z-index: 1; }
    @media (max-width: 1279px) {
      .video-detail-page .video-banner .tweet-buttons {
        right: auto;
        left: 0;
        top: auto;
        bottom: -128px;
        border-top: 0 none;
        width: auto;
        display: table; }
        .video-detail-page .video-banner .tweet-buttons:before, .video-detail-page .video-banner .tweet-buttons:after {
          content: " ";
          display: table; }
        .video-detail-page .video-banner .tweet-buttons:after {
          clear: both; }
        .video-detail-page .video-banner .tweet-buttons .h3 {
          display: table-cell;
          vertical-align: middle;
          padding-bottom: 0;
          border-bottom: 0;
          border-right: 1px solid #52bede;
          padding-right: 10px; }
        .video-detail-page .video-banner .tweet-buttons ul {
          display: table-cell;
          vertical-align: middle;
          padding-left: 10px; }
        .video-detail-page .video-banner .tweet-buttons li {
          float: left; } }
    @media (max-width: 767px) {
      .video-detail-page .video-banner .tweet-buttons {
        bottom: -75px;
        left: 0;
        right: 0;
        display: none !important;
        padding-left: 60px;
        max-width: 400px; }
        .video-detail-page .video-banner .tweet-buttons .h3 {
          width: 50px;
          position: absolute;
          top: 50%;
          margin-top: -15px;
          left: 10px; }
        .video-detail-page .video-banner .tweet-buttons ul {
          display: block;
          width: 100%;
          margin: 0;
          padding: 0; }
          .video-detail-page .video-banner .tweet-buttons ul li {
            float: left;
            width: 25%; } }
.video-detail-page .main-content {
  padding-top: 45px; }
  .video-detail-page .main-content.x-skip-al-padding-sp {
    padding-top: 95px; }
  @media (max-width: 1279px) {
    .video-detail-page .main-content {
      padding-top: 75px; }
      .video-detail-page .main-content.x-skip-al-padding-sp {
        padding-top: 75px; } }
  @media (max-width: 767px) {
    .video-detail-page .main-content {
      padding-top: 30px; }
      .video-detail-page .main-content.x-skip-al-padding-sp {
        padding-top: 80px; } }
.video-detail-page .video-information {
  color: #2d3940;
  margin-bottom: 25px; }
  .video-detail-page .video-information:before, .video-detail-page .video-information:after {
    content: " ";
    display: table; }
  .video-detail-page .video-information:after {
    clear: both; }
  .video-detail-page .video-information .description-box {
    position: relative;
    padding-right: 240px; }
    @media (max-width: 767px) {
      .video-detail-page .video-information .description-box {
        padding: 0; } }
  .video-detail-page .video-information .h1 {
    font-size: 42px;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 10px; }
    @media (max-width: 767px) {
      .video-detail-page .video-information .h1 {
        font-size: 24px;
        margin-bottom: 8px; } }
  .video-detail-page .video-information .unit-and-chapter {
    font-size: 20px; }
    @media (max-width: 767px) {
      .video-detail-page .video-information .unit-and-chapter {
        font-size: 16px;
        margin-bottom: 5px; } }
  .video-detail-page .video-information .subject {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #edeef0;
    font-size: 24px;
    padding: 5px 22px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    margin-bottom: 0; }
    @media (max-width: 767px) {
      .video-detail-page .video-information .subject {
        position: static;
        float: left;
        font-size: 12px;
        padding: 5px 10px; } }
@media (max-width: 767px) {
  .video-detail-page .current-progress {
    margin-bottom: 0; } }
.video-detail-page .sub-content {
  padding-top: 110px; }
  @media (max-width: 767px) {
    .video-detail-page .sub-content {
      padding-top: 25px; } }
@media (max-width: 1199px) {
  .video-detail-page .next-video {
    padding-top: 40px; } }
@media (max-width: 767px) {
  .video-detail-page .next-video {
    padding-top: 10px; } }

.profile-detail-page .learning-videos {
  padding: 60px 0; }
  .profile-detail-page .learning-videos .panel {
    margin-bottom: -40px; }
.profile-detail-page .main-content {
  padding-top: 60px; }
@media (min-width: 768px) {
  .profile-detail-page .drill-section {
    padding: 50px 0 70px; } }
.profile-detail-page .drill-section .title-yellow-bg {
  margin: 0 0 30px; }
  @media (max-width: 767px) {
    .profile-detail-page .drill-section .title-yellow-bg {
      margin: 0 -15px; } }
.profile-detail-page .top_banner_box {
  display: block; }
  @media (min-width: 768px) {
    .profile-detail-page .top_banner_box {
      margin-bottom: 15px; } }
  @media (max-width: 767px) {
    .profile-detail-page .top_banner_box {
      margin-bottom: 10px; } }

.search-items-by {
  text-align: center;
  padding-top: 25px;
  padding-bottom: 70px; }
  @media (max-width: 767px) {
    .search-items-by {
      padding-bottom: 25px; } }
  .search-items-by .search-group.by-grade .available-search a {
    font-size: 17px; }
  .search-items-by .search-group + .search-group {
    margin-top: 30px; }
  .search-items-by .search-group > .el-icons {
    color: #fff;
    font-size: 23px; }
  .search-items-by .search-group > .h3 {
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    margin-top: 5px; }
  .search-items-by .search-group .available-search {
    display: table;
    width: 100%; }
    .search-items-by .search-group .available-search a {
      display: table-cell;
      vertical-align: middle;
      text-align: center;
      width: auto;
      background-color: #fff;
      padding: 28px 10px 5px;
      font-size: 24px;
      font-weight: 700;
      color: #2d3940; }
      .search-items-by .search-group .available-search a:nth-child(odd) {
        background-color: #eee; }
      .search-items-by .search-group .available-search a:hover {
        text-decoration: none;
        background-color: #ddd; }
      .search-items-by .search-group .available-search a span {
        padding: 0 3px; }
      .search-items-by .search-group .available-search a .el-icons {
        font-weight: 700;
        font-size: 27px; }
  @media (max-width: 767px) {
    .search-items-by .search-group.by-grade .available-search a {
      font-size: 13px; }
    .search-items-by .search-group > .h3 {
      font-size: 14px; }
    .search-items-by .search-group > .el-icons {
      font-size: 18px; }
    .search-items-by .search-group .available-search {
      display: block; }
      .search-items-by .search-group .available-search:before, .search-items-by .search-group .available-search:after {
        content: " ";
        display: table; }
      .search-items-by .search-group .available-search:after {
        clear: both; }
      .search-items-by .search-group .available-search a {
        display: block;
        width: 50%;
        float: left;
        padding: 10px;
        font-size: 15px; }
        .search-items-by .search-group .available-search a:nth-child(odd) {
          background-color: #fff; }
        .search-items-by .search-group .available-search a:nth-child(1), .search-items-by .search-group .available-search a:nth-child(4), .search-items-by .search-group .available-search a:nth-child(5), .search-items-by .search-group .available-search a:nth-child(8), .search-items-by .search-group .available-search a:nth-child(9) {
          background-color: #eee; }
        .search-items-by .search-group .available-search a br,
        .search-items-by .search-group .available-search a .el-icons {
          display: none; } }

.top-index-page .top-banner {
  background-color: #15559d;
  background-position: center;
  margin: -20px 0 0 0; }
  .top-index-page .top-banner .top-banner-mobile {
    display: none;
    margin: auto; }
  .top-index-page .top-banner .top-banner-pc {
    display: block;
    margin: auto; }
.top-index-page .button-wrapper {
  margin: auto;
  padding: 25px 0 50px 0;
  text-align: center; }
  .top-index-page .button-wrapper .btn {
    border-left: 0 none;
    border-top: 1px solid #009578;
    border-right: 3px solid #009578;
    border-bottom: 4px solid #009578;
    font-size: 22px;
    padding: 16px 50px 16px 35px; }
    .top-index-page .button-wrapper .btn .el-icons {
      margin-right: 35px; }
.top-index-page .top-grades {
  padding: 0 80px;
  margin-bottom: 35px; }
  .top-index-page .top-grades .grades-list {
    display: table;
    width: 100%; }
    .top-index-page .top-grades .grades-list li {
      display: table-cell;
      text-align: center;
      position: relative; }
      .top-index-page .top-grades .grades-list li + li:before {
        content: '';
        display: block;
        width: 2px;
        height: 24px;
        background-color: #2d3940;
        position: absolute;
        top: 50%;
        margin-top: -11px;
        left: -1px; }
      .top-index-page .top-grades .grades-list li.striped-yellow span:after {
        background-color: #ffde00; }
      .top-index-page .top-grades .grades-list li.striped-orange span:after {
        background-color: #ff9000; }
      .top-index-page .top-grades .grades-list li.striped-green span:after {
        background-color: #4df5b5; }
      .top-index-page .top-grades .grades-list li.striped-light-blue span:after {
        background-color: #5be2fc; }
      .top-index-page .top-grades .grades-list li.striped-blue span:after {
        background-color: #5186f8; }
      .top-index-page .top-grades .grades-list li.striped-violet span:after {
        background-color: #5186f8; }
      .top-index-page .top-grades .grades-list li.striped-light-pink span:after {
        background-color: #ff7e7e; }
      .top-index-page .top-grades .grades-list li.striped-brown span:after {
        background-color: #e9c785; }
      .top-index-page .top-grades .grades-list li.striped-purple span:after {
        background-color: #8e24aa; }
      .top-index-page .top-grades .grades-list li a:hover span:after {
        background-color: #bbb !important; }
    .top-index-page .top-grades .grades-list a:hover {
      text-decoration: none; }
    .top-index-page .top-grades .grades-list span {
      font-size: 24px;
      color: #2d3940;
      display: inline-block;
      font-weight: 700;
      padding: 0 5px; }
      .top-index-page .top-grades .grades-list span.small {
        font-size: 12px;
        display: block; }
        .top-index-page .top-grades .grades-list span.small:after {
          display: none; }
      .top-index-page .top-grades .grades-list span:after {
        content: '';
        display: block;
        height: 5px;
        background-color: #ddd;
        margin-top: 10px; }
.top-index-page .select-change-grade {
  text-align: center;
  margin-top: -40px; }
  .top-index-page .select-change-grade .btn-group {
    margin-bottom: 25px; }
  .top-index-page .select-change-grade .btn.dropdown-toggle {
    font-weight: 700;
    height: auto;
    border: 2px solid #2d3940;
    border-right: 7px solid #2d3940;
    border-bottom: 5px solid #2d3940;
    position: relative;
    padding: 28px 95px 18px 55px;
    background-color: #fff; }
    .top-index-page .select-change-grade .btn.dropdown-toggle span {
      display: inline-block; }
    .top-index-page .select-change-grade .btn.dropdown-toggle .bold {
      font-size: 39px;
      color: #0a7fb3; }
    .top-index-page .select-change-grade .btn.dropdown-toggle .small {
      color: #2d3940;
      font-size: 23px; }
    .top-index-page .select-change-grade .btn.dropdown-toggle .icon {
      position: absolute;
      top: 50%;
      right: 35px;
      margin-top: -21px; }
      .top-index-page .select-change-grade .btn.dropdown-toggle .icon span {
        display: block;
        font-size: 13px; }
      .top-index-page .select-change-grade .btn.dropdown-toggle .icon .el-icons {
        font-size: 30px;
        line-height: 15px;
        height: 15px;
        font-weight: 700;
        display: block; }
  .top-index-page .select-change-grade .dropdown-menu {
    width: 100%; }
    .top-index-page .select-change-grade .dropdown-menu li a {
      font-size: 20px;
      font-weight: 700; }
@media (max-width: 767px) {
  .d-md-none{
    display: none;
  }
  .top-index-page .select-change-grade {
    margin-top: -30px;
    margin-bottom: 20px; }
    .top-index-page .select-change-grade:before, .top-index-page .select-change-grade:after {
      content: " ";
      display: table; }
    .top-index-page .select-change-grade:after {
      clear: both; }
    .top-index-page .select-change-grade .btn-group {
      display: block;
      margin: 0; }
      .top-index-page .select-change-grade .btn-group:before, .top-index-page .select-change-grade .btn-group:after {
        content: " ";
        display: table; }
      .top-index-page .select-change-grade .btn-group:after {
        clear: both; }
    .top-index-page .select-change-grade .btn.dropdown-toggle {
      display: block;
      width: 100%;
      padding: 7px 50px 5px 25px;
      border-right-width: 3px;
      border-bottom-width: 3px; }
      .top-index-page .select-change-grade .btn.dropdown-toggle .bold {
        font-size: 18px; }
      .top-index-page .select-change-grade .btn.dropdown-toggle .small {
        font-size: 12px; }
      .top-index-page .select-change-grade .btn.dropdown-toggle .icon {
        right: 15px; }
        .top-index-page .select-change-grade .btn.dropdown-toggle .icon span {
          font-size: 8px; }
        .top-index-page .select-change-grade .btn.dropdown-toggle .icon .el-icons {
          font-size: 22px;
          line-height: 0; }
  .top-index-page .top-grades {
    padding: 0;
    text-align: center;
    margin-bottom: 0; }
    .top-index-page .top-grades .grades-list {
      display: inline-block;
      width: auto;
      margin-bottom: 30px; }
      .top-index-page .top-grades .grades-list:before, .top-index-page .top-grades .grades-list:after {
        content: " ";
        display: table; }
      .top-index-page .top-grades .grades-list:after {
        clear: both; }
      .top-index-page .top-grades .grades-list li {
        display: inline-block;
        padding-left: 15px;
        padding-right: 15px;
        margin-bottom: 5px; }
      .top-index-page .top-grades .grades-list span {
        font-size: 14px; }
        .top-index-page .top-grades .grades-list span:after {
          margin-top: 4px; }
        .top-index-page .top-grades .grades-list span.small {
          font-size: 8px; } }
@media (max-width: 991px) {
  .top-index-page .top-banner {
    background-image: none;
    height: 100%;
    margin: -20px 0; }
    .top-index-page .top-banner .top-banner-pc {
      display: block;
      width: 100%; }
  .top-index-page .button-wrapper {
    visibility: hidden;
    padding: 5px; }
    .top-index-page .button-wrapper .btn {
      padding: 0; } }
@media (max-width: 500px) {
  .top-index-page .top-banner {
    height: auto; }
    .top-index-page .top-banner .top-banner-mobile {
      display: block;
      height: auto;
      width: 100%; }
    .top-index-page .top-banner .top-banner-pc {
      display: none; } }
@media (max-width: 400px) {
  .top-index-page .top-grades .grades-list {
    width: 290px; }
    .top-index-page .top-grades .grades-list li {
      padding-left: 10px;
      padding-right: 10px; }
      .top-index-page .top-grades .grades-list li:nth-child(4n+1):before {
        display: none; } }
@media (min-width: 768px) {
  .top-index-page .drill-section {
    padding: 50px 0 70px; } }
.top-index-page .drill-section .title-yellow-bg {
  margin: 0 0 30px; }
  @media (max-width: 767px) {
    .top-index-page .drill-section .title-yellow-bg {
      margin: 0 -15px; } }
.top-index-page .top_banner_box {
  display: block; }
  @media (min-width: 768px) {
    .top-index-page .top_banner_box {
      margin-bottom: 15px; } }
  @media (max-width: 767px) {
    .top-index-page .top_banner_box {
      margin-bottom: 10px; } }

.content-index-page .main-content {
  padding-top: 40px; }

.news-detail-page .news-title:before, .news-detail-page .news-title:after {
  content: " ";
  display: table; }
.news-detail-page .news-title:after {
  clear: both; }
.news-detail-page .news-title .h2 {
  font-size: 24px;
  color: #2d3940;
  font-weight: 700;
  border-bottom: 1px solid #c6ccd2;
  padding-bottom: 10px; }
.news-detail-page .news-title .date-time {
  font-size: 14px;
  color: #2d3940;
  float: right; }
.news-detail-page .news-content {
  color: #2d3940;
  font-size: 16px;
  margin-bottom: 50px;
  margin-top: 20px; }
  .news-detail-page .news-content h1, .news-detail-page .news-content h2, .news-detail-page .news-content h3, .news-detail-page .news-content h4, .news-detail-page .news-content h5, .news-detail-page .news-content h6 {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 15px; }
    .news-detail-page .news-content h1 + br, .news-detail-page .news-content h2 + br, .news-detail-page .news-content h3 + br, .news-detail-page .news-content h4 + br, .news-detail-page .news-content h5 + br, .news-detail-page .news-content h6 + br {
      display: none; }
  .news-detail-page .news-content p {
    font-size: 16px;
    margin-bottom: 15px; }
  .news-detail-page .news-content p + br {
    display: none; }
  .news-detail-page .news-content ul, .news-detail-page .news-content ol {
    padding-left: 20px;
    margin-bottom: 15px; }
    .news-detail-page .news-content ul li, .news-detail-page .news-content ol li {
      margin-bottom: 5px; }
      .news-detail-page .news-content ul li + br, .news-detail-page .news-content ol li + br {
        display: none; }
  .news-detail-page .news-content table {
    border: 1px solid #a0a0a0;
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 25px; }
    .news-detail-page .news-content table td, .news-detail-page .news-content table th {
      padding: 5px;
      border: 1px solid #a0a0a0; }
    .news-detail-page .news-content table th {
      background: #ccc;
      font-weight: bold; }

.play-page .bg-shining-yellow .bg-inner {
  padding: 40px 0 60px; }
  @media (max-width: 767px) {
    .play-page .bg-shining-yellow .bg-inner {
      padding: 20px 0 30px; } }
@media (max-width: 767px) {
  .play-page .content-frame-designed-corner {
    width: auto;
    margin: 0 -15px; } }
.play-page .content-frame-designed-corner .frame-title {
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  margin: 0 0 15px; }
  @media (max-width: 767px) {
    .play-page .content-frame-designed-corner .frame-title {
      font-size: 16px; } }
.play-page .btn-area .text {
  font-size: 12px;
  text-align: center;
  font-weight: bold;
  margin: 0 0 5px;
  clear: both; }
  .play-page .btn-area .text:after {
    content: "";
    display: block;
    clear: both; }
.play-page .btn-area .btn {
  background: #fffd3c;
  border-right: 3px solid #fffd3c;
  border-bottom: 3px solid #ffe400;
  border-top: none;
  border-left: none;
  margin: 0; }
  @media (min-width: 768px) {
    .play-page .btn-area .btn {
      width: 200px; } }
  .play-page .btn-area .btn.btn-no-power {
    color: #fff;
    background-color: #ababab;
    border: 3px solid #ababab; }
    @media (min-width: 768px) {
      .play-page .btn-area .btn.btn-no-power {
        width: 250px; } }
.play-page hr {
  border-top: 1px dotted #fff;
  clear: both; }
@media (min-width: 768px) {
  .play-page .back-link {
    width: 422px; } }
.play-page .list-btn-area {
  float: left;
  width: 100%; }
  .play-page .list-btn-area .btn-blue-custom {
    background-color: #39aae6;
    color: #fff;
    font-size: 24px;
    padding: 25px 10px;
    font-weight: normal;
    border: none;
    box-shadow: 3px 3px 1px #3099d0;
    float: normal;
    width: 100%;
    word-wrap: break-word; }
    @media (max-width: 767px) {
      .play-page .list-btn-area .btn-blue-custom {
        font-size: 18px; } }
  .play-page .list-btn-area .btn-brown-custom {
    background-color: #dedede;
    color: #0786ca;
    font-size: 12px;
    padding: 30px 10px;
    font-weight: normal;
    border: none;
    margin-bottom: 35px;
    width: 100%;
    word-wrap: break-word; }
  .play-page .list-btn-area .threeBtn {
    max-width: 100% !important; }
    .play-page .list-btn-area .threeBtn a {
      width: 28%;
      position: relative;
      text-align: center;
      margin-left: 33px;
      font-size: 24px;
      color: #40547e;
      min-height: 80px;
      vertical-align: middle; }
      @media (max-width: 767px) {
        .play-page .list-btn-area .threeBtn a {
          width: 40%; }
          .play-page .list-btn-area .threeBtn a:last-child {
            margin-bottom: 0; } }
      @media (max-width: 625px) {
        .play-page .list-btn-area .threeBtn a {
          width: 95%;
          margin-bottom: 20px;
          margin-left: 0; } }
      .play-page .list-btn-area .threeBtn a:first-child {
        margin-left: 0; }
      .play-page .list-btn-area .threeBtn a img {
        margin: 0 auto; }
    @media (max-width: 767px) and (min-width: 625px) {
      .play-page .list-btn-area .threeBtn .mgtl {
        margin-top: 20px;
        margin-left: 0; } }
    @media (max-width: 991px) {
      .play-page .list-btn-area .threeBtn .pdt18 {
        padding-top: 18px; } }
    @media (max-width: 767px) {
      .play-page .list-btn-area .threeBtn .pdt18 {
        padding-top: 6px; } }
  .play-page .list-btn-area .btn-area {
    max-width: 600px;
    text-align: center;
    display: block;
    margin: 0 auto 20px; }
    @media (max-width: 767px) {
      .play-page .list-btn-area .btn-area {
        margin: 10px 0; } }
.play-page .pd40 {
  padding: 0 40px; }
  @media (max-width: 767px) {
    .play-page .pd40 {
      padding: 0 10px; } }

.play-index-page .bg-shining-yellow .bg-inner {
  padding: 40px 0 20px; }
  @media (max-width: 767px) {
    .play-index-page .bg-shining-yellow .bg-inner {
      padding: 20px 0 20px; } }
.play-index-page .bg-triangle-blue {
  padding: 40px 0 60px; }
  @media (max-width: 767px) {
    .play-index-page .bg-triangle-blue {
      padding: 20px 0 30px; } }
.play-index-page .user-info,
.play-index-page .action-area {
  max-width: 600px;
  text-align: center;
  margin: 0 auto; }
.play-index-page .user-info .user-name {
  position: relative;
  display: inline-block;
  min-width: 250px;
  height: 54px;
  color: #fff;
  font-size: 28px;
  padding: 7px 15px;
  background: #355c87;
  border-bottom: 1px solid #63809f; }
  @media (max-width: 767px) {
    .play-index-page .user-info .user-name {
      width: 250px;
      height: 40px;
      font-size: 18px;
      padding: 7px 15px; } }
  .play-index-page .user-info .user-name:before {
    content: '';
    position: absolute;
    top: 0;
    left: -22px;
    display: block;
    width: 27px;
    height: 62px;
    background: url("/images/ribbon_title/left.png") left top no-repeat; }
    @media (max-width: 767px) {
      .play-index-page .user-info .user-name:before {
        left: -20px;
        width: 20px;
        height: 45px;
        background-size: 100% auto; } }
  .play-index-page .user-info .user-name:after {
    content: '';
    position: absolute;
    top: 0;
    right: -22px;
    display: block;
    width: 27px;
    height: 62px;
    background: url("/images/ribbon_title/right.png") left top no-repeat; }
    @media (max-width: 767px) {
      .play-index-page .user-info .user-name:after {
        right: -20px;
        width: 20px;
        height: 45px;
        background-size: 100% auto; } }
.play-index-page .user-info .thumb {
  display: block;
  width: 190px;
  height: auto;
  margin: -30px auto 0; }
  @media (max-width: 767px) {
    .play-index-page .user-info .thumb {
      width: 160px; } }
.play-index-page .user-info .rabi-point {
  margin-top: -34px; }
  @media (max-width: 767px) {
    .play-index-page .user-info .rabi-point {
      margin-top: -26px; } }
  .play-index-page .user-info .rabi-point .icon-point {
    display: inline-block;
    width: 60px;
    height: 60px;
    background: url("../images/icons/rt-ico-point.png") left top no-repeat;
    background-size: 100% auto; }
    @media (max-width: 767px) {
      .play-index-page .user-info .rabi-point .icon-point {
        width: 45px;
        height: 45px; } }
  .play-index-page .user-info .rabi-point .text {
    color: #295990;
    font-size: 16px;
    margin: 0 0 -5px; }
    @media (max-width: 767px) {
      .play-index-page .user-info .rabi-point .text {
        font-size: 12px; } }
  .play-index-page .user-info .rabi-point .point {
    color: #295990;
    font-size: 46px;
    font-weight: bold; }
    @media (max-width: 767px) {
      .play-index-page .user-info .rabi-point .point {
        font-size: 30px; } }
.play-index-page .user-info .power-indicator {
  position: relative; }
  .play-index-page .user-info .power-indicator .score {
    position: absolute;
    right: 59px;
    top: -40px;
    line-height: 1;
    text-shadow: -4px -4px 0 #6ecbe6, -4px -3px 0 #6ecbe6, -4px -2px 0 #6ecbe6, -4px -1px 0 #6ecbe6, -4px 0px 0 #6ecbe6, -4px 1px 0 #6ecbe6, -4px 2px 0 #6ecbe6, -4px 3px 0 #6ecbe6, -4px 4px 0 #6ecbe6, -3px -4px 0 #6ecbe6, -3px -3px 0 #6ecbe6, -3px -2px 0 #6ecbe6, -3px -1px 0 #6ecbe6, -3px 0px 0 #6ecbe6, -3px 1px 0 #6ecbe6, -3px 2px 0 #6ecbe6, -3px 3px 0 #6ecbe6, -3px 4px 0 #6ecbe6, -2px -4px 0 #6ecbe6, -2px -3px 0 #6ecbe6, -2px -2px 0 #6ecbe6, -2px -1px 0 #6ecbe6, -2px 0px 0 #6ecbe6, -2px 1px 0 #6ecbe6, -2px 2px 0 #6ecbe6, -2px 3px 0 #6ecbe6, -2px 4px 0 #6ecbe6, -1px -4px 0 #6ecbe6, -1px -3px 0 #6ecbe6, -1px -2px 0 #6ecbe6, -1px -1px 0 #6ecbe6, -1px 0px 0 #6ecbe6, -1px 1px 0 #6ecbe6, -1px 2px 0 #6ecbe6, -1px 3px 0 #6ecbe6, -1px 4px 0 #6ecbe6, 0px -4px 0 #6ecbe6, 0px -3px 0 #6ecbe6, 0px -2px 0 #6ecbe6, 0px -1px 0 #6ecbe6, 0px 0px 0 #6ecbe6, 0px 1px 0 #6ecbe6, 0px 2px 0 #6ecbe6, 0px 3px 0 #6ecbe6, 0px 4px 0 #6ecbe6, 1px -4px 0 #6ecbe6, 1px -3px 0 #6ecbe6, 1px -2px 0 #6ecbe6, 1px -1px 0 #6ecbe6, 1px 0px 0 #6ecbe6, 1px 1px 0 #6ecbe6, 1px 2px 0 #6ecbe6, 1px 3px 0 #6ecbe6, 1px 4px 0 #6ecbe6, 2px -4px 0 #6ecbe6, 2px -3px 0 #6ecbe6, 2px -2px 0 #6ecbe6, 2px -1px 0 #6ecbe6, 2px 0px 0 #6ecbe6, 2px 1px 0 #6ecbe6, 2px 2px 0 #6ecbe6, 2px 3px 0 #6ecbe6, 2px 4px 0 #6ecbe6, 3px -4px 0 #6ecbe6, 3px -3px 0 #6ecbe6, 3px -2px 0 #6ecbe6, 3px -1px 0 #6ecbe6, 3px 0px 0 #6ecbe6, 3px 1px 0 #6ecbe6, 3px 2px 0 #6ecbe6, 3px 3px 0 #6ecbe6, 3px 4px 0 #6ecbe6, 4px -4px 0 #6ecbe6, 4px -3px 0 #6ecbe6, 4px -2px 0 #6ecbe6, 4px -1px 0 #6ecbe6, 4px 0px 0 #6ecbe6, 4px 1px 0 #6ecbe6, 4px 2px 0 #6ecbe6, 4px 3px 0 #6ecbe6, 4px 4px 0 #6ecbe6;
    color: #fffd3c; }
    .play-index-page .user-info .power-indicator .score .num {
      font-size: 1.8em; }
    .play-index-page .user-info .power-indicator .score .text {
      font-size: 0.9em;
      padding-right: 10px; }
  .play-index-page .user-info .power-indicator .illust {
    position: absolute;
    right: 5px;
    top: -64px; }
    @media (max-width: 767px) {
      .play-index-page .user-info .power-indicator .illust {
        width: 60px;
        top: -62px; } }
  .play-index-page .user-info .power-indicator .indicator-box {
    position: relative;
    height: 60px;
    padding: 12px 12px 12px 80px;
    background: #6ecbe6;
    border-radius: 6px;
    margin-bottom: 20px; }
    @media (max-width: 767px) {
      .play-index-page .user-info .power-indicator .indicator-box {
        height: 50px;
        padding: 10px 10px 10px 55px;
        margin-bottom: 15px; } }
    .play-index-page .user-info .power-indicator .indicator-box .text {
      position: absolute;
      top: 14px;
      left: 14px;
      color: #fff;
      font-size: 14px;
      line-height: 1.2;
      text-shadow: 2px 2px 2px #4dbad9; }
      @media (max-width: 767px) {
        .play-index-page .user-info .power-indicator .indicator-box .text {
          top: 13px;
          left: 10px;
          font-size: 10px; } }
    .play-index-page .user-info .power-indicator .indicator-box .progress-wrapper {
      position: relative;
      margin: 0; }
      .play-index-page .user-info .power-indicator .indicator-box .progress-wrapper .progress {
        height: 40px;
        background: #fff;
        border: 4px solid #4dbad9; }
        @media (max-width: 767px) {
          .play-index-page .user-info .power-indicator .indicator-box .progress-wrapper .progress {
            height: 30px;
            border: 3px solid #4dbad9; } }
        .play-index-page .user-info .power-indicator .indicator-box .progress-wrapper .progress .progress-bar {
          /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fffd3c+0,fffd3c+50,ffe400+50,ffe400+100 */
          background: #fffd3c;
          /* Old browsers */
          background: -moz-linear-gradient(top, #fffd3c 0%, #fffd3c 50%, #ffe400 50%, #ffe400 100%);
          /* FF3.6-15 */
          background: -webkit-linear-gradient(top, #fffd3c 0%, #fffd3c 50%, #ffe400 50%, #ffe400 100%);
          /* Chrome10-25,Safari5.1-6 */
          background: linear-gradient(to bottom, #fffd3c 0%, #fffd3c 50%, #ffe400 50%, #ffe400 100%);
          /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
          filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffd3c', endColorstr='#ffe400', GradientType=0);
          /* IE6-9 */ }
      .play-index-page .user-info .power-indicator .indicator-box .progress-wrapper .current-power {
        position: absolute;
        top: -30px;
        left: 0%;
        width: 100px;
        height: 100px;
        background: #fffd3c;
        border: 10px solid #6ecbe6;
        border-radius: 50px;
        color: #6ecbe6;
        font-size: 14px;
        font-weight: bold;
        line-height: 1.1;
        padding: 18px 0;
        margin-left: -50px;
        z-index: 1; }
        @media (max-width: 767px) {
          .play-index-page .user-info .power-indicator .indicator-box .progress-wrapper .current-power {
            width: 60px;
            height: 60px;
            border-width: 6px;
            top: -15px;
            font-size: 10px;
            padding: 10px 0;
            margin-left: -30px; } }
        .play-index-page .user-info .power-indicator .indicator-box .progress-wrapper .current-power .num {
          font-size: 30px; }
          @media (max-width: 767px) {
            .play-index-page .user-info .power-indicator .indicator-box .progress-wrapper .current-power .num {
              font-size: 20px; } }
  .play-index-page .user-info .power-indicator .exp {
    position: relative;
    font-size: 14px;
    padding: 11px 10px;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 4px; }
    @media (max-width: 767px) {
      .play-index-page .user-info .power-indicator .exp {
        font-size: 11px; } }
    .play-index-page .user-info .power-indicator .exp:before {
      content: '';
      position: absolute;
      left: 50%;
      top: -17px;
      display: block;
      width: 0;
      height: 0;
      border: 7px solid transparent;
      border-bottom: 10px solid rgba(255, 255, 255, 0.8);
      margin-left: -7px; }
.play-index-page .user-status {
  padding: 10px;
  background: rgba(255, 255, 255, 0.76);
  width: 59%;
  margin: 0 auto;
  text-align: center;
  color: #333;
  font-size: 14px;
  font-weight: bold;
  word-wrap: break-word; }
  @media (max-width: 767px) {
    .play-index-page .user-status {
      width: 100%;
      font-size: 12px; } }
.play-index-page .action-area .title {
  color: #fff;
  font-size: 24px;
  margin: 0 0 25px; }
  @media (max-width: 767px) {
    .play-index-page .action-area .title {
      font-size: 18px;
      margin: 5px 0 10px; } }
.play-index-page .action-area .deck-list-line {
  margin-bottom: 25px; }
.play-index-page .action-area .btn-area .btn {
  width: 290px;
  height: 90px;
  font-size: 14px;
  padding: 20px 0; }
  @media (max-width: 767px) {
    .play-index-page .action-area .btn-area .btn {
      float: none !important;
      width: 100%;
      height: 60px;
      font-size: 12px;
      padding: 10px 0;
      line-height: 1.3; } }
  .play-index-page .action-area .btn-area .btn:first-child {
    float: left;
    margin-bottom: 10px; }
  .play-index-page .action-area .btn-area .btn:last-child {
    float: right; }
  .play-index-page .action-area .btn-area .btn .type {
    display: block;
    font-size: 24px; }
    @media (max-width: 767px) {
      .play-index-page .action-area .btn-area .btn .type {
        font-size: 20px; } }
.play-index-page .team-button {
  width: 460px;
  margin: 0 auto 40px; }
  @media (max-width: 767px) {
    .play-index-page .team-button {
      width: 95%;
      margin: 0 auto 20px; } }

@media (min-width: 768px) {
  .select-person-page.play-page .btn-area .btn {
    width: 240px; } }

.frame-inner .info-area {
  margin: 0 auto 15px; }
  .frame-inner .info-area .item-name {
    font-size: 12px;
    text-align: center;
    font-weight: bold;
    margin: 0 0 5px; }
.frame-inner .stage-list {
  margin-bottom: 15px; }
.frame-inner .icon-carrot {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("/images/icons/icon-carrot.png") left top no-repeat;
  background-size: 100% auto; }
.frame-inner .point-box {
  height: 40px;
  background: #fff;
  border: 4px solid #4dbad9;
  border-radius: 4px;
  padding-left: 12px;
  padding-right: 12px;
  line-height: 32px; }
  .frame-inner .point-box span {
    display: inline-block;
    vertical-align: middle; }
  .frame-inner .point-box .icon-point {
    width: 25px;
    height: 25px;
    background: url("../images/icons/rabbi-point.png") left top no-repeat;
    background-size: 100% auto; }
  .frame-inner .point-box .icon-carrot {
    width: 25px;
    height: 25px; }
  .frame-inner .point-box .text {
    font-size: 12px; }
  .frame-inner .point-box .point {
    font-size: 16px;
    font-weight: bold; }
    .frame-inner .point-box .point .plus {
      display: inline-block;
      vertical-align: middle; }
    .frame-inner .point-box .point .num {
      font-size: 24px; }
.frame-inner .icon-carrot {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("/images/icons/icon-carrot.png") left top no-repeat;
  background-size: 100% auto; }

.ie11 .frame-inner .point-box .point .num, .ie10 .frame-inner .point-box .point .num {
  padding-top: 5px; }

/******************* memorize *******************/
.memorize .content-frame-designed-corner .frame-inner .frame-title {
  margin: 10px 0 30px;
  font-weight: normal; }
.memorize .content-frame-designed-corner .frame-inner .no-border {
  border: none !important; }
.memorize .content-frame-designed-corner .frame-inner .pd30 {
  padding: 0px 50px; }
  @media (max-width: 767px) {
    .memorize .content-frame-designed-corner .frame-inner .pd30 {
      padding: 25px 50px; } }
  @media (max-width: 580px) {
    .memorize .content-frame-designed-corner .frame-inner .pd30 {
      padding: 25px 30px; } }
.memorize .content-frame-designed-corner .frame-inner .middle .frame-content {
  display: block; }
  .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .frame-text {
    font-size: 23px;
    color: #000;
    margin: 0;
    white-space: normal;
    word-wrap: break-word; }
    @media (max-width: 580px) {
      .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .frame-text {
        font-size: 16px; } }
  .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .frame-question {
    position: relative;
    display: block;
    text-align: center;
    background-color: #fff;
    padding: 23px 75px 23px;
    margin-bottom: 16px;
    white-space: normal;
    min-height: 70px; }
    @media (max-width: 580px) {
      .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .frame-question {
        padding: 23px 40px; } }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .frame-question .frame-volumn {
      position: absolute;
      top: 15%;
      right: 3%; }
      @media (max-width: 580px) {
        .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .frame-question .frame-volumn {
          top: 31%;
          right: -15px; } }
      @media (max-width: 580px) {
        .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .frame-question .frame-volumn img {
          width: 55%; } }
  .memorize .content-frame-designed-corner .frame-inner .middle .frame-content #areaAnswer {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    min-height: 80px;
    margin: 0 -10px 20px; }
    @media (max-width: 767px) {
      .memorize .content-frame-designed-corner .frame-inner .middle .frame-content #areaAnswer {
        margin-bottom: 10px; } }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content #areaAnswer .frame-answer {
      float: none;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 900;
      width: 100%;
      padding: 23px 20px;
      text-align: center;
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.9);
      -webkit-transform: rotateX(0) rotateY(0);
      -moz-transform: rotateX(0) rotateY(0);
      -o-transform: rotateX(0) rotateY(0);
      -ms-transform: rotateX(0) rotateY(0);
      transform: rotateX(0) rotateY(0);
      -webkit-transform-style: preserve-3d;
      -moz-transform-style: preserve-3d;
      -o-transform-style: preserve-3d;
      -ms-transform-style: preserve-3d;
      transform-style: preserve-3d;
      -webkit-backface-visibility: hidden;
      -moz-backface-visibility: hidden;
      -o-backface-visibility: hidden;
      -ms-backface-visibility: hidden;
      backface-visibility: hidden;
      -webkit-transition: all .4s ease-in-out;
      -moz-transition: all .4s ease-in-out;
      -o-transition: all .4s ease-in-out;
      -ms-transition: all .4s ease-in-out;
      transition: all .4s ease-in-out; }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content #areaAnswer .bg-custom {
      background: url("/images/play/bg-answer.png") no-repeat center center;
      background-size: 100% 100%;
      box-shadow: none; }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content #areaAnswer .front {
      cursor: pointer;
      -webkit-transform: rotateX(0);
      -moz-transform: rotateX(0);
      -o-transform: rotateX(0);
      -ms-transform: rotateX(0);
      transform: rotateX(0); }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content #areaAnswer .back {
      cursor: pointer;
      -webkit-transform: rotateX(-180deg);
      -moz-transform: rotateX(-180deg);
      -o-transform: rotateX(-180deg);
      -ms-transform: rotateX(-180deg);
      transform: rotateX(-180deg); }
  .memorize .content-frame-designed-corner .frame-inner .middle .frame-content #areaAnswer.flipped .front {
    -webkit-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
    -o-transform: rotateX(180deg);
    -ms-transform: rotateX(180deg);
    transform: rotateX(180deg); }
  .memorize .content-frame-designed-corner .frame-inner .middle .frame-content #areaAnswer.flipped .back {
    -webkit-transform: rotateX(0);
    -moz-transform: rotateX(0);
    -o-transform: rotateX(0);
    -ms-transform: rotateX(0);
    transform: rotateX(0);
    background-color: #fefdb4;
    box-shadow: 2px 2px 0px #dfdd62;
    border-radius: 5px; }
  .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button .col-md-4 {
    padding: 0 3px; }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button .col-md-4:first-child {
      padding-left: 0; }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button .col-md-4:last-child {
      padding-right: 0; }
  .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button button {
    display: block;
    width: 100%;
    padding: 10px 0 2px;
    height: 80px;
    font-size: 14px;
    color: #40547e;
    font-weight: normal; }
    @media (max-width: 580px) {
      .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button button {
        font-size: 10px; } }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button button img {
      width: 35px; }
      @media (max-width: 580px) {
        .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button button img {
          width: 26px; } }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button button .mgb2 {
      margin-bottom: 2px; }
    .memorize .content-frame-designed-corner .frame-inner .middle .frame-content .list-button button.active {
      background-color: #fffd3c;
      border: 3px solid #ffe400; }
.memorize .content-frame-designed-corner .frame-inner .middle .list-button-media button {
  padding: 5px 60px; }
  @media (max-width: 580px) {
    .memorize .content-frame-designed-corner .frame-inner .middle .list-button-media button {
      padding: 5px 30px; } }
.memorize .content-frame-designed-corner .frame-inner .middle .btn-list {
  display: block;
  overflow: hidden; }
  .memorize .content-frame-designed-corner .frame-inner .middle .btn-list .btnLink {
    display: block;
    font-size: 24px;
    color: #295990;
    border-radius: 5px;
    padding: 5px 30px 0;
    width: 100%;
    box-shadow: 2px 2px 0px #ffe400;
    cursor: pointer;
    min-height: 85px;
    margin: 0; }
    .memorize .content-frame-designed-corner .frame-inner .middle .btn-list .btnLink span {
      display: block;
      width: 100%;
      font-size: 14px;
      color: #40547e;
      font-weight: normal;
      white-space: normal;
      line-height: 18px;
      margin-top: 8px; }
      @media (max-width: 650px) {
        .memorize .content-frame-designed-corner .frame-inner .middle .btn-list .btnLink span {
          font-size: 12px; } }
    .memorize .content-frame-designed-corner .frame-inner .middle .btn-list .btnLink:hover {
      text-decoration: none; }
    @media (max-width: 650px) {
      .memorize .content-frame-designed-corner .frame-inner .middle .btn-list .btnLink {
        font-size: 22px;
        padding: 5px 15px 0; } }
    @media (max-width: 540px) {
      .memorize .content-frame-designed-corner .frame-inner .middle .btn-list .btnLink {
        padding: 5px 10px 0; } }
  .memorize .content-frame-designed-corner .frame-inner .middle .btn-list .disabled {
    opacity: 0.6;
    cursor: no-drop; }
  @media (max-width: 540px) {
    .memorize .content-frame-designed-corner .frame-inner .middle .btn-list .col-xs-6 {
      width: 99%; } }
.memorize .content-frame-designed-corner .frame-inner .middle .status {
  margin-bottom: 5px;
  padding: 8px 15px;
  background-color: #1e6fbe;
  font-size: 14px;
  color: #fff;
  font-weight: normal;
  margin-top: 10px; }
.memorize .content-frame-designed-corner .frame-inner .middle .pdt15 {
  padding-top: 15px !important; }
.memorize .content-frame-designed-corner .frame-inner .middle .list-result {
  display: block;
  background-color: #fff;
  border: 5px solid #295990;
  width: 100%;
  overflow: hidden;
  padding: 35px 60px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  margin-top: 40px; }
  .memorize .content-frame-designed-corner .frame-inner .middle .list-result li {
    margin-bottom: 15px;
    float: left;
    width: 100%;
    vertical-align: middle; }
    .memorize .content-frame-designed-corner .frame-inner .middle .list-result li .image {
      float: left;
      width: 10%; }
      .memorize .content-frame-designed-corner .frame-inner .middle .list-result li .image img {
        max-width: 100%; }
    .memorize .content-frame-designed-corner .frame-inner .middle .list-result li .text {
      float: right;
      width: 82%;
      text-align: right; }
      .memorize .content-frame-designed-corner .frame-inner .middle .list-result li .text p {
        font-size: 24px;
        margin: 0; }
    .memorize .content-frame-designed-corner .frame-inner .middle .list-result li:last-child {
      margin-bottom: 0; }
.memorize .list-vocabulary {
  max-height: 357px;
  overflow-y: scroll;
  width: 100%;
  margin-bottom: 20px;
  padding: 0px 10px;
  display: block;
  background-color: #fff; }
  @media (max-width: 767px) {
    .memorize .list-vocabulary {
      max-height: 343px; } }
  @media (max-width: 425px) {
    .memorize .list-vocabulary {
      max-height: 364px; } }
  .memorize .list-vocabulary li {
    border-bottom: 2px solid #95d9ed;
    padding: 8px 0; }
    @media (max-width: 570px) {
      .memorize .list-vocabulary li .image {
        width: 48px;
        float: left;
        margin-left: 10px; } }
    .memorize .list-vocabulary li .image img {
      width: 50%;
      display: block;
      margin: 3px auto 0; }
      @media (max-width: 767px) {
        .memorize .list-vocabulary li .image img {
          margin: 3px auto 1px;
          width: 100%; } }
    @media (max-width: 570px) {
      .memorize .list-vocabulary li .text {
        width: auto;
        float: right; } }
    .memorize .list-vocabulary li .text p {
      margin: 0;
      font-size: 20px;
      line-height: 34px;
      padding-right: 20px; }

/******************* quest *******************/
.select-request .question-about {
  float: left;
  width: 100%;
  background-color: #fff;
  margin-top: 15px;
  margin-bottom: 30px; }
  .select-request .question-about .title-yellow-bg {
    margin-top: 0; }
  .select-request .question-about .content {
    padding: 0 10px; }
.select-request .list-question-btn {
  display: block;
  width: 100%;
  overflow: hidden; }
  .select-request .list-question-btn ul {
    float: left;
    width: 100%;
    padding: 10px; }
    .select-request .list-question-btn ul li {
      display: inline-block;
      width: 49.5%;
      text-align: center;
      margin: 0 auto 24px auto; }
      .select-request .list-question-btn ul li a:hover, .select-request .list-question-btn ul li a:active, .select-request .list-question-btn ul li a:focus {
        text-decoration: none; }
      .select-request .list-question-btn ul li .disible {
        display: block;
        width: 200px;
        height: 60px;
        text-align: center;
        background-color: #E2E2E2;
        border: 3px solid #fff;
        margin: 0 auto;
        padding: 15px;
        font-size: 18px; }
      .select-request .list-question-btn ul li .enable {
        display: block;
        width: 200px;
        height: 80px;
        text-align: center;
        background-color: #1B6ABD;
        border: 3px solid #fff;
        color: #fff;
        margin: 0 auto;
        padding: 10px 5px;
        font-size: 18px; }
        .select-request .list-question-btn ul li .enable .progress {
          background: transparent;
          color: #15E458;
          font-weight: bold; }
        .select-request .list-question-btn ul li .enable .failed {
          background: transparent;
          color: red;
          font-weight: bold; }
        .select-request .list-question-btn ul li .enable .clear {
          background: transparent;
          color: #EAD313;
          font-weight: bold; }

.quest_battle .time {
  display: block;
  width: 80%;
  margin: 15px auto;
  padding: 20px;
  background-color: #295990;
  border: 3px solid #FFF;
  color: #fff;
  font-size: 20px;
  text-align: center; }
.quest_battle .boss {
  display: block;
  position: relative; }
  .quest_battle .boss .bg-boss {
    width: 40%;
    margin: 0 auto;
    text-align: center; }
    .quest_battle .boss .bg-boss img {
      width: 100%;
      border-radius: 100%;
      background-color: #FEFBCE; }
  .quest_battle .boss .boss-score {
    width: 80%;
    background-color: rgba(255, 255, 255, 0.82);
    padding: 10px 15px;
    margin: 0 auto;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    font-weight: bold; }
    .quest_battle .boss .boss-score p {
      font-size: 16px;
      margin: 0; }
  .quest_battle .boss .condition-boss {
    width: 80%;
    margin: 0 auto;
    position: absolute;
    bottom: -93px;
    left: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.82);
    padding: 10px 15px;
    text-align: center;
    font-weight: bold;
    font-size: 16px; }
.quest_battle .title-boss {
  margin: 100px 7px 15px;
  padding: 20px;
  background-color: #295990;
  color: #fff;
  border-top: 3px solid #fff;
  border-bottom: 3px solid #fff; }

.detail_battle .list-btn {
  float: left;
  width: 100%;
  overflow: hidden;
  margin-top: -20px; }
.detail_battle .title-boss {
  margin: 0px 7px 15px;
  float: left;
  width: 97.5%; }
.detail_battle .progress-wrapper {
  width: 80%;
  display: block;
  margin-left: 5%;
  position: relative;
  bottom: 15px; }
  .detail_battle .progress-wrapper .progress {
    height: 40px;
    overflow: hidden;
    background-color: #f5f5f5;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    border: 4px solid #5BB1CA; }
    .detail_battle .progress-wrapper .progress .progress-bar-yellow {
      background: #fffd3c;
      background: -moz-linear-gradient(top, #fffd3c 0%, #fffd3c 50%, #ffe400 50%, #ffe400 100%);
      background: -webkit-linear-gradient(top, #fffd3c 0%, #fffd3c 50%, #ffe400 50%, #ffe400 100%);
      background: linear-gradient(to bottom, #fffd3c 0%, #fffd3c 50%, #ffe400 50%, #ffe400 100%);
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffd3c', endColorstr='#ffe400', GradientType=0);
      padding-right: 15px;
      text-align: right; }
      .detail_battle .progress-wrapper .progress .progress-bar-yellow .score {
        font-size: 16px;
        line-height: 32px; }
  .detail_battle .progress-wrapper .current-power {
    position: absolute;
    top: -12px;
    left: 0%;
    width: 140px;
    height: 63px;
    background: #fffd3c;
    border: 5px solid #5BB1CA;
    border-radius: 3px;
    color: #6ecbe6;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.1;
    padding: 18px 0;
    margin-left: -20%;
    z-index: 1; }
    .detail_battle .progress-wrapper .current-power .num {
      font-size: 18px;
      text-align: center; }
.detail_battle .list-member {
  display: block;
  width: 90%;
  background-color: #fff;
  border: 3px solid #1B6ABD;
  overflow: hidden;
  margin: 25px auto 30px; }
  .detail_battle .list-member li {
    float: left;
    width: 100%;
    padding: 20px;
    border-bottom: 2px solid #ccc; }
    .detail_battle .list-member li .col-left {
      float: left;
      width: 65%; }
      .detail_battle .list-member li .col-left img {
        float: left;
        width: 25%; }
      .detail_battle .list-member li .col-left .name {
        float: left;
        width: 75%;
        padding: 20px;
        font-size: 22px; }
      .detail_battle .list-member li .col-left .desc {
        float: left;
        width: 100%;
        padding: 10px 40px 0 0;
        font-size: 16px; }
    .detail_battle .list-member li .col-right {
      float: left;
      width: 35%; }
      .detail_battle .list-member li .col-right .time {
        float: left;
        width: 100%;
        padding: 20px 0;
        text-align: right;
        font-size: 16px;
        margin: 0 auto;
        background: none;
        color: #295990; }
      .detail_battle .list-member li .col-right .team-scort {
        display: block;
        float: left;
        width: 100%;
        border: 2px solid #65BCD6;
        background-color: #6ECBE6;
        color: #fff;
        padding: 20px 5px 10px;
        margin: 0;
        font-size: 20px;
        text-align: right; }
        .detail_battle .list-member li .col-right .team-scort .arow {
          font-size: 14px;
          margin-left: 5px;
          font-weight: bold; }

.detail-quest .team-detail-inner p {
  margin: 0; }
.detail-quest .stage {
  float: left;
  width: 100%;
  overflow: hidden;
  background-color: #295990;
  border: 3px solid #fff;
  padding: 15px 10px;
  margin-bottom: 15px; }
  .detail-quest .stage h3, .detail-quest .stage p {
    color: #fff;
    margin: 0; }
.detail-quest .list-rabi .txt-rabi {
  font-size: 20px;
  text-align: center; }
.detail-quest .friend-list .status {
  padding: 5px 0 !important;
  text-align: center !important; }
  .detail-quest .friend-list .status .status-txt {
    float: left;
    width: 100%;
    font-size: 20px !important;
    font-weight: bold; }
  .detail-quest .friend-list .status .status-time {
    float: left;
    width: 100%;
    font-size: 13px !important; }
.detail-quest .friend-list .status-box {
  float: left;
  width: 35%;
  background-color: #00bf9d;
  padding: 15px;
  color: #fff;
  text-align: center;
  font-size: 18px;
  font-weight: bold; }

.search-form {
  width: 100%;
  overflow: hidden;
  display: block; }
  .search-form .form-group {
    float: left;
    width: 100%;
    padding: 10px 30px; }
    .search-form .form-group input {
      background-image: -webkit-gradient(linear, left top, left bottom, from(#009688), to(#009688)), -webkit-gradient(linear, left top, left bottom, from(#D2D2D2), to(#D2D2D2));
      background-image: -webkit-linear-gradient(#009688, #009688), -webkit-linear-gradient(#D2D2D2, #D2D2D2);
      background-image: -o-linear-gradient(#009688, #009688), -o-linear-gradient(#D2D2D2, #D2D2D2);
      background-image: linear-gradient(#009688, #009688), linear-gradient(#D2D2D2, #D2D2D2);
      color: #295990 !important;
      padding: 5px 10px;
      font-size: 16px;
      background-color: #fff;
      border-radius: 3px; }

.fs20 {
  font-size: 20px; }

.trophy-page-title .bg-area {
  width: 307px;
  height: 165px;
  background: url(/images/team_battle/trophy_page_title.png) left top no-repeat;
  margin: 0 auto; }
  @media (max-width: 767px) {
    .trophy-page-title .bg-area {
      width: 250px;
      height: 135px;
      background-size: 100% auto; } }
.trophy-page-title .ribbon-text {
  text-align: center;
  color: #fff;
  padding-top: 126px;
  font-size: 28px; }
  @media (max-width: 767px) {
    .trophy-page-title .ribbon-text {
      padding-top: 104px;
      font-size: 22px; } }
.trophy-page-title .desc {
  color: #e1444b;
  font-size: 20px;
  text-align: center;
  margin-top: 15px; }
  @media (max-width: 767px) {
    .trophy-page-title .desc {
      font-size: 18px;
      margin-top: 10px; } }

.team-battle-box.only-one .item {
  width: 500px;
  margin-right: auto;
  margin-left: auto; }
  @media (max-width: 1199px) {
    .team-battle-box.only-one .item {
      width: 460px; } }
  @media (max-width: 991px) {
    .team-battle-box.only-one .item {
      width: 350px; } }
  @media (max-width: 767px) {
    .team-battle-box.only-one .item {
      max-width: 350px;
      width: 100%; } }
.team-battle-box .item {
  background: #fff;
  border-radius: 6px;
  padding: 10px;
  text-align: center;
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    .team-battle-box .item {
      margin-bottom: 15px; } }
.team-battle-box .item-inner {
  position: relative;
  background: #feffd7;
  padding-bottom: 10px; }
.team-battle-box .corner {
  position: absolute;
  display: block; }
.team-battle-box .corner-lt {
  top: 0;
  left: 0;
  width: 21px;
  height: 22px;
  background: url(/images/box/box_corner_lt.png) left top no-repeat; }
.team-battle-box .corner-rt {
  top: 0;
  right: 0;
  width: 21px;
  height: 22px;
  background: url(/images/box/box_corner_rt.png) left top no-repeat; }
.team-battle-box .corner-lb {
  bottom: 0;
  left: 0;
  width: 22px;
  height: 21px;
  background: url(/images/box/box_corner_lb.png) left top no-repeat; }
.team-battle-box .corner-rb {
  bottom: 0;
  right: 0;
  width: 22px;
  height: 21px;
  background: url(/images/box/box_corner_rb.png) left top no-repeat; }
.team-battle-box .crown {
  position: absolute;
  top: 20px;
  left: 0;
  right: 0;
  width: 45px;
  height: 38px;
  background: url(/images/team_battle/crown.png) left top no-repeat;
  margin: auto; }
  @media (max-width: 767px) {
    .team-battle-box .crown {
      top: 5px; } }
.team-battle-box .team-block {
  position: relative;
  padding-top: 30px; }
  @media (max-width: 767px) {
    .team-battle-box .team-block {
      padding-top: 20px; } }
.team-battle-box .team {
  width: 50%; }
  .team-battle-box .team.left {
    float: left;
    padding-left: 30px; }
    @media (max-width: 991px) {
      .team-battle-box .team.left {
        padding-left: 0; } }
  .team-battle-box .team.right {
    float: right;
    padding-right: 30px; }
    @media (max-width: 991px) {
      .team-battle-box .team.right {
        padding-right: 0; } }
  @media (max-width: 767px) {
    .team-battle-box .team {
      position: relative; } }
.team-battle-box .team-box {
  position: relative;
  width: 180px;
  height: 180px;
  margin: 0 auto; }
  @media (max-width: 991px) {
    .team-battle-box .team-box {
      width: 150px;
      height: 150px; } }
  @media (max-width: 767px) {
    .team-battle-box .team-box {
      width: 120px;
      height: 120px; } }
  .team-battle-box .team-box:after {
    position: absolute;
    top: 5px;
    left: -32px;
    content: '';
    display: block;
    width: 86px;
    height: 165px;
    background: url(/images/team_battle/leaf_left.png) left top no-repeat; }
    @media (max-width: 991px) {
      .team-battle-box .team-box:after {
        left: -15px;
        width: 70px;
        height: 130px;
        background-size: 100% auto; } }
    @media (max-width: 991px) {
      .team-battle-box .team-box:after {
        width: 60px;
        height: 110px; } }
  .team-battle-box .team-box .circle {
    position: relative;
    width: 100%;
    height: 100%;
    background: #fff;
    border: 5px solid #fef1aa;
    border-radius: 50%;
    padding: 25px 20px;
    z-index: 1;
    overflow: hidden; }
  .team-battle-box .team-box .text {
    display: table-cell;
    color: #e1444b;
    font-size: 18px;
    font-weight: bold;
    vertical-align: middle;
    width: 100%;
    height: 120px;
    word-break: break-word; }
    @media (max-width: 991px) {
      .team-battle-box .team-box .text {
        font-size: 16px;
        height: 80px; } }
    @media (max-width: 767px) {
      .team-battle-box .team-box .text {
        font-size: 14px;
        height: 60px; } }
.team-battle-box .team.right .team-box:after {
  background: url(/images/team_battle/leaf_right.png) left top no-repeat;
  left: auto;
  right: -32px; }
  @media (max-width: 991px) {
    .team-battle-box .team.right .team-box:after {
      right: -15px;
      background-size: 100% auto; } }
.team-battle-box .ribbon {
  position: relative;
  width: 208px;
  height: 53px;
  background: url(/images/team_battle/ribbon_red_l.png) left top no-repeat;
  color: #fff;
  font-size: 22px;
  text-align: right;
  padding-top: 5px;
  margin-top: -30px;
  z-index: 1; }
  @media (max-width: 991px) {
    .team-battle-box .ribbon {
      width: 160px;
      height: 40px;
      background-size: 100% auto;
      font-size: 16px; } }
  @media (max-width: 767px) {
    .team-battle-box .ribbon {
      position: absolute;
      bottom: -4px;
      left: 50%;
      width: 130px;
      height: 34px;
      font-size: 12px; } }
  .team-battle-box .ribbon .point {
    font-size: 15px; }
    @media (max-width: 991px) {
      .team-battle-box .ribbon .point {
        font-size: 12px; } }
    @media (max-width: 767px) {
      .team-battle-box .ribbon .point {
        font-size: 10px; } }
  .team-battle-box .ribbon.lose {
    background: url(/images/team_battle/ribbon_gray_l.png) left top no-repeat; }
    @media (max-width: 991px) {
      .team-battle-box .ribbon.lose {
        background-size: 100% auto; } }
.team-battle-box .team.left .ribbon {
  margin-left: -15px;
  padding-left: 16px;
  padding-right: 30px; }
  @media (max-width: 1199px) {
    .team-battle-box .team.left .ribbon {
      margin-left: -30px; } }
  @media (max-width: 991px) {
    .team-battle-box .team.left .ribbon {
      margin-left: -10px; } }
  @media (max-width: 767px) {
    .team-battle-box .team.left .ribbon {
      padding-left: 11px;
      padding-right: 20px;
      margin: 0 0 0 -78px; } }
.team-battle-box .team.right .ribbon {
  background: url(/images/team_battle/ribbon_red_r.png) left top no-repeat;
  margin-left: 15px;
  padding-left: 35px;
  padding-right: 16px;
  text-align: left; }
  @media (max-width: 991px) {
    .team-battle-box .team.right .ribbon {
      background-size: 100% auto; } }
  @media (max-width: 767px) {
    .team-battle-box .team.right .ribbon {
      padding-left: 20px;
      padding-right: 11px;
      left: auto;
      right: 50%;
      margin: 0 -78px 0 0; } }
  .team-battle-box .team.right .ribbon.lose {
    background: url(/images/team_battle/ribbon_gray_r.png) left top no-repeat; }
    @media (max-width: 991px) {
      .team-battle-box .team.right .ribbon.lose {
        background-size: 100% auto; } }
.team-battle-box .vs {
  position: absolute;
  width: 97px;
  height: 91px;
  background: url(/images/team_battle/vs.png) left top no-repeat;
  bottom: 0px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 1; }
  @media (max-width: 767px) {
    .team-battle-box .vs {
      width: 70px;
      height: 64px;
      background-size: 100% auto; } }
.team-battle-box .datetime {
  color: #4ac9a3;
  font-size: 14px;
  font-weight: bold;
  margin-top: 10px; }
  @media (max-width: 767px) {
    .team-battle-box .datetime {
      font-size: 11px;
      margin-top: 5px; } }
.team-battle-box .btn {
  width: 300px; }
  @media (max-width: 767px) {
    .team-battle-box .btn {
      width: auto; } }

.team-battle-box-result .item {
  background: #fff;
  border-radius: 6px;
  padding: 10px;
  text-align: center;
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    .team-battle-box-result .item {
      margin-bottom: 15px; } }
.team-battle-box-result .item-inner {
  position: relative;
  background: #feffd7;
  padding-bottom: 10px; }
.team-battle-box-result .corner {
  position: absolute;
  display: block; }
.team-battle-box-result .corner-lt {
  top: 0;
  left: 0;
  width: 21px;
  height: 22px;
  background: url(/images/box/box_corner_lt.png) left top no-repeat; }
.team-battle-box-result .corner-rt {
  top: 0;
  right: 0;
  width: 21px;
  height: 22px;
  background: url(/images/box/box_corner_rt.png) left top no-repeat; }
.team-battle-box-result .corner-lb {
  bottom: 0;
  left: 0;
  width: 22px;
  height: 21px;
  background: url(/images/box/box_corner_lb.png) left top no-repeat; }
.team-battle-box-result .corner-rb {
  bottom: 0;
  right: 0;
  width: 22px;
  height: 21px;
  background: url(/images/box/box_corner_rb.png) left top no-repeat; }
.team-battle-box-result .result {
  position: absolute;
  top: -20px;
  left: 0;
  right: 0;
  margin: auto;
  display: block;
  width: 167px;
  height: 42px; }
  .team-battle-box-result .result.win {
    background: url(/images/team_battle/ribbon_win.png) left top no-repeat; }
  .team-battle-box-result .result.lose {
    background: url(/images/team_battle/ribbon_lose.png) left top no-repeat; }
  .team-battle-box-result .result.draw {
    background: url(/images/team_battle/ribbon_draw.png) left top no-repeat; }
.team-battle-box-result .crown {
  position: absolute;
  top: 45px;
  left: 0;
  right: 0;
  width: 32px;
  height: 28px;
  background: url(/images/team_battle/crown.png) left top no-repeat;
  background-size: 100% auto;
  margin: auto; }
  @media (max-width: 767px) {
    .team-battle-box-result .crown {
      top: 35px; } }
.team-battle-box-result .team-block {
  position: relative;
  padding-top: 45px; }
.team-battle-box-result .team {
  width: 50%; }
  .team-battle-box-result .team.left {
    float: left; }
  .team-battle-box-result .team.right {
    float: right; }
  @media (max-width: 767px) {
    .team-battle-box-result .team {
      position: relative; } }
.team-battle-box-result .team-box {
  position: relative;
  width: 120px;
  height: 120px;
  margin: 0 auto; }
  @media (max-width: 991px) {
    .team-battle-box-result .team-box {
      width: 150px;
      height: 150px; } }
  @media (max-width: 767px) {
    .team-battle-box-result .team-box {
      width: 120px;
      height: 120px; } }
  .team-battle-box-result .team-box .circle {
    position: relative;
    width: 100%;
    height: 100%;
    background: #fff;
    border-radius: 50%;
    padding: 25px 20px;
    z-index: 1;
    overflow: hidden; }
    .is-ie .team-battle-box-result .team-box .circle {
      word-break: break-all; }
  .team-battle-box-result .team-box .text {
    display: table-cell;
    color: #3e8093;
    font-size: 14px;
    font-weight: bold;
    vertical-align: middle;
    width: 100%;
    height: 60px;
    word-break: break-word; }
    @media (max-width: 991px) {
      .team-battle-box-result .team-box .text {
        font-size: 16px;
        height: 80px; } }
    @media (max-width: 767px) {
      .team-battle-box-result .team-box .text {
        font-size: 14px;
        height: 60px; } }
.team-battle-box-result .ribbon {
  position: relative;
  width: 140px;
  height: 35px;
  background: url(/images/team_battle/ribbon_red_l.png) left top no-repeat;
  background-size: 100% auto;
  color: #fff;
  font-size: 14px;
  text-align: right;
  padding-top: 3px;
  margin-top: -30px;
  z-index: 1; }
  @media (max-width: 991px) {
    .team-battle-box-result .ribbon {
      width: 160px;
      height: 40px;
      font-size: 16px;
      padding-top: 5px; } }
  @media (max-width: 767px) {
    .team-battle-box-result .ribbon {
      position: absolute;
      bottom: -4px;
      left: 50%;
      width: 130px;
      height: 34px;
      font-size: 12px; } }
  .team-battle-box-result .ribbon .point {
    font-size: 12px; }
    @media (max-width: 991px) {
      .team-battle-box-result .ribbon .point {
        font-size: 12px; } }
    @media (max-width: 767px) {
      .team-battle-box-result .ribbon .point {
        font-size: 10px; } }
  .team-battle-box-result .ribbon.lose, .team-battle-box-result .ribbon.draw {
    background: url(/images/team_battle/ribbon_gray_l.png) left top no-repeat;
    background-size: 100% auto; }
.team-battle-box-result .team.left .ribbon {
  margin-left: -2px;
  padding-left: 11px;
  padding-right: 15px; }
  @media (max-width: 1199px) {
    .team-battle-box-result .team.left .ribbon {
      margin-left: -14px; } }
  @media (max-width: 991px) {
    .team-battle-box-result .team.left .ribbon {
      padding-left: 13px;
      padding-right: 20px;
      margin-left: -10px; } }
  @media (max-width: 767px) {
    .team-battle-box-result .team.left .ribbon {
      padding-left: 11px;
      padding-right: 20px;
      margin: 0 0 0 -78px; } }
.team-battle-box-result .team.right .ribbon {
  background: url(/images/team_battle/ribbon_red_r.png) left top no-repeat;
  background-size: 100% auto;
  margin-left: 15px;
  padding-left: 18px;
  padding-right: 11px;
  text-align: left; }
  @media (max-width: 991px) {
    .team-battle-box-result .team.right .ribbon {
      background-size: 100% auto;
      padding-left: 20px;
      padding-right: 13px; } }
  @media (max-width: 767px) {
    .team-battle-box-result .team.right .ribbon {
      padding-left: 20px;
      padding-right: 11px;
      left: auto;
      right: 50%;
      margin: 0 -78px 0 0; } }
  .team-battle-box-result .team.right .ribbon.lose, .team-battle-box-result .team.right .ribbon.draw {
    background: url(/images/team_battle/ribbon_gray_r.png) left top no-repeat;
    background-size: 100% auto; }
.team-battle-box-result .vs {
  position: absolute;
  width: 67px;
  height: 67px;
  background: url(/images/team_battle/vs.png) left top no-repeat;
  bottom: 0px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 1;
  background-size: 100% auto; }
  @media (max-width: 767px) {
    .team-battle-box-result .vs {
      width: 70px;
      height: 64px;
      background-size: 100% auto; } }
.team-battle-box-result .datetime {
  color: #4ac9a3;
  font-size: 12px;
  margin-top: 10px; }
  @media (max-width: 767px) {
    .team-battle-box-result .datetime {
      font-size: 11px;
      margin-top: 5px; } }

.team-battle-score-timeline li {
  background: #fff;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.15);
  margin-bottom: 20px; }
  .team-battle-score-timeline li.target-team {
    background: #edf0ff; }
.team-battle-score-timeline .above {
  position: relative;
  padding: 20px 20px 10px;
  border-bottom: 1px solid #ebebeb; }
  @media (max-width: 767px) {
    .team-battle-score-timeline .above {
      padding: 15px 15px 10px; } }
.team-battle-score-timeline .below {
  padding: 20px 20px 25px 25px; }
  @media (max-width: 767px) {
    .team-battle-score-timeline .below {
      padding: 10px 15px 15px 15px; } }
.team-battle-score-timeline .thumb {
  float: left;
  width: 70px;
  height: auto;
  margin-right: 20px; }
  @media (max-width: 767px) {
    .team-battle-score-timeline .thumb {
      width: 50px;
      margin-right: 10px; } }
.team-battle-score-timeline .name {
  display: block;
  color: #38454f;
  font-size: 24px;
  padding-right: 130px;
  padding-left: 90px;
  padding-top: 12px; }
  @media (max-width: 767px) {
    .team-battle-score-timeline .name {
      font-size: 18px;
      padding-left: 60px;
      padding-top: 8px; } }
.team-battle-score-timeline .time {
  position: absolute;
  top: 50%;
  right: 20px;
  color: #38454f;
  font-size: 12px;
  margin-top: -6px; }
.team-battle-score-timeline .stage {
  float: left;
  color: #45515b;
  font-size: 20px;
  padding-top: 4px; }
  @media (max-width: 767px) {
    .team-battle-score-timeline .stage {
      float: none;
      font-size: 18px;
      margin-bottom: 10px; } }
.team-battle-score-timeline .score {
  float: right;
  color: #fff;
  font-size: 28px;
  background: #eb921d;
  padding: 0 10px; }
  .team-battle-score-timeline .score span {
    font-size: 18px; }
  @media (max-width: 767px) {
    .team-battle-score-timeline .score {
      font-size: 18px;
      padding: 5px 10px; }
      .team-battle-score-timeline .score span {
        font-size: 12px; } }

.battle-team-list li {
  background: #fff;
  border-radius: 6px;
  margin-bottom: 10px; }
.battle-team-list .li-item {
  position: relative;
  display: block;
  padding: 10px 15px; }
.battle-team-list .thumb {
  float: left;
  width: 65px;
  height: auto; }
  @media (max-width: 767px) {
    .battle-team-list .thumb {
      width: 45px; } }
.battle-team-list .name {
  padding: 10px 170px 0 85px; }
  @media (max-width: 767px) {
    .battle-team-list .name {
      padding: 0px 0px 0 55px; } }
  .battle-team-list .name .text {
    display: block;
    color: #2d3940;
    font-size: 20px;
    font-weight: bold;
    word-break: break-word; }
    .is-ie .battle-team-list .name .text {
      word-break: break-all; }
    @media (max-width: 767px) {
      .battle-team-list .name .text {
        font-size: 18px; } }
  .battle-team-list .name .id {
    display: block;
    color: #2d3940;
    font-size: 14px; }
    @media (max-width: 767px) {
      .battle-team-list .name .id {
        font-size: 12px; } }
.battle-team-list .score {
  position: absolute;
  top: 0;
  right: 15px; }
  @media (max-width: 767px) {
    .battle-team-list .score {
      position: static; } }
  .battle-team-list .score.no-score {
    text-align: center;
    width: 160px;
    padding-top: 13px; }
    @media (max-width: 767px) {
      .battle-team-list .score.no-score {
        width: 100%;
        padding-top: 0; } }
  .battle-team-list .score .text {
    display: block;
    color: #e1444b;
    font-size: 12px;
    margin-top: 16px; }
  .battle-team-list .score .num {
    display: block;
    background: #e1444b;
    color: #fff;
    font-size: 28px;
    padding: 0px 8px;
    border-radius: 4px; }
    @media (max-width: 767px) {
      .battle-team-list .score .num {
        text-align: right; } }
    .battle-team-list .score .num .point {
      color: #fff;
      font-size: 18px; }

.team-battle-index-page .battle-title {
  font-size: 24px;
  color: #e1444b;
  font-weight: bold;
  text-align: center;
  margin: 30px 0 25px; }
  @media (max-width: 767px) {
    .team-battle-index-page .battle-title {
      margin: 20px 0 15px; } }
.team-battle-index-page .bg-triangle-blue {
  padding: 40px 0 100px;
  margin-top: 50px; }
  @media (max-width: 767px) {
    .team-battle-index-page .bg-triangle-blue {
      padding: 20px 0 60px; } }
  .team-battle-index-page .bg-triangle-blue .battle-title {
    color: #fff; }
.team-battle-index-page .btn-lg, .team-battle-index-page .btn-group-lg > .btn {
  height: 90px;
  font-size: 24px;
  padding-top: 30px; }
  @media (min-width: 768px) {
    .team-battle-index-page .btn-lg, .team-battle-index-page .btn-group-lg > .btn {
      width: 450px; } }
.team-battle-index-page .btn-team {
  display: block;
  margin: 5px auto 0; }
  @media (min-width: 768px) {
    .team-battle-index-page .btn-team {
      width: 450px; } }
.team-battle-index-page hr {
  border-top: 1px dotted #fff;
  clear: both;
  margin-top: 10px;
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    .team-battle-index-page hr {
      margin-bottom: 10px; } }
@media (min-width: 768px) {
  .team-battle-index-page .back-link {
    width: 422px; } }
@media (min-width: 992px) {
  .team-battle-index-page .team-battle-box-result:nth-of-type(4) {
    display: none; } }

.team-battle-room-page .battle-end-time {
  color: #4ac9a3;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  margin: 10px 0; }
  .team-battle-room-page .battle-end-time span {
    display: block;
    font-size: 12px; }
.team-battle-room-page .team-battle-box .item {
  width: 500px;
  margin-right: auto;
  margin-left: auto; }
  @media (max-width: 1199px) {
    .team-battle-room-page .team-battle-box .item {
      width: 460px; } }
  @media (max-width: 991px) {
    .team-battle-room-page .team-battle-box .item {
      width: 350px; } }
  @media (max-width: 767px) {
    .team-battle-room-page .team-battle-box .item {
      max-width: 350px;
      width: 100%; } }
.team-battle-room-page .btn-area-above {
  max-width: 840px;
  margin: 0 auto 50px; }
  .team-battle-room-page .btn-area-above .btn {
    width: 400px; }
    @media (max-width: 991px) {
      .team-battle-room-page .btn-area-above .btn {
        width: 340px; } }
    @media (max-width: 767px) {
      .team-battle-room-page .btn-area-above .btn {
        width: 100%; } }
    .team-battle-room-page .btn-area-above .btn:first-child {
      margin-right: 32px; }
      @media (max-width: 767px) {
        .team-battle-room-page .btn-area-above .btn:first-child {
          margin-right: 0; } }
.team-battle-room-page .bg-triangle-blue {
  padding: 40px 0 80px; }
  @media (max-width: 767px) {
    .team-battle-room-page .bg-triangle-blue {
      padding: 20px 0 40px; } }
.team-battle-room-page .btn-area-below {
  text-align: center; }
  .team-battle-room-page .btn-area-below .btn {
    width: 400px; }
    @media (max-width: 767px) {
      .team-battle-room-page .btn-area-below .btn {
        width: 100%; } }
.team-battle-room-page hr {
  border-top: 1px dotted #fff;
  clear: both;
  margin-top: 10px;
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    .team-battle-room-page hr {
      margin-bottom: 10px; } }

.team-battle-select-my-team-page .content-frame-designed-corner {
  margin-top: 50px; }
.team-battle-select-my-team-page .ribbon-img-title {
  top: -103px; }
  @media (max-width: 767px) {
    .team-battle-select-my-team-page .ribbon-img-title {
      top: -53px; } }
.team-battle-select-my-team-page .frame-title {
  color: #295990;
  font-size: 20px;
  font-weight: 800;
  text-align: center;
  margin: 20px 0 15px !important; }
.team-battle-select-my-team-page .bg-shining-yellow .bg-inner {
  padding-bottom: 40px; }
.team-battle-select-my-team-page .btn-box {
  width: 400px;
  margin: 0 auto; }
  @media (max-width: 767px) {
    .team-battle-select-my-team-page .btn-box {
      width: auto; } }

.team-battle-select-opponent-team-page .my-team {
  background: #fff;
  padding: 15px;
  border-radius: 6px;
  margin-bottom: 10px; }
  .team-battle-select-opponent-team-page .my-team .text {
    color: #2d3940;
    font-size: 14px; }
  .team-battle-select-opponent-team-page .my-team .team-name {
    color: #2d3940;
    font-size: 20px;
    font-weight: bold;
    word-break: break-word; }
    .is-ie .team-battle-select-opponent-team-page .my-team .team-name {
      word-break: break-all; }
  .team-battle-select-opponent-team-page .my-team .score {
    background: #e1444b;
    color: #fff;
    font-size: 28px;
    padding: 3px 8px 8px;
    border-radius: 4px;
    margin: 0; }
    .team-battle-select-opponent-team-page .my-team .score .text {
      color: #fff;
      font-size: 18px; }
  .team-battle-select-opponent-team-page .my-team .no-score {
    color: #e1444b; }
.team-battle-select-opponent-team-page .btn-yellow {
  width: 300px;
  margin: 10px 0 0; }
.team-battle-select-opponent-team-page .content-frame-designed-corner {
  margin-top: 50px; }
  @media (max-width: 767px) {
    .team-battle-select-opponent-team-page .content-frame-designed-corner .frame-inner {
      padding-bottom: 10px; } }
.team-battle-select-opponent-team-page .ribbon-img-title {
  top: -103px; }
  @media (max-width: 767px) {
    .team-battle-select-opponent-team-page .ribbon-img-title {
      top: -53px; } }
.team-battle-select-opponent-team-page .frame-title {
  color: #295990;
  font-size: 20px;
  font-weight: 800;
  text-align: center;
  margin: 20px 0 15px !important; }
.team-battle-select-opponent-team-page .bg-shining-yellow .bg-inner {
  padding-bottom: 40px; }
.team-battle-select-opponent-team-page .btn-box {
  width: 400px;
  margin: 0 auto; }
  @media (max-width: 767px) {
    .team-battle-select-opponent-team-page .btn-box {
      width: auto; } }
@media (max-width: 767px) {
  .team-battle-select-opponent-team-page .search-form .form-group {
    padding: 0; } }

.team-battle-result-page .trophy-page-title {
  margin-bottom: 40px; }
.team-battle-result-page .btn-box {
  width: 400px;
  margin: 0 auto; }
  @media (max-width: 767px) {
    .team-battle-result-page .btn-box {
      width: auto; } }
.team-battle-result-page .bg-shining-yellow .bg-inner {
  padding-bottom: 100px; }
  @media (max-width: 767px) {
    .team-battle-result-page .bg-shining-yellow .bg-inner {
      padding-bottom: 40px; } }

.team-battle-ranking-page .message {
  color: #f15a5a;
  font-size: 28px;
  font-weight: bold;
  text-align: center; }
  @media (max-width: 767px) {
    .team-battle-ranking-page .message {
      font-size: 20px;
      padding-top: 20px; } }
.team-battle-ranking-page .btn-box {
  width: 400px;
  margin: 0 auto; }
  @media (max-width: 767px) {
    .team-battle-ranking-page .btn-box {
      width: auto; } }
.team-battle-ranking-page .content-frame {
  margin-bottom: 50px; }
  @media (max-width: 767px) {
    .team-battle-ranking-page .content-frame {
      margin-bottom: 30px; } }
@media (max-width: 767px) {
  .team-battle-ranking-page .ranking-list.list-stage .item-content {
    height: auto;
    padding: 10px 0 10px 50px; }
  .team-battle-ranking-page .ranking-list.list-stage .description {
    padding-right: 0; } }

.team-play-page .frame-title {
  margin: 20px 0; }
.team-play-page .ribbon-img-title {
  background: url("/images/play/background-title.png") no-repeat center center;
  color: #fff;
  padding: 12px 210px 25px;
  font-size: 22px;
  top: -85px; }
.team-play-page .list-team {
  float: left;
  width: 100%;
  margin-bottom: 50px; }
  .team-play-page .list-team a:hover {
    text-decoration: none; }
  .team-play-page .list-team .box {
    width: 45%;
    float: left;
    display: block;
    margin: 0 auto;
    text-align: center;
    border: 5px solid #fff;
    min-height: 150px;
    border-radius: 10px;
    padding: 15px;
    margin-left: 18px; }
    .team-play-page .list-team .box p {
      color: #fff; }
    .team-play-page .list-team .box .title {
      min-height: 70px;
      font-size: 16px; }
    .team-play-page .list-team .box .txt {
      font-size: 20px;
      font-weight: bold;
      margin-bottom: 0; }
  .team-play-page .list-team .right {
    background-color: #E26C32; }
    .team-play-page .list-team .right .title {
      padding-top: 10px; }
  .team-play-page .list-team .left {
    background-color: #00bf9d; }

.select-request .question-about {
  float: left;
  width: 100%;
  background-color: #fff;
  margin-top: 15px;
  margin-bottom: 30px; }
  .select-request .question-about .title-yellow-bg {
    margin-top: 0; }
  .select-request .question-about .content {
    padding: 0 10px; }
.select-request .list-question-btn {
  display: block;
  width: 100%;
  overflow: hidden; }
  .select-request .list-question-btn ul {
    float: left;
    width: 100%;
    padding: 10px; }
    .select-request .list-question-btn ul li {
      display: inline-block;
      width: 49.5%;
      text-align: center;
      margin: 0 auto 24px auto; }
      .select-request .list-question-btn ul li a:hover, .select-request .list-question-btn ul li a:active, .select-request .list-question-btn ul li a:focus {
        text-decoration: none; }
      .select-request .list-question-btn ul li .disible {
        display: block;
        width: 200px;
        height: 60px;
        text-align: center;
        background-color: #E2E2E2;
        border: 3px solid #fff;
        margin: 0 auto;
        padding: 15px;
        font-size: 18px; }
      .select-request .list-question-btn ul li .enable {
        display: block;
        width: 200px;
        height: 80px;
        text-align: center;
        background-color: #1B6ABD;
        border: 3px solid #fff;
        color: #fff;
        margin: 0 auto;
        padding: 10px 5px;
        font-size: 18px; }
        .select-request .list-question-btn ul li .enable .progress {
          background: transparent;
          color: #15E458;
          font-weight: bold; }
        .select-request .list-question-btn ul li .enable .failed {
          background: transparent;
          color: red;
          font-weight: bold; }
        .select-request .list-question-btn ul li .enable .clear {
          background: transparent;
          color: #EAD313;
          font-weight: bold; }

.history-page .frame-inner .middle {
  padding-top: 0 !important; }
  .history-page .frame-inner .middle .frame-title {
    font-size: 24px; }
  .history-page .frame-inner .middle .bg-frame {
    border: none;
    border-radius: 0;
    text-transform: uppercase; }
  .history-page .frame-inner .middle .list-team-battle {
    overflow: hidden;
    border: 2px solid #1b6abd; }
    .history-page .frame-inner .middle .list-team-battle ul {
      padding-top: 0; }
    .history-page .frame-inner .middle .list-team-battle .txt-vs {
      left: 46%;
      top: 52%;
      font-size: 28px; }
    .history-page .frame-inner .middle .list-team-battle .team-title {
      border: none;
      background-color: transparent;
      color: #1B6ABD;
      border-radius: none;
      margin: 0 auto;
      font-size: 16px;
      text-align: left;
      font-weight: normal; }
    .history-page .frame-inner .middle .list-team-battle .team-scort {
      margin: 0 auto;
      border: 2px solid #6ECBE6;
      background-color: transparent;
      color: #6ECBE6; }
    .history-page .frame-inner .middle .list-team-battle .active {
      border: 2px solid #65BCD6;
      background-color: #6ECBE6;
      color: #fff; }
    .history-page .frame-inner .middle .list-team-battle .battle-txt {
      text-align: right;
      padding: 0px 40px; }
  .history-page .frame-inner .middle .btn-lg, .history-page .frame-inner .middle .btn-group-lg > .btn {
    width: 60%; }

.group-setting-page .bg-triangle {
  padding-bottom: 80px; }
  @media (max-width: 767px) {
    .group-setting-page .bg-triangle {
      padding-bottom: 40px; } }
.group-setting-page .group-box {
  position: relative;
  display: block;
  padding-top: 70px;
  background: #fff;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.15);
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    .group-setting-page .group-box {
      padding-top: 35px;
      margin-bottom: 10px; } }
  .group-setting-page .group-box:hover {
    background: #f1fcff;
    text-decoration: none; }
  .group-setting-page .group-box:after {
    content: '';
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 69px;
    height: 69px;
    background: url("/images/arrow-triangle.png"); }
    @media (max-width: 767px) {
      .group-setting-page .group-box:after {
        width: 35px;
        height: 35px;
        background-size: 100%; } }
.group-setting-page .group-id {
  position: absolute;
  top: 0;
  left: 0;
  height: 50px;
  color: #fff;
  font-size: 28px;
  padding: 5px 30px;
  background: #6ecbe6;
  border-right: 1px solid #63b6cf;
  border-bottom: 1px solid #63b6cf; }
  @media (max-width: 767px) {
    .group-setting-page .group-id {
      height: 30px;
      font-size: 14px;
      padding: 5px 15px; } }
.group-setting-page a {
  color: inherit; }
.group-setting-page .group-info {
  padding: 0 30px 20px;
  margin-bottom: 0; }
  @media (max-width: 767px) {
    .group-setting-page .group-info {
      padding: 0 15px 10px;
      margin-bottom: 0; } }
  @media (min-width: 768px) {
    .group-setting-page .group-info dt {
      width: 130px; } }
  @media (min-width: 768px) {
    .group-setting-page .group-info dd {
      margin-left: 150px; } }
  @media (max-width: 767px) {
    .group-setting-page .group-info dd {
      margin-bottom: 5px; }
      .group-setting-page .group-info dd.multi-line {
        min-height: 40px; } }
  .group-setting-page .group-info dt, .group-setting-page .group-info dd {
    color: #38454f;
    font-size: 18px;
    font-weight: normal;
    text-align: left; }
    @media (max-width: 767px) {
      .group-setting-page .group-info dt, .group-setting-page .group-info dd {
        font-size: 12px; } }
    @media (min-width: 768px) {
      .group-setting-page .group-info dt.group-name-dt, .group-setting-page .group-info dd.group-name-dt {
        padding-top: 5px; } }
    .group-setting-page .group-info dt.group-name, .group-setting-page .group-info dd.group-name {
      font-size: 24px;
      font-weight: bold; }
      @media (max-width: 767px) {
        .group-setting-page .group-info dt.group-name, .group-setting-page .group-info dd.group-name {
          font-size: 15px; } }
    .group-setting-page .group-info dt .owner-nickname, .group-setting-page .group-info dd .owner-nickname {
      font-weight: bold; }
.group-setting-page .role-label {
  display: inline-block;
  width: 74px;
  height: 24px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  border-radius: 5px; }
  @media (max-width: 767px) {
    .group-setting-page .role-label {
      width: 54px;
      height: 19px;
      font-size: 10px;
      border-radius: 5px;
      border-width: 2px !important; } }
  .group-setting-page .role-label.green {
    color: #00bf9d;
    border: 3px solid #00bf9d; }
  .group-setting-page .role-label.orange {
    color: #ff9b24;
    border: 3px solid #ff9b24; }
.group-setting-page .member-list .item {
  height: 80px;
  border-top: 1px solid #e0e0e0; }
.group-setting-page .member-list .cell {
  display: table-cell;
  vertical-align: middle; }
  .group-setting-page .member-list .cell.first {
    width: 70px;
    text-align: right; }
    @media (max-width: 767px) {
      .group-setting-page .member-list .cell.first {
        width: 50px; } }
  .group-setting-page .member-list .cell.second {
    width: 90px;
    text-align: right; }
    @media (max-width: 767px) {
      .group-setting-page .member-list .cell.second {
        width: 60px; } }
  .group-setting-page .member-list .cell.third {
    height: 80px;
    padding: 0 20px;
    max-width: 255px;
    line-height: 1.2; }
.group-setting-page .member-list .thumb {
  width: 45px; }
.group-setting-page .member-list .member-name {
  font-size: 24px;
  color: #38454f;
  margin: 0; }
  @media (max-width: 767px) {
    .group-setting-page .member-list .member-name {
      font-size: 14px; } }
.group-setting-page .member-list .member-id {
  font-size: 18px;
  color: #38454f; }
  @media (max-width: 767px) {
    .group-setting-page .member-list .member-id {
      font-size: 11px; } }
.group-setting-page .has-waiting-member {
  padding: 0 30px; }
  @media (max-width: 767px) {
    .group-setting-page .has-waiting-member {
      padding: 0 15px; } }
  .group-setting-page .has-waiting-member p {
    color: #00bf9d;
    border: 3px solid #00bf9d;
    border-radius: 6px;
    font-weight: bold;
    text-align: center;
    padding: 5px 10px; }
.group-setting-page .team-waiting-approval .title {
  margin: 0;
  background: #6ecbe6;
  padding: 10px 30px;
  color: #fff;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.15); }
  @media (max-width: 767px) {
    .group-setting-page .team-waiting-approval .title {
      padding: 10px 15px; } }
.group-setting-page .team-waiting-approval .group-box {
  padding-top: 0; }
  .group-setting-page .team-waiting-approval .group-box:after {
    display: none; }
  .group-setting-page .team-waiting-approval .group-box:hover {
    background: #fff; }
  .group-setting-page .team-waiting-approval .group-box .item {
    padding-top: 20px;
    border-bottom: 1px solid #e0e0e0; }
.group-setting-page .team-waiting-approval .group-info {
  padding-bottom: 15px;
  padding-right: 200px; }
  @media (max-width: 767px) {
    .group-setting-page .team-waiting-approval .group-info {
      padding-right: 0;
      padding-bottom: 0; } }
.group-setting-page .team-waiting-approval .btn-box {
  position: absolute;
  top: 20px;
  right: 30px; }
  @media (max-width: 767px) {
    .group-setting-page .team-waiting-approval .btn-box {
      position: static;
      padding: 0 15px 5px; } }
@media (min-width: 768px) {
  .group-setting-page .btn-area-lg .btn {
    width: 500px;
    height: 50px; } }
.group-setting-page .btn small {
  display: block;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.4;
  margin-top: 3px; }
.group-setting-page .divider {
  margin: 40px 0; }
  @media (max-width: 767px) {
    .group-setting-page .divider {
      margin: 20px 0; } }
.group-setting-page.recommend-student-confirm-page .content-frame {
  padding: 20px;
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    .group-setting-page.recommend-student-confirm-page .content-frame {
      padding: 20px 15px 15px; } }
.group-setting-page.recommend-student-confirm-page .form-horizontal {
  margin: 0; }
.group-setting-page.recommend-student-confirm-page .form-title {
  font-size: 16px;
  margin-bottom: 15px; }
.group-setting-page.recommend-student-confirm-page .form-group {
  margin-top: 3px; }
@media (max-width: 767px) {
  .group-setting-page.recommend-student-confirm-page .control-label {
    text-align: left;
    font-size: 12px; } }
.group-setting-page.recommend-student-confirm-page .form-control-static {
  font-size: 18px; }
  @media (max-width: 767px) {
    .group-setting-page.recommend-student-confirm-page .form-control-static {
      font-size: 14px; } }
.group-setting-page.recommend-student-confirm-page .group-box:after {
  display: none; }
.group-setting-page .team .item {
  position: relative; }
  .group-setting-page .team .item a:hover, .group-setting-page .team .item a:active, .group-setting-page .team .item a:focus {
    text-decoration: none; }
  @media (max-width: 991px) {
    .group-setting-page .team .item .group-info {
      overflow: hidden; } }
  @media (max-width: 767px) {
    .group-setting-page .team .item .group-info {
      display: block;
      overflow: hidden; } }
  .group-setting-page .team .item .group-info dt {
    font-size: 16px; }
    @media (max-width: 991px) {
      .group-setting-page .team .item .group-info dt {
        width: 40%;
        overflow: hidden;
        float: left; } }
    @media (max-width: 767px) {
      .group-setting-page .team .item .group-info dt {
        width: 30%; } }
    @media (max-width: 425px) {
      .group-setting-page .team .item .group-info dt {
        width: 35%;
        font-size: 14px; } }
  .group-setting-page .team .item .group-info dd {
    font-size: 14px;
    margin-bottom: 5px; }
    @media (max-width: 991px) {
      .group-setting-page .team .item .group-info dd {
        width: 60%;
        overflow: hidden;
        float: left;
        margin: 0 0 5px; } }
    @media (max-width: 767px) {
      .group-setting-page .team .item .group-info dd {
        width: 70%; } }
    @media (max-width: 425px) {
      .group-setting-page .team .item .group-info dd {
        width: 65%; } }
  .group-setting-page .team .item .group-info dd.group-name {
    font-size: 20px;
    word-break: break-word; }
    .is-ie .group-setting-page .team .item .group-info dd.group-name {
      word-break: break-all; }
    @media (max-width: 425px) {
      .group-setting-page .team .item .group-info dd.group-name {
        font-size: 16px; } }
  .group-setting-page .team .item .member-list .member-name {
    font-size: 18px; }
  .group-setting-page .team .item .member-list .member-id {
    font-size: 14px; }
  .group-setting-page .team .item .crt-team {
    margin-bottom: 50px; }
    .group-setting-page .team .item .crt-team .group-box {
      padding-top: 50px; }
      @media (max-width: 767px) {
        .group-setting-page .team .item .crt-team .group-box {
          padding-top: 25px; } }
      .group-setting-page .team .item .crt-team .group-box a h2 {
        font-weight: bold; }
        @media (max-width: 425px) {
          .group-setting-page .team .item .crt-team .group-box a h2 {
            font-size: 20px; } }
    .group-setting-page .team .item .crt-team .divider {
      margin: 50px 0 0; }
      @media (max-width: 767px) {
        .group-setting-page .team .item .crt-team .divider {
          margin: 30px 0 0; } }
    .group-setting-page .team .item .crt-team p {
      padding: 24px 0 25px; }
      @media (max-width: 767px) {
        .group-setting-page .team .item .crt-team p {
          padding: 18px 0; } }

.group-box-search-result {
  background: #fff;
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.15);
  margin-bottom: 20px; }
  .group-box-search-result .header {
    position: relative;
    padding: 20px 30px;
    border-bottom: 1px solid #ddd; }
    @media (max-width: 767px) {
      .group-box-search-result .header {
        padding: 15px; } }
    @media (max-width: 991px) {
      .group-box-search-result .header .right-pc {
        float: right;
        margin-top: 10px; } }
    @media (min-width: 992px) {
      .group-box-search-result .header .left-pc {
        padding-right: 420px; }
      .group-box-search-result .header .right-pc {
        float: none;
        position: absolute;
        right: 30px;
        top: 38px;
        bottom: auto; } }
    .group-box-search-result .header .thumb {
      float: left;
      width: 50px;
      height: auto; }
      @media (max-width: 767px) {
        .group-box-search-result .header .thumb {
          width: 40px; } }
    .group-box-search-result .header .group-name {
      display: block;
      padding-top: 4px;
      padding-left: 65px;
      font-size: 28px;
      font-weight: bold;
      word-break: break-word; }
      .is-ie .group-box-search-result .header .group-name {
        word-break: break-all; }
      @media (max-width: 767px) {
        .group-box-search-result .header .group-name {
          padding-top: 6px;
          padding-left: 55px;
          font-size: 20px; } }
    .group-box-search-result .header .text {
      font-size: 16px;
      margin-left: 50px; }
      @media (max-width: 767px) {
        .group-box-search-result .header .text {
          font-size: 12px;
          margin-left: 10px; }
          .group-box-search-result .header .text:first-child {
            margin-left: 0; } }
      .group-box-search-result .header .text .bold {
        font-weight: bold; }
  .group-box-search-result .group-info.above {
    margin-top: 30px;
    padding-bottom: 10px; }
    @media (max-width: 767px) {
      .group-box-search-result .group-info.above {
        margin-top: 15px;
        padding-bottom: 0px; } }
  @media (min-width: 992px) {
    .group-box-search-result .group-info.below {
      float: left; } }
  @media (max-width: 991px) {
    .group-box-search-result .group-info.below {
      padding-bottom: 0; } }
  .group-box-search-result .group-info .thumb {
    width: 50px;
    height: auto; }
  @media (min-width: 768px) {
    .group-box-search-result .group-info .role-label {
      width: 94px; }
    .group-box-search-result .group-info dt.leader {
      min-height: 45px;
      padding-top: 10px;
      margin-bottom: 10px; } }
  .group-box-search-result .group-info dt, .group-box-search-result .group-info dd {
    font-size: 16px;
    margin-bottom: 4px; }
  @media (min-width: 768px) {
    .group-box-search-result .group-info dt {
      width: 200px; }
    .group-box-search-result .group-info dd {
      margin-left: 240px; } }
  @media (max-width: 768px) {
    .group-box-search-result .group-info dt {
      font-size: 12px;
      margin-bottom: 0px; }
    .group-box-search-result .group-info dd {
      margin-bottom: 8px; } }
  .group-box-search-result .join-btn-box {
    float: right;
    width: 300px;
    margin-right: 30px;
    margin-top: 10px; }
    @media (max-width: 991px) {
      .group-box-search-result .join-btn-box {
        width: 240px; } }
    @media (max-width: 991px) {
      .group-box-search-result .join-btn-box {
        float: none;
        width: 100%;
        padding: 0 30px 15px; } }
    @media (max-width: 767px) {
      .group-box-search-result .join-btn-box {
        padding-right: 15px;
        padding-left: 15px; } }
  .group-box-search-result .footer {
    padding: 20px 0 0;
    background: #f6f6f6; }

.deck-page .deck-info {
  padding: 50px 0; }
  @media (max-width: 767px) {
    .deck-page .deck-info {
      display: table;
      width: 100%;
      padding: 15px 0 0; } }
  .deck-page .deck-info .cell {
    display: table-cell;
    vertical-align: top; }
  .deck-page .deck-info .thumb {
    width: 210px;
    height: 210px;
    background: #e8e7e5;
    border-radius: 5px;
    overflow: hidden; }
    @media (max-width: 767px) {
      .deck-page .deck-info .thumb {
        width: 60px;
        height: 60px; } }
  @media (max-width: 767px) {
    .deck-page .deck-info .thumb-cell {
      width: 60px; } }
  .deck-page .deck-info .text-area {
    width: 810px;
    padding-left: 40px; }
    @media (max-width: 1199px) {
      .deck-page .deck-info .text-area {
        width: 730px; } }
    @media (max-width: 991px) {
      .deck-page .deck-info .text-area {
        width: 510px; } }
    @media (max-width: 767px) {
      .deck-page .deck-info .text-area {
        width: auto;
        padding-left: 15px; } }
  .deck-page .deck-info .subject-thumb {
    float: left;
    width: 110px;
    height: 110px;
    position: relative;
    margin-left: 22px; }
    .deck-page .deck-info .subject-thumb .hexagon {
      /*this smushes a square into a 60deg/120deg rhombus*/
      position: relative;
      height: 76px;
      width: 43.8786204584px;
      background-size: auto 119.8786204584px;
      background-position: center center;
      border-top: solid 4px #00bf9d;
      border-bottom: solid 4px #00bf9d;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      background-color: #fff;
      box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
      /*cover up the box shadows */
      box-shadow: none !important;
      background-color: transparent; }
      .deck-page .deck-info .subject-thumb .hexagon .hex1,
      .deck-page .deck-info .subject-thumb .hexagon .hex2 {
        position: absolute;
        overflow: hidden;
        width: 53.7401153702px;
        height: 53.7401153702px;
        top: 6.9696551146px;
        /*for some reason this 1px correction is needed */
        background: inherit;
        box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
        -webkit-transform: scaleX(0.5773502692) rotate(45deg);
        -moz-transform: scaleX(0.5773502692) rotate(45deg);
        -ms-transform: scaleX(0.5773502692) rotate(45deg);
        -o-transform: scaleX(0.5773502692) rotate(45deg);
        transform: scaleX(0.5773502692) rotate(45deg); }
        .deck-page .deck-info .subject-thumb .hexagon .hex1:after,
        .deck-page .deck-info .subject-thumb .hexagon .hex2:after {
          /*counter rotate and un-scale the bg image*/
          content: "";
          position: absolute;
          top: -11.9696551146px;
          /*same correction as up above */
          height: 76px;
          width: 53.7401153702px;
          left: 0;
          background: inherit;
          -webkit-transform: rotate(-45deg) scaleX(1.7320508076);
          -moz-transform: rotate(-45deg) scaleX(1.7320508076);
          -ms-transform: rotate(-45deg) scaleX(1.7320508076);
          -o-transform: rotate(-45deg) scaleX(1.7320508076);
          transform: rotate(-45deg) scaleX(1.7320508076); }
      .deck-page .deck-info .subject-thumb .hexagon .hex1 {
        left: -26.8700576851px;
        border-left: solid 6.9282032303px #00bf9d;
        border-bottom: solid 6.9282032303px #00bf9d;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden; }
        .deck-page .deck-info .subject-thumb .hexagon .hex1:after {
          background-position: 17% center;
          margin-left: -6.9282032303px; }
      .deck-page .deck-info .subject-thumb .hexagon .hex2 {
        right: -26.8700576851px;
        border-top: solid 6.9282032303px #00bf9d;
        border-right: solid 6.9282032303px #00bf9d;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden; }
        .deck-page .deck-info .subject-thumb .hexagon .hex2:after {
          background-position: 83% center;
          margin-top: -5.9282032303px;
          /*that pesky single pixel correction again*/ }
      .deck-page .deck-info .subject-thumb .hexagon:after {
        content: "";
        position: absolute;
        left: 2.8284271247px;
        right: 0;
        top: 0;
        bottom: 0;
        width: 38.2217662089px;
        background: inherit; }
      .deck-page .deck-info .subject-thumb .hexagon .hex1, .deck-page .deck-info .subject-thumb .hexagon .hex2 {
        box-shadow: none !important; }
    .deck-page .deck-info .subject-thumb .subject-icon {
      width: 120px;
      height: 120px;
      position: absolute;
      top: -19%;
      left: -28%; }
    @media (max-width: 767px) {
      .deck-page .deck-info .subject-thumb {
        display: none; } }
  .deck-page .deck-info .deck-title {
    padding-left: 140px; }
    @media (max-width: 767px) {
      .deck-page .deck-info .deck-title {
        min-height: 70px;
        padding-left: 0;
        padding-bottom: 10px; } }
    .deck-page .deck-info .deck-title .name {
      font-size: 32px;
      font-weight: bold;
      padding-bottom: 15px;
      margin: 0 0 15px;
      border-bottom: 1px dotted #b2b1b1; }
      @media (max-width: 767px) {
        .deck-page .deck-info .deck-title .name {
          font-size: 18px;
          padding-bottom: 0;
          margin: 0 0 5px;
          border: none; } }
    .deck-page .deck-info .deck-title .category {
      display: inline-block;
      width: 100px;
      height: 30px;
      color: #fff;
      font-size: 14px;
      text-align: center;
      background: #6ecbe6;
      border-radius: 15px;
      padding: 5px 0;
      margin-right: 10px; }
      @media (max-width: 767px) {
        .deck-page .deck-info .deck-title .category {
          width: 70px;
          height: 20px;
          font-size: 10px;
          border-radius: 10px;
          padding: 3px 0;
          margin-right: 5px; } }
    .deck-page .deck-info .deck-title .subject {
      font-size: 16px; }
      @media (max-width: 767px) {
        .deck-page .deck-info .deck-title .subject {
          font-size: 12px; } }
    .deck-page .deck-info .deck-title .publisher-logo {
      width: auto;
      height: 30px; }
      @media (max-width: 767px) {
        .deck-page .deck-info .deck-title .publisher-logo {
          height: 20px; } }
.deck-page .btn-area {
  margin-top: 15px; }
  @media (max-width: 767px) {
    .deck-page .btn-area {
      margin-top: 0px;
      padding-top: 5px;
      padding-bottom: 15px;
      border-top: 1px dotted #b2b1b1; }
      .deck-page .btn-area .btn-green {
        padding-top: 10px;
        padding-bottom: 10px; } }
  .deck-page .btn-area .icon-rabicoin {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url("/images/icons/rabikoin.png") left top no-repeat;
    background-size: 100% auto;
    position: relative;
    bottom: -5px; }
  .deck-page .btn-area .icon-controller {
    display: inline-block;
    width: 53px;
    height: 29px;
    background: url("/images/icons/controller.png") left top no-repeat;
    background-size: 100% auto;
    position: relative;
    bottom: -7px; }
  @media (min-width: 768px) {
    .deck-page .btn-area .btn {
      width: 47%;
      height: 60px;
      padding: 0 15px;
      line-height: 52px;
      font-size: 20px; } }
  @media (min-width: 992px) {
    .deck-page .btn-area .btn {
      width: 32%; } }
  .deck-page .btn-area .btn .num {
    font-size: 30px; }
  @media (max-width: 767px) {
    .deck-page .btn-area .btn {
      margin: 5px 0; } }
.deck-page .description-section {
  padding: 60px 0; }
  @media (max-width: 767px) {
    .deck-page .description-section {
      padding: 20px 0; } }
  .deck-page .description-section .panel {
    margin-bottom: 35px; }
    @media (max-width: 767px) {
      .deck-page .description-section .panel {
        margin-bottom: 15px; } }
    .deck-page .description-section .panel .panel-heading {
      margin-bottom: 0; }
  .deck-page .description-section .deck-description {
    color: #2d3940;
    font-size: 18px;
    padding: 20px;
    background: #fff;
    border-radius: 3px;
    margin-bottom: 30px; }
    @media (max-width: 767px) {
      .deck-page .description-section .deck-description {
        font-size: 12px;
        padding: 10px;
        margin-bottom: 20px; } }
  .deck-page .description-section .deck-screenshots-wrapper {
    margin-left: -10px;
    margin-right: -10px;
    position: static;
    margin: 0; }
    @media (max-width: 767px) {
      .deck-page .description-section .deck-screenshots-wrapper {
        margin-left: -15px;
        margin-right: -15px; } }
    .deck-page .description-section .deck-screenshots-wrapper .item {
      padding: 0 5px; }
      @media (max-width: 767px) {
        .deck-page .description-section .deck-screenshots-wrapper .item {
          padding: 0 5px;
          margin-bottom: 10px; } }
      .deck-page .description-section .deck-screenshots-wrapper .item .item-inner {
        border: 10px solid #fff; }
        @media (max-width: 767px) {
          .deck-page .description-section .deck-screenshots-wrapper .item .item-inner {
            border-width: 5px; } }
      .deck-page .description-section .deck-screenshots-wrapper .item img {
        width: 100%;
        height: auto; }
    @media (min-width: 1025px) {
      .deck-page .description-section .deck-screenshots-wrapper .owl-controls, .deck-page .description-section .deck-screenshots-wrapper .owl-buttons {
        position: relative;
        margin: 0; }
        .deck-page .description-section .deck-screenshots-wrapper .owl-controls .slick-arrow, .deck-page .description-section .deck-screenshots-wrapper .owl-buttons .slick-arrow {
          position: absolute;
          background-color: #aeadac;
          opacity: 1;
          color: #fff;
          border-radius: 0 !important;
          width: 24px;
          height: 174px;
          margin: 0;
          bottom: 10px;
          left: -40px;
          padding: 0;
          text-align: center; }
          .deck-page .description-section .deck-screenshots-wrapper .owl-controls .slick-arrow .el-icons, .deck-page .description-section .deck-screenshots-wrapper .owl-buttons .slick-arrow .el-icons {
            font-size: 25px;
            line-height: 25px;
            height: 25px;
            position: absolute;
            top: 50%;
            margin-top: -12.5px;
            width: 100%;
            left: 50%;
            margin-left: -12px; }
        .deck-page .description-section .deck-screenshots-wrapper .owl-controls .owl-next, .deck-page .description-section .deck-screenshots-wrapper .owl-buttons .owl-next {
          left: auto;
          right: -40px; } }
    @media (max-width: 1025px) {
      .deck-page .description-section .deck-screenshots-wrapper .owl-controls {
        display: none; } }
.deck-page .search-items-by .title-yellow-bg {
  margin-bottom: 30px; }
  @media (max-width: 767px) {
    .deck-page .search-items-by .title-yellow-bg {
      margin: 0 -15px; } }
.deck-page .search-items-by .deck-list {
  margin-bottom: 30px; }
@media (max-width: 767px) {
  .deck-page .search-items-by .search-group > .h3 {
    margin-bottom: 20px; } }

@media (max-width: 991px) {
  #modalShare .btn-yellow {
    padding-left: 0px;
    padding-right: 0px; } }

.dashboard-page .h115 {
  height: 115px; }
  @media (max-width: 767px) {
    .dashboard-page .h115 {
      display: none; } }
.dashboard-page .user-dashboard {
  padding: 40px 0 30px; }
  @media (max-width: 767px) {
    .dashboard-page .user-dashboard {
      padding: 10px 0 0; } }
  .dashboard-page .user-dashboard .left {
    float: left;
    width: 240px; }
    @media (max-width: 767px) {
      .dashboard-page .user-dashboard .left {
        float: none;
        width: 100%; } }
    .dashboard-page .user-dashboard .left .avatar {
      width: 190px;
      margin-left: auto;
      margin-right: auto; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .left .avatar {
          width: 130px; } }
    .dashboard-page .user-dashboard .left .ranking {
      display: block;
      width: 241px;
      height: 65px;
      background: url("/images/background/avatar-caption.png") left top no-repeat;
      background-size: 100% auto;
      margin-top: -25px;
      position: relative;
      text-align: center;
      padding-top: 2px; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .left .ranking {
          width: 160px;
          height: 45px;
          margin-left: auto;
          margin-right: auto; } }
      .dashboard-page .user-dashboard .left .ranking p {
        color: #fff;
        font-size: 12px; }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .left .ranking p {
            font-size: 10px; } }
        .dashboard-page .user-dashboard .left .ranking p.bold {
          font-size: 14px;
          margin-bottom: -4px; }
          @media (max-width: 767px) {
            .dashboard-page .user-dashboard .left .ranking p.bold {
              font-size: 10px; } }
          .dashboard-page .user-dashboard .left .ranking p.bold .point {
            font-size: 28px; }
            @media (max-width: 767px) {
              .dashboard-page .user-dashboard .left .ranking p.bold .point {
                font-size: 16px; } }
    .dashboard-page .user-dashboard .left .name {
      font-weight: 700;
      font-size: 28px;
      color: #344870;
      text-align: center;
      margin-top: 4px;
      word-break: break-all; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .left .name {
          font-size: 20px;
          margin: 0; } }
    .dashboard-page .user-dashboard .left .btn {
      padding-left: 20px;
      padding-right: 30px;
      font-weight: 600; }
      .dashboard-page .user-dashboard .left .btn span {
        position: relative; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .left .btn {
          font-size: 10px;
          width: 213px;
          height: 30px;
          padding: 2px 0;
          margin: 5px auto 0; } }
    .dashboard-page .user-dashboard .left .btn-navy {
      background-color: #3c79cf;
      border: 0 none;
      border-right: 2px solid #2d67b8;
      border-bottom: 2px solid #2d67b8;
      font-size: 14px;
      font-weight: 600; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .left .btn-navy:after {
          font-size: 16px;
          right: 5px; } }
    .dashboard-page .user-dashboard .left .btn-navy-border {
      border: 2px solid #40547e;
      color: #40547e;
      font-size: 16px; }
    .dashboard-page .user-dashboard .left .btn-friend span:before {
      content: "";
      background: url("../images/icons/db-add-friend.png") no-repeat;
      position: absolute;
      left: -27px;
      top: -1px;
      width: 19px;
      height: 19px; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .left .btn-friend span:before {
          left: -23px;
          top: -4px;
          width: 19px;
          height: 19px; } }
    .dashboard-page .user-dashboard .left .btn-unfriend {
      position: relative; }
      .dashboard-page .user-dashboard .left .btn-unfriend:before {
        content: "";
        background: url("../images/icons/db-remove-friend.png") no-repeat;
        position: absolute;
        left: 47px;
        top: 12px;
        width: 19px;
        height: 19px; }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .left .btn-unfriend:before {
            left: 41px;
            top: 4px; } }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .left .btn-unfriend {
          padding-bottom: 27px; } }
  .dashboard-page .user-dashboard .right {
    float: left;
    width: 840px;
    padding-left: 30px; }
    @media (max-width: 1199px) {
      .dashboard-page .user-dashboard .right {
        width: 700px; } }
    @media (max-width: 991px) {
      .dashboard-page .user-dashboard .right {
        width: 480px; } }
    @media (max-width: 767px) {
      .dashboard-page .user-dashboard .right {
        width: auto;
        padding: 0;
        margin: 15px -15px -6px -15px; } }
    .dashboard-page .user-dashboard .right .btn-group-1 {
      padding-top: 25px; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .right .btn-group-1 {
          padding: 15px 20px; }
          .dashboard-page .user-dashboard .right .btn-group-1 .col-xs-6 {
            padding: 0 5px; } }
      .dashboard-page .user-dashboard .right .btn-group-1 .btn {
        height: 72px;
        vertical-align: middle;
        line-height: 72px;
        border-bottom: 2px solid #d7d51c;
        border-right: 2px solid #d7d51c; }
        @media (max-width: 1199px) and (min-width: 991px) {
          .dashboard-page .user-dashboard .right .btn-group-1 .btn {
            padding: 9px 20px 10px; } }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .right .btn-group-1 .btn {
            width: 100%;
            height: 65px;
            padding: 9px 0;
            margin: -4px auto 0;
            line-height: 65px;
            font-size: 15px; } }
      .dashboard-page .user-dashboard .right .btn-group-1 .btn-image {
        padding: 0;
        position: relative; }
        .dashboard-page .user-dashboard .right .btn-group-1 .btn-image span {
          display: inline-block;
          vertical-align: middle;
          color: #40547e;
          font-weight: bold;
          padding-bottom: 5px;
          line-height: 1.3;
          font-size: 18px; }
          @media (max-width: 1199px) {
            .dashboard-page .user-dashboard .right .btn-group-1 .btn-image span {
              font-size: 16px; } }
          @media (max-width: 767px) {
            .dashboard-page .user-dashboard .right .btn-group-1 .btn-image span {
              font-size: 17px; } }
        .dashboard-page .user-dashboard .right .btn-group-1 .btn-image .controller {
          margin-left: -15px;
          margin-bottom: 8px; }
          .dashboard-page .user-dashboard .right .btn-group-1 .btn-image .controller.img-indivisual-play {
            width: 58px; }
          .dashboard-page .user-dashboard .right .btn-group-1 .btn-image .controller.img-team-play {
            width: 48px; }
          .dashboard-page .user-dashboard .right .btn-group-1 .btn-image .controller.img-search-drill {
            width: 48px; }
          @media (max-width: 767px) {
            .dashboard-page .user-dashboard .right .btn-group-1 .btn-image .controller {
              margin-left: -5%;
              width: 50px;
              height: auto; } }
        .dashboard-page .user-dashboard .right .btn-group-1 .btn-image:after {
          color: #40547e;
          font-size: 30px; }
          @media (max-width: 1199px) and (min-width: 768px) {
            .dashboard-page .user-dashboard .right .btn-group-1 .btn-image:after {
              right: 8px; } }
    .dashboard-page .user-dashboard .right .divider {
      margin: 30px 0; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .right .divider {
          display: none; } }
    .dashboard-page .user-dashboard .right .counter-group {
      display: table;
      table-layout: fixed;
      width: 100%;
      margin-bottom: 30px; }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .right .counter-group {
          background: #6ecbe6;
          padding: 10px;
          margin: 0; } }
      .dashboard-page .user-dashboard .right .counter-group .cell {
        display: table-cell;
        vertical-align: top; }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .right .counter-group .cell {
            text-align: center; } }
      .dashboard-page .user-dashboard .right .counter-group .first {
        width: 23%; }
        @media (max-width: 991px) {
          .dashboard-page .user-dashboard .right .counter-group .first {
            width: 35%; } }
      .dashboard-page .user-dashboard .right .counter-group .second {
        width: 42%; }
        @media (max-width: 991px) {
          .dashboard-page .user-dashboard .right .counter-group .second {
            width: 36%; } }
      .dashboard-page .user-dashboard .right .counter-group img {
        float: left; }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .right .counter-group img {
            float: none;
            display: block;
            margin: 0 auto;
            height: 22px; } }
      .dashboard-page .user-dashboard .right .counter-group p {
        float: left;
        color: #344870;
        font-size: 14px;
        font-weight: 700;
        line-height: 30px;
        margin-bottom: 0; }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .right .counter-group p {
            font-size: 10px;
            line-height: 1;
            float: none;
            text-align: center;
            margin: 5px 0 8px; } }
        .dashboard-page .user-dashboard .right .counter-group p .point {
          margin-left: 5px;
          font-size: 25px; }
          @media (max-width: 767px) {
            .dashboard-page .user-dashboard .right .counter-group p .point {
              font-size: 18px;
              display: block;
              margin: 0 0 3px; } }
      .dashboard-page .user-dashboard .right .counter-group .btn {
        margin-top: 0;
        margin-bottom: 0;
        margin-left: 10px;
        font-size: 14px;
        background-color: #40547e;
        border: 0 none;
        border-right: 2px solid #21304f;
        border-bottom: 2px solid #21304f; }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .right .counter-group .btn {
            font-size: 10px;
            padding: 4px 8px;
            margin: 0 auto;
            width: auto;
            height: auto;
            line-height: 1; } }
    .dashboard-page .user-dashboard .right .points {
      margin: 0px;
      width: 92%;
      display: inline-block;
      padding-right: 20px; }
      @media (max-width: 1199px) {
        .dashboard-page .user-dashboard .right .points {
          width: 107%;
          margin: 0px;
          padding: 0px; } }
      @media (max-width: 991px) {
        .dashboard-page .user-dashboard .right .points {
          width: 100%;
          margin: 0px;
          padding: 0px; } }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .right .points {
          margin: 0;
          width: 100%; }
          .dashboard-page .user-dashboard .right .points .col-xs-6 {
            padding: 0; }
          .dashboard-page .user-dashboard .right .points .col-xs-12 {
            padding: 0; } }
      .dashboard-page .user-dashboard .right .points .col-point, .dashboard-page .user-dashboard .right .points .col-coin {
        padding: 0px 5px; }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .right .points .col-point, .dashboard-page .user-dashboard .right .points .col-coin {
            padding: 0px; } }
        .dashboard-page .user-dashboard .right .points .col-point a, .dashboard-page .user-dashboard .right .points .col-coin a {
          display: block; }
          .dashboard-page .user-dashboard .right .points .col-point a:hover, .dashboard-page .user-dashboard .right .points .col-coin a:hover {
            text-decoration: none; }
      .dashboard-page .user-dashboard .right .points .item {
        height: 70px;
        background-color: #fffd3c;
        color: #40547e;
        border-radius: 5px;
        padding: 13px 5px;
        text-align: center; }
        @media (max-width: 1199px) {
          .dashboard-page .user-dashboard .right .points .item {
            height: 64px; } }
        @media (max-width: 991px) {
          .dashboard-page .user-dashboard .right .points .item {
            margin-bottom: 20px; } }
        @media (max-width: 767px) {
          .dashboard-page .user-dashboard .right .points .item {
            height: auto;
            border-radius: 0;
            margin: 0;
            padding: 10px; }
            .dashboard-page .user-dashboard .right .points .item.first {
              border-right: 1px solid #6bc6e1; } }
        .dashboard-page .user-dashboard .right .points .item img {
          width: 48px;
          height: auto;
          position: relative;
          top: -10px; }
          @media (max-width: 767px) {
            .dashboard-page .user-dashboard .right .points .item img {
              width: 40px;
              top: 0; } }
        .dashboard-page .user-dashboard .right .points .item .text {
          margin-bottom: 0;
          font-weight: 700;
          font-size: 14px; }
          @media (max-width: 1199px) {
            .dashboard-page .user-dashboard .right .points .item .text {
              font-size: 12px; } }
          @media (max-width: 767px) {
            .dashboard-page .user-dashboard .right .points .item .text {
              font-size: 10px;
              line-height: 1;
              display: block;
              text-align: center; } }
          .dashboard-page .user-dashboard .right .points .item .text .point {
            font-size: 33px; }
            @media (max-width: 1199px) {
              .dashboard-page .user-dashboard .right .points .item .text .point {
                font-size: 30px; } }
            @media (max-width: 767px) {
              .dashboard-page .user-dashboard .right .points .item .text .point {
                font-size: 27px;
                display: block;
                margin-top: 5px;
                margin-bottom: 5px; } }
    .dashboard-page .user-dashboard .right .col-purchase {
      width: 7%;
      display: inline-block; }
      @media (max-width: 1199px) {
        .dashboard-page .user-dashboard .right .col-purchase {
          width: 12%;
          display: block; } }
      @media (max-width: 991px) {
        .dashboard-page .user-dashboard .right .col-purchase {
          width: 100%;
          display: block; } }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .right .col-purchase {
          display: block;
          width: 90%;
          margin: auto; } }
    .dashboard-page .user-dashboard .right .purchase-btn {
      float: right;
      display: block;
      width: 100px;
      height: 70px;
      color: #40547e;
      text-align: center;
      font-size: 12px;
      padding: 5px 0;
      border: 3px solid #40547e;
      border-radius: 5px; }
      @media (max-width: 1199px) {
        .dashboard-page .user-dashboard .right .purchase-btn {
          height: 64px; } }
      @media (max-width: 1199px) {
        .dashboard-page .user-dashboard .right .purchase-btn {
          width: 100%; } }
      @media (max-width: 767px) {
        .dashboard-page .user-dashboard .right .purchase-btn {
          float: none;
          width: 290px;
          margin: 10px auto 20px;
          height: 55px;
          font-size: 16px;
          padding: 7px 0; }
          .dashboard-page .user-dashboard .right .purchase-btn img {
            display: inline; } }
      .dashboard-page .user-dashboard .right .purchase-btn img {
        margin: 0 auto; }
.dashboard-page .trophy-area {
  padding: 15px 0; }
  @media (max-width: 767px) {
    .dashboard-page .trophy-area {
      padding: 15px 0 15px;
      background-color: #e7e6e4; } }
  .dashboard-page .trophy-area .trophy-list {
    margin: 0; }
    .dashboard-page .trophy-area .trophy-list li {
      float: left; }
      .dashboard-page .trophy-area .trophy-list li .trophy-img {
        width: 128px;
        height: 128px;
        margin-right: 10px; }
        @media (max-width: 767px) {
          .dashboard-page .trophy-area .trophy-list li .trophy-img {
            margin: 0px 5px;
            width: 60px;
            height: 60px; } }
      @media (max-width: 767px) {
        .dashboard-page .trophy-area .trophy-list li img {
          width: 60px; } }
    .dashboard-page .trophy-area .trophy-list .counter {
      position: relative; }
      .dashboard-page .trophy-area .trophy-list .counter img {
        margin-top: 10px;
        margin-right: 10px;
        width: 128px;
        height: 111px; }
        @media (max-width: 767px) {
          .dashboard-page .trophy-area .trophy-list .counter img {
            margin: 4px 0px 0px 0px;
            width: 60px;
            height: auto; } }
      .dashboard-page .trophy-area .trophy-list .counter .text {
        position: absolute;
        top: 0;
        bottom: 0;
        width: 124px;
        height: 64px;
        color: #fff;
        font-size: 16px;
        text-align: center;
        line-height: 1;
        margin: auto; }
        @media (max-width: 767px) {
          .dashboard-page .trophy-area .trophy-list .counter .text {
            width: 60px;
            height: 30px;
            font-size: 10px;
            line-height: 1; } }
        .dashboard-page .trophy-area .trophy-list .counter .text .total {
          display: block;
          font-size: 38px; }
          @media (max-width: 767px) {
            .dashboard-page .trophy-area .trophy-list .counter .text .total {
              font-size: 20px; } }
    @media (max-width: 767px) {
      .dashboard-page .trophy-area .trophy-list .owl-controls {
        width: 110%;
        margin-top: 0; } }
.dashboard-page .trophy-list-wrap {
  position: relative; }
  @media (max-width: 767px) {
    .dashboard-page .trophy-list-wrap {
      margin-right: -15px; } }
  .dashboard-page .trophy-list-wrap .trophy-list-fixed {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden; }
    .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter .text {
      background: url("/images/trophy/counter.png") no-repeat center center;
      position: relative;
      width: 124px;
      height: 127px;
      text-align: center;
      color: #ffffff; }
      @media (max-width: 425px) {
        .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter .text {
          background-size: 100%;
          margin-top: 0px;
          left: 0px;
          width: 78px;
          height: 78px;
          font-size: 14px; } }
      @media (max-width: 375px) {
        .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter .text {
          width: 68px;
          height: 69px;
          font-size: 12px; } }
      @media (max-width: 320px) {
        .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter .text {
          width: 55px;
          height: 56px;
          font-size: 10px; } }
      .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter .text .total {
        display: block;
        font-weight: bold;
        font-size: 38px;
        line-height: 1;
        padding-top: 35px; }
        @media (max-width: 425px) {
          .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter .text .total {
            font-size: 22px;
            padding-top: 20px; } }
        @media (max-width: 320px) {
          .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter .text .total {
            font-size: 20px;
            padding-top: 15px; } }
    .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter a {
      display: block; }
      .dashboard-page .trophy-list-wrap .trophy-list-fixed .counter a img {
        width: 100%;
        height: 100%; }
  .dashboard-page .trophy-list-wrap .trophy-list-ct {
    width: 100%;
    padding-left: 148px; }
    @media (max-width: 767px) {
      .dashboard-page .trophy-list-wrap .trophy-list-ct {
        padding-left: 140px; } }
    @media (max-width: 425px) {
      .dashboard-page .trophy-list-wrap .trophy-list-ct {
        padding-left: 80px; } }
    @media (max-width: 375px) {
      .dashboard-page .trophy-list-wrap .trophy-list-ct {
        padding-left: 70px; } }
    @media (max-width: 320px) {
      .dashboard-page .trophy-list-wrap .trophy-list-ct {
        padding-left: 58px; } }
    .dashboard-page .trophy-list-wrap .trophy-list-ct .item-wrapper a {
      display: block;
      text-align: center; }
      @media (max-width: 425px) {
        .dashboard-page .trophy-list-wrap .trophy-list-ct .item-wrapper a {
          width: 78px;
          height: 78px;
          margin-top: 1px; } }
      @media (max-width: 375px) {
        .dashboard-page .trophy-list-wrap .trophy-list-ct .item-wrapper a {
          width: 68px;
          height: 68px; } }
      @media (max-width: 320px) {
        .dashboard-page .trophy-list-wrap .trophy-list-ct .item-wrapper a {
          width: 55px;
          height: 55px; } }
      @media (max-width: 425px) {
        .dashboard-page .trophy-list-wrap .trophy-list-ct .item-wrapper a img {
          width: 100%;
          height: 100%; } }
  @media (max-width: 767px) {
    .dashboard-page .trophy-list-wrap .owl-theme .owl-controls .owl-buttons {
      display: none; } }
  .dashboard-page .trophy-list-wrap .owl-theme .owl-controls .owl-buttons .owl-next {
    position: absolute;
    top: 50%;
    right: -40px;
    margin-top: -12px; }
  .dashboard-page .trophy-list-wrap .owl-theme .owl-controls .owl-buttons .owl-prev {
    position: absolute;
    top: 50%;
    left: -190px;
    margin-top: -12px; }
.dashboard-page .deck-area {
  padding: 30px 0;
  color: #fff; }
  @media (max-width: 767px) {
    .dashboard-page .deck-area {
      padding: 15px 0; } }
  .dashboard-page .deck-area .drill-title {
    color: #fff;
    font-size: 24px;
    text-align: center;
    margin: 0 0 20px; }
    @media (max-width: 767px) {
      .dashboard-page .deck-area .drill-title {
        font-size: 18px;
        margin: 0 0 10px; } }
    .dashboard-page .deck-area .drill-title .img-responsive {
      margin: 0 auto 10px; }
      @media (max-width: 767px) {
        .dashboard-page .deck-area .drill-title .img-responsive {
          width: 24px; } }
  .dashboard-page .deck-area .view-more {
    float: right;
    border-color: #53cbe3;
    margin-top: -60px; }
    @media (max-width: 767px) {
      .dashboard-page .deck-area .view-more {
        width: auto;
        font-size: 10px;
        padding: 6px 10px;
        line-height: 1;
        margin-top: -34px; } }
.dashboard-page .activity-area {
  padding: 60px 0 80px; }
  @media (max-width: 767px) {
    .dashboard-page .activity-area {
      padding: 0; } }
  .dashboard-page .activity-area .title-light-blue-bg,
  .dashboard-page .activity-area .title-green-bg {
    margin-left: 10px;
    margin-right: 10px; }
    @media (max-width: 767px) {
      .dashboard-page .activity-area .title-light-blue-bg,
      .dashboard-page .activity-area .title-green-bg {
        margin: 0 -15px 15px; } }
    .dashboard-page .activity-area .title-light-blue-bg .view-more,
    .dashboard-page .activity-area .title-green-bg .view-more {
      float: right;
      width: auto;
      font-size: 10px;
      padding: 4px 8px;
      margin-top: -1px;
      line-height: 1; }
      @media (max-width: 767px) {
        .dashboard-page .activity-area .title-light-blue-bg .view-more,
        .dashboard-page .activity-area .title-green-bg .view-more {
          margin-top: -3px; } }
  .dashboard-page .activity-area .title-light-blue-bg .view-more {
    border-color: #53cbe3; }
  .dashboard-page .activity-area .title-green-bg .view-more {
    color: #30d696;
    border-color: #30d696; }
@media (max-width: 767px) {
  .dashboard-page .mgb15 {
    margin-bottom: 15px !important; } }
@media (max-width: 767px) {
  .dashboard-page .pdb0 {
    padding-bottom: 0 !important; } }
.dashboard-page .pdt0 {
  padding-top: 0 !important; }
@media (max-width: 767px) {
  .dashboard-page .col-sp {
    width: 80%;
    margin: 0 auto;
    display: block;
    float: none; } }
@media (max-width: 425px) {
  .dashboard-page .col-sp {
    width: 100%; } }
@media (min-width: 768px) {
  .dashboard-page .learning-list {
    margin-top: 20px;
    margin-bottom: 30px; } }
.dashboard-page .learning-content {
  border-radius: 4px;
  border-width: 4px;
  padding: 15px; }
  @media (max-width: 767px) {
    .dashboard-page .learning-content {
      border-left: solid #6ecbe6;
      border-right: solid #6ecbe6; } }

.block-time .p3 {
  padding: 3px; }
.block-time .bg-gray {
  padding: 7px;
  border-radius: 6px;
  background-color: #edeeef;
  margin: 0px 0 10px 0; }
  @media (max-width: 767px) {
    .block-time .bg-gray {
      margin: 0; } }
  @media (min-width: 768px) {
    .block-time .bg-gray {
      margin: 0px 0 10px 0; } }
  .block-time .bg-gray.small {
    font-size: 13px; }

.friend-page.friend-index .page-title {
  position: relative; }
  .friend-page.friend-index .page-title .btn {
    position: absolute;
    top: 42px;
    right: 0; }
    @media (max-width: 767px) {
      .friend-page.friend-index .page-title .btn {
        position: relative;
        font-size: 14px;
        margin: -30px 0 40px; } }
.friend-page.friend-index .content-frame .friend-list {
  max-height: 575px;
  overflow-y: auto; }
  @media (max-width: 767px) {
    .friend-page.friend-index .content-frame .friend-list {
      padding: 0;
      max-height: 600px; } }
@media (max-width: 767px) {
  .friend-page.friend-index .content-frame {
    padding: 15px; } }
.friend-page.friend-index .invite-new-user {
  margin-top: 40px; }
.friend-page.friend-add .number-box {
  background-color: #fff;
  border: 3px solid #9fd9e7;
  color: #3e8093;
  border-radius: 4px;
  font-weight: 700;
  text-transform: none;
  font-size: 18px;
  padding-top: 9px;
  padding-bottom: 10px;
  line-height: 26px;
  max-width: 100%;
  padding: 8px 30px;
  margin: 10px 1px;
  text-align: center; }
  @media (max-width: 767px) {
    .friend-page.friend-add .number-box {
      padding: 8px 0;
      margin: 0; } }
.friend-page.my-number-page .my-number-box {
  width: 380px;
  height: 80px;
  color: #2d3940;
  font-size: 36px;
  background: #f4f4f4;
  border: 2px solid #e2e5e8;
  text-align: center;
  padding: 12px 0;
  letter-spacing: 10px;
  margin: 20px auto 35px; }
  @media (max-width: 767px) {
    .friend-page.my-number-page .my-number-box {
      width: 100%;
      height: 60px;
      font-size: 24px;
      margin: 10px auto 25px; } }
.friend-page.my-number-page .divider {
  margin: 30px 0; }
.friend-page.add-confirm-page .avatar {
  width: 180px; }
  @media (max-width: 767px) {
    .friend-page.add-confirm-page .avatar {
      width: 120px; } }
.friend-page.add-confirm-page .divider {
  margin: 30px 0; }

.list-team .content-frame .errors {
  position: relative;
  display: block;
  clear: both;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  color: red;
  z-index: 10; }
.list-team .content-frame .txtLeft {
  text-align: left !important; }
.list-team .content-frame .friend-list {
  max-height: none;
  overflow-y: hidden; }
  @media (max-width: 767px) {
    .list-team .content-frame .friend-list {
      padding: 0 10px; } }
  .list-team .content-frame .friend-list li {
    position: relative;
    display: block;
    width: 100%;
    height: 115px;
    padding: 18px 40px 18px 8px;
    background: #fff;
    border-bottom: 1px dashed #b7b7b7;
    z-index: 10; }
    .list-team .content-frame .friend-list li:hover {
      background: #e9f1fc; }
    .list-team .content-frame .friend-list li:last-child {
      border-bottom: none; }
    @media (max-width: 767px) {
      .list-team .content-frame .friend-list li {
        height: 60px;
        padding: 10px 10px 5px 0px; } }
    .list-team .content-frame .friend-list li .name, .list-team .content-frame .friend-list li .thumb {
      position: relative;
      z-index: 10; }
    .list-team .content-frame .friend-list li .name {
      padding: 20px 0 0px 50px; }
    .list-team .content-frame .friend-list li .check {
      position: absolute;
      z-index: 10;
      float: right;
      width: 100%;
      top: 0;
      left: 0;
      height: 114px;
      margin: 0; }
      @media (max-width: 767px) {
        .list-team .content-frame .friend-list li .check {
          height: 59px; } }
      .list-team .content-frame .friend-list li .check .icon {
        background: url("/images/icons/check.png") no-repeat right center;
        background-size: 100%;
        display: block;
        float: right;
        position: relative;
        top: 33%;
        right: 4%;
        width: 40px;
        height: 40px; }
        @media (max-width: 767px) {
          .list-team .content-frame .friend-list li .check .icon {
            right: 0;
            width: 25px;
            height: 25px;
            top: 30%; } }
      .list-team .content-frame .friend-list li .check input[type="checkbox"] {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 115px;
        opacity: 0;
        margin: 0;
        cursor: pointer; }
        @media (max-width: 767px) {
          .list-team .content-frame .friend-list li .check input[type="checkbox"] {
            height: 59px; } }
    .list-team .content-frame .friend-list li .checked .icon {
      background: url("/images/icons/check-hover.png") no-repeat right center;
      background-size: 100%; }
    .list-team .content-frame .friend-list li .disabled .icon {
      background: url("/images/icons/check-disabled.png") no-repeat right center;
      background-size: 100%; }
.list-team .content-frame .update {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 10; }
  .list-team .content-frame .update a {
    display: block;
    border-left: 1px solid #CC284B;
    border-bottom: 1px solid #CC284B;
    color: #fff;
    background: #E23258;
    font-size: 20px;
    padding: 20px; }
    .list-team .content-frame .update a:hover {
      background: #CA284B;
      text-decoration: none; }

.inquiry-page textarea {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #555555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; }
.inquiry-page .current-value {
  display: block;
  border-bottom: 1px solid #c6ccd2;
  margin-bottom: 5px; }
.inquiry-page .divider {
  margin: 30px 0; }

.ranking-page .bg-triangle-yellow-light {
  padding: 60px 0 80px; }
  @media (max-width: 767px) {
    .ranking-page .bg-triangle-yellow-light {
      padding: 30px 0 40px; } }
@media (max-width: 767px) {
  .ranking-page .content-frame {
    padding: 0;
    border: none; } }
.ranking-page .ranking-list {
  margin-bottom: 20px; }
  @media (max-width: 767px) {
    .ranking-page .ranking-list {
      padding: 0 15px;
      margin: 0; } }
  .ranking-page .ranking-list .box-score {
    position: absolute;
    top: 20px;
    right: 0;
    font-size: 25px;
    color: #FFF;
    background-color: #6ECBE6;
    padding: 20px; }
    .ranking-page .ranking-list .box-score .txt {
      font-size: 12px;
      margin-bottom: 5px; }
    .ranking-page .ranking-list .box-score .score {
      font-size: 22px;
      margin-bottom: 0;
      line-height: 1;
      color: #FFF; }
      .ranking-page .ranking-list .box-score .score .arow {
        font-size: 16px; }

.breacrumb {
  padding: 25px 5px 10px; }
  @media (max-width: 991px) {
    .breacrumb {
      padding: 8px 5px; } }
  .breacrumb ul {
    margin-bottom: 0; }
    .breacrumb ul li {
      padding: 0; }
      .breacrumb ul li:after {
        content: '>';
        font-size: 20px;
        margin-left: 7px;
        color: #2d3940; }
      .breacrumb ul li a {
        color: #5aa4b9; }
      .breacrumb ul li:last-child:after {
        content: none; }
      .breacrumb ul li:last-child a {
        color: #2d3940; }

.coin-page .content-frame {
  display: block;
  overflow: hidden;
  padding-bottom: 40px; }
  .coin-page .content-frame .head {
    height: 120px;
    padding: 35px; }
    .coin-page .content-frame .head .title {
      font-size: 24px;
      font-weight: bold; }
      .coin-page .content-frame .head .title .name {
        font-size: 28px; }
  @media (max-width: 767px) {
    .coin-page .content-frame {
      padding-left: 0;
      padding-right: 0; }
      .coin-page .content-frame .head {
        height: auto;
        padding: 24px 24px 45px;
        margin: -25px 0 0; }
        .coin-page .content-frame .head .title {
          font-size: 16px; }
          .coin-page .content-frame .head .title .name {
            font-size: 22px; } }
.coin-page .current-coin {
  width: 410px;
  height: 66px;
  color: #00bf9d;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  line-height: 1;
  background: #fff;
  padding: 5px 0;
  border: 5px solid #82d9ed;
  border-radius: 33px;
  margin: -83px auto 40px; }
  .coin-page .current-coin .num {
    font-size: 48px; }
  .coin-page .current-coin img {
    vertical-align: top;
    width: 44px;
    margin: 2px 5px 0 0; }
  @media (max-width: 767px) {
    .coin-page .current-coin {
      width: 100%;
      height: 60px;
      font-size: 16px;
      padding: 9px 0;
      margin: -30px 0 10px; }
      .coin-page .current-coin .num {
        font-size: 32px; }
      .coin-page .current-coin img {
        width: 32px;
        margin-top: -2px; } }
.coin-page .tab {
  margin-bottom: 30px; }
  @media (max-width: 767px) {
    .coin-page .tab {
      margin-bottom: 15px;
      padding: 0 10px; } }
.coin-page .coin-list li {
  display: table;
  width: 100%;
  min-height: 115px;
  border-bottom: 1px dashed #b7b7b7; }
.coin-page .coin-list .thumb,
.coin-page .coin-list .description {
  display: table-cell;
  vertical-align: middle; }
.coin-page .coin-list .thumb {
  width: 125px;
  padding: 15px 0;
  text-align: center; }
  .coin-page .coin-list .thumb .avatar {
    width: 90px;
    margin: 0 auto; }
  .coin-page .coin-list .thumb .coin {
    width: 60px; }
.coin-page .coin-list .description {
  padding-left: 15px;
  position: relative; }
.coin-page .coin-list .person {
  color: #878e9a;
  font-size: 20px;
  margin: 10px 0 5px;
  padding: 0 180px 0 0; }
.coin-page .coin-list .coin-get,
.coin-page .coin-list .coin-spend {
  color: #2d3940;
  font-size: 20px;
  margin: 0 0 5px;
  padding: 0 180px 0 0; }
  @media (max-width: 767px) {
    .coin-page .coin-list .coin-get,
    .coin-page .coin-list .coin-spend {
      padding: 0px 150px 0 0;
      font-size: 16px; } }
  @media (max-width: 360px) {
    .coin-page .coin-list .coin-get,
    .coin-page .coin-list .coin-spend {
      padding: 0px 85px 0 0;
      font-size: 14px; } }
.coin-page .coin-list .deck-name {
  color: #2d3940;
  font-size: 14px;
  margin: 0 0 5px;
  padding: 0 180px 0 0; }
  @media (max-width: 767px) {
    .coin-page .coin-list .deck-name {
      padding: 0px 150px 0 0;
      font-size: 12px; } }
  @media (max-width: 360px) {
    .coin-page .coin-list .deck-name {
      padding: 0px 85px 0 0;
      font-size: 8px; } }
.coin-page .coin-list .time {
  position: absolute;
  top: 40%;
  right: 20px;
  color: #878e9a;
  font-size: 14px; }
  @media (max-width: 767px) {
    .coin-page .coin-list .time {
      font-size: 12px;
      right: 10px; } }
  @media (max-width: 360px) {
    .coin-page .coin-list .time {
      width: 30%;
      right: 0; } }
@media (max-width: 767px) {
  .coin-page .coin-list li {
    height: 85px; }
  .coin-page .coin-list .thumb {
    width: 65px; }
    .coin-page .coin-list .thumb .avatar {
      width: 50px; }
    .coin-page .coin-list .thumb .coin-image {
      width: 80%;
      margin: 0 auto; }
  .coin-page .coin-list .description {
    padding-left: 5px; }
  .coin-page .coin-list .person {
    font-size: 12px;
    margin: 0; }
  .coin-page .coin-list .deck-name {
    margin: 0 0 2px; }
  .coin-page .coin-list .time {
    font-size: 10px; } }
@media (max-width: 767px) {
  .coin-page .tab-content {
    padding: 0 10px; } }
.coin-page .coin-area {
  display: block;
  overflow: hidden;
  margin-top: -10px; }
  @media (max-width: 767px) {
    .coin-page .coin-area {
      padding-top: 20px; } }
  .coin-page .coin-area h4 {
    display: block;
    clear: both;
    font-weight: bold;
    font-size: 18px;
    line-height: 24px;
    margin: 0 0 20px;
    color: #2d3940; }
    @media (max-width: 767px) {
      .coin-page .coin-area h4 {
        font-size: 14px;
        margin: 0 0 15px; } }
  .coin-page .coin-area p {
    display: block;
    clear: both;
    word-wrap: break-word;
    overflow: hidden;
    margin-bottom: 5px;
    color: #2d3940; }
    .coin-page .coin-area p .link {
      text-decoration: underline; }
      .coin-page .coin-area p .link:hover {
        text-decoration: none; }
    @media (max-width: 767px) {
      .coin-page .coin-area p {
        font-size: 12px; } }
  .coin-page .coin-area .exchange-rate {
    display: block;
    overflow: hidden;
    padding: 20px 0;
    background-color: #f4f4f4;
    margin: 25px auto 30px;
    border: 2px solid #e2e5e8; }
    @media (max-width: 767px) {
      .coin-page .coin-area .exchange-rate {
        margin: 20px auto 25px; } }
    .coin-page .coin-area .exchange-rate .exchange-box {
      display: block;
      position: relative;
      width: 94%;
      margin: 0 auto;
      background-color: #fff;
      border-radius: 5px;
      border: 2px solid;
      padding: 10px 5px 10px 45px; }
      .coin-page .coin-area .exchange-rate .exchange-box .num {
        font-weight: bold;
        font-size: 36px;
        font-family: arial; }
        @media (max-width: 991px) {
          .coin-page .coin-area .exchange-rate .exchange-box .num {
            font-size: 26px; } }
        @media (max-width: 620px) {
          .coin-page .coin-area .exchange-rate .exchange-box .num {
            font-size: 24px; } }
        @media (max-width: 580px) {
          .coin-page .coin-area .exchange-rate .exchange-box .num {
            font-size: 22px; } }
      .coin-page .coin-area .exchange-rate .exchange-box .txt {
        font-size: 20px; }
        @media (max-width: 991px) {
          .coin-page .coin-area .exchange-rate .exchange-box .txt {
            font-size: 12px; } }
        @media (max-width: 620px) {
          .coin-page .coin-area .exchange-rate .exchange-box .txt {
            font-size: 10px; } }
        @media (max-width: 460px) {
          .coin-page .coin-area .exchange-rate .exchange-box .txt {
            display: block; } }
    .coin-page .coin-area .exchange-rate .color1 .exchange-box {
      border-color: #00bf9d; }
      @media (max-width: 580px) {
        .coin-page .coin-area .exchange-rate .color1 .exchange-box {
          padding-left: 42px; } }
      @media (max-width: 480px) {
        .coin-page .coin-area .exchange-rate .color1 .exchange-box {
          padding-left: 5px; } }
    .coin-page .coin-area .exchange-rate .color1 .num, .coin-page .coin-area .exchange-rate .color1 .txt, .coin-page .coin-area .exchange-rate .color1 p {
      color: #00bf9d; }
    .coin-page .coin-area .exchange-rate .color1 img {
      width: 46px;
      position: absolute;
      top: 13px;
      left: 15px; }
      @media (max-width: 991px) {
        .coin-page .coin-area .exchange-rate .color1 img {
          width: 40px;
          top: 10px; } }
      @media (max-width: 620px) {
        .coin-page .coin-area .exchange-rate .color1 img {
          top: 8px; } }
      @media (max-width: 580px) {
        .coin-page .coin-area .exchange-rate .color1 img {
          left: 5px;
          width: 36px; } }
      @media (max-width: 480px) {
        .coin-page .coin-area .exchange-rate .color1 img {
          position: relative;
          top: 0;
          left: 0;
          display: block;
          margin: 0 auto; } }
    .coin-page .coin-area .exchange-rate .color2 .exchange-box {
      border-color: #0d70d0;
      padding: 10px 5px 10px 125px; }
      @media (max-width: 991px) {
        .coin-page .coin-area .exchange-rate .color2 .exchange-box {
          padding-left: 97px; } }
      @media (max-width: 580px) {
        .coin-page .coin-area .exchange-rate .color2 .exchange-box {
          padding-left: 80px; } }
      @media (max-width: 480px) {
        .coin-page .coin-area .exchange-rate .color2 .exchange-box {
          padding-left: 5px;
          padding-top: 15px; } }
    .coin-page .coin-area .exchange-rate .color2 .num, .coin-page .coin-area .exchange-rate .color2 .txt, .coin-page .coin-area .exchange-rate .color2 p {
      color: #0d70d0; }
    .coin-page .coin-area .exchange-rate .color2 img {
      position: absolute;
      top: 19px;
      left: 15px; }
      @media (max-width: 991px) {
        .coin-page .coin-area .exchange-rate .color2 img {
          width: 90px;
          top: 16px; } }
      @media (max-width: 580px) {
        .coin-page .coin-area .exchange-rate .color2 img {
          width: 73px;
          left: 5px; } }
      @media (max-width: 480px) {
        .coin-page .coin-area .exchange-rate .color2 img {
          position: relative;
          width: auto;
          top: 0;
          left: 0;
          display: block;
          margin: 0 auto; } }
    .coin-page .coin-area .exchange-rate .icon-convert {
      position: absolute;
      background: url("/images/icons/convert.png") no-repeat;
      width: 19px;
      height: 22px;
      top: 50%;
      right: -10px; }
    .coin-page .coin-area .exchange-rate .exchange-form .form-label {
      float: left;
      width: 22%;
      text-align: left;
      font-size: 18px;
      margin-top: 7px;
      color: #2d3940; }
      @media (max-width: 991px) {
        .coin-page .coin-area .exchange-rate .exchange-form .form-label {
          width: 32%; } }
      @media (max-width: 580px) {
        .coin-page .coin-area .exchange-rate .exchange-form .form-label {
          width: 35%;
          font-size: 12px;
          margin-top: 10px; } }
    .coin-page .coin-area .exchange-rate .exchange-form .form-group {
      float: left;
      width: 78%;
      margin: 0; }
      @media (max-width: 991px) {
        .coin-page .coin-area .exchange-rate .exchange-form .form-group {
          width: 68%; } }
      @media (max-width: 580px) {
        .coin-page .coin-area .exchange-rate .exchange-form .form-group {
          width: 65%; }
          .coin-page .coin-area .exchange-rate .exchange-form .form-group input {
            font-size: 12px; } }
  .coin-page .coin-area .select-option {
    display: block;
    width: 100%;
    overflow: hidden;
    margin-bottom: 0; }
    .coin-page .coin-area .select-option .exchange-form {
      display: block;
      float: left;
      width: 100%; }
      @media (max-width: 767px) {
        .coin-page .coin-area .select-option .exchange-form {
          padding: 0; } }
      .coin-page .coin-area .select-option .exchange-form .form-label {
        float: left;
        width: 22%;
        text-align: left;
        font-size: 18px;
        margin-top: 7px;
        color: #2d3940; }
        @media (max-width: 991px) {
          .coin-page .coin-area .select-option .exchange-form .form-label {
            width: 30%; } }
      .coin-page .coin-area .select-option .exchange-form .form-group {
        position: relative;
        float: left;
        width: 78%;
        margin: 0; }
        @media (max-width: 991px) {
          .coin-page .coin-area .select-option .exchange-form .form-group {
            width: 70%; } }
        @media (max-width: 767px) {
          .coin-page .coin-area .select-option .exchange-form .form-group {
            width: 100%;
            padding-bottom: 0; } }
        .coin-page .coin-area .select-option .exchange-form .form-group select {
          cursor: pointer;
          font-size: 20px;
          padding: 0 0 12px;
          min-height: 50px;
          color: #000;
          ouline: none; }
          @media (max-width: 640px) {
            .coin-page .coin-area .select-option .exchange-form .form-group select {
              font-size: 14px;
              padding: 0 12px 0 0;
              min-height: 40px;
              margin-bottom: 0; } }
        .coin-page .coin-area .select-option .exchange-form .form-group:after {
          position: absolute;
          top: 4px;
          right: 5px;
          content: " ";
          display: table;
          width: 14px;
          height: 30px;
          background: url("/images/icons/select.png") no-repeat center center; }
          @media (max-width: 640px) {
            .coin-page .coin-area .select-option .exchange-form .form-group:after {
              width: 8px;
              right: 0;
              background-size: 100%; } }
      @media (max-width: 767px) {
        .coin-page .coin-area .select-option .exchange-form .hidden-xs {
          display: none; } }
  .coin-page .coin-area .pdLR40 {
    padding-left: 40px;
    padding-right: 40px; }
    @media (max-width: 991px) {
      .coin-page .coin-area .pdLR40 {
        padding-left: 20px;
        padding-right: 20px; } }
  .coin-page .coin-area .mgLR40 {
    margin-left: -40px;
    margin-right: -40px; }
    @media (max-width: 991px) {
      .coin-page .coin-area .mgLR40 {
        margin-left: -20px;
        margin-right: -20px; } }
@media (max-width: 480px) {
  .coin-page .btn-sp {
    width: 100%;
    margin: 0; } }
.coin-page hr {
  border-top: 1px dashed #000;
  margin: 25px 0;
  float: left;
  width: 100%; }
  @media (max-width: 767px) {
    .coin-page hr {
      margin: 20px 0; } }
.coin-page .padTop30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important; }
@media (max-width: 767px) {
  .coin-page .padTop22 {
    padding-top: 22px !important; } }

.rabbi-page .content-frame {
  padding: 94px 94px 50px; }
  @media (max-width: 1199px) {
    .rabbi-page .content-frame {
      padding: 50px; } }
  @media (max-width: 767px) {
    .rabbi-page .content-frame {
      padding: 25px 0px 15px; } }
.rabbi-page .tab {
  margin-bottom: 15px; }
.rabbi-page .coin-list li {
  min-height: 90px; }
  .rabbi-page .coin-list li.rabbi-icon .description {
    padding: 10px 20px 10px 95px;
    background: url(/images/icons/rabbi-point.png) no-repeat 20px center; }
    @media (max-width: 767px) {
      .rabbi-page .coin-list li.rabbi-icon .description {
        background-size: 40px;
        background-position: 10px center;
        padding: 10px 20px 10px 70px; } }
    @media (max-width: 500px) {
      .rabbi-page .coin-list li.rabbi-icon .description {
        background-size: 32px;
        background-position: 5px center;
        padding: 10px 20px 10px 48px; } }
  .rabbi-page .coin-list li:last-child {
    border-bottom: 0; }
  @media (max-width: 767px) {
    .rabbi-page .coin-list li {
      min-height: 80px; } }
  @media (max-width: 500px) {
    .rabbi-page .coin-list li {
      min-height: auto; } }
  .rabbi-page .coin-list li .description .person {
    color: #2d3940;
    font-size: 20px;
    margin-top: 0px;
    margin-bottom: 0; }
    @media (max-width: 767px) {
      .rabbi-page .coin-list li .description .person {
        font-size: 16px;
        padding-right: 125px; } }
    @media (max-width: 500px) {
      .rabbi-page .coin-list li .description .person {
        font-size: 14px;
        padding-right: 100px; } }
    @media (max-width: 360px) {
      .rabbi-page .coin-list li .description .person {
        padding-right: 80px; } }
  .rabbi-page .coin-list li .description .how-much {
    margin: 0;
    color: #878e9a; }
    @media (max-width: 767px) {
      .rabbi-page .coin-list li .description .how-much {
        font-size: 12px;
        padding-right: 125px; } }
    @media (max-width: 500px) {
      .rabbi-page .coin-list li .description .how-much {
        font-size: 8px;
        padding-right: 100px; } }
    @media (max-width: 360px) {
      .rabbi-page .coin-list li .description .how-much {
        padding-right: 50px; } }
  .rabbi-page .coin-list li .description .time {
    font-weight: normal; }
    @media (max-width: 767px) {
      .rabbi-page .coin-list li .description .time {
        font-size: 12px;
        right: 10px; } }
    @media (max-width: 500px) {
      .rabbi-page .coin-list li .description .time {
        font-size: 10px;
        right: 5px;
        top: 44%; } }
    @media (max-width: 360px) {
      .rabbi-page .coin-list li .description .time {
        width: 30%;
        top: 28px; } }
.rabbi-page .custom {
  margin: 20px 0 30px;
  font-weight: normal; }
  @media (max-width: 767px) {
    .rabbi-page .custom {
      margin: 10px 0 20px; } }
.rabbi-page .review li .text-wait {
  color: #3d79cf !important; }
.rabbi-page .review li .text-error {
  color: #00bf9d !important; }
.rabbi-page .review li .text-done {
  color: #db5941 !important; }
.rabbi-page .review li .text-reject {
  color: #7f7f7f !important; }
.rabbi-page .rabbi-icon .text-blue {
  color: #729bf3 !important; }
.rabbi-page .rabbi-icon .text-red {
  color: #db5940 !important; }
.rabbi-page .rabbi-icon .text-green {
  color: #00bf9d !important; }

.result-exchange .title-text {
  font-size: 28px;
  color: #2d3940; }
  @media (max-width: 767px) {
    .result-exchange .title-text {
      margin: 0;
      font-size: 22px; } }
.result-exchange .list-text {
  display: block;
  margin-bottom: 0;
  padding: 20px 70px 0; }
  @media (max-width: 991px) {
    .result-exchange .list-text {
      padding: 20px 20px 0; } }
  @media (max-width: 767px) {
    .result-exchange .list-text {
      padding: 20px 10px 0; } }
  .result-exchange .list-text li {
    font-size: 14px;
    color: #2d3940;
    margin-bottom: 5px; }

.coin-pasword-container .form-horizontal {
  margin-bottom: 20px; }
.coin-pasword-container .description {
  margin-top: 15px; }

.line-height-26 {
  line-height: 26px; }

.marBottom20 {
  margin-bottom: 20px !important; }

.mgb10 {
  margin: 0 0 20px !important; }

.mg0 {
  margin: 0 !important; }

.mgb5 {
  margin-bottom: 5px !important; }
  @media (max-width: 767px) {
    .mgb5 {
      margin: 0 !important; } }

.mgt20 {
  margin-top: 20px !important; }

@media (max-width: 767px) {
  .h70 {
    height: 70px !important; } }

#select_pack::-ms-expand {
  display: none; }

.pay-service-page.pay-service-index .carrier-register-error {
  background: red;
  margin: -25px -20px 30px;
  padding: 10px;
  text-align: center;
  color: #fff; }
.pay-service-page.pay-service-index .contract-status {
  text-align: center;
  font-weight: bold; }
  .pay-service-page.pay-service-index .contract-status .student {
    color: #2d3940;
    font-size: 18px;
    margin: 0; }
  .pay-service-page.pay-service-index .contract-status .student-name {
    color: #3e8093;
    font-size: 28px; }
  .pay-service-page.pay-service-index .contract-status .status {
    color: #2d3940;
    font-size: 18px; }
    .pay-service-page.pay-service-index .contract-status .status .status-name {
      color: #3e8093; }
  .pay-service-page.pay-service-index .contract-status .exp {
    text-align: center;
    font-weight: normal; }
.pay-service-page.pay-service-index .divider {
  margin: 30px 0; }
.pay-service-page.pay-service-index .explanation-area {
  margin-bottom: 40px;
  margin-top: 20px; }
  @media (max-width: 767px) {
    .pay-service-page.pay-service-index .explanation-area {
      margin-bottom: 20px; } }
  .pay-service-page.pay-service-index .explanation-area .bold {
    margin-bottom: 20px; }
  .pay-service-page.pay-service-index .explanation-area .cancel {
    margin-top: 50px; }
    @media (max-width: 767px) {
      .pay-service-page.pay-service-index .explanation-area .cancel {
        margin-top: 20px; } }
  .pay-service-page.pay-service-index .explanation-area .explanation-text {
    padding: 20px 0 0 20px; }
    @media (max-width: 767px) {
      .pay-service-page.pay-service-index .explanation-area .explanation-text {
        padding: 20px 0 0 10px; } }
.pay-service-page.pay-service-purchase .price {
  color: #2d3940;
  font-size: 18px;
  text-align: center;
  padding: 6px 0;
  background: #f4f4f4;
  border: 2px solid #e2e5e8;
  margin: 0 0 30px; }
.pay-service-page.pay-service-purchase label.control-label {
  padding-left: 0;
  font-size: 16px; }

@media (min-width: 991px) {
  .pay-service-about .content-frame {
    padding-bottom: 120px;
    padding-top: 55px; } }
@media (max-width: 767px) {
  .pay-service-about .content-frame {
    padding-bottom: 40px;
    padding-top: 20px; } }
.pay-service-about .bg-shining-yellow {
  height: 280px; }
  @media (max-width: 767px) {
    .pay-service-about .bg-shining-yellow {
      height: 242px; } }
  .pay-service-about .bg-shining-yellow .h2 {
    font-size: 26px;
    margin: 10px;
    line-height: 1.8; }
    @media (max-width: 767px) {
      .pay-service-about .bg-shining-yellow .h2 {
        font-size: 17px;
        margin: 10px;
        line-height: 1.6; } }
@media (max-width: 767px) {
  .pay-service-about .title {
    text-align: center; } }
@media (max-width: 991px) {
  .pay-service-about .rabi {
    left: -13px !important; } }
@media (max-width: 767px) {
  .pay-service-about .rabi {
    width: 77px !important;
    height: 78px !important;
    bottom: 12px !important;
    left: -23px !important; } }
@media (max-width: 767px) {
  .pay-service-about .balloon {
    padding-top: 25px !important; } }
.pay-service-about .urchin {
  position: absolute;
  background: url("../images/icons/ic-urchin-top.png") no-repeat;
  width: 119px;
  height: 112px;
  bottom: 84px;
  right: 20px; }
  @media (max-width: 991px) {
    .pay-service-about .urchin {
      bottom: 34px;
      right: -43px; } }
  @media (max-width: 767px) {
    .pay-service-about .urchin {
      bottom: 12px;
      right: -19px;
      height: 44px;
      width: 60px;
      background-size: 95%; } }
@media (max-width: 991px) {
  .pay-service-about .link {
    margin-bottom: 40px; } }
.pay-service-about .h2 {
  color: #fff;
  line-height: 2;
  margin: 30px; }
  @media (max-width: 991px) {
    .pay-service-about .h2 {
      line-height: 1.6;
      margin: 16px; } }
  @media (max-width: 767px) {
    .pay-service-about .h2 {
      font-size: 20px;
      margin: 15px;
      line-height: 1.5; } }
.pay-service-about .child.content-frame {
  padding: 40px;
  margin: 20px 0px; }
  .pay-service-about .child.content-frame .item {
    line-height: 1.8;
    margin-bottom: 10px; }
  @media (max-width: 767px) {
    .pay-service-about .child.content-frame {
      padding: 20px 10px; } }
.pay-service-about .child-content {
  margin-left: 60px;
  position: relative; }
  .pay-service-about .child-content:before {
    position: absolute;
    left: -37px;
    content: "";
    background: url("../images/icons/ic-urchin-left.png") no-repeat;
    width: 91px;
    height: 82px;
    z-index: 111;
    bottom: 0px; }
  @media (max-width: 991px) {
    .pay-service-about .child-content {
      margin-left: 0px; } }
.pay-service-about .child-item {
  height: auto; }
  .pay-service-about .child-item img {
    width: 100%;
    background: #ababab;
    object-fit: cover;
    object-position: center; }
    @media (max-width: 767px) {
      .pay-service-about .child-item img {
        width: 95%; } }
  @media (max-width: 991px) {
    .pay-service-about .child-item {
      margin-bottom: 7px; } }
.pay-service-about .btn-center {
  position: absolute;
  left: 0;
  right: 0;
  top: 20px;
  margin: auto; }
@media (max-width: 991px) {
  .pay-service-about .abt-list {
    padding-left: 10px; } }
.pay-service-about .about-payment {
  margin-top: 60px; }
  .pay-service-about .about-payment .small-head {
    font-weight: bold;
    margin: 20px 0 8px; }
  .pay-service-about .about-payment li {
    margin-bottom: 5px; }
    .pay-service-about .about-payment li .summary {
      margin-bottom: 5px; }
    .pay-service-about .about-payment li .detail {
      font-size: 12px;
      margin-bottom: 15px; }

.faq-page .mg-bottom-50 {
  margin-bottom: 50px; }
.faq-page .mg-50 {
  margin-top: 50px;
  margin-bottom: 50px; }
.faq-page .list-qa {
  margin-top: 25px; }
  .faq-page .list-qa li {
    margin-top: 20px;
    margin-bottom: 20px; }
.faq-page .list-ol li {
  margin-top: 10px;
  margin-bottom: 5px; }
.faq-page .bg-square {
  line-height: 50px;
  text-align: center; }
  .faq-page .bg-square .character {
    font-size: 1.8em; }
.faq-page .bg-q {
  width: 50px;
  height: 50px;
  background-color: #6ecbe6;
  color: #fff; }
.faq-page .bg-a {
  width: 50px;
  height: 50px;
  background-color: #fffd3c;
  color: #3e8093; }
.faq-page .list-children {
  padding-left: 25px; }

.htu-frame {
  background: #feffd5 url("../images/background/bg-shining.jpg") no-repeat left top; }
  .htu-frame .rabi-balloon-wrapper {
    height: 415px; }
    @media (max-width: 768px) {
      .htu-frame .rabi-balloon-wrapper {
        height: 385px; } }
    @media (max-width: 991px) {
      .htu-frame .rabi-balloon-wrapper {
        height: 340px; } }
    @media (min-width: 481px) and (max-width: 767px) {
      .htu-frame .rabi-balloon-wrapper {
        height: 272px; } }
    .htu-frame .rabi-balloon-wrapper .title {
      font-size: 30px; }
      @media (max-width: 991px) {
        .htu-frame .rabi-balloon-wrapper .title {
          font-size: 24px; } }
      @media (max-width: 767px) {
        .htu-frame .rabi-balloon-wrapper .title {
          min-height: 52px; } }
    .htu-frame .rabi-balloon-wrapper .rabi-balloon .rabi {
      left: 0px;
      top: 133px;
      width: 155px;
      left: 50px; }
      @media (max-width: 991px) {
        .htu-frame .rabi-balloon-wrapper .rabi-balloon .rabi {
          top: 115px;
          width: 91px; } }
      @media (max-width: 767px) {
        .htu-frame .rabi-balloon-wrapper .rabi-balloon .rabi {
          width: 58px;
          top: 34%;
          left: 10px; } }
    @media (max-width: 991px) {
      .htu-frame .rabi-balloon-wrapper .rabi-balloon p {
        line-height: 1.2;
        font-size: 14px; } }
    .htu-frame .rabi-balloon-wrapper .rabi-balloon .balloon {
      margin-top: 0px;
      padding-top: 70px;
      width: 713px; }
      .htu-frame .rabi-balloon-wrapper .rabi-balloon .balloon ul {
        margin-left: 17%;
        margin-bottom: 15px; }
        @media (max-width: 767px) {
          .htu-frame .rabi-balloon-wrapper .rabi-balloon .balloon ul {
            margin-left: 60px; } }
      @media (max-width: 991px) {
        .htu-frame .rabi-balloon-wrapper .rabi-balloon .balloon {
          background-color: rgba(255, 255, 255, 0.8);
          background-image: none;
          height: 380px; } }
      @media (max-width: 991px) {
        .htu-frame .rabi-balloon-wrapper .rabi-balloon .balloon {
          width: 608px;
          margin-right: 0px; } }
      @media (max-width: 767px) {
        .htu-frame .rabi-balloon-wrapper .rabi-balloon .balloon {
          width: inherit;
          padding-top: 44px;
          height: 80%; } }
      @media (min-width: 481px) and (max-width: 767px) {
        .htu-frame .rabi-balloon-wrapper .rabi-balloon .balloon {
          width: inherit;
          height: 268px; } }
  .htu-frame .htu-items {
    margin-top: 20px; }
    .htu-frame .htu-items .htu-item {
      margin-bottom: 10px; }
      .htu-frame .htu-items .htu-item img {
        background-color: #ababab;
        width: 100%;
        height: auto;
        object-fit: cover;
        margin: auto;
        object-position: center; }
        @media (max-width: 767px) {
          .htu-frame .htu-items .htu-item img {
            width: 68%; } }
  .htu-frame .line-height-72 {
    line-height: 72px; }
  .htu-frame .h2 {
    line-height: 1.5em; }
  .htu-frame .h4 {
    line-height: 1.4em; }

.rule-page .chapter {
  font-size: 26px;
  line-height: 1.6;
  margin: 0 0 25px; }
.rule-page .sec {
  margin-bottom: 60px; }
.rule-page .description {
  line-height: 1.8; }
.rule-page .sec-title {
  font-size: 24px;
  line-height: 1.4;
  margin: 0 0 20px; }
.rule-page .list-parent {
  margin-top: 20px;
  padding-left: 20px; }
  .rule-page .list-parent li {
    line-height: 1.8;
    margin-bottom: 10px; }
.rule-page .list-children {
  list-style-type: lower-alpha;
  margin-top: 10px;
  padding-left: 20px; }
  .rule-page .list-children.decimal {
    list-style-type: decimal; }
  .rule-page .list-children li {
    line-height: 1.6;
    margin-bottom: 5px; }
  .rule-page .list-children .list-children {
    margin-top: 5px; }

.td-left, .ot7-page .td-left, .attention-page .td-left {
  width: 40%;
  background-color: #ababab;
  color: #fff; }

.td-right, .ot7-page .td-right, .attention-page .td-right {
  width: 60%;
  background-color: #fff; }

.ot-frame {
  padding: 0px;
  position: relative;
  margin-bottom: 100px; }

.ie11 .modal-questions .radio input[type=radio], .ie11 .modal-questions .checkbox input[type=checkbox], .ie10 .modal-questions .radio input[type=radio], .ie10 .modal-questions .checkbox input[type=checkbox], .ie9 .modal-questions .radio input[type=radio], .ie9 .modal-questions .checkbox input[type=checkbox] {
  width: auto;
  height: auto;
  top: -1px;
  opacity: 1;
  filter: alpha(opacity=100); }
.ie11 .modal-questions .checkbox input[type=checkbox], .ie10 .modal-questions .checkbox input[type=checkbox], .ie9 .modal-questions .checkbox input[type=checkbox] {
  z-index: 1;
  top: 2px; }

.page-title {
  position: relative; }
  .page-title .btn-green.btn-add {
    position: absolute;
    right: 5px;
    top: 40px;
    padding-left: 57px; }
    .page-title .btn-green.btn-add .txt-add {
      position: relative; }
      .page-title .btn-green.btn-add .txt-add:before {
        position: absolute;
        left: -37px;
        content: '';
        background: url("../images/icons/ic_add_ms.png") no-repeat;
        width: 31px;
        height: 20px; }
    @media (max-width: 767px) {
      .page-title .btn-green.btn-add {
        width: 10%;
        right: 5px;
        top: 21px;
        height: 38px;
        padding-left: 24px; }
        .page-title .btn-green.btn-add .txt-add:before {
          left: 7px; }
        .page-title .btn-green.btn-add .txt-add span {
          display: none; } }

@media (max-width: 767px) {
  .icon-add:before {
    position: absolute;
    right: 8px;
    top: 9px;
    content: '';
    background: url("../images/icons/ic_add_ms.png") no-repeat;
    width: 31px;
    height: 20px; } }

@media (max-width: 767px) {
  .relation.message-frame {
    padding: 15px 20px; } }
@media (max-width: 767px) {
  .relation.message-frame .tab {
    margin-top: 8px;
    margin-bottom: 0; } }

.message-frame {
  padding-bottom: 60px;
  padding-top: 60px; }
  @media (max-width: 767px) {
    .message-frame {
      padding: 15px 0;
      border: none;
      background: #fff;
      margin: -10px -15px; } }
  .message-frame .tab {
    border-bottom: 4px solid #6ecbe6;
    margin-bottom: 20px; }
    @media (max-width: 767px) {
      .message-frame .tab {
        padding: 0 5px; } }
    .message-frame .tab a {
      position: relative; }
    .message-frame .tab .badge {
      font-size: 10px;
      color: #E23258;
      font-weight: bold;
      background: #fff;
      padding: 3px 4px;
      border: 1px solid #6ECBE6;
      border-radius: 50%;
      position: relative;
      top: -2px;
      right: 0px; }
      @media (max-width: 767px) {
        .message-frame .tab .badge {
          position: absolute;
          top: -9px;
          right: -1px; } }
  .message-frame .seen {
    background-color: #e2f5fa; }
  .message-frame .item {
    border: none; }
    .message-frame .item a {
      color: transparent; }
    .message-frame .item a.btn.btn-green {
      color: #fff; }
  .message-frame .item-content {
    display: table;
    width: 100%;
    padding: 15px 30px;
    border-bottom: 1px dashed #ababab; }
    @media (max-width: 767px) {
      .message-frame .item-content {
        padding: 15px 10px; } }
    .message-frame .item-content .left {
      display: table-cell;
      vertical-align: middle;
      width: 1%; }
      .message-frame .item-content .left img {
        max-width: 75px; }
        @media (max-width: 767px) {
          .message-frame .item-content .left img {
            max-width: 60px; } }
    .message-frame .item-content .center {
      display: table-cell;
      vertical-align: middle;
      text-align: left;
      padding-left: 30px; }
      @media (max-width: 767px) {
        .message-frame .item-content .center {
          padding-left: 15px; } }
      .message-frame .item-content .center .name {
        font-size: 14px;
        color: #878e9a; }
        @media (max-width: 767px) {
          .message-frame .item-content .center .name {
            font-size: 12px; } }
      .message-frame .item-content .center .message {
        font-size: 24px;
        font-weight: 700;
        color: #38454f;
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-all;
        height: 28px;
        white-space: nowrap;
        line-height: 1.2;
        max-width: 621px;
        display: block; }
        @media (max-width: 991px) {
          .message-frame .item-content .center .message {
            max-width: 427px;
            font-size: 17px;
            height: 19px; } }
        @media (max-width: 767px) {
          .message-frame .item-content .center .message {
            font-size: 16px;
            max-width: 203px;
            height: 18px; } }
        .message-frame .item-content .center .message:hover {
          color: #000;
          text-decoration: none; }
      .message-frame .item-content .center .time {
        font-size: 14px;
        color: #878e9a; }
        @media (max-width: 767px) {
          .message-frame .item-content .center .time {
            font-size: 12px; } }
    .message-frame .item-content .right {
      display: table-cell;
      vertical-align: middle;
      text-align: right;
      font-size: 25px;
      color: #000; }
  @media (max-width: 767px) {
    .message-frame .friend a, .message-frame .family a, .message-frame .schooltv a {
      line-height: 1;
      padding: 12px 0; } }
  @media (max-width: 767px) {
    .message-frame .family-tab {
      font-size: 10px; } }
  @media (max-width: 767px) {
    .message-frame .friend-tab {
      font-size: 10px; } }
  .message-frame .family-tab {
    margin-left: 46px;
    position: relative; }
    .message-frame .family-tab:before {
      content: "";
      position: absolute;
      left: -54px;
      bottom: -3px;
      background: url("../images/icons/tab_family.png") no-repeat;
      width: 46px;
      height: 43px; }
    @media (max-width: 767px) {
      .message-frame .family-tab {
        margin-left: 30px; }
        .message-frame .family-tab:before {
          left: -37px;
          bottom: -25px;
          background-size: 60%; } }
  .message-frame .friend-tab {
    margin-left: 46px;
    position: relative; }
    .message-frame .friend-tab:before {
      content: "";
      position: absolute;
      left: -54px;
      bottom: -3px;
      background: url("../images/icons/tab_friend.png") no-repeat;
      width: 46px;
      height: 43px; }
    @media (max-width: 767px) {
      .message-frame .friend-tab {
        margin-left: 30px; }
        .message-frame .friend-tab:before {
          left: -37px;
          bottom: -25px;
          background-size: 60%; } }
  .message-frame .schooltv-tab {
    margin-left: 46px;
    position: relative; }
    .message-frame .schooltv-tab:before {
      content: "";
      position: absolute;
      left: -54px;
      bottom: -3px;
      background: url("../images/icons/tab_schooltv.png") no-repeat;
      width: 46px;
      height: 43px; }
    @media (max-width: 767px) {
      .message-frame .schooltv-tab {
        font-size: 10px;
        margin-left: 33px;
        margin-right: 5px; }
        .message-frame .schooltv-tab:before {
          width: 35px;
          height: 33px;
          left: -34px;
          bottom: -13px;
          background-size: 82%; } }
  .message-frame .title-tab {
    font-size: 18px;
    background-color: #00bf9d;
    padding: 9px 20px;
    color: #fff;
    margin: 0 0 15px;
    font-weight: bold;
    text-align: center; }
    @media (max-width: 767px) {
      .message-frame .title-tab {
        font-size: 16px; } }
  .message-frame .bg-blue-first {
    background-color: #6ecbe6; }
  .message-frame .list-friend-item {
    padding-bottom: 10px;
    border-bottom: 3px solid #fff; }
    .message-frame .list-friend-item .friend-list li {
      padding: 18px 0 18px 0; }
      .message-frame .list-friend-item .friend-list li:hover {
        background-color: #e8fcf1;
        cursor: pointer; }
        .message-frame .list-friend-item .friend-list li:hover .icon-disible {
          background: url("/images/icons/check-hover.png") no-repeat right center;
          background-size: 100%; }
      .message-frame .list-friend-item .friend-list li a {
        padding: 0;
        position: static;
        display: block;
        background: none;
        width: 100%;
        height: 100%;
        border: none;
        cursor: pointer; }
        .message-frame .list-friend-item .friend-list li a img {
          width: 80%;
          margin: 8px auto 0; }
          @media (max-width: 767px) {
            .message-frame .list-friend-item .friend-list li a img {
              margin: 5px auto 0; } }
        .message-frame .list-friend-item .friend-list li a .padding1 {
          padding: 21px 0 0px 40px !important; }
          @media (max-width: 767px) {
            .message-frame .list-friend-item .friend-list li a .padding1 {
              padding: 10px 0 0px 20px !important; } }
        .message-frame .list-friend-item .friend-list li a .icon-disible {
          background: url("/images/icons/check-disabled.png") no-repeat right center;
          background-size: 100%;
          display: block;
          float: right;
          position: relative;
          top: 26%;
          right: 2%;
          width: 40px;
          height: 40px; }
          @media (max-width: 767px) {
            .message-frame .list-friend-item .friend-list li a .icon-disible {
              top: 23%;
              right: 0;
              width: 24px;
              height: 24px; } }
        .message-frame .list-friend-item .friend-list li a .thumb, .message-frame .list-friend-item .friend-list li a .name {
          z-index: 11; }
        .message-frame .list-friend-item .friend-list li a .name {
          width: 80%; }
          @media (max-width: 991px) {
            .message-frame .list-friend-item .friend-list li a .name {
              width: 70%; } }
      @media (max-width: 767px) {
        .message-frame .list-friend-item .friend-list li {
          height: 60px;
          padding: 10px 10px 10px 5px; } }

@media (max-width: 767px) {
  .content-frame.content-timeline {
    padding: 0px; }
    .content-frame.content-timeline .message-list {
      padding: 10px 20px; } }

.content-timeline.content-share {
  min-height: 380px; }

.content-timeline {
  background-color: #eff4ff;
  margin: 0;
  padding-bottom: 0; }
  @media (max-width: 767px) {
    .content-timeline {
      margin: 0 -15px; } }
  .content-timeline .polygon-bg img {
    position: relative; }
  .content-timeline .top-bg-xs {
    background-color: #6ecbe6;
    color: #fff;
    padding: 7px 25px 10px 45px;
    position: relative;
    text-align: center; }
    .content-timeline .top-bg-xs .title-xs {
      font-size: 17px;
      word-break: break-word; }
    .content-timeline .top-bg-xs marquee {
      margin-left: 45px;
      margin-right: 10px; }
    .content-timeline .top-bg-xs .btn-back {
      position: absolute;
      left: 16px;
      top: 8px;
      background: url("../images/icons/ic-back.png") no-repeat;
      width: 20px;
      height: 20px; }
      .content-timeline .top-bg-xs .btn-back:hover, .content-timeline .top-bg-xs .btn-back:active, .content-timeline .top-bg-xs .btn-back:focus {
        background: url("../images/icons/ic-back-hover.png") no-repeat; }
  .content-timeline .title {
    position: absolute;
    top: 20%;
    margin: auto;
    left: 0px;
    right: 0px;
    width: 60%;
    height: auto;
    color: #24a6cc;
    font-size: 25px;
    text-align: center;
    line-height: 60px;
    background: #fff;
    border: 5px solid #60c1d4;
    border-radius: 33px; }
  .content-timeline .message-title {
    margin: auto;
    width: 60%;
    height: auto;
    color: #24a6cc;
    font-size: 25px;
    text-align: center;
    line-height: 60px;
    background: #fff;
    border: 5px solid #60c1d4;
    border-radius: 33px;
    word-break: break-word; }
    .is-ie .content-timeline .message-title {
      word-break: break-all; }
  .content-timeline .message-list {
    margin-top: 60px;
    margin-bottom: 76px; }
    @media (min-width: 768px) {
      .content-timeline .message-list.not-group {
        margin-top: 150px; } }
    .content-timeline .message-list .btn-more {
      width: 60%;
      display: block;
      margin: 0px auto 21px auto;
      padding: 0px;
      font-size: 13px; }
    .content-timeline .message-list .avatar-col {
      width: 10%; }
      .content-timeline .message-list .avatar-col .avatar {
        width: 63px;
        height: auto; }
    .content-timeline .message-list .message {
      margin-bottom: 25px;
      float: right;
      width: 88%; }
      .content-timeline .message-list .message .user-name {
        font-size: 20px;
        color: #6ecbe6; }
      .content-timeline .message-list .message .date {
        bottom: initial;
        width: 60%;
        text-align: right;
        display: block;
        font-size: 15px; }
        @media (max-width: 991px) {
          .content-timeline .message-list .message .date {
            width: 79%; } }
        @media (max-width: 767px) {
          .content-timeline .message-list .message .date {
            width: 88%;
            font-size: 10px; } }
      .content-timeline .message-list .message .deck-list-line {
        width: 60%; }
        @media (max-width: 991px) {
          .content-timeline .message-list .message .deck-list-line {
            width: 79%; } }
        @media (max-width: 767px) {
          .content-timeline .message-list .message .deck-list-line {
            width: 88%; } }
        .content-timeline .message-list .message .deck-list-line .item-inner {
          border: 2px solid #1b6abd;
          border: 2px solid #1b6abd; }
      .content-timeline .message-list .message .message-bubble {
        height: auto;
        width: auto;
        max-width: 90%;
        display: inline-block;
        background-color: #fff;
        border: blue;
        padding: 15px;
        line-height: 1.5;
        font-size: 20px;
        border: 2px solid #60c1d4;
        border-radius: 0px 7px 7px 7px;
        min-width: 60%;
        position: relative;
        word-break: break-all; }
        .content-timeline .message-list .message .message-bubble a.btn.btn-green {
          display: block;
          margin: 15px auto 0px auto;
          width: 200px; }
        .content-timeline .message-list .message .message-bubble .date {
          position: absolute;
          right: 0px;
          bottom: -29px; }
  .content-timeline .form-share {
    height: 204px !important; }
    @media (max-width: 767px) {
      .content-timeline .form-share {
        height: 153px !important; } }
    .content-timeline .form-share .title {
      position: relative;
      border: none;
      text-align: left;
      border-radius: 0;
      line-height: initial; }
    .content-timeline .form-share .deck-list-line .item-inner {
      border: 1px solid #888; }
  @media (max-width: 767px) {
    .content-timeline .title {
      width: 95%;
      font-size: 18px;
      line-height: 39px; }
    .content-timeline .message-list {
      margin-top: 15px;
      margin-bottom: 0; }
      .content-timeline .message-list .avatar-col {
        width: 15%;
        margin-right: 15px;
        margin-left: 10px; }
      .content-timeline .message-list .message {
        margin-bottom: 10px;
        width: 76%; }
        .content-timeline .message-list .message .user-name {
          font-size: 13px;
          margin-bottom: 5px; }
        .content-timeline .message-list .message .message-bubble {
          font-size: 14px;
          padding: 11px;
          max-width: 86%; }
          .content-timeline .message-list .message .message-bubble .date {
            bottom: -20px; } }

.form-message {
  border: 6px solid #6ecbe6;
  background-color: #6ecbe6;
  margin-bottom: 80px; }
  @media (max-width: 767px) {
    .form-message {
      margin: 0; } }
  @media (max-width: 767px) {
    .form-message.form-border {
      margin: 0 -15px; } }

@media (min-width: 768px) {
  .btn-messGroup {
    margin: 20px 0 20px; } }
@media (max-width: 767px) {
  .btn-messGroup {
    margin: 10px 15px 0; } }
.btn-messGroup a {
  border: 3px solid #60C1D4 !important; }
  @media (min-width: 768px) {
    .btn-messGroup a {
      width: 40%; } }

.content-tl-detail {
  border: none;
  padding: 0px;
  position: relative;
  margin: 0; }
  .content-tl-detail .activity-content .head {
    margin: 0px; }
    @media (max-width: 767px) {
      .content-tl-detail .activity-content .head {
        padding: 10px; } }
  .content-tl-detail .container-comment .list-fav {
    padding-left: 10px;
    display: inline-block;
    color: #3e8093;
    font-weight: 600; }
  .content-tl-detail .container-comment .list-comment .head {
    border-top: 1px solid #ebebeb;
    border-bottom: none;
    padding: 10px;
    width: 100%;
    display: block; }
    @media (max-width: 320px) {
      .content-tl-detail .container-comment .list-comment .head {
        padding: 10px 0; } }
    .content-tl-detail .container-comment .list-comment .head .center {
      display: block;
      float: left;
      text-align: left;
      padding-left: 30px;
      width: 75%;
      box-sizing: border-box;
      overflow: hidden;
      word-wrap: break-word; }
      @media (max-width: 767px) {
        .content-tl-detail .container-comment .list-comment .head .center {
          padding-left: 15px;
          width: 65%; } }
      @media (max-width: 375px) {
        .content-tl-detail .container-comment .list-comment .head .center {
          width: 60%; } }
      .content-tl-detail .container-comment .list-comment .head .center .status {
        font-size: 14px;
        color: #878e9a; }
      .content-tl-detail .container-comment .list-comment .head .center .comment {
        font-size: 24px;
        font-weight: 700;
        color: #38454f; }
        @media (max-width: 767px) {
          .content-tl-detail .container-comment .list-comment .head .center .comment {
            font-size: 20px; } }
        @media (max-width: 425px) {
          .content-tl-detail .container-comment .list-comment .head .center .comment {
            font-size: 18px; } }
        @media (max-width: 425px) {
          .content-tl-detail .container-comment .list-comment .head .center .comment {
            font-size: 16px; } }
    .content-tl-detail .container-comment .list-comment .head .time {
      vertical-align: top;
      width: 17%;
      float: left;
      display: block; }
      @media (max-width: 767px) {
        .content-tl-detail .container-comment .list-comment .head .time {
          width: 20%; } }
      @media (max-width: 375px) {
        .content-tl-detail .container-comment .list-comment .head .time {
          width: 25%; } }
    .content-tl-detail .container-comment .list-comment .head .thumb {
      display: block;
      float: left;
      width: 8%; }
      @media (max-width: 767px) {
        .content-tl-detail .container-comment .list-comment .head .thumb {
          width: 15%; } }
      .content-tl-detail .container-comment .list-comment .head .thumb img {
        width: 100%; }
        @media (max-width: 767px) {
          .content-tl-detail .container-comment .list-comment .head .thumb img {
            height: auto; } }
  .content-tl-detail .container-comment .list-comment #list_comments {
    width: 100%;
    padding: 15px 25px 50px 25px;
    max-height: 300px;
    overflow-x: hidden;
    margin: 0; }
    @media (max-width: 767px) {
      .content-tl-detail .container-comment .list-comment #list_comments {
        padding: 0px 15px 10px 15px; } }
    .content-tl-detail .container-comment .list-comment #list_comments li.item {
      width: 100%; }
      .content-tl-detail .container-comment .list-comment #list_comments li.item .activity-content {
        display: block;
        width: 100%; }

.trophy-page .bg-triangle-yellow-light {
  padding: 60px 0 80px; }
  @media (max-width: 767px) {
    .trophy-page .bg-triangle-yellow-light {
      padding: 30px 0 40px; } }
.trophy-page .title-triangle-yellow-bg {
  margin-bottom: 14px; }
.trophy-page .description {
  line-height: 1.6;
  padding: 15px;
  color: #2d3940; }
  @media (max-width: 767px) {
    .trophy-page .description {
      font-size: 15px; } }

.trophy-title .h3 {
  padding: 10px;
  font-weight: 600;
  color: #2d3940; }
  @media (max-width: 767px) {
    .trophy-title .h3 {
      font-size: 18px; } }
.trophy-title .counter {
  position: relative;
  display: inline-block; }
  @media (max-width: 767px) {
    .trophy-title .counter {
      padding-top: 20px; } }
  .trophy-title .counter .text {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 124px;
    height: 64px;
    color: #fff;
    font-size: 16px;
    text-align: center;
    line-height: 1;
    margin: auto; }
    @media (max-width: 767px) {
      .trophy-title .counter .text {
        width: 60px;
        height: 30px;
        font-size: 10px;
        line-height: 1;
        padding-top: 7px; } }
    .trophy-title .counter .text .total {
      display: block;
      font-size: 38px; }
      @media (max-width: 767px) {
        .trophy-title .counter .text .total {
          font-size: 20px; } }
  @media (max-width: 767px) {
    .trophy-title .counter img {
      width: 60px; } }

@media (max-width: 767px) {
  .trophies {
    margin: 15px; } }

.trophy-item {
  width: 17%;
  margin: 10px; }
  @media (max-width: 991px) {
    .trophy-item {
      width: 16%; } }
  @media (max-width: 767px) {
    .trophy-item {
      width: 18%;
      margin: 0px; } }
  .trophy-item .trophy-img {
    width: 100%;
    height: 100%; }

#modal-trophy-detail .trophy-img {
  width: 40%; }

/*
* use for db110, db120, db130, db140, db200
*/
.monthly-report .section-title-top .bg-white {
  border: 2px solid #60c1d4;
  padding: 15px 20px;
  border-radius: 3px;
  margin: 20px 0;
  position: relative; }
@media (max-width: 767px) {
  .monthly-report .section-title-top {
    padding: 0; } }
@media (max-width: 767px) {
  .monthly-report .section-title-top .h3 {
    font-size: 18px;
    line-height: 1.4; } }
.monthly-report .main-content {
  min-height: 571px; }
.monthly-report .bg-inner {
  padding-bottom: 120px; }
.monthly-report .block-time .bg-gray {
  display: inline-block;
  margin: 10px 0px; }
.monthly-report .block-time .small {
  display: inline-block;
  font-weight: normal;
  font-size: 20px; }
.monthly-report .block-right {
  font-size: 15px;
  color: #fff;
  background-color: #60c1d4;
  padding: 10px;
  height: 41px; }
  @media (max-width: 991px) {
    .monthly-report .block-right {
      position: relative;
      margin-top: 15px;
      text-align: center; } }
  @media (min-width: 992px) {
    .monthly-report .block-right {
      position: absolute;
      right: 0;
      bottom: 20px;
      z-index: 99; }
      .monthly-report .block-right:before {
        content: "";
        border-radius: 50%;
        background-color: #60c1d4;
        height: 41px;
        width: 41px;
        left: -10%;
        bottom: 0;
        position: absolute;
        z-index: -1; } }
  .monthly-report .block-right:after {
    font-family: "el-icons" !important;
    content: "\f105";
    right: 7px;
    bottom: 0;
    line-height: 41px;
    position: absolute; }
  .monthly-report .block-right span {
    padding-right: 15px; }
.monthly-report .tab-title {
  background: none; }
.monthly-report .history-list {
  margin: 35px 0; }
  .monthly-report .history-list li {
    margin-bottom: 15px; }
  .monthly-report .history-list .bg-white {
    padding: 17px; }
  @media (max-width: 767px) {
    .monthly-report .history-list .title {
      font-size: 19px; } }
.monthly-report .block-yellow {
  background-color: #fefad3;
  margin: 10px auto 0 auto;
  position: relative; }
  @media (max-width: 767px) {
    .monthly-report .block-yellow {
      padding: 12px 12px 12px 30px;
      font-size: 13px; } }
  @media (min-width: 768px) {
    .monthly-report .block-yellow {
      padding: 12px 50px;
      font-size: 18px; } }
  .monthly-report .block-yellow .small {
    font-size: 12px; }
.monthly-report .clock:before {
  position: absolute;
  content: "";
  background: url("../images/icons/clock.png") no-repeat;
  height: 22px;
  width: 19px; }
  @media (max-width: 767px) {
    .monthly-report .clock:before {
      left: -21px;
      background-size: 90%; } }
  @media (min-width: 768px) {
    .monthly-report .clock:before {
      left: -27px; } }
.monthly-report .pen:before {
  position: absolute;
  content: "";
  background: url("../images/icons/pen.png") no-repeat;
  height: 22px;
  width: 22px; }
  @media (max-width: 767px) {
    .monthly-report .pen:before {
      left: -21px;
      background-size: 90%; } }
  @media (min-width: 768px) {
    .monthly-report .pen:before {
      left: -27px; } }
.monthly-report .game:before {
  position: absolute;
  content: "";
  background: url("../images/icons/game.png") no-repeat;
  height: 22px;
  width: 22px; }
  @media (max-width: 767px) {
    .monthly-report .game:before {
      left: -21px;
      background-size: 90%; } }
  @media (min-width: 768px) {
    .monthly-report .game:before {
      left: -27px; } }
.monthly-report .trophy:before {
  position: absolute;
  content: "";
  background: url("../images/icons/trophy.png") no-repeat;
  height: 22px;
  width: 22px; }
  @media (max-width: 767px) {
    .monthly-report .trophy:before {
      left: -21px;
      background-size: 90%; } }
  @media (min-width: 768px) {
    .monthly-report .trophy:before {
      left: -27px; } }
@media (max-width: 767px) {
  .monthly-report .deck-list-line {
    margin-bottom: 30px !important; } }

.report-frame {
  padding-bottom: 0px;
  margin-bottom: 0px; }
  @media (max-width: 767px) {
    .report-frame {
      padding-top: 20px; } }
  @media (min-width: 768px) {
    .report-frame {
      padding-top: 40px; } }

.border-list {
  padding: 0px; }
  .border-list li {
    list-style-type: none;
    padding: 15px 25px;
    border-radius: 3px;
    margin-bottom: 20px; }
  .border-list .blue-dark-border {
    border: 2px solid #295990;
    background-color: #fff; }
  .border-list .date {
    font-size: 18px; }
  .border-list .time {
    font-size: 22px; }

.divider.dashed.white {
  border-color: #fff; }

.no-underline {
  text-decoration: none !important;
  color: initial !important; }

@media (min-width: 768px) {
  .border-light-blue {
    padding: 0 94px; } }
.border-light-blue .deck-list-line .item .item-inner {
  border: 3px solid #60c1d4;
  padding: 15px 20px;
  border-radius: 3px;
  margin: 20px 0;
  position: relative; }
  .border-light-blue .deck-list-line .item .item-inner .left {
    width: 80px; }
    .border-light-blue .deck-list-line .item .item-inner .left .thumb {
      height: 80px; }

.status-list .item {
  border-radius: 3px;
  margin: 10px 0; }
  .status-list .item .header {
    position: relative;
    background-color: #fefad3;
    padding: 18px;
    border-bottom: 1px solid #295990; }
  .status-list .item .datetime {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 12px; }
  .status-list .item .bottom {
    padding: 15px; }
    @media (max-width: 767px) {
      .status-list .item .bottom {
        margin: auto; } }
    @media (min-width: 768px) {
      .status-list .item .bottom {
        text-align: center; } }
.status-list .label {
  color: #fff;
  padding: 7px 20px;
  width: 100px;
  display: block;
  border-radius: 3px;
  font-size: 13px;
  font-weight: normal; }
  @media (min-width: 768px) and (max-width: 991px) {
    .status-list .label {
      width: 78px; } }
.status-list .label-orange {
  background-color: #ed9050; }
.status-list .label-green {
  background-color: #7ac349; }
.status-list .label-purple {
  background-color: #b38ef0; }
.status-list .inline-block {
  display: inline-block; }
  @media (max-width: 767px) {
    .status-list .inline-block {
      margin: 5px 0 5px 10%; } }

.team-create-page .title-second {
  margin-top: 70px; }
.team-create-page .select-wrap .form-control {
  float: left;
  width: 80%; }
.team-create-page .select-wrap .text {
  display: inline-block;
  margin-top: 10px; }
.team-create-page .radio-wrap:not(:first-child) {
  margin-top: 30px; }
.team-create-page .radio-wrap .form-control {
  float: left;
  width: auto; }
.team-create-page .radio-wrap .text {
  display: inline-block;
  margin: 13px 0 0 10px; }

.team-search-box.form-horizontal .checkbox-inline {
  margin: 12px 20px 0 0; }
.team-search-box.form-horizontal .btn-area {
  margin: 30px 0 -40px; }
  @media (max-width: 767px) {
    .team-search-box.form-horizontal .btn-area {
      margin-bottom: 0; } }

@media (max-width: 767px) {
  .team-search-page .group-list-container {
    padding-top: 20px; } }

.team-transfer-leader-page .friend-list li .radio {
  position: absolute;
  z-index: 10;
  float: right;
  width: 100%;
  top: 0;
  left: 0;
  height: 114px;
  margin: 0; }
  @media (max-width: 767px) {
    .team-transfer-leader-page .friend-list li .radio {
      height: 59px; } }
  .team-transfer-leader-page .friend-list li .radio .icon {
    background: url("/images/icons/check.png") no-repeat right center;
    background-size: 100%;
    display: block;
    float: right;
    position: relative;
    top: 33%;
    right: 4%;
    width: 40px;
    height: 40px; }
    @media (max-width: 767px) {
      .team-transfer-leader-page .friend-list li .radio .icon {
        right: 0;
        width: 25px;
        height: 25px;
        top: 30%; } }
  .team-transfer-leader-page .friend-list li .radio input[type="radio"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 115px;
    opacity: 0;
    margin: 0;
    cursor: pointer; }
    @media (max-width: 767px) {
      .team-transfer-leader-page .friend-list li .radio input[type="radio"] {
        height: 59px; } }
.team-transfer-leader-page .friend-list li .checked .icon {
  background: url("/images/icons/check-hover.png") no-repeat right center;
  background-size: 100%; }
.team-transfer-leader-page .friend-list li .disabled .icon {
  background: url("/images/icons/check-disabled.png") no-repeat right center;
  background-size: 100%; }

@media (max-width: 767px) {
  .team-transfer-leader-page.list-team .content-frame .friend-list {
    padding: 0; } }

.waiting-member-list {
  max-height: none;
  overflow-y: hidden; }
  .waiting-member-list li {
    position: relative;
    display: block;
    width: 100%;
    height: 115px;
    padding: 18px 40px 18px 8px;
    background: #fff;
    border-bottom: 1px dashed #b7b7b7;
    z-index: 10; }
    .waiting-member-list li:hover {
      background: #e9f1fc; }
    .waiting-member-list li:last-child {
      border-bottom: none; }
    @media (max-width: 767px) {
      .waiting-member-list li {
        height: auto;
        padding: 10px 0 5px 0px; } }
  .waiting-member-list .info, .waiting-member-list .thumb {
    position: relative;
    z-index: 10; }
  .waiting-member-list .thumb {
    float: left;
    width: 90px; }
    .waiting-member-list .thumb img {
      width: 100%; }
    @media (max-width: 767px) {
      .waiting-member-list .thumb {
        width: 44px; } }
  .waiting-member-list .info {
    display: block;
    color: inherit;
    padding: 20px 240px 0px 105px; }
    @media (max-width: 991px) {
      .waiting-member-list .info {
        padding-top: 0; } }
    @media (max-width: 767px) {
      .waiting-member-list .info {
        font-size: 16px;
        padding: 0px 0 0px 50px; } }
  .waiting-member-list .grade {
    float: left;
    color: orange;
    border: 2px solid orange;
    padding: 5px 10px;
    font-size: 10px;
    font-weight: bold;
    border-radius: 4px;
    margin-top: 3px; }
    @media (max-width: 991px) {
      .waiting-member-list .grade {
        float: none;
        display: block;
        width: 78px; } }
    @media (max-width: 767px) {
      .waiting-member-list .grade {
        padding: 0px;
        width: 100px;
        margin-top: 0;
        text-align: center; } }
  .waiting-member-list .nickname {
    float: left;
    font-size: 18px;
    font-weight: bold;
    margin: 4px 0 0 10px; }
    @media (max-width: 991px) {
      .waiting-member-list .nickname {
        float: none;
        display: block;
        font-size: 16px;
        margin: 4px 0 0 0px; } }
    @media (max-width: 767px) {
      .waiting-member-list .nickname {
        font-size: 12px;
        margin: 0;
        display: inline-block; } }
  .waiting-member-list .login-id {
    float: left;
    margin: 6px 0 0 10px; }
    @media (max-width: 991px) {
      .waiting-member-list .login-id {
        float: none;
        display: block;
        margin: 0; } }
    @media (max-width: 767px) {
      .waiting-member-list .login-id {
        margin: 0;
        font-size: 10px;
        display: inline-block; } }
  .waiting-member-list .approve-box {
    position: absolute;
    right: 0;
    top: 20px; }
    .waiting-member-list .approve-box .btn {
      width: 120px; }
    @media (max-width: 767px) {
      .waiting-member-list .approve-box {
        position: static;
        text-align: center; } }

#rabi-chat-box #rabi-chat-open-button {
  width: 130px;
  height: 210px;
  background: transparent url("/images/chat-bot/spritesheet.png") no-repeat;
  background-size: 13000px 210px;
  animation: chat-bot-animation 5s steps(99) infinite;
  padding: 0;
  border: none;
  position: fixed;
  bottom: 10px;
  right: 10px;
  z-index: 1039; }
#rabi-chat-box #rabi-chat-wrapper {
  position: fixed;
  padding: 10px;
  bottom: 0;
  right: 0;
  z-index: 1039; }
  #rabi-chat-box #rabi-chat-wrapper #rabi-button-wrapper {
    position: absolute;
    right: 10px;
    z-index: 2; }
    #rabi-chat-box #rabi-chat-wrapper #rabi-button-wrapper #rabi-chat-close-button {
      width: 20px;
      height: 20px;
      background: transparent;
      border: none;
      padding: 0;
      margin: 10px; }
      #rabi-chat-box #rabi-chat-wrapper #rabi-button-wrapper #rabi-chat-close-button img {
        width: inherit;
        height: inherit; }
  #rabi-chat-box #rabi-chat-wrapper #rabi-chat-frame-main {
    position: relative;
    width: 360px;
    height: 620px;
    border: 1px solid #D5D7CD;
    -webkit-overflow-scrolling: touch;
    background: url("/images/chat-bot/chat-bg.png") repeat fixed;
    background-size: 90px; }
    #rabi-chat-box #rabi-chat-wrapper #rabi-chat-frame-main #rabi-chat-progress-box {
      position: absolute;
      z-index: 0;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      color: #888;
      box-sizing: border-box;
      padding-top: 150px;
      text-align: center; }
    #rabi-chat-box #rabi-chat-wrapper #rabi-chat-frame-main #rabi-chat-frame-wrapper {
      position: absolute;
      z-index: 1;
      top: 0;
      left: 0;
      width: 100%; }
    #rabi-chat-box #rabi-chat-wrapper #rabi-chat-frame-main #rabi-chat-frame {
      width: 100%;
      min-height: 620px;
      border: none;
      display: inline-block;
      vertical-align: top; }
#rabi-chat-box .rabi-chat-hidden {
  display: none; }

@keyframes chat-bot-animation {
  0% {
    background-position: 0 0; }
  100% {
    background-position: -12870px 0; } }

/*# sourceMappingURL=style.css.map */
.vjs-icon-rewind:before {
  content: "";
  display: inline-block;
  height: 18px;
  width: 18px;
  background-image: url('../images/icons/buttonRW.png');
  background-size: contain;
  background-repeat: no-repeat;
  cursor: pointer;
}

.vjs-icon-forward:before {
  content: "";
  display: inline-block;
  height: 18px;
  width: 18px;
  background-image: url('../images/icons/buttonFF.png');
  background-size: contain;
  background-repeat: no-repeat;
  cursor: pointer;
}

.video-js .vjs-control-bar {
  visibility: visible !important;
  opacity: 1 !important;
  transition: none !important;
}

.video-js .vjs-progress-holder .vjs-play-progress {
  background-color: #d52484;
}

.video-js .vjs-volume-level {
  background-color: #d52484 !important;
}

.vjs-custom-time-display {
  display: flex;
  align-items: center;
  justify-content: center;
}