/*------------------------*/
/*GENERALES*/
/*------------------------*/
	*, *:before, *:after{
		box-sizing: border-box;
	}
	body, html {
	    height: 100%;
	    margin: 0;
	    padding: 0;
	    font-family: 'Roboto Condensed', sans-serif;
	    color: #232323;
	}
	a, select, input, textarea, button, .transition, span{
		transition: all 0.3s ease;
		-webkit-appearance: none;
		font-family: 'Roboto Condensed', sans-serif;
	}
	a{
		text-decoration: none;
	}
	ul, li {
	    list-style: none;
	    padding: 0;
	    margin: 0;
	}
	.clear {
	    clear: both;
	}
	.container{
		margin: 0 auto;
		max-width: 86%;
	}
	.ocultar {
	    display: none
	}

	.st0{
		fill:#FFFFFF;
	}

	h2{
		font-size: 50px;
		color: #176f94;
		text-align: center;
		margin-top: 0;
	}
	section{
		padding: 100px 0;
	}

/*------------------------*/
/*HEADER*/
/*------------------------*/
	.subpaginas .only-index{
		display: none!important;
	}
	#index .only-subp{
		display: none!important
	}
	.subpaginas .st0{
		fill: #176f94;
	}
	header {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 9999;
	}
		header .logo-nav{
			display: inline-block;
			float: left;
			padding: 16px 0;
		}
			header .logo-nav img{
				max-width: 210px;
			}

		header nav {
			display: inline-block;
			float: right;
			vertical-align: top
		}
		header nav > ul > li{
			display: inline-block;
			vertical-align: top;
		}
		header nav > ul > li a {
			display: block;
		}
		header nav > ul > li > a{
			padding: 35px 15px;
			color: white;
			position: relative;
		}
		header nav > ul > li > a span{
			background: #176f94;
			color: white;
			border-radius: 5px;
			padding: 8px 11px;
			font-weight: 700;
			cursor: pointer;
		}
		header nav > ul > li > a span:hover,
		header nav > ul > li > a span:focus,
		.active-btn{
			background: white;
			color: #176f94;
		}

	.children{
		display: none;
		width: 300px;
		background: white;
		border-radius: 10px;
		position: absolute;
		right: 8%;
		-webkit-box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3);
		box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3);
	}
		.children:before{
			content: '';
			display: block;
			width: 0; 
			height: 0; 
			border-left: 13px solid transparent;
			border-right: 13px solid transparent;
			border-bottom: 16px solid white;
			position: absolute;
			top: -15px;
			right: 15px;
			border-radius: 3px;
		}
		.children li {
			border-bottom: solid 1px #e0e0e0;
		}
			.children li:last-child{
				border-bottom: none;
			}
			.children li:last-child a{
				border-bottom-right-radius: 10px;
				border-bottom-left-radius: 10px;
			}
			.children li:first-child a{
				border-top-right-radius: 10px;
				border-top-left-radius: 10px;
			}

			.children li a{
				min-height: 83px;
				display: flex;
		  		align-items: center;
		  		padding: 15px 20px 15px 15px;
		  		color: #3a3a3a;
			}
			.children li a:hover,
			.children li a:focus{
				background: #eee
			}
			.children li a:hover p,
			.children li a:focus p{
				color: #176f94;
			}
		.children .cont-img-children{
			width: 92px;
			text-align: center
		}
		.children .cont-img-children img{
			max-width: 50px;
		}
		.children p {
			width: 178px;
			display: inline-block;
			font-size: 14px;
			line-height: 14px;
			margin: 0;
			padding-left: 15px;
		}

	.scroll{
		background: #efefef;
	}
		.scroll .st0{
			fill:#176f94;
		}

		.scroll nav > ul > li > a{
			color: #176f94;
		}
	.btn-header{
		padding-right: 0;
	}

	/*Hover*/
		.hvr-underline-from-center {
		  vertical-align: middle;
		  -webkit-transform: translateZ(0);
		  transform: translateZ(0);
		  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
		  -webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
		  -moz-osx-font-smoothing: grayscale;
		  position: relative;
		  overflow: hidden;
		}

			.hvr-underline-from-center:before {
			  content: "";
			  position: absolute;
			  z-index: -1;
			  left: 50%;
			  right: 50%;
			  bottom: 20px;
			  background: #176f94;
			  height: 4px;
			  -webkit-transition-property: left, right;
			  transition-property: left, right;
			  -webkit-transition-duration: 0.3s;
			  transition-duration: 0.3s;
			  -webkit-transition-timing-function: ease-out;
			  transition-timing-function: ease-out;
			}
				.hvr-underline-from-center:hover:before,
				.hvr-underline-from-center:active:before,
				.nav-active:before{
				  left: 30%;
				  right: 30%;
				}

	/*Hamburguesa*/
	    .c-hamburger {
	      position: relative;
	      overflow: hidden;
	      margin: 0;
	      padding: 0;
	      width: 96px;
	      height: 96px;
	      font-size: 0;
	      text-indent: -9999px;
	      -webkit-appearance: none;
	      -moz-appearance: none;
	      appearance: none;
	      box-shadow: none;
	      border-radius: none;
	      border: none;
	      cursor: pointer;
	      transform: scale(0.5);
	      position: absolute;
	      top: 0;
	      right: 0;
	      z-index: 99999;
	      display: none
	    }

	    .c-hamburger:focus {
	      outline: none;
	    }

	    .c-hamburger span {
	      display: block;
	      position: absolute;
	      top: 44px;
	      left: 18px;
	      right: 18px;
	      height: 8px;
	      background: #1b1b1f;
	      border-radius: 3px;
	    }

	    .c-hamburger span::before,
	    .c-hamburger span::after {
	      position: absolute;
	      display: block;
	      left: 0;
	      width: 100%;
	      height: 8px;
	      background-color: #1b1b1f;
	      content: "";
	      border-radius: 3px;
	    }

	    .c-hamburger span::before {
	      top: -20px;
	    }

	    .c-hamburger span::after {
	      bottom: -20px;
	    }

	    .c-hamburger--htx {
	      background-color: transparent;
	    }

	    .c-hamburger--htx span {
			transition: background 0s 0.3s;
	    }

	    .c-hamburger--htx span::before,
	    .c-hamburger--htx span::after {
	        transition-duration: 0.3s, 0.3s;
	        transition-delay: 0.3s, 0s;
	    }

	    .c-hamburger--htx span::before {
	        transition-property: top, transform;
	    }

	    .c-hamburger--htx span::after {
	        transition-property: bottom, transform;
	    }

		.c-hamburger--htx.is-active {
			background-color: transparent;
		}

		.c-hamburger--htx.is-active span {
			background: none;
		}

		.c-hamburger--htx.is-active span::before {
			top: 0;
			transform: rotate(45deg);
		}

		.c-hamburger--htx.is-active span::after {
			bottom: 0;
			transform: rotate(-45deg);
		}

		.c-hamburger--htx.is-active span::before,
		.c-hamburger--htx.is-active span::after {
			transition-delay: 0s, 0.3s;
		}

		.open-menu{
			right: 0;
		}


	@media (max-width: 1200px) {
		header nav > ul > li > a {
			padding: 35px 10px;
		}
		.logo-nav svg{
			width: 170px;
		}
		.hvr-underline-from-center{
			font-size: 14px;
		}
	}

	@media (max-width: 992px) {
		.c-hamburger{
			display: block;
		}
		.hvr-underline-from-center:before{
			display: none;
		}
		nav{
			height: 100vh;
			background: rgba(255,255,255,1);
			position: absolute;
			right: -100%;
			top: 0;
			padding: 70px 0 30px;
			width: 310px;
			overflow-y: scroll;
		}
		header nav > ul > li{
			display: block;
		}
		header nav > ul > li > a {
			padding: 20px;
			border-bottom: solid 1px #eee
		}
		header nav > ul > li > a{
			color: #176f94;
		}

		header nav > ul > li > a span:hover, header nav > ul > li > a span:focus, .active-btn{
			background: rgba(23,111,148,0.7);
			color: white;
		}

		.children{
			right: 0;
			border-radius: 0;
			box-shadow: none;
			width: 100%;
		}

			.children li:first-child a{
				border-top-right-radius: 0;
				border-top-left-radius: 0;
			}
			.children:before{
				display: none;
			}

		.js-desplegable{
			overflow:hidden;
		}
		.overlay-header{
			width: 100%;
			height: 100%;
			background: rgba(0,0,0,0.7);
			position: fixed;
			left: 0;
			top: 0;
			z-index: 9;
			display: none;
		}
		a.nav-active{
			font-weight: 700;
		}
	}

