*{box-sizing: border-box; margin:0; padding:0;}

@keyframes slideInFromLeft {
  0% {
    transform: translateX(-15%);
    opacity:0;
  }
  100% {
    transform: translateX(0);
    opacity:100;
  }
}
@keyframes slideInFromRight {
  0% {
    transform: translateX(15%);
    opacity:0;
  }
  100% {
    transform: translateX(0);
    opacity:100;
  }
}
section .fromRight{  
  animation: 0.5s ease-out 0s 1 slideInFromRight;
}
section .fromLeft{  
  animation: 0.5s ease-out 0s 1 slideInFromLeft;
}


/*	--agrupament-c1: #d4eecf; --castors-c1: #f2e6ff; --llops-c1: #eaeaea; --rangers-c1: #cbe5fd; --pioners-c1: #f9d4d4; --rovers-c1: #e5e2d3; --pares-c1: #a14aa6; --kraal-c1: #d6d6d6;
	--agrupament-c2: #91c378; --castors-c2: #e0c2ff; --llops-c2: #c7c7c7; --rangers-c2: #a6d4ff; --pioners-c2: #ffaaaa; --rovers-c2: #cec59c; --pares-c1: #84298a; --kraal-c2: #c7c7c7;
	--agrupament-c3: #407D22; --castors-c3: #be80ff; --llops-c3: #7F7F7F; --rangers-c3: #0085ff; --pioners-c3: #ff0000; --rovers-c3: #7F764D; --pares-c1: #810089; --kraal-c3: #000000;

	SAP: #F5C418*/

body{font-family: "Trebuchet MS", Verdana, sans-serif;}

