body { font-family: Century Gothic,Arial, sans-serif; color: #82786f !important; font-size: 10pt }
#header { margin-top: 10px; padding: 0 0 0 0; margin-bottom: 50px  }
.wrapper { margin: 0 auto; text-align: center; width: 66%; background: #FFFFFF;}
#logo { width: 60%; margin: 0 auto; }
#content { padding: 40px 0 40px 0; text-align: justify; margin: 0 auto; text-align: center; padding: 0 0 30px 0; background: #FFFFFF; width: 1060px; }
.box { float: left; margin: 0px 20px 20px 0;   height: 180px !important; width: 320px !important; cursor: pointer; padding-top:20px; transition: all 0.6s ease-in-out}
.box.green:hover { box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19); background-color: #99cc00;}
.box.bleu:hover { box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19); background-color: #8faadc;}
.box.orange:hover { box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19); background-color: #f4b183;}

.box p { text-align:left; padding: 0 0 0 20px;}
.box p.name { text-align:center; letter-spacing: 2px; text-transform: uppercase;}
.bleu { border: 1px solid #8faadc; }
.green { border: 1px solid #99cc00; }
.orange { border: 1px solid #f4b183;}
.link { text-transform: none; color: #82786f !important }
.modal p { text-align:justify}
.modal img { width: 40%; float: left; padding: 10px 20px 0 0;}