/*
    LPC 2022 stylesheet for lpcfe
*/

/* Since we are using an image for the banner, limiting the max width across all screens */
body {
    max-width: 1920px;
}

/* latin-ext */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/quicksand/v29/6xKtdSZaM9iE8KbpRA_hJVQNcOM.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/quicksand/v29/6xKtdSZaM9iE8KbpRA_hK1QN.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/quicksand/v29/6xKtdSZaM9iE8KbpRA_hJVQNcOM.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/quicksand/v29/6xKtdSZaM9iE8KbpRA_hK1QN.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
    margin: 0px;
    font-size: 1em;
    font-family: "Quicksand";
}

.titlebox {
    color: white;
    background: transparent url(https://lpc.events/event/18/images/336-lpc24_banner_title.png);
    min-height: 90px;
    height: 40vh;
    max-height: 256px;
    background-size: cover;
}

div.title {
    width: 100%;
    margin: 0;
    min-height: 90px;
    height: 19vh;
    max-height: 256px;
}

h1.title {
    display: none;
    visbility: hidden;
}

.grayheader {
    background-color: #d1d1d1;
    border: 0;
    padding: 0.5em;
}

.date {
    float: left;
    margin-right: 0.2em;
}

.timezone {
    color: #777;
}

.room, input[type=submit] {
    padding: 6px;
    margin: 6px;
    font-size: 12pt;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    background-color: #c16260;
    color: #FFFFFF;
    border-top: 1px solid #CCCCCC;
    border-right: 1px solid #333333;
    border-bottom: 1px solid #333333;
    border-left: 1px solid #CCCCCC;
    border-radius: 0.4em;
    cursor: pointer;
    display: block;
    margin: auto;
}

a, .fake-link, .ui-widget-content a {
    color: #c16260;
    text-decoration: none;
}

a:hover, .fake-link:hover, .ui-widget-content a:hover {
    color: #aa6618;
}

.contributiontitle {
    line-height: 1.4em;
    font-weight: 600;
    margin-bottom: 4px;
}

.speakers {
    line-height: 1.1em;
}

/* Tables ripped off from lwn */
table.OddEven {
    border-collapse: separate;
}
table.OddEven tr:nth-child(even) {
    background-color: white;
}
table.OddEven tr:nth-child(odd) {
    background-color: #eeeeee;
}
table.OddEven th { background-color: white; }
table.OddEven td { padding: 3px; }

/* Schedule table */
table.tt {
    border: #777;
    padding: 2px;
    font-family: sans-serif;
}

table.tt tr:hover {
    background-color: #f6f6f6;
}

table.tt td {
    border-width: 1px;
    border-style: solid;
    border-color: white;
    border-radius: 8px;
    padding: 8px;
}

table.tt tr:hover td {
    border-color: green;
}

table.tt tr:hover td.blank {
    border-color: white;
    background-color: white;
}

table.tt a:hover { color: #777; }

form { margin: 0px; }

/* Left menu, from LPC */
.conf_leftMenu {
    float: left;
    font-family: "Quicksand";
    font-size: 12px;
    margin: 0px 1em 0px 0px;
    width: 226px;
    vertical-align: top;
    background-color: #f6f6f6;
}
#outer {
    border: 1px solid #ccc;
    background: #f6f6f6;
    position: relative;
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    padding: 0px;
    margin-top: 0px;
}
#outer li a:visited {
    color: black;
}
#outer li a {
    display: block;
    font-family:"Quicksand";
    color: black;
    padding: 7px 12px;
    font-size: 10pt;
}
#outer li.selected, #outer li a.selected {
    color: white;
    background: #c16260;
}

#outer {
    border: 0;
}

#outer li a {
    font-family: "Quicksand";
    font-size: 1.3em;
}

#outer li a:hover {
    background-color: #d79795;
    color: white;
}

#outer li a:not(.no-link):hover {
    background: #d79795;
    color: white;
}

div.SponsorClass:first-child h5 {
    margin-top: 1px;
}

div.SponsorClass img {
    width: 120px;
    vertical-align: middle;
    margin: 0px 3em;
}

