*{
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	color:white;
}
a {
	color:#015148;
}
a:hover {
	color:white;
}
.reassurance a {
	color:white;
}
h1, h2, h3, h4, h5 {
	font-family: "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight: bold;
	font-style: italic;
	text-transform: uppercase;
}
html, body {
	margin:0 !important;
	padding:0 !important;
}
body {
	background:#91bc39;
}
header {
	background: white;
}
header .dev p {
    background: #b140d6;
    text-align: center;
    padding: 5px;
    font-size: 1.1em;
	margin: 0 0 -20px 0;
}
header .part-1 {
	padding: 30px 20px 0px 30px;
    margin-bottom: -55px;
}
header .part-1 #logos .icone {
	width: 100px;
	vertical-align: middle;
}
header .section-separator-svg {
	margin-bottom: 3px;
}
.content-inscription {
	padding: 30px 40px 0 60px;
}
.content-inscription .left p{
	font-size: 1.5em;
	width: 60%;
}
.content-mdp {
	padding: 30px 40px 0 80px;
}

.home #content h1 {
	font-size: 3.5em !important;
    text-align: left;
    margin-top: 20px;
    margin-bottom: 10px;
}
#content h1 {
	text-align: center;
    margin-top: 0;
    font-size: 2em !important;
    margin-bottom: 10px;
}
h1 span.version {
    /* text-transform: capitalize; */
    position: absolute;
    /* top: 10px; */
    margin-top: -10px;
    font-size: 17px;
    color: #ffffff99;
}
#content {
	padding: 0 3% 3% 3%;
	background:#91bc39;
	min-height: 400px;
}
.degrade {
	background: rgb(142,188,57);
	background: -webkit-linear-gradient(left, rgba(142,188,57,1) 30%, rgba(77,133,74,1) 100%);
	background: -o-linear-gradient(left, rgba(142,188,57,1) 30%, rgba(77,133,74,1) 100%);
	background: linear-gradient(to right, rgba(142,188,57,1) 30%, rgba(77,133,74,1) 100%);
}
footer {
	background: #015148;
	background: url(https://app.ridel-energy.com/img/fond-footer.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}
footer .section-separator-svg {
	
}
footer .reassurance{
	padding: 0px 20px 20px 20px;
    margin-top: -55px;
}
footer .reassurance #logos img {
    width: 40px;
    height: 40px;
    margin: 10px;
}
footer .reassurance .mentions {
    line-height: 50px;
	color:#DADADA;
}
.mentions {
	font-size: 0.85em !important;
    opacity: 0.9 !important;
}
.separation {
    border-top: 5px;
    border-top-style: dashed;
    opacity: 0.5;
    line-height: 0;
    margin: 25px auto;
    width: 70%;
    text-align: center;
}
p.btn.secondaire a {
    background: rgb(77 133 74);
    font-size: 1em !important;
    padding: 10px 25px;
    display: inline-block;
}
p.btn.supp a {
    background: #df5d5d;
    font-size: 1em !important;
    padding: 10px 25px;
    display: inline-block;
}
p.btn.bleu a {
    background: #3d7bb2;
    font-size: 1em !important;
    padding: 10px 25px;
    display: inline-block;
}
p.btn.secondaire a:hover, p.btn.supp a:hover, p.btn.bleu a:hover {
    background: white;
}
/*--------PAGE DE CONNEXION---------*/
.content-center {
    display: inline-block;
    text-align: center;
    margin: 0 auto;
    border: 6px solid #efefef;
    border-radius: 15px;
    padding: 20px;
}
/*-------FORM----------*/
form {
	width: 450px;
}

form input, form select, form textarea {
    background: #EDEDED;
    border: none;
    border-radius: 4px;
    color: #595959;
}
form textarea {
    padding: 5px 5px 5px 30px;
    resize: vertical;
}
form input:hover, form select:hover, form input:focus, form select:focus, form input:active, form select:active {
    background: #fff;
}
form input::placeholder, form select option {
	 color: #1D1D1D;
}
form .gr-field-2 input {
    padding: 10px 10px 10px 33px;
    width: 158px;
}
form .gr-field-2 input#prenom, form .gr-field-2 input#nom {
    width: 104px;
}
form .gr-field-2 input {
    padding: 10px 10px 10px 33px;
    width: 158px;
}
input:disabled {
    opacity: 0.7;
}
 form .gr-field-2 select#civilite {
    width: 95px;
}

 form .gr-field-2 select {
    padding: 10px 10px 10px 33px;
    width: 204px;
}

form input {
    padding: 10px 10px 10px 33px;
    width: 386px;
}
form .gr-field input.puiss {
    padding: 10px 35px 10px 33px;
}

form  select {
    padding: 10px 10px 10px 33px;
    width: 386px;
}
form label {
    color: #AAAAAA !important;
    position: absolute;
    margin: 10px;
}
.gr-field-2, .gr-field {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.field {
    flex: 1;
    margin: 10px;
	position: relative;
}
form label i {
    color: #AAAAAA !important;
}
form .gr-submit .submit:hover {
	cursor: pointer;
}
form .gr-submit i {
	position: relative;
    left: 28px;
    top: 3px;
    color: #91BC39;
    font-size: 22px;
    width: 0px;
}
form .gr-submit .submit {
	display: inline-block;
    padding: 15px 45px 15px 58px;
    background-color: #015148;
    font-weight: bold;
    border: none;
    border-radius: 50px;
	color:white;
	transition: all 0.3s;
}
form .gr-submit .submit:hover {
    background-color: white;
	color:#015148;
}
.msg-ok-form {
	background: #4e854a;
    border-radius: 5px;
    width: 85%;
    margin: 13px auto;
    font-size: 12px;
    padding: 20px;
}
.msg-no-form {
	background: #c54b4b;
    border-radius: 5px;
    width: 85%;
    margin: 13px auto;
    font-size: 12px;
    padding: 20px;
}
.alert-ok p {
    background: #f4f4f4;
    border: solid 2px #ffffff;
    padding: 10px;
	margin:0;
    color: #91bc39;
    border-radius: 9px;
    width: 410px;
}
.alert-ok p strong{
    color: #759C24;
}.error input {
	border:solid 2px #c32a2a;
}
.error-puiss {
        border: 2px solid #c32a2a;
}
.fond-error-puiss {
        background: #fb4c4c42 !important;
}
.alert {
    background: #f4f4f4;
    border-bottom: solid 4px #c32a2a;
    padding: 10px;
    color: #015148 !important;
    width: 410px;
    margin: 0 auto;
}
.alert p{
	margin:0;
	color:#015148;
}
.alert p strong {
    color: #015148;
}
.btn a {
	display: inline-block;
    padding: 15px 35px;
    background-color: #015148;
    font-weight: bold;
    border: none;
    line-height: 22px;
	margin: 5px;
    border-radius: 50px;
    color: white;
    text-decoration: none;
	transition: all 0.3s;
}
.btn a i {
	color: #91BC39;
    font-size: 22px;
}
.btn a:hover{
	background-color: white;
    color: #015148;
	cursor: pointer;
}
.btn span.info {
    display: inline-block;
    margin: 5px 16px;
    font-weight: bold;
}

#form-relance {
	width: auto;
}