/*------------------------*/
/*INICIO*/
/*------------------------*/
	.overlay{
		width: 100%;
		height: 100%;
		background: url(../images/overlay.png);
		position: absolute;
		left: 0;
		top: 0;
		z-index: 0;
	}
		.overlay:before{
			width: 100%;
			height: 100%;
			content:'';
			position: absolute;
			left: 0;
			top: 0;
			background: rgba(0,0,0,0.5);
		}
	#inicio{
		height: 100%;
		background: url(../images/bg-inicio.jpg) no-repeat center;
		background-size: cover;
		color: white;
		text-align: left;
		overflow-x: hidden;
	}
		#inicio h1{
		margin: 0;
		font-size: 100px;
		text-shadow: 2px 2px 2px rgba(0,0,0,0.2);
		}

		
		#inicio h2{
			font-size: 80px;
			font-weight: 400;
			line-height: 77px;
			margin: 0;
			max-width: 500px;
			text-transform: uppercase;
			text-shadow: 2px 2px 2px rgba(0,0,0,0.2);
			color: white;
			text-align: left;
		}
	.text-cont{
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		z-index: 1;
		position: absolute;
		width: 100%;
		top: 0;
		left: 0;
		padding-left: 10%;
		overflow-x: hidden;
	}

	/*Animación*/
		.title-animation{
		    position: relative;
		    height: 180px;
		}

		.title-01,
		.title-02{
			position: absolute;
			left: 0;
			top: 0;
			-webkit-animation-name: title-inicio;
	            animation-name: title-inicio;
	            animation-duration: 12s;
	            animation-iteration-count: infinite;
			
		}
		.title-01{
			animation-delay: 0s;
		}
		.title-02{
			animation-delay: 6s;
			opacity: 0;
		}
		
		@-webkit-keyframes title-inicio {
		    0%   {opacity: 0; top: -50px; left: 0;}
	        15%  {opacity: 1; top: 0; left: 0;}
	        50%  {opacity: 1; top: 0; left: 0;}
	        75%  {opacity: 0; top: 0; left: 70px;}
	        100% {opacity: 0; top: 0; left: 70px;}
		}

		/* Standard syntax */
		@keyframes title-inicio {
		    0%   {opacity: 0; top: -50px; left: 0;}
	        15%  {opacity: 1; top: 0; left: 0;}
	        50%  {opacity: 1; top: 0; left: 0;}
	        75%  {opacity: 0; top: 0; left: 70px;}
	        100% {opacity: 0; top: 0; left: 70px;}
		}

	@media (max-width: 992px) {
		#inicio h1{
			font-size: 90px
		}
		#inicio h2{
			font-size: 80px;
			line-height: 70px;
		}
	}
	@media (max-width: 769px) {
		#inicio h1{
			font-size: 65px
		}
		#inicio h2{
			font-size: 55px;
			line-height: 50px;
		}
		.title-animation{
			height: 90px;
		}
		#inicio h2{
			width: 100%;
		}
		h2{
			font-size: 40px;
		}
	}
	@media (max-width: 480px) {
		.text-cont{
			left: 7%;
			width: 100%;
			padding: 0;
		}
		.text-cont,
		#inicio h2{
			text-align: center;
		}
		#inicio h1{
			font-size: 40px;
		}
		#inicio h2{
			font-size: 35px;
			line-height: 35px;
		}
		h2{
			font-size: 30px;
		}
	}