div.SponsorBox {
    background: #f6f6f6;
    margin: 6px;
    border: 1px;
    border-style: solid;
    border-color: #ccc;
}

div.SponsorClass br {
    display: none;
}

div.SponsorBox h5 {
    font-size: 1.2em;
    margin-top: 4px;
}

div.SponsorBox h5, div.SponsorClass a, div.SponsorClass img {
    text-align: center;
}

div.SponsorClass h5 {
    font-size: 1em;
}

    div.SponsorClass {
	margin: 0;
	text-align: center;
        /* float: left; */
    }
    div.SponsorClass img {
        width: 120px;
        vertical-align: middle;
        margin: 0px 2em 1em 2em;
    }

/* The checkbox that controls the left menu; we never want to actually
   see it....*/
input.LeftMenuCtrl {
    display: none;
}


/* Wide-screen defaults. */
@media screen and (min-width: 768px) {
    label.LeftMenuCtrl:after,
    input[type=checkbox]:checked ~ label.LeftMenuCtrl:after {
	content: none;
    }

    input[type=checkbox]:checked ~ div.conf_leftMenu {
	display: block;
        min-width: 142px;
        width: 13.4vw;
        max-width: 256px;
        min-height: 320px;
        margin-bottom: 1em;
    }

    li.LeftMenuCtrl {
	display: none;
    }
    div.confBodyBox {
	margin-left: 225px;
	margin-right: 225px;
    }
    p.tttrack {
        display: none;
    }
}

/*
 * Small-screen stuff below here
 */
@media screen and (max-width: 767px) {
    div.conf_leftMenu {
	position: absolute;
	top: 50px;
	right: 10px;
	z-index: 20;
    }
    label.LeftMenuCtrl:after {
	content: "X";
    }

    label.LeftMenuCtrl {
	position: absolute;
	top: 10px;
	right: 10px;
	font-size: xx-large;
	color: white;
    }

    input[type=checkbox]:checked ~ label.LeftMenuCtrl:after {
	content: "☰";
    }

    input[type=checkbox]:checked ~ div.conf_leftMenu {
	display: none;
    }
    div.confBodyBox {
	margin-left: 1em;
	margin-right: 1em;
    }
    li.LeftMenuCtrl {
	padding-left: 7px;
    }
    img.confLogo {
	width: 68px;  /* Has to be px, not % */
	margin: 10px;
    }
    .confTitle {
	height: 90px;
	line-height: 90px;
    }
    .conference-title-link {
	padding: 5px;
	height: 90px;
	line-height: 90px;
    }
    .conference-title {
	padding: 5px;
	font-size: 16pt;
    }
    span.conference-title-link span {
	background-color: black;
	color: white;
	padding: 10px;
	display: inline-block;
	vertical-align: middle;
	line-height: normal;
	font-size: 12pt;
	font-weight: 800;
    }
    div.centered-column {
	margin: 2em;
	width: 100%;
    }
    /* Timetable trickery */
    below-menu {
	margin: 6px;
    }
    table.tt  {
	width: 100%;
    }
    table.tt thead {
        display: none;
    }
    span.tt {
	display: inline;
    }
    table.tt tbody, table.tt th, table.tt td, table.tt tr {
        display: block;
    }

    table.tt tr.tthdr {
	display: none;
    }

    table.tt td {
        /* Behave  like a "row" */
        border: none;
        position: relative;
        /* padding-left: 50%;*/
    }

    table.tt td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
    }
    div.SponsorClass {
        width: 100%;
    }
    p.tttrack {
        display: inline;
    }
}

p.local-time {
    margin: 0.1em;
    font-weight: 600;
}

p.indico-time {
    margin: 0.1em;
    color: #777;
}

h2 {
    font-size: 1.8em;
    font-weight: 400;
    color: #6a8a25;
}

div.lead-text {
    margin: 1em;
}

p.note {
    margin: 0 1em 0 1em;
    border-radius: 8px;
    background-color: bisque;
    color: black;
    padding: 8px;
}

#loginemail, #logincode, #guestname {
   height: 2.5rem;
}