#form-relance label{
	position: relative;
}

#form-relance input {
	width: auto;
}
/*---------MON COMMERCIAL-----------*/
#help {
	position: fixed;
    width: 80%;
    height: 100%;
    background: #0000007a;
    z-index: 100;
	top: 0;
    right: 0;
    padding: 10%;
    display: none;
}
#help .close {
	text-align: center;
	font-size: 1.6em;
}
#help .close a{
	color: white !important;
	text-decoration: none !important;
}
.help-me {
	padding: 7px 18px;
    background: #4e854a;
    color: white;
    font-size: 1em;
    font-weight: bold;
    border: none;
	transition: all 0.3s;
}
.help-me:hover {
	cursor: pointer;
	background:#015148;
}
div#fiche-commercial {
    padding: 20px;
    background: white;
    border-radius: 31px;
    width: 200px;
    margin: 0 auto;
}
div#fiche-commercial p.titre-commercial {
    text-align: center;
	color: #015148 !important;
    font-size: 1.2em;
    font-weight: bold;
    font-style: italic;
    text-transform: uppercase;
    border-bottom: 2px dashed #00000012;
    padding-bottom: 5px;
    margin: 0;
}
p.img-commercial {
    text-align: center;
    margin-bottom: 0;
}
p.img-commercial img {
    width: 110px;
}
p.name-commercial {
    text-align: left;
    font-size: 1.2em;
    font-weight: bold;
    color: #91bc39 !important;
    /* border-bottom: 2px solid white; */
    /* padding: 0 0 10px 0; */
    margin: 5px auto 10px auto;
    /* width: 80%; */
}
div#fiche-commercial p.tel-commercial, div#fiche-commercial p.email-commercial {
    font-size: 0.9em;
    color: #015148 !important;
    margin: 4px 0;
}
div#fiche-commercial p.tel-commercial i, div#fiche-commercial p.email-commercial i {
    color: #91bc39;
}
p.qr-commercial {
    text-align: center;
}
p.qr-commercial img {
    width: 75px;
}
/*---POP UP---*/
.plan-produits {
	position: fixed;
    width: 80%;
    height: 100%;
    background: #0000007a;
    z-index: 10;
	top: 0;
    right: 0;
    padding: 10%;
    display: none;
}
.plan-produits .close {
	text-align: center;
	font-size: 1.6em;
}
.plan-produits .close a{
	color: white !important;
	text-decoration: none !important;
}
.content-popup {
	padding: 20px;
    background: white;
    border-radius: 31px;
    width: 300px;
    margin: 0 auto;
	color:black;
}
.content-popup h3, .content-popup ul li{
	color: black;
}
.content-popup a:hover{
	color:#91bc39;
	text-decoration: underline;
}
.btn .button {
	display: inline-block;
    padding: 3px 10px;
    background-color: #015148;
    font-weight: 200;
    border: none;
    line-height: 22px;
    border-radius: 50px;
    font-size: 12px;
    color: white;
    text-decoration: none;
    transition: all 0.3s;
}
.btn .button i {
	color: #91bc39;
	font-size: 12px;
}
.btn .button:hover {
	background-color: white;
    color: #015148;
	cursor: pointer;
}
.btn .button:hover i{
    color: #91bc39;
}
/*---FIN POP UP---*/
/*---------TOOLS-----------*/
.logo-partenaire {
	vertical-align: middle;
	width: 200px;
	margin-left:20px;
}
img.logo-groupement {
    vertical-align: middle;
    width: 100px;
    margin-left: 20px;
}
div#compte {
    position: absolute;
    right: 29px;
    top: 72px;
}
#compte a {
    color: #eaeaea;
    text-align: center;
	vertical-align: top;
    font-size: 0.9rem;
    display: inline-block;
    text-decoration: none;
    margin: 10px;
}
#compte a i {
    font-size: 1.7em;
	width: 100%;
    color: #eaeaea;
}
#compte a:hover, #compte a:hover i {
    color: #015148;
}
#list-tools {
	display: flex;
    flex-wrap: wrap;
}
#list-tools .item-tool {
	display: inline-block;
    margin: 20px;
    background: #EDEDED;
    border-radius: 5px;
    padding: 20px;
    /* flex: auto; */
    width: 20%;
    position: relative;
}
#list-tools .item-tool.indispo {
    opacity: 0.5;
}
#list-tools .item-tool.indispo:hover, #list-tools .item-tool.indispo a:hover {
    cursor: not-allowed !important;
}
#list-tools .tool-admin {
	border-bottom: 5px solid #B140D6;
}
#list-tools .item-tool h2 {
	color:#0C684D;
	margin:0 0 10px 0;
	font-weight: bold;
	text-transform: none;
    text-align: center;
}
#list-tools .item-tool h2 i {
	color:#0C684D !important;
    font-size: 1.4em;
    margin-bottom: 5px;
}
#list-tools .item-tool .description-tool {
	color:#7D9B97;
	margin:0 0 5px 0;
	font-size: 15px;
}
#list-tools .item-tool .version-tool {
	color:#7D9B97;
	margin:0;
	font-style: oblique;
	font-size: 0.7em;
}
.item-tool .btn {
	text-align: center;
    /* position: absolute; */
    bottom: 0;
    width: 85%;
    margin: 10px auto 0 auto;
    transition: all 0.3s;
}
.item-tool .btn i {
	position: relative;
    left: 22px;
    top: 1px;
    color: #91BC39;
    font-size: 17px;
    width: 0px;
}
.item-tool .btn a {
	display: inline-block;
    padding: 7px 24px 7px 43px;
    background-color: #015148;
    font-weight: 100;
    border: none;
    border-radius: 50px;
	color:white;
	transition: all 0.3s;
}
.item-tool .btn a:hover {
    background-color: white;
	color:#015148;
	
}
/*----------SELECTIONNEUR----------*/
.selectionneur #infos {
	padding: 20px;
    width: 27%;
    display: inline-block;
    text-align: center;
    background: #b7d579;
    border-radius: 10px;
    margin: 0 auto;
}
div#perimetres {
	text-align: left;
    width: 300px;
    display: inline-block;
    background: #EDEDED;
    border-radius: 5px;
    padding: 20px;
    margin: 26px;
    max-width: 280px;
    position: relative;
}
div#perimetres p.description {
    margin: 0;
    font-weight: bold;
    color: #015148;
}
li.item-perimetre {
    color: #AAAAAA;
}
div#perimetres p {
    color: #aaa;
}
/*--ETAPE1--*/
.selectionneur {
	padding:20px;
}

