
*{
    font-family: Verdana, Arial, Helvetica, sans-serif;;
    font-size: 11px;
    color: #000000;
}
.contenedormenu{
    padding-left: 60px;
}
img#logo{
    padding-left: 30px;
    width: 30%;
}
a{
    text-decoration:none;
    color: #92d050;
    font-weight: normal;
}
p{
    margin-bottom: -10px;
}
ul.menu{
    list-style-type: square;
}
ul.submenu{
    list-style-type: none;
    padding: 0px;
}
ul.submenu li{
    padding: 1px;
    margin-left: -5px;
}

ul.menu.manual{
    list-style-type: disc;
    padding-left: 10px;
}
ul.menu.manual li{
    padding: 5px 0 0 10px;
}
.manual{
    font-size: 14px;
}
.manual a{
    color: #94C669;
}
.contenedormanual{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #434343;
}
.titulo{
    text-align: center;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 27px;
    color: #434343;
    font-weight: bold;
    margin: 30px 0 0 0;

}
.subtitulo,.subtituloejemplo{
    font-size: 23px;
    font-weight: bold;
    margin: 30px 0 20px 0;
    color: #434343;
}

.subtitulo2{
    font-size: 18px;
    font-weight: bold;
    margin: 30px 0 20px 0;
    color: #434343;
}

.subtitulocontenido{
    text-decoration: underline;
    font-weight: bold;
    margin: 30px 0 10px 0;
}
.titulomanual,.contenedormenu2, .contenedormanual{
    padding: 0 200px 0 200px;
    text-align: justify;

}
.contenido, ul.contenido{
    font-size: 11px;
    line-height: 1.5em;
}
.contenido ul li{
    padding-bottom: 5px;
}
.concepto{
    padding-bottom: 10px;
    padding-top: 10px;
}
.texto{
    padding-bottom: 5px;
}
.textoformato{
    padding-bottom: 5px;
    white-space: pre-line;
    margin-top: auto;
}
.contenidoformato{
    text-align: left;
    word-wrap: break-word;
}
/* tablas DTE sin bordes */
.tipoDTE,.tipoDTE th,.tipoDTE td{
    border: none;
    margin-left: 3.2em;
    margin-top: 1em;
}
#tipoDTEventas td{
    padding-right: 15px;
}
/* color letra roja para tablas DTE */
.dterojo{
    color: #FF0000;
}
table{
    width: 60%;
    margin-left: auto;
    margin-right: auto; 
    margin-bottom: 2em;
    margin-top: 2em;   
}
table,td,th{
    border: 1px solid #000000;
    border-collapse: collapse;
}
/* formato th tablas */
th {
    text-align: center;
    background-color: #cccccc;
    color: #000000;
}
.customTHUP {
    text-align: left;
    background-color: #FFFFFF;
    color: #000000;
    border-bottom-style: none;
}

.customTDDown{
    text-align: left;
    background-color: #FFFFFF;
    color: #000000;
    border-top-style: none;
}

.customTD_RIGHT{
    text-align: center;
    background-color: #FFFFFF;
    color: #000000;
    border-bottom-style: none;

}

.contenedorDerecha {
    height: 338px;
    width: 26rem;
    float:right;
    border-left: 1px solid black;
}
.contenedorIzquierda {
    float:left;
    height: 100%;
    width: 26rem;
}

.tablaCustom{
    width: 60%;
    margin-left: auto;
    margin-right: auto; 
    margin-bottom: 2em;
    margin-top: 2em; 
    word-break: break-all;
    border: 1px solid #000000;
}
td,  th{
    padding: 3px;
}
/* centrado primera columna tablas y tabla campos adicionales extendidos */
.centrado,#camposadicionalesextend{
    text-align: center;
}
.listado{
    list-style-type: none;
    padding-top: 5px;
}
ul.listadoenlace li{
    padding-top: 5px;
}
ul.listadoenlace li> a , .enlace{
    color: #2b73b7;
    word-wrap: break-word;
}
.listado.ejemplo{
    padding-right: 30px;
}
.textoadicional{
    color: #0000FF;
}
.textoflecha{
    color: #FF0000;
}
.textodato{
    color: #00AF00;
}
.datosfacturacion{
    padding-top: 60px;
    text-align:center;
    white-space: pre-line;
}



