@font-face {
    font-family: "Alcubierre";
    src: url(../fonts/Alcubierre.ttf), url(../fonts/Alcubierre.eot), url(../fonts/Alcubierre.otf);
}

  @font-face {

    font-family: "Edwardian Script ITC";
    src: url(../fonts/EdwardianScriptITC.ttf), url(../fonts/EdwardianScriptITC.otf);
  }

    body {
          padding-top: 50px;
          position: relative;
          overflow-x: hidden;
          
         
      }
      
      pre {
          tab-size: 8;
      }
      
      @media screen and (max-width: 768px) {
          .side-collapse-container{
              width:100%;
              position:relative;
              left:0;
              transition:left .4s;
          }
          .side-collapse-container.out{
              left:200px;
          }
          .side-collapse {
              top:50px;
              bottom:0;
              left:0;
              width:200px;
              position:fixed;
              overflow:hidden;
              transition:width .4s;
          }
          
          .side-collapse.in {
              width:0;
          }
      }

      .imgFondo{
            height: 452px;
            background-image: url("../img/Fondo.png");
            background-repeat: no-repeat;
            background-size: 100% 100%;
            
          }
      .titulo{
        color: white;
        text-align: center;
        padding-top: 180px;
        margin-top: 0px;
        font-family: Edwardian Script ITC; 
        font-size:8em; 
       
      } 

    .serviciosImg{
            position: absolute;
            background-repeat: no-repeat;
            background-size: 100% 100%;
            height: 280px;
            width: 250px;
            /* Safari 4.0 - 8.0 */
          /*-webkit-animation: animacion_servicios 8s linear 2s infinite alternate; 
          animation: animacion_servicios 8s linear 2s infinite alternate;*/
    }

    .serviciosTxt{
        
        text-align: center;
        color: white;
        height: 280px;
        width: 250px;
        background-color: black;
        /* Safari 4.0 - 8.0 */
        /* -webkit-animation: animacion_servicios 6s linear 1s infinite alternate; 
          animation: animacion_servicios 6s linear 1s infinite alternate;*/


    }

.serviciosTxt:hover{
  animation: step-end;
}

.serviciosImg:hover{
  animation: step-end;
}

    .descripcion{
      color: white; 
      white-space: pre-line;
      background-color: transparent; 
      border: 0px; 
      font-size:16px;  
      line-height: 2em; 
      word-break: normal; 
      text-align: justify;
    }
    .servicios{
        margin-top: 50px;
         font-family: Alcubierre;
         text-align: center;
         animation-name: animacion_servicios_inicio;
         animation-duration: 6s;
       /* display: flex;*/
        justify-content: center;
        align-items: center;

      }
    .Footercontainer{
        background-color: black;
        color: white;
        text-align: center;
        margin-top: 20px;
         font-family: Alcubierre;
    }
    .cursos{
        
        background-color: black;
        color: white;
         font-family: Alcubierre;
    }

    .curso2{
        width: 100%;
    }
    .curso1{
        margin-left: 0px;
    }
    .curso1 img{
        width: 100%;
    }
    .direccion{
      margin-top: 10px;
    }
    .cursosInfo{
    margin-top: 10px;
    
    font-size:1.5em;
    }
   
    
 @keyframes animacion_servicios_inicio{
0%{
      opacity: 0.1;  
          
      }
  100%{
    opacity: 1;
  }
 }


    @keyframes animacion_servicios{
      0%{
        
          
      }

      25%{

        -webkit-transform: rotateY(180deg);
         -webkit-transform-style: preserve-3d;
     }
   
   50%{
      -webkit-transform: rotateY(180deg);
      -webkit-transform-style: preserve-3d;
       
   }

     
     100%{
      
      
     }

    }