/* 
	Table of Contents

	     01. Icons ------------------------------------
	I.   Generic --------------------------------------
	     01. Reset ------------------------------------
	     02. Base -------------------------------------
	     03. Fonts ------------------------------------
	     04. Helpers ----------------------------------
	         Clear ------------------------------------
	         Notext -----------------------------------
	         Hidden -----------------------------------
	         Alignleft --------------------------------
	         Alignright -------------------------------
	         Disabled ---------------------------------
	         Grid -------------------------------------
	         Responsive Helpers -----------------------
	     05. Animations -------------------------------
	II.  Regions --------------------------------------
	     01. Container --------------------------------
	     02. Content ----------------------------------
	     03. Footer -----------------------------------
	     04. Header -----------------------------------
	     05. Main -------------------------------------
	     06. Shell ------------------------------------
	     07. Sidebar ----------------------------------
	     08. Wrapper ----------------------------------
	III. Modules --------------------------------------
	     01. Button -----------------------------------
	         Button Block -----------------------------
	     02. Btn Play ---------------------------------
	     03. Btn Play Video ---------------------------@import url('file:///C:\Users\Rick Kuan Lee\Downloads\liveswap-updates-6985fae2\css\style-update.css');
	     04. Btn Primary ------------------------------
	     05. Form Elements ----------------------------
	     06. Form -------------------------------------
	     07. List -------------------------------------
	     08. List Partners ----------------------------
	     09. Logo -------------------------------------
	     10. Nav --------------------------------------
	     11. Playground -------------------------------
	     12. Playground Comment -----------------------
	     13. Playground Animation ---------------------
	     14. Playground-alt ---------------------------
	     15. Playground Slide -------------------------
	     16. PLayground Slides ------------------------
	     17. Section Wrapper --------------------------
	     18. Section ----------------------------------
	     19. Section Grey -----------------------------
	     20. Section Intro ----------------------------
	     21. Section Testimonials ---------------------
	     22. Section templates ------------------------
	         Small Desktop ----------------------------
	         Small Desktop ----------------------------
	     23. Section Sizes ----------------------------
	     24. Section Hub ------------------------------
	     25. Section Fonts ----------------------------
	     26. Section Keynotes -------------------------
	     27. Side Nav ---------------------------------
	     28. Slider -----------------------------------
	     29. Socials ----------------------------------
	     30. Socials Size -----------------------------
	     31. Table ------------------------------------
	     32. Testimonial ------------------------------
	     33. Testimonial ------------------------------
	     34. Testimonial Secondary --------------------
	     35. Text Box ---------------------------------
	     36. Text-box Secondary -----------------------
	     37. Video ------------------------------------
	     38. Widget -----------------------------------
 */

/* ------------------------------------------------------------ *\
	Icons
\* ------------------------------------------------------------ */

[class^="ico-"] { font-size: 0; line-height: 0; text-indent: -4004px; display: inline-block; vertical-align: middle; background-repeat: no-repeat; }