#camposboleta,#tipoDTE, #indServicio, #indMntNeto, #totalesboleta, 
#camposdetalleboleta,#indExencion,#camposboletaDescRec,#camposboletaReferencia,
#camposobservacion{
    width: 70%;
}
.txtejemplos{
    margin: 30px 0 0 0;
}
.txtejemplos img{
    padding-left: 20px;
}


.tablainfoticket{
    width: 70%;
    margin-top: 3rem;
}
.contenidoformatoxml{
    padding-top: 20px;
    word-wrap: break-word;
}
.textoformatoxmldos{
    padding-left: 2.7rem;
}
.textoformatoxmltres{
    padding-left: 5.4rem;
}
/* div's ejemplos casos 1 y 2 Boleta -> Anexo 1 */
.textoformatoxmldoscaso{
    padding-left: 1rem;
}
.textoformatoxmltrescaso{
    padding-left: 1.5rem;
}
.textoformatoxmlcuatrocaso{
    padding-left: 2rem;
}
.textoformatoxmlcincocaso{
    padding-left: 2.6rem;
}

.textoformatoxmlseiscaso{
    padding-left: 4rem;
}
.textoformatoxmlsietecaso{
    padding-left: 5rem;
}
/* fin div's ejemplos caso 1  y 2 */
ul.listaanexoxml li{
    padding-left: 20px;
}
ul.listaanexoxml li span{
    padding-left: 10px;
}


.manualintegracion{
    padding: 10px 61px;
}
.manualintegracion ul li h4{
    font-weight: normal;
    margin: 15px 0 3px 0;
}
.serviciointegracion{
    width: 335px;
}
.serviciointegracion p{
    text-align:center;
    font-size:13px;
    padding-left:23px;
    padding-bottom:5px;
}
.serviciointegracion ul{
    padding-left:70px;
}

#codigoRefXML{
    width: 80%;
}
.tablaformatoxml xmp{
    margin: 2px;
}
/* div's ejemplos casos 1 y 2 Boleta -> Archivo XML factura electrónica */
.textoformatoxmldos2{
    padding-left: 1.3rem;
}
.textoformatoxmltres2{
    padding-left: 4.2rem;
}
.textoformatoxmltres2_{
    padding-left: 5.5rem;
}
.textoformatoxmlcuatro2{
    padding-left: 8rem;
}
.textoformatoxmlcinco2{
    padding-left: 12rem;
}
.textoformatoxmlseis2{
    padding-left: 16rem;
}
.enlaceazul {
    color: #2b73b7;
}

.imgintegracionBig{
	max-width: 90%;
}

.divintegracionBig{
	text-align: center;
}


@media (min-width: 601px) and  (max-width: 1000px) {
    .titulomanual,.contenedormenu2, .contenedormanual{
        padding: 0 100px 0 100px;
        text-align: justify;
    }
}

