/**** Colors ****/
:root {
    --_333: #333333;
    --text: #fcfcfc;
    --background: #FFF;
    --border-bottom: #ededed; /* was #666 for 2010-2013 */
    --bg-highlite: #dedede;
    } /* close :root */

body {
  border-bottom: 120px solid var(--border-bottom);
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  margin: 0;
  /*min-height: 900px;*/
  padding: 0;
}

body.b2010 {
  background: var(--background) url('/img/bg2010.jpg') repeat-x;
}

body.b2011 {
  background: var(--background) url('/img/bg2011.jpg') repeat-x;
}

body.b2012 {
  background: var(--background) url('/img/bg2012.jpg') repeat-x;
}

body.b2013 {
  background: var(--background) url('/img/bg2013.jpg') repeat-x;
}

body.b2014 {
  background: var(--background) url('/img/bg2014.jpg') repeat-x;
}

body.b2015 {
  background: var(--background) url('/2015/img/bg2015.jpg') repeat-x;
}

body.b2016 {
  background: var(--background) url('/2016/img/Banner.jpg') repeat-x;
}

body.b2017 {
  background: var(--background) url('/2017/img/Banner.jpg') repeat-x;
}

body.b2018 {
  background: var(--background) url('/2018/img/Background.jpg') repeat-x;
}

body.b2020 {
  background: var(--background) url('/2020/img/Background.jpg') repeat-x;
}

body.b2020 h1 {
	color: #FFFFFF;
}

/* body.plus { border-bottom: 0px none; } */
a {
  color: #369;
  text-decoration: none;
}

a:hover {
  color: #69B;
  text-decoration: underline;
}

a:hover h3,
a:hover h4 {
  text-decoration: underline;
}

a:visited {
  color: #69B;
}

a.external {
  color: #C60;
}

a.external:visited,
a.external:hover {
  color: #C93;
}

a img {
  border: 0px none;
}

dl {
  font-size: 90%;
}

dt {
  /*text-transform: uppercase; */
  color: #999;
  letter-spacing: 0.1em;
}

dd {
  display: block;
}

p,
ol,
ul {
  line-height: 1.5em;
  min-width: 150px;
}

h3 {
  margin-top: 0;
}

.program h3 {
  margin: 0.25em 0;
  cursor: pointer;
}

div#wrapper {
  background: none transparent;
  margin: 0px auto -97px auto;
  max-width: 890px;
  /* previously:
    width: 800px; also: 1200px
    min-width: 600px;
  */
  padding: 36px 0 0 0;
  position: relative;
  top: -16px;
  width: 85%;
}

/*
@media only screen and (max-width: 600px) {
  small screen devices
  div#wrapperapp {
    width: 94%;
  }
} */

header,
.header {
  display: block;
  padding: 0;
  width: 100%;
}

header img,
.header img {
  border: 0px none;
}

header ul,
.header ul {
  line-height: 1.2em;
}

header h2,
.header h2 {
  background: transparent right top no-repeat url('../img/logo_embo-embl.png');
  height: 31px;
  margin: 0;
  color: #FFF;
  left: 0;
  font-size: 90%;
  font-weight: normal;
  letter-spacing: 0.1em;
  padding: 6px 0 0 0;
  position: absolute;
  top: 20px;
  width: 400px;
}

header h1,
.header h1 {
  color: #000;
  font-size: 3.12em;
  font-weight: normal;
  position: absolute;
  line-height: 0.9em;
  margin: 0 0 0 15px;
  top: 100px;
  width: 65%;
}

span#vizbi {
  display: inline-block;
  font-weight: bold;
  text-shadow: 0px 0px 8px #333;
}

header form,
.header form {
  display: block;
  margin: 0px;
}

header form input#q,
.header form input#q {
  width: 180px;
  color: #7F8085;
}

header form label,
.header form label {
  padding: 0;
}

.header .nav {
  display: block;
  color: #FFF;
  position: relative;
  right: 0;
  text-align: right;
  text-shadow: 0px 0px 6px #000;
}

