/* capas.css 

.w3-theme-l5: #faf8f7
.w3-theme-l4: #eee8e4
.w3-theme-l3: #dcd1ca
.w3-theme-l2: #cbbaaf
.w3-theme-l1: #baa495
.w3-theme: #558c9d
.w3-theme-d1: #4c7d8c
.w3-theme-d2: #436f7d
.w3-theme-d3: #3b616d
.w3-theme-d4: #32535d
.w3-theme-d5: #2a464e
.w3-secundario: #D78667
*/


.arbol { padding: 0px 0px 16px; }
.arbol:first-child { margin-top: 0px !important; } 

.marco_rama { display: block; position: relative; height: auto; 
	margin-left: 0px; margin-top: 8px; background-color: White;
}
.marco_rama:first-child { margin-left: 0px; margin-top: 0px; }

/* barra principal de la rama */
.marco_rama > div:nth-child(1) { display: inline-block; position: relative; overflow: visible;
	width: 50%; max-width: 640px; min-width: 348px; min-height: 48px;
	padding: 0px; margin-top: 0px; margin-bottom: 1px;
}

/* nombre de rama */
.marco_rama > div:nth-child(1) > div:nth-child(1) { display: inline-block; 
	min-width: 180px; padding: 4px 32px 0px 0px; margin-right: 150px;
	font-size: 18px; font-weight: 400; border: dashed 0px red;
}

.marco_rama > div:nth-child(1) > div:nth-child(2) { 					/* icono ver texto */
	position: absolute; right: 104px;
	width: 48px; height: 100%; text-align: center; padding-top: 12px;
	vertical-align: top; cursor: pointer;
}

.marco_rama > div:nth-child(1) > div:nth-child(3) { 					/* icono expandir */
	position: absolute; right: 48px;
	width: 48px; height: 100%; text-align: center; padding-top: 12px;
	vertical-align: top; cursor: pointer;
}

.marco_rama > div:nth-child(1) > div:nth-child(4) { 					/* menú */
	position: absolute; right: 0px;
	width: 48px; height: 100%; text-align: center; padding-top: 0px !important;
	vertical-align: top; overflow: visible;
}
.marco_rama > div:nth-child(1) > div:nth-child(4) > div:nth-child(1) { /* botón more_vert */
	width: 48px; height: 100%; padding: 14px 8px 4px; text-align: center;
}
.marco_rama > div:nth-child(1) > div:nth-child(4) > div:nth-child(2) { /* w3-dropdown-content */
	min-width:80px !important; 
}

/* opción de menú */
.marco_rama > div:nth-child(1) > div:nth-child(4) > div:nth-child(2) > div {
	border-bottom: solid 1px White;
}
.marco_rama > div:nth-child(1) > div:nth-child(4) > div:nth-child(2) > div:last-child {
	border-bottom: none;
}


/* botón drag */
.marco_rama > div:nth-child(1) > div:nth-child(5) { 
	position: absolute; right: -40px; top: 0px;
	width: 40px; height: 100%; text-align: center; padding-top: 14px;
	vertical-align: top; cursor: grab; background-color: WhiteSmoke; color:Gray !important;
}



/* texto principal de la rama */
.marco_rama > div:nth-child(2) { position: relative;
	margin: 0px; margin-bottom: 1px; padding: 0px; height: auto; min-height: 40px;
	border-top: solid 1px LightGray; border-bottom: solid 1px LightGray;
}

/* botón expandir */
/*
.marco_rama > div:nth-child(2) > div:nth-child(1) { float: right; position: absolute; 
	width: 64px; top: -40px; right: 96px; text-align: center;
	padding:8px 16px; vertical-align:middle; cursor: pointer;
}
.marco_rama > div:nth-child(2) > div:nth-child(1) { border-bottom: solid 1px LightGray; background:pink; }
*/


/* marco de objetos */
.marco_rama > div:nth-child(3) { position: relative; height: auto; 
	margin: 0px; padding: 0px; 
border: dashed 0px magenta;
}


/* marco de subcapas */
.marco_rama > div:nth-child(4) { position: relative; height: auto; min-height: 32px;
	margin-left: 24px; margin-bottom: 4px; 
	padding-top: 8px; padding-bottom: 2px; 
	border-left: dotted 1px Gray; border-bottom: dotted 1px LightGray;
}

/* contenedor de objeto */
/*.marco_rama > div:nth-child(2) > div { display: block; position: relative; height: auto; }*/


.contenedor_objeto { display: block; position: relative; height: auto; margin-bottom: 1px; 
	background-color: White;
}

/* barra encabezado de objeto */
.contenedor_objeto > div:nth-child(1) { display: block; position: relative; height: 32px;
	padding: 0px !important; white-space: nowrap;
}
.contenedor_objeto > div:nth-child(1) > div { display: inline-block; }

/* tipo de objeto */
.contenedor_objeto > div:nth-child(1) > div:nth-child(1) { 
	height: 32px; width: 112px; padding: 9px 8px 0px;
	font-size: 12px; font-weight: 300; text-align: center;
}

/* título del objeto */
.contenedor_objeto > div:nth-child(1) > div:nth-child(2) { min-width: 200px;
	font-size: 16px; font-weight: 400; padding: 6px 48px 0px 12px;
	vertical-align: top; overflow: hidden;
}

/* botón expandir */
.contenedor_objeto > div:nth-child(1) > div:nth-child(3) { 
	position: absolute; right: 81px; top: 0px;
	width: 64px; height: 32px; text-align: center; padding-top: 4px;
	vertical-align: top; cursor: pointer;
	border-right: solid 1px White;
}

