html, body, div, span, applet, object,iframe, h1, h2, h3, h4, h5, h6, p, blockquote,pre, a, abbr, acronym, address, big, cite,code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b,u, i, center, dl, dt, dd, ol, ul, li, fieldset,form, label, legend, table, caption, tbody,tfoot, thead, tr, th, td, article, aside,canvas, details, embed, figure, figcaption,footer, header, hgroup, menu, nav, output, ruby,section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;box-sizing:border-box;}
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
body {-webkit-text-size-adjust: none;}
mark {background-color: transparent;color: inherit;}
input::-moz-focus-inner {border: 0;padding: 0;}
input, select, textarea {-moz-appearance: none;-webkit-appearance: none;-ms-appearance: none;appearance: none;}
/*************************************/
/* Shared */
h1 {font-size:40px;font-weight:200;}
h2 {margin-bottom:24px;font-size:50px;font-weight:700;}
h3 {margin-bottom:24px;font-size:28px;font-weight:700;}
h4 {margin-bottom:24px;font-size:22px;font-weight:700;}
p {margin-bottom:24px;}
b {font-weight:bold;}
i {font-style:italic;}
.courier {font-family: 'Courier Prime', 'Courier New', Courier, monospace;}
.kalam {font-family: 'Kalam', cursive;font-weight:700;position:relative;top:0.05em;}


/*************************************/
/* Public */
body {font-family:'Roboto', Arial, Helvetica, sans-serif;line-height:1.2;}

.hold { width:100%;max-width:900px;height:100%;margin:auto; }
.hold.flex { display:flex;justify-content:center; }

