/******************************************************
			PERSONAL
******************************************************/

.personal-cont {
    width: 167vh;
    height: 92vh;
    margin: auto;
    position: relative;
}

/***** Personal Colegio *****/
.pag-personal .personal-colegio {
	float:left;
	width:82.5vh;
	height:28vh;
	border-radius:1vh;
	background:#FFF;
	overflow:hidden;
	position:relative;
	-webkit-box-shadow:0 0 2vh 0 #e5d2d2;
	   -moz-box-shadow:0 0 2vh 0 #e5d2d2;
			box-shadow:0 0 2vh 0 #e5d2d2;
}
.personal-colegio .titulo {
	background:#521f18;
	height:5vh;
	font-size:2.5vh;
	line-height:3vh;
	padding:1vh 1.5vh;
	color:#FFF;
}
.personal-colegio .texto {
	padding:2vh;
	font-size:2vh;
	line-height:2.5vh;
}
.personal-colegio .texto p {
	padding-bottom:2.5vh;
}

/***** Personal Organigrama *****/
.pag-personal .personal-organiza {
	width:82.5vh;
	height:62vh;
	border-radius:1vh;
	background:#FFF;
	overflow:hidden;
	position:absolute;
	left:0;
	bottom:0;
	-webkit-box-shadow:0 0 2vh 0 #e5d2d2;
	   -moz-box-shadow:0 0 2vh 0 #e5d2d2;
			box-shadow:0 0 2vh 0 #e5d2d2;
}
.personal-organiza .titulo {
	height:5vh;
	font-size:2.5vh;
	line-height:3vh;
	padding:1vh 1.5vh;
	border-bottom:1px solid #515151;
	border-radius:1vh;
	border-bottom-left-radius:0;
	border-bottom-right-radius:0;
}
.personal-organiza .bloques {
	padding:1.5vh;
	position:relative;
}
.bloque {
	position:relative;
	height:18.3vh;
}
.bloque1 { margin-left:30vh; }
.bloque4 {
	position:absolute;
	right:1.5vh;
	top:1.5vh;
}
.colegio1 .bloque2 { margin-left:30vh; }
.colegio1 .bloque3 { margin-left:10vh; }
.colegio2 .bloque2 { margin-left:10.5vh; }
.colegio2 .bloque3 { margin-left:10.5vh; }
.colegio3 .bloque3 { margin-left:40vh; }
.bloque1::after, .bloque2::after {
	content:"";
	display:block;
	background:#E5B1B1;
	position:absolute;
	height:0.3vh;
	bottom:0.9vh;
}
.colegio1 .bloque1::after { display:none; }
.colegio1 .bloque2::after { width:40.3vh; left:-10.7vh; }
.colegio2 .bloque1::after { width:30.7vh; left:-10vh; }
.colegio2 .bloque2::after { width:20.2vh; left:29.5vh; }
.colegio3 .bloque1::after { width:60.2vh; left:-20.5vh; }
.colegio3 .bloque2::after { width:20.2vh; left:49.5vh; }
.caja {
	width:19vh;
	height:16.5vh;
	float:left;
	position:relative;
	margin-right:1vh;
	border-radius:1vh;
}
.caja:last-child { margin-right:0; }
.colegio2 .bloque2 .caja:first-child { margin-right:11.5vh; }
.bloque1 .caja { border:0.3vh solid #f9b700; }
.bloque2 .caja { border:0.3vh solid #e57713; }
.bloque3 .caja { border:0.3vh solid #874f1d; }
.bloque4 .caja { border:0.3vh solid #d60f00; }
.bloque1 .caja::after,
.bloque2 .caja::after,
.colegio3 .bloque2 .caja:last-child::after {
	content:"";
	display:block;
	background:#E5B1B1;
	position:absolute;
	width:0.3vh;
	height:1.1vh;
	bottom:-1.3vh;
	left:50%;
	margin-left:-0.15vh;
}
.colegio3 .bloque2 .caja::after { display:none; }
.bloque2 .caja::before,
.bloque3 .caja::before {
	content:"";
	display:block;
	background:#E5B1B1;
	position:absolute;
	width:0.3vh;
	height:1.1vh;
	top:-1.3vh;
	left:50%;
	margin-left:-0.15vh;
}
.caja-num {
	width:8.5vh;
	height:8.5vh;
	border-radius:4.5vh;
	font-size:5vh;
	line-height:5.5vh;
	padding:1.5vh 0;
	text-align:center;
	color:#FFF;
	margin:2.5vh auto 2vh;
}
.bloque1 .caja-num { background:#f9b700; }
.bloque2 .caja-num { background:#e57713; }
.bloque3 .caja-num { background:#874f1d; }
.bloque4 .caja-num { background:#d60f00; }
.caja.drop .caja-num { opacity:0; }
.caja-cargo {
	width:100%;
	height:2.5vh;
	font-size:1.5vh;
	line-height:1.7vh;
	padding: 0.4vh;
	color: #FFF;
	text-align:center;
	overflow:hidden;
	border-radius:1.5vh;
}
.bloque1 .caja-cargo { background:#f9b700; }
.bloque2 .caja-cargo { background:#e57713; }
.bloque3 .caja-cargo { background:#874f1d; }
.bloque4 .caja-cargo { background:#d60f00; }

/***** Personal Personas *****/
.pag-personal .personal-personas {
	width:82.5vh;
	height:92vh;
	border-radius:1vh;
	padding:1.5vh;
	background:#FFF;
	position:relative;
	float:right;
	-webkit-box-shadow:0 0 2vh 0 #e5d2d2;
	   -moz-box-shadow:0 0 2vh 0 #e5d2d2;
			box-shadow:0 0 2vh 0 #e5d2d2;
}
.ficha {
	background:#FFF;
	width:24vh;
	height:18vh;
	float:left;
	margin:1vh 1.2vh 1.5vh;
	overflow:hidden;
	position:relative;
	border-radius:1vh;
	-webkit-box-shadow:0 0 1vh 0 #e5d2d2;
	   -moz-box-shadow:0 0 1vh 0 #e5d2d2;
			box-shadow:0 0 1vh 0 #e5d2d2;
}
.ficha::after {
	content:"";
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	cursor:pointer;
}
.ficha-titulo {
	background:#5e1e1b;
	height:4.5vh;
	padding:1vh;
	position:relative;
}
.ficha-nombre {
	font-size:2vh;
	line-height:2.5vh;
	color:#FFF;
	float:left;
}
.ficha-info {
	position:absolute;
	left:0.5vh;
	top:5vh;
	width:2vh;
	z-index:2;
}
.ficha-cargos { float:right; }
.ficha-cargos.cargos1 { width:2.6vh; }
.ficha-cargos.cargos2 { width:5.6vh; }
.ficha-cargos.cargos3 { width:9.6vh; }
.ficha-cargos.cargos4 { width:11.6vh; }
.ficha-cargo {
	float:left;
	width:2.5vh;
	height:2.5vh;
	margin-left:0.5vh;
	font-size:1.5vh;
	line-height:1.5vh;
	padding:0.5vh 0;
	text-align:center;
	border-radius:1.5vh;
	color:#FFF;
}
.ficha-cargo:first-child { margin-left:0; }
.ficha-cargo.cargo1 { background:#f9b700; }
.ficha-cargo.cargo2 { background:#e57713; }
.ficha-cargo.cargo3 { background:#874f1d; }
.ficha-cargo.cargo4 { background:#d60f00; }
.ficha-foto {
	float:left;
	height:11.5vh;
	margin-top:1vh;
}
.ficha-foto img {
	height:100%;
	width:auto;
	margin:auto;
}
.ficha-tags {
	float:right;
	width:12.5vh;
	margin-right:1vh;
	margin-top:2vh;
}
.ficha-tag {
	background:#e57713;
	border-radius:1vh;
	font-size:1.4vh;
	line-height:1.6vh;
	height:2vh;
	padding:0.2vh 0;
	width:100%;
	text-align:center;
	color:#FFF;
	margin-bottom:1vh;
}
.ficha.drag, .ficha.drop {
	width:19vh;
	height:16.5vh;
	margin:1.9vh 3.7vh 2vh;
}
.ficha.drag .ficha-titulo { height:4vh; }
.ficha.drag .ficha-nombre {
	font-size:1.5vh;
	line-height:2vh;
}
.ficha.drag .ficha-cargos.cargos1 { width:2.1vh; }
.ficha.drag .ficha-cargos.cargos2 { width:4.6vh; }
.ficha.drag .ficha-cargos.cargos3 { width:7.1vh; }
.ficha.drag .ficha-cargos.cargos4 { width:9.6vh; }
.ficha.drag .ficha-cargo {
	font-size:1vh;
	line-height:1vh;
	width:2vh;
	height:2vh;
}
.ficha.drag .ficha-foto { height:11vh; }
.ficha.drag .ficha-tags, .ficha.drop .ficha-tags {
	width:8.5vh;
	margin-right:0.5vh;
	margin-top:1vh;
}
.ficha.drag .ficha-tag, .ficha.drop .ficha-tag {
	font-size:1vh;
	line-height:1.4vh;
	height:2vh;
	padding:0.3vh 0;
}
.ficha.drag .ficha-info, .ficha.drop .ficha-info { display:none; }
.ficha.drop {
	background:transparent;
	-webkit-box-shadow:none;
	   -moz-box-shadow:none;
			box-shadow:none;
}
.ficha.drop .ficha-titulo {
	height:3.5vh;
	padding:0.5vh 1vh;
}
.ficha.drop .ficha-cargos { display:none; }
.ficha.drop .ficha-foto {
	height:10vh;
	margin-top:0;
	margin-left:0.5vh;
}
.personal-boton {
	height:5vh;
	width:20vh;
	margin:1vh auto 0;
	background:#521f18;
	border-radius:3vh;
	text-decoration:none;
	opacity:0.5;
	-webkit-transition:all 0.3s ease-in-out;
	   -moz-transition:all 0.3s ease-in-out;
		 -o-transition:all 0.3s ease-in-out;
			transition:all 0.3s ease-in-out;
}
.personal-boton.active { opacity:1; }
.personal-boton span {
	font-size:2vh;
	line-height:2.5vh;
	padding-top:1.2vh;
	display:block;
	float:left;
	color:#FFF;
	margin-left:4vh;
}
.personal-boton b {
	font-size:2vh;
	line-height:2.5vh;
	width:2.5vh;
	height:2.5vh;
	border-radius:1.5vh;
	margin-left:1vh;
	margin-top:1.2vh;
	text-align:center;
	display:block;
	float:left;
	color:#521f18;
	background:#FFF;
	-webkit-transition:all 0.3s ease-in-out;
	   -moz-transition:all 0.3s ease-in-out;
		 -o-transition:all 0.3s ease-in-out;
			transition:all 0.3s ease-in-out;
}
.personal-boton:hover { background:#e57713; }
.personal-boton:hover b { color:#e57713; }

/***** Personal Ficha *****/
.modal-ficha {
	display:none;
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, 0.8);
	position:absolute;
	top:0;
	left:0;
	z-index:999999;
}
.modal-ficha .modal-cont {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	width:40vh;
	height:52vh;
	border-radius:1vh;
	background:#FFF;
	overflow:hidden;
}
.modal-ficha .titulo {
	background:#e57713;
	height:5vh;
	font-size:2.5vh;
	line-height:3vh;
	padding:1vh 1.5vh;
	color:#FFF;
}
.modal-ficha .ficha {
	padding: 1.5vh;
	width: 100%;
	height:auto;
	margin: 0;
	border-radius:0;
	-webkit-box-shadow:none;
	   -moz-box-shadow:none;
			box-shadow:none;
}
.modal-ficha .ficha-nombre {
	font-size:2vh;
	line-height:2.5vh;
	height:3vh;
	float:none;
	color:#e57713;
}
.modal-ficha .ficha-foto {
	float:none;
	margin:0;
	border:1px solid #E8DADA;
	width:14.5vh;
	height:16vh;
	border-radius:1vh;
	overflow:hidden;
}
.modal-ficha .ficha-foto img { width:100%; }
.modal-ficha .ficha-tags {
	position: absolute;
	width:16vh;
	right:0.5vh;
	top:4vh;
}
.modal-ficha .ficha-tag {
	font-size:1.5vh;
	line-height:2vh;
	background:#e57713;
	color:#FFF;
	padding:0.5vh;
	border-radius:1.5vh;
	text-align:center;
	margin-top:2vh;
	height:auto;
}
.modal-ficha .ficha-tag:first-child { margin-top:0; }
.modal-ficha .ficha-texto {
	font-size:1.5vh;
	line-height:2vh;
	margin-top:1.5vh;
}
.modal-close {
	font-size: 2vh;
	line-height: 2.5vh;
	width: 3vh;
	height: 3vh;
	text-align: center;
	border-radius: 2vh;
	background: #5e1e1b;
	position: absolute;
	top:1vh;
	right:1vh;
	color: #FFF;
	-webkit-transition:all 0.3s ease-in-out;
	   -moz-transition:all 0.3s ease-in-out;
		 -o-transition:all 0.3s ease-in-out;
			transition:all 0.3s ease-in-out;
}
.modal-close:hover {
	background:#FFF;
	color:#5e1e1b;
}
/**/