/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=DM+Sans|Open+Sans&display=swap');

body{
	margin:0;
	background:#F4F4F4 url(graf/bg1.jpg) no-repeat scroll 0 0;
	background-size: cover;
	font:normal 12px 'Open Sans', sans-serif;
	color:#4A4A4A;
}

a img{
	border:none;
}

a{
	text-decoration:none;
	color:#4A3486;
}

a:hover{
	color:#003049;
}

/*strong{
	font:bold 10px 'Open Sans', sans-serif;
}
*/

h1{
	background:url(graf/items-h1.gif) no-repeat 0 5px;
	color:#4A3486;
	font:bold 18px 'DM Sans', sans-serif;
	padding:2px 10px 15px 20px;
	margin:10px 14px;
}

h2{
	color:#003249;
	font:bold 15px 'DM Sans', sans-serif;
	text-align:center;
	padding:0;
	margin:10px 0 20px 0;
}

h4{
	color:#000;
	font:bold 13px 'DM Sans', sans-serif;
	padding:4px;
	margin:30px 0 10px 0;
	border-bottom:1px solid #E8E8E8;
}
h5{
	margin:20px 0;
	padding:3px 10px;
	background-color:#901F1F;
}
h5 a{
	color:#FFF;
	font:bold 10px 'DM Sans', sans-serif;
}
h5 a:hover{
	color:#D99C44;
}


/* Estructura */

#top{
	width:978px;
	margin:0 auto;
	background:#fff url(graf/bg.jpg) scroll no-repeat 0 -10px;
	padding-top:20px;
	box-shadow: 0px 5px 8px #000
}

.menu-top { float:right; padding-right:40px }

.menu-top > ul { list-style-type:none; margin:0; padding:0 }

.menu-top > ul li { float:left; display:inline-block }

.menu-top > ul li a { color:#ededed; font-size:12px }

.menu-top > ul li + li { border-left: 1px dotted #000; margin-left: 20px; padding-left: 20px; }

#contenidos{
	width:917px;
	margin:0 auto;
	padding:0 27px 10px 34px;
	background:url(graf/bg-contenidos.jpg) no-repeat #FFF;
	border-bottom:15px solid #2E9C9B;
	box-shadow: 0px 5px 8px #000
}

#modulo-principal{
	width:630px;
	float:right;
	display:block;
	padding-top:35px;
}

#modulo-derecha{
	float:left;
	margin:0;
	width:245px;
	display:block;
	text-align:center;
}

#modulo-destacados{
	border-bottom:5px solid #009C9B;
	border-left:1px solid #E5E5E5;
	border-right:1px solid #E5E5E5;
	border-top:1px solid #E5E5E5;
	display:block;
	background:url(graf/bg-novedades-home.gif) no-repeat;
	margin:0 0 40px 0;
	border-radius: 10px
}

.clear { clear:both }

#pie{
	margin:55px 0 0 0;
	text-align:center;
	display:block;
	background-color: #003049;
	padding: 15px 10px;
	color: #fff;
	border-radius: 5px;
}
#pie p {
	margin: 15px;
	border-top: 1px dotted #999;
	padding-top: 10px;
}
#pie a{
	margin:0 20px;
	color:#fff;
}

/* Clases */

.banner-contacto {
	margin-bottom:20px
}

.reset{
	clear:both;
	margin:0;
	font-size:1px;
}

.login{
	/*background:url(graf/bg-login.gif) no-repeat;*/
	width:201px;
	padding:25px 17px;
	display:block;
	margin:20px auto 0 auto;
	border:1px solid #009C9B;
}
.login p a{
	color:#7F7F7F;
	margin:5px 0 !important;
}

.titulos-centrados{
	display:block;
	text-align:center;
	margin:30px 0 10px 0;
	letter-spacing:5px;
	font:bold 9px 'Open Sans', sans-serif;
}

.modulo-partners{
	display:block;
	margin:0 auto;
	width:233px;
	border:1px solid #E8E8E8;
	text-align:center;
	padding:8px 0;
}

.modulo-destacados-columna{
	text-align:center;
	padding:7px 10px;
	width:188px;
	display:block;
	float:left;
}
.modulo-destacados-columna p{
	margin:15px 0 !important;
	font:13px 'Open Sans', sans-serif;
}
.modulo-destacados-columna p a{
	color:#000000;
}
.modulo-destacados-columna p a:hover{
	color:#999999;
}

