.opciones-menu{padding-top:122px;}

.title-representacion{text-align:center; text-transform:uppercase; font-family:teko; font-size:40px;}

.left-menu{float:left; width:40%;}

.right-menu{float:right;}

.red{	
background:rgba(0, 0, 0, 0) linear-gradient(to right, #45484d 0%, red 100%) repeat scroll 0 0;
}



.bg-menu-color, .bg-menu-color-small{
    width: 100%;
	position:absolute;
	top:160px;
	right:0;
	z-index:4;
}



.bg-black{
    width: 100%;
	background:rgba(0, 0, 0, 0.79) none repeat scroll 0 0;
	position:relative;
	right:0;
	top:0 !important;
}


header.header-black{
	background:url(../images/bg-header-ptos.png) repeat white center;
    width: 100%;
	position:relative;
	z-index:4;
	top:0;
}



.bg-menu-color-small{
	display:none;	
	position:absolute;
	min-height:100%;
	z-index:110;
	top:0;
	left:0;
	background:#1a1b1c;
}


.menu-container{
	float:right;
}

.menu-container-flotante{
	float:left;
	width:74%;
}

.menu-container img{width:25%;}

.logo-proveedor-servicio{
	text-align:left;	
}


.content-header-producto img{width:20%; float:left;}



.logo-menu img{width:100%;}

.containers{
    margin-left: auto;
    margin-right: auto;
	position:relative;
}


#nav span {
    display: block;
}
#nav, #nav ul {
    list-style: none outside none;
    margin: 0;
    padding: 0;
	text-align:left;
}
#nav {
/*    background-color: #F5F5F5;*/
    float: left;
    position: relative;
}
#nav ul.subs {
    /*box-shadow:3px 4px 15px white;*/
    color: #333333;
	color:white;
    display: none;
    left: 0;
    position:fixed;
    top:0;
    width:100%;
	z-index:2;
	text-align:center;
	box-shadow:0 7px 11px 0 #4a4a4a;
	height:634px;
	overflow-y:auto;
	/*padding-bottom: 10px;	*/

	
    -moz-transition: all 300ms ease-in-out 0s;
    -ms-transition: all 300ms ease-in-out 0s;
    -o-transition: all 300ms ease-in-out 0s;
    -webkit-transition: all 300ms ease-in-out 0s;
    transition: all 300ms ease-in-out 0s;
	
}

#Servicios{
	background:url(../images/bg-footer.jpg) no-repeat scroll center center / cover; 	
}

#Productos{
	background:url(../images/banner/capital-safety.png) no-repeat scroll center center / cover; 	
}

.box-service{
	height:290px;	
	position:relative;
}

.btn-ver-servicio{	
	margin:0 auto;
	padding:5px 0px;
}

.btn-ver-servicio a{
	color:white;
	display:inline-block !important;
	text-transform:none;
	border:2px solid red;	
	background:red;	
	padding:6px 0px;
	left:24%;
	bottom:15px;
	width:150px;
	position:absolute;
}

.btn-ver-servicio a:hover{
	background:#444;
}


#nav > li {
    padding: 0 15px;
    display:inline-block;
    text-align: center;
	border-right:1px solid white;
    -moz-transition: all 300ms ease-in-out 0s;
    -ms-transition: all 300ms ease-in-out 0s;
    -o-transition: all 300ms ease-in-out 0s;
    -webkit-transition: all 300ms ease-in-out 0s;
    transition: all 300ms ease-in-out 0s;
	/*border-right:1px dotted white;*/
}

.header-menu-flotante #nav > li{margin-right:0px;}

#nav > li:first-child{}

#nav li a {
    display: block;
    text-decoration: none;
    -moz-transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;
    -ms-transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;
    -o-transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;
    -webkit-transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;
    transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;
    white-space: normal;
	
	font-size:12px;
}

@font-face {
font-family: "Roboto Condensed";
src: url(fonts/roboto/Roboto-Condensed.ttf);
}

#nav > li > a {
    color: white;
    display:block;
    font-size: 14px;
	font-weight:bold;
    line-height: 30px;
    text-transform: uppercase;
    text-shadow:2px 3px 1px black;

}


.header-menu-flotante  #nav > li > a {
    color: black;
    display:block;
    font-size: 13px;
    line-height: 37px;
    text-transform: uppercase;
	border:1px solid black;

	font-weight:normal;
	font-family:"Roboto Condensed";
	letter-spacing:2px;
}


#Servicios,
#Servicios-small, 
#Productos, 
#Productos-small{
	
/*background:url(../images/servicios/bg-servicio.gif) !important;*/
}

