body {
    margin: 0;
    padding: 60px 0 0 0;   
    /* background-image: url(./ondo.jpg); */
     /* background-color: antiquewhite;     */
     font-family: Verdana, sans-serif, Tahoma, sans-serif;
     
    /* background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1) 25%), url(./Fondo.jp]g); */
    background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1),  rgba(255,255,255,1),  rgba(255,255,255,1),  rgba(255,255,255,0)),  url(./Imagenes/Fondo.jpg);
 }
 
 

 .marnav{
     display:none;
 }
#page {
    margin: 0px auto;
    width: 100%;
    /* background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1) 25%), url(./Fondo.jpg); */
    background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1),  rgba(255,255,255,1),  rgba(255,255,255,1),  rgba(255,255,255,0)),  url(./Imagenes/Fondo.jpg);
}
 
#header {
    position: fixed;
    top: 0;
    width: 100%;
    height: 2.8cm;
    padding: 0px ;
    background-color:white;
    font-size: 20px;
    color: #FFFFFF;
    text-align: center;
    /* background-image: url(./Fondo.jpg); */
    
    background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1)15%), url(./Imagenes/Fondo.jpg);
    
}
.franja{position:fixed; z-index: 2; background-color:  white; color: rgb(65, 63, 63);top: 0cm; height: 2cm; left: 5cm; width: 100%;text-align:left;padding: 0px 1cm;}
h4{position: fixed; left: 14cm; top:0.2cm;}
#logotipo{position:fixed; width: 5cm; height: 2cm; top:5px; left: 5cm}
#Presentacion{color: tan; font-style: italic; margin:1%;padding:0%;height: auto;}
#barramenues{position:fixed;display:flex;flex-direction:row;
    justify-content: center;
    background-color:  rgb(168, 160, 160);
    top: 2cm; height: 30px; left: 0cm; width: 100%; padding: 0px 0px 0px 0px;
    /* background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1)) */
}
#MenuDerecho{position:fixed;background-color:  rgb(131, 115, 115);top: 2cm; height: 1cm; right: 0cm; width: 1cm;padding: 0px 0px 0px 0px;}
#SubmenuDerecho{position: fixed; background-color: rgb(248, 230, 207); top: 3cm;right: 0cm; width: 10cm;height: 10cm;}
/* #SubmenuDerecho{display: none;} */
#MenuDerecho a:hover > #SubmenuDerecho{ display: block; transform: scale(1.02);}
/* #barramenues{
    background-color:  rgb(168, 160, 160); 
} */

.mas{display:inline;}
.cerrado{display:none;}
.abierto{display:inline;}
/* .menos{
    display:none;
} */

#barramenues li a {
    /* background-color:  rgb(168, 160, 160);  */
    color:white;
    /*background-color: rgb(172, 169, 169); /*grey*/
    /* background-color: solid rgba(241, 13, 13, 0.5); */
    width: 140px;
    text-decoration: none;
    padding: 3px 5px;
    display: block;   
    font-size: smaller;
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    padding: 7px;
}

#barramenues li .aSubMenu{
    background-color: rgba(128, 222, 250, 0.6);  
    /* color:rgb(168,160, 160);  */
    color:rgb(37, 36, 36);

}

.ver{
    position: absolute;
    top:2px;
    left:100px;
}



#barramenues li a:hover { background-color:rgb(127, 245, 245); color: blue;transform: scale(1.04);border-radius: 5px;transition: all 0.3s;}
ul { margin: 0px ;}
ul, ol, li { list-style: none;}
#barramenues  li { float:left; }
#barramenues {text-align: center;}


#barramenues  li ul li { float: none; }
#barramenues li ul {display: none; position: absolute; min-width: 120px;}
#barramenues li:hover > ul {display: block;transition-duration: 0.3s;}


