body{margin:0;background:#d3d3d3;font-family:Arial, Helvetica, sans-serif;text-decoration: none;width: 100%;}
body img{width: 100%;}
.color-bg { background:#4daa50; }
.color-bar-1, .color-bar-2 { width:100% }
.color-bar-1 { background:#414141; height:5px; }
.color-bar-2 { height:3px; }

@media (min-width: 1367px) and (max-width: 1920px) {

	
	#contenedor {
		width: 60%;
		margin:auto;
		text-align:center;
		background-color: white;
		}

	
		header{
			width:100%;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			/* background:#da0e0e; */
			margin: auto;
		}
	
		#logo-foremex{
			width: 25%;
			text-align:center;
			padding: 1em 0em;
			/* background-color: rgb(33, 44, 194); */
			display: flex;
			justify-content: center;
			align-items: center;
		}
	
		#logo-foremex img{
			width: 100%;
			text-align:center;
			padding: 1em 0em;
			/* background: red; */
		}

		#logo-foremex a { 
			/* background-color: rgb(201, 172, 172); */
			/* border: 1px solid #000; */
			width: 80%;
		}
	
		#contact-alm {
			text-align:center;
			font-size:1em;
			width:60%; 
			padding-top:0em; 
			padding-bottom:0em; 
			padding-right: 2em; 
			/* background:green; */
			margin-bottom: 0em; 
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			justify-content: flex-start;
		}
	
		#contact-alm p{
			font-family: Century-Gothic;	
			font-size: 1.3em;
			/* background-color: #d0e0d1; */
		}

			
		#contact-alm h1 {
			font-size: 1.7em;
			width: 100%;
			margin: auto;
			padding: 0em 0em;
			/* background-color: red; */
			text-align: right;
			margin: .8em 0em 0em 0em;
		}
	
		#contact{
			text-align:center;
			font-size:1em;
			width:60%; 
			padding-top:0em; 
			padding-bottom:0em; 
			padding-right: 2em; 
			/* background:green; */
			margin-bottom: 0em; 
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			justify-content: flex-start;
		}
	
		#contact p{
			font-family: Century-Gothic;	
			font-size: 1.3em;
			/* background-color: #d0e0d1; */
		}

			
		#contact h1 {
			font-size: 1.7em;
			width: 100%;
			margin: auto;
			padding: 0em 0em;
			/* background-color: red; */
			text-align: right;
			margin: .8em 0em 0em 0em;
		}
		
		.bnav {
			/* background-color: red; */
			display: none;
		}
	
		.bnav-phone {
			background-color: rgb(0, 0, 0);
			width: 100%;
			display: flex;
			flex-direction: row;
			align-items: center;
			margin: auto;
			margin-top: 0em;
			/* border-bottom: 1px solid #000; */
		}
	
		.bnav-phone h2 {
			/* background-color: rgb(192, 221, 26); */
			margin-top: 0em;
			border-bottom: 1px solid #000;
			width: 60%;
			margin-bottom: .6em;
			display: none;
		}
	
		#menu {
			background-color: rgb(0, 0, 0);
			width: 100%;
		}
	
		ul {
			background-color: rgb(0, 0, 0);
			/* border: 1px solid #67fc11; */
			width: 90%;
			display: flex;
			flex-direction: row;
			flex-wrap: nowrap;
			margin: auto;
			align-items: center;
			justify-content: space-between;
			padding: .5em 0em;
		}
	
		li {
			/* background-color: rgb(221, 25, 162); */
			text-align: center;
			display: flex;
			align-items: flex-start;
			justify-content: flex-start;
			font-size: 1em;
			margin: 0em 0em;
			border-right: 1px solid #ffffff;
			border-left: 1px solid #ffffff;
			/* border: 1px solid #000; */
		}
	
		li a {
			background-color: rgb(0, 0, 0);
			width: 100%;
			margin: 0em 0em;
			text-decoration: none;
			padding: .8em;
			color: white;
			border-radius: 0em;
			font-weight: normal;
		}
	
		li a:hover {
			background-color: rgb(255, 255, 255);
			width: 100%;
			margin: 0em 0em;
			text-decoration: none;
			padding: .8em;
			color: black;
			border-radius: 0em;
			font-weight: bold;
		}

	.subnav-burger {
		margin: auto;
		background: #4daa50;
		font-family: "Rubik Mono One", monospace;
		font-size: 1.2em;
		width: 100%;
		display: none;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		/* border-top: 1px solid #000;
		border-bottom: 1px solid #000; */
		margin-bottom: 1em;
	}

	#btn-menu {
		display: none;
	}

	.icon-menu {
		font-size: 1.5em;
		padding: 0.5em 0em;
		color: #ffffff;
		/* background: sienna; */
		font-family: "Rubik Mono One", monospace;
	} 

	.icon-cancel {
		color: rgb(255, 255, 255);
		font-size: 2.5em;
		/* background: turquoise; */
		margin-top: .5em;
		font-family: "Rubik Mono One", monospace;
	}

	.menu-burger {
		background: #4daa50;
		width: 100%;
		position: absolute;
		top: 0%;
		right: 0%;
		display: none;
		opacity: 100%;
		font-family: "Rubik Mono One", monospace;
	}

	.menu-burger ul {
		/* background-color: #2815d8; */
		display: flex;
		flex-direction: column;
	}

	.menu-burger li {
		font-size: 1em;
		padding: 7.5% 0%;
		width: 100%;
		font-family: Century-Gothic;	
		color: rgb(255, 255, 255);
		/* background: red; */
		margin-bottom: 1em;
	}

	.menu-burger a {
		text-decoration: none;
		/* background-color: pink; */
		width: 100%;
		border-bottom: 1px solid #000;

	}

	#btn-menu:checked ~ nav {
		display: block;
	}
			
		#banner {
			display: none;
			width: 100%;
		}
	
		#banner h1 {
			font-size: 2em;
			width: 100%;
			text-align: center;
			/* background-color: red; */
			position: absolute;
			top: 8em;
			left: 0;
			z-index: -99;
			display: none;
		}
	
		#esp {
			width: 90%;
			/* background-color: #63ad26; */
			margin: auto;
			margin-top: 1em;
			display: flex;
			flex-direction: row;
			align-items: flex-start;
			justify-content: space-between;
			flex-wrap: wrap;
			margin-bottom: 1em;
			background: url(/imagenes/productos/chatarra-industrial.webp); 
			background-size: 120%; 
			background-repeat: no-repeat;
		}
	
		#esp h2 {
			width: 100%;
			/* background-color: #63ad26; */
			margin: auto;
			margin-top: .5em;
			font-size: 1.8em;
			margin-bottom: 0em;
			color: #4daa50;
		}
	
		#esp h2+p {
			line-height: 2em;
			text-align: center;
			width: 90%;
			margin-bottom: 0em;
			font-size: 1em;
			display: block;
		}
		
		form {
			background-color: #222;
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 30%;
			margin: auto;
			margin-bottom: 1em;
			margin-top: 0em;
			padding-bottom: 1.5em;
			margin: 0em;
		}
							
		#esp .texto3 {
			text-align: center;
			width: 80%;
			margin-bottom: 1em;
			margin-top: 0.2em;
			font-size: 1.3em;
		}
		
		.azul {
			color: #4daa50;
			text-align: center;
			/* background-color: red; */
			line-height: 1em;
			margin: 1em 0em 0.5em 0em;
			font-size: 2em;
			width: 50%;
		}
		
		.azul2 {
			color: #4daa50;
			text-align: center;
			/* background-color: red; */
			line-height: 1em;
			margin: 1em 0em 0.5em 0em;
			font-size: 2em;
			width: 70%;
		}
	
		form .txtlbl {
			font-size: 1.2em;
			width: 70%;
			color: white;
			line-height: 1.1em;
			margin-bottom: 0em;
		}
	
		form .txtlbl2 {
			font-size: 1.2em;
			width: 70%;
			color: white;
			line-height: 1.1em;
			margin-bottom: 1em;
		}
	
		label {
			color: white;
			margin-bottom: 0em;
			font-size: 1.2em;
		}
	
		input {
			margin: 0em;
			height: 1.5em;
			width: 80%;
			text-align: center;
			font-size: 1em;
		}
				
		#esp .texto2 {
			text-align: center;
			width: 80%;
			margin-bottom: 1em;
			margin-top: 0.2em;
			font-size: 1.3em;
		}
				
		#esp .texto3 {
			text-align: center;
			width: 80%;
			margin-bottom: 1em;
			margin-top: 0.2em;
			font-size: 1.3em;
		}
	
		#boton {
			background-color: #4daa50;
			color: white;
			font-family: Century-Gothic;
			font-size: 1.4em;
			border-radius: 1.2em;
			margin-bottom: 0em;
			width: 35%;
			margin-top: 0em;
			height: 2.5em;
		}

		#boton:hover {
			cursor: pointer;
			background-color: #ffffff;
			color: #4daa50;
		}
	
		#boton2 {
			background-color: #4daa50;
			color: white;
			font-family: Century-Gothic;
			font-size: 1.4em;
			border-radius: 1.2em;
			margin-bottom: 1em;
			width: 35%;
			margin-top: 0.5em;
			height: 2.5em;
		}

		#boton2:hover {
			cursor: pointer;
			background-color: #ffffff;
			color: #4daa50;
		}

		.nota a {
			font-size: 1.2em;
			background-color: none;
			margin-bottom: 0em;
			/* background-color: red; */
			color: white;
		}
	
		.slideshow-container-abast {
		width: 100%;
		position: relative;
		margin: auto;
		margin-bottom: 0em;
		display: block;
		}
	
		/* Hide the images by default */
		.mySlides {
		display: none;
		margin: 0em;
		}
	
		/* Next & previous buttons */
		.prev, .next {
		cursor: pointer;
		position: absolute;
		top: 50%;
		width: auto;
		margin-top: -22px;
		padding: 16px;
		color: white;
		font-weight: bold;
		font-size: 18px;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
		}
	
		/* Position the "next button" to the right */
		.next {
		right: 0;
		border-radius: 3px 0 0 3px;
		}
	
		/* On hover, add a black background color with a little bit see-through */
		.prev:hover, .next:hover {
		background-color: rgba(0,0,0,0.8);
		}
	
		/* Caption text */
		.text {
		color: #f2f2f2;
		font-size: 15px;
		padding: 8px 12px;
		position: absolute;
		bottom: 8px;
		width: 100%;
		text-align: center;
		}
	
		/* Number text (1/3 etc) */
		.numbertext {
		color: #f2f2f2;
		font-size: 12px;
		padding: 8px 12px;
		position: absolute;
		top: 0;
		}
	
		/* Fading animation */
		.fade {
		animation-name: fade;
		animation-duration: 1.5s;
		}
	
		@keyframes fade {
		from {opacity: .4}
		to {opacity: 1}
		}
	
		.slick-slide {
			margin: 0px 20px;
		}
	
		.slick-slide img {
			width: 100%;
		}
	
		.slick-slider {
			position: relative;
			display: block;
			box-sizing: border-box;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
					user-select: none;
			-webkit-touch-callout: none;
			-khtml-user-select: none;
			-ms-touch-action: pan-y;
				touch-action: pan-y;
			-webkit-tap-highlight-color: transparent;
		}
	
		.slick-list {
			position: relative;
			display: block;
			overflow: hidden;
			margin: 0;
			padding: 0;
		}
	
		.slick-list:focus {
			outline: none;
		}
	
		.slick-list.dragging {
			cursor: pointer;
			cursor: hand;
		}
	
		.slick-slider .slick-track,
		.slick-slider .slick-list {
			-webkit-transform: translate3d(0, 0, 0);
			-moz-transform: translate3d(0, 0, 0);
				-ms-transform: translate3d(0, 0, 0);
				-o-transform: translate3d(0, 0, 0);
					transform: translate3d(0, 0, 0);
		}
	
		.slick-track {
			position: relative;
			top: 0;
			left: 0;
			display: block;
		}
	
		.slick-track:before,
		.slick-track:after {
			display: table;
			content: '';
		}
	
		.slick-track:after {
			clear: both;
		}
	
		.slick-loading .slick-track {
			visibility: hidden;
		}
	
		.slick-slide {
			display: none;
			float: left;
			height: 100%;
			min-height: 1px;
		}
	
		[dir='rtl'] .slick-slide {
			float: right;
		}
	
		.slick-slide img {
			display: block;
		}
	
		.slick-slide.slick-loading img {
			display: none;
		}
	
		.slick-slide.dragging img {
			pointer-events: none;
		}
	
		.slick-initialized .slick-slide {
			display: block;
		}
	
		.slick-loading .slick-slide {
			visibility: hidden;
		}
	
		.slick-vertical .slick-slide {
			display: block;
			height: auto;
			border: 1px solid transparent;
		}
	
		.slick-arrow.slick-hidden {
			display: none;
		}
	
		.container {
			/* background-color: rgb(255, 27, 27); */
			margin-top: 1em;
		}
	
		.container h2 {
			/* background-color: rgb(238, 190, 190); */
			font-size: 1.8em;
			margin-bottom: 0em;
			margin-top: 0em;
			color: #4daa50;
		}
	
		.slide img {
			width: 100%;
			/* background-color: #63ad26; */
		}

		
	#aceros {
		width: 100%;
		background: url(/img/plecas/acero-pleca.webp);
		background-size: 190%;
		background-repeat: no-repeat;
		margin-bottom: 0em;
		color: white;
	}

	#barra-aceros {
		background-color: rgb(255, 94, 0);
		height: 1em;
	}
	
	.in-aceros {
		/* border: 1px solid #ff0000; */
		width: 80%;
		margin: auto;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		align-items: center;
		padding: 1.5em 0em;
	}

	.in-aceros a p {
		background-color: rgb(255, 94, 0);
		padding: 1em;
		margin-bottom: 0em;
		border-radius: 1em;
		color: white;
		font-size: 1.3em;
	}

	.in-aceros a p:hover {
		background-color: rgb(255, 255, 255);
		padding: 1em;
		margin-bottom: 0em;
		border-radius: 1em;
		color: rgb(255, 94, 0);
	}

	.in-aceros a {
		text-decoration: none;
	}

	#aceros h4 {
		width: 50%;
		margin: auto;
		line-height: 1.3em;
		font-size: 1.5em;
	}	
		
	
		#pie {
			width:100%;
			background-color: #000;
			margin:0;
			padding:1em 0em;
			display: grid;
			gap: 1em;
		}
	
		.foot {
			width:40%;
			padding:1%;
			text-align:center;
			color:#fff;
			font-size: 1em;
			float:left;
			/* background-color: #da0b0b; */
			margin: auto;
			line-height: 1.5em;
		}
	
		.ft {
			padding:1%;
			float:left;
			/* background:#e41717; */
			color:#fff;
			font-size:1em;
			text-align:center;
			width: 70%;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: center;
			margin: auto;
		}
	
		.ft img{
			width: 20%;
		}

		.ft a {
			color:#fff;
			text-decoration:none;
			width: 30%;
		}	

}

