/* Definicin de variables de color */
	
	:root {
	 
	/* fons */

	 --f-body:  #8e8e8e;  		/*body*/	 
	 --f-caps:  #000; 		/*capsalera*/
	 --f-menu1: #000;			/*menu*/
	 --f-menu2: #000; 			/*submenu b*/
	 --f-menu3: #000; 			/*submenu c...*/
	 --f-main:  #c04217; 	/*main*/
	 --f-mainb: #f7f6eb; 		/*main blocs*/
	 --f-button: #000; 		/*butons*/		 		
	 --f-foot:  #4d3725; 		/*footer*/ 
 
	/* text */	
		
	 --txt-body:  #fff;
	 --txt-caps:  #fff;
	 --txt-menu1: #fff;
	 --txt-menu2: #fff;
	 --txt-menu3: #fff;	 	 
	 --txt-main:  #fff;
	 --txt-mainb: #000;
	 --txt-button: #fff;	 	 
	 --txt-foot:  #ffffff;
		
		
	/* links */	
		
	 --lk-txt-body:  #fff;	 
	 --lk-txt-caps:  #ffffff;
	 --lk-txt-menu1: #fff;
	 --lk-txt-menu2: #fff;
	 --lk-txt-menu3: #fff;	 	 
	 --lk-txt-main:  #fff;
	 --lk-txt-mainb: #000;
	 --lk-txt-button: #f7f6eb;		 	 
	 --lk-txt-foot:  #fff;
		
	/* fons links */	
		
	 --lk-f-body:  #ffffff;
	 --lk-f-caps:  #ffffff;
	 --lk-f-menu1: #000;
	 --lk-f-menu2: #fff;
	 --lk-f-menu3: #354b72;	 	 
	 --lk-f-main:  #ffffff;
	 --lk-f-mainb: #0d0d0d;
	 --lk-f-button: #000;	  
	 --lk-f-foot:  #ffffff;

		
	/* link hovers */	
		
	 --lk-txt-h-body:  #000;
	 --lk-txt-h-caps:  #ffffff;
	 --lk-txt-h-menu1: #fff;
	 --lk-txt-h-menu2: #c04217;
	 --lk-txt-h-menu3: #c04217; 	 
	 --lk-txt-h-main:  #ffbe09;
	 --lk-txt-h-mainb: #c04217;
	 --lk-txt-h-button: #000;	  
	 --lk-txt-h-foot:  #ffffff;	
		
	 
	/* fons hovers */	
		

	 --lk-f-h-body:  #ffffff;
	 --lk-f-h-caps:  #4d4d4d;
	 --lk-f-h-menu1: #c04217;
	 --lk-f-h-menu2: #fff;	 
	 --lk-f-h-menu3: #000;
	 --lk-f-h-main:  #c04217;
	 --lk-f-h-mainb: #ffffff;
	 --lk-f-h-button: #f7f6eb;	 
	 --lk-f-h-foot:  #ffffff;	 

	/* especials */

	 --e1: #f0d6d6;
     --e2: #ffbb73;

	/* caixes */
		
	  --bor-main: #fff;
	  --bor-table: #000;	
	  --bor-foot: #fff;	
	  
	  		
	}



.change_svg{
	
	filter: brightness(0) saturate(100%) invert(100%) sepia(76%) saturate(1%) hue-rotate(162deg) brightness(103%) contrast(101%);
}

	#gradient {
		
		/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+46,000000+46&0.92+0,0+46 */
		background: linear-gradient(to right,  var(--f-caps) 15%,rgba(0,0,0,0) 40%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}

	body {
	
		 
		
		  /* The image used */
	   /*background-image: url("https://liberisliber.com/images/maquetacio_web/2016/fons_blur.jpg");*/
		
		/* Full height */
	
	
		background-color: var(--f-body);
	
		/* Create the parallax scrolling effect */
		background-attachment: fixed;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		
	
	}	
	form .svg{
		filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(359deg) brightness(111%) contrast(105%);
}	
	
	table .svg{
filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(20%) hue-rotate(358deg) brightness(95%) contrast(105%);
}	
	#social_nav svg{

}	

	.wrap_mobile {
		
		/*! background-image: url(https://liberisliber.com/images/maquetacio_web/2016/capsalera-web.jpg); */
		background-size: 100%;
		background-position:35% 40%;
		background-repeat: no-repeat;
		background-color:black;
		/*  */
}


	#deco_img {

		background-image: url("https://liberisliber.com/images/maquetacio_web/2016/liberis-2016-760.jpg");
        background-size: auto 100%;
        background-position: 100% 100%;
        z-index: 2;
	}
	    main {
       /*! background-image: url(https://liberisliber.com/images/maquetacio_web/2016/fons-bottom.jpg); */
       background-size: 130%;
       background-position: bottom;
       background-repeat: no-repeat;
       
    
    }
