@charset "utf-8";
/* CSS Document */

/**
 * Cette feuille de styles gère l'apparence de la pagination des pages de listes
 */

/*
 * HEXA COLORS
    Gris TF : 646665
    Gris : C9C9C9
    Gris clair : EEE8E6
    
    Bleu foncé : 0C78A3
    Bleu TF : 00B6DC
    Bleu : 0099D4
    Bleu clair : 80CCE9
    Bleu pale : D9F4FA
    
    Jaune : FFF500
*/

/*/////////// CONVERT FONT SIZE REM ////////////*/
/*
100% >> 16px
9px		.563rem			56.3%		9/16
11px	.688rem			68.8%		9/16
13px	.813rem			81.3%		13/16
16px	1.000rem		100.0%		16/16
21px	1.313rem		131.3%		21/16
24px	1.500rem		150.0%		24/16
*/

/*
==================================================
	Table of Contents / Sommaire
==================================================
    #Mobile (Portrait)	// 320px
	#Mobile (Landscape)	// 576px
    #Tablet (Portrait)	// 768px
	#Tablet (Landscape)	// 992px
	#Computer			// 1200px+  > 1250 + scrollbar 
*/

/*
==================================================
	Mobile (Portrait)	// 320px
==================================================
	Pas besoin de déclarer de média queries
*/
ul.foliotage {
	float:right;
	background:#CCC;
	
	/* Rounded corners */
	-moz-border-radius:		0 0 5px 5px;	
	-webkit-border-radius:	0 0 5px 5px;	
	-o-border-radius:		0 0 5px 5px;	
	-khtml-border-radius:	0 0 5px 5px;
	-ms-border-radius:		0 0 5px 5px;	
	-chrome-border-radius:	0 0 5px 5px;
	border-radius:			0 0 5px 5px;
	
	/* Shadow box */
	-moz-box-shadow:		0 -5px 50px 5px rgba(0,0,0,1) inset;
	-webkit-box-shadow:		0 -5px 50px 5px rgba(0,0,0,1) inset;
	-ms-box-shadow:			0 -5px 50px 5px rgba(0,0,0,1) inset;
	-chrome-box-shadow:		0 -5px 50px 5px rgba(0,0,0,1) inset;
	-o-border-box-shadow:	0 -5px 50px 5px rgba(0,0,0,1) inset;
	-khtml-box-shadow:		0 -5px 50px 5px rgba(0,0,0,1) inset;
	box-shadow:				0 -5px 50px 5px rgba(0,0,0,1) inset;
}

ul.foliotage li {
	float:left;
	border-right:1px solid transparent;
}

ul.foliotage li:last-child {
	border-right:none;
}

ul.foliotage li span,
ul.foliotage li a,
ul.foliotage li a:link,
ul.foliotage li a:visited {
	padding:.35rem .613rem;
	background:url('/templates/masterA/design/responsivePublic/images/deg180_grisf.png') repeat-x left bottom #444;
	color:#CCC;
	font-weight:bold;
	
	/*Transition*/
	-moz-transition:		0;
	-webkit-transition:		0;
	-ms-transition:			0;
	-o-transition:			0;
	-khtml-transition:		0;
	-chrome-transition:		0;
	transition: 			0;
}

ul.foliotage li span {
	padding-left:.24rem;
	padding-right:.24rem;
	background:url('/templates/masterA/design/responsivePublic/images/deg180_grisf.png') repeat-x left -50px #666;
	color:#222;
}
/*
==================================================
	Mobile (Landscape)	// 576px
==================================================
*/
@media screen and (min-width: 576px) {


}/*/mediaquery*/