#etape3 .right {
    margin-top: 30px;
}
div#options, div#vente {
    border: 2px solid #8b8b8b;
    padding: 10px;
    border-radius: 10px;
    margin: 20px 0;
}
div#options ul li, div#vente ul li {
    color: #8b8b8b;
}
#resultat ul li {
    font-size: 1.2em;
}
#etape3 .right .btn a {
    font-size: 1.2em;
}
#etape3 p {
    font-size: 1.2em;
}
div#options h3, div#vente h3 {
    color: #8b8b8b;
    margin: 0 0 10px 10px;
	font-size: 1em;
}
div#options h3 i, div#vente h3 i{
    color: #015148 !important;
}

.selectionneur p.warning, .selectionneur p.warning i {
    color: #015148;
    font-size: 1.3em;
    font-weight: bold;
}

.selectionneur .content-selectionneur {
	width: 100%;
	display: flex;
	justify-content: center;
}
.selectionneur .center {
	width: 100%;
	text-align: center;
}

.selectionneur .left {
	padding: 20px;
    background: #b7d579;
    border-radius: 10px;
    margin: 0 30px;
	
}
span.kw {
    position: absolute;
    display: inline-block;
    pointer-events: none;
    width: 25px;
    text-align: center;
    right: 7px;
    top: 10px;
    font-size: 13px;
    color: #015148;
    font-style: normal;
}
#etape1 .left {
	max-width: 280px;
}
#etape1 .left h3 {
	margin-top: 0px;
}
/*--aide---*/
.aide {
    position: absolute;
}
@keyframes tr-opacity { 
  0% {
    opacity: 0;
  }

  100% {
    opacity: 0.9;
  }
}

.aide span {
    display: none;
    position: absolute;
    width: 130px;
    left: 27px;
    opacity: 0;
    font-style: italic;
    background: #015148;
    font-size: 0.9em;
    padding: 10px;
    border-radius: 10px;
	z-index: 200;
}
.aide:hover span {
    opacity: 0.9;
	display: block;
	animation: tr-opacity 0.5s;
}

#etape2 .left, #etape3 .left {
	padding: 30px 50px;
    background: #EDEDED;
    border-radius: 5px;
    margin: 30px 50px;
}
#etape2 .left h2, #etape3 .left h2 {
	margin: 0 0 10px 0;
}
#resume strong {
    color: #91bc39;
}
#etape2 #resumeGroupes, #etape3 #resumeGroupes{
	margin: 10px 0;
	padding: 0 16px;
}
#etape2 #resumeGroupes li, #etape3 #resumeGroupes li {
	color:#AAAAAA;
}

.selectionneur .left h2, .selectionneur .left ul, .selectionneur .left ul li, .selectionneur .left p{
    color: #015148;
}
.selectionneur .left #infos {
	
}
.selectionneur .left #infos h3 {
	margin: 0 0 10px 0;
}
.selectionneur .left .help {
	
}
.selectionneur .help ul {
    margin: 0 !important;
    padding: 0;
    list-style: none;
}
.selectionneur .help ul li {
    margin: 0 0 10px 0;
    padding: 0 0 10px 0;
    border-bottom: 2px dashed #ffffff94;
    font-size: 0.9em;
    color: #015148 !important;
}
.selectionneur .right{
	
}
.selectionneur .right #list-group{
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.selectionneur .right #list-group .item-group{
	flex: 1;
    padding: 10px;
    background: #b7d57942;
    border-radius: 10px;
    margin: 5px;
	min-width: 225px;
}
.selectionneur .right #list-group .item-group .field .help {
    position: absolute;
    margin: 9px 0 0 5px;
    color: #015148;
}
.selectionneur .right #list-group .item-group .field .help:hover {
    cursor: pointer;
    color: #fff;
}
.item-group h3 {
    margin: 0;
    text-transform: none;
    text-align: center;
}
form#select-infos {
    text-align: center;
}
.selectionneur form {
	width: 100%;
}
.selectionneur form .gr-field{
	display: flex;
    flex-direction: column;
}
.selectionneur form input {
	width: 150px;
}
.selectionneur form input.puiss {
	width: 125px;
	text-align: right;
}
.selectionneur form select {
	width: 193px;
}
.selectionneur .actions {
    text-align: center;
    font-size: 1.4em;
}
p.help i {
    color: #91bc39;
}
p.help {
    background: #015148;
    color: #fff !important;
    padding: 10px;
    border-bottom: 2px solid #91bc39;
    display: inline-block;
    margin: 0;
}
.selectionneur .submit {
	display: inline-block;
    padding: 15px 45px 15px 58px;
    background-color: #015148;
    font-weight: bold;
    border: none;
    border-radius: 50px;
    color: white;
	transition: all 0.3s;
}
.selectionneur .submit:hover {
	background-color: white;
    color: #015148;
	cursor: pointer;
}
/*---POP UP---*/
.overlay {
  position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    backdrop-filter: blur(5px);
    background: rgb(37 71 58 / 55%);
    transition: opacity 500ms;
    visibility: visible;
    opacity: 1; 
	z-index: 99;
}
.popup1:target {
  visibility: hidden;
  opacity: 0;
}

.cctp.flex-1 {
    background: #40643d;
    text-align: center;
	padding: 15px;
}

.fluide.flex-1 {
    background: #90bc38;
    text-align: center;
	padding: 15px;
} 

/*-----PROPOSITION TECHNIQUE------*/
.proposition_technique #list-group{
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}  

.proposition_technique #list-group .item-group{
	flex: 1;
    padding: 10px;
    background: #ededed42;
    border-radius: 10px;
    margin: 5px;
	min-width: 200px;
}
.proposition_technique  .item-group .field .help {
    position: absolute;
    margin: 9px 0 0 5px;
    color: #015148;
}
.proposition_technique  .item-group .field .help:hover {
    cursor: pointer;
    color: #fff;
}
.proposition_technique .item-group .field {
	margin:2px 0 !important;
}

