.preloader{
     width: 100%;
     height: 100%;


     margin: 0;
     padding: 0;
     display: flex;
     justify-content: center;
     align-items: center;
     height: 100vh;
     overflow: hidden;
     background: rgb(20, 20, 20);
   }
   
   /* caja general */


   /* caja general */

.logo_principal{
	position: absolute;
    width: 50vw;
	top: 10vh;
	left: 25vw;
	
	
	
}
   .nombre{
    position: relative;
    width: 100%;
    height: 50vh;
    overflow: hidden;
    transform: scale(.7);
/*     background-color: #0fe508;
 */  }





   .nombre:before{
     content: '';
     position: absolute;
     bottom: -100px;
     z-index: 2;
     width: 100%;
     height: 120px;
     background: rgb(20, 20, 20);
     border-top-left-radius: 100%;
     border-top-right-radius: 100%;
     transform: scaleX(1.5);
   }
   .nombre:after, .heading:before{
     content: '';
     position: absolute;
     top: 0;
     right: 0;
     width: 200%;
     height: 100%;
     background: linear-gradient(to right, transparent, rgb(20, 20, 20), rgb(20, 20, 20));
     z-index:3;
     animation: animate 2s linear forwards;
   }
   @keyframes animate{
     0%{
       right: 0;
     }
     100%{
       right: -200%;
     }
   }
 

.cnai{
	width:100%;
}
 /* -*--*-*-*-- */
 

   .heading{
     color: #fff;
     text-transform: uppercase;
     position: relative;
     top: -50px;
     margin: 0;
     padding: 0;
     text-align: center;
     font-family: arial;
     font-size: 45px;
     letter-spacing: 10px;
   }