@media (min-width: 1281px) and (max-width: 1366px) {

	
	#contenedor {
		width: 80%;
		margin:auto;
		text-align:center;
		background-color: white;
		}

	
		header{
			width:100%;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-around;
			/* background:#da0e0e; */
			margin: auto;
		}
	
		#logo-foremex{
			width:35%;
			text-align:center;
			padding: 1em 0em;
			/* background-color: rgb(33, 44, 194); */
			display: flex;
			justify-content: center;
			align-items: center;
		}
	
		#logo-foremex img{
			width: 80%;
			text-align:center;
			padding: 1em 0em;
		}

		#logo-foremex a { 
			/* background-color: rgb(201, 172, 172); */
			/* border: 1px solid #000; */
			width: 90%;
		}
	
		#contact-alm {
			text-align:center;
			font-size:1em;
			width:60%; 
			padding-top:0em; 
			padding-bottom:0em; 
			padding-right:0.5em; 
			/* background:green; */
			margin-bottom: 0em; 
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			justify-content: flex-start;
		}
	
		#contact-alm p{
			font-family: Century-Gothic;	
			font-size: 1.3em;
			/* background-color: #d0e0d1; */
		}

			
		#contact-alm h1 {
			font-size: 1.7em;
			width: 100%;
			margin: auto;
			padding: 0em 0em;
			/* background-color: red; */
			text-align: right;
			margin: .8em 0em 0em 0em;
		}
	
		#contact{
			text-align:center;
			font-size:1em;
			width:60%; 
			padding-top:0em; 
			padding-bottom:0em; 
			padding-right:0.5em; 
			/* background:green; */
			margin-bottom: 0em; 
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			justify-content: flex-start;
		}
	
		#contact p{
			font-family: Century-Gothic;	
			font-size: 1.3em;
			/* background-color: #d0e0d1; */
		}

			
		#contact h1 {
			font-size: 1.7em;
			width: 100%;
			margin: auto;
			padding: 0em 0em;
			/* background-color: red; */
			text-align: right;
			margin: .8em 0em 0em 0em;
		}
		
		.bnav {
			/* background-color: red; */
			display: none;
		}
	
		.bnav-phone {
			background-color: rgb(0, 0, 0);
			width: 100%;
			display: flex;
			flex-direction: row;
			align-items: center;
			margin: auto;
			margin-top: 0em;
			/* border-bottom: 1px solid #000; */
		}
	
		.bnav-phone h2 {
			/* background-color: rgb(192, 221, 26); */
			margin-top: 0em;
			border-bottom: 1px solid #000;
			width: 60%;
			margin-bottom: .6em;
			display: none;
		}
	
		#menu {
			background-color: rgb(0, 0, 0);
			width: 100%;
		}
	
		ul {
			background-color: rgb(0, 0, 0);
			/* border: 1px solid #67fc11; */
			width: 90%;
			display: flex;
			flex-direction: row;
			flex-wrap: nowrap;
			margin: auto;
			align-items: center;
			justify-content: space-between;
			padding: .5em 0em;
		}
	
		li {
			/* background-color: rgb(221, 25, 162); */
			text-align: center;
			display: flex;
			align-items: flex-start;
			justify-content: flex-start;
			font-size: 1em;
			margin: 0em 0em;
			border-right: 1px solid #ffffff;
			border-left: 1px solid #ffffff;
			/* border: 1px solid #000; */
		}
	
		li a {
			background-color: rgb(0, 0, 0);
			width: 100%;
			margin: 0em 0em;
			text-decoration: none;
			padding: .8em;
			color: white;
			border-radius: 0em;
			font-weight: normal;
		}
	
		li a:hover {
			background-color: rgb(255, 255, 255);
			width: 100%;
			margin: 0em 0em;
			text-decoration: none;
			padding: .8em;
			color: black;
			border-radius: 0em;
			font-weight: bold;
		}

	.subnav-burger {
		margin: auto;
		background: #4daa50;
		font-family: "Rubik Mono One", monospace;
		font-size: 1.2em;
		width: 100%;
		display: none;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		/* border-top: 1px solid #000;
		border-bottom: 1px solid #000; */
		margin-bottom: 1em;
	}

	#btn-menu {
		display: none;
	}

	.icon-menu {
		font-size: 1.5em;
		padding: 0.5em 0em;
		color: #ffffff;
		/* background: sienna; */
		font-family: "Rubik Mono One", monospace;
	} 

	.icon-cancel {
		color: rgb(255, 255, 255);
		font-size: 2.5em;
		/* background: turquoise; */
		margin-top: .5em;
		font-family: "Rubik Mono One", monospace;
	}

	.menu-burger {
		background: #4daa50;
		width: 100%;
		position: absolute;
		top: 0%;
		right: 0%;
		display: none;
		opacity: 100%;
		font-family: "Rubik Mono One", monospace;
	}

	.menu-burger ul {
		/* background-color: #2815d8; */
		display: flex;
		flex-direction: column;
	}

	.menu-burger li {
		font-size: 1em;
		padding: 7.5% 0%;
		width: 100%;
		font-family: Century-Gothic;	
		color: rgb(255, 255, 255);
		/* background: red; */
		margin-bottom: 1em;
	}

	.menu-burger a {
		text-decoration: none;
		/* background-color: pink; */
		width: 100%;
		border-bottom: 1px solid #000;

	}

	#btn-menu:checked ~ nav {
		display: block;
	}
			
		#banner {
			display: none;
			width: 100%;
		}
	
		#banner h1 {
			font-size: 2em;
			width: 100%;
			text-align: center;
			/* background-color: red; */
			position: absolute;
			top: 8em;
			left: 0;
			z-index: -99;
			display: none;
		}
	
		#esp {
			width: 90%;
			/* background-color: #63ad26; */
			margin: auto;
			margin-top: 1em;
			display: flex;
			flex-direction: row;
			align-items: flex-start;
			justify-content: space-between;
			flex-wrap: wrap;
			margin-bottom: 1em;
			background: url(/imagenes/productos/chatarra-industrial.webp); 
			background-size: 120%; 
			background-repeat: no-repeat;
		}
	
		#esp h2 {
			width: 100%;
			/* background-color: #63ad26; */
			margin: auto;
			margin-top: .5em;
			font-size: 1.8em;
			margin-bottom: 0em;
			color: #4daa50;
		}
	
		#esp h2+p {
			line-height: 2em;
			text-align: center;
			width: 90%;
			margin-bottom: 0em;
			font-size: 1em;
			display: block;
		}
		
		form {
			background-color: #222;
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 40%;
			margin: auto;
			margin-bottom: 1em;
			margin-top: 0em;
			padding-bottom: 1.5em;
			margin: 0em;
		}
							
		#esp .texto3 {
			text-align: center;
			width: 80%;
			margin-bottom: 1em;
			margin-top: 0.2em;
			font-size: 1.3em;
		}
							
		#esp .texto2 {
			text-align: center;
			width: 80%;
			margin-bottom: 1em;
			margin-top: 0.2em;
			font-size: 1em;
		}
		
		.azul {
			color: #4daa50;
			text-align: center;
			/* background-color: red; */
			line-height: 1em;
			margin: 1em 0em 0.5em 0em;
			font-size: 2em;
			width: 50%;
		}
		
		.azul2 {
			color: #4daa50;
			text-align: center;
			/* background-color: red; */
			line-height: 1em;
			margin: 1em 0em 0.5em 0em;
			font-size: 2em;
			width: 80%;
		}
	
		form .txtlbl {
			font-size: 1.2em;
			width: 70%;
			color: white;
			line-height: 1.4em;
			margin-bottom: 0em;
		}
	
		form .txtlbl2 {
			font-size: 1.2em;
			width: 70%;
			color: white;
			line-height: 1.4em;
			margin-bottom: 1em;
		}
	
		label {
			color: white;
			margin-bottom: 0em;
			font-size: 1.2em;
		}
	
		input {
			margin: 0em;
			height: 1.5em;
			width: 80%;
			text-align: center;
			font-size: 1em;
		}
	
		#boton {
			background-color: #4daa50;
			color: white;
			font-family: Century-Gothic;
			font-size: 1.4em;
			border-radius: 1.2em;
			margin-bottom: 0em;
			width: 35%;
			margin-top: 0em;
			height: 2.5em;
		}

		#boton:hover {
			cursor: pointer;
			background-color: #ffffff;
			color: #4daa50;
		}
	
		#boton2 {
			background-color: #4daa50;
			color: white;
			font-family: Century-Gothic;
			font-size: 1.4em;
			border-radius: 1.2em;
			margin-bottom: 1em;
			width: 35%;
			margin-top: 0.5em;
			height: 2.8em;
		}

		#boton2:hover {
			cursor: pointer;
			background-color: #ffffff;
			color: #4daa50;
		}

		.nota a {
			font-size: 1.2em;
			background-color: none;
			margin-bottom: 0em;
			/* background-color: red; */
			color: white;
		}
	
		.slideshow-container-abast {
		width: 100%;
		position: relative;
		margin: auto;
		margin-bottom: 0em;
		display: block;
		}
	
		/* Hide the images by default */
		.mySlides {
		display: none;
		margin: 0em;
		}
	
		/* Next & previous buttons */
		.prev, .next {
		cursor: pointer;
		position: absolute;
		top: 50%;
		width: auto;
		margin-top: -22px;
		padding: 16px;
		color: white;
		font-weight: bold;
		font-size: 18px;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
		}
	
		/* Position the "next button" to the right */
		.next {
		right: 0;
		border-radius: 3px 0 0 3px;
		}
	
		/* On hover, add a black background color with a little bit see-through */
		.prev:hover, .next:hover {
		background-color: rgba(0,0,0,0.8);
		}
	
		/* Caption text */
		.text {
		color: #f2f2f2;
		font-size: 15px;
		padding: 8px 12px;
		position: absolute;
		bottom: 8px;
		width: 100%;
		text-align: center;
		}
	
		/* Number text (1/3 etc) */
		.numbertext {
		color: #f2f2f2;
		font-size: 12px;
		padding: 8px 12px;
		position: absolute;
		top: 0;
		}
	
		/* Fading animation */
		.fade {
		animation-name: fade;
		animation-duration: 1.5s;
		}
	
		@keyframes fade {
		from {opacity: .4}
		to {opacity: 1}
		}
	
		.slick-slide {
			margin: 0px 20px;
		}
	
		.slick-slide img {
			width: 100%;
		}
	
		.slick-slider {
			position: relative;
			display: block;
			box-sizing: border-box;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
					user-select: none;
			-webkit-touch-callout: none;
			-khtml-user-select: none;
			-ms-touch-action: pan-y;
				touch-action: pan-y;
			-webkit-tap-highlight-color: transparent;
		}
	
		.slick-list {
			position: relative;
			display: block;
			overflow: hidden;
			margin: 0;
			padding: 0;
		}
	
		.slick-list:focus {
			outline: none;
		}
	
		.slick-list.dragging {
			cursor: pointer;
			cursor: hand;
		}
	
		.slick-slider .slick-track,
		.slick-slider .slick-list {
			-webkit-transform: translate3d(0, 0, 0);
			-moz-transform: translate3d(0, 0, 0);
				-ms-transform: translate3d(0, 0, 0);
				-o-transform: translate3d(0, 0, 0);
					transform: translate3d(0, 0, 0);
		}
	
		.slick-track {
			position: relative;
			top: 0;
			left: 0;
			display: block;
		}
	
		.slick-track:before,
		.slick-track:after {
			display: table;
			content: '';
		}
	
		.slick-track:after {
			clear: both;
		}
	
		.slick-loading .slick-track {
			visibility: hidden;
		}
	
		.slick-slide {
			display: none;
			float: left;
			height: 100%;
			min-height: 1px;
		}
	
		[dir='rtl'] .slick-slide {
			float: right;
		}
	
		.slick-slide img {
			display: block;
		}
	
		.slick-slide.slick-loading img {
			display: none;
		}
	
		.slick-slide.dragging img {
			pointer-events: none;
		}
	
		.slick-initialized .slick-slide {
			display: block;
		}
	
		.slick-loading .slick-slide {
			visibility: hidden;
		}
	
		.slick-vertical .slick-slide {
			display: block;
			height: auto;
			border: 1px solid transparent;
		}
	
		.slick-arrow.slick-hidden {
			display: none;
		}
	
		.container {
			/* background-color: rgb(255, 27, 27); */
			margin-top: 1em;
		}
	
		.container h2 {
			/* background-color: rgb(238, 190, 190); */
			font-size: 1.8em;
			margin-bottom: 0em;
			margin-top: 0em;
			color: #4daa50;
		}
	
		.slide img {
			width: 100%;
			/* background-color: #63ad26; */
		}

		
	#aceros {
		width: 100%;
		background: url(/img/plecas/acero-pleca.webp);
		background-size: 190%;
		background-repeat: no-repeat;
		margin-bottom: 0em;
		color: white;
	}

	#barra-aceros {
		background-color: rgb(255, 94, 0);
		height: 1em;
	}
	
	.in-aceros {
		/* border: 1px solid #ff0000; */
		width: 80%;
		margin: auto;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		align-items: center;
		padding: 1.5em 0em;
	}

	.in-aceros a p {
		background-color: rgb(255, 94, 0);
		padding: 1em;
		margin-bottom: 0em;
		border-radius: 1em;
		color: white;
		font-size: 1.3em;
	}

	.in-aceros a p:hover {
		background-color: rgb(255, 255, 255);
		padding: 1em;
		margin-bottom: 0em;
		border-radius: 1em;
		color: rgb(255, 94, 0);
	}

	.in-aceros a {
		text-decoration: none;
	}

	#aceros h4 {
		width: 50%;
		margin: auto;
		line-height: 1.3em;
		font-size: 1.5em;
	}	
		
	
		#pie {
			width:100%;
			background-color: #000;
			margin:0;
			padding:1em 0em;
			display: grid;
			gap: 1em;
		}
	
		.foot {
			width:40%;
			padding:1%;
			text-align:center;
			color:#fff;
			font-size: 1em;
			float:left;
			/* background-color: #da0b0b; */
			margin: auto;
			line-height: 1.5em;
		}
	
		.ft {
			padding:1%;
			float:left;
			/* background:#e41717; */
			color:#fff;
			font-size:1em;
			text-align:center;
			width: 70%;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: center;
			margin: auto;
		}
	
		.ft img{
			width: 20%;
		}

		.ft a {
			color:#fff;
			text-decoration:none;
			width: 30%;
		}

}