.nav ul {
  padding: 0;
  margin: 12px 0 24px 0;
}

.nav li {
  font-weight: bold;
  letter-spacing: 0.03em;
  list-style: none;
  margin-right: 15px;
}

.header .nav a,
.header .nav a:visited {
  color: #FFF;
}

.nav a.current,
.nav a.current:hover {
  text-decoration: none;
}

div#archivewrapper {
  position: relative;
}

div#archivelinks {
  -webkit-transform: translate3d(0, 0, 0);
  position: absolute;
  z-index: 1;
  right: 0px;
}

.section {
  background: #FFF;
  display: block;
  padding: 10px 15px;
}

.section #page {
  min-height: 650px;
  font-size: 90%;
}

/* handles right-margin for jplist pages */
.section.videos,
.section.speakers,
.section.organizers {
  padding-right: 0px
}

.section .nav {
  color: #CCC;
  display: block;
  font-size: 111%;
  margin-bottom: 30px;
}

.section .nav h2 {
  float: left;
  font-size: 2.5em;
  margin: -0.25em 0.5em 0 0;
}

.section .nav h2 a span.orange {
  color: #FF9900;
}

.orange {
  color: #FF9900;
}

.section .nav li {
  border-left: 2px solid #CCC;
  display: inline;
  letter-spacing: 0.05em;
  padding: 0 6px;
  text-transform: uppercase;
}

.section .nav li a,
.section .nav li {
  color: #C0C0C0;
}

.section h3,
.section h4 {
  font-size: 1.8em;
  font-weight: bold;
}

.section h4 {
  font-size: 1.3em;
  font-weight: bold;
}

label,
.section th {
  padding-right: 12px;
  color: #999;
  font-size: 80%;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.section table {
  border-collapse: collapse;
  margin-bottom: 1em;
  width: 100%;
}

.section tr {
  vertical-align: top;
}

.section.program tr td:first-child {
  width: 20%;
}

.section td,
.section th {
  padding: 6px;
}

.section tr:nth-child(even) {
  background: #EEE;
}

.section tr:nth-child(even) td:first-child {
  /*color: #787878;*/
}

p.desc {
  max-width: 50em;
}

.outstanding {
  /* promenient links etc. */
  /*text-align: center;*/
  margin-left: 2.5em;
  font-size: 1.2em;
  font-weight: bold;
}

footer,
.footer {
  clear: both;
  color: #CCC;
  display: block;
  font-size: 85%;
  min-height: 80px;
  padding: 2px 16px 8px 30px;
  word-spacing: 0.2em;
  text-align: right;
}

footer a,
.footer a {
  color: #FFF;
}

/**********  BLOG **************/
/* 3-column layout from http://www.alistapart.com/d/negativemargins/ex5.htm */
/* explained here: http://www.alistapart.com/articles/negativemargins/
 */
#container {
  width: 100%;
  float: left;
  margin-right: -240px;
}

#content {
  margin-right: 240px;
}

#sidebar {
  float: left;
  padding-top: 0;
  /* width: 24%; value from Christian */
  width: 140px;
  /* value from Sean */
}

#sidebar ul {
  padding: 0;
  margin: 3em 0 0 0;
}

#sidebar ul ul {
  padding: 0;
  margin: 0;
}

#sidebar ul li {
  list-style: none;
  padding: 0 0 2px 0;
  margin: 0;
}

#sidebar li a {
  color: #ABABAB;
}

#sidebar li h2 {
  font-size: 95%;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  /* line-height: 0.5em; */
  margin: 1.7em 0 0.3em 0;
}

#sidebar h2 a {
  font-size: 2em;
  text-transform: uppercase;
  margin: 0;
  padding: 0;
  line-height: 0.1em;
}

#blogBody {
  /* float: right; value from Christian */
  /* width: 72%; value from Christian */
  margin-left: 180px;
  /* float: left; */
}

#searchform div {
  margin: 16px 0;
}

#sidebar input {
  margin: 4px 0;
}

#sidebar img.icon {
  border: 0px none;
}

