html {
  scroll-behavior: smooth;
}
body {
  font: normal normal normal 1.4em/1.4em georgia,palatino,'book antiqua','palatino linotype',serif;
  padding:0;
  margin:0;
  overflow-x: hidden; /* needed because hiding the menu on the right side is not perfect,  */
}
#header {
  position:fixed;
  top:0;
  left:0;
  background-color:#FAF8F2;
  width:100%;
  z-index:1000;
}
#title {
  background-color:#694887;
  color:white;
  padding:15px 25px 15px 15px;
  float:left;
  font-size:0.9em;
  letter-spacing:0.05em;
  border:0;
  vertical-align:baseline;
  line-height:normal;
}
#title a {
  color:white;
  text-decoration:none;
}
#menu {
  float:right;
  padding-right:20px;
}
@media (max-width: 900px) {
  #menu {
    display: none;
  }
}
#mobile-menu {
  display:none;
}
@media (max-width: 900px) {
  #header {
    background-color:#694887;
  }
  #mobile-menu {
    display: block;
    float:right;
    background-color:#f7cd96;
    padding:10px 35px;
    color:black;
    margin:14px 15px 0 0;
    font:normal normal normal 18px/1.4em "helvetica neue",sans-serif;
    cursor:pointer;
  }
  #mobile-menu a {
    color:black;
    text-decoration:none;
  }
}
@media (max-width: 390px) {
  #mobile-menu {
    padding:10px 15px;
  }
}
#menu li {
  display:inline;
  font:normal normal normal 16px/1.4em'helvetica neue',sans-serif;
  padding:0 15px;
}
#menu a, #menu a:visited {
  text-decoration:none;
  color:black;
}
#menu a:hover {
  color:#694887;
}
#menu a.curr {
  color:#694887;
}
#home {
  background-color:#F5F3E9;
  padding:150px 50px 100px 50px;
}
span.heading {
  font:normal normal normal 70px/1.2em georgia,palatino,'book antiqua','palatino linotype',serif;
}
span.subheading {
  font-family:avenir-lt,sans-serif;   
  font-size:3.1em;
  line-height:1.1em;
}
@media (max-width: 768px) {
  span.heading {
    font:normal normal normal 2.3em/1.2em georgia,palatino,'book antiqua','palatino linotype',serif;
  }
  span.subheading {
    font-size:1.9em;
  }
}
.inner {
  width:780px;
  margin:0 auto;
}
@media (max-width: 768px) {
  .inner {
    width:95%;
    margin:0 auto;
  }
}
.horiz-line1 {
  border-top:1px solid #694887;
  margin:40px 0 20px 0;
}
.horiz-line2 {
  border-top:1px solid #9B86AF;
  margin:60px 0 20px 0;
}
.horiz-line3 {
  border-top:1px solid #FFF;
  margin:40px 0;
}
.horiz-line4 {
  border-top:1px solid #000;
  margin:40px 0;
}
.float {
  float:left;
}
.divider {
  border-left:1px solid #694887;
  margin:-20px 20px 0 60px;
  height:55px;
}
.divider2 {
  border-left:1px solid #9B86AF;
  margin:-20px 20px 0 50px;
  height:80px;
}
@media (max-width: 768px) {
  .divider, .divider2 {
    display:none;
  }
}
#register-button {
  background-color:#694887;
  padding:10px 35px;
  color:white;
  margin:-10px 0 0 0;
  font:normal normal normal 18px/1.4em "helvetica neue",sans-serif;
  cursor:pointer;
}
#register-button.closed, #register-button.closed:hover {
  background-color:#c4b2d4;
}
@media (max-width: 768px) {
  #register-button {
    float:left !important;
  } 
}
#register-button2 {
  background-color:#FFF;
  padding:10px 35px;
  display:inline-block;
  color:white;
  margin:-10px 0 0 0;
  font:normal normal normal 18px/1.4em "helvetica neue",sans-serif;
  cursor:pointer;
  color:#694887;
}
#register-button2.closed {
  color:#bda9d0;
}
#register-button:hover {
  background-color:#947BA5;
}
#about {
  background-color:#694887;
  padding:100px 50px;
}
#event-title {
  font-size:1.1em;
  color:white;
}
#date2, #time {
  color:white;
}
.inner p {
  color:white;
  font:normal normal normal 0.8em/1.4em 'helvetica neue',sans-serif;
}
.inner svg {
  fill:white;
  height:30px;
  transform:rotate(90deg);
}
.schedule-link {
  margin-left:20px;
}
.schedule-link a, .schedule-link a:visited, .schedule-link a:hover {
  color:white;
  text-decoration:none;
}
#schedule {
  background-color:#FBEDDB;
  padding:100px 50px;
}
.schedule {
  margin-left:20px;
}
.schedule-time {
  font-size:0.9em;
  margin-top:50px;
}
.schedule-title {
  font:normal normal normal 0.7em/1.8em 'helvetica neue',sans-serif;
  padding-top:15px;
}
.schedule-title a, .schedule-title a:visited {
  font-weight:bold;
  color:black;
  text-decoration:underline;
  text-decoration-color:#694887;
}
.schedule-title a:hover {
  color:grey;
}
#atlanta {
  background-color:#694887;
  position:relative;
}
#atlanta:before {
  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  background-image: url("/img/atlanta.jpg.webp");
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: cover;
  background-attachment: fixed;
}
@media (max-width: 768px) {
  #atlanta {
    padding:0 30px;
  }
  #atlanta:before {
    background-attachment: scroll;
  }
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
  #atlanta:before {
    background-attachment: scroll;
  }
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
  #atlanta:before {
    background-attachment: scroll;
  }
}
.bg-image {
  opacity: 0.6;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
}
#sponsors {
  background-color:#FAF8F2;
  padding:100px 50px;
}
.sponsor-block {
  width:33%;
  margin-bottom:50px;
  text-align:center;
  height:100px;
  line-height:0.8em;
}
@media (max-width: 768px) {
  .sponsor-block {
    width:100%;
    margin-bottom:20px;
  }
}
@media (min-width: 768px) {
  .long-block {
    margin:0 -100px 0 -100px;
  }
}
@media (max-width: 768px) {
  .long-block {
    margin:0;
  }
}
.sponsor-block .org {
  font-size:1em;
  line-height:1.3em;
  margin-bottom:10px;
}
.sponsor-block .dept {
  font:normal normal normal 0.65em/1.2em avenir-lt,sans-serif;  
}
.clear {
  clear:both;
}
#section6 {
  position:relative;
  min-height:500px;
}
#section6:before {
  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  background-image: url("/img/together.jpg.webp");
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: cover;
  background-attachment: fixed;
}
@media (max-width: 768px) {
  #section6:before {
    background-attachment: scroll;
  }
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
  #section6:before {
    background-attachment: scroll;
  }
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
  #section6:before {
    background-attachment: scroll;
  }
}
#register {
  background-color:#694887;
  padding:100px 50px;
}
#section8 {
  background-color:#FBEDDB;
  height:100px;
}
@media (min-width: 768px) {
  .hidden-spacer {
    display:none;
  } 
}
@media (max-width: 768px) {
  .hidden-spacer {
    display:block;
    width:10px;
  } 
}
.title-block {
  background-color:white;
  padding:50px 0;
  text-align:center;
  font:normal normal normal 60px/1.2em georgia,palatino,'book antiqua','palatino linotype',serif;
}
.speakers {
  background-color:#E8E6E6;
  padding:20px 0;
}
.speaker-block {
  background-color:white;
  width:1000px;
  margin:20px auto;
  position:relative;
  color:#543D04;
}
@media (max-width: 768px) {
  .speaker-block {
    width:100%;
  }
}
.speaker-block .speaker-photo {
  float:left;
  width:35%;
  background-position:center top;
  background-repeat:no-repeat;
  background-size:auto;
}
@media (max-width: 768px) {
  .speaker-block .speaker-photo {
    display: none;
  }
}
@media (min-width: 768px) {
  .speaker-block .speaker-photo-mobile {
    display:none;
  }
}
@media (max-width: 768px) {
  .speaker-block .speaker-photo-mobile {
    display:block;
    background-position:center top;
    background-repeat:no-repeat;
    background-size:auto;
  }
}
.speaker-block .speaker-bio {
  float:left;
  width:60%;
  padding:10px 10px 10px 30px;
}
@media (max-width: 768px) {
  .speaker-block .speaker-bio {
    width:85%;
  }
}
.speaker-bio .name {
  font:normal normal normal 2.5em/1.4em georgia,palatino,'book antiqua','palatino linotype',serif;
  margin-top:60px;
}
.speaker-bio .position {
  font:normal normal normal 1.4em/1.4em georgia,palatino,'book antiqua','palatino linotype',serif;
}
.speaker-bio p {
  font:normal normal normal 16px/1.4em 'helvetica neue',sans-serif;
}
.speaker-bio a, .speaker-bio a:visited {
  color:#694887;
}
.speaker-bio a:hover {
  color:#9779b3;
}
/*
 * Made by Erik Terwan
 * 24th of November 2015
 * MIT License
 *
 *
 * If you are thinking of using this in
 * production code, beware of the browser
 * prefixes.
 */
