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


/* ********************************* */
/* *********** BASICS ************** */
/* ********************************* */

body{
	font-family:'Open Sans', sans-serif;
	color:#525258;
}

.full-width{
	width:100%;
}

section{
	padding-top:120px;
}

section.home_style1{
	padding-top:0;
}

section.background_style1{
	background:url(../img/img_background_section.jpg) no-repeat center 0;
}

.img-responsive.w100 {
    width: 100%;
}

.video{ background-color:#CCCCCC; width:100%; height:400px;}

hr{ margin:15px 0 -5px;}

/* ********************************* */
/* *********** LINKS ************** */
/* ********************************* */

a{ color:#525258;}
a:hover{ color:#CCC; text-decoration:none;}

/* ********************************* */
/* ********** DL-DT-DD ************* */
/* ********************************* */

dl{ display:block; margin-top:15px;}
dt{	font-size: 1.29em; margin:15px 0 2px 0;}
dd{ padding-left:12px; margin-bottom:2px; background:url(../img/cercle.svg) no-repeat 2px 8px;}


/* ********************************* */
/* ********** ACORDIO ************** */
/* ********************************* */

.panel {
    border: none;
    border-radius: none;
    box-shadow: none;
	margin-top:-15px;
}

.panel dt{ border-bottom:1px solid #CCC; margin-bottom:10px; padding:6px 0 8px 18px; background:url(../img/cross.svg) no-repeat 4px 16px;}
.panel dd{ background:url(../img/cercle.svg) no-repeat 5px 8px; padding-left:15px;}


/* ********************************* */
/* *********** BOTONS ************** */
/* ********************************* */

.btn {
    border: 4px solid transparent;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    padding: 10px 20px;
}
.btn-sm{
	font-size: 13px;
    font-weight: 600;
    padding: 3px 7px;
}

.btn:hover{
	color:#999;
}

.btn-default_positive{
    background-color:#FFF;
    border-color: #525258;
    color: #525258;
}

.btn-default_positive:hover{
    border-color: #999;
}

.btn-default_negative{
    background-color:#525258;
    border-color: #FFF;
    color: #FFF;
}


/* ********************************* */
/* *********** TEXT ************** */
/* ********************************* */


h1{ 
	font-size:3.14em;
	font-weight:300;	
}

h2, p.style2{ 
	font-size:1.4em;
	line-height:1.2em;
	color:#333;
}

h2.style2{ 
	font-size:1.86em !important;
	line-height:2em;
	font-weight:400;
	color:#525258;
	margin-top:0;
}

h2.style2.big{
	font-size:2.7em !important;
	font-weight:300;
	line-height:1em;
}

h2.style2.small{
	font-size:1.86em !important;
	font-weight:300;
	line-height:1em;
}

h2.style2.big.line{
	border-bottom:1px solid #CCC;
	padding-bottom:15px;
	margin-bottom:30px;
}


h2.style3 {
    font-size: 44px;
    font-weight: 300;
    margin-bottom: 60px;
}

h2.style3.color {
    color: #ffffff;
}


h3{ 
	font-size:1.29em;
	font-weight:700;
}

h3.style2{
	font-size:1.4em;
	line-height:1.2em;
	color:#999;
	font-weight:400;
}

h3.style2.small{
	font-size:1.1em;
	margin-top:0;
}


h3.style2.color{
	color:#525258;
	margin-top:0;
}

h3.style3{
	font-size:1.4em;
	line-height:1.2em;
	color:#999;
	font-weight:300;
	border-bottom:1px solid #CCC;
	padding-bottom:5px;
	margin-bottom:15px;

}

h4{ 
	border-bottom:2px solid #CCC;
	padding-bottom:10px;
	font-size:1em;
	font-weight:700;
}

h4.style2{
	border-bottom:none;
}

p.copyright{
	font-size:0.8em;
	font-style:italic;
	color:#999999;
}

/*
h1:before, h2:before, h3:before, h4:before, h5:before{ font-size:10px; font-weight:100; color:#FFF; background-color:#000000; margin:0; padding:0;}
h1:before{content: "h1";}
h2:before{content: "h2"; background-color:#C6F;}
h3:before{content: "h3"; background-color:#C30;}
h4:before{content: "h4"; background-color:#33FF00;}
h5:before{content: "h5";}*/


/* ********************************* */
/* *********** HEADER ************** */
/* ********************************* */

.menu{
	position:relative;
}

.navbar{
	margin-bottom:0;
	position:absolute;
	top:0;
	left:0;
	z-index:10000;
	background-color:#FFF !important;
}

.navbar-default {
    border:none;
	background:none;
}

.navbar-header{
	margin-left:15px;
	margin-top:18px;
	margin-bottom:15px;
}

.navbar-collapse {
    border-top: none;
}

#menu_principal ul{ 
	padding-left:0; 
	padding-bottom:30px; 
	list-style:none;
}

#menu_principal ul li{
	border-bottom:1px solid #CCC;
}

#menu_principal ul li a{
	padding:15px 0; 
	display:inline-block;
	width:100%;
	height:100%;
	color:#525258;
	position:relative;
}

#menu_principal ul li:hover, #menu_principal ul li a:hover{
	color:#999;
	text-decoration:none;
}