@media (min-width: 652px) and (max-width: 1280px) {

	#contenedor {
		width:100%;
		margin:auto;
		text-align:center;
		background-color: white;
		}

	
		header{
			width:100%;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-around;
			/* background:#da0e0e; */
			margin: auto;
		}
	
		#logo-foremex{
			width:35%;
			text-align:center;
			padding: 1em 0em;
			/* background-color: rgb(33, 44, 194); */
			display: flex;
			justify-content: center;
			align-items: center;
		}
	
		#logo-foremex img{
			width:90%;
			text-align:center;
			padding: 0em 0em;
		}

		#logo-foremex a { 
			/* background-color: rgb(201, 172, 172); */
			/* border: 1px solid #000; */
			width: 90%;
		}
	
		#logo-foremex img{
			width:100%;
			padding: 0em 0em;
			margin-bottom: 0em;
		}
	
		#logo-foremex-new {
			width:35%;
			text-align:center;
			padding: 1.5em 0em;
			/* background-color: rgb(33, 44, 194); */
			display: flex;
			justify-content: center;
			align-items: center;
		}
	
		#logo-foremex-new img{
			width:90%;
			text-align:center;
			padding: 0em 0em;
		}

		#logo-foremex-new a { 
			/* background-color: rgb(201, 172, 172); */
			/* border: 1px solid #000; */
			width: 90%;
		}
	
		#logo-foremex-new img{
			width:100%;
			padding: 0em 0em;
			margin-bottom: 0em;
		}
	
		#contact-alm{
			text-align:center;
			font-size:1em;
			width:60%; 
			padding-top:0em; 
			padding-bottom:0em; 
			padding-right:0.5em; 
			/* background:green; */
			margin-bottom: 0em; 
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			justify-content: flex-start;
		}
	
		#contact-alm p{
			font-family: Century-Gothic;	
			font-size: 1em;
			/* background-color: #d0e0d1; */
		}

			
		#contact-alm h1 {
			font-size: 1.2em;
			width: 100%;
			margin: auto;
			padding: 0em 0em;
			/* background-color: red; */
			text-align: right;
			margin: .8em 0em 0em 0em;
		}
		
	
		#contact{
			text-align:center;
			font-size:1em;
			width:60%; 
			padding-top:0em; 
			padding-bottom:0em; 
			padding-right:0.5em; 
			/* background:green; */
			margin-bottom: 0em; 
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			justify-content: flex-start;
		}
	
		#contact p{
			font-family: Century-Gothic;	
			font-size: 1em;
			/* background-color: #d0e0d1; */
		}

			
		#contact h1 {
			font-size: 1.2em;
			width: 100%;
			margin: auto;
			padding: 0em 0em;
			/* background-color: red; */
			text-align: right;
			margin: .8em 0em 0em 0em;
		}
		
		.bnav {
			/* background-color: red; */
			display: none;
		}
	
		.bnav-phone {
			background-color: rgb(0, 0, 0);
			width: 100%;
			display: flex;
			flex-direction: row;
			align-items: center;
			margin: auto;
			margin-top: 0em;
			/* border-bottom: 1px solid #000; */
		}
	
		.bnav-phone h2 {
			/* background-color: rgb(192, 221, 26); */
			margin-top: 0em;
			border-bottom: 1px solid #000;
			width: 60%;
			margin-bottom: .6em;
			display: none;
		}
	
		#menu {
			background-color: rgb(0, 0, 0);
			width: 100%;
		}
	
		ul {
			background-color: rgb(0, 0, 0);
			/* border: 1px solid #67fc11; */
			width: 90%;
			display: flex;
			flex-direction: row;
			flex-wrap: nowrap;
			margin: auto;
			align-items: center;
			justify-content: space-between;
			padding: .5em 0em;
		}
	
		li {
			/* background-color: rgb(221, 25, 162); */
			text-align: center;
			display: flex;
			align-items: flex-start;
			justify-content: flex-start;
			font-size: .6em;
			margin: 0em 0em;
			border-right: 1px solid #ffffff;
			border-left: 1px solid #ffffff;
			/* border: 1px solid #000; */
		}
	
		li a {
			background-color: rgb(0, 0, 0);
			width: 100%;
			margin: 0em 0em;
			text-decoration: none;
			padding: .8em;
			color: white;
			border-radius: 0em;
			font-weight: normal;
		}
	
		li a:hover {
			background-color: rgb(255, 255, 255);
			width: 100%;
			margin: 0em 0em;
			text-decoration: none;
			padding: .8em;
			color: black;
			border-radius: 0em;
			font-weight: bold;
		}

	.subnav-burger {
		margin: auto;
		background: #4daa50;
		font-family: "Rubik Mono One", monospace;
		font-size: 1.2em;
		width: 100%;
		display: none;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		/* border-top: 1px solid #000;
		border-bottom: 1px solid #000; */
		margin-bottom: 1em;
	}

	#btn-menu {
		display: none;
	}

	.icon-menu {
		font-size: 1.5em;
		padding: 0.5em 0em;
		color: #ffffff;
		/* background: sienna; */
		font-family: "Rubik Mono One", monospace;
	} 

	.icon-cancel {
		color: rgb(255, 255, 255);
		font-size: 2.5em;
		/* background: turquoise; */
		margin-top: .5em;
		font-family: "Rubik Mono One", monospace;
	}

	.menu-burger {
		background: #4daa50;
		width: 100%;
		position: absolute;
		top: 0%;
		right: 0%;
		display: none;
		opacity: 100%;
		font-family: "Rubik Mono One", monospace;
	}

	.menu-burger ul {
		/* background-color: #2815d8; */
		display: flex;
		flex-direction: column;
	}

	.menu-burger li {
		font-size: 1em;
		padding: 7.5% 0%;
		width: 100%;
		font-family: Century-Gothic;	
		color: rgb(255, 255, 255);
		/* background: red; */
		margin-bottom: 1em;
	}

	.menu-burger a {
		text-decoration: none;
		/* background-color: pink; */
		width: 100%;
		border-bottom: 1px solid #000;

	}

	#btn-menu:checked ~ nav {
		display: block;
	}
			
		#banner {
			display: none;
			width: 100%;
		}
	
		#banner h1 {
			font-size: 2em;
			width: 100%;
			text-align: center;
			/* background-color: red; */
			position: absolute;
			top: 8em;
			left: 0;
			z-index: -99;
			display: none;
		}
	
		#esp {
			width: 90%;
			/* background-color: #63ad26; */
			margin: auto;
			margin-top: 1em;
			display: flex;
			flex-direction: row;
			align-items: flex-start;
			justify-content: space-between;
			flex-wrap: wrap;
			margin-bottom: 1em;
			background: url(/imagenes/productos/chatarra-industrial.webp); 
			background-size: 140%; 
			background-repeat: no-repeat;
		}
	
		#esp h2 {
			width: 100%;
			/* background-color: #63ad26; */
			margin: auto;
			margin-top: .5em;
			font-size: 1.8em;
			margin-bottom: 0em;
			color: #4daa50;
		}
	
		#esp h2+p {
			line-height: 2em;
			text-align: center;
			width: 90%;
			margin-bottom: 0em;
			font-size: 1em;
			display: block;
		}
		
		form {
			background-color: #222;
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 40%;
			margin: auto;
			margin-bottom: 1em;
			margin-top: 0em;
			padding-bottom: 1.5em;
			margin: 0em;
		}
							
		#esp .texto3 {
			text-align: center;
			width: 80%;
			margin-bottom: 1em;
			margin-top: 0.2em;
			font-size: 1em;
		}
							
		#esp .texto2 {
			text-align: center;
			width: 80%;
			margin-bottom: 1em;
			margin-top: 0.2em;
			font-size: .8em;
		}
		
		.azul {
			color: #4daa50;
			text-align: center;
			/* background-color: red; */
			line-height: 1em;
			margin: 1em 0em 0.5em 0em;
			font-size: 1em;
			width: 80%;
		}
		
		.azul2 {
			color: #4daa50;
			text-align: center;
			/* background-color: red; */
			line-height: 1em;
			margin: 1em 0em 0.5em 0em;
			font-size: 1em;
			width: 80%;
		}
	
		form .txtlbl {
			font-size: .8em;
			width: 70%;
			color: white;
			line-height: 1.4em;
			margin-bottom: 0em;
		}
	
	
		form .txtlbl2 {
			font-size: .8em;
			width: 70%;
			color: white;
			line-height: 1.4em;
			margin-bottom: 1em;
		}
	
		label {
			color: white;
			margin-bottom: 0em;
			font-size: .8em;
		}
	
		input {
			margin: 0em;
			height: 1em;
			width: 80%;
			text-align: center;
		}
	
		#boton {
			background-color: #4daa50;
			color: white;
			font-family: Century-Gothic;
			font-size: 1em;
			border-radius: 1.2em;
			margin-bottom: 0em;
			width: 40%;
			margin-top: 0em;
			height: 3em;
		}

		#boton:hover {
			cursor: pointer;
		}
	
		#boton2 {
			background-color: #4daa50;
			color: white;
			font-family: Century-Gothic;
			font-size: 1em;
			border-radius: 1.2em;
			margin-bottom: 1em;
			width: 40%;
			margin-top: 0.5em;
			height: 3em;
		}

		#boton2:hover {
			cursor: pointer;
		}

		.nota a {
			font-size: .8em;
			background-color: none;
			margin-bottom: 0em;
			/* background-color: red; */
			color: white;
		}
	
		.slideshow-container-abast {
		width: 100%;
		position: relative;
		margin: auto;
		margin-bottom: 0em;
		display: none;
		}
	
		/* Hide the images by default */
		.mySlides {
		display: none;
		margin: 0em;
		}
	
		/* Next & previous buttons */
		.prev, .next {
		cursor: pointer;
		position: absolute;
		top: 50%;
		width: auto;
		margin-top: -22px;
		padding: 16px;
		color: white;
		font-weight: bold;
		font-size: 18px;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
		}
	
		/* Position the "next button" to the right */
		.next {
		right: 0;
		border-radius: 3px 0 0 3px;
		}
	
		/* On hover, add a black background color with a little bit see-through */
		.prev:hover, .next:hover {
		background-color: rgba(0,0,0,0.8);
		}
	
		/* Caption text */
		.text {
		color: #f2f2f2;
		font-size: 15px;
		padding: 8px 12px;
		position: absolute;
		bottom: 8px;
		width: 100%;
		text-align: center;
		}
	
		/* Number text (1/3 etc) */
		.numbertext {
		color: #f2f2f2;
		font-size: 12px;
		padding: 8px 12px;
		position: absolute;
		top: 0;
		}
	
		/* Fading animation */
		.fade {
		animation-name: fade;
		animation-duration: 1.5s;
		}
	
		@keyframes fade {
		from {opacity: .4}
		to {opacity: 1}
		}
	
		.slick-slide {
			margin: 0px 20px;
		}
	
		.slick-slide img {
			width: 100%;
		}
	
		.slick-slider {
			position: relative;
			display: block;
			box-sizing: border-box;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
					user-select: none;
			-webkit-touch-callout: none;
			-khtml-user-select: none;
			-ms-touch-action: pan-y;
				touch-action: pan-y;
			-webkit-tap-highlight-color: transparent;
		}
	
		.slick-list {
			position: relative;
			display: block;
			overflow: hidden;
			margin: 0;
			padding: 0;
		}
	
		.slick-list:focus {
			outline: none;
		}
	
		.slick-list.dragging {
			cursor: pointer;
			cursor: hand;
		}
	
		.slick-slider .slick-track,
		.slick-slider .slick-list {
			-webkit-transform: translate3d(0, 0, 0);
			-moz-transform: translate3d(0, 0, 0);
				-ms-transform: translate3d(0, 0, 0);
				-o-transform: translate3d(0, 0, 0);
					transform: translate3d(0, 0, 0);
		}
	
		.slick-track {
			position: relative;
			top: 0;
			left: 0;
			display: block;
		}
	
		.slick-track:before,
		.slick-track:after {
			display: table;
			content: '';
		}
	
		.slick-track:after {
			clear: both;
		}
	
		.slick-loading .slick-track {
			visibility: hidden;
		}
	
		.slick-slide {
			display: none;
			float: left;
			height: 100%;
			min-height: 1px;
		}
	
		[dir='rtl'] .slick-slide {
			float: right;
		}
	
		.slick-slide img {
			display: block;
		}
	
		.slick-slide.slick-loading img {
			display: none;
		}
	
		.slick-slide.dragging img {
			pointer-events: none;
		}
	
		.slick-initialized .slick-slide {
			display: block;
		}
	
		.slick-loading .slick-slide {
			visibility: hidden;
		}
	
		.slick-vertical .slick-slide {
			display: block;
			height: auto;
			border: 1px solid transparent;
		}
	
		.slick-arrow.slick-hidden {
			display: none;
		}
	
		.container {
			/* background-color: rgb(255, 27, 27); */
			margin-top: 1em;
		}
	
		.container h2 {
			/* background-color: rgb(238, 190, 190); */
			font-size: 1.8em;
			margin-bottom: 0em;
			margin-top: 0em;
			color: #4daa50;
		}
	
		.slide img {
			width: 100%;
			/* background-color: #63ad26; */
		}

		
	#aceros {
		width: 100%;
		background: url(/img/plecas/acero-pleca.webp);
		background-size: 190%;
		background-repeat: no-repeat;
		margin-bottom: 0em;
		color: white;
	}

	#barra-aceros {
		background-color: rgb(255, 94, 0);
		height: 1em;
	}
	
	.in-aceros {
		/* border: 1px solid #ff0000; */
		width: 80%;
		margin: auto;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		align-items: center;
		padding: 1.5em 0em;
	}

	.in-aceros a p {
		background-color: rgb(255, 94, 0);
		padding: 1em;
		margin-bottom: 0em;
		border-radius: 1em;
		color: white;
		font-size: 1.3em;
	}

	.in-aceros a p:hover {
		background-color: rgb(255, 255, 255);
		padding: 1em;
		margin-bottom: 0em;
		border-radius: 1em;
		color: rgb(255, 94, 0);
	}

	.in-aceros a {
		text-decoration: none;
	}

	#aceros h4 {
		width: 80%;
		margin: auto;
		line-height: 1.3em;
		font-size: 1.5em;
	}	
		
	
		#pie {
			width:100%;
			background-color: #000;
			margin:0;
			padding:1em 0em;
			display: grid;
			gap: 1em;
		}
	
		.foot {
			width:70%;
			padding:1%;
			text-align:center;
			color:#fff;
			font-size:.8em;
			float:left;
			/* background-color: #da0b0b; */
			margin: auto;
			line-height: 1.5em;
		}
	
		.ft {
			padding:1%;
			float:left;
			/* background:#e41717; */
			color:#fff;
			font-size:1em;
			text-align:center;
			width: 70%;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: center;
			margin: auto;
		}
	
		.ft img{
			width: 30%;
		}

		.ft a {
			color:#fff;
			text-decoration:none;
			width: 30%;
		}

}

