@charset "utf-8";
/* CSS Document */
@charset "utf-8";
/* CSS Document */
@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 BReplay, Verdana, Arial, Helvetica, sans-serif;
	background: #00BCE4;
	background-image: url(../imatges_72_2a_pintar/prova_fondo_4_1725_960.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: #ffe6ff;
	background-image:
	 url(../imatges_72_2a_pintar/800x600/header_798x141.png),
	 url(../imatges_72_2a_pintar/800x600/passatemps_2aPINTAR_2_TrompetaPETITA.jpg);
	margin: 0 auto;
	background-repeat: no-repeat;
}
#header{
	height: 146px;
	width: 800px;
	}

.bocadillo2{
position:relative;
	top:28px;
	left:250px;
	width: 400px;
	opacity:0.9;
	}
#headerAnimacio{
	font-family:"FolksB", serif;
	font-size: 1em;
	text-align: center;
	color:#35981d;
	height: 50px;
	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:0px; top:0px;}
				50%{ left:-100px; top:0px;}
				100%{ left:0px; top:0px;}
		}
		@-webkit-keyframes primeraAnimacion{
				0%{left:0px; top:0px;}
				50%{ left:-100px; top:0px;} 					
				100%{ left:0px; top:0px;}	
		}
		@-moz-keyframes primeraAnimacion{
				0%{  left:0px; top:0px;}
				50%{ left:-100px; top:0px;}
				100%{ left:0px; top:0px;}
		}

}
.content{
	width:800px;
	height:279px;
	
	}
#col_Esq{
	cursor: url(../imatges_72_2a_pintar/BummiCursorBocadillo64x64.png), pointer;
	position:relative;
	float: left;
	width: 355px;
}
.animacioBimme{
	
				animation: bimme 20s;
				animation-iteration-count:infinite;
				-webkit-animation: bimme 20s;
				-webkit-animation-iteration-count:infinite;
				-moz-animation: bimme 20s;
				-moz-animation-iteration-count:infinite;
				}
			@keyframes bimme {

		0%{
    transform: rotate(0deg);
  }
  25% { 
    transform: rotate(10deg);
  }
   50% { 
    transform: rotate(0deg);
  }
  100% { 
    transform: rotate(10deg);
  }
		}
		@-webkit-keyframes bimme {

		0%{
    -webkit-transform: rotate(0deg);
  }
  25% { 
    -webkit-transform: rotate(10deg);
  }
   50% { 
    -webkit-transform: rotate(0deg);
  }
  100% { 
    -webkit-transform: rotate(10deg);
  }
		}
			@-moz-keyframes bimme {

		0%{
    -moz-transform: rotate(0deg);
  }
  25% { 
    -moz-transform: rotate(10deg);
  }
   50% { 
    -moz-transform: rotate(0deg);
  }
  100% { 
    -moz-transform: rotate(10deg);
  }
		}




.capBimme {
     left:73px;
	 top:-56px;
     position: absolute;
     z-index: 3;
	width:189px;
z-index:33;
	
	
}
.capBimmeUllsTancats {
     left:73px;
	 top:-56px;
     position: absolute;
     z-index: 3;
	width:189px;
z-index:32;	
	
}
.cosBimme {
     top:44px;
     left:76px;
     position: absolute;
     z-index:2;
	  width: 243px;
z-index:30;	
	
	 
}

#col_Dret{
	float: right;
position:relative;
	width: 339px;
	height: 339px;
}
#botoEsquerra{
	position:absolute;
	left:100px;
	top:0px;
	font-family:"NunitoB";
	letter-spacing:0.9px;
	/*line-height:1.2em;*/
	text-align:center;
	font-size:.72em;
	width: 155px; 
	height: 40px;
	padding-top:12px;
	-webkit-transform:rotate(-10deg);
	-moz-transform:rotate(-10deg);
	-ms-transform:rotate(-10deg);
	-o-transform:rotate(-10deg);
	transform:rotate(-10deg);
	background-color:#8ad561;
	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);
	z-index:1;-webkit-z-index:1);
	}
.textColor{
	color: #FFF;}
a {
	cursor: url(../imatges_72_2a_pintar/BummiCursor48x48.png), pointer;
	color: #E00;
	text-decoration: none;
}
#footer{
	position:relative;
	background:url(../imatges_72_2a_pintar/800x600/footer_798x141.png);
	background-repeat:no-repeat;
	clear:both;
	color:#00BCE4;
	font-size:1.7em;
	line-height:30px;
	height: 175px;
	width: 800px;
z-index:33;
	}
.paddingAdalt{
	padding-top:30px;}
.fltlft2{
	cursor: url(../imatges_72_2a_pintar/BummiCursorBocadillo64x64.png),pointer;
	position:relative;
	left:90px;
	bottom:10px;
	width: 213px;
	height: 338px;
}

.noPintar {
     background-color:transparent;
     height: 450px;
     position: absolute;
     right: 0px;
     top: -445px;
     width: 150px;
}

.noPintar {
     background-color:transparent;
     height: 450px;
     position: absolute;
     right: 0px;
     top: -445px;
     width:130px;
}

.noPintar2 {
     background-color:transparent;
     height: 150px;
     left: 350px;
     position: absolute;
     top: -445px;
     width: 440px;
}

.noPintar3 {
     background-color:transparent;
     height: 160px;
     left: 350px;
     position: absolute;
     top: -70px;
     width: 440px;
}

.noPintar4 {
     background-color:transparent;
     height: 500px;
     position: absolute;
     right: 430px;
     top: -445px;
     width: 100px;
}
#lienzoId{

	position:absolute;
left:-120px;
top:-70px;
	height:309px;
	width:260px;	
	z-index:1;
}
#can{
	
  	cursor: url(../imatges_72_2a_pintar/cursorLlapis128x128.png),pointer;
		 }
.TriangleEsq{
	position:absolute;
	left:235px;
	top:67px;
	height:30px;
	width:30px;
	z-index:2;
			}
.TriangleDret{
	position:absolute;
	left:275px;
	top:67px;
	height:30px;
	width:30px;
	z-index:2;
	}
.menu{
	position:absolute;
	top:0px;
	left:360px;
	top:0px;
	width: 340px;
	height: 109px;
	}
.VinyetaEsq{
position:absolute;
left:-10px;
top:5px;
width:100px;
height:90%;
}
.VinyetaCen{
position:absolute;
left:92px;
top:3px;
width:100px;
height:90%;
}
.VinyetaDre{
position:absolute;
left:193px;
top:2px;
width:100px;
height:90%;
}


