@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: din;
  src: url('../fonts/DINOffc-Reg.eot'); /* IE9 Compat Modes */
  src: url('../fonts/DINOffc-Reg.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/DINOffc-Reg.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight:normal;   
}
@font-face {
  font-family: din;
  src: url('../fonts/DINOffc-Bold.eot'); /* IE9 Compat Modes */
  src: url('../fonts/DINOffc-Bold.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/DINOffc-Bold.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight:bold;   
}
@font-face {
  font-family: din;
  src: url('../fonts/DINOffc-Light.eot'); /* IE9 Compat Modes */
  src: url('../fonts/DINOffc-Light.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/DINOffc-Light.ttf')  format('truetype'); /* Safari, Android, iOS */
  font-weight:light;   
}

body{
	padding:0;
	margin:0;
	font-family:din;
	font-size:14px;
	font-weight:normal;
}
.container{
	width:1200px;
	margin:0 auto;
	height:auto;	
}
#menu{
	position:fixed;
	top:0;
	left:0;
	right:0;
	width:100%;
	background-color:#fff;
	border-top:5px solid #3e4095;
	border-bottom:5px solid #ffcf30;
	height:100px;
	box-sizing:border-box;
	z-index:1;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
}
.logo{
	float:left;
}
.frase{
	padding:0 25px;
	border-left:1px solid #939598;
	margin:25px 0 25px 20px;
	float:left;
	width:330px;
	color:#414042;
	font-family:din;
	font-size:14px;
	font-weight:normal;
	box-sizing:border-box;
	text-align:center;
}
.inner-menu{
	list-style:none;
	padding:0;
	margin:25px 0 0 0;
	float:right;
	color:#939598;
	font-size:20px;
}
.inner-menu li{
	padding:0 20px;
	display:inline-block;
	border-left:1px solid #939598;
}
.inner-menu li a.active{
	color:#ffcf30 !important;
	background-color:#3e4095;
}
.inner-menu li a:link{
	text-decoration:none;
	color:#939598;
	display:block;
	padding:5px 10px;
}
.inner-menu li a:visited{
	color:#939598;
}
.inner-menu li a:hover{
	color:#ffcf30;
}
.inner-menu li a:active{
	color:#ffcf30;
	background-color:#3e4095;
}
.intro{
	width:100%;
	height:742px;
	background-color:#000;
	position:relative;
	z-index:0;
	border-bottom:5px solid #3e4095;
	text-align:center;
}
.productos{
	width:100%;
	height:820px;
	background-color:#fff;
	position:relative;
	z-index:0;
	border-bottom:5px solid #3e4095;
	text-align:center;
}
.nosotros{
	width:100%;
	height:370px;
	background-color:#ffcf30;
	position:relative;
	z-index:0;
	border-bottom:5px solid #3e4095;
	text-align:center;
}
.encuentrenos{
	width:100%;
	height:650px;
	background-color:#fff;
	position:relative;
	z-index:0;
	text-align:center;
}
#footer{
	width:100%;
	height:50px;
	background-color:#3e4095;
	color:#ffcf30;
	position:relative;
	z-index:0;
	text-align:center;
	font-size:20px;
}
#footer p{
	margin:13px 0 0 0;
	padding:0;
	float:left;
	width:100%;
}
#boton-flotante{
	position:fixed;
	z-index:2;
	width:150px;
	height:150px;
	bottom:10px;
	right:0;
	background:url(../img/btn.png) no-repeat center center;
}

/*Productos*/
.head-productos{
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:1;
	background-color:#fff;
	border-bottom:5px solid #ccc;
	height:auto;
	box-sizing:content-box;
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
}
.head-productos .logo{
	margin-top:5px;
}
.head-productos p{
	float:right;
	font-size:20px;
	font-weight:normal;
	color:#414042;
	margin: 10px 0 0 0;
	width:60%;
	text-align:right;
}
.head-productos h1{
	float:right;
	font-size:50px;
	line-height:50px;
	font-weight:bold;
	margin:0 0 10px 0;
	width:60%;
	text-align:right;
}
.catalogo{
	margin:150px auto 20px auto;
}

/*Aseo*/
.aseo.head-productos{
	border-bottom:5px solid #3e4095;
}
.aseo.head-productos h1{
	color:#3e4095;
}
/*Elementos de Aseo*/
.elementos-de-aseo.head-productos{
	border-bottom:5px solid #ff4919;
}
.elementos-de-aseo.head-productos h1{
	color:#ff4919;
}
/*Cafetería*/
.cafeteria.head-productos{
	border-bottom:5px solid #f2a300;
}
.cafeteria.head-productos h1{
	color:#f2a300;
}
/*Papelería*/
.papeleria.head-productos{
	border-bottom:5px solid #04b3a4;
}
.papeleria.head-productos h1{
	color:#04b3a4;
}