#barramenues li ul li {position: relative;} /*aparece submenues  cuando paso el mouse por la opcion */
#barramenues li ul li ul {right: -130px;
    /* top: 0px; */
} /*aparece submenues  cuando paso el mouse por la opcion 

/* #MenuDerecho li a:hover { background-color:cyan;} */
 /* #MenuDerecho {position:fixed;display:flex;flex-direction:row;justify-content: center;background-color:  rgb(172, 169, 169);top: 2cm; height: 1cm; left: 0cm; width: 100%; padding: 0px 0px 0px 0px;} */ */
#submenu{display: none;}
#content {
    height: 90%;
    overflow: auto;
    padding: 1% 1% 0% 1%;
    width: 98%;
}

p {border: 0.05cm solid rgba(163, 156, 156, 0.3); margin: 0.5cm 2cm 0.5cm 5.5cm;
    padding-left: 1cm;
}

.CajaProducto {
    border: 0.05cm solid rgba(163, 156, 156, 0.3);
    margin: 0.5cm 2cm 0.5cm 5.5cm;

    border-radius: 10px;
    background-color:white;/*rgba(255, 255, 255, 0.4) */
    padding: 0 0 0 0.2cm;
    /* display:flex;
    flex-direction:column;
    align-items: center;
    justify-content: center; */
}


.CajaProducto .CajaProductoBackGr {
    margin: 5%  5% 1% 5% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.7),rgba(255,255,255,1), rgba(255,255,255,1)), url(./Imagenes/CalmiraGestionPPal.png);
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
}

.CajaProducto .CajaProductoSueldos {
    margin: 5%  5% 1% 5% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.7),rgba(255,255,255,1), rgba(255,255,255,1)), url(./Imagenes/CalmiraSueldos.png);
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
}

.CajaProducto .CajaProdPtoVtaFiscal {
    margin: 5%  3% 1% 1% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.7),rgba(255,255,255,1), rgba(255,255,255,1)), url(./Imagenes/CalmiraPtoVtaFiscal.png);
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
}
.CajaProducto .CajaProdLibrosContables {
    margin: 5%  3% 1% 1% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.7),rgba(255,255,255,1), rgba(255,255,255,1)), url(./Imagenes/CalmiraPtoVtaFiscal.png); 
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
  
   
}

.imgPant{
    width:80%;
    margin:5% 10%;
    margin-bottom:5%;
    display:none;
}


.CajaProducto .CajaProdContactos {
    margin: 5%  3% 1% 1% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.7),rgba(255,255,255,1), rgba(255,255,255,1)), url(./Imagenes/CalmiraContactos.png);
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
}



.CajaProducto .CajaProdPtoVtaElectr {
    margin: 5%  3% 1% 1% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.3),rgba(255,255,255,0.5), rgba(255,255,255,1)), url(./Imagenes/CalmiraPtoVtaElectronico.png);
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
}

.CajaProducto .CajaProdEstadisticas {
    margin: 5%  5% 1% 1% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.3),rgba(255,255,255,0.5), rgba(255,255,255,1)), url(./Imagenes/EstadisticasDos.png);
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
}

.CajaProducto .CajaProdRestauBackGr {
    margin: 5%  3% 1% 1% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.3),rgba(255,255,255,0.5), rgba(255,255,255,1)), url(./Imagenes/CalmiraBarCafeter.png);
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
}

.CajaProducto .CajaProdRestaurantes {
    margin: 5%  3% 1% 1% ;    
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.3),rgba(255,255,255,0.5), rgba(255,255,255,1)), url(./Imagenes/CalmiraRestaurante.png);
    background-position-x: right;
    background-position-y: top;
    background-repeat: no-repeat;    
}


.CajaProducto .TitImg{
    display:flex;
    align-items: center;
    text-decoration: none;
    color:#839192; 
    font-size:20px;
}

 
.CajaTutorial {
    border: 0.05cm solid rgba(163, 156, 156, 0.3);
    margin: 0.5cm 6cm 0.5cm 5.5cm;
    background-color: white;    
    padding: 0.5cm 1cm;
    /* display: inline-flexbox; */
}

