@import url("//fonts.googleapis.com/css?family=Sofia+Sans:700,500,600,400");

body{color:#262626;font-family: 'Sofia Sans', Arial, Verdana, Sans-serif;}
a {color:#262626}
a:hover{color:#777;text-decoration:none}

/************************ CAPÇALERA *****************************/

.header {margin:auto;width:90%;padding-bottom: 20px;}

#pgPortada .subheader .navbar-brand,
#pgPlanaPrincipalFV .subheader .navbar-brand,
#pgPlanaPrincipalOC .subheader .navbar-brand,
#pgPlanaPrincipalRP .subheader .navbar-brand {margin-left:0;margin-top: 10px;padding-bottom:20px;}

#pgPortada .subheader .navbar-brand img,
#pgPortada .subheader .navbar-brand svg,
#pgPlanaPrincipalFV .subheader .navbar-brand img,
#pgPlanaPrincipalFV .subheader .navbar-brand svg,
#pgPlanaPrincipalOC .subheader .navbar-brand img,
#pgPlanaPrincipalOC .subheader .navbar-brand svg {min-width:200px;max-width:250px;}
#pgPlanaPrincipalRP .subheader .navbar-brand img {max-width:200px;}

#opcio-inscriures-nav, #opcio-alta-nav {display:none;}


.bloc-lema{text-align:center}
.cap-lema{text-align:center;color:#262626;font-size:45px; font-weight:400;font-family:'Sofia Sans', Arial, Verdana, Sans-serif;max-width: 60%;padding: 10px 20px 10px 0px;line-height:1.1;display:inline-block}

.bloc-lema-peu{margin-top:50px;margin-bottom:50px}
.bloc-lema-peu .titol{color:#262626;font-size:45px; font-weight:400;font-family:'Sofia Sans', Arial, Verdana, Sans-serif;padding: 10px 20px 10px 0px;line-height:1.1;}
.bloc-lema-peu .text{text-align:left;color:#666;;font-size:18px; font-weight:400;font-family:'Sofia Sans', Arial, Verdana, Sans-serif;padding: 10px 20px 10px 0px;line-height:1.1;}
.bloc-lema-peu .text b {color:#000000}

#pgPlanaPrincipalOC .subheader {text-align:left;}

div.navbar-header > a.navbar-brand.iemaq > img {
  height: 50px;
  margin-top: 0;
  padding-left: 0;
  margin-left: -60px;
}
div.navbar-header > a.navbar-brand.ieferia > img {
  height: 60px;
  margin-top: -2px;
  padding-left: 0;
  margin-left: -60px;
}
.cap-sector {
  border-bottom: 0;
  padding-bottom: 0;
}
/******************** CERCADOR ***************************/
.search-container {display: flex; width: 70%; margin: auto;}
.search-input {padding: 10px 15px;border: 1px solid #ccc; border-radius: 25px 0 0 25px;font-size: 18px;outline: none;width: 100%;border-right: none; /* Elimina el borde derecho para que no se solape */}
.search-button {padding: 10px 20px;background-color: #000000;color: white;border: 1px solid #000000;border-radius: 25px;cursor: pointer;font-size: 16px;transition: background-color 0.3s; margin-left: -20px; /* Superpone el botón sobre el input */ }
.search-button:hover {background-color: #1a1a1a; box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);}
.search-input:focus {border-color: #666;}

/******CERCADOR FIRA VIRTUAL******/
#pgPlanaPrincipalFV #botoBuscar{
	margin-top:20px;
	margin-left:-60px;
	font-size:18px;
}

#pgPlanaPrincipalFV #inputCercadorFV{
	height:50px;
	font-size:18px;
	margin:20px 20px 0px 0px;
	padding:12px;
	position:relative;
	border-radius: 25px 0px 0px 25px;
	font-weight:400;
}

#pgPlanaPrincipalFV #inputCercadorFV:focus{border-color: #666;}

#pgPlanaPrincipalFV .botonFV{
	width:220px;
	height:50px;
	background-color:#DC070F;
	color:white;
	font-weight:400;
	vertical-align:middle;
	text-align:center;
	position:relative;
	border:0;

	border-radius: 25px 0px 0px 25px;
}
#pgPlanaPrincipalFV .botonFVempresa {
	background-color: #000000;
	margin-top: 20px;
    margin-left: -3px;
    font-size: 18px;
    width: 140px !important;
	border-radius: 0px 25px 25px 0px;
}

/********************************* CANVIS OCASIÓ *************************************/

#pgPlanaPrincipalOC .subheader{ color:red; font-weight:700; font-size:30px;	background-color:#FFFFFF;margin-bottom:10px}
#pgPlanaPrincipalOC .cap-lema{margin-top:0;}

/********************************* OCASIO AREES ***************************************/
#caixa-arees{background-color: #f4f4f4; display: flex; /* o grid */ flex-wrap: wrap; /* si hay múltiples cajas */gap: 10px; /* espacio entre cajas */ margin-top:20px; padding-bottom:20px;width:90%;margin-left:auto;margin-right:auto}
#pgPlanaPrincipalOC .view2 {margin:20px 5px 0px 5px; width: 23%;}
#pgPlanaPrincipalOC .view2 .btn-default{position:relative; padding: 15px 25px 25px; height: 130px;text-align:left;  white-space:normal !important;word-wrap: break-word; background-color:#f4f4f4;width:100%;border:1px solid #c9c9c9; border-radius:15px;}
#pgPlanaPrincipalOC .view2 .btn-default:hover { border: 2px solid #979696;}
#pgPlanaPrincipalOC .view2 .btn-default svg {width: 20px; height: 20px; position: absolute; bottom: 5%; right: 5%;}
#pgPlanaPrincipalOC .view2 .nom-area{text-align:left;margin-top: 20px;font-weight: 700;font-size: 20px;position:absolute;bottom:15%;margin-right: 10px;}
#pgPlanaPrincipalOC .view2 .nom-area a {color:#DC070F;}
#pgPlanaPrincipalOC .view2 img {width:40px;position: absolute; top: 10%;}
#pgPlanaPrincipalOC .view2 .mes-info-area svg {fill:#DC070F;width:15px;height:15px}
#pgPlanaPrincipalOC .view2 .dropdown-menu > li > a {white-space:normal}


/********************************* FV AREES ***************************************/
#pgPlanaPrincipalFV .view2 {margin:20px 5px 0px 5px; width: 23%;}
#pgPlanaPrincipalFV .view2 .btn-default{position:relative; padding: 15px 25px 25px; height: 130px;text-align:left;  white-space:normal !important;word-wrap: break-word; background-color:#f4f4f4;width:100%;border:1px solid #c9c9c9; border-radius:15px;}
#pgPlanaPrincipalFV .view2 .btn-default:hover { border: 2px solid #979696;}
#pgPlanaPrincipalFV .view2 .btn-default svg {width: 20px; height: 20px; position: absolute; bottom: 5%; right: 5%;}
#pgPlanaPrincipalFV .view2 .nom-area{text-align:left;margin-top: 20px;font-weight: 700;font-size: 20px;position:absolute;bottom:15%;margin-right: 10px;}
#pgPlanaPrincipalFV .view2 .nom-area a {color:#DC070F;}
#pgPlanaPrincipalFV .view2 img {width:40px;position: absolute; top: 10%;}
#pgPlanaPrincipalFV .view2 .mes-info-area svg {fill:#DC070F;width:15px;height:15px}
#pgPlanaPrincipalFV .view2 .dropdown-menu > li > a {white-space:normal}

/*********************DISTRIBUIDOR************************/
.column .card{border-radius:15px;margin-bottom:20px}
.column .card { padding: 20px; border: 1px solid #262626; height: 250px; position: relative;font-size: 16px;}
.column .card h2 { text-align: left; color: #000; font-size: 25px;}
.column .card .card-link2 { position: absolute; padding: 0; border-top: 0; border-right:0; font-size: 13px; color: #000;}
#distribuidor{background: #eee;padding-top: 30px;padding-bottom:30px;}
#FiraVirtual2, #Jornades2, #Classificats2, #Revistes2 {	position: relative;}

/************DESTACATS PORTADA ****************/
.contenidor-fitxa {position: relative;padding: 0 ;	transition: color 0.2s ease,background 0.2s ease;padding:10px 0;
	display:inline-block;width:100%;height: 200px;margin-bottom: 30px; line-height: 15px;}
.caixa-destacats {margin:0px auto 20px auto;width:90%;padding:50px 0px 50px 0px}
.caixa-recents {margin:0px auto 0px auto;width:90%;padding:50px 0px 50px 0px}
.caixa-destacats td.OD, .caixa-recents td.OD {border:none}
.caixa-destacats .swiper-slide img{width: 250px;max-width:250px;  max-height: 200px; height:150px ; object-fit: cover;  border: 1px solid #dddddd; border-radius: 16px;margin-bottom:10px}
.caixa-recents .swiper-slide img  {width: 250px;max-width:250px;  max-height: 200px; height:150px ; object-fit: cover;  border: 1px solid #000000; border-radius: 16px;margin-bottom:10px}
.caixa-destacats .swiper-slide, .caixa-recents .swiper-slide {margin-bottom: 20px}
.caixa-destacats .titol-ods, .caixa-recents .titol-ods{text-align: center;  margin-bottom: 30px;}
 .caixa-recents .titol-ods {color:#FFFFFF}
.caixa-destacats .swiper-wrapper {margin-bottom:30px}
.caixa-destacats span.OD1, .caixa-destacats span.OD2, .caixa-destacats span.OD3{margin:0 auto 0 auto;padding:.1ex .15ex;width:auto;white-space:normal;text-transform:none;word-wrap:break-word;text-wrap:normal;display:block;color:black;text-decoration:none}
.caixa-recents span.OD1, .caixa-recents span.OD2, .caixa-recents span.OD3{margin:0 auto 0 auto;padding:.1ex .15ex;width:auto;white-space:normal;text-transform:none;word-wrap:break-word;text-wrap:normal;display:block;color:white;text-decoration:none}
.caixa-recents span.OD2 a {color:#FFFFFF}

.caixa-destacats span.OD1, .caixa-destacats span.OD2{font-weight:700}
.caixa-destacats .producto-img {transition: transform 0.3s, box-shadow 0.3s;}
.caixa-destacats .producto-img:hover {  transform: scale(1.05);  box-shadow: 0 10px 20px rgba(0,0,0,0.1);}

.caixa-recents span.OD1, .caixa-recents span.OD2{font-weight:700}
.caixa-recents .swiper-wrapper {margin-bottom:30px}
.caixa-recents .producto-img {transition: transform 0.3s, box-shadow 0.3s;}
.caixa-recents .producto-img:hover {  transform: scale(1.05);  box-shadow: 0 10px 20px rgba(0,0,0,0.1);}
.caixa-recents .swiper-scrollbar{background:var(--swiper-scrollbar-bg-color, rgb(255, 255, 255))}

.caixa-recents.videos {}
.caixa-recents.videos span.icona {position:absolute;top:25%;right:53%;opacity:1;cursor:pointer}
.caixa-recents.videos span.icona svg{ fill: white; width: 50px; height: 50px;}

.caixa-subhastes {margin:0px auto 20px auto;padding:50px 0px 50px 0px}
.caixa-subhastes container{margin:auto}
.caixa-subhastes .titol-ods{text-align: center;  margin-bottom: 30px;}
.caixa-subhastes .swiper-wrapper {margin-bottom:30px}
.caixa-subhastes .swiper-slide .event {border:1px solid #cacbcb;border-radius:5px;height:250px;padding-bottom:10px}
.caixa-subhastes .swiper-slide .event:hover {border:2px solid #979696;}
.caixa-subhastes .swiper-slide .event a, .caixa-subhastes .swiper-slide .event span{display:block}
.caixa-subhastes .swiper-slide .event span {margin-left:10px;margin-right:10px}
.caixa-subhastes .swiper-slide .event span.OD1 {font-weight:700;margin-bottom:10px;margin-top:10px}
.caixa-subhastes .swiper-slide img{width: 176px;max-width:176px;  max-height: 76px; height:76px ; margin-bottom:10px;}
.caixa-subhastes .swiper-slide .event .caixa-img {background-color:#FFFFFF;text-align:center;padding:10px;border-radius:10px}






/************************ MEDIA QUERIES *****************************/

@media screen and (max-width: 1840px) {
.cap-lema{font-size:40px;}
}

@media screen and (max-width: 1380px) {
.cap-lema{max-width: 85%;}
#pgPortada .subheader .navbar-default .navbar-nav > li.nav-ultim a:hover,
#pgPlanaPrincipalFV .subheader .navbar-default .navbar-nav > li.nav-ultim a:hover,
#pgPlanaPrincipalOC .subheader .navbar-default .navbar-nav > li.nav-ultim a:hover,
#pgPlanaPrincipalRP .subheader .navbar-default .navbar-nav > li.nav-ultim a:hover
{border-radius:0px 25px 25px 0px}

.header-fons-cap-contingut{top:8%}
}

@media screen and (max-width: 1080px) {
	/*En aquest punt de tall es contrau la barra de navegació, això ho forcem a 2014.css, per ajustar les dues barres de navegació que hi haurà*/
	#pgPortada .header-fons-cap, #pgPlanaPrincipalFV .header-fons-cap, #pgPlanaPrincipalOC .header-fons-cap, #pgPlanaPrincipalRP .header-fons-cap {background-size:100%;}

	.cap-lema{background-color:transparent; font-weight:700;padding-top:0px;max-width:80%}
	
	#pgPlanaPrincipalOC .cap-lema {font-size:25px}
	#pgPlanaPrincipalOC .buscador {padding-top:0px;}
	
	#pgPortada .subheader .navbar-left, 
	#pgPlanaPrincipalFV .subheader .navbar-left, 
	#pgPlanaPrincipalOC .subheader .navbar-left, 
	#pgPlanaPrincipalRP .subheader .navbar-left {padding-left:10px;margin-top:20px}
	
	#pgPortada .subheader .navbar-brand img, 
	#pgPlanaPrincipalFV .subheader .navbar-brand img, 
	#pgPlanaPrincipalOC .subheader .navbar-brand img, 
	#pgPlanaPrincipalRP .subheader .navbar-brand img {max-width:195px;}
	
	#pgPortada .subheader .navbar-brand svg, 
	#pgPlanaPrincipalFV .subheader .navbar-brand svg, 
	#pgPlanaPrincipalOC .subheader .navbar-brand svg, 
	#pgPlanaPrincipalRP .subheader .navbar-brand svg {max-width:195px;}
	
	#pgPortada .subheader .navbar-default .navbar-header button, 
	#pgPlanaPrincipalFV .subheader .navbar-default .navbar-header button, 
	#pgPlanaPrincipalOC .subheader .navbar-default .navbar-header button, 
	#pgPlanaPrincipalRP .subheader .navbar-default .navbar-header button {margin-top:20px}
	
	#opcio-inscriures-nav {display:block}
	#opcio-alta-nav {display:block}
	#pgPlanaPrincipalRP .subheader{height:500px}	

	.header {width:100%;}
	div.navbar-header > a.navbar-brand.ieferia > img {
	  margin-left: -30px;
	}
	div.navbar-header > a.navbar-brand.iemaq > img {
	  margin-left: -30px;
	}	
}


@media (max-width:992px){
	.dades-ojd {text-align:center}
	
	#pgPlanaPrincipalOC .view2 {width: 30%; }
	#pgPlanaPrincipalFV .view2 {width: 30%; }
}

@media (max-width:768px){
	#botoPpal {width: 100%;margin: auto}
	#pgPlanaPrincipalFV #inputCercadorFV{border-radius:25px}
	#pgPlanaPrincipalFV .botonFV{border-radius:25px 0px 0px 25px}
	#pgPlanaPrincipalFV .botonFVempresa{border-radius:0px 25px 25px 0px}
	#fonsPubliqueAnuncio, #fonsExpositor { background: none;}
	.blocTextAnuncioImportant, #blocTextExpositorImportant {padding-top: 20px;}
	
	#pgPortada .subheader .navbar-default, 
	#pgPlanaPrincipalFV .subheader .navbar-default,	
	#pgPlanaPrincipalOC .subheader .navbar-default,	
	#pgPlanaPrincipalRP .subheader .navbar-default {background-color:#ffffff;margin-bottom:10px;}
	
	#pgPlanaPrincipalOC .view2 {width: 45%; }
	#pgPlanaPrincipalFV .view2 {width: 45%; }
	
	.bloc-lema-peu{margin:50px 0px}
	.bloc-lema-peu .titol{font-size: 30px}
	.bloc-lema-peu .text {font-size: 20px}
	
	#pgPlanaPrincipalFV #botoBuscar {margin-left:0px;margin-top:10px}
	#pgPlanaPrincipalFV .botonFVempresa {margin-top:10px}
	.buscador {margin-left: 20px; padding-top: 0px;}
	div.navbar-header > a.navbar-brand.ieferia > img {
	  margin-left: 0;
	  height: 45px;
	  margin-top: -6px;
	}
	div.navbar-header > a.navbar-brand.iemaq > img {
	  margin-left: 0;
	  height: 45px;
	  margin-top: -6px;
	}	
}

@media screen and (max-width: 666px) {
	.cap-lema{font-size:35px;margin-top:25px;padding-top:10px}
	#pgPlanaPrincipalRP .subheader{height:450px}	
}

@media screen and (max-width: 550px) {
.cap-lema{font-size:30px;}
#pgPlanaPrincipalRP .subheader{height:400px}	
}

@media screen and (max-width: 480px) {
	.cap-lema{font-size:25px;margin-top:0px}
	.boto-accio a {display:block; margin-top:20px}
	.taca-grisa {height: 400px;}
	#pgPortada .subheader {height:450px}
	#pgPlanaPrincipalRP .taca-grisa {height: 300px;}
	#pgPlanaPrincipalRP .subheader{height:350px}
	#ojdIframe{margin-left:0px}
	.icona-dades{display:none;}
	.accordion .panel-title a {padding-right:35px}
	#pgPortada .header-fons-cap{background-image:url(/img/Fons-mobil.webp); background-position:bottom right;background-repeat: no-repeat; background-size:480px; width:100%; height:400px; position:absolute;} 
	
	#pgPlanaPrincipalOC .view2{width:100%;height:100%;margin-left:0px}
	#pgPlanaPrincipalOC .view2 img {width:50px}
	 
	#pgPlanaPrincipalFV .view2{width:100%;height:100%;margin-left:0px}
	#pgPlanaPrincipalFV .view2 img {width:50px}
	
	.search-container{margin:unset}

	#pgPlanaPrincipalOC .view2{width:100%;height:100%;margin-left:0px}
	#pgPlanaPrincipalOC .view2 img {width:50px}

	#pgPlanaPrincipalFV .view2{width:100%;height:100%;margin-left:0px}
	#pgPlanaPrincipalFV .view2 img {width:50px}
	
	#pgPlanaPrincipalOC .swiper-slide{text-align:center}
	#pgPlanaPrincipalFV .swiper-slide{text-align:center}
	
	.caixa-recents.videos span.icona {right:45%;}
	
	#pgPlanaPrincipalFV #botoBuscar {font-size:14px;width: 160px;}
	#pgPlanaPrincipalFV .botonFVempresa {font-size:14px;}
	.buscador { padding-top: 0px; }
}

@media screen and (max-width: 375px) {
	.cap-lema{font-size:24px;}	
	.taca-grisa {height: 300px;}
	#pgPortada .subheader{height:350px}
	.caixa-central{margin-top:40px}
	#pgPlanaPrincipalFV .buscador { padding-top: 0;}
	#pgPlanaPrincipalFV .botonFV {width:150px;}
	.margin-top-bloc{margin-top:10px}
	#pgPortada .header-fons-cap{background-size:420px;height:350px }
	

}

@media screen and (max-width: 360px) {
	#quadreCerca {text-align:center}
	#pgPlanaPrincipalFV .botonFV {border-radius:25px}
}

@media screen and (max-width: 340px) {
	.caixa-central{margin-top:70px}
	#pgPlanaPrincipalFV #botoBuscar{margin-left:0px}
	#pgPlanaPrincipalFV .botonFVempresa {margin-top:10px}

}