#interna > div > div:nth-child(1) {
  display: none;
}

.dentro-wrapper {
  background-color: #fff;
  height: 43.5rem;
}

.card-docente{
    /* float:right; */
    cursor: pointer;
}

/* .docente-img{
    width: 100%;
    height: 17rem;
} */

.docente-info {
text-align: left;
}
p.intro-docente {
  
  padding-top: 6rem;
  padding-left: 2rem;
  color: black;
}

.docente-title {

}

img.imagem-dentro {
    width: 25rem;  
    margin-left: 2rem;
    padding-top: 3rem;
    padding-left: 2rem;
     /* -webkit-animation-delay:0.5s; */
     -webkit-animation-name:opacity;
     -webkit-animation-duration:1.5s;
     -webkit-animation-iteration-count:1;
     /* -webkit-animation-delay:0.5s; */
     -webkit-animation-fill-mode: forwards;
     float: left; 
     margin-right: 2rem;
    }

.intro-docente{

  -webkit-animation-name:opacity;
     -webkit-animation-duration:1.1s;
     -webkit-animation-iteration-count:1;
     color: white;
     font-size: 18px;

}

.caixa-dentro0, .caixa-dentro1,.caixa-dentro2,.caixa-dentro3,.caixa-dentro4, .caixa-dentro5,.caixa-dentro6,.caixa-dentro7,.caixa-dentro8,.caixa-dentro9,.caixa-dentro10{
  display: none;    
  height: 50rem;
}


.fa-chevron-left{
float: right;
color: white;
font-size: 6rem;
-webkit-animation-name:opacity;
   -webkit-animation-duration:1.30s;
   -webkit-animation-iteration-count:1;
   font-size: 3rem;
   margin-top: 13rem;
   margin-right: 3rem;
}


/* 
#interna > div > div:nth-child(2) > div > div > div:nth-child(2) > div:nth-child(1) > div.caixa-dentro0 > p{

    padding-top: 6rem;
  padding-left: 2rem;
} */
.dentro-wrapper {

transition: all 20.1s;
}

.caixa-dentro0,.caixa-dentro1,.caixa-dentro2,.caixa-dentro3{
position: relative;
}


