p{ font-size: 1.2rem; }
 /***************** Style Svr-web.php inc/dp-apphost.php ***********************/

.ggcnt{
    width: 100%;
    /*border: solid 1px #000;*/
    display: flex; 
    flex-wrap: wrap;
   justify-content:    space-between;
}
.cnt-i{
    width: 50px;
    margin: auto; 
}
.cnt-i img{
   width: 100%;
}
.cnt-i label{}

.cnt-idmov{
    width: 100px;
    padding-left: 20px;
}
/*****************Fin  Style Svr-web.php inc/dp-apphost.php ***********************/

/*****************Fin  Style Svr-web.php inc/dp-apphost.php ***********************/

.cnt-indsec{
    width: 100%;
   
    /*height: 66vh;*/
    background: linear-gradient(450deg, darkblue,black);
    border: 2px solid rgba(0,0,0,0.06);
    /*border-radius: 10px;*/
    box-shadow: 0 20px 30px rgba(0,0,0,0.2);
    backdrop-filter: blur(10px);
    display: flex;
    flex-wrap: wrap;
    
}

.subcnt-inv-sec{
    width: 50%;
    margin: auto;
    /*border: 2px solid #ffcc00;*/
}

.subcnt-inv-sec .tt{
    font-size:      2rem;
    color:          #FFF;
    margin-top:     40px;
    margin-bottom:  50px;
    letter-spacing: 2px;
    text-align:     center;
    font-weight:    bold;
}

.subcnt-inv-sec .paragraph{
    font-size:      1.2rem;
    color:          #FFF;
    text-align:     justify;
    padding-left:   40px;
    padding-right:  40px;
}

.caja-p{
    width:          100%;
    height:         100%;
    background-color: beige;
    /*min-width: 590px;*/    
    /*position: absolute;*/
    /*transform: translate(-50%, -50%);*/
/*    left: 50%;
    top: 50%;*/
    display: flex;
    flex-wrap: wrap;
    /*border: solid 1px #000;*/   
}
.cnt-h{
    width: 100%;
    padding: 30px 30px 50px;
    background: linear-gradient(450deg, darkblue,black);
    /*border: 2px solid rgba(0,0,0,0.06);*/
    /*border-radius: 10px;*/
    box-shadow: 0 20px 30px rgba(0,0,0,0.2);
    backdrop-filter: blur(10px);
}
.cnt-h *{
    color:          whitesmoke;
    font-weight:    500;
}
.cnt-h h2{
    margin-bottom: 50px;
    letter-spacing: 2px;
    text-align: center;
    font-size: 34px;
    font-weight: bold;
} 
.cnt-h .skliis:not(:last-child){
    margin-bottom: 30px;
}
.detalles{
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}
.mnu{
 position: relative;
 border:  1px solid cyan;
 border-radius: 20px;
}
.mnu div{
    position: relative;
    width: 0;
    height: 8px;
    background-color: cyan;
    
}

/*animacion*/
#hdd-150{ animation: hdd-150 2s forwards;   }
    @keyframes hdd-150{ 100%{ width: 20%;}  }

#hdd-130{ animation: hdd-130 2s forwards; }
    @keyframes hdd-130{ 100%{ width: 15%; } }
    
#sata-560{ animation: sata-560 2s forwards; }
    @keyframes sata-560{ 100%{ width: 30%; } }
    
#sata-530{ animation: sata-530 2s forwards; }
    @keyframes sata-530{ 100%{ width: 20%; } } 
    
#nvme-3500{ animation: nvme-3500 2s forwards; }
   @keyframes nvme-3500{ 100%{ width: 100%; } }
   
#nvme-2700{ animation: nvme-2700 2s forwards; }
   @keyframes nvme-2700{ 100%{ width: 80%; } }
    
   
    
    
    
/*****************Fin  Style Svr-web.php inc/dp-apphost.php ***********************/


@media(max-width: 750px) { } 
@media(max-width: 640px) { }
@media screen and (max-width: 600px){}
@media screen and (max-width: 568px){ 
    font-size: 12px;
    .subcnt-inv-sec{ width: 100%;}  
}
@media(max-width: 480px){ 
    .subcnt-inv-sec{ width: 100%;} 
}
@media(max-width: 380px) {
    .subcnt-inv-sec{ width: 100%;} 
     font-size: 16px;
}
@media(max-width: 320px) {  .subcnt-inv-sec{ width: 100%;}  }
@media(max-width: 240px) {
     .subcnt-inv-sec{ width: 100%;} 
}