@font-face {
  font-family: "FolksB";
  src: url("../fonts/Folks-Bold.ttf") format("truetype");
}

@font-face {
  font-family: "BReplayB";
  src: url("../fonts/BPreplayBold.otf") format("truetype");
}

@font-face {
  font-family: "BReplay";
  src: url("../fonts/BPreplay.otf") format("truetype");
}

@font-face {
  font-family: "Nunito";
  src: url("../fonts/Nunito-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "NunitoB";
  src: url("../fonts/Nunito-Bold.ttf") format("truetype");
}

body {
     background: url("../../2a_pag_pintar/imatges_72_2a_pintar/prova_fondo_4_1725_960.png") repeat scroll center center #00BCE4;
     margin: 0px;
     padding: 0px;
     text-align: center;
}

#container {
     background: url("../imatges/72ppp/index3_800x600_72ppp_CONTAINERPETITA.jpg") no-repeat scroll 0% 0% #EBF7FF;
     height: 600px;
     margin: 0px auto;
     text-align: left;
     width: 800px;
}

#container1 {
     height: 600px;
     position: relative;
}

.bocadilloClass {
     height: 138px;
     width: 425px;
}

#bocadillo {
     display: none;
     opacity: 0.8;
}

#bocadilloRecuadre {
     left: 105px;
     position: absolute;
     top: 68px;
     z-index: 1;
}

#headerAnimacio {
     -moz-animation: 20s ease 0s normal none infinite primeraAnimacion;
     color: #00BCE4;
     font-family: "FolksB",serif;
     font-size: 3em;
     height: 100px;
     line-height: 75px;
     padding-top: 3px;
     position: relative;
     width: 500px;
}

@keyframes primeraAnimacion{
			0%{ left:0px; top:0px;opacity:0; }
				50%{ left:200px; top:0px;opacity:1; }
				100%{ left:400px; top:0px;opacity:0;}
		}
		@-webkit-keyframes primeraAnimacion{
				0%{ left:0px; top:0px;opacity:0; }
				50%{ left:200px; top:0px;opacity:1; }
				100%{ left:400px; top:0px;opacity:0;}
		}
		@-moz-keyframes primeraAnimacion{
			0%{ left:0px; top:0px;opacity:0; }
				50%{ left:200px; top:0px;opacity:1; }
				100%{ left:400px; top:0px;opacity:0;}
		}

.PESSESPUZZLE {
     position: absolute;
}

.pessa1 {
     bottom:145px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 465px;
     position: absolute;
     width: 92px;
     z-index: 2;
}

.pessa2 {
     bottom:48px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 447px;
     position: absolute;
     width: 130px;
     z-index: 2;
}

.pessa3 {
     bottom:35px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 585px;
     position: absolute;
     width: 90px;
     z-index: 2;
}

.pessa4 {
     bottom: -79px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 585px;
     position: absolute;
     width:125px;
     z-index: 2;
}

.pessa5 {
     bottom: -68px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 705px;
     position: absolute;
     width: 90px;
     z-index: 2;
}

.pessa6 {
     bottom: 65px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 680px;
     position: absolute;
     width: 111px;
     z-index: 2;
}

.pessa7 {
     bottom: 160px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 700px;
     position: absolute;
     width: 93px;
     z-index: 2;
}

.pessa8 {
     bottom: 147px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 560px;
     position: absolute;
     width: 132px;
     z-index: 2;
}

.pessa9 {
     bottom: -65px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:465px;
     position: absolute;
     width: 92px;
     z-index: 2;
}
.PUZZLEACABAT {
     position: absolute;
}


.sortable1,.sortable2,.sortable3,.sortable4,.sortable5,.sortable6,.sortable7,.sortable8,.sortable9 {

 
     height: 380px;
     left: 70px;
     position: absolute;
     top: -420px;
     width: 350px;
}
.pessa1FINAL {
     bottom:259px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left: 114px;
     position: absolute;
     width: 92px;
     z-index: 2;
}

