:root {
    --primary: #00baf2;
    --secondary: #95989a;
    --text-color: #fff;
    --text-secondary: #000;
    --text-tertiary: #5d5d5d;
  }
  
  * {
    margin: 0;
    padding: 0;
  }

  /* Modal */
  .modal-body{
    background-color: #FB5C00;
  }

  #prim_modal{
    font-size: 20px;
    margin-left: 15%;
    margin-top: 10%;
    font-family: "Sequel100Black-55";
  }

  #seg_modal{
    font-size: 15px;
    margin-left: 13%;
    font-family: "Sequel100Black-55";
    margin-top: 4%;
  }

  #ter_modal{
    font-size: 18px;
    /* user-select: none; */
    color: #FB5C00;
    background-color: white;
    width: 50%;
    margin-left: 22%;
    border: 1px solid transparent;
    border-radius: 0.8em;
    font-family: "Sequel100Black-55";
    margin-top: 3%;
  }

  #quart_modal{
    font-size: 13px;
    font-family: "Sequel100Black-55";
    margin-top: 5%;
    margin-bottom: 10%;
    text-align: justify;
  }

  .modal {
    text-align: center;
    padding: 0!important;
  }
  
  .modal:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px;
  }
  
  .modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
  }
  
  /* Event form */
  #event-subscription {
    background: url("../img/bg_lpfibra.png");
    background-position: center;
    background-size: cover;
    height: 85vh;
    display: flex;
    justify-content: space-around;
    align-items: center;
    color: var(--text-color);
  }
  
  #disclaimer h2,
  #disclaimer .event-date {
    color: var(--primary);
  }
  
  #disclaimer h2 {
    font-size: 3em;
    margin-bottom: 1em;
  }
  
  #disclaimer .about-event {
    font-size: 2em;
    text-transform: uppercase;
    max-width: 350px;
    font-weight: bold;
    margin-bottom: 1em;
  }
  
  #disclaimer p {
    font-size: 1.2em;
    margin-bottom: 0.3em;
  }
  
  #disclaimer .event-date {
    font-weight: bold;
  }
  
  #subscription-form {
    background-color: url("../img/bg_lpfibra.png");
    padding: 2em;
    max-width: auto;
    margin-right: 5%;
    margin-top: -3%;
  }
  
  #fonte_cadastro_submit{
      font-family: "Sequel100Black-55";
      font-size: 13px;
  }
  
  #subscription-form p {
    font-family: "Goldplay Bold";
    font-size: 1.0em;
    margin-bottom: 2em;
  }
  
  .form-control{
      font-family: "Sequel100Black-45";
  }
  
  .form-group {
    display: flex;
    flex-direction: column;
    margin-bottom: 0.8em;
  }
  
  .form-group label {
    color: var(--text-tertiary);
    margin-bottom: 0.3em;
    font-weight: bold;
  }
  
  .form-group input,
  .form-group select {
    padding: 6px 8px;
    border-radius: 5px;
    border: none;
    outline: none;
    height: 35px;
    font-size: 1em;
  }
  
  .btn {
    font-family: "Sequel100Black-55";  
    background-color: #253f8a;
    text-transform: uppercase;
    font-size: 1em;
    width: 100%;
    padding: 12px;
    border: none;
    cursor: pointer;
    border-radius: 0.5rem;
    overflow: hidden;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    color: white;
  }
  
  .ter_modal:hover {
      font-family: Goldplay Bold;
      font-size: 20px;
      margin-top: -0%;
      background-color: white;
      border: none;
      transform: scale(1.1);
      color: #FB5C00;
      cursor: pointer;
  }

  .btn:hover {
    font-family: "Sequel100Black-55";
    font-size: 20px;
    height: 50px;
    margin-top: -0%;
    background-color: white;
    border: none;
    border-radius: 0.5rem;
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    color: #253f8a;
}
  
  .img_desktop{
      width: 90%;
      height: 90%;
      margin-left: auto;
	  margin-top: 40px;
  }
  
  #img_promo{
    width: 70%;
    height: 70%;
    margin-left: 15%;
    margin-bottom: 1em;
    margin-top: 3em;
  }
  
  /* Navbar */
  #navbar {
      width: 100%;
      background: #FB5C00;
      height: 80px;
  }
  
  #navbar-container {
      width: 80%;
      height: 100%;
      margin: auto;
      display: flex;
      justify-content: space-between;
      align-items: center;
  }
  
  #navbar img{
      width: 150px;
      height: 50px;
      -moz-transition: all 0.3s;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;
  }
  
  #navbar:hover img{
      -moz-transform: scale(1.1);
      -webkit-transform: scale(1.1);
      transform: scale(1.1);
      -moz-transition: all 0.3s;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;
      cursor: pointer;
  }
  
  /* Benefits section */
  #key-benefits h2 {
    background-color: var(--secondary);
    text-align: center;
    padding: 2em;
    font-weight: 500;
  }
  
  .benefits {
    display: flex;
    justify-content: space-around;
    padding: 4em;
    width: 80%;
    margin: 0 auto;
  }
  
  .benefit {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 20%;
    color: var(--text-tertiary);
  }
  
  .benefit .benefit-img {
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    margin-bottom: 1em;
  }
  
  #benefit-1 {
    background-image: url("../img/sqr-1.jpg");
  }
  
  #benefit-2 {
    background-image: url("../img/sqr-2.jpg");
  }
  
  #benefit-3 {
    background-image: url("../img/sqr-3.jpg");
  }
  
  /* Event location */
  #location {
    height: 400px;
    background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)),
      url("../img/hrz-1.jpg");
    background-position: center;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: space-around;
    color: var(--text-color);
    margin-bottom: 3em;
  }
  
  #address,
  #about-location {
    max-width: 30%;
  }
  
  #address {
    display: flex;
  }
  
  #address i {
    color: var(--primary);
    font-size: 4em;
    margin-right: 0.5em;
  }
  
  #address-details {
    text-align: center;
    font-size: 1.3em;
  }
  
  #about-location h3 {
    color: var(--primary);
    font-size: 2.5em;
    margin-bottom: 1em;
    text-transform: uppercase;
  }
  
  #about-location p {
    line-height: 1.5em;
  }
  
  /* Event details container */
  #details {
    width: 80%;
    margin: 0 auto;
  }
  
  .detail {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 5%;
    margin-bottom: 4em;
  }
  
  .detail img {
    width: 50%;
  }
  
  .detail h3 {
    margin-bottom: 1em;
    font-size: 2em;
    font-weight: 500;
  }
  
  #detail-1 h3 {
    font-size: 3em;
    font-weight: 700;
  }
  
  .detail-description {
    width: 100%;
    padding-left: 2em;
  }
  
  #detail-3 .detail-description {
    justify-self: flex-start;
  }
  
  .detail-description ul {
    list-style-position: inside;
  }
  
  .detail-description ul li {
    margin-bottom: 0.4em;
  }
  
  .detail-description ul li:last-child {
    font-weight: bold;
  }
  
  /* Call to Action Section */
  #cta {
    height: 300px;
    background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)),
      url("../img/hrz-6.jpg");
    background-position: center;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    color: var(--text-color);
  }
  
  #cta h3 {
    margin-bottom: 1.2em;
    font-size: 2em;
    font-weight: 500;
  }
  
  #cta .btn {
    width: 30%;
    margin: 0 auto;
    font-weight: 600;
    font-size: 1.2em;
  }
  
  /* Footer */
  #footer {
    font-family: "Sequel100Black-45";   
    text-align: center;
    color: var(--secondary);
    height: 150px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 4em;
    margin-right: 4em;
  }
  
  #footer h3 {
    font-size: 1.8em;
    margin-bottom: 0.5em;
  }
  
  /* #footer p:nth-child(2) {
    margin-bottom: 1em;
    font-size: 1.2em;
  } */
  
  #footer span {
    font-weight: bold;
  }

  /* Mobile Vertical*/
  @media (max-width: 450px) {

    .modal-body{
        background-color: #FB5C00;
      }
    
      #prim_modal{
        font-size: 20px;
        margin-left: 18%;
        margin-top: 10%;
        font-family: "Sequel100Black-55";
      }
    
      #seg_modal{
        font-size: 15px;
        margin-left: 15%;
        font-family: "Sequel100Black-55";
        margin-top: 4%;
      }
    
      #ter_modal{
        font-size: 20px;
        /* user-select: none; */
        color: #FB5C00;
        background-color: white;
        width: 55%;
        margin-left: 20%;
        border: 1px solid transparent;
        border-radius: 0.8em;
        font-family: "Sequel100Black-55";
        margin-top: 3%;
      }
    
      #quart_modal{
        font-size: 15px;
        font-family: "Sequel100Black-55";
        margin-top: 5%;
        margin-left: 4%;
        margin-bottom: 10%;
      }
    
      .modal {
        text-align: center;
        padding: 0!important;
      }
      
      .modal:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
        margin-right: -4px;
      }
      
      .modal-dialog {
        display: inline-block;
        text-align: left;
        vertical-align: middle;
      }

    #navbar {
        width: 100%;
        background: #FB5C00;
        height: 60px;
    }

    #navbar-container {
        width: 100%;
        height: 100%;
        margin: auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    #navbar img{
        width: 150px;
        height: 30px;
        -moz-transition: all 0.3s;
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
    }
    
    #navbar:hover img{
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        -moz-transition: all 0.3s;
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
        cursor: pointer;
    }

    .img_desktop{
        width: 117%;
        height: 117%;
        margin-left: -8%;
        margin-top: -5%;
    }

    #img_promo{
        width: 100%;
        height: 100%;
        margin-left: 2%;
        margin-bottom: 1em;
        margin-top: 8%;
      }

    #footer {
        font-family: "Goldplay Regular";   
        text-align: center;
        color: var(--secondary);
        height: 275px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        font-size: 0.8em;
        margin-left: 3em;
        margin-right: 3em;
      }

    #fonte_cadastro_submit{
        margin-top: 1em;
    }

    /* Event form */
    #event-subscription {
      flex-direction: column;
      height: auto;
    }
  
    #disclaimer {
      padding: 2em;
    }
  
    #disclaimer h2 {
      margin-bottom: 0.5em;
    }
  
    #subscription-form {
      margin-top: -20%;
      width: 100%;
      margin-bottom: 1em;
      margin-right: -1%;
    }

    .form-group input, .form-group select {
        padding: 6px 8px;
        border-radius: 5px;
        border: none;
        outline: none;
        height: 25px;
        font-size: 1em;
    }

    #subscription-form p {
        font-family: "Sequel100Black-55";
        font-size: 15px;
        margin-bottom: 2em;
        text-align: center;
    }    
  
    /* Benefits section */
    .benefits {
      flex-direction: column;
      align-items: center;
      width: auto;
      padding: 2em;
    }
  
    .benefit {
      max-width: 100%;
      margin-bottom: 2em;
    }
  
    /* Event location */
    #location {
      flex-direction: column;
      height: auto;
      text-align: center;
      padding: 2em 0;
    }
  
    #address {
      order: 2;
      flex-direction: column;
      max-width: 100%;
    }
  
    #address i {
      margin: 0.3em 0;
    }
  
    #about-location {
      order: 1;
      max-width: 100%;
    }
  
    #about-location h3 {
      margin-bottom: 0;
    }
  
    #about-location p {
      display: none;
    }
  
    /* Event details container */
    .detail {
      flex-direction: column;
      margin-bottom: 0.5em;
      gap: 0;
    }
  
    .detail img {
      width: 100%;
      margin: 2em 0;
    }
  
    #detail-1 img {
      display: none;
    }
  
    .detail-description {
      padding: 0;
    }
  
    #detail-3 img {
      order: 2;
    }
  
    #detail-3 .detail-description {
      order: 1;
    }
  
    /* Call to Action Section */
    #cta .btn {
      width: 80%;
    }
  }

  /* Mobile horizontal*/
  @media (max-height: 450px) {
    #navbar {
        width: 100%;
        background: #FB5C00;
        height: 60px;
    }

    #navbar img{
        width: 150px;
        height: 30px;
        -moz-transition: all 0.3s;
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
    }
    
    #navbar:hover img{
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        -moz-transition: all 0.3s;
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
        cursor: pointer;
    }

    .img_desktop {
        width: 85%;
        height: 85%;
        margin-left: auto;
        margin-top: -5%;
        margin-bottom: 15%;
    }

    #footer {
        font-family: "Goldplay Regular";   
        text-align: center;
        color: var(--secondary);
        height: 190px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        font-size: 0.8em;
      }

    #fonte_cadastro_submit{
        margin-top: 1em;
    }

    /* Event form */
    #event-subscription {
      flex-direction: column;
      height: auto;
    }
  
    #disclaimer {
      padding: 2em;
    }
  
    #disclaimer h2 {
      margin-bottom: 0.5em;
    }
  
    #subscription-form {
      margin-top: -20%;
      width: 90%;
      margin-bottom: 1em;
      margin-right: -1%;
    }

    .form-group input, .form-group select {
        padding: 6px 8px;
        border-radius: 5px;
        border: none;
        outline: none;
        height: 25px;
        font-size: 1em;
    }

    #subscription-form p {
        font-family: "Goldplay Bold";
        font-size: 1.0em;
        margin-bottom: 1em;
        text-align: center;
    }    
  
    /* Benefits section */
    .benefits {
      flex-direction: column;
      align-items: center;
      width: auto;
      padding: 2em;
    }
  
    .benefit {
      max-width: 100%;
      margin-bottom: 2em;
    }
  
    /* Event location */
    #location {
      flex-direction: column;
      height: auto;
      text-align: center;
      padding: 2em 0;
    }
  
    #address {
      order: 2;
      flex-direction: column;
      max-width: 100%;
    }
  
    #address i {
      margin: 0.3em 0;
    }
  
    #about-location {
      order: 1;
      max-width: 100%;
    }
  
    #about-location h3 {
      margin-bottom: 0;
    }
  
    #about-location p {
      display: none;
    }
  
    /* Event details container */
    .detail {
      flex-direction: column;
      margin-bottom: 0.5em;
      gap: 0;
    }
  
    .detail img {
      width: 100%;
      margin: 2em 0;
    }
  
    #detail-1 img {
      display: none;
    }
  
    .detail-description {
      padding: 0;
    }
  
    #detail-3 img {
      order: 2;
    }
  
    #detail-3 .detail-description {
      order: 1;
    }
  
    /* Call to Action Section */
    #cta .btn {
      width: 80%;
    }
  }
  
  /* Fontes */
  @font-face {
      font-family: "Goldplay Bold";
      src: url(../fonte/Goldplay\ Bold.otf);
  }
  
  @font-face {
      font-family: "Goldplay Regular";
      src: url(../fonte/Goldplay\ Regular.otf);
  }
  
  @font-face {
      font-family: "Goldplay Black";
      src: url(../fonte/Goldplay\ Black.otf);
  }
  
  @font-face {
      font-family: "Goldplay Light";
      src: url(../fonte/Goldplay\ Light.otf);
  }
  
  @font-face {
      font-family: "Goldplay Medium";
      src: url(../fonte/Goldplay\ Medium.otf);
  }
  
  @font-face {
      font-family: "Goldplay SemiBold";
      src: url(../fonte/Goldplay\ SemiBold.otf);
  }
  
  @font-face {
      font-family: "Goldplay Thin";
      src: url(fonte/Goldplay\ Thin.otf);
  }
  
  @font-face {
    font-family: "Sequel100Black-45";
    src: url(../fonte/Sequel100Black-45.ttf);
}

@font-face {
    font-family: "Sequel100Black-55";
    src: url(../fonte/Sequel100Black-55.ttf);
}