html,
body {
   margin:0;
   padding:0;
   height:100%;
   	font-size:1em;
   	color: #efefef;
	-webkit-touch-callout: none;
	font-family: "Helvetica Neue", "Helvetica", "Gill Sans", "Gill Sans MT", "Calibri", sans-serif;
	font-weight: 400;
	background-color: white;
}


H1 {
	font-size: 4em;
	font-weight: 500;
	margin: 0;
	color: white;
}



H2 {
	font-size: 2.5em;
	font-weight: 100;
	font-family: "Helvetica Neue";
	margin: 0;
	color: white;
}


H3 {
	font-size: 1.8em;
	font-weight: 900;
	margin: 0;
	color: white;
}


H4 {
	font-size: 1.5em;
	font-weight: 300;
	margin: 0;
	color: white;
}


H5 {
	font-size: 1.3em;
	font-weight: 300;
	margin: 0;
	color: white;
}
A {
	text-decoration: none;
	color: #CBE3E0;
}
A:hover{
	text-decoration: none;
	color: Orange;
  -webkit-transition: 1.5s ease-out;	
   -moz-transition: 1.5s ease-out;	
   -o-transition: 1.5s ease-out;	
   -ms-transition: 1.5s ease-out;	
   transition: 1.5s ease-out;		
}

sup {
	font-size: 0.3em;
	margin: 0;
}


sub {
	font-size: 0.6em;
}



TABLE {
	-moz-box-shadow: 5px 5px 5px 0px #656565;
	-webkit-box-shadow: 5px 5px 5px 0px #656565;
	-o-box-shadow: 5px 5px 5px 0px #656565;
	box-shadow: 5px 5px 5px 0px #656565;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=5);
	-moz-border-radius: 5px 5px 5px 5px;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	border: 1px solid #E1E1E1;
	padding: 2px;
	font-family: "Helvetica Neue", "Gill Sans", "Gill Sans MT", "Calibri", sans-serif;
}


.row {
	width:100%;
	position: relative;
	margin: auto;
	
}

.row > div {
	float : left;

}

.row::after { 
   content: "";
   display: block; 
   clear: both;
}
.w-1 { width : 7.3%; }
.w-1-1  { width : 10%; }
.w-1-5  { width : 12.5%; }
.w-2 { width : 16.664%; }
.w-3 { width : 25%; }
.w-3b { width : 25%; }
.w-4 { width : 33.3%; }
.w-5 { width : 40.6%; }
.w-6 { width : 49%; }
.w-7 { width : 57.3%; }
.w-8 { width : 66.6%; }
.w-9 { width : 74%; }
.w-10 { width : 82.3%; }
.w-11 { width : 90.6%; }
.w-12 { width : 99%; margin:auto}
.w-13 { width : 100%; margin:auto}
.clear { clear : both ; }


.avatar {width: 100%; height: auto}


.present {

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c4c4c4+6,d3e4ff+41,ffffff+67 */
background: #c4c4c4; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #c4c4c4 6%, #d3e4ff 41%, #ffffff 67%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover,  #c4c4c4 6%,#d3e4ff 41%,#ffffff 67%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center,  #c4c4c4 6%,#d3e4ff 41%,#ffffff 67%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4c4c4', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
}
.absent {
  color: white;
  background: repeating-linear-gradient(
    45deg,
    #bc6067,
    #bc6067 10px,
    #ce0000 10px,
    #ce0000 20px
  );
}

.deconnecte {
  color: white;
  background: repeating-linear-gradient(
    45deg,
    #606dbc,
    #606dbc 5px,
    #465298 5px,
    #465298 21.15px
  );
}

.nonpret {
  background: repeating-linear-gradient(
    45deg,
    #656565,
    #656565 5px,
    #323232 5px,
    #323232 21.15px
  );
  color:white;
}

.pauserepas {
	background: url('../image/pause_repas.png?1');
	background-attachment: no-repeat;
	background-position:top center;
	background-size:100%;
	-o-background-size:100%;
	-moz-background-size:100%;
	-webkit-background-size:100%;
	color: blue;
	font-weight: bold;
	text-shadow: 2px 2px 2px rgba(150, 150, 150, 1);
}


.pause30mn {
	background: url('../image/pause_30mn.png?p');
	background-attachment: no-repeat;
	background-position:top center;
	background-size:100%;
	-o-background-size:100%;
	-moz-background-size:100%;
	-webkit-background-size:100%;
	color: green;
	font-weight: bold;
	text-shadow: 2px 2px 2px rgba(150, 150, 150, 1);
}

.count_here {
	background: url('../image/consultant_here.png') no-repeat;
	background-attachment: no-repeat;
	background-position:center center;
	background-size:contain;
	-o-background-size:contain;
	-moz-background-siz:contain;
	-webkit-background-size:contain;
	font-weight: bold;
	text-shadow: 2px 2px 2px rgba(255, 255, 255, 1);

}
.count_30mn {
	background: url('../image/consultant_30mn.png') no-repeat;
	background-attachment: no-repeat;
	background-position:center center;
	background-size:contain;
	-o-background-size:contain;
	-moz-background-siz:contain;
	-webkit-background-size:contain;
	font-weight: bold;
	text-shadow: 2px 2px 2px rgba(255, 255, 255, 1);

}


