//Estilos globales de las paginas de unidad.
.node-type-unidades {
	
	@include banner-internal;

	#main {
		.section {
			max-width: 100%;
			padding: 0;
		}

		.group-grupo-1 {
			background: $c-brand-whitesmoke;
			padding-bottom: 1em;
			
			.group-director {
				@include holder;
				@include holder-small(90%);
				text-align: center;

				h3 {
					@include title-block( tint($c-dimgray, 10), 217%);
		    		font-weight: 100;
		    		max-width: 660px;
		    		margin: 1em auto;
		    		text-align: center;

		    		&:after {
		    			background: tint($c-dimgray, 60);
		    			width: 54px;
		    			margin: 15px auto 0;
		    		}
				}

				.field-name-field-director{
					@include director-sin-datos;
				}
			}
		}

		.group-grupo-3 {	
			background: url('../images/resena-historica_bg.jpg') repeat-x;
		}

		.group-grupo-5, .group-grupo-4, .group-grupo-6 {
			@include holder;
			@include holder-small(90%);
		}
		
		.group-grupo-2 {
			@include holder;
			@include holder-small(90%);
			margin: 2em auto;

			.field-name-field-cargo-director {
				color: $c-dimgray;
				font-weight: 100;
				font-size: 115%;
			}

			> .field-name-field-director {
				@include inline-block(top);
				background: $c-white;
				border: 1px solid shade($c-brand-whitesmoke, 10);
				box-shadow: 1px 0px 6px shade($c-brand-whitesmoke, 20);
				display: inline-block;
				margin-right: 2%;
				padding-bottom: 11px;
				text-align: center;
				width: 40%;

				.group-director {
					background: $c-brand-whitesmoke;
					border-bottom: 1px solid shade($c-brand-whitesmoke, 20);
					margin-bottom: 1em!important;
					padding: 10px 0!important;

					.field-name-field-fotografia {
						border: 3px solid shade($c-brand-whitesmoke, 20);
					}
				}

				.field-name-field-nombre {
					color: $c-dimgray;
					font-size: 106%;
					margin: 10px 0;
				}

				//Asesoras
				&.info-director {
					background: $c-gainsboro;
					padding: 0;
					width: 100%;

					.group-director {
						background: $c-white;
						border: none;
						float: left;
						margin: 0!important;
						width: 22%;

						h3 {
							display: none;
						}
						
						~ .field {
						    color: $c-b-gray;
							float: right;
							text-align: left;
							width: 75%;
						}
					}

					.field-name-field-rango {
						font-weight: bold;
						margin-top: 1.5em;
					}

					.field-name-field-nombre {
						&:after {
						   	background: $c-d-gray;
							content: '';
							display: block;
							height: 1px;
							margin-top: 12px;
							width: 470px;
						}

						a {
						    color: $c-b-gray;
						}
					}
				}
			}

			.group-director{
				@include holder;
				text-align: center;

				.field-name-field-director {

					.group-director {
			 			height: 100%;
			 			float: left;
			 			width: 30%;
			 			text-align: center;
					}

					.group-ganeral-datos {
						@include inline-block(top);
						border: 1px solid shade($c-brand-whitesmoke, 10);
						box-shadow:  0px 2px 4px shade($c-brand-whitesmoke, 20);
						margin-right: 1%;
						overflow: hidden;
						width: 39%;

						.field-name-field-nombre {
							&:after {
								width: 96%!important;
							}
						}
					}
				    .group-datos{
					    background-color: $c-l-gray;
				    	float: right;
					    height: 100%;
					    width: 64%;

					    .field-name-field-rango{
							text-align: left;
						    padding: 3% 0 0 3%;
						    font-weight: bold;
						    color: $c-b-gray
					    }

					    .field-name-field-nombre {
					    	text-align: left;
							padding-left: 3%;
							line-height: 1;
							color: $c-b-gray;
							margin-top: 5px;
				
							a, a:link {
								color: $c-b-gray;
								font-size: 140%;
								font-weight: 100;
							}

						    &:after{
						    	background: $c-d-gray;
							    content: '';
							    display: block;
							    height: 1px;
							    margin-top: 12px;
							    width: 470px;
						    }
					    }

					    .field-name-field-cargo-director {
						    color: $c-b-gray;
						    padding-left: 3%;
					    	text-align: left;
					    }
				    }
				
				    .group-resumen {
						@include inline-block(top);
						background: url('../images/fondo-saludo.png') no-repeat;
						box-shadow:  0px 2px 4px shade($c-brand-whitesmoke, 40);
						background-size: cover;
						padding: 2px 2% 0 6%;
						width: 51%;

						.field-name-field-saludo {
							margin-top: 32px;
						}

						p {
    						color: $c-white;
							font-size: 126%;
    						font-weight: 100;
    						font-style: italic;
    						line-height: 1.3;
    						margin: 0;
						}

						.field-name-link-director {
							line-height: 1;
							margin-bottom: 6px;
							text-align: right;

							.field-item {
								a {
									@include size(27px);
									@include imgreplace;
									background: url('../images/sprite.png') no-repeat -150px -124px;
									font-size: 0;
								}
							}
						}
				    }
				}
			}
		}

		.field-name-menu-unidad  {
			background: $c-menu-observatory;
			padding: 15px 0;
		}
	}

	.director-grupo {
		> h3 {
			display: none;
		}
	}

	.menu-policia-unidad {
		@include menu-pages($c-white, $c-white);
		@include holder;
		@include holder-small(90%);

	}

	.field-name-field-director {

		.field-name-field-nombre {
			a {
				color: $c-dimgray;
				font-size: 140%;
				font-weight: 100;
			}
		}

		.field-name-field-fotografia {
   		 	border-radius: 100%;
   			border: 3px solid $c-white;
   			margin-top: 10px;
			display: inline-block;
		
			img {
				border-radius: 100%;
			}
		}

		.field-name-field-rango {
			color: $c-dimgray;
			font-size: 111%;
			font-weight: 100;
		}

		&.info-director-full-width {
			border: 1px solid shade($c-brand-whitesmoke, 10);
			box-shadow: 1px 0px 6px shade($c-brand-whitesmoke, 20);
			background: $c-gainsboro;
			padding: 0;
			width: 100%;

			.group-director {
				background: $c-white;
				border: none;
				margin: 0!important;
				padding: 10px 0 !important;
				width: 22%!important;

				h3 {
					display: none;
				}
						
				~ .field {
					color: $c-b-gray;
					float: right;
					text-align: left;
					width: 75%;
				}

				.field-name-field-fotografia {
					border: 3px solid shade($c-brand-whitesmoke, 20);
				}
			}

			.field-name-field-cargo-director {
				color: $c-b-gray!important;
				margin-top: 10px;
			}

			.field-name-field-rango {
				font-weight: bold;
				margin-top: 1.5em;
			}

			.field-name-field-nombre {
				&:after {
					background: $c-d-gray;
					content: '';
					display: block;
					height: 1px;
					margin-top: 12px;
					width: 470px;
				}

				a {
					color: $c-b-gray;
				}
			}
		}
	}

	.group-atencion {
		@include inline-block(top);
		border: 1px solid shade($c-brand-whitesmoke, 10);
		box-shadow: 1px 0px 6px shade($c-brand-whitesmoke, 20);
		padding: 2%;
		width: 57%;
		position: relative;
		min-height: 305px;
		box-sizing: border-box;

		h2,
		h3 {
			@include inline-block(top);
			@include title-block( tint($c-dimgray, 10), 217%);
    		font-weight: 100;
    		margin-right: 2%;
    		width: 32%;
    		position: absolute;
    		top: 23%;

    		&:after {
    			background: tint($c-dimgray, 60);
    			width: 54px;
    		}
		}

		.field-collection-container  {
			@include inline-block(top);
			border: none;
			margin: 0;
			width: 60%;
			right: 0;
			position: absolute;

			.field-collection-view {
				margin: 0;
				padding: 0;
			}

			.field-name-field-atenci-n-al-ciudadano {

				.field {
    				color: $c-dimgray;
    				margin-bottom: 10px;
    				padding-left: 45px;
    				position: relative;

    				.field-label {
    					font-weight: 400;
    				}

    				.field-items {
    					font-size: 0.9em;
    					font-weight: 100;
    					line-height: 1.1;
    				}
				
    				&:before {
						@include size(28px);
						content: '';
						background: url('../images/sprite.png') no-repeat;
						display: inline-block;
						position: absolute;
						left: 0;
						top: 3px;
					}	
				}

				.field-name-field-direccion {
					&:before {
						background-position: -189px -285px;			
					}
				}
				.field-name-field-horarios {
					&:before {
						background-position: -189px -219px;
					}
				}	
				.field-name-field-telefonos {
					&:before {
						background-position: -189px -187px;
					}
				}		
				.field-name-field-correos {
					&:before {
						background-position: -189px -253px;
					}
				}
				.field-name-field-twitter {
					&:before {
						background-position: -189px -154px;
					}
				}
			}
		}
	}
}

//Menus unit.
.not-front {
	@include fringe-green($c-menu-observatory);

	#preface-first {
		
		.block-seed-tools-seed-breadcrumb {
			background: rgb(18, 88, 57);
		}
		.menu-policia-unidad {
			@include  menu-pages($c-white, $c-white);
		}
		.policia-unidad-observatorio {
			@include menu-big;
		}
	}
} 