.ico-triangle-right { border: 9px solid transparent; border-left: 12px solid #fff; border-right: none; }

.ico-triangle-right--play { border-width: 16px; border-left-width: 22px; border-left-color: #fff; }

.ico-creation-swap { background-image: url(images/sprite.png); background-position: 25.274725274725274% 38.46153846153847%; background-size: 635.2941176470588% 482.35294117647055%; width: 17px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-facebook-white { background-image: url(images/sprite.png); background-position: 96% 31.818181818181817%; background-size: 1350% 512.5%; width: 8px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-facebook { background-image: url(images/sprite.png); background-position: 96% 62.121212121212125%; background-size: 1350% 512.5%; width: 8px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-instagram-white { background-image: url(images/sprite.png); background-position: 0% 69.6969696969697%; background-size: 675% 512.5%; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-instagram { background-image: url(images/sprite.png); background-position: 70.65217391304348% 37.878787878787875%; background-size: 675% 512.5%; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-lightstock { background-image: url(images/sprite.png); background-position: 100% 0%; background-size: 900% 482.35294117647055%; width: 12px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-pinterest-white { background-image: url(images/sprite.png); background-position: 0% 100%; background-size: 771.4285714285714% 512.5%; width: 14px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-pinterest { background-image: url(images/sprite.png); background-position: 21.27659574468085% 69.6969696969697%; background-size: 771.4285714285714% 512.5%; width: 14px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-star-full { background-image: url(images/sprite.png); background-position: 48.35164835164835% 38.46153846153847%; background-size: 635.2941176470588% 482.35294117647055%; width: 17px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-twitter-white { background-image: url(images/sprite.png); background-position: 41.30434782608695% 67.64705882352942%; background-size: 675% 585.7142857142857%; width: 16px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-twitter { background-image: url(images/sprite.png); background-position: 63.04347826086957% 67.64705882352942%; background-size: 675% 585.7142857142857%; width: 16px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; }

.ico-unsplash { background-image: url(images/sprite.png); background-position: 0% 38.46153846153847%; background-size: 568.421052631579% 482.35294117647055%; width: 19px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; }

.logo { background-image: url(images/sprite.png); background-position: 0% 0%; background-size: 117.3913043478261% 390.4761904761905%; width: 92px; height: 21px; display: inline-block; vertical-align: middle; font-size: 0; }

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.ico-creation-swap { background-image: url(images/sprite.@2x.png); background-position: 25.274725274725274% 38.46153846153847%; background-size: 635.2941176470588% 482.35294117647055%; width: 17px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-facebook-white { background-image: url(images/sprite.@2x.png); background-position: 96% 31.818181818181817%; background-size: 1350% 512.5%; width: 8px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-facebook { background-image: url(images/sprite.@2x.png); background-position: 96% 62.121212121212125%; background-size: 1350% 512.5%; width: 8px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-instagram-white { background-image: url(images/sprite.@2x.png); background-position: 0% 69.6969696969697%; background-size: 675% 512.5%; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-instagram { background-image: url(images/sprite.@2x.png); background-position: 70.65217391304348% 37.878787878787875%; background-size: 675% 512.5%; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-lightstock { background-image: url(images/sprite.@2x.png); background-position: 100% 0%; background-size: 900% 482.35294117647055%; width: 12px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-pinterest-white { background-image: url(images/sprite.@2x.png); background-position: 0% 100%; background-size: 771.4285714285714% 512.5%; width: 14px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-pinterest { background-image: url(images/sprite.@2x.png); background-position: 21.27659574468085% 69.6969696969697%; background-size: 771.4285714285714% 512.5%; width: 14px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-star-full { background-image: url(images/sprite.@2x.png); background-position: 48.35164835164835% 38.46153846153847%; background-size: 635.2941176470588% 482.35294117647055%; width: 17px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-twitter-white { background-image: url(images/sprite.@2x.png); background-position: 41.30434782608695% 67.64705882352942%; background-size: 675% 585.7142857142857%; width: 16px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-twitter { background-image: url(images/sprite.@2x.png); background-position: 63.04347826086957% 67.64705882352942%; background-size: 675% 585.7142857142857%; width: 16px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; }
	.ico-unsplash { background-image: url(images/sprite.@2x.png); background-position: 0% 38.46153846153847%; background-size: 568.421052631579% 482.35294117647055%; width: 19px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; }
	.logo { background-image: url(images/sprite.@2x.png); background-position: 0% 0%; background-size: 117.3913043478261% 390.4761904761905%; width: 92px; height: 21px; display: inline-block; vertical-align: middle; font-size: 0; }}

.cols:after,
.footer:after,
.playground__comment-author:after { content: ''; line-height: 0; display: table; clear: both; }

/* ------------------------------------------------------------ *\
	I.   Generic
\* ------------------------------------------------------------ */

/* ------------------------------------------------------------ *\
	Reset
\* ------------------------------------------------------------ */

*,
*:before,
*:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; }

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

html { tap-highlight-color: rgba(0,0,0,0); }

body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; }

img,
iframe,
video,
audio,
object { max-width: 100%; }

img,
iframe { border: 0 none; }

img { height: auto; display: inline-block; vertical-align: middle; }

b,
strong { font-weight: bold; }

address { font-style: normal; }

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

a,
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="file"],
input[type="image"],
label[for] { cursor: pointer; }

a[href^="tel"],
button[disabled],
input[disabled],
textarea[disabled],
select[disabled] { cursor: default; }

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

input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="color"],
textarea,
a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; }

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

textarea { overflow: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; }

button,
input,
optgroup,
select,
textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; }

button,
select { text-transform: none; }

table { width: 100%; border-collapse: collapse; border-spacing: 0; }

nav ul,
nav ol { list-style: none outside none; }

/* ------------------------------------------------------------ *\
	Base
\* ------------------------------------------------------------ */

body { min-width: 320px; background: #f8f8f8; font-family: 'Open Sans', sans-serif; font-size: 16px; line-height: 1.3; color: #6e767c; }

a { color: inherit; text-decoration: underline; }

a:hover { text-decoration: none; }

a[href^="tel"] { text-decoration: none; }

h1,
h2,
h3,
h4,
h5,
h6 { margin-bottom: 0.65em; }

h1 { font-size: ; }

h2 { font-size: 41px; font-weight: 300; }

h3 { font-size: ; }

h4 { font-size: 26px; font-weight: 400; }

h5 { font-size: 18px; font-weight: 400; }

h6 { font-size: 14px; }

p,
ul,
ol,
dl,
table,
blockquote { margin-bottom: 1.3em; }

h1[class],
h2[class],
h3[class],
h4[class],
h5[class],
h6[class],
h1:last-child,
h2:last-child,
h3:last-child,
h4:last-child,
h5:last-child,
h6:last-child,
p:last-child,
ul:last-child,
ol:last-child,
dl:last-child,
table:last-child,
blockquote:last-child { margin-bottom: 0; }

@media (max-width: 1023px) {
	h2 { font-size: 41px; }
}

@media (max-width: 767px) {
	body { font-size: 14px; }
	h4 { font-size: 20px; }
	h5 { font-size: 14px; }
}

/* ------------------------------------------------------------ *\
	Fonts
\* ------------------------------------------------------------ */

@font-face {
    font-family: 'AW-conqueror-inline';
    src: url('fonts/awconquerorinline-regular-webfont.eot');
    src: url('fonts/awconquerorinline-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/awconquerorinline-regular-webfont.woff2') format('woff2'),
         url('fonts/awconquerorinline-regular-webfont.woff') format('woff'),
         url('fonts/awconquerorinline-regular-webfont.ttf') format('truetype'),
         url('fonts/awconquerorinline-regular-webfont.svg#aw_conqueror_inlineregular') format('svg');
    font-weight: 400;
    font-style: normal;

}

/* ------------------------------------------------------------ *\
	Helpers
\* ------------------------------------------------------------ */

/*  Clear  */

.clear:after { content: ''; line-height: 0; display: table; clear: both; }

/*  Notext  */

.notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; }

.notext-old { font-size: 0; line-height: 0; text-indent: -4000px; }

/*  Hidden  */

[hidden],
.hidden { display: none; }

/*  Alignleft  */

.alignleft { float: left; }

/*  Alignright  */

.alignright { float: right; }

/*  Disabled  */

[disabled],
.disabled { cursor: default; }

/*  Grid  */

.cols { margin: 0 -15px; }

.cols:after { }

.col { float: left; width: 100%; padding: 0 15px; }

.col-1of2 { width: 50%; }

.flex-cols { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}

.flex-col--size1 { width: 100%; max-width: calc(100% - 381px); }

.flex-col--size2 { width: 100%; max-width: 381px; }

/*  Responsive Helpers  */

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

@media (max-width: 767px) {
	.hidden-xs { display: none !important; }
	.visible-xs-block { display: block !important; }
	.visible-xs-inline { display: inline !important; }
	.visible-xs-inline-block { display: inline-block !important; }
}

@media (min-width: 768px) and (max-width: 1023px) {
	.hidden-sm { display: none !important; }
	.visible-sm-block { display: block !important; }
	.visible-sm-inline { display: inline !important; }
	.visible-sm-inline-block { display: inline-block !important; }
}

@media (min-width: calc(1023px se+ 1px)) and (max-width: 1200px) {
	.hidden-md { display: none !important; }
	.visible-md-block { display: block !important; }
	.visible-md-inline { display: inline !important; }
	.visible-md-inline-block { display: inline-block !important; }
}

@media (min-width: 1201px) {
	.hidden-lg { display: none !important; }
	.visible-lg-block { display: block !important; }
	.visible-lg-inline { display: inline !important; }
	.visible-lg-inline-block { display: inline-block !important; }
}

/* ------------------------------------------------------------ *\
	Animations
\* ------------------------------------------------------------ */

@-webkit-keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}

@keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}

@-webkit-keyframes fadeInBorder {
	0% { border-color: transparent; }
	100% { border-color: rgba(255, 255, 255, .3); }
}

@keyframes fadeInBorder {
	0% { border-color: transparent; }
	100% { border-color: rgba(255, 255, 255, .3); }
}

@-webkit-keyframes fadeOut {
	0 { opacity: 1; }
	100% { opacity: 0; }
}

@keyframes fadeOut {
	0 { opacity: 1; }
	100% { opacity: 0; }
}

@-webkit-keyframes fadeIn {
	0 { opacity: 0; }
	100% { opacity: 1; }
}

@keyframes fadeIn {
	0 { opacity: 0; }
	100% { opacity: 1; }
}

@-webkit-keyframes floatImage {
	0%,to {-webkit-transform:translate(0) rotate(0deg);transform:translate(0) rotate(0deg);}
	50%{ -webkit-transform:translate(11%,7%) rotate(5deg); transform:translate(11%,7%) rotate(5deg)}
}

@keyframes floatImage {
	0%,to {-webkit-transform:translate(0) rotate(0deg);transform:translate(0) rotate(0deg);}
	50%{ -webkit-transform:translate(11%,7%) rotate(5deg); transform:translate(11%,7%) rotate(5deg)}
}

@-webkit-keyframes floatImageSec { 
	0%,to {-webkit-transform:translate(0) scale(1) rotate(0deg);transform:translate(0) scale(1) rotate(0deg); }
	50%{-webkit-transform:translate(-7%,-11%) scale(1.02) rotate(-5deg);transform:translate(-7%,-11%) scale(1.02) rotate(-5deg)}
}

@keyframes floatImageSec { 
	0%,to {-webkit-transform:translate(0) scale(1) rotate(0deg);transform:translate(0) scale(1) rotate(0deg); }
	50%{-webkit-transform:translate(-7%,-11%) scale(1.02) rotate(-5deg);transform:translate(-7%,-11%) scale(1.02) rotate(-5deg)}
}

@-webkit-keyframes playgroundCursor {
  0% { bottom: 25px; right: 293px; }
  14% { bottom: 230px;  right: 575px; -webkit-transform:scale(1); transform:scale(1); }
  18% { bottom: 230px;  right: 575px; -webkit-transform:scale(0.8); transform:scale(0.8); }
  22% { bottom: 230px;  right: 575px; -webkit-transform:scale(1); transform:scale(1); }
  30% { bottom: 25px; right: 293px; }

  100% { bottom: 25px; right: 293px; }
}

@keyframes playgroundCursor {
  0% { bottom: 25px; right: 293px; }
  14% { bottom: 230px;  right: 575px; -webkit-transform:scale(1); transform:scale(1); }
  18% { bottom: 230px;  right: 575px; -webkit-transform:scale(0.8); transform:scale(0.8); }
  22% { bottom: 230px;  right: 575px; -webkit-transform:scale(1); transform:scale(1); }
  30% { bottom: 25px; right: 293px; }

  100% { bottom: 25px; right: 293px; }
}

@media (max-width: 767px) {
	.flex-cols { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;}
	.flex-col { width: 100%; max-width: 100%; }
}

/* ------------------------------------------------------------ *\
	II.  Regions
\* ------------------------------------------------------------ */

/* ------------------------------------------------------------ *\
	Container
\* ------------------------------------------------------------ */

.container {}

/* ------------------------------------------------------------ *\
	Content
\* ------------------------------------------------------------ */

.content {}

/* ------------------------------------------------------------ *\
	Footer
\* ------------------------------------------------------------ */

.footer { background: #fff; font-size: 9px; padding: 22px 15px 20px; }

.footer:after { }

.footer .footer__inner { float: left; }

.footer .copyright { float: right; margin-bottom: 0; padding-top: 5px; }

/* ------------------------------------------------------------ *\
	Main
\* ------------------------------------------------------------ */

.main { padding-top: 70px; }

/* ------------------------------------------------------------ *\
	Shell
\* ------------------------------------------------------------ */

.shell { max-width: 980px; padding-left: 10px; padding-right: 10px; margin: auto; }

.shell-fluid { max-width: none; }

/* ------------------------------------------------------------ *\
	Sidebar
\* ------------------------------------------------------------ */

.sidebar {}

/* ------------------------------------------------------------ *\
	Wrapper
\* ------------------------------------------------------------ */

.wrapper { min-height: 100vh; }

/* ------------------------------------------------------------ *\
	III. Modules
\* ------------------------------------------------------------ */

/* ------------------------------------------------------------ *\
	Button
\* ------------------------------------------------------------ */

.btn { display: inline-block; vertical-align: middle; text-align: center; cursor: pointer; font-weight: 700; color: #fff;
	-webkit-appearance: none;
	   -moz-appearance: none;
	 		appearance: none;
}

/*  Button Block  */

.btn-block { display: block; padding-left: 0; padding-right: 0; }

/* ------------------------------------------------------------ *\
	Btn Play
\* ------------------------------------------------------------ */

.btn--play { border-radius: 29px; background-color: #957fff;  text-decoration: none; font-size: 14px; line-height: 1; padding: 18px 35px 18px 30px; transition: background .3s; }

.btn--play > i { margin-right: 13px; }

.btn--play span { display: inline-block; vertical-align: middle; }

.btn--play:hover { background-color: rgb(170, 153, 255); }

/* ------------------------------------------------------------ *\
	Btn Play Video
\* ------------------------------------------------------------ */

.btn--play-video { position: relative; }

.btn--play-video .btn__icon { position: absolute; top: 50%; left: 50%; margin: -50px 0 0 -50px; display: block; width: 100px; height: 100px; background: rgba(149,127,255,.45); border: 2px solid transparent; border-radius: 50%; text-align: center; line-height: 94px; transition: background .3s; }

.btn--play-video .btn__icon i { margin-right: -4px; }

@media (max-width: 479px) {
	.btn--play-video .btn__icon { width: 60px; height: 60px; line-height: 56px; margin: -30px 0 0 -30px; }
}

/* ------------------------------------------------------------ *\
	Btn Primary
\* ------------------------------------------------------------ */

.btn--primary { background: #957fff; text-decoration: none; font-size: 17px; border-radius: 5px; padding: 9px 10px 11px; width: 100%; max-width: 373px; text-align: center; border: 1px solid transparent; transition: all .3s; }

.btn--primary:hover { background-color: rgb(170, 153, 255); }

/* ------------------------------------------------------------ *\
	Form Elements
\* ------------------------------------------------------------ */

input::-webkit-input-placeholder { color: inherit; opacity: 1; }

input::-moz-placeholder { color: inherit; opacity: 1; }

input:-ms-input-placeholder { color: inherit; opacity: 1; }

input::placeholder { color: inherit; opacity: 1; }

textarea::-webkit-input-placeholder { color: inherit; opacity: 1; }

textarea::-moz-placeholder { color: inherit; opacity: 1; }

textarea:-ms-input-placeholder { color: inherit; opacity: 1; }

textarea::placeholder { color: inherit; opacity: 1; }

input:-webkit-autofill { -webkit-text-fill-color: inherit; -webkit-box-shadow: 0 0 0 1000px #fff inset; }

.field {}

.textarea {}

.select {}

.radio {}

.checkbox {}

/* ------------------------------------------------------------ *\
	Form
\* ------------------------------------------------------------ */

.form {}

/* ------------------------------------------------------------ *\
	List
\* ------------------------------------------------------------ */

[class^="list-"] { list-style: none outside none; }

/* ------------------------------------------------------------ *\
	List Partners
\* ------------------------------------------------------------ */

.list-partners { display: inline-block; vertical-align: middle; font-size: 0; }

.list-partners li { color: #606970; display: inline-block; vertical-align: middle; font-size: 16px; margin: 0 18px; }

.list-partners li i { margin-right: 5px; }

@media (max-width: 479px) {
	.list-partners li { font-size: 14px; margin: 0 5px 5px; }
}

/* ------------------------------------------------------------ *\
	Logo
\* ------------------------------------------------------------ */

.logo {}

.logo-svg { width: 100px; font-size: 0; }

/* ------------------------------------------------------------ *\
	Nav
\* ------------------------------------------------------------ */

.nav-utilities ul { font-size: 0; }

.nav-utilities li { display: inline-block; color: #606970; font-size: 14px; font-weight: 600; }

.nav-utilities li ~ li { margin-left: 24px; }

.nav-utilities a { text-decoration: none; }

.nav-utilities a:hover { color: #957fff; }

/* ------------------------------------------------------------ *\
	Playground
\* ------------------------------------------------------------ */

.playground { width: 960px; height: 611px; margin: 0 auto; background: url(images/playground-bg@2x.png) no-repeat center center; background-size: cover; position: relative; border-radius: 9px; overflow: hidden; box-shadow: -13px 18px 38px rgba(0,0,0, .061); }

.playground .playground__inner { position: absolute; bottom: 0; left: 0; right: 0; top: 113px; }

.playground .playground__content { padding: 27px; position: relative; width: calc(100% - 239px); -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; }

.playground .text-box { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 391px; padding-left: 0; padding-right: 0; text-align: center; }

.playground .playground__aside { position: absolute; bottom: 0; right: 0; top: 0; width: 239px; padding: 27px 21px; }

.playground .playground__cursor { width: 15px; height: 20px; background: url(images/cursor.png) no-repeat center center; background-size: cover; position: absolute; bottom: 25px; right: 293px; z-index: 1; }

@media (max-width: 1023px) {
	.playground { -webkit-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); }
}

@media (max-width: 767px) {
	.playground { -webkit-transform: scale(0.46); -ms-transform: scale(0.46); transform: scale(0.46); }
}

@media (max-width: 479px) {
	.playground { -webkit-transform: scale(0.333); -ms-transform: scale(0.333); transform: scale(0.333); }
}

/* ------------------------------------------------------------ *\
	Playground Comment
\* ------------------------------------------------------------ */

.playground__comment { background: #957fff; border-radius: 4px; padding: 10px 13px 13px 12px; position: relative; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); opacity: 0; color: #fff; }

.playground__comment-a { transition: opacity 0.3s 2s, -webkit-transform 0.3s 2s; transition: transform 0.3s 2s, opacity 0.3s 2s; transition: transform 0.3s 2s, opacity 0.3s 2s, -webkit-transform 0.3s 2s; }

.playground__comment-b { transition: opacity 0.3s 3.5s, -webkit-transform 0.3s 3.5s; transition: transform 0.3s 3.5s, opacity 0.3s 3.5s; transition: transform 0.3s 3.5s, opacity 0.3s 3.5s, -webkit-transform 0.3s 3.5s; }

.playground__comment-c { transition: opacity 0.3s 8.8s, -webkit-transform 0.3s 8.8s; transition: transform 0.3s 8.8s, opacity 0.3s 8.8s; transition: transform 0.3s 8.8s, opacity 0.3s 8.8s, -webkit-transform 0.3s 8.8s; }

.playground__comment:before { content: ''; border-style: solid; border-width: 0 22px 12px 0; border-color: transparent #957fff transparent transparent; position: absolute; top: 100%; right: 13px; }

.playground__comment ~ .playground__comment { margin-top: 32px; }

.playground__comment > p { font-size: 13px; margin-bottom: 9px; }

.playground__comment-author:after { }

.playground__comment-author p { font-size: 11px; display: inline-block; vertical-align: middle; margin-bottom: 0; opacity: .5; padding-top: 7px; }

.playground__comment-author img { border-radius: 5px; overflow: hidden; }

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

.playground__comment-author-right > img { float: right; margin-left: 11px; }

.playground__comment-author-left > img { float: left; margin-right: 11px; }

.playground__comment--alt { background: #606970; }

.playground__comment--alt:before { border-width: 12px 22px 0 0; border-color: #606970 transparent transparent transparent ; right: auto; left: 13px; }

/* ------------------------------------------------------------ *\
	Playground Animation
\* ------------------------------------------------------------ */

.playground.in-view .playground__content { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }

.playground.in-view .playground__comment { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

.playground.in-view .playground__cursor { -webkit-animation: playgroundCursor 2.5s linear forwards; animation: playgroundCursor 2.5s linear forwards; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-delay: 4s; animation-delay: 4s; }

.playground.in-view .text-box--secondary {  -webkit-animation: fadeInBorder .1s linear forwards;  animation: fadeInBorder .1s linear forwards;  -webkit-animation-iteration-count: 1;  animation-iteration-count: 1; -webkit-animation-delay: 4.5s; animation-delay: 4.5s; }

.playground.in-view .text-box--secondary:before,
.playground.in-view .text-box--secondary:after,
.playground.in-view .text-box--secondary .text-box-inner:before,
.playground.in-view .text-box--secondary .text-box-inner:after { -webkit-animation: fadeIn .1s linear forwards; animation: fadeIn .1s linear forwards;  -webkit-animation-iteration-count: 1;  animation-iteration-count: 1; -webkit-animation-delay: 4.5s; animation-delay: 4.5s; }

.playground.in-view .text-box--secondary .text-box-typer:before { -webkit-animation: fadeOut .1s linear forwards; animation: fadeOut .1s linear forwards;  -webkit-animation-iteration-count: 1;  animation-iteration-count: 1; -webkit-animation-delay: 6s; animation-delay: 6s;}

/* ------------------------------------------------------------ *\
	Playground-alt
\* ------------------------------------------------------------ */

.playground-alt {width: 537px; height: 364px; background: url(images/playground-alt-bg@2x.png) no-repeat center center; background-size: cover; position: relative; border-radius: 4px; overflow: hidden; box-shadow: -2px 3px 24px rgba(0,0,0, .061);}

.playground-alt .playground__content { position: absolute; bottom: 0; left: 0; width: calc(100% - 140px); height: 302px; }

@media (max-width: 1023px) {
	.playground-alt { -webkit-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); }
}

@media (max-width: 479px) {
	.playground-alt { -webkit-transform: scale(0.54); -ms-transform: scale(0.54); transform: scale(0.54); }
}

/* ------------------------------------------------------------ *\
	Playground Slide
\* ------------------------------------------------------------ */

.playground-slide { text-align: center; padding-top: 61px; position: absolute; top: 100%; left: 0; bottom: 0; right: 0; z-index: -1; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; transition: top .5s, z-index .5s, -webkit-transform .5s; transition: transform .5s, top .5s, z-index .5s; transition: transform .5s, top .5s, z-index .5s, -webkit-transform .5s; }

.playground-slide h6 { font-weight: 600; margin-bottom: 29px; }

.playground-slides .playground-slide:nth-child(1) { top: 0; transition: top .5s, z-index .5s, -webkit-transform .5s; transition: transform .5s, top .5s, z-index .5s; transition: transform .5s, top .5s, z-index .5s, -webkit-transform .5s; z-index: 1; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); }

.playground-slides .playground-slide.slide-active:nth-child(1) { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }

.playground-slides.slide-state-1 .playground-slide:nth-child(1) { top: 100%; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); z-index: -1; }

.playground-slides.slide-state-0 .playground-slide:last-child { top: 100%; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); z-index: -1; }

/* ------------------------------------------------------------ *\
	PLayground Slides
\* ------------------------------------------------------------ */

.playground-slides .slide-active { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); top: 0; z-index: 1; }

.playground-slides .slide-active ~ .playground-slide { top: 0; z-index: -1; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); }

/* ------------------------------------------------------------ *\
	Section Wrapper
\* ------------------------------------------------------------ */

.section-wrapper { position: relative; z-index: 1; min-height: 100vh; overflow: hidden; }

/* ------------------------------------------------------------ *\
	Section
\* ------------------------------------------------------------ */

.section { position: relative; z-index: 1; }

/* ------------------------------------------------------------ *\
	Section Grey
\* ------------------------------------------------------------ */

.section--grey { background: #f2f3f3; }

/* ------------------------------------------------------------ *\
	Section Intro
\* ------------------------------------------------------------ */

.section--intro { color: #606970; padding: 75px 0 112px; background: #f8f8f8; }

.section--intro .section__image-left { position: absolute; top: 0; left: 0; }

.section--intro .section__image-right { position: absolute; top: 295px; right: 0; }

.section--intro .section__head { text-align: center; font-size: 16px; margin-bottom: 60px; padding: 51px 0 48px; }

.section--intro .section__head p { margin-bottom: 0; }

.section--intro .section__head .btn { margin-top: 55px; }

.section--intro .section__head p ~ p { margin-top: 10px; }

.section--intro .section__title { margin-bottom: 26px; color: #272c32; }

.section--intro .section__title .title-text { display: inline-block; vertical-align: middle; }

.section--intro .section__title .typer { position: relative; top: -3px; }

.section--intro .section__content { position: relative; z-index: 1; }

@media (max-width: 1023px) {
	.section--intro { padding: 30px 0; }
	.section--intro .section__body { position: relative; height: 430px; }
	.section--intro .section__body .playground { position: absolute; top: 50%; left: 50%; margin-left: -480px; margin-top: -305px; }
}

@media (max-width: 767px) {
	.section--intro { padding: 40px 0; }
	.section--intro .shell { padding: 0; }
	.section--intro .section__head { margin-bottom: 40px; padding-left: 10px; padding-right: 10px;  font-size: 14px; }
	.section--intro .section__title { margin-bottom: 40px; }
	.section--intro .section__title .title-text { display: block; margin-bottom: 5px; }
	.section--intro .section__body { height: 185px; height: 260px; }

	.section--intro .section__image-left  { max-width: 50%; top: 0; }
	.section--intro .section__image-right { max-width: 50%; top: 121px; }
}

@media (max-width: 479px) {
	.section--intro .section__image-right { top: auto; bottom: 20%; }
	.section--intro .section__body { height: 185px; }
}

.section--intro .section__body { width: 1000px; }

.section--intro .section__body a.thumb { display: inline-block; margin: 10px 10px 0 0; }

@media ( max-width: 1023px ){
	.section--intro .section__body { width: 100%; height: auto; text-align: center; }
	.section--intro .section__body a.thumb { margin: 0 auto; }
	.section--intro .section__body a.thumb + a.thumb { margin-top: 10px; }
}

/* ------------------------------------------------------------ *\
	Section Testimonials
\* ------------------------------------------------------------ */

.section--testimonials { position: relative; padding: 65px 0; }

.section--testimonials > canvas { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; }

.section--testimonials .shell { position: relative; z-index: 1; }

@media (max-width: 767px) {
	.section--testimonials { padding: 40px 0; }
}

/* ------------------------------------------------------------ *\
	Section templates
\* ------------------------------------------------------------ */

.section--templates { position: relative; background: #f8f8f8; padding: 117px 0 89px; overflow: hidden; }

.section--templates .ornament-left { position: absolute; top: 275px; left: -60px; }

.section--templates .ornament-right { position: absolute; top: 28%; right: -39px; }

.section--templates .section__head { margin-bottom: 97px; }

.section--templates .section__body { min-height: 972px; position: relative; }

.section--templates .section__body:after { content: ''; background: url(images/temp/template-shadow.png) no-repeat 0 0; width: 773px; height: 108px; position: absolute; bottom: 0; left: 50%; opacity: .4; margin-left: -96px; }

.section--templates .section__image { display: inline-block; position: absolute; }

.section--templates .section__image-with-shadow { padding-bottom: 90px; }

.section--templates .section__image--primary { top: 43px; right: 50%; z-index: 1; max-width: 50%; }

.section--templates .section__image--secondary { top: 7px; right: 50%; margin-right: -403px; max-width: 20%; }

.section--templates .section__image--tertiary { bottom: 10px; left: 50%; margin-left: -96px; max-width: 42%; }

.section--templates .cloud { position: absolute; top: 426px; left: 7.5%; z-index: 5; }

.section--templates .cloud--secondary { top: auto; left: auto; bottom: 39.4%; right: 12%; }

.section--templates .section__head { text-align: center; }

.section--templates .section__entry > span { display: inline-block; vertical-align: middle; color: #606970; margin-right: 27px; }

.section--templates .section__title { font-weight: 400; color: #272c32; margin-bottom: 16px; }

/* Small Desktop */

@media (max-width: 1500px) {
	.section--templates .section__body { padding-top: 65%; min-height: 0; height: auto; }
}

/* Small Desktop */

@media (max-width: 1200px) {
	.section--templates .cloud { left: 5%; }
	.section--templates .cloud--secondary { left: auto; right: 5%; }
	.section--templates .section__image--secondary { margin-right: -33%; }
	.section--templates .section__image--tertiary { margin-left: -7px; }
	.section--templates .section__body:after { margin-left: -7px; }

	.section--templates .ornament-left { left: -12%; }
	.section--templates .ornament-right { right: -20%; }
}

@media (max-width: 1023px) {
	.section--templates { padding: 80px 0; }
	.section--templates .cloud { display: none; }

	.section--templates .ornament-left { top: 30%; left: -30%; }
	.section--templates .ornament-right { right: -50%; top: 23%;}
}

@media (max-width: 767px) {
	.section--templates { padding: 40px 0; }
	.section--templates .section__entry > span { display: block; margin: 0 0 10px 0; }
	
	.section--templates .section__image-animate,
	.section--templates .section__image-animate-secondary,
	.section--templates .section__image-animate-tertiary { -webkit-animation: none; animation: none; } 

	.section--templates .section__image-with-shadow { padding-bottom: 0; }
	.section--templates .section__image--tertiary { margin-left: 5px; }

	.section--templates .ornament-left { max-width: 65%; top: 35%; }
	.section--templates .ornament-right { max-width: 80%; top: auto; bottom: 5%; }

}

/* ------------------------------------------------------------ *\
	Section Sizes
\* ------------------------------------------------------------ */

.section--sizes { padding: 45px 0 146px; color: #606970; }

.section--sizes .section__title { font-weight: 400; margin-bottom: 8px; color: #272c32;}

.section--sizes .socials { margin-top: 45px; }

.section--sizes .section__content p { line-height: 2.15; }

@media (max-width: 767px) {
	.section--sizes { text-align: center; padding-bottom: 41px; }
	.section--sizes .section__content { margin-bottom: 20px; }
	.section--sizes .socials-size { margin: 0 auto; }
}

/* ------------------------------------------------------------ *\
	Section Hub
\* ------------------------------------------------------------ */

.section--hub { padding: 51px 0 101px; position: relative; color: #606970;}

.section--hub .section__image { position: absolute; top: -101px; left: 0; -webkit-transform: translateX(-714px); -ms-transform: translateX(-714px); transform: translateX(-714px); }

.section--hub .section__image img { display: block; }

.section--hub .section__inner { position: relative; z-index: 1; }

.section--hub .section__title { font-weight: 400; margin-bottom: 17px; line-height: 1.54; color: #272c32; }

.section--hub .section__aside { padding-left: 35px; }

.section--hub .section__aside p { line-height: 2.15; }

@media (max-width: 1023px) {
	.section--hub { padding: 80px 0; }
	.section--hub .flex-cols { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
	.section--hub .flex-col { width: 100%; max-width: 100%; }
	.section--hub .flex-col--size1 { -webkit-order: 2; -ms-flex-order: 2; order: 2; }
	.section--hub .flex-col--size2 { -webkit-order: 1; -ms-flex-order: 1; order: 1; }
	.section--hub .section__content { position: relative; height: 295px; }
	.section--hub .section__aside { text-align: center; margin-bottom: 50px; }

	.section--hub .playground-alt { position: absolute; top: 50%; left: 50%; margin: -184px 0 0 -270px ; }

	.section--hub .section__image { top: 80px; -webkit-transform: translateX(-600px); -ms-transform: translateX(-600px); transform: translateX(-600px);}
}

@media (max-width: 767px) {
	.section--hub { padding: 40px 0; }
	.section--hub .section__aside { padding-left: 0; }
	.section--hub .section__image { top: 50px; -webkit-transform: translateX(-80%); -ms-transform: translateX(-80%); transform: translateX(-80%); }
}

@media (max-width: 479px) {
	.section--hub .section__content { height: 200px; }
}

/* ------------------------------------------------------------ *\
	Section Fonts
\* ------------------------------------------------------------ */

.section--fonts { margin-top: -121px; padding: 200px 0 118px; overflow: hidden; position: relative; z-index: 2; color: #606970; }

.section--fonts .section__inner { position: relative; z-index: 1; }

.section--fonts .section__image { position: absolute; bottom: 0; right: 0; -webkit-transform: translateX(300px); -ms-transform: translateX(300px); transform: translateX(300px); }

.section--fonts .section__title { font-weight: 400; margin-bottom: 13px; line-height: 1.32; max-width: 325px; color: #272c32;}

.section--fonts .section__content p { line-height: 2.15; }

@media (max-width: 1023px) {
	.section--fonts .section__image { -webkit-transform: translateX(60%); -ms-transform: translateX(60%); transform: translateX(60%); }
}

@media (max-width: 767px) {
	.section--fonts { padding: 40px 0; margin-top: 0; }
	.section--fonts .section__content { text-align: center; margin-bottom: 40px; }
	.section--fonts .section__title { margin: 0 auto 20px; }
	.section--fonts .section__image { bottom: -66px; }
}

/* ------------------------------------------------------------ *\
	Section Keynotes
\* ------------------------------------------------------------ */

.section--keynotes { padding: 139px 0 115px; color: #606970; }

.section--keynotes .section__head { text-align: center; margin-bottom: 60px; }

.section--keynotes .section__title { margin-bottom: 12px; color: #272c32; }

.section--keynotes .section__body { margin-bottom: 122px; }

.section--keynotes .section__body .video { margin-bottom: 93px; }

.section--keynotes .section__actions { text-align: center; }

@media (max-width: 1023px) {
	.section--keynotes { padding: 80px 0; }
}

@media (max-width: 767px) {
	.section--keynotes { padding: 35px 0; }
	.section--keynotes .section__head { margin-bottom: 40px; }
	.section--keynotes .section__body .video { margin-bottom: 40px; }
	.section--keynotes .section__body { margin-bottom: 40px; }
}

/* ------------------------------------------------------------ *\
	Side Nav
\* ------------------------------------------------------------ */

.side-nav { list-style: none; position: fixed; top: 50%; right: 27px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 50;  }

.side-nav li {width: 22px; height: 22px; line-height: 22px; text-align: center; }

.side-nav li a { display: inline-block; vertical-align: middle; width: 4px; height: 4px; border-radius: 50%;  background: #272c32; transition: width .3s, height .3s; }

.side-nav li ~ li { margin-top: 11px; }

.side-nav li:hover a { width: 12px; height: 12px; }

.side-nav .current a,
.side-nav .current:hover a { width: 100%; height: 100%; }

@media (max-width: 1023px) {
	.side-nav { right: 20px; }
}

@media (max-width: 767px) {
	.side-nav { display: none; }
}

/* ------------------------------------------------------------ *\
	Slider
\* ------------------------------------------------------------ */

.slider--fonts .slider__slide { padding: 10px 0; }

.slider--fonts .slider__slide-image { height: 85px; line-height: 85px; opacity: .1; transition: opacity .3s; }

.slider--fonts .slider__slide-image span { display: inline-block; vertical-align: middle; font-size: 0; position: relative; }

.slider--fonts .slider__slide-image img { opacity: 1; transition: opacity .3s; }

.slider--fonts .slider__slide-image .active-image { position: absolute; top: 0; left: 0; opacity: 0; transition: opacity .3s; }

.slider--fonts .bx-wrapper { box-shadow: none; border: none; margin: 0; background: none; }

.slider--fonts .active-slide .slider__slide-image img { opacity: 0; }

.slider--fonts .active-slide .slider__slide-image,
.slider--fonts .active-slide .slider__slide-image .active-image { opacity: 1; }

@media (max-width: 767px) {
	.slider--fonts { text-align: center; }
}

@media (max-width: 479px) {
	.slider--fonts .slider__slide-image { height: 65px; line-height: 65px; }
	.slider--fonts .slider__slide-image { display: inline-block; }
	.slider--fonts .slider__slide-image span { width: 80%; }
}

/* ------------------------------------------------------------ *\
	Socials
\* ------------------------------------------------------------ */

.socials ul { list-style: none outside none; font-size: 0; }

.socials li { display: inline-block; vertical-align: middle; }

.socials li ~ li { margin-left: 10px; }

.socials a { display: block; width: 36px; height: 36px; border-radius: 50%; text-align: center; line-height: 36px; position: relative; transition: background .3s; }

.socials a i {  transition: opacity .3s, visibility .3s; }

.socials a .active-show { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 0; visibility: hidden;}

.socials a:hover,
.socials .current a { background: #957fff; }

.socials .current i,
.socials a:hover i { opacity: 0; visibility: hidden; }

.socials .current .active-show,
.socials a:hover .active-show { opacity: 1; visibility: visible; }

/* ------------------------------------------------------------ *\
	Socials Size
\* ------------------------------------------------------------ */

.socials-size { height: 380px; max-width: 380px; overflow: hidden; }

.socials-size .size { position: absolute;  }

.socials-size .socials-size__bg { width: 380px; height: 380px; background-position: center center; position: relative; z-index: 1; background-size: cover; }

.socials-size .socials-size__bg:after { content: ''; position: absolute; top: 50%; left: 50%; border: 500px solid #f8f8f8; box-sizing: content-box; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: 1600ms ease; }

.socials-size .size--instagram ~ .socials-size__bg:after { width: 380px; height: 380px; }

.socials-size .size--facebook ~ .socials-size__bg:after { width: 380px; height: 274px; }

.socials-size .size--twitter ~ .socials-size__bg:after { width: 380px; height: 232px; }

.socials-size .size--pinterest ~ .socials-size__bg:after { width: 236px; height: 380px; }

@media (max-width: 479px) {
	.socials-size { width: 300px; height: 300px; }
	.socials-size .socials-size__bg { width: 300px; height: 300px; }
	.socials-size .size--instagram ~ .socials-size__bg:after { width: 300px; height: 300px; }

	.socials-size .size--facebook ~ .socials-size__bg:after { width: 300px; height: 216px; }
.socials-size .size--twitter ~ .socials-size__bg:after { width: 300px; height: 184px; }
.socials-size .size--pinterest ~ .socials-size__bg:after { width: 236px; height: 300px; }
}

/* ------------------------------------------------------------ *\
	Table
\* ------------------------------------------------------------ */

.table {}

/* ------------------------------------------------------------ *\
	Testimonial
\* ------------------------------------------------------------ */

.testimonials .testimonials__row { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;}

.testimonials .testimonials__row ~ .testimonials__row { margin-top: 61px; }

.testimonials--secondary .testimonials__row ~ .testimonials__row { margin-top: 51px; }

@media (max-width: 767px) {
	.testimonials .testimonials__row { display: block; }
}

/* ------------------------------------------------------------ *\
	Testimonial
\* ------------------------------------------------------------ */

.testimonial { width: 100%; max-width: 432px; font-size: 0; }

.testimonial h5 { color: #fff; font-style: italic; margin-bottom: 8px; }

.testimonial .testimonial__avatar { width: 84px; height: 84px; border-radius: 50%; border: 5px solid rgba(255, 255, 255, .25); overflow: hidden; display: inline-block; vertical-align: middle; }

.testimonial .testimonial__content { display: inline-block; vertical-align: top; width: calc(100% - 84px); font-size: 14px; padding:19px 0 0 19px; }

.testimonial .testimonial__author { color: #fff; }

@media (max-width: 767px) {
	.testimonial { margin: 0 auto; }
	.testimonial ~ .testimonial { margin-top: 30px; }
	.testimonials .testimonials__row ~ .testimonials__row,
	.testimonials--secondary .testimonials__row ~ .testimonials__row { margin-top: 30px; }
	.testimonial .testimonial__content { font-size: 12px; }
}

@media (max-width: 479px) {
	.testimonial { text-align: center; }
	.testimonial h5 { margin-bottom: 10px; }

	.testimonial .testimonial__avatar { margin: 0 auto; display: block; }
	.testimonial .testimonial__content { width: 100%; padding: 10px 5px 0; }

}

/* ------------------------------------------------------------ *\
	Testimonial Secondary
\* ------------------------------------------------------------ */

.testimonial--secondary h5 { color: #606970; margin-bottom: 10px;  }

.testimonial--secondary .testimonial__avatar { border-color: rgba(206, 206, 206, 0.5); }

.testimonial--secondary .testimonial__author { color: #606970; }

/* ------------------------------------------------------------ *\
	Text Box
\* ------------------------------------------------------------ */

.text-box { display: inline-block; vertical-align: middle; border: 1px solid transparent; position: relative; padding: 5px 5px 3px 0;  height: 64px; }

.text-box .text-box-inner { line-height: 1;  }

.text-box:before,
.text-box:after,
.text-box .text-box-inner:before,
.text-box .text-box-inner:after { content: none; width: 11px; height: 11px; border: 1px solid #fff; background: #957fff; border-radius: 50%; position: absolute; }

.text-box:before,
.text-box:after { left: -5px; }

.text-box .text-box-inner:before,
.text-box .text-box-inner:after { right: -5px; }

.text-box:before,
.text-box .text-box-inner:before { top: -5px; }

.text-box:after,
.text-box .text-box-inner:after { bottom: -5px; }

.text-box .typer { color: #957fff!important; display: inline-block; vertical-align: middle; }

.text-box .typer:after { content: ''; color: #957fff; border-left: 2px solid; display: inline-block; height: 45px; vertical-align: middle; -webkit-animation: blink 600ms infinite; animation: blink 600ms infinite; margin-top: -2px; margin-left: 5px; }

/* ------------------------------------------------------------ *\
	Text-box Secondary
\* ------------------------------------------------------------ */

.text-box--secondary { height: 89px; display: block; padding: 13px 23px 3px 17px; border-color: transparent; }

.text-box--secondary .text-box-inner { display: block; }

.text-box--secondary .text-box-typer { display: block; font-family: 'AW-conqueror-inline', sans-serif; font-size: 71px; line-height: 1; color: #03ffc1 !important; display: block; }

.text-box--secondary .text-box-typer:before { content: 'ETERNITY'; font-family: 'AW-conqueror-inline', sans-serif; font-size: 71px; line-height: 1; color: #03ffc1; display: block; opacity: 1; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin-top: 4px;}

.text-box--secondary:before,
.text-box--secondary:after,
.text-box--secondary .text-box-inner:before,
.text-box--secondary .text-box-inner:after { content: ''; width: 17px; height: 17px; border-width: 2px; opacity: 0; }

.text-box--secondary:before,
.text-box--secondary:after { left: -9px; }

.text-box--secondary .text-box-inner:before,
.text-box--secondary .text-box-inner:after { right: -9px; }

.text-box--secondary:before,
.text-box--secondary .text-box-inner:before { top: -8px; }

.text-box--secondary:after,
.text-box--secondary .text-box-inner:after { bottom: -8px; }

/* ------------------------------------------------------------ *\
	Video
\* ------------------------------------------------------------ */

.video { position: relative; overflow: hidden; padding-top: 56.25%; }

.video .video__image { position: absolute; top: 0; left: 0; bottom: 0; right: 0; }

.video .btn { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; }

.video iframe { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; z-index: -1; border: none; }

.video .play { z-index: 1; }

.video .played { opacity: 0; }

/* ------------------------------------------------------------ *\
	Widget
\* ------------------------------------------------------------ */

.widgets { list-style: none outside none; }

.popup {
	background-color: #fff;
	text-align: center;
	color: #2a2a2a;
	margin: auto;
	border: 6px solid #f4f4f4;
	padding: 50px;
	position: inherit;
	font-family: 'Arial', sans-serif;
	font-size: 16px;
	line-height: 1.9;
	display: table;
}

.popup .form-row {
	width: 250px;
	text-align: right;
	margin: 0 auto 11px;
}

.popup .form-row input {
	width: 100%;
	height: 40px;
	padding: 0 13px;
	border-radius: 0;
	border: 1px solid #dddddd;
	font-family: 'Arial', 'Helvetica', sans-serif;
	font-size: 16px;
	color: #2a2a2a;
	transition: border-color .2s ease-out;
}

.popup .form-row input:focus {
	border-color: #949494;
}

.popup .form-row a {
	display: inline-block;
	vertical-align: top;
	margin-top: 5px;
	font-size: 12px;
}

.popup a {
	text-decoration: none;
	color: #957fff;
}

.popup-head {
	margin-bottom: 30px;
}

.popup-head h1 {
	font-family: 'Helvetica Neue', 'Arial', sans-serif;
	font-size: 57px;
	line-height: 1;
	font-weight: bold;
	letter-spacing: -.06em;
	margin-bottom: 10px;
}

.popup-body {
	margin-bottom: 30px;
}

.popup-foot {
}

.popup-foot a.btn {
	text-decoration: none;
	color: #fff;
	padding: 5px;
	width: 250px;
}

#btn--sign-in-container {
	margin-bottom: 15px;
}

/*! CSS Used from: https://app.liveswap.com/static/css/main.4da86ab2.css */
*,:after,:before{padding:0;margin:0;outline:0;-webkit-box-sizing:border-box;box-sizing:border-box;}
header,nav{display:block;}
svg:not(:root){overflow:hidden;}
a{cursor:pointer;}
nav ul{list-style:none outside none;}
a{color:inherit;-webkit-transition:.2s;-o-transition:.2s;transition:.2s;}
a{text-decoration:none;}
ul{margin-bottom:1.3em;}
ul:last-child{margin-bottom:0;}
.header2{position:fixed;top:0;left:0;z-index:10;width:100%;border-top:2px solid #957fff;background:#fff;}
.header2,.header2 .header__aside{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:stretch;align-items:stretch;-ms-flex-flow:row nowrap;flex-flow:row nowrap;}
.header2 .header__aside a{position:relative;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:67px;height:68px;padding:0 23px;}
.header2 .header__aside .header-logo{width:67px;border-right:1px solid #eaeaea;}
.header2 .header__aside .header-logo path{fill:#d7dadc;-webkit-transition:fill .5s;-o-transition:fill .5s;transition:fill .5s;}
.header2 .header__aside .logo{font-size:0;text-decoration:none;pointer-events:none;}
.header2 .header__aside .header-logo .logo path{fill:#957fff;fill-opacity:1;}
.header2 .header__aside a:not(.logo):hover path{fill:#2a2a2a;fill-opacity:1;}
.header2 .header__content{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;-ms-flex-flow:row nowrap;flex-flow:row nowrap;width:100%;}
.header2 .nav{margin-left:43px;}
.header2 .header__actions{margin-right:30px;}
.header2 .header__actions ul{font-family:Open Sans,sans-serif;list-style-type:none;display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;-ms-flex-flow:row nowrap;flex-flow:row nowrap;font-size:13px;}
.header2 .nav>ul>li>a:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:#957fff;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;}
.header2 .nav>ul>li>a.active:after{left:0;width:100%;}
.nav{font-size:13px;font-weight:400;color:#8b949b;}
.nav>ul{font-family:Open Sans,sans-serif;display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;-ms-flex-flow:row nowrap;flex-flow:row nowrap;}
.nav>ul>li{position:relative;}
.nav>ul>li+li{margin-left:33px;}
.nav>ul>li>a{line-height:24.5px;position:relative;display:inline-block;padding:21px 5px 22px;}
.nav>ul>li>a:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:#202020;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;}
.nav>ul>li:hover>a,.nav>ul>li>a.active{color:#957fff;}
.header2 .header__aside .header-logo .ico-logo path {
	fill: #957fff;
	fill-opacity: 1;
}
.header2 .header__actions a.btn--primary { font-weight: 600; padding: 9px 20px 11px; font-size: 14px; }
.header2 .header__actions > ul > li + li { margin-left: 25px; }

@media (max-width: 767px) {
	.header2 {
		justify-content: space-between;
		align-items: center;
		padding-right: 15px;
	}
}

.header2 .header__content > .nav ul li.updates-mobile { visibility: hidden; display: none; margin: 0; }

@media ( max-width: 1023px ){
	.header2 .header__content { justify-content: space-between; }

	.header2 .header__content > .nav ul li:not(.updates-mobile) { visibility: hidden !important; display: none !important; }
	.header2 .header__content > .nav ul li.updates-mobile { visibility: visible; display: block; }
	.header2 .header__content > .nav ul { height: 50px; }
}

@media ( max-width: 767px ){
	.header2 { justify-content: space-between; align-items: center; padding-right: 15px; }
	.header2 .scroll-hide { display: none !important; }

	.header2 .header__actions__drop_down { display: none; }
	.header2 .header__actions ul { justify-content: flex-end !important; height: 50px; }
	.header2 .header__content { display: block; height: 50px; }
	.header2 .header__actions { margin-right: 0 !important; }

	.header2 .header__aside a { width: 50px; height: 50px; padding: 0 10px; }
	.header2 .header__aside .header-logo { width: 50px; }
}

/*! CSS Used from: http://dev.liveswap.com/static/css/main.545c717d.css */
*,:after,:before{padding:0;margin:0;outline:0;-webkit-box-sizing:border-box;box-sizing:border-box;}
svg:not(:root){overflow:hidden;}
a{cursor:pointer;}
a{color:inherit;-webkit-transition:.2s;-o-transition:.2s;transition:.2s;}
a{text-decoration:none;}
ul{margin-bottom:1.3em;}
ul:last-child{margin-bottom:0;}
.header2 .nav{margin-left:43px;}
.header2 .header__actions{margin-right:30px;}
.header2 .header__actions ul{font-family:Open Sans,sans-serif;list-style-type:none;display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;-ms-flex-flow:row nowrap;flex-flow:row nowrap;font-size:14px;}
.header2 .header__actions .username{color:#606970;font-weight:500;padding-right:10px;}
.header2 .header__actions .username path{fill:#606970;}
.header2 .header__actions .username:hover{color:#957fff;}
.header2 .header__actions .nav__dropdown{left:-120px;-ms-flex-direction:column;flex-direction:column;}
.header2 .header__actions .nav__dropdown li{width:100%;}
.header2 .header__actions a:hover path{fill:#957fff;}
.header2 .header__actions .ico-arrow-down{margin-right:-10px;margin-left:10px;}
.header2 .nav>ul>li>a:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:#957fff;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;}
[class^=ico-]{display:inline-block;vertical-align:middle;font-size:0;}
.nav{font-size:14px;font-weight:400;color:#8b949b;}
.nav>ul{font-family:Open Sans,sans-serif;display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;-ms-flex-flow:row nowrap;flex-flow:row nowrap;}
.nav>ul>li{position:relative;}
.nav>ul>li>a{line-height:24.5px;position:relative;display:inline-block;padding:21px 5px 22px;}
.nav>ul>li.has-dropdown>a:after{content:none;}
.nav .ico-arrow-down{margin-left:4px;}
.nav>ul>li>a:after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:#202020;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;}
.nav>ul>li:hover>a{color:#957fff;}
.nav>ul>li:hover>a .ico-arrow-down path{fill:#957fff;}
.nav>ul>li:hover ul{opacity:1;visibility:visible;}
.nav .nav__dropdown{position:absolute;top:100%;left:-4px;z-index:2;width:191px;padding:15px 0 10px;border:1px solid #e8e8e8;border-radius:6px;background:#fff;margin-top:-14px;opacity:0;visibility:hidden;-webkit-transition:.3s;-o-transition:.3s;transition:.3s;}
.nav .nav__dropdown li{margin-bottom:8px;}
.nav .nav__dropdown a{display:block;padding:5px 19px;}
.nav .nav__dropdown a:hover{background:#957fff;color:#fff;}

#footer__sign_up_graphic_design,
#footer__sign_up_a_library { text-align: center; }

#footer__sign_up a,
#footer__sign_up_graphic_design a,
#footer__sign_up_a_library a { font-size: 14px; font-weight: 600; }

#form--sign-in-error {
	width: 250px;
	background-color: #F7D6D6;
	color: #CE5856;
	font-weight: bold;
	font-size: 12px;
	border-radius: 5px;
	padding: 10px;
}

@media (max-width: 1023px) and (min-width: 768px) {
	.hidden-sm {
		display: none !important;
	}
}

#cookie-check-popup { width: 750px; }
#cookie-check-popup .form-row { width: 100%; text-align: center; }
#cookie-check-popup .form-row a { font-size: inherit; }
#cookie-check-popup #btn--cookie-check-container input.btn--primary { width: 175px; }
#cookie-check-popup #form--cookie-check-error { color: red; margin-top: 30px; }