/* Mobile CSS of TEDxLakeComo.com
(c) 2019 TEDxLakeComo.com. All rights reserved. */

:root {
  /* Mobile Variables */
  --main-header-logo-width-mobile: 70vw;
  --iOS-bottom-nav: 110px;
}

@media (max-width: 768px) {
  html,
  body {
    font-size: 60%;
  }

  header {
    padding: 0 var(--main-page-side-padding);
    width: calc(100% - 2 * var(--main-page-side-padding));
    /* height: calc(100vh - var(--iOS-bottom-nav) - var(--navbar-height)); */
    height: calc(100vh - var(--navbar-height));
  }

  #header-logo-container {
    width: var(--main-header-logo-width-mobile);
    max-width: var(--main-header-logo-width-mobile);
  }

  #header-logo {
    margin-bottom: 1.5rem;
  }

  #header-venue {
    justify-content: center;
  }

  #header-venue span {
    font-size: 2.2rem;
  }

  section#intro p:first-of-type {
    font-size: 2.5rem;
  }

  #cover-copyright {
    width: calc(100% - 15px);
    color: white;
    font-size: 1.5rem;
  }

  .button {
    font-size: 1.8rem;
    padding: 1rem 0;
  }

  #btn-acquista,
  #btn-acquista div {
    margin: 0;
    padding: 0;
  }

  #btn-acquista div {
    margin: 0 15px;
    margin-top: 15px;
    padding: 2rem 0;
  }

  .panoramic-box .grid-item {
    width: 100% !important;
  }

  section > h2:first-child {
    padding-left: 6rem;
  }

  section#team {
    background-attachment: scroll;
  }

  div.team-member {
    width: 150px;
    height: 150px;
    max-width: 150px;
  }

  div.team-member-info {
    width: 150px;
    height: 150px;
    color: white !important;
  }

  .ruolo-team-member {
    color: var(--ted-yellow) !important;
  }
  
  h3.nome-team-member {
    font-size: 2rem;
  }

  .flex-container {
    justify-content: center;
  }

  .about-ted-container div {
    width: 100% !important;
  }

  .maximize-width-on-mobile {
    width: 100%;
  }

  #newsletter-email {
    width: 100%;
    line-height: 3;
  }


  #newsletter-button {
    margin-top: 1rem;
    width: 100%;
  }

  span.patron {
    /* border: 0px !important; */
    /* width: 100%; */
    margin: 0.5rem 0;
    padding: 0 0.5rem;
    font-size: 1.4rem;
    border-left: 1px solid var(--ted-red);
  }

  /* span.patron::before {} */

  .protagonista-hover {
    display: none;
  }

  .container-video {
    max-width: 100% !important;
    width: 100% !important;
  }

  .partner-logo {
    width: 90px !important;
  }

  .tedx-community-logo {
    height: auto;
  }

  div#eventbrite-widget-container-64132653493 {
    height: 800px !important;
  }

  /* CSS for YouTube Conversazioni Thumbnails */

  .container-conversazione {
    flex-direction: column-reverse !important;
  }

  .container-conversazione .video-thumb {
    width: 100%;
  }

  .conversazione-name,
  .conversazione-title {
    font-size: 2rem;
  }

  .conversazione-info {
    font-size: 1.8rem;
    text-align: left !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 1rem !important;
    width: 100% !important;
  }

  .video-hover {
    /* opacity: 1 !important; */
    background: none !important;
  }

  .video-hover-content {
    font-size: 2em;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  /* CSS for YouTube Video Thumbnails */

  .container-video {
    max-width: 50% !important;
    width: 50% !important;
  }
}

@media screen and (orientation: landscape) and (max-width: 768px) {
  header {
    height: calc(100vh - var(--navbar-height));
  }

  #header-logo {
    padding-top: 0px !important;
    margin-top: -10px !important;
  }
}