/*------------------------*/
/*ACERCA*/
/*------------------------*/
	
	/*Acerca*/
		#acerca{
			padding-bottom: 0;
		}
		.acerca{
			padding-bottom: 50px;
		}
		.texto-acerca{
			max-width: 725px;
			margin: 0 auto;
			font-size: 18px;
			line-height: 29px;
		}
		.texto-acerca ul {
			border-left: solid 8px #e5e5e5;
			padding-left: 30px;
		}
			.texto-acerca ul li {
				list-style: initial;
				margin-bottom: 20px;
			}
		@media (max-width: 769px) {
			.texto-acerca{
				font-size: 16px;
				line-height: 20px;
			}
		}

	/*Iconos*/
		.iconos{
			padding: 50px 0;
			background: url(../images/bg-iconos.jpg) no-repeat center fixed;
			background-size: cover;
		}
		.lista-iconos li{
			float: left;
			width: 33.3%;
			padding: 30px 2%;
			min-height: 260px;
			text-align: center;
			color: white;
			font-size: 20px;
		}
		.lista-iconos li h4{
			max-width: 300px;
			margin: 23px auto;
		}
		.lista-iconos li img{
			height: 90px;
		}

		@media (max-width: 992px) {
			.lista-iconos li{
				font-size: 17px;
			}
			.iconos{
				background-attachment:scroll;
			}
		}
		@media (max-width: 769px) {
			.lista-iconos li{
				width: 50%;
			}
		}
		@media (max-width: 480px) {
			.lista-iconos li{
				font-size: 16px;
			}
			.lista-iconos li img{
				height: 70px;
			}
		}
		@media (max-width: 380px) {
			.lista-iconos li{
				font-size: 15px;
				min-height: 100px;
			}
			.lista-iconos li img{
				height: 50px;
			}
		}

	/*Distinto*/
		.distinto{
			background: #eee;
		}
			.distinto h3{
				background: #176f94;
				color: white;
				text-transform: uppercase;
				font-size: 25px;
				padding: 35px 15%;
				text-align: center;
				margin: 0 0 70px 0;
				position: relative;
			}
				.distinto h3:after{
					content: '';
					display: block;
					width: 0; 
					height: 0; 
					border-left: 33px solid transparent;
					border-right: 33px solid transparent;
					border-top: 30px solid #176f94;
					position: absolute;
					bottom: -15px;
					left: 50%;
					margin-left: -25px;
					border-radius: 3px;
				}
		.lista-distinto >li{
			float: left;
			width: 33.3%;
			padding: 80px 30px 20px;
		}
			.lista-distinto > li:first-child{
				background: url(../images/nros-01.svg) no-repeat center top;
				background-size: 190px;
			}
			.lista-distinto > li:nth-child(2){
				background: url(../images/nros-02.svg) no-repeat center top;
				background-size: 190px;
			}
			.lista-distinto > li:nth-child(3){
				background: url(../images/nros-03.svg) no-repeat center top;
				background-size: 190px;
			}
			.lista-distinto > li h4{
				color: #176f94;
				text-transform: uppercase;
				font-size: 18px;
			}
			.lista-distinto > li h4:after{
				display: block;
				content:'';
				width: 30px;
				height: 5px;
				background: #176f94;
				margin: 20px 0;
			}
			.lista-distinto p{
				color: #232323;
				line-height: 24px;
			}

			.lista-distinto > li > ul{
				margin-bottom: 70px;
			}
			.lista-distinto > li > ul li {
				line-height: 24px;
			}

			.lista-distinto > li > ul li:before{
				content: "• ";
	  			color: #176f94;
	  			font-size: 25px;
	  			vertical-align: middle;
			}
		@media (max-width: 1200px) {
			.lista-distinto p,
			.lista-distinto > li > ul li{
				font-size: 14px;
				line-height: 22px;
			}
			.lista-distinto >li{
				padding: 80px 20px 20px
			}
			.lista-distinto > li h4{
				font-size: 17px;
			}
		}

		@media (max-width: 992px) {
			.lista-distinto >li{
				width: 100%;
				float: none;
				text-align: center;
			}
			.lista-distinto > li h4:after{
				text-align: center;
				margin: 20px auto;
			}
		}

