/*
	HTML5 Reset :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:

	Eric Meyer					:: http://meyerweb.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com

-------------------------------------------------------------------------------*/
/* Let's default this puppy out
-------------------------------------------------------------------------------*/
html,
body,
body div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
figure,
footer,
header,
menu,
nav,
section,
time,
mark,
audio,
video,
details,
summary {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-weight: normal;
  vertical-align: baseline;
  background: transparent;
}
article,
aside,
figure,
footer,
header,
nav,
section,
details,
summary {
  display: block;
}
/* consider resetting the default cursor: https://gist.github.com/murtaugh/5247154 */
/* Apply a natural box layout model to all elements: http://paulirish.com/2012/box-sizing-border-box-ftw/ */
*,
*:before,
*:after {
  box-sizing: border-box;
  outline: none;
}
a {
  outline: 0;
}
:focus {
  outline: none !important;
}
button::-moz-focus-inner,
a::-moz-focus-inner {
  border: 0;
}
/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed {
  max-width: 100%;
}
/* force a vertical scrollbar to prevent a jumpy page */
/* we use a lot of ULs that aren't bulleted.
	don't forget to restore the bullets within content. */
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  text-decoration: none;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help;
}
/* tables still need cellspacing="0" in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}
th {
  font-weight: bold;
  vertical-align: bottom;
}
td {
  font-weight: normal;
  vertical-align: top;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}
input,
select {
  vertical-align: middle;
}
pre {
  white-space: pre;
  /* CSS2 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word;
  /* IE */
}
input[type="radio"] {
  vertical-align: text-bottom;
}
input[type="checkbox"] {
  vertical-align: bottom;
}
.ie7 input[type="checkbox"] {
  vertical-align: baseline;
}
.ie6 input {
  vertical-align: text-bottom;
}
select,
input,
textarea {
  font: 99% sans-serif;
}
table {
  font-size: inherit;
  font: 100%;
}
small {
  font-size: 85%;
}
strong {
  font-weight: bold;
}
td,
td img {
  vertical-align: top;
}
/* Make sure sup and sub don't mess with your line-heights http://gist.github.com/413930 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
/* standardize any monospaced elements */
pre,
code,
kbd,
samp {
  font-family: monospace, sans-serif;
}
/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
input[type=file],
button {
  cursor: pointer;
}
/* Webkit browsers add a 2px margin outside the chrome of form elements */
button,
input,
select,
textarea {
  margin: 0;
}
/* make buttons play nice in IE */
button,
input[type=button] {
  width: auto;
  overflow: visible;
}
/* scale images in IE7 more attractively */
.ie7 img {
  -ms-interpolation-mode: bicubic;
}
/* prevent BG image flicker upon hover
   (commented out as usage is rare, and the filter syntax messes with some pre-processors)
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}
*/
/* let's clear some floats */
.clearfix:before,
.clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
}
.clearfix:after {
  clear: both;
}
.clearfix {
  zoom: 1;
}
* {
  outline: none;
}
html {
  width: 100%;
  height: 100%;
}
html,
html a {
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
}
body {
  background-color: #ffffff;
  color: #808082;
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
  overflow-x: hidden;
  cursor: url("../../bundles/app/images/paint-hover.png"), default;
}
input,
textarea,
button,
a {
  font-family: 'Open Sans', sans-serif !important;
}
input,
textarea {
  border-color: #8b9aa7 !important;
  color: #8b9aa7 !important;
  font-size: 13px !important;
}
input:focus,
textarea:focus {
  border-color: #66afe9 !important;
}
input[type=text],
input[type=button],
input[type=email],
textarea,
button,
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
textarea {
  min-height: 50px;
  resize: vertical;
}
a,
a:hover,
a:focus,
a:active {
  text-decoration: none;
}
p {
  color: #808082;
}
input.has-error,
textarea.has-error {
  background-color: #e2787a !important;
  color: #fff !important;
}
input.has-error::-webkit-input-placeholder,
textarea.has-error::-webkit-input-placeholder {
  color: whitesmoke !important;
}
input.has-error:-moz-placeholder,
textarea.has-error:-moz-placeholder {
  /* Firefox 18- */
  color: whitesmoke !important;
}
input.has-error::-moz-placeholder,
textarea.has-error::-moz-placeholder {
  /* Firefox 19+ */
  color: whitesmoke !important;
}
input.has-error:-ms-input-placeholder,
textarea.has-error:-ms-input-placeholder {
  color: whitesmoke !important;
}
.scrollup {
  z-index: 999;
  width: 40px;
  height: 40px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  position: fixed;
  bottom: 40px;
  right: 20px;
  display: none;
  text-indent: -9999px;
  background: url('../../bundles/app/images/toTop.png') no-repeat;
  background-size: cover;
}
@font-face {
  font-family: 'Open Sans';
  src: url('../../bundles/app/fonts/OpenSans-Light_0.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Open Sans';
  src: url('../../bundles/app/fonts/OpenSans-Regular-webfont.eot');
  src: url('../../bundles/app/fonts/OpenSans-Regular-webfont.eot#iefix') format('embedded-opentype'), url('../../bundles/app/fonts/OpenSans-Regular-webfont.woff') format('woff'), url('../../bundles/app/fonts/OpenSans-Regular-webfont.ttf') format('truetype'), url('../../bundles/app/fonts/OpenSans-Regular-webfont.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Open Sans';
  src: url('../../bundles/app/fonts/OpenSans-Semibold-webfont.eot');
  src: url('../../bundles/app/fonts/OpenSans-Semibold-webfont.eot#iefix') format('embedded-opentype'), url('../../bundles/app/fonts/OpenSans-Semibold-webfont.woff') format('woff'), url('../../bundles/app/fonts/OpenSans-Semibold-webfont.ttf') format('truetype'), url('../../bundles/app/fonts/OpenSans-Semibold-webfont.svg') format('svg');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Open Sans';
  src: url('../../bundles/app/fonts/OpenSans-Bold-webfont.eot');
  src: url('../../bundles/app/fonts/OpenSans-Bold-webfont.eot#iefix') format('embedded-opentype'), url('../../bundles/app/fonts/OpenSans-Bold-webfont.woff') format('woff'), url('../../bundles/app/fonts/OpenSans-Bold-webfont.ttf') format('truetype'), url('../../bundles/app/fonts/OpenSans-Bold-webfont.svg') format('svg');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'iCielBambola';
  src: url('../../bundles/app/fonts/iCielBambola.ttf') format('truetype'), url('../../bundles/app/fonts/iCielBambola.otf') format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Fester';
  src: url('../../bundles/app/fonts/Fester Bold.otf') format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Bebas';
  src: url('../../bundles/app/fonts/UTMBebas.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Gotham-Thin';
  src: url('../../bundles/app/fonts/Gotham-Thin.otf') format('opentype');
  font-style: normal;
}
@font-face {
  font-family: 'Gotham-Medium';
  src: url('../../bundles/app/fonts/Gotham-Medium.otf') format('opentype');
  font-style: normal;
}
@font-face {
  font-family: 'Gotham-Ultra';
  src: url('../../bundles/app/fonts/Gotham-Ultra.otf') format('opentype');
  font-style: normal;
}
@font-face {
  font-family: 'galaxy';
  src: url('../../bundles/app/fonts/galaxy_7ld454.eot');
  src: url('../../bundles/app/fonts/galaxy_7ld454.eot#iefix') format('embedded-opentype'), url('../../bundles/app/fonts/galaxy_7ld454.ttf') format('truetype'), url('../../bundles/app/fonts/galaxy_7ld454.woff') format('woff'), url('../../bundles/app/fonts/galaxy_7ld454.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="galaxy-icon-"],
[class*=" galaxy-icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'galaxy' !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;
}
.galaxy-icon-phone:before {
  content: "\e90c";
}
.galaxy-icon-calendar:before {
  content: "\e900";
}
.galaxy-icon-conversation:before {
  content: "\e901";
}
.galaxy-icon-flower:before {
  content: "\e902";
}
.galaxy-icon-location:before {
  content: "\e903";
}
.galaxy-icon-mixture:before {
  content: "\e904";
}
.galaxy-icon-painter:before {
  content: "\e905";
}
.galaxy-icon-palette:before {
  content: "\e906";
}
.galaxy-icon-planet:before {
  content: "\e907";
}
.galaxy-icon-roller:before {
  content: "\e908";
}
.galaxy-icon-search:before {
  content: "\e909";
}
.galaxy-icon-tint:before {
  content: "\e90a";
}
.galaxy-icon-tool:before {
  content: "\e90b";
}
.row.top-gap {
  margin-top: 20px;
}
.row.double-gap {
  margin-top: 40px;
}
#top-banner {
  position: relative;
  width: 100%;
  height: 325px;
  background: transparent no-repeat center center / cover;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
#top-banner:after {
  content: '';
  position: absolute;
  bottom: 0;
  border: 0;
  height: 8px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
}
#top-banner.color-trend-banner {
  background-image: url("../../bundles/app/images/banner/banner-2.jpg");
}
#top-banner.color-palette-banner {
  background-image: url("../../bundles/app/images/banner/banner-3.jpg");
}
#top-banner.painting-house-banner {
  background-image: url("../../bundles/app/images/banner/banner-4.jpg");
}
#top-banner.painting-guide-banner {
  background-image: url("../../bundles/app/images/banner/banner-5.jpg");
}
#top-banner.product-banner {
  height: 400px !important;
  background-image: url("../../bundles/app/images/banner/product-banner.png");
}
#top-banner.lucky-painter {
  background-image: url("../../bundles/app/images/banner/banner-7.jpg");
}
#top-banner.news-banner {
  background-image: url("../../bundles/app/images/banner/banner-8.jpg");
}
#top-banner.paint-calculator-banner {
  background-image: url("../../bundles/app/images/banner/banner-9.jpg");
}
#top-banner.nearest-agency-banner {
  background-image: url("../../bundles/app/images/banner/banner-10.jpg");
}
#top-banner.contact-banner {
  background-image: url("../../bundles/app/images/banner/banner-11.jpg");
}
@media (max-width: 599px) {
  #top-banner {
    height: 150px !important;
  }
  #top-banner.product-banner {
    height: 150px !important;
  }
  #top-banner.lucky-painter {
    background-position: left center !important;
  }
}
.galaxy-select .dropdown-toggle {
  width: 100%;
  font-size: 13px;
  box-shadow: none;
}
.galaxy-select .dropdown-toggle:after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  position: absolute;
  right: 12px;
  top: 13px;
  border-top: 8px solid;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  vertical-align: middle;
}
.galaxy-select .btn-white {
  background-color: #fff;
  border-color: #adb8c1;
  color: #8b9aa7;
  text-align: left;
}
.galaxy-select .btn-white:hover,
.galaxy-select .btn-white:focus {
  box-shadow: none;
}
.galaxy-select .btn-grey {
  background-color: #8b9aa7;
  border-color: #d4dadf;
  color: #fff;
  text-align: left;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -ms-border-radius: 0px;
  border-radius: 0px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.galaxy-select .btn-grey:hover,
.galaxy-select .btn-grey:focus {
  background-color: #fff;
  color: #8b9aa7;
  box-shadow: none;
}
.galaxy-select .dropdown-menu {
  max-height: 300px;
  overflow-y: auto;
  right: 0;
  font-size: 13px;
}
.group-filter {
  margin: 10px 0;
  display: inline-block;
  width: 100%;
}
.group-filter .product-btn {
  background-color: white;
  color: #8b9aa7;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.group-filter .product-btn .text-uppercase {
  text-transform: inherit;
}
.galaxy-button {
  display: inline-block;
  background-color: #bf1411;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#bf1411), to(#f16e18));
  background-image: -webkit-linear-gradient(top, #bf1411, #f16e18);
  background-image: -moz-linear-gradient(top, #bf1411, #f16e18);
  background-image: -ms-linear-gradient(top, #bf1411, #f16e18);
  background-image: -o-linear-gradient(top, #bf1411, #f16e18);
  font-weight: 700;
  font-size: 13px;
  text-align: center;
  color: white;
  padding: 6px 22px;
  border: none;
  -webkit-box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.8);
  -moz-box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.8);
  box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.8);
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.galaxy-button:hover {
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  -webkit-opacity: 0.8;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  filter: alpha(opacity=80);
}
.galaxy-button:focus {
  color: #fff !important;
}
a.galaxy-button:hover {
  color: #fff;
}
.galaxy-prev,
.galaxy-next {
  display: inline-block;
  width: 32px;
  height: 32px;
  text-align: center;
  background-color: #ee7421;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ee7421), to(#bf3315));
  background-image: -webkit-linear-gradient(top, #ee7421, #bf3315);
  background-image: -moz-linear-gradient(top, #ee7421, #bf3315);
  background-image: -ms-linear-gradient(top, #ee7421, #bf3315);
  background-image: -o-linear-gradient(top, #ee7421, #bf3315);
  cursor: pointer;
}
.galaxy-prev > i,
.galaxy-next > i {
  color: #fff;
  font-size: 16px;
  line-height: 32px;
}
.galaxy-prev:hover,
.galaxy-next:hover {
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  -webkit-opacity: 0.8;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  filter: alpha(opacity=80);
}
.galaxy-line {
  position: relative;
}
.galaxy-line:before {
  content: '';
  position: absolute;
  top: 9px;
  left: 0;
  width: 100%;
  height: 7px;
  z-index: -1;
}
.galaxy-line.mix:before {
  border: 0;
  height: 6px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
}
.galaxy-line.discovery:before {
  background-color: #4e1464;
  background-image: -webkit-gradient(linear, left top, right top, from(#4e1464), to(#6b2b85));
  background-image: -webkit-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -moz-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -ms-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -o-linear-gradient(left, #4e1464, #6b2b85);
}
.galaxy-line.product:before {
  background-color: #bd341a;
  background-image: -webkit-gradient(linear, left top, right top, from(#bd341a), to(#f07721));
  background-image: -webkit-linear-gradient(left, #bd341a, #f07721);
  background-image: -moz-linear-gradient(left, #bd341a, #f07721);
  background-image: -ms-linear-gradient(left, #bd341a, #f07721);
  background-image: -o-linear-gradient(left, #bd341a, #f07721);
}
.galaxy-line.news:before {
  background-color: #f4901e;
  background-image: -webkit-gradient(linear, left top, right top, from(#f4901e), to(#f6ea23));
  background-image: -webkit-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -moz-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -ms-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -o-linear-gradient(left, #f4901e, #f6ea23);
}
.galaxy-title {
  display: inline-block;
  background-color: #fff;
  color: #8b9aa7;
  font-size: 20px;
  font-weight: 700;
  padding-right: 20px;
}
.galaxy-heading {
  color: #8b9aa7;
  font-size: 15px;
  font-weight: 700;
  line-height: 24px;
}
.galaxy-heading.horizontal-line {
  display: inline-block;
  background-color: #fff;
  padding-right: 20px;
}
.galaxy-pagination {
  text-align: right;
}
.galaxy-pagination .pagination > li {
  display: inline-block;
}
.galaxy-pagination .pagination > li:first-child > a,
.galaxy-pagination .pagination > li:last-child > a {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  -ms-border-radius: 0px;
  border-radius: 0px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.galaxy-pagination .pagination > li > a {
  color: #fff;
  background-color: #8b9aa7;
  border: 1px solid #7e8e9e;
  font-weight: 700;
}
.galaxy-pagination .pagination > li.active > a,
.galaxy-pagination .pagination > li a:focus,
.galaxy-pagination .pagination > li a:hover {
  background-color: #f4901e;
  background-image: -webkit-gradient(linear, left top, right top, from(#f4901e), to(#f6ea23));
  background-image: -webkit-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -moz-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -ms-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -o-linear-gradient(left, #f4901e, #f6ea23);
  border-color: #f8e676;
  font-weight: 700;
}
.galaxy-suggestion {
  position: relative;
  display: block;
  width: 100%;
  color: #fff;
}
.galaxy-suggestion.paint-calculator {
  background-color: #4e1464;
  background-image: -webkit-gradient(linear, left top, right top, from(#4e1464), to(#6b2b85));
  background-image: -webkit-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -moz-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -ms-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -o-linear-gradient(left, #4e1464, #6b2b85);
}
.galaxy-suggestion.color-blender {
  background-color: #bd341a;
  background-image: -webkit-gradient(linear, left top, right top, from(#bd341a), to(#f07721));
  background-image: -webkit-linear-gradient(left, #bd341a, #f07721);
  background-image: -moz-linear-gradient(left, #bd341a, #f07721);
  background-image: -ms-linear-gradient(left, #bd341a, #f07721);
  background-image: -o-linear-gradient(left, #bd341a, #f07721);
}
.galaxy-suggestion.nearest-agency {
  background-color: #f4901e;
  background-image: -webkit-gradient(linear, left top, right top, from(#f4901e), to(#f6ea23));
  background-image: -webkit-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -moz-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -ms-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -o-linear-gradient(left, #f4901e, #f6ea23);
}
.galaxy-suggestion:after {
  content: '';
  position: absolute;
  top: 7px;
  right: 7px;
  bottom: -7px;
  left: -7px;
  border: 1px solid transparent;
  -moz-border-image: -moz-linear-gradient(right, #f6ea23 0%, #6b2b85 100%);
  -webkit-border-image: -webkit-linear-gradient(right, #f6ea23 0%, #6b2b85 100%);
  border-image: linear-gradient(to left, #f6ea23 0%, #6b2b85 100%);
  border-image-slice: 1;
}
.galaxy-suggestion:hover,
.galaxy-suggestion:focus,
.galaxy-suggestion:active {
  color: #fff;
}
.galaxy-suggestion i {
  display: inline-block;
  float: left;
}
.galaxy-suggestion p {
  display: inline-block;
  color: #fff;
  white-space: nowrap;
}
.galaxy-suggestion span {
  display: block;
}
.galaxy-suggestion .large-text {
  font-family: 'iCielBambola', sans-serif;
}
@media (min-width: 1200px) {
  .galaxy-suggestion {
    height: 185px;
    padding: 34px;
  }
  .galaxy-suggestion i {
    width: 40%;
    font-size: 115px;
  }
  .galaxy-suggestion p {
    width: 48%;
    margin: 10% 0 0 10%;
  }
  .galaxy-suggestion .large-text {
    font-size: 40px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .galaxy-suggestion {
    height: 160px;
    padding: 34px 20px;
  }
  .galaxy-suggestion i {
    width: 40%;
    font-size: 100px;
  }
  .galaxy-suggestion p {
    width: 48%;
    margin: 8% 0 0 10%;
  }
  .galaxy-suggestion .large-text {
    font-size: 34px;
  }
}
@media (min-width: 600px) and (max-width: 991px) {
  .galaxy-suggestion {
    height: 140px;
    padding: 34px 20px;
  }
  .galaxy-suggestion i {
    width: 40%;
    font-size: 80px;
    text-align: right;
  }
  .galaxy-suggestion p {
    width: 48%;
    margin: 6% 0 0 10%;
  }
  .galaxy-suggestion .large-text {
    font-size: 30px;
  }
}
@media (max-width: 599px) {
  .galaxy-suggestion {
    height: 70px;
    padding: 13px 0 13px 12%;
  }
  .galaxy-suggestion:after {
    top: 3px !important;
    right: 3px !important;
    bottom: -3px !important;
    left: -3px !important;
  }
  .galaxy-suggestion i {
    display: none !important;
  }
  .galaxy-suggestion p {
    margin: 0;
  }
  .galaxy-suggestion .large-text {
    font-size: 24px;
  }
}
#wrap {
  position: fixed;
  left: 0;
  width: 100%;
  top: 0;
  height: 100%;
}
#iframe {
  width: 100%;
  height: 100%;
}
@media (max-width: 599px) {
  .galaxy-tool > div:first-child {
    padding-right: 0 !important;
  }
  .galaxy-tool > div:nth-child(2) {
    padding: 0 8px !important;
  }
  .galaxy-tool > div:last-child {
    padding-left: 0 !important;
  }
}
.galaxy-label {
  color: #8b9aa7;
  font-weight: 700;
  line-height: 26px;
}
.divider {
  padding-bottom: 10px;
  border-bottom: 1px solid #8b9aa7;
}
.divider.bottom-gap {
  margin-bottom: 15px;
}
.bottom-divider {
  border-bottom: 1px solid #b2bcc4;
  margin: 15px 0;
}
#bottom-nav.isLanding {
  display: none;
}
#bottom-nav p {
  font-size: 11px;
  text-align: center;
}
#bottom-nav ul {
  margin: 15px auto;
}
#bottom-nav ul > li {
  display: inline-block;
  padding: 0 20px;
  border-right: 1px solid #8b9aa7;
}
#bottom-nav ul > li:last-child {
  border: none;
}
#bottom-nav ul > li > a {
  color: #8b9aa7;
  font-weight: 600;
  text-transform: capitalize;
}
#bottom-nav ul > li > a:hover {
  color: #7e8d9a;
}
.galaxy-btn-file {
  position: relative;
  overflow: hidden;
  background-color: #8b9aa7;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  border: 1px solid #8b9aa7;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.galaxy-btn-file:hover {
  background-color: #fff;
  color: #8b9aa7;
}
.galaxy-btn-file input[type=file] {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
  font-size: 100px;
  text-align: right;
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter: alpha(opacity=0);
  outline: none;
  background: white;
  cursor: inherit;
  display: block;
}
.block-content {
  position: relative;
  display: block;
}
.block-content.pink {
  background-color: #fcdbd9;
}
.block-content.pink h1 {
  color: #bb949c;
}
.block-content.blue {
  background-color: #c5cddb;
}
.block-content.blue h1 {
  color: #829ccb;
}
.block-content.orange {
  color: #ffffff;
  background-color: #fab436;
}
.block-content.gray {
  color: #5a1d72;
  background-color: #ebebed;
}
button.btn-purple {
  background-color: #8f318a;
  border-color: #8f318a;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 6px 36px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
button.btn-purple:hover,
button.btn-purple:focus {
  background-color: #fff;
  color: #8f318a;
}
.slimScrollBar {
  z-index: 9999 !important;
}
.has-error .form-control {
  border-color: #a94442 !important;
}
.navbar {
  position: relative;
  width: 100%;
  height: 98px;
  border: none;
  border-bottom: 2px solid #230053;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  background: transparent url('../../bundles/app/images/header-background.png') repeat-x top center;
  margin: 0;
}
.navbar-logo {
  float: left;
  padding: 13px 0;
}
.navbar-nav {
  margin-top: 30px;
}
.navbar-nav {
  display: inline-block;
}
.nav > li > a {
  padding: 10px;
}
.navbar-nav > li > a {
  color: #8b9ba8;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  outline: none;
}
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus {
  color: #acbdca;
  background-color: transparent;
}
.navbar-nav > li > a:after {
  content: '';
  position: absolute;
  top: 94%;
  left: 0;
  border: 0;
  height: 5px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter: alpha(opacity=0);
  -webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
  -moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
  transition: height 0.3s, opacity 0.3s, transform 0.3s;
  -webkit-transform: translateY(-10px);
  -moz-transform: translateY(-10px);
  -o-transform: translateY(-10px);
  -ms-transform: translateY(-10px);
  transform: translateY(-10px);
}
.navbar-nav > li > a:hover::after,
.navbar-nav > li > a:focus::after,
.navbar-nav > .active > a:after {
  height: 5px;
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -o-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
}
.navbar-nav > .active > a {
  color: #fff;
}
.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
  background-color: transparent;
  border: none;
  color: #fff;
}
.navbar-nav > li > .navbar-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  width: 200px;
  margin: 26px 0 0;
  list-style: none;
  background-color: #220053;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}
.navbar-nav > li > .navbar-menu.event-menu {
  left: -44px;
}
.navbar-nav > li > .navbar-menu.decor-menu {
  left: -40px;
}
.navbar-nav > li > .navbar-menu.product-menu {
  left: -62px;
}
.navbar-nav > li > .navbar-menu.lucky-menu {
  left: -50px;
}
.navbar-nav > li > .navbar-menu.news-menu {
  left: -68px;
}
.navbar-nav > li > .navbar-menu.support-menu {
  left: -66px;
}
.navbar-nav > li > .navbar-menu > li {
  border-bottom: 1px solid #818e9b;
}
.navbar-nav > li > .navbar-menu > li:last-child {
  border: none;
}
.navbar-nav > li > .navbar-menu > li > a {
  display: block;
  color: #ccc;
  line-height: 1.42857143;
  padding: 8px 20px;
  white-space: normal;
  clear: both;
}
.navbar-nav > li > .navbar-menu > li > a:hover,
.navbar-nav > li > .navbar-menu > li > a:focus {
  color: #eee;
  background-color: #1f0043;
}
.navbar-nav > li > .navbar-menu > li.active a,
.navbar-nav > li > .navbar-menu > li.active a:focus,
.navbar-nav > li > .navbar-menu > li.active a:hover {
  color: #eee;
  background-color: #1f0043;
}
@media (max-width: 767px) {
  .navbar-nav > li > .navbar-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: #6e2087;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
  }
  .navbar-nav > li > .navbar-menu > li {
    border-color: #5a1d71 !important;
  }
}
.navbar-toggle {
  border-color: #ddd;
}
.navbar-toggle:hover,
.navbar-toggle:focus {
  background-color: #ddd;
}
.navbar-toggle .icon-bar {
  background-color: #888;
}
.navbar-form {
  float: right;
  position: relative;
  margin-top: 37px;
}
.navbar-form:after {
  content: "\e909";
  position: absolute;
  top: 4px;
  right: 20px;
  font-family: 'galaxy' !important;
  font-size: 15px;
  line-height: 1;
  color: #8b9ba8;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.navbar-form input {
  max-width: 150px;
  height: 24px;
  font-size: 12px;
  background-color: transparent;
  border-color: #8b9ba8;
  color: #8b9ba8;
  padding: 0 6px;
}
.navbar-form input:focus {
  background-color: #fff;
}
.navbar-form #search-keyword::-webkit-input-placeholder {
  color: #8b9ba8;
}
.navbar-form #search-keyword:-moz-placeholder {
  color: #8b9ba8;
}
.navbar-form #search-keyword::-moz-placeholder {
  color: #8b9ba8;
}
.navbar-form #search-keyword:-ms-input-placeholder {
  color: #8b9ba8;
}
@media (max-width: 1199px) {
  .navbar-nav {
    margin-top: -70px;
  }
  .navbar-nav > li:last-child > a {
    padding-right: 0;
  }
  .navbar-form {
    margin-top: 60px;
  }
}
@media (min-width: 992px) {
  .navbar-nav > li > a::after {
    top: 61px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .navbar-nav {
    width: 470px;
  }
  .navbar-nav > li > a {
    padding: 4px 10px;
  }
}
@media (max-width: 767px) {
  .navbar-toolbar {
    padding: 15px 0;
  }
  .navbar-nav {
    width: 80%;
    margin: 40px 100px 0 60px !important;
  }
  .navbar-toggle {
    margin-top: 30px;
  }
  .navbar-logo {
    padding: 13px 15px;
  }
  .navbar-collapse {
    position: absolute;
    top: 96px;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: #5a1d71;
  }
  .navbar-form {
    position: absolute;
    top: 20px;
    left: 60px;
    box-shadow: none;
    padding: 0;
    margin: 0;
  }
  .navbar-form:after {
    right: 8px;
  }
  .navbar-form input {
    max-width: 100%;
  }
}
#footer {
  display: block;
  height: 78px;
  position: relative;
  width: 100%;
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/paint-roller.png") no-repeat scroll right -70px top 0;
}
#footer:after {
  background-color: #5a1d72;
  content: "";
  height: 70px;
  position: absolute;
  left: 0;
  bottom: 0;
  width: -moz-calc(100% - 93px);
  width: -webkit-calc(100% - 93px);
  width: calc(100% - 93px);
}
#footer.isLanding {
  margin-top: -78px;
}
#footer .footer-wrapper {
  position: relative;
  height: 100%;
  display: block;
}
#footer .footer-wrapper .footer-content {
  display: block;
  position: relative;
  width: 100%;
  margin: 25px 0 0;
}
#footer .copyright {
  position: relative;
  color: #fff;
  line-height: 32px;
  width: auto;
  z-index: 10;
}
@media (max-width: 998px) {
  #footer .copyright {
    line-height: 18px;
  }
}
@media (max-width: 480px) {
  #footer .copyright {
    width: 100px;
    line-height: 14px;
  }
}
#footer .contact-now {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
#footer .social-network {
  position: relative;
  z-index: 10;
  display: block;
  text-align: right;
}
#footer .social-network ul > li {
  display: inline-block;
  margin-right: 5px;
}
@media (max-width: 1024px) {
  #footer .social-network ul > li {
    margin-right: 0;
  }
}
#footer .social-network ul > li > a {
  display: inline-block;
  width: 36px;
  height: 36px;
  background-color: #fff;
  border: 1px solid transparent;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  border-radius: 50px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  text-align: center;
}
@media (max-width: 998px) {
  #footer .social-network ul > li > a {
    margin-right: 0;
  }
}
#footer .social-network ul > li > a > i {
  color: #753989;
  font-size: 20px;
  line-height: 36px;
}
#footer .social-network ul > li > a > i.fa-youtube-play {
  font-size: 22px;
}
#footer .social-network ul > li > a:hover {
  background-color: #753989;
  border-color: #fff;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#footer .social-network ul > li > a:hover > i {
  color: #fff;
}
#footer .send-mail .btn-send {
  color: #fff;
  background-color: #f4901e;
  background-image: -webkit-gradient(linear, left top, right top, from(#f4901e), to(#f6ea23));
  background-image: -webkit-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -moz-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -ms-linear-gradient(left, #f4901e, #f6ea23);
  background-image: -o-linear-gradient(left, #f4901e, #f6ea23);
  border-color: #e3e4e5;
  font-weight: 700;
  padding: 6px 32px;
}
#footer .send-mail .form-control:focus {
  border-color: #e3e4e5;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(253, 254, 255, 0.07), 0 0 8px rgba(179, 116, 205, 0.6);
  box-shadow: inset 0 1px 1px rgba(253, 254, 255, 0.07), 0 0 8px rgba(179, 120, 205, 0.6);
}
#footer .send-mail #user-email::-webkit-input-placeholder,
#footer .send-mail #user-email:-moz-placeholder,
#footer .send-mail #user-email::-moz-placeholder,
#footer .send-mail #user-email:-ms-input-placeholder {
  color: #753989;
  font-size: 13px;
}
#footer .send-mail #user-email::-webkit-input-placeholder {
  color: #753989;
  font-size: 13px;
}
#footer .send-mail #user-email:-moz-placeholder {
  color: #753989;
  font-size: 13px;
}
#footer .send-mail #user-email::-moz-placeholder {
  color: #753989;
  font-size: 13px;
}
#footer .send-mail #user-email:-ms-input-placeholder {
  color: #753989;
  font-size: 13px;
}
#footer .send-mail input,
#footer .send-mail button {
  -webkit-border-radius: 0 !important;
  -moz-border-radius: 0 !important;
  -ms-border-radius: 0 !important;
  border-radius: 0 !important;
  -webkit-background-clip: padding-box !important;
  -moz-background-clip: padding-box !important;
  background-clip: padding-box !important;
}
@media (max-width: 998px) {
  #footer .contact-now {
    display: block;
  }
  #footer .form-control {
    height: 28px;
    padding: 3px 12px;
  }
  #footer .send-mail .btn-send {
    padding: 3px 30px;
  }
  #footer .social-network ul {
    margin: 3px 0;
    white-space: nowrap;
  }
  #footer .social-network ul > li {
    margin: 0 0 2px;
  }
  #footer .social-network ul > li > a {
    width: 26px;
    height: 26px;
  }
  #footer .social-network ul > li > a > i {
    font-size: 14px;
    line-height: 26px;
  }
  #footer .social-network ul > li > a > i.fa-youtube-play {
    font-size: 14px;
  }
  #footer .copyright {
    font-size: 10px;
    margin: 0 0 2px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #footer .copyright > span:last-child {
    display: block;
  }
}
@media (max-width: 767px) {
  #footer .footer-wrapper .footer-content {
    margin: 15px 0 0 0;
  }
}
@media (max-width: 480px) {
  #footer .footer-wrapper .footer-content {
    margin: 10px 0 0 0;
  }
}
@charset "UTF-8";
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}
.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
}
.slick-track:before,
.slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}
.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir="rtl"] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
  display: none;
}
/* Slider */
.slick-loading .slick-list {
  background: #ffffff url('../../bundles/app/images/ajax-loader.gif') center center no-repeat;
}
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 40px;
  width: 40px;
  font-size: 0;
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.2);
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  border-radius: 50px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
  z-index: 100;
}
.slick-prev:hover,
.slick-next:hover,
.slick-prev:focus,
.slick-next:focus {
  outline: none;
  background-color: rgba(255, 255, 255, 0.4);
  color: transparent;
}
.slick-prev:hover:before,
.slick-next:hover:before,
.slick-prev:focus:before,
.slick-next:focus:before {
  opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}
.slick-prev:before,
.slick-next:before {
  display: inline-block;
  font: bold normal normal 24px/1 'FontAwesome';
  text-rendering: auto;
  color: #ffffff;
  opacity: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-prev {
  left: 5%;
}
.slick-prev[dir="rtl"] {
  left: auto;
  right: 5%;
}
.slick-prev:before {
  margin-right: 3px;
  content: "\f104";
}
.slick-prev:before[dir="rtl"] {
  content: "\f105";
}
.slick-next {
  right: 5%;
}
.slick-next[dir="rtl"] {
  left: 5%;
  right: auto;
}
.slick-next:before {
  margin-left: 3px;
  content: "\f105";
}
.slick-next:before[dir="rtl"] {
  content: "\f104";
}
/* Dots */
.slick-dotted .slick-slider {
  margin-bottom: 30px;
}
.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
.slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}
.slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}
.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}
.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-size: 6px;
  line-height: 20px;
  text-align: center;
  color: #000000;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
  color: #000000;
  opacity: 1;
}
.tab-header {
  height: auto;
  width: 100%;
  display: block;
  background-color: #ffffff;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#d2d4d5));
  background-image: -webkit-linear-gradient(top, #ffffff, #d2d4d5);
  background-image: -moz-linear-gradient(top, #ffffff, #d2d4d5);
  background-image: -ms-linear-gradient(top, #ffffff, #d2d4d5);
  background-image: -o-linear-gradient(top, #ffffff, #d2d4d5);
}
.tab-header .nav-tabs {
  border: none;
  display: block;
  margin: 25px 0 0;
}
.tab-header .nav-tabs li {
  display: inline-block;
  margin-right: 20px;
  margin-bottom: 0;
  min-width: 180px;
}
.tab-header .nav-tabs li a {
  font-weight: 600;
  border: 0;
  margin-right: 0;
  color: #ffffff;
  text-align: center;
  background: #8b9aa7;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.tab-header .nav-tabs li:hover a {
  border: 0;
  background: rgba(0, 0, 0, 0.1);
  color: #333333;
}
.tab-header .nav-tabs li.active {
  position: relative;
}
.tab-header .nav-tabs li.active a {
  border: 0;
  background: #ffffff;
  color: #8393a1;
}
@media (max-width: 360px) {
  .tab-header .nav-tabs li {
    width: 100%;
  }
  .tab-header .nav-tabs li a {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding-box;
    background-clip: padding-box;
  }
}
.tab-header.product-tab .nav-tabs li {
  margin-right: 1%;
  min-width: 13%;
}
@media (max-width: 768px) {
  .tab-header.product-tab .nav-tabs li {
    margin-right: 0.5%;
    min-width: 11%;
  }
}
@media (min-width: 600px) {
  .tab-header .submenu-dropdown {
    display: none;
  }
}
@media (max-width: 599px) {
  .tab-header .nav-tabs {
    display: none;
  }
  .tab-header .submenu-dropdown {
    display: block;
  }
}
.submenu-dropdown {
  position: relative;
  margin: 15px 0;
}
.submenu-dropdown .submenu-button {
  width: 100%;
  font-size: 13px;
  box-shadow: none;
  background-color: #fff;
  border-color: #adb8c1;
  text-align: left;
}
.submenu-dropdown .submenu-button:after {
  content: '';
  display: inline-block;
  width: 0;
  height: 0;
  position: absolute;
  right: 12px;
  top: 13px;
  border-top: 8px solid;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  vertical-align: middle;
}
.submenu-dropdown .submenu-button .selected-value {
  color: #8b9aa7;
  font-weight: 600;
}
.submenu-dropdown .submenu-list {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 13px;
  text-align: left;
  list-style: none;
  background-color: #8b9aa7;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}
.submenu-dropdown .submenu-list li > a {
  display: block;
  color: #fff;
  line-height: 1.42857143;
  font-weight: 600;
  padding: 7px 20px;
  clear: both;
  white-space: nowrap;
}
.submenu-dropdown .submenu-list li.active > a,
.submenu-dropdown .submenu-list li:hover > a {
  color: #fff;
  background-color: #636e79;
}
.tab-content {
  border: none;
}
.tab-inner {
  background-color: transparent;
  padding: 30px 0;
}
.breadcrumb-galaxy {
  display: block;
  width: 100%;
  height: 100%;
  margin: 20px auto 10px;
}
.breadcrumb-galaxy li {
  font-weight: 700;
  display: inline-block;
  color: #8b9aa7;
  position: relative;
}
.breadcrumb-galaxy li a {
  font-weight: 700;
  color: #8b9aa7;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  position: relative;
  display: block;
  width: 100%;
  padding-right: 20px;
}
.breadcrumb-galaxy li a:after {
  font-family: 'FontAwesome', serif;
  content: "\f0da";
  font-size: 12px;
  position: absolute;
  right: 5px;
  top: 0;
}
.breadcrumb-galaxy li a:hover {
  color: #f49622;
}
.breadcrumb-galaxy li a:hover:after {
  color: #f49622;
}
.breadcrumb-galaxy li.active {
  color: #f49622;
}
.tab-description .tab-box {
  width: 100%;
  background-color: #f8f8f8;
  border: 1px solid #efefef;
  margin: 10px auto 30px;
  padding: 15px;
}
.tab-description .tab-title {
  position: relative;
  color: #8b9aa7;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 20px;
}
.tab-description .tab-title:after {
  content: '';
  position: absolute;
  top: 25px;
  left: 0;
  width: 50px;
  height: 4px;
  background-color: #8b9aa7;
}
.element {
  background-image: url(../../bundles/app/images/dialog/element.png);
  background-repeat: no-repeat;
  display: block;
}
.element.icon-Air {
  background-position: -5px -5px;
  width: 133px;
  height: 133px;
  margin: 0 auto;
}
.element.icon-Earth {
  background-position: -148px -5px;
  width: 128px;
  height: 128px;
  margin: 0 auto;
}
.element.icon-Fire {
  background-position: -286px -5px;
  width: 134px;
  height: 134px;
  margin: 0 auto;
}
.element.icon-Spirit {
  background-position: -430px -5px;
  width: 133px;
  height: 133px;
  margin: 0 auto;
}
.element.icon-Water {
  background-position: -573px -5px;
  width: 135px;
  height: 135px;
  margin: 0 auto;
}
.icon-camera {
  background: url(../../bundles/app/images/dialog/rule/icon-camera.png) no-repeat;
  display: block;
  width: 38px;
  height: 28px;
}
.quiz-block {
  background: url("../../bundles/app/images/dialog/bg-step1-quiz2.png") no-repeat scroll center center / 100% 100%;
}
.quiz-block .quiz-dialog {
  color: #755220;
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  border-color: rgba(0, 0, 0, 0);
  border-image: url("../../bundles/app/images/dialog/border-step1-quiz2.png") 30 30 30 30;
  border-style: solid;
  border-width: 20px;
  background: transparent;
  padding: 15px;
  position: relative;
  width: 100%;
  display: block;
}
.quiz-block .quiz-dialog.modal-content {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.quiz-block .quiz-dialog .close {
  background-color: #231f20;
  border: 2px solid #ffffff;
  height: 30px;
  position: absolute;
  right: -15px;
  top: -15px;
  vertical-align: middle;
  width: 30px;
  opacity: 1;
  box-shadow: 0 2px 1px #231f20;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
.quiz-block .quiz-dialog .close:after {
  content: '';
  background: url(../../bundles/app/images/dialog/close.png) no-repeat center / 60% 60%;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
  display: block;
}
.quiz-block .quiz-dialog .close:hover {
  background-color: #615658;
}
.quiz-block .quiz-dialog.step1 {
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/dialog/bg-step1-quiz2-before.png") no-repeat scroll center center / 115% auto;
  position: relative;
}
.quiz-block .quiz-dialog .step1-form {
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #755220;
  padding: 15px 40px;
  position: relative;
  z-index: 1;
}
.quiz-block .quiz-dialog .step1-form .title-step1 {
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 30px;
  margin-bottom: 20px;
}
.quiz-block .quiz-dialog .step1-form .form-group {
  text-align: left;
}
.quiz-block .quiz-dialog .step1-form .form-group label {
  font-weight: 700;
  margin-bottom: 2px;
}
.quiz-block .quiz-dialog .step1-form .form-group input {
  color: #333;
  background-color: rgba(255, 255, 255, 0.5);
  border: 0;
  box-shadow: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.quiz-block .quiz-dialog .step1-form .form-group input.isValue {
  background-color: rgba(255, 255, 255, 0.85);
}
.quiz-block .quiz-dialog .step1-form .form-group .galaxy-select .dropdown-toggle {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  line-height: 20px;
  background-color: rgba(255, 255, 255, 0.5);
}
.quiz-block .quiz-dialog .step1-form .form-group .galaxy-select .dropdown-toggle .dropdown-hint {
  display: block;
  text-align: left;
  width: 100%;
}
@media (max-width: 360px) {
  .quiz-block .quiz-dialog .step1-form {
    padding: 5px;
  }
}
.quiz-block .quiz-dialog .message-confirm {
  position: relative;
  text-transform: uppercase;
  margin: 50px 0 25px;
}
.quiz-block .quiz-dialog .message-confirm h1 {
  font-weight: bold;
  font-size: 30px;
}
.quiz-block .quiz-dialog .message-confirm p {
  color: #755220;
  font-weight: bold;
  font-size: 16px;
}
.quiz-block .quiz-dialog .message-confirm:after {
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/dialog/icon-confirm.png") no-repeat scroll center center / 85% auto;
  content: "";
  height: 85px;
  left: -95px;
  position: absolute;
  top: -15px;
  width: 85px;
}
.quiz-block .quiz-dialog .brand-confirm {
  width: 100%;
  display: block;
  border-top: 1px solid #755220;
}
.quiz-block .quiz-dialog .brand-confirm img {
  width: 100%;
  height: auto;
  display: block;
}
.quiz-block .quiz-dialog .result-quiz2 {
  display: block;
  width: 90%;
  text-align: center;
  height: 100%;
  margin: 0 auto;
}
.quiz-block .quiz-dialog .result-quiz2 .electrolyte {
  margin: 20px 0;
  display: block;
}
.quiz-block .quiz-dialog .result-quiz2 .electrolyte .padding-auto {
  padding: 0 8px !important;
}
.quiz-block .quiz-dialog .result-quiz2 .electrolyte .title-quiz {
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 15px;
  line-height: 18px;
}
.quiz-block .quiz-dialog .result-quiz2 .electrolyte p {
  color: #755220;
  padding: 0 15px;
}
.quiz-block .quiz-dialog .result-quiz2 .electrolyte .color-fit {
  width: 100%;
  height: 85px;
  position: relative;
  border: 5px solid white;
  margin-top: 5px;
}
.quiz-block .quiz-dialog .result-quiz2 .electrolyte .color-fit .info-color {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 3px;
}
.quiz-block .quiz-dialog .result-quiz2 .electrolyte .color-fit .info-color p {
  color: white;
  padding: 0;
  text-align: left;
  font-size: 10px;
  white-space: nowrap;
  width: 100%;
  font-weight: bold;
  text-transform: uppercase;
  overflow: hidden;
  text-overflow: ellipsis;
}
.quiz-block .quiz-dialog .btn-move-step {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  background-color: white;
  color: #755220;
  font-size: 20px;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  min-width: 150px;
  margin: 10px auto;
}
.quiz-block .quiz-dialog .btn-move-step:hover {
  background-color: whitesmoke;
}
*,
*:before,
*:after {
  box-sizing: border-box;
}
.range-slider {
  margin: 60px 0 0 0;
}
.range-slider {
  width: 100%;
}
.rule-block {
  background: #ffffff;
}
.rule-block .close {
  background-color: #231f20;
  border: 2px solid #ffffff;
  height: 30px;
  position: absolute;
  right: 5px;
  top: 5px;
  vertical-align: middle;
  width: 30px;
  opacity: 1;
  z-index: 3;
  box-shadow: 0 2px 1px #231f20;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
.rule-block .close:after {
  content: '';
  background: url(../../bundles/app/images/dialog/close.png) no-repeat center / 60% 60%;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
  display: block;
}
.rule-block .close:hover {
  background-color: #615658;
}
.rule-block .rule-dialog {
  position: relative;
  width: 100%;
  display: block;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.rule-block .rule-dialog:before,
.rule-block .rule-dialog:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
}
.rule-block .rule-dialog:before {
  background-position: 0 0, 0 100% ;
  background-repeat: no-repeat;
  -webkit-background-size: 100% 10px;
  -moz-background-size: 100% 10px;
  background-size: 100% 10px;
  background-image: -webkit-linear-gradient(to right, #f0b5b9 0%, #c2b4c8 100%), -webkit-linear-gradient(right, #98b2d7 0%, #c4b4c8 100%);
  background-image: -moz-linear-gradient(to right, #f0b5b9 0%, #c2b4c8 100%), -moz-linear-gradient(right, #98b2d7 0%, #c4b4c8 100%);
  background-image: -o-linear-gradient(to right, #f0b5b9 0%, #c2b4c8 100%), -o-linear-gradient(right, #98b2d7 0%, #c4b4c8 100%);
  background-image: linear-gradient(to right, #f0b5b9 0%, #c2b4c8 100%), linear-gradient(to left, #98b2d7 0%, #c4b4c8 100%);
  z-index: 1;
}
.rule-block .rule-dialog:after {
  background-position: left top, right top;
  background-repeat: no-repeat;
  -webkit-background-size: 10px 100%;
  -moz-background-size: 10px 100%;
  background-size: 10px 100%;
  top: 0;
  background-image: -webkit-linear-gradient(top, #f0b5b9 0%, #c4b4c8 100%), -webkit-linear-gradient(to top, #98b2d7 0%, #c2b4c8 100%);
  background-image: -moz-linear-gradient(top, #f0b5b9 0%, #c4b4c8 100%), -moz-linear-gradient(to top, #98b2d7 0%, #c2b4c8 100%);
  background-image: -o-linear-gradient(top, #f0b5b9 0%, #c4b4c8 100%), -o-linear-gradient(to top, #98b2d7 0%, #c2b4c8 100%);
  background-image: linear-gradient(to bottom, #f0b5b9 0%, #c4b4c8 100%), linear-gradient(to top, #98b2d7 0%, #c2b4c8 100%);
}
.rule-block .rule-dialog .container-rule {
  padding: 20px 15px;
  position: relative;
  z-index: 2;
}
.rule-block .rule-dialog .rule-title {
  color: #333333;
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  padding-bottom: 10px;
  margin-bottom: 20px;
  margin-top: 20px;
  border-bottom: 1px solid #ccc;
}
.rule-block .rule-dialog .image-rule {
  display: block;
  width: 100%;
  margin-bottom: 20px;
}
.rule-block .rule-dialog .image-rule .carousel-inner {
  padding-bottom: 30px;
}
.rule-block .rule-dialog .image-rule .carousel-indicators {
  margin-left: -32%;
  bottom: 15px;
}
.rule-block .rule-dialog .image-rule .carousel-indicators li {
  margin-left: 15px;
  border: 1px solid #a3a3a3;
}
.rule-block .rule-dialog .image-rule .carousel-indicators li.active {
  background-color: #a3a3a3;
}
.rule-block .rule-dialog .image-rule .carousel-caption {
  bottom: 0;
  color: #333333;
  height: 100%;
  left: 0;
  padding-bottom: 20px;
  padding-top: 20px;
  position: relative;
  right: 0;
  text-align: left;
  text-shadow: none;
  width: 100%;
  z-index: 10;
}
.rule-block .rule-dialog .image-rule img {
  width: 100%;
  display: block;
}
.rule-block .rule-dialog .content-rule {
  display: block;
  width: 100%;
}
.rule-block .rule-dialog .content-rule h1 {
  font-weight: bold;
  color: #333333;
  font-size: 16px;
}
.rule-block .rule-dialog .content-rule p {
  color: #333333;
  margin-bottom: 10px;
}
.rule-block .rule-dialog .content-rule .message-confirm-rule {
  margin-top: 75px;
  position: relative;
  color: #98b2d7;
}
.rule-block .rule-dialog .content-rule .message-confirm-rule:after {
  content: '';
  display: block;
  position: absolute;
  background: url(../../bundles/app/images/dialog/icon-confirm-rule.png);
  width: 40px;
  height: 40px;
  left: 50%;
  margin-left: -20px;
  top: -50px;
}
.rule-block .rule-dialog .btn-close-rule {
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid #b0b0b0;
  color: #737373;
  display: block;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  margin: 10px auto 20px;
  min-width: 50px;
  padding: 5px 26px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  position: relative;
  z-index: 2;
}
.rule-block .rule-dialog .btn-close-rule:hover {
  background-color: rgba(223, 223, 223, 0.5);
}
.rule-block .rule-dialog .btn-close-rule.btn-pink {
  font-weight: 600;
  text-transform: uppercase;
  border: 1px solid #f0b5b9;
  background-color: #f0b5b9;
  color: #ffffff;
}
.rule-block .rule-dialog .btn-close-rule.btn-pink:hover {
  background-color: #ffc1c5;
}
.rule-block .rule-dialog .block-content {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  margin-top: 40px;
  padding: 0 30px;
  z-index: 2;
}
.rule-block .rule-dialog .block-content .title-share {
  position: absolute;
  left: 0;
  top: -35px;
  font-size: 12px;
  background-color: #e7b5bc;
  padding: 5px 15px 5px 27px;
  color: white;
  text-transform: uppercase;
  font-weight: 600;
}
.rule-block .rule-dialog .block-content .form-group {
  position: relative;
}
.rule-block .rule-dialog .block-content .form-group label {
  margin-bottom: 8px;
}
.rule-block .rule-dialog .block-content .form-group input,
.rule-block .rule-dialog .block-content .form-group textarea {
  border: 1px solid #bebebe;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.rule-block .rule-dialog .block-content .form-group i.note {
  position: absolute;
  bottom: 2px;
  right: 10px;
  font-size: 10px;
}
.rule-block .rule-dialog .block-content .form-group .btn-rule {
  background-color: rgba(0, 0, 0, 0);
  border: 1px solid #b0b0b0;
  color: #737373;
  display: inline;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  margin-left: 10px;
  margin-bottom: 20px;
  min-width: 50px;
  padding: 5px 26px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.rule-block .rule-dialog .block-content .form-group .btn-rule:hover {
  background-color: rgba(223, 223, 223, 0.5);
}
.rule-block .rule-dialog .block-content .form-group .btn-rule.btn-pink {
  font-weight: 600;
  text-transform: uppercase;
  border: 1px solid #f0b5b9;
  background-color: #f0b5b9;
  color: #ffffff;
}
.rule-block .rule-dialog .block-content .form-group .btn-rule.btn-pink:hover {
  background-color: #ffc1c5;
}
.rule-block .rule-dialog .block-content .form-group .btn-rule.btn-pink.disabled {
  opacity: 0.3;
}
.rule-block .rule-dialog .block-content .form-group .btn-rule.btn-pink.disabled:hover {
  opacity: 0.3;
  background-color: #f0b5b9;
}
.rule-block .rule-dialog .background-rule {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #aaaaaa;
}
.rule-block .rule-dialog .background-rule .inputfile {
  height: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  width: 0;
}
.rule-block .rule-dialog .background-rule .input-bg {
  display: block;
  padding-top: 200px;
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar {
  display: inline-block;
  height: 200px;
  left: 50%;
  margin-left: -100px;
  margin-top: 65px;
  position: absolute;
  top: 0;
  width: 200px;
  z-index: 1;
  background: no-repeat center;
  background-size: cover;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  background-color: #eeeeee;
  background-image: -webkit-gradient(linear, left top, right top, from(#eeeeee), to(#aaaaaa));
  background-image: -webkit-linear-gradient(left, #eeeeee, #aaaaaa);
  background-image: -moz-linear-gradient(left, #eeeeee, #aaaaaa);
  background-image: -ms-linear-gradient(left, #eeeeee, #aaaaaa);
  background-image: -o-linear-gradient(left, #eeeeee, #aaaaaa);
  border: 3px solid white;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar:hover {
  box-shadow: 0 0 5px #fff;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .cover-avatar {
  border-radius: 50%;
  display: block;
  height: 180px;
  left: 7px;
  position: absolute;
  top: 7px;
  width: 180px;
  background-size: cover;
  background: #333333 no-repeat center;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar.square-active {
  border-radius: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar.square-active .cover-avatar {
  border-radius: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar.square-active .cover-avatar .cr-boundary {
  border-radius: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .result-upload {
  height: 180px;
  width: 180px;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .result-upload.circle {
  display: none;
  left: 0;
  position: absolute;
  top: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .result-upload.circle .circle-style {
  background-position: center center;
  background-size: cover;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  display: block;
  width: 100%;
  height: 100%;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .result-upload.square {
  display: none;
  left: 13px;
  position: absolute;
  top: 12px;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .result-upload.square .square-style {
  background-position: center center;
  background-size: cover;
  display: block;
  width: 100%;
  height: 100%;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .result-upload.hexagon {
  display: none;
  height: 175px;
  left: -100px;
  overflow: hidden;
  position: absolute;
  top: 12px;
  visibility: hidden;
  width: 400px;
  -webkit-transform: rotate(120deg);
  -moz-transform: rotate(120deg);
  -ms-transform: rotate(120deg);
  -o-transform: rotate(120deg);
  transform: rotate(120deg);
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .result-upload.hexagon .hexagon-style1 {
  overflow: hidden;
  width: 100%;
  height: 100%;
  -webkit-transform: rotate(-60deg);
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -o-transform: rotate(-60deg);
  transform: rotate(-60deg);
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .result-upload.hexagon .hexagon-style2 {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: 50%;
  visibility: visible;
  -webkit-transform: rotate(-60deg);
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -o-transform: rotate(-60deg);
  transform: rotate(-60deg);
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .fileUpload {
  border: 1px dashed #ffffff;
  height: 80px;
  left: 50%;
  margin-top: -40px;
  margin-left: -70px;
  overflow: hidden;
  padding: 10px 20px;
  position: absolute;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  top: 50%;
  width: 140px;
  z-index: 2;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .fileUpload i,
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .fileUpload span {
  margin: auto;
  text-align: center;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .fileUpload span {
  width: auto;
  height: 100%;
  display: block;
  font-weight: 700;
  color: white;
  font-size: 16px;
  margin: 5px auto;
  text-align: center;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .fileUpload input.upload {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-size: 20px;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  bottom: -110%;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .action-rage {
  display: block;
  position: relative;
  width: 100%;
  height: auto;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .action-rage .zoom-out,
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .action-rage .zoom-in {
  position: absolute;
  top: -5px;
  font-size: 18px;
  font-weight: 700;
  color: #818181;
  cursor: pointer;
  line-height: 10px;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .action-rage .zoom-out:hover,
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .action-rage .zoom-in:hover {
  color: #415B76;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .action-rage .zoom-out {
  top: -7px;
  left: -15px;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .action-rage .zoom-in {
  right: -15px;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .submit-avatar {
  display: block;
  margin: 15px auto;
  text-align: center;
  width: 100%;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .submit-avatar .btn-rule {
  background-color: #ffffff;
  border: 1px solid #b0b0b0;
  color: #737373;
  display: inline-block;
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 15px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .submit-avatar .btn-rule:hover {
  background-color: #dfdfdf;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .submit-avatar .btn-rule.btn-dark {
  font-weight: 600;
  border: 1px solid #f0b5b9;
  background-color: #f0b5b9;
  color: #ffffff;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar .submit-avatar .btn-rule.btn-dark:hover {
  background-color: #ffc1c5;
}
@media (max-width: 360px) {
  .rule-block .rule-dialog .background-rule .input-bg .input-avatar .action-avatar {
    bottom: 25%;
  }
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__range {
  -webkit-appearance: none;
  width: 100%;
  height: 2px;
  background: #818181;
  outline: none;
  padding: 0;
  margin: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__range::-webkit-slider-thumb {
  appearance: none;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #818181;
  cursor: pointer;
  transition: background 0.15s ease-in-out;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__range::-webkit-slider-thumb:hover {
  background: #2c3e50;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__range:active::-webkit-slider-thumb {
  background: #2c3e50;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__range::-moz-range-thumb {
  width: 15px;
  height: 15px;
  border: 0;
  border-radius: 50%;
  background: #818181;
  cursor: pointer;
  transition: background 0.15s ease-in-out;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__range::-moz-range-thumb:hover {
  background: #2c3e50;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__range:active::-moz-range-thumb {
  background: #2c3e50;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__value {
  display: inline-block;
  position: relative;
  width: 60px;
  color: #ffffff;
  line-height: 20px;
  text-align: center;
  border-radius: 3px;
  background: #818181;
  padding: 5px 10px;
  margin-left: 8px;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar .range-slider__value:after {
  position: absolute;
  top: 8px;
  left: -7px;
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-right: 7px solid #818181;
  border-bottom: 7px solid transparent;
  content: '';
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar ::-moz-range-track {
  background: #818181;
  border: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .input-avatar input::-moz-focus-inner,
.rule-block .rule-dialog .background-rule .input-bg .input-avatar input::-moz-focus-outer {
  border: 0;
}
@media (max-width: 480px) {
  .rule-block .rule-dialog .background-rule .input-bg .input-avatar {
    margin-top: 25px;
  }
}
@media (max-width: 360px) {
  .rule-block .rule-dialog .background-rule .input-bg .input-avatar {
    top: 0;
  }
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor {
  display: block;
  position: relative;
  width: 100%;
  margin-top: 85px;
  background-color: white;
}
@media (max-width: 480px) {
  .rule-block .rule-dialog .background-rule .input-bg .action-editor {
    margin-top: 50px;
  }
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor:after {
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/dialog/rule/create-bg-rule.png") no-repeat top left / 100% auto;
  content: "";
  height: 350px;
  left: 0;
  position: absolute;
  top: -285px;
  width: 100%;
}
@media (max-width: 480px) {
  .rule-block .rule-dialog .background-rule .input-bg .action-editor:after {
    top: -220px;
  }
}
@media (max-width: 360px) {
  .rule-block .rule-dialog .background-rule .input-bg .action-editor:after {
    top: -155px;
  }
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post:before {
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/landing/paint-roller.png") no-repeat scroll center top / 100% auto;
  content: "";
  height: 60px;
  left: 50%;
  margin-left: -165px;
  position: absolute;
  top: -80px;
  width: 300px;
  z-index: 3;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block {
  display: block;
  height: 100%;
  padding: 5px 30px 30px;
  position: relative;
  width: 100%;
  z-index: 2;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block h1,
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block p,
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block .post-info {
  width: 100%;
  display: block;
  text-align: center;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block h1.title-post {
  font-family: "iCielBambola", sans-serif;
  font-size: 26px;
  letter-spacing: 1px;
  color: #7b9bcc;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block p,
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block .post-info {
  max-width: 450px;
  margin: 0 auto 10px;
  color: #333333;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block .post-info span {
  display: block;
  width: 100%;
  text-align: center;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block .post-info span.person-post {
  font-style: italic;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor.result-post .post-block .post-info span.date-post {
  color: #959595;
}
@media (max-width: 360px) {
  .rule-block .rule-dialog .background-rule .input-bg .action-editor:after {
    top: -145px;
  }
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .background-control,
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control {
  display: block;
  position: relative;
  z-index: 2;
  height: 65px;
  padding: 5px 15px 0 30px;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .background-control p,
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control p {
  text-align: left;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control {
  text-align: center;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control p {
  text-align: center;
}
@media (max-width: 767px) {
  .rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control p {
    text-align: left;
  }
}
@media (max-width: 767px) {
  .rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control {
    text-align: left;
  }
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .background-control .item-background {
  cursor: pointer;
  box-shadow: 2px 2px 2px #8a8a8a;
  background-position: center center;
  background-size: cover;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  border-radius: 4px;
  display: inline-block;
  height: 25px;
  margin-right: 5px;
  margin-top: 5px;
  width: 25px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .background-control .item-background.active,
.rule-block .rule-dialog .background-rule .input-bg .action-editor .background-control .item-background:hover {
  box-shadow: 0 0 2px #8a8a8a inset;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 30px;
  margin-right: 5px;
  margin-top: 5px;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-circle {
  cursor: pointer;
  background: url(../../bundles/app/images/dialog/rule/icon-circle.png) no-repeat center center;
  background-size: cover;
  width: 29px;
  height: 30px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-circle.active,
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-circle:hover {
  background: url(../../bundles/app/images/dialog/rule/icon-circle-active.png) no-repeat center center;
  background-size: cover;
  width: 25px;
  height: 26px;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-square {
  cursor: pointer;
  display: inline-block;
  background: url(../../bundles/app/images/dialog/rule/icon-square.png) no-repeat center center;
  background-size: cover;
  width: 29px;
  height: 29px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-square.active,
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-square:hover {
  background: url(../../bundles/app/images/dialog/rule/icon-square-active.png) no-repeat center center;
  background-size: cover;
  width: 25px;
  height: 25px;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-hexagon {
  cursor: pointer;
  display: inline-block;
  background: url(../../bundles/app/images/dialog/rule/icon-hexagon.png) no-repeat center center;
  background-size: cover;
  width: 29px;
  height: 30px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
}
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-hexagon.active,
.rule-block .rule-dialog .background-rule .input-bg .action-editor .box-control .control-item .control-hexagon:hover {
  background: url(../../bundles/app/images/dialog/rule/icon-hexagon-active.png) no-repeat center center;
  background-size: cover;
  width: 27px;
  height: 25px;
}
.rule-block .rule-dialog.modal-content {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.rule-block.create-form .rule-dialog {
  padding: 0;
}
.rule-block .box-conversation {
  display: block;
  width: 100%;
  padding: 20px 10px;
}
.rule-block .box-conversation .conversation-logo {
  padding: 0 0 20px;
  display: block;
  text-align: center;
  width: 100%;
  border-bottom: 1px solid #afafaf;
}
.rule-block .box-conversation .conversation-content {
  display: block;
  width: 100%;
  position: relative;
  padding-top: 20px;
}
.no-padding-right {
  padding-right: 0 !important;
}
.no-padding-left {
  padding-left: 0 !important;
}
@media (max-width: 980px) {
  .no-padding-right {
    padding-right: 15px !important;
  }
  .no-padding-left {
    padding-left: 15px !important;
  }
}
.cr-slider-wrap {
  position: relative;
}
.cr-slider-wrap:after,
.cr-slider-wrap:before {
  font-family: 'FontAwesome', serif;
  position: absolute;
  top: -1px;
}
.cr-slider-wrap:after {
  right: -15px;
  content: "\f067";
}
.cr-slider-wrap:before {
  left: -15px;
  content: "\f068";
}
a.btn-share-result {
  margin: 20px auto;
  display: block;
  width: 186px;
  height: 55px;
  background-color: transparent;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
a.btn-share-result.min-btn {
  width: 178px;
  height: 50px;
}
a.btn-share-result:hover {
  background-color: rgba(250, 232, 229, 0.8);
}
.question-dialog {
  min-height: 970px;
  background: #ffffff url("../../bundles/app/images/dialog/bg-step1-quiz1-main.png") no-repeat scroll center bottom / 100% auto;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
}
.question-dialog.medium {
  min-height: 670px;
}
.question-dialog.confirm {
  min-height: 920px;
}
@media (max-width: 360px) {
  .question-dialog.confirm {
    min-height: 640px;
  }
}
.question-dialog .close {
  background-color: #231f20;
  border: 2px solid #ffffff;
  height: 30px;
  position: absolute;
  right: 5px;
  top: 5px;
  vertical-align: middle;
  width: 30px;
  opacity: 1;
  z-index: 3;
  box-shadow: 0 2px 1px #231f20;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
.question-dialog .close:after {
  content: '';
  background: url(../../bundles/app/images/dialog/close.png) no-repeat center / 60% 60%;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
  display: block;
}
.question-dialog .close:hover {
  background-color: #615658;
}
.question-dialog:before {
  content: '';
  background: url("../../bundles/app/images/dialog/bg-step1-quiz1.png") no-repeat scroll center bottom / 100% auto;
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  bottom: 0;
}
.question-dialog:after {
  content: '';
  background: url("../../bundles/app/images/dialog/bg-step1-quiz1-fade.png") no-repeat scroll center bottom / 100% auto;
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  bottom: 0;
}
.question-dialog.confirm {
  background: #ffffff url("../../bundles/app/images/dialog/bg-quiz-1-confirm.jpg") no-repeat scroll center top / 100% auto;
}
.question-dialog.confirm:before {
  background: none;
}
.question-dialog.confirm:after {
  background: none;
}
.question-dialog.modal-content {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.question-dialog #quiz1 {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: block;
  padding: 30px 15px;
}
.question-dialog #quiz1 .step-process {
  display: table;
  width: 100%;
  padding: 0;
  margin: 0;
}
.question-dialog #quiz1 .step-process li {
  display: table-cell;
  position: relative;
}
.question-dialog #quiz1 .step-process li:after {
  content: '';
  height: 1px;
  width: -moz-calc(100% - 50px);
  width: -webkit-calc(100% - 50px);
  width: calc(100% - 50px);
  position: absolute;
  right: 5px;
  top: 50%;
  z-index: -1;
  background-color: #D5D5D5;
}
.question-dialog #quiz1 .step-process li p {
  color: #AAAAAA;
  font-weight: bold;
  width: -moz-calc(100% - 50px);
  width: -webkit-calc(100% - 50px);
  width: calc(100% - 50px);
  position: absolute;
  right: 5px;
  top: 0;
  text-align: center;
}
.question-dialog #quiz1 .step-process li span.number {
  width: 37px;
  height: 37px;
  display: block;
  background-color: #D5D5D5;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  position: relative;
  z-index: 0;
  left: 0;
  top: 0;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.question-dialog #quiz1 .step-process li span.number span {
  position: absolute;
  display: block;
  left: 1px;
  top: 1px;
  border: 1px solid white;
  width: 35px;
  height: 35px;
  color: #AAAAAA;
  line-height: 31px;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  background-color: #D5D5D5;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  z-index: 1;
}
.question-dialog #quiz1 .step-process li.active p,
.question-dialog #quiz1 .step-process li.done p {
  background: white;
  color: black;
  text-shadow: 1px 1px 0 #ffffff, 1px -1px 0 #ffffff, -1px -1px 0 #ffffff, -1px 1px 0 #ffffff;
}
.question-dialog #quiz1 .step-process li.active p::before,
.question-dialog #quiz1 .step-process li.done p::before,
.question-dialog #quiz1 .step-process li.active p::after,
.question-dialog #quiz1 .step-process li.done p::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
}
.question-dialog #quiz1 .step-process li.active p::before,
.question-dialog #quiz1 .step-process li.done p::before {
  background: linear-gradient(to right, #289ed5, #289ed5, #d36668, #d36668, #d36668);
  content: '';
  display: block;
  mix-blend-mode: screen;
}
.question-dialog #quiz1 .step-process li.active p::after,
.question-dialog #quiz1 .step-process li.done p::after {
  content: 'CSS Gradient Text';
  background: #ffffff;
  color: white;
  mix-blend-mode: multiply;
}
.question-dialog #quiz1 .step-process li.active:after,
.question-dialog #quiz1 .step-process li.done:after {
  background-color: #289ed5;
  background-image: -webkit-gradient(linear, left top, right top, from(#289ed5), to(#d36668));
  background-image: -webkit-linear-gradient(left, #289ed5, #d36668);
  background-image: -moz-linear-gradient(left, #289ed5, #d36668);
  background-image: -ms-linear-gradient(left, #289ed5, #d36668);
  background-image: -o-linear-gradient(left, #289ed5, #d36668);
}
.question-dialog #quiz1 .step-process li.active span.number,
.question-dialog #quiz1 .step-process li.done span.number {
  background-color: #289ed5;
  background-image: -webkit-gradient(linear, left top, right top, from(#289ed5), to(#d36668));
  background-image: -webkit-linear-gradient(left, #289ed5, #d36668);
  background-image: -moz-linear-gradient(left, #289ed5, #d36668);
  background-image: -ms-linear-gradient(left, #289ed5, #d36668);
  background-image: -o-linear-gradient(left, #289ed5, #d36668);
}
.question-dialog #quiz1 .step-process li.active span.number span,
.question-dialog #quiz1 .step-process li.done span.number span {
  color: white;
  background-color: #289ed5;
  background-image: -webkit-gradient(linear, left top, right top, from(#289ed5), to(#d36668));
  background-image: -webkit-linear-gradient(left, #289ed5, #d36668);
  background-image: -moz-linear-gradient(left, #289ed5, #d36668);
  background-image: -ms-linear-gradient(left, #289ed5, #d36668);
  background-image: -o-linear-gradient(left, #289ed5, #d36668);
}
.question-dialog #quiz1 .step-content {
  margin-top: 25px;
  display: block;
  width: 100%;
}
@media (max-width: 360px) {
  .question-dialog #quiz1 .step-content {
    margin-top: 45px;
  }
}
.question-dialog #quiz1 .step-content .title-step,
.question-dialog #quiz1 .step-content .title-step2 {
  font-weight: bold;
  font-size: 24px;
  padding: 0 15px;
  text-transform: uppercase;
  text-align: center;
  color: #231F20;
  line-height: 30px;
  margin-bottom: 15px;
}
.question-dialog #quiz1 .step-content .title-step span,
.question-dialog #quiz1 .step-content .title-step2 span {
  font-weight: bold;
  display: inline-block;
  background-color: #231F20;
  color: white;
  padding: 2px 5px;
}
.question-dialog #quiz1 .step-content .title-step2 {
  font-size: 16px;
  text-transform: none;
  font-weight: 600;
}
.question-dialog #quiz1 .step-content .sort-view {
  width: 100%;
  text-align: center;
  color: #231F20;
}
.question-dialog #quiz1 .step-content .question-process {
  display: table;
  width: 100%;
  padding: 0;
  margin-top: 20px;
}
.question-dialog #quiz1 .step-content .question-process li {
  display: table-cell;
  position: relative;
}
.question-dialog #quiz1 .step-content .question-process li span {
  position: absolute;
  display: block;
  left: 1px;
  top: 1px;
  border: 1px solid white;
  width: 28px;
  height: 28px;
  color: #AAAAAA;
  line-height: 24px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  background-color: #D5D5D5;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  z-index: 1;
  cursor: pointer;
}
.question-dialog #quiz1 .step-content .question-process li.active span {
  background-color: #289ed5;
  background-image: -webkit-gradient(linear, left top, right top, from(#289ed5), to(#d36668));
  background-image: -webkit-linear-gradient(left, #289ed5, #d36668);
  background-image: -moz-linear-gradient(left, #289ed5, #d36668);
  background-image: -ms-linear-gradient(left, #289ed5, #d36668);
  background-image: -o-linear-gradient(left, #289ed5, #d36668);
  color: white;
}
.question-dialog #quiz1 .step-content .root-item {
  margin-top: 50px;
  display: block;
  width: 100%;
}
.question-dialog #quiz1 .step-content .root-item .question-content {
  color: #414042;
  font-weight: bold;
  font-size: 16px;
  text-align: center;
  margin-bottom: 25px;
}
.question-dialog #quiz1 .step-content .root-item .radio.isImage {
  display: block;
  width: 100%;
  text-align: center;
}
.question-dialog #quiz1 .step-content .root-item .radio.isImage label {
  display: block;
  padding: 0;
  margin: 0;
}
.question-dialog #quiz1 .step-content .root-item .radio.isImage label img,
.question-dialog #quiz1 .step-content .root-item .radio.isImage label input,
.question-dialog #quiz1 .step-content .root-item .radio.isImage label span {
  display: block;
  margin: auto;
  position: relative;
  text-align: center;
}
.question-dialog #quiz1 .step-content .root-item .radio.isImage label input,
.question-dialog #quiz1 .step-content .root-item .radio.isImage label span {
  padding: 3px 10px;
  color: #414042;
  width: 100%;
}
.question-dialog #quiz1 .step-content .root-item .radio.isImage label input {
  height: 20px;
  margin: 5px auto 0;
  width: 20px;
}
.question-dialog #quiz1 .step-content .root-item .radio.isQuestion {
  display: block;
  width: 100%;
}
.question-dialog #quiz1 .step-content .root-item .radio.isQuestion label {
  display: block;
  color: #414042;
  margin: 0;
  font-size: 14px;
}
.question-dialog #quiz1 .step-content .form-group {
  margin-bottom: 20px;
  display: block;
  width: 100%;
  color: #414042;
}
.question-dialog #quiz1 .step-content .form-group label {
  display: block;
  text-align: center;
  margin-bottom: 8px;
  font-size: 14px;
}
.question-dialog #quiz1 .step-content .form-group input {
  background-color: transparent;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: #414042;
  border: 1px solid transparent;
  -moz-border-image: -moz-linear-gradient(right, #c5c5c5 0%, #f4f4f4 100%);
  -webkit-border-image: -webkit-linear-gradient(right, #c5c5c5 0%, #f4f4f4 100%);
  border-image: linear-gradient(to left, #c5c5c5 0%, #f4f4f4 100%);
  border-image-slice: 1;
}
.question-dialog #quiz1 .step-content .submit-result {
  display: block;
  padding-top: 45px;
  width: 100%;
  margin-top: 15px;
  border-top: 1px solid #c5c5c5;
  position: relative;
  z-index: 1;
}
.question-dialog #quiz1 .step-content .submit-result .btn-result {
  background: url(../../bundles/app/images/dialog/btn-result.png) no-repeat center center / cover;
  width: 187px;
  height: 56px;
  display: block;
  margin: 0 auto;
  position: relative;
  cursor: inherit;
  z-index: -1;
  border: 1px solid rgba(0, 0, 0, 0);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.question-dialog #quiz1 .step-content .submit-result .btn-result.active {
  cursor: pointer;
  background: url(../../bundles/app/images/dialog/btn-result-active.png) no-repeat center center / cover;
}
.question-dialog .display-result {
  display: block;
  position: relative;
  z-index: 2;
  padding: 60px 90px;
  text-align: center;
}
@media (max-width: 480px) {
  .question-dialog .display-result {
    padding: 40px 25px;
  }
}
@media (max-width: 360px) {
  .question-dialog .display-result {
    padding: 30px 20px;
  }
}
.question-dialog .display-result h1.title-result {
  font-size: 26px;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 15px;
  font-weight: bold;
}
.question-dialog .display-result h1.title-result.color-orange {
  color: #F78E1D;
}
.question-dialog .display-result h1.title-result.color-gray {
  color: #808285;
}
.question-dialog .display-result h1.title-result.color-blue {
  color: #588CB3;
}
.question-dialog .display-result h1.title-result.color-purple {
  color: #692981;
}
.question-dialog .display-result h1.title-result.color-green {
  color: #6F9F6A;
}
.question-dialog .display-result h1.title-result.color-red {
  color: #DA310A;
}
.question-dialog .display-result p.content-result {
  margin: 20px 0;
  font-size: 14px;
  color: #414042;
}
.question-dialog .ava-confirm {
  position: relative;
  display: block;
  width: 100%;
}
.question-dialog .ava-confirm img {
  left: 50%;
  top: -175px;
  position: absolute;
  margin-left: -75px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  box-shadow: 0 0 15px #ffffff;
  z-index: 1;
  width: 150px;
  height: 150px;
}
.question-dialog .ava-confirm:after {
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/dialog/bg-avatar.png") no-repeat scroll center center / cover;
  content: "";
  height: 261px;
  left: 50%;
  margin-left: -163px;
  position: absolute;
  top: -175px;
  width: 326px;
  z-index: 0;
}
.question-dialog .step-confirm {
  display: block;
  z-index: 2;
  margin: 0 25px;
  padding: 10px 40px;
  text-align: center;
  position: relative;
}
.question-dialog .step-confirm:first-child {
  margin-top: 305px;
  padding: 10px 90px;
}
@media (max-width: 480px) {
  .question-dialog .step-confirm:first-child {
    margin-top: 225px;
    padding: 10px 40px;
  }
}
@media (max-width: 360px) {
  .question-dialog .step-confirm:first-child {
    margin-top: 175px;
    padding: 10px 40px;
  }
}
.question-dialog .step-confirm:after {
  height: 1px;
  width: 100%;
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #289ed5;
  background-image: -webkit-gradient(linear, left top, right top, from(#289ed5), to(#d36668));
  background-image: -webkit-linear-gradient(left, #289ed5, #d36668);
  background-image: -moz-linear-gradient(left, #289ed5, #d36668);
  background-image: -ms-linear-gradient(left, #289ed5, #d36668);
  background-image: -o-linear-gradient(left, #289ed5, #d36668);
}
.question-dialog .step-confirm:last-child:after {
  height: 0;
}
.question-dialog .step-confirm h1.intro-confirm {
  color: #231F20;
  text-align: center;
  padding: 0;
  font-weight: bold;
  margin-bottom: 10px;
  font-size: 20px;
  text-transform: uppercase;
}
.question-dialog .step-confirm h2.name-intro {
  color: #A06D2E;
  font-weight: bold;
  font-size: 28px;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 20px;
}
.question-dialog .step-confirm a.btn-play-new-game {
  margin: 20px auto;
  display: block;
  width: 186px;
  height: 55px;
  background-color: transparent;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.question-dialog .step-confirm a.btn-play-new-game:hover {
  background-color: rgba(250, 232, 229, 0.8);
}
.overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: #522761;
  z-index: 100;
}
.wrapper {
  width: 500px;
  height: 500px;
  background-color: #522761;
  display: flex;
  flex-flow: row wrap;
  position: relative;
  top: 50%;
  margin-left: -250px;
  margin-top: -250px;
  left: 50%;
  padding: 3px;
}
.galaxy-banner {
  position: relative;
  width: 100%;
  height: auto;
  background-color: #fff;
}
.galaxy-banner:after {
  content: '';
  left: 0;
  position: absolute;
  bottom: -4px;
  border: 0;
  height: 8px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
}
.groupBanner {
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  position: relative;
}
.groupBanner #galaxyBanner {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: transparent;
  background: url("../../bundles/app/images/banner/banner-after.png") no-repeat top right / 100% auto;
  background-blend-mode: multiply;
  right: 0;
  top: 0;
  display: block;
  z-index: 0;
}
@media (max-width: 480px) {
  .groupBanner #galaxyBanner {
    height: -moz-calc(100% - 5px);
    height: -webkit-calc(100% - 5px);
    height: calc(100% - 5px);
  }
}
.groupBanner img {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.flower-control {
  position: relative;
}
.color-flower {
  display: block;
  position: absolute;
  bottom: 44px;
  left: 105px;
  z-index: 2;
}
.color-flower .petal {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 64px;
  height: 64px;
  cursor: pointer;
  border-radius: 10px 500px;
  box-shadow: 2px 2px 8px rgba(246, 246, 246, 0.3);
  box-shadow: inset 10px 20px 10px rgba(255, 255, 255, 0.12);
  -webkit-transform-origin: 0 0.5%;
  -moz-transform-origin: 0 0.5%;
  -ms-transform-origin: 0 0.5%;
  -o-transform-origin: 0 0.5%;
  -webkit-transition: all 1.25s ease;
  -moz-transition: all 1.25s ease;
  -o-transition: all 1.25s ease;
  -ms-transition: all 1.25s ease;
  transition: all 1.25s ease;
  border-top: 2px solid #ffffff;
}
.color-flower .petal:hover {
  opacity: 0.6;
  -webkit-transform-origin: 0 -5%;
  -moz-transform-origin: 0 -5%;
  -ms-transform-origin: 0 -5%;
  -o-transform-origin: 0 -5%;
}
.color-flower .p1 {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(155, 212, 238, 0.7)), to(#1578ab));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(155, 212, 238, 0.7), #1578ab);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(155, 212, 238, 0.7), #1578ab);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(155, 212, 238, 0.7), #1578ab);
  /* Opera cannot do radial gradients yet */
  z-index: 1;
}
.color-flower .p2 {
  -webkit-transform: rotate(75deg);
  -moz-transform: rotate(75deg);
  -ms-transform: rotate(75deg);
  -o-transform: rotate(75deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(186, 210, 237, 0.7)), to(#0141b2));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(186, 210, 237, 0.7), #0141b2);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(186, 210, 237, 0.7), #0141b2);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(186, 210, 237, 0.7), #0141b2);
  /* Opera cannot do radial gradients yet */
  z-index: 2;
}
.color-flower .p3 {
  -webkit-transform: rotate(105deg);
  -moz-transform: rotate(105deg);
  -ms-transform: rotate(105deg);
  -o-transform: rotate(105deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(149, 126, 190, 0.7)), to(#5e3aa4));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(149, 126, 190, 0.7), #5e3aa4);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(149, 126, 190, 0.7), #5e3aa4);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(149, 126, 190, 0.7), #5e3aa4);
  /* Opera cannot do radial gradients yet */
  z-index: 3;
}
.color-flower .p4 {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(180, 143, 189, 0.7)), to(#9c68a6));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(180, 143, 189, 0.7), #9c68a6);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(180, 143, 189, 0.7), #9c68a6);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(180, 143, 189, 0.7), #9c68a6);
  /* Opera cannot do radial gradients yet */
  z-index: 4;
}
.color-flower .p5 {
  -webkit-transform: rotate(165deg);
  -moz-transform: rotate(165deg);
  -ms-transform: rotate(165deg);
  -o-transform: rotate(165deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(207, 119, 157, 0.7)), to(#af3269));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(207, 119, 157, 0.7), #af3269);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(207, 119, 157, 0.7), #af3269);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(207, 119, 157, 0.7), #af3269);
  /* Opera cannot do radial gradients yet */
  z-index: 5;
}
.color-flower .p6 {
  -webkit-transform: rotate(195deg);
  -moz-transform: rotate(195deg);
  -ms-transform: rotate(195deg);
  -o-transform: rotate(195deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(238, 145, 179, 0.7)), to(#e84d89));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(238, 145, 179, 0.7), #e84d89);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(238, 145, 179, 0.7), #e84d89);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(238, 145, 179, 0.7), #e84d89);
  /* Opera cannot do radial gradients yet */
  z-index: 6;
}
.color-flower .p7 {
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(249, 98, 105, 0.7)), to(#cf1d1d));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(249, 98, 105, 0.7), #cf1d1d);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(249, 98, 105, 0.7), #cf1d1d);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(249, 98, 105, 0.7), #cf1d1d);
  /* Opera cannot do radial gradients yet */
  z-index: 7;
}
.color-flower .p8 {
  -webkit-transform: rotate(255deg);
  -moz-transform: rotate(255deg);
  -ms-transform: rotate(255deg);
  -o-transform: rotate(255deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(246, 184, 121, 0.7)), to(#f18d40));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(246, 184, 121, 0.7), #f18d40);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(246, 184, 121, 0.7), #f18d40);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(246, 184, 121, 0.7), #f18d40);
  /* Opera cannot do radial gradients yet */
  z-index: 8;
}
.color-flower .p9 {
  -webkit-transform: rotate(285deg);
  -moz-transform: rotate(285deg);
  -ms-transform: rotate(285deg);
  -o-transform: rotate(285deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(254, 242, 139, 0.7)), to(#fedf49));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(254, 242, 139, 0.7), #fedf49);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(254, 242, 139, 0.7), #fedf49);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(254, 242, 139, 0.7), #fedf49);
  /* Opera cannot do radial gradients yet */
  z-index: 9;
}
.color-flower .p10 {
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  -o-transform: rotate(315deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(204, 237, 94, 0.7)), to(#9ac80c));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(204, 237, 94, 0.7), #9ac80c);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(204, 237, 94, 0.7), #9ac80c);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(204, 237, 94, 0.7), #9ac80c);
  /* Opera cannot do radial gradients yet */
  z-index: 10;
}
.color-flower .p11 {
  -webkit-transform: rotate(345deg);
  -moz-transform: rotate(345deg);
  -ms-transform: rotate(345deg);
  -o-transform: rotate(345deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(129, 228, 47, 0.7)), to(#45b800));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(129, 228, 47, 0.7), #45b800);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(129, 228, 47, 0.7), #45b800);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(129, 228, 47, 0.7), #45b800);
  /* Opera cannot do radial gradients yet */
  z-index: 11;
}
.color-flower .p12 {
  -webkit-transform: rotate(375deg);
  -moz-transform: rotate(375deg);
  -ms-transform: rotate(375deg);
  -o-transform: rotate(375deg);
  /* fallback */
  background-color: transparent;
  background-position: 70% 45%;
  background-repeat: no-repeat;
  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(radial, 70% 45%, 0, 80% 40%, 100, from(rgba(154, 209, 239, 0.7)), to(#72c1e8));
  /* Safari 5.1+, Chrome 10+ */
  background: -webkit-radial-gradient(70% 45%, closest-corner, rgba(154, 209, 239, 0.7), #72c1e8);
  /* Firefox 3.6+ */
  background: -moz-radial-gradient(70% 45%, closest-corner, rgba(154, 209, 239, 0.7), #72c1e8);
  /* IE 10 */
  background: -ms-radial-gradient(70% 45%, closest-corner, rgba(154, 209, 239, 0.7), #72c1e8);
  /* Opera cannot do radial gradients yet */
  z-index: 0;
}
.color-flower .p12:hover {
  z-index: 13;
}
.banner-box {
  position: absolute;
  bottom: 64px;
  left: 166px;
  width: 430px;
  height: 78px;
  z-index: 1;
  background-color: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(117, 57, 137, 0.5);
  border-left: none;
  padding: 6px 66px;
}
.banner-box .banner-text-1 {
  color: rgba(117, 57, 137, 0.8);
  font-size: 16px;
}
.banner-box .banner-text-2 {
  color: #753989;
  font-family: 'iCielBambola', sans-serif;
  font-size: 40px;
  line-height: 40px;
}
#home-page {
  position: relative;
  padding: 25px 0;
}
#home-page .content-row {
  margin: 25px -15px 0;
}
#home-page .view-more {
  position: absolute;
  top: -15px;
  right: 0;
  color: #808082;
}
#home-page .view-more:hover {
  text-decoration: underline;
}
.galaxy-feature:before {
  top: 8px;
  height: 5px;
}
.galaxy-feature h1 {
  font-size: 15px;
  margin-bottom: 25px;
}
.galaxy-feature .list-group-item {
  background-color: #8b9aa7;
  border-top-color: #a7b2bc;
  border-bottom-color: #a7b2bc;
  color: #fff;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.galaxy-feature .list-group-item:hover,
.galaxy-feature .list-group-item:focus {
  color: #fff;
  background-color: #f4901e;
  background-image: -webkit-gradient(linear, left top, right top, from(#f4901e), to(#f6e929));
  background-image: -webkit-linear-gradient(left, #f4901e, #f6e929);
  background-image: -moz-linear-gradient(left, #f4901e, #f6e929);
  background-image: -ms-linear-gradient(left, #f4901e, #f6e929);
  background-image: -o-linear-gradient(left, #f4901e, #f6e929);
  border-top-color: #fceeb3;
  border-bottom-color: #fceeb3;
}
.galaxy-feature .list-group-item:first-child,
.galaxy-feature .list-group-item:last-child {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.galaxy-feature .list-group-item i,
.galaxy-feature .list-group-item span {
  vertical-align: middle;
}
.galaxy-feature .list-group-item i {
  display: inline-block;
  width: 40px;
  font-size: 25px;
}
.galaxy-feature .list-group-item span {
  font-weight: 700;
}
.galaxy-feature .product-slide .slide-img {
  background: transparent none no-repeat scroll center center / 65% auto;
  height: 100%;
  margin: 0 auto;
  min-height: 370px;
  width: 100%;
  max-width: 375px;
}
.galaxy-feature .product-slide .slide-control {
  position: absolute;
  top: 0;
}
.galaxy-feature .product-slide .slide-control.left {
  right: 34px;
}
.galaxy-feature .product-slide .slide-control.right {
  right: 0;
}
.galaxy-feature .product-slide .slide-control.right > i:before {
  padding-left: 3px;
}
.galaxy-feature .outstanding-news > li {
  margin-top: 16px;
}
.galaxy-feature .outstanding-news > li:first-child {
  margin: 0;
}
.galaxy-feature .outstanding-news > li > a {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.galaxy-feature .outstanding-news > li > a:before {
  content: "";
  display: block;
  padding-top: 100%;
}
.galaxy-feature .outstanding-news .media-left {
  width: 34%;
}
.galaxy-feature .outstanding-news .media-right p {
  height: 60px;
  line-height: 20px;
  /* Height / no. of lines to display */
  overflow: hidden;
}
.galaxy-feature .outstanding-news .news-image {
  width: 100%;
  min-width: 112px;
  height: 112px;
  background: transparent no-repeat scroll center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.galaxy-feature .outstanding-news .news-title {
  position: relative;
  margin-bottom: 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (min-width: 1200px) {
  .news-title {
    width: 228px;
  }
}
@media (max-width: 991px) {
  .galaxy-feature.news {
    margin-top: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .news-title {
    width: 162px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .outstanding-news .news-title {
    max-width: 465px !important;
  }
  #galaxy-product-slide {
    width: 60%;
    margin: 0 auto;
  }
  .product-slide .slide-img {
    min-height: 700px;
  }
}
@media (max-width: 767px) {
  #home-page {
    margin-top: 10px !important;
  }
  .galaxy-banner::after {
    bottom: -14px;
  }
  .flower-control {
    height: 120px;
    border: 1px dashed #8b9aa7;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding-box;
    background-clip: padding-box;
    margin: 0 10px 10px;
  }
  .color-flower {
    bottom: 20px !important;
    left: 60px !important;
  }
  .color-flower .petal {
    width: 40px !important;
    height: 40px !important;
  }
  .banner-box {
    top: 30px;
    bottom: 0 !important;
    left: 125px !important;
    width: auto !important;
    max-width: 200px;
    height: auto !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
  }
  .banner-text-1 {
    font-size: 13px !important;
  }
  .banner-text-2 {
    font-size: 28px !important;
  }
  #home-page {
    margin-top: 120px;
  }
  .news-title {
    width: 194px;
  }
}
#decor-page {
  position: relative;
  display: block;
  width: 100%;
  padding-bottom: 30px;
}
#decor-page .decor-guide p {
  text-align: justify;
  margin: 0 0 1em;
}
#decor-page .decor-guide h2 {
  margin: 0 0 1em;
}
#decor-page .decor-guide img {
  display: block;
  width: 500px;
  height: auto;
  margin: 10px auto;
}
#decor-page .decor-guide .decor-guide-title {
  margin-bottom: 10px;
}
#decor-page .decor-guide .related-post h2 {
  margin-bottom: 10px;
}
#decor-page .related-post {
  border-left: 1px solid #8b9aa7;
}
#decor-page .image-wrapper img {
  width: 100%;
  margin-bottom: 15px;
}
#decor-page .color-list {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  white-space: nowrap;
}
#decor-page .color-board {
  display: inline-block;
  width: 9%;
  height: 80px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin-right: 0.8%;
}
#decor-page .color-board.color-1 {
  background-color: #c72129;
}
#decor-page .color-board.color-2 {
  background-color: #f7c668;
}
#decor-page .color-board.color-3 {
  background-color: #8fa96d;
}
#decor-page .color-board.color-4 {
  background-color: #70cbb6;
}
#decor-page .color-board.color-5 {
  background-color: #9ce7e3;
}
#decor-page .color-board.color-6 {
  background-color: #6ca4c2;
}
#decor-page .color-board.color-7 {
  background-color: #906fa1;
}
#decor-page .color-board.color-8 {
  background-color: #ea7d99;
}
#decor-page .color-board.color-9 {
  background-color: #cd6a88;
}
#decor-page .color-board.color-10 {
  background-color: #ff91b3;
  padding-right: 0;
}
#decor-page .tooltip.top .tooltip-inner {
  background-color: #8b9aa7 !important;
}
#decor-page .tooltip.top .tooltip-arrow {
  border-top-color: #8b9aa7 !important;
}
.post-item {
  padding-bottom: 5px;
  margin: 20px 0;
}
.post-item .media-left {
  width: 38%;
}
.post-item .post-title {
  line-height: 22px;
  height: 44px;
  overflow: hidden;
}
.post-item .post-image {
  width: 200px;
  height: 150px;
  background: transparent no-repeat scroll center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.post-item .post-time {
  color: #736a68;
  font-size: 11px;
}
.post-item .post-description {
  height: 60px;
  line-height: 20px;
  /* Height / no. of lines to display */
  overflow: hidden;
  margin-bottom: 3px;
}
.post-item .galaxy-button {
  padding: 4px 22px;
}
@media (max-width: 500px) {
  .post-item .post-image {
    width: 140px;
    height: 120px;
  }
}
.guide-item {
  position: relative;
  border: 1px solid #8b9aa7;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin-bottom: 15px;
  padding: 5px;
}
.guide-item .guide-cover {
  max-height: 210px;
  overflow: hidden;
  position: relative;
}
.guide-item .guide-cover .view-guide {
  position: absolute;
  top: 30px;
  right: 0;
  opacity: 1;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  background-color: #4e1464;
  background-image: -webkit-gradient(linear, left top, right top, from(#4e1464), to(#6b2b85));
  background-image: -webkit-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -moz-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -ms-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -o-linear-gradient(left, #4e1464, #6b2b85);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  padding: 6px 12px;
}
.guide-item .guide-cover .view-guide > i {
  font-size: 15px;
  margin-left: 5px;
}
.guide-item .guide-cover .view-guide.hide-item {
  opacity: 0;
  visibility: hidden;
  z-index: -1;
}
.guide-item .guide-cover .decor-block {
  position: relative;
  display: block;
  background-color: #080808;
  text-align: center;
  height: 210px;
}
.guide-item .guide-cover .decor-block img {
  width: auto;
  max-height: none;
}
.guide-item .guide-cover .decor-block span.nextArrow,
.guide-item .guide-cover .decor-block span.prevArrow {
  display: none !important;
  position: absolute;
  width: 50%;
  height: 100%;
  top: 0;
  z-index: 2;
}
.guide-item .guide-cover .decor-block span.nextArrow {
  right: 0;
}
.guide-item .guide-cover .decor-block span.prevArrow {
  left: 0;
}
.guide-item .guide-cover .decor-block .decor-content {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
}
.guide-item .guide-cover .decor-block .decor-content.hide-item {
  height: 0;
}
.guide-item .guide-cover .decor-block .decor-content p {
  background: white;
  color: #000;
  -moz-opacity: 0.65;
  -khtml-opacity: 0.65;
  -webkit-opacity: 0.65;
  opacity: 0.65;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=65);
  filter: alpha(opacity=65);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  padding: 10px;
  margin: 0 !important;
}
.guide-item .guide-cover .decor-block .decor-content p.hide-item {
  opacity: 0;
  visibility: hidden;
  z-index: -1;
}
.guide-item .guide-cover .decor-block .decor-content a.expand-image {
  display: block;
  position: absolute;
  z-index: 3;
  -webkit-border-radius: 4px 0 0 0;
  -moz-border-radius: 4px 0 0 0;
  border-radius: 4px 0 0 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  top: -28px;
  right: 0;
  background: rgba(0, 0, 0, 0.6) none repeat scroll 0 0;
  height: 28px;
  padding: 2px 0 0;
  text-align: center;
  width: 30px;
  cursor: pointer;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.guide-item .guide-cover .decor-block .decor-content a.expand-image.hide-item {
  top: none;
}
.guide-item .guide-cover .decor-block .decor-content a.expand-image:hover {
  background: rgba(115, 115, 115, 0.6) none repeat scroll 0 0;
}
.guide-item .guide-cover .decor-block .decor-content a.expand-image i {
  color: white;
  font-size: 18px;
  line-height: 25px;
}
.guide-item .guide-image {
  width: 100%;
}
.guide-item p.guide-content {
  font-weight: bold;
  line-height: 16px;
  height: 40px;
}
.guide-item .guide-content {
  line-height: 24px;
  height: 48px;
  overflow: hidden;
}
.guide-item .guide-control {
  display: inline-block;
  width: 100%;
  border: 1px solid #d5d7d9;
  margin: 5px 0;
}
.guide-item .guide-control .guide-prev {
  border-left: 0;
}
.guide-item .guide-control .guide-prev > i {
  padding: 3px 30px 3px 10px;
}
.guide-item .guide-control .guide-next {
  border-left: 1px solid #d5d7d9;
}
.guide-item .guide-control .guide-next > i {
  padding: 3px 10px 6px 30px;
}
.guide-item .guide-control > li {
  display: inline;
  float: left;
  width: 50%;
}
.guide-item .guide-control > li > i {
  cursor: pointer;
  color: #464646;
  display: block;
  font-size: 20px;
}
.guide-item .guide-control > li > i:hover {
  color: #6b2b85;
}
.guide-item .guide-control > li > i.slick-disabled {
  color: #a8a8a8;
  cursor: default;
}
.guide-item .guide-control > li > i.slick-disabled:hover {
  color: #a8a8a8;
}
.intro {
  display: block;
  max-width: 600px;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 20px 0;
  text-align: center;
}
.intro h1 {
  font-family: 'iCielBambola', sans-serif;
  font-size: 32px;
  letter-spacing: 1px;
  margin: 0 0 10px;
}
.sub-tabs {
  height: auto;
  width: 100%;
  display: block;
}
.sub-tabs .nav-tabs {
  border: none;
  display: block;
  padding: 0 15px;
}
.sub-tabs .nav-tabs li {
  margin: 0;
  padding: 0 !important;
}
.sub-tabs .nav-tabs li a {
  font-weight: 600;
  border: 0;
  margin-right: 0;
  color: #ffffff;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  text-align: center;
  background: #8b9aa7;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.sub-tabs .nav-tabs li:hover a {
  border: 0;
  background: rgba(0, 0, 0, 0.1);
  color: #333333;
}
.sub-tabs .nav-tabs li.active {
  position: relative;
}
.sub-tabs .nav-tabs li.active a {
  border: 0;
  background-color: #f4911e;
  background-image: -webkit-gradient(linear, left top, right top, from(#f4911e), to(#f6e829));
  background-image: -webkit-linear-gradient(left, #f4911e, #f6e829);
  background-image: -moz-linear-gradient(left, #f4911e, #f6e829);
  background-image: -ms-linear-gradient(left, #f4911e, #f6e829);
  background-image: -o-linear-gradient(left, #f4911e, #f6e829);
  color: white;
}
.sub-tabs .nav-tabs li.active a:after {
  content: '';
  position: absolute;
  border-style: solid;
  border-width: 8px 8px 0;
  border-color: #f5bc23 transparent;
  display: block;
  width: 0;
  z-index: 1;
  bottom: -8px;
  left: 50%;
  margin-left: -4px;
}
.sub-tabs .tab-content {
  background-color: #fff;
  padding: 15px;
}
.sub-tabs .tab-content #choose_painting .tabs-left {
  background-color: #c4d3df;
}
.sub-tabs .tab-content .tab-pane {
  border: 1px solid #eee;
}
.sub-tabs .tab-content .tab-pane#favorite_color {
  padding: 15px 15px 0;
}
.sub-tabs .tab-content .tab-pane#favorite_color p.no-result {
  text-align: center;
  color: #7c8d9d;
  margin-bottom: 15px;
}
.sub-tabs .tab-content .tab-pane#favorite_color p.no-result i.isLove {
  color: #e12500;
}
.sub-tabs .tab-content .tab-pane#favorite_color .is-love-color {
  border: 1px solid #eee;
  margin-bottom: 15px;
  width: 100%;
  height: auto;
  display: block;
  text-align: center;
  padding: 10px;
}
.sub-tabs .tab-content .tab-pane#favorite_color .is-love-color span {
  width: 70px;
  height: 70px;
  display: block;
  margin: 0 auto 10px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.sub-tabs .tab-content .tab-pane#favorite_color .is-love-color p.color-name-love {
  color: #7c8d9d;
  font-weight: 400;
  font-size: 16px;
}
.tabs-left .red-color {
  background-color: #ac1400;
  background-image: -webkit-gradient(linear, left top, right top, from(#ac1400), to(#e42c00));
  background-image: -webkit-linear-gradient(left, #ac1400, #e42c00);
  background-image: -moz-linear-gradient(left, #ac1400, #e42c00);
  background-image: -ms-linear-gradient(left, #ac1400, #e42c00);
  background-image: -o-linear-gradient(left, #ac1400, #e42c00);
}
.tabs-left .orange-color {
  background-color: #f46f0e;
  background-image: -webkit-gradient(linear, left top, right top, from(#f46f0e), to(#fee902));
  background-image: -webkit-linear-gradient(left, #f46f0e, #fee902);
  background-image: -moz-linear-gradient(left, #f46f0e, #fee902);
  background-image: -ms-linear-gradient(left, #f46f0e, #fee902);
  background-image: -o-linear-gradient(left, #f46f0e, #fee902);
}
.tabs-left .yellow-color {
  background-color: #fee902;
  background-image: -webkit-gradient(linear, left top, right top, from(#fee902), to(#afcf66));
  background-image: -webkit-linear-gradient(left, #fee902, #afcf66);
  background-image: -moz-linear-gradient(left, #fee902, #afcf66);
  background-image: -ms-linear-gradient(left, #fee902, #afcf66);
  background-image: -o-linear-gradient(left, #fee902, #afcf66);
}
.tabs-left .green-color {
  background-color: #afcf66;
  background-image: -webkit-gradient(linear, left top, right top, from(#afcf66), to(#039543));
  background-image: -webkit-linear-gradient(left, #afcf66, #039543);
  background-image: -moz-linear-gradient(left, #afcf66, #039543);
  background-image: -ms-linear-gradient(left, #afcf66, #039543);
  background-image: -o-linear-gradient(left, #afcf66, #039543);
}
.tabs-left .blue-color {
  background-color: #039543;
  background-image: -webkit-gradient(linear, left top, right top, from(#039543), to(#1c75b9));
  background-image: -webkit-linear-gradient(left, #039543, #1c75b9);
  background-image: -moz-linear-gradient(left, #039543, #1c75b9);
  background-image: -ms-linear-gradient(left, #039543, #1c75b9);
  background-image: -o-linear-gradient(left, #039543, #1c75b9);
}
.tabs-left .purple-color {
  background-color: #983fc4;
  background-image: -webkit-gradient(linear, left top, right top, from(#983fc4), to(#6b2c8a));
  background-image: -webkit-linear-gradient(left, #983fc4, #6b2c8a);
  background-image: -moz-linear-gradient(left, #983fc4, #6b2c8a);
  background-image: -ms-linear-gradient(left, #983fc4, #6b2c8a);
  background-image: -o-linear-gradient(left, #983fc4, #6b2c8a);
}
.tabs-left .brown-color {
  background-color: #95a0a8;
  background-image: -webkit-gradient(linear, left top, right top, from(#95a0a8), to(#988279));
  background-image: -webkit-linear-gradient(left, #95a0a8, #988279);
  background-image: -moz-linear-gradient(left, #95a0a8, #988279);
  background-image: -ms-linear-gradient(left, #95a0a8, #988279);
  background-image: -o-linear-gradient(left, #95a0a8, #988279);
}
.tabs-left .dark-color {
  background-color: #969ca1;
  background-image: -webkit-gradient(linear, left top, right top, from(#969ca1), to(#585859));
  background-image: -webkit-linear-gradient(left, #969ca1, #585859);
  background-image: -moz-linear-gradient(left, #969ca1, #585859);
  background-image: -ms-linear-gradient(left, #969ca1, #585859);
  background-image: -o-linear-gradient(left, #969ca1, #585859);
}
.tabs-left .light-color {
  background-color: #969ca1;
  background-image: -webkit-gradient(linear, left top, right top, from(#969ca1), to(#f3f3f3));
  background-image: -webkit-linear-gradient(left, #969ca1, #f3f3f3);
  background-image: -moz-linear-gradient(left, #969ca1, #f3f3f3);
  background-image: -ms-linear-gradient(left, #969ca1, #f3f3f3);
  background-image: -o-linear-gradient(left, #969ca1, #f3f3f3);
}
.tabs-left .no-padding {
  padding: 0 !important;
}
.tabs-left .nav-tabs {
  margin: 0;
  padding: 15px 0;
  width: 100%;
  background-color: #c4d3df;
  display: block;
}
.tabs-left .nav-tabs li {
  margin: 0;
  width: 100%;
  padding: 0;
}
.tabs-left .nav-tabs li a {
  background: #c4d3df;
  padding: 5px 0;
  border: 0;
  display: block;
}
.tabs-left .nav-tabs li a span {
  width: 55px;
  height: 55px;
  display: block;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin: 0 auto;
}
@media (max-width: 360px) {
  .tabs-left .nav-tabs li a span {
    width: 20px;
    height: 20px;
  }
}
.tabs-left .nav-tabs li a:hover {
  background: #d3e1ea;
}
.tabs-left .nav-tabs li.active a {
  background: #d3e1ea;
}
.tabs-left .nav-tabs li.active a:after {
  border: 0;
}
.tabs-left .nav-tabs .nav-tabs > li.active > a,
.tabs-left .nav-tabs .nav-tabs > li.active > a:hover,
.tabs-left .nav-tabs .nav-tabs > li.active > a:focus {
  border: 0;
}
.tabs-left .tab-content {
  display: block;
  padding: 0;
}
.tabs-left .tab-content .tab-pane {
  border: 0;
  display: none;
  background-color: #fff;
  padding: 0;
}
.tabs-left .tab-content .tab-pane .sub-level .nav-tabs {
  padding: 0;
  background-color: #d3e1ea;
  border-bottom: 1px solid #d3e1ea;
  min-height: 615px;
}
@media (max-width: 480px) {
  .tabs-left .tab-content .tab-pane .sub-level .nav-tabs {
    min-height: auto;
  }
}
.tabs-left .tab-content .tab-pane .sub-level .nav-tabs li a {
  padding: 15px 25px;
  background-color: #d3e1ea;
}
.tabs-left .tab-content .tab-pane .sub-level .nav-tabs li a .display-review-color {
  width: 100%;
  display: block;
}
.tabs-left .tab-content .tab-pane .sub-level .nav-tabs li a .display-review-color span {
  width: 15px;
  height: 15px;
  margin: 2px 2px 0 0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  display: inline-block;
}
.tabs-left .tab-content .tab-pane .sub-level .nav-tabs li.active a {
  background-color: white;
}
@media (max-width: 360px) {
  .tabs-left .tab-content .tab-pane .sub-level .nav-tabs {
    height: auto;
  }
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane {
  min-height: 615px;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-color {
  width: 100%;
  display: block;
  text-align: center;
  padding: 10px 0;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-color .profile-color {
  display: none;
  width: 100%;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-color .profile-color span {
  width: 70px;
  height: 70px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  display: block;
  margin: 0 auto 10px;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-color .profile-color .name-color {
  color: #7c8d9d;
  font-weight: 400;
  font-size: 16px;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-color .profile-color i {
  cursor: pointer;
  color: #7c8d9d;
  font-size: 16px;
  line-height: 20px;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-color .profile-color i.isLove {
  color: #e12500;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-color .profile-color:first-child {
  display: block;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-content {
  border-top: 1px solid #cfd6da;
  display: block;
  padding: 25px 20px;
  margin: 0;
  text-align: center;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-content .display-list-color {
  display: block;
  width: 100%;
}
.tabs-left .tab-content .tab-pane .sub-level .tab-pane .display-content .display-list-color span {
  width: 70px;
  height: 70px;
  cursor: pointer;
  margin: 25px 25px 0 0;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  display: inline-block;
}
.tabs-left .tab-content .active {
  display: block;
}
.show-search-result .result-color {
  display: none;
  margin-top: 20px;
  text-align: center;
  width: 100%;
}
.show-search-result .result-color span {
  width: 70px;
  height: 70px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  display: block;
  margin: 0 auto 10px;
}
.show-search-result .result-color .name-color {
  color: #7c8d9d;
  font-weight: 400;
  font-size: 16px;
}
.show-search-result .result-color i {
  cursor: pointer;
  color: #7c8d9d;
  font-size: 16px;
  line-height: 20px;
}
.show-search-result .result-color i.isLove {
  color: #e12500;
}
.show-search-result .result-color:first-child {
  display: block;
}
.product-item {
  margin-top: 30px;
  padding-bottom: 20px;
  border-bottom: 1px solid #8b9aa7;
}
.product-item .product-image {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.product-item .product-image:before {
  content: "";
  display: block;
  padding-top: 100%;
}
.product-item .product-image > div {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  background: transparent no-repeat scroll center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.product-item .product-title {
  position: relative;
  margin: 10px 0 18px;
}
.product-item .product-title:after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 112px;
  height: 4px;
  background-color: #8b9aa7;
}
.product-item .product-name {
  height: 48px;
  line-height: 24px;
  overflow: hidden;
}
.product-item .product-description {
  height: 60px;
  line-height: 20px;
  overflow: hidden;
  margin-bottom: 18px;
}
#product-page .btn-grey > span {
  font-weight: 700;
}
#product-page img.product-image {
  width: 100%;
}
#product-page .product-content h5 {
  color: #753989;
  font-size: 15px;
  font-weight: 700;
}
#product-page .product-content .product-detail-name {
  color: #753989;
  font-size: 28px;
  font-weight: 700;
  margin: 5px 0 20px;
}
#product-page .product-detail-pros {
  margin-top: 50px;
}
#product-page .product-detail-pros > li {
  display: inline-block;
}
#product-page .product-detail-pros > li:first-child,
#product-page .product-detail-pros > li:nth-child(2) {
  margin-right: 20px;
}
#product-page .product-detail-pros img {
  margin: 0 auto;
}
#product-page .product-detail-pros span {
  color: #543727;
  font-size: 11px;
  font-weight: 700;
  line-height: 30px;
  text-transform: uppercase;
}
#product-page .product-detail-menu > li {
  display: block;
  width: 100%;
}
#product-page .product-detail-menu > li.current > a {
  color: #fff;
  background-color: #f4901e;
  background-image: -webkit-gradient(linear, left top, right top, from(#f4901e), to(#f6e929));
  background-image: -webkit-linear-gradient(left, #f4901e, #f6e929);
  background-image: -moz-linear-gradient(left, #f4901e, #f6e929);
  background-image: -ms-linear-gradient(left, #f4901e, #f6e929);
  background-image: -o-linear-gradient(left, #f4901e, #f6e929);
  border-color: #fceeb3;
}
#product-page .product-detail-menu > li.current > a > i:before {
  content: "\f0da";
}
#product-page .product-detail-menu > li > a {
  position: relative;
  display: inline-block;
  width: 100%;
  color: #fff;
  background-color: #8b9aa7;
  border: 1px solid #96a4b0;
  margin-bottom: 5px;
  padding: 6px 30px;
  font-weight: 700;
  line-height: 1.42857143;
  text-align: left;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#product-page .product-detail-menu > li > a:hover {
  color: #8b9aa7;
  background: #fff none;
  border-color: #96a4b0;
}
#product-page .product-detail-menu > li > a > i {
  position: absolute;
  top: 6px;
  right: 14px;
  font-size: 18px;
}
#product-page .product-detail-menu-content {
  border: 1px solid #8b9aa7;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  border-radius: 5px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  padding: 6px 12px;
}
#product-page #review-section .reviewer-image {
  margin: 10px 0;
}
#product-page #review-section .reviewer-image > div {
  width: 60%;
  height: 0;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  background: transparent no-repeat scroll center center / cover;
  margin: 0 auto;
  padding-bottom: 60%;
}
#product-page #review-section .reviewer-name,
#product-page #review-section .reviewer-job {
  display: inline-block;
  margin: 10px 0;
}
#product-page #review-section .reviewer-name {
  color: #753989;
  font-size: 15px;
  font-weight: 700;
}
#product-page #review-section .btn-review {
  background-color: #bb2125;
  background-image: -webkit-gradient(linear, left top, right top, from(#bb2125), to(#f17922));
  background-image: -webkit-linear-gradient(left, #bb2125, #f17922);
  background-image: -moz-linear-gradient(left, #bb2125, #f17922);
  background-image: -ms-linear-gradient(left, #bb2125, #f17922);
  background-image: -o-linear-gradient(left, #bb2125, #f17922);
  font-weight: 700;
  font-size: 13px;
  text-align: center;
  color: white;
  margin: 5px 0 0;
  padding: 6px 30px;
  border: none;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  border-radius: 3px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
#product-page #review-section .btn-review:hover {
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  -webkit-opacity: 0.8;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  filter: alpha(opacity=80);
}
#product-page #related-product-section .product-item {
  border: none;
}
@media (max-width: 991px) {
  #product-page .galaxy-select {
    margin-bottom: 5px;
  }
  #product-page .product-detail-pros {
    margin-top: 20px;
  }
}
@media (max-width: 767px) {
  #product-page .intro-company {
    margin-top: 20px;
  }
}
#lucky-painter-page .tab-header .nav-tabs li,
#news-page .tab-header .nav-tabs li {
  margin: 0;
}
#lucky-painter-page .tab-header .nav-tabs li a,
#news-page .tab-header .nav-tabs li a {
  width: 100%;
}
#lucky-painter-page .tab-content #lucky-painter,
#news-page .tab-content #lucky-painter,
#lucky-painter-page .tab-content #contractor,
#news-page .tab-content #contractor,
#lucky-painter-page .tab-content #who-are-they,
#news-page .tab-content #who-are-they {
  padding: 0 0 30px;
}
#lucky-painter-page .tab-content .tab-pane,
#news-page .tab-content .tab-pane {
  min-height: 560px;
}
@media (min-width: 992px) {
  #lucky-painter-page .who-is-lucky-painter,
  #news-page .who-is-lucky-painter {
    display: table;
    width: 100%;
  }
}
#lucky-painter-page .who-is-lucky-painter [class*="col-"],
#news-page .who-is-lucky-painter [class*="col-"] {
  float: none;
  display: table-cell;
  vertical-align: top;
  position: relative;
}
@media (max-width: 991px) {
  #lucky-painter-page .who-is-lucky-painter [class*="col-"],
  #news-page .who-is-lucky-painter [class*="col-"] {
    float: left;
    display: block;
  }
}
@media (min-width: 1200px) {
  #lucky-painter-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter,
  #news-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter {
    position: absolute;
    left: 0;
    width: 100%;
    bottom: 0;
  }
}
#lucky-painter-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-register,
#news-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-register {
  background-color: #b80001;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#b80001), to(#ef7420));
  background-image: -webkit-linear-gradient(top, #b80001, #ef7420);
  background-image: -moz-linear-gradient(top, #b80001, #ef7420);
  background-image: -ms-linear-gradient(top, #b80001, #ef7420);
  background-image: -o-linear-gradient(top, #b80001, #ef7420);
  color: white;
  display: block;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  padding: 20px;
  white-space: nowrap;
}
@media (min-width: 992px) {
  #lucky-painter-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-register,
  #news-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-register {
    margin: 10px 0 0 15px;
  }
}
#lucky-painter-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-register:hover,
#news-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-register:hover {
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  -webkit-opacity: 0.8;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  filter: alpha(opacity=80);
}
#lucky-painter-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-suicide,
#news-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-suicide {
  padding: 20px 10px 20px 70px;
  background: #5d2075;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: white;
  display: block;
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  position: relative;
  margin-top: 10px;
  white-space: nowrap;
}
#lucky-painter-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-suicide:after,
#news-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-suicide:after {
  content: "";
  position: absolute;
  top: 9px;
  left: 18px;
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/icon/icon-contact.png") no-repeat scroll center center / 80%;
  width: 43px;
  height: 43px;
}
#lucky-painter-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-suicide:hover,
#news-page .who-is-lucky-painter [class*="col-"] .contact-lucky-painter a.btn-suicide:hover {
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  -webkit-opacity: 0.8;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  filter: alpha(opacity=80);
}
#lucky-painter-page .avatar-company,
#news-page .avatar-company {
  display: block;
  width: 100%;
}
#lucky-painter-page .avatar-company img,
#news-page .avatar-company img {
  width: 100%;
  display: block;
}
#lucky-painter-page .intro-company,
#news-page .intro-company {
  display: block;
  width: 100%;
  position: relative;
}
#lucky-painter-page .intro-company h1,
#news-page .intro-company h1 {
  font-size: 25px;
  color: #8b9aa7;
  font-weight: 700;
  text-transform: uppercase;
}
#lucky-painter-page .intro-company h3,
#news-page .intro-company h3 {
  font-size: 22px;
  color: #8b9aa7;
}
#lucky-painter-page .intro-company p.content-intro,
#news-page .intro-company p.content-intro {
  padding: 22px 0 30px;
  color: #78787b;
  position: relative;
  margin-top: 22px;
  text-align: justify;
}
#lucky-painter-page .intro-company p.content-intro:after,
#news-page .intro-company p.content-intro:after {
  content: '';
  position: absolute;
  top: -8px;
  left: 0;
  border: 0;
  height: 5px;
  width: 60%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
}
#lucky-painter-page .img-desktop,
#news-page .img-desktop {
  display: block;
}
#lucky-painter-page .img-mobile,
#news-page .img-mobile {
  display: none;
}
#lucky-painter-page .title-lucky-painter,
#news-page .title-lucky-painter {
  display: block;
  width: 100%;
  margin-bottom: 20px;
}
#lucky-painter-page .title-lucky-painter h1,
#news-page .title-lucky-painter h1 {
  padding: 0 0 10px 40px;
  color: #8b9aa7;
  position: relative;
  line-height: 30px;
  font-size: 15px;
  border-bottom: 1px solid #8b9aa7;
}
#lucky-painter-page .title-lucky-painter h1:after,
#news-page .title-lucky-painter h1:after {
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/icon/icon-note.png") repeat scroll center center / cover;
  content: "";
  height: 30px;
  left: 0;
  position: absolute;
  top: 0;
  width: 30px;
}
#lucky-painter-page .luckypainter-signup,
#news-page .luckypainter-signup {
  position: relative;
}
#lucky-painter-page .luckypainter-signup img,
#news-page .luckypainter-signup img {
  margin: 20px auto;
}
#lucky-painter-page .luckypainter-signup h2,
#news-page .luckypainter-signup h2 {
  position: relative;
  padding-right: 0;
}
#lucky-painter-page .luckypainter-signup h2:after,
#news-page .luckypainter-signup h2:after {
  content: '';
  position: absolute;
  top: 55px;
  left: 0;
  border: 0;
  height: 6px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
}
#lucky-painter-page .luckypainter-signup-form .galaxy-select .btn,
#news-page .luckypainter-signup-form .galaxy-select .btn {
  border-color: #8b9aa7;
}
#lucky-painter-page .luckypainter-signup-form .galaxy-select .dropdown-menu,
#news-page .luckypainter-signup-form .galaxy-select .dropdown-menu {
  min-width: 100px;
}
#lucky-painter-page .luckypainter-signup-form .luckypainter-project,
#news-page .luckypainter-signup-form .luckypainter-project {
  padding-right: 0 !important;
}
#lucky-painter-page .luckypainter-signup-form i.add-project,
#news-page .luckypainter-signup-form i.add-project {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("../../bundles/app/images/plus.png") no-repeat center center;
  margin-right: 5px;
  vertical-align: middle;
}
#lucky-painter-page .luckypainter-profile,
#news-page .luckypainter-profile {
  position: relative;
  display: block;
  width: 100%;
  border: 1px solid #8b9aa7;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin-bottom: 30px;
  padding: 10px 10px 30px;
}
#lucky-painter-page .luckypainter-profile .profile-avatar,
#news-page .luckypainter-profile .profile-avatar {
  position: relative;
  display: block;
  width: 100%;
  height: 230px;
  background: transparent no-repeat center center / cover;
}
#lucky-painter-page .luckypainter-profile .profile-avatar span,
#news-page .luckypainter-profile .profile-avatar span {
  position: absolute;
  left: 50px;
  bottom: 14px;
  background: rgba(0, 0, 0, 0.3);
  color: white;
  font-size: 14px;
  font-weight: 700;
  padding: 0 10px 3px;
}
#lucky-painter-page .luckypainter-profile .profile-avatar span:after,
#news-page .luckypainter-profile .profile-avatar span:after {
  content: '';
  position: absolute;
  top: -20px;
  left: -35px;
  width: 42px;
  height: 47px;
  background: transparent url("../../bundles/app/images/logo-sigle.png") no-repeat center center / cover;
}
#lucky-painter-page .luckypainter-profile .profile-info,
#news-page .luckypainter-profile .profile-info {
  display: block;
  width: 100%;
  margin: 10px 0 0;
}
#lucky-painter-page .luckypainter-profile .profile-info p,
#news-page .luckypainter-profile .profile-info p {
  white-space: nowrap;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
#lucky-painter-page .luckypainter-profile .profile-rating,
#news-page .luckypainter-profile .profile-rating {
  position: absolute;
  bottom: 8px;
  left: 10px;
  color: #a8b3bd;
}
#lucky-painter-page .luckypainter-profile .profile-rating .rated,
#news-page .luckypainter-profile .profile-rating .rated {
  color: #ffcb00;
}
#lucky-painter-page .contractor-detail,
#news-page .contractor-detail {
  position: relative;
  display: block;
  min-height: 180px;
  margin-bottom: 30px;
  padding: 20px 0;
}
#lucky-painter-page .contractor-detail .contractor-avatar,
#news-page .contractor-detail .contractor-avatar {
  display: inline-block;
  width: 38%;
}
#lucky-painter-page .contractor-detail .contractor-avatar span,
#news-page .contractor-detail .contractor-avatar span {
  position: absolute;
  top: 0;
  left: 50px;
  display: block;
  background: transparent no-repeat center center / cover;
  border: 2px solid white;
  max-width: 180px;
  width: 100%;
  height: 180px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
#lucky-painter-page .contractor-detail .contract-information,
#news-page .contractor-detail .contract-information {
  display: inline-block;
  width: 60%;
  color: #5a1d72;
  line-height: 24px;
  padding: 30px 0 0 20px;
}
#lucky-painter-page .contractor-detail .contractor-quote,
#news-page .contractor-detail .contractor-quote {
  padding-top: 30px;
}
#lucky-painter-page .contractor-detail .contractor-contact,
#news-page .contractor-detail .contractor-contact {
  position: absolute;
  bottom: 20px;
  right: 15px;
  padding: 8px 26px;
  background-color: #4e1464;
  background-image: -webkit-gradient(linear, left top, right top, from(#4e1464), to(#6b2b85));
  background-image: -webkit-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -moz-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -ms-linear-gradient(left, #4e1464, #6b2b85);
  background-image: -o-linear-gradient(left, #4e1464, #6b2b85);
  color: #fff;
  font-weight: 700;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
#lucky-painter-page .contractor-detail .contractor-contact:hover,
#news-page .contractor-detail .contractor-contact:hover {
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  -webkit-opacity: 0.8;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  filter: alpha(opacity=80);
}
#lucky-painter-page .contract-content,
#news-page .contract-content {
  display: block;
  width: 100%;
}
#lucky-painter-page .contract-content p,
#news-page .contract-content p {
  margin-top: 20px;
}
#lucky-painter-page .contract-content .show-detail,
#news-page .contract-content .show-detail {
  text-align: center;
  position: relative;
  width: 100%;
  display: block;
}
#lucky-painter-page .contract-content .show-detail .slider-for,
#news-page .contract-content .show-detail .slider-for {
  width: 560px;
  margin: 0 auto;
}
@media (max-width: 560px) {
  #lucky-painter-page .contract-content .show-detail .slider-for,
  #news-page .contract-content .show-detail .slider-for {
    width: 320px;
  }
}
#lucky-painter-page .contract-content .show-detail .slider-for img,
#news-page .contract-content .show-detail .slider-for img {
  width: 100%;
  display: block;
}
#lucky-painter-page .contract-content .show-detail .slider-nav,
#news-page .contract-content .show-detail .slider-nav {
  width: 560px;
  margin: 0 auto;
}
@media (max-width: 560px) {
  #lucky-painter-page .contract-content .show-detail .slider-nav,
  #news-page .contract-content .show-detail .slider-nav {
    width: 320px;
  }
}
#lucky-painter-page .contract-content .show-detail .slider-nav .slick-current img,
#news-page .contract-content .show-detail .slider-nav .slick-current img {
  opacity: 0.5;
}
#lucky-painter-page .contract-content #carousel-example-generic,
#news-page .contract-content #carousel-example-generic {
  display: inline-block;
  /* Plugin styles */
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-indicators,
#news-page .contract-content #carousel-example-generic .carousel-indicators {
  display: none;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-inner,
#news-page .contract-content #carousel-example-generic .carousel-inner {
  display: block;
  width: 100%;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-inner img,
#news-page .contract-content #carousel-example-generic .carousel-inner img {
  width: 100%;
  display: block;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-edit,
#news-page .contract-content #carousel-example-generic .carousel-edit {
  bottom: 35px;
  position: absolute;
  color: #c5ccd3;
  border: 1px solid #c5ccd3;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-edit:hover,
#news-page .contract-content #carousel-example-generic .carousel-edit:hover {
  color: #8a8f94;
  border: 1px solid #8A8F94;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-edit span,
#news-page .contract-content #carousel-example-generic .carousel-edit span {
  height: 25px;
  width: 25px;
  display: block;
  font-size: 18px;
  line-height: 25px;
  vertical-align: middle;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-edit.left,
#news-page .contract-content #carousel-example-generic .carousel-edit.left {
  left: -40px;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-edit.right,
#news-page .contract-content #carousel-example-generic .carousel-edit.right {
  right: -40px;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action,
#news-page .contract-content #carousel-example-generic .carousel-action {
  display: inline-block;
  position: relative;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel,
#news-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel {
  padding: 5px 0 0 0;
  margin: 0;
  list-style-type: none;
  text-align: center;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel .center,
#news-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel .center {
  display: inline-block;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel li,
#news-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel li {
  margin-right: 5px;
  float: left;
  cursor: pointer;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel li:last-child,
#news-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel li:last-child {
  margin-right: 0;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel li span,
#news-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel li span {
  width: 130px;
  height: 90px;
  display: block;
  background-position: center center;
  background-size: cover;
}
@media (max-width: 360px) {
  #lucky-painter-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel li span,
  #news-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel li span {
    width: 39px;
    height: 27px;
  }
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel.controls-background-reset,
#news-page .contract-content #carousel-example-generic .carousel-action ul.thumbnails-carousel.controls-background-reset {
  background: none !important;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action .active-thumbnail,
#news-page .contract-content #carousel-example-generic .carousel-action .active-thumbnail {
  opacity: 0.4;
}
#lucky-painter-page .contract-content #carousel-example-generic .carousel-action .indicators-fix,
#news-page .contract-content #carousel-example-generic .carousel-action .indicators-fix {
  bottom: 70px;
}
@media (min-width: 768px) {
  #lucky-painter-page .luckypainter-signup-form .district,
  #news-page .luckypainter-signup-form .district {
    padding: 0 10px 0 0;
  }
  #lucky-painter-page .luckypainter-signup-form .city,
  #news-page .luckypainter-signup-form .city {
    padding: 0 0 0 10px;
  }
}
@media (max-width: 767px) {
  #lucky-painter-page .intro-company,
  #news-page .intro-company {
    margin-top: 20px;
  }
  #lucky-painter-page .luckypainter-signup-form .district,
  #news-page .luckypainter-signup-form .district {
    padding: 0;
  }
  #lucky-painter-page .luckypainter-signup-form .city,
  #news-page .luckypainter-signup-form .city {
    padding: 0;
    margin: 15px 0 0 0;
  }
  #lucky-painter-page .img-desktop,
  #news-page .img-desktop {
    display: none;
  }
  #lucky-painter-page .img-mobile,
  #news-page .img-mobile {
    display: block;
  }
}
.luckypainter-text {
  margin-top: 65px;
  text-align: right;
}
.luckypainter-text .luckypainter-title {
  color: #450774;
  font-family: 'iCielBambola', sans-serif;
  font-size: 50px;
  margin-bottom: 20px;
}
.luckypainter-text .luckypainter-caption {
  color: #fff;
}
@media (max-width: 599px) {
  .luckypainter-text {
    display: none;
  }
}
.project-item {
  position: relative;
  margin-bottom: 30px;
}
.project-item img {
  width: 100%;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.project-item:hover .project-mask {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.project-item .project-mask {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  background-color: rgba(53, 69, 100, 0.8);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter: alpha(opacity=0);
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
.project-item .project-content .house-type {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
}
.project-item .project-content .address {
  color: #fff;
  font-size: 20px;
  margin: 10px 0;
}
.project-item .project-content .view-detail {
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  text-decoration: underline;
}
.project-item .project-content .view-detail:hover {
  color: #fff;
  text-decoration: none;
}
.project-preview {
  overflow: hidden;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  display: block;
  width: 100%;
  height: 100%;
  margin-bottom: 10px;
}
.project-preview .detail-project {
  width: 100%;
  display: block;
  background-size: cover;
  background-position: center center;
  height: 390px;
}
.project-preview .detail-project .info-preview {
  display: block;
  opacity: 0;
  width: 100%;
  height: 100%;
  position: relative;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  transition: all 0.7s ease-out;
}
.project-preview .detail-project .info-preview .position-info {
  text-align: center;
  top: 50%;
  width: 100%;
  position: absolute;
  margin-top: -50px;
}
.project-preview .detail-project .info-preview .position-info p {
  color: white;
  font-size: 18px;
  padding: 5px 15px;
  width: 100%;
}
.project-preview .detail-project .info-preview .position-info span.view-detail-project {
  color: white;
  text-decoration: underline;
  font-weight: 600;
}
.project-preview .detail-project:hover .info-preview {
  opacity: 1;
}
.project-preview .detail-project:hover .info-preview span.view-detail-project:hover {
  color: whitesmoke;
}
#project-processing {
  display: none;
  width: 100%;
  height: auto;
  position: relative;
}
#project-processing.active {
  display: block;
}
#project-processing .news-current {
  display: block;
  width: 100%;
  height: auto;
  position: relative;
  padding: 0 0 20px;
}
#project-processing .news-current .news-preview {
  overflow: hidden;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  display: block;
  width: 100%;
  height: 100%;
  margin-bottom: 10px;
}
#project-processing .news-current .news-preview .detail-news {
  width: 100%;
  display: block;
  background-size: cover;
  background-position: center center;
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  transition: all 0.7s ease-out;
}
#project-processing .news-current .news-preview .detail-news img {
  width: 100%;
  display: block;
}
#project-processing .news-current .news-preview .detail-news .info-preview {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  transition: all 0.7s ease-out;
}
#project-processing .news-current .news-preview .detail-news .info-preview .position-info {
  display: block;
  text-align: center;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  position: absolute;
  background: rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.7s ease-out;
  -moz-transition: all 0.7s ease-out;
  -o-transition: all 0.7s ease-out;
  -ms-transition: all 0.7s ease-out;
  transition: all 0.7s ease-out;
  opacity: 0;
}
#project-processing .news-current .news-preview .detail-news .info-preview .position-info .taget-info {
  text-align: center;
  top: 50%;
  width: 100%;
  position: absolute;
  margin-top: -50px;
}
#project-processing .news-current .news-preview .detail-news .info-preview .position-info .taget-info p {
  color: white;
  font-size: 18px;
  padding: 5px 15px;
  width: 100%;
}
#project-processing .news-current .news-preview .detail-news .info-preview .position-info .taget-info span.view-detail-news {
  color: white;
  text-decoration: underline;
  font-weight: 600;
}
#project-processing .news-current .news-preview .detail-news:hover .info-preview .position-info {
  opacity: 1;
}
.news-detail {
  margin-bottom: 50px;
}
.news-detail p {
  text-align: justify;
  margin: 0 0 10px;
}
.news-detail img {
  display: block;
  width: 500px;
  height: auto;
  margin: 10px auto;
}
.news-detail .news-detail-title {
  margin-bottom: 10px;
}
.news-detail .news-detail-time {
  color: #a1a1a1;
  font-size: 11px;
  margin-bottom: 10px;
}
.news-detail .news-detail-time > i {
  margin-right: 10px;
}
.news-detail .related-post {
  border-left: 1px solid #8b9aa7;
}
.news-detail .post-item {
  padding: 15px 0;
  margin: 0;
  border-bottom: 1px solid #8b9aa7;
}
.news-detail .post-item .post-image {
  width: 100%;
}
.news-detail .post-item .post-title {
  font-weight: 600;
  margin-bottom: 5px;
}
.news-detail .post-item .post-time {
  color: #a1a1a1;
  margin: 5px 0 0;
}
#support-page .support-tab-wrapper {
  position: relative;
  min-height: 400px;
  padding: 0 0 50px 0;
}
#support-page .support-tab-wrapper:after {
  content: '';
  position: absolute;
  top: -37px;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid transparent;
}
#support-page #paint-calculator:after {
  border-top-color: #934267;
  left: 15%;
}
#support-page #color-blender:after {
  border-top-color: #f07721;
  left: 49%;
}
#support-page #nearest-agency:after {
  border-top-color: #f4c622;
  right: 15%;
}
#support-page #paint-calculator .galaxy-select {
  margin-bottom: 14px;
}
#support-page #paint-calculator .galaxy-select .dropdown-toggle {
  height: 36px;
  padding: 8px 12px 8px 20px;
}
#support-page #paint-calculator .galaxy-input {
  height: 36px;
  border-color: #adb8c1;
  margin-bottom: 14px;
  padding: 8px 12px 8px 20px;
  box-shadow: none;
}
#support-page .galaxy-line {
  margin-bottom: 30px;
}
#support-page .galaxy-line:before {
  height: 5px;
}
#support-page .support-title {
  position: relative;
  height: 36px;
  line-height: 36px;
  margin-bottom: 14px;
}
#support-page .support-title:before {
  content: '';
  position: absolute;
  top: 18px;
  left: 0;
  width: 100%;
  border-bottom: 1px solid #8b9aa7;
  z-index: -1;
}
#support-page .support-title h1 {
  font-size: 18px;
  padding-right: 40px;
}
#support-page .btn-count {
  display: block;
  width: 100%;
  background-color: #f4901e;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f4901e), to(#f6ea23));
  background-image: -webkit-linear-gradient(top, #f4901e, #f6ea23);
  background-image: -moz-linear-gradient(top, #f4901e, #f6ea23);
  background-image: -ms-linear-gradient(top, #f4901e, #f6ea23);
  background-image: -o-linear-gradient(top, #f4901e, #f6ea23);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  padding: 14px;
}
#support-page .btn-count:hover {
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  -webkit-opacity: 0.8;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  filter: alpha(opacity=80);
}
#support-page .support-image {
  width: 100%;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
#support-page .support-icon {
  display: inline-block;
  background: transparent no-repeat center center;
  margin-right: 10px;
  vertical-align: middle;
  background-size: 90%;
}
#support-page .support-icon.location-icon {
  width: 16px;
  height: 25px;
  background-image: url('../../bundles/app/images/icon/icon-location.png');
}
#support-page .support-icon.phone-icon {
  width: 14px;
  height: 22px;
  background-image: url('../../bundles/app/images/icon/icon-phone.png');
}
#support-page .support-icon + span {
  vertical-align: middle;
}
#support-page .agency-list p {
  line-height: 24px;
}
#support-page .agency-list .agency-item {
  margin-bottom: 15px;
}
@media (max-width: 991px) {
  #support-page .support-tab-wrapper::after {
    border-left-width: 10px !important;
    border-right-width: 10px !important;
    border-top-width: 10px !important;
  }
}
@media (min-width: 1200px) {
  #support-page .media-left {
    width: 32%;
  }
  #support-page .agency-list .agency-item {
    height: 130px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #support-page .media-left {
    width: 40%;
  }
  #support-page .agency-list .agency-item {
    height: 140px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #support-page .media-left {
    width: 45%;
  }
  #support-page .agency-list .agency-item {
    height: 140px;
  }
}
@media (max-width: 767px) {
  #support-page .media-left {
    width: 40%;
  }
}
#gmap_canvas img {
  max-width: none !important;
  background: none !important;
}
#contact-page {
  padding: 15px 0 30px 0;
}
#contact-page .contact-address {
  border: 1px solid #8b9aa7;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  padding: 15px 10px 15px 110px;
  cursor: pointer;
}
#contact-page .contact-address:before {
  content: '';
  position: absolute;
  top: 24px;
  left: 40px;
  width: 56px;
  height: 74px;
  background: transparent url("../../bundles/app/images/icon/icon-location-big.png") no-repeat center center;
  background-size: 80%;
}
#contact-page .contact-address h5 {
  margin-bottom: 5px;
}
#contact-page .contact-address p {
  line-height: 24px;
}
#contact-page .google-maps-wrapper {
  width: 100%;
  height: 400px;
  overflow: hidden;
}
@media (max-width: 767px) {
  #contact-page #address-2,
  #contact-page #address-4 {
    margin-top: 20px;
  }
}
#search-page {
  padding: 30px 0;
}
#search-page .product-item {
  padding: 0;
  border: none;
}
.search-form .form-group {
  width: 50%;
  margin-right: 2%;
}
.search-form .search-term {
  width: 100%;
}
.search-form .btn-search {
  position: relative;
  padding: 6px 12px 6px 42px;
}
.search-form .btn-search:before {
  content: '';
  position: absolute;
  top: 1px;
  left: 10px;
  width: 26px;
  height: 30px;
  background: transparent url("../../bundles/app/images/icon/icon-search.png") no-repeat center center;
  background-size: 80%;
}
@media (max-width: 767px) {
  .search-form .form-group {
    width: 100%;
  }
}
.galaxy-dialog .modal-dialog {
  margin: 100px auto;
}
.galaxy-dialog .modal-content {
  padding: 10px 20px;
}
.galaxy-dialog .modal-header {
  position: relative;
  border-bottom: 0;
  padding: 5px 0;
}
.galaxy-dialog .modal-header .modal-title {
  color: #8b9aa7;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
}
.galaxy-dialog .modal-header:after {
  border: 0;
  height: 4px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  content: '';
  position: absolute;
  left: 0;
  bottom: -4px;
}
.galaxy-dialog .modal-body {
  padding: 10px 0 0;
  border-bottom: 0;
  position: relative;
}
.galaxy-dialog .modal-body p {
  line-height: 24px;
}
.galaxy-dialog .modal-body .send-message {
  position: relative;
  display: block;
  width: 100%;
  border: 1px solid #8b9aa7;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.galaxy-dialog .modal-body .send-message textarea {
  border: none;
  outline: none;
  box-shadow: none;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
}
.galaxy-dialog .modal-body .send-message .btn-send {
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.galaxy-dialog .modal-footer {
  border-top: 0;
  padding: 10px 0;
}
.galaxy-dialog .modal-footer .galaxy-btn-file {
  margin-right: 5px;
}
@media (min-width: 768px) {
  #stepsDialog .modal-dialog {
    width: 525px;
    margin: 100px auto;
  }
}
#stepsDialog .modal-content {
  background-color: #773b8b;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  padding: 10px;
}
#stepsDialog .dialog-header {
  padding: 2px 0 12px;
}
#stepsDialog .dialog-header h2 {
  color: #fff;
  font-weight: 700;
}
@media (min-width: 768px) {
  #stepsDialog .dialog-header h2 {
    font-size: 15px;
  }
}
@media (max-width: 767px) {
  #stepsDialog .dialog-header h2 {
    font-size: 13px;
  }
}
#stepsDialog .dialog-body #step-tab {
  width: 505px;
  border: none;
  white-space: nowrap;
}
@media (max-width: 767px) {
  #stepsDialog .dialog-body #step-tab {
    display: none !important;
  }
}
#stepsDialog .dialog-body #step-tab > li {
  width: -moz-calc(14.284% - 0.3px);
  width: -webkit-calc(14.284% - 0.3px);
  width: calc(14.284% - 0.3px);
  margin-bottom: 0;
}
#stepsDialog .dialog-body #step-tab > li > a {
  color: #fff;
  background-color: #8b9aa7;
  border-color: #fff;
  border-right: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin: 0;
  padding: 5px 14px;
}
#stepsDialog .dialog-body #step-tab > li:nth-child(7) > a {
  border-right: 1px solid #fff;
}
#stepsDialog .dialog-body #step-tab > li.active > a {
  background-color: #bd341a;
  background-image: -webkit-gradient(linear, left top, right top, from(#bd341a), to(#f07721));
  background-image: -webkit-linear-gradient(left, #bd341a, #f07721);
  background-image: -moz-linear-gradient(left, #bd341a, #f07721);
  background-image: -ms-linear-gradient(left, #bd341a, #f07721);
  background-image: -o-linear-gradient(left, #bd341a, #f07721);
}
#stepsDialog .dialog-body .tab-background {
  position: relative;
  width: 100%;
  text-align: center;
}
@media (min-width: 768px) {
  #stepsDialog .dialog-body .tab-background {
    height: 220px;
  }
}
@media (max-width: 767px) {
  #stepsDialog .dialog-body .tab-background {
    height: 150px;
  }
}
#stepsDialog .dialog-body .tab-background.landscape {
  background: #ffffff url("../../bundles/app/images/6-steps-bg.png") no-repeat center bottom / cover;
}
#stepsDialog .dialog-body .tab-background.purple {
  background: #ffffff url("../../bundles/app/images/purple-bg.png") no-repeat center center / cover;
}
#stepsDialog .dialog-body .tab-background.finish {
  background: #ffffff url("../../bundles/app/images/completed-bg.png") no-repeat center bottom / cover;
}
#stepsDialog .dialog-body .btn-step {
  position: absolute;
  left: 50%;
  background-color: #bd341a;
  background-image: -webkit-gradient(linear, left top, right top, from(#bd341a), to(#f07721));
  background-image: -webkit-linear-gradient(left, #bd341a, #f07721);
  background-image: -moz-linear-gradient(left, #bd341a, #f07721);
  background-image: -ms-linear-gradient(left, #bd341a, #f07721);
  background-image: -o-linear-gradient(left, #bd341a, #f07721);
  border-color: #fff;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: #fff;
  font-weight: 600;
  text-transform: uppercase;
  padding: 4px 20px;
}
#stepsDialog .dialog-body .btn-step:hover {
  background-color: #f07721;
  background-image: -webkit-gradient(linear, left top, right top, from(#f07721), to(#bd341a));
  background-image: -webkit-linear-gradient(left, #f07721, #bd341a);
  background-image: -moz-linear-gradient(left, #f07721, #bd341a);
  background-image: -ms-linear-gradient(left, #f07721, #bd341a);
  background-image: -o-linear-gradient(left, #f07721, #bd341a);
}
#stepsDialog .dialog-body .btn-step.start {
  top: 46%;
  margin-left: -51px;
}
#stepsDialog .dialog-body .btn-step.end {
  top: 50%;
  margin-left: -109px;
}
#stepsDialog .dialog-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 24px;
  height: 24px;
  background: url("../../bundles/app/images/close-button.png") no-repeat center center;
  border: none;
  z-index: 100;
}
#stepsDialog .tab-background.purple .btn {
  position: absolute;
  top: 50%;
  margin-top: -22px;
  border: none;
}
@media (min-width: 768px) {
  #stepsDialog .tab-background.purple .btn {
    width: 45px;
    height: 46px;
  }
}
@media (max-width: 767px) {
  #stepsDialog .tab-background.purple .btn {
    width: 32px;
    height: 33px;
  }
}
#stepsDialog .next-step {
  background: url("../../bundles/app/images/next-button.png") no-repeat center center / 100% auto;
}
@media (min-width: 768px) {
  #stepsDialog .next-step {
    right: 55px;
  }
}
@media (max-width: 767px) {
  #stepsDialog .next-step {
    right: 25px;
  }
}
#stepsDialog .prev-step {
  background: url("../../bundles/app/images/prev-button.png") no-repeat center center / 100% auto;
}
@media (min-width: 768px) {
  #stepsDialog .prev-step {
    left: 55px;
  }
}
@media (max-width: 767px) {
  #stepsDialog .prev-step {
    left: 25px;
  }
}
#stepsDialog .step-number {
  display: inline-block;
  background-color: #fff;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: #773b8b;
  font-family: 'iCielBambola', sans-serif;
  font-size: 24px;
  padding: 5px 18px;
}
@media (min-width: 768px) {
  #stepsDialog .step-number {
    margin-top: 66px;
  }
}
@media (max-width: 767px) {
  #stepsDialog .step-number {
    margin-top: 40px;
  }
}
#stepsDialog .step-content {
  display: block;
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  margin-top: 10px;
}
#landing-nav {
  position: relative;
  width: 100%;
  height: 80px;
  background-color: #412755;
}
#landing-nav:after {
  content: '';
  position: absolute;
  bottom: 0;
  border: 0;
  height: 8px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
}
#landing-nav .nav-item {
  width: 100%;
  height: 80px;
  background-color: #672f74;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#landing-nav .nav-item:hover,
#landing-nav .nav-item.active {
  background-color: #a91e2f;
}
#landing-nav .nav-item .nav-label {
  color: #f1f2f3;
  font-family: 'iCielBambola', sans-serif;
  font-size: 26px;
  letter-spacing: 1px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  #landing-nav .nav-item .nav-label {
    font-size: 24px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #landing-nav .nav-item .nav-label {
    font-size: 22px;
  }
}
@media (max-width: 767px) {
  #landing-nav .nav-item .nav-label {
    font-size: 18px;
  }
  #landing-nav .landing-menu > div:first-child {
    padding-right: 7px;
  }
  #landing-nav .landing-menu > div:nth-child(2) {
    padding: 0 7px;
  }
  #landing-nav .landing-menu > div:last-child {
    padding-left: 7px;
  }
}
.landing-page p {
  color: #d1d3d4;
  font-size: 14px;
}
#galaxy-color .landing-wrapper {
  width: 100%;
  height: auto;
  background: #240234 url("../../bundles/app/images/landing/galaxy-bg.jpg") no-repeat top center / cover;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#galaxy-color .landing-wrapper .top-wrapper,
#galaxy-color .landing-wrapper .middle-wrapper,
#galaxy-color .landing-wrapper .bottom-wrapper {
  position: relative;
  height: 100%;
}
#galaxy-color .landing-title {
  display: inline-block;
  margin-bottom: 10px;
}
#galaxy-color .landing-ball {
  z-index: 1;
}
#galaxy-color .landing-ball.ball-1 {
  position: absolute;
  top: 20%;
  right: -15px;
  width: 340px;
  height: 319px;
  background: transparent url("../../bundles/app/images/landing/ball-1.png") no-repeat center center;
  -webkit-animation: balloon2 10s ease-in-out infinite;
  -moz-animation: balloon2 10s ease-in-out infinite;
  -ms-animation: balloon2 10s ease-in-out infinite;
  animation: balloon2 10s ease-in-out infinite;
}
#galaxy-color .landing-ball.ball-2 {
  position: absolute;
  bottom: -15%;
  left: 50px;
  width: 500px;
  height: 463px;
  background: transparent url("../../bundles/app/images/landing/ball-2.png") no-repeat center center;
  -webkit-animation: balloon1 10s ease-in-out infinite;
  -moz-animation: balloon1 10s ease-in-out infinite;
  -ms-animation: balloon1 10s ease-in-out infinite;
  animation: balloon1 10s ease-in-out infinite;
}
#galaxy-color .landing-about-us {
  position: relative;
  margin-top: 70px;
  padding: 5px 50px 5px 58px;
}
#galaxy-color .landing-about-us:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 28px;
  height: 79px;
  background: transparent url('../../bundles/app/images/landing/quote-left.png') no-repeat center center;
}
#galaxy-color .landing-about-us:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 20px;
  height: 56px;
  background: transparent url('../../bundles/app/images/landing/quote-right.png') no-repeat center center;
}
#galaxy-color .landing-logo {
  margin-top: 62%;
}
#galaxy-color .landing-discovery {
  position: relative;
  margin-top: 38%;
  z-index: 10;
}
#galaxy-color .landing-decor {
  position: relative;
  margin-top: 15%;
  z-index: 10;
}
#galaxy-color .landing-button {
  background-color: transparent;
  color: #F27725;
  font-size: 16px;
  font-weight: 700;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -moz-border-image: -moz-linear-gradient(right, #f27725 0%, #f8e632 50%, #f27725 100%);
  -webkit-border-image: -webkit-linear-gradient(right, #f27725 0%, #f8e632 50%, #f27725 100%);
  border-image: linear-gradient(to left, #f27725 0%, #f8e632 50%, #f27725 100%);
  border-image-slice: 1;
  margin-top: 20px;
  padding: 12px 38px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#galaxy-color .landing-button:hover {
  background-color: rgba(255, 255, 255, 0.1);
}
#galaxy-color .landing-product {
  position: relative;
  min-height: 500px;
  border: 1px solid transparent;
  -moz-border-image: -moz-linear-gradient(right, #f27725 0%, #f8e632 50%, #f27725 100%);
  -webkit-border-image: -webkit-linear-gradient(right, #f27725 0%, #f8e632 50%, #f27725 100%);
  border-image: linear-gradient(to left, #f27725 0%, #f8e632 50%, #f27725 100%);
  border-image-slice: 1;
  margin: 13% 0;
  padding: 60px 15px;
}
#galaxy-color .landing-product .product-img {
  position: relative;
  padding: 0 0 10px;
}
#galaxy-color .landing-product .product-img svg {
  display: block;
  position: absolute;
}
#galaxy-color .landing-product .product-img img {
  position: relative;
  width: 90%;
  z-index: 10;
}
#galaxy-color .landing-product .product-img .ocean {
  display: none;
  height: 80px;
  width: 241px;
  position: absolute;
  left: 30px;
  bottom: 0;
  -webkit-animation: wave 0.2s;
  animation: wave 0.2s;
}
#galaxy-color .landing-product .product-img .ocean:after {
  content: '';
  height: 80px;
  width: 241px;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-animation: wave 1s;
  animation: wave 1s;
  opacity: 0.5;
  background: url("../../bundles/app/images/landing/vet-son.png") no-repeat left 0 top 100%;
}
#galaxy-color .landing-product .product-img a:hover .ocean {
  display: block;
}
@-webkit-keyframes wave {
  0% {
    width: 0;
  }
  100% {
    width: 241px;
  }
}
@keyframes wave {
  0% {
    width: 0;
  }
  100% {
    width: 241px;
  }
}
#galaxy-color .landing-product .product-img .paint-smear {
  display: none;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -105px;
  width: 210px;
  height: 90px;
  background: transparent url('../../bundles/app/images/landing/smear.png') no-repeat bottom center;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  -ms-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
}
#galaxy-color .landing-product .product-title {
  position: absolute;
  top: -28px;
  left: 50%;
  margin-left: -108px;
  padding: 0 20px;
}
#galaxy-color .landing-product .product-title:before {
  content: '';
  position: absolute;
  top: 60%;
  left: 0;
  right: 0;
  width: 100%;
  height: 3px;
  background-color: #260137;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#260137), to(#29003b));
  background-image: -webkit-linear-gradient(top, #260137, #29003b);
  background-image: -moz-linear-gradient(top, #260137, #29003b);
  background-image: -ms-linear-gradient(top, #260137, #29003b);
  background-image: -o-linear-gradient(top, #260137, #29003b);
  z-index: 5;
}
#galaxy-color .landing-product .product-title img {
  position: relative;
  z-index: 10;
}
#galaxy-color .landing-product .product-intro {
  margin-bottom: 40px;
}
#galaxy-color .landing-product .product-name {
  font-size: 18px;
  margin: 10px 0 5px;
}
#galaxy-color .landing-product .product-description {
  padding: 0 3%;
  text-align: justify;
}
#galaxy-color .discovery-text {
  max-width: 509px;
  width: 100%;
  margin-left: auto;
}
#galaxy-color .decor-text {
  max-width: 335px;
  width: 100%;
}
@media (min-width: 1200px) {
  #galaxy-color .landing-discovery > img {
    padding-right: 20px;
  }
  #galaxy-color .landing-discovery > div {
    padding: 0 20px;
  }
  #galaxy-color .product-intro {
    padding: 0 40px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-color .landing-ball.ball-1 {
    width: 306px;
    height: 287px;
    background-size: 90%;
  }
  #galaxy-color .landing-ball.ball-2 {
    width: 450px;
    height: 417px;
    background-size: 90%;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-color .landing-logo {
    margin-top: 72% !important;
  }
  #galaxy-color .landing-decor {
    margin-top: 40% !important;
  }
  #galaxy-color .middle-wrapper {
    margin-top: 50px;
  }
  #galaxy-color .landing-ball.ball-1 {
    width: 272px;
    height: 255px;
    background-size: 80%;
    top: -4% !important;
    right: 40px !important;
  }
  #galaxy-color .landing-ball.ball-2 {
    width: 400px;
    height: 370px;
    background-size: 80%;
    bottom: 22% !important;
    left: 20px !important;
  }
  #galaxy-color .landing-product {
    padding: 60px 15px 20px;
  }
  #galaxy-color .product-img {
    padding: 0 !important;
  }
  #galaxy-color .product-img img {
    width: 70% !important;
  }
  #galaxy-color .product-description {
    height: 120px;
    margin-bottom: 30px;
  }
  #galaxy-color .ocean {
    left: 72px !important;
  }
}
@media (max-width: 767px) {
  #galaxy-color .landing-title {
    width: 100%;
  }
  #galaxy-color .landing-discovery {
    margin-top: 60% !important;
  }
  #galaxy-color .landing-decor {
    margin-top: 90% !important;
  }
  #galaxy-color .landing-ball.ball-1 {
    width: 238px;
    height: 223px;
    background-size: 70%;
    top: -6% !important;
    right: 10px !important;
  }
  #galaxy-color .landing-ball.ball-2 {
    width: 350px;
    height: 324px;
    background-size: 70%;
    bottom: 22% !important;
    left: -10px !important;
  }
  #galaxy-color .landing-button {
    font-size: 14px !important;
    padding: 10px 30px !important;
  }
  #galaxy-color .product-img {
    padding: 0 !important;
  }
  #galaxy-color .product-img img {
    width: 80% !important;
  }
  #galaxy-color .product-name {
    margin: 5px 0 !important;
  }
  #galaxy-color .product-description {
    margin-bottom: 20px !important;
  }
  #galaxy-color .ocean {
    left: 50px !important;
  }
}
@media (max-width: 480px) {
  #galaxy-color .landing-logo {
    margin-top: 120% !important;
  }
  #galaxy-color .landing-product {
    margin-bottom: 130px;
    padding: 60px 15px 20px;
  }
}
#galaxy-discovery .landing-slide {
  position: relative;
  overflow: hidden;
}
#galaxy-discovery .landing-slide:after {
  content: '';
  position: absolute;
  bottom: 0;
  border: 0;
  height: 8px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
}
#galaxy-discovery .landing-slide h1 {
  color: #fff;
  text-shadow: 1px 2px 4px rgba(0, 0, 0, 0.8);
  font-size: 30px;
  font-weight: 800;
  z-index: 100;
  line-height: 38px;
  -webkit-animation: fadeOutUp 1s both;
  -moz-animation: fadeOutUp 1s both;
  -ms-animation: fadeOutUp 1s both;
  animation: fadeOutUp 1s both;
}
#galaxy-discovery .landing-slide p {
  color: #fff;
  z-index: 100;
  -webkit-animation: fadeOutRight 1s both;
  -moz-animation: fadeOutRight 1s both;
  -ms-animation: fadeOutRight 1s both;
  animation: fadeOutRight 1s both;
  padding: 20px 0;
}
#galaxy-discovery .landing-slide .slick-active h1 {
  -webkit-animation: fadeInDown 1s both 0.2s;
  -moz-animation: fadeInDown 1s both 0.2s;
  -ms-animation: fadeInDown 1s both 0.2s;
  animation: fadeInDown 1s both 0.2s;
}
#galaxy-discovery .landing-slide .slick-active p {
  -webkit-animation: fadeInLeft 1s both 0.2s;
  -moz-animation: fadeInLeft 1s both 0.2s;
  -ms-animation: fadeInLeft 1s both 0.2s;
  animation: fadeInLeft 1s both 0.2s;
}
#galaxy-discovery .landing-slide .slick-active button {
  -webkit-animation: fadeIn 1s both 0.5s;
  -moz-animation: fadeIn 1s both 0.5s;
  -ms-animation: fadeIn 1s both 0.5s;
  animation: fadeIn 1s both 0.5s;
}
#galaxy-discovery .slide-img {
  position: relative;
  background: transparent no-repeat scroll center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#galaxy-discovery .slide-text {
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
#galaxy-discovery .slide-text.center {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
#galaxy-discovery .slide-text.right .row {
  margin-left: auto;
}
#galaxy-discovery .slide-center {
  position: absolute;
  top: 10%;
}
#galaxy-discovery .slide-center > p {
  padding: 30px 0;
}
#galaxy-discovery .slide-content {
  max-width: 380px;
  width: 100%;
}
#galaxy-discovery .slider-for .slide-img {
  width: 100%;
  height: 580px;
}
#galaxy-discovery .slider-nav .slide-img {
  width: 100%;
  height: 160px;
}
#galaxy-discovery .slider-nav .slick-slide {
  position: relative;
}
#galaxy-discovery .slider-nav .slick-slide:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 3px solid #000;
  border-right: none;
  background-color: rgba(0, 0, 0, 0.7);
  border-bottom-width: 11px;
}
#galaxy-discovery .slider-nav .slick-current {
  position: relative;
}
#galaxy-discovery .slider-nav .slick-current:after {
  border-right: 3px solid transparent !important;
  border-color: transparent !important;
  background-color: transparent !important;
  -moz-border-image: -moz-linear-gradient(right, #f6ea23 0%, #f07721 50%, #6b2b85 100%);
  -webkit-border-image: -webkit-linear-gradient(right, #f6ea23 0%, #f07721 50%, #6b2b85 100%);
  border-image: linear-gradient(to left, #f6ea23 0%, #f07721 50%, #6b2b85 100%);
  border-image-slice: 1;
}
#galaxy-discovery .btn-discovery {
  background-color: #be0200;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#be0200), to(#f95700));
  background-image: -webkit-linear-gradient(top, #be0200, #f95700);
  background-image: -moz-linear-gradient(top, #be0200, #f95700);
  background-image: -ms-linear-gradient(top, #be0200, #f95700);
  background-image: -o-linear-gradient(top, #be0200, #f95700);
  color: #fff;
  text-shadow: 1px 2px 4px rgba(0, 0, 0, 0.8);
  font-size: 16px;
  font-weight: 800;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid transparent;
  padding: 14px 26px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  z-index: 100;
  -webkit-animation: fadeOut 1s both 0.2s;
  -moz-animation: fadeOut 1s both 0.2s;
  -ms-animation: fadeOut 1s both 0.2s;
  animation: fadeOut 1s both 0.2s;
}
#galaxy-discovery .btn-discovery:hover {
  background-color: #f95700;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f95700), to(#be0200));
  background-image: -webkit-linear-gradient(top, #f95700, #be0200);
  background-image: -moz-linear-gradient(top, #f95700, #be0200);
  background-image: -ms-linear-gradient(top, #f95700, #be0200);
  background-image: -o-linear-gradient(top, #f95700, #be0200);
}
#galaxy-discovery .landing-quiz {
  position: relative;
  width: 100%;
  min-height: 1000px;
  background-color: #edb4ba;
  background-image: -webkit-gradient(linear, left top, right top, from(#edb4ba), to(#7499cd));
  background-image: -webkit-linear-gradient(left, #edb4ba, #7499cd);
  background-image: -moz-linear-gradient(left, #edb4ba, #7499cd);
  background-image: -ms-linear-gradient(left, #edb4ba, #7499cd);
  background-image: -o-linear-gradient(left, #edb4ba, #7499cd);
  padding-bottom: 100px;
}
@media (max-width: 480px) {
  #galaxy-discovery .landing-quiz {
    padding-bottom: 150px;
  }
}
#galaxy-discovery .landing-quiz:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: transparent url('../../bundles/app/images/landing/star.png') no-repeat center center / cover;
}
#galaxy-discovery .landing-quiz .quiz {
  margin-top: 50px;
}
#galaxy-discovery .color-game .color-game-desc {
  color: #fff;
  margin-top: -18%;
}
#galaxy-discovery .color-game .color-game-desc + a {
  position: relative;
  display: inline-block;
  margin-top: 30px;
  z-index: 10;
}
#galaxy-discovery .color-game .color-game-desc .prize {
  font-size: 30px;
  font-weight: 800;
  line-height: 28px;
}
#galaxy-discovery .color-game .btn-award-rule {
  background-color: transparent;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid #fff;
  padding: 12px 26px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#galaxy-discovery .color-game .btn-award-rule:hover {
  background-color: rgba(255, 255, 255, 0.1);
}
#galaxy-discovery .quiz-1,
#galaxy-discovery .quiz-2 {
  position: relative;
  width: 100%;
  z-index: 10;
  -webkit-transition: all 0.1s ease;
  -moz-transition: all 0.1s ease;
  -o-transition: all 0.1s ease;
  -ms-transition: all 0.1s ease;
  transition: all 0.1s ease;
}
#galaxy-discovery .quiz-1 img,
#galaxy-discovery .quiz-2 img {
  position: relative;
  display: inline-block;
  z-index: 11;
}
#galaxy-discovery .quiz-1:after,
#galaxy-discovery .quiz-2:after {
  content: '';
  position: absolute;
  top: 5%;
  right: 4%;
  bottom: 1%;
  left: 0;
}
#galaxy-discovery .quiz-1:before,
#galaxy-discovery .quiz-2:before {
  content: '';
  position: absolute;
  top: 0;
  width: 18%;
  height: 30%;
  left: 0;
}
#galaxy-discovery .quiz-1:hover,
#galaxy-discovery .quiz-2:hover {
  -webkit-transform: translate(-2px, -2px);
  -moz-transform: translate(-2px, -2px);
  -o-transform: translate(-2px, -2px);
  -ms-transform: translate(-2px, -2px);
  transform: translate(-2px, -2px);
}
#galaxy-discovery .quiz-1:hover:after,
#galaxy-discovery .quiz-2:hover:after {
  -webkit-box-shadow: 8px 8px 10px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 8px 8px 10px rgba(0, 0, 0, 0.3);
  box-shadow: 8px 8px 10px rgba(0, 0, 0, 0.3);
}
#galaxy-discovery .quiz-1:hover:before,
#galaxy-discovery .quiz-2:hover:before {
  -webkit-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.3);
}
#galaxy-discovery .quiz-title {
  position: absolute;
  top: 1%;
  left: 4%;
  font-size: 16px;
  font-weight: 700;
  z-index: 11;
}
#galaxy-discovery .quiz-content {
  position: absolute;
  top: 46%;
  left: 0;
  width: 96%;
  z-index: 11;
}
#galaxy-discovery .quiz-heading {
  display: block;
}
#galaxy-discovery .quiz-heading > span {
  display: inline-block;
  font-size: 30px;
  font-weight: 800;
  padding: 5px 10px;
  white-space: nowrap;
}
#galaxy-discovery .quiz-desc {
  display: block;
  width: 84%;
  margin: 6% auto;
  padding: 0 10%;
}
#galaxy-discovery .btn-playnow {
  display: block;
  width: 200px;
  height: 60px;
  background-color: transparent;
  font-size: 20px;
  font-weight: 700;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  border: 3px solid transparent;
  padding: 12px 26px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  margin: 0 auto;
}
#galaxy-discovery .quiz-1 .quiz-title {
  color: #231F20;
}
#galaxy-discovery .quiz-1 .quiz-heading span:first-child {
  background-color: #231F20;
  color: #fff;
}
#galaxy-discovery .quiz-1 .quiz-heading span:last-child {
  color: #231F20;
}
#galaxy-discovery .quiz-1 .quiz-desc {
  color: #414042;
}
#galaxy-discovery .quiz-1 .btn-playnow {
  -moz-border-image: -moz-linear-gradient(right, #d95555 0%, #53b7e3 50%, #d95555 100%);
  -webkit-border-image: -webkit-linear-gradient(right, #d95555 0%, #53b7e3 50%, #d95555 100%);
  border-image: linear-gradient(to left, #d95555 0%, #53b7e3 50%, #d95555 100%);
  border-image-slice: 1;
  background: url("../../bundles/app/images/landing/playnow-1.svg") no-repeat center center;
}
#galaxy-discovery .quiz-1 .btn-playnow:hover {
  background-color: #fae8e5;
}
#galaxy-discovery .quiz-2 .quiz-title,
#galaxy-discovery .quiz-2 .quiz-heading,
#galaxy-discovery .quiz-2 .quiz-desc,
#galaxy-discovery .quiz-2 .btn-playnow {
  color: #764E24;
}
#galaxy-discovery .quiz-2 .btn-playnow {
  background: #ffffff url("../../bundles/app/images/landing/playnow-2.svg") no-repeat center center;
}
#galaxy-discovery .quiz-2 .btn-playnow:hover {
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  -webkit-opacity: 0.8;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
  filter: alpha(opacity=80);
}
@media (min-width: 1200px) {
  #galaxy-discovery .slide-center {
    left: 30%;
    width: 40%;
  }
}
@media (min-width: 421px) and (max-width: 1199px) {
  #galaxy-discovery .btn-playnow {
    width: 160px;
    height: 48px;
    background-size: 80% !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-discovery .slide-center {
    left: 25%;
    width: 50%;
  }
  #galaxy-discovery .quiz-heading > span {
    font-size: 26px !important;
  }
  #galaxy-discovery .quiz-desc {
    margin: 5% auto !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-discovery .slide-center {
    left: 18%;
    width: 64%;
  }
  #galaxy-discovery .quiz-title {
    left: 3%;
    font-size: 14px;
  }
  #galaxy-discovery .quiz-heading > span {
    font-size: 20px;
    padding: 5px;
  }
  #galaxy-discovery .quiz-content {
    top: 44% !important;
  }
  #galaxy-discovery .quiz-desc {
    display: block;
    width: 88% !important;
    margin: 4% auto !important;
    padding: 0 5% !important;
    font-size: 12px;
  }
}
@media (min-width: 768px) {
  #galaxy-discovery .slide-img.first-img {
    background-image: url('../../bundles/app/images/landing/slide-1-1.jpg');
  }
  #galaxy-discovery .quiz-1 img,
  #galaxy-discovery .quiz-2 img {
    width: 96%;
  }
}
@media (max-width: 767px) {
  #galaxy-discovery .slide-img.first-img {
    background-image: url('../../bundles/app/images/landing/slide-1-mobile.jpg');
  }
  #galaxy-discovery .slide-center {
    left: 10%;
    width: 80%;
  }
  #galaxy-discovery .slide-content.text-left {
    text-align: center !important;
  }
  #galaxy-discovery .slide-text {
    -webkit-box-pack: center !important;
    -moz-box-pack: center !important;
    -ms-flex-pack: center !important;
    -webkit-justify-content: center !important;
    justify-content: center !important;
  }
  #galaxy-discovery .quiz-content {
    top: 44% !important;
  }
  #galaxy-discovery .quiz-title {
    left: 5%;
    font-size: 14px;
  }
  #galaxy-discovery .quiz-2 {
    margin-top: 20px;
  }
  #galaxy-discovery .quiz-heading > span {
    font-size: 24px;
  }
  #galaxy-discovery .quiz-1 img,
  #galaxy-discovery .quiz-2 img {
    width: 100%;
  }
}
@media (max-width: 420px) {
  #galaxy-discovery .quiz-heading > span {
    font-size: 18px !important;
    padding: 5px;
  }
  #galaxy-discovery .quiz-content {
    top: 40% !important;
  }
  #galaxy-discovery .quiz-title {
    left: 2% !important;
  }
  #galaxy-discovery .quiz-desc {
    font-size: 11px;
  }
  #galaxy-discovery .btn-playnow {
    width: 120px;
    height: 36px;
    background-size: 60% !important;
  }
}
#galaxy-decoration .landing-background {
  position: relative;
  width: 100%;
  height: 575px;
  background: transparent url("../../bundles/app/images/landing/firework-bg.jpg") no-repeat center center / cover;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#galaxy-decoration .landing-background:after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 6px;
  background-color: #676565;
  z-index: 10;
}
#galaxy-decoration .landing-background .top-wrapper {
  position: relative;
  height: 100%;
}
#galaxy-decoration .landing-background .paint-roller {
  position: absolute;
  top: 110px;
  left: -106px;
  background: transparent url("../../bundles/app/images/landing/paint-roller.png") no-repeat center center;
}
#galaxy-decoration .landing-background .banner-caption {
  margin-top: 11%;
}
#galaxy-decoration .landing-background .banner-caption p {
  width: 88%;
  margin: 0 auto;
}
#galaxy-decoration .banner-story {
  position: absolute;
  bottom: 0;
  right: 15px;
  left: 15px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  z-index: 11;
}
#galaxy-decoration .banner-story-reflection {
  position: absolute;
  top: 60px;
  right: 15px;
  left: 15px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#galaxy-decoration .banner-story-reflection img {
  -webkit-transform: scaleX(-1) rotate(180deg);
  -moz-transform: scaleX(-1) rotate(180deg);
  -o-transform: scaleX(-1) rotate(180deg);
  -ms-transform: scaleX(-1) rotate(180deg);
  transform: scaleX(-1) rotate(180deg);
  filter: FlipH;
  -ms-filter: "FlipH";
  -moz-opacity: 0.1;
  -khtml-opacity: 0.1;
  -webkit-opacity: 0.1;
  opacity: 0.1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=10);
  filter: alpha(opacity=10);
}
#galaxy-decoration .banner-story-reflection .person-1,
#galaxy-decoration .banner-story-reflection .person-2,
#galaxy-decoration .banner-story-reflection .person-3,
#galaxy-decoration .banner-story-reflection .person-4 {
  bottom: -65px !important;
}
#galaxy-decoration .banner-person {
  cursor: pointer;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  z-index: 10;
}
#galaxy-decoration .banner-person.active {
  -webkit-transform: translate(0, 60px);
  -moz-transform: translate(0, 60px);
  -o-transform: translate(0, 60px);
  -ms-transform: translate(0, 60px);
  transform: translate(0, 60px);
}
#galaxy-decoration .banner-person.hidden-elm {
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter: alpha(opacity=0);
}
#galaxy-decoration .person-1 {
  position: absolute;
  bottom: 0;
  left: -16px;
  width: 97%;
}
#galaxy-decoration .person-2 {
  position: absolute;
  bottom: 0;
  right: 36px;
  width: 60%;
}
#galaxy-decoration .person-3 {
  position: absolute;
  bottom: 0;
  right: 36px;
  width: 66%;
}
#galaxy-decoration .person-4 {
  position: absolute;
  bottom: 0;
  right: -5px;
  width: 86%;
}
#galaxy-decoration .landing-story {
  position: relative;
  background-color: #ffffff;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(rgba(0, 0, 0, 0.2)));
  background-image: -webkit-linear-gradient(top, #ffffff, rgba(0, 0, 0, 0.2));
  background-image: -moz-linear-gradient(top, #ffffff, rgba(0, 0, 0, 0.2));
  background-image: -ms-linear-gradient(top, #ffffff, rgba(0, 0, 0, 0.2));
  background-image: -o-linear-gradient(top, #ffffff, rgba(0, 0, 0, 0.2));
}
#galaxy-decoration .landing-story:after {
  content: '';
  position: absolute;
  bottom: 0;
  border: 0;
  height: 8px;
  width: 100%;
  background: #6b2b85;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #6b2b85), color-stop(50%, #f07721), color-stop(100%, #f6ea23));
  background: -webkit-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -moz-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -ms-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: -o-linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  background: linear-gradient(left, #6b2b85 0%, #f07721 50%, #f6ea23 100%);
  z-index: 21;
}
#galaxy-decoration .landing-story .middle-wrapper {
  position: relative;
  height: 100%;
}
#galaxy-decoration .landing-story .person-info {
  position: relative;
  padding: 0 65px 0 75px;
  z-index: 11;
}
#galaxy-decoration .landing-story .person-info:before {
  content: '';
  position: absolute;
  top: 50px;
  left: 0;
  width: 69px;
  height: 44px;
  background: transparent url('../../bundles/app/images/landing/double-quote-left.png') no-repeat center center;
}
#galaxy-decoration .landing-story .person-info:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 55px;
  height: 35px;
  background: transparent url('../../bundles/app/images/landing/double-quote-right.png') no-repeat center center;
}
#galaxy-decoration .landing-story .person-info h1,
#galaxy-decoration .landing-story .person-info p {
  color: #62368c;
}
#galaxy-decoration .landing-story .person-info .person-name {
  font-size: 18px;
  font-weight: 700;
  margin-top: 36%;
}
#galaxy-decoration .landing-story .person-info .person-job {
  font-weight: 700;
  margin: 5px 0 8px;
}
#galaxy-decoration .landing-story .person-image {
  position: relative;
  margin-top: 38px;
  z-index: 20;
}
#galaxy-decoration .landing-story .person-image img {
  display: inline-block;
}
#galaxy-decoration .landing-story .person-image.change img:last-child {
  display: none;
}
#galaxy-decoration .landing-event {
  background-color: #edb4ba;
  background-image: -webkit-gradient(linear, left top, right top, from(#edb4ba), to(#7499cd));
  background-image: -webkit-linear-gradient(left, #edb4ba, #7499cd);
  background-image: -moz-linear-gradient(left, #edb4ba, #7499cd);
  background-image: -ms-linear-gradient(left, #edb4ba, #7499cd);
  background-image: -o-linear-gradient(left, #edb4ba, #7499cd);
}
#galaxy-decoration .landing-event .group-img {
  margin-top: 50px;
}
#galaxy-decoration .landing-event h1,
#galaxy-decoration .landing-event p {
  color: #fff;
}
#galaxy-decoration .landing-event a {
  display: inline-block;
  color: #fff;
}
#galaxy-decoration .landing-event .event-title {
  font-family: 'iCielBambola', sans-serif;
  font-size: 50px;
  letter-spacing: 1px;
}
#galaxy-decoration .landing-event .event-desc {
  margin: 14px 0 24px 0;
}
#galaxy-decoration .landing-event .event-desc > span {
  font-size: 20px;
  font-weight: 700;
}
#galaxy-decoration .landing-event .event-desc .event-line {
  display: block;
  width: 84px;
  height: 4px;
  background-color: #fff;
  margin: 30px auto 20px;
}
#galaxy-decoration .landing-event .btn-event {
  width: 150px;
  height: 50px;
  background-color: #7299cc;
  border: 2px solid #fff;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  color: #fff;
  font-size: 16px;
  font-weight: 800;
  text-align: center;
  padding: 0;
}
#galaxy-decoration .landing-event .btn-event.btn-rule {
  margin-right: 25px;
}
#galaxy-decoration .landing-event .btn-event:hover {
  background-color: #fff;
}
#galaxy-decoration .landing-event .btn-event:hover.btn-rule,
#galaxy-decoration .landing-event .btn-event:hover.btn-join {
  color: #7299cc;
}
#galaxy-decoration .landing-entry {
  padding: 30px 0;
}
#galaxy-decoration .landing-entry .entry-slide {
  margin-bottom: 15px;
}
#galaxy-decoration .landing-entry .entry-slide .slide-control {
  position: absolute;
  bottom: 0;
}
#galaxy-decoration .landing-entry .entry-slide .btn-prev,
#galaxy-decoration .landing-entry .entry-slide .btn-next {
  background-color: #0e112a;
  display: inline-block;
  width: 50px;
  height: 50px;
  text-align: center;
  cursor: pointer;
  margin-right: 3px;
}
#galaxy-decoration .landing-entry .entry-slide .btn-prev > i,
#galaxy-decoration .landing-entry .entry-slide .btn-next > i {
  color: #fff;
  font-size: 16px;
  line-height: 50px;
}
#galaxy-decoration .landing-entry .entry-slide .btn-prev:hover,
#galaxy-decoration .landing-entry .entry-slide .btn-next:hover {
  background-color: #10154d;
}
#galaxy-decoration .landing-entry .entry-share {
  position: relative;
  margin-bottom: 15px;
}
#galaxy-decoration .landing-entry .entry-caption {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
#galaxy-decoration .landing-entry .entry-caption h1 {
  color: #fff;
  font-family: 'iCielBambola', sans-serif;
  line-height: 45px;
}
#galaxy-decoration .landing-entry .entry-caption h2 {
  color: #fff;
  font-weight: 700;
}
#galaxy-decoration .landing-entry .entry-caption p {
  color: #fff;
  margin-top: 5%;
}
#galaxy-decoration .landing-entry .entry-item {
  margin: 15px 0;
}
#galaxy-decoration .landing-entry .entry-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
}
#galaxy-decoration .landing-entry .entry-wrapper:before {
  content: "";
  display: block;
  padding-top: 100%;
}
#galaxy-decoration .landing-entry .entry-wrapper .entry-img {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  background: transparent no-repeat scroll center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-transition: -moz-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  -o-transition: -o-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}
#galaxy-decoration .landing-entry .entry-wrapper:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(95, 33, 121, 0.3);
  -webkit-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  -o-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  -ms-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter: alpha(opacity=0);
}
#galaxy-decoration .landing-entry .entry-wrapper:hover .entry-img {
  -webkit-transform: scale(1.25, 1.25);
  -moz-transform: scale(1.25, 1.25);
  -o-transform: scale(1.25, 1.25);
  -ms-transform: scale(1.25, 1.25);
  transform: scale(1.25, 1.25);
}
#galaxy-decoration .landing-entry .entry-wrapper:hover::after {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
}
#galaxy-decoration .landing-entry .entry-time {
  position: absolute;
  top: 0;
  left: 0;
  padding: 3% 5%;
  color: #fff;
  font-size: 15px;
  background-color: #f0b5b9;
  z-index: 10;
}
#galaxy-decoration .landing-entry .entry-title {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}
#galaxy-decoration .landing-entry .entry-title > p {
  display: block;
  width: 100%;
  text-overflow: ellipsis;
  color: #fff;
  font-family: 'iCielBambola', sans-serif;
  font-size: 30px;
  line-height: 35px;
  background-color: rgba(121, 155, 203, 0.6);
  white-space: nowrap;
  letter-spacing: 1px;
  padding: 4px 15px;
  overflow: hidden;
}
#galaxy-decoration .landing-entry .slide-pic {
  width: 100%;
  height: 360px;
  background: transparent no-repeat scroll 50% 30%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
#galaxy-decoration .landing-entry .slide-time {
  position: absolute;
  top: 0;
  left: 0;
  padding: 1% 3%;
  color: #fff !important;
  font-size: 16px;
  background-color: #f0b5b9;
  z-index: 10;
}
#galaxy-decoration .landing-entry .slide-title {
  float: right;
  position: absolute;
  top: 0;
  right: -2px;
  z-index: 10;
}
#galaxy-decoration .landing-entry .slide-title > p {
  display: inline-block;
  color: #fff;
  font-family: 'iCielBambola', sans-serif;
  font-size: 38px;
  line-height: 35px;
  background-color: rgba(121, 155, 203, 0.6);
  white-space: nowrap;
  letter-spacing: 1px;
  text-align: right;
  padding: 4px 15px;
}
#galaxy-decoration .landing-entry .btn-loadmore {
  display: inline-block;
  background-color: #d59fc1;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  border: 2px solid #d59fc1;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  padding: 12px 26px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#galaxy-decoration .landing-entry .btn-loadmore:hover {
  background-color: #fff;
  color: #d59fc1;
}
@media (min-width: 1200px) {
  #galaxy-decoration .paint-roller {
    width: 566px;
    height: 117px;
  }
  #galaxy-decoration .entry-caption {
    padding: 5% 8%;
  }
  #galaxy-decoration .entry-caption h1 {
    font-size: 60px;
    margin-top: 30%;
  }
  #galaxy-decoration .entry-caption h2 {
    font-size: 35px;
  }
  #galaxy-decoration .event-intro {
    margin: 45px 0;
  }
}
@media (max-width: 991px) {
  #galaxy-decoration .landing-event .btn-event {
    width: 120px;
    height: 40px;
    font-size: 15px;
  }
  #galaxy-decoration .event-title {
    font-size: 40px !important;
  }
  #galaxy-decoration .event-desc > span {
    font-size: 16px !important;
  }
  #galaxy-decoration .person-info {
    padding: 0 !important;
  }
  #galaxy-decoration .person-info:before {
    top: 44px !important;
    left: -5px !important;
  }
  #galaxy-decoration .person-info:after {
    bottom: -14px !important;
  }
  #galaxy-decoration .person-info:before,
  #galaxy-decoration .person-info:after {
    width: 55px !important;
    height: 35px !important;
    background-size: 80% !important;
  }
  #galaxy-decoration .person-name {
    margin-top: 22% !important;
  }
  #galaxy-decoration .person-quote {
    text-indent: 60px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-decoration .paint-roller {
    width: 509px;
    height: 105px;
    background-size: 90% !important;
  }
  #galaxy-decoration .btn-prev,
  #galaxy-decoration .btn-next {
    width: 40px !important;
    height: 40px !important;
  }
  #galaxy-decoration .btn-prev > i,
  #galaxy-decoration .btn-next > i {
    line-height: 40px !important;
  }
  #galaxy-decoration .entry-caption {
    padding: 4% 7%;
  }
  #galaxy-decoration .entry-caption h1 {
    font-size: 50px;
    margin-top: 20%;
  }
  #galaxy-decoration .entry-caption h2 {
    font-size: 30px;
  }
  #galaxy-decoration .entry-title > p {
    font-size: 28px !important;
  }
  #galaxy-decoration .event-intro {
    margin: 30px 0;
  }
  #galaxy-decoration .event-title {
    font-size: 45px !important;
  }
  #galaxy-decoration .event-desc > span {
    font-size: 18px !important;
  }
  #galaxy-decoration #story-4 .person-info {
    margin-top: -80px !important;
  }
  #galaxy-decoration .slide-pic {
    height: 294px !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-decoration .landing-background {
    height: 475px;
  }
  #galaxy-decoration .paint-roller {
    top: 90px !important;
    width: 453px;
    height: 94px;
    background-size: 80% !important;
  }
  #galaxy-decoration .btn-prev,
  #galaxy-decoration .btn-next {
    width: 30px !important;
    height: 30px !important;
  }
  #galaxy-decoration .btn-prev > i,
  #galaxy-decoration .btn-next > i {
    line-height: 30px !important;
  }
  #galaxy-decoration .event-intro {
    margin: 10px 0;
  }
  #galaxy-decoration .event-desc {
    margin: 5px 0 10px 0 !important;
  }
  #galaxy-decoration .event-line {
    margin: 10px auto !important;
  }
  #galaxy-decoration .landing-event .group-img {
    margin-top: 95px !important;
  }
  #galaxy-decoration .entry-caption {
    padding: 3% 8%;
  }
  #galaxy-decoration .entry-caption h1 {
    font-size: 40px;
    margin-top: 14%;
  }
  #galaxy-decoration .entry-caption h2 {
    font-size: 25px;
  }
  #galaxy-decoration .entry-title > p,
  #galaxy-decoration .slide-title > p {
    font-size: 26px !important;
  }
  #galaxy-decoration .slide-title > p {
    padding: 0 15px !important;
  }
  #galaxy-decoration .story-detail {
    height: 400px;
    overflow: hidden;
  }
  #galaxy-decoration .person-info {
    margin-bottom: 10%;
  }
  #galaxy-decoration #story-1 img {
    width: 70%;
  }
  #galaxy-decoration #story-2 img {
    width: 80%;
  }
  #galaxy-decoration #story-4 img {
    margin-top: 28px !important;
  }
  #galaxy-decoration .person-image.change img:first-child {
    display: none !important;
  }
  #galaxy-decoration .person-image.change img:last-child {
    display: inline-block !important;
  }
  #galaxy-decoration .slide-pic {
    height: 220px !important;
  }
}
@media (max-width: 767px) {
  #galaxy-decoration .event-intro {
    margin: 20px 0;
  }
  #galaxy-decoration .event-desc {
    margin: 10px 0 20px 0 !important;
  }
  #galaxy-decoration .event-line {
    margin: 15px auto 10px !important;
  }
  #galaxy-decoration .landing-background {
    height: 375px;
  }
  #galaxy-decoration .paint-roller {
    top: 10px !important;
    width: 453px;
    height: 94px;
    background-size: 80% !important;
  }
  #galaxy-decoration .banner-caption {
    margin-top: 14% !important;
  }
  #galaxy-decoration .entry-slide .slide-title > p {
    font-size: 30px !important;
    padding: 0 15px !important;
  }
  #galaxy-decoration .entry-slide .btn-prev,
  #galaxy-decoration .entry-slide .btn-next {
    width: 30px !important;
    height: 30px !important;
  }
  #galaxy-decoration .entry-slide .btn-prev > i,
  #galaxy-decoration .entry-slide .btn-next > i {
    font-size: 12px !important;
    line-height: 30px !important;
  }
  #galaxy-decoration .landing-entry img {
    width: 100%;
  }
  #galaxy-decoration .entry-caption {
    padding: 5% 8%;
  }
  #galaxy-decoration .entry-caption h1 {
    font-size: 60px;
    margin-top: 26%;
  }
  #galaxy-decoration .entry-caption h2 {
    font-size: 40px;
  }
}
@media (max-width: 500px) {
  #galaxy-decoration .banner-caption {
    margin-top: 33% !important;
  }
}
@-webkit-keyframes balloon1 {
  0%,
  50%,
  100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(-15px, 15px);
  }
  75% {
    transform: translate(15px, 15px);
  }
}
@-moz-keyframes balloon1 {
  0%,
  50%,
  100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(-15px, 15px);
  }
  75% {
    transform: translate(15px, 15px);
  }
}
@-o-keyframes balloon1 {
  0%,
  50%,
  100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(-15px, 15px);
  }
  75% {
    transform: translate(15px, 15px);
  }
}
@keyframes balloon1 {
  0%,
  50%,
  100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(-15px, 15px);
  }
  75% {
    transform: translate(15px, 15px);
  }
}
@-webkit-keyframes balloon2 {
  0%,
  50%,
  100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(15px, 15px);
  }
  75% {
    transform: translate(-15px, 15px);
  }
}
@-moz-keyframes balloon2 {
  0%,
  50%,
  100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(15px, 15px);
  }
  75% {
    transform: translate(-15px, 15px);
  }
}
@-o-keyframes balloon2 {
  0%,
  50%,
  100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(15px, 15px);
  }
  75% {
    transform: translate(-15px, 15px);
  }
}
@keyframes balloon2 {
  0%,
  50%,
  100% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(15px, 15px);
  }
  75% {
    transform: translate(-15px, 15px);
  }
}
.balloons {
  position: absolute;
  height: 100%;
  width: 100%;
  overflow: hidden;
}
.balloon {
  display: block;
  width: 70px;
  height: 95px;
  opacity: 0.8;
  position: absolute;
  cursor: pointer;
}
.balloon-1 {
  left: 90%;
  animation: flyingBalloon 5s;
  -webkit-animation: flyingBalloon 5s;
  width: 94px;
  height: 117px;
  background: transparent url("../../bundles/app/images/landing/balloon-1.png") no-repeat center center;
}
.balloon-2 {
  left: 45%;
  animation: flyingBalloon 7s;
  -webkit-animation: flyingBalloon 7s;
  width: 114px;
  height: 159px;
  background: transparent url("../../bundles/app/images/landing/balloon-2.png") no-repeat center center;
}
.balloon-3 {
  left: 70%;
  animation: flyingBalloon 9s;
  -webkit-animation: flyingBalloon 9s;
  width: 91px;
  height: 134px;
  background: transparent url("../../bundles/app/images/landing/balloon-3.png") no-repeat center center;
}
@-webkit-keyframes flyingBalloon {
  from {
    bottom: -10%;
  }
  to {
    bottom: 110%;
  }
}
@-moz-keyframes flyingBalloon {
  from {
    bottom: -10%;
  }
  to {
    bottom: 110%;
  }
}
@-ms-keyframes flyingBalloon {
  from {
    bottom: -10%;
  }
  to {
    bottom: 110%;
  }
}
@-o-keyframes flyingBalloon {
  from {
    bottom: -10%;
  }
  to {
    bottom: 110%;
  }
}
@keyframes flyingBalloon {
  from {
    bottom: -10%;
  }
  to {
    bottom: 110%;
  }
}
.balloon {
  position: absolute;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  animation-delay: -120s;
  -webkit-animation-delay: -120s;
}
.night-sky {
  position: absolute;
  top: 45%;
  left: 0;
  width: 100%;
  height: 100%;
}
.star {
  width: 2px;
  height: 2px;
  background: #fff;
  box-shadow: 0 0 3px #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
}
.twinkle-star-1 {
  width: 2px;
  height: 2px;
  left: 77%;
  top: 16%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.20779s;
  animation-delay: 0.20779s;
}
.twinkle-star-2 {
  width: 2px;
  height: 2px;
  left: 71%;
  top: 52%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.73239s;
  animation-delay: 0.73239s;
}
.twinkle-star-3 {
  width: 3px;
  height: 3px;
  left: 66%;
  top: 71%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.07576s;
  animation-delay: 1.07576s;
}
.twinkle-star-4 {
  width: 2px;
  height: 2px;
  left: 59%;
  top: 24%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.40678s;
  animation-delay: 0.40678s;
}
.twinkle-star-5 {
  width: 3px;
  height: 3px;
  left: 25%;
  top: 48%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.92s;
  animation-delay: 1.92s;
}
.twinkle-star-6 {
  width: 2px;
  height: 2px;
  left: 74%;
  top: 69%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.93243s;
  animation-delay: 0.93243s;
}
.twinkle-star-7 {
  width: 2px;
  height: 2px;
  left: 15%;
  top: 79%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 5.26667s;
  animation-delay: 5.26667s;
}
.twinkle-star-8 {
  width: 2px;
  height: 2px;
  left: 83%;
  top: 24%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.28916s;
  animation-delay: 0.28916s;
}
.twinkle-star-9 {
  width: 2px;
  height: 2px;
  left: 82%;
  top: 59%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.71951s;
  animation-delay: 0.71951s;
}
.twinkle-star-10 {
  width: 2px;
  height: 2px;
  left: 59%;
  top: 16%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.27119s;
  animation-delay: 0.27119s;
}
.twinkle-star-11 {
  width: 2px;
  height: 2px;
  left: 79%;
  top: 24%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.3038s;
  animation-delay: 0.3038s;
}
.twinkle-star-12 {
  width: 2px;
  height: 2px;
  left: 26%;
  top: 85%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 3.26923s;
  animation-delay: 3.26923s;
}
.twinkle-star-13 {
  width: 3px;
  height: 3px;
  left: 32%;
  top: 26%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.8125s;
  animation-delay: 0.8125s;
}
.twinkle-star-14 {
  width: 3px;
  height: 3px;
  left: 56%;
  top: 90%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.60714s;
  animation-delay: 1.60714s;
}
.twinkle-star-15 {
  width: 3px;
  height: 3px;
  left: 94%;
  top: 59%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.62766s;
  animation-delay: 0.62766s;
}
.twinkle-star-16 {
  width: 2px;
  height: 2px;
  left: 53%;
  top: 71%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.33962s;
  animation-delay: 1.33962s;
}
.twinkle-star-17 {
  width: 3px;
  height: 3px;
  left: 80%;
  top: 70%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.875s;
  animation-delay: 0.875s;
}
.twinkle-star-18 {
  width: 2px;
  height: 2px;
  left: 65%;
  top: 24%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.36923s;
  animation-delay: 0.36923s;
}
.twinkle-star-19 {
  width: 3px;
  height: 3px;
  left: 1%;
  top: 100%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 100s;
  animation-delay: 100s;
}
.twinkle-star-20 {
  width: 2px;
  height: 2px;
  left: 39%;
  top: 45%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.15385s;
  animation-delay: 1.15385s;
}
.twinkle-star-21 {
  width: 3px;
  height: 3px;
  left: 92%;
  top: 37%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.40217s;
  animation-delay: 0.40217s;
}
.twinkle-star-22 {
  width: 3px;
  height: 3px;
  left: 45%;
  top: 92%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 2.04444s;
  animation-delay: 2.04444s;
}
.twinkle-star-23 {
  width: 2px;
  height: 2px;
  left: 100%;
  top: 25%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.25s;
  animation-delay: 0.25s;
}
.twinkle-star-24 {
  width: 2px;
  height: 2px;
  left: 38%;
  top: 88%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 2.31579s;
  animation-delay: 2.31579s;
}
.twinkle-star-25 {
  width: 2px;
  height: 2px;
  left: 89%;
  top: 87%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.97753s;
  animation-delay: 0.97753s;
}
.twinkle-star-26 {
  width: 3px;
  height: 3px;
  left: 2%;
  top: 23%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 11.5s;
  animation-delay: 11.5s;
}
.twinkle-star-27 {
  width: 2px;
  height: 2px;
  left: 70%;
  top: 54%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.77143s;
  animation-delay: 0.77143s;
}
.twinkle-star-28 {
  width: 3px;
  height: 3px;
  left: 94%;
  top: 45%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.47872s;
  animation-delay: 0.47872s;
}
.twinkle-star-29 {
  width: 2px;
  height: 2px;
  left: 70%;
  top: 61%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.87143s;
  animation-delay: 0.87143s;
}
.twinkle-star-30 {
  width: 2px;
  height: 2px;
  left: 24%;
  top: 42%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.75s;
  animation-delay: 1.75s;
}
.twinkle-star-31 {
  width: 2px;
  height: 2px;
  left: 58%;
  top: 85%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.46552s;
  animation-delay: 1.46552s;
}
.twinkle-star-32 {
  width: 2px;
  height: 2px;
  left: 94%;
  top: 76%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.80851s;
  animation-delay: 0.80851s;
}
.twinkle-star-33 {
  width: 3px;
  height: 3px;
  left: 22%;
  top: 88%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}
.twinkle-star-34 {
  width: 2px;
  height: 2px;
  left: 26%;
  top: 27%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.03846s;
  animation-delay: 1.03846s;
}
.twinkle-star-35 {
  width: 3px;
  height: 3px;
  left: 66%;
  top: 82%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.24242s;
  animation-delay: 1.24242s;
}
.twinkle-star-36 {
  width: 3px;
  height: 3px;
  left: 69%;
  top: 85%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.23188s;
  animation-delay: 1.23188s;
}
.twinkle-star-37 {
  width: 3px;
  height: 3px;
  left: 54%;
  top: 25%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.46296s;
  animation-delay: 0.46296s;
}
.twinkle-star-38 {
  width: 3px;
  height: 3px;
  left: 6%;
  top: 36%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 6s;
  animation-delay: 6s;
}
.twinkle-star-39 {
  width: 3px;
  height: 3px;
  left: 85%;
  top: 94%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.10588s;
  animation-delay: 1.10588s;
}
.twinkle-star-40 {
  width: 2px;
  height: 2px;
  left: 73%;
  top: 15%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.20548s;
  animation-delay: 0.20548s;
}
.twinkle-star-41 {
  width: 2px;
  height: 2px;
  left: 56%;
  top: 87%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.55357s;
  animation-delay: 1.55357s;
}
.twinkle-star-42 {
  width: 2px;
  height: 2px;
  left: 20%;
  top: 64%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 3.2s;
  animation-delay: 3.2s;
}
.twinkle-star-43 {
  width: 3px;
  height: 3px;
  left: 33%;
  top: 2%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.06061s;
  animation-delay: 0.06061s;
}
.twinkle-star-44 {
  width: 2px;
  height: 2px;
  left: 29%;
  top: 30%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.03448s;
  animation-delay: 1.03448s;
}
.twinkle-star-45 {
  width: 2px;
  height: 2px;
  left: 57%;
  top: 62%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.08772s;
  animation-delay: 1.08772s;
}
.twinkle-star-46 {
  width: 2px;
  height: 2px;
  left: 64%;
  top: 66%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.03125s;
  animation-delay: 1.03125s;
}
.twinkle-star-47 {
  width: 2px;
  height: 2px;
  left: 60%;
  top: 48%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}
.twinkle-star-48 {
  width: 2px;
  height: 2px;
  left: 34%;
  top: 81%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 2.38235s;
  animation-delay: 2.38235s;
}
.twinkle-star-49 {
  width: 3px;
  height: 3px;
  left: 93%;
  top: 30%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.32258s;
  animation-delay: 0.32258s;
}
.twinkle-star-50 {
  width: 3px;
  height: 3px;
  left: 56%;
  top: 69%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.23214s;
  animation-delay: 1.23214s;
}
.twinkle-star-51 {
  width: 3px;
  height: 3px;
  left: 26%;
  top: 20%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.76923s;
  animation-delay: 0.76923s;
}
.twinkle-star-52 {
  width: 3px;
  height: 3px;
  left: 67%;
  top: 36%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.53731s;
  animation-delay: 0.53731s;
}
.twinkle-star-53 {
  width: 2px;
  height: 2px;
  left: 33%;
  top: 20%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.60606s;
  animation-delay: 0.60606s;
}
.twinkle-star-54 {
  width: 3px;
  height: 3px;
  left: 90%;
  top: 30%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.33333s;
  animation-delay: 0.33333s;
}
.twinkle-star-55 {
  width: 3px;
  height: 3px;
  left: 72%;
  top: 40%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.55556s;
  animation-delay: 0.55556s;
}
.twinkle-star-56 {
  width: 2px;
  height: 2px;
  left: 99%;
  top: 16%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.16162s;
  animation-delay: 0.16162s;
}
.twinkle-star-57 {
  width: 2px;
  height: 2px;
  left: 9%;
  top: 58%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 6.44444s;
  animation-delay: 6.44444s;
}
.twinkle-star-58 {
  width: 2px;
  height: 2px;
  left: 9%;
  top: 90%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 10s;
  animation-delay: 10s;
}
.twinkle-star-59 {
  width: 3px;
  height: 3px;
  left: 70%;
  top: 53%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.75714s;
  animation-delay: 0.75714s;
}
.twinkle-star-60 {
  width: 3px;
  height: 3px;
  left: 92%;
  top: 53%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.57609s;
  animation-delay: 0.57609s;
}
.twinkle-star-61 {
  width: 2px;
  height: 2px;
  left: 22%;
  top: 2%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.09091s;
  animation-delay: 0.09091s;
}
.twinkle-star-62 {
  width: 3px;
  height: 3px;
  left: 64%;
  top: 15%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.23438s;
  animation-delay: 0.23438s;
}
.twinkle-star-63 {
  width: 3px;
  height: 3px;
  left: 32%;
  top: 61%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.90625s;
  animation-delay: 1.90625s;
}
.twinkle-star-64 {
  width: 3px;
  height: 3px;
  left: 56%;
  top: 55%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.98214s;
  animation-delay: 0.98214s;
}
.twinkle-star-65 {
  width: 3px;
  height: 3px;
  left: 53%;
  top: 18%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.33962s;
  animation-delay: 0.33962s;
}
.twinkle-star-66 {
  width: 2px;
  height: 2px;
  left: 22%;
  top: 89%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 4.04545s;
  animation-delay: 4.04545s;
}
.twinkle-star-67 {
  width: 3px;
  height: 3px;
  left: 86%;
  top: 56%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.65116s;
  animation-delay: 0.65116s;
}
.twinkle-star-68 {
  width: 3px;
  height: 3px;
  left: 91%;
  top: 43%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.47253s;
  animation-delay: 0.47253s;
}
.twinkle-star-69 {
  width: 3px;
  height: 3px;
  left: 33%;
  top: 64%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.93939s;
  animation-delay: 1.93939s;
}
.twinkle-star-70 {
  width: 2px;
  height: 2px;
  left: 19%;
  top: 78%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 4.10526s;
  animation-delay: 4.10526s;
}
.twinkle-star-71 {
  width: 3px;
  height: 3px;
  left: 32%;
  top: 51%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.59375s;
  animation-delay: 1.59375s;
}
.twinkle-star-72 {
  width: 2px;
  height: 2px;
  left: 78%;
  top: 67%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.85897s;
  animation-delay: 0.85897s;
}
.twinkle-star-73 {
  width: 3px;
  height: 3px;
  left: 84%;
  top: 27%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.32143s;
  animation-delay: 0.32143s;
}
.twinkle-star-74 {
  width: 3px;
  height: 3px;
  left: 26%;
  top: 74%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 2.84615s;
  animation-delay: 2.84615s;
}
.twinkle-star-75 {
  width: 2px;
  height: 2px;
  left: 68%;
  top: 19%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.27941s;
  animation-delay: 0.27941s;
}
.twinkle-star-76 {
  width: 3px;
  height: 3px;
  left: 71%;
  top: 24%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.33803s;
  animation-delay: 0.33803s;
}
.twinkle-star-77 {
  width: 2px;
  height: 2px;
  left: 57%;
  top: 48%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.84211s;
  animation-delay: 0.84211s;
}
.twinkle-star-78 {
  width: 2px;
  height: 2px;
  left: 40%;
  top: 7%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.175s;
  animation-delay: 0.175s;
}
.twinkle-star-79 {
  width: 3px;
  height: 3px;
  left: 46%;
  top: 49%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.06522s;
  animation-delay: 1.06522s;
}
.twinkle-star-80 {
  width: 3px;
  height: 3px;
  left: 22%;
  top: 58%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 2.63636s;
  animation-delay: 2.63636s;
}
.twinkle-star-81 {
  width: 2px;
  height: 2px;
  left: 84%;
  top: 32%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.38095s;
  animation-delay: 0.38095s;
}
.twinkle-star-82 {
  width: 3px;
  height: 3px;
  left: 57%;
  top: 51%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.89474s;
  animation-delay: 0.89474s;
}
.twinkle-star-83 {
  width: 2px;
  height: 2px;
  left: 82%;
  top: 75%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.91463s;
  animation-delay: 0.91463s;
}
.twinkle-star-84 {
  width: 3px;
  height: 3px;
  left: 18%;
  top: 10%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.55556s;
  animation-delay: 0.55556s;
}
.twinkle-star-85 {
  width: 2px;
  height: 2px;
  left: 64%;
  top: 26%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.40625s;
  animation-delay: 0.40625s;
}
.twinkle-star-86 {
  width: 2px;
  height: 2px;
  left: 7%;
  top: 26%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 3.71429s;
  animation-delay: 3.71429s;
}
.twinkle-star-87 {
  width: 3px;
  height: 3px;
  left: 20%;
  top: 95%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 4.75s;
  animation-delay: 4.75s;
}
.twinkle-star-88 {
  width: 3px;
  height: 3px;
  left: 9%;
  top: 28%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 3.11111s;
  animation-delay: 3.11111s;
}
.twinkle-star-89 {
  width: 2px;
  height: 2px;
  left: 6%;
  top: 28%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 4.66667s;
  animation-delay: 4.66667s;
}
.twinkle-star-90 {
  width: 2px;
  height: 2px;
  left: 12%;
  top: 12%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
.twinkle-star-91 {
  width: 3px;
  height: 3px;
  left: 26%;
  top: 7%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.26923s;
  animation-delay: 0.26923s;
}
.twinkle-star-92 {
  width: 2px;
  height: 2px;
  left: 22%;
  top: 76%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 3.45455s;
  animation-delay: 3.45455s;
}
.twinkle-star-93 {
  width: 2px;
  height: 2px;
  left: 16%;
  top: 62%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 3.875s;
  animation-delay: 3.875s;
}
.twinkle-star-94 {
  width: 2px;
  height: 2px;
  left: 44%;
  top: 19%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.43182s;
  animation-delay: 0.43182s;
}
.twinkle-star-95 {
  width: 2px;
  height: 2px;
  left: 35%;
  top: 1%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.02857s;
  animation-delay: 0.02857s;
}
.twinkle-star-96 {
  width: 3px;
  height: 3px;
  left: 61%;
  top: 44%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.72131s;
  animation-delay: 0.72131s;
}
.twinkle-star-97 {
  width: 2px;
  height: 2px;
  left: 58%;
  top: 90%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.55172s;
  animation-delay: 1.55172s;
}
.twinkle-star-98 {
  width: 2px;
  height: 2px;
  left: 23%;
  top: 99%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 4.30435s;
  animation-delay: 4.30435s;
}
.twinkle-star-99 {
  width: 3px;
  height: 3px;
  left: 16%;
  top: 46%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 2.875s;
  animation-delay: 2.875s;
}
.twinkle-star-100 {
  width: 2px;
  height: 2px;
  left: 89%;
  top: 91%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.02247s;
  animation-delay: 1.02247s;
}
.twinkle-star-101 {
  width: 2px;
  height: 2px;
  left: 25%;
  top: 38%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.52s;
  animation-delay: 1.52s;
}
.twinkle-star-102 {
  width: 2px;
  height: 2px;
  left: 44%;
  top: 7%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.15909s;
  animation-delay: 0.15909s;
}
.twinkle-star-103 {
  width: 2px;
  height: 2px;
  left: 32%;
  top: 78%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 2.4375s;
  animation-delay: 2.4375s;
}
.twinkle-star-104 {
  width: 2px;
  height: 2px;
  left: 29%;
  top: 49%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.68966s;
  animation-delay: 1.68966s;
}
.twinkle-star-105 {
  width: 3px;
  height: 3px;
  left: 59%;
  top: 44%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.74576s;
  animation-delay: 0.74576s;
}
.twinkle-star-106 {
  width: 2px;
  height: 2px;
  left: 73%;
  top: 62%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.84932s;
  animation-delay: 0.84932s;
}
.twinkle-star-107 {
  width: 2px;
  height: 2px;
  left: 89%;
  top: 32%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.35955s;
  animation-delay: 0.35955s;
}
.twinkle-star-108 {
  width: 2px;
  height: 2px;
  left: 15%;
  top: 70%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 4.66667s;
  animation-delay: 4.66667s;
}
.twinkle-star-109 {
  width: 2px;
  height: 2px;
  left: 53%;
  top: 47%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.88679s;
  animation-delay: 0.88679s;
}
.twinkle-star-110 {
  width: 3px;
  height: 3px;
  left: 91%;
  top: 79%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.86813s;
  animation-delay: 0.86813s;
}
.twinkle-star-111 {
  width: 2px;
  height: 2px;
  left: 52%;
  top: 45%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.86538s;
  animation-delay: 0.86538s;
}
.twinkle-star-112 {
  width: 3px;
  height: 3px;
  left: 32%;
  top: 30%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.9375s;
  animation-delay: 0.9375s;
}
.twinkle-star-113 {
  width: 3px;
  height: 3px;
  left: 90%;
  top: 74%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.82222s;
  animation-delay: 0.82222s;
}
.twinkle-star-114 {
  width: 2px;
  height: 2px;
  left: 89%;
  top: 43%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.48315s;
  animation-delay: 0.48315s;
}
.twinkle-star-115 {
  width: 3px;
  height: 3px;
  left: 19%;
  top: 40%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 2.10526s;
  animation-delay: 2.10526s;
}
.twinkle-star-116 {
  width: 2px;
  height: 2px;
  left: 74%;
  top: 35%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.47297s;
  animation-delay: 0.47297s;
}
.twinkle-star-117 {
  width: 3px;
  height: 3px;
  left: 4%;
  top: 63%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 15.75s;
  animation-delay: 15.75s;
}
.twinkle-star-118 {
  width: 2px;
  height: 2px;
  left: 3%;
  top: 36%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 12s;
  animation-delay: 12s;
}
.twinkle-star-119 {
  width: 2px;
  height: 2px;
  left: 100%;
  top: 30%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.twinkle-star-120 {
  width: 3px;
  height: 3px;
  left: 16%;
  top: 62%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 3.875s;
  animation-delay: 3.875s;
}
.twinkle-star-121 {
  width: 2px;
  height: 2px;
  left: 12%;
  top: 12%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
.twinkle-star-122 {
  width: 3px;
  height: 3px;
  left: 1%;
  top: 44%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 44s;
  animation-delay: 44s;
}
.twinkle-star-123 {
  width: 3px;
  height: 3px;
  left: 53%;
  top: 58%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.09434s;
  animation-delay: 1.09434s;
}
.twinkle-star-124 {
  width: 2px;
  height: 2px;
  left: 28%;
  top: 5%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.17857s;
  animation-delay: 0.17857s;
}
.twinkle-star-125 {
  width: 3px;
  height: 3px;
  left: 44%;
  top: 42%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.95455s;
  animation-delay: 0.95455s;
}
.twinkle-star-126 {
  width: 2px;
  height: 2px;
  left: 43%;
  top: 26%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.60465s;
  animation-delay: 0.60465s;
}
.twinkle-star-127 {
  width: 3px;
  height: 3px;
  left: 61%;
  top: 68%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.11475s;
  animation-delay: 1.11475s;
}
.twinkle-star-128 {
  width: 2px;
  height: 2px;
  left: 77%;
  top: 76%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.98701s;
  animation-delay: 0.98701s;
}
.twinkle-star-129 {
  width: 3px;
  height: 3px;
  left: 17%;
  top: 10%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.58824s;
  animation-delay: 0.58824s;
}
.twinkle-star-130 {
  width: 3px;
  height: 3px;
  left: 3%;
  top: 45%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 15s;
  animation-delay: 15s;
}
.twinkle-star-131 {
  width: 3px;
  height: 3px;
  left: 60%;
  top: 34%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.56667s;
  animation-delay: 0.56667s;
}
.twinkle-star-132 {
  width: 3px;
  height: 3px;
  left: 6%;
  top: 73%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 12.16667s;
  animation-delay: 12.16667s;
}
.twinkle-star-133 {
  width: 2px;
  height: 2px;
  left: 47%;
  top: 41%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.87234s;
  animation-delay: 0.87234s;
}
.twinkle-star-134 {
  width: 2px;
  height: 2px;
  left: 68%;
  top: 5%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.07353s;
  animation-delay: 0.07353s;
}
.twinkle-star-135 {
  width: 3px;
  height: 3px;
  left: 58%;
  top: 45%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.77586s;
  animation-delay: 0.77586s;
}
.twinkle-star-136 {
  width: 2px;
  height: 2px;
  left: 42%;
  top: 35%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.83333s;
  animation-delay: 0.83333s;
}
.twinkle-star-137 {
  width: 2px;
  height: 2px;
  left: 94%;
  top: 58%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.61702s;
  animation-delay: 0.61702s;
}
.twinkle-star-138 {
  width: 2px;
  height: 2px;
  left: 45%;
  top: 31%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.68889s;
  animation-delay: 0.68889s;
}
.twinkle-star-139 {
  width: 2px;
  height: 2px;
  left: 16%;
  top: 59%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 3.6875s;
  animation-delay: 3.6875s;
}
.twinkle-star-140 {
  width: 3px;
  height: 3px;
  left: 44%;
  top: 17%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.38636s;
  animation-delay: 0.38636s;
}
.twinkle-star-141 {
  width: 3px;
  height: 3px;
  left: 69%;
  top: 70%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.01449s;
  animation-delay: 1.01449s;
}
.twinkle-star-142 {
  width: 3px;
  height: 3px;
  left: 88%;
  top: 47%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.53409s;
  animation-delay: 0.53409s;
}
.twinkle-star-143 {
  width: 2px;
  height: 2px;
  left: 30%;
  top: 81%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 2.7s;
  animation-delay: 2.7s;
}
.twinkle-star-144 {
  width: 3px;
  height: 3px;
  left: 22%;
  top: 18%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.81818s;
  animation-delay: 0.81818s;
}
.twinkle-star-145 {
  width: 2px;
  height: 2px;
  left: 65%;
  top: 42%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.64615s;
  animation-delay: 0.64615s;
}
.twinkle-star-146 {
  width: 3px;
  height: 3px;
  left: 85%;
  top: 40%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.47059s;
  animation-delay: 0.47059s;
}
.twinkle-star-147 {
  width: 2px;
  height: 2px;
  left: 21%;
  top: 11%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.52381s;
  animation-delay: 0.52381s;
}
.twinkle-star-148 {
  width: 2px;
  height: 2px;
  left: 68%;
  top: 22%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.32353s;
  animation-delay: 0.32353s;
}
.twinkle-star-149 {
  width: 3px;
  height: 3px;
  left: 97%;
  top: 14%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.14433s;
  animation-delay: 0.14433s;
}
.twinkle-star-150 {
  width: 2px;
  height: 2px;
  left: 97%;
  top: 48%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.49485s;
  animation-delay: 0.49485s;
}
.twinkle-star-151 {
  width: 2px;
  height: 2px;
  left: 66%;
  top: 11%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.16667s;
  animation-delay: 0.16667s;
}
.twinkle-star-152 {
  width: 3px;
  height: 3px;
  left: 34%;
  top: 34%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
.twinkle-star-153 {
  width: 2px;
  height: 2px;
  left: 76%;
  top: 47%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.61842s;
  animation-delay: 0.61842s;
}
.twinkle-star-154 {
  width: 3px;
  height: 3px;
  left: 81%;
  top: 8%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.09877s;
  animation-delay: 0.09877s;
}
.twinkle-star-155 {
  width: 2px;
  height: 2px;
  left: 88%;
  top: 80%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.90909s;
  animation-delay: 0.90909s;
}
.twinkle-star-156 {
  width: 3px;
  height: 3px;
  left: 32%;
  top: 38%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.1875s;
  animation-delay: 1.1875s;
}
.twinkle-star-157 {
  width: 2px;
  height: 2px;
  left: 77%;
  top: 39%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.50649s;
  animation-delay: 0.50649s;
}
.twinkle-star-158 {
  width: 2px;
  height: 2px;
  left: 37%;
  top: 15%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.40541s;
  animation-delay: 0.40541s;
}
.twinkle-star-159 {
  width: 2px;
  height: 2px;
  left: 40%;
  top: 79%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.975s;
  animation-delay: 1.975s;
}
.twinkle-star-160 {
  width: 3px;
  height: 3px;
  left: 99%;
  top: 63%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.63636s;
  animation-delay: 0.63636s;
}
.twinkle-star-161 {
  width: 3px;
  height: 3px;
  left: 50%;
  top: 42%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.84s;
  animation-delay: 0.84s;
}
.twinkle-star-162 {
  width: 2px;
  height: 2px;
  left: 34%;
  top: 42%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.23529s;
  animation-delay: 1.23529s;
}
.twinkle-star-163 {
  width: 2px;
  height: 2px;
  left: 28%;
  top: 3%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.10714s;
  animation-delay: 0.10714s;
}
.twinkle-star-164 {
  width: 3px;
  height: 3px;
  left: 81%;
  top: 12%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.14815s;
  animation-delay: 0.14815s;
}
.twinkle-star-165 {
  width: 3px;
  height: 3px;
  left: 4%;
  top: 75%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 18.75s;
  animation-delay: 18.75s;
}
.twinkle-star-166 {
  width: 2px;
  height: 2px;
  left: 2%;
  top: 3%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
}
.twinkle-star-167 {
  width: 3px;
  height: 3px;
  left: 15%;
  top: 6%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}
.twinkle-star-168 {
  width: 2px;
  height: 2px;
  left: 58%;
  top: 90%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.55172s;
  animation-delay: 1.55172s;
}
.twinkle-star-169 {
  width: 2px;
  height: 2px;
  left: 6%;
  top: 60%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 10s;
  animation-delay: 10s;
}
.twinkle-star-170 {
  width: 2px;
  height: 2px;
  left: 84%;
  top: 65%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.77381s;
  animation-delay: 0.77381s;
}
.twinkle-star-171 {
  width: 2px;
  height: 2px;
  left: 10%;
  top: 35%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 3.5s;
  animation-delay: 3.5s;
}
.twinkle-star-172 {
  width: 3px;
  height: 3px;
  left: 35%;
  top: 13%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.37143s;
  animation-delay: 0.37143s;
}
.twinkle-star-173 {
  width: 3px;
  height: 3px;
  left: 6%;
  top: 94%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 15.66667s;
  animation-delay: 15.66667s;
}
.twinkle-star-174 {
  width: 3px;
  height: 3px;
  left: 30%;
  top: 66%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 2.2s;
  animation-delay: 2.2s;
}
.twinkle-star-175 {
  width: 2px;
  height: 2px;
  left: 54%;
  top: 20%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.37037s;
  animation-delay: 0.37037s;
}
.twinkle-star-176 {
  width: 3px;
  height: 3px;
  left: 25%;
  top: 69%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 2.76s;
  animation-delay: 2.76s;
}
.twinkle-star-177 {
  width: 2px;
  height: 2px;
  left: 63%;
  top: 74%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 1.1746s;
  animation-delay: 1.1746s;
}
.twinkle-star-178 {
  width: 3px;
  height: 3px;
  left: 87%;
  top: 72%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.82759s;
  animation-delay: 0.82759s;
}
.twinkle-star-179 {
  width: 2px;
  height: 2px;
  left: 17%;
  top: 91%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 5.35294s;
  animation-delay: 5.35294s;
}
.twinkle-star-180 {
  width: 3px;
  height: 3px;
  left: 93%;
  top: 18%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.19355s;
  animation-delay: 0.19355s;
}
.twinkle-star-181 {
  width: 2px;
  height: 2px;
  left: 2%;
  top: 88%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 44s;
  animation-delay: 44s;
}
.twinkle-star-182 {
  width: 3px;
  height: 3px;
  left: 26%;
  top: 20%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.76923s;
  animation-delay: 0.76923s;
}
.twinkle-star-183 {
  width: 2px;
  height: 2px;
  left: 82%;
  top: 20%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.2439s;
  animation-delay: 0.2439s;
}
.twinkle-star-184 {
  width: 3px;
  height: 3px;
  left: 20%;
  top: 44%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 2.2s;
  animation-delay: 2.2s;
}
.twinkle-star-185 {
  width: 2px;
  height: 2px;
  left: 40%;
  top: 14%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.35s;
  animation-delay: 0.35s;
}
.twinkle-star-186 {
  width: 3px;
  height: 3px;
  left: 94%;
  top: 17%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.18085s;
  animation-delay: 0.18085s;
}
.twinkle-star-187 {
  width: 3px;
  height: 3px;
  left: 18%;
  top: 9%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
.twinkle-star-188 {
  width: 3px;
  height: 3px;
  left: 95%;
  top: 15%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.15789s;
  animation-delay: 0.15789s;
}
.twinkle-star-189 {
  width: 3px;
  height: 3px;
  left: 22%;
  top: 89%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 4.04545s;
  animation-delay: 4.04545s;
}
.twinkle-star-190 {
  width: 3px;
  height: 3px;
  left: 79%;
  top: 69%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.87342s;
  animation-delay: 0.87342s;
}
.twinkle-star-191 {
  width: 3px;
  height: 3px;
  left: 45%;
  top: 66%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.46667s;
  animation-delay: 1.46667s;
}
.twinkle-star-192 {
  width: 2px;
  height: 2px;
  left: 30%;
  top: 6%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.twinkle-star-193 {
  width: 3px;
  height: 3px;
  left: 89%;
  top: 18%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 0.20225s;
  animation-delay: 0.20225s;
}
.twinkle-star-194 {
  width: 3px;
  height: 3px;
  left: 45%;
  top: 61%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.35556s;
  animation-delay: 1.35556s;
}
.twinkle-star-195 {
  width: 3px;
  height: 3px;
  left: 35%;
  top: 42%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.2s;
  animation-delay: 1.2s;
}
.twinkle-star-196 {
  width: 3px;
  height: 3px;
  left: 43%;
  top: 61%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.4186s;
  animation-delay: 1.4186s;
}
.twinkle-star-197 {
  width: 3px;
  height: 3px;
  left: 19%;
  top: 89%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 4.68421s;
  animation-delay: 4.68421s;
}
.twinkle-star-198 {
  width: 2px;
  height: 2px;
  left: 32%;
  top: 97%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 3.03125s;
  animation-delay: 3.03125s;
}
.twinkle-star-199 {
  width: 3px;
  height: 3px;
  left: 56%;
  top: 86%;
  -webkit-animation: twinkle 0.75s alternate infinite;
  animation: twinkle 0.75s alternate infinite;
  -webkit-animation-delay: 1.53571s;
  animation-delay: 1.53571s;
}
.twinkle-star-200 {
  width: 2px;
  height: 2px;
  left: 39%;
  top: 89%;
  -webkit-animation: twinkle 0.5s alternate infinite;
  animation: twinkle 0.5s alternate infinite;
  -webkit-animation-delay: 2.28205s;
  animation-delay: 2.28205s;
}
@-webkit-keyframes twinkle {
  0% {
    opacity: .2;
  }
  100% {
    opacity: 1;
  }
}
@keyframes twinkle {
  0% {
    opacity: .2;
  }
  100% {
    opacity: 1;
  }
}
.quiz3-detail {
  display: block;
  width: 100%;
  background-size: 100% auto;
  background-position: center top;
  min-height: 500px;
  background-repeat: no-repeat;
  background-color: white;
  position: relative;
}
@media (max-width: 480px) {
  .quiz3-detail {
    background-size: 255% auto;
  }
}
.quiz3-detail .avatar-quiz3 {
  left: 50%;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: white;
  z-index: 2;
  position: absolute;
  border: 3px solid white;
  margin-left: -180px;
  width: 360px;
  top: 110px;
  height: 360px;
}
.quiz3-detail .avatar-quiz3:before {
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/landing/paint-roller.png") no-repeat scroll center top / 100% auto;
  content: "";
  left: 50%;
  position: absolute;
  bottom: -20px;
  z-index: 3;
  height: 95px;
  margin-left: -270px;
  width: 485px;
}
@media (max-width: 1440px) {
  .quiz3-detail .avatar-quiz3:before {
    height: 75px;
    width: 385px;
    margin-left: -210px;
  }
}
@media (max-width: 980px) {
  .quiz3-detail .avatar-quiz3:before {
    height: 65px;
    margin-left: -180px;
    width: 325px;
  }
}
@media (max-width: 768px) {
  .quiz3-detail .avatar-quiz3:before {
    width: 300px;
    height: 60px;
    margin-left: -165px;
  }
}
@media (max-width: 1440px) {
  .quiz3-detail .avatar-quiz3 {
    margin-left: -140px;
    width: 280px;
    height: 280px;
    top: 65px;
  }
}
@media (max-width: 980px) {
  .quiz3-detail .avatar-quiz3 {
    margin-left: -105px;
    width: 210px;
    top: 25px;
    height: 210px;
  }
}
@media (max-width: 768px) {
  .quiz3-detail .avatar-quiz3 {
    margin-left: -85px;
    width: 190px;
    top: 25px;
    height: 190px;
  }
}
@media (max-width: 480px) {
  .quiz3-detail .avatar-quiz3 {
    margin-left: -90px;
    width: 180px;
    height: 180px;
    top: 90px;
  }
}
@media (max-width: 360px) {
  .quiz3-detail .avatar-quiz3 {
    margin-left: -90px;
    width: 180px;
    height: 180px;
    top: 40px;
  }
}
.quiz3-detail .avatar-quiz3 img,
.quiz3-detail .avatar-quiz3 .image-avatar {
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  height: 340px;
  left: 7px;
  position: absolute;
  top: 7px;
  width: 340px;
}
@media (max-width: 1440px) {
  .quiz3-detail .avatar-quiz3 img,
  .quiz3-detail .avatar-quiz3 .image-avatar {
    height: 260px;
    width: 260px;
  }
}
@media (max-width: 980px) {
  .quiz3-detail .avatar-quiz3 img,
  .quiz3-detail .avatar-quiz3 .image-avatar {
    width: 190px;
    height: 190px;
  }
}
@media (max-width: 768px) {
  .quiz3-detail .avatar-quiz3 img,
  .quiz3-detail .avatar-quiz3 .image-avatar {
    width: 170px;
    height: 170px;
  }
}
@media (max-width: 480px) {
  .quiz3-detail .avatar-quiz3 img,
  .quiz3-detail .avatar-quiz3 .image-avatar {
    width: 160px;
    height: 160px;
  }
}
.quiz3-detail .avatar-quiz3.circle-ava {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.quiz3-detail .avatar-quiz3.circle-ava img {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.quiz3-detail.orange-bg {
  background-image: url("../../bundles/app/images/landing/orange-bg.png");
}
.quiz3-detail.orange-bg .avatar-quiz3 {
  background-image: url("../../bundles/app/images/dialog/orange.png");
}
.quiz3-detail.green-bg {
  background-image: url("../../bundles/app/images/landing/green-bg.png");
}
.quiz3-detail.green-bg .avatar-quiz3 {
  background-image: url("../../bundles/app/images/dialog/green.png");
}
.quiz3-detail.blue-bg {
  background-image: url("../../bundles/app/images/landing/blue-bg.png");
}
.quiz3-detail.blue-bg .avatar-quiz3 {
  background-image: url("../../bundles/app/images/dialog/blue.png");
}
.quiz3-detail.yellow-bg {
  background-image: url("../../bundles/app/images/landing/yellow-bg.png");
}
.quiz3-detail.yellow-bg .avatar-quiz3 {
  background-image: url("../../bundles/app/images/dialog/yellow.png");
}
.quiz3-detail .reply-fb {
  width: 100%;
  display: block;
  position: relative;
}
.quiz3-detail .sub-entry-title {
  font-size: 22px;
  font-weight: bold;
  color: #799bcb;
  margin-top: 50px;
}
@media (max-width: 480px) {
  .quiz3-detail .sub-entry-title {
    margin-top: 20px;
  }
}
.quiz3-detail .entry-share {
  position: relative;
  margin-bottom: 15px;
}
.quiz3-detail .entry-caption {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.quiz3-detail .entry-caption h1 {
  color: #fff;
  font-family: 'iCielBambola', sans-serif;
  line-height: 45px;
}
.quiz3-detail .entry-caption h2 {
  color: #fff;
  font-weight: 700;
}
.quiz3-detail .entry-caption p {
  color: #fff;
  margin-top: 5%;
}
.quiz3-detail .entry-item {
  margin: 15px 0;
}
.quiz3-detail .entry-wrapper {
  margin: 15px 0;
  position: relative;
  overflow: hidden;
}
.quiz3-detail .entry-wrapper .entry-img {
  width: 100%;
  height: 250px;
  background: transparent no-repeat scroll center center / cover;
  -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-transition: -moz-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  -o-transition: -o-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}
.quiz3-detail .entry-wrapper:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(95, 33, 121, 0.3);
  -webkit-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  -o-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  -ms-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  -webkit-opacity: 0;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter: alpha(opacity=0);
}
.quiz3-detail .entry-wrapper:hover .entry-img {
  -webkit-transform: scale(1.25, 1.25);
  -moz-transform: scale(1.25, 1.25);
  -o-transform: scale(1.25, 1.25);
  -ms-transform: scale(1.25, 1.25);
  transform: scale(1.25, 1.25);
}
.quiz3-detail .entry-wrapper:hover::after {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
}
.quiz3-detail .entry-time {
  position: absolute;
  top: 0;
  left: 0;
  padding: 3% 5%;
  color: #fff;
  font-size: 15px;
  background-color: #f0b5b9;
  z-index: 10;
}
.quiz3-detail .entry-title {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}
.quiz3-detail .entry-title p {
  display: block;
  width: 100%;
  text-overflow: ellipsis;
  color: #fff;
  font-family: 'iCielBambola', sans-serif;
  font-size: 30px;
  line-height: 35px;
  background-color: rgba(121, 155, 203, 0.6);
  white-space: nowrap;
  letter-spacing: 1px;
  padding: 4px 15px;
  overflow: hidden;
}
.quiz3-detail .post-block {
  display: block;
  height: 100%;
  padding: 5px 30px 30px;
  position: relative;
  width: 100%;
  z-index: 2;
  margin-top: 500px;
  border-bottom: 1px solid #afafaf;
}
@media (max-width: 1440px) {
  .quiz3-detail .post-block {
    margin-top: 375px;
  }
}
@media (max-width: 980px) {
  .quiz3-detail .post-block {
    margin-top: 250px;
  }
}
@media (max-width: 480px) {
  .quiz3-detail .post-block {
    margin-top: 280px;
  }
}
.quiz3-detail .post-block h1,
.quiz3-detail .post-block p,
.quiz3-detail .post-block .post-info {
  width: 100%;
  display: block;
  text-align: center;
}
.quiz3-detail .post-block h1.title-post {
  font-family: "iCielBambola", sans-serif;
  font-size: 40px;
  letter-spacing: 1px;
  color: #7b9bcc;
  margin-bottom: 15px;
}
.quiz3-detail .post-block p,
.quiz3-detail .post-block .post-info {
  max-width: 750px;
  font-size: 13px;
  margin: 0 auto 10px;
  color: #333333;
}
.quiz3-detail .post-block .post-info span {
  display: block;
  width: 100%;
  text-align: center;
}
.quiz3-detail .post-block .post-info span.person-post {
  font-style: italic;
}
.quiz3-detail .post-block .post-info span.date-post {
  color: #959595;
}
#lucky-painter-header.header-banner {
  display: block;
  width: 100%;
  z-index: 1 !important;
  position: relative;
  background-color: #ebe2db;
}
#lucky-painter-header.header-banner figure {
  text-align: center;
  position: relative;
}
#lucky-painter-header.header-banner figure img {
  width: 100%;
}
#lucky-painter-header.header-banner figure .paint-block-landing {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
  max-width: 1903px;
}
#lucky-painter-header.header-banner figure .banner-landing.mobile,
#lucky-painter-header.header-banner figure .paint-block-landing.mobile {
  display: none;
}
@media (max-width: 768px) {
  #lucky-painter-header.header-banner figure .banner-landing,
  #lucky-painter-header.header-banner figure .paint-block-landing {
    display: none;
  }
  #lucky-painter-header.header-banner figure .banner-landing.mobile,
  #lucky-painter-header.header-banner figure .paint-block-landing.mobile {
    display: block;
  }
}
#lucky-painter-header.header-banner figure .banner-landing-mobile {
  display: none;
}
@media (max-width: 768px) {
  #lucky-painter-header.header-banner figure .banner-landing-mobile {
    display: block;
  }
}
#lucky-painter-header.header-banner .action-content {
  position: absolute;
  left: 0;
  top: 35px;
  width: 100%;
  height: 100%;
}
@media (max-width: 1024px) {
  #lucky-painter-header.header-banner .action-content {
    top: 15px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header.header-banner .action-content {
    top: 15px;
  }
}
@media (max-width: 360px) {
  #lucky-painter-header.header-banner .action-content {
    top: 0;
  }
}
#lucky-painter-header.header-banner .action-content .block-action {
  width: 455px;
  height: auto;
  text-align: center;
  color: white;
  margin-left: 0;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 1460px) {
  #lucky-painter-header.header-banner .action-content .block-action {
    margin-left: 75px;
  }
}
@media (max-width: 1320px) {
  #lucky-painter-header.header-banner .action-content .block-action {
    margin-left: 150px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header.header-banner .action-content .block-action {
    margin-left: 100px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header.header-banner .action-content .block-action {
    margin-left: -20px;
    margin-top: 125px;
  }
}
@media (max-width: 600px) {
  #lucky-painter-header.header-banner .action-content .block-action {
    margin-left: -60px;
    margin-top: 100px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header.header-banner .action-content .block-action {
    margin-top: 15px;
    margin-left: -40px;
    width: 285px;
  }
}
@media (max-width: 360px) {
  #lucky-painter-header.header-banner .action-content .block-action {
    margin-left: -40px;
    width: 275px;
    margin-top: 60px;
  }
}
@media (max-width: 320px) {
  #lucky-painter-header.header-banner .action-content .block-action {
    width: 235px;
  }
}
#lucky-painter-header.header-banner .action-content .block-action .lending-title {
  font-family: 'Bebas', sans-serif;
  font-size: 70px;
  line-height: 55px;
  text-transform: uppercase;
  text-shadow: -5px 3px 2px rgba(78, 58, 9, 0.4);
  margin-bottom: 25px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header.header-banner .action-content .block-action .lending-title {
    font-size: 90px;
    line-height: 75px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header.header-banner .action-content .block-action .lending-title {
    margin-bottom: 10px;
    font-size: 50px;
    line-height: 50px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header.header-banner .action-content .block-action .lending-title {
    margin-bottom: 10px;
    font-size: 60px;
    line-height: 60px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header.header-banner .action-content .block-action .lending-title {
    font-size: 30px;
    line-height: 30px;
  }
}
#lucky-painter-header.header-banner .action-content .block-action .intro-action {
  color: white;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 20px;
  display: block;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header.header-banner .action-content .block-action .intro-action {
    font-size: 17px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header.header-banner .action-content .block-action .intro-action {
    margin-bottom: 10px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header.header-banner .action-content .block-action .intro-action {
    padding: 0 60px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header.header-banner .action-content .block-action .intro-action {
    padding: 0 45px;
    font-size: 11px;
  }
}
@media (max-width: 360px) {
  #lucky-painter-header.header-banner .action-content .block-action .intro-action {
    display: none;
  }
}
#lucky-painter-header.header-banner .action-content .block-action .btn-register {
  border: 0;
  display: block;
  background-color: #d21f1a;
  width: 245px;
  height: 32px;
  text-align: center;
  color: white;
  line-height: 26px;
  font-size: 22px;
  text-transform: uppercase;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin: 0 auto 15px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  box-shadow: -3px 1px 1px rgba(78, 58, 9, 0.4);
}
#lucky-painter-header.header-banner .action-content .block-action .btn-register:hover {
  background-color: white;
  color: #d21f1a;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header.header-banner .action-content .block-action .btn-register {
    font-size: 28px;
    height: 38px;
    line-height: 32px;
    width: 300px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header.header-banner .action-content .block-action .btn-register {
    width: 200px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header.header-banner .action-content .block-action .btn-register {
    font-size: 14px;
    line-height: 18px;
    width: 130px;
    height: 22px;
    margin: 0 auto 5px;
  }
}
#lucky-painter-header.header-banner .action-content .block-action .btn-register span {
  font-family: 'Bebas', sans-serif;
}
#lucky-painter-header.header-banner .action-content .block-action .btn-content-event {
  display: block;
  font-family: 'Bebas', sans-serif;
  border: 3px solid #d21f1a;
  background-color: transparent;
  width: 245px;
  height: 32px;
  text-align: center;
  color: #d21f1a;
  line-height: 26px;
  font-size: 22px;
  text-transform: uppercase;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin: 0 auto 15px;
  box-shadow: -3px 1px 1px rgba(78, 58, 9, 0.4);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header.header-banner .action-content .block-action .btn-content-event {
    font-size: 28px;
    height: 38px;
    line-height: 28px;
    width: 300px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header.header-banner .action-content .block-action .btn-content-event {
    width: 200px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header.header-banner .action-content .block-action .btn-content-event {
    font-size: 14px;
    line-height: 18px;
    width: 130px;
    height: 22px;
    margin: 0 auto 5px;
    border: 2px solid #d21f1a;
  }
}
#lucky-painter-header.header-banner .action-content .block-action .btn-content-event span {
  text-shadow: -2px 1px 1px rgba(78, 58, 9, 0.4);
  font-family: 'Bebas', sans-serif;
}
#lucky-painter-header.header-banner .action-content .block-action .btn-content-event:hover {
  border-color: white;
  color: white;
}
@media (max-width: 768px) {
  #lucky-painter-header-content .slimScrollDiv {
    height: 680px !important;
  }
  #lucky-painter-header-content .slimScrollDiv .scroll-block {
    height: 680px !important;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-content .slimScrollDiv {
    height: 550px !important;
  }
  #lucky-painter-header-content .slimScrollDiv .scroll-block {
    height: 550px !important;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-content .slimScrollDiv {
    height: 450px !important;
  }
  #lucky-painter-header-content .slimScrollDiv .scroll-block {
    height: 450px !important;
  }
}
@media (max-width: 360px) {
  #lucky-painter-header-content .slimScrollDiv {
    height: 330px !important;
  }
  #lucky-painter-header-content .slimScrollDiv .scroll-block {
    height: 330px !important;
  }
}
@media (max-width: 320px) {
  #lucky-painter-header-content .slimScrollDiv {
    height: 280px !important;
  }
  #lucky-painter-header-content .slimScrollDiv .scroll-block {
    height: 280px !important;
  }
}
#lucky-painter-header-content.header-banner {
  display: block;
  width: 100%;
  position: relative;
  background-color: #ebe2db;
}
@media (max-width: 991px) {
  #lucky-painter-header-content.header-banner {
    padding-bottom: 30px;
  }
}
#lucky-painter-header-content.header-banner figure {
  text-align: center;
  position: relative;
  display: block;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#lucky-painter-header-content.header-banner figure img {
  width: 100%;
}
#lucky-painter-header-content.header-banner figure img.banner-landing {
  display: block;
}
#lucky-painter-header-content.header-banner figure img.banner-landing.mobile,
#lucky-painter-header-content.header-banner figure img.banner-landing.mobile-small {
  display: none;
}
@media (max-width: 768px) {
  #lucky-painter-header-content.header-banner figure img.banner-landing {
    display: none;
  }
  #lucky-painter-header-content.header-banner figure img.banner-landing.mobile {
    display: block;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-content.header-banner figure img.banner-landing.mobile {
    display: none;
  }
  #lucky-painter-header-content.header-banner figure img.banner-landing.mobile-small {
    display: block;
  }
}
#lucky-painter-header-content.header-banner .block-header-content {
  display: block;
  left: 0;
  margin: 0 auto;
  padding: 50px 0 0;
  position: absolute;
  top: 0;
  width: 100%;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 1024px) {
  #lucky-painter-header-content.header-banner .block-header-content {
    padding: 25px 0 0;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-content.header-banner .block-header-content {
    padding: 20px 0 0;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-content.header-banner .block-header-content {
    padding: 10px 0 0;
  }
}
#lucky-painter-header-content.header-banner .block-header-content .wrapper-block {
  width: 1285px;
  position: relative;
  height: 100%;
  display: block;
  margin: 0 auto;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header-content.header-banner .block-header-content .wrapper-block {
    width: 1560px;
  }
}
@media (max-width: 1320px) {
  #lucky-painter-header-content.header-banner .block-header-content .wrapper-block {
    width: 1200px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header-content.header-banner .block-header-content .wrapper-block {
    width: 1000px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-content.header-banner .block-header-content .wrapper-block {
    width: 750px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-content.header-banner .block-header-content .wrapper-block {
    width: 600px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-content.header-banner .block-header-content .wrapper-block {
    width: 100%;
    padding: 0 15px;
  }
}
#lucky-painter-header-content.header-banner .block-header-content .btn-prev-block1 {
  display: block;
  left: 0;
  top: 0;
  position: absolute;
  z-index: 1;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 480px) {
  #lucky-painter-header-content.header-banner .block-header-content .btn-prev-block1 {
    left: 0;
    top: 15px;
  }
}
#lucky-painter-header-content.header-banner .block-header-content .btn-prev-block1 .prev-icon {
  background: url("../../bundles/app/images/landing-header/block1-prev.png") no-repeat center center / 100% auto;
  width: 40px;
  height: 59px;
  display: block;
}
#lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header {
  display: block;
  left: 0;
  top: 145px;
  width: 255px;
  text-align: left;
  position: absolute;
  font-family: 'Bebas', sans-serif;
  color: #ffc406;
  font-size: 55px;
  line-height: 72px;
  text-transform: uppercase;
  text-shadow: -5px 3px 0 rgba(78, 58, 9, 0.5);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  z-index: 1;
}
@media (max-width: 1320px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header {
    font-size: 50px;
    line-height: 70px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header {
    font-size: 50px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header {
    top: 70px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header {
    font-size: 20px;
    line-height: 35px;
    top: 90px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header {
    position: relative;
    width: 100%;
    top: 0;
    left: 45px;
    text-shadow: -1px 1px 0 rgba(78, 58, 9, 0.5);
  }
}
#lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header span {
  font-size: 80px;
  text-shadow: -5px 3px 0 rgba(78, 58, 9, 0.5);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 1320px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header span {
    font-size: 70px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header span {
    font-size: 70px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header span {
    font-size: 35px;
    text-shadow: -1px 1px 0 rgba(78, 58, 9, 0.5);
  }
}
#lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header:after {
  position: absolute;
  bottom: -20px;
  left: 0;
  box-shadow: -5px 3px 0 rgba(78, 58, 9, 0.5);
  background-color: #ffc406;
  width: 100px;
  height: 10px;
  content: '';
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 640px) {
  #lucky-painter-header-content.header-banner .block-header-content .title-wrapper-header:after {
    height: 5px;
    bottom: -10px;
    box-shadow: -1px 1px 0 rgba(78, 58, 9, 0.5);
  }
}
#lucky-painter-header-content.header-banner .block-header-content .block-content-1 {
  width: 990px;
  position: absolute;
  right: 0;
  height: auto;
  top: 0;
  padding: 90px 180px;
  margin-top: 0;
  background: url("../../bundles/app/images/landing-header/block1-content.png") no-repeat center / 100% 100%;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header-content.header-banner .block-header-content .block-content-1 {
    padding: 195px 270px;
    width: 1250px;
  }
}
@media (max-width: 1320px) {
  #lucky-painter-header-content.header-banner .block-header-content .block-content-1 {
    padding: 65px 150px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header-content.header-banner .block-header-content .block-content-1 {
    padding: 25px 125px;
    width: 750px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-content.header-banner .block-header-content .block-content-1 {
    margin-top: 30px;
    background: url("http://galaxy-paint.vn/bundles/app/images/galaxy-wall/rule-wrapper-mobile-right.png") no-repeat center / 100% 100%;
    padding: 50px 55px;
    width: 555px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-content.header-banner .block-header-content .block-content-1 {
    margin-top: 0;
    padding: 45px 45px;
    width: 490px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-content.header-banner .block-header-content .block-content-1 {
    margin-top: 30px;
    padding: 55px 35px;
    width: 100%;
    position: relative;
  }
}
@media (max-width: 360px) {
  #lucky-painter-header-content.header-banner .block-header-content .block-content-1 {
    margin-top: 25px;
    padding: 45px 35px;
  }
}
#lucky-painter-header-content.header-banner .block-header-content .block-content-1 .scroll-block {
  width: 620px;
  height: 340px;
  position: relative;
  display: block;
}
#lucky-painter-header-content.header-banner .block-header-content .block-content-1 .scroll-block .title-block {
  font-family: 'Bebas', sans-serif;
  text-transform: uppercase;
  color: #632366;
  font-size: 25px;
  text-align: center;
  margin-bottom: 25px;
}
#lucky-painter-header-content.header-banner .block-header-content .block-content-1 .scroll-block p {
  color: #808d9b;
  font-size: 15px;
}
#lucky-painter-header-register.header-banner {
  display: block;
  width: 100%;
  position: relative;
  background-color: #ebe2db;
}
@media (max-width: 991px) {
  #lucky-painter-header-register.header-banner {
    padding-bottom: 30px;
  }
}
#lucky-painter-header-register.header-banner figure {
  text-align: center;
  position: relative;
  display: block;
}
@media (min-width: 768px) and (max-width: 991px) {
  #lucky-painter-header-register.header-banner figure {
    padding-bottom: 60px;
  }
}
#lucky-painter-header-register.header-banner figure img {
  width: 100%;
}
#lucky-painter-header-register.header-banner figure img.banner-landing {
  display: block;
}
#lucky-painter-header-register.header-banner figure img.banner-landing.mobile,
#lucky-painter-header-register.header-banner figure img.banner-landing.mobile-small {
  display: none;
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner figure img.banner-landing {
    display: none;
  }
  #lucky-painter-header-register.header-banner figure img.banner-landing.mobile {
    display: block;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner figure img.banner-landing.mobile {
    display: none;
  }
  #lucky-painter-header-register.header-banner figure img.banner-landing.mobile-small {
    display: block;
  }
}
#lucky-painter-header-register.header-banner figure .paint-block-landing {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
  max-width: 1920px;
  z-index: 1;
}
#lucky-painter-header-register.header-banner figure .paint-block-landing.mobile,
#lucky-painter-header-register.header-banner figure .paint-block-landing.mobile-small {
  display: none;
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner figure .paint-block-landing {
    display: none;
  }
  #lucky-painter-header-register.header-banner figure .paint-block-landing.mobile {
    display: block;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner figure .paint-block-landing.mobile {
    display: none;
  }
  #lucky-painter-header-register.header-banner figure .paint-block-landing.mobile-small {
    display: block;
  }
}
#lucky-painter-header-register.header-banner .block-header-content {
  display: block;
  left: 0;
  margin: 0 auto;
  padding: 50px 0 0;
  position: absolute;
  top: 0;
  width: 100%;
}
@media (max-width: 1024px) {
  #lucky-painter-header-register.header-banner .block-header-content {
    padding: 25px 0 0;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content {
    padding: 20px 0 0;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-register.header-banner .block-header-content {
    padding: 10px 0 0;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .wrapper-block {
  width: 1285px;
  position: relative;
  height: 100%;
  display: block;
  margin: 0 auto;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header-register.header-banner .block-header-content .wrapper-block {
    width: 1560px;
  }
}
@media (max-width: 1320px) {
  #lucky-painter-header-register.header-banner .block-header-content .wrapper-block {
    width: 1200px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header-register.header-banner .block-header-content .wrapper-block {
    width: 1000px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content .wrapper-block {
    width: 750px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-register.header-banner .block-header-content .wrapper-block {
    width: 600px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner .block-header-content .wrapper-block {
    width: 100%;
    padding: 0 15px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .btn-prev-block2 {
  display: block;
  right: 0;
  top: 0;
  position: absolute;
  z-index: 1;
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner .block-header-content .btn-prev-block2 {
    right: 10px;
    top: 20px;
  }
}
@media (max-width: 320px) {
  #lucky-painter-header-register.header-banner .block-header-content .btn-prev-block2 {
    top: 0;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .btn-prev-block2 .prev-icon {
  background: url("../../bundles/app/images/landing-header/block2-prev.png") no-repeat center center / 100% auto;
  width: 34px;
  height: 56px;
  display: block;
}
#lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header {
  z-index: 1;
  display: block;
  right: 0;
  top: 145px;
  width: 370px;
  text-align: right;
  position: absolute;
  font-family: 'Bebas', sans-serif;
  color: #632366;
  font-size: 55px;
  line-height: 72px;
  text-transform: uppercase;
  text-shadow: -4px 2px 2px rgba(78, 58, 9, 0.3);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 1320px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header {
    font-size: 50px;
    line-height: 70px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header {
    font-size: 50px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header {
    font-size: 35px;
    top: 70px;
    line-height: 45px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header {
    font-size: 20px;
    line-height: 35px;
    top: 90px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header {
    width: 100%;
    top: 0;
    left: -45px;
  }
}
@media (max-width: 360px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header {
    top: -10px;
  }
}
@media (max-width: 320px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header {
    line-height: 25px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header span {
  font-size: 80px;
  text-shadow: -4px 2px 2px rgba(78, 58, 9, 0.3);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 1320px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header span {
    font-size: 70px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header span {
    font-size: 70px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header span {
    font-size: 50px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header span {
    font-size: 35px;
  }
}
@media (max-width: 320px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header span {
    font-size: 30px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header:after {
  position: absolute;
  bottom: -20px;
  right: 0;
  box-shadow: -4px 2px 2px rgba(78, 58, 9, 0.3);
  background-color: #632366;
  width: 120px;
  height: 10px;
  content: '';
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content .title-wrapper-header:after {
    bottom: -10px;
    height: 5px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
  width: 990px;
  position: absolute;
  left: 0;
  height: auto;
  top: 0;
  padding: 90px 180px;
  background: url("../../bundles/app/images/landing-header/block2-content.png") no-repeat center / 100% 100%;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
    padding: 195px 270px;
    width: 1250px;
  }
}
@media (max-width: 1320px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
    padding: 65px 150px;
  }
}
@media (max-width: 1024px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
    padding: 50px 125px;
    width: 750px;
    margin-top: 30px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
    padding: 150px 80px;
    width: 555px;
    background: url("../../bundles/app/images/galaxy-wall/rule-wrapper-mobile.png") no-repeat center / 100% 100%;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
    padding: 125px 80px;
    width: 490px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
    left: 5%;
    margin-top: 0;
    padding: 90px 30px;
    top: 100px;
    width: 70%;
  }
}
@media (max-width: 360px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
    padding: 25px 30px;
    top: 85px;
    width: 80%;
  }
}
@media (max-width: 320px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 {
    padding: 25px 30px;
    top: 40px;
    width: 90%;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block {
  position: relative;
  display: block;
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form label {
  color: #808d9b;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 5px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form label {
    font-size: 18px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form label:hover {
  color: #632366;
}
@media (max-width: 1024px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .form-group {
    margin: 0 auto 5px;
  }
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .form-group {
    margin: 0 auto 15px;
  }
}
@media (max-width: 640px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .form-group {
    margin: 0 auto 5px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form label.active,
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form label.isTyped {
  color: #632366;
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form input.isTyped,
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form textarea.isTyped {
  border: 1px solid #632366 !important;
  background-color: white !important;
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .form-control {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  border-color: #808d9b;
  background-color: #ebebeb;
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .form-control:focus {
  background-color: #ffffff;
  border-color: #632366 !important;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(99, 35, 102, 0.6);
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form textarea {
  resize: none;
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form textarea {
    max-height: 55px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .btn-submit {
  border: 0;
  display: block;
  background-color: #d21f1a;
  width: 170px;
  height: 38px;
  text-align: center;
  color: white;
  line-height: 30px;
  font-size: 22px;
  text-transform: uppercase;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin: 30px auto 0;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  box-shadow: -3px 1px 1px rgba(78, 58, 9, 0.4);
}
@media (max-width: 768px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .btn-submit {
    margin: 10px auto 0;
    line-height: 25px;
    height: 30px;
    font-size: 18px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .btn-submit span {
  font-family: 'Bebas', sans-serif;
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-form .btn-submit:hover {
  background-color: white;
  color: #d21f1a;
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success {
  display: none;
  text-align: center;
  padding: 60px 0;
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success {
    padding: 0;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success .icon-success {
  display: block;
  background: url("../../bundles/app/images/landing-header/success-icon.png") no-repeat center / cover;
  width: 88px;
  height: 88px;
  margin: 0 auto;
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success .icon-success {
    width: 55px;
    height: 55px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success .success-title {
  font-size: 45px;
  margin: 30px 0 15px;
  text-align: center;
  color: #632366;
  font-family: 'Bebas', sans-serif;
}
@media (max-width: 1024px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success .success-title {
    margin: 5px 0;
    line-height: 25px;
    height: 30px;
    font-size: 24px;
  }
}
@media (max-width: 480px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success .success-title {
    margin: 0;
    line-height: 25px;
    height: 30px;
    font-size: 18px;
  }
}
#lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success p {
  color: #8e4e91;
  font-size: 16px;
  display: block;
  font-weight: 600;
  padding: 0 50px;
}
@media (max-width: 640px) {
  #lucky-painter-header-register.header-banner .block-header-content .block-content-2 .register-block .register-success p {
    padding: 0;
  }
}
#luckypainter-event {
  position: relative;
  background-color: #ebe2db;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ebe2db), to(#f6f3f0));
  background-image: -webkit-linear-gradient(top, #ebe2db, #f6f3f0);
  background-image: -moz-linear-gradient(top, #ebe2db, #f6f3f0);
  background-image: -ms-linear-gradient(top, #ebe2db, #f6f3f0);
  background-image: -o-linear-gradient(top, #ebe2db, #f6f3f0);
}
#luckypainter-event > div {
  overflow: hidden;
}
#luckypainter-event:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 168px;
  background: url("../../bundles/app/images/luckypainter-landing/paint-bottom-bg.png") repeat-x center center / 100% auto;
}
@media (min-width: 1600px) {
  #luckypainter-event {
    padding: 180px 0 60px;
  }
  #luckypainter-event:after {
    bottom: -140px;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #luckypainter-event {
    padding: 140px 0 60px;
  }
  #luckypainter-event:after {
    bottom: -120px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #luckypainter-event {
    padding: 100px 0 50px;
  }
  #luckypainter-event:after {
    bottom: -110px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #luckypainter-event {
    padding: 0 0 40px;
  }
  #luckypainter-event:after {
    bottom: -110px;
  }
}
@media (max-width: 767px) {
  #luckypainter-event {
    padding: 10px 0 20px;
  }
  #luckypainter-event:after {
    height: 70px;
    bottom: -45px;
  }
}
@media (min-width: 1600px) {
  #luckypainter-event .luckypainter-event-title p {
    padding: 0 30%;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #luckypainter-event .luckypainter-event-title p {
    padding: 0 32%;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #luckypainter-event .luckypainter-event-title p {
    padding: 0 28%;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #luckypainter-event .luckypainter-event-title p {
    padding: 0 20%;
  }
}
#luckypainter-event .event-col-1,
#luckypainter-event .event-col-2,
#luckypainter-event .event-col-3 {
  padding-bottom: 20px;
}
@media (max-width: 767px) {
  #luckypainter-event .event-wrapper {
    margin-bottom: 30px;
  }
}
#luckypainter-event .event-wrapper figure {
  position: relative;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#luckypainter-event .event-wrapper figure:hover {
  -webkit-box-shadow: -10px 10px 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: -10px 10px 5px rgba(0, 0, 0, 0.5);
  box-shadow: -10px 10px 5px rgba(0, 0, 0, 0.5);
}
#luckypainter-event .event-wrapper figure img {
  width: 100%;
}
#luckypainter-event .event-wrapper .event-overlay {
  position: absolute;
  top: 60px;
  right: 40px;
  bottom: 60px;
  left: 40px;
  text-align: center;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
#luckypainter-event .event-wrapper .event-overlay.overlay-1 {
  background-color: rgba(5, 48, 56, 0.5);
}
#luckypainter-event .event-wrapper .event-overlay.overlay-2 {
  background-color: rgba(36, 57, 4, 0.5);
}
#luckypainter-event .event-wrapper .event-overlay.overlay-3 {
  background-color: rgba(70, 12, 10, 0.5);
}
@media (min-width: 768px) and (max-width: 991px) {
  #luckypainter-event .event-wrapper .event-overlay {
    top: 50px;
    right: 30px;
    bottom: 50px;
    left: 30px;
  }
}
#luckypainter-event .event-wrapper .event-overlay h4 {
  font-family: 'Fester', sans-serif;
  color: #fff;
  text-align: center;
}
@media (min-width: 1600px) {
  #luckypainter-event .event-wrapper .event-overlay h4 {
    font-size: 48px;
    line-height: 60px;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #luckypainter-event .event-wrapper .event-overlay h4 {
    font-size: 44px;
    line-height: 56px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #luckypainter-event .event-wrapper .event-overlay h4 {
    font-size: 36px;
    line-height: 44px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #luckypainter-event .event-wrapper .event-overlay h4 {
    font-size: 28px;
    line-height: 32px;
  }
}
@media (max-width: 767px) {
  #luckypainter-event .event-wrapper .event-overlay h4 {
    font-size: 42px;
    line-height: 50px;
  }
}
#luckypainter-event .event-wrapper .event-overlay button {
  background-color: transparent;
  color: #fff;
  font-family: 'Bebas', sans-serif !important;
  letter-spacing: 0.5px;
  border: 2px solid #fff;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin-top: 20px;
  padding: 1px 22px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 1200px) {
  #luckypainter-event .event-wrapper .event-overlay button {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #luckypainter-event .event-wrapper .event-overlay button {
    font-size: 22px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #luckypainter-event .event-wrapper .event-overlay button {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  #luckypainter-event .event-wrapper .event-overlay button {
    font-size: 24px;
  }
}
#luckypainter-event .event-wrapper .event-overlay button:hover {
  border-color: #fff;
  background-color: #fff;
  color: #d21f1a;
}
@media (min-width: 1600px) {
  #luckypainter-list {
    margin-top: 150px;
    margin-bottom: 200px;
  }
}
@media (max-width: 1599px) {
  #luckypainter-list {
    margin-bottom: 170px;
  }
}
@media (min-width: 992px) and (max-width: 1599px) {
  #luckypainter-list {
    margin-top: 120px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #luckypainter-list {
    margin-top: 90px;
  }
}
@media (max-width: 767px) {
  #luckypainter-list {
    margin-top: 70px;
  }
}
#luckypainter-list .luckypainter-item {
  margin: 30px 0;
}
#luckypainter-list .luckypainter-item:after {
  content: '';
  position: absolute;
  width: 100%;
  left: 15px;
  right: 15px;
  bottom: -30px;
  border-bottom: 1px solid #b8b8b8;
}
@media (min-width: 992px) {
  #luckypainter-list .luckypainter-item:last-child:after,
  #luckypainter-list .luckypainter-item:nth-last-child(2):after,
  #luckypainter-list .luckypainter-item:nth-last-child(3):after {
    border: none;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #luckypainter-list .luckypainter-item:last-child:after,
  #luckypainter-list .luckypainter-item:nth-last-child(2):after {
    border: none;
  }
}
@media (max-width: 767px) {
  #luckypainter-list .luckypainter-item:last-child:after {
    border: none;
  }
}
#luckypainter-list .luckypainter-item:nth-child(3n+1) .list-number > div {
  background-color: #5bc0e8;
}
#luckypainter-list .luckypainter-item:nth-child(3n+2) .list-number > div {
  background-color: #7ebe1a;
}
#luckypainter-list .luckypainter-item:nth-child(3n+3) .list-number > div {
  background-color: #d21f1a;
}
#luckypainter-list .list-item {
  display: table;
}
#luckypainter-list .list-number {
  display: table-cell;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#luckypainter-list .list-number > div {
  width: 70px;
  height: 70px;
  text-align: center;
}
#luckypainter-list .list-number > div > span {
  color: #fff;
  font-size: 35px;
  font-weight: 700;
  line-height: 70px;
}
#luckypainter-list .list-info {
  display: table-cell;
  vertical-align: middle;
  padding-left: 20px;
}
#luckypainter-list .list-info p {
  color: #000;
}
#luckypainter-list .list-info p:not(.list-name) {
  font-size: 15px;
}
#luckypainter-list .list-info .list-name {
  height: 24px;
  line-height: 24px;
  overflow: hidden;
  font-size: 16px;
  font-weight: 700;
}
#luckypainter-list .luckypainter-event-title p {
  margin: 10px 0;
}
#luckypainter-list .luckypainter-filter {
  max-width: 390px;
  margin: 15px auto 20px;
}
#luckypainter-list .luckypainter-filter button {
  background-color: #ebebeb;
  border-color: #9aa4ae;
  color: #565656;
  text-align: left;
}
#luckypainter-list .luckypainter-filter button:before {
  content: '';
  width: 35px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #9aa4ae;
}
#luckypainter-list .luckypainter-filter button:after {
  color: #fff;
}
#luckypainter-list .luckypainter-filter .dropdown-menu {
  max-height: 300px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  overflow-y: auto;
}
#luckypainter-list .list-menu {
  width: 280px;
  background: url("../../bundles/app/images/luckypainter-landing/painter-info.png") no-repeat left center / cover;
  border-color: #9aa4ae;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  padding: 20px;
  top: 115%;
}
#luckypainter-list .list-menu:before {
  position: absolute;
  top: -9px;
  left: 26px;
  display: inline-block;
  border-right: 9px solid transparent;
  border-bottom: 9px solid #9aa4ae;
  border-left: 9px solid transparent;
  content: '';
}
#luckypainter-list .list-menu:after {
  position: absolute;
  top: -7px;
  left: 27px;
  display: inline-block;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #701450;
  border-left: 8px solid transparent;
  content: '';
}
#luckypainter-list .list-menu .menu-top {
  text-align: center;
  border-bottom: 1px solid #fff;
  padding-bottom: 15px;
}
@media (min-width: 1600px) {
  #luckypainter-list .list-menu .menu-top h4 {
    font-size: 22px;
  }
  #luckypainter-list .list-menu .menu-top p {
    font-size: 16px;
  }
}
@media (max-width: 1599px) {
  #luckypainter-list .list-menu .menu-top h4 {
    font-size: 20px;
  }
  #luckypainter-list .list-menu .menu-top p {
    font-size: 15px;
  }
}
#luckypainter-list .list-menu .menu-top h4 {
  font-family: 'Fester', sans-serif;
  color: #fff;
  text-transform: uppercase;
}
#luckypainter-list .list-menu .menu-top p {
  color: #fff;
  font-weight: 600;
}
#luckypainter-list .list-menu .menu-bottom {
  padding-top: 15px;
}
@media (min-width: 1600px) {
  #luckypainter-list .list-menu .menu-bottom p {
    font-size: 14px;
  }
}
@media (max-width: 1599px) {
  #luckypainter-list .list-menu .menu-bottom p {
    font-size: 13px;
  }
}
#luckypainter-list .list-menu .menu-bottom p {
  display: inline-block;
  line-height: 24px;
  font-weight: 600;
}
#luckypainter-list .list-menu .menu-bottom .menu-label {
  width: 110px;
  text-align: right;
  color: #fff;
  margin-right: 10px;
}
#luckypainter-list .list-menu .menu-bottom .menu-value {
  color: #fff;
}
.luckypainter-event-title {
  color: #632366;
}
@media (min-width: 1600px) {
  .luckypainter-event-title p {
    font-size: 18px;
  }
}
@media (max-width: 1599px) {
  .luckypainter-event-title p {
    font-size: 16px;
  }
}
@media (min-width: 1200px) {
  .luckypainter-event-title h2,
  .luckypainter-event-title h3 {
    font-size: 50px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .luckypainter-event-title h2,
  .luckypainter-event-title h3 {
    font-size: 45px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .luckypainter-event-title h2,
  .luckypainter-event-title h3 {
    font-size: 40px;
  }
}
@media (max-width: 767px) {
  .luckypainter-event-title h2,
  .luckypainter-event-title h3 {
    font-size: 35px;
  }
}
.luckypainter-event-title h2 {
  font-family: 'iCielBambola', sans-serif;
  margin-bottom: 10px;
}
.luckypainter-event-title h3 {
  font-family: 'Fester', sans-serif;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
}
.luckypainter-event-title p {
  color: #8e4e91;
  margin: 10px 0 40px;
}
@media (min-width: 992px) {
  .event-col-1 {
    padding-right: 25px;
  }
  .event-col-2 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .event-col-3 {
    padding-left: 25px;
  }
}
.btn-viewmore {
  background-color: #fff;
  color: #9aa4ae;
  font-size: 24px;
  font-family: 'Bebas', sans-serif !important;
  letter-spacing: 0.5px;
  border-color: #9aa4ae;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin-top: 20px;
  padding: 1px 30px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.btn-viewmore:hover {
  background-color: #9aa4ae;
  color: #fff;
}
#product-collection-banner {
  position: relative;
}
#product-collection-banner:before {
  content: '';
  position: absolute;
  top: -30px;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 50px;
  background-color: #03162a;
}
#product-collection-banner img {
  position: relative;
  width: 100%;
}
#product-collection-banner .banner-text {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
#product-collection-banner .banner-content {
  text-align: center;
  max-width: 560px;
}
@media (min-width: 1200px) {
  #product-collection-banner .banner-content h1 {
    font-size: 50px;
  }
  #product-collection-banner .banner-content p {
    font-size: 20px;
  }
}
@media (min-width: 1600px) {
  #product-collection-banner .banner-content p {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #product-collection-banner .banner-content h1 {
    font-size: 44px;
  }
  #product-collection-banner .banner-content p {
    font-size: 20px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #product-collection-banner .banner-content h1 {
    font-size: 38px;
  }
  #product-collection-banner .banner-content p {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  #product-collection-banner .banner-content h1 {
    font-size: 26px;
  }
  #product-collection-banner .banner-content p {
    display: none;
  }
}
#product-collection-banner .banner-content h1 {
  font-family: 'Gotham-Ultra', sans-serif;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 20px;
}
#product-collection-banner .banner-content p {
  color: #fff;
  font-weight: 600;
}
.product-category {
  position: relative;
  margin-top: 10px;
}
.product-category img {
  width: 100%;
}
.product-category .category-caption {
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  border: solid #fff;
  text-align: center;
}
@media (min-width: 1600px) {
  .product-category .category-caption.right-align {
    right: 300px;
  }
  .product-category .category-caption.left-align {
    left: 300px;
  }
}
@media (min-width: 992px) and (max-width: 1599px) {
  .product-category .category-caption.right-align {
    right: 120px;
  }
  .product-category .category-caption.left-align {
    left: 120px;
  }
}
@media (max-width: 991px) {
  .product-category .category-caption.right-align {
    right: 55px;
  }
  .product-category .category-caption.left-align {
    left: 55px;
  }
}
@media (max-width: 767px) {
  .product-category .category-caption.right-align {
    right: 30px;
  }
  .product-category .category-caption.left-align {
    left: 30px;
  }
}
@media (min-width: 1200px) {
  .product-category .category-caption {
    max-width: 450px;
    padding: 20px 35px;
    border-width: 8px;
  }
  .product-category .category-caption h2 {
    font-size: 48px;
  }
  .product-category .category-caption p {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .product-category .category-caption {
    max-width: 420px;
    padding: 15px 30px;
    border-width: 6px;
  }
  .product-category .category-caption h2 {
    font-size: 42px;
  }
  .product-category .category-caption p {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .product-category .category-caption {
    max-width: 380px;
    padding: 15px 20px;
    border-width: 4px;
  }
  .product-category .category-caption h2 {
    font-size: 36px;
  }
  .product-category .category-caption p {
    font-size: 15px;
  }
}
@media (max-width: 767px) {
  .product-category .category-caption {
    max-width: 300px;
    padding: 15px;
    border: none;
  }
  .product-category .category-caption h2 {
    font-size: 25px;
  }
  .product-category .category-caption p {
    display: none;
  }
}
.product-category .category-caption h2 {
  font-family: 'Gotham-Ultra', sans-serif;
  color: #fff;
  text-transform: uppercase;
}
.product-category .category-caption p {
  color: #fff;
  font-weight: 600;
  margin-top: 10px;
}
#product-category-banner {
  position: relative;
}
#product-category-banner img {
  width: 100%;
}
#product-category-banner .category-caption {
  position: absolute;
  top: 50%;
  border: solid #fff;
  text-align: center;
}
@media (min-width: 1200px) {
  #product-category-banner .category-caption {
    max-width: 450px;
    padding: 20px 35px;
    margin-top: -129px;
    border-width: 8px;
  }
  #product-category-banner .category-caption h2 {
    font-size: 48px;
  }
  #product-category-banner .category-caption p {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #product-category-banner .category-caption {
    max-width: 420px;
    padding: 15px 30px;
    margin-top: -110px;
    border-width: 6px;
  }
  #product-category-banner .category-caption h2 {
    font-size: 42px;
  }
  #product-category-banner .category-caption p {
    font-size: 18px;
  }
}
@media (min-width: 1600px) {
  #product-category-banner .category-caption.right-pos {
    right: 300px;
  }
  #product-category-banner .category-caption.left-pos {
    left: 300px;
  }
}
@media (min-width: 992px) and (max-width: 1599px) {
  #product-category-banner .category-caption.right-pos {
    right: 120px;
  }
  #product-category-banner .category-caption.left-pos {
    left: 120px;
  }
}
@media (max-width: 991px) {
  #product-category-banner .category-caption.right-pos {
    right: 55px;
  }
  #product-category-banner .category-caption.left-pos {
    left: 55px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #product-category-banner .category-caption {
    max-width: 380px;
    padding: 15px 20px;
    margin-top: -95px;
    border-width: 4px;
  }
  #product-category-banner .category-caption h2 {
    font-size: 36px;
  }
  #product-category-banner .category-caption p {
    font-size: 15px;
  }
}
@media (max-width: 767px) {
  #product-category-banner .category-caption {
    max-width: 300px;
    padding: 15px;
    margin-top: -45px;
    right: 30px;
    border: none;
  }
  #product-category-banner .category-caption h2 {
    font-size: 25px;
  }
  #product-category-banner .category-caption p {
    display: none;
  }
}
#product-category-banner .category-caption h2 {
  font-family: 'Gotham-Ultra', sans-serif;
  color: #fff;
  text-transform: uppercase;
}
#product-category-banner .category-caption p {
  color: #fff;
  font-weight: 600;
  margin-top: 10px;
}
@media (min-width: 992px) {
  #product-category-item {
    padding: 20px 0 40px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #product-category-item {
    padding: 15px 0 30px;
  }
}
@media (max-width: 767px) {
  #product-category-item {
    padding: 10px 0;
  }
}
#product-category-item .paint-item {
  margin: 15px 0;
}
#product-category-item .paint-item .paint-box {
  position: relative;
  width: 100%;
  overflow: hidden;
}
#product-category-item .paint-item .paint-box:before {
  content: "";
  display: block;
  padding-top: 120%;
}
#product-category-item .paint-item .paint-box:hover .paint-border {
  visibility: visible;
  -webkit-animation: borderfade 1s ease-in;
  -moz-animation: borderfade 1s ease-in;
  -ms-animation: borderfade 1s ease-in;
  animation: borderfade 1s ease-in;
}
#product-category-item .paint-item .paint-box:hover .paint-background {
  -webkit-filter: blur(3px);
  -moz-filter: blur(3px);
  -ms-filter: blur(3px);
  -o-filter: blur(3px);
  filter: blur(3px);
}
#product-category-item .paint-item .paint-background {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  background: transparent no-repeat scroll center center / cover;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#product-category-item .paint-item .paint-image {
  position: absolute;
  top: 30px;
  width: 100%;
  text-align: center;
}
#product-category-item .paint-item .paint-image figure {
  display: inline-block;
  width: 52%;
}
#product-category-item .paint-item .paint-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 35px;
  width: 100%;
  text-align: center;
}
@media (min-width: 1200px) {
  #product-category-item .paint-item .paint-caption {
    bottom: 35px;
  }
  #product-category-item .paint-item .paint-caption h3 {
    font-size: 18px;
  }
  #product-category-item .paint-item .paint-caption h2 {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #product-category-item .paint-item .paint-caption {
    bottom: 25px;
  }
  #product-category-item .paint-item .paint-caption h3 {
    font-size: 17px;
  }
  #product-category-item .paint-item .paint-caption h2 {
    font-size: 20px;
    margin: 5px 0 10px !important;
  }
  #product-category-item .paint-item .paint-caption button.btn-purple {
    font-size: 14px !important;
    padding: 5px 32px !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #product-category-item .paint-item .paint-caption {
    bottom: 20px;
  }
  #product-category-item .paint-item .paint-caption h3 {
    font-size: 18px;
  }
  #product-category-item .paint-item .paint-caption h2 {
    font-size: 22px;
  }
}
@media (max-width: 767px) {
  #product-category-item .paint-item .paint-caption {
    bottom: 5%;
  }
  #product-category-item .paint-item .paint-caption h3 {
    font-size: 16px;
  }
  #product-category-item .paint-item .paint-caption h2 {
    font-size: 20px;
  }
  #product-category-item .paint-item .paint-caption button.btn-purple {
    font-size: 14px !important;
    padding: 5px 32px !important;
  }
}
#product-category-item .paint-item .paint-caption h3 {
  color: #713083;
}
#product-category-item .paint-item .paint-caption h2 {
  color: #713083;
  text-transform: uppercase;
  margin: 5px 0 15px;
}
#product-category-item .paint-item .paint-border {
  visibility: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-transition: opacity 0.3s ease-in-out;
  -moz-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  -ms-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}
#product-category-item .paint-item .x-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 5px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(left, #67327b, transparent);
  background-image: -moz-linear-gradient(left, #67327b, transparent);
  background-image: -o-linear-gradient(left, #67327b, transparent);
}
#product-category-item .paint-item .y-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 5px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(#67327b, transparent);
  background-image: -moz-linear-gradient(#67327b, transparent);
  background-image: -o-linear-gradient(#67327b, transparent);
  background-image: linear-gradient(#67327b, transparent);
}
#product-category-item .paint-item .x-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60%;
  height: 5px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(left, transparent, #67327b);
  background-image: -moz-linear-gradient(left, transparent, #67327b);
  background-image: -o-linear-gradient(left, transparent, #67327b);
}
#product-category-item .paint-item .y-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 5px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(transparent, #67327b);
  background-image: -moz-linear-gradient(transparent, #67327b);
  background-image: -o-linear-gradient(transparent, #67327b);
  background-image: linear-gradient(transparent, #67327b);
}
#product-breadcrumb ol {
  padding: 8px 15px;
  margin-top: 20px;
  list-style: none;
}
#product-breadcrumb ol > li {
  display: inline-block;
}
#product-breadcrumb ol > li > a {
  color: #7f7f7f;
  font-weight: 300;
  font-size: 20px;
}
#product-breadcrumb ol > li.active > a {
  color: #632366;
}
#product-breadcrumb ol > li + li:before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 15px;
  background: url("../../bundles/app/images/product-landing/right-arrow.png") no-repeat center center;
  padding: 0 15px;
}
@-webkit-keyframes borderfade {
  0% {
    -moz-opacity: 0.2;
    -khtml-opacity: 0.2;
    -webkit-opacity: 0.2;
    opacity: 0.2;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20);
    filter: alpha(opacity=20);
  }
  25% {
    -moz-opacity: 0.4;
    -khtml-opacity: 0.4;
    -webkit-opacity: 0.4;
    opacity: 0.4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
    filter: alpha(opacity=40);
  }
  50% {
    -moz-opacity: 0.6;
    -khtml-opacity: 0.6;
    -webkit-opacity: 0.6;
    opacity: 0.6;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
    filter: alpha(opacity=60);
  }
  75% {
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    -webkit-opacity: 0.8;
    opacity: 0.8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
    filter: alpha(opacity=80);
  }
  100% {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
  }
}
@-moz-keyframes borderfade {
  0% {
    -moz-opacity: 0.2;
    -khtml-opacity: 0.2;
    -webkit-opacity: 0.2;
    opacity: 0.2;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20);
    filter: alpha(opacity=20);
  }
  25% {
    -moz-opacity: 0.4;
    -khtml-opacity: 0.4;
    -webkit-opacity: 0.4;
    opacity: 0.4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
    filter: alpha(opacity=40);
  }
  50% {
    -moz-opacity: 0.6;
    -khtml-opacity: 0.6;
    -webkit-opacity: 0.6;
    opacity: 0.6;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
    filter: alpha(opacity=60);
  }
  75% {
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    -webkit-opacity: 0.8;
    opacity: 0.8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
    filter: alpha(opacity=80);
  }
  100% {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
  }
}
@-o-keyframes borderfade {
  0% {
    -moz-opacity: 0.2;
    -khtml-opacity: 0.2;
    -webkit-opacity: 0.2;
    opacity: 0.2;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20);
    filter: alpha(opacity=20);
  }
  25% {
    -moz-opacity: 0.4;
    -khtml-opacity: 0.4;
    -webkit-opacity: 0.4;
    opacity: 0.4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
    filter: alpha(opacity=40);
  }
  50% {
    -moz-opacity: 0.6;
    -khtml-opacity: 0.6;
    -webkit-opacity: 0.6;
    opacity: 0.6;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
    filter: alpha(opacity=60);
  }
  75% {
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    -webkit-opacity: 0.8;
    opacity: 0.8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
    filter: alpha(opacity=80);
  }
  100% {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
  }
}
@keyframes borderfade {
  0% {
    -moz-opacity: 0.2;
    -khtml-opacity: 0.2;
    -webkit-opacity: 0.2;
    opacity: 0.2;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=20);
    filter: alpha(opacity=20);
  }
  25% {
    -moz-opacity: 0.4;
    -khtml-opacity: 0.4;
    -webkit-opacity: 0.4;
    opacity: 0.4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
    filter: alpha(opacity=40);
  }
  50% {
    -moz-opacity: 0.6;
    -khtml-opacity: 0.6;
    -webkit-opacity: 0.6;
    opacity: 0.6;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=60);
    filter: alpha(opacity=60);
  }
  75% {
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    -webkit-opacity: 0.8;
    opacity: 0.8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80);
    filter: alpha(opacity=80);
  }
  100% {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter: alpha(opacity=100);
  }
}
@media (max-width: 640px) {
  #product-page1 {
    display: none;
  }
}
#product-page1.header-banner {
  display: block;
  width: 100%;
  z-index: 1 !important;
  position: relative;
}
@media (max-width: 640px) {
  #product-page1.header-banner {
    display: none;
  }
}
#product-page1.header-banner .product-painter {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
  z-index: 10;
}
#product-page1.header-banner .bn5-product {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
}
#product-page1.header-banner .bn5-product .info-block {
  position: absolute;
  display: block;
  width: 100%;
  text-align: center;
  left: 0;
  bottom: 0;
}
@media (max-width: 640px) {
  #product-page1.header-banner .bn5-product .info-block {
    display: none;
  }
}
#product-page1.header-banner .bn5-product .bn5-product-content {
  bottom: 110px;
  height: 300px;
  left: 525px;
  position: absolute;
  width: 490px;
  z-index: 11;
  font-size: 13px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    width: 680px;
    bottom: 100px;
    height: 450px;
    left: 785px;
    font-size: 18px;
  }
}
@media (min-width: 1366px) and (max-width: 1600px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    bottom: 145px;
    left: 585px;
  }
}
@media (min-width: 1280px) and (max-width: 1366px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    bottom: 105px;
    left: 530px;
  }
}
@media (min-width: 1024px) and (max-width: 1280px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    left: 525px;
  }
}
@media (min-width: 980px) and (max-width: 1024px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    left: 420px;
    bottom: 80px;
    height: 250px;
    width: 390px;
  }
  #product-page1.header-banner .bn5-product .bn5-product-content .slimScrollDiv {
    height: 200px !important;
  }
  #product-page1.header-banner .bn5-product .bn5-product-content .slimScrollDiv .scroll-block {
    height: 200px !important;
  }
}
@media (max-width: 800px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    bottom: 65px;
    height: 190px;
    left: 330px;
    position: absolute;
    width: 305px;
    z-index: 11;
  }
  #product-page1.header-banner .bn5-product .bn5-product-content .slimScrollDiv {
    height: 150px !important;
  }
  #product-page1.header-banner .bn5-product .bn5-product-content .slimScrollDiv .scroll-block {
    height: 150px !important;
  }
}
@media (min-width: 768px) and (max-width: 980px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    left: 350px;
  }
}
@media (max-width: 768px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    left: 310px;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .bn5-product .bn5-product-content {
    display: none;
  }
}
#product-page1.header-banner .bn5-product .bn5-product-content .product-action {
  width: 100%;
  padding: 0 0 10px;
  margin-bottom: 8px;
  display: block;
  text-align: left;
  border-bottom: 1px solid #ba5a5e;
}
#product-page1.header-banner .bn5-product .bn5-product-content .product-action li {
  display: inline-block;
  margin-right: 20px;
  position: relative;
}
#product-page1.header-banner .bn5-product .bn5-product-content .product-action li:first-child:after {
  content: '|';
  color: white;
  font-weight: bold;
  position: absolute;
  right: -16px;
  top: 0;
}
#product-page1.header-banner .bn5-product .bn5-product-content .product-action li a {
  color: #ba5a5e;
  font-weight: bold;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#product-page1.header-banner .bn5-product .bn5-product-content .product-action li a:hover {
  color: white;
}
#product-page1.header-banner .bn5-product .bn5-product-content .product-action li.active a {
  color: white;
  font-weight: bold;
}
#product-page1.header-banner .bn5-product .bn5-product-content .tab-content .tab-pane {
  text-align: left;
  color: white;
}
#product-page1.header-banner .block-banner {
  position: relative;
  width: 100%;
}
#product-page1.header-banner .block-banner figure {
  text-align: center;
  position: relative;
  display: block;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#product-page1.header-banner .block-banner figure img {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  width: 100%;
  display: block;
}
#product-page1.header-banner .block-banner figure .bn1-product,
#product-page1.header-banner .block-banner figure .bn-product {
  width: 100%;
  height: 100%;
  position: relative;
  display: block;
}
#product-page1.header-banner .block-banner figure .bn1-product-sub,
#product-page1.header-banner .block-banner figure .bn2-product-sub {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 11;
}
#product-page1.header-banner .block-banner figure .bn3-product-sub,
#product-page1.header-banner .block-banner figure .bn4-product-sub {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  z-index: 1;
}
#product-page1.header-banner .block-banner figure .banner-content {
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  text-align: left;
}
#product-page1.header-banner .block-banner figure .banner-content .container {
  position: relative;
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn1-content {
  width: 610px;
  height: auto;
  position: absolute;
  right: 0;
  top: 125px;
  color: white;
  z-index: 1;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn1-content {
    top: 180px;
  }
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn1-content {
    width: 540px;
    top: 65px;
  }
}
@media (max-width: 800px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn1-content {
    width: 50%;
    top: 30px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn1-content .description-content {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 36px;
  color: white;
  text-shadow: 2px 2px rgba(0, 0, 0, 0.3);
  margin-bottom: 5px;
}
@media (max-width: 800px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn1-content .description-content {
    font-size: 15px;
    margin-bottom: 5px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn1-content .title-content {
  font-family: 'Gotham-Ultra', sans-serif;
  font-size: 48px;
  color: white;
  text-shadow: 2px 2px rgba(0, 0, 0, 0.3);
  margin-bottom: 20px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn1-content .title-content {
    font-size: 60px;
  }
}
@media (max-width: 800px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn1-content .title-content {
    font-size: 18px;
    margin-bottom: 5px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn1-content p {
  font-size: 18px;
  color: white;
}
@media (max-width: 800px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn1-content p {
    font-size: 12px;
  }
}
@media (max-width: 480px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn1-content p {
    display: none;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content {
  width: 440px;
  height: auto;
  position: absolute;
  right: 0;
  top: 100px;
  color: white;
  z-index: 1;
  border: 6px solid white;
  padding: 80px 50px 35px;
  background-color: rgba(0, 0, 0, 0.5);
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content {
    top: 70px;
    padding: 25px 35px;
  }
}
@media (max-width: 800px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content {
    width: 50%;
    top: 15px;
    right: 15px;
    padding: 35px 15px;
  }
}
@media (max-width: 480px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content {
    width: 60%;
    top: 5px;
    right: 5px;
    border: 2px solid white;
    padding: 10px 5px 5px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .title-content {
  font-size: 30px;
  color: white;
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
}
@media (max-width: 480px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .title-content {
    font-size: 13px;
  }
}
@media (max-width: 360px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .title-content {
    font-size: 10px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .sub-title-content {
  font-size: 25px;
  color: white;
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
}
@media (max-width: 480px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .sub-title-content {
    font-size: 12px;
  }
}
@media (max-width: 360px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .sub-title-content {
    font-size: 10px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content p {
  margin-top: 15px;
  text-align: left;
  font-size: 14px;
  color: white;
  font-weight: 600;
}
@media (max-width: 480px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content p {
    margin-top: 5px;
    font-size: 10px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg2 {
  background: url("../../bundles/app/images/product-1/bg2-icon.png") no-repeat center / cover;
  width: 130px;
  height: 132px;
  left: 50%;
  top: 0;
  margin-left: -65px;
  margin-top: -61px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg2 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg2 {
    left: 0;
    margin-left: -15px;
    margin-top: -16px;
    width: 30px;
    height: 32px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg3 {
  background: url("../../bundles/app/images/product-1/bg3-icon.png") no-repeat center / cover;
  width: 150px;
  height: 130px;
  left: 50%;
  top: 0;
  margin-left: -75px;
  margin-top: -65px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg3 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg3 {
    left: 0;
    margin-left: -15px;
    margin-top: -16px;
    width: 30px;
    height: 32px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg4 {
  background: url("../../bundles/app/images/product-1/bg3-icon.png") no-repeat center / cover;
  width: 150px;
  height: 130px;
  left: 50%;
  top: 0;
  margin-left: -75px;
  margin-top: -65px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg4 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg4 {
    left: 0;
    margin-left: -15px;
    margin-top: -16px;
    width: 30px;
    height: 32px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg5 {
  background: url("../../bundles/app/images/product-1/bg5-icon.png") no-repeat center / cover;
  width: 146px;
  height: 130px;
  left: 50%;
  top: 0;
  margin-left: -73px;
  margin-top: -65px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg5 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg5 {
    left: 0;
    margin-left: -15px;
    margin-top: -16px;
    width: 30px;
    height: 32px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg6 {
  background: url("../../bundles/app/images/product-1/bg6-icon.png") no-repeat center / cover;
  width: 154px;
  height: 139px;
  left: 50%;
  top: 0;
  margin-left: -77px;
  margin-top: -70px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg6 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg6 {
    left: 0;
    margin-left: -15px;
    margin-top: -16px;
    width: 30px;
    height: 32px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg7 {
  background: url("../../bundles/app/images/product-1/bg7-icon.png") no-repeat center / cover;
  width: 143px;
  height: 123px;
  left: 50%;
  top: 0;
  margin-left: -71px;
  margin-top: -61px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg7 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg7 {
    left: 0;
    margin-left: -12px;
    margin-top: -14px;
    width: 28px;
    height: 24px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg8 {
  background: url("../../bundles/app/images/product-1/bg8-icon.png") no-repeat center / cover;
  width: 150px;
  height: 120px;
  left: 50%;
  top: 0;
  margin-left: -75px;
  margin-top: -60px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg8 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg8 {
    left: 0;
    margin-left: -10px;
    margin-top: -15px;
    width: 30px;
    height: 24px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg9 {
  background: url("../../bundles/app/images/product-1/bg9-icon.png") no-repeat center / cover;
  width: 150px;
  height: 130px;
  left: 50%;
  top: 0;
  margin-left: -75px;
  margin-top: -65px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg9 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg9 {
    left: 0;
    margin-left: -13px;
    margin-top: -15px;
    width: 30px;
    height: 26px;
  }
}
#product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg10 {
  background: url("../../bundles/app/images/product-1/bg10-icon.png") no-repeat center / cover;
  width: 150px;
  height: 132px;
  left: 50%;
  top: 0;
  margin-left: -75px;
  margin-top: -66px;
  position: absolute;
}
@media (max-width: 1024px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg10 {
    left: 0;
  }
}
@media (max-width: 640px) {
  #product-page1.header-banner .block-banner figure .banner-content .container .bn-paint-content .icon-bg10 {
    left: 0;
    margin-left: -13px;
    margin-top: -15px;
    width: 30px;
    height: 26px;
  }
}
#product-page-1-mobile {
  display: none;
}
@media (max-width: 640px) {
  #product-page-1-mobile {
    display: block;
    position: relative;
  }
}
#product-page-1-mobile.header-banner {
  display: none;
  width: 100%;
  z-index: 1 !important;
  position: relative;
}
@media (max-width: 640px) {
  #product-page-1-mobile.header-banner {
    display: block;
  }
}
#product-page-1-mobile.header-banner .product-painter {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
  z-index: 10;
}
#product-page-1-mobile.header-banner .bn5-product {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
}
#product-page-1-mobile.header-banner .bn5-product .product-painter {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
}
#product-page-1-mobile.header-banner .bn5-product .info-block {
  position: absolute;
  display: block;
  width: 100%;
  text-align: center;
  left: 0;
  bottom: 0;
}
#product-page-1-mobile.header-banner .bn5-product-content {
  position: relative;
  width: 100%;
  z-index: 11;
  background-color: #d1d4d9;
  padding: 30px;
}
#product-page-1-mobile.header-banner .bn5-product-content .product-action {
  width: 100%;
  padding: 0 0 10px;
  margin-bottom: 8px;
  display: block;
  text-align: left;
}
#product-page-1-mobile.header-banner .bn5-product-content .product-action li {
  display: inline-block;
  margin-bottom: 10px;
  width: 45%;
  text-align: center;
  position: relative;
}
#product-page-1-mobile.header-banner .bn5-product-content .product-action li a {
  background-color: transparent;
  color: #af4cbf;
  padding: 10px 0;
  display: block;
  width: 100%;
  font-weight: 300;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  text-align: left;
  font-size: 18px;
}
#product-page-1-mobile.header-banner .bn5-product-content .product-action li.active:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 80px;
  height: 3px;
  background-color: #903a9b;
}
#product-page-1-mobile.header-banner .bn5-product-content .product-action li.active a {
  font-weight: bold;
  color: #903a9b;
}
#product-page-1-mobile.header-banner .bn5-product-content .tab-content .tab-pane {
  text-align: left;
  color: #333333;
}
#product-page-1-mobile.header-banner .block-banner {
  position: relative;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
#product-page-1-mobile.header-banner .block-banner figure {
  text-align: center;
  position: relative;
  display: block;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#product-page-1-mobile.header-banner .block-banner figure img {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  width: 100%;
  display: block;
}
#product-page-1-mobile.header-banner .block-banner .banner-content {
  display: block;
  height: 100%;
  position: relative;
  width: 100%;
  text-align: left;
  padding: 25px;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container {
  position: relative;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container .bn1-content {
  width: 100%;
  height: auto;
  position: relative;
  color: white;
  z-index: 1;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container .bn1-content .description-content {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 36px;
  color: white;
  text-shadow: 2px 2px rgba(0, 0, 0, 0.3);
  margin-bottom: 5px;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container .bn1-content .title-content {
  font-family: 'Gotham-Ultra', sans-serif;
  font-size: 18px;
  margin-bottom: 5px;
  color: white;
  text-align: left;
  text-shadow: 2px 2px rgba(0, 0, 0, 0.3);
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container .bn1-content p {
  font-size: 12px;
  color: white;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container .bn-paint-content {
  width: 100%;
  height: auto;
  position: relative;
  color: white;
  z-index: 1;
  border: 2px solid white;
  background-color: rgba(0, 0, 0, 0.5);
  padding: 35px 15px 15px;
  max-width: 480px;
  margin: 25px auto 0;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container .title-content {
  font-size: 14px;
  color: white;
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container .sub-title-content {
  font-size: 12px;
  color: white;
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container p {
  margin-top: 5px;
  font-size: 10px;
  text-align: left;
  color: white;
  font-weight: 600;
}
#product-page-1-mobile.header-banner .block-banner .banner-content .container .icon-bg6 {
  background: url("../../bundles/app/images/product-1/bg6-icon.png") no-repeat center / cover;
  left: 50%;
  top: 0;
  position: absolute;
  margin-left: -30px;
  margin-top: -31px;
  width: 60px;
  height: 62px;
}
#product-page-banner {
  position: relative;
  background: #4e2a66 url("../../bundles/app/images/product-landing/violet-bg.jpg") no-repeat center center / cover;
  width: 100%;
  overflow: hidden;
}
@media (min-width: 992px) {
  #product-page-banner {
    min-height: 750px;
  }
}
@media (max-width: 991px) {
  #product-page-banner {
    min-height: 600px;
  }
}
#product-page-banner figure {
  display: inline-block;
  max-width: 400px;
  margin: 0 auto;
  padding: 50px 0 0;
}
@media (max-width: 767px) {
  #product-page-banner figure img {
    width: 80%;
  }
}
@media (min-width: 1200px) {
  #product-page-banner .banner-content {
    padding: 100px 0 50px;
  }
  #product-page-banner .banner-content h3 {
    font-size: 36px;
  }
  #product-page-banner .banner-content h2 {
    font-size: 48px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #product-page-banner .banner-content {
    padding: 80px 0 40px;
  }
  #product-page-banner .banner-content h3 {
    font-size: 32px;
  }
  #product-page-banner .banner-content h2 {
    font-size: 42px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #product-page-banner .banner-content {
    padding: 50px 0 30px;
  }
  #product-page-banner .banner-content h3 {
    font-size: 24px;
  }
  #product-page-banner .banner-content h2 {
    font-size: 30px;
  }
}
@media (max-width: 767px) {
  #product-page-banner .banner-content {
    padding: 10px 0 40px;
  }
  #product-page-banner .banner-content h3 {
    font-size: 20px;
  }
  #product-page-banner .banner-content h2 {
    font-size: 24px;
  }
}
#product-page-banner .banner-content h2,
#product-page-banner .banner-content h3 {
  color: #fff;
  text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  margin-left: 10px;
}
#product-page-banner .banner-content h3 {
  font-family: 'Gotham-Medium', sans-serif;
  margin-bottom: 5px;
}
#product-page-banner .banner-content h2 {
  font-family: 'Gotham-Ultra', sans-serif;
}
@media (min-width: 1200px) {
  #product-page-banner .banner-tab {
    margin-top: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #product-page-banner .banner-tab {
    margin-top: 15px;
  }
}
@media (max-width: 991px) {
  #product-page-banner .banner-tab {
    margin-top: 10px;
  }
}
#product-page-banner .nav-tabs {
  border-bottom: none;
}
#product-page-banner .nav-tabs > li.active > a,
#product-page-banner .nav-tabs > li.active > a:focus,
#product-page-banner .nav-tabs > li.active > a:hover {
  background-color: transparent;
  border-color: transparent;
  color: #fefefe;
  font-weight: 600;
}
#product-page-banner .nav-tabs > li.active > a:after,
#product-page-banner .nav-tabs > li.active > a:focus:after,
#product-page-banner .nav-tabs > li.active > a:hover:after {
  width: 60%;
}
#product-page-banner .nav-tabs > li {
  width: 33.33%;
}
#product-page-banner .nav-tabs > li > a {
  position: relative;
  color: rgba(254, 254, 254, 0.6);
}
@media (min-width: 1200px) {
  #product-page-banner .nav-tabs > li > a {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #product-page-banner .nav-tabs > li > a {
    font-size: 17px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #product-page-banner .nav-tabs > li > a {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  #product-page-banner .nav-tabs > li > a {
    font-size: 15px;
  }
}
#product-page-banner .nav-tabs > li > a:focus,
#product-page-banner .nav-tabs > li > a:hover {
  background-color: transparent;
  border-color: transparent;
  color: #fefefe;
  font-weight: 600;
}
#product-page-banner .nav-tabs > li > a:focus:after,
#product-page-banner .nav-tabs > li > a:hover:after {
  width: 60%;
}
#product-page-banner .nav-tabs > li > a:after {
  content: '';
  position: absolute;
  left: 10px;
  bottom: -5px;
  width: 0;
  border-bottom: 3px solid #fff;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
#product-page-banner .tab-content {
  padding: 20px 10px;
  cursor: default;
}
#product-page-banner .tab-content p {
  color: #fff;
  font-size: 14px;
  line-height: 24px;
  text-align: justify;
}
@media (min-width: 768px) {
  #product-page-banner .tab-content ul {
    margin-top: 30px;
  }
  #product-page-banner .tab-content ul > li {
    width: 33%;
  }
}
@media (max-width: 767px) {
  #product-page-banner .tab-content ul {
    margin-top: 20px;
  }
  #product-page-banner .tab-content ul > li {
    width: 50%;
  }
}
#product-page-banner .tab-content ul > li {
  float: left;
  margin-bottom: 20px;
}
@media (min-width: 768px) {
  #product-page-testimonial {
    padding: 50px 0 100px;
  }
  #product-page-testimonial .testimonial-wrapper:after {
    bottom: -50px;
  }
}
@media (max-width: 767px) {
  #product-page-testimonial {
    padding: 50px 0 80px;
  }
  #product-page-testimonial .testimonial-wrapper:after {
    bottom: -40px;
  }
}
#product-page-testimonial .btn-send-testimonial {
  display: inline-block;
}
@media (min-width: 768px) {
  #product-page-testimonial .btn-send-testimonial {
    font-size: 20px;
  }
}
#product-page-testimonial .testimonial-wrapper {
  position: relative;
  text-align: center;
}
#product-page-testimonial .testimonial-wrapper:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  border-bottom: 1px solid #ddd;
}
#product-page-feature .feature-item {
  position: relative;
  margin-bottom: 30px;
}
#product-page-feature .feature-item:hover img {
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  -webkit-opacity: 0.9;
  opacity: 0.9;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);
  filter: alpha(opacity=90);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
#product-page-feature .feature-item figure {
  position: relative;
  overflow: hidden;
}
#product-page-feature .feature-item figure img {
  width: 100%;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
#product-page-feature .feature-item figure figcaption {
  position: absolute;
  top: 30px;
}
@media (min-width: 992px) {
  #product-page-feature .feature-item figure figcaption.caption-1,
  #product-page-feature .feature-item figure figcaption.caption-2,
  #product-page-feature .feature-item figure figcaption.caption-4,
  #product-page-feature .feature-item figure figcaption.caption-6 {
    left: 20px;
  }
  #product-page-feature .feature-item figure figcaption.caption-3,
  #product-page-feature .feature-item figure figcaption.caption-5 {
    right: 20px;
  }
  #product-page-feature .feature-item figure figcaption p {
    font-size: 16px;
    margin: 10px 0;
  }
  #product-page-feature .feature-item figure figcaption button {
    background-color: transparent;
  }
}
@media (min-width: 1200px) {
  #product-page-feature .feature-item figure figcaption.caption-1,
  #product-page-feature .feature-item figure figcaption.caption-2,
  #product-page-feature .feature-item figure figcaption.caption-4,
  #product-page-feature .feature-item figure figcaption.caption-6 {
    left: 40px;
  }
}
@media (max-width: 1199px) {
  #product-page-feature .feature-item figure figcaption p {
    display: none;
  }
  #product-page-feature .feature-item figure figcaption button {
    margin-top: 10px;
  }
}
@media (max-width: 991px) {
  #product-page-feature .feature-item figure figcaption.caption-1,
  #product-page-feature .feature-item figure figcaption.caption-2,
  #product-page-feature .feature-item figure figcaption.caption-4,
  #product-page-feature .feature-item figure figcaption.caption-6 {
    left: 20px;
  }
  #product-page-feature .feature-item figure figcaption.caption-3,
  #product-page-feature .feature-item figure figcaption.caption-5 {
    text-align: right;
    right: 20px;
  }
  #product-page-feature .feature-item figure figcaption button {
    background-color: rgba(255, 255, 255, 0.5);
  }
}
@media (min-width: 768px) {
  #product-page-feature .feature-item figure figcaption.caption-1 {
    top: 50%;
    margin-top: -84px;
  }
}
@media (min-width: 1200px) {
  #product-page-feature .feature-item figure figcaption h3 {
    font-size: 28px;
    line-height: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #product-page-feature .feature-item figure figcaption h3 {
    font-size: 24px;
    line-height: 31px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #product-page-feature .feature-item figure figcaption h3 {
    font-size: 22px;
    line-height: 27px;
  }
}
@media (max-width: 767px) {
  #product-page-feature .feature-item figure figcaption.caption-1 {
    top: 10px;
  }
  #product-page-feature .feature-item figure figcaption h3 {
    font-size: 18px;
  }
}
#product-page-feature .feature-item figure figcaption h3 {
  color: #252525;
  text-transform: uppercase;
}
#product-page-feature .feature-item figure figcaption p {
  color: #2d2d2d;
  font-size: 16px;
  font-weight: 300;
}
#product-page-feature .feature-item figure figcaption button {
  height: 32px;
  padding: 4px 16px;
  border-color: #8f318a;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: #8f318a;
  font-size: 16px;
  font-weight: 300;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
#product-page-feature .feature-item figure figcaption button:hover {
  background-color: #8f318a;
  color: #fff;
}
#product-page-news {
  padding: 30px 0;
}
#product-page-news .news-item {
  margin: 0 0 20px;
}
#product-page-news .news-item .news-box {
  position: relative;
  width: 100%;
  overflow: hidden;
}
#product-page-news .news-item .news-box:before {
  content: "";
  display: block;
  padding-top: 60%;
}
#product-page-news .news-item .news-box:hover .news-image {
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  -webkit-opacity: 0.9;
  opacity: 0.9;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=90);
  filter: alpha(opacity=90);
}
#product-page-news .news-item .news-image {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  background: transparent no-repeat scroll center center / cover;
}
#product-page-news .news-item .news-caption {
  margin-top: 10px;
}
#product-page-news .news-item .news-caption h4 {
  color: #3a3a3a;
  font-weight: 600;
  text-align: center;
  overflow: hidden;
}
@media (min-width: 992px) {
  #product-page-news .news-item .news-caption h4 {
    height: 52px;
    font-size: 18px;
    line-height: 26px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #product-page-news .news-item .news-caption h4 {
    height: 48px;
    font-size: 14px;
    line-height: 24px;
  }
}
@media (max-width: 767px) {
  #product-page-news .news-item .news-caption h4 {
    height: 44px;
    font-size: 15px;
    line-height: 22px;
  }
}
#product-page-news .news-title-wrapper {
  position: relative;
  text-align: center;
  margin-bottom: 30px;
}
#product-page-news .news-title-wrapper:after {
  content: '';
  position: absolute;
  bottom: 8px;
  left: 15px;
  right: 15px;
  width: 100%;
  border-bottom: 1px solid #ddd;
  -webkit-animation: fadeIn 1s both 1s;
  -moz-animation: fadeIn 1s both 1s;
  -ms-animation: fadeIn 1s both 1s;
  animation: fadeIn 1s both 1s;
}
#product-page-news .product-page-title {
  position: relative;
  background-color: #fff;
  padding: 0 20px;
  z-index: 10;
}
@media (min-width: 1200px) {
  #product-page-news .col-1 {
    padding-right: 40px;
  }
  #product-page-news .col-2 {
    padding-left: 20px;
    padding-right: 20px;
  }
  #product-page-news .col-3 {
    padding-left: 40px;
  }
}
.product-page-title {
  display: inline-block;
  color: #252525;
  font-weight: 300;
  text-transform: uppercase;
  text-align: center;
}
@media (min-width: 1200px) {
  .product-page-title {
    font-size: 45px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .product-page-title {
    font-size: 42px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .product-page-title {
    font-size: 36px;
  }
}
@media (max-width: 767px) {
  .product-page-title {
    font-size: 28px;
  }
}
@media (max-width: 320px) {
  .product-page-title {
    font-size: 24px;
  }
}
.testimonial-slide {
  position: relative;
  padding: 0 100px;
  margin: 30px 0;
}
@media (min-width: 992px) {
  .testimonial-slide {
    padding: 0 100px;
    margin: 30px 0;
  }
}
@media (max-width: 991px) {
  .testimonial-slide {
    margin: 15px 0 25px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .testimonial-slide {
    padding: 0 80px;
  }
}
@media (max-width: 767px) {
  .testimonial-slide {
    padding: 0 50px;
  }
}
@media (max-width: 320px) {
  .testimonial-slide {
    padding: 0 30px;
  }
}
.testimonial-slide .testimonial-item p {
  color: #454545;
  font-weight: 300;
}
@media (min-width: 1200px) {
  .testimonial-slide .testimonial-item p {
    font-size: 24px;
    margin: 20px 0;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .testimonial-slide .testimonial-item p {
    font-size: 20px;
    margin: 20px 0;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .testimonial-slide .testimonial-item p {
    font-size: 18px;
    margin: 15px 0;
  }
}
@media (max-width: 767px) {
  .testimonial-slide .testimonial-item p {
    font-size: 15px;
    margin: 10px 0;
  }
}
.testimonial-slide .testimonial-item h5 {
  color: #454545;
  font-weight: 300;
}
.testimonial-slide .testimonial-item h5 span {
  font-weight: 600;
}
@media (min-width: 992px) {
  .testimonial-slide .testimonial-item h5 {
    font-size: 20px;
    line-height: 30px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .testimonial-slide .testimonial-item h5 {
    font-size: 18px;
    line-height: 26px;
  }
}
@media (max-width: 767px) {
  .testimonial-slide .testimonial-item h5 {
    font-size: 15px;
    line-height: 22px;
  }
}
.testimonial-prev,
.testimonial-next {
  position: absolute;
  top: 75px;
  display: inline-block;
  background: transparent no-repeat center center / 100% auto;
}
@media (min-width: 992px) {
  .testimonial-prev,
  .testimonial-next {
    width: 33px;
    height: 60px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .testimonial-prev,
  .testimonial-next {
    width: 28px;
    height: 50px;
  }
}
@media (max-width: 767px) {
  .testimonial-prev,
  .testimonial-next {
    width: 22px;
    height: 40px;
  }
}
.testimonial-prev {
  background-image: url("../../bundles/app/images/product-landing/prev-icon.png");
  left: 0;
}
.testimonial-next {
  background-image: url("../../bundles/app/images/product-landing/next-icon.png");
  right: 0;
}
.rating-symbol {
  display: inline-block;
  background: transparent no-repeat center center / 100% auto;
}
@media (min-width: 768px) {
  .rating-symbol {
    width: 40px;
    height: 38px;
  }
}
@media (max-width: 767px) {
  .rating-symbol {
    width: 32px;
    height: 30px;
  }
}
.symbol-filled {
  background-image: url("../../bundles/app/images/product-landing/rated-star.png");
}
.symbol-empty {
  background-image: url("../../bundles/app/images/product-landing/unrated-star.png");
}
@media (min-width: 768px) {
  .testimonial-modal .modal-dialog {
    max-width: 800px;
    width: 100%;
  }
}
.testimonial-modal .modal-content {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.testimonial-modal .modal-border {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.testimonial-modal .modal-border .x-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 10px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(left, #67327b, transparent);
  background-image: -moz-linear-gradient(left, #67327b, transparent);
  background-image: -o-linear-gradient(left, #67327b, transparent);
}
.testimonial-modal .modal-border .y-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(#67327b, transparent);
  background-image: -moz-linear-gradient(#67327b, transparent);
  background-image: -o-linear-gradient(#67327b, transparent);
  background-image: linear-gradient(#67327b, transparent);
}
.testimonial-modal .modal-border .x-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60%;
  height: 10px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(left, transparent, #67327b);
  background-image: -moz-linear-gradient(left, transparent, #67327b);
  background-image: -o-linear-gradient(left, transparent, #67327b);
}
.testimonial-modal .modal-border .y-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(transparent, #67327b);
  background-image: -moz-linear-gradient(transparent, #67327b);
  background-image: -o-linear-gradient(transparent, #67327b);
  background-image: linear-gradient(transparent, #67327b);
}
.testimonial-modal .close {
  position: absolute;
  color: #8f318a;
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  -webkit-opacity: 0.7;
  opacity: 0.7;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
  filter: alpha(opacity=70);
}
@media (min-width: 768px) {
  .testimonial-modal .close {
    top: 20px;
    right: 30px;
    font-size: 40px;
  }
}
@media (max-width: 767px) {
  .testimonial-modal .close {
    top: 10px;
    right: 20px;
    font-size: 30px;
  }
}
.testimonial-modal .close:hover {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
}
.testimonial-modal .modal-header,
.testimonial-modal .modal-body,
.testimonial-modal .modal-footer {
  position: relative;
  border: none;
  z-index: 100;
}
@media (min-width: 768px) {
  .testimonial-modal .modal-header {
    padding: 30px 80px 20px;
  }
}
@media (min-width: 768px) {
  .testimonial-modal .modal-body {
    padding: 0 65px;
  }
}
.testimonial-modal .modal-footer {
  text-align: center;
}
@media (min-width: 768px) {
  .testimonial-modal .modal-footer button {
    font-size: 20px;
    margin-bottom: 30px;
  }
}
@media (max-width: 767px) {
  .testimonial-modal .modal-footer button {
    margin-bottom: 20px;
  }
}
.testimonial-modal .modal-title {
  color: #252525;
  font-weight: 300;
  text-transform: uppercase;
  text-align: center;
  margin: 10px 0;
}
@media (min-width: 768px) {
  .testimonial-modal .modal-title {
    font-size: 36px;
  }
}
@media (max-width: 767px) {
  .testimonial-modal .modal-title {
    font-size: 28px;
  }
}
.testimonial-modal .modal-divider {
  position: relative;
  width: 100%;
  text-align: center;
}
.testimonial-modal .modal-divider .star-bar {
  position: relative;
  display: inline-block;
  min-width: 260px;
  background-color: #fff;
  padding: 0 30px;
  z-index: 10;
}
.testimonial-modal .modal-divider:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  border-bottom: 1px solid #ddd;
}
.testimonial-modal .form-textarea {
  position: relative;
}
.testimonial-modal .form-textarea textarea {
  height: auto;
  resize: vertical;
}
.testimonial-modal .form-textarea .note {
  position: absolute;
  right: 30px;
  bottom: 10px;
  font-size: 15px;
}
.testimonial-modal .form-group:before,
.testimonial-modal .form-group:after {
  display: table;
  content: " ";
}
.testimonial-modal .form-group:after {
  clear: both;
}
.testimonial-modal .form-control {
  color: #8d8d8d !important;
  font-weight: 300;
  border-color: #ddd !important;
  box-shadow: none;
}
.testimonial-modal .form-control:focus {
  border-color: #8f318a !important;
}
@media (min-width: 768px) {
  .testimonial-modal .form-control {
    height: 48px;
    font-size: 18px !important;
  }
}
@media (max-width: 767px) {
  .testimonial-modal .form-control {
    height: 40px;
    font-size: 15px !important;
  }
}
@media (max-width: 767px) {
  .testimonial-modal .form-input-1 > div:first-child,
  .testimonial-modal .form-input-2 > div:first-child {
    margin-bottom: 15px;
  }
  .testimonial-modal .form-input-2 {
    margin-bottom: 0;
  }
}
.testimonial-success-modal .modal-content {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
.testimonial-success-modal .modal-border {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
}
.testimonial-success-modal .modal-border .x-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 10px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(left, #67327b, transparent);
  background-image: -moz-linear-gradient(left, #67327b, transparent);
  background-image: -o-linear-gradient(left, #67327b, transparent);
}
.testimonial-success-modal .modal-border .y-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(#67327b, transparent);
  background-image: -moz-linear-gradient(#67327b, transparent);
  background-image: -o-linear-gradient(#67327b, transparent);
  background-image: linear-gradient(#67327b, transparent);
}
.testimonial-success-modal .modal-border .x-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60%;
  height: 10px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(left, transparent, #67327b);
  background-image: -moz-linear-gradient(left, transparent, #67327b);
  background-image: -o-linear-gradient(left, transparent, #67327b);
}
.testimonial-success-modal .modal-border .y-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(transparent, #67327b);
  background-image: -moz-linear-gradient(transparent, #67327b);
  background-image: -o-linear-gradient(transparent, #67327b);
  background-image: linear-gradient(transparent, #67327b);
}
.testimonial-success-modal .close {
  position: absolute;
  color: #8f318a;
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  -webkit-opacity: 0.7;
  opacity: 0.7;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
  filter: alpha(opacity=70);
  z-index: 100;
}
@media (min-width: 768px) {
  .testimonial-success-modal .close {
    top: 20px;
    right: 30px;
    font-size: 40px;
  }
}
@media (max-width: 767px) {
  .testimonial-success-modal .close {
    top: 10px;
    right: 20px;
    font-size: 30px;
  }
}
.testimonial-success-modal .close:hover {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  -webkit-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter: alpha(opacity=100);
}
.testimonial-success-modal .modal-header,
.testimonial-success-modal .modal-body,
.testimonial-success-modal .modal-footer {
  position: relative;
  border: none;
  z-index: 100;
}
.testimonial-success-modal .modal-footer {
  text-align: center;
}
@media (min-width: 768px) {
  .testimonial-success-modal .modal-footer button {
    font-size: 20px;
    margin-bottom: 40px;
  }
}
@media (max-width: 767px) {
  .testimonial-success-modal .modal-footer button {
    margin-bottom: 30px;
  }
}
.testimonial-success-modal .modal-body img {
  margin: 10px auto 30px;
}
.testimonial-success-modal .modal-body p {
  color: #8f318a;
  font-weight: 300;
  text-align: center;
}
@media (min-width: 768px) {
  .testimonial-success-modal .modal-body p {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .testimonial-success-modal .modal-body p {
    font-size: 16px;
  }
}
#lucky-gift-box .flame {
  display: block;
  position: relative;
  width: 100%;
}
#lucky-gift-box .flame .promotion-flame2,
#lucky-gift-box .flame .promotion-flame4 {
  position: absolute;
  left: 0;
  bottom: -52%;
  z-index: 10;
  width: 100%;
  height: 100%;
}
#lucky-gift-box .flame .promotion-flame2 figure img,
#lucky-gift-box .flame .promotion-flame4 figure img {
  display: block;
  max-width: 100%;
  position: relative;
}
#lucky-gift-box .flame .promotion-flame2 figure .flame-description,
#lucky-gift-box .flame .promotion-flame4 figure .flame-description {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
#lucky-gift-box .flame .promotion-flame2 figure .bn-flame,
#lucky-gift-box .flame .promotion-flame4 figure .bn-flame {
  display: block;
  width: 100%;
  position: relative;
}
#lucky-gift-box .flame .promotion-flame4 {
  bottom: -50%;
}
#lucky-gift-box .flame figure img {
  display: block;
  max-width: 100%;
  position: relative;
}
#lucky-gift-box .flame figure .flame-description {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
#lucky-gift-box .flame figure .flame-description.flame3 {
  z-index: 11;
}
#lucky-gift-box .flame figure .bn-flame {
  display: block;
  width: 100%;
  position: relative;
}
#lucky-gift-box .flame .flame-content {
  display: block;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 11;
}
#lucky-gift-box .flame .flame-content.flame-content2 {
  top: 250px;
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .flame-content.flame-content2 {
    top: 200px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .flame-content.flame-content2 {
    top: 50px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .flame-content.flame-content2 {
    top: 25px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .flame-content.flame-content2 {
    top: 30px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .flame-content.flame-content2 {
    top: 52px;
  }
}
#lucky-gift-box .flame .flame-content.flame-content3 {
  top: 200px;
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .flame-content.flame-content3 {
    top: 120px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .flame-content.flame-content3 {
    top: 60px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .flame-content.flame-content3 {
    top: 70px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .flame-content.flame-content3 {
    top: 30px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .flame-content.flame-content3 {
    top: 30px;
  }
}
#lucky-gift-box .flame .flame-content.flame-content4 {
  top: 250px;
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .flame-content.flame-content4 {
    top: 200px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .flame-content.flame-content4 {
    top: 150px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .flame-content.flame-content4 {
    top: 100px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .flame-content.flame-content4 {
    top: 50px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .flame-content.flame-content4 {
    top: 0;
  }
}
#lucky-gift-box .flame .flame-content.flame-content5 {
  top: 400px;
}
@media (min-width: 1600px) and (max-width: 1920px) {
  #lucky-gift-box .flame .flame-content.flame-content5 {
    top: 700px;
  }
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .flame-content.flame-content5 {
    top: 300px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .flame-content.flame-content5 {
    top: 200px;
  }
  #lucky-gift-box .flame .flame-content.flame-content5 .slimScrollDiv {
    height: 250px !important;
  }
  #lucky-gift-box .flame .flame-content.flame-content5 .slimScrollDiv .scroll-block {
    height: 250px !important;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .flame-content.flame-content5 {
    top: 150px;
  }
  #lucky-gift-box .flame .flame-content.flame-content5 .slimScrollDiv {
    height: 235px !important;
  }
  #lucky-gift-box .flame .flame-content.flame-content5 .slimScrollDiv .scroll-block {
    height: 235px !important;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .flame-content.flame-content5 {
    top: 125px;
  }
  #lucky-gift-box .flame .flame-content.flame-content5 .slimScrollDiv {
    height: 180px !important;
  }
  #lucky-gift-box .flame .flame-content.flame-content5 .slimScrollDiv .scroll-block {
    height: 160px !important;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .flame-content.flame-content5 {
    top: 65px;
  }
}
#lucky-gift-box .flame .block-content1 {
  text-align: center;
  width: 100%;
  height: auto;
  display: block;
  margin-top: 35px;
}
@media (min-width: 1600px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content1 {
    margin-top: 75px;
  }
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .block-content1 {
    margin-top: 20px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content1 {
    margin-top: 15px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 {
    margin-top: 10px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content1 {
    margin-top: 0;
  }
}
#lucky-gift-box .flame .block-content1 .title-content {
  color: white;
  font-family: 'Bebas', sans-serif;
  font-size: 70px;
  line-height: 70px;
  text-transform: uppercase;
  text-shadow: -5px 3px 2px rgba(78, 58, 9, 0.4);
  margin-bottom: 35px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content1 .title-content {
    font-size: 90px;
    line-height: 90px;
  }
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .block-content1 .title-content {
    font-size: 50px;
    line-height: 50px;
    margin-bottom: 20px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content1 .title-content {
    font-size: 35px;
    line-height: 35px;
    margin-bottom: 10px;
    text-shadow: -3px 1px 1px rgba(78, 58, 9, 0.4);
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 .title-content {
    font-size: 18px;
    line-height: 18px;
    margin-bottom: 5px;
    text-shadow: -1px 1px 1px rgba(78, 58, 9, 0.4);
  }
}
#lucky-gift-box .flame .block-content1 .wrapper-content {
  color: white;
  font-weight: 600;
  font-size: 14px;
  padding: 0 50px;
  display: block;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content1 .wrapper-content {
    font-size: 18px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content1 .wrapper-content {
    font-size: 12px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .block-content1 .wrapper-content {
    display: none;
  }
}
#lucky-gift-box .flame .block-content1 .number-painter {
  display: block;
  margin: 20px auto;
  padding: 45px 0 50px 160px;
  position: relative;
  text-align: left;
  width: 75%;
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .block-content1 .number-painter {
    margin: 0 auto;
    padding: 35px 0 35px 140px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content1 .number-painter {
    margin: 5px auto;
    padding: 15px 0 15px 120px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 .number-painter {
    margin: 5px auto;
    padding: 15px 0 15px 55px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content1 .number-painter {
    margin: 10px auto;
    padding: 4px 0 4px 40px;
  }
}
#lucky-gift-box .flame .block-content1 .number-painter:after {
  background: rgba(0, 0, 0, 0) url("../../bundles/app/images/lucky-gift-box/number-painter.png") no-repeat scroll center center / 100% auto;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}
#lucky-gift-box .flame .block-content1 .number-painter .timer {
  color: #ff6600;
  font-family: 'Bebas', sans-serif;
  font-size: 60px;
  left: 60px;
  line-height: 87px;
  position: absolute;
  text-align: center;
  top: 20px;
  z-index: 1;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content1 .number-painter .timer {
    font-size: 75px;
    left: 45px;
  }
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .block-content1 .number-painter .timer {
    top: 10px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content1 .number-painter .timer {
    line-height: 25px;
    top: 20px;
    left: 35px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 .number-painter .timer {
    left: 25px;
    top: 15px;
    font-size: 20px;
    line-height: 20px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content1 .number-painter .timer {
    font-size: 20px;
    line-height: 20px;
    left: 10px;
    top: 4px;
  }
}
#lucky-gift-box .flame .block-content1 .number-painter .description-top,
#lucky-gift-box .flame .block-content1 .number-painter .description-bottom {
  color: #ff6600;
  display: block;
  font-weight: 700;
  width: 100%;
  line-height: 25px;
  z-index: 1;
  position: relative;
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 .number-painter .description-top,
  #lucky-gift-box .flame .block-content1 .number-painter .description-bottom {
    line-height: 12px;
  }
}
#lucky-gift-box .flame .block-content1 .number-painter .description-top {
  font-size: 22px;
  text-transform: uppercase;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content1 .number-painter .description-top {
    font-size: 30px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 .number-painter .description-top {
    font-size: 12px;
  }
}
#lucky-gift-box .flame .block-content1 .number-painter .description-bottom {
  font-size: 20px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content1 .number-painter .description-bottom {
    font-size: 28px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 .number-painter .description-bottom {
    font-size: 10px;
  }
}
#lucky-gift-box .flame .block-content1 .action-content {
  display: block;
  width: 100%;
  position: relative;
}
#lucky-gift-box .flame .block-content1 .action-content .btn-register {
  border: 0;
  display: block;
  background-color: #d21f1a;
  width: 245px;
  height: 32px;
  text-align: center;
  color: white;
  line-height: 26px;
  font-size: 22px;
  text-transform: uppercase;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin: 0 auto 15px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  box-shadow: -3px 1px 1px rgba(78, 58, 9, 0.4);
}
#lucky-gift-box .flame .block-content1 .action-content .btn-register:hover {
  background-color: white;
  color: #d21f1a;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-register {
    font-size: 28px;
    height: 38px;
    line-height: 32px;
    width: 300px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-register {
    width: 220px;
    height: 22px;
    line-height: 19px;
    font-size: 16px;
    margin: 0 auto 5px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-register {
    width: 180px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-register {
    width: 80%;
    height: 22px;
    margin: 0 auto 5px;
    line-height: 19px;
    font-size: 16px;
    box-shadow: -1px 1px 1px rgba(78, 58, 9, 0.4);
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-register {
    width: 100%;
  }
}
#lucky-gift-box .flame .block-content1 .action-content .btn-register span {
  font-family: 'Bebas', sans-serif;
}
#lucky-gift-box .flame .block-content1 .action-content .btn-content-event {
  display: block;
  font-family: 'Bebas', sans-serif;
  border: 3px solid #d21f1a;
  background-color: transparent;
  width: 245px;
  height: 32px;
  text-align: center;
  color: #d21f1a;
  line-height: 26px;
  font-size: 22px;
  text-transform: uppercase;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  margin: 0 auto 15px;
  box-shadow: -3px 1px 1px rgba(78, 58, 9, 0.4);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-content-event {
    font-size: 28px;
    height: 40px;
    line-height: 28px;
    width: 300px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-content-event {
    width: 220px;
    height: 22px;
    border: 2px solid #d21f1a;
    line-height: 14px;
    font-size: 16px;
    margin: 0 auto 5px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-content-event {
    width: 180px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-content-event {
    width: 80%;
    height: 22px;
    margin: 0 auto 5px;
    line-height: 12px;
    font-size: 16px;
    box-shadow: -1px 1px 1px rgba(78, 58, 9, 0.4);
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content1 .action-content .btn-content-event {
    width: 100%;
  }
}
#lucky-gift-box .flame .block-content1 .action-content .btn-content-event span {
  text-shadow: -2px 1px 1px rgba(78, 58, 9, 0.4);
  font-family: 'Bebas', sans-serif;
}
#lucky-gift-box .flame .block-content1 .action-content .btn-content-event:hover {
  border-color: white;
  color: white;
}
#lucky-gift-box .flame .block-content2 {
  text-align: center;
  width: 100%;
  height: auto;
  display: block;
  margin-top: 35px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content2 {
    margin-top: 115px;
  }
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .block-content2 {
    margin-top: 15px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content2 {
    margin-top: 25px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content2 {
    margin-top: 60px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content2 {
    margin-top: 0;
  }
}
#lucky-gift-box .flame .block-content2 .title-promotion {
  color: #632366;
  font-family: 'iCielBambola', sans-serif;
  font-size: 50px;
  line-height: 30px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content2 .title-promotion {
    font-size: 60px;
    line-height: 35px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content2 .title-promotion {
    font-size: 25px;
    line-height: 25px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content2 .title-promotion {
    font-size: 25px;
    line-height: 30px;
  }
}
#lucky-gift-box .flame .block-content2 .sub-title-promotion {
  color: #632366;
  font-family: 'Bebas', sans-serif;
  font-size: 50px;
  text-transform: uppercase;
  margin-bottom: 15px;
  font-weight: 600;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content2 .sub-title-promotion {
    font-size: 60px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content2 .sub-title-promotion {
    font-size: 20px;
    margin-bottom: 5px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content2 .sub-title-promotion {
    font-size: 20px;
  }
}
#lucky-gift-box .flame .block-content2 .wrapper-promotion {
  color: #8e4e91;
  font-size: 14px;
  padding: 0 50px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content2 .wrapper-promotion {
    font-size: 18px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content2 .wrapper-promotion {
    display: none;
  }
}
#lucky-gift-box .flame .block-content3 {
  text-align: center;
  width: 100%;
  height: auto;
  display: block;
  margin: 0;
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content3 {
    margin-top: 25px;
  }
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content3 {
    margin-top: 5px;
  }
}
#lucky-gift-box .flame .block-content3 .title-content {
  color: white;
  font-family: 'iCielBambola', sans-serif;
  font-size: 50px;
  line-height: 35px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content3 .title-content {
    font-size: 45px;
    line-height: 40px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .block-content3 .title-content {
    font-size: 35px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content3 .title-content {
    font-size: 25px;
  }
}
#lucky-gift-box .flame .block-content3 .sub-title-content {
  color: white;
  font-family: 'Bebas', sans-serif;
  font-size: 50px;
  text-transform: uppercase;
  margin-bottom: 35px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content3 .sub-title-content {
    font-size: 50px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .block-content3 .sub-title-content {
    font-size: 30px;
    margin-bottom: 10px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content3 .sub-title-content {
    font-size: 20px;
  }
}
#lucky-gift-box .flame .block-content3 .wrapper-content {
  color: white;
  font-size: 14px;
  padding: 0 50px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content3 .wrapper-content {
    font-size: 18px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .block-content3 .wrapper-content {
    font-size: 12px;
    padding: 0 10px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content3 .wrapper-content {
    display: none;
  }
}
#lucky-gift-box .flame .block-content3 .action-content {
  display: block;
  width: 100%;
  position: relative;
  text-align: center;
}
#lucky-gift-box .flame .block-content3 .action-content .btn-show-more {
  font-size: 16px;
  color: white;
  text-transform: uppercase;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  margin: 15px 0;
  display: block;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content3 .action-content .btn-show-more {
    font-size: 22px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content3 .action-content .btn-show-more {
    margin: 5px 0;
    font-size: 14px;
  }
}
#lucky-gift-box .flame .block-content3 .action-content .btn-show-more span {
  display: block;
  font-weight: 600;
}
#lucky-gift-box .flame .block-content3 .action-content .btn-show-more:hover {
  color: whitesmoke;
}
#lucky-gift-box .flame .block-content3 .paint-type {
  display: block;
  width: 100%;
  position: relative;
  text-align: center;
  padding: 0 50px;
}
@media (max-width: 360px) {
  #lucky-gift-box .flame .block-content3 .paint-type {
    padding: 0 25px;
  }
}
#lucky-gift-box .flame .block-content4 {
  text-align: center;
  width: 100%;
  height: auto;
  display: block;
  margin-top: 35px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content4 {
    margin-top: 200px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content4 {
    margin-top: 15px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content4 {
    margin-top: 65px;
  }
}
#lucky-gift-box .flame .block-content4 .title-promotion {
  color: #632366;
  font-size: 50px;
  line-height: 50px;
  margin-bottom: 15px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content4 .title-promotion {
    font-size: 60px;
    line-height: 60px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content4 .title-promotion {
    line-height: 0;
    margin-bottom: 5px;
  }
}
#lucky-gift-box .flame .block-content4 .title-promotion .promo {
  font-weight: 400;
  font-family: 'iCielBambola', sans-serif;
  text-transform: inherit;
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content4 .title-promotion .promo {
    font-size: 25px;
    line-height: 25px;
  }
}
#lucky-gift-box .flame .block-content4 .title-promotion span {
  display: inline-block;
  color: #632366;
  font-family: 'Bebas', sans-serif;
  font-size: 50px;
  font-weight: 600;
  text-transform: uppercase;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content4 .title-promotion span {
    font-size: 60px;
    line-height: 60px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content4 .title-promotion span {
    line-height: 20px;
    font-size: 20px;
  }
}
#lucky-gift-box .flame .block-content4 .wrapper-promotion {
  color: #8e4e91;
  font-size: 14px;
  padding: 0 50px;
}
@media (min-width: 1660px) and (max-width: 1920px) {
  #lucky-gift-box .flame .block-content4 .wrapper-promotion {
    font-size: 18px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content4 .wrapper-promotion {
    display: none;
  }
}
#lucky-gift-box .flame .block-content5 {
  width: 100%;
  position: absolute;
  right: 0;
  height: auto;
  top: 0;
  padding: 90px 180px;
  background: url("../../bundles/app/images/lucky-gift-box/block-content.png") no-repeat center / 100% 100%;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 1320px) {
  #lucky-gift-box .flame .block-content5 {
    padding: 65px 150px;
  }
}
@media (max-width: 1024px) {
  #lucky-gift-box .flame .block-content5 {
    padding: 35px 125px;
  }
}
@media (max-width: 768px) {
  #lucky-gift-box .flame .block-content5 {
    padding: 35px 65px;
  }
}
@media (max-width: 640px) {
  #lucky-gift-box .flame .block-content5 {
    padding: 35px 65px;
  }
}
@media (max-width: 480px) {
  #lucky-gift-box .flame .block-content5 {
    padding: 15px 35px 0;
  }
}
#lucky-gift-box .flame .block-content5 .scroll-block {
  width: 620px;
  height: 340px;
  position: relative;
  display: block;
}
#lucky-gift-box .flame .block-content5 .scroll-block .title-block {
  font-family: 'Bebas', sans-serif;
  text-transform: uppercase;
  color: #632366;
  font-size: 25px;
  text-align: center;
  margin-bottom: 25px;
}
#lucky-gift-box .flame .block-content5 .scroll-block p {
  color: #808d9b;
  font-size: 15px;
}
@media (max-width: 1320px) {
  #lucky-gift-box .flame .block-content5 .scroll-block p {
    font-size: 12px;
  }
}
@media (min-width: 992px) {
  .wall-sizer,
  .wall-item {
    width: 33.33%;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .wall-sizer,
  .wall-item {
    width: 50%;
  }
}
@media (max-width: 767px) {
  .wall-sizer,
  .wall-item {
    width: 100%;
  }
}
#galaxy-wall-top {
  width: 100%;
}
#galaxy-wall-top .owl-stage-outer {
  overflow: visible;
}
#galaxy-wall-top .banner-wrapper {
  position: relative;
  width: 100%;
  z-index: 1;
}
@media (min-width: 768px) {
  #galaxy-wall-top .banner-wrapper .large-banner {
    display: block;
  }
  #galaxy-wall-top .banner-wrapper .small-banner {
    display: none;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-top .banner-wrapper .large-banner {
    display: none;
  }
  #galaxy-wall-top .banner-wrapper .small-banner {
    display: block;
  }
}
#galaxy-wall-top .item {
  width: 100%;
}
@media (min-width: 1600px) {
  #galaxy-wall-top .item .bannter-prize {
    margin-top: 250px !important;
  }
}
@media (min-width: 1200px) {
  #galaxy-wall-top .item .banner-content {
    margin-top: 30px;
  }
  #galaxy-wall-top .item .banner-painter {
    margin-top: 150px;
  }
  #galaxy-wall-top .item .bannter-prize {
    margin-top: 220px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-wall-top .item .banner-painter {
    margin-top: 100px;
  }
  #galaxy-wall-top .item .bannter-prize {
    margin-top: 170px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-top .item .banner-painter {
    margin-top: 50px;
  }
  #galaxy-wall-top .item .bannter-prize {
    margin-top: 150px;
  }
  #galaxy-wall-top .item .banner-frame {
    height: 340px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-top .item .bannter-prize {
    margin-top: 140px;
  }
  #galaxy-wall-top .item .banner-painter {
    position: relative;
    margin-top: 240px;
    z-index: 10;
  }
  #galaxy-wall-top .item .banner-content {
    z-index: 9;
  }
  #galaxy-wall-top .item .absolute {
    position: absolute;
    top: 60px;
    left: 0;
  }
}
@media (max-width: 390px) {
  #galaxy-wall-top .item .bannter-prize {
    margin-top: 100px;
  }
  #galaxy-wall-top .item .banner-painter {
    margin-top: 220px;
  }
}
@media (max-width: 360px) {
  #galaxy-wall-top .item .bannter-prize {
    margin-top: 80px;
  }
  #galaxy-wall-top .item .banner-painter {
    margin-top: 220px;
  }
}
@media (min-width: 992px) {
  #galaxy-wall-top .item .painter-desktop {
    display: block;
  }
  #galaxy-wall-top .item .painter-mobile {
    display: none;
  }
}
@media (max-width: 991px) {
  #galaxy-wall-top .item .painter-desktop {
    display: none;
  }
  #galaxy-wall-top .item .painter-mobile {
    display: block;
  }
}
#galaxy-wall-top .item-container {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}
#galaxy-wall-top .banner-content {
  width: 100%;
}
#galaxy-wall-top .banner-content > figure {
  position: relative;
}
@media (min-width: 992px) {
  #galaxy-wall-top .banner-content > figure:first-child {
    margin-top: 80px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-top .banner-content > figure:first-child {
    margin-top: 40px;
  }
}
#galaxy-wall-top .banner-content > figure:nth-child(2) {
  width: 75%;
}
@media (min-width: 768px) {
  #galaxy-wall-top .banner-content > figure:nth-child(2) {
    margin: 0 auto;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-top .banner-content > figure:nth-child(2) {
    margin-left: auto;
  }
}
@media (min-width: 992px) {
  #galaxy-wall-top .banner-smear {
    width: 90%;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-top .banner-smear {
    width: 80%;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-top .banner-smear {
    width: 100%;
  }
}
@media (min-width: 1600px) {
  #galaxy-wall-top .banner-desc {
    top: 170px;
    right: 100px;
  }
  #galaxy-wall-top .banner-desc h2 {
    font-size: 65px;
  }
  #galaxy-wall-top .banner-desc h3 {
    font-size: 45px;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #galaxy-wall-top .banner-desc {
    top: 150px;
    right: 100px;
  }
  #galaxy-wall-top .banner-desc h2 {
    font-size: 48px;
  }
  #galaxy-wall-top .banner-desc h3 {
    font-size: 32px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-wall-top .banner-desc {
    top: 100px;
    right: 50px;
  }
  #galaxy-wall-top .banner-desc h2 {
    font-size: 40px;
  }
  #galaxy-wall-top .banner-desc h3 {
    font-size: 24px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-top .banner-desc {
    top: 80px;
    right: 50px;
  }
  #galaxy-wall-top .banner-desc h2 {
    font-size: 36px;
  }
  #galaxy-wall-top .banner-desc h3 {
    font-size: 22px;
  }
}
@media (min-width: 768px) {
  #galaxy-wall-top .banner-desc {
    position: absolute;
    text-align: right;
  }
  #galaxy-wall-top .banner-desc h2,
  #galaxy-wall-top .banner-desc h3 {
    white-space: nowrap;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-top .banner-desc {
    width: 100%;
    text-align: center;
    margin-top: 140px;
    padding: 0 30px;
  }
  #galaxy-wall-top .banner-desc h2 {
    font-size: 30px;
  }
  #galaxy-wall-top .banner-desc h3 {
    font-size: 16px;
  }
}
@media (max-width: 360px) {
  #galaxy-wall-top .banner-desc {
    margin-top: 120px;
  }
}
#galaxy-wall-top .banner-desc h2,
#galaxy-wall-top .banner-desc h3 {
  color: #fff;
  font-family: 'Fester', sans-serif;
  text-shadow: 4px 4px 5px rgba(0, 0, 0, 0.5);
}
#galaxy-wall-top .banner-desc h2 {
  margin-bottom: 5px;
}
#galaxy-wall-top .banner-desc button {
  margin-top: 20px;
}
#galaxy-wall-top .banner-number {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
#galaxy-wall-top .banner-statistic {
  display: table;
  padding-right: 10%;
}
@media (min-width: 1600px) {
  #galaxy-wall-top .banner-statistic .number {
    font-size: 75px;
  }
  #galaxy-wall-top .banner-statistic span:first-child {
    font-size: 30px;
  }
  #galaxy-wall-top .banner-statistic span:nth-child(2) {
    font-size: 24px;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #galaxy-wall-top .banner-statistic .number {
    font-size: 60px;
  }
  #galaxy-wall-top .banner-statistic span:first-child {
    font-size: 25px;
  }
  #galaxy-wall-top .banner-statistic span:nth-child(2) {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-wall-top .banner-statistic .number {
    font-size: 55px;
  }
  #galaxy-wall-top .banner-statistic span:first-child {
    font-size: 22px;
  }
  #galaxy-wall-top .banner-statistic span:nth-child(2) {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-top .banner-statistic .number {
    font-size: 50px;
  }
  #galaxy-wall-top .banner-statistic span:first-child {
    font-size: 20px;
  }
  #galaxy-wall-top .banner-statistic span:nth-child(2) {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-top .banner-statistic .number {
    font-size: 45px;
  }
  #galaxy-wall-top .banner-statistic span:first-child {
    font-size: 20px;
  }
  #galaxy-wall-top .banner-statistic span:nth-child(2) {
    font-size: 16px;
  }
}
#galaxy-wall-top .banner-statistic > div {
  display: table-cell;
  vertical-align: middle;
}
#galaxy-wall-top .banner-statistic > div:first-child {
  width: 40%;
  text-align: right;
}
#galaxy-wall-top .banner-statistic > div:nth-child(2) {
  width: 60%;
}
#galaxy-wall-top .banner-statistic > div .number {
  color: #632366;
  font-family: 'Fester', sans-serif;
  padding-right: 5px;
  padding-top: 10px;
}
#galaxy-wall-top .banner-statistic > div span {
  display: block;
  color: #8c2d90;
  font-weight: bold;
  white-space: nowrap;
}
#galaxy-wall-top .banner-statistic > div span:first-child {
  text-transform: uppercase;
}
#galaxy-wall-top .banner-text {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
#galaxy-wall-top .banner-text p {
  color: #8e4e91;
  font-weight: 600;
}
@media (min-width: 1600px) {
  #galaxy-wall-top .banner-text p {
    margin: 5% 0;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #galaxy-wall-top .banner-text p {
    margin: 20px 0;
  }
}
@media (max-width: 1199px) {
  #galaxy-wall-top .banner-text p {
    margin: 10px 0;
  }
}
@media (min-width: 1600px) {
  #galaxy-wall-top .banner-text {
    padding: 0 12%;
  }
  #galaxy-wall-top .banner-text img {
    width: 250px;
  }
  #galaxy-wall-top .banner-text p {
    font-size: 15px;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #galaxy-wall-top .banner-text {
    padding: 0 60px;
  }
  #galaxy-wall-top .banner-text img {
    width: 200px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-wall-top .banner-text {
    padding: 0 50px;
  }
  #galaxy-wall-top .banner-text img {
    width: 180px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-top .banner-text {
    padding: 0 12%;
  }
  #galaxy-wall-top .banner-text img {
    width: 150px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-top .banner-text {
    padding: 0 10px;
  }
  #galaxy-wall-top .banner-text img {
    width: 150px;
    margin-bottom: 20px;
  }
  #galaxy-wall-top .banner-text p {
    display: none;
  }
}
#galaxy-wall-middle {
  position: relative;
  width: 100%;
  background: url("../../bundles/app/images/galaxy-wall/middle-bg.jpg") no-repeat center top / cover;
  margin-bottom: -5px;
}
@media (min-width: 1200px) {
  #galaxy-wall-middle {
    min-height: 800px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-wall-middle {
    min-height: 700px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-middle {
    min-height: 700px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-middle {
    min-height: 800px;
  }
  #galaxy-wall-middle .banner-btn {
    width: 200px;
  }
}
#galaxy-wall-middle .painter-decor {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 100;
}
@media (min-width: 1200px) {
  #galaxy-wall-middle .painter-decor {
    bottom: -80px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-wall-middle .painter-decor {
    bottom: -50px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-middle .painter-decor {
    bottom: -105px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-middle .painter-decor {
    bottom: -30px;
  }
}
#galaxy-wall-middle .painter-decor > figure img {
  width: 100%;
}
#galaxy-wall-middle .rule-wrapper {
  position: relative;
  width: 100%;
  height: auto;
  background: no-repeat center / 100% 100%;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  cursor: default;
}
#galaxy-wall-middle .rule-wrapper .rule-2,
#galaxy-wall-middle .rule-wrapper .rule-3 {
  display: none;
}
#galaxy-wall-middle .rule-wrapper .rule-3 > div {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
#galaxy-wall-middle .rule-wrapper .rule-1,
#galaxy-wall-middle .rule-wrapper .rule-2,
#galaxy-wall-middle .rule-wrapper .rule-3 {
  position: relative;
  z-index: 1000;
}
@media (min-width: 768px) {
  #galaxy-wall-middle .rule-wrapper {
    background-image: url("../../bundles/app/images/galaxy-wall/rule-wrapper.png");
  }
}
@media (max-width: 767px) {
  #galaxy-wall-middle .rule-wrapper {
    background-image: url("../../bundles/app/images/galaxy-wall/rule-wrapper-mobile.png");
  }
}
@media (min-width: 1200px) {
  #galaxy-wall-middle .rule-wrapper {
    padding: 65px 150px;
    margin-top: 200px;
  }
  #galaxy-wall-middle .rule-wrapper .rule-1,
  #galaxy-wall-middle .rule-wrapper .rule-3 {
    height: 480px;
  }
  #galaxy-wall-middle .rule-wrapper .rule-2 {
    min-height: 480px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #galaxy-wall-middle .rule-wrapper {
    padding: 55px 125px 30px;
    margin-top: 150px;
  }
  #galaxy-wall-middle .rule-wrapper .rule-1,
  #galaxy-wall-middle .rule-wrapper .rule-3 {
    height: 490px;
  }
  #galaxy-wall-middle .rule-wrapper .rule-2 {
    min-height: 490px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #galaxy-wall-middle .rule-wrapper {
    padding: 40px 65px 20px;
    margin-top: 150px;
  }
  #galaxy-wall-middle .rule-wrapper .rule-1,
  #galaxy-wall-middle .rule-wrapper .rule-3 {
    height: 500px;
  }
  #galaxy-wall-middle .rule-wrapper .rule-2 {
    min-height: 500px;
    padding-top: 30px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-middle .rule-wrapper {
    padding: 40px 35px 20px;
    margin-top: 90px;
  }
  #galaxy-wall-middle .rule-wrapper .rule-1,
  #galaxy-wall-middle .rule-wrapper .rule-3 {
    height: 650px;
  }
  #galaxy-wall-middle .rule-wrapper .rule-2 {
    min-height: 650px;
  }
}
#galaxy-wall-middle .rule-wrapper .scroll-block {
  width: 620px;
  height: 340px;
  position: relative;
  display: block;
  z-index: 101;
}
#galaxy-wall-middle .rule-wrapper .title-block {
  font-family: 'Fester', sans-serif;
  text-transform: uppercase;
  color: #632366;
  line-height: 40px;
  text-align: center;
  margin-bottom: 25px;
}
@media (min-width: 1600px) {
  #galaxy-wall-middle .rule-wrapper .title-block {
    font-size: 30px;
  }
}
@media (max-width: 1599px) {
  #galaxy-wall-middle .rule-wrapper .title-block {
    font-size: 25px;
  }
}
#galaxy-wall-middle .rule-wrapper p {
  color: #808d9b;
  font-size: 15px;
  line-height: 24px;
}
#galaxy-wall-middle .rule-wrapper input[type="file"] {
  display: none;
}
#galaxy-wall-middle .rule-wrapper .form-message {
  text-align: center;
}
#galaxy-wall-middle .rule-wrapper .form-message h3 {
  color: #632366;
  font-family: 'Fester', sans-serif;
  margin: 25px 0 10px;
}
@media (min-width: 768px) {
  #galaxy-wall-middle .rule-wrapper .form-message h3 {
    font-size: 36px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-middle .rule-wrapper .form-message h3 {
    font-size: 30px;
  }
}
#galaxy-wall-middle .rule-wrapper .form-message p {
  color: #632366;
  font-size: 16px;
}
#galaxy-wall-middle .rule-wrapper .form-holder {
  position: relative;
  width: 100%;
  background-color: #ebebeb;
  border: 1px dashed #9aa4ae;
  cursor: pointer;
}
@media (min-width: 768px) {
  #galaxy-wall-middle .rule-wrapper .form-holder {
    height: 212px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-middle .rule-wrapper .form-holder {
    height: 180px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-middle .rule-wrapper .form-upload {
    margin-bottom: 15px;
  }
}
#galaxy-wall-middle .rule-wrapper .holder-hover .holder-camera {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  background-image: url("../../bundles/app/images/galaxy-wall/white-upload-icon.png") !important;
}
#galaxy-wall-middle .rule-wrapper .holder-hover:hover .holder-camera {
  -moz-opacity: 1 !important;
  -khtml-opacity: 1 !important;
  -webkit-opacity: 1 !important;
  opacity: 1 !important;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100) !important;
  filter: alpha(opacity=100) !important;
}
#galaxy-wall-middle .rule-wrapper .holder-border {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-transition: opacity 0.3s ease-in-out;
  -moz-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  -ms-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
  z-index: 10;
}
#galaxy-wall-middle .rule-wrapper .holder-border .x-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 5px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(left, #67327b, transparent);
  background-image: -moz-linear-gradient(left, #67327b, transparent);
  background-image: -o-linear-gradient(left, #67327b, transparent);
}
#galaxy-wall-middle .rule-wrapper .holder-border .y-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 5px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(#67327b, transparent);
  background-image: -moz-linear-gradient(#67327b, transparent);
  background-image: -o-linear-gradient(#67327b, transparent);
  background-image: linear-gradient(#67327b, transparent);
}
#galaxy-wall-middle .rule-wrapper .holder-border .x-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60%;
  height: 5px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(left, transparent, #67327b);
  background-image: -moz-linear-gradient(left, transparent, #67327b);
  background-image: -o-linear-gradient(left, transparent, #67327b);
}
#galaxy-wall-middle .rule-wrapper .holder-border .y-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 5px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(transparent, #67327b);
  background-image: -moz-linear-gradient(transparent, #67327b);
  background-image: -o-linear-gradient(transparent, #67327b);
  background-image: linear-gradient(transparent, #67327b);
}
#galaxy-wall-middle .rule-wrapper .holder-logo {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 80px;
  height: 41px;
  background: url("../../bundles/app/images/galaxy-wall/galaxy-wall.png") no-repeat center center / 100% auto;
  z-index: 10;
}
#galaxy-wall-middle .rule-wrapper .holder-camera {
  position: absolute;
  top: 50%;
  margin-top: -50px;
  left: 50%;
  margin-left: -45px;
  width: 90px;
  height: 100px;
  background: no-repeat center center / 100% auto;
  background-image: url("../../bundles/app/images/galaxy-wall/upload-icon.png");
  z-index: 10;
}
#galaxy-wall-middle .rule-wrapper .holder-image {
  text-align: center;
  z-index: 1;
}
#galaxy-wall-middle .rule-wrapper .holder-image img {
  max-height: 210px;
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
#galaxy-wall-middle .rule-wrapper label {
  color: #9aa4ae;
  font-size: 15px;
  margin-bottom: 5px;
}
#galaxy-wall-middle .rule-wrapper label.active,
#galaxy-wall-middle .rule-wrapper label.isTyped {
  color: #632366;
}
#galaxy-wall-middle .rule-wrapper .form-control {
  background-color: #ebebeb;
  border-color: #9aa4ae;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  box-shadow: none;
}
#galaxy-wall-middle .rule-wrapper .form-control:focus {
  background-color: #fff;
  border-color: #632366 !important;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(99, 35, 102, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(99, 35, 102, 0.6);
}
#galaxy-wall-middle .rule-wrapper .form-control.isTyped {
  border: 1px solid #632366 !important;
  background-color: white !important;
}
#galaxy-wall-middle .rule-wrapper .form-submit {
  text-align: center;
}
#galaxy-wall-middle .rule-wrapper .form-submit button {
  display: inline-block !important;
}
#galaxy-wall-middle .rule-wrapper .form-submit button:first-child {
  margin-right: 10px;
}
@media (max-width: 767px) {
  #galaxy-wall-middle .rule-wrapper .form-submit button:nth-child(2) {
    margin-top: 10px;
  }
}
#galaxy-wall-middle .banner-btn {
  position: relative;
  display: block !important;
  z-index: 101;
  margin-top: 30px;
}
@media (max-width: 767px) {
  #galaxy-wall-middle .rule-2 .banner-btn {
    margin-top: 0;
  }
}
#galaxy-wall-bottom {
  position: relative;
  width: 100%;
  background: url("../../bundles/app/images/galaxy-wall/bottom-bg.jpg") no-repeat center top / cover;
  min-height: 800px;
  padding: 100px 0 40px;
}
#galaxy-wall-bottom .title-block {
  color: #fff;
  text-align: center;
}
@media (min-width: 768px) {
  #galaxy-wall-bottom .title-block h2,
  #galaxy-wall-bottom .title-block h3 {
    font-size: 50px;
  }
  #galaxy-wall-bottom .title-block p {
    margin: 30px 0 40px;
    padding: 0 60px;
  }
}
@media (max-width: 767px) {
  #galaxy-wall-bottom .title-block h2,
  #galaxy-wall-bottom .title-block h3 {
    font-size: 40px;
  }
  #galaxy-wall-bottom .title-block p {
    margin: 20px 0 30px;
  }
}
#galaxy-wall-bottom .title-block h2,
#galaxy-wall-bottom .title-block h3 {
  text-shadow: 4px 4px 5px rgba(0, 0, 0, 0.5);
}
#galaxy-wall-bottom .title-block h2 {
  font-family: 'iCielBambola', sans-serif;
  margin-bottom: 5px;
}
#galaxy-wall-bottom .title-block h3 {
  font-family: 'Fester', sans-serif;
}
#galaxy-wall-bottom .title-block p {
  color: #fff;
  font-size: 16px;
  line-height: 24px;
}
@media (min-width: 1600px) {
  #galaxy-wall-bottom .title-block p {
    font-size: 18px;
    padding: 0 20px;
  }
}
#galaxy-wall-bottom .walls {
  margin: auto;
}
#galaxy-wall-bottom .wall-item {
  float: left;
  padding: 8px;
  cursor: pointer;
}
#galaxy-wall-bottom .wall-item .item {
  position: relative;
  overflow: hidden;
}
#galaxy-wall-bottom .wall-item .item figure img {
  width: 100%;
}
#galaxy-wall-bottom .wall-item .item:hover figure img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -o-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
}
#galaxy-wall-bottom .wall-item .item:hover .wall-caption {
  bottom: -111px;
}
#galaxy-wall-bottom .wall-item figure img {
  display: block;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
#galaxy-wall-bottom .wall-item .wall-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.3);
  padding: 15px;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
#galaxy-wall-bottom .wall-item .wall-caption h4 {
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5px;
}
#galaxy-wall-bottom .wall-item .wall-caption p {
  color: #fff;
  font-size: 15px;
  line-height: 24px;
  height: 48px;
}
.banner-btn {
  display: inline-block;
  margin-bottom: 10px;
  padding: 0 10px;
  font-family: 'Bebas', sans-serif !important;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: center;
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
  text-transform: uppercase;
  white-space: nowrap;
  vertical-align: middle;
  letter-spacing: 0.5px;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 3px solid transparent;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  border-radius: 50px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-box-shadow: -3px 3px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: -3px 3px 2px rgba(0, 0, 0, 0.2);
  box-shadow: -3px 3px 2px rgba(0, 0, 0, 0.2);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
@media (min-width: 768px) {
  .banner-btn {
    width: 250px;
    font-size: 24px;
  }
}
@media (max-width: 767px) {
  .banner-btn {
    width: 200px;
    font-size: 20px;
  }
}
.banner-btn.red {
  background-color: #d21f1a;
  border-color: #d21f1a;
  color: #fff;
}
.banner-btn.red:hover {
  background-color: #fff;
  border-color: #fff;
  color: #d21f1a;
}
.banner-btn.white {
  background-color: transparent;
  border-color: #d21f1a;
  color: #d21f1a;
}
.banner-btn.white:hover {
  border-color: #fff;
  color: #fff;
}
.banner-btn.trans {
  background-color: transparent;
  border-color: #fff;
  color: #fff;
}
.banner-btn.trans:hover {
  background-color: #d21f1a;
}
.banner-btn.black {
  width: 150px;
  background-color: transparent;
  border-color: #fff;
  color: #fff;
  padding: 0 10px 2px;
}
.banner-btn.black:hover {
  background-color: rgba(0, 0, 0, 0.7);
}
@media (min-width: 992px) {
  #viewAndShare .modal-dialog {
    width: 840px;
  }
}
#viewAndShare .modal-content {
  position: relative;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
}
#viewAndShare .modal-close {
  position: absolute;
  top: 15px;
  right: 15px;
  background-color: transparent;
  border: none;
  padding: 5px;
  z-index: 99;
}
#viewAndShare .modal-close i {
  display: block;
  width: 18px;
  height: 17px;
  background: url('../../bundles/app/images/galaxy-wall/close-icon.png');
}
@media (min-width: 992px) {
  #viewAndShare .modal-left {
    padding-right: 0;
  }
  #viewAndShare .modal-right {
    padding-left: 0;
  }
}
#viewAndShare .modal-prev,
#viewAndShare .modal-next {
  position: absolute;
  top: 50%;
  margin-top: -21px;
  width: 24px;
  height: 42px;
  background: url("../../bundles/app/images/galaxy-wall/controller-icon.png") no-repeat;
  cursor: pointer;
}
#viewAndShare .modal-prev {
  left: -40px;
  background-position: -5px -5px;
}
#viewAndShare .modal-prev:hover {
  background-position: -39px -5px;
}
#viewAndShare .modal-next {
  right: -40px;
  background-position: -73px -5px;
}
#viewAndShare .modal-next:hover {
  background-position: -107px -5px;
}
#viewAndShare .gw-image {
  position: relative;
  display: block;
}
#viewAndShare .gw-image img {
  display: block;
  width: 100%;
}
#viewAndShare .gw-border {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-transition: opacity 0.3s ease-in-out;
  -moz-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  -ms-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}
#viewAndShare .gw-border .x-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 10px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(left, #67327b, transparent);
  background-image: -moz-linear-gradient(left, #67327b, transparent);
  background-image: -o-linear-gradient(left, #67327b, transparent);
}
#viewAndShare .gw-border .y-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(#67327b, transparent);
  background-image: -moz-linear-gradient(#67327b, transparent);
  background-image: -o-linear-gradient(#67327b, transparent);
  background-image: linear-gradient(#67327b, transparent);
}
#viewAndShare .gw-border .x-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60%;
  height: 10px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(left, transparent, #67327b);
  background-image: -moz-linear-gradient(left, transparent, #67327b);
  background-image: -o-linear-gradient(left, transparent, #67327b);
}
#viewAndShare .gw-border .y-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(transparent, #67327b);
  background-image: -moz-linear-gradient(transparent, #67327b);
  background-image: -o-linear-gradient(transparent, #67327b);
  background-image: linear-gradient(transparent, #67327b);
}
#viewAndShare .gw-logo {
  position: absolute;
  top: 20px;
  left: 20px;
  background: url("../../bundles/app/images/galaxy-wall/galaxy-wall.png") no-repeat center center / 100% auto;
}
@media (min-width: 768px) {
  #viewAndShare .gw-logo {
    width: 150px;
    height: 76px;
  }
}
@media (max-width: 767px) {
  #viewAndShare .gw-logo {
    width: 120px;
    height: 61px;
  }
}
#viewAndShare .gw-caption {
  background-color: #fefefe;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#dedede));
  background-image: -webkit-linear-gradient(top, #fefefe, #dedede);
  background-image: -moz-linear-gradient(top, #fefefe, #dedede);
  background-image: -ms-linear-gradient(top, #fefefe, #dedede);
  background-image: -o-linear-gradient(top, #fefefe, #dedede);
  padding: 30px;
  cursor: default;
}
#viewAndShare .gw-caption p {
  color: #000;
  line-height: 24px;
}
#viewAndShare .gw-caption .gw-author {
  color: #000;
  margin-top: 25px;
  text-transform: uppercase;
}
#viewAndShare .box-conversation {
  display: block;
  width: 100%;
  padding: 20px 10px;
}
#viewAndShare .box-conversation .conversation-logo {
  padding: 0 0 20px;
  display: block;
  text-align: center;
  width: 100%;
  border-bottom: 1px solid #afafaf;
}
#viewAndShare .box-conversation .conversation-content {
  display: block;
  width: 100%;
  position: relative;
  padding-top: 20px;
}
.no-padding {
  padding: 0;
}
@media (min-width: 992px) {
  .large-carousel {
    display: block;
  }
  .small-carousel {
    display: none;
  }
}
@media (max-width: 991px) {
  .large-carousel {
    display: none;
  }
  .small-carousel {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .small-carousel {
    padding: 0 30px;
  }
}
@media (max-width: 767px) {
  .small-carousel {
    padding: 0 10px;
  }
}
#smart-painter-top {
  position: relative;
}
#smart-painter-top .banner-img img {
  width: 100%;
}
#smart-painter-top .banner-content {
  display: block;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 11;
}
#smart-painter-top .banner-caption {
  width: 100%;
  height: auto;
  text-align: center;
}
@media (min-width: 1600px) {
  #smart-painter-top .banner-caption {
    margin-top: 30%;
    margin-left: -130px;
  }
  #smart-painter-top .banner-caption h1 {
    font-size: 80px;
  }
  #smart-painter-top .banner-caption p {
    font-size: 16px;
    margin: 30px 0;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #smart-painter-top .banner-caption {
    margin-top: 60px;
  }
  #smart-painter-top .banner-caption h1 {
    font-size: 70px;
  }
  #smart-painter-top .banner-caption p {
    font-size: 14px;
    padding: 0 30px;
    margin: 30px 0;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #smart-painter-top .banner-caption {
    margin-top: 25px;
  }
  #smart-painter-top .banner-caption h1 {
    font-size: 50px;
  }
  #smart-painter-top .banner-caption p {
    font-size: 13px;
    padding: 0 30px;
    margin: 0 0 15px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #smart-painter-top .banner-caption {
    margin-top: 30px;
  }
  #smart-painter-top .banner-caption h1 {
    font-size: 40px;
  }
  #smart-painter-top .banner-caption p {
    font-size: 12px;
    padding: 0 10px;
    margin: 10px 0;
  }
  #smart-painter-top .banner-caption .banner-btn {
    width: 210px;
    font-size: 18px;
  }
}
@media (min-width: 768px) {
  #smart-painter-top .banner-caption {
    display: block;
  }
}
@media (max-width: 767px) {
  #smart-painter-top .banner-caption {
    margin-top: 70px;
  }
  #smart-painter-top .banner-caption h1 {
    font-size: 25px;
    margin-bottom: 5px;
  }
  #smart-painter-top .banner-caption p {
    display: none;
  }
  #smart-painter-top .banner-caption .banner-btn {
    width: 150px;
    font-size: 13px;
    margin-bottom: 5px;
  }
}
@media (max-width: 450px) {
  #smart-painter-top .banner-caption {
    margin-top: 15px;
  }
}
#smart-painter-top .banner-caption h1,
#smart-painter-top .banner-caption p {
  color: #fff;
}
#smart-painter-top .banner-caption h1 {
  font-family: 'Fester', sans-serif;
  text-transform: uppercase;
  text-shadow: -5px 3px 2px rgba(78, 58, 9, 0.4);
}
#smart-painter-top .banner-caption p {
  font-weight: 600;
}
.green-wall {
  background-color: #e7e8b2;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#e7e8b2), to(#a8cd5e));
  background-image: -webkit-linear-gradient(top, #e7e8b2, #a8cd5e);
  background-image: -moz-linear-gradient(top, #e7e8b2, #a8cd5e);
  background-image: -ms-linear-gradient(top, #e7e8b2, #a8cd5e);
  background-image: -o-linear-gradient(top, #e7e8b2, #a8cd5e);
}
#smart-painter-middle {
  position: relative;
  padding: 0 0 150px;
}
@media (min-width: 768px) {
  #smart-painter-middle {
    padding: 0 0 150px;
  }
}
@media (min-width: 451px) and (max-width: 767px) {
  #smart-painter-middle {
    padding: 0 0 80px;
  }
}
@media (max-width: 450px) {
  #smart-painter-middle {
    padding: 0 0 50px;
  }
}
@media (max-width: 767px) {
  #smart-painter-middle .col-xs-12 {
    padding: 0;
  }
}
#smart-painter-middle .carousel-container {
  position: relative;
}
#smart-painter-middle #game-carousel {
  position: relative;
  margin: 0 auto;
}
@media (min-width: 1600px) {
  #smart-painter-middle #game-carousel {
    width: 1100px;
    height: 660px;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #smart-painter-middle #game-carousel {
    width: 960px;
    height: 660px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #smart-painter-middle #game-carousel {
    width: 840px;
    height: 570px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #smart-painter-middle #game-carousel {
    width: 600px;
    height: 540px;
  }
}
@media (max-width: 767px) {
  #smart-painter-middle #game-carousel {
    width: 320px;
    height: 470px;
  }
}
#smart-painter-middle .carousel-image {
  border: 0;
  display: block;
}
#smart-painter-middle .game-feature {
  display: block;
  position: relative;
  margin: 0 auto;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
@media (min-width: 768px) {
  #smart-painter-middle .game-feature {
    width: 90%;
  }
}
@media (max-width: 767px) {
  #smart-painter-middle .game-feature {
    width: 80%;
  }
}
#smart-painter-middle .carousel-feature {
  position: absolute;
  top: -1000px;
  left: -1000px;
  cursor: pointer;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
#smart-painter-middle .carousel-caption {
  position: absolute;
  background-color: rgba(0, 0, 0, 0.4);
  padding: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}
#smart-painter-middle .carousel-caption > div {
  width: 100%;
  text-align: center;
}
@media (min-width: 768px) {
  #smart-painter-middle .carousel-caption {
    top: 40px;
    left: 40px;
    right: 40px;
    bottom: 40px;
  }
}
@media (max-width: 767px) {
  #smart-painter-middle .carousel-caption {
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
  }
}
#smart-painter-middle .carousel-ctrl {
  display: block;
  z-index: 1000;
  background: no-repeat center center / 100% auto;
  position: absolute;
  top: 50%;
  cursor: pointer;
}
@media (min-width: 768px) {
  #smart-painter-middle .carousel-ctrl {
    width: 31px;
    height: 54px;
    margin-top: -27px;
  }
}
@media (max-width: 767px) {
  #smart-painter-middle .carousel-ctrl {
    width: 24px;
    height: 42px;
    margin-top: -21px;
  }
}
#smart-painter-middle #carousel-left {
  background-image: url("../../bundles/app/images/smart-painter/prev-icon.png");
  left: 0;
}
@media (min-width: 1600px) {
  #smart-painter-middle #carousel-left {
    left: -20px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #smart-painter-middle #carousel-left {
    left: -35px;
  }
}
@media (min-width: 500px) and (max-width: 767px) {
  #smart-painter-middle #carousel-left {
    left: 50px;
  }
}
#smart-painter-middle #carousel-right {
  background-image: url("../../bundles/app/images/smart-painter/next-icon.png");
  right: 0;
}
@media (min-width: 1600px) {
  #smart-painter-middle #carousel-right {
    right: -20px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #smart-painter-middle #carousel-right {
    right: -35px;
  }
}
@media (min-width: 500px) and (max-width: 767px) {
  #smart-painter-middle #carousel-right {
    right: 50px;
  }
}
#smart-painter-middle #game-slider .owl-stage-outer {
  padding: 15px 0;
}
@media (min-width: 1600px) {
  #smart-painter-middle .game-week,
  #smart-painter-middle .game-name {
    font-size: 48px;
  }
  #smart-painter-middle .game-statistic .number p {
    font-size: 65px;
    line-height: 65px;
  }
  #smart-painter-middle .game-statistic .text p {
    font-size: 28px;
    line-height: 32px;
  }
  #smart-painter-middle .game-info .player h4 {
    font-size: 25px;
  }
  #smart-painter-middle .game-info .player p {
    font-size: 20px;
  }
  #smart-painter-middle .game-desc {
    font-size: 15px;
  }
  #smart-painter-middle .game-opening {
    font-size: 18px;
  }
  #smart-painter-middle .banner-btn.black {
    font-size: 24px;
  }
}
@media (min-width: 1200px) and (max-width: 1599px) {
  #smart-painter-middle .game-week,
  #smart-painter-middle .game-name {
    font-size: 40px;
  }
  #smart-painter-middle .game-statistic .number p {
    font-size: 55px;
    line-height: 55px;
  }
  #smart-painter-middle .game-statistic .text p {
    font-size: 20px;
  }
  #smart-painter-middle .game-info .player h4 {
    font-size: 20px;
  }
  #smart-painter-middle .game-info .player p {
    font-size: 14px;
  }
  #smart-painter-middle .game-desc {
    font-size: 15px;
  }
  #smart-painter-middle .game-opening {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  #smart-painter-middle .game-week,
  #smart-painter-middle .game-name {
    font-size: 34px;
  }
  #smart-painter-middle .game-statistic .number p {
    font-size: 40px;
    line-height: 40px;
  }
  #smart-painter-middle .game-statistic .text p {
    font-size: 18px;
  }
  #smart-painter-middle .game-info .player h4 {
    font-size: 18px;
  }
  #smart-painter-middle .game-info .player p {
    font-size: 14px;
  }
  #smart-painter-middle .game-desc {
    font-size: 14px;
  }
  #smart-painter-middle .game-opening {
    font-size: 16px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #smart-painter-middle .game-week,
  #smart-painter-middle .game-name {
    font-size: 30px;
  }
  #smart-painter-middle .game-statistic .number p {
    font-size: 40px;
    line-height: 40px;
  }
  #smart-painter-middle .game-statistic .text p {
    font-size: 16px;
  }
  #smart-painter-middle .game-info .player h4 {
    font-size: 18px;
  }
  #smart-painter-middle .game-info .player p {
    font-size: 14px;
  }
  #smart-painter-middle .game-desc {
    font-size: 13px;
  }
  #smart-painter-middle .game-opening {
    font-size: 15px;
  }
  #smart-painter-middle .crown-icon > i {
    width: 52px !important;
    height: 30px !important;
  }
}
@media (max-width: 767px) {
  #smart-painter-middle .game-week,
  #smart-painter-middle .game-name {
    font-size: 26px;
  }
  #smart-painter-middle .game-statistic .number p {
    font-size: 40px;
    line-height: 40px;
  }
  #smart-painter-middle .game-statistic .text p {
    font-size: 16px;
  }
  #smart-painter-middle .game-info .player h4 {
    font-size: 16px;
  }
  #smart-painter-middle .game-info .player p {
    font-size: 13px;
  }
  #smart-painter-middle .game-desc {
    font-size: 13px;
  }
  #smart-painter-middle .game-opening {
    font-size: 13px;
  }
  #smart-painter-middle .banner-btn.black {
    width: 120px;
  }
  #smart-painter-middle .crown-icon > i {
    width: 40px !important;
    height: 24px !important;
  }
}
#smart-painter-middle .game-week {
  color: #fff;
  font-family: 'iCielBambola', sans-serif;
}
#smart-painter-middle .game-name {
  color: #fff;
  font-family: 'Fester', sans-serif;
  white-space: nowrap;
}
#smart-painter-middle .title-divider {
  width: 80%;
  border-top: 1px solid #fff;
  margin: 8% auto 10%;
}
#smart-painter-middle .game-statistic {
  display: table;
  margin: 0 auto;
  border: 1px solid #fff;
  padding: 0 10px;
  text-align: left;
}
#smart-painter-middle .game-statistic .number,
#smart-painter-middle .game-statistic .text {
  display: table-cell;
  vertical-align: middle;
}
#smart-painter-middle .game-statistic .number {
  min-width: 50%;
  text-align: right;
  padding: 10px 5px 0 0;
}
#smart-painter-middle .game-statistic .number p {
  color: #fff;
  font-family: 'Fester', sans-serif;
}
#smart-painter-middle .game-statistic .text p {
  color: #fff;
  font-weight: 600;
  white-space: nowrap;
}
#smart-painter-middle .game-info {
  display: table;
  margin: 15% auto;
}
#smart-painter-middle .game-info .crown-icon,
#smart-painter-middle .game-info .player {
  display: table-cell;
  vertical-align: middle;
}
#smart-painter-middle .game-info .crown-icon > i {
  display: inline-block;
  width: 70px;
  height: 41px;
  background: url("../../bundles/app/images/smart-painter/crown.png") no-repeat center center / 100% auto;
}
#smart-painter-middle .game-info .player {
  text-align: left;
  padding-left: 10px;
}
#smart-painter-middle .game-info .player h4,
#smart-painter-middle .game-info .player p {
  color: #fff;
  white-space: nowrap;
}
#smart-painter-middle .game-info .player h4 {
  font-weight: bold;
}
#smart-painter-middle .game-info .player p {
  font-weight: 600;
}
#smart-painter-middle .game-desc {
  color: #fff;
  font-weight: 600;
  width: 80%;
  margin: 0 auto;
}
#smart-painter-middle .lock-icon {
  display: block;
  width: 23px;
  height: 29px;
  background: url("../../bundles/app/images/smart-painter/lock.png") no-repeat center center;
}
@media (min-width: 992px) {
  #smart-painter-middle .lock-icon {
    margin: 25% auto 10%;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  #smart-painter-middle .lock-icon {
    margin: 18% auto 10%;
  }
}
@media (max-width: 767px) {
  #smart-painter-middle .lock-icon {
    margin: 15% auto 5%;
  }
}
#smart-painter-middle .game-opening {
  display: inline-block;
  color: #fff;
  font-weight: bold;
  border: 1px solid #fff;
  padding: 5px 10px;
  text-transform: uppercase;
  white-space: nowrap;
}
#smart-painter-middle .carousel-inactive img {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
}
#smart-painter-bottom {
  position: relative;
}
#smart-painter-bottom .banner-img img {
  width: 100%;
}
#smart-painter-bottom .floor {
  position: relative;
}
@media (max-width: 767px) {
  #smart-painter-bottom .floor {
    height: 150px;
  }
}
#smart-painter-bottom .paint-tool {
  position: absolute;
  bottom: 70px;
  left: 0;
  right: 0;
}
#viewRules .rule-wrapper {
  position: relative;
  min-height: 500px;
  height: auto;
  background: no-repeat center / 100% 100%;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  cursor: default;
}
@media (min-width: 768px) {
  #viewRules .rule-wrapper {
    max-width: 950px;
    width: 100%;
    background-image: url("../../bundles/app/images/smart-painter/paint-wrapper.png");
    padding: 50px 100px;
  }
}
@media (max-width: 767px) {
  #viewRules .rule-wrapper {
    background-image: url("../../bundles/app/images/galaxy-wall/rule-wrapper-mobile.png");
    padding: 50px 30px;
  }
}
#viewRules .scroll-block {
  width: 620px;
  height: 340px;
  position: relative;
  display: block;
  z-index: 101;
}
#viewRules .title-block {
  font-family: 'Fester', sans-serif;
  text-transform: uppercase;
  color: #632366;
  line-height: 40px;
  text-align: center;
  margin-bottom: 25px;
}
@media (min-width: 1600px) {
  #viewRules .title-block {
    font-size: 30px;
  }
}
@media (max-width: 1599px) {
  #viewRules .title-block {
    font-size: 25px;
  }
}
@media (max-width: 767px) {
  #viewRules .title-block {
    margin-bottom: 15px;
  }
}
#viewRules p {
  color: #808d9b;
  font-size: 15px;
  line-height: 24px;
}
#viewRules .btn-close {
  display: block;
  margin: 40px auto 0;
}
@media (min-width: 768px) {
  #viewRules .btn-close {
    margin: 40px auto 0;
  }
}
@media (max-width: 767px) {
  #viewRules .btn-close {
    margin: 20px auto 0;
  }
}
#playNow .game-wrapper {
  position: relative;
  min-height: 580px;
  height: auto;
  background: #ffffff url("../../bundles/app/images/smart-painter/popup-bg.jpg") no-repeat center bottom / 100% auto;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  cursor: default;
  padding: 30px;
}
@media (min-width: 768px) {
  #playNow .game-wrapper {
    max-width: 450px;
    width: 100%;
  }
}
#playNow .modal-close {
  position: absolute;
  top: 15px;
  right: 15px;
  background-color: transparent;
  border: none;
  padding: 5px;
  z-index: 99;
}
#playNow .modal-close i {
  display: block;
  width: 18px;
  height: 17px;
  background: url('../../bundles/app/images/galaxy-wall/close-icon.png');
}
#playNow .dialog-content {
  position: relative;
  z-index: 10;
}
#playNow .dialog-border {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  -webkit-transition: opacity 0.3s ease-in-out;
  -moz-transition: opacity 0.3s ease-in-out;
  -o-transition: opacity 0.3s ease-in-out;
  -ms-transition: opacity 0.3s ease-in-out;
  transition: opacity 0.3s ease-in-out;
}
#playNow .dialog-border .x-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 10px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(left, #67327b, transparent);
  background-image: -moz-linear-gradient(left, #67327b, transparent);
  background-image: -o-linear-gradient(left, #67327b, transparent);
}
#playNow .dialog-border .y-top-left {
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#67327b), to(transparent));
  background-image: -webkit-linear-gradient(#67327b, transparent);
  background-image: -moz-linear-gradient(#67327b, transparent);
  background-image: -o-linear-gradient(#67327b, transparent);
  background-image: linear-gradient(#67327b, transparent);
}
#playNow .dialog-border .x-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 60%;
  height: 10px;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 100% 0, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(left, transparent, #67327b);
  background-image: -moz-linear-gradient(left, transparent, #67327b);
  background-image: -o-linear-gradient(left, transparent, #67327b);
}
#playNow .dialog-border .y-bottom-right {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: 60%;
  z-index: 100;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), to(#67327b));
  background-image: -webkit-linear-gradient(transparent, #67327b);
  background-image: -moz-linear-gradient(transparent, #67327b);
  background-image: -o-linear-gradient(transparent, #67327b);
  background-image: linear-gradient(transparent, #67327b);
}
@media (min-width: 768px) {
  #playNow .game-step {
    padding: 60px 20px;
  }
}
@media (max-width: 767px) {
  #playNow .game-step {
    padding: 30px 0 0;
  }
}
#playNow .dialog-title {
  position: relative;
  text-align: center;
  padding-bottom: 20px;
}
#playNow .dialog-title:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  border-bottom: 1px solid #632366;
}
#playNow .dialog-title h2 {
  color: #632366;
  font-family: 'Fester', sans-serif;
  font-size: 36px;
}
@media (min-width: 768px) {
  #playNow .dialog-title h2 {
    font-size: 36px;
  }
}
@media (max-width: 767px) {
  #playNow .dialog-title h2 {
    font-size: 32px;
  }
}
#playNow .game-step {
  position: relative;
}
#playNow .step-2,
#playNow .step-3 {
  display: none;
}
@media (min-width: 768px) {
  #playNow .dialog-form {
    padding: 30px;
  }
}
@media (max-width: 767px) {
  #playNow .dialog-form {
    padding: 30px 0;
  }
}
#playNow .step-1 .form-group {
  text-align: center;
}
#playNow .step-1 label {
  color: #9aa4ae;
  font-size: 15px;
  margin-bottom: 5px;
}
#playNow .step-1 label.active,
#playNow .step-1 label.isTyped {
  color: #632366;
}
#playNow .form-control {
  background-color: #ebebeb;
  border-color: #9aa4ae;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  box-shadow: none;
}
#playNow .form-control:focus {
  background-color: #fff;
  border-color: #632366 !important;
}
#playNow .form-control.isTyped {
  border: 1px solid #632366 !important;
  background-color: white !important;
}
#playNow .banner-btn {
  display: block;
  width: 200px;
  margin: 30px auto 0;
}
#playNow .question-number {
  margin: 20px 0;
}
#playNow .question-number ul {
  text-align: center;
}
#playNow .question-number ul > li {
  display: inline-block;
  margin: 5px;
}
#playNow .question-number ul > li > a {
  display: inline-block;
  width: 35px;
  height: 35px;
  background-color: #808d9b;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding-box;
  background-clip: padding-box;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  line-height: 35px;
  text-align: center;
}
#playNow .question-number ul > li.active > a {
  background-color: #632366;
}
#playNow .step-2 input[type="radio"] {
  margin: 0 10px 0 0;
  vertical-align: middle;
}
#playNow .question-content,
#playNow .question-form label {
  color: #808d9b;
  font-size: 15px;
  font-weight: 600;
}
#playNow .question-content {
  text-align: center;
  margin-bottom: 20px;
}
#playNow .form-message {
  margin-top: 25%;
  text-align: center;
}
#playNow .form-message h3 {
  color: #632366;
  font-family: 'Fester', sans-serif;
  margin: 25px 0 10px;
}
@media (min-width: 768px) {
  #playNow .form-message h3 {
    font-size: 36px;
  }
}
@media (max-width: 767px) {
  #playNow .form-message h3 {
    font-size: 30px;
  }
}
#playNow .form-message p {
  color: #632366;
  font-size: 16px;
  padding: 0 20px;
}