.proposition_technique .item-group .field label {
	margin:8px !important;
}

.proposition_technique .item-group h3{
	color:  #015148 !important;
}

.t2 .right {
	min-width: 12%;
}

.t2 .right p, .t2 .right p strong {
	color : #015148 !important;
	
}
/*---POP UP---*/

.popup .btn {
    font-size: 0.8em;
    padding: 5px 18px;
    text-align: center;
}

.popup .btn a {
    padding: 10px 20px;
}

.popup .btn a.back {
    background: #e3e3e3;
    color: #015148;
    margin-right: 22px;
}
.popup .btn a.back:hover {
    background: #fff;
}

.popup .btn a i {
    font-size: 1em;
}

.popup .mentions {
    color: black !important;
}

.popup {
  margin: 70px auto;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  width: 30%;
  position: relative;
  transition: all 5s ease-in-out;
}

.popup h2 {
  margin-top: 0;
  color: #333;
  font-family: Tahoma, Arial, sans-serif;
}
.popup .close {
  position: absolute;
  top: 20px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup .close:hover {
  color: #06D85F;
}
.popup .content {
  max-height: 30%;
  overflow: auto;
}

@media screen and (max-width: 700px){
  .box{
    width: 70%;
  }
  .popup{
    width: 70%;
  }
}
/*---POP UP NEW---*/
#popup-new .popup {
    padding: 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    width: 50%;
}
div#list-new {
    flex: 3;
    width: 30%;
    background: #015148;
    padding: 28px;
    padding-top: 50px;
	
}
#list-new h2 {
    color: #E7F6F1;
    font-size: 1.5em;
    text-transform: none;
	text-align: left;
}
#list-new ul {
    padding: 0;
    list-style: none;
}
#list-new ul li {
    font-size: 1em;
    margin-bottom: 18px;
    padding-left: 15px;
    color: #E7F6F1;
}
#list-new li a {
    color: #96BCB7;
    text-decoration: none;
}
#list-new li.active a {
    color: #E7F6F1;
}
li.active {
    border-left: 3px solid #E7F6F1;
    padding-left: 12px !important;
}
#list-new .btn a {
    /* display: inline-block; */
    padding: 11px 16px !important;
    background-color: #E7F6F1 !important;
    font-weight: normal;
    border: none;
    font-size: 1.2em;
    line-height: initial;
    margin: 7px;
    border-radius: 6px;
    color: #0C684D;
    text-decoration: none;
    transition: all 0.3s;
    -webkit-box-shadow: 4px 5px 15px -7px rgba(0,0,0,0.54), inset -4px -5px 15px -7px rgba(0,0,0,0.54), inset 4px 5px 15px -7px rgba(255,255,255,0.54), -4px -5px 15px -7px rgba(255,255,255,0.54);
    box-shadow: 4px 5px 15px -8px rgba(0,0,0,0.54), inset -4px -5px 15px -8px rgba(0,0,0,0.54), inset 4px 5px 15px -8px rgba(255,255,255,0.54), -5px -5px 15px -8px rgba(255,255,255,0.54);
}
.newbtn {
    width: auto;
    padding: 11px 16px !important;
    background-color: #E7F6F1 !important;
    font-weight: normal;
    border: none;
    font-size: 1.2em;
    line-height: initial;
    margin: 7px;
    border-radius: 6px;
    color: #0C684D;
    text-decoration: none;
    transition: all 0.3s;
    -webkit-box-shadow: 4px 5px 15px -7px rgba(0,0,0,0.54), inset -4px -5px 15px -7px rgba(0,0,0,0.54), inset 4px 5px 15px -7px rgba(255,255,255,0.54), -4px -5px 15px -7px rgba(255,255,255,0.54);
    box-shadow: 4px 5px 15px -8px rgba(0,0,0,0.54), inset -4px -5px 15px -8px rgba(0,0,0,0.54), inset 4px 5px 15px -8px rgba(255,255,255,0.54), -5px -5px 15px -8px rgba(255,255,255,0.54);
}
.newbtn:hover {
	cursor: pointer;
	background: #FFFFFF;
}
#popup-new form {
	position: absolute;
    bottom: 0;
    height: 121px;
}
#popup-new form, #popup-new form input {
	width: auto;
}
#popup-new #desactive {
	opacity: 50%
}
#popup-new #desactive:hover {
	opacity: 100%
}
#popup-new form label {
	margin: 0 0 0 5px;
}
#content-new {
	flex: 9;
    width: 70%;
    background: #013932;
}
.item-new {
    width: 100%;
}
li.new-tri.active {
    border-left: 3px solid #E7F6F1;
    padding-left: 12px !important;
}
.item-new p#img-new {
    margin: 0;
    width: 100%;
}
#img-new img {
    width: 100%;
}
h3.titre-new {
    padding: 0 30px;
    text-transform: none;
    color: #E7F6F1;
}
p.description-new {
    color: #96BCB7;
    padding: 0 30px;
}
.item-new p.btn {
    text-align: left;
    padding: 0 25px;
}
.item-new .btn a {
    /* display: inline-block; */
    padding: 7px 11px !important;
    background-color: #0C684D !important;
    font-weight: normal;
    border: none;
    line-height: initial;
    margin: 5px;
    border-radius: 6px;
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s;
    -webkit-box-shadow: 4px 5px 15px -7px rgba(0,0,0,0.54), inset -4px -5px 15px -7px rgba(0,0,0,0.54), inset 4px 5px 15px -7px rgba(255,255,255,0.54), -4px -5px 15px -7px rgba(255,255,255,0.54);
    box-shadow: 4px 5px 15px -8px rgba(0,0,0,0.54), inset -4px -5px 15px -8px rgba(0,0,0,0.54), inset 4px 5px 15px -8px rgba(255,255,255,0.54), -5px -5px 15px -8px rgba(255,255,255,0.54);
}




div#offre {
    padding: 10px;
    background: #015148;
    border-radius: 10px;
    border: 2px solid #91bc39;
}
.email-ok {
    padding: 5px 10px;
    border-radius: 20px;
    margin: 0;
    display: inline;
    background: #c8c8c8;
    font-weight: bold;
    font-size: 0.95em !important;
    color: white !important;
}
.email-ok i {
    color: rgb(77 133 74) !important;
}
.email-no {
    padding: 5px 10px;
    border-radius: 20px;
    margin: 0;
    display: inline;
    background: #c8c8c8;
    font-weight: bold;
    font-size: 0.95em !important;
    color: white !important;
}