.seta0 {
  width: 2rem;
  height: 0rem;
  background: #94c11f;
  position: relative;
  /* animation: mymove-esquerda 5s; */  
  display: none;
  -webkit-animation-name:line0;
  -webkit-animation-duration:1.1s;
  -webkit-animation-iteration-count:1;
  /* -webkit-animation-delay:0.5s; */
  -webkit-animation-fill-mode: forwards;
  bottom: 24rem;
  }

  .seta1{
 width: 16rem;
 height: 0rem;
 background: #94c11f;
 position: relative;
 display: none;
 -webkit-animation-name:line1;
 -webkit-animation-duration:1.1s;
-webkit-animation-iteration-count:1;
/* -webkit-animation-delay:0.5s; */
-webkit-animation-fill-mode: forwards;
bottom: 24rem;
 }


 .seta2 {
 width: 50%;
 height: 0rem;
 background: #94c11f;
 position: relative;
  /* animation: mymove-esquerda 5s; */  
 display: none;
 -webkit-animation-name:line2;
 -webkit-animation-duration:1.1s;
  -webkit-animation-iteration-count:1;
 /* -webkit-animation-delay:0.5s; */
 -webkit-animation-fill-mode: forwards;
 bottom: 24rem;

}

  .seta3 {
 width: 50%;
 height: 0rem;
 background: #94c11f;
 position: relative;
  /* animation: mymove-esquerda 5s; */  
  display: none;
 -webkit-animation-name:line3;
 -webkit-animation-duration:1.1s;
 -webkit-animation-iteration-count:1;
 /* -webkit-animation-delay:0.5s; */
 -webkit-animation-fill-mode: forwards;
 bottom: 24rem;
 }
 
 .seta4 {
  width: 2rem;
  height: 0rem;
  background: #94c11f;
  position: relative;
  /* animation: mymove-esquerda 5s; */  
  display: none;
  -webkit-animation-name:obstaculo0;
  -webkit-animation-duration:1.1s;
  -webkit-animation-iteration-count:1;
  /* -webkit-animation-delay:0.5s; */
  -webkit-animation-fill-mode: forwards;
  bottom: 18rem;
  }

  .seta5 {
    width: 50%;
    height: 0rem;
    background: #94c11f;
    position: relative;
    /* animation: mymove-esquerda 5s; */  
    display: none;
    -webkit-animation-name:obstaculo1;
    -webkit-animation-duration:1.1s;
    -webkit-animation-iteration-count:1;
    /* -webkit-animation-delay:0.5s; */
    -webkit-animation-fill-mode: forwards;
    bottom: 18rem;
    }



    .seta6 {
      width: 50%;
      height: 0rem;
      background: #94c11f;
      position: relative;
      /* animation: mymove-esquerda 5s; */  
      display: none;
      -webkit-animation-name:obstaculo2;
      -webkit-animation-duration:1.1s;
      -webkit-animation-iteration-count:1;
      /* -webkit-animation-delay:0.5s; */
      -webkit-animation-fill-mode: forwards;
      bottom: 18rem;
      }

      .seta7 {
        width: 50%;
        height: 0rem;
        background: #94c11f;
        position: relative;
        /* animation: mymove-esquerda 5s; */  
        display: none;
        -webkit-animation-name:obstaculo3;
        -webkit-animation-duration:1.1s;
        -webkit-animation-iteration-count:1;
        /* -webkit-animation-delay:0.5s; */
        -webkit-animation-fill-mode: forwards;
        bottom: 18rem;
        }

        .seta8 {
          width: 5rem;
          height: 0rem;
          background: #94c11f;
          position: relative;
          /* animation: mymove-esquerda 5s; */  
          display: none;
          -webkit-animation-name:obstaculo4;
          -webkit-animation-duration:1.1s;
          -webkit-animation-iteration-count:1;
          /* -webkit-animation-delay:0.5s; */
          -webkit-animation-fill-mode: forwards;
          bottom: 18rem;
          }

  /* Animações Hover */

  /* .docente 
  {
    filter: grayscale(80%);
  } */

  
  .docente:hover .card-docente {
    /* opacity: 0.6; */
    transition: all 0.8s;
    filter: brightness(20%);
}

.card-docente:hover {
  /* opacity: 1 !important; */
  filter: brightness(100%)!important;
}





@keyframes line1 {
  0% {
    
    position: absolute;
    right:60rem;
    width: 0%;
    height: 0;
}


15% {
  height: 0;
  position: absolute;
  right:60rem;
  width: 0%;
  
}
30% {
    height: 0%;
    position: absolute;
    right:60rem;
    width: 0%;
}
50% {
  height: 2%;
  position: absolute;
  right:60rem;
  width: 2%;
}
60% {
  right:60rem;
  height: 48%;
  position: absolute; 
  width: 20%;
}

70%{
  right:60rem;
  height: 48%;
  position: absolute;
  width: 20%;

}

100% {
  right:113rem;
  height: 48%;
  position: absolute;
  width: 20%;
  
}
}



@keyframes line2 {
  0% {
    position: absolute;
    right:38rem;
    width: 0%;
    height: 0;
    
}
30% {

    position: absolute;
    right:38rem;
    width: 0%;
    height: 0;
}
0% {

  position: absolute;
  right:38rem;
  width: 2%;
  height: 2%;
}
60% {
  right:38rem;
  position: absolute;
  width: 20%;
    height: 48%; 
}

70%{
  right:38rem;
  height: 48%;
  position: absolute;
  width: 20%;

}

100% {
  right:113rem;
  height: 48%;
  position: absolute;
  width: 20%;
  
}
}



@keyframes line3{
  0% {
    width: 0%;
    height: 0;
    position: absolute;
    right:10rem;
    
    
}
30% {
   
    position: absolute;
    right:10rem;
    width: 0%;
    height: 0;
}
50% {
   
  position: absolute;
  right:10rem;
  width: 2%;
  height: 2%;
}

60% {
  right:10rem;
 
  position: absolute; 
  width: 20%;
  height: 48%;
}

70%{
  right:10rem;
  height: 48%;
  position: absolute;
  width: 20%;

}

100% {
  right:113rem;
  height: 48%;
  position: absolute;
  width: 20%;
  
}
}