/*------------------------*/
/*SERVICIOS*/
/*------------------------*/
	#servicios{
		padding-bottom: 0;
	}
	.lista-servicios li{
		position: relative;
		height: 380px;
		position: relative;
	}

	.img-servicios,
	.texto-servicios{
		width: 50%;
		float: left;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-content: center;
	}
	.texto-servicios{
		background: #176f94;
		color: white;
		padding: 15px 5%;
		line-height: 24px;
	}
		.texto-servicios h3{
			text-align: left;
		}
	.img-servicios-1{
		background: url(../images/servicios/1.jpg) no-repeat center;
		background-size: cover;
	}
	.img-servicios-2{
		background: url(../images/servicios/2.jpg) no-repeat center;
		background-size: cover;
	}
	.img-servicios-2{
		position: absolute;
		right: 0;
		top: 0;
	}
	.img-servicios-3{
		background: url(../images/servicios/3.jpg) no-repeat center;
		background-size: cover;
	}

	@media (max-width: 992px) {
		.lista-servicios li{
			height: 480px;
		}
		.texto-servicios h3{
			margin-bottom: 0;
		}
	}
	@media (max-width: 769px) {
		.img-servicios, .texto-servicios{
			height: auto;
			width: 100%;
			float: none;
		}
		.img-servicios-2{
			position: static;
		}
		.img-servicios{
			height: 300px;
		}
		.texto-servicios,
		.lista-servicios li{
			height: auto;
		}
		.lista-servicios li{
			margin-bottom: 30px;
		}
	}

