@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Montserrat:200,300,400,500,600,700,800,900|Open+Sans:300,400,600,700,800");
a, abbr, acronym, address, article, aside, audio, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike tt, summary, table, tbody, td, tfoot, th, thead, time, tr, ul, var, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

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

ol, ul { list-style: none; }

blockquote, q { quotes: none; }
blockquote:after, blockquote:before, q:after, q:before { content: ""; }

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

/*Reset css end */
:root { font-size: 16px; }

/*Global Css starts */
a { color: #000; text-decoration: none; outline: none; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

body { line-height: 1; position: relative; }

*, *:after, *:before { -webkit-box-sizing: border-box; -o-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-word-break: keep-all; -o-word-break: keep-all; -moz-word-break: keep-all; -ms-word-break: keep-all; word-break: keep-all; }

img { max-width: 100%; vertical-align: middle; }

.container { margin: 0 auto; width: 96%; max-width: 1200px; }

.fl { float: left; }

.fr { float: right; }

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

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

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

p { font: 300 0.66667 "Open Sans", sans-serif; padding-bottom: 12px; }

.clear20, .clear40, .clear60, .clear { clear: both; }

.clear20 { height: 20px; }

.clear40 { height: 40px; }

.clear60 { height: 60px; }

.desktop-only { display: block; }

.mobile-only, .tab-mobile-only, .tab-only { display: none; }

/*Global Css End */
:root { font-size: 16px; }
@media (max-height: 600px) { :root { font-size: 14px; } }

a { color: rgba(0, 0, 0, 0.5); text-decoration: none; outline: none; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

body { line-height: 1; font: 1rem "Montserrat", sans-serif; position: relative; background: #fff; }
body.product-listing-page { background-color: #f5f5f5; }
body.product-details-page { background-color: #f5f5f5; }

*, *:after, *:before { -webkit-box-sizing: border-box; -o-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-word-break: keep-all; -o-word-break: keep-all; -moz-word-break: keep-all; -ms-word-break: keep-all; word-break: keep-all; }

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

h1, h2, h3, h4, h5, h6 { padding-bottom: 0.625em; font-family: "Montserrat", sans-serif; }

h1 { font-size: 1.875em; }
h1 span { font-weight: 800; }

p { font: 300 14px "Montserrat", sans-serif; padding-bottom: 12px; }

em { font-style: italic; }

strong { font-weight: bold; }

hr { border: 1px solid #ddd; clear: both; margin: 10px 0 30px; height: 0; }

@media (max-width: 767px) { .grid-layout { margin: 0 -1%; }
  .grid-layout:after { clear: both; content: ""; display: block; }
  .grid-xs, .grid-xs-1, .grid-xs-2, .grid-xs-3, .grid-xs-4, .grid-xs-5, .grid-xs-6, .grid-xs-7, .grid-xs-8, .grid-xs-9, .grid-xs-10, .grid-xs-11, .grid-xs-12 { float: left; padding: 0 1%; }
  .grid-xs-1 { width: 8.33333%; }
  .grid-xs-2 { width: 16.66667%; }
  .grid-xs-3 { width: 25%; }
  .grid-xs-4 { width: 33.33333%; }
  .grid-xs-5 { width: 41.66667%; }
  .grid-xs-6 { width: 50%; }
  .grid-xs-7 { width: 58.33333%; }
  .grid-xs-8 { width: 66.66667%; }
  .grid-xs-9 { width: 75%; }
  .grid-xs-10 { width: 83.33333%; }
  .grid-xs-11 { width: 91.66667%; }
  .grid-xs-12 { width: 100%; } }
@media (min-width: 768px) and (max-width: 1024px) { .grid-layout { margin: 0 -1%; }
  .grid-layout:after { clear: both; content: ""; display: block; }
  .grid-md, .grid-md-1, .grid-md-2, .grid-md-3, .grid-md-4, .grid-md-5, .grid-md-6, .grid-md-7, .grid-md-8, .grid-md-9, .grid-md-10, .grid-md-11, .grid-md-12 { float: left; padding: 0 1%; }
  .grid-md-1 { width: 8.33333%; }
  .grid-md-2 { width: 16.66667%; }
  .grid-md-3 { width: 25%; }
  .grid-md-4 { width: 33.33333%; }
  .grid-md-5 { width: 41.66667%; }
  .grid-md-6 { width: 50%; }
  .grid-md-7 { width: 58.33333%; }
  .grid-md-8 { width: 66.66667%; }
  .grid-md-9 { width: 75%; }
  .grid-md-10 { width: 83.33333%; }
  .grid-md-11 { width: 91.66667%; }
  .grid-md-12 { width: 100%; } }
@media (min-width: 1025px) and (max-width: 1366px) { .grid-layout { margin: 0 -1%; }
  .grid-layout:after { clear: both; content: ""; display: block; }
  .grid-lg, .grid-lg-1, .grid-lg-2, .grid-lg-3, .grid-lg-4, .grid-lg-5, .grid-lg-6, .grid-lg-7, .grid-lg-8, .grid-lg-9, .grid-lg-10, .grid-lg-11, .grid-lg-12 { float: left; padding: 0 1%; }
  .grid-lg-1 { width: 8.33333%; }
  .grid-lg-2 { width: 16.66667%; }
  .grid-lg-3 { width: 25%; }
  .grid-lg-4 { width: 33.33333%; }
  .grid-lg-5 { width: 41.66667%; }
  .grid-lg-6 { width: 50%; }
  .grid-lg-7 { width: 58.33333%; }
  .grid-lg-8 { width: 66.66667%; }
  .grid-lg-9 { width: 75%; }
  .grid-lg-10 { width: 83.33333%; }
  .grid-lg-11 { width: 91.66667%; }
  .grid-lg-12 { width: 100%; } }
@media (min-width: 1367px) { .grid-layout { margin: 0 -1%; }
  .grid-layout:after { clear: both; content: ""; display: block; }
  .grid-xl, .grid-xl-1, .grid-xl-2, .grid-xl-3, .grid-xl-4, .grid-xl-5, .grid-xl-6, .grid-xl-7, .grid-xl-8, .grid-xl-9, .grid-xl-10, .grid-xl-11, .grid-xl-12 { float: left; padding: 0 1%; }
  .grid-xl-1 { width: 8.33333%; }
  .grid-xl-2 { width: 16.66667%; }
  .grid-xl-3 { width: 25%; }
  .grid-xl-4 { width: 33.33333%; }
  .grid-xl-5 { width: 41.66667%; }
  .grid-xl-6 { width: 50%; }
  .grid-xl-7 { width: 58.33333%; }
  .grid-xl-8 { width: 66.66667%; }
  .grid-xl-9 { width: 75%; }
  .grid-xl-10 { width: 83.33333%; }
  .grid-xl-11 { width: 91.66667%; }
  .grid-xl-12 { width: 100%; } }
@-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes spin { 0% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } }
.loader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100003; background-color: #000; }
.loader div { display: block; position: relative; left: 50%; top: 50%; width: 150px; height: 150px; margin: -75px 0 0 -75px; border-radius: 50%; border: 3px solid transparent; border-top-color: white; -webkit-animation: spin 2s linear infinite; -o-animation: spin 2s linear infinite; -moz-animation: spin 2s linear infinite; -ms-animation: spin 2s linear infinite; animation: spin 2s linear infinite; z-index: 1001; }
.loader div:before { content: ""; position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border-radius: 50%; border: 3px solid transparent; border-top-color: #aaaaaa; -webkit-animation: spin 2s linear infinite; -o-animation: spin 2s linear infinite; -moz-animation: spin 2s linear infinite; -ms-animation: spin 2s linear infinite; animation: spin 2s linear infinite; }
.loader div:after { content: ""; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; border-radius: 50%; border: 3px solid transparent; border-top-color: #555555; -webkit-animation: spin 1s linear infinite; -o-animation: spin 1s linear infinite; -moz-animation: spin 1s linear infinite; -ms-animation: spin 1s linear infinite; animation: spin 1s linear infinite; }

.header { text-align: center; -webkit-box-shadow: 0 0 10px rgba(100, 196, 225, 0.5); -o-box-shadow: 0 0 10px rgba(100, 196, 225, 0.5); -moz-box-shadow: 0 0 10px rgba(100, 196, 225, 0.5); -ms-box-shadow: 0 0 10px rgba(100, 196, 225, 0.5); box-shadow: 0 0 10px rgba(100, 196, 225, 0.5); }
.header::after { clear: both; content: ""; display: table; }
.header .logo { display: inline-block; max-width: 6.25em; padding: 0.3125em 0; }

.footer .copywrite { background-color: #474747; color: #fff; text-align: center; padding: 10px 0; font-size: 12px; font-weight: 300; letter-spacing: 1px; }

/*form tag */
input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], input:not([type]), textarea, select, textarea { width: 100%; padding: 0.625em; border: 1px solid #39b4d9; margin: 0; outline: none; -webkit-transition: all 0.15s ease-out 0s; -moz-transition: all 0.15s ease-out 0s; transition: all 0.15s ease-out 0s; font-size: 1em; -webkit-box-shadow: none; -o-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; box-shadow: none; }
input[type="color"]:active, input[type="color"]:focus, input[type="date"]:active, input[type="date"]:focus, input[type="datetime"]:active, input[type="datetime"]:focus, input[type="datetime-local"]:active, input[type="datetime-local"]:focus, input[type="email"]:active, input[type="email"]:focus, input[type="month"]:active, input[type="month"]:focus, input[type="number"]:active, input[type="number"]:focus, input[type="password"]:active, input[type="password"]:focus, input[type="search"]:active, input[type="search"]:focus, input[type="tel"]:active, input[type="tel"]:focus, input[type="text"]:active, input[type="text"]:focus, input[type="time"]:active, input[type="time"]:focus, input[type="url"]:active, input[type="url"]:focus, input[type="week"]:active, input[type="week"]:focus, input:not([type]):active, input:not([type]):focus, textarea:active, textarea:focus, select:active, select:focus, textarea:active, textarea:focus { outline: none; }

select { background: none; padding: 0.5625em 0.625em; cursor: pointer; }

textarea { height: 200px; max-width: 100%; height: 120px; }

input[type="checkbox"], input[type="radio"] { display: inline-block; vertical-align: middle; margin: 0 5px 0 0; }

/*Form Tag end */
/*Common Buttons */
a.box-btn, button.box-btn, input[type="button"].box-btn, input[type="reset"].box-btn, input[type="submit"].box-btn { background-color: transparent; border: none; padding: 0; cursor: pointer; -webkit-box-shadow: none; -o-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; box-shadow: none; display: inline-block; margin-right: 0.625em; cursor: pointer; padding: 0.75em 1.25em; background-color: #64c4e1; color: #fff; letter-spacing: 2px; vertical-align: middle; text-decoration: none; text-align: center; -webkit-transition: all 0.15s ease-out 0s; -moz-transition: all 0.15s ease-out 0s; transition: all 0.15s ease-out 0s; text-transform: uppercase; font-size: 1.25em; -webkit-appearance: none; -o-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; }
a.box-btn.active, a.box-btn:hover, button.box-btn.active, button.box-btn:hover, input[type="button"].box-btn.active, input[type="button"].box-btn:hover, input[type="reset"].box-btn.active, input[type="reset"].box-btn:hover, input[type="submit"].box-btn.active, input[type="submit"].box-btn:hover { background-color: #39b4d9; }
a.box-btn:last-child, button.box-btn:last-child, input[type="button"].box-btn:last-child, input[type="reset"].box-btn:last-child, input[type="submit"].box-btn:last-child { margin: 0; }
a.full-btn, button.full-btn, input[type="button"].full-btn, input[type="reset"].full-btn, input[type="submit"].full-btn { display: block; width: 100%; margin: 0; }
a.btn-success, button.btn-success, input[type="button"].btn-success, input[type="reset"].btn-success, input[type="submit"].btn-success { background-color: #4caf50; }
a.btn-danger, button.btn-danger, input[type="button"].btn-danger, input[type="reset"].btn-danger, input[type="submit"].btn-danger { background-color: #F44336; }
a.btn-alert, button.btn-alert, input[type="button"].btn-alert, input[type="reset"].btn-alert, input[type="submit"].btn-alert { background-color: #d6c105; }
a.md, button.md, input[type="button"].md, input[type="reset"].md, input[type="submit"].md { font-size: 0.875em; }
a.sm, button.sm, input[type="button"].sm, input[type="reset"].sm, input[type="submit"].sm { font-size: 0.75em; }
a.rounded, button.rounded, input[type="button"].rounded, input[type="reset"].rounded, input[type="submit"].rounded { border-radius: 3.125em; }
a.secondary-btn, button.secondary-btn, input[type="button"].secondary-btn, input[type="reset"].secondary-btn, input[type="submit"].secondary-btn { background-color: #cfedf6; color: #2087a5; }
a.secondary-btn.active, a.secondary-btn:hover, button.secondary-btn.active, button.secondary-btn:hover, input[type="button"].secondary-btn.active, input[type="button"].secondary-btn:hover, input[type="reset"].secondary-btn.active, input[type="reset"].secondary-btn:hover, input[type="submit"].secondary-btn.active, input[type="submit"].secondary-btn:hover { background-color: #8fd4e9; }
a:active, a:focus, button:active, button:focus, input[type="button"]:active, input[type="button"]:focus, input[type="reset"]:active, input[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:focus { outline: none; }

/*hack for mozzila */
@-moz-document url-prefix() { a.box-btn { padding-top: 0.8125em; padding-bottom: 0.8125em; } }
/*hack for mozzila end */
.input-type-select { overflow: hidden; position: relative; }
.input-type-select:before, .input-type-select:after { content: ""; pointer-events: none; }
.input-type-select:before { content: ""; position: absolute; right: 0; top: 0; background-color: #39b4d9; width: 2.5em; height: 100%; }
.input-type-select:after { height: 0; width: 0; border-left: 0.375em solid transparent; border-right: 0.375em solid transparent; border-top: 0.375em solid #145265; content: ""; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); right: 0.875em; }

span.has-error, span.error, label.has-error, label.error { color: #f00; display: inline-block; font-size: 0.875em; position: relative; margin-left: 0.1875em; }

.checkbox { display: inline-block; vertical-align: middle; margin-right: 0.3125em; }
.checkbox:last-child { margin: 0; }
.checkbox input[type="checkbox"] { position: absolute; left: 0; top: 0; opacity: 0; visibility: hidden; }
.checkbox input[type="checkbox"]:checked + label:before { background-color: #39b4d9; }
.checkbox input[type="checkbox"]:checked + label:after { display: block; }
.checkbox label { display: inline-block; position: relative; font-size: 1.125em; padding-left: 1.25em; cursor: pointer; }
.checkbox label:before { border-radius: 3px; margin-right: 0.3125em; vertical-align: middle; border: 1px solid #39b4d9; left: 0; }
.checkbox label:before, .checkbox label:after { content: ""; display: inline-block; height: 0.9375em; width: 0.9375em; position: absolute; top: 10px; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.checkbox label:after { font-family: "FontAwesome"; content: ""; color: #fff; left: 0.25em; font-size: 0.625em; display: none; }

.radio { display: inline-block; vertical-align: middle; margin-right: 0.3125em; }
.radio:last-child { margin: 0; }
.radio input[type="radio"] { position: absolute; left: 0; top: 0; opacity: 0; visibility: hidden; }
.radio input[type="radio"]:checked + label:after { background-color: #39b4d9; display: block; }
.radio label { display: inline-block; position: relative; font-size: 1.125em; padding-left: 1.25em; cursor: pointer; }
.radio label:before { border-radius: 3px; margin-right: 0.3125em; vertical-align: middle; border: 1px solid #39b4d9; left: 0; height: 0.9375em; width: 0.9375em; }
.radio label:before, .radio label:after { content: ""; display: inline-block; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border-radius: 50%; }
.radio label:after { left: 0.25em; font-size: 0.625em; display: none; height: 1em; width: 1em; }

.form-layout { font-size: 14px; }
.form-layout .form-row.col-2 { margin: 0 -1%; }
.form-layout .form-row.col-2::after { clear: both; content: ""; display: table; }
.form-layout .form-row.col-2 > label { position: relative; font-size: 1.125em; display: block; padding: 0 1% 10px; }
.form-layout .form-row.col-2 .form-field { padding-left: 1%; padding-right: 1%; float: left; width: 50%; }
.form-layout .form-field { padding-bottom: 1.875em; }
.form-layout .form-field > label { padding-bottom: 0.3125em; display: block; font-size: 1.25em; }

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

.kbw-signature { width: 100%; height: 150px; }

.kbw-signature { display: inline-block; border: 1px solid rgba(160, 160, 160, 0.5); -ms-touch-action: none; }

.ajax-search { height: 200px; position: relative; }
.ajax-search.section-feed { background-color: #fff; border-radius: 7px; margin-bottom: 10px; }
.ajax-search .message { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.ajax-search .message p { font: 16px "Montserrat", sans-serif; letter-spacing: 2px; }

.ajax-loader { width: 100px; height: 10px; margin: auto; position: relative; }
.ajax-loader:before { content: ""; position: absolute; left: 0; top: 0; height: 10px; width: 10px; background-color: #2dc1d8; box-shadow: 20px 0 0 #58cee0, 40px 0 0 #83dae8, 60px 0 0 #aee7f0, 80px 0 0 #d9f4f8; animation: loader 0.5s infinite; }

@keyframes loader { 20% { background-color: #d9f4f8; box-shadow: 20px 0 0 #2dc1d8, 40px 0 0 #58cee0, 60px 0 0 #83dae8, 80px 0 0 #aee7f0; }
  40% { background-color: #aee7f0; box-shadow: 20px 0 0 #d9f4f8, 40px 0 0 #2dc1d8, 60px 0 0 #58cee0, 80px 0 0 #83dae8; }
  60% { background-color: #83dae8; box-shadow: 20px 0 0 #aee7f0, 40px 0 0 #d9f4f8, 60px 0 0 #2dc1d8, 80px 0 0 #58cee0; }
  80% { background-color: #58cee0; box-shadow: 20px 0 0 #83dae8, 40px 0 0 #aee7f0, 60px 0 0 #d9f4f8, 80px 0 0 #2dc1d8; } }
.messages { margin: auto; max-width: 800px; position: fixed; left: 50%; top: -180px; width: 96%; z-index: 100; -webkit-transform: translateX(-50%); -o-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1); -moz-transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1); transition: all 0.5s cubic-bezier(0.075, 0.82, 0.165, 1); }
.messages.show { top: 20px; }
.messages .msg { padding: 0.625em 0.625em 0.625em 5em; border-right: 3px solid #000; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); -o-box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); -ms-box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); position: relative; margin-bottom: 20px; background-color: #fff; }
.messages .msg:after { clear: both; content: ""; display: block; }
.messages .msg h5 { font: 600 1.25em "Montserrat", sans-serif; letter-spacing: 1px; padding-bottom: 0; }
.messages .msg p { padding: 0; font: 400 1em "Montserrat", sans-serif; color: rgba(68, 68, 68, 0.8); }
.messages .msg .icon { position: absolute; left: 0; top: 0; height: 100%; width: 4.375em; }
.messages .msg .icon .fa { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-size: 2.5em; color: #fff; }
.messages .msg .is-close { position: absolute; right: 0.625em; top: 0.625em; height: 20px; width: 20px; cursor: pointer; font-size: 1.125em; }
.messages .msg .close { float: right; width: 10%; }
.messages .msg.info { border-color: #23B8B0; }
.messages .msg.info h5 { color: #23B8B0; }
.messages .msg.info .icon { background-color: #23B8B0; }
.messages .msg.error { border-color: #D82B2B; }
.messages .msg.error h5 { color: #D82B2B; }
.messages .msg.error .icon { background-color: #D82B2B; }
.messages .msg.confirm { border-color: #72B55F; }
.messages .msg.confirm h5 { color: #72B55F; }
.messages .msg.confirm .icon { background-color: #72B55F; }
.messages .msg.warning { border-color: #F58229; }
.messages .msg.warning h5 { color: #F58229; }
.messages .msg.warning .icon { background-color: #F58229; }

@keyframes fade-in { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes fade { 10% { transform: scale(1, 1); }
  35% { transform: scale(1, 1.7); }
  40% { transform: scale(1, 1.7); }
  50% { opacity: 1; }
  60% { transform: scale(1, 1); }
  100% { transform: scale(1, 1); opacity: 0; } }
[class^="lang"] code, [data-language] code, pre [class^="lang"], pre [data-language] { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; animation: 50ms ease-in-out 2s forwards fade-in; }

[class^="lang"] code.rainbow, [data-language] code.rainbow, pre [class^="lang"].rainbow, pre [data-language].rainbow { animation-delay: 0s; }

[class^="lang"] code.loading, [data-language] code.loading, pre [class^="lang"].loading, pre [data-language].loading { animation-play-state: paused; }

pre { position: relative; }

pre.loading .preloader div { animation-play-state: running; }

pre.loading .preloader div:nth-of-type(1) { background: #0081f5; animation: fade 1.5s 300ms linear infinite; }

pre.loading .preloader div:nth-of-type(2) { background: #5000f5; animation: fade 1.5s 438ms linear infinite; }

pre.loading .preloader div:nth-of-type(3) { background: #9000f5; animation: fade 1.5s 577ms linear infinite; }

pre.loading .preloader div:nth-of-type(4) { background: #f50419; animation: fade 1.5s 715ms linear infinite; }

pre.loading .preloader div:nth-of-type(5) { background: #f57900; animation: fade 1.5s 853ms linear infinite; }

pre.loading .preloader div:nth-of-type(6) { background: #f5e600; animation: fade 1.5s 992ms linear infinite; }

pre.loading .preloader div:nth-of-type(7) { background: #00f50c; animation: fade 1.5s 1130ms linear infinite; }

pre .preloader { position: absolute; top: 12px; left: 10px; }

pre .preloader div { width: 12px; height: 12px; border-radius: 4px; display: inline-block; margin-right: 4px; opacity: 0; animation-play-state: paused; animation-fill-mode: forwards; }

pre { background-color: #000; word-wrap: break-word; margin: 0; padding: 10px; color: #fff; font-size: 14px; margin-bottom: 20px; border-radius: 5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); }

code, pre { font-family: "Monaco", "Menlo", courier, monospace; }

pre { background-color: #1d1f21; color: #c5c8c6; overflow: auto; }

pre .comment { color: #969896; }

pre .variable.class, pre .variable.global, pre .variable.instance { color: #c66; }

pre .constant.hex-color, pre .constant.language, pre .constant.numeric, pre .keyword.unit { color: #de935f; }

pre .constant, pre .entity, pre .entity.class, pre .support { color: #f0c674; }

pre .constant.symbol, pre .string { color: #b5bd68; }

pre .entity.function, pre .selector, pre .support.css-property { color: #81a2be; }

pre .keyword, pre .storage { color: #b294bb; }

/* Slider */
.slick-slider { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; display: block; overflow: hidden; 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; top: 0; left: 0; display: block; }
.slick-track:before { display: table; content: ""; }
.slick-track:after { display: table; content: ""; clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }

[dir='rtl'] .slick-slide { float: right; }

.slick-slide:focus { outline: none; }
.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; }

.slick-arrow { position: absolute; -webkit-transform: translate(0, -50%); -o-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); width: 50px; height: 50px; text-indent: -999px; background-color: transparent; border: none; overflow: hidden; cursor: pointer; }
@media (max-width: 767px) { .slick-arrow { top: 40%; } }
@media (min-width: 768px) { .slick-arrow { top: 40%; } }
.slick-arrow:before { content: ""; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); height: 30px; width: 30px; border: 5px solid #000; -webkit-transform: rotate(45deg) translate(-50%, -50%); -o-transform: rotate(45deg) translate(-50%, -50%); -moz-transform: rotate(45deg) translate(-50%, -50%); -ms-transform: rotate(45deg) translate(-50%, -50%); transform: rotate(45deg) translate(-50%, -50%); transform-origin: center center; }
.slick-arrow.slick-prev { left: 0; }
.slick-arrow.slick-prev:before { background-position: -77px -144px; border-top-color: transparent; border-right-color: transparent; -webkit-transform: rotate(45deg) translate(-70%, -10%); -o-transform: rotate(45deg) translate(-70%, -10%); -moz-transform: rotate(45deg) translate(-70%, -10%); -ms-transform: rotate(45deg) translate(-70%, -10%); transform: rotate(45deg) translate(-70%, -10%); }
.slick-arrow.slick-prev.slick-disabled { display: none !important; }
.slick-arrow.slick-next { right: 0; }
.slick-arrow.slick-next:before { -webkit-transform: rotate(45deg) translate(-70%, -10%); -o-transform: rotate(45deg) translate(-70%, -10%); -moz-transform: rotate(45deg) translate(-70%, -10%); -ms-transform: rotate(45deg) translate(-70%, -10%); transform: rotate(45deg) translate(-70%, -10%); border-bottom-color: transparent; border-left-color: transparent; background-position: -88px -144px; }
.slick-arrow.slick-next.slick-disabled { display: none !important; }

.slick-dots { text-align: center; }
@media (min-width: 1025px) { .slick-dots { padding-top: 15px; } }
.slick-dots li { display: inline-block; padding: 0 5px; }
.slick-dots li.slick-active button { background-color: #fff; border-color: transparent; }
.slick-dots li button { display: block; overflow: hidden; height: 15px; width: 15px; border: 1px solid #000; border-radius: 50%; text-indent: -99px; }

.rating-form { text-align: left; }
.rating-form.type-smiley .rating-star { background: url("../images/smiley.png") no-repeat 0 0; display: block; width: 46px; height: 46px; }
.rating-form.type-smiley .rating-star.five { background-position: -229px -63px; }
.rating-form.type-smiley .rating-star.four { background-position: -171px -63px; }
.rating-form.type-smiley .rating-star.three { background-position: -114px -63px; }
.rating-form.type-smiley .rating-star.two { background-position: -57px -63px; }
.rating-form.type-smiley .rating-star.one { background-position: 0 -63px; }
.rating-form.type-smiley .rating-star .fa { display: none; }
.rating-form.type-smiley input[type='radio']:checked + label .rating-star.five { background-position: -229px 3px; }
.rating-form.type-smiley input[type='radio']:checked + label .rating-star.four { background-position: -171px 3px; }
.rating-form.type-smiley input[type='radio']:checked + label .rating-star.three { background-position: -114px 3px; }
.rating-form.type-smiley input[type='radio']:checked + label .rating-star.two { background-position: -57px 3px; }
.rating-form.type-smiley input[type='radio']:checked + label .rating-star.one { background-position: 0 3px; }
.rating-form .form-group { position: relative; border: 0; }
.rating-form .form-legend { display: none; margin: 0; padding: 0; font-size: 20px; font-size: 2rem; }
.rating-form .form-item { position: relative; margin: auto; direction: rtl; }
.rating-form .form-legend + .form-item { padding-top: 10px; }
.rating-form input[type='radio'] { position: absolute; left: -9999px; }
.rating-form label { display: inline-block; cursor: pointer; }
.rating-form .rating-star { display: inline-block; position: relative; }
.rating-form input[type='radio'] + label:before { display: none; content: attr(data-value); position: absolute; right: 30px; top: 83px; font-size: 30px; font-size: 3rem; opacity: 0; direction: ltr; -webkit-transition: all 0s ease 0s; -moz-transition: all 0s ease 0s; -o-transition: all 0s ease 0s; transition: all 0s ease 0s; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.rating-form input[type='radio']:checked + label:before { right: 25px; opacity: 1; }
.rating-form input[type='radio']:checked + label:after { opacity: 1; }
.rating-form input[type='radio'] + label:after { display: none; content: "/ 5"; position: absolute; right: 5px; top: 96px; font-size: 16px; font-size: 1.6rem; opacity: 0; direction: ltr; -webkit-transition: all 0s ease 0s; -moz-transition: all 0s ease 0s; -o-transition: all 0s ease 0s; transition: all 0s ease 0s; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.rating-form label .fa { font-size: 60px; font-size: 1.5625em; line-height: 1.875em; -webkit-transition: all 0s ease 0s; -moz-transition: all 0s ease 0s; -o-transition: all 0s ease 0s; transition: all 0s ease 0s; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.rating-form label:hover .fa-star-o, .rating-form label:focus .fa-star-o, .rating-form label:hover ~ label .fa-star-o, .rating-form label:focus ~ label .fa-star-o { opacity: 0; }
.rating-form input[type='radio']:checked ~ label .fa-star-o { opacity: 0; }
.rating-form label .fa-star { position: absolute; left: 0; top: 0; opacity: 0; }
.rating-form label:hover .fa-star, .rating-form label:focus .fa-star, .rating-form label:hover ~ label .fa-star, .rating-form label:focus ~ label .fa-star { opacity: 1; }
.rating-form input[type='radio']:checked ~ label .fa-star { opacity: 1; color: gold; }
.rating-form .ir { position: absolute; left: -9999px; }
.rating-form .form-action { opacity: 0; position: absolute; left: 5px; bottom: -40px; -webkit-transition: all 0s ease 0s; -moz-transition: all 0s ease 0s; -o-transition: all 0s ease 0s; transition: all 0s ease 0s; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.rating-form input[type='radio']:checked ~ .form-action { cursor: pointer; opacity: 1; }
.rating-form .btn-reset { display: inline-block; margin: 0; padding: 4px 10px; border: 0; font-size: 10px; font-size: 1rem; background: #fff; color: #333; cursor: auto; border-radius: 5px; outline: 0; -webkit-transition: all 0s ease 0s; -moz-transition: all 0s ease 0s; -o-transition: all 0s ease 0s; transition: all 0s ease 0s; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.rating-form .btn-reset:hover, .rating-form .btn-reset:focus { background: gold; }
.rating-form input[type='radio']:checked ~ .form-action .btn-reset { cursor: pointer; }
.rating-form .form-output { display: none; position: absolute; right: 15px; bottom: -45px; font-size: 30px; font-size: 3rem; opacity: 0; -webkit-transition: all 0s ease 0s; -moz-transition: all 0s ease 0s; -o-transition: all 0s ease 0s; transition: all 0s ease 0s; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

.no-js .rating-form .form-output, .rating-form input[type='radio']:checked ~ .form-output { right: 5px; opacity: 1; }

.breadcrumbs ul:after { clear: both; content: ""; display: block; }
.breadcrumbs li { float: left; color: rgba(100, 196, 225, 0.8); font: 300 14px "Montserrat", sans-serif; vertical-align: middle; }
.breadcrumbs li:after { clear: both; content: ""; display: block; }
.breadcrumbs li a { font: 400 14px "Montserrat", sans-serif; letter-spacing: 1px; color: #64c4e1; }
.breadcrumbs li .fa, .breadcrumbs li a { float: left; display: block; }
.breadcrumbs li .fa { margin: 2px 4px; }

.social-media ul::after { clear: both; content: ""; display: table; }
.social-media li { display: inline-block; vertical-align: middle; }
.social-media li a { display: block; height: 40px; width: 40px; position: relative; background-color: #2498bb; font-size: 1.125em; border-radius: 50%; color: #fff; }
.social-media li a:hover { background-color: #1c7590; }
.social-media li a .fa { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.content-area { padding: 1.25em 0; }

.documents section { padding-bottom: 1.25rem; }
.documents section header { text-transform: uppercase; font: 1.5625rem "Montserrat", sans-serif; letter-spacing: 2px; color: #64c4e1; padding: 0.625rem 0; }
.documents section article { font: 1.125rem "Open Sans", sans-serif; }
.documents section.colors article ul:after { clear: both; content: ""; display: block; }
.documents section.colors article li { float: left; width: 20%; text-align: center; }
.documents section.colors article li .color { display: inline-block; width: 70px; height: 70px; }
.documents section.colors article li .color.pc { background-color: #64c4e1; }
.documents section.colors article li .color.sc { background-color: #e18164; }
.documents section.colors article li .color.cv1 { background-color: #9b3b1e; }
.documents section.colors article li .color.cv2 { background-color: #1e7e9b; }
.documents section.colors article li span { display: block; text-align: center; padding: 5px 0; font: 1.125rem "Open Sans", sans-serif; }
.documents section .code-container { position: relative; }
.documents section .code-container .copy-to-clipboard { opacity: 0; -webkit-transition: all 0.15s ease-out 0s; -moz-transition: all 0.15s ease-out 0s; transition: all 0.15s ease-out 0s; cursor: pointer; width: 30px; height: 30px; border-radius: 2px; background: url("../images/copy-to-clipboard.png") no-repeat center center/70% auto #fff; position: absolute; right: 4px; top: 4px; z-index: 10; border: none; }
.documents section .code-container:hover .copy-to-clipboard { opacity: 1; }