.navigation {
  display: block;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 60px;
}

.newsletter tr:nth-child(even) {
  background: #FFF;
}

.newsletter table {
  width: 350px;
}

div.post {
  display: inline-block;
  margin: 0 0 20px;
}

/*	needed for blog  */
img.centered {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

img.alignright {
  padding: 4px;
  margin: 0 0 2px 7px;
  display: inline;
}

img.alignleft {
  padding: 4px;
  margin: 0 7px 2px 0;
  display: inline;
}

.alignright {
  float: right;
}

.alignleft {
  float: left;
}

#page h2.pagetitle {
  text-align: center;
}

.grey {
  color: #ACACAC;
}

/********** hide '& NIH' in even years ************/
.even .NIH {
  display: none;
}

.landing .NIH {
  display: inline;
}

/********** colors that change based on year ************/
.odd span#vizbi,
.odd .section .nav h2 a,
.odd .nav a:hover,
.odd .nav a.current,
.odd .nav a.current:hover,
.odd a.home,
.odd a.home:hover,
.odd #blogBody h2,
.odd #blogBody h2 a,
.odd #blogBody h3 a,
.odd #sidebar h2,
.odd #sidebar h2 a,
.odd p#summary {
  color: #F4B;
}

.odd .button {
  background-color: #F4B;
}

.even span#vizbi,
.even .section .nav h2 a,
.even .nav a:hover,
.even .nav a.current,
.even .nav a.current:hover,
.even a.home,
.even a.home:hover,
.even #blogBody h2,
.even #blogBody h2 a,
.even #blogBody h3 a,
.even #sidebar h2,
.even #sidebar h2 a,
.even p#summary {
  color: #3C9;
}

.even .button {
  background-color: #3C9;
}

/**********Adding the AUSTRALIA YEAR! ************/
.australia span#vizbi,
.australia .section .nav h2 a,
.australia .nav a:hover,
.australia .nav a.current,
.nav a.active,
.australia .nav a.current:hover,
.australia a.home,
.australia a.home:hover,
.australia #blogBody h2,
.australia #blogBody h2 a,
.australia #blogBody h3 a,
.australia #sidebar h2,
.australia #sidebar h2 a,
.australia p#summary {
  color: #8F3099;
}

.australia .button {
  background-color: #8F3099;
}

.australia .header .nav a.current {
  text-shadow: 0px 0px 0px;
}

.australia .header .nav a:hover {
  text-shadow: 0px 0px 6px #6b6b6b;
}

/* image box */
#floatboxRight {
  float: right;
  /* width: 50%; */
  width: 333px;
  height: 481px;
  margin: 0px 20px;
}

.floatboxRight {
  float: right;
  margin: 0px 20px;
  width: 50%;
  max-width: 420px;
}

.floatboxLeft {
  float: left;
  margin: 0 20px 0 0;
}

/* SLIDE SHOW ** set the width and height to match slideshow images **/
#slideshow,
#slideshow2 {
  position: relative;
  height: 150px;
  width: 200px;
  padding: 0;
}

div#slideshow.home,
#slideshow2.home {
  top: -40px;
}

#slideshow DIV,
#slideshow2 DIV {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8;
  opacity: 0.0;
  height: 170px;
}

#slideshow DIV.active,
#slideshow2 DIV.active {
  z-index: 10;
  opacity: 1.0;
}

#slideshow DIV.last-active,
#slideshow2 DIV.last-active {
  z-index: 9;
}

#slideshow DIV IMG,
#slideshow2 DIV IMG {
  height: 150px;
  display: block;
  border: 0;
  margin-bottom: 1px;
}

#slideshow span.caption {
  color: #FFF;
  display: block;
  font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, sans-serif;
  font-size: 11px;
  padding-left: 12px;
  width: 188px;
}

.column {
  display: inline-block;
}

.row {
  display: block;
}

.row p {
  display: block;
  width: 50%;
  margin-top: 0;
}

.bottom .thumbnail {
  vertical-align: bottom;
}

.top .thumbnail {
  vertical-align: top;
}

