@font-face {
    font-family: fa-solid;
    src: url('../fonts/fa-solid-900.ttf');
  }

  @font-face {
    font-family: fa-regular;
    src: url('../fonts/fa-regular-400.ttf');
  }

  @font-face {
    font-family: fa-brands;
    src: url('../fonts/fa-brands-400.ttf');
  }

  @font-face {
    font-family: font-thin;
    src: url('../fonts/Roboto-Thin.ttf');
  }

  @font-face {
    font-family: font-light;
    src: url('../fonts/Roboto-Light.ttf');
  }

  @font-face {
    font-family: font-regular;
    src: url('../fonts/Roboto-Regular.ttf');
  }

  @font-face {
    font-family: font-medium;
    src: url('../fonts/Roboto-Medium.ttf');
  }

  @font-face {
    font-family: font-bold;
    src: url('../fonts/Roboto-Bold.ttf');
  }

  @font-face {
    font-family: font-black;
    src: url('../fonts/Roboto-Black.ttf');
  }

  @font-face {
    font-family: bebas;
    src: url('../fonts/BebasNeue-Regular.ttf');
  }

  body{
      font-family: font-light;
      background-color: #ececec;
      color: #121212;
  }

  strong, b{
      font-family: font-bold;
  }

  h1, h2, h3, h4, h5, h6{
    font-family: font-bold;
}
  
  a{
    color: #f79321;
  }

  a:hover{
      color: #d67505;
  }

  .bebas{
    font-family: 'bebas';
  }

  .font-medium{
    font-family: 'font-medium';
  }

  .fas{
      font-family: fa-solid;
  }

  .far{
      font-family: fa-regular;
  }

  .fab{
      font-family: fa-brands;
  }

  .cor-amarelo{
    color: #faeb1e;
  }

  .cor-cinza{
      color:  #adacac;
  }

  .cor-chumbo{
      color: #121212;
  }

  .cor-azul{
    color: #077ea9;
  }

  .fundo-amarelo{
      background-color: #faeb1e;
  }

  .fundo-cinza{
    background-color:  #2d2d2d;
  }

  .fundo-chumbo{
    background-color: #121212;
  }

  .fundo-azul{
    background-color: #077ea9;
  }

  .roxo-azul{
    background: rgb(209,0,249);
background: linear-gradient(90deg, rgba(209,0,249,1) 0%, rgba(209,0,249,1) 50%, rgba(7,126,169,1) 50%, rgba(7,126,169,1) 100%);
  }

  .roxo-laranja{
    background: rgb(209,0,249);
background: linear-gradient(90deg, rgba(209,0,249,1) 0%, rgba(209,0,249,1) 50%, rgba(246,172,39,1) 50%, rgba(246,172,39,1) 100%);
  }

  .azul-laranja{
    background: rgb(248,198,51);
    background: linear-gradient(
-90deg
, rgba(248,198,51,1) 0%, rgba(246,172,39,1) 42%, rgba(7,126,169,1) 42%, rgba(7,126,169,1) 100%);
  }

  .roxo-azul-gradual{
    background: rgb(209,0,249);
background: linear-gradient(90deg, rgba(209,0,249,1) 0%, rgba(7,126,169,1) 78%);
  }

  .fundo-laranja{
    background-color: #f6ac27;
  }

  .fundo-roxo{
    background-color: #d100f9;
  }

  .fundo-metade{
    height: 192px;
    width: 100%;
    position: absolute;
    z-index: -1;
  }

  

  #section-enem{
    background-image: url(../images/estudo.jpg);
    background-position: left;
    background-repeat: no-repeat;
    background-size: 58%;
    padding-bottom: 4em;
  }

  .caixa-direita{
    position: absolute;
    z-index: 1;
    right: -88%;
  }

  .h-max{
    max-height: 400px;
  }

  .titulo-box{
    background: #2d2d2d;
    padding: 0.5rem;
    border: 5px solid #faeb1e;
  }

  #countdown li {
    display: inline-block;
    list-style-type: none;
    padding: 0 1em;
  }
  
  #countdown li span {
    display: block;
  }

  .list-box{
    list-style: none; 
    font-size: 0.9rem;
  }

  .list-box li{
    padding: 5px 7px;
  }

  .list-box li:first-of-type{
    background-color: #212121;
  }

  .list-box li:nth-of-type(2){
    background-color: #171717;
  }

  .list-box li:last-of-type{
    background-color: #121212;
  }

  .card-box{
    background-color: #ffffff;
    top: 10%;
    padding: 0.5em;
  }

  .card-box h6{
      color: #121212;
  }

  .card-box:hover{
    background-color: #faeb1e;
    cursor: pointer;
  }

  .linha-footer{
    background-color: #f6ac27;
    height: 7px;
  }

  footer{
      background-color: #121212;
  }

  @media only screen and (min-width: 992px) {
    #logo-tvescola{
      position: absolute;
      top: 5%;
      left: -1%;
      width: 154px;
    }

    #section-enem{
      background-image: url(../images/estudo.jpg);
      background-position: left;
      background-repeat: no-repeat;
      background-size: 58%;
      padding-bottom: 4em;
    }
  }
  .mensagemResultado{
    background-color: rgb(255, 224, 224);
    color: rgb(164, 0, 0);
    border: 1px solid rgb(164, 0, 0);
  }