.email-no i {
    color: #df5d5d !important;
}
#resultat div#offre h3 {
    margin: 0;
    color: #91bc39;
    font-size: 1.5em;
    text-align: center;
}
#resultat div#offre p {
    color: white;
}
#resultat div#offre p a {
    color: white;
    display: inline-block;
    padding: 7px 27px;
    background-color: #91bc39;
    font-weight: bold;
    border: none;
    line-height: 22px;
    border-radius: 50px;
    text-decoration: none;
	transition: all 0.3s;
}
#resultat div#offre p a:hover {
    color: #91bc39;
    background-color: white;
}
#resultat strong {
	color:#91bc39;
}
/*------produits complémentaires------*/
div#list-produits {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}
#list-produits .item-produit {
    /* display: inline-block; */
    flex: 1;
    position: relative;
    min-width: 430px;
    margin: 10px;
}
#list-produits .item-produit .box-produit {
	position: absolute;
    top: 60px;
    background: #EDEDED;
    padding: 10px 10px 10px 75px;
    border: 5px solid white;
    left: 130px;
    max-width: 350px;
    border-radius: 5px;
    background: linear-gradient(0deg, rgba(255,255,255,1) 8%, rgba(237,237,237,1) 82%);
    z-index: 4;
    transform: skewX(355deg);
	transition:all 0.3s;
}
#list-produits .item-produit .box-produit:hover {
    border: 5px solid #4e854a;
}
#list-produits .item-produit img {
    position: inherit;
    z-index: 6;
}
#list-produits .item-produit .box-produit h2.titre-produit {
    margin: 0;
    color: #015148;
	border-bottom: 2px dashed #0151482e;
}
#list-produits .item-produit .box-produit p.description-produit {
    color: #015148;
    font-size: 0.8em;
}
#list-produits .item-produit .box-produit p.description-produit strong {
    color: #015148;
}
#list-produits .item-produit .box-produit ul.prix-produit {
    margin-bottom: 0;
	padding-left: 12px;
}
#list-produits .item-produit .box-produit ul.prix-produit li {
    color: #aaa;
    font-weight: bold;
    list-style: none;
	font-size: 14px;
}
#list-produits .item-produit .box-produit ul.prix-produit li i{
    color: #015148;
}
#list-produits .item-produit .box-produit ul.prix-produit li .prix{
    color: #91bc39;
}
#list-produits .item-produit .btn a i{
	font-size: 14px;
}
.mention-haute {
    display: flex;
    margin: 0 auto;
    padding: 7px;
    background: #b7d579;
    border-radius: 7px;
    width: 75%;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
}
.mention-haute p {
    margin: 5px 20px;
    vertical-align: middle;
}
.mention-haute .help-me {
    vertical-align: middle;
}
.mention-haute.alerte {
    background: #c24343;
}
/*------documents complémentaires------*/
div#list-documents {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}
#list-documents .item-document {
    flex: 1;
    position: relative;
    margin: 10px;
    border-radius: 5px;
}
#list-documents .item-document .box-document {
    padding: 15px;
    display: flex;
    max-width: 600px;
    transition: all 0.3s;
    align-items: center;
}
#list-documents .right {
    z-index: 4;
    BACKGROUND: #EDEDED;
    PADDING: 10PX 10PX 0 10PX;
}
#list-documents .item-document a {
    z-index: 6;
	position: inherit;
}
#list-documents .item-document .box-document .left {
    z-index: 5;
}
#list-documents .item-document .btn {
    text-align: center;
}
#list-documents .item-document img {
    position: inherit;
    width: 170px;
    z-index: 0;
    margin: 0;
    box-shadow: 0px 0px 9px #818181;
    padding: 0;
    transition: margin 0.5s;
}
.box-document:hover .left a img {
    margin: -5px 0 5px 0 !important;
}
#list-documents .item-document .cles-document {
    background: #91bc39b0;
    color: #ffffff;
    border-radius: 5px;
    padding: 3px 6px;
    display: inline-block;
    margin: 5px 0;
}
#list-documents .item-document .box-document h2.titre-document {
    margin: 0;
	font-size: 20px;
    color: #015148;
	    padding-bottom: 5px;
    margin-bottom: 5px;
	border-bottom: 2px dashed #0151482e;
}
#list-documents .item-document .box-document p.description-document {
    color: #015148;
    font-size: 0.8em;
	margin-top: 5px;
}
#list-documents .item-document .box-document ul.prix-document {
    margin-bottom: 0;
	padding-left: 12px;
}
#list-documents .item-document .box-document ul.prix-document li {
    color: #aaa;
    font-weight: bold;
    list-style: none;
	font-size: 14px;
}
#list-documents .item-document .box-document ul.prix-document li i{
    color: #015148;
}
#list-documents .item-document .box-document ul.prix-document li .prix{
    color: #91bc39;
}
#list-documents .item-document .btn a, .btn a.small {
     display: inline-block;
    padding: 3px 10px;
    background-color: #015148;
    font-weight: 200;
    border: none;
    line-height: 22px;
    border-radius: 50px;
    font-size: 12px;
    color: white;
    text-decoration: none;
    transition: all 0.3s;
}
#list-documents .item-document .btn a i, .btn a.small i {
    font-size: 12px;
}
#list-documents .item-document .btn a:hover, .btn a.small:hover {
background-color: white;
    color: #015148;
    cursor: pointer;
}

div#categorisation {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
}

#categorisation .categorie {
    min-height: 233px;
    margin: 30px 15px;
    width: 247px;
    border-radius: 7px;
    padding: 20px;
	position: relative;
	transition: transform 200ms linear;
}

#categorisation .categorie:hover {
    transform: scale(1.06);
}

#categorisation .categorie:hover .card_background {
    filter: brightness(0.60) saturate(1.2) contrast(0.99);
}

#categorisation .categorie:hover p.acces {
    margin: 135px 0 20px 0;
	animation-duration:0.6s;
	animation-name : haut-bas;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}

@keyframes haut-bas {
	from {
		margin: 135px 0 20px 0;
	}
	
	to {
		margin: 155px 0 0 0;
	}
}

.card_background {
    /* background-image: url(https://app.ridel-energy.com/tools/documents/files/Page_Argumentaire_-_Ridel-Energy.jpg); */
    position: absolute;
    top: 0;
    bottom: 0;
    /* border: 0; */
    border-radius: 10px;
    left: 0;
    right: 0;
    transform-origin: center;
    filter: brightness(0.40) saturate(1.2) contrast(0.99);
    background-size: cover;
    background-position: center;
	transition:filter 200ms linear;
}