#menu_principal ul li.select a{
	color:#999;
}

/* SUBMENUS */

li.mp_submenu_1 > a::after, li.mp_submenu_2 > a::after {
	content: "";
	width: 0;
	height: 0;
	border-left: 8px solid transparent !important;
	border-right: 8px solid transparent !important;
	border-top: 8px solid #CCC !important;
	position:absolute;
	top:22px;
	right:15px;
}

li.mp_submenu_1 ul, li.mp_submenu_2 ul{
	border-top:4px solid #CCC;
	padding:0 0 0 15px !important;
	background-color:#f5f5f5;
	/*display:none;*/
}

li.mp_submenu_2 ul{
	background-color:#e8e8e8;
}

li.open > ul{
	border-bottom:4px solid #CCC;
	display:block !important;
}

li.open > a{
	font-weight:600;
}

li.mp_submenu_1 ul li:last-child, li.mp_submenu_2 ul li:last-child{
	border-bottom:none !important;
}



/* Medium devices Desktops (Desktops, 992px and up) */
@media (min-width: 992px) { 

	.navbar{
		background-color:transparent !important;
	}
	.navbar-header{
		margin-left:0;
		background-color:#CC6;
	}

	#logo{ 
		padding:10px; 
		border:1px solid #CCC;
		background-color:#FFF; 
		text-align:center; 
		width:250px; 
		height:70px; 
		display:inline-block;
	}
	
	#menu_principal{
		position:relative;
	}
	
	#menu_principal ul li{
		display:inline-block;
		padding:0;
		border:1px solid #CCC;
		background-color:#FFF; 
		text-align:center;
		position:absolute;
		z-index:2000;
	}
	
	#menu_principal ul li a{
		padding:11px 5px;
		display:block;
		height:100%;
	}
	
	#menu_principal > ul > li:nth-of-type(4) a, #menu_principal ul li:nth-of-type(5) a{
		padding:2px;
	}
	
	#menu_principal > ul > li:nth-of-type(1){
		top:46px;
		left:238px;
		width:130px; 
		height:42px;
	}
	#menu_principal > ul > li:nth-of-type(2){
		top:46px;
		left:371px;
		width:130px; 
		height:42px;
	}
	#menu_principal > ul > li:nth-of-type(3){
		top:46px;
		left:504px;
		width:130px; 
		height:42px;
	}
	#menu_principal > ul > li:nth-of-type(4){
		top:18px;
		left:238px;
		width:396px; 
		height:25px;
	}
	#menu_principal > ul > li:nth-of-type(5){
		top:18px;
		right:-15px;
		width:130px; 
		height:25px;
	}
	#menu_principal > ul > li:nth-of-type(6){
		top:46px;
		right:-15px;
		width:130px; 
		height:42px;
	}
	#menu_principal > ul > li:nth-of-type(7){
		top:0px;
		right:18%;
		width:63px; 
		height:46px;
		border:0;
		background-color:transparent;
	}
	#menu_principal > ul > li:nth-of-type(7) a{
		background:url(../img/ico_shop.svg) no-repeat 0 0;
		text-indent:-99999px;
	}
	
	
	/* SUBMENUS */

	li.open > ul{
		border-bottom:none;
	}
	
	li.open > a{
		font-weight:400;
	}
	
	li.mp_submenu_1 > a::after, li.mp_submenu_2 > a::after {
		display:none;
	}
		
	/* Submenú 1 */		
	
	li.mp_submenu_1 ul{
		border-top:none;
		background-color:transparent;
		margin-left:-1px;
		padding:4px 0 0 0 !important;
		display: none;
		opacity: 0;
		visibility: hidden;
	}
	
	li.mp_submenu_1 ul li {
		width:180px;
		position:relative !important;
		border-bottom:none !important;
	}
	
	li.mp_submenu_1 ul li:last-child{
		border-bottom:1px solid #CCC !important;
	}
	
	li.mp_submenu_1 ul li a:hover {
		background-color:#525258;
	}
	
	li.mp_submenu_1 ul li a:hover{
		color:#FFFFFF !important;
	}
	
	#menu_principal > ul > li:hover > ul, #menu_principal > ul > li > a:hover > ul {
	  display: block;
	  opacity: 1;
	  visibility: visible;
	}
	
	/* Submenú 2 */
		
	li.mp_submenu_2 ul{
		border-top:none;
		background-color:transparent;
		margin-left:-1px;
		padding:0 !important;
		display: none;
		opacity: 0;
		visibility: hidden;
		position:absolute;
		top:-1px;
		left:180px;
	}
	
	li.mp_submenu_2 ul li{
		width:240px;
		position:relative;
		border-bottom:none;
	}
