body {
	background:transparent;
	min-height:100%;
	-webkit-font-smoothing: antialiased;
	-webkit-overflow-scrolling: touch;
	font-size:14px;
	font-family: 'Helvetica',Helvetica,Arial,Lucida,sans-serif;
	color: #282828;
	font-weight: normal;
	line-height: 1.6em;
}


/********************************************************/
/*             Sections - universal classes             */
/********************************************************/
/* .section rules are commented out - not needed */

/* Show one of sections */
#head {display: block; padding-bottom: 30px;}

#content {padding-top: 20px; padding-bottom: 20px;}
#content p {margin-bottom: 1.2em;}

#head img{max-width : 300px;padding: 20px 0;}
#head h1{margin-top: 0;font-size: 21px !important; font-weight: 600;}
h2{text-transform: uppercase;}

#footer-bottom{background-color: #a8cde6;padding: 15px 0 5px;text-align: center;color: #282828;}
#footer-info {font-size: 15px;padding-bottom: 10px;}
#footer-info, #footer-info a {color: #006eb6;}

/********************************************************/
/*                      Typography                      */
/********************************************************/
a { color:#016fb6; text-decoration: none; }
a:hover, a:active { color:#016fb6; text-decoration: underline; }
.lead {
	font-weight:normal;
	font-size:1.5em;
	line-height:1.2em;
}

.title, .subtitle{
	font-family: 'Helvetica',Helvetica,Arial,Lucida,sans-serif;
	font-weight: bold;
	font-style: normal;
	text-transform: uppercase;
	text-decoration: none;
	color: #016fb6;
	font-size: 26px;
  line-height: 28px;
}

p{padding-bottom: 1em;}
p.subtitle{padding-bottom: 0; margin-bottom: 0; font-size: 18px;text-transform: capitalize;}

.rating-block{margin-bottom: 0; clear: both;}
.rating-block .row {align-items: center; margin-bottom: 0;}

.step2 .actu img {
    max-height: 250px;
    /* max-width: 100%; */
    width: 380px;
    min-height: 250px;
}

/********************************************************/
/*                   UI - Buttons                       */
/********************************************************/
.btn{
	position: relative;
	text-align : center;
	padding: .3em 1em;
	border: 1px solid #FFF;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.7em !important;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	transition: all .2s;
	background-color: #016fb6;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	color:#FFF;
	text-shadow: none;
	text-decoration: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border:0 none;
}

.btn:hover {
	border: 1px solid #016fb6;
	background-color: #FFF;
	color : #016fb6;
	text-decoration: none;
}

/*Rating*/
.rating-circle,.rating-nps {
   height: 2.5em;
   width: 2.5em;
   border: .1em solid black;
   border-radius: 1.2em;
   display: inline-block;
   margin: 0;
   padding: .25em;
   text-align: center;
   margin-bottom: 10px;
}

.rating-mini{height: 1em;width: 1em;background-color: #808080;}
.rating-mini-green{height: 1em;width: 1em;background-color: #8bc34a;}

.rating-hover { background-color: yellow;}

.rating-default, .level-1 .rating-chosen .l0, .rating-hover.l0{background-color: #808080;}
.level-2 .rating-chosen,.lvl-6 .rating-chosen,.lvl-5 .rating-chosen,.lvl-4 .rating-chosen,.lvl-3 .rating-chosen,.lvl-2 .rating-chosen,.lvl-1 .rating-chosen,.lvl-0 .rating-chosen, .rating-hover.l1, .rating-hover.nps0,.rating-hover.nps1,.rating-hover.nps2,.rating-hover.nps3,.rating-hover.nps4,.rating-hover.nps5{background-color: #FF0000;}
.level-3 .rating-chosen,.lvl-7 .rating-chosen, .rating-hover.l2, .rating-hover.nps6{background-color: #ef6c00;}
.level-4 .rating-chosen,.lvl-8 .rating-chosen, .rating-hover.l3, .rating-hover.nps7{background-color: #ffc107;}
.level-5 .rating-chosen,.lvl-9 .rating-chosen, .rating-hover.l4, .rating-hover.nps8{background-color: #cddc39;}
.level-6 .rating-chosen,.lvl-10 .rating-chosen,.lvl-11 .rating-chosen, .rating-hover.l5, .rating-hover.nps9,.rating-hover.nps10{background-color: #8bc34a;}

#quest{
	display: none;
	margin:auto;
	text-align: center;
	width: 100%;
}

@media screen and (max-width: 767px) {
.subtitle{text-align: left;}
.titreactu{text-align: center;}
}

@media screen and (max-width: 480px) {
	#head img { max-width: 250px;}
#head h1 {   font-size: 18px !important;}
.title, .subtitle {font-size: 24px;line-height: 24px;padding-bottom: 0;}
p { font-size: 12px;}
h2, .h2 { font-size: 19px;}
h3, .h3 { font-size: 18px;}
textarea { width: 95%;}
.text-start, .text-end {text-align: center;}
#footer-info { font-size: 8px;   padding-bottom: 10px;}
.step2 .actu img { max-height: 100%; max-width: 100%;  width: 100%; min-height: auto;}
}




/********************
* NPS
* ******************/

.ratingREP,.ratingDET{
	display: inline;
  padding: 10px 24px;
  font-weight: bolder;
  background: green;
  color: #fff;
}
.ratingDET{background: #b41334;}
.titlenps{
	padding-bottom: 20px;
	font-size:14px;
}
.ratingtab{
	text-align: center;
	width: 100%;
	margin:auto;
}
.ratingtab table{
	width: 80%;
  text-align: center;
  margin: auto;
  margin-top: 20px;
}
.ratingtab table td{
	height: 30px;
}
.npstitre, .npsreponse{
	font-weight: bold;
	text-align: center;
	color: #000;
	width: 9%;
}
.npsreponse{height: 50px !important; vertical-align:center; color: #fff;}
.npsn0{background-color:#b41334; }
.npsn1{background-color:#e21418; }
.npsn2{background-color:#f43d2f; }
.npsn3{background-color:#ef6828; }
.npsn4{background-color:#f78930; }
.npsn5{background-color:#ffab19; }
.npsn6{background-color:#f5d909; }
.npsn7{background-color:#e6e7e9; color:#9b9c9e; }
.npsn8{background-color:#e6e7e9; color:#9b9c9e;}
.npsn9{background-color:#85c83a; }
.npsn10{background-color:#48a53d; }

.ratinggraph table,.retourtab table{
	  margin: auto;
    width: 80%;
    text-align: center;
    margin-top: 40px;
    margin-bottom: 20px;
}

.retourtab table{border: 1px grey solid;}
.ratinggraph table td{text-align: center;}
.retourtab table td{height: 90px;}
.retourtab table td.textr{
	vertical-align: top;
	text-align: left;
	padding: 5px 10px;
}

.score{
	font-size: 48px;
  color: #48a53d;
  font-weight: 800;
}