.brochure .card_background {
     background-image: url(https://app.ridel-energy.com/tools/documents/files/Page_Argumentaire_-_Ridel-Energy.jpg); 
}

.etudes .card_background {
     background-image: url(https://app.ridel-energy.com/tools/documents/files/Ridel-Energy-etude-de-cas-Charcuterie.jpg); 
}

.schemas .card_background {
     background-image: url(https://app.ridel-energy.com/tools/documents/files/schemas-de-principe.PNG); 
}

.questionnaires .card_background {
     background-image: url(https://app.ridel-energy.com/tools/documents/files/questionnaires.png); 
}

.categorie p.acces {
    text-align: center;
    font-size: 1.5em;
    margin: 155px 0 0 0;
	position: relative;
    /* color: red; */
	transition:margin 200ms linear;
}

.categorie p.acces i {
    color: #fff;
}

.encadre h2 {
    margin: 10px 0 0 0;
}

.encadre p.icone {
    font-size: 1.6em;
    margin: 0px 0;
}

.encadre h2 a {
    text-decoration: none;
    color: white;
}

.categorie p.motcle {
    display: inline-block;
    margin: 0;
    font-weight: bold;
    text-transform: uppercase;
    /* padding: 5px 10px; */
    /* background: #015148e0; */
    border-radius: 5px;
	position: relative;
}

.categorie .encadre {
    /* background: #015148e3; */
    /* padding: 5px 10px; */
    border-radius: 5px;
    margin: 20px 0px 0 0;
    position: relative;
    bottom: 0;
}

.mention-haute {
    display: flex;
    margin: 0 auto;
    padding: 7px;
    background: #b7d579;
    border-radius: 7px;
    width: 75%;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
}
.mention-haute p {
    margin: 5px 20px;
    vertical-align: middle;
}
.mention-haute .help-me {
    vertical-align: middle;
}
.mention-haute.alerte {
    background: #c24343;
}
/*------Simulations--------*/
#list-simulations {
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: center;
}

#list-simulations .item-simulation {
	flex: 1;
    padding: 10px;
    background: #b7d57942;
    border-radius: 10px;
    margin: 5px;
	max-width: 350px;
    min-width: 300px;
}
#list-simulations .item-simulation h4{
	margin: 0;
    color: #015148;
    font-size: 1.2em;
    padding-bottom: 5px;
    border-bottom: 2px dotted #ffffff42;
    text-align: center;
}
#list-simulations .item-simulation ul li{
	font-size: 0.9em;
}
#list-simulations .item-simulation .version{
	color: #ffffff96;
    font-style: italic;
    font-size: 0.9em;
}
#actions p.btn a {
    font-size: 0.8em !important;
    padding: 6px 18px;
}
#actions p.btn a i {
    font-size: 0.8em;
    color: white;
}
#actions p.btn a:hover {
    color: #015148;
}
#actions p.btn a:hover i {
    color: #015148;
}
#list-simulations .item-simulation .btn, #actions .btn {
	text-align: center;
	display: inline;
    margin-left: 3px;
}
#list-simulations .item-simulation .btn a{
	padding: 5px 10px !important;
    font-size: 0.8em;
}

span.notif {
    display: inline-block;
    position: relative;
    background: #fff;
    width: 15px;
    border-radius: 10px;
    height: 15px;
    top: -12px;
    left: -2px;
    color: #4d854a;
    font-weight: bold;
    font-size: 13px;
    margin-left: -10px;
}

#list-simulations .item-simulation .btn a i {
    font-size: 0.9em;
    color: white;
}
#list-simulations .item-simulation .btn a:hover i {
    color: #015148;
}
.simulations .info {
    text-align: center;
    margin: 20px auto;
    padding: 30px;
    background: #ffffff26;
    border-radius: 10px;
}
.simulations .info .wrong i {
    font-size: 4em;
    margin-top: -10px;
    color: #4e854a;
}
/*------Gestion des utilisateurs-------*/
.dataTables_wrapper p.btn a {
    font-size: 0.5em !important;
    padding: 7px 9px 0px 9px !important;
}
.dataTables_wrapper p.btn a i {
    color: #ffffff;
    font-size: 14px;
}
/*------Gestion des utilisateurs-------*/
.dataTables_wrapper {
    background: white;
    margin-top: 25px;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 20px 0px #00000054;
}
.dataTables_wrapper * {
    color: #5f5c5b;
	font-size: 13px;
}
.user_details form {
    width: initial;
}
.flex.list-gr {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
}
.item-gr {
    padding: 20px;
    background: #ffffff2e;
    margin: 20px 10px;
    border-radius: 10px;
	max-width: 500px;
}
.user_details form input.submit {
    width: initial;
    margin: 10px;
}
.item-gr h2 {
    margin: 0 0 10px 0;
}
.user_details form label {
    color: white !important;
    position: initial;
    margin: 0 0 5px 0;
    display: block;
}
.user_details form label i {
    color: #4e854a !important;
}
.user_details form input, .user_details form select {
    padding: 10px;
    width: 95%;
}
.user_details .control.flex {
    flex-direction: row;
    justify-content: center;
}
.control a.submit i {
    font-size: 22px;
}
.control a.submit {
    padding: 10px 33px;
    font-size: 14px;
	background: #4e854a;
    margin: 10px;
    vertical-align: top;
}
.control p.btn {
    margin: 0;
}
.control.flex {
    flex-direction: row;
    justify-content: center;
}
/*-----------Tableau de bord-------------*/

