/* Links */		
a { text-decoration: underline; color: #2b2b2b; }
a:hover { text-decoration: underline; color: #fff; }
		
a2 { text-decoration: underline; color: #2b2b2b; cursor: pointer; }
a2:hover { text-decoration: underline; color: #666; }
	
/* Tipos */
bold { font-weight: bold; }
strong { color: #2b2b2b; font-weight: normal; }
strong_p { line-height: 1.8em ; text-align: center; color: #fff; font-weight: bold; }
strong2 { color: #cc6600; font-weight: normal; }
strong3 { text-align: center; color: #fff; font-weight: bold; }
strong4 { color: #2b2b2b; font-weight: normal; font-size: 22px; }
/*big { font-size: 21px; font-weight: bold; }*/
blue { font-size: 21px;	color: #33cccc; font-weight: bold; }
big { font-size: 28px; line-height: 1.4em; font-weight: normal; }
big2 { font-size: 42px; line-height: 1.5em; font-weight: normal; }
linespace { line-height: 1.4em; }
linespace2 { line-height: 1.5em; }
linegheightsmall { line-height: 0.5em; }

p {}

h1 { font-size: 18px; color:#666; font-weight: normal; }
h2 { font-size: 11px; color:#666; font-weight: normal; margin-top: -18px; }

/* Tipografia */
	
.theserif { font-family: 'theserif',georgia; }
.thesans { font-family: 'thesans',arial; }

/* Bombolla */
.bombolla_s, .bombolla_s2 { font-family: 'thesans',arial; color: #fff; text-align: center; position: absolute; display:inline-block; max-width:300px; min-height:1.5em; padding: 20px; 

/* /* fallback *!/
  background-color: #2F2727;
  background-image: url(images/radial_bg.png);
  background-position: center center;
  background-repeat: no-repeat;

  /* Safari 4-5, Chrome 1-9 *!/
  /* Can't specify a percentage size? Laaaaaame. *!/
  background: -webkit-gradient(radial, center center, 0, center center, 460, from(rgba(245, 140, 37, .9)), to(rgba(215, 105, 0, .9)));

  /* Safari 5.1+, Chrome 10+ *!/
  background: -webkit-radial-gradient(circle, rgba(245, 140, 37, .9), rgba(215, 105, 0, .9));

  /* Firefox 3.6+ *!/
  background: -moz-radial-gradient(circle, rgba(245, 140, 37, .9), rgba(215, 105, 0, .9));

  /* IE 10 *!/
  background: -ms-radial-gradient(circle, rgba(245, 140, 37, .9), rgba(215, 105, 0, .9));

  /* Opera couldn't do radial gradients, then at some point they started supporting the -webkit- syntax, how it kinda does but it's kinda broken (doesn't do sizing) *!/*/
  
   /* fallback */
   background-color: rgba(245, 140, 37, 1);
 
   /* Safari 4-5, Chrome 1-9 */
   background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(245, 140, 37, 1)), to(rgba(195, 95, 0, 1)));
 
   /* Safari 5.1, Chrome 10+ */
   background: -webkit-linear-gradient(top, rgba(245, 140, 37, 1), rgba(195, 95, 0, 1));
 
   /* Firefox 3.6+ */
   background: -moz-linear-gradient(top, rgba(245, 140, 37, 1), rgba(195, 95, 0, 1));
 
   /* IE 10 */
   background: -ms-linear-gradient(top, rgba(245, 140, 37, 1), rgba(195, 95, 0, 1));
 
   /* Opera 11.10+ */
   background: -o-linear-gradient(top, rgba(245, 140, 37, 1), rgba(195, 95, 0, 1));

-webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; z-index: 10; }
.bombolla_s:after { content: ""; position: absolute; bottom: -15px; left: 55%; border-style: solid; border-width: 15px 15px 0; border-color: rgba(195, 95, 0, 1) transparent; display: block; width: 0; z-index: 1; }

.bombolla_s2:after {  }

.bombolla_i { position: absolute; display:inline-block; width: 300px; height: 400px; background-color: #ccc; opacity: 0.2; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; z-index: 10; }

.bombolla { font-family: 'thesans',arial; color: #fff; text-align: center; position: absolute; display:inline-block; max-width:250px; min-height:1.5em; padding: 15px; 
 
  /* fallback */
  background-color: #564536; 

  /* Safari 4-5, Chrome 1-9 */
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7c6652), to(#564536));

  /* Safari 5.1, Chrome 10+ */
  background: -webkit-linear-gradient(top, #7c6652, #564536);

  /* Firefox 3.6+ */
  background: -moz-linear-gradient(top, #7c6652, #564536);

  /* IE 10 */
  background: -ms-linear-gradient(top, #7c6652, #564536);

  /* Opera 11.10+ */
  background: -o-linear-gradient(top, #7c6652), #564536);

-webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; z-index: 10; cursor: pointer; }
.bombolla:after { content: ""; position: absolute; bottom: -15px; left: 45%; border-style: solid; border-width: 15px 15px 0; border-color: #564536 transparent; display: block; width: 0; z-index: 1; }
.bombolla-bg { font-family: 'thesans',arial; color: #fff; text-align: center; position: absolute; display:inline-block; max-width:250px; min-height:1.5em; padding: 30px; background-color:#c2a387; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; z-index: 10; }

.b_right { }
.b_right:after { left: 30%; }

.b_small { }
.b_small:after { left: 35%; }

/* Buttons */
.round-button { font-family: 'thesans',arial; font-size:14px; font-weight:bold; text-align:center; color:#f5f5f5; text-decoration:none; display:block; width:35px; height:35px; line-height:35px; border: 2px solid #f5f5f5; border-radius: 50%; background: #bbb; box-shadow: 0 0 5px gray; cursor: pointer; }
.round-button:hover { background: #999; }

.mesinfo { font-family: 'thesans',arial; font-size:14px; font-weight:bold; text-align:center; color:#fff; text-decoration:none; display:block; width:35px; height:35px; line-height:35px; border: 5px solid #c2a387; border-radius: 50%; background: #564536; box-shadow: 0 0 0px gray; cursor: pointer; }
.mesinfo:hover { background: #c2a387; }

.mesi { font-family: 'thesans',arial; font-size:28px; font-weight:bold; text-align:center; color:#564536; text-decoration:none; display:block; width:35px; height:35px; line-height:35px; background: transparent; box-shadow: 0 0 0px gray; cursor: pointer; }
.mesi:hover { color: #c2a387; }

.explicacio { font-family: 'thesans',arial; font-size:14px; color: #fff; line-height: 1.3em; text-align: left!important; font-weight: normal; text-decoration:none; display:block; max-width: 500px; }

.abaix { font-family: 'thesans',arial; font-size:16px; color: #666; line-height: 1.3em; text-align: center!important; font-weight: normal; text-decoration:none; display:block; width:25px; height:25px; border: 0px solid transparent; border-radius: 50%; background: #564536; box-shadow: 0 0 0 gray; cursor: pointer; }
.abaix_ac { background: #c2a387; cursor: default; color: #fff; }

.b_next { display:block; width:40px; height:40px; border: 0px solid #f5f5f5; border-radius: 50%; background: #bbb; cursor: pointer; }
.b_next:hover { background: #999; }

/* Estructura */
body { font-family: 'thesans',arial; font-size: 16px; line-height: 1.2em; color:#666; background: #f0f0f0; }		
	#contingut { width: 940px; height: 670px; background-color: #6daac6; /*background: url(images/linear_bg_2.png); HAY QUE CREARLA*/ background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#6daac6), to(#fff)); background: -webkit-linear-gradient(top, #fff, #6daac6); background: -moz-linear-gradient(top, #fff, #6daac6); background: -ms-linear-gradient(top, #fff, #6daac6); background: -o-linear-gradient(top, #fff, #6daac6); position:absolute; margin:auto; top:0; left:0; right:0; bottom:0; box-shadow: 1px 1px 2px #cccccc, 0 0 25px #cccccc, 0 0 5px #cccccc; }		
		.lacaixa { width: 940px; height: 60px; background-color: #fff; position: relative; z-index: 10000; }			
			.titol { width: 940px; height: 60px; text-align: center; position: absolute; padding-top: 6px; }	
			.logo-titol { position: absolute; }				
				.logo-titol-1 { width: 160px; height: 60px; left: 0; }					
				.logo-titol-2 { width: 90px; height: 60px; right: 0; padding-top: 6px; font-size: 13px; line-height: 13px; color:#666; font-weight: lighter; }					
				.logo-titol-3 { width: 60px; height: 50px; right: 100px; border-right: 1px dotted #666; margin-top: 5px; }					
			.footer { position: absolute; bottom: 0px; }				
				.logo-footer { position: absolute; left: 370px; }					
				.credits { width: 60px; height: 50px; left: 840px; margin-top: 11px; }			
		#credits-bg { width: 940px; height: 610px; background-color: rgba(255, 255, 255, 1); position: absolute; bottom: 0; z-index: 9000; }		
	#menu { line-height: 43px; width: 940px; height: 48px; position: absolute; bottom: 60px; background-color: #4b93b6 ; z-index: 8000; }	
	.notebook{ position: absolute; }	
	.btn { padding:0 29px 0 29px; margin:0; text-decoration:none; text-align:center; color: #ccc; cursor:pointer; background-color: #4b93b6; border-bottom:5px solid #367f9d; transition-property:border-bottom .6s linear 0s; -moz-transition:border-bottom .6s linear 0s; -webkit-transition:border-bottom .6s linear 0s; -o-transition:border-bottom .6s linear 0s; font-size:17px; font-family: 'thesans',arial; }
	.btn.active { border-bottom:5px solid rgb(245, 140, 37); transition-property:border-bottom .6s linear 0s; -moz-transition:border-bottom .6s linear 0s; -webkit-transition:border-bottom .6s linear 0s; -o-transition:border-bottom .6s linear 0s; color:#fff; }
	.btn:hover { border-bottom:5px solid rgb(245, 140, 37); transition-property:border-bottom .6s linear 0s; -moz-transition:border-bottom .6s linear 0s; -webkit-transition:border-bottom .6s linear 0s; -o-transition:border-bottom .6s linear 0s; text-decoration: none; }
	#menu li { display:inline-block; list-style:none; padding:0; margin-right:-3px; zoom:1; background:#ccc; z-index: 8900; }
	#menu li .btn { float:left; }
	#interactiu { width: 940px; height: 550px; background-color: #6daac6; /*background: url(images/linear_bg_2.png); HAY QUE CREARLA*/ background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#6daac6), to(#fff)); background: -webkit-linear-gradient(top, #fff, #6daac6); background: -moz-linear-gradient(top, #fff, #6daac6); background: -ms-linear-gradient(top, #fff, #6daac6); background: -o-linear-gradient(top, #fff, #6daac6); position: relative; opacity: 0; }