@media (max-width: 600px) {
    .titulomanual,.contenedormenu2, .contenedormanual{
        padding: 0 15px 0 15px;
        text-align: justify;
    }
    img#logo{
    padding-left: 5px;
    width: 70%;
    }
    .contenedormenu {
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 12px;
        color: #000000;
        padding-left: 10px;
    }
    .manualintegracion{
        padding: 10px;
    }
    .serviciointegracion p{
        text-align:center;
        font-size:13px;
        padding-left:23px;
        padding-bottom:5px;
        padding-right:23px;
    }
}
/*Integracion*/
.introintegracion{
    text-align: center;
    padding: 2rem 0;
    font-weight: bold;
}
.listaintegracion{
    list-style-type: square;
}
.listaintegracion .textoli{
    padding-left: 1rem;
    text-align: left;
}
.listadointegracion{
    list-style-type: initial;
    padding-top: 1rem;
}
.indicadoresoperacion, .procesointegracion{
    display: flex;
}
.indicadoresoperacion{
    justify-content: center;
    padding-bottom: 2.5rem;
    padding-top: 1rem;
}
.numerocirculo{
    width: 20px;
    line-height: 20px;
    border-radius: 50%;
    text-align: center;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #FFFFFF;
    font-weight: bold;
}
.circulonaranjo, .circuloverde, .circulodoblecolor{
    width: 20px;
    height: 20px;
}
.circulonaranjo{
    border: 2px solid #F28705;
    background-color: #F28705;
}
.circuloverde{
    border: 2px solid #AFBF36;
    background-color: #AFBF36;
}
.circulodoblecolor{
    border-left: 1px solid #F28705;
    border-right: 1px solid #AFBF36;;
    background: linear-gradient(-90deg, #AFBF36 50%, #AFBF36 50%, #F28705 50%);
    margin-right: 1rem;
}
.indicadoresoperacion .circulonaranjo, .indicadoresoperacion .circuloverde{
    margin-right: 1.5rem;
}
.indicadoresoperacion .circuloverde{
    margin-left: 5rem;
}
.procesointegracion{
    padding-top: 1rem;
}
.procesointegracion .circuloverde, .procesointegracion .circulonaranjo{
    margin-right: 1rem;
}
.procesointegracion .circuloverde, .procesointegracion .circulonaranjo{
    width: 26px;
    height: 25px;
    line-height: 25px;
}
.procesointegracion .circulodoblecolor{
    width: 25.5px;
    height: 27px;
    line-height: 25px;
}
.textointegracion{
    padding: 5px 0;
    font-weight: normal;
}
.imgintegracion{
    padding-top: 2rem;
    padding-bottom: 1rem;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.introduccionManual{
    font-size: 14px;
}
.imgBigManual{
    max-width: 90%;
    text-align: center;
    width: 80%;
}
.imgLittleManual{
    max-width: 500px;
    text-align: center;
    width: 100%;
}

.textopuntoproceso{
    font-weight: bold;
    padding-top: 0.5rem;
}
.titulolistaintegracion, .textolistaintegracion{
    font-weight: bold;
}
.textolistaintegracion{
    padding-bottom: 1.5rem;
}
.textospan{
    display: block;
    font-weight: normal;
    padding-top: 1rem;
}
.textospan, .textointegracion{
    text-align: justify;
}
.recuadroejemplo{
    width: 205px;
    border: 1px  solid #434343;
    margin-left: -6px;
}
.recuadroejemplo div {
    margin-left: 5px;
}
/* estilo para dispositivos */ 
@media all and (min-width: 320px){
    xmp {
        white-space: break-spaces;    
    }
    .indicadoresoperacion .circulonaranjo, .indicadoresoperacion .circuloverde{
        margin-right: auto;
        width: 25px;
        height: 22px;
    }
    .textopuntoproceso{
        text-align: initial;
    }
}
@media all and (max-width: 599px){
    xmp {
        white-space: break-spaces;    
    }
    
    .numerocirculodiv, .indicadoresoperacion .circulonaranjo, .indicadoresoperacion .circuloverde{
        margin-left: auto;
        margin-right: auto;
    }
    .textopuntoproceso.titulooperacion{
        text-align: center;
        margin-right: 0.2rem;
    }
    }
@media all and (min-width: 600px){
    .numerocirculodiv{
        display: inline-flex;
    }
    .indicadoresoperacion .circulonaranjo, .indicadoresoperacion .circuloverde{
        margin-right: 1rem;
    }
}
@media all and (min-width: 1024px){
    .indicadoresoperacion .circulonaranjo, .indicadoresoperacion .circuloverde{
        height: 23px;
        margin-right: 1.2rem;
    }
}
@media all and (min-width: 1920px){
    .imgintegracion{
        width: 50%;
        text-align: center;
    }
}
@media screen and (max-width: 1374px){
    .contenedorDerecha {
        height: 289px;
        width:  100%;
        float:  left;
        border-left-style: none;
    }
    .contenedorIzquierda {
        height: 368px;
        width:  100%;
        border-bottom:  1px solid #000000;
        
    }
}

@media screen and (max-width: 797px){
    .contenedorDerecha {
        height: 309px;
        width:  100%;
        float:  left;
        border-left-style: none;
    }
}

@media screen and (max-width: 611px){
    .contenedorDerecha {
        height: 330px;
        width:  100%;
        float:  left;
        border-left-style: none;
    }
}

@media screen and (max-width: 665px){
    .tablaformato {
        width:  100%;
    }
    .tablaCustom{
        width:  100%;
    }
}

.imgflujointegracion{
    padding-top: 25px;
}

.tituloflujointegracion{
    text-align:start; 
    padding: 30px 0 10px 25px;
}

.listaflujointegracion{
    list-style-type: none;
    padding: 25px 0 0 0;
}

.circulonegro{
    display: inline-block;
    width: 19px;
    height: 19px;
    color: white;
    background-color: black;
    border-radius: 50%;
    text-align: center;
    font-weight: bold;
    align-content: center;
    margin-right: 5px;
}

.pl-25{
    padding-left: 25px;
}