@charset "utf-8";
/* CSS Document */
	/* TypeKit Legend
	(medium) font-family: "skolar-sans-latin",sans-serif; font-style: normal; font-weight: 500;
	(semibold) font-family: "skolar-sans-latin",sans-serif; font-style: normal; font-weight: 600;
	(bold) font-family: "skolar-sans-latin",sans-serif; font-style: normal; font-weight: 700;
	(extrabold) font-family: "skolar-sans-latin",sans-serif; font-style: normal; font-weight: 800;
	*/
/* CSS reset */
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;
}
* {
	margin: 0;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
*, *::before, *::after {box-sizing: border-box;}
html {
	scroll-behavior: smooth;
	scroll-padding-top: 3rem;
}
:root {
    --maincolor: hsla(327, 54%, 46%, 1);
    --spotcolor: hsla(60, 86%, 67%, 1);
    --linkcolor: hsla(328, 71%, 20%, 1);
    --hovercolor: hsla(331, 81%, 35%, 1);
    --lightcolor: #f3f363;
}
.skip-to-content {
	background: #ccc;
	padding: .3rem .5rem;
	border-radius: 0 0 .25rem .25rem;
	position: absolute;
	left: .25rem;
	transform: translateY(-120%);
	transition: transform 325ms ease-in;
}
.skip-to-content:focus {
	transform: translateY(0);
}
a.skip-to-content:focus {
	color: var(--linkcolor);
	text-decoration: none;
}
/* ============================================== headers ============================================== */
h1, h2, h3, h4, h5 {
	font-family: "skolar-sans-latin",sans-serif;
	font-style: normal;
	font-weight: 700;
    color: var(--maincolor);
}
h1 {
    font-size:2.2rem;
    line-height:2.2rem;
    margin:0 0 1.5rem 0;
}
h2 {
    font-size:1.64rem;
    line-height:1.8rem;
    margin:0 0 1rem 0;
}
h3 {
    font-size:1.42rem;
    line-height:1.5rem;
    margin:1.25rem 0 0.75rem 0;
}
h4 {
    font-size:1.25rem;
    line-height:1.35rem;
    margin:1rem 0 .25rem 0;
}
.withsub {
    margin-bottom:.75rem;
}
.assub {
    margin-bottom:1.75rem;
}
h2.workshop-header {
    margin:2rem 0 .25rem 0;
}
h3.workshop-header {
    margin:0 0 1rem 0;
}
.reverse-header {
    width:100%;
    background-color:#ccc;
    text-transform:uppercase;
    font-weight:600;
    padding:.5em 0 .5em .5em;
    margin:1.75em 0 1em 0;
			position: sticky;
			top: 0; /* otherwise seeing a gap above in at least Firefox. */
			z-index: 1000;
}
.workshop-header a {
    color: var(--maincolor);
    text-decoration:none;
}
.workshop-header a:hover {
    color:var(--maincolor);
    text-decoration:none;
}
.workshop-header a:active {
    color:var(--spotcolor);
    text-decoration:none;
}

/* ============================================== regions ============================================== */
body {
    font-size: .9rem;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    line-height: 1.4rem;
}
.container {
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    max-width: 60rem;
}
header {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 12vw 8vw 18vw 18vw;
	grid-template-areas:
		"txt-1"
		"txt-3"
		"img-2"
		"img-3";
	/*align-items: center;*/
	/*height: 36vh;*/
    max-height: 400px;
    background-color: var(--maincolor);
    background: url("images/banner-background.png") no-repeat ;
	background-size: cover;
    background-position: right;
	overflow: hidden;
	font-weight:700;
	font-family: montserrat, sans-serif;
    text-shadow: -4px 1px 1px #000;
	position: relative;
	animation: fadein .75s ease;
}

.one-col-grid {
    display: grid;
    grid-template-columns: 1fr;
}
.two-col-grid {
    display: grid;
    grid-template-columns: 1fr;
	margin: 2em 0;
}
.three-col-grid {
    display: grid;
    grid-template-columns: 1fr;
}

.logo-txt-1 {
    grid-area: txt-1;
	color: var(--spotcolor);
	font-size: clamp(1.3rem, 8vw, 3rem);
	align-self: center;
	text-align: center;
}
.logo-txt-3 {
    grid-area: txt-3;
	color: var(--spotcolor);
	font-size:clamp(1rem, 6vw, 3rem);
	align-self: center;
	text-align: center;
}
.logo-img-2 {
    grid-area: img-2;
	background-image: url("images/banner-converge.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: bottom center;
	margin-bottom: -9px;
}
.logo-img-3 {
    grid-area: img-3;
	background-image: url("images/banner-transform.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: bottom center;
}

nav {
    grid-column: 1 / -1;
	height:auto;
	line-height: 3.25em;
	margin:.25vh 0;
	text-align:center;
	text-transform:uppercase;
	font-size: .75rem;
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
	border-top: 2px solid black;
}
nav a {
	display:block;
    border: none;
    border-radius: 3px;
	background-color: var(--maincolor);
    color: white;
	font-weight: bold;
	margin: 0.25vh 1vw;
	text-decoration:none;
}
nav a:hover {
	color: var(--lightcolor);
	text-decoration:none;
}
nav a:active {
	color: var(--lightcolor);
}
article {
    grid-column: 1 / -1;
    margin:1rem;
}
article.fullwide {
    grid-column: 1 / -1;
}
aside {
    display:block;
}
footer{
    display:none;
    grid-column: 1 / -1;
    margin:1rem;
}
a {
    text-decoration:none;
    color:var(--linkcolor);
    font-weight:700;
}
a:hover {
    text-decoration:underline;
    color:var(--hovercolor);
}
a:active {
    text-decoration:underline;
    color:var(--lightcolor);
}
p {
	margin-bottom: 1em;
}
strong {
    font-weight: 700;
}
em {
    font-style: italic;
}
ol {
	margin: 0 0 1em 1.5em;
	display:block;
}
ul {
	margin: 0 0 1em 1.5em;
	display:block;
}
li {
    margin: .25rem;
}
.timestate {
	font-weight:600;
	font-size:1.05rem;
}
.titletag {
	text-transform: uppercase;
	font-size:1rem;
}

.boxinset {
	border:1px solid #666;
	border-radius:3px;
	background-color:#ddd;
	width:100%;
	padding:1em;
	margin:1em 0;
}
.boxinset h2, .boxinset p {
	margin:0 0 .5em 0;
}
.boxinset h2 {
	color: var(--maincolor);
}

.nomobile {
	display:none;
}
.front-conference-date {
    margin:2em 0 1em 0;
    font-weight: bold;
    font-size: 120%;
    line-height: 128%;
}
.front-conference-location {
    margin-bottom:2em;
    font-weight: bold;
    font-size: 120%;
    line-height: 128%;
}
.soldout {
	color: #666666;
	font-size: 110%;
	font-weight: bold;
	margin:1em 0 .25em 0;
	text-transform: uppercase;
}

/* ============================================== collabsible sections ============================================== */
input[type='checkbox'] {
    display: none;
}
.wrap-collabsible {
    margin-bottom: 1.2rem;
}
.lbl-toggle {
    display: block;
	width:99%;
    font-weight: bold;
    font-size: .85rem;
    text-transform: uppercase;
    text-align: left;
    padding: 10px;
    color: #ffffff;
    background: var(--maincolor);
    cursor: pointer;
    border-radius: 3px;
    transition: all 0.25s ease-out;
}
.lbl-toggle:hover {
    color: #ffffff;
}
.lbl-toggle::before {
    content: ' ';
    display: inline-block;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid currentColor;
    vertical-align: middle;
    margin-right: .7rem;
    transform: translateY(-2px);
    transition: transform .2s ease-out;
}
.toggle:checked+.lbl-toggle::before {
    transform: rotate(90deg) translateX(-3px);
}
.collapsible-content {
    max-height: 0px;
    overflow: hidden;
    transition: max-height .25s ease-in-out;
}
.toggle:checked + .lbl-toggle + .collapsible-content {
    max-height: 100%;
}
.toggle:checked+.lbl-toggle {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.collapsible-content .content-inner {
    background: rgba(79, 124, 140, .1);
    border-bottom: 1px solid var(--maincolor);
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    padding: .5rem 1rem;
}
/*.collapsible-content { margin-bottom: 3em; }*/



/* ============================================== schedule ============================================== */
.schedtable {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 95%;
    max-width: 566px;
    margin-bottom: 2rem;
}
.table-header {
    font-size: 110%;
    font-weight: 600;
    background-color: var(--maincolor);
    color: white;
    padding:10px;
}
.table-cell-time {
    font-weight: 600;
    padding:10px;
}
.table-cell-data {
    font-weight: 400;
    padding:10px;
}

.slot-card {
    background-color: hsla(327, 54%, 46%, .08);
    border-bottom:1px solid var(--maincolor);
    border-radius:3px;
    margin-bottom:1rem;
    padding:.25rem;
}
.slot-card h4 {
    margin:.5rem 0;
}
a.slot-card {
    height:10vh;
    min-height:6em;
    display: grid;
    place-items:center;
    text-align:center;
}
a.slot-card:hover {
    text-decoration:none;
    background-color: hsla(327, 54%, 46%, .12);
}
a.slot-card:active {
    background-color: hsla(327, 54%, 46%, .12);
}
.offcolor {
	opacity: .5;
}
.incidental {
    display:block;
    font-style:italic;
    font-weight:400;
    color:rgba(0, 0, 0, .55);
    margin:.75rem;
}
.regbutton {
	display:block;
	width:80%;
	margin: 1.15em auto;
	font-family:Verdana, Geneva, sans-serif;
	font-size: 1.15em;
	font-weight:normal;
	letter-spacing: 0.03em;
	color: #ffffff;
	text-decoration:none;
	text-align:center;
	padding: .75em 2em;
	background-image: linear-gradient(var(--maincolor), var(--hovercolor));
    transition: all 0.6s linear;
	border-radius: 10px;
	border: 1px solid var(--maincolor);
}
.regbutton:hover {
	color: #ffffff;
	text-decoration:none;
	background-image: linear-gradient(var(--hovercolor), var(--maincolor));
}

/* ============================================== sessions ============================================== */
.presenters {
	font-style: italic;
	color: #444;
}
.presenter-strip-2, .presenter-strip-3, .presenter-strip-4, .presenter-strip-5, .presenter-strip-6, .presenter-strip-7 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
.presenter-strip-item {
    height:auto;
    overflow:hidden;
}
.presenter-strip-item img {
    width:100%;
}
.presenter-strip-name {
    font-size: 86%;
    font-weight: 400;
    line-height: 1.2rem;
    margin: .2rem .2rem 0 .2rem;
}
.presenter-strip-org {
    font-size: 86%;
    font-weight: 200;
    line-height: 1.2rem;
    margin: 0 .2rem .65rem .2rem;
}
/* ============================================== workshops ============================================== */
.agenda-grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: .2rem;
}
.agenda-item {
}
.agenda-item-time {
    font-weight:700;
    font-size:.95rem;
    margin:0 0 0 0;
}
.agenda-item-text {
    margin:0 0 2rem 1rem;
}
.agenda-item-detail {
    margin-left:1em;
    font-size:.8rem;
    font-weight:200;
}
/* ============================================== faq ============================================== */
.regtable {
    width:100%;
    border-collapse: collapse;
    margin:0;
}
.table-caption {
    text-align: left;
    margin: .25rem;
    font-weight: 600;
    color: var(--maincolor);
}
tbody tr:nth-child(even) {
    background-color: #eeeeee;
}
tbody tr:nth-child(odd) {
    background-color: #cccccc;
}
td, th {
    padding: .35em .5em;
    text-align: left;
}
th {
    background-color: var(--maincolor);
    color: white;
    font-weight: 600;
}

/* ============================================== keynotes and events ============================================== */
.speaker,
.keynote-session,
.event {
    overflow: auto
}

.speaker figure,
.event figure {
    display: block;
    float: left;
    width:35%;
    margin: 6px 1rem .75rem 0;
    border: none
}
@media only screen and (min-width: 600px) {
    .speaker figure{
        width:25%;
    }
}

@media only screen and (min-width: 600px) {
    .speaker figure,
    .event figure {
        width:25%;
    }
}


.speaker figure img,
.event figure img {
    width: 100%;
    border: 1px solid #666666;
}

.speaker figure figcaption,
.event figure figcaption {
    font-size: 12px;
    border-bottom: solid 1px #d8d8d8;
    padding-bottom: 8px;
}


.headshot-wide {
	float: none;
	width:98%;
	margin:calc(1em + 4px) 0 1rem 0;
}
.headshot-wide > img {
	display: block;
	border: 1px solid #666666;
	width: 100%;
}

/* ============================================== sponsors ============================================== */
.funder-block {
	float:none;
	width:100%;
    font-size:1.3rem;
    line-height:2rem;
}
.funder-block-header {
	float:none;
	width:100%;
    font-size:1.3rem;
    line-height:2rem;
	border-bottom-style: solid;
	border-bottom-width:1px;
	border-bottom-color:#999999;
	font-weight: bold;
	margin-top: 1.25em;
}
.funder-block-list > li {
	list-style: none;
	margin: .5em 0 0 1em;
	text-indent: -1em;
	line-height: 1.45em;
}
.funder-logos-block {
	float: left;
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 4rem;
    width:98%;
    margin:3rem 0 0 0;
}
.funder-logo > img {
    display: block;
    width: 100%;
}
.indent {
    margin-left:1em;
}
.caption {
	margin:.85em 6em 2em 3px;
	font-size:80%;
	line-height:1.5em;
	color:#333333;
}
.organizer {
    font-style:italic;
    font-weight:300;
    margin:0 0 .75em 1em;
}
.nobk {
    break-after: avoid;
}







@supports (grid-area: auto) {

@media screen and (min-width: 480px) {
    .container {
        margin: 0 auto;
        grid-template-columns: 2fr 1fr;
        grid-template-areas:
            'header header'
            'nav nav'
            'article aside'
            'footer footer';
    }

    nav {
        width:100%;
        margin:0;
        background-color: var(--maincolor);
        display: block;

    }
    nav a {
        display: inline-block;
        margin: 0 .75rem;
}
    article {
        margin: 1rem;
    }
    footer {
        display: grid;
        grid-template-columns: 1fr 2fr;
        margin:0;
        padding:2rem 0 1.5rem 0;
        background-color: var(--maincolor);
        color:white;
    }
    footer menu {
        text-align: right;
        font-size: .86rem;
        font-weight: 400;
        line-height: 1rem;
        list-style: none;
    }
    footer address {
        font-size: 1rem;
        font-weight: 700;
        padding-left: 2.5em;
    }
    footer a {
        color:white;
        text-decoration: none;
    }
    footer a:hover {
        color: var(--lightcolor);
        text-decoration: none;
    }
    .title {
        font-weight:700;
        margin:.75em 0 .25em 0;
    }
    .regbutton {
    	margin: 1.15em 0;
    	width:60%;
    }

}/*480px*/



@media screen and (min-width: 650px) {
    article {
        grid-column: 1 / 2;
        margin:2rem .5rem 3rem .rem;
    }
    aside {
        grid-column: 2 / -1;
        grid-row: 3 / 4;
        display:block;
        margin-left:2rem;
    }
    aside h4 {
        margin:3rem 0 .75rem 0;
    }
    .twibox {
        margin:2rem 0;
        height:100%;
        width:98%;
    }
    .one-col-grid {
        grid-template-columns: 30% 70%;
        grid-column-gap: 3vw;
        grid-row-gap: 3em;
    }
    .two-col-grid {
        grid-template-columns: 1fr 1fr;
        grid-column-gap: 3vw;
    }
    .three-col-grid {
        grid-template-columns: 1fr 1fr 1fr;
        grid-column-gap: 1.5vw;
    }
    .one-col-grid h3 {
        margin-top:0;
    }
    .nomobile {
    	display:block;
    }
    .presenter-strip-3 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }
    .presenter-strip-4 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }
    .presenter-strip-5 {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
    }
    .presenter-strip-6 {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
    }
    .presenter-strip-7 {
        display: grid;
        grid-template-columns: repeat(7, 1fr);
    }
    .funder-block {
        float:left;
        width:48%;
    }
    .funder-logos-block {
        float: right;
        grid-gap: 2rem;
        margin: 1em;
        width: 46%;
    }
    .funder-logo {
        max-width:20rem;
    }
    .agenda-grid {
        grid-template-columns: 40% 60%;
        grid-gap: 1rem;
        margin-top:1rem;
    }
    .agenda-item-time {
        font-weight:500;
        padding:0;
        text-align:right;
    }
    .agenda-item-text {
        margin:0 0 1rem 0;
    }

    header {
	    grid-template-columns: max-content 1fr;
	    grid-template-rows: 50% 50%;
		grid-template-areas:
			"txt-1 img-2"
			"txt-3 img-3";
	}
	.logo-txt-1 {
		font-size:clamp(2.1rem, 4.4vw, 2.8rem);
        line-height:100%;
        letter-spacing: -0.9px;
		text-align: right;
		align-self:flex-end;
		padding:4vw 2vw 0 1vw;
    }
    .logo-txt-3 {
        font-size:1.6em;
        line-height:100%;
        letter-spacing: -0.5px;
		text-align: right;
		align-self:flex-start;
		padding:1vw 2vw 0 1vw;
}
    .logo-img-2 {
		background-position: top center;
		min-height: 76px;
   		border-left: 5px solid var(--lightcolor);
}
    .logo-img-3 {
		min-height: 76px;
   		border-left: 5px solid var(--lightcolor);
    }

}/*650px*/


@media screen and (min-width: 718px) {
    /*header {
	    grid-template-columns: 1fr max-content;
	    grid-template-rows: 68% 24%;
	}
	.logo-txt-1 {
        font-size:3em;
        line-height:100%;
        letter-spacing: -0.9px;
		text-align: left;
		align-self:flex-end;
		padding-left:1vw;
    }
    .logo-txt-3 {
        font-size:1.36em;
        line-height:100%;
        letter-spacing: -0.5px;
		text-align: left;
		align-self:flex-end;
		padding-right:1vw;
    }*/
    .boxinset {
		width:95%;
		margin:1em 2em 2em 0;
	}
}/*718px*/



@media screen and (min-width: 750px) {
    .regtable {
        width:70%;
    }
}/*750px*/

}/*suports-grid*/