@media (min-width: 360px) and (max-width: 651px) {

	#contenedor {
	width:100%;
	margin:auto;
	text-align:center;
	background-color: white;
	}


	header{
		width:100%;
		/* background:#60da0e; */
	}

	#logo-foremex{
		width:100%;
		text-align:center;
		padding: 1em 0em;
		/* background-color: red; */
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	#logo-foremex a { 
		/* background-color: rgb(201, 172, 172); */
		/* border: 1px solid #000; */
		width: 60%;
	}

	#logo-foremex img{
		width:100%;
		padding: 0em 0em;
	}

	#logo-foremex-new{
		width:100%;
		text-align:center;
		padding: 1em 0em;
		/* background-color: red; */
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	#logo-foremex-new a { 
		/* background-color: rgb(201, 172, 172); */
		/* border: 1px solid #000; */
		width: 60%;
	}

	#logo-foremex-new img{
		width:100%;
		padding: 0em 0em;
	}

	#contact-alm{
		text-align:center;
		font-size:1.5em;
		width:100%; 
		padding-top:1em; 
		padding-bottom:1em; 
		background:rgb(63, 63, 63);
		margin-bottom: 1em; 
		display: grid;
		gap: 1em;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
	}

	#contact-alm h1 {
		font-size: 1em;
		margin-bottom: 0em;
		width: 70%;
		margin: auto;
		padding: 0em 0em;
		display: none;
	}

	#contact-alm p{
		font-family: Century-Gothic;	
		font-size: 1em;
		/* background-color: #d0e0d1; */
		margin: 0em;
		color: white;
	}

	#contact{
		text-align:center;
		font-size:1.5em;
		width:100%; 
		padding-top:1em; 
		padding-bottom:1em; 
		background:rgb(138, 76, 25);
		margin-bottom: 1em; 
		display: grid;
		gap: 1em;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
	}

	#contact h1 {
		font-size: 1em;
		margin-bottom: 0em;
		width: 70%;
		margin: auto;
		padding: 0em 0em;
		display: none;
	}

	#contact p{
		font-family: Century-Gothic;	
		font-size: 1em;
		/* background-color: #d0e0d1; */
		margin: 0em;
		color: white;
	}

	#whattsapp {
		/* background-color: #4daa50; */
		padding: 0em;
		width: 60%;
		margin: auto;
		border-radius: 5em;
	}

	#whattsapp #button--whatsapp  {
		/* background-color: #4daa50; */
		text-decoration: none;
		display: none;
	}

	#whattsapp #button--whatsapp2  {
		/* background-color: #4daa50; */
		text-decoration: none;
		display: block;
	}

	#whattsapp p {
		background-color: #4daa50;
		color: white;
		padding: 1em;
		border-radius: 2em;
		font-size: .8em;
	}

	.bnav {
		/* background-color: red; */
		display: none;
	}

	.bnav-phone {
		/* background-color: red; */
		width: 95%;
		display: none;
		flex-direction: column;
		align-items: center;
		margin: auto;
		margin-top: .8em;
		/* border-bottom: 1px solid #000; */
	}

	.bnav-phone h2 {
		/* background-color: rgb(192, 221, 26); */
		margin-top: 0em;
		border-bottom: 1px solid #000;
		width: 60%;
		margin-bottom: .6em;
	}

	#menu {
		/* background-color: red; */
	}

	ul {
		/* background-color: rgb(56, 218, 16); */
		/* border: 0px solid #67fc11; */
		width: 100%;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		margin: auto;
		align-items: center;
		justify-content: space-around;
		padding: 0em 0em;
	}

	li {
		/* background-color: rgb(221, 25, 162); */
		width: 45%;
		text-align: center;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1em;
		margin: .5em 0em;
		font-weight: bold;
		/* border: 1px solid #000; */
	}

	li a {
		background-color: rgb(0, 0, 0);
		width: 100%;
		margin: 0em;
		text-decoration: none;
		padding: .5em;
		color: white;
		border-radius: .8em;
	}