.TutoDescri{width: 12cm; }

.separa{height: 100px;border:0;}
.centrado{text-align: center;}
.Rta{color: darkslateblue; text-decoration-style: double;}
.fa-hand-o-left{color: orangered}

#volver{margin-right: -10px;}
.relati{position: relative;}
.ProdImagen:hover{transform: scale(1.03);}

.Fijo{
    z-index: 2000 ;
    width: 50px;
    height:25px;
    text-align: center;
    margin-top: 50%;
    margin-left:90% ;
    position:fixed;
    background-color: rgb(190, 166, 28); /*auqnue yo haga scroll va a dejar esteelemento en el mismo lugar por lo tanto lo seguire viendo*/
}

.TitFrmContacto{
    text-align: center;
    color:cornflowerblue;
    font-size:24px;
    font-weight: 100;
    padding: 10px;
     
}

.CajaProductoFrmCont{
    border: 0.05cm solid rgba(163, 156, 156, 0.3);
    border-radius: 10px;
    margin: 0.5cm 2cm 0.5cm 5.5cm;
    background-color:white; /*  rgba(255, 255, 255, 0.4) */
    padding: 0 0 0 0.2cm;
    display:flex;
    flex-direction:column;
    align-items: center;
    justify-content: center;
    
}
.FrmContacto{
    text-align:left;
    border-radius: 10px;
    border:2px cornflowerblue solid;
     color:  rgb(226, 174, 4); /*   blue;*/
     width: 50%;  
     margin:0% 3%; 
     padding: 1% 5%;
     background-color: rgba(128, 222, 250, 0.2);
     font-weight: 800;
     /* display:flex; */
     /* flex-direction:column; */
     /*flex-wrap: nowrap; */
     /* justify-content: center;
     align-items: center; */
     font-size: 14px;
}

.FrmContacto input, select, button,option {
    width : 50%;
    margin: 2%;
    font-size: 14px;
    font-style: italic;
    border-color: cyan;
    -webkit-box-sizing: border-box; /* For legacy WebKit based browsers */
       -moz-box-sizing: border-box; /* For legacy (Firefox <29) Gecko based browsers */
            box-sizing: border-box;
  }

.FrmContacto textarea{
        width: 100%;
        margin:0;
        /* overflow: scroll; */
        resize: none;
        color:black;
        border-color: cyan; 
        font-style: italic;
        /* vertical-align: top; */
}

.FrmContacto .botones{
    width: 50%;
    height: 10%;
    /* margin:10%; */
    display:flex;
    justify-content: center;
    margin:2% 5% 2% 30%;
}


.botones input[type=button]{
    display:flex;
    flex-direction:row;
    align-items: center;
    justify-content:space-evenly;
    border-radius: 4px;
    margin-right: 10%;
    background-color:rgba(128, 222, 250, 0.6);
    border:2px rgb(148, 193, 231) solid;
    color:cornflowerblue;
    height:100%;
    width:200%;
    font-weight:600;
}

.botones input[type=button]:hover{
    border:2px rgb(111, 153, 255) solid;
    background-color:cornflowerblue;
    color:#FFFFFF;
    transform:scale(1.2)
}
.botones button{
    display:flex;
    flex-direction:row;
    align-items: center;
    justify-content:space-evenly;
    border-radius: 4px;
    margin-right: 10%;
    background-color:rgba(128, 222, 250, 0.6);
    border:2px rgb(148, 193, 231) solid;
    color:cornflowerblue;
    height:100%;
    width:200%;
    font-weight:600;
}

.botones button:hover{
    border:2px rgb(111, 153, 255) solid;
    background-color:cornflowerblue;
    color:#FFFFFF;
    transform:scale(1.2)
}

marquee{
    font-family:georgia, serif;
    font-size:24px;
}


.CajaProductowat {
    text-align:center;
    font-weight:700;
    color:cornflowerblue;
    font-size:27px;
}