@media screen and (min-width: 760px) {
	
	
			.wrap_mobile {
		
		background-image: initial;

	
}
	form .svg{
		filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(359deg) brightness(111%) contrast(105%);
}	
	
	table .svg{
filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(20%) hue-rotate(358deg) brightness(95%) contrast(105%);
}	
		#deco_img{
		 display: block;
	     position:  absolute;
		    top:0;
				width:100%;
		    height:250px;
				
				/*Insert a background image*/
				background: transparent URL('https://liberisliber.com/images/maquetacio_web/2016/liberis-2016-760.jpg') ;
        background-size:  cover;
				/*Give the animation a name,  and set it's duration to 10 seconds*/
				-webkit-animation: myAnimation 50s; /* Chrome,  Safari,  Opera */ 
				animation: myAnimation 30s; /* Standard syntax */ 
				background-repeat: no-repeat;
				/*Make the animation repeat*/
				-webkit-animation-iteration-count: infinite; /* Chrome,  Safari,  Opera */ 
				animation-iteration-count: infinite; /* Standard syntax */
	     
	clip:auto;
			}
	
	
}

@media screen and (min-width: 700px) and (min-height: 300px) {
	
	
		#deco_img{
	   
			  position:  absolute;
		    
			top:0;
			width:100%;
	   /* height:120px; */
				
				/*Insert a background image*/
				background: transparent URL('https://liberisliber.com/images/maquetacio_web/2016/liberis-2016-760.jpg') ;
        background-size:  cover;
			background-position: 100%;
				/*Give the animation a name,  and set it's duration to 10 seconds*/
				-webkit-animation: myAnimation 50s; /* Chrome,  Safari,  Opera */ 
				animation: myAnimation 30s; /* Standard syntax */ 
				background-repeat: no-repeat;
				/*Make the animation repeat*/
				-webkit-animation-iteration-count: infinite; /* Chrome,  Safari,  Opera */ 
				animation-iteration-count: infinite; /* Standard syntax */
	     
	clip:auto;
			}
	
	
}

@media screen and (min-height: 760px) {
	
	
		#deco_img{
	     position:  absolute;
		    top:0;
				width:100%;
		    height:250px;
				
				/*Insert a background image*/
				background: transparent URL('https://liberisliber.com/images/maquetacio_web/2016/liberis-2016-760.jpg') ;
        background-size:  cover;
				/*Give the animation a name,  and set it's duration to 10 seconds*/
				-webkit-animation: myAnimation 50s; /* Chrome,  Safari,  Opera */ 
				animation: myAnimation 30s; /* Standard syntax */ 
				background-repeat: no-repeat;
				/*Make the animation repeat*/
				-webkit-animation-iteration-count: infinite; /* Chrome,  Safari,  Opera */ 
				animation-iteration-count: infinite; /* Standard syntax */
	     
	clip:auto;
			}
	
	
}

@media screen and (min-width: 1024px) {
	

	#deco_img{
	     position:  absolute;
	     top:0;
	     width:100%;
	     /* height:230px; */
				
				/*Insert a background image*/
	     background: transparent URL('https://liberisliber.com/images/maquetacio_web/2016/liberis-2016-1280.jpg');
	     background-size:  cover;
				/*Give the animation a name,  and set it's duration to 10 seconds*/
	     -webkit-animation: myAnimation 50s; /* Chrome,  Safari,  Opera */
	     animation: myAnimation 30s; /* Standard syntax */
	     background-repeat: no-repeat;
				/*Make the animation repeat*/
	     -webkit-animation-iteration-count: infinite; /* Chrome,  Safari,  Opera */
	     animation-iteration-count: infinite; /* Standard syntax */
	     clip:auto;
	  }
			
			
				/* Chrome,  Safari,  Opera  @-webkit-keyframes myAnimation{}*/ 
	  
			 

			
			/*Standard syntax*/
			@keyframes myAnimation{
				
    			0% {background-position: 0px 0;} 
    			
    	
    			
    			24.9% {background-position: 0px 12%;}  /*fi primera foto */
    			
  
    			
    			25% {background-position:0px 30% ;} /* inici segona foto */
    			
 
    			
    			49.9% {background-position: 0px 40%;} /* fi segona foto */
    			
    		
    			
    			50% {background-position: 0px 60%;} /* inici tercera foto */
    			
    		
    			
    			74.9% {background-position: 0px 70%;} /* fi tercera foto */
				
			
				
					75% {background-position: 0px 90%;} /* inici cuarta foto */
    			
    	
    			
    			100% {background-position: 0px 100%;} /* fi cuarta foto */
				
			}
#deco_img img{
	
	position: absolute;
	clip: rect(1px,1px,1px,1px);
	clip: rect(1px 1px 1px 1px);
}		


}


@media screen and (min-width: 1590px) {
	




	#deco_img{
		
		/*! height:200px; */
				
				/*Insert a background image*/
				background: transparent URL('https://liberisliber.com/images/maquetacio_web/2016/liberis-2016-1600.jpg') no-repeat;
	     background-size:  cover;

	}
	

	


}
@media screen and (min-width: 1900px) {
	



	#deco_img{
		
	
						/*Insert a background image*/
				background: transparent URL('https://liberisliber.com/images/maquetacio_web/2016/liberis-2016-1920.jpg') no-repeat 0px 0px;
	 background-size:  cover;
	
	}
	

}