@charset "UTF-8";

	.bg-tecnm{ background-color: #1B396A !important; color: #fff !important; }
	.text-tecnm{ color: #1B396A !important; }
		
	/* Redes Sociales Lateral */
	.sticky-container{ 
		padding:0px; 
		margin:0px; 
		position:fixed; 
		right:-135px;
		top:230px; 
		width:210px; 
		z-index: 1100; 
	}

	/*.sticky-container:hover{ right:-135px;}*/
	.sticky li{
		list-style-type: none;
		background-color: transparent;
		color: #efefef;
		height: 43px;
		padding: 0px;
		margin: 0px 0px 1px 0px; 
		-webkit-transition: all 0.25s ease-in-out;
		-moz-transition: all 0.25s ease-in-out;
		-o-transition:all 0.25s ease-in-out; 
		transition: all 0.25s ease-in-out; 
		cursor: pointer;
	}
	
	.sticky li:hover{ background-color:#fff; }
	.sticky li:hover{ margin-left:-115px; }
	.sticky li img{ float:left; margin:5px 4px; margin-right:5px;}
	.sticky li p{ padding-top:5px; margin:0px; line-height:16px; font-size:11px; }
	.sticky li p a{ text-decoration:none; color:#000; }
	.sticky li p a:hover{ text-decoration: underline; }

	/* Menú Azul */
	#main_navbar .dropdown-menu{ background-color: #1B396A; }
	#main_navbar .dropdown-menu li:before{ background-color: #1B396A; }
	#main_navbar .dropdown-menu li:after{ background-color: #1B396A; }
	#main_navbar .dropdown-menu a{ color: #fff; }

	/* Demo acordion*/

	#container-main{
		margin:40px auto;
		width:95%;
		min-width:320px;
		max-width:960px;
	}
	
	#container-main h1{
		font-size: 40px;
		text-shadow:4px 4px 5px #16a085;
	}
	
	.accordion-container {
		width: 100%;
		margin: 0 0 20px;
		clear:both;
	}
	
	.accordion-titulo {
		position: relative;
		display: block;
		padding: 20px;
		font-size: 24px;
		font-weight: 300;
		background: #2c3e50;
		color: #fff;
		text-decoration: none;
	}
	.accordion-titulo.open {
		background: #16a085;
		color: #fff;
	}
	.accordion-titulo:hover {
		background: #1abc9c;
	}
	
	.accordion-titulo span.toggle-icon:before {
		content:"+";
	}
	
	.accordion-titulo.open span.toggle-icon:before {
		content:"-";
	}
	
	.accordion-titulo span.toggle-icon {
		position: absolute;
		top: 10px;
		right: 20px;
		font-size: 38px;
		font-weight:bold;
	}
	
	.accordion-content {
		display: none;
		padding: 20px;
		overflow: auto;
	}
	
	.accordion-content p{
		margin:0;
	}
	
	.accordion-content img {
		display: block;
		float: left;
		margin: 0 15px 10px 0;
		width: 50%;
		height: auto;
	}

	/* Inicio galeria*/
	.image-container {
		display: flex;
		align-items: center;
		width: 200%;
		height: 150%;
	  }
	  
	  .image-container img {
		max-width: 10000%;
		max-height: 10000%;
	  }

	/* Inicio galeria*/
	.linea{
		background: #e76400;
		height: 8px;
		width: 100%;
		display: block;
	}

	.galeria{
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
		width: 95%;
		margin: auto;
		grid-gap: 10px;
		padding: 10px 0;
		overflow: hidden;
	}	

	.galeria img{
		width: 100%;
		vertical-align: top;
		height: 100px;
		object-fit: cover;
		transition: transform 0.5s;
	}

	.galeria > a{
		display: block;
		position: relative;
		overflow: hidden;
		box-shadow: 0 0 6px rgba(0, 0, 0, .5);
	}

	.galeria a:hover img{
		filter: blur(2px);
		transform: rotate(10deg) scale(1.3);
	}
	.light-box{
		position: fixed;
		top: 0;
		left: 0;
		background: rgba(0, 0, 0, .5);
		transition: transform .3s ease-in-out;
		width: 100%;
		height: 100vh;
		z-index: 1000;
		display: flex;
		justify-content: center;
		align-items: center;
		transform: scale(0);
	}
	.light-box img{
		width: 75vw;
		max-height: 70vh;
	}
	.light-box:target{
		transform: scale(1);
	}
	.close{
		display: block;
		position: absolute;
		top: 76%;
		right: 45%;
		background: #851919;
		color: #fff;
		text-decoration: none;
		width: 60px;
		height: 60px;
		text-align: center;
		line-height: 60px;
		border-radius: 100%;
	}
	.next{
		display: block;
		background: #851919;
		color: #fff;
		height: 30px;
		width: 30px;
		line-height: 30px;
		text-decoration: none;
		text-align: center;
	}
	@media screen and (max-width:400px){
		.galeria{
			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
		}
		.close{
			top: 20px;
			right: 20px;
		}
	}

	/* Fin galeria*/


	@media (max-width: 767px) {
		.accordion-content {
			padding: 10px 0;
		}
	}
	


@media (min-width: 768px) {
  html { font-size: 16px; } 
head{
	background-image: url("/plantilla_web_TecNM/img/encabezado/china-icono.png");
}
}