.pessa2FINAL {
     bottom:46px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:179px;
     position: absolute;
     width:132px;
     z-index: 2;
}

.pessa3FINAL {
     bottom:262px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:284px;
     position: absolute;
     width:91px;
height:262px;
     z-index: 2;
}

.pessa4FINAL {
     bottom:95px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:114px;
     position: absolute;
     width:225px;
     z-index: 2;
}

.pessa5FINAL {
     bottom:172px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:199px;
     position: absolute;
     width:96px;
     z-index: 2;
}

.pessa6FINAL {
     bottom:193px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:263px;
     position: absolute;
     width: 112px;
     height:96px;
     z-index: 2;
}

.pessa7FINAL {
     bottom:114px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:114px;
     position: absolute;
     width: 97px;
     height:215px;
     z-index: 2;
}

.pessa8FINAL {
     bottom: 113px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:177px;
     position: absolute;
     width: 135px;
     height:88px;
     z-index: 2;
}

.pessa9FINAL {
     bottom:113px;
     cursor: url("../imatges/72ppp/cursor_puzzle.png"), pointer;
     left:283px;
     position: absolute;
     width: 92px;
     height:105px;
     z-index: 2;
}
.bimmeFelicitacio {
     display: none;
     height: 325px;
     position: absolute;
     right: 45px;
     top: 18px;
     width: 241px;
     z-index: 2;
}

.bocadilloFELICITACIO {
     display: none;
     height: 142px;
     left: 130px;
     position: absolute;
     top: 70px;
     width: 380px;
     z-index:4;
}

.ombra {
     display: none;
     height: 68px;
     position: absolute;
     right: 53px;
     top: 290px;
     width: 190px;
}

.puzzle1ACABAT_BevelEmboss {
     bottom: 110px;
     display: none;
     left: 115px;
     position: absolute;
     width: 260px;
     z-index: 3;
}

.puzzle1REF {
     bottom: 113px;
     left: 115px;
     position: absolute;
     width: 260px;
     z-index: 33;
}
.puzzle1REFdurant{

   bottom:0px;
     left: 0px;
     position: absolute;
     width: 260px;
	 z-index:0;
	}

.footer {
     height: 100px;
     position: absolute;
     top:494px;
     width: 797px;
}

.VEsq {
     bottom: 5px;
     left: 145px;
     position: absolute;
     width: 80px;
}

.VCen {
     bottom: 5px;
     left: 240px;
     position: absolute;
     width: 80px;
}

.VDre {
     bottom: 5px;
     left: 330px;
     position: absolute;
     width: 80px;
}

a {
     color: #FFFFFF;
     cursor: url("../../imatges_72/BummiCursor48x48.png"), pointer;
     text-decoration: none;
}

#botoEsquerra:hover {
     opacity: 0.7;
}

#botoEsquerra {
     background-color: #00BCE4;
     border-radius: 15px 15px 15px 15px;
     border: 3px solid #FFFFFF;
     bottom: 82px;
     box-shadow: -5px 5px 4px #484848;
     font-family: "NunitoB";
     font-size: 1em;
     height: 39px;
     left: 240px;
     letter-spacing: 1px;
     line-height: 2.4em;
     margin-bottom: 20px;
     margin-left: 69px;
     position: absolute;
     text-align: center;
     width: 125px;
	 -webkit-transform:rotate(10deg);
	-moz-transform:rotate(10deg);
	-ms-transform:rotate(10deg);
	-o-transform:rotate(10deg);
	transform:rotate(10deg);
     z-index: 0;
}

.trianglEsquerra {
     bottom: 20px;
     height: 28px;
     left: 75px;
     position: absolute;
     width: 40px;
}

.triangleDret {
     bottom: 46px;
     height: 28px;
     left: 75px;
     position: absolute;
     width: 40px;
}

.bimme {
     cursor: url("../../2a_pag_pintar/imatges_72_2a_pintar/BummiCursorBocadillo64x64.png"), pointer;
     height: 283px;
     position: absolute;
     right: 38px;
     top: 18px;
     width: 239px;
}