﻿
	/**
	 *	CSS Version 2.0
	**/

	@charset "UTF-8";
	
	/**
	 *	@title		CSS Intranet
	 *	@author		Yohven Belin
	 *	@date		decembre 2012		Juin 2015
	 *	@version	1.0.0				2.0.0
	**/
	
	/*******************************
		FONTS
	*******************************/
	@font-face { 	font-family: "canal"; 	src: url('../Fonts/canal.ttf');
					font-family: "icon"; 	src: url('../Fonts/icomoon.ttf');
					font-family: "metro"; 	src: url('../Fonts/metro.ttf');}
	
	/*******************************
		GENERAL DESIGN
	*******************************/
	html{
		height: 100%;}
	
	*{
		margin: 0;
		padding: 0;}

	body{
		position: relative;
		background: #FFFFFF;
		background-repeat: no-repeat;
		background-attachment: fixed;
		background-position: center; 
		font-family: "gill sans MT","Helvetica Neue","Helvetica",Helvetica,Arial,sans-serif;}	
	
	img, object, embed, canvas, video, audio, picture {
		max-width: 100%;
		height: auto;
		[b]float: none;[/b]
	}

	a{
		text-decoration: none;}
	
	h1, h2, h3, h4, h5{
		font-weight: normal;}
		
	h1{
		font-size: 3em;}
	
	/*******************************
		GENERAL CLASS
	*******************************/
	.clear{
		clear: both;}
	
	.left{
		float: left;}
	.right{
		float: right;}
	.center{
		margin: auto;}
		
	.dblock{
		display: block;}
	.block{
		display: block;
		width: 100%;
		height: 100%;}
		
	.txt-center{
		text-align: center;}
	.txt-left{
		text-align: left;}
	.txt-right{	
		text-align: right;}
	.txt-justify{
		text-lign: justify;}
		
	.txt-b{
		font-weight: bold;}
		
		
	.mrg-top-small{
		margin-top: 4px;}
	.mrg-bottom-small{
		margin-bottom: 4px;}
	.mrg-top{
		margin-top: 10px;}
	.mrg-bottom{
		margin-bottom: 10px;}
	.mrg-left{
		margin-left: 10px;}
	.mrg-right{
		margin-right: 10px;}
	.mrg-left-p1{
		margin-left: 1%;}
	.mrg-right-p1{
		margin-right: 1%;}
	.mrg-left-p2{
		margin-left: 2%;}
	.mrg-right-p2{
		margin-right: 2%;}
	.mrg-left-p005{
		margin-left: 0.5%;}
	.mrg-right-p005{
		margin-right: 0.5%;}
	
	.pdg-top-small{
		padding-top: 4px;}
	.pdg-bottom-small{
		padding-bottom: 4px;}	
	
	.rev-link a{
		color: #EEEEEE !important;}
		
	.over-hidden{
		overflow: hidden;
	}
	.over-auto{
		overflow: auto;
	}
		
	/*******************************
		TILE
	*******************************/
	.tile{
		padding: 10px;}
	.tile h1{
		font-size : 2.2em;}
	.tile h2{
		font-size : 1.6em;}
	.tile h3{
		font-size : 1.4em;}
		
	.tile-option{
		width: auto;
		height: auto;
		margin-top: 5px;
		margin-right: 10px;
		margin-bottom: 10px;}
	
		.tile-option a{
			width: 40px;
			height: 40px;
			padding: 10px;
			line-height: 30px;
			text-align: center;
			font-size: 2em;}
			
	.tile-title {
		float: right;
		padding: 4px 8px;
		margin-top: 20px;
		margin-right: 20px;}
		
	/*******************************
		INFO BULLE
	*******************************/		
	a.tooltip span{ 
		position: absolute;
		margin-top: 0px; 
		margin-left: -10px;
		color: #000000; 
		background: rgba(250, 250, 250, .95); 
		padding: 5px;
		box-shadow: 0 0 3px rgba(180, 180, 180, .75);	
		transition: all .40s;
		opacity: 0;}
		 
	a.tooltip:hover span, a.tooltip:focus span{
		opacity: 1; }	 
		
	/*******************************
		SPECIAL PAGE
	*******************************/
	#special-msg{
		position: absolute;
		top: 5%;
		margin: auto;
		width: 80%;
		height: auto;
		padding-left: 10%;
		padding-right: 10%;}
		
		#smiley{
			font-size: 6em;}
		
		#special-msg-title{
			font-size: 3em;
			margin-left: 40px;
		}
		
		#special-msg-content{
			font-size: 1.6em;
			margin-top: 20px;}	
		
	
	/*******************************
		GENERAL SIZE
	*******************************/
	.p1{ width:		1%;}
	.p2{ width:		2%;}
	.p3{ width:		3%;}
	.p4{ width:		4%;}
	.p5{ width:		5%;}
	.p6{ width:		6%;}
	.p7{ width:		7%;}
	.p8{ width:		8%;}
	.p9{ width:		9%;}
	.p10{ width:	10%;}
	.p11{ width:	11%;}
	.p12{ width:	12%;}
	.p13{ width:	13%;}
	.p14{ width:	14%;}
	.p15{ width:	15%;}
	.p16{ width:	16%;}
	.p17{ width:	17%;}
	.p18{ width:	18%;}
	.p19{ width:	19%;}
	.p20{ width:	20%;}
	.p21{ width:	21%;}
	.p22{ width:	22%;}
	.p23{ width:	23%;}
	.p24{ width:	24%;}
	.p25{ width:	25%;}
	.p26{ width:	26%;}
	.p27{ width:	27%;}
	.p28{ width:	28%;}
	.p29{ width:	29%;}
	.p30{ width:	30%;}
	.p31{ width:	31%;}
	.p32{ width:	32%;}
	.p33{ width:	33%;}
	.p34{ width:	34%;}
	.p35{ width:	35%;}
	.p36{ width:	36%;}
	.p37{ width:	37%;}
	.p38{ width:	38%;}
	.p39{ width:	39%;}
	.p40{ width:	40%;}
	.p41{ width:	41%;}
	.p42{ width:	42%;}
	.p43{ width:	43%;}
	.p44{ width:	44%;}
	.p45{ width:	45%;}
	.p46{ width:	46%;}
	.p47{ width:	47%;}
	.p48{ width:	48%;}
	.p49{ width:	49%;}
	.p50{ width:	50%;}
	.p51{ width:	51%;}
	.p52{ width:	52%;}
	.p53{ width:	53%;}
	.p54{ width:	54%;}
	.p55{ width:	55%;}
	.p56{ width:	56%;}
	.p57{ width:	57%;}
	.p58{ width:	58%;}
	.p59{ width:	59%;}
	.p60{ width:	60%;}
	.p61{ width:	61%;}
	.p62{ width:	62%;}
	.p63{ width:	63%;}
	.p64{ width:	64%;}
	.p65{ width:	65%;}
	.p66{ width:	66%;}
	.p67{ width:	67%;}
	.p68{ width:	68%;}
	.p69{ width:	69%;}
	.p70{ width:	70%;}
	.p71{ width:	71%;}
	.p72{ width:	72%;}
	.p73{ width:	73%;}
	.p74{ width:	74%;}
	.p75{ width:	75%;}
	.p76{ width:	76%;}
	.p77{ width:	77%;}
	.p78{ width:	78%;}
	.p79{ width:	79%;}
	.p80{ width:	80%;}
	.p81{ width:	81%;}
	.p82{ width:	82%;}
	.p83{ width:	83%;}
	.p84{ width:	84%;}
	.p85{ width:	85%;}
	.p86{ width:	86%;}
	.p87{ width:	87%;}
	.p88{ width:	88%;}
	.p89{ width:	89%;}
	.p90{ width:	90%;}
	.p91{ width:	91%;}
	.p92{ width:	92%;}
	.p93{ width:	93%;}
	.p94{ width:	94%;}
	.p95{ width:	95%;}
	.p96{ width:	96%;}
	.p97{ width:	97%;}
	.p98{ width:	98%;}
	.p99{ width:	99%;}
	.p100{ width:	100%;}
	
	/*******************************
		BANNERS IMAGES
	*******************************/
	.ban-img-1{
		background-image: url("../Images/Banners/ban-1.jpg");}
	.ban-img-2{
		background-image: url("../Images/Banners/ban-2.jpg");}
	.ban-img-3{
		background-image: url("../Images/Banners/ban-3.jpg");}
	.ban-img-4{
		background-image: url("../Images/Banners/ban-4.jpg");}
	.ban-img-5{
		background-image: url("../Images/Banners/ban-5.jpg");}
	.ban-img-6{
		background-image: url("../Images/Banners/ban-6.jpg");}
	.ban-img-7{
		background-image: url("../Images/Banners/ban-7.jpg");}
	.ban-img-8{
		background-image: url("../Images/Banners/ban-8.jpg");}
	.ban-img-9{
		background-image: url("../Images/Banners/ban-9.jpg");}
	
	/*******************************
		FORM INPUT
	*******************************/
	/* We use this to get basic styling on all basic form elements */
	input[type="text"],
	input[type="password"],
	input[type="date"],
	input[type="datetime"],
	input[type="datetime-local"],
	input[type="month"],
	input[type="week"],
	input[type="email"],
	input[type="number"],
	input[type="search"],
	input[type="tel"],
	input[type="time"],
	input[type="url"],
	textarea {
		background-color: white;
		font-family: inherit;
		border: 1px solid #cccccc;
		-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
		box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
		color: rgba(0, 0, 0, 0.75);
		display: block;
		font-size: 0.875em;
		margin: 0 0 1em 0;
		padding: 0.5em;
		height: 2.3125em;
		width: 100%;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-transition: -webkit-box-shadow 0.45s, border-color 0.45s ease-in-out;
		-moz-transition: -moz-box-shadow 0.45s, border-color 0.45s ease-in-out;
		transition: box-shadow 0.45s, border-color 0.45s ease-in-out; }
		  
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="date"]:focus,
	input[type="datetime"]:focus,
	input[type="datetime-local"]:focus,
	input[type="month"]:focus,
	input[type="week"]:focus,
	input[type="email"]:focus,
	input[type="number"]:focus,
	input[type="search"]:focus,
	input[type="tel"]:focus,
	input[type="time"]:focus,
	input[type="url"]:focus,
	textarea:focus {
		-webkit-box-shadow: 0 0 5px #6CC5FF;
		-moz-box-shadow: 0 0 5px #6CC5FF;
		box-shadow: 0 0 5px #6CC5FF;
		border-color: #6CC5FF;
	}
	
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="date"]:focus,
	input[type="datetime"]:focus,
	input[type="datetime-local"]:focus,
	input[type="month"]:focus,
	input[type="week"]:focus,
	input[type="email"]:focus,
	input[type="number"]:focus,
	input[type="search"]:focus,
	input[type="tel"]:focus,
	input[type="time"]:focus,
	input[type="url"]:focus,
	textarea:focus {
		background: #fafafa;
		border-color: #999999;
		outline: none; }
	
	input[type="text"][disabled],
	input[type="password"][disabled],
	input[type="date"][disabled],
	input[type="datetime"][disabled],
	input[type="datetime-local"][disabled],
	input[type="month"][disabled],
	input[type="week"][disabled],
	input[type="email"][disabled],
	input[type="number"][disabled],
	input[type="search"][disabled],
	input[type="tel"][disabled],
	input[type="time"][disabled],
	input[type="url"][disabled],
	textarea[disabled] {
		background-color: #dddddd; }
		
	select.default{
		width: 100%;
		padding: 4px 1% 4px 1%;
		margin-bottom: 5px;
		border: none;}
	
	/*******************************
		FORM CHECKBOX
	*******************************/
	/*input[type="checkbox"]:not(:checked),
	input[type="checkbox"]:checked{
	  position: absolute;
	  visibility: hidden;}
	input[type="checkbox"]:not(:checked) + label,
	input[type="checkbox"]:checked + label{
	  position: relative;
	  padding-left: 50px;
	  cursor: pointer;}
	input[type="checkbox"]:not(:checked) + label:before,
	input[type="checkbox"]:checked + label:before,
	input[type="checkbox"]:not(:checked) + label:after,
	input[type="checkbox"]:checked + label:after {
	  content: '';
	  position: absolute;
	}
	input[type="checkbox"]:not(:checked) + label:before,
	input[type="checkbox"]:checked + label:before {
	  left:0; top: 2px;
	  width: 30px; height: 10px;
	  border: 2px solid #EEEEEE;
	  background: #000000;
	  transition: background-color .2s;}

	input[type="checkbox"]:not(:checked) + label:after,
	input[type="checkbox"]:checked + label:after {
	  width: 7px; height: 14px;
	  border: 2px solid #444444;
	  transition: all .2s;
	  background: #EEEEEE;
	  left: 0px;}*/

	/* on checked */
	/*input[type="checkbox"]:checked + label:before {
	  background:#CECECE; }
	input[type="checkbox"]:checked + label:after {
	  background: #EEEEEE;
	  top: 0px; left: 25px;}

	input[type="checkbox"]:checked + label .ui,
	input[type="checkbox"]:not(:checked) + label .ui:before,
	input[type="checkbox"]:checked + label .ui:after {
	  position: absolute;
	  top: 2px;
	  left: 6px;
	  width: 30px;
	  transition: all .2s;}
	input[type="checkbox"]:focus + label:before {
	  border: 2px solid #EEEEEE;}*/
	
	/*******************************
		BACKGROUND COLORS
	*******************************/
	/* THEME 1: Black */
	.theme-1{
		color: #EEEEEE;}
	.theme-1 a{
		color: #EEEEEE;}
	.theme-focus-1 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-1{
		color: #100E1C;}
	.theme-reverse-1 a{
		color: #100E1C;}
	.theme-reverse-focus-1 a:hover,focus{
		color: #100E1C;}
	.bg-solid-1{
		background: #100E1C;}
	.bg-solid-second-1{
		background: #302E3C;}
	.bg-solid-reverse-1{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-1:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-1:hover,focus{
		background: #00000C;}
	.bg-gradient-1{
		background-image: -o-linear-gradient(right bottom, #100E1C 30%, #302E3C 100%);
		background-image: -moz-linear-gradient(right bottom, #100E1C 30%, #302E3C 100%);
		background-image: -webkit-linear-gradient(right bottom, #100E1C 30%, #302E3C 100%);
		background-image: -ms-linear-gradient(right bottom, #100E1C 30%, #302E3C 100%);
		background-image: linear-gradient(to right bottom, #100E1C 30%, #302E3C 100%);}
	.bg-gradient-focus-1:hover,focus{
		background-image: -o-linear-gradient(right bottom, #00000C 30%, #201E2C 100%);
		background-image: -moz-linear-gradient(right bottom, #00000C 30%, #201E2C 100%);
		background-image: -webkit-linear-gradient(right bottom, #00000C 30%, #201E2C 100%);
		background-image: -ms-linear-gradient(right bottom, #00000C 30%, #201E2C 100%);
		background-image: linear-gradient(to right bottom, #00000C 30%, #201E2C 100%);}
	
	/* THEME 2: DARK GREY */
	.theme-2{
		color: #EEEEEE;}
	.theme-2 a{
		color: #EEEEEE;}
	.theme-focus-2 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-2{
		color: #333333;}
	.theme-reverse-2 a{
		color: #333333;}
	.theme-reverse-focus-2 a:hover,focus{
		color: #333333;}
	.bg-solid-2{
		background: #333333;}
	.bg-solid-second-2{
		background: #434343;}
	.bg-solid-reverse-2{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-2:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-2:hover,focus{
		background: #232323;}
	.bg-gradient-2{
		background-image: -o-linear-gradient(right bottom, #333333 30%, #434343 100%);
		background-image: -moz-linear-gradient(right bottom, #333333 30%, #434343 100%);
		background-image: -webkit-linear-gradient(right bottom, #333333 30%, #434343 100%);
		background-image: -ms-linear-gradient(right bottom, #333333 30%, #434343 100%);
		background-image: linear-gradient(to right bottom, #333333 30%, #434343 100%);}
	.bg-gradient-focus-2:hover,focus{
		background-image: -o-linear-gradient(right bottom, #232323 30%, #333333 100%);
		background-image: -moz-linear-gradient(right bottom, #232323 30%, #333333 100%);
		background-image: -webkit-linear-gradient(right bottom, #232323 30%, #333333 100%);
		background-image: -ms-linear-gradient(right bottom, #232323 30%, #333333 100%);
		background-image: linear-gradient(to right bottom, #232323 30%, #333333 100%);}
	
	/* THEME 3: GREY */
	.theme-3{
		color: #EEEEEE;}
	.theme-3 a{
		color: #EEEEEE;}
	.theme-focus-3 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-3{
		color: #555555;}
	.theme-reverse-3 a{
		color: #555555;}
	.theme-reverse-focus-3 a:hover,focus{
		color: #555555;}
	.bg-solid-3{
		background: #555555;}
	.bg-solid-second-3{
		background: #656565;}
	.bg-solid-reverse-3{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-3:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-3:hover,focus{
		background: #454545;}
	.bg-gradient-3{
		background-image: -o-linear-gradient(right bottom, #555555 30%, #656565 100%);
		background-image: -moz-linear-gradient(right bottom, #555555 30%, #656565 100%);
		background-image: -webkit-linear-gradient(right bottom, #555555 30%, #656565 100%);
		background-image: -ms-linear-gradient(right bottom, #555555 30%, #656565 100%);
		background-image: linear-gradient(to right bottom, #555555 30%, #656565 100%);}
	.bg-gradient-focus-3:hover,focus{
		background-image: -o-linear-gradient(right bottom, #454545 30%, #555555 100%);
		background-image: -moz-linear-gradient(right bottom, #454545 30%, #555555 100%);
		background-image: -webkit-linear-gradient(right bottom, #454545 30%, #555555 100%);
		background-image: -ms-linear-gradient(right bottom, #454545 30%, #555555 100%);
		background-image: linear-gradient(to right bottom, #454545 30%, #555555 100%);}
	
	/* THEME 4: DARK BLUE */
	.theme-4{
		color: #EEEEEE;}
	.theme-4 a{
		color: #EEEEEE;}
	.theme-focus-4 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-4{
		color: #2E24B2;}
	.theme-reverse-4 a{
		color: #2E24B2;}
	.theme-reverse-focus-4 a:hover,focus{
		color: #2E24B2;}
	.bg-solid-4{
		background: #2E24B2;}
	.bg-solid-second-4{
		background: #4E44D2;}
	.bg-solid-reverse-4{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-4:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-4:hover,focus{
		background: #1E14A2;}
	.bg-gradient-4{
		background-image: -o-linear-gradient(right bottom, #2E24B2 30%, #4E44D2 80%);
		background-image: -moz-linear-gradient(right bottom, #2E24B2 30%, #4E44D2 80%);
		background-image: -webkit-linear-gradient(right bottom, #2E24B2 30%, #4E44D2 80%);
		background-image: -ms-linear-gradient(right bottom, #2E24B2 30%, #4E44D2 80%);
		background-image: linear-gradient(to right bottom, #2E24B2 30%, #4E44D2 80%);}
	.bg-gradient-focus-4:hover,focus{
		background-image: -o-linear-gradient(right bottom, #1E14A2 30%, #3E34C2 80%);
		background-image: -moz-linear-gradient(right bottom, #1E14A2 30%, #3E34C2 80%);
		background-image: -webkit-linear-gradient(right bottom, #1E14A2 30%, #3E34C2 80%);
		background-image: -ms-linear-gradient(right bottom, #1E14A2 30%, #3E34C2 80%);
		background-image: linear-gradient(to right bottom, #1E14A2 30%, #3E34C2 80%);}
		
	/* THEME 5: BLUE */
	.theme-5{
		color: #EEEEEE;}
	.theme-5 a{
		color: #EEEEEE;}		
	.theme-focus-5 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-5{
		color: #4E44D2;}
	.theme-reverse-5 a{
		color: #4E44D2;}
	.theme-reverse-focus-5 a:hover,focus{
		color: #4E44D2;}
	.bg-solid-5{
		background: #4E44D2;}
	.bg-solid-second-5{
		background: #5E54E2;}
	.bg-solid-reverse-5{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-5:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-5:hover,focus{
		background: #3E34C2;}
	.bg-gradient-5{
		background-image: -o-linear-gradient(right bottom, #4E44D2 30%, #5E54E2 80%);
		background-image: -moz-linear-gradient(right bottom, #4E44D2 30%, #5E54E2 80%);
		background-image: -webkit-linear-gradient(right bottom, #4E44D2 30%, #5E54E2 80%);
		background-image: -ms-linear-gradient(right bottom, #4E44D2 30%, #5E54E2 80%);
		background-image: linear-gradient(to right bottom, #4E44D2 30%, #5E54E2 80%);}	
	.bg-gradient-focus-5:hover,focus{
		background-image: -o-linear-gradient(right bottom, #3E34C2 30%, #4E44D2 80%);
		background-image: -moz-linear-gradient(right bottom, #3E34C2 30%, #4E44D2 80%);
		background-image: -webkit-linear-gradient(right bottom, #3E34C2 30%, #4E44D2 80%);
		background-image: -ms-linear-gradient(right bottom, #3E34C2 30%, #4E44D2 80%);
		background-image: linear-gradient(to right bottom, #3E34C2 30%, #4E44D2 80%);}
		
	/* THEME 6: LIGHT BLUE */
	.theme-6{
		color: #EEEEEE;}
	.theme-6 a{
		color: #EEEEEE;}
	.theme-focus-6 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-6{
		color: #0091F4;}
	.theme-reverse-6 a{
		color: #0091F4;}
	.theme-reverse-focus-6 a:hover,focus{
		color: #0091F4;}
	.bg-solid-6{
		background: #0091F4;}
	.bg-solid-second-6{
		background: #10A1FF;}
	.bg-solid-reverse-6{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-6:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-6:hover,focus{
		background: #0081E4;}
	.bg-gradient-6{
		background-image: -o-linear-gradient(right bottom, #0091F4 30%, #10A1FF 80%);
		background-image: -moz-linear-gradient(right bottom, #0091F4 30%, #10A1FF 80%);
		background-image: -webkit-linear-gradient(right bottom, #0091F4 30%, #10A1FF 80%);
		background-image: -ms-linear-gradient(right bottom, #0091F4 30%, #10A1FF 80%);
		background-image: linear-gradient(to right bottom, #0091F4 30%, #10A1FF 80%);}	
	.bg-gradient-focus-6:hover,focus{
		background-image: -o-linear-gradient(right bottom, #0081E4 30%, #0091F4 80%);
		background-image: -moz-linear-gradient(right bottom, #0081E4 30%, #0091F4 80%);
		background-image: -webkit-linear-gradient(right bottom, #0081E4 30%, #0091F4 80%);
		background-image: -ms-linear-gradient(right bottom, #0081E4 30%, #0091F4 80%);
		background-image: linear-gradient(to right bottom, #0081E4 30%, #0091F4 80%);}	
	
	/* THEME 7: CYAN */
	.theme-7{
		color: #EEEEEE;}
	.theme-7 a{
		color: #EEEEEE;}
	.theme-focus-7 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-7{
		color: #00C8DC;}
	.theme-reverse-7 a{
		color: #00C8DC;}
	.theme-reverse-focus-7 a:hover,focus{
		color: #00C8DC;}
	.bg-solid-7{
		background: #00C8DC;}
	.bg-solid-second-7{
		background: #10D8EC;}
	.bg-solid-reverse-7{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-7:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-7:hover,focus{
		background: #00B8CC;}
	.bg-gradient-7{
		background-image: -o-linear-gradient(right bottom, #00C8DC 30%, #10D8EC 80%);
		background-image: -moz-linear-gradient(right bottom, #00C8DC 30%, #10D8EC 80%);
		background-image: -webkit-linear-gradient(right bottom, #00C8DC 30%, #10D8EC 80%);
		background-image: -ms-linear-gradient(right bottom, #00C8DC 30%, #10D8EC 80%);
		background-image: linear-gradient(to right bottom, #00C8DC 30%, #10D8EC 80%);}	
	.bg-gradient-focus-7:hover,focus{
		background-image: -o-linear-gradient(right bottom, #00B8CC 30%, #00C8DC 80%);
		background-image: -moz-linear-gradient(right bottom, #00B8CC 30%, #00C8DC 80%);
		background-image: -webkit-linear-gradient(right bottom, #00B8CC 30%, #00C8DC 80%);
		background-image: -ms-linear-gradient(right bottom, #00B8CC 30%, #00C8DC 80%);
		background-image: linear-gradient(to right bottom, #00B8CC 30%, #00C8DC 80%);}
	
	/* THEME 8: PURPLE */
	.theme-8{
		color: #EEEEEE;}
	.theme-8 a{
		color: #EEEEEE;}
	.theme-focus-8 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-8{
		color: #450168;}
	.theme-reverse-8 a{
		color: #450168;}	
	.theme-reverse-focus-8 a:hover,focus{
		color: #450168;}	
	.bg-solid-8{
		background: #450168;}
	.bg-solid-second-8{
		background: #551178;}
	.bg-solid-reverse-8{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-8:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-8:hover,focus{
		background: #350058;}
	.bg-gradient-8{
		background-image: -o-linear-gradient(right bottom, #450168 30%, #551178 80%);
		background-image: -moz-linear-gradient(right bottom, #450168 30%, #551178 80%);
		background-image: -webkit-linear-gradient(right bottom, #450168 30%, #551178 80%);
		background-image: -ms-linear-gradient(right bottom, #450168 30%, #551178 80%);
		background-image: linear-gradient(to right bottom, #450168 30%, #551178 80%);}	
	.bg-gradient-focus-8:hover,focus{
		background-image: -o-linear-gradient(right bottom, #350058 30%, #450168 80%);
		background-image: -moz-linear-gradient(right bottom, #350058 30%, #450168 80%);
		background-image: -webkit-linear-gradient(right bottom, #350058 30%, #450168 80%);
		background-image: -ms-linear-gradient(right bottom, #350058 30%, #450168 80%);
		background-image: linear-gradient(to right bottom, #350058 30%, #450168 80%);}
	
	/* THEME 9: ROSE */
	.theme-9{
		color: #EEEEEE;}
	.theme-9 a{
		color: #EEEEEE;}
	.theme-focus-9 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-9{
		color: #FF3299;}
	.theme-reverse-9 a{
		color: #FF3299;}
	.theme-reverse-focus-9 a:hover,focus{
		color: #FF3299;}
	.bg-solid-9{
		background: #FF3299;}
	.bg-solid-second-9{
		background: #FF42A9;}
	.bg-solid-reverse-9{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-9:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-9:hover,focus{
		background: #EF2289;}
	.bg-gradient-9{
		background-image: -o-linear-gradient(right bottom, #FF3299 30%, #FF42A9 80%);
		background-image: -moz-linear-gradient(right bottom, #FF3299 30%, #FF42A9 80%);
		background-image: -webkit-linear-gradient(right bottom, #FF3299 30%, #FF42A9 80%);
		background-image: -ms-linear-gradient(right bottom, #FF3299 30%, #FF42A9 80%);
		background-image: linear-gradient(to right bottom, #FF3299 30%, #FF42A9 80%);}	
	.bg-gradient-focus-9:hover,focus{
		background-image: -o-linear-gradient(right bottom, #EF2289 30%, #FF3299 80%);
		background-image: -moz-linear-gradient(right bottom, #EF2289 30%, #FF3299 80%);
		background-image: -webkit-linear-gradient(right bottom, #EF2289 30%, #FF3299 80%);
		background-image: -ms-linear-gradient(right bottom, #EF2289 30%, #FF3299 80%);
		background-image: linear-gradient(to right bottom, #EF2289 30%, #FF3299 80%);}
	
	/* THEME 10: YELLOW */
	.theme-10{
		color: #999999 !important;}
	.theme-10 a{
		color: #999999 !important;}
	.theme-focus-10 a:hover,focus{
		color: #EEEEEE !important;}
	.theme-reverse-10{
		color: #FDE332 !important;}
	.theme-reverse-10 a{
		color: #FDE332 !important;}
	.theme-reverse-focus-10 a:hover,focus{
		color: #FDE332 !important;}
	.bg-solid-10{
		background: #FDE332;}
	.bg-solid-second-10{
		background: #FFF342;}
	.bg-solid-reverse-10{
		background: #999999;}
	.bg-solid-reverse-focus-10:hover,focus{
		background: #999999;}
	.bg-solid-focus-10:hover,focus{
		background: #EDD322;}
	.bg-gradient-10{
		background-image: -o-linear-gradient(right bottom, #FDE332 30%, #FFF342 80%);
		background-image: -moz-linear-gradient(right bottom, #FDE332 30%, #FFF342 80%);
		background-image: -webkit-linear-gradient(right bottom, #FDE332 30%, #FFF342 80%);
		background-image: -ms-linear-gradient(right bottom, #FDE332 30%, #FFF342 80%);
		background-image: linear-gradient(to right bottom, #FDE332 30%, #FFF342 80%);}	
	.bg-gradient-focus-10:hover,focus{
		background-image: -o-linear-gradient(right bottom, #EDD322 30%, #FDE332 80%);
		background-image: -moz-linear-gradient(right bottom, #EDD322 30%, #FDE332 80%);
		background-image: -webkit-linear-gradient(right bottom, #EDD322 30%, #FDE332 80%);
		background-image: -ms-linear-gradient(right bottom, #EDD322 30%, #FDE332 80%);
		background-image: linear-gradient(to right bottom, #EDD322 30%, #FDE332 80%);}
	
	/* THEME 11: DARK RED */
	.theme-11{
		color: #EEEEEE;}
	.theme-11 a{
		color: #EEEEEE;}
	.theme-focus-11 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-11{
		color: #992020;}
	.theme-reverse-11 a{
		color: #992020;}
	.theme-reverse-focus-11 a:hover,focus{
		color: #992020;}
	.bg-solid-11{
		background: #992020;}
	.bg-solid-second-11{
		background: #AA3030;}
	.bg-solid-reverse-11{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-11:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-11:hover,focus{
		background: #891010;}
	.bg-gradient-11{
		background-image: -o-linear-gradient(right bottom, #992020 30%, #AA3030 80%);
		background-image: -moz-linear-gradient(right bottom, #992020 30%, #AA3030 80%);
		background-image: -webkit-linear-gradient(right bottom, #992020 30%, #AA3030 80%);
		background-image: -ms-linear-gradient(right bottom, #992020 30%, #AA3030 80%);
		background-image: linear-gradient(to right bottom, #992020 30%, #AA3030 80%);}	
	.bg-gradient-focus-11:hover,focus{
		background-image: -o-linear-gradient(right bottom, #891010 30%, #992020 80%);
		background-image: -moz-linear-gradient(right bottom, #891010 30%, #992020 80%);
		background-image: -webkit-linear-gradient(right bottom, #891010 30%, #992020 80%);
		background-image: -ms-linear-gradient(right bottom, #891010 30%, #992020 80%);
		background-image: linear-gradient(to right bottom, #891010 30%, #992020 80%);}
	
	/* THEME 12: RED */
	.theme-12{
		color: #EEEEEE;}
	.theme-12 a{
		color: #EEEEEE;}
	.theme-focus-12 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-12{
		color: #EF0000;}
	.theme-reverse-12 a{
		color: #EF0000;}
	.theme-reverse-focus-12 a:hover,focus{
		color: #EF0000;}
	.bg-solid-12{
		background: #EF0000;}
	.bg-solid-second-12{
		background: #FF1010;}
	.bg-solid-reverse-12{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-12:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-12:hover,focus{
		background: #DF0000;}
	.bg-gradient-12{
		background-image: -o-linear-gradient(right bottom, #EF0000 30%, #FF1010 80%);
		background-image: -moz-linear-gradient(right bottom, #EF0000 30%, #FF1010 80%);
		background-image: -webkit-linear-gradient(right bottom, #EF0000 30%, #FF1010 80%);
		background-image: -ms-linear-gradient(right bottom, #EF0000 30%, #FF1010 80%);
		background-image: linear-gradient(to right bottom, #EF0000 30%, #FF1010 80%);}	
	.bg-gradient-focus-12:hover,focus{
		background-image: -o-linear-gradient(right bottom, #DF0000 30%, #EF0000 80%);
		background-image: -moz-linear-gradient(right bottom, #DF0000 30%, #EF0000 80%);
		background-image: -webkit-linear-gradient(right bottom, #DF0000 30%, #EF0000 80%);
		background-image: -ms-linear-gradient(right bottom, #DF0000 30%, #EF0000 80%);
		background-image: linear-gradient(to right bottom, #DF0000 30%, #EF0000 80%);}
	
	/* THEME 13: LIGHT RED */
	.theme-13{
		color: #EEEEEE;}
	.theme-13 a{
		color: #EEEEEE;}
	.theme-focus-13 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-13{
		color: #EF4040;}
	.theme-reverse-13 a{
		color: #EF4040;}
	.theme-reverse-focus-13 a:hover,focus{
		color: #EF4040;}
	.bg-solid-13{
		background: #EF4040;}
	.bg-solid-second-13{
		background: #FF5050;}
	.bg-solid-reverse-13{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-13:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-13:hover,focus{
		background: #DF3030;}
	.bg-gradient-13{
		background-image: -o-linear-gradient(right bottom, #EF4040 30%, #FF5050 80%);
		background-image: -moz-linear-gradient(right bottom, #EF4040 30%, #FF5050 80%);
		background-image: -webkit-linear-gradient(right bottom, #EF4040 30%, #FF5050 80%);
		background-image: -ms-linear-gradient(right bottom, #EF4040 30%, #FF5050 80%);
		background-image: linear-gradient(to right bottom, #EF4040 30%, #FF5050 80%);}	
	.bg-gradient-focus-13:hover,focus{
		background-image: -o-linear-gradient(right bottom, #DF3030 30%, #EF4040 80%);
		background-image: -moz-linear-gradient(right bottom, #DF3030 30%, #EF4040 80%);
		background-image: -webkit-linear-gradient(right bottom, #DF3030 30%, #EF4040 80%);
		background-image: -ms-linear-gradient(right bottom, #DF3030 30%, #EF4040 80%);
		background-image: linear-gradient(to right bottom, #DF3030 30%, #EF4040 80%);}
	
	/* THEME 14: DARK GREEN */
	.theme-14{
		color: #EEEEEE;}
	.theme-14 a{
		color: #EEEEEE;}
	.theme-focus-14 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-14{
		color: #106610;}
	.theme-reverse-14 a{
		color: #106610;}
	.theme-reverse-focus-14 a:hover,focus{
		color: #106610;}
	.bg-solid-14{
		background: #106610;}
	.bg-solid-second-14{
		background: #207620;}
	.bg-solid-reverse-14{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-14:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-14:hover,focus{
		background: #005600;}
	.bg-gradient-14{
		background-image: -o-linear-gradient(right bottom, #106610 30%, #207620 80%);
		background-image: -moz-linear-gradient(right bottom, #106610 30%, #207620 80%);
		background-image: -webkit-linear-gradient(right bottom, #106610 30%, #207620 80%);
		background-image: -ms-linear-gradient(right bottom, #106610 30%, #207620 80%);
		background-image: linear-gradient(to right bottom, #106610 30%, #207620 80%);}	
	.bg-gradient-focus-14:hover,focus{
		background-image: -o-linear-gradient(right bottom, #005600 30%, #106610 80%);
		background-image: -moz-linear-gradient(right bottom, #005600 30%, #106610 80%);
		background-image: -webkit-linear-gradient(right bottom, #005600 30%, #106610 80%);
		background-image: -ms-linear-gradient(right bottom, #005600 30%, #106610 80%);
		background-image: linear-gradient(to right bottom, #005600 30%, #106610 80%);}
	
	/* THEME 15: GREEN */
	.theme-15{
		color: #EEEEEE;}
	.theme-15 a{
		color: #EEEEEE;}
	.theme-focus-15 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-15{
		color: #108910;}
	.theme-reverse-15 a{
		color: #108910;}
	.theme-reverse-focus-15 a:hover,focus{
		color: #108910;}
	.bg-solid-15{
		background: #108910;}
	.bg-solid-second-15{
		background: #209920;}
	.bg-solid-reverse-15{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-15:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-15:hover,focus{
		background: #007900;}
	.bg-gradient-15{
		background-image: -o-linear-gradient(right bottom, #108910 30%, #209920 80%);
		background-image: -moz-linear-gradient(right bottom, #108910 30%, #209920 80%);
		background-image: -webkit-linear-gradient(right bottom, #108910 30%, #209920 80%);
		background-image: -ms-linear-gradient(right bottom, #108910 30%, #209920 80%);
		background-image: linear-gradient(to right bottom, #108910 30%, #209920 80%);}	
	.bg-gradient-focus-15:hover,focus{
		background-image: -o-linear-gradient(right bottom, #007900 30%, #209920 80%);
		background-image: -moz-linear-gradient(right bottom, #007900 30%, #209920 80%);
		background-image: -webkit-linear-gradient(right bottom, #007900 30%, #209920 80%);
		background-image: -ms-linear-gradient(right bottom, #007900 30%, #209920 80%);
		background-image: linear-gradient(to right bottom, #007900 30%, #209920 80%);}
	
	/* THEME 16: LIGHT GREEN */
	.theme-16{
		color: #EEEEEE;}
	.theme-16 a{
		color: #EEEEEE;}
	.theme-focus-16 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-16{
		color: #209920;}
	.theme-reverse-16 a{
		color: #209920;}
	.theme-reverse-focus-16 a:hover,focus{
		color: #209920;}
	.bg-solid-16{
		background: #209920;}
	.bg-solid-second-16{
		background: #30AA30;}
	.bg-solid-reverse-16{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-16:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-16:hover,focus{
		background: #108910;}
	.bg-gradient-16{
		background-image: -o-linear-gradient(right bottom, #209920 30%, #30AA30 80%);
		background-image: -moz-linear-gradient(right bottom, #209920 30%, #30AA30 80%);
		background-image: -webkit-linear-gradient(right bottom, #209920 30%, #30AA30 80%);
		background-image: -ms-linear-gradient(right bottom, #209920 30%, #30AA30 80%);
		background-image: linear-gradient(to right bottom, #209920 30%, #30AA30 80%);}	
	.bg-gradient-focus-16:hover,focus{
		background-image: -o-linear-gradient(right bottom, #108910 30%, #209920 80%);
		background-image: -moz-linear-gradient(right bottom, #108910 30%, #209920 80%);
		background-image: -webkit-linear-gradient(right bottom, #108910 30%, #209920 80%);
		background-image: -ms-linear-gradient(right bottom, #108910 30%, #209920 80%);
		background-image: linear-gradient(to right bottom, #108910 30%, #209920 80%);}
	
	/* THEME 17: DARK ORANGE */
	.theme-17{
		color: #EEEEEE;}
	.theme-17 a{
		color: #EEEEEE;}
	.theme-focus-17 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-17{
		color: #E14900;}
	.theme-reverse-17 a{
		color: #E14900;}
	.theme-reverse-focus-17 a:hover,focus{
		color: #E14900;}
	.bg-solid-17{
		background: #E14900;}
	.bg-solid-second-17{
		background: #F15910;}
	.bg-solid-reverse-17{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-17:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-17:hover,focus{
		background: #D13900;}
	.bg-gradient-17{
		background-image: -o-linear-gradient(right bottom, #E14900 30%, #F15910 80%);
		background-image: -moz-linear-gradient(right bottom, #E14900 30%, #F15910 80%);
		background-image: -webkit-linear-gradient(right bottom, #E14900 30%, #F15910 80%);
		background-image: -ms-linear-gradient(right bottom, #E14900 30%, #F15910 80%);
		background-image: linear-gradient(to right bottom, #E14900 30%, #F15910 80%);}	
	.bg-gradient-focus-17:hover,focus{
		background-image: -o-linear-gradient(right bottom, #D13900 30%, #E14900 80%);
		background-image: -moz-linear-gradient(right bottom, #D13900 30%, #E14900 80%);
		background-image: -webkit-linear-gradient(right bottom, #D13900 30%, #E14900 80%);
		background-image: -ms-linear-gradient(right bottom, #D13900 30%, #E14900 80%);
		background-image: linear-gradient(to right bottom, #D13900 30%, #E14900 80%);}
	
	/* THEME 18: ORANGE */
	.theme-18{
		color: #EEEEEE;}
	.theme-18 a{
		color: #EEEEEE;}
	.theme-focus-18 a:hover,focus{
		color: #EEEEEE;}
	.theme-reverse-18{
		color: #F67422;}
	.theme-reverse-18 a{
		color: #F67422;}
	.theme-reverse-focus-18 a:hover,focus{
		color: #F67422;}
	.bg-solid-18{
		background: #F67422;}
	.bg-solid-second-18{
		background: #FF8432;}
	.bg-solid-reverse-18{
		background: #EEEEEE;}
	.bg-solid-reverse-focus-18:hover,focus{
		background: #EEEEEE;}
	.bg-solid-focus-18:hover,focus{
		background: #E66412;}
	.bg-gradient-18{
		background-image: -o-linear-gradient(right bottom, #F67422 30%, #FF8432 80%);
		background-image: -moz-linear-gradient(right bottom, #F67422 30%, #FF8432 80%);
		background-image: -webkit-linear-gradient(right bottom, #F67422 30%, #FF8432 80%);
		background-image: -ms-linear-gradient(right bottom, #F67422 30%, #FF8432 80%);
		background-image: linear-gradient(to right bottom, #F67422 30%, #FF8432 80%);}	
	.bg-gradient-focus-18:hover,focus{
		background-image: -o-linear-gradient(right bottom, #E66412 30%, #F67422 80%);
		background-image: -moz-linear-gradient(right bottom, #E66412 30%, #F67422 80%);
		background-image: -webkit-linear-gradient(right bottom, #E66412 30%, #F67422 80%);
		background-image: -ms-linear-gradient(right bottom, #E66412 30%, #F67422 80%);
		background-image: linear-gradient(to right bottom, #E66412 30%, #F67422 80%);}
	
	/*******************************
		FORM
	*******************************/
	input.submit{
		cursor: pointer;
		color: #EEEEEE;
		padding: 2px 20px 2px 20px;
		background: transparent none repeat scroll 0% 0%;
		border: 2px;
		border-style: solid;
		border-color: #EEEEEE;}

		input.submit:hover{
			color: #000000;
			background-color: #EEEEEE;}
				
		input.submit:active{
			color: #EEEEEE;
			background-color: #000000;
			border-color: #000000;}
	
	/*******************************
		POPUP
	*******************************/
	#fade{
		background-color: #000000;
		position: fixed;
		width: 100%;
		height: 100%;
		filter:alpha(opacity = 80);
		opacity:.80;
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /*--Transparence sous IE 8--*/
		left:0;
		top:0;
		z-index:10;}
		
	#hideshow{
		position:absolute;
		width:100%;
		height:100%;
		top:0;
		left:0;}
		
	.popup-block{
		position: fixed;
		top: 20%;
		padding: 20px 20% 30px;
		width: 60%;
		z-index: 100;
		left: 0;}
		
		.popup-left{
			margin-top: 20px;
			float: left;
			width: 4%;}

		.popup-right{
			margin-top: 10px;
			margin-left: 10px;
			float: left;
			width: 90%;}
		
		.popup-block .popup{
			float:left;
			width:100%;}
		
			.popup h1{
				font-size: 1.6em;
				font-weight:normal;
				font-style: Verdana;}
			
			.popup-message{
				margin-top: 20px;
				margin-bottom: 20px;
				text-align: justify;
				max-height: 240px;
				overflow: auto;}
				
				.popup ul {
				margin-left: 20px;}
	
			.popup img.cntrl{
				position:absolute;
				right:-20px;
				top:-20px;}

			.popup input.popup{
				float: right;
				margin-right: 7%;
				width: 100px;
				padding: 2px 0px 2px 0px;
				cursor: pointer;
				color: #EEEEEE;
				background: transparent none repeat scroll 0% 0%;
				border: 2px;
				border-style: solid;
				border-color: #EEEEEE;}

			.popup input.popup:hover{
				color: #000000;
				background-color: #EEEEEE;}
				
			.popup input.popup:active{
				color: #EEEEEE;
				background-color: #000000;
				border-color: #000000;}

	* html #fade {
		position:absolute;
		top:expression(eval(document.compatMode && document.compatMode == 'CSS1Compat') ? documentElement.scrollTop : document.body.scrollTop );}
	
	* html .popup-block{
		position: absolute;
		top: expression(eval(document.compatMode && document.compatMode == 'CSS1Compat') ? documentElement.scrollTop + (( documentElement.clientHeight-this.clientHeight )/2 ) : document.body.scrollTop + (( document.body.clientHeight-this.clientHeight )/2 ) );
		left: expression(eval(document.compatMode && document.compatMode == 'CSS1Compat') ? documentElement.scrollLeft + ( document.body.clientWidth/2 ) : document.body.scrollLeft + ( document.body.offsetWidth/2 ) );}	
	
		
	/*******************************
		Microsoft Windows 8 load effect
	*******************************/	
	.windows8{
		position: relative;
		width: 20px;
		height:20px;}
	.windows8 .wBall {
		position: absolute;
		width: 19px;
		height: 19px;
		opacity: 0;
		-moz-transform: rotate(225deg);
		-moz-animation: orbit 4.95s infinite;
		-webkit-transform: rotate(225deg);
		-webkit-animation: orbit 4.95s infinite;
		-ms-transform: rotate(225deg);
		-ms-animation: orbit 4.95s infinite;
		-o-transform: rotate(225deg);
		-o-animation: orbit 4.95s infinite;
		transform: rotate(225deg);
		animation: orbit 4.95s infinite;}
	.windows8 .wBall .wInnerBall{
		position: absolute;
		width: 3px;
		height: 3px;
		background: #eeeeee;
		left:0px;
		top:0px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		-ms-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;}
	.windows8 #wBall_1{
		-moz-animation-delay: 1.08s;
		-webkit-animation-delay: 1.08s;
		-ms-animation-delay: 1.08s;
		-o-animation-delay: 1.08s;
		animation-delay: 1.08s;}
	.windows8 #wBall_2 {
		-moz-animation-delay: 0.22s;
		-webkit-animation-delay: 0.22s;
		-ms-animation-delay: 0.22s;
		-o-animation-delay: 0.22s;
		animation-delay: 0.22s;}
	.windows8 #wBall_3 {
		-moz-animation-delay: 0.43s;
		-webkit-animation-delay: 0.43s;
		-ms-animation-delay: 0.43s;
		-o-animation-delay: 0.43s;
		animation-delay: 0.43s;}
	.windows8 #wBall_4 {
		-moz-animation-delay: 0.65s;
		-webkit-animation-delay: 0.65s;
		-ms-animation-delay: 0.65s;
		-o-animation-delay: 0.65s;
		animation-delay: 0.65s;}
	.windows8 #wBall_5 {
		-moz-animation-delay: 0.86s;
		-webkit-animation-delay: 0.86s;
		-ms-animation-delay: 0.86s;
		-o-animation-delay: 0.86s;
		animation-delay: 0.86s;}

	@-moz-keyframes orbit {
		0% {
			opacity: 1;
			z-index:99;
			-moz-transform: rotate(180deg);
			-moz-animation-timing-function: ease-out;}
		7% {
			opacity: 1;
			-moz-transform: rotate(300deg);
			-moz-animation-timing-function: linear;
			-moz-origin:0%;}
		30% {
		opacity: 1;
			-moz-transform:rotate(410deg);
			-moz-animation-timing-function: ease-in-out;
			-moz-origin:7%;}
		39% {
			opacity: 1;
			-moz-transform: rotate(645deg);
			-moz-animation-timing-function: linear;
			-moz-origin:30%;}
		70% {
			opacity: 1;
			-moz-transform: rotate(770deg);
			-moz-animation-timing-function: ease-out;
			-moz-origin:39%;}
		75% {
			opacity: 1;
			-moz-transform: rotate(900deg);
			-moz-animation-timing-function: ease-out;
			-moz-origin:70%;}
		76% {
			opacity: 0;
			-moz-transform:rotate(900deg);}
		100% {
			opacity: 0;
			-moz-transform: rotate(900deg);}
	}

	@-webkit-keyframes orbit {
		0% {
			opacity: 1;
			z-index:99;
			-webkit-transform: rotate(180deg);
			-webkit-animation-timing-function: ease-out;}
		7% {
			opacity: 1;
			-webkit-transform: rotate(300deg);
			-webkit-animation-timing-function: linear;
			-webkit-origin:0%;}
		30% {
			opacity: 1;
			-webkit-transform:rotate(410deg);
			-webkit-animation-timing-function: ease-in-out;
			-webkit-origin:7%;}
		39% {
			opacity: 1;
			-webkit-transform: rotate(645deg);
			-webkit-animation-timing-function: linear;
			-webkit-origin:30%;}
		70% {
			opacity: 1;
			-webkit-transform: rotate(770deg);
			-webkit-animation-timing-function: ease-out;
			-webkit-origin:39%;}
		75% {
			opacity: 1;
			-webkit-transform: rotate(900deg);
			-webkit-animation-timing-function: ease-out;
			-webkit-origin:70%;}
		76% {
		opacity: 0;
			-webkit-transform:rotate(900deg);}
		100% {
			opacity: 0;
			-webkit-transform: rotate(900deg);}
	}

	@-ms-keyframes orbit {
		0% {
			opacity: 1;
			z-index:99;
			-ms-transform: rotate(180deg);
			-ms-animation-timing-function: ease-out;}
		7% {
			opacity: 1;
			-ms-transform: rotate(300deg);
			-ms-animation-timing-function: linear;
			-ms-origin:0%;}
		30% {
			opacity: 1;
			-ms-transform:rotate(410deg);
			-ms-animation-timing-function: ease-in-out;
			-ms-origin:7%;}
		39% {
			opacity: 1;
			-ms-transform: rotate(645deg);
			-ms-animation-timing-function: linear;
			-ms-origin:30%;}
		70% {
			opacity: 1;
			-ms-transform: rotate(770deg);
			-ms-animation-timing-function: ease-out;
			-ms-origin:39%;}
		75% {
			opacity: 1;
			-ms-transform: rotate(900deg);
			-ms-animation-timing-function: ease-out;
			-ms-origin:70%;}
		76% {
			opacity: 0;
			-ms-transform:rotate(900deg);}
		100% {
			opacity: 0;
			-ms-transform: rotate(900deg);}
	}

	@-o-keyframes orbit {
		0% {
			opacity: 1;
			z-index:99;
			-o-transform: rotate(180deg);
			-o-animation-timing-function: ease-out;}
		7% {
			opacity: 1;
			-o-transform: rotate(300deg);
			-o-animation-timing-function: linear;
			-o-origin:0%;}
		30% {
			opacity: 1;
			-o-transform:rotate(410deg);
			-o-animation-timing-function: ease-in-out;
			-o-origin:7%;}
		39% {
			opacity: 1;
			-o-transform: rotate(645deg);
			-o-animation-timing-function: linear;
			-o-origin:30%;}
		70% {
			opacity: 1;
			-o-transform: rotate(770deg);
			-o-animation-timing-function: ease-out;
			-o-origin:39%;}
		75% {
			opacity: 1;
			-o-transform: rotate(900deg);
			-o-animation-timing-function: ease-out;
			-o-origin:70%;}
		76% {
			opacity: 0;
			-o-transform:rotate(900deg);}
		100% {
			opacity: 0;
			-o-transform: rotate(900deg);}
	}

	@keyframes orbit {
		0% {
			opacity: 1;
			z-index:99;
			transform: rotate(180deg);
			animation-timing-function: ease-out;}
		7% {
			opacity: 1;
			transform: rotate(300deg);
			animation-timing-function: linear;
			origin:0%;}
		30% {
			opacity: 1;
			transform:rotate(410deg);
			animation-timing-function: ease-in-out;
			origin:7%;}
		39% {
			opacity: 1;
			transform: rotate(645deg);
			animation-timing-function: linear;
			origin:30%;}
		70% {
			opacity: 1;
			transform: rotate(770deg);
			animation-timing-function: ease-out;
			origin:39%;}
		75% {
			opacity: 1;
			transform: rotate(900deg);
			animation-timing-function: ease-out;
			origin:70%;}
		76% {
			opacity: 0;
			transform:rotate(900deg);}
		100% {
			opacity: 0;
			transform: rotate(900deg);}
	}
		
	
	/************************************************************/
	/* Maintenance message
	/************************************************************/
	
	#maintenance{
		position: fixed;
		width: 100%;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 20px;
		padding-right: 20px;
		color: #404040;
		font-size: 1.2em;
		background-color: #FCD116;
		z-index: 200;
		bottom: 0;
	}
	
	/************************************************************/
	/* Start Footer
	/************************************************************/
	
	#footer{
		width: 100%;
		height: auto;
		background-color: #033f87;
		padding-bottom: 10px;
		padding-top: 10px;
		color: #FFFFFF;}
		
	#footer a{
		text-decoration: none;
		color: #DDDDDD;}
		
		#footer-content{
			margin: auto;
			width: 1200px;}
			
			#footer-content-left{
				float: left;
				width: 49%;}
				
			#footer-content-right{
				float: right;
				width: 49%;}
				
				.content-left-49{
					float: left;
					width: 49%;}
				
				.content-right-49{
					float: right;
					width: 49%;}
					
		.footer-link{
			width: 100%;
			height: 24px;
			margin-top: 6px;}
			
			.footer-link-icon{
				float: left;
				width: 14%;}
				
			.footer-link-text{
				float: right;
				width: 86%;}
				
		#version{
			margin: auto;
			margin-top: 5px;
			width: 1200px;
			text-align: right;}
			
	/************************************************************/
	/* Tables
	/************************************************************/
	table.table-100{
		width: 100%;
		font-size: 0.8em;}
	
	table.table-black th{
		background-color: #777777;
		color: #000000;}
		
	table.table-black td{
		vertical-align: top;
		text-align: justify;
		border-bottom: 1px solid #444444;}
		
	table.table-white th{
		background-color: rgba(210,210,210,0.5);
		color: #000000;}
		
	table.table-white td{
		vertical-align: top;
		text-align: justify;
		border-bottom: 1px solid #EEEEEE;
		color: #EEEEEE;
		background-color: rgba(0,0,0,0.5); }

	th.th-8{
		width: 8%;}		
	
	th.th-16{
		width: 16%;}
		
	th.th-60{
		width: 60%}
		
	th.th-84{
		width: 84%}
		
	/****************************************************************/
	/*	CSS tableau													*/
	/****************************************************************/

	#list{
		width : 100%;
		border-collapse: collapse;
		border-spacing: 0;
		font-size: 0.8em;
		padding: 2px;}
		
	/****************************************************************/
	/*	CSS tableau JS												*/
	/****************************************************************/		
	div#list-content{
		margin: auto;
		padding: 10px 2%;
		/*background-color: #55F;
		color: #FFF;*/}
		
	div#list-content select {
		padding: 2px 4px 4px 2px;
		background-color: #FFF;
		border: 0px none;
		font-weight: normal;
		font-size: 1em;
		color: #000;
		width: 140px;}
		
	div#list-content input[type="text"]{
		padding: 2px 4px 4px 2px;
		background-color: #FFF;
		border: 0px none;
		font-weight: normal;
		font-size: 1em;
		color: #000;
	}
	
	div#list-content input.search_init {
	width: 93%;}
	
	/****************************************************************/
	/*	CSS tableau	Javascript										*/
	/****************************************************************/
	.css_right{
		float: right;}
	.css_left{
		float: left;}
	.paging_two_button .ui-button{
		float: left;
		cursor: pointer;
		* cursor: hand;}
	.paging_full_numbers .ui-button{
		padding: 2px 6px;
		margin: 0;
		cursor: pointer;
		* cursor: hand;}
	.dataTables_paginate .ui-button{
		margin-right: -0.1em !important;}
	.paging_full_numbers{
		width: 350px !important;}
	.dataTables_wrapper .ui-toolbar{
		margin-top: 5px;
		margin-bottom: 5px;}
	.dataTables_paginate{
		width: auto;}
	.dataTables_info{
		padding-top: 3px;}
	table.display thead th{
		padding: 3px 0px 3px 10px;
		cursor: pointer;
		* cursor: hand;}
	div.dataTables_wrapper .ui-widget-header{
		font-weight: normal;}

	/*
	 * Sort arrow icon positioning
	 */
	table.display thead th div.DataTables_sort_wrapper{
		position: relative;
		padding-right: 20px;
		padding-right: 20px;}
	table.display thead th div.DataTables_sort_wrapper span{
		position: absolute;
		top: 50%;
		margin-top: -8px;
		right: 0;}

	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	 *
	 * Everything below this line is the same as demo_table.css. This file is
	 * required for 'cleanliness' of the markup
	 *
	 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	 * DataTables features
	 */
	.dataTables_length{
		width: 40%;
		float: left;}
	.dataTables_filter{
		width: 50%;
		float: right;
		text-align: right;}
	.dataTables_info{
		width: 50%;
		float: left;}
	.dataTables_paginate{
		float: right;
		text-align: right;}

	/* Pagination nested */
	.paginate_disabled_previous, .paginate_enabled_previous, .paginate_disabled_next, .paginate_enabled_next{
		height: 19px;
		width: 19px;
		margin-left: 3px;
		float: left;}
	.paginate_disabled_previous{
		background-image: url('../images/back_disabled.jpg');}
	.paginate_enabled_previous{
		background-image: url('../images/back_enabled.jpg');}
	.paginate_disabled_next{
		background-image: url('../images/forward_disabled.jpg');}
	.paginate_enabled_next{
		background-image: url('../images/forward_enabled.jpg');}

	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	 * DataTables display
	 */
	table.display{
		font-family: Calibri, Arial;
		margin: 0 auto;
		width: 100%;}
	table.display td{
		color: #FFFFFF;
		font-family: Calibri, Arial;
		text-align: center;}

	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	 * DataTables sorting
	 */
	.sorting_asc{
		background: url('../images/sort_asc.png') no-repeat center right;}
	.sorting_desc{
		background: url('../images/sort_desc.png') no-repeat center right;}
	.sorting{
		background: url('../images/sort_both.png') no-repeat center right;}
	.sorting_asc_disabled{
		background: url('../images/sort_asc_disabled.png') no-repeat center right;}
	.sorting_desc_disabled{
		background: url('../images/sort_desc_disabled.png') no-repeat center right;}

	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	 * DataTables row classes
	 */
	table.display tr.odd.gradeA{
		background-color: #ddffdd;}
	table.display tr.even.gradeA{
		background-color: #eeffee;}
	table.display tr.odd.gradeA{
		background-color: #ddffdd;}
	table.display tr.even.gradeA{
		background-color: #eeffee;}
	table.display tr.odd.gradeC{
		background-color: #ddddff;}
	table.display tr.even.gradeC{
		background-color: #eeeeff;}
	table.display tr.odd.gradeX{
		background-color: #ffdddd;}
	table.display tr.even.gradeX{
		background-color: #ffeeee;}
	table.display tr.odd.gradeU{
		background-color: #ddd;}
	table.display tr.even.gradeU{
		background-color: #eee;}
	tr.odd{
		background-color: rgba(255, 255, 255, 0.05);}
	tr.even{
		background-color: rgba(255, 255, 255, 0.1);}

	/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
	 * Misc
	 */
	.dataTables_scroll{
		clear: both;}
	.top, .bottom{
		padding: 15px;
		background-color: #F5F5F5;
		border: 1px solid #CCCCCC;}
	.top .dataTables_info{
		float: none;}
	.clear{
		clear: both;}
	.dataTables_empty{
		text-align: center;}
	tfoot input{
		margin: 0.5em 0;
		width: 100%;
		color: #444;}
	tfoot input.search_init{
		color: #999;}
	td.group{
		background-color: #d1cfd0;
		border-bottom: 2px solid #A19B9E;
		border-top: 2px solid #A19B9E;}
	td.details{
		background-color: #d1cfd0;
		border: 2px solid #A19B9E;}
	.example_alt_pagination div.dataTables_info{
		width: 40%;}
	.paging_full_numbers span.paginate_button, .paging_full_numbers span.paginate_active{
		border: 1px solid #aaa;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		padding: 2px 5px;
		margin: 0 3px;
		cursor: pointer;
		*cursor: hand;}
	.paging_full_numbers span.paginate_button{
		background-color: #ddd;}
	.paging_full_numbers span.paginate_button:hover{
		background-color: #ccc;}
	.paging_full_numbers span.paginate_active{
		background-color: #99B3FF;}
	table.display tr.even.row_selected td{
		background-color: #B0BED9;}
	table.display tr.odd.row_selected td{
		background-color: #9FAFD1;}

	/*
	 * Sorting classes for columns
	 */
	/* For the standard odd/even */
	tr.odd td.sorting_1{
		background-color: rgba(255, 255, 255, 0.075);}
	tr.odd td.sorting_2{
		background-color: #DADCFF;}
	tr.odd td.sorting_3{
		background-color: #E0E2FF;}
	tr.even td.sorting_1{
		background-color: rgba(255, 255, 255, 0.125);}
	tr.even td.sorting_2{
		background-color: #F2F3FF;}
	tr.even td.sorting_3{
		background-color: #F9F9FF;}

	/* For the Conditional-CSS grading rows */
	tr.odd.gradeA td.sorting_1{
		background-color: #c4ffc4;}
	tr.odd.gradeA td.sorting_2{
		background-color: #d1ffd1;}
	tr.odd.gradeA td.sorting_3{
		background-color: #d1ffd1;}
	tr.even.gradeA td.sorting_1{
		background-color: #d5ffd5;}
	tr.even.gradeA td.sorting_2{
		background-color: #e2ffe2;}
	tr.even.gradeA td.sorting_3{
		background-color: #e2ffe2;}
	tr.odd.gradeC td.sorting_1{
		background-color: #c4c4ff;}
	tr.odd.gradeC td.sorting_2{
		background-color: #d1d1ff;}
	tr.odd.gradeC td.sorting_3{
		background-color: #d1d1ff;}
	tr.even.gradeC td.sorting_1{
		background-color: #d5d5ff;}
	tr.even.gradeC td.sorting_2{
		background-color: #e2e2ff;}
	tr.even.gradeC td.sorting_3{
		background-color: #e2e2ff;}
	tr.odd.gradeX td.sorting_1{
		background-color: #ffc4c4;}
	tr.odd.gradeX td.sorting_2{
		background-color: #ffd1d1;}
	tr.odd.gradeX td.sorting_3{
		background-color: #ffd1d1;}
	tr.even.gradeX td.sorting_1{
		background-color: #ffd5d5;}
	tr.even.gradeX td.sorting_2{
		background-color: #ffe2e2;}
	tr.even.gradeX td.sorting_3{
		background-color: #ffe2e2;}
	tr.odd.gradeU td.sorting_1{
		background-color: #c4c4c4;}
	tr.odd.gradeU td.sorting_2{
		background-color: #d1d1d1;}
	tr.odd.gradeU td.sorting_3{
		background-color: #d1d1d1;}
	tr.even.gradeU td.sorting_1{
		background-color: #d5d5d5;}
	tr.even.gradeU td.sorting_2{
		background-color: #e2e2e2;}
	tr.even.gradeU td.sorting_3{
		background-color: #e2e2e2;}

	/*
	 * Row highlighting example
	 */
	.ex_highlight #example tbody tr.even:hover, #example tbody tr.even td.highlighted{
		background-color: #ECFFB3;}
	.ex_highlight #example tbody tr.odd:hover, #example tbody tr.odd td.highlighted{
		background-color: #E6FF99;}
	