#close-menu-small{

	float:right; 
	padding:0px 10px; 
	color:white;
	font-weight:normal;	
	cursor:pointer;
}

#close-menu-small span{
	font-size:45px;	
	color:white;
}

#close-menu-small span:hover{
	color:red;
}


.btn-close-menu{

	float:right; 
	padding:0px 10px; 
	color:white;
	font-weight:normal;	
	cursor:pointer;
}

.btn-close-menu span{
	font-size:45px;	
	color:white;
}

.btn-close-menu span:hover{
	color:red;
}


#nav > li:hover > a, #nav > a:hover {
    color: #FFFFFF;
	/*border:1px solid #d90000;	*/
	border-bottom:2px solid red;
}

.menu-flotante  #nav > li:hover{
	background-color:none !important;
	color:white;
}


.menu-flotante #nav > li > a {
    color:#333;
	color: white;
	color: #818F9B;
    display:block;
    font-size: 14px;
    line-height: 30px;
    /*padding: 0 15px;*/
    text-transform: uppercase;
	border:none;

}

.bg-black #nav > li > a {
    color: white;
    display:block;
    font-size: 15px;
	font-weight:normal;
    line-height: 37px;
    padding: 0 15px;
    text-transform: capitalize;
	border:none;

}




#nav li.active > a {
	background:none;	
	border-bottom:2px solid red;
}


.header-menu-flotante #nav li.active > a {
	background:none;	
	border-bottom:2px solid red;
	color: white;
}

.header-menu-flotante #nav li:hover{background:none;}

.active{position:relative;}

/*.active span{
	background:url(../images/hover-menu.png) no-repeat;	
	position:absolute;
	left:40%;
	top:31px;
	width:32px;
	height:15px;
}
*/

.columna{
		/*border-bottom:2px solid orange;*/
		padding-bottom:10px;
		margin-left:22px;
}

.list-center{
	text-align:center;
	margin:0 auto;	
}


/* submenu */
#nav li:hover ul.subs {
    display: none;
}
#nav ul.subs  > li {

    padding:8px 50px;
    width: 31%;
}

#nav ul.subs .columna > li a {
    color: #888;
	color:white;
    line-height: 20px;
}

#nav ul.subs .columna > li a.title-proveedor{	border:none; font-size:16px;}


.qs-title-sub-menu{
    background: #5b5b5b url("../images/head.png") repeat-x scroll left bottom;
    color: white;
    font-weight: bold;
    margin-bottom:5px;
    padding: 10px 2px;
    text-align: left;
    text-transform: uppercase;
    width: 100%;
}


.qs-title-item{
    /*background:url("../images/head.png") repeat-x scroll left bottom;*/	
    color: white;
    font-weight: bold;
    padding: 10px 2px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}

.list-categ{ 
background:rgba(0, 0, 0, 0) linear-gradient(to right, #45484d 0%, red 100%) repeat scroll 0 0;
}

/*.qs-title-item img{width:50%;}*/
.qs-title-item img{width:auto;}


#nav ul.subs > li a {
    color: #898d90;
	color:white;
    line-height: 20px;
	border-bottom:1px dotted white;
}



#nav ul.subs .columna > li:hover{/*background:#f6f6f6; */}

#nav ul.subs  > li:hover{/*background:#f6f6f6;*/}


#nav ul.subs .columna > li, #nav ul.subs  > li{
	background:rgba(0, 0, 0, 0) linear-gradient(to right, #45484d 0%, #000000 100%) repeat scroll 0 0; 
	transition:all 0.5s ease 0s;
	
    display: inline-block;
	vertical-align:top;	
	width:24.5%;
	float:left;
	/*margin:2px 27px;*/
	margin: 5px 0px;
}

#nav ul.subs .columna > li:hover a.title-proveedor{	 color: #428bca;}
 
#nav ul.subs .columna ul li a:hover, #nav ul.subs > li a:hover {
    color: red;
}

.ico-contact{
	font-size: 6em;
    padding-bottom: 30px;
    margin-top: 80px;	
}

.contact-ac{
	display: inline-flex !important;
	float: none !important;
}



#nav ul.subs .columna > li > a {
    margin: 10px 0;
    text-transform: uppercase;
	padding:6px 0;
	color:white;
	font-size:16px;
	text-align:left;
	font-family:Arial, Helvetica, sans-serif;
}
#nav ul.subs > li > a {
    font-size: 1.3em;
    margin: 10px 0;
    text-transform: uppercase;
	padding:6px 0;
}


