/* especiall logo */
*{ box-sizing: border-box; }









/* portadaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa */

#retardantes-portada{ width: 100%;background: url(img/sellos-cortafuego/portada.jpg);
					 background-size: cover;
					 background-position: center center;
	                 position: relative;}


.retardantes-portada-titulo{ width: 100%;
						    height: 650px;
						    position: relative;
						     }


.retardantes-portada-titulo-contenido{
									width: 100%;					
									position: absolute;
									top: 75%;
									left: 50%;
									transform:translateX(-50%) translateY(-75%);
									text-align: center;
									
									 }

.retardantes-portada-titulo-contenido h1{ font-family: "renogare";
									   font-size: 70px;
									   color:#111;
									   margin: 0;
									   line-height: 70px;
									   position: relative;letter-spacing: -1px;
									   	width:290px;
									   	margin: 0 auto;
									   
									   z-index: 2
									    }
.retardantes-portada-titulo-contenido h1 img{ width: 100%;
											 max-width: 90px;
											 position: absolute;
											 top: -60px;
											 right: -25px;
											 z-index: -1 }



.retardantes-portada-titulo-contenido h2{ font-family: "mangalregular",sans-serif;
									   font-size: 25px;
									   color:#111;
									   margin: 0;
									   position: relative;
									   letter-spacing: -1px;
									   line-height: 18px;
									   z-index: 2 }







/*guiaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa */
#retardantes-guia{ width: 100%;
				   margin: 50px 0px 20px 0px;
				   padding: 0px 15px 0px 15px}

.retardantes-guia{ width: 100%;
				   padding: 10px 0px 10px 0px;
				   position: relative;}

.retardantes-guia ul{ padding: 0;
					  margin: 0;
					  display: flex;}

.retardantes-guia ul li{ list-style: none; }

.retardantes-guia ul li a{text-decoration: none;
						  padding: 0px 5px 0px 5px;
						  display: block;
					      font-family: "Montserrat";
					      color: #444;
					      font-size: 13px}
					    

.resaltar{ color: #222;font-weight: 600 }					    

.retardantes-guia ul li a:hover{ color: #ff0000 }




/*btnn griddddddddddd*/
.suministros-grid{  width: 60px;
					height: 30px;
					background-color: #efefef;
					border-radius: 10px;
					position: absolute;
					top: 0;
					right: 0;
					cursor: pointer;
					z-index: 6}

/*iconoo grid*/
.suministros-grid-icono{ width: 30px;
						 float: left;
						 height: 30px;
						 text-align: center;}

.suministros-grid-icono span{ line-height: 30px;
							  color: #222}					 

/*iconoo numeroo*/
.suministros-grid-texto{ width: 30px;
						 float: left;
						 height: 30px;
						 text-align: center;
						 position: relative;
						}

.suministros-grid-texto li{ position: absolute;
	                        width: 30px;
	                        height: 30px;
	                        font-family: "Montserrat";
							font-size: 12px;
						    color: #222;
						    list-style: none;
						    background-color:#efefef;
						    padding: 7px 0px 0px 0px;
						    text-align: center;}

.suministros-grid-texto li span{ font-size: 10px;}

/*menuu gridd*/
.suministros-grid-menu{ width: 60px;
						height: 60px;
						background-color: #222;
						position: absolute;
						top: 35px;
						left: 0}

.suministros-grid-menu-btn{ width: 100%;
							height: 30px;
							text-align: center;
						    border-bottom: 1px solid#ddd;
						    color: #fff;
						    cursor: pointer;}

.suministros-grid-menu-btn:nth-child(2){border-bottom: 0px solid#ddd}

.suministros-grid-menu-btn:hover{ background-color: #ff0000;
								  color: #fff }
						    
.suministros-grid-menu-btn p{ font-family: "Montserrat";
							  font-size: 12px;
							  margin: 0;
							  line-height:30px }


/*griddd22222*/
#grid2{ display: none; }













/* retardantessssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss */

#retardantes{ width: 100%;
		 padding:0px 20px 100px 20px;}


/* contenidoooooooooooooooooooooooooooooooooooooooooo */


/* sector111111111111111111111111 contenido de buscador y menu verticall */
.retardantes-sector1{ width: 32%;
				      float: left;
				      padding: 20px;
				      background-color: #efefef}


/* buscadorrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr*/
.retardantes-sector1-buscador{ width: 100%;
	                      position: relative;
	                      height: 60px;}



/* menuuu verticallllllllllllllllllllllllllll */	
.retardantes-sector1-menu { width: 100% ;
	                    float: left;}

.retardantes-sector1-menu-titulo{ width: 100%;
							 background-color: #ff0000;
							 padding: 10px 0px 10px 10px;
							 margin: 0px 0px 5px 0px}
/* tituloooo */
.retardantes-sector1-menu-titulo h1{ font-family: "Montserrat";
								font-size: 16px;
								color: #fff;
								margin: 0;
								font-weight: 600}
/* icono chevron*/
.retardantes-sector1-menu-titulo h1 span{ color: #fff;font-size: 17px;
	                                 margin: 0px 0px 0px 10px }													   

/* listaaaaaaaaa de botoness ul */
.retardantes-sector1-menu-lista { margin: 0;
							 padding: 0; }

.retardantes-sector1-menu-lista li { list-style: none; }

.retardantes-sector1-menu-lista li a{ display: block;
								 width: 100%;
								 padding: 8px 0px 8px 12px;
								 font-family: "Montserrat";
								 font-size: 14px;
								 text-decoration: none;
								 background-color:#fff;
								 color: #222;
								 border: 1px solid#efefef;
								 letter-spacing: -0.2px}

.retardantes-sector1-menu-lista li a span{ background: #ff0000;
									  padding: 3px;
									  font-family: sans-serif;
									  color: #fff}


.retardantes-sector1-menu-lista li a:hover{ border:1px solid#ff0000; }








/* sectorrrrr 222222222222222222222222222222222222222222222222222222222 */
.retardantes-sector2{ width: 68%;
				 float: left;
				 padding: 0px 0px 20px 20px;}

/*titulooooooooooooooo*/
.retardantes-sector2-titulo{ width: 100%;
						padding:10px 0px 10px 0px;
						border-bottom: 2px solid#ddd;
						margin: 0px 0px 20px 0px}

.retardantes-sector2-titulo h1{  font-family: "Montserrat";
							font-size: 15px;
							color: #222;
							margin: 0; }

/*wrappp gridddddddddd*/
.retardantes-sector2-grid{ display: grid;
					  grid-gap: 20px;
					  grid-template-columns: repeat(3,1fr)}


.retardantes-sector2-grid a{ display: block;
						text-decoration: none;
						text-align: center;}

.retardantes-sector2-grid a img{ width: 100%;
							max-width: 300px}

.retardantes-sector2-grid a h1{  font-family: "Montserrat";
							font-size: 13px;
							color: #222;
							margin: 0;
							padding: 10px 0px 0px 0px}

.retardantes-sector2-grid a h2{  font-family: "Montserrat";
							font-size: 13px;
							color: #555;
							margin: 0;
							padding: 0px 0px 10px 0px}

.retardantes-sector2-grid a:hover{ background-color: #efefef }