'	
	li.mp_submenu_2 ul li a:hover {
		background-color:#525258;
	}
	
	li.mp_submenu_2 ul li a:hover{
		color:#FFFFFF !important;
	}
	
	#menu_principal > ul > li > ul > li:hover > ul, #menu_principal > ul > li > ul > li > a:hover > ul {
	  display: block;
	  opacity: 1;
	  visibility: visible;
	}

}



/* ********************************* */
/* *********** FOOTER ************** */
/* ********************************* */



/* Footer 1 */

footer.footer_menu1{ margin-top:60px;}
footer.footer_menu1 nav ul{ padding:0 0 10px; margin-bottom:0; border-bottom:5px solid #525258;}
footer.footer_menu1 nav ul li{ padding:10px 0; margin-bottom:5px;}
footer.footer_menu1 nav ul li a{ background-color:#525258; color:#FFFFFF; padding:10px 15px; margin:0;}
footer.footer_menu1 nav ul li a:hover{ color:#CCCCCC; text-decoration:none;}

/* Footer Xarxes */

footer.footer_xarxes{ margin-top:25px;}
footer.footer_xarxes .col-xs-12 .row div{ margin-bottom:10px;}
.footer_followus{ font-weight:700;}
.footer_followus img{ margin-right:5px; margin-top:4px;}


/* Footer 2 */

footer.footer_menu2{ margin-top:15px;}
footer.footer_menu2 nav ul{ padding:20px 0 10px; margin:0; border-bottom:5px solid #525258; border-top:5px solid #525258;}
footer.footer_menu2 nav ul li{ padding:0; margin-bottom:0; margin-right:-3px; margin-bottom:5px;}
footer.footer_menu2 nav ul li a{ padding:0 15px; margin:0; border-right:2px solid #525258; color:#525258;}
footer.footer_menu2 nav ul li a:hover{ color:#CCCCCC; text-decoration:none;}
footer.footer_menu2 nav ul li:first-child a{ padding-left:0;}
footer.footer_menu2 nav ul li:last-child a{ border-right:none;}

/* Footer Copyright */

footer.footer_copy{ margin-top:25px; margin-bottom:60px;}



/* ********************************* */
/* *** FER LES TAULES RESPONSIVE *** */
/* ********************************* */
/* 
Max width before this PARTICULAR table gets nasty
This query will take effect for any screen smaller than 760px
and also iPads specifically.
*/
@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border-bottom: 3px solid #eee !important; }
	tr:first-child { border-top: 10px solid #eee; }
	
	td { 
		/* Behave  like a "row" */
		border: none !important;
		border-bottom: 1px solid #eee !important; 
		position: relative;
		padding-left: 30% !important;
	}
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 25%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	td:nth-child(3){
		text-align:left !important;
		padding-top:20px;
	}
	
	/*
	Label the data
	*/
	td:nth-of-type(1):before { content: "Item"; font-size:11px; color:#CCCCCC; font-weight:600;}
	td:nth-of-type(2):before { content: "Description"; font-size:11px; color:#CCCCCC; font-weight:600;}
	td:nth-of-type(3):before { content: "Quantity"; font-size:11px; color:#CCCCCC; font-weight:600; text-align:left;}
}