.tableau_de_bord .item-stat .item-user {
    background: red;
    border-radius: 20px;
    flex: 1;
    margin: 14px;
    padding: 20px;
}
.item-user .titre {
    margin: 0;
    padding: 0;
    text-transform: uppercase;
    font-weight: bold;
	font-size: 1.2em;
}
.item-user .valeur {
    font-size: 35px;
    margin: 10px 0;
}
.item-user .mentions {
    margin-bottom: 0;
}
.group-stat ul.list {
    list-style: none;
    padding: 0;
    margin: 10px 0;
}
.group-stat ul.list li {
    margin: 4px 0;
}
div#stat-france-inscrit {
    background: #4e854a;
}
div#stat-france-att {
    background: #aad74c;
}
div#stat-france-connect {
    background: #2ea925;
}
div#stat-france-mdp {
    background: orange;
}
div#stat-simu-cree {
    background: #2e6043;
}
div#stat-simu-comm {
    background: #338470;
}
div#stat-simu-distr {
    background: #52caad;
}
.item-france {
    padding: 17px;
    border-radius: 20px;
    flex: 1;
    margin: 10px;
}
.item-france p.valeur {
    text-align: center;
    font-size: 3em;
    margin: 20px auto 0 auto;
    color: #2e6043;
}
.item-france p.titre {
    text-align: center;
    font-weight: bold;
    font-size: 1em;
}
.item-france p.pourcentage {
    margin: 0;
    color: #2e6043;
    text-align: center;
}
.graphique_pourcentage {
    display: flex;
}
.graphique_left{ 
background: #2e6043;
    height: 10px;
}
.graphique_right{ 
background: #2e604342;
    height: 10px;
}
/*commerce*/
div#commerce {
    padding: 20px;
    background: white;
    color: black;
    margin: 30px 13px;
    border-radius: 20px;
}
#commerce h2 {
    color: #91bc39;
    text-align: center;
	font-size: 2.5em;
}
#commerce h2 i {
    color: #194c3b;
}
h2.national {
    text-align: center;
    font-size: 2.5em;
    border-top: 4px dashed #ffffff30;
    width: 70%;
    margin: 20px auto;
    padding-top: 20px;
}
.tableau_de_bord .item-stat {
    display: flex;
    justify-content: space-between;
    align-content: center;
    flex-direction: row;
    flex-wrap: wrap;
}

.item-commerce {
    /* background: red; */
    flex: 1;
    margin: 10px;
    padding: 20px;
    border-radius: 20px;
}

#perrine {
    background: #b06ba9;
}
div#sud-ouest {
    background: #730800;
}
div#pierre {
    background: #91bc39;
}
div#ludovic {
    background: #095049;
}
div#olivier {
    background: #4e864a;
}

.item-commerce h3 {
    text-align: center;
    font-size: 2em;
    margin: 0 0 20px 0;
    padding-bottom: 10px;
    border-bottom: 3px dashed #ffffff4f;
}

.item-commerce .photo {
    text-align: center;
}

.item-commerce .photo img {
    width: 40%;
}

.item-commerce .user-simu {
    display: flex;
    padding: 0;
    font-size: 2.5em;
    text-align: center;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
}

.item-commerce .user-simu p {
    margin: 20px;
}

.item-commerce .stats-principales {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    font-size: 1.5em;
    text-align: center;
}

.item-commerce .stats-principales p {
    margin: 0 20px;
}

.item-commerce table {
	width: 90%;
    margin: 5% 5% 0 5%;
    text-align: center;
}

.item-commerce table tr:hover {
    background: #ffffff29;
}

.item-commerce table th {
    background: #2e604394;
    padding: 5px;
}
.item-commerce table td {
    background: #ffffff12;
    padding: 5px;
}
.group-stat .aides i {
    text-align: center;
    color: #575050;
}
.group-stat .aides {
    text-align: center;
    color: #575050;
}
/*EDIT MAIL*/
.edit-mail form select {
    padding: 10px 10px 10px 33px;
    width: 435px !important;
}

.edit-mail form select, .edit-mail form input {
	border: 1px solid #015148;
}

/*EDIT MAIL*/


/*--------Mon compte------------*/
 fieldset {
    border: 2px #015148;
    border-style: dashed;
    margin-bottom: 20px;
}
.mon-compte form label {
    margin: initial;
    color: white !important;
}
/*------Mentions légales-------*/
.inscription_tools form {
	width: auto !important;
}
/*------Mentions légales-------*/
.mentions-legales #content {
	padding: 0 15% 50px 15%;
}
/*--------TRI---------*/
div#list-tri {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.item-tri {
    flex: auto;
    background: white;
    margin: 10px;
    border-radius: 10px;
    padding: 10px;
}
.item-tri h3 {
    color: #4d854a;
    margin: 0;
    text-align: center;
}
.item-tri h3 i {
    color: #4d854a !important;
}
.item-tri h3 {
    color: #4d854a;
    margin: 0;
    text-align: center;
    padding-bottom: 7px;
    border-bottom: 2px dotted #4d854a38;
}
.item-tri ul {
    margin: 10px 0 0 0;
    padding: 0;
    list-style: none;
}
.item-tri li strong {
    color: #4d854a;
}
.item-tri li {
    font-size: 15px;
}
.item-tri p.btn.secondaire {
    margin: 10px auto 0 auto;
    text-align: center;
}
.item-tri p.btn.secondaire a {
    background: rgb(77 133 74);
    font-size: 0.8em !important;
    padding: 3px 14px;
    font-weight: normal;
    display: inline-block;
}
.item-tri p.btn.secondaire a i {
    font-size: 15px;
    color: white;
}
/*----MAJ 26/01/2024-----*/
.left #resultat h3, .right #resultat h3 { /*MAJ DEV*/
    text-align: center;
    color: #b3b3b3;
    margin-top: 0;
}


#etape3 .right, .t2 .right { /*MAJ DEV*/
    margin: 0;
    padding: 0px;
}
.right .item-group h3 {
    color: #fff;
}
.right h3 {
    text-align: center;
    margin-top: 0;
    color: #b3b3b3;
}
.right .btn a:hover {/*MAJ DEV*/
    background: #e5e5e5 !important;
}
#etape3 .right .btn a { /*MAJ DEV*/
    font-size: 0.9em;
    font-weight: normal;
    color: black;
    background: #f9f9f9;
    line-height: 30px;
    padding: 5px 10px;
    border-radius: 6px;
    display: block;
    text-decoration: none;
}
#etape3 .right .btn.secondaire a { /*MAJ DEV*/
    color: #9f9e9e !important;
    line-height: 23px;
    font-size: 0.8em !important;
}
#etape3 .right .btn.secondaire a i { /*MAJ DEV*/
    color: #b1cba4;
    font-size: 15px;
}
#etape3 .right .btn.fonction a {/*MAJ DEV*/
    border-bottom: 2px solid #91bc39;
}
p.btn.admin a {/*MAJ DEV*/
    border-bottom: 2px solid #B140D6;
}
p.btn.admin a i {/*MAJ DEV*/
    color: #B140D6;
}
.selectionneur .content-selectionneur { /*MAJ DEV*/
    width: 95%;
	margin: 0 auto;
    display: flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: stretch;
    align-content: center;
}

.proposition_technique #info-secondaire #secondaire { /*MAJ DEV*/
    padding: 10px;
    background: #ededed42;
    border-radius: 10px;
    margin: 5px;
    min-width: 200px;
} 
#etape2 .left, #etape3 .left, .t2 .left { /*MAJ DEV*/
	padding: 30px;
    background: white;
    border-radius: 5px;
    margin: 0px 50px;
}
.details .left, #etape3 .left{ /*DEV MAJ*/
	width: 75%;
}
.details .right, #etape3 .right { /*DEV MAJ*/
    width: 25%;
}
 .right .cat-action {
    margin: 15px 0;
    padding: 15px;
    background: #ededed;
    border-radius: 5px;
}