@keyframes obstaculo0{
  0% {
      
      position: absolute;
       right:90rem;
      width: 0%;
      height: 0;
      
  }
  15% {
     
      position: absolute;
       right:90rem;
      width: 0%;
      height: 0;
  }
  30% {
     
    position: absolute;
     right:90rem;
    width: 2%;
    height: 2%;
}
  60% {
    right:90rem;
   
    position: absolute; 
    width: 20%;
    height: 48%;
  }

  70%{
    right:90rem;
    height: 48%;
    position: absolute;
    width: 20%;

  }

  100% {
    right:110rem;
    height: 48%;
    position: absolute;
    width: 20%;
    
  }
}



@keyframes obstaculo1{
  0% {
    width: 0%;
    height: 0;
      position: absolute;
    right:60rem;
      
  
      
  }
  30% {
  
      position: absolute;
      right:60rem;
      width: 0%;
    height: 0;
  }
  50% {
  
    position: absolute;
    right:60rem;
    width: 2%;
  height: 2%;
}
  60% {
  
    height: 48%;
    position: absolute; 
    width: 20%;
    right:60rem;
  }

  70%{
    right:60rem;
    height: 48%;
    position: absolute;
    width: 20%;
  }

  100% {
    right:110rem;
    height: 48%;
    position: absolute;
    width: 20%;
    
  }
}



@keyframes obstaculo2{
  0% {
      position: absolute;
      right:30rem;
      width: 0%;
      height: 0;
  }
  30% {
    width: 0%;
    height: 0;
      position: absolute;
      right:30rem;
     
  }


  50% {
    width: 2%;
    height: 2%;
    /* height: 48%; */
    position: absolute; 
   
  }
  60%{
    right:30rem;
    height: 48%;
    position: absolute;
    width: 20%;
  }

  100% {
    right:110rem;
    height: 48%;
    position: absolute;
    width: 20%;
    
  }
}



@keyframes obstaculo3{
  0% {
    
      position: absolute;
      right:20rem;
      width: 0%;
      height: 0;
      
  }
  30% {
     
      position: absolute;
      right:2rem;
      width: 0%;
      height: 0;
  }
 50% {
     
    position: absolute;
    right:2rem;
    width: 2%;
    height: 2%;
}

  60% {
    right:2rem;
    position: absolute; 
    width: 20%;
    height: 48%;
  }

  70%{
    right:2rem;
    height: 48%;
    position: absolute;
    width: 20%;
  }

  100% {
    right:110rem;
    height: 48%;
    position: absolute;
    width: 20%;
    
  }
}




@keyframes opacity {
    0% { 
      opacity: 0%;
    }
     30% {
      opacity: 0%;
    }
    60% {
      opacity: 0%;
    }
    100% {
      opacity: 100%;
    }
  }

  @keyframes opacity-volta {
    0% { 
      opacity: 100%;
    }
     30% {
      opacity: 100%;
    }
    60% {
      opacity: 0%;
    }
    100% {
      opacity: 0%;
    }
  }


  @keyframes line0{
    0% {
      width: 0%;
      height: 0;
      position: absolute;
      right:90rem;
   
      
  }
  30% {
    width: 0%;
    height: 0;
      position: absolute;
      right:90rem;
      
  }
  50% {
    width: 2%;
    height: 2%;
      position: absolute;
      right:90rem;
      
  }
  60% {
    right:90rem;
    width: 10%;
    height: 20;
    position: absolute; 
   
  }

  70%{
    right:90rem;
    height: 48%;
    position: absolute;
    width: 20%;

  }

  100% {
    right:113rem;
    height: 48%;
    position: absolute;
    width: 20%;
    
  }
}





  /* #interna > div > div:nth-child(2) > div > div > div:nth-child(2) > div:nth-child(1) > div.seta {
    display: none!important;
} */

@media screen and (min-width: 1048px) and (max-width: 1366px) and (max-height: 768px) { 


}


/* animação volta */

.botao-volta{
  right:48rem;
  height: 100%;
  position: absolute;
  width: 40%;
  background-color: red;
  bottom: 0;
  z-index: 10;
  opacity:0;
  cursor: pointer;
}

.invisivel{
  opacity:0;
}


.invisivel2{
  -webkit-animation-name:opacity-volta;
   -webkit-animation-duration:1.30s;
   -webkit-animation-iteration-count:1;
}