marquee:hover{
    -webkit-animation-play-state: paused;
}
.marquesina {
    display:block;
    width:70%;
    /* height:20%; */
    position:absolute;
    font-family:georgia, serif;
    font-size:16px;
    line-height:20px;
    float:left;
    padding:1px 10px 0px 10px;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration:17s;
    -webkit-animation-name: scroll;
    overflow: hidden;
    overflow-x: hidden;
  
}
 


::-webkit-scrollbar {
    width: 8px;     /* Tamaño del scroll en vertical */
    height: 8px;    /* Tamaño del scroll en horizontal */
    display: none;  /* Ocultar scroll */
} 
 
@-webkit-keyframes scroll {
0% {left:50%;}
100% {left:-10%;}
}
 
.marquesina:hover { -webkit-animation-play-state: paused;}

.marquesina a{
    position:absolute;
    bottom: 10px;
    right: 30%;
}


#Caracteristicas{
    display:none;
}

.Rta{
    font-size:16px;
    margin-left:3%;
    text-align:left;
}
.Preg{
    font-size:16px;
    padding:0.5%;
}
.alternar-respuesta i:hover{
        color: blue;
}

.alternar-respuesta i{
 color:rgb(44, 202, 202);
    
}

.Rta{
    display:none;
}

.mh2{
    display:none;
}

.x2{
    display:none;
}
.check2{
    display:none;
}


.CajaResp{
    display:block;
}

.tabla{
    flex-direction: row;
    display: flex;
    align-items: center;
}

.tabla div{
    width:80%;
}



.FrmRes{
    color:cornflowerblue;
}

#Whatsapptext{
    padding:5%;
    text-align:center;
    font-size:27px;
    font-weight: 800;
    color:cornflowerblue;
}

#Whatsapptext .items{
    text-align:center;
    font-size:21px;
    font-weight: 400;
    color:cornflowerblue;
}

#Whatsapptext span,#Whatsapptext span i,#Whatsapptext a{
    color:#28B463 ;
}



@media(max-width:768px) {
   
  
    .check2{
        display:none;
    }
    .mh2{
        padding:1.5% 0%;
      /* //  margin-left: -400px; */
        display:inline;
        position:fixed;
        left:2%;
    }

    .check2:checked ~.mnuMarce{
        display:flex; 
    }

    .check2:checked ~ .x2{
        display:inline; 
        padding:1.5% 0%;
        position:fixed;
        left:2%;
    }
    .check2:checked ~.mh2{
        display:none; 
    }
    
    
    #barramenues{
        display:flex;
        width:100%;
        /* height:5% ; */
        top:13%;
       
    }
    .mnuMarce{
        display:none;
        flex-direction: column;
        width: 78%;
        height:10%;
        padding-left:2%;
        padding-top:7%;
        /* position: absolute;

        left:2%; */
        /* background-color: aquamarine; */
        /* padding-left:15%; */
        /* text-align: left; */
    }
     .mnuMarce li{
         width:100%;
         margin:0px;
         padding:0px;
     }
    .mnuMarce li a{
        width:100%;
        background-color: rgba(168, 160, 160,0.8);
       
    }
    .mnuMarce ul{
        padding-left:0%;
    }


  
   .CajaProducto{
       width:80%;
       margin:5% 10%;
   }
   
   .marquesina{
       display:block;
   }
  
   /* table{
       width:60%;
       margin-left:5%;
   } */

   .fotopre{
       width:90%;
   }
   .CajaTutorial{
       width:90%;
       margin:2%;
       display:flex;
       flex-direction: column;
       padding:3%;
       /* height: 60%; */
       /* margin-left:10%;*/
       
   }


  .CajaResp{
      display:block;
      margin:10%;
  }
   .CajaTutorial .tabla{
         width:98%;
        display:flex;
       flex-direction: column;
       margin:0%;
       margin-top:1.5%;
       align-items: center;
   } 
 
   .tabla iframe{
       width:95%;
       height: 70%;
   }
  
  .TutoDescri{
      width:90%;
  }
  .CajaProductoFrmCont{
    width:80%;
    margin:5% 10%;
  }


  .FrmContacto{
      width:80%;
      margin:1%;
  }

  #Whatsapp{
      width:70%;
      margin:0% 10%;
  }

  .ulquienesSomos{
      width:95%;
      padding:1%;
  }

  .fotopre{
      padding-top:1%;
  }

  .CajaProducto .centrado ul{
      padding:1%;
  }

 .aImg{
    width:80%;
    margin:10%;
    margin-bottom: 0%;
 }

 body{
    width:100%;
 }

 #header{
     width:100%;
 }

 .CajaProductoTabla{
     width:80%;
     /* margin:5% 10%; */
      margin:5%;
    
     padding:0%;
 }

 .CajaProductoTabla table{
     width:90%;
     margin:0%;
 }


 #header {
    position: fixed;
    top: 0;
    width: 100%;
    height: 2.8cm;
    padding: 0px ;
    background-color:white;
    font-size: 20px;
    color: #FFFFFF;
    text-align: center;
    /* background-image: url(./Fondo.jpg); */
    
    background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1)15%), url(./Imagenes/Fondo.jpg);
    
}
.franja{z-index:2 ; background-color:  white; color: rgb(65, 63, 63); width: 80%;text-align:left;padding: 0%;color: rgb(65, 63, 63);
    top: 0cm;
    height: 10%;
    left: 15%;}