.modulo-noticias{
	/*background:url(graf/bg-noticias-home.gif) no-repeat;*/
	display:block;
	margin:12px 0 8px 0;
}
.modulo-noticias span {
	font-family: 'Open Sans', sans-serif !important;
}
.modulo-noticias a{
	font:14px 'Open Sans', sans-serif;
}
.modulo-noticias img{
	border:1px solid #E2E2E2;
	float:left;
	margin:0 16px 4px 0;
	border-radius: 5px
}
.modulo-noticias p{
	margin:15px 0;	
	font-size: 13px
}
.modulo-noticias h3{
	margin:8px 0 8px 0;
	padding-top:12px;
}
.modulo-noticias h3 a{
	color:#4A4A4A;
}
.modulo-noticias h3 a:hover{
	color:#003049;
}

.divisor{
	background:url(graf/bg-separador-puntos.gif) repeat-x;
	height:9px;
	margin:3px 0;
	display:block;
}

.listados{
	list-style:none;
	margin:25px 25px 0 25px;
	padding:0;
}
.listados li{
	margin:10px 0;
	padding:5px 0 4px 18px;
	background:url(graf/items.gif) 4px 12px no-repeat;
	border-bottom:1px dashed #E4E4E4; 
}

.listados-simple{
	list-style:none;
	margin:25px 25px 0 25px;
	padding:0;
}
.listados-simple li{
	margin:2px 0;
	padding:5px 0 4px 18px;
	background:url(graf/items.gif) 4px 9px no-repeat;
}

.contenidos{
	line-height:18px;
}

.prods-rubros{
	margin:35px 10px;
}
.prods-rubros h5{
	color:#FFF;
	font:bold 12px 'Open Sans', sans-serif;
	padding:8px 5px;
	margin:0 0 0 180px;
	background-color:#009C9B;
}
.prods-rubros ul{
	list-style:none;
	margin:0 35px;
	padding:0;
}
.prods-rubros ul li{
	margin:30px 10px 0 10px;
	padding:0;
}
.prods-rubros ul li ul{
	margin:10px 0 40px 190px;
	padding-top:15px;
}
.prods-rubros ul li ul li{
	margin:5px 0 !important;
	border-bottom:1px solid #F2F2F2;
	padding:0 0 3px 14px;
	background:url(graf/items-listas.gif) no-repeat 5px 5px;
}
.prods-rubros ul li img{
	margin:10px 20px 10px 0;
	float:left;
}
.prods-rubros ul li a{
	color:#7F7F7F;
	font:bold 12px 'Open Sans', sans-serif;
}
.prods-rubros ul li a:hover{
	color:#003049;
}

.paginado{
	text-align:center;
	border:1px solid #EDEDED;
	padding:3px;
}
.paginado a{
	margin:0 8px;
}

.contactar{
	background:url(graf/icono-mail.gif) no-repeat;
	padding:0 0 3px 35px;
	margin:25px 0;
	display:block;
}
.descargas{
	background:url(graf/items-listas.gif) 5px 5px no-repeat;
	padding:2px 0 3px 15px;
	margin:10px 0 0 0;
	display:block;
}
.descargas a{
	color:#000;
}

/*** set the width and height to match your images **/

#slideshow {
    position:relative;
    height:80px;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:9;
}


.galerias{
/*	border-bottom:3px solid #CC3300;*/
	border-top:3px solid #CC3300;
	display:block;
}
.galerias ul{
	list-style:none;
	margin:0 0 20px 15px;
	padding:0;
}
.galerias ul li{
	width:190px;
	text-align:center;
	float:left;
}
.galerias ul li p{
	margin:0;
}
.galerias ul li img{
	margin:10px 0;
	border:1px solid #CCCCCC;
}

.popup{
	width:660px;
	padding:10px 0;
	text-align:center;
	margin:0 auto;
}

.imagenes-centradas{
	display:block;
}
.imagenes-centradas img{
	margin:10px 14px 0 0;
	border:2px solid #9F9F9F;
}


/* Formularios */

form{
	margin:10px;
	text-align:right;
	color:#7F7F7F;
}

label{
	display:block;
	margin:10px 0;
}

.input-login{
	width:100px;
	border:1px solid #D9D9D9;
	margin:0 0 0 8px;
	border-radius: 3px;
	background-color: #ddd
}
.input-enviar{
	border:none;
	background-color:#4A3486;
	margin:8px 20px 15px 0;
	padding:10px 16px;
	color:#FFFFFF;
	border-radius: 5px
}


