* {box-sizing: border-box; padding:0;margin:0; border-color: #ddd}

html {font-family:ubuntu, Tahoma, Geneva; font-size:10px;overflow-y: scroll;}
body {font-size:1.6rem}


/*
    u(til)-namspace
*/
.u-none {display:none}
.u-block {display:block}
.u-padding {padding:0.5rem}
.u-padding-l {padding:1rem}
.u-padding-xl {padding:2rem}
.u-pointer {cursor:pointer}
.u-border {border: 1px solid; border-color: inherit}       /* the color if take from (.t-site) * {border-color: #...} */
.u-margin-1 {margin:-1px 0 0 -1px}
.u-right {text-align:right}
.u-center {text-align:center}
.u-left {text-align:left}
.u-float-right {float:right}
.u-abs-right {position:absolute;right:0}
.u-ellipsis {display:block;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.u-underline {text-decoration: underline;}

.u-text-xs {font-size:60%}
.u-text-s {font-size:70%}
.u-text-r {font-size:100%}
.u-text-l {font-size:120%}
.u-text-xl {font-size:140%}
.u-space-l {letter-spacing:4px}

.u-hide-desktop {display: none !important}
.u-hide-mobile {display: block !important}
.u-hide-desktop-inline {display: none !important}
.u-hide-mobile-inline {display: inline-block !important}
@media screen and (max-width: 750px) { /* Mobile */
	.u-hide-desktop {display: block !important}
	.u-hide-mobile {display: none !important}
	.u-hide-desktop-inline {display: inline-block !important}
	.u-hide-mobile-inline {display: none !important}
}
/*
    o(bject)-namespace
*/

/* o-grid */
.o-grid {display:block;width:100%}
[class*='o-grid-soft'], [class*='o-grid-hard'] {  display: inline-block; vertical-align: top; position: relative; }
.o-grid-soft-0, .o-grid-hard-0 { display: none }
.o-grid-soft-1, .o-grid-hard-1 { width: 8.3333% }
.o-grid-soft-2, .o-grid-hard-2 { width: 16.6666% }
.o-grid-soft-3, .o-grid-hard-3 { width: 25% }
.o-grid-soft-4, .o-grid-hard-4 { width: 33.3333% }
.o-grid-soft-5, .o-grid-hard-5 { width: 41.6666% }
.o-grid-soft-6, .o-grid-hard-6 { width: 50% }
.o-grid-soft-7, .o-grid-hard-7 { width: 58.333% }
.o-grid-soft-8, .o-grid-hard-8 { width: 66.6666% }
.o-grid-soft-9, .o-grid-hard-9 {  width: 75% }
.o-grid-soft-10, .o-grid-hard-10 { width: 83.3333% }
.o-grid-soft-11, .o-grid-hard-11 { width: 91.6666% }
.o-grid-soft-12, .o-grid-hard-12 { display: block; width: 100% }
.o-grid-soft-10-wide { width: 83.3333%; margin-left: 8.3333%;margin-right: 8.3333%}

.o-grid-gutter { margin-left:-1rem; width: calc(100% + 2rem)}
.o-grid-gutter > [class*='o-grid-soft'], .o-grid-gutter > [class*='o-grid-hard'] {padding: 0 1rem;}
.o-grid-bottom [class*='o-grid-soft'], .o-grid-bottom [class*='o-grid-hard'] { vertical-align: bottom; }

@media screen and (max-width: 750px) { /* Mobile */
	[class*='o-grid-soft'] {display:block;width:100% !important;}
	.o-grid-soft-no-padding {padding-left:0 !important;padding-right: 0 !important;}
}


.t-staff [class*='o-grid-soft'], .t-staff [class*='o-grid-hard'] {  vertical-align: middle;  } 

a {text-decoration:none}

.t-width {max-width:200rem;margin:0 auto;padding:0 5rem}
@media screen and (max-width: 750px) { /* Mobile */
	.t-width {padding:0 2.5rem;}
	.t-staff .t-width {min-width:720px}
	.t-staff  aside.c-side {width:51%}
}
header {padding:2rem;margin-bottom:2rem; color:white}
header svg {width:240px;position:absolute;fill:white}
header.t-attendee svg {position:relative}
.t-homepage header {position:absolute}
header nav {text-align:right;font-size:2.4rem}
header nav nav {display:inline-block;margin:1rem 0 1rem 4rem;position:relative}
header nav nav.is-selected {background:#E3762D}
header nav div {display:none;position:absolute;text-align:left;padding:1rem 0;width:100%;background:#E3762D;z-index:2}
header nav a {display:block;padding:0.5rem;color:white;cursor:pointer}
header nav a .mdi {display:inline-block;padding-left:1rem;font-size:3rem}
header nav a.is-selected {border-bottom:1px solid white}

.t-dms-login {width:40rem;margin:5rem auto}
.t-dms-login .o-box-val > div {padding:1rem 0}
.t-dms-login a.o-box-action {display:inline-block;margin:2rem auto 0 auto;border:1px solid #aaa;padding:0.25rem 1rem;border-radius:5px}

body.t-staff, body.t-staff aside.c-side {font-size:2rem;background:#F08D24; color:#9D3712; }
.t-staff * {border-color:#9D3712}
@media screen and (max-width: 750px) { /* Mobile */
	html.t-staff {font-size:6px}
	html.t-staff header svg {width:50%;position:relative}
}
body.t-attendee, body.t-attendee aside.c-side {font-size:2rem;background:#6EC5F8; color:#457B9B; color:rgba(0,0,0,.5)}
.t-attendee * {border-color:#fff}
.t-staff a, .t-attendee a {color:white}
.t-white {color:white}

.t-attendee h1, .t-attendee h2, .t-attendee p {font-weight :normal; line-height:1.4}
.t-attendee h2 {padding:2rem 0; }
.t-attendee p {padding-top:0.5rem; font-weight:100}
.t-attendee h1 + p {padding-top:2rem; }		/* before rich text */
.t-attendee a.is-selected {border-bottom:1px solid white}
aside.c-side {position:fixed;top:0;bottom:0;right:0;z-index:1;width:480px;max-width:75%;z-index:3;background:white;overflow:auto}
aside.c-side {border-left:1px solid #9d3712;box-shadow:-2px 0 13px #9d3712}
.t-attendee aside.c-side {border-left:1px solid #457B9B;box-shadow:-2px 0 13px #457B9B}
aside.c-side {transition:all 0.3s ease; }
aside.c-side:empty {transform: translate(110%, 0)}
aside a.c-side-close {position:absolute;right:2rem;top:1.5rem;}

aside.c-side .o-dms .o-box-head, aside.c-side .o-dms .o-box-val, aside.c-side .o-dms .o-box-head span ~ .o-box-action {background:inherit}
.c-tbl-title { color:white; transform: translate(-100%, 0) rotate(-90deg) scale(1.5, 1.5); transform-origin: top right; padding: 1rem;	position: absolute;}
.c-tbl-title + div { margin-left:6rem;}
.t-staff div.c-tbl-event > div:first-child, .t-staff div.c-tbl-room > div:first-child {font-weight:100;font-size:75%;opacity:1}
.t-attendee div.c-tbl-event, .t-attendee div.c-tbl-01  {font-size:2.7rem;position:relative}
div.c-tbl-event > div, div.c-tbl-01 > div, div.c-tbl-room > div {border-bottom: 1px solid; border-color:inherit}
div.c-tbl-room > div:last-child {border-bottom: 0px}

.t-staff div.c-tbl-event > div > div {padding:2rem; }
.t-staff div.c-tbl-room > div > div {padding:1.5rem; }

.t-attendee div.c-tbl-event div.c-detail div.u-text-s {padding-bottom:2rem}
.t-attendee div.c-tbl-event div.c-detail div[class*='o-grid'] {padding:0rem 1rem 1rem 0;line-height:1.3}

.t-attendee .c-tbl-01 {padding-bottom:10rem;}
.t-attendee .c-tbl-01 .c-tbl-td {padding: 3rem 2rem 3rem 0}
.t-attendee .c-tbl-01 .c-tbl-td.o-grid-soft-60-40 > div {padding-right:1rem; line-height:1.4}
.t-attendee .c-tbl-01 .mdi {display:inline-block;padding:0 0 0 2rem;}
.t-attendee .c-tbl-01 .mdi:before {transform: scale(1.75);}
.t-attendee .c-tbl-01 .c-detail > div {padding:3rem 0 1rem 0}

div.c-tbl-event .mdi {display:inline-block;padding:0 0 0 2rem }
div.c-tbl-event .mdi:before {transform: scale(1.75); }

div.c-tbl-room {min-height:14rem}

div.o-table {display:table;width:100%}
div.o-table > div {display:table-row}
div.o-table > div > div {display:table-cell;padding:0.5rem}

.t-staff .c-button {display:inline-block;padding:1rem;background:#9D3712; color:#F08D24;white-space:nowrap}
.t-staff .c-button + .c-button {margin-left:1rem}
/*div.c-event > div:first-child > div {padding:0.1rem 0.5rem}*/

.c-side .o-dms .o-box-head {color:white;font-size:120%;padding:1rem 1rem 1rem 1.5rem;border-bottom:1px solid white}
.c-side .o-dms .c-key-wrap {padding: 1rem 2rem; color: #9D3712}
.c-side .o-dms .c-key-head {font-size:75%;padding-bottom:0.5rem}
.c-side .o-dms .c-key-val:empty:after {content: "\200b"; /* unicode zero width space character */}
.c-side .o-dms .c-key-val input {font-size:inherit;border-width:0 0 1px 0;border-color:#9D3712;border-radius:0;width:100%; max-width: 100%;background-color:inherit;color:white}
.c-side .o-dms .c-key-val select {font-size:inherit;border-width:0 0 1px 0;border-color:#9D3712;border-radius:0;width:100%; max-width: 100%;background-color:inherit;color:white}
.c-side .o-dms .c-key-val select {padding:0}
.c-side .o-dms .c-key-val select.t-dms { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%239D3712'><polygon points='0,0 100,0 50,50'/></svg>");}
.c-side .o-dms .c-key-val input {padding:0;margin-top:-1px}
.c-side .o-dms .c-key-val.data-desc {max-height:12rem;overflow:auto}
.c-side .c-box-action {text-align:right;padding:2rem}
.c-side .c-box-action:empty {display:none}

.c-side .o-dms .c-key-val textarea {height:6em;font-size:inherit;border-width:0 0 1px 0;border-color:#9D3712;border-radius:0;width:100%; max-width: 100%;background-color:inherit;color:white}
.c-side .o-dms .o-box {border:0}
.Zebra_DatePicker_Icon_Wrapper {width:100%}


.c-line-white:after { content: ""; display: block; width: 1px; background: white; height: 64%; position: absolute; right: 2rem; top: 18%;}
@media screen and (max-width: 750px) {
	.c-line-white:after { width: 100%; background: white; height: 1px; position: absolute; left:0; right:auto; top:auto; bottom:0; opacity:0.5}
}

.c-video-pop {position:fixed;bottom:2rem;left:2rem;width:60vw;padding-bottom:33.3%;background:rgba(255,255,255,0.5)}
.c-video-pop a { display: block; cursor:pointer; text-align: right; position: absolute; left: 0; width: 100%; top: -1.4em; font-size: 3rem;background: #9D3712; padding: 0.5rem;}
.c-video-pop iframe {position:absolute;left:0;top:0;width:100%;height:100%}
.c-video-inside {padding-bottom:56.25%;}
.c-video-inside iframe {position:absolute;left:0;top:0;width:100%;height:100%}

.event-showcase__background {position:fixed;z-index:-1;bottom:0;right:16%;width:50%;height:auto;fill:#4facef}

.c-stream {display:inline-block;padding:1rem 0;margin-right:10rem}
.c-stream a {display:inline-block;padding:1.2rem 1rem 1rem 1rem;border:1px solid white}
.c-stream a.is-selected {background-color:rgba(255,255,255,0.3);}
@media screen and (max-width: 750px) {
	.c-stream, .c-stream a {display:block; margin:0}
}

.c-form-code {padding:1rem 0}
.c-form-code input {outline:0;display:block;font-size:2.5rem;padding-top:1rem;color:inherit;border:1px solid currentColor;border-width:0 0 1px 0;width:20rem;max-width:none;background:transparent}
.c-form-code a {display:inline-block;color:#6EC5F8;background:white;padding:1.5rem 6rem;margin-top:2rem}
.c-tbl-02 a {display: inline-block; color: #6EC5F8; background: white; padding: 1rem 1rem; margin-top: 1rem; font-size: 1.8rem; width: 100%; text-align: center; max-width: 12rem;}
.c-form-manuallogin input {width:40rem;padding:1rem 0.2rem 0.5rem 0.2rem}
.c-form-manuallogin input:invalid {box-shadow: none; border-bottom:1px solid red}
.js-link a, .c-rich a {color:inherit;text-decoration:underline}



/* video, iframe, chat,.... container, ex: <div.o-iframe.o-iframe-16-9><div style='padding:...'><iframe>...</iframe></div></div> */
.o-iframe {position: relative;	}
.o-iframe-16-9 {padding-bottom: 56.25%;}
.o-iframe-mh-560 {min-height:560px;}
.o-iframe > *, .o-iframe iframe { padding: 0 !important; position: absolute !important; top: 0; width: 100%; height: 100%; left: 0;}


.t-homepage header {position:absolute;width:100%}
.t-homepage .c-padding {padding:3em 0 0 0}
.c-homepage-01 {font-size:6rem;max-width:100rem;padding:0 2em 2em 10%;line-height:1.4;font-weight:bold}
.c-homepage-02 {font-size:3rem;padding:2em;margin-top:-5em;line-height:1.4}
@media screen and (max-width: 750px) {
	.c-homepage-01 {font-size:4rem}
	.c-homepage-02 {margin-top:1em}
}
@media screen and (min-width: 750px) {
	.c-auto-height-01 {height:calc(100vh - 120px);overflow:auto;}
}
section.t-white {background:white;color:black}
section.t-white a {color:black}
footer {background:#3A3A3A;color:white;font-size:1.4rem;padding:4rem 2rem 10rem 2rem;line-height:4rem;text-align:center}
footer div.o-grid-soft-4 {padding:2rem 0;vertical-align:middle}
footer .c-links a {font-size:1.5rem;display:inline-block;padding:0 2rem 2rem 2rem}
footer .c-links a.mdi {font-size:3rem;}

.js_intersect {transition:transform 0.8s ease;transform:translate(0,0)}
/*.js_intersect + .js_intersect {transition-delay: 0.2s; }*/
.js_intersect-01 {transform:translate(-50%,0)}
.js_intersect-02 {transform:translate(50%,0)}

.o-admin-status { position: fixed;padding: 1rem 3rem;background: white; color:red; top: 1rem; left:50%; transform:translate(-50%, 0); z-index:2 }