h4{
display:none;}

.marnav{
    color:rgb(204, 209, 209);
    display:block;
    position: relative;
     left: 0%;
    top: 90%;
    z-index: 3;
    width: 100%;
    margin: 0%;
margin-top:1%;
}
#logotipo{
    top: 0%;
    left: 13%;
    position: fixed;}
#Presentacion{color: tan; font-style: italic; margin:1%;padding:0%;height: auto;}

#MenuDerecho{position:fixed;background-color:  rgb(131, 115, 115);top: 2cm; height: 1cm; right: 0cm; width: 1cm;padding: 0px 0px 0px 0px;}
#SubmenuDerecho{position: fixed; background-color: rgb(248, 230, 207); top: 3cm;right: 0cm; width: 10cm;height: 10cm;}
/* #SubmenuDerecho{display: none;} */
#MenuDerecho a:hover > #SubmenuDerecho{ display: block; transform: scale(1.02);}
/* #barramenues{
    background-color:  rgb(168, 160, 160); 
} */

#barramenues li a {
    /* background-color:  rgb(168, 160, 160);  */
    color:white;
    /*background-color: rgb(172, 169, 169); /*grey*/
    /* background-color: solid rgba(241, 13, 13, 0.5); */
    width: 140px;
    text-decoration: none;
    padding: 3px 5px;
    display: block;   
    font-size: smaller;
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);    
    padding: 7px;
}

#barramenues li .aSubMenu{
    background-color: rgba(128, 222, 250, 0.6);  
    /* color:rgb(168,160, 160);  */
    color:rgb(85, 84, 84);
    width:100%;
   

}



.CajaProducto .CajaProdPtoVtaFiscal, .CajaProducto  .CajaProductoBackGr,.CajaProducto  .CajaProductoSueldos,.CajaProducto  .CajaProdRestauBackGr,
.CajaProducto .CajaProdRestaurantes, .CajaProducto .CajaProdEstadisticas, .CajaProducto .CajaProdPtoVtaElectr,.CajaProducto .CajaProdContactos,
.CajaProducto .CajaProdLibrosContables {
    background: linear-gradient(to left, rgba(255,255,255,0),rgba(255,255,255,0.7),rgba(255,255,255,1), rgba(255,255,255,1)); 
}/* separando con coma las clases le agrega a todas  la misma propiedad */



.imgPant {
  display:block;
 
} 

#Whatsapptext{
    width:80%;
    padding:5% 0%;
   
}

#Whatsapptext .items{
    font-size:16px;
    margin-top:5%;
}



}