/* CSS Document */
html{overflow: hidden}
#contingut {
  width: 1100px; /* Amplada desitjada */
  margin: 0 auto; /* Això centrarà el div horitzontalment */
  /* Altres estils per al contingut, si cal */
}
#carrega{position: fixed; width: 100%; height: 100%; background-color: white;z-index: 10000; top:0px; left: 0px;}
#cap{top:0px; left: 0px; width: 100%; height: 135px; background-color: white;z-index: 1000; overflow: hidden}
#logo {
    position: relative;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    max-height: 200px;
    height: 140px;
    width: 1024px;
    background-image:url("cap.jpg");
    background-repeat: no-repeat;
    background-position: center; /* Centra la imatge */
    background-size: contain; /* Ajusta la mida de la imatge */
    z-index: 1000;
	clear: both;
	display: block;
}
#logoMb {
	position: relative;
	width: 90%;
	height: 200px;
	float: left;
	background-size: contain;
	background-image: url("cap.jpg");
	background-position: center;
	background-repeat: no-repeat;
}

#capMb {
	width: 100%;
	height: 200px;
	position: relative;
}
#menuMb{
	position: absolute;
	top: 200px;
	width: 0%;
	height: calc(100vh - 200px);
	background-color: white;
	z-index: 10000;
	overflow: hidden;
}
#btMenuMb{width: 10%; background-image:url("menu.png");
height: 200px;
position: relative;
float: left;
background-size: contain;
	background-position: center;
	background-repeat: no-repeat;}
#content
{
	 position: relative; 
	 display: flex;
  align-items: center;
  justify-content: space-between;
  width: 10000px; /* Ajustar a la mida desitjada */
  margin: 0 auto;
}

#scrollImatges {
	position: relative;
  width: 100% ; /* Amplada ajustada per deixar espai pels botons */
  overflow-x: auto;
  white-space: nowrap;
}

.imatge {
  display: inline-block;
  width: auto; /* Amplada automàtica */
  max-height: 600px; /* Alçada ajustada */
  margin-right: 10px; /* Espai entre imatges */
}

button {
  position: absolute; /* Posició fixa dins del contenidor #content */
  top: 50%; /* Centrat verticalment */
  transform: translateY(-50%); /* Ajusta la posició vertical dels botons */
  width: 100px; /* Amplada dels botons */
  height: 100%; /* Alçada dels botons igual a la del contenidor */
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
button img {
  max-width: 100%;
  max-height: 100%;
}

#esquerra {
  left: 0; /* Fixar el botó d'esquerra a l'esquerra */
}

#dreta {
  left: 800px; /* Fixar el botó de dreta a la dreta */
}
#menu{
	position: relative; z-index: 1001;left: 40px; margin-top: 10px; float: left; width: 200px;
}
.opMenu{
	position: relative; width: 150px; font-size: 30px; padding: 10px; padding-left: 0px; font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; text-align: left;
}
.subOpMenu{
	position: relative; width: 150px; font-size: 16px; margin-left: 5px; margin-bottom: 4px; font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; text-align: left;
}
.idiomaMenu{
	position: relative; width: 30px; font-size: 12px; padding: 10px; padding-left: 0px; font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; text-align: left; float: left;
}
#imatgePresentacio{float: left; max-width: 900px !important; overflow: hidden; height: 600px; }
#contingutBio{float: left; max-width: 850px !important; overflow: hidden; height: 600px; padding: 0 25px 0 25px }
#containerImg{
	position: relative; top: 25px; width: 500px;z-index: 1;
}
#img1
{
	left: 0px; position: relative;
}
#img2
{
	left: 0px; position: relative;
}
#img3
{
	left: 0px; position: relative;
}

.saltColumna{
            break-before: column; /* Indica un salt de columna */
        }



#fotosTotal
{
	column-count: 3;
            column-gap: 20px; /* Espai entre columnes */ width: 875px; column-fill: balance;
}
.idiomaMenu {cursor: pointer}
.opMenu {cursor: pointer}
.subOpMenu{cursor: pointer}
.fotoPrincipal
{
padding: 10px; cursor: pointer; display: block
}
.imatgePrincipal{ 
	z-index: 10;
}
.textPjMb{font-size: 38px; font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; z-index: 1000;text-align: center;margin-bottom: 20px;}
.textPj{font-size: 18px; font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif"; z-index: 1000;text-align: center;width:260px; break-inside: avoid; margin-bottom: 5px;}
#contingutCap{position:absolute; top: 60px; height: 50px; font-size: 25px; font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif"; width: 100%; text-align: center}

#visorFotos{
	position: absolute; top:105px; width: 100%; overflow: hidden; left: 0px;
}
#totalFotos{
	position: absolute;left: 0px; height: 100%;
}
.fotoV{position: relative;float: left; height: 100%;}
#flEsq{position: absolute;left: 50px; height: 60px; width: 60px; background-size: contain; background-repeat: no-repeat; background-image:url("imatgesCont/esq.png"); z-index: 1000 ;cursor: pointer}
#flDrt{position: absolute; right: 50px; height: 60px; width: 60px; background-size: contain; background-repeat: no-repeat; background-image:url("imatgesCont/drt.png");z-index: 1001; cursor: pointer}
#miniatures{position: absolute; left: 0px; width: 100%; height: 70px;}
.miniV{position: relative; float: left; height: 100%; margin-left: 5px; margin-right: 5px; cursor: pointer}
a{text-decoration: none; color: inherit}
.partAbout{position: relative; float: left; padding: 20px;}
#textCurri{position: relative; width: 600px;float: left; text-align: justify; font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif"}
#imatgePerfil{position: relative; width: 300px;float: left;}
#contacte{padding: 20px; margin-top: 20px; font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif"}
#containerImgMb{position: relative; width: 100%}
body{width: 100%}
.fotoPrincipalMb{margin-top:30px; height: 440px; margin-bottom: 90px;}