#twitter-wrap {
  float: right;
  margin: 23px 0 400px 10px;
  width: 220px;
}

.thumbnail {
  float: right;
  margin: 0 15px 15px 0;
}

span.thumbnail {
  float: none;
  display: inline-block;
}

.h206 {
  height: 206px;
}

.w143 {
  width: 143px;
}

.w200 {
  width: 200px;
  overflow: hidden;
}

.w250 {
  width: 250px;
}

.w340 {
  width: 340px;
}

.clearboth {
  clear: both;
}

.clearleft {
  clear: left;
}

.clearright {
  clear: right;
}

.right {
  margin-left: 15px;
}

.thumbnail a.button {
  border-radius: 16px;
  color: #FFF;
  opacity: 0.65;
  padding: 5px 12px;
  position: relative;
  top: -40px;
  left: 10px;
  -moz-border-radius: 16px;
}

.thumbnail a.large.button {
  border-radius: 20px;
  font-size: 150%;
  padding: 8px 14px;
  position: relative;
  top: -60px;
  left: 16px;
  -moz-border-radius: 20px;
}

.plus a.button {
  border-radius: 16px;
  color: #FFF;
  opacity: 0.75;
  padding: 5px 12px;
  -moz-border-radius: 16px;
}

.thumbnail a.button:hover,
.plus a.button:hover {
  opacity: 1.0;
}

#videos,
#posters {
  z-index: 10;
}

/******* Google search results page **********/
.gs-webResult .gs-visibleUrl-short {
  display: none;
}

.gs-webResult .gs-visibleUrl-long {
  display: block;
}

.section.photos h3 {
  margin-bottom: 0px;
}

/*** Poster thumbails ***/
.section.posters h3,
.section.videos h3 {
  float: left;
  width: 120px;
  margin-bottom: 0px;
}

.section.posters form#posterSelector {
  float: left;
  height: 2em;
  margin-top: 0.6em;
}

.section #posterSelector label {
  padding: 0 0 0 1.3em;
}

.section #posterSelector label.first {
  padding: 0;
}

.section #posterSelector input[type="radio"] {
  margin-left: 0;
}

#page .gallery a img {
  margin: 1px;
  padding: 0;
}

#page .gallery a {
  margin: 0;
  padding: 0;
}

p#summary,
p.summary {
  text-align: center;
  margin-top: 0.5em;
  margin-bottom: 1.5em;
}

p#summary span.warning {
  color: red;
}

/*** Poster upload ***/
#poster_upload_form,
#talk_upload_form {
  text-align: right;
  margin-top: 1.1em;
  padding: 1.1em;
}

#poster_upload_form table,
#talk_upload_form table {
  /* width: 700px; */
}

#poster_upload_form #label_column,
#talk_upload_form #label_column {
  width: 18em;
}

#poster_upload_form label.error,
#talk_upload_form label.error {
  color: #FF0080;
  margin-left: 8px;
  font-size: 10px;
  text-transform: none;
}

.section #poster_upload_form table tr td,
.section #poster_upload_form label {
  color: #333333;
}

#poster_upload_form,
.section #poster_upload_form tr:nth-child(even) {
  background: #DDDDDD;
}

.section #talk_upload_form table tr td,
.section #talk_upload_form label {
  color: #333333;
}

#talk_upload_form,
.section #talk_upload_form tr:nth-child(even) {
  background: #DDDDDD;
}

/******** posters **********/
.poster {
  float: right;
  margin: 25px 20px 0px 25px;
  padding: 0px;
  width: 40%;
}

#posterImgContainer {
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
}

#posterImgContainer.pan:hover {
  /* toggle to scroll cursor on mouse-down & up - see also poster.js*/
  cursor: all-scroll;
}

#posterImgContainer.zoomOut:hover {
  /* toggle to zoom-out cursor on shift-down & up - see also poster.js */
  cursor: -webkit-zoom-out;
  cursor: -moz-zoom-out;
}