/*------------------------*/
/*NOVEDADES*/
/*------------------------*/
	#novedades{
		text-align: center;
	}
		#novedades h2{
			margin-bottom: 0;
		}
	.owl-carousel{
		margin-top: 70px;
	}
	.item{
		text-align: left;
	}
	.item img{
		width: 100%;
		border: solid 1px #ddd;
	}
	.item h4{
		text-transform: uppercase;
		font-size: 22px;
		color: #176f94;
		margin: 10px 0;
	}
	.item p{
		font-size: 17px;
		color: #232323;
		margin-top: 0;
	}
	.item a{
		display: inline-block;
		padding: 8px 20px;
		color: #176f94;
		border: solid 1px #176f94;
		border-radius: 6px;
	}
		.item a:hover,
		.item a:focus{
			background: #176f94;
			color: white;
		}
	.videoWrapper {
		position: relative;
		padding-bottom: 56.25%;
		padding-top: 25px;
		height: 0;
	}
	.videoWrapper iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	.owl-nav{
		display: block!important;
	}
	.owl-prev,
	.owl-next{
		width: 50px;
		height: 50px;
		font-size: 0;
		position: absolute;
		top: 25%;
		opacity: 0.5;
		transition: all 0.3s ease;
	}
	.owl-prev{
		background: url(../images/arrow-left.svg) no-repeat center #176f94;
		background-size: 20px;
		left: -60px;
	}
	.owl-next{
		background: url(../images/arrow-right.svg) no-repeat center #176f94;
		background-size: 20px;
		right: -60px;
	}

	.owl-prev:hover,
	.owl-next:hover,
	.owl-prev:focus,
	.owl-next:focus{
		opacity: 1;
		border-radius: 50%;
	}

	@media (max-width: 992px) {
		#novedades .container{
			max-width: 100%;
			padding: 0 70px;
		}
		.item h4{
			font-size: 20px;
		}
		.item p{
			font-size: 16px;
		}
	}
	@media (max-width: 769px) {
		.item h4{
			font-size: 18px;
		}
		.item p{
			font-size: 14px;
		}
		.owl-prev,
		.owl-next{
			width: 40px;
			height: 40px;
		}
		.owl-prev{
			left: -65px;
		}
		.owl-next{
			right: -65px;
		}
	}