.subnav-burger {
    margin: auto;
    background: #4daa50;
	font-family: "Rubik Mono One", monospace;
	font-size: 1.2em;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
	/* border-top: 1px solid #000;
	border-bottom: 1px solid #000; */
	margin-bottom: .5em;
}

#btn-menu {
    display: none;
}

.icon-menu {
    font-size: 1.5em;
    padding: 0.5em 0em;
	color: #ffffff;
	font-family: "Rubik Mono One", monospace;
    /* background: sienna; */
} 

.icon-cancel {
    color: rgb(255, 255, 255);
    font-size: 2.5em;
    /* background: turquoise; */
	/* margin: .5em 0em; */
	padding: .3em 0em;
	width: 100%;
	border-bottom: 5px solid #3c883f;
	font-family: "Rubik Mono One", monospace;
}

.menu-burger {
    background: #4daa50;
    width: 100%;
    position: absolute;
    top: 0%;
    right: 0%;
	display: none;
    opacity: 100%;
	font-family: "Rubik Mono One", monospace;
}

.menu-burger ul {
	/* background-color: #2815d8; */
	display: flex;
	flex-direction: column;
}

.menu-burger li {
    font-size: 1em;
    padding: 7.5% 0%;
    width: 100%;
	font-family: Century-Gothic;	
    color: rgb(255, 255, 255);
	/* background: red; */
	margin-bottom: 1em;
}