/******** styles for the fancybox popup *********/
#message {
  overflow: auto;
  width: 400px;
  height: 250px;
  background-color: #FDFDFD;
}

#page #message {
  display: none;
}

/******* program page *******/
html.js .section.program table,
html.js .section.program h4 a {
  display: none;
}

td a.trigger {
  color: #000;
}

/******* blog format fix (related to <section>sing?
 element) *******/
section {
  background: #FFF;
  display: block;
  padding: 10px 30px;
}

section#page {
  min-height: 650px;
  font-size: 90%;
}

/* handles right-margin for jplist pages */
section.videos,
section.speakers,
section.organizers {
  padding-right: 0px
}

section nav {
  color: #CCC;
  display: block;
  font-size: 111%;
  margin-bottom: 30px;
}

section nav h2 {
  float: left;
  font-size: 2.5em;
  margin: -0.25em 0.5em 0 0;
}

section nav h2 a span.orange {
  color: #FF9900;
}

.orange {
  color: #FF9900;
}

section nav li {
  border-left: 2px solid #CCC;
  display: inline;
  letter-spacing: 0.05em;
  padding: 0 6px;
  text-transform: uppercase;
}

section nav li a,
section nav li a:visited {
  color: #C0C0C0;
}

section h3,
section h4 {
  font-size: 1.8em;
  font-weight: bold;
}

section h4 {
  font-size: 1.3em;
  font-weight: bold;
}

section th {
  padding-right: 12px;
  color: #999;
  font-size: 80%;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

section table {
  border-collapse: collapse;
  margin-bottom: 1em;
  width: 100%;
}

section tr {
  vertical-align: top;
}

section.program tr td:first-child {
  width: 20%;
}

section td,
section th {
  padding: 6px;
}

section tr:nth-child(even) {
  background: #EEE;
}

section tr:nth-child(even) td:first-child {
  /*color: #787878;*/
}

@media print {
  @page {
    margin: 1.5cm;
  }

  header .nav,
  .section .nav ul,
  footer,
  .footer {
    display: none;
  }

  body {
    font-size: 9pt;
    line-height: 1.3em;
    border-bottom: 0px none;
    padding: 1cm;
  }

  div#wrapper {
    margin: 0;
    max-width: 100%;
    padding: 0;
    position: relative;
    top: 0px;
    width: 100%;
  }

  .header h1 {
    font-size: 20pt;
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
  }

  .header h2,
  .section .nav h2,
  .section h3 {
    font-size: 16pt;
    float: none;
    margin: 0.25em 0;
  }

  .header h2 {
    position: relative;
    top: 0;
    left: 0;
    color: #AAA;
    font-size: 12pt;
  }

  span#vizbi {
    text-shadow: none;
    background: none;
  }

  .section {
    margin: 0;
    padding: 0;
  }

  .section .nav h2 {
    font-size: 20pt;
    margin: 4pt 0 0 0;
  }

  .section .program tr td:first-child,
  td.nobr {
    width: 4cm;
  }
}

/* logos in the "footer"*/
.imposed_logo {
  background: #FFF;
  min-height: 80px;
  padding-top: 9em;
  padding-bottom: 3em;
}

/* fake button from the resitration page: */
.fake_button {
  color: #3C9;
  display: inline-block;
  background: #d2d2d2;
  border-radius: 20px;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
  padding: 8px 20px;
  -webkit-box-shadow: 0px 1px 3px #666666;
  -moz-box-shadow: 0px 1px 3px #666666;
  box-shadow: 0px 1px 3px #666666;
}

body.australia .fake_button:hover {
  color: #A559AD;
  background: #d2d2d2;
}

.fake_button:hover {
  display: inline-block;
  background: #3C9;
  color: #FFF;
  border-radius: 20px;
  text-align: center;
  cursor: pointer;
  text-decoration: none;
  padding: 8px 20px;
}

body.australia .fake_button:hover {
  background: #A559AD;
  color: #FFF;
}

.sponsors img {
  height: 80px;
}

div.sponsors {
  position: absolute;
  top: 0px;
  /* left: 24px; */
}