@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;
}

:root {
    --maincolor: #45544d;
    --spotcolor: #d1410c;
}
/* ============================================== 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:2rem;
    line-height:2.2rem;
    margin:0 0 1.5rem 0;
}
h2 {
    font-size:1.65rem;
    line-height:1.8rem;
    margin:0 0 1rem 0;
}
h3 {
    font-size:1.45rem;
    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.5rem;
}
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:5px 0 3px 4px;
    margin-top:1.75em;
    margin-bottom:.75em
}
.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;
    height: 22vh;
    max-height: 120px;
    background-color: var(--maincolor);
    background: url("../images/banner.png") no-repeat ;
	background-size: cover;
    background-position: right;
	overflow: hidden;
    color:white;
    text-shadow: 1px 1px 3px #45544d;
}
.one-col-grid {
    display:grid;
    grid-template-columns: 1fr;
}
.two-col-grid {
    display:grid;
    grid-template-columns: 1fr;
}
.three-col-grid {
    display:grid;
    grid-template-columns: 1fr;
}

.logo-txt-1 {
	position:relative;
	top:6px;
	left:1rem;
	width:90%;
	font-family: "skolar-sans-latin",sans-serif;
	font-weight:800;
	font-size:1.2em;
	line-height:1.25em;
}
.logo-txt-2 {
	position:relative;
	top:7px;
	left:1rem;
	width:90%;
	font-family: "skolar-sans-latin",sans-serif;
	font-weight:700;
	font-size:1.5em;
	line-height:1em;
}
.logo-txt-3 {
	position:relative;
	top:20px;
	left:1rem;
	width:90%;
	font-family: "skolar-sans-latin",sans-serif;
	font-weight:600;
	font-size:1em;
}
nav {
    grid-column: 1 / -1;
	height:auto;
	line-height: 3.25em;
	margin:.25vh 0;
	text-align:center;
	text-transform:uppercase;
	font-size: .85rem;
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
        
}
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: #ffffcc;
	text-decoration:none;
}
nav a:active {
	color: #ffffcc;
}
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:#3a6f55;
    font-weight:700;
}
a:hover {
    text-decoration:underline;
    color:var(--spotcolor);
}
a:active {
    text-decoration:underline;
    color:var(--spotcolor);
}
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;
}
.nomobile {
	display:none;
}
.front-conference-location {
    margin-top:3em;
    font-weight: bold;
    font-size: 150%;
    line-height: 128%;
}
/* ============================================== 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: rgba(69, 84, 77, .1);
    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: rgba(69, 84, 77, .2);
}
a.slot-card:active {
    background-color: rgba(69, 84, 77, .2);
}

.incidental {
    display:block;
    font-style:italic;
    font-weight:400;
    color:rgba(0, 0, 0, .35);
    margin:.5rem 0;
}
.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(#b66c65, #9c5b56);
    transition: all 0.3s linear;
	border-radius: 10px;
	border: 1px solid var(--maincolor);
}
.regbutton:hover {
	color: #ffffff;
	text-decoration:none;
	background-image: linear-gradient(#9c5b56, #b66c65);
}

/* ============================================== sessions ============================================== */
.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 ============================================== */
.headshot {
	display: block;
	float: left;
	width:35%;
	margin:6px 1rem .75rem 0;
	border: 1px solid #666666;
}
.headshot-wide {
	display: block;
	float: none;
	width:98%;
	margin:calc(1em + 4px) 0 1rem 0;
	border: 1px solid #666666;
}
/* ============================================== sponsors ============================================== */
.funder-block {
	float:none;
	width:100%;
    font-size:1.3rem;
    line-height:2rem;
}
.funder-block-header {
	border-bottom-style: solid;
	border-bottom-width:1px;
	border-bottom-color:#999999;
	font-weight: bold;
	margin-bottom:4px;
}
.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;
        display: grid;
        grid-template-columns: 2fr 1fr;
        grid-template-areas: 
            'header header'
            'nav nav'
            'article aside'
            'footer footer'
    }
    .container2 {
        margin: 0 auto;
        display: grid;
        grid-template-columns: 2fr 1fr;
        grid-template-areas: 
            'header header'
            'nav nav'
            'article article'
            'footer footer'
    }
    header {
        min-height: 148px;
    }
    .logo-txt-1 {
        position:relative;
        top:40px;
        right:1rem;
        width:80%;
        text-align: right;
        font-weight:800;
        font-size:1.4em;
        line-height:100%;
    }
    .logo-txt-2 {
        position:relative;
        top:47px;
        right:1rem;
        width:80%;
        text-align: right;
        font-weight:700;
        font-size:1.8em;
        line-height:100%;
        letter-spacing: -0.25px
    }
    .logo-txt-3 {
        position:relative;
        top:60px;
        right:1rem;
        width:80%;
        text-align: right;
        font-weight:600;
        font-size:1.2em;
        line-height:100%;
    }

    nav {
        width:100%;
        height:auto;
        line-height: 3.25em;
        margin:0;
        background-color: var(--maincolor);
        text-align:center;
        text-transform:uppercase;
        font-size: .85rem;
        display: block;
        
    }
    nav a {
        display: inline-block;
        color: white;
        font-weight: bold;
        margin: 0 .75rem;
        text-decoration:none;
}
    article {
        margin: 1rem 1rem 1rem .25rem;
    }
    footer{
        display:grid;
        grid-template-columns: 1fr 2fr;
        grid-column: 1 / -1;
        margin:0;
        padding:2rem 0 1.5rem 0;
        background-color: var(--maincolor);
        color:white;
    }
    footer a {
        color:white;
        text-decoration: none;
    }
    footer a:hover {
        color:#ffffcc;
        text-decoration: none;
    }
    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;
    }
    .title {
        font-weight:700;
        margin:.75em 0 .25em 0;
    }
    .regbutton {
    	margin: 1.15em 0;
    	width:60%;
    }

}/*480px*/






@media screen and (min-width: 650px) {
    nav {
        margin: 0;
    }
    article {
        grid-column: 1 / 2;
        margin:2rem .5rem 3rem .3rem;
    }
    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;
        display: grid;
        grid-gap: 2rem;
        /*grid-template-columns: 1fr 1fr;*/
         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;
    }


}/*650px*/




@media screen and (min-width: 750px) {
    .regtable {
        width:60%;
    }
}/*750px*/

}/*suports-grid*/
