/* CSS reset */
html,body {margin:0; padding:0;}
body {font-size: 62.5%; font-family: arial;background: #152678;}
ul, li {margin:0; padding: 0; list-style: none;}
form {margin: 0; padding: 0;}

h1, h2, h3, h4 {font-family: "Trebuchet MS", verdana, sans-serif; font-weight: bold;}
h1 {font-size: 16px;}
h2 {font-size: 14px;}

.hidden {display: none;}
legend, form, fieldset {margin: 0; padding: 0;}
.error {text-align: center; color: #600; font-size: 120%;margin: 1em 0;}
.ok {padding: 0.5em; text-align: center; color: #090; font-size: 120%;margin: 1em 0;background: #efe;}

/* "Layout" general de la pàgina */
#wrap {width:987px;margin:0 auto;background: #162983 url(../img/bg_linia.jpg) repeat-y center center;font-size: 1.2em;}
#container {width: 931px; margin: 0 auto;background: #fff;}
#cap{height:135px;background:url(../img/cap.jpg) top no-repeat;}
#main {position: relative; overflow:hidden; _display: inline-block; background: transparent url(../img/bg_productes.jpg) top left repeat-y;}
#nav {float: left;width: 190px;}
#content {float: left;width: 741px;}

#main h1 {padding: 0 15px; background: #868789;margin: 0;color: #fff;}

/* Secció de banners */
#banners {position:relative;clear:left;overflow:hidden;padding: 1.5em 0;_display: inline-block;background: #162A83;}
#banners div {width:210px;height:60px;border:1px solid #fff;float:left;margin-left: 16px;}

/* Peu de la pàgina */
#peu {background: #162A83 url(../img/peu.jpg) bottom left no-repeat;
line-height: 2.5em; text-align: right; color: #fff; font-size: 1.5em;padding: 1em 1em 0 1em;}
#peu a {color:#fff;text-decoration:none;}

/* Menu superior */
#menu {background:#000;}
#menu ul {text-align: center; padding: 0.4em 0;}
#menu li {display:inline;margin-left: -3px;}
#menu a {font-size: 13px; color:#fff; text-decoration:none; border-right:1px solid #fff;
padding: 0.3em 1.25em;font-weight: bold; border-bottom: 1px solid #000;}
#menu a.ultim {border:none;}
#menu a:hover {background:#162983;border-bottom: 1px solid #162983;}

/* Menu superior español*/
#menu_es {background:#000;}
#menu_es ul {text-align: center; padding: 0.4em 0;}
#menu_es li {display:inline;margin-left: -3px;}
#menu_es a {font-size: 13px; color:#fff; text-decoration:none; border-right:1px solid #fff;
padding: 0.3em 0.8em;font-weight: bold; border-bottom: 1px solid #000;}
#menu_es a.ultim {border:none;}
#menu_es a:hover {background:#162983;border-bottom: 1px solid #162983;}

/* Submenu (categories) */
#submenu a {padding:3px 20px 2px 15px; text-decoration:none; color:#fff; font-weight:bold;
display:block; font-size:14px; text-transform:uppercase;}
#submenu ul li {background: #45484D url(../img/fons-categories2.jpg) top left repeat-x; padding: 10px 0;
border-bottom: 1px solid #eee;}
#submenu ul li li {background: transparent;padding: 0;border: none;}
#submenu ul ul a{padding-left:30px;font-size:1.2em;}
#submenu ul ul ul a{padding-left:45px;font-size:1.1em;}
#submenu a.current, #submenu a:hover {color: #FFEC04;}

/*#submenu.plegable .arrow {display: block; float: left; width: 13px; height: 13px; background: transparent url(../img/menu/fletxes.gif) top left no-repeat; text-decoration: none;padding: 0; margin: 4px 5px 0 0;}
#submenu.plegable .down {background-position: 0 -13px;}
#submenu.plegable ul ul .arrow {margin-left: 20px;}*/
#submenu.plegable .arrow {background: transparent url(../img/menu/fletxes.gif) top left no-repeat;
display: inline;padding: 0;padding-left: 13px;}
#submenu.plegable ul ul .arrow {margin-left: 20px;}
#submenu.plegable .down {background-position: 0 -13px;}

/* Carret lateral */
#carret {display: block; background:url(../img/bg_carret2.jpg) bottom left no-repeat;text-decoration:none; color:#fff; font-weight:bold;border-bottom:1px solid #eee;font-size: 14px;}
#carret em {text-transform:uppercase; font-style: normal; background: #45484D url(../img/fons-categories2.jpg) top left repeat-x;display: block;padding: 10px 20px 5px 15px;}
#carret span {display: block;padding: 1em 20px;}


/* Paginador */
.pager {display:block;text-align: center;line-height: 27px;clear: both;}
.pager h3 {display:inline;font-size: 1em;}
.pager ul, .pager li {display:inline;}
.pager a,.pager a:visited {font-size: 1.1em;text-decoration: none; font-weight: bold;padding: 0 3px;color: #999;}
.pager a.selected, .pager a.selected:visited {color: #000;}
.pager a:hover {color: #000;text-decoration: underline;}

.ocasio .pager h3 {display: none;}
.ocasio .pager a {border: 1px solid #777; background: #eee;padding: 2px 6px;margin: 0 3px;}
.ocasio .pager {border: none !important;float: right;margin: 0;}
.ocasio h2 {margin-top: 0.1em !important;}
.ocasio .pager a {color: #999;}
.ocasio .pager a:hover {color: #00a;text-decoration: none;}
.ocasio div {overflow:hidden;}
.ocasio img {float:left;margin-right: 6px;border: none;}
#imatgegran img {float: none;display:inline;}
#imatgegran {text-align: center;margin: 1em 0;}

/* Productes ... "layout" de la taula */
.productes {margin: 1px; _margin:0; text-align: center;border-collapse: collapse;}
.productes td {vertical-align: top; border: 1px solid #ddd; border-bottom: none;width:20%;padding: 0 5px;}
.productes .preus td {border-bottom: 1px solid #ddd;border-top: none;padding-bottom: 5px;}
.productes tr td.filler {border: none;width: auto;}

#p_ofertes .productes td, #p_temporada .productes td {width: 154px;}

/* Productes ... colors, etc */
.productes h2 {text-align: left;margin: 0.5em 0;font-size: 1.3em;}
.productes a {color: #000;text-decoration: none;}
.productes a:hover {text-decoration: underline;}
.productes img {border: none;}

/* Productes ... tema preus i carrets */
.productes .preus label {display: block; color: #ccc; text-align: left;}
.productes .preus del,  .productes .preus span {display: block; float: left; width: 55px; line-height: 22px;margin-right: 2px;}

.productes .preus del {background: #ccc;}
.productes .preus span {background: #000;color: #fff;}
.productes .preus .no_comprable del {width: 66px;}
.productes .preus .no_comprable span {width: 67px;margin: 0;}
.productes .preus .oferta span {background: #E2001A;}

.productes .preus a {background:transparent url(../img/bto_carret.jpg) no-repeat scroll center bottom;
float:left; height:22px; text-indent:-1000em; width:22px; }

/* Detall producte */
.producte {overflow: hidden;margin-bottom: 28px;display: inline-block;}
.producte .image {float:left;width:325px;text-align: center;}
.producte .image img{margin: 2em auto 1em auto;}
.producte .info  {float:left;width:416px;font-size: 1.2em;}
#main .producte h1 {padding: 0; margin: 1em 1em 1em 0;background: none; color: #E2001A; line-height: 0.8em;font-size: 24px;}
#main .producte h2 {border-bottom: 1px solid #000; font-size: 16px;margin: 1em 1em 1em 0;}
.producte p {margin: 1em 1em 1em 0;}
.stock_yes, .stock_no {text-align: right;font-size: 0.8em;padding-right: 1em;}
.stock_yes {color: #090;}
.stock_no {color: #E2001A;}


.producte .selects p {margin: 0 0 1em 0;overflow:hidden;font-size: 1.1em;display: inline-block;}
.producte .selects label {line-height: 1.6em;text-align: right; display: block; width: 100px;float: left;clear: left;margin: 0 0.5em 0 0;}
.producte .selects select {display: block;float: left;}
.producte #refresh {float: right;margin-right: 1.5em;margin-top: -1.5em;}


#taula_detail {width:400px;border-collapse:collapse;margin-right:10px;font-size:16px;}
#taula_detail td {border-top:1px solid #A6A8A9;line-height:33px;text-align:center;height:34px;}
#taula_detail th {text-align:center;color:#C5C6C8;margin-left:2px;font-size:11px;padding-right:3px;}
#taula_detail input {background:#C5C6C8;border:none;}
#taula_detail .radio input {background:#fff;border:none;}
#taula_detail select {border:1px solid #f00;width:98%;}
#taula_detail td a {background:#000 url(../img/carret_taula.jpg) bottom no-repeat;display:block;width:31px;height:26px;margin:0 auto;}

#taula_detail span{background:#E2001A;color:#fff;font-weight:bold;margin-right:3px;display:block;width:97%;height:26px;line-height:26px;margin:0;padding:0;}
#taula_detail span.no_oferta{background:#000;}
#taula_detail .iva{background:#C5C6C8;color:#7C7D7F;}

.carret_taula{width:37px;}
.radio{width:24px;}
.unitats{width:60px;}
.unitats input{width:97%;margin:0 auto;text-align:center;font-weight:bold;padding:5px 0;}
#taula_detail td.caract{color:#646466;font-weight:bold;text-align:left;width:110px;}

/* Barra inferior del producte, per ampliar imatge o tornar */
.peu {width: 741px; position: absolute; bottom: 0; right: 0;
border-top:1px solid #ccc; line-height:28px; height:28px; color:#000;}
#lupa{display:block;width:36px;height:26px;background: #fff url(../img/lupa.jpg) top left no-repeat;margin: 2px 0 0 10px;}
#back{float:right;color:#A6A8A9;font-weight:bold;text-decoration:none;margin-right:17px;}
#back:hover{color:#162983;}

/* Pàgina visualització del carret de la compra */
#comanda {width: 740px; margin: 0 auto;}
.comanda {clear: both;margin-bottom: 2em;}

.carret {border-collapse: collapse;width:705px;margin:2em auto;color:#162983;font-size: 12px;clear: both;}
.carret td {padding:0.5em 0.2em; vertical-align: middle; font-weight:bold;border-top: 1px solid #D6D9E9;border-bottom: 1px solid #D6D9E9;}
.carret td.quantitat {text-align:center;width:75px;}
.carret th {padding:0.3em; text-align: left; background:#000;color:#fff;}
.carret tr {border-top: 1px solid #D6D9E9;border-bottom: 1px solid #D6D9E9;}
.carret input {border:1px solid #111E64;width:30px;}
.carret select {border:none;width:120px;border:1px solid #111E64;font-size: 11px;}
table .message td {text-align: center;font-size: .9em; font-weight: bold;padding: 1em;}
.carret label {display: block; color:#162983;}

.carret input.save_carret{width:100px;border:1px solid #000;cursor:pointer;}
#delete{display:block;width:16px;height:16px;background:url(../img/delete_linia.jpg) no-repeat;}

.galeries h1, .noticies h1, .lliure h1, .ocasio h1, .prova h1 {padding: 0 15px; background: #868789;margin: 0;color: #fff;}
.galeries h2, .noticies h2, .lliure h2, .ocasio h2, .adresa h2, .comanda h2, .final h2 {margin: 1em 0; padding: 0; background: none; color: #E2001A; line-height: 0.8em;font-size: 24px;text-align: left;}
.comanda h2 {margin: 0 0.5em;padding-top: 1em;}
.noticies h2 {margin-top: 0.3em;}
.lliure {background: #fff;}
.lliure div div {padding: 1em;}
.lliure div div div {padding: 0;}
#container .lliure .pl_figure {border: 1px solid #ccc; padding: 5px; background: #eee;}

.noticies .noticia {position: relative; float: left; width: 350px;margin: 1em 10px;}
.data {display: block; width: 60px; float: left;text-align: center;font-weight: bold;background: #FFEA09;margin: 0 1em 1em 0;padding: 0.5em;color: #666;}
.data em {display: block; font-size: 200%;color: #000;}
.noticies .pl_figure {float: left; clear: left; padding: 5px; background: #eee; margin: 0 1em 0.5em 0; width: auto;text-align: center;}
.noticies .pl_figure span {display: block;font-size: 90%;font-style: italic;}
.noticia a {display: block; text-align: right; text-decoration: none; color: #E2001A; vertical-align: middle;padding-right: 1em; clear: both;}
.noticia a em {font-size: 200%;font-style: normal;position: relative; top: 4px;}
.noticia p {margin-bottom: 0;}
.noticia h2 a {display: inline;text-align: left;}
#noticia {float: none;width: auto;}
#noticia h2 {padding-top: 0.5em;}
#noticia p {clear: left;}

.adresa {float: left; width: 345px; margin: 1em 10px;}
.adresa p {line-height: 1.5em; font-size: 14px;}
.adresa span {color: #333;font-weight: bold;padding-right: 5px;}

.ocasio {position: relative; float: left; width: 435px; margin: 1em 10px;}
.ocasio .hi {background: #FFF9DD;}
.ocasio div {margin: 0.5em 0;padding: 0.5em}
.ocasio div h3 a {color: #00c; font-size: 16px;font-family: arial;font-weight: normal;}
.ocasio span {display: block; color: #777;font-size: 10px;margin-bottom: 0.5em;}
.ocasio span a {color: #77c;}
#ocasio_foo {margin: 0; padding: 1em 0 0; background: #fff url(../img/bg_anuncis.jpg) top left repeat-y;}
#ocasio_foo .botons input {float: none;margin: 0 auto;}
#ocasio_foo .botons {background: #ddd;padding: 1em 0;}
.ocasio .vcard {clear: both; background: #FFF9DD;margin: 1em 0;}
.ocasio .vcard h4 {font-family: arial; font-size: 13px;color: #00c;}
.ocasio .vcard a {color: #77c;margin: 0.5em;}
.ocasio .vcard span, .ocasio .vcard a {font-size: 12px; color: #000;display: block;}
.ocasio .vcard abbr {display: none;}
h1.top {padding: 0 15px; background: #868789;margin: 0;color: #fff;}

.galeries div {float: left; margin: 10px;width: 227px;}
.galeries .first {clear: both;}
.galeries span {display: block}
.galeries h2 a {text-decoration: none; color: #E2001A;}
.galeries h2 a:hover {text-decoration: underline;}
.galeries img {border: none;}
.galeries h2 {margin: 1em 15px 0.5em 15px;}
.galeries div h2 {margin: 1em 0;}
.galeries h3 {margin: 0.5em 0;}


/* Portada */
#headline {background: #C4C5C7; padding: 2em; position: relative;}
#headline p {margin: 0;padding: 0;overflow: hidden;width: 100%;}
#headline img {float: right; margin-left: 2em; height: auto;}

.section {width: 465px;float: left;}
.section h1 {background: #000; color: #fff; font-family: Tahoma; text-transform: uppercase;margin: 0;padding: 0.5em;letter-spacing: 3px;word-spacing: 10px;}

#p_temporada h1 {background: #646366;}
#p_agenda h1 {background: #86878A;}

#footline {background: #162A83;overflow: hidden;width: 100%;clear: both;}
#p_noticies h1 {background: #A7A7AA;}
#p_noticies h2, #p_noticies h2 a, #p_agenda h2, #p_agenda h2 a {color: #fff;}

.section div {margin: 1em;overflow: hidden;}
.section h2 {font-size: 1.3em;line-height: 0.9em;margin-top: 0;}
.section span {color: #ccc;}
.section a {color: #000;text-decoration: none;}
.section a:hover {text-decoration: underline;}
.section .pl_figure {float: left;margin:0 1em 0 0;}

.final {margin: 0 1em;font-size: 13px;}
.final p {width: 400px; margin: 2em auto;line-height: 1.5em;}
.formulari {padding: 1em;margin: 0 auto;width: 716px;}
.formulari .ds {background: #F5F6F9; border: 1px solid #ccc;margin-bottom: 1em;}
.formulari label {display: block;width: 150px;float: left;text-align: right;margin: 0.3em 0;font-size: 12px;}
.formulari h2 {font-size: 15px;margin-top: 1em;}
.formulari fieldset {position: relative; padding: 1em;margin: 1em 0;border: none;}
.formulari input, .formulari textarea {margin: 0.2em 1em;padding: 0.1em 0.5em;border: 1px solid #ccc;display: block; float: left;width: 300px;}
.formulari select {margin: 0.2em 1em;font-size: 115%;border: 1px solid #ccc;display: block; float: left;width: 320px;}
.formulari li {clear: both;}
.formulari legend {font-weight: bold;font-size: 13px;}
.formulari .check {border: none;width: auto;margin-top: 0.4em;}
.formulari .choose {margin: 0.2em 210px 0.2em 0px; text-align: right;}
.formulari .choose input, .formulari .choose label {display: inline;float: none; text-align: right;width: auto;padding: 0; margin: 0;}

label em {color: #900;font-weight: bold;position: absolute;}

.botons {overflow: hidden;padding-right: 1em;height: 3em;text-align: center;}
/*.botons input {width: auto; border: 1px solid #7f7f7f; font-family: arial; text-decoration: none; display: block; margin: 0 0.5em; background: #eee; color:#000;float: right;padding: 0.1em 0;}*/
.botons span {border: 1px solid #000;padding: 1px;float: right;margin: 0 0.5em;}
.botons input {font-size: 12px; font-weight: bold;width: auto; border: 2px solid #000; font-family: arial; text-decoration: none; display: block; margin: 0;background: #000; color:#fff;padding: 0.1em 0;float: none;}
.botons form {display: inline; margin:0;padding: 0;}
.botons .hidden {display: none;}



.progressWrapper {
	width: auto;
	overflow: hidden;
}
.progressContainer {
	margin: 5px;
	padding: 4px;

	border: solid 1px #E8E8E8;
	background-color: #F7F7F7;

	overflow: hidden;
}
.red /* Error */
{
	border: solid 1px #B50000;
	background-color: #FFEBEB;
}
.green /* Current */
{
	border: solid 1px #DDF0DD;
	background-color: #EBFFEB;
}
.blue /* Complete */
{
	border: solid 1px #CEE2F2;
	background-color: #F0F5FF;
}

.progressName {
	font-size: 8pt;
	font-weight: bold;
	color: #555555;

	width: 323px;
	height: 14px;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
}
.progressBarInProgress,
.progressBarComplete,
.progressBarError {
	font-size: 0px;
	width: 0%;
	height: 2px;
	background-color: blue;
	margin-top: 2px;
}
.progressBarComplete {
	width: 100%;
	background-color: green;
	visibility: hidden;
}
.progressBarError {
	width: 100%;
	background-color: red;
	visibility: hidden;
}
.progressBarStatus {
	margin-top: 2px;
	width: 337px;
	font-size: 7pt;
	font-family: Verdana;
	text-align: left;
	white-space: nowrap;
}
a.progressCancel,
a.progressCancel:link,
a.progressCancel:active,
a.progressCancel:visited,
a.progressCancel:hover
{
	font-size: 0px;
	display: block;
	height: 14px;
	width: 14px;

	background-image: url(../images/cancelbutton.gif);
	background-repeat: no-repeat;
	background-position: -14px 0px;
	float: right;
}
a.progressCancel:hover
{
	background-position: 0px 0px;
}

#menu2{background:#646366;padding:5px 10px;height:22px;position:relative;overflow:hidden;}
#llista_distribucio{width:500px;float:left;}
#llista_distribucio label{color:#fff;margin-right:10px;}
#llista_distribucio form{margin:0;padding:0;}

#select_idiomes{position:absolute;right:0;width:200px;line-height:20px;}
#select_idiomes a{width:auto;text-decoration:none;color:#ccc;font-weight:bold;vertical-align:middle;float:left;margin-right:20px;}
#select_idiomes a img{border:none;float:left;margin-right:3px;margin-top:2px;}
#select_idiomes a:hover{color:#fff;}
#select_idiomes a.selected{color:#fff;}

.cos_llista_distribucio{text-align:center;padding:150px 0;}
.cos_llista_distribucio h1{}