/*HEADER*/
	header{	width: 100vw;}
	.agrupament header{background: linear-gradient(rgba(64,125,34,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover;	background-position: bottom;}
	#nadal{background: linear-gradient(rgba(0,35,255,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover;	background-position: bottom;}
	.castors header{background: linear-gradient(rgba(190,128,255,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover; background-position: bottom;}
	.llops header{background: linear-gradient(rgba(127,127,127,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover; background-position: bottom;}
	.rangers header{background: linear-gradient(rgba(0,133,255,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover; background-position: bottom;}
	.pioners header{background: linear-gradient(rgba(255,0,0,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover; background-position: bottom;}
	.rovers header{background: linear-gradient(rgba(127,118,77,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover; background-position: bottom;}
	.pares header{background: linear-gradient(rgba(129,0,137,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover; background-position: bottom;}
	.kraal header{background: linear-gradient(rgba(255,132,0,0.35),rgba(255,255,255,1)), url(../media/gfx/cover.jpg); background-size: cover; background-position: bottom;}
	.sap header{background: linear-gradient(rgba(245,196,24,0.35),rgba(75,75,75,1)), url(../media/gfx/cover.jpg); background-size: cover; background-position: bottom;}

	.header-gfx{display: block; margin:0 auto; padding:10px 0px 10px 0px;max-width: 90vw;}
		/*--MENU--*/
		#menu ul{text-align: center;}
		#menu li{display: inline-block; padding-bottom:2px; padding-top:4px; border-bottom: 3px solid rgba(0,0,0,0);}
		#menu li.agrupament.active{border-bottom: 3px solid #46a138;}
		#menu li.castors.active{border-bottom: 3px solid #be80ff;}
		#menu li.llops.active{border-bottom: 3px solid #7F7F7F;}
		#menu li.rangers.active{border-bottom: 3px solid #0085ff;}
		#menu li.pioners.active{border-bottom: 3px solid #ff0000;}
		#menu li.rovers.active{border-bottom: 3px solid #7F764D;}
		#menu li.pares.active{border-bottom: 3px solid #810089;}
		#menu li.kraal.active{border-bottom: 3px solid #ff8400;}
		
		.calendari li{display: inline-block; padding-bottom:2px; padding-top:4px;}
		
		.ico{display: block; margin:0 3px;
			padding: 5px;
			width:9.5vw; height:9.5vw;
			max-width:60px; max-height:60px;
			border-radius:50%; cursor: pointer;}
		.ico2{display: block; margin:0 3px;
			width:30px; height:30px;
			padding: 5px; border-radius:50%; cursor: pointer;}
		.ico.agrupament{background-color: #91c378;}
		.ico.agrupament:hover, .ico.agrupament.active{background-color: #46a138;}
		.ico.castors{background-color: #e0c2ff;}
		.ico.castors:hover, .ico.castors.active{background-color: #be80ff;}
		.ico.llops{background-color: #c7c7c7;}
		.ico.llops:hover, .ico.llops.active{background-color: #7F7F7F;}
		.ico.rangers{background-color: #a6d4ff;}
		.ico.rangers:hover, .ico.rangers.active{background-color: #0085ff;}
		.ico.pioners{background-color: #ff5454;}
		.ico.pioners:hover, .ico.pioners.active{background-color: #ff0000;}
		.ico.rovers{background-color: #cec59c;}
		.ico.rovers:hover, .ico.rovers.active{background-color: #7F764D;}
		.ico.pares{background-color: #84298a;}
		.ico.pares:hover, .ico.pares.active{background-color: #810089;}
		.ico.kraal{background-color: #ffaa4e;}
		.ico.kraal:hover, .ico.kraal.active{background-color: #ff8400;}

		.ico2.castors{background-color: #e0c2ff;}
		.ico2.castors:hover, .ico2.castors.active{background-color: #be80ff;}
		.ico2.llops{background-color: #c7c7c7;}
		.ico2.llops:hover, .ico2.llops.active{background-color: #7F7F7F;}
		.ico2.rangers{background-color: #a6d4ff;}
		.ico2.rangers:hover, .ico2.rangers.active{background-color: #0085ff;}
		.ico2.pioners{background-color: #ff5454;}
		.ico2.pioners:hover, .ico2.pioners.active{background-color: #ff0000;}
		.ico2.rovers{background-color: #cec59c;}
		.ico2.rovers:hover, .ico2.rovers.active{background-color: #7F764D;}
/*FOOTER*/
	footer{
		border-top: 2px solid black;
		padding: 40px;
		/*color: white;*/
		text-align: center;
	}
	.agrupament footer{background-color: #91c378; border-color: #46a138;}
	.castors footer{background-color: #e0c2ff; border-color: #be80ff;}
	.llops footer{background-color: #c7c7c7; border-color: #7F7F7F;}
	.rangers footer{background-color: #a6d4ff; border-color: #0085ff;}
	.pioners footer{background-color: #ff5454; border-color: #ff0000;}
	.rovers footer{background-color: #cec59c; border-color: #7F764D;}
	.pares footer{background-color: #84298a; border-color: #810089; color:white;}
	.kraal footer{background-color: #ffaa4e; border-color: #ff8400;}
	.sap footer{background-color: #4b4b4b; border-color: #F5C418; color: #F5C418;}
	.sap footer a{color: #ffffff;}
/*--SECCIONS--*/
	/*avislegal*/textarea{margin-top: 20px}
	section{padding: 20px 5vw;max-width:920px; margin: 0 auto;}
	h1{padding-top:10px; border-bottom: 2px solid black; text-align: center;}
	h2{border-bottom: 2px solid black; text-align: left;}
	section p{padding-top: 10px;}
	section ul{padding: 20px;}
	.novetats{text-align: 	center;}
	#inscripcio{
		text-decoration: none;
		display: block;
		margin: 10;
		padding: 10px;
		background-color: #91c378;
		color: black;
	}#inscripcio:hover{background-color: #46a138; color:white;}
	#inscripcio-inactive{
		text-decoration: none;
		display: block;
		margin: 10;
		padding: 10px;
		background-color: #ddd;
		color: black;
		
	}
	#sapBoto{
		text-decoration: none;
		display: block;
		margin: 10;
		padding: 10px;
		background-color: #F5C418;
		color: black;
	}#sapBoto:hover{background-color: #fff498; color:BLACK;}
	.miniatura{
		cursor: pointer;
		display: table;
		margin:10px;
		background-size: cover;
		background-position: center;
		width: 75vw; max-width: 200px;
		height: 75vw; max-height: 220px;
		position: relative;
		border-radius: 15px;
	}
	.moreButt{
		cursor: pointer;
		display: table;
		margin:10px;
		padding: 10px;
		width: 80%;
		position: relative;
		border-radius: 15px;
	}
	.castors div.moreButt{background-color: #f2e6ff;}.castors div.moreButt:hover{background-color: #e0c2ff;}
	.llops div.moreButt{background-color: #eaeaea;}.llops div.moreButt:hover{background-color: #c7c7c7;}
	.rangers div.moreButt{background-color: #cbe5fd;}.rangers div.moreButt:hover{background-color: #a6d4ff;}
	.pioners div.moreButt{background-color: #f9d4d4;}.pioners div.moreButt:hover{background-color: #ffaaaa;}
	.rovers div.moreButt{background-color: #e5e2d3;}.rovers div.moreButt:hover{background-color: #cec59c;}
	.miniaturaText{
		display: table-cell;
		vertical-align: bottom;
		position: absolute;
		top:70%;
		bottom:0px;
		right:0px;
		left:0px;
		background-color: rgba(255,255,255,0.5); 
		padding: 10px;
	}
	.miniatura:hover .miniaturaText{
		font-weight: bold;
		background-color: rgba(255,255,255,1); 
	}
	/*section.xarxes,section.kraal_monis,section.carrecs,section.banc,section.links,section.sap,*/
	section.center{text-align: center;}
	.agrupament h1,.agrupament h2,.agrupament h3{color: #46a138; border-color: #46a138;}
	.castors h1,.castors h2,.castors h3{color: #be80ff; border-color: #be80ff;}
	.llops h1,.llops h2,.llops h3{color: #7F7F7F; border-color: #7F7F7F;}
	.rangers h1,.rangers h2,.rangers h3{color: #0085ff; border-color: #0085ff;}
	.pioners h1,.pioners h2,.pioners h3{color: #ff0000; border-color: #ff0000;}
	.rovers h1,.rovers h2,.rovers h3{color: #7F764D; border-color: #7F764D;}
	.pares h1,.pares h2,.pares h3{color: #810089; border-color: #810089;}
	.kraal h1,.kraal h2,.kraal h3{color: #ff8400; border-color: #ff8400;}
	.sap h1,.sap h2,.sap h3{color: #F5C418; border-color: #F5C418; background-color: #4b4b4b;}
	section.xarxes div{max-width: 66vw; margin:0 auto;}
	section.xarxes a{text-decoration: none; color: #91c378;} section.xarxes a:hover{color: #46a138;}
	.banc span.ca{font-weight: bold; color: #be80ff;}
	.banc span.ll{font-weight: bold; color: #7F7F7F;}
	.banc span.ra{font-weight: bold; color: #0085ff;}
	.banc span.pi{font-weight: bold; color: #ff0000;}
	.banc span.ro{font-weight: bold; color: #7F764D;}
	.banc span.ge{font-weight: bold; color: #46a138;}
	.sapSeccio a{text-decoration: underline; color: #ff8400;}
	.sapSeccio a:hover{font-weight: bold;}
	.container-flex{
		display: flex;
		justify-content: space-around;
		flex-wrap: wrap;
	}
	.container-flex2{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.cal-mes{min-width: 200px;margin-top: 20px;}
	.cal-dia{line-height:1.5;}
	.obj-cat{margin-top: 20px;}
	.monis img{height:180px;}
	.kraal-moni{margin-top: 20px;text-align: center;}
	.castors div.cal-dia{background-color:#f2e6ff;}.castors div.cal-dia:nth-child(2n){background-color:#e0c2ff;}
	.llops div.cal-dia{background-color:#eaeaea;}.llops div.cal-dia:nth-child(2n){background-color:#c7c7c7;}
	.rangers div.cal-dia{background-color:#cbe5fd;}.rangers div.cal-dia:nth-child(2n){background-color:#a6d4ff;}
	.pioners div.cal-dia{background-color:#f9d4d4;}.pioners div.cal-dia:nth-child(2n){background-color:#ffaaaa;}
	.rovers div.cal-dia{background-color:#e5e2d3;}.rovers div.cal-dia:nth-child(2n){background-color:#cec59c;}