/*------------------------*/
/*CONTACTO*/
/*------------------------*/
	#contacto{
		background: #176f94;
		color: white;
		position: relative;
	}
		#contacto h2{
			color: white;
		}
	.contacto-datos li{
		margin-bottom: 30px;
	}
		.contacto-datos li img{
			max-width: 95px;
			display: inline-block;
			vertical-align: top;
		}
	.texto-contacto{
		display: inline-block;
		margin-left: 15px;
	}
		.texto-contacto h4{
			text-transform: uppercase;
			margin-top: 0;
		}
		.texto-contacto a{
			color: white;
			display: block;
		}
		.texto-contacto a:focus,
		.texto-contacto a:hover{
			text-decoration: underline;
		}

	.form-wrapper label{
		border-top: solid 1px white;
		display: block;
	}
	.mensaje{
		border-bottom: solid 1px white;
	}
		.form-wrapper label p{
			width: 15%;
			border-right: solid 1px white;
			float: left;
			margin: 0;
			margin: 22px 0;
			text-transform: uppercase;
			font-weight: 700;
		}
		.form-wrapper label input,
		.form-wrapper label textarea{
			color: white;
			border: none;
			width: 85%;
			float: left;
			padding: 22px;
			background: transparent;
			outline: none;
		}
		.form-wrapper label input:focus,
		.form-wrapper label textarea:focus{
			background: rgba(255,255,255,0.1);
		}
		.form-wrapper label textarea{
			height: 160px;
		}
	.form-wrapper {
		float: left;
		width: 70%;
		padding-right: 5%;
	}
	.contacto-datos{
		float: left;
		width: 30%;
	}

	.submit{
		border: none;
		border-radius: 0;
		text-transform: uppercase;
		color: white;
		font-weight: 700;
		font-size: 18px;
		outline: none;
		cursor: pointer;
		padding: 20px 55px 20px 5px;
		background: transparent url(../images/arrow-submit.svg) no-repeat;
		background-size: 20px;
		background-position: 70px center;
	}
	.submit:hover{
		background-position: 80px center;
		opacity: 0.8;
	}

	.ui-widget-overlay {
		background: rgba(0,0,0,0.8);
		height: 100%;
		width: 100%; 
		position: fixed;
		top:0;
		left: 0;
		z-index: 9999;
	}
	.divModal {
		background: #176f94;
		color: white;
		width: 450px!important;
		height:400px!important;
		text-align: center;
		padding: 1em;
		box-sizing: border-box;
		font-size: 35px;
		text-transform: uppercase;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		align-content: center;
		z-index: 999999;
		position: absolute;
		left: 50%;
		top:50%;
		margin-left:-225px;
		margin-top:-225px;
	}
	.ui-dialog {
		position: relative;
		width: 450px!important;
		z-index: 9999
	}
	.close {
		position: absolute;
		right: 0;
		top:0;
		background: white;
		color: white;
		padding: 0.5em 1em;
		box-sizing: border-box;
		border:none;
		text-transform: uppercase;
		cursor:pointer;
		font-weight: 700;
		z-index: 9999;
		font-size: 20px;
		color: #176f94;
	}
	.close:hover, .close:focus {
		opacity: 0.8
	}

	.ui-dialog-titlebar {
		background: #d4df3f;
		z-index: 9999
	}
	.ui-dialog {
		position: fixed;
		top: 50%;
		margin-left: -225px;
		margin-top: -200px;
		z-index: 9999
	}

	@media (max-width: 1200px) {
		.texto-contacto h4{
			margin-bottom: 0
		}
		.texto-contacto p{
			margin-top: 10px;
		}
		.contacto-datos li img{
			max-width: 85px;
		}
		.form-wrapper{
			width: 60%;
		}
		.contacto-datos{
			width: 40%;
			margin-top: 50px;
		}
		.form-wrapper label p{
			width: 25%;
		}
		.form-wrapper label input, .form-wrapper label textarea{
			width: 75%;
		}
	
	}

	@media (max-width: 769px) {
		.form-wrapper,
		.contacto-datos{
			width: 100%;
			float: none
		}
		section {
			padding: 80px 0;
		}

	}

	@media (max-width: 480px) {
		.divModal {
			width: 100%!important;
			height:auto!important;
			font-size: 25px;
			left: 0;
			top:30%;
			margin-left:0;
			margin-top:0;
		}
		.ui-dialog {
			position: relative;
			width: 450px!important;
			z-index: 9999
		}
		.form-wrapper label p{
			font-size: 14px
		}
		section{
			padding: 60px 0;
		}
	}
	@media (max-width: 380px) {
		.form-wrapper label p{
			font-size: 12px
		}
	}