.count_repas {
	background: url('../image/consultant_eat.png') no-repeat;
	background-attachment: no-repeat;
	background-position:center center;
	background-size:contain;
	-o-background-size:contain;
	-moz-background-siz:contain;
	-webkit-background-size:contain;
	font-weight: bold;
	text-shadow: 2px 2px 2px rgba(255, 255, 255, 1);

}


.count_absent {
	background: url('../image/consultant_nothere.png') no-repeat;
	background-attachment: no-repeat;
	background-position:center center;
	background-size:contain;
	-o-background-size:contain;
	-moz-background-siz:contain;
	-webkit-background-size:contain;
	font-weight: bold;
	text-shadow: 2px 2px 2px rgba(255, 255, 255, 1);

}


.banner_ca {
	color:white;
	background-color: black;
	
}


.subbanner_ca {
	color:black;
	background-color: #ebebeb;
	
}

.footer_ca {
	color:#3d3d3d;
	background-color: #f8e2f6;
	padding: 5px;
}

.circleda {
    border-radius: 50%;
    behavior: url(PIE.htc); /* remove if you don't care about IE8 */
    width: 35px;
    height: 35px;
    background: #ffeaea;
    text-align:center;
    line-height: 35px;
    color: #e600ff;
    font-size: 2.3em;
    font-weight: bold;
    margin: 2px;
    -moz-box-shadow: 3px 3px 5px 0px #343434;
	-webkit-box-shadow: 3px 3px 5px 0px #343434;
	-o-box-shadow: 3px 3px 5px 0px #343434;
	box-shadow: 3px 3px 5px 0px #343434;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#343434, Direction=135, Strength=5);
}


/*-- 8.contact css 
-----------------------------------------------*/
#contact{
  padding: 0px 0 50px;

}
#contact form{
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}
#contact input,
#contact textarea{
  font-family: GoudyStM-Italic;
  height: auto;
  background-color: #ffffff;
  border: none;
  border-bottom: 1px solid #cccccc;
  font-size: 16px;
  line-height: 20px;
  color: #555555;
  letter-spacing: 1px;
  padding: 15px;
  border-radius: 0;
  box-shadow: none;
  resize: none;
}
#contact input::-webkit-input-placeholder,
#contact textarea::-webkit-textarea-placeholder{
  color: #555555;
}
#contact input::-moz-placeholder,
#contact textarea::-moz-placeholder{
  color: #555555;
}
#contact input:-moz-placeholder,
#contact textarea:-moz-placeholder{
  color: #555555;
}
#contact input:-ms-input-placeholder,
#contact textarea:-ms-textarea-placeholder{
  color: #555555;
}
#contact .btn{
  background-color: #47474d;
  border: none;
}

input:focus,
.btn:focus,
a:focus,
button:focus{
    outline: 0;
}
.btn{
  min-width: 160px;
  font-size: 12px;
  line-height: 40px;
  color: white;
  padding: 0 15px;
  font-family: Lato_black;
  text-transform: uppercase;
  letter-spacing: 1px;
  border: 1px solid #ff0000;
  border-radius: 0;
  z-index: 2;
  position: relative;
}
.btn .hover{
  width: 100%;
  height: 40px;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  display: block;
  background-color: #52c2b7;
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -ms-transition: all .5s;
  transition: all .5s;
}
.btn:hover,
.btn:focus{
  color: #020202!important;
}
.btn:hover .hover{
  -webkit-transform: scaleX(1);
  -moz-transform: scaleX(1);
  -ms-transform: scaleX(1);
  transform: scaleX(1);
}
.form-control{display:block;width:95%;height:34px;padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}.form-control:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)}.form-control::-moz-placeholder{color:#999;opacity:1}.form-control:-ms-input-placeholder{color:#999}.form-control::-webkit-input-placeholder{color:#999}.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control{background-color:#eee;opacity:1}.form-control[disabled],fieldset[disabled] .form-control{cursor:not-allowed}textarea.form-control{height:auto}input[type=search]{-webkit-appearance:none}

@media only screen and (min-width:120px) and (max-width:1024px){
	.row {
		width : 100%;
	}
	.row > div { 
		float : left;
	}
	.row::after { 
		content: "";
		display: block; 
		clear: both;
	}
	.w-1, .w-2 .w-3,  .w-4, .w-5, .w-5b, .w-6, .w-7, .w-8, .w-9, .w-10, .w-11, .w-12, .w-13{ width : 100%; margin:auto;clear: both}


	H1 {
		font-size: 4em;
		font-weight: 500;
		margin: 0;
	}
	H2 {
		font-size: 1.6em;
		font-weight: 300;
		margin: 0
	}
	
	
	H3 {
		font-size: 1.4em;
		font-weight: 300;
		margin: 0
	}
	
	
	H4 {
		font-size: 1.2em;
		font-weight: 300;
		margin: 0
	}
	
	
	H5 {
		font-size: 1em;
		font-weight: 300;
		margin: 0
	}
	
}


@media only screen and (min-width:120px) and (max-width:1024px) and (orientation: landscape) {
	.w-2 { width: 33.3%; border:1px solid black;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box; }
	.w-3b { width: 25%; }
}