/*MONO CIRCUIT*/
img#imgmc {
    flex: 2;
    max-width: 260px;
    margin-right: 30px;
}

#resultat {
    flex: 4;
}

.monocircuit .left {
	display: flex;
}
/*-------FLEX----------*/

.flex {
	display: flex;
}

.flex-column {flex-direction: column;}

.flex-1 {flex:1;}
.flex-2 {flex:2;}
.flex-3 {flex:3;}
.flex-4 {flex:4;}
.flex-5 {flex:5;}
.flex-6 {flex:6;}
.flex-7 {flex:7;}
.flex-8 {flex:8;}
.flex-9 {flex:9;}
.flex-10 {flex:10;}
.flex-11 {flex:11;}
.flex-12 {flex:12;}
.flex-13 {flex:13;}
.flex-14 {flex:14;}
.flex-15 {flex:15;}

/*---------- Couleurs -----------*/
.c-vert-1 {	color:#8fbc39;}
.c-vert-2 {	color:#6ea144;}
.c-vert-3 {	color:#4d854a;}
.c-vert-4 {	color:#2c6b4a;}
.c-vert-5 {	color:#025148;}
.b-vert-1 {	background:#8fbc39;}
.b-vert-2 {	background:#6ea144;}
.b-vert-3 {	background:#4d854a;}
.b-vert-4 {	background:#2c6b4a;}
.b-vert-5 {	background:#025148;}

/*--404--*/
span.\34 04 {
    color: #015148;
    font-size: 2em;
}

/*-----CARTE ------*/

.tableau_de_bord .frame {
    display: flex;
    justify-content: center;
}

.custom-btn {
  margin: 15px;
  color: #fff;
  border-radius: 5px;
  padding: 10px 25px;
  font-family: 'Lato', sans-serif;
  font-weight: 500;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  display: inline-block;
   box-shadow:inset 2px 2px 2px 0px rgba(255,255,255,.5),
   7px 7px 20px 0px rgba(0,0,0,.1),
   4px 4px 5px 0px rgba(0,0,0,.1);
  outline: none;
}

.custom-btn.argent {
	    background: radial-gradient(ellipse farthest-corner at right bottom, #fbfbfb 0%, #ebebeb 8%, #d1d1d1 30%, #b3b2ae 40%, transparent 80%), radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #d5d5cb 8%, #b1ada1 25%, #4d4b48 62.5%, #474543 100%) !important;
}

.custom-btn.dore {
	background: radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 40%, transparent 80%),
                radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #FFFFAC 8%, #D1B464 25%, #5d4a1f 62.5%, #5d4a1f 100%) !important;
}

span.nom {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.2em;
    display: inline-block;
    margin-bottom: 5px;
}

/* 11 */
.btn-11 {
  border: none;
  background: rgb(251,33,117);
    
    color: #fff;
    overflow: hidden;
}
.btn-11:hover {
    text-decoration: none;
    color: #fff;
}
.btn-11:before {
    position: absolute;
    content: '';
    display: inline-block;
    top: -180px;
    left: 0;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: shiny-btn1 3s ease-in-out infinite;
}
.btn-11:hover{
  opacity: .7;
}
.btn-11:active{
  box-shadow:  4px 4px 6px 0 rgba(255,255,255,.3),
              -4px -4px 6px 0 rgba(116, 125, 136, .2), 
    inset -4px -4px 6px 0 rgba(255,255,255,.2),
    inset 4px 4px 6px 0 rgba(0, 0, 0, .2);
}


@-webkit-keyframes shiny-btn1 {
    0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

.tableau_de_bord .frame {
  padding: 20px;
  animation: flashing 1.4s infinite alternate;
  background: linear-gradient(45deg, #a90c0c, #ff3434, #af2727);
	display: inline-block;
	margin: 20px auto;
}
h2.casino {
    margin: 0 0 -19px 0;
    color: #ffe690;
}
.casino {
	text-align: center;
}
@keyframes flashing {
	0% { box-shadow: 0 0 0 7px #c12020, 0 0 8px #fff, 0 0 32px #ffda5c, 0 0 64px #ffda5c; border: 10px dotted #ffda5c;}
	18% { box-shadow: 0 0 0 7px #c12020, 0 0 8px #fff, 0 0 32px #ffda5c, 0 0 64px #ffda5c; border: 10px dotted #ffda5c;}
	20% {  box-shadow: 0 0 0 7px #c12020; border: 10px dotted #A48829;}
	21% { box-shadow: 0 0 0 7px #c12020, 0 0 8px #fff, 0 0 32px #ffda5c, 0 0 64px #ffda5c; border: 10px dotted #ffda5c;}
	32% { box-shadow: 0 0 0 7px #c12020, 0 0 8px #fff, 0 0 32px #ffda5c, 0 0 64px #ffda5c; border: 10px dotted #ffda5c;}
	34% {  box-shadow: 0 0 0 7px #c12020;  border: 10px dotted #A48829;}
	35% { box-shadow: 0 0 0 7px #c12020, 0 0 8px #fff, 0 0 32px #ffda5c, 0 0 64px #ffda5c; border: 10px dotted #ffda5c;}
	39% { box-shadow: 0 0 0 7px #c12020, 0 0 8px #fff, 0 0 32px #ffda5c, 0 0 64px #ffda5c; border: 10px dotted #ffda5c;}
	40% {  box-shadow: 0 0 0 7px #c12020; border: 10px dotted #A48829;}
	42% { box-shadow: 0 0 0 7px #c12020, 0 0 8px #fff, 0 0 32px #ffda5c, 0 0 64px #ffda5c; border: 10px dotted #ffda5c;}
	100% { box-shadow: 0 0 0 7px #c12020, 0 0 8px #fff, 0 0 32px #ffda5c, 0 0 64px #ffda5c; border: 10px dotted #ffda5c;}

}


/*---------MEDIAS-----------*/
/* Sur tous types d'écran, quand la largeur de la fenêtre est comprise entre 1024px et 1280px */

@media all and (height > 770px){
	#content {
		min-height: 635px !important;
	}
}


@media all and (max-device-width: 480px)
{
    /* Vos règles CSS pour les mobiles ici */
	html, body {
		width: 100%;
		margin: 0;
		padding: 0;
		max-width: 100%
	}
}