@media (min-width: 900px) {
  nav {
    display:none;
  }
}

@media (max-width: 900px) {
  #menu-2 a
  {
    text-decoration: none;
    color: #fff;

    transition: color 0.3s ease;
  }

  #menu-2 a:hover
  {
    color: #000;
  }

  #menuToggle
  {
    display: block;
    position: absolute;
    top: 25px;
    right: 50px;

    z-index: 1;

    -webkit-user-select: none;
    user-select: none;
  }

  #menuToggle input
  {
    display: block;
    width: 40px;
    height: 32px;
    position: absolute;
    top: -7px;
    left: -5px;

    cursor: pointer;

    opacity: 0; /* hide this */
    z-index: 2; /* and place it over the hamburger */

    -webkit-touch-callout: none;
  }

  /*
   * Just a quick hamburger
   */
  #menuToggle span
  {
    display: block;
    width: 33px;
    height: 4px;
    margin-bottom: 5px;
    position: relative;

    background: #cdcdcd;
    border-radius: 3px;

    z-index: 1;

    transform-origin: 4px 0px;

    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                opacity 0.55s ease;
  }

  #menuToggle span:first-child
  {
    transform-origin: 0% 0%;
  }

  #menuToggle span:nth-last-child(2)
  {
    transform-origin: 0% 100%;
  }

  /* 
   * Transform all the slices of hamburger
   * into a crossmark.
   */
  #menuToggle input:checked ~ span
  {
    opacity: 1;
    transform: rotate(45deg) translate(-2px, -1px);
    background: #232323;
  }

  /*
   * But let's hide the middle one.
   */
  #menuToggle input:checked ~ span:nth-last-child(3)
  {
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
  }

  /*
   * Ohyeah and the last one should go the other direction
   */
  #menuToggle input:checked ~ span:nth-last-child(2)
  {
    opacity: 1;
    transform: rotate(-45deg) translate(0, -1px);
  }

  /*
   * Make this absolute positioned
   * at the top left of the screen
   */
  #menu-2
  {
    position: absolute;
    width: 200px;
    margin: -100px 0 0 0;
    padding: 125px 50px 500px 50px;
    right: -100px;

    background: #694887;
    list-style-type: none;
    -webkit-font-smoothing: antialiased;
    /* to stop flickering of text in safari */

    transform-origin: 0% 0%;
    transform: translate(100%, 0);

    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
  }

  #menu-2 li
  {
    padding: 10px 0;
    font:normal normal normal 1em/1.4em'helvetica neue',sans-serif;
  }

  /*
   * And let's fade it in from the left
   */
  #menuToggle input:checked ~ ul
  {
    transform: none;
    opacity: 1;
  }

  #menuToggle input:checked + #main
  {
    opacity:0.2;
  }
}