@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 {
	font: 100%/1.4 Nunito, Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 1.5px;
	background: #00BCE4;
	background-image: url(../imatges_72/prova_fondo_4_1725_800x600.png);
	background-repeat:repeat;
	background-size: auto;
	background-position: center center;
	text-align: center;
	margin: 0;
	padding: 0;
}
.container {
	width: 800px;
	height:600px;
	text-align: left;
	background: #b6eaff;
	background-image: url(../imatges_72/fondo_idex_800x600_copyPETITA.jpg);
	margin: 0 auto;
	background-repeat: no-repeat;
}
#headerAnimacio{
	font-family:"FolksB", serif;
	font-size: 1em;
	line-height:1.31em;
	text-align: center;
	color:#00BCE4;
	height: 146px;
	width: 800px;
				padding-top:3px;
				position: relative;
				animation: primeraAnimacion 20s;
				animation-iteration-count:infinite;
				-webkit-animation: primeraAnimacion 20s;
				-webkit-animation-iteration-count:infinite;
				-moz-animation: primeraAnimacion 20s;
				-moz-animation-iteration-count:infinite;
				}
		
	
		@keyframes primeraAnimacion{
				0%{ left:-40px; top:0px;opacity:0; }
				50%{ left:0px; top:0px;opacity:1; }
				100%{ left:40px; top:0px;opacity:0;}
		}
		@-webkit-keyframes primeraAnimacion{
				0%{left:-40px; top:0px; opacity:0;}
				50%{ left:0px; top:0px;opacity:1; } 		
				100%{ left:40px; top:0px;opacity:0;}	
		}
		@-moz-keyframes primeraAnimacion{
				0%{  left:-40px; top:0px;opacity:0; }
				50%{ left:0px; top:0px;opacity:1; }
				100%{ left:40px; top:0px;opacity:0;}
		}

}
.lletraVermella{color:#FF0000;}
.lletraVerdaClar{color:#00FF33;font-size: 0.95em; font-weight:bold;}
.lletraVerda{color:#4CB94E;}
.lletraTaronja{color:#F07731;}
.lletraBlauFosc{color:#2B60D4;}
.lletraMorat{color:#A941E5;}
.lletraGranate{color:#C1272D;}
.content{
	position:relative;
	width: 800 px;
	margin-bottom: 10px;
	}
#col_Esq {
	width: 224px;
	height:313px;
}
#col_Mig {
	left:225px;
	top:0px;
	width: 350px;
	background-repeat:no-repeat;
	}
.classImatgeColMig{
	position:absolute;
	left:245px;
	top:3px;
	width: 294px;
	height:389px;
	}
.classImatgeColMig:hover{
	top:0px;
	left:248px;
	cursor: url(../imatges_72/BummiCursor48x48.png), pointer;
	-webkit-transform:rotate(10deg);
	-moz-transform:rotate(10deg);
	-ms-transform:rotate(10deg);
	-o-transform:rotate(10deg);
	transform:rotate(10deg);
	}
#col_Dret {
	position:absolute;
	right:0px;
	top:0px;
	width: 224px;
	height:313px;
}
#botoEsquerra {
	cursor: url(../imatges_72/BummiCursor48x48.png), pointer;
	position:absolute;
	top:310px;
	left:10px;
	line-height:1em;
	text-align:center;
	letter-spacing: 1px;
	width: 170px; 
	height: 57px;
	padding:5px;
	margin-left:50px;
	-webkit-transform:rotate(-10deg);
	-moz-transform:rotate(-10deg);
	-ms-transform:rotate(-10deg);
	-o-transform:rotate(-10deg);
	transform:rotate(-10deg);
	color: #EEE809;
	background-color:#2B60D4;
	border-radius:15px;
	border:3px solid #FFF;
	-webkit-box-shadow:-5px 5px 4px rgba(72,72,72,1);
	-moz-box-shadow:-5px 5px 4px rgba(72,72,72,1);
	box-shadow:-5px 5px 4px rgba(72,72,72,1);
	}
#botoEsquerra:hover{
	opacity:0.7;
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-ms-transform:rotate(0deg);
	-o-transform:rotate(0deg);
	transform:rotate(0deg);
	}
/*.textShadow{
	color:#00FF33;
	text-shadow:0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1),
	0px 0px 1px rgba(255,255,0,1);}*/

.Vinyeta1{
	cursor: url(../imatges_72/BummiCursor48x48.png), pointer;
	position:absolute;
	left:30px;
	top:105px;
	width: 200px;
	height:205px;
	-webkit-transform:rotate(5deg);
	-moz-transform:rotate(5deg);
	-ms-transform:rotate(5deg);
	-o-transform:rotate(5deg);
	transform:rotate(5deg);
	}
.Vinyeta2{
	cursor: url(../imatges_72/BummiCursor48x48.png), pointer;
	position:absolute;
	right:30px;
	top:137px;
	width: 187px;
	height:167px;
	-webkit-transform:rotate(10deg);
	-moz-transform:rotate(10deg);
	-ms-transform:rotate(10deg);
	-o-transform:rotate(10deg);
	transform:rotate(10deg);
	z-index:1;
	}
.Vinyeta1:hover{
	cursor: url(../imatges_72/BummiCursor48x48.png), pointer;
	opacity:0.7;
	-webkit-transform:rotate(5deg);
	-moz-transform:rotate(5deg);
	-ms-transform:rotate(5deg);
	-o-transform:rotate(5deg);
	transform:rotate(5deg);
	}
.Vinyeta2:hover{
	cursor: url(../imatges_72/BummiCursor48x48.png), pointer;
	opacity:0.7;
	-webkit-transform:rotate(10deg);
	-moz-transform:rotate(10deg);
	-ms-transform:rotate(10deg);
	-o-transform:rotate(10deg);
	transform:rotate(10deg);
	}
#pessaPuzzle{
	position:absolute;
	top:230px;
	left:-10px;
	z-index:2;
	}
#botoDreta{
	cursor: url(../imatges_72/BummiCursor48x48.png), pointer;
	position:absolute;
	text-align:center;
	letter-spacing: 1px;
	line-height:1em;
	right:-20px;
	top:310px;
	width: 170px; 
	height: 57px;
	padding:5px;
	margin-right:60px;
	-webkit-transform:rotate(-10deg);
	-moz-transform:rotate(-10deg);
	-ms-transform:rotate(-10deg);
	-o-transform:rotate(-10deg);
	transform:rotate(-10deg);
	color: #FDFBDD;
	background-color:#BB50BC;
	border-radius:15px;
	border:3px solid #FFFFFF;
	-webkit-box-shadow:-5px 5px 4px rgba(72,72,72,1);
	-moz-box-shadow:-5px 5px 4px rgba(72,72,72,1);
	box-shadow:-5px 5px 4px rgba(72,72,72,1);
	z-index:1;
	}
#botoDreta:hover{
	opacity:0.7;
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-ms-transform:rotate(0deg);
	-o-transform:rotate(0deg);
	transform:rotate(0deg);
	}
a {
	cursor: url(../imatges_72/BummiCursor48x48.png), pointer;
	color: #FF6;
	text-decoration: none;
}
#footer{
	position:relative;
	font-family:"NunitoB";
	letter-spacing:-1px;
	text-align: center;
	margin-bottom:0;
	color:#00BCE4;
	font-size:1.5em;
	height: 144px;
	width: 800px;
	}
.paddingAdalt{
	padding-top:5px;}
	
.fltrt {
	position:absolute;
	top:90px;
	right:20px;
	}
.fltlft {
	position:absolute;
	top:90px;
	left:20px;
}
.botoEsquerra{
	font-size:0.8em;
		}
.botoDreta{
	font-size:0.8em;
		}