header.site { height:80px;width:100%;background:#38f;position:relative;box-shadow:0px 0px 10px #000;z-index:10; }
header.site #logo { display:flex;flex:2; }
header.site #logo .logo { display:block;width:260px;background:url('/img/logonew.png') no-repeat center;background-size: auto;background-size:contain;margin-left:30px; }
header.site nav#top {display:flex;align-items:center;}
header.site nav#top li {float:left;margin-right:24px;text-transform:uppercase;letter-spacing:1px;list-style:none;}
header.site nav#top a {font-size: 20px;color:#cee;text-decoration:none;text-shadow:1px 1px 2px #000a;transition:0.1s color ease-in-out;}
header.site nav#top li.current_page_item a {color:#fff;border-bottom: 1px solid #fff;}
header.site nav#top a:hover {color:#fff;}

footer.public {background:#222;color:#ddd;}
footer .divider {width: 50vw;margin: 0 auto; padding-bottom:1em;}
footer .divider.full {width: 100vw;}
footer .jslogo {display:block;height:100px;width:100px;background:url('/img/js-white-250px.png') no-repeat center;background-size: contain;}
footer .ytlogo {height:100px;width:300px;background:url('/img/developed-with-youtube.png') no-repeat center;background-size: contain;}
footer .pslogo {display:block;height:100px;width:100px;background:url('/img/protostar-white-250px.png') no-repeat center;background-size: contain;}
footer li {float:left;margin-right:1em;}
footer li::after {content:'|';margin-left:1em;}
footer li:last-child {margin-right:0;}
footer li:last-child::after {content:none;margin-left:0;}
footer a {color:#ccc;text-decoration:none;}


/* Pages */
article.page header {position: relative;width:100%;height:calc(75vw*9/16);background:url('/img/canvas-1.png') center;background-size:cover;overflow: hidden;}
article.page header {height:50vh;}
article.page h1 {position:absolute;bottom:25px;left:max(0.5em, 50vw - 450px + 0.4em);color:#fffe;text-shadow:1px 1px 2px #000;}
article.page .entry-content, .page-inner {width:100%;max-width:900px;min-height:80vh;padding:0em 1em;box-sizing:border-box;margin:1em auto;}

.video-canvas.home {background:#111;}
.video-canvas .player { position:relative;height:80vh;width:calc(80vh*1.78);max-width:100vw;background:#5148d3;margin:auto;box-shadow:0 0 20px #000; }
.video-canvas p {position:relative;top:60%;left:5%;color:#fff;font-size:5vh;line-height:1.3;display:inline-block;opacity:0.9;}
.video-canvas p .line {background:#111;padding:3px;border-radius:3px;user-select:none;float:left;clear:left;}
.video-canvas p .line .i {font-style:italic;font-weight:700;}
.video-canvas p .line .y {color:#ff0;}
.video-canvas h2 { position: absolute; text-align: center; font-size: 3em; }
.video-canvas .bar {position:absolute;bottom:0;width:100%;height:50px;margin:auto;background:linear-gradient(180deg, #0000 0%, #0003 100%);}
.video-canvas .bar .prog { width:96%;margin:auto;height:4px;background:#cccc; }
.video-canvas .bar .prog .red {background:#e11;width:30%;height:100%;}


.divider {display:flex;justify-content:center;}
.divider .wp-block-group__inner-container, .divider .inner {margin-bottom:40px;}
.divider .node {display:flex;flex: 1;justify-content:center;}
.feature-set {text-align:center;border:1px solid #ccc;margin:5%;padding:5%;}
.feature-set h3 {text-align:center;margin:20px;font-weight:700;font-size:36px;font-family:'Kalam',cursive;}
.feature-set img {height:150px;}
.feature-set .details {text-align:left;}
.feature-set .price {padding:5px;background:#d50;color:#fff;border:1px solid #c40;margin-bottom:10px;font-family:'Kalam',cursive;font-size: 1.4em;display:inline-block;border-radius:4px;}
.feature-set.cc {box-shadow:-10px -10px 0 #f0a;}
.feature-set.fmt {box-shadow:-10px -10px 0 #fd0;}
.feature-set.tr {box-shadow:-10px -10px 0 #0cf;}
.space {border-top:1px solid #ccc;}
.space .wp-block-group__inner-container, .space .inner {padding:32px;}

/* Home Page Form */
.space-contact, .space-pipeline {background:#38f;color:#fff;}
.space-contact p {text-align:center;}
.space-contact form {overflow:hidden;transition:height .3s ease;}
.space-contact form.success {height: 0em;}
.space-contact input, .space-contact textarea, .space-contact select {display: block;font-size: 1.2em;padding: 0.5em;font-family: 'Roboto', Arial, sans-serif;margin: 0.7em 0;width: 50%;border: 2px solid #446;border-radius: 4px;transition: border-color .1s ease;}
.space-contact button/*, .space-contact a*/ {font-size: 1.2em;font-family: Roboto;width: 25%;background: #fff;border: 2px solid #446;padding: 5px;}
.space-contact textarea {resize:vertical;}
.space h2 {text-align:center;}
.space input:active, .space input:hover:active {border-color: #99f;}
.space input:hover {border-color: #55a;}
.space input:focus {border-color: #77f;}
.space-contact .reply {text-align: left;margin: 2em 0;background: #222;display: inline-block;padding: 1em;}
.space-contact .status {padding: 0px;background: #359;color: #fff;margin: 10px auto;width: 30%;text-shadow: 1px 1px 2px #0005;border-radius: 5px;transition: padding .3s ease;}
.space-contact .status.error {padding: 10px 0px;background: #933;}
.space-contact .status.success {padding: 10px 0px;background: #395;}
.space-contact .extra {margin-top: 1em;}

/* Header Visibility */
#post-24 header, #post-19 header {display:none;}

/* Responsive */
@media (max-height:632px) and (min-width:901px) {
    .video-canvas .player { width:900px;height:506px; }
    .video-canvas p {font-size:32px;}
}

@media (max-width:900px) {
    .video-canvas .player { width:90vw;height:calc(90vw*0.5625); }
    .video-canvas p {font-size:28px;}

    .divider, .divider .node {display:block;}
    .space-contact input, .space-contact textarea, .space-contact select {width:100%;}
    .space-contact button, .space-contact a {width: 100%;}

    footer .divider {width:100vw;margin-left:0;}
    footer .colophon {padding-bottom:2em;text-align:center;}
    footer .partners {text-align:center;}
    footer .partners .node {display:inline-block;}
}


/*************************************/
/* Private */
body#private {background:#333;}
body#private #dashboard {margin:30px auto;width:1024px;background:#777;display:flex;box-shadow:0px 2px 10px #000;border-radius:5px;overflow:hidden;}
body#private #dash-menu {display:flex;flex:1;border-right:1px solid #222;}
body#private #dashboard .menu-dashboard-container, body#private #dash-menu li {width:100%;}
body#private #dash-menu a {color:#eee;text-decoration:none;display:block;padding:10px;box-sizing:border-box;border-right:0px solid #2d3;transition:0.1s ease border-right;background:#444;}
body#private #dash-menu a:hover {background:#222;color:#fff;border-right: 4px solid #2d3;}
body#private #dash-menu .current-menu-item a {background:#222;border-right:4px solid #dd2;}
body#private #dashboard #content {display:flex;flex:4;}