/*------------------------*/
/*FOOTER*/
/*------------------------*/
	.logo-footer{
		padding: 50px 0 40px;
		text-align: center;
	}
		.logo-footer img{
			max-width: 200px;
		}
	.pie{
		padding: 0;
		background: #777;
		color: white;
	}
	.pie p{
		margin: 8px 0;
	}
	.pie .left{
		width: 60%;
		float: left;
	}
	.pie .right {
		width: 40%;
		float: left;
		text-align: right;
	}
	.pie .right a {
		color: white;
	}
		.pie .right a:hover,
		.pie .right a:focus{
			text-decoration: underline;
		}
	.img-izq{
		float: left;
		margin-top: 28px;
	}
	.img-dcha{
		float: right;
		width: 80px;
	}

	@media (max-width: 769px) {
		.pie{
			padding: 10px 0;
		}
		.pie .left,
		.pie .right{
			float: none;
			width: 100%;
			text-align: center;
		}
	}

	@media (max-width: 480px) {
		.img-izq,
		.img-dcha{
			float: none;
			display: block;
		}
		.img-izq{
			margin: 0 auto 30px;
		}
		.img-dcha{
			margin: 0 auto;
		}
	}

/*------------------------*/
/*LOGIN*/
/*------------------------*/
	.subpaginas header nav > ul > li > a{
		color: #176f94;
	}
	.subpaginas header nav > ul > li > a span:hover,
	.subpaginas header nav > ul > li > a span:focus{
		background: #176f94;
		color: white; 
		opacity: 0.7;
	}
	.logo-nav img{
		width: 170px;
	}
	#login{
		height: 100vh;
		text-align: center;
		background: url(../images/login/bg-inicio.png) no-repeat center #efefef;
		background-size: cover;
		padding: 100px 0;
	}
	.logo-login{
		max-width: 300px;
		max-height: 200px;
	}

.opciones-login{
	margin-top: 50px;
	text-align: center;
}
.opciones-login li{
	display: inline-block;
	width: 24%;
	padding: 1.5%;
	font-size: 0;
}

.opciones-login li p{
	font-size: 16px;
}

.btn-celeste .btn{
	background: #176f94;
	background-size: 25px;
	box-shadow: 0 6px #0f4b60;
}
	.btn-celeste .btn:hover {
		box-shadow: 0 4px #0f4b60;
		top: 2px;
		background: #176f94;
		background-size: 25px;
		opacity: 0.8;
	}
	.btn-celeste .btn:active {
		box-shadow: 0 4px #0f4b60;
		top: 6px;
		background: #176f94;
		background-size: 25px;
		opacity: 0.8;
	}

.btn-verde .btn{
	background: #73b65a;
	background-size: 25px;
	box-shadow: 0 6px #548241;
}
	.btn-verde .btn:hover {
		box-shadow: 0 4px #548241;
		top: 2px;
		background: #73b65a;
		background-size: 25px;
		opacity: 0.8;
	}
	.btn-verde .btn:active {
		box-shadow: 0 4px #548241;
		top: 6px;
		opacity: 0.8;
	}

.btn-negro .btn{
	background: #000;
	background-size: 25px;
	box-shadow: 0 6px #303030;
}
	.btn-negro .btn:hover {
		box-shadow: 0 4px #303030;
		top: 2px;
		opacity: 0.8;
	}
	.btn-negro .btn:active {
		box-shadow: 0 4px #303030;
		top: 6px;
		opacity: 0.8;
	}

.btn-gris .btn{
	background: #889693;
	background-size: 25px;
	box-shadow: 0 6px #58605e;
}
	.btn-gris .btn:hover {
		box-shadow: 0 4px #58605e;
		top: 2px;
		opacity: 0.8;
	}
	.btn-gris .btn:active {
		box-shadow: 0 4px #58605e;
		top: 6px;
		opacity: 0.8;
	}

.btn{
	font-size: 16px;
	border: none;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	background: none;
	cursor: pointer;
	padding: 16px;
	display: inline-block;
	text-transform: uppercase;
	font-weight: 700;
	outline: none;
	position: relative;
	border-radius: 20px;
	width: 100%;
	text-align: center;
	color: white;
	font-size: 19px;
	font-weight: 700;
	border: none;
	cursor: pointer;
	outline: none;
	color: #fff;
	height: 125px;
	display: flex;
	  flex-direction: column;
	  justify-content: center;
	  align-items: center;
	  align-content: center;
}

.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	transition: all 0.3s;
}

@media (max-width: 769px) {
	.opciones-login li{
		width: 49%;
	}
	.opciones-login li p{
		font-size: 13px;
	}
}

@media (max-width: 480px) {
	.btn{
		font-size: 14px;
	}
	nav{
		width: 100%;
	}
	.logo-login{
		max-width: 90%;
	}
}