.form-contacto{
	text-align:right;
	width:350px;
	padding:25px 0;
	margin:25px auto;
}
.form_contacto_inputs{
	width:170px;
	background-color:#FFF;
	border:1px solid #E1E1E1;
	vertical-align:middle;
	margin:2px 0 2px 14px;
	padding:8px 5px;
	vertical-align:middle;
	font:normal 11px 'Open Sans', sans-serif;
	color:#4A4A4A;
	border-radius: 3px
}

.form-contacto input[type="checkbox"]{
	margin:0 10px !important;
	border:1px solid #CCCCCC;
	background-color:#FFF;
}

.logo { padding:0 0 15px 20px; float:left }

ul.nav { list-style-type: none; margin: 0px; padding: 0px; width:100%; display:block; overflow:hidden }
.nav li { display: inline-block; float: left; }
.nav li a { display: block; min-width: 107px; height: 30px; text-align: center; line-height: 30px; color: rgb(255, 255, 255); background: #003249 none repeat scroll 0% 0%; text-decoration: none; text-transform: uppercase; text-shadow: 0px 2px 3px #000 }
.nav li:hover a { background: #009C9B none repeat scroll 0% 0%; transition:0.4s }
.nav li:hover ul a { background: rgb(243, 243, 243) none repeat scroll 0% 0%; color: rgb(47, 48, 54); height: 40px; line-height: 40px; }
.nav li:hover ul a:hover { background: rgb(25, 197, 137) none repeat scroll 0% 0%; color: rgb(255, 255, 255); }
.nav li ul { display: none; }
.nav li ul li { display: block; float: none; }
.nav li ul li a { width: auto; min-width: 100px; padding: 0px 20px; }
.nav ul li a:hover + .hidden, .hidden:hover { display: block; }
.last { min-width:200px;  }
.last > a { cursor:default; background:transparent url(graf/bg-nav.png) scroll 0 bottom no-repeat !important; }

.show-menu { cursor: pointer; text-decoration: none; color: rgb(255, 255, 255); background: #003049 none repeat scroll 0% 0%; text-align: center; padding: 10px 0px; margin-bottom:0px; display: none; }
.show-menu:hover { background-color:#009C9B } 
input[type="checkbox"] { display: none; }
input[type="checkbox"]:checked ~ #menu { display: block; }


@media only screen and (min-width: 768px) and (max-width: 995px) {
	
	#top { width: 768px; }
		
	#contenidos { width: 748px; margin:0 auto; padding:10px }
	
		#modulo-principal { width:500px; margin:0 auto }

		.last { display:none !important }


	/*.grid_3 { width: 240px; }
	.grid_4 { width: 280px; }
	.grid_5 { width: 300px; }
	.grid_7 { width: 500px; }
	.grid_12 { width: 748px; }*/
	
}

@media only screen and (max-width: 767px) {

	/*.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { width: 420px; }*/
	
	#top  { width:550px }
	
	#contenidos, #modulo-principal { width: 550px; margin: 0 auto }
	
	
  ul.nav { display: none; }
  .nav li { margin-bottom: 1px; width:100% }
  .nav ul li, .nav li a { width: 100%; }
  .show-menu { display: block; }
  .last { display:none !important }

  .menu-top > ul li a {
  	color: #848484
  }

  .menu-top > ul li:first-child {
	padding-left: 10px;
	}

}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	#top  { width: 520px; }
	
	#contenidos, #modulo-principal { width: 500px; margin:0 auto }
	
	#modulo-principal, #modulo-derecha { float:none; width:100% }
	
	#pie a { margin: 0px 10px }
	
	#contenidos { padding:10px }
	
	/*.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 
	{ width: 460px; }*/
	
}

@media only screen and (max-width: 480px) {
	
			/*.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { 
			width: 260px; }*/
			
			#top  { width:300px }
			
			#contenidos, #modulo-principal { width: 280px; margin:0 auto }

				#pie a { margin: 0px 5px }
				
				.logo { float:none; padding:0px 0px 20px 0px; text-align: center  }
				
				.menu-top { display: block; float: none; padding-right:0 }
				
				  .last { display:none !important }
				  
				  .form-contacto { padding:0px; width:300px }
				  
				  #contenidos { padding:10px }
				  
				  #modulo-derecha { float:none; width:100%; margin-top:20px }
				  
				  .prods-rubros ul li img { width: 100%; height: auto; float: none; margin-bottom: 10px; }

				  .prods-rubros h5, .prods-rubros ul li ul { margin: 0px; }

				  .form-contacto { width: 280px }

}