/*
==================================================
	Tablet (Portrait)	// 768px
==================================================
*/
@media screen and (min-width: 768px) {

ul.foliotage li span,
ul.foliotage li a,
ul.foliotage li a:link,
ul.foliotage li a:visited {
	padding:.613rem 1.313rem
}

ul.foliotage li a:hover,
ul.foliotage li a:active {
	background:#222;/*1B8ACE*/
	color:#FFF;
	
	/* Shadow box */
	-moz-box-shadow:		0 2px 7px 2px rgba(0,0,0,.2) inset;
	-webkit-box-shadow:		0 2px 7px 2px rgba(0,0,0,.2) inset;
	-ms-box-shadow:			0 2px 7px 2px rgba(0,0,0,.2) inset;
	-chrome-box-shadow:		0 2px 7px 2px rgba(0,0,0,.2) inset;
	-o-border-box-shadow:	0 2px 7px 2px rgba(0,0,0,.2) inset;
	-khtml-box-shadow:		0 2px 7px 2px rgba(0,0,0,.2) inset;
	box-shadow:				0 2px 7px 2px rgba(0,0,0,.2) inset;
	
/*Transition*/
	-moz-transition:		all .35s ease;
	-webkit-transition:		all .35s ease;
	-ms-transition:			all .35s ease;
	-o-transition:			all .35s ease;
	-khtml-transition:		all .35s ease;
	-chrome-transition:		all .35s ease;
	transition: 			all .35s ease;
}

ul.foliotage li span {
	padding-left:.813rem;
	padding-right:.813rem;
}

}/*/mediaquery*/


/*
==================================================
	Tablet (Landscape)	// 992px
==================================================
*/
@media screen and (min-width: 992px) {


}/*/mediaquery*/


/*
==================================================
	Computer	// 1200px+  > 1250 + scrollbar 
==================================================
*/
@media screen and (min-width: 1200px) {

}/*/mediaquery*/


/*//////////////////////////////////// RAPPEL CSS 3 ///////////////////////////////////////*/
	/* Rounded corners 
	-moz-border-radius:		5px;	
	-webkit-border-radius:	5px;	
	-o-border-radius:		5px;	
	-khtml-border-radius:	5px;
	-ms-border-radius:		5px;	
	-chrome-border-radius:	5px;
	border-radius:			5px;*/
	
	/* Shadow box 
	-moz-box-shadow:		0 2px 2px rgba(0,0,0,.5);
	-webkit-box-shadow:		0 2px 2px rgba(0,0,0,.5);
	-ms-box-shadow:			0 2px 2px rgba(0,0,0,.5);
	-chrome-box-shadow:		0 2px 2px rgba(0,0,0,.5);
	-o-border-box-shadow:	0 2px 2px rgba(0,0,0,.5);
	-khtml-box-shadow:		0 2px 2px rgba(0,0,0,.5);
	box-shadow:				0 2px 2px rgba(0,0,0,.5);*/
	
	/* Shadow Text 
	-moz-text-shadow:		0 2px 2px rgba(0,0,0,.5);
	-webkit-text-shadow:	0 2px 2px rgba(0,0,0,.5);
	-ms-text-shadow:		0 2px 2px rgba(0,0,0,.5);
	-chrome-btextox-shadow:	0 2px 2px rgba(0,0,0,.5);
	-o-border-text-shadow:	0 2px 2px rgba(0,0,0,.5);
	-khtml-text-shadow:		0 2px 2px rgba(0,0,0,.5);
	text-shadow:			0 2px 2px rgba(0,0,0,.5);*/
	
	/*Transition
	-moz-transition:		all .3s ease;
	-webkit-transition:		all .3s ease;
	-ms-transition:			all .3s ease;
	-o-transition:			all .3s ease;
	-khtml-transition:		all .3s ease;
	-chrome-transition:		all .3s ease;
	transition: 			all .3s ease;*/
	
	/*ease // linear // ease-in // ease-out // ease-in-out */
	
	/*Transform
	-webkit-transform: 	scale(1);
   -moz-transform: 		scale(1);
   -o-transform: 		scale(1);
   transform: 			scale(1);*/
	
	/*Opacity
	opacity : 1;
    -moz-opacity : 1;
    -ms-filter: "alpha(opacity=100)"; /* IE 8 *//*
    filter : alpha(opacity=100); /* IE < 8 */