/* botón actualizar (autorenew) */
.contenedor_objeto > div:nth-child(1) > div:nth-child(4) { 
	position: absolute; right: 40px; top: 0px;
	width: 40px; height: 32px; text-align: center; padding-top: 4px;
	vertical-align: top; cursor: pointer;
	border-right: solid 1px White;
}

/* botón eliminar */
.contenedor_objeto > div:nth-child(1) > div:nth-child(5) { 
	position: absolute; right: 0px; top: 0px;
	width: 40px; height: 32px; text-align: center; padding-top: 4px;
	vertical-align: top; cursor: pointer;
}


/* zona del objeto */
.contenedor_objeto > div:nth-child(2) { display: block; height: auto;
border: solid 1px LightGray; border-top: none;
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
min-height: 48px; 
}


.div_marco_presentacion { display: block; 
	position: absolute; left: 0px; top: 0px;
	width:100%; height:100%; min-height:640px; z-index: +200;
	border:dashed 0px Red;
}
/* barra */
.div_marco_presentacion > div:nth-child(1) { display: block; z-index: +200; 
	position: absolute; left: 0px; top: 0px; padding: 0px;
	width:100%; height: 40px; background-color: Black; color: White;
}
/*														título	*/
.div_marco_presentacion > div:nth-child(1) > div:nth-child(1) { display:inline-block;
	width: auto; min-width:360px; padding: 12px 16px 4px !important; 
	font-size: 20px !important; font-weight: 300; line-height: 1;
border:dashed 0px Orange;
}
/*														núm.	*/
.div_marco_presentacion > div:nth-child(1) > div:nth-child(2) { display:inline-block;
	position: absolute; right: 214px; top: 0px;
	width:100px; text-align: center; padding: 12px 8px 4px;
}
/*													área botones	*/
.div_marco_presentacion > div:nth-child(1) > div:nth-child(3) { display:inline-block;
	position: absolute; right: 0px; bottom: 0px;
	width:212px; padding: 0px;
}
/*														botones	*/
.div_marco_presentacion > div:nth-child(1) > div:nth-child(3) div { display:inline-block;
	width: 64px; height: 40px; padding: 8px; text-align:center;
	cursor: pointer; margin-left: 1px;
	background-color: #666; color: White;
}
.div_marco_presentacion > div:nth-child(1) > div:nth-child(3) div:hover { 
	background-color: LightGray; color: Black;
}



.div_marco_presentacion > div:nth-child(1) > div:nth-child(1) {float: left;
	background-color: transparent; padding: 8px 16px 4px; font-size: 16px;
}

.div_marco_presentacion > div:nth-child(2) { display: block; 
	position: absolute; left: 0px; top: 40px;
	width:100%; min-height: 600px; background-color: #333;
	border:dashed 0px Cyan;
}

.div_marco_presentacion > div:nth-child(2) > div { display: block; 
	width:100%; height:100%; 
	position:absolute; left: 0px; top: 0px;
	border:dashed 0px Orange;
}

.borde_rojo_hover:hover { border: solid 2px red !important; }


@media screen and (max-width: 480px)
{
	.marco_rama > div:nth-child(1) > div:nth-child(1) { width: 50%; margin-right: 120px; }
	.marco_rama > div:nth-child(1) > div:nth-child(2) { width: 40px; }
	.marco_rama > div:nth-child(1) > div:nth-child(3) { width: 40px; }

	/* barra de objeto */
	.contenedor_objeto > div:nth-child(1) { height: 64px; }
	/* título de objeto */
	.contenedor_objeto > div:nth-child(1) > div:nth-child(2) { width: 100%; 
		position:absolute; left:0px; top: 32px; }
}

@media screen and (max-width: 640px)
{
	/* barra principal */
	.marco_rama > div:nth-child(1) { width: 98%; }
}

@media screen and (orientation: portrait)
{
	/* barra principal */
	.marco_rama > div:nth-child(1) { width: 98%; }
	
	.marco_rama > div:nth-child(1) > div:nth-child(1) { width: 50%; margin-right: 120px; }
	.marco_rama > div:nth-child(1) > div:nth-child(2) { width: 40px; }
	.marco_rama > div:nth-child(1) > div:nth-child(3) { width: 40px; }
}


/* COLORES */

/* barra principal de la rama */
/*.marco_rama > div:nth-child(1) { color: White; background-color: #436f7d; }*/

/* icono ver texto */
/*.marco_rama > div:nth-child(1) > div:nth-child(2):hover { color: White; background-color: #D78667; }*/

/* icono expandir */
/*.marco_rama > div:nth-child(1) > div:nth-child(3):hover { color: White; background-color: #D78667; }*/

/* botón more_vert */
/*.marco_rama > div:nth-child(1) > div:nth-child(4) > div:nth-child(1):hover { background-color: #D78667; }*/

/* botón expandir del texto principal de la rama */
/*
.marco_rama > div:nth-child(2) > div:nth-child(1) { color: Black; background-color: #FAFAFA; }
.marco_rama > div:nth-child(2) > div:nth-child(1):hover { color: White; background-color: #D78667; }
*/

/*.contenedor_objeto { background-color: #FAFAFA; }*/

/* barra encabezado de objeto */
/*.contenedor_objeto > div:nth-child(1) { color: Black; background-color: #cbbaaf; }*/

/* tipo de objeto */
/*.contenedor_objeto > div:nth-child(1) > div:nth-child(1) { color: Black; background-color: #dcd1ca; }*/

/* botón expandir objeto */
/*.contenedor_objeto > div:nth-child(1) > div:nth-child(3):hover { color: White; background-color: #D78667; }*/

/* botón eliminar objeto */
/*.contenedor_objeto > div:nth-child(1) > div:nth-child(4):hover { color: White; background-color: #D78667; }*/