.menu-burger a {
    text-decoration: none;
	/* background-color: pink; */
	width: 100%;
	border-bottom: 1px solid #000;
}

#btn-menu:checked ~ nav {
    display: block;
}

	#banner {
		display: block;
		width: 100%;
	}

	#banner h1 {
		font-size: 2em;
		width: 100%;
		text-align: center;
		/* background-color: red; */
		position: absolute;
		top: 8em;
		left: 0;
		z-index: -99;
		display: none;
	}

	#esp {
		width: 90%;
		/* background-color: #63ad26; */
		margin: auto;
		margin-top: 2em;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-bottom: 1em;
		background: url(/imagenes/productos/chatarra-industrial.webp); 
		background-size: 100%; 
		display: flex;
		justify-content: center;
	}

	#call-me-2 {
		/* background-color: red; */
		width: 90%;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0em;
		border: 0px solid #000;
	}

	#esp h2 {
		width: 100%;
		/* background-color: #63ad26; */
		margin: auto;
		margin-top: .5em;
		font-size: 1.8em;
		margin-bottom: 0em;
		color: #4daa50;
	}

	#esp h2+p {
		line-height: 2em;
		text-align: center;
		width: 90%;
		margin-bottom: 0em;
		font-size: 1em;
		display: block;
	}
	
	form {
		background-color: #222;
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 90%;
		margin: auto;
		margin-bottom: 1em;
		margin-top: 0em;
		padding-bottom: 2em;
	}

	.azul {
		color: #4daa50;
		text-align: center;
		/* background-color: red; */
		line-height: 1.1em;
		margin: 1em 0em .5em 0em;
		font-size: 2.2em;
		width: 80%;
	}

	.azul2 {
		color: #4daa50;
		text-align: center;
		/* background-color: red; */
		line-height: 1.1em;
		margin: 1em 0em .5em 0em;
		font-size: 2.2em;
		width: 80%;
	}

	form .txtlbl {
		font-size: 1.3em;
		width: 80%;
		color: white;
		line-height: 1.2em;
		margin-bottom: .8em;
	}

	form .txtlbl2 {
		font-size: 1.3em;
		width: 80%;
		color: white;
		line-height: 1.2em;
		margin-bottom: .8em;
	}

	label {
		color: white;
		margin-bottom: 0em;
		font-size: 1.3em;
	}

	input {
		margin: 0em;
		height: 3em;
		width: 80%;
		text-align: center;
		font-size: 1em;
	}

	#esp .texto3 {
		text-align: center;
		width: 80%;
		height: 3em;
		margin-bottom: 1em;
		font-size: 1.3em;
	}
	
	#esp .texto2 {
		text-align: center;
		width: 80%;
		height: 3em;
		margin-bottom: 1em;
		font-size: 1em;
	}

	#boton {
		background-color: #4daa50;
		color: white;
		font-family: Century-Gothic;
		font-size: 1.3em;
		border-radius: 1.2em;
		margin-bottom: 1em;
		width: 50%;
		margin-top: 0em	;
	}

	#boton:hover {
		cursor: pointer;
	}

	#boton2 {
		background-color: #4daa50;
		color: white;
		font-family: Century-Gothic;
		font-size: 1.3em;
		border-radius: 1.2em;
		margin-bottom: 1em;
		width: 50%;
		margin-top: 0em	;
	}

	#boton2:hover {
		cursor: pointer;
	}

	.nota a {
		font-size: 1.3em;
		background-color: none;
		margin-bottom: 0em;
		/* background-color: red; */
		color: white;
	}

	* {box-sizing:border-box}

	.slideshow-container-abast {
	width: 100%;
	position: relative;
	margin: auto;
	margin-bottom: 0em;
	display: block;
	/* border: 10px solid #000; */
	height: 20em;
	overflow: hidden;
	display: none;

	}

	/* Hide the images by default */
	.mySlides {
	/* border: 1px solid #fc0606; */
	display: none;
	margin: 0em;
	width: 160%;
	height: 20em;
	}

	/* Next & previous buttons */
	.prev, .next {
	cursor: pointer;
	position: absolute;
	top: 50%;
	width: auto;
	margin-top: -22px;
	padding: 16px;
	color: white;
	font-weight: bold;
	font-size: 18px;
	transition: 0.6s ease;
	border-radius: 0 3px 3px 0;
	user-select: none;
	}

	/* Position the "next button" to the right */
	.next {
	right: 0;
	border-radius: 3px 0 0 3px;
	}

	/* On hover, add a black background color with a little bit see-through */
	.prev:hover, .next:hover {
	background-color: rgba(0,0,0,0.8);
	}

	/* Caption text */
	.text {
	color: #f2f2f2;
	font-size: 15px;
	padding: 8px 12px;
	position: absolute;
	bottom: 8px;
	width: 100%;
	text-align: center;
	}

	/* Number text (1/3 etc) */
	.numbertext {
	color: #f2f2f2;
	font-size: 12px;
	padding: 8px 12px;
	position: absolute;
	top: 0;
	}

	/* Fading animation */
	.fade {
	animation-name: fade;
	animation-duration: 1.5s;
	}

	@keyframes fade {
	from {opacity: .4}
	to {opacity: 1}
	}


	.slide img {
		width: 130%;
		/* background-color: #63ad26; */
	}

	#aceros {
		width: 100%;
		background: url(/img/plecas/acero-pleca.webp);
		background-size: 200%;
		background-repeat: no-repeat;
		margin-bottom: 0em;
		color: white;
	}

	#barra-aceros {
		background-color: rgb(255, 94, 0);
		height: 1em;
	}
	
	.in-aceros {
		/* border: 1px solid #ff0000; */
		width: 80%;
		margin: auto;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
		align-items: center;
		padding: 1em 0em;
	}

	.in-aceros a p {
		background-color: rgb(255, 94, 0);
		padding: 1em;
		margin-bottom: 0em;
		border-radius: 1em;
		color: white;
		font-size: 1em;
	}

	.in-aceros a {
		text-decoration: none;
	}

	#aceros h4 {
		width: 100%;
		margin: auto;
		line-height: 1.3em;
		font-size: 1em;
	}

	#pie{
		width:100%;
		background-color: #000;
		margin:0em;
		padding:1em 0em;
		display: grid;
		gap: 1em;
	}

	.foot{
		width:70%;
		padding:1%;
		text-align:center;
		color:#fff;
		font-size:.9em;
		float:left;
		background-color: #000;
		margin: auto;
		line-height: 1.4em;
	}

	.ft{
		padding:1%;
		float:left;
		/* background:#e41717; */
		color:#fff;
		font-size:0.8em;
		text-align:center;
		width: 70%;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		margin: auto;
	}

	.ft img{
		width: 40%;
	}
	.ft a{
		color:#fff;
		text-decoration:none;
		width: 30%;
	}

}