#nav ul.subs .columna > li li {
    float: none;
	border-bottom:1px dotted #bbb;
    padding-left: 8px;
    -moz-transition: padding 150ms ease-out 0s;
    -ms-transition: padding 150ms ease-out 0s;
    -o-transition: padding 150ms ease-out 0s;
    -webkit-transition: padding 150ms ease-out 0s;
    transition: padding 150ms ease-out 0s;
}
#nav ul.subs > li li {
    float: none;
    padding-left: 8px;
    -moz-transition: padding 150ms ease-out 0s;
    -ms-transition: padding 150ms ease-out 0s;
    -o-transition: padding 150ms ease-out 0s;
    -webkit-transition: padding 150ms ease-out 0s;
    transition: padding 150ms ease-out 0s;
}

#nav ul.subs  .columna > li li:hover {
    padding-left: 15px;
}
#nav ul.subs  > li li:hover {
    padding-left: 15px;
}


.header-title{
	padding:15px 0 35px;
	color:white;
	font-size:14px;
	text-align:left;
}



/*****************************************MENU FLOTANTE***************************/


.header-menu-flotante{

	/*border-bottom:1px solid #d90000;
	box-shadow:0 1px 6px #d90000;
	background:white;*/
	position:fixed;
	top:0;
	z-index:101;
	padding:0px 0;
	
	/*background:rgba(0, 0, 0, 0.78) none repeat scroll 0 0;	
	background:#333;
	background:radial-gradient(ellipse at center center , #6a6a6f 0%, #393c3e 100%);
	box-shadow:0 0 10px rgba(0, 0, 0, 0.1);*/
	box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.75);
	background: #2b3740;
	background: linear-gradient(to bottom, #2b3740 1%, #4a5d6d 100%);
}

.logo-flotante{
	border-right:1px solid #eee;
	width:25%; 
	float:left;	
	padding:13px 10px 9px 0px;
}

.header-menu-flotante #nav > li{
	border-right:1px solid white;	
	padding: 0 15px;
}

.header-menu-flotante #nav > li:last-child{border-right:none;}

.header-menu-flotante #nav > li >a:hover{
	background:none;
	color:white;
	border-bottom:2px solid red;	
}


@media(max-width:1600px){/*cuando la ventana tenga un ancho maximo de 800px para abajo*/
	.bg-menu-color{top:140px;}
}


@media(max-width:1300px){/*cuando la ventana tenga un ancho maximo de 800px para abajo*/
	
	.contenedor-search, .menu-container{padding-top:7px;}

	.header-menu-flotante #nav > li{margin-right:0px; 	padding: 0 12px;}

	.menu-flotante #nav > li > a{font-size:13px; text-shadow: none;}
}

.menu-flotante #nav > li > a{text-shadow: none;}

@media(max-width:930px){/*cuando la ventana tenga un ancho maximo de 800px para abajo*/
	
	
	.bg-menu-color{top:110px;}

	.menu-flotante #nav > li > a{padding:0 5px;}	

.contenedor-search, .menu-container{padding-top:0px;}	
}

@media(max-width:999px){/*cuando la ventana tenga un ancho maximo de 800px para abajo*/

	.bg-menu-color-small{width:100%;  }

	#nav > li{width:100%; border-right:none; }
	
	#nav ul.subs{position:relative; width:100%; height:auto;}
	
	#nav li:hover ul.subs {display: none;}


	#nav ul.subs > li{width:100%; padding:0px; text-align:left;}
	.header-title{display:none;}
	
	#nav > li > a{
		padding:0; 
		border:none; 
		border-bottom:1px dotted white; 
		border-radius:0; 
		color:white; 
		font-weight:normal;
	}	
	
	.menu-flotante #nav > li > a{padding:0 10px;}

	#nav{width:100%; }
	
	.menu-container{float:none;}
}
@media(max-width:600px){/*cuando la ventana tenga un ancho maximo de 600px para abajo*/

	.bg-menu-color-small{width:100%; }
	
	#nav > li{width:100%; border-right:none; margin-right:3px;}
	
	#nav ul.subs{position:relative; width:100%; height:auto;}
	
	#nav li:hover ul.subs {display: none;}
	
	#nav ul.subs > li{width:100%; padding:0px; text-align:left;}
	
	.header-title{display:none;}

	#nav > li > a{padding:0; border:none; border-bottom:1px dotted white; border-radius:0;}
	
	.menu-flotante #nav > li > a{padding:0 10px;}
}

@media(max-width:450px){/*cuando la ventana tenga un ancho maximo de 600px para abajo*/

	.bg-menu-color-small{width:100%;}

	#nav > li{width:100%; border-right:none; border-bottom:1px dotted black;}
	
	.menu-flotante #nav > li > a{padding:0 10px;}

}