header('Content-type: text/css');
/* CSS Document */
/* https://jqueryui.com/demos/ */
html, body {
}
/* 
 * ****************
 * COLOUR VARIABLES 
 */
:root {

  /* var(--buttonDarker) */
  --white: 		#FFFFFF;
  --white100: 	color-mix( in srgb , var( --white , #FFFFFF ) 100% , transparent ); /* #FFFFFFFF */
  --white090: 	color-mix( in srgb , var( --white , #FFFFFF ) 90% , transparent ); /* #FFFFFFE6 */
  --white080: 	color-mix( in srgb , var( --white , #FFFFFF ) 80% , transparent ); /* #FFFFFFCC */
  --white070: 	color-mix( in srgb , var( --white , #FFFFFF ) 70% , transparent ); /* #FFFFFFB3 */
  --white060: 	color-mix( in srgb , var( --white , #FFFFFF ) 60% , transparent ); /* #FFFFFF99 */
  --white050: 	color-mix( in srgb , var( --white , #FFFFFF ) 50% , transparent ); /* #FFFFFF80 */
  --white040: 	color-mix( in srgb , var( --white , #FFFFFF ) 40% , transparent ); /* #FFFFFF66 */
  --white030: 	color-mix( in srgb , var( --white , #FFFFFF ) 30% , transparent ); /* #FFFFFF4D */
  --white020: 	color-mix( in srgb , var( --white , #FFFFFF ) 20% , transparent ); /* #FFFFFF33 */
  --white010: 	color-mix( in srgb , var( --white , #FFFFFF ) 10% , transparent ); /* #FFFFFF1A */
  --white000: 	color-mix( in srgb , var( --white , #FFFFFF ) 00% , transparent ); /* #FFFFFF00 */
  --whiteClear: #FFFFFF00;

  --greyGhost:	#F8F8F8;
  --greySmoke:	#F5F5F5;
  --greyLighter:#EEEEEE;
  --greyLight: 	#DDDDDD;
  --greySilver: #CCCCCC;
  --greyDark: 	#BBBBBB;
  --greyDarker:	#888888;
  --greyDim: 	#777777;

  --black: 		#000000FF;
  --black100: 	color-mix( in srgb , var( --black , #000000 ) 100% , transparent ); /* #000000FF */
  --black090: 	color-mix( in srgb , var( --black , #000000 ) 90% , transparent ); /* #000000E6 */
  --black080: 	color-mix( in srgb , var( --black , #000000 ) 80% , transparent ); /* #000000CC */
  --black070: 	color-mix( in srgb , var( --black , #000000 ) 70% , transparent ); /* #000000B3 */
  --black060: 	color-mix( in srgb , var( --black , #000000 ) 60% , transparent ); /* #00000099 */
  --black050: 	color-mix( in srgb , var( --black , #000000 ) 50% , transparent ); /* #00000080 */
  --black040: 	color-mix( in srgb , var( --black , #000000 ) 40% , transparent ); /* #00000066 */
  --black030: 	color-mix( in srgb , var( --black , #000000 ) 30% , transparent ); /* #0000004D */
  --black020: 	color-mix( in srgb , var( --black , #000000 ) 20% , transparent ); /* #00000033 */
  --black010: 	color-mix( in srgb , var( --black , #000000 ) 10% , transparent ); /* #0000001A */
  --black000: 	color-mix( in srgb , var( --black , #000000 ) 00% , transparent ); /* #00000000 */
  --blackClear: #00000000;

  --themeColour:	#C26A7A; /* dark pink */
  --themeColour100: color-mix( in srgb , var( --themeColour , #C26A7A ) 100% , transparent ); /* #C26A7AFF */
  --themeColour090: color-mix( in srgb , var( --themeColour , #C26A7A ) 90% , transparent ); /* #C26A7AE6 */
  --themeColour080: color-mix( in srgb , var( --themeColour , #C26A7A ) 80% , transparent ); /* #C26A7ACC */
  --themeColour070: color-mix( in srgb , var( --themeColour , #C26A7A ) 70% , transparent ); /* #C26A7AB3 */
  --themeColour060: color-mix( in srgb , var( --themeColour , #C26A7A ) 60% , transparent ); /* #C26A7A99 */
  --themeColour050: color-mix( in srgb , var( --themeColour , #C26A7A ) 50% , transparent ); /* #C26A7A80 */
  --themeColour040: color-mix( in srgb , var( --themeColour , #C26A7A ) 40% , transparent ); /* #C26A7A66 */
  --themeColour030: color-mix( in srgb , var( --themeColour , #C26A7A ) 30% , transparent ); /* #C26A7A4D */
  --themeColour020: color-mix( in srgb , var( --themeColour , #C26A7A ) 20% , transparent ); /* #C26A7A33 */
  --themeColour010: color-mix( in srgb , var( --themeColour , #C26A7A ) 10% , transparent ); /* #C26A7A1A */
  --themeColour000: color-mix( in srgb , var( --themeColour , #C26A7A ) 00% , transparent ); /* #C26A7A00 */
  --themeColourClear: #C26A7A00;

  /* lighter: mix 10% with white */
  --themeColourWhiter90: color-mix( in srgb , var( --themeColour , #C26A7A ) 90% , var( --white , #FFFFFF ) );
  --themeColourWhiter80: color-mix( in srgb , var( --themeColour , #C26A7A ) 80% , var( --white , #FFFFFF ) );
  --themeColourWhiter50: color-mix( in srgb , var( --themeColour , #C26A7A ) 50% , var( --white , #FFFFFF ) );
  --themeColourWhiter40: color-mix( in srgb , var( --themeColour , #C26A7A ) 40% , var( --white , #FFFFFF ) );
  --themeColourWhiter30: color-mix( in srgb , var( --themeColour , #C26A7A ) 30% , var( --white , #FFFFFF ) );
  --themeColourWhiter20: color-mix( in srgb , var( --themeColour , #C26A7A ) 20% , var( --white , #FFFFFF ) );
  --themeColourWhiter10: color-mix( in srgb , var( --themeColour , #C26A7A ) 10% , var( --white , #FFFFFF ) );

  --themeLight:   var( --themeColourWhiter90 , #C87987 );
  --themeLighter: var( --themeColourWhiter80 , #CE8895 );

  /* darker: mix 10% with black */
  --themeColourDarker90: color-mix( in srgb , var( --themeColour , #C26A7A ) 90% , var( --black , #000000 ) );
  --themeColourDarker80: color-mix( in srgb , var( --themeColour , #C26A7A ) 80% , var( --black , #000000 ) );
  --themeColourDarker50: color-mix( in srgb , var( --themeColour , #C26A7A ) 50% , var( --black , #000000 ) );
  --themeColourDarker20: color-mix( in srgb , var( --themeColour , #C26A7A ) 20% , var( --black , #000000 ) );
  --themeColourDarker10: color-mix( in srgb , var( --themeColour , #C26A7A ) 10% , var( --black , #000000 ) );

  --themeDark:	 var( --themeColourDarker90 , #AF5F6E );
  --themeDarker: var( --themeColourDarker80 , #9B5562 );
  --themeDarker70: color-mix( in srgb , var( --themeDarker , #9B5562 ) 70% , transparent );
  --themeDarker30: color-mix( in srgb , var( --themeDarker , #9B5562 ) 30% , transparent );
/*
  --themeDarker:#af5f6e;
  --themeDarker30:#af5f6e48;
  --themeDarker70:#af5f6eB3;
*/
  --lightColour:  #F7EBEB;
  --darkColour:  #C8B6B4; 

/* maybe text : #deb5a3 */

  --textWhite:  var( --white );
  --article:	var( --lightColour );
  --side: 		var( --darkColour );

  --selectedLighter:#FFFFEE;
  --selectedLight:	#FFFFCC;
  --selected:		#FFFFAA;
  --selectedHover: 	#FFFFEE; /* F2F2A2 */
  --selectedDark:	#CCCC88;

  --buttonLight:	#DDDDDD;
  --buttonDark: 	#767676;
  --buttonDarker: 	#BBBBBB;
  --buttonDarkest: 	#666666;

  --errorLighter:	#EBB2B1; /* FBEEEE */
  --errorLight:	#E08785;
  --error:		#D35351;
  --errorSeven:	#D35351B3;
  --errorLightSeven: #E08785B3;

  --warningLight: #EBD5AA;
  --warning: 	#FF9900;
  --warningDarker: #FFCC66;

  --successLight: #C4E1A4;
  --success: 	#009933;
  --successLightSeven: #C4E1A4B3;
  --successSeven: 	#009933B3;

  --infoLight: var(--themeLight);
  --info: 	#68A1BF; /* #68A1BF or var(--themeDark) */
  
}
/* 
 * ***************
 * GENERIC COLORS
 */
.bg-c_TL ,
.background-color_themeLight {
  background-color: var(--themeLight);
  }
