﻿@charset "UTF-8";
/******* Liste des variables SCSS ********/
/*************************************************/
/*-------------------- MIXINS -------------------*/
/*************************************************/
body {
font-family: 'Source Sans Pro', 'Arial', sans-serif;
color: #333333;
font-size: 17px;
line-height: 25px;
}

img {
max-width: 100%;
height: auto;
}

@media print {

html body main div.container div.row {
display: none;
}
    
body .main-menu {
display: none;
}

body .main-header {
background-color: #655d8c !important;
}

body .main-header .main-header__content {
display: flex;
}

body .main-header .main-header__content .main-header__left {
background-color: #655d8c !important;
padding-right: 15px;
flex-grow: 1;
}

body .main-header .main-header__content .main-header__left .main-header__title {
color: #ffffff !important;
font-size: 24px;
letter-spacing: 2px;
line-height: 30px;
}

body .main-header .main-header__content .main-header__left .main-header__subtitle {
color: #ececec !important;
font-size: 18px;
}

body .main-header .main-header__content .main-header__left .main-header__subtitle sup {
color: #ececec !important;
}

body .main-header .main-header__content .main-header__left:after {
display: block;
background-color: #655d8c !important;
}

body .main-header .main-header__content .main-header__right {
background-color: #ffbe22 !important;
padding-left: 60px;
}

body .main-header .main-header__content .main-header__right .main-header__img {
height: 100px;
}

body .main-header:after {
background-color: #ffbe22 !important;
}

body .sub-menu {
background-color: #ededed !important;
}

body .pub-horizontal, body .pub-vertical, body .social-block, body .part-right-user-action {
display: none;
}
}

.main-header {
background-color: #655d8c;
position: relative;
z-index: 0;
overflow: hidden;
}

.main-header::after {
position: absolute;
content: '';
right: 0;
left: 50%;
top: 0;
bottom: 0;
background-color: #ffbe22;
z-index: 1;
}

.main-header__top {
background-color: #3d2d45;
margin: 0 auto;
width: 100%;
position: relative;
z-index: 10;
}

.main-header__content {
display: flex;
max-width: 1280px;
margin: 0 auto;
width: 100%;
position: relative;
z-index: 2;
}

.main-header__left {
background-color: #655d8c;
padding-top: 30px;
padding-bottom: 30px;
padding-left: 15px;
position: relative;
padding-right: 50px;
flex-grow: 0.3;
}

.main-header__left::after {
position: absolute;
content: '';
right: -25px;
background-color: #655d8c;
width: 55px;
top: 0;
bottom: 0;
transform: skew(-10deg);
}

.main-header__right {
flex-grow: 1;
background-color: #ffbe22;
padding-left: 120px;
}

.main-header__right--portail {
min-width: 450px;
}

.main-header__title {
color: #ffffff;
font-family: 'Montserrat', 'Arial', sans-serif;
font-size: 80px;
line-height: 78px;
letter-spacing: 4.3px;
margin-top: 0;
margin-bottom: 20px;
font-weight: 600;
text-transform: uppercase;
padding-right: 10px;
}

.main-header__subtitle {
font-family: 'Playfair Display', serif;
font-size: 26px;
margin: 0;
margin-top: 7px;
color: #ececec;
font-weight: 400;
}

.main-header__subtitle sup {
font-size: 15px;
}

.main-header__subtitle--portail {
font-weight: 600;
font-size: 26px;
margin-bottom: 5px;
}

.main-header__descr {
margin-bottom: 0;
color: #ececec;
font-size: 20px;
}

.main-header__img {
margin-top: 35px;
}

.main-header__img--portail {
margin-top: -30px;
display: inline-block;
vertical-align: top;
}

.main-header__slogan {
margin-top: 45px;
margin-left: 50px;
text-align: left;
width: 280px;
display: inline-block;
vertical-align: top;
color: #4d476b;
font-family: 'Playfair Display', serif;
font-weight: 600;
line-height: 55px;
letter-spacing: -1.4px;
font-size: 52px;
}

@media (max-width: 1300px) {
.main-header__slogan {
font-size: 35px;
width: 200px;
line-height: 45px;
margin-left: 40px;
}

.main-header__title {
font-size: 65px;
line-height: 60px;
letter-spacing: 4.3px;
}

.main-header__subtitle {
font-size: 22px;
}

.main-header__right {
padding-left: 80px;
}

.main-header__img {
transform: scale(0.8);
}

.main-header__img--portail {
width: 90px;
}
}

@media (max-width: 991px) {
.main-header__title {
font-size: 50px;
}
}

@media (max-width: 860px) and (min-width: 768px) {
.main-header__right--portail {
padding-left: 60px;
}

.main-header__slogan {
margin-left: 15px;
}
}

@media (max-width: 767px) {
.main-header__content {
display: block;
}

.main-header__left::after {
display: none;
}

.main-header__right {
padding-bottom: 35px;
padding-left: 20px;
}

.main-header__img {
transform: none;
height: 80px;
}

.main-header__img--portail {
height: auto;
}
}

@media (max-width: 600px) {
.main-header__title {
font-size: 40px;
line-height: 42px;
letter-spacing: 1.3px;
}
}

@media (max-width: 380px) {
.main-header__img--portail {
width: 70px;
}

.main-header__slogan {
font-size: 25px;
width: 120px;
line-height: 30px;
margin-left: 20px;
}
}

.main-menu {
background-color: #3f3147;
}

.main-menu__nav {
max-width: 1280px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
}

.main-menu__right {
padding: 10px 0;
}

.main-menu__back {
color: #ffffff;
font-size: 18px;
transition: all 0.3s ease;
}

.main-menu__back:hover {
text-decoration: none;
color: #ffbe22;
}

.main-menu__back:hover .main-menu__back-icon {
color: #ffbe22;
}

.main-menu__back-icon {
font-weight: 600;
font-size: 15px;
margin-right: 15px;
color: #deb5e8;
padding-bottom: 3px;
display: inline-block;
vertical-align: middle;
transition: all 0.3s ease;
}

.main-menu__exp {
color: #ffffff;
display: inline-block;
vertical-align: middle;
margin-right: 10px;
margin-bottom: 3px;
}

.main-menu__items {
display: inline-block;
list-style: none;
padding: 0;
margin: 0;
}

.main-menu__item {
display: inline-block;
position: relative;
}

.main-menu__item::after {
position: absolute;
content: '';
width: 2px;
right: -3px;
top: 6px;
bottom: 6px;
background-color: #9a7ca3;
}

.main-menu__item a {
color: #ffbe22;
transition: all 0.3s ease;
font-size: 19px;
margin: 0 25px;
position: relative;
}

.main-menu__item a svg {
margin-left: 10px;
display: inline-block;
vertical-align: middle;
fill: #FFBE22;
transition: all 0.3s ease;
}

.main-menu__item a:hover {
text-decoration: none;
color: #9a7ca3;
}

.main-menu__item a:hover svg {
fill: #9a7ca3;
}

.main-menu__item:first-child a {
margin-left: 0;
}

.main-menu__item:last-child a {
margin-right: 0;
}

.main-menu__item:last-child::after {
display: none;
}

.main-menu__content {
position: relative;
}

.main-menu__close {
right: 15px;
top: 15px;
padding: 5px;
margin: 0;
background-color: transparent;
border: none;
position: absolute;
}

.main-menu__close svg {
fill: #9a7ca3;
transition: all 0.3s ease;
}

.main-menu__close:hover svg {
fill: #ffbe22;
}

.main-menu__open {
margin-top: 0px;
padding: 0;
background-color: transparent;
border: none;
margin-left: 15px;
line-height: 0;
}

button.main-menu__open {
padding-top: 10px!important;
padding-bottom: 10px!important;
}

.main-menu__open svg {
stroke: #9a7ca3;
transition: all 0.3s ease;
}

.main-menu__open:hover svg {
stroke: #ffbe22;
}

.user-account {
background-color: #655d8c;
padding: 15px 0 5px;
text-align: center;
position: relative;
width: 270px;
}

.user-account .user-account_title {
color: #ffffff;
font-weight: 600;
font-size: 2rem;
margin: 0px 25px;
}

.user-account .user-account_item {
color: #ffffff;
display: inline-flex;
position: relative;
padding: 0 10px;
font-size: 1.6rem;
cursor: pointer;
text-decoration: none;
}

.user-account .user-account_item:hover, .user-account .user-account_item.texte-yellow-active {
color: #ffbe22;
}

.user-account .user-account_item:first-child::after {
position: absolute;
content: '';
width: 2px;
right: -3px;
top: 6px;
bottom: 6px;
background-color: #deb5e8;
}

.user-account .user-account__items {
display: inline-block;
list-style: none;
padding: 0;
margin: 0;
}

.user-account .user-account__form,
.user-account .user-connect__form {
width: 100%;
text-align: left;
position: absolute;
z-index: 999;
background-color: #655d8c;
overflow: hidden;
display: none;
padding: 10px 30px 30px 30px;
}

.user-account .user-account__form:before,
.user-account .user-connect__form:before {
content: "";
display: block;
width: 100%;
border-bottom: 1px solid #3d2d45;
}

.user-account .user-account__form label,
.user-account .user-connect__form label {
color: #ffffff;
font-size: 1.5rem;
font-weight: 200;
margin: 7px 0px 0px 0px;
}

.user-account .user-account__form input,
.user-account .user-connect__form input {
font-family: inherit;
font-size: inherit;
border: 0px solid transparent;
border-radius: 5px;
line-height: 20px;
border: 1px solid #999999;
width: 100%;
}

.user-account .user-account__form .valid-form,
.user-account .user-connect__form .valid-form {
background-color: #ffbe22;
margin-top: 25px;
width: 100%;
border-radius: 5px;
font-size: 2rem;
color: #655d8c;
border: 1px solid #ffbe22;
line-height: 29px;
font-weight: 600;
}

.user-account .user-account__form.open,
.user-account .user-connect__form.open {
display: block;
}

.pass-oublie {
color: #ffffff;
padding-top: 11px;
text-decoration: underline;
display: block;
font-size: 1.4rem;
}

.pass-oublie:hover {
color: #ffffff;
}

.border-violet-top {
position: relative;
}

.border-violet-top:before {
content: ' ';
position: absolute;
top: 0px;
display: block;
height: 1px;
width: 100%;
background-color: #333333;
}

@media (min-width: 768px) {
.main-menu__content {
display: block !important;
}
}

@media (max-width: 767px) {
.main-menu__content {
display: none;
position: absolute;
left: 0;
right: 0;
top: 0;
z-index: 10;
background-color: #ffffff;
padding-bottom: 250px;
}

.main-menu__exp {
padding: 15px 20px;
}

.main-menu__nav {
display: block;
padding: 0;
background-color: #3f3147;
}

.main-menu__items {
display: block;
}

.main-menu__item {
display: block;
margin: 0;
}

.main-menu__item a {
margin-left: 0 !important;
display: flex;
align-items: center;
width: 100%;
padding-top: 15px;
padding-bottom: 15px;
padding-left: 35px;
border-top: 1px solid #9a7ca3;
}

.main-menu__item::after {
display: none;
}

.main-menu__back {
padding: 15px;
display: block;
border-bottom: 3px solid #9a7ca3;
}
}

.sub-menu {
background-color: #ededed;
}

.sub-menu__items {
list-style: none;
font-size-adjust: none;
margin: 0 auto;
max-width: 1280px;
padding: 15px;
text-align: right;
}

.sub-menu__item {
display: inline-block;
margin-left: 20px;
position: relative;
}

.sub-menu__item::after {
position: absolute;
content: '';
width: 2px;
top: 4px;
bottom: 4px;
right: -10px;
background-color: #665073;
}

.sub-menu__item:last-child::after {
display: none;
}

.sub-menu__item a {
font-size: 25px;
color: #665073;
font-weight: 600;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
transition: all 0.3s ease;
}

.sub-menu__item a:hover {
color: #ffbe22;
text-decoration: none;
}

@media (max-width: 1199px) {
.sub-menu__item a {
font-size: 20px;
}
}

@media (max-width: 767px) {
.sub-menu__items {
padding: 0;
}

.sub-menu__item {
display: block;
margin-left: 0;
padding: 0;
border-bottom: 3px solid #cccccc;
}

.sub-menu__item a {
display: block;
padding: 15px;
}

.sub-menu__item::after {
display: none;
}

.sub-menu__items {
text-align: left;
}
}

.pub-horizontal {
text-align: center;
padding: 40px;
border-bottom: 2px solid #b2a7b9;
margin-bottom: 10px;
}

.banniere {
background-color: #3d2d45;
margin: 0 auto;
width: 100%;
}

.banniere .pub-horizontal {
border-bottom: none;
margin-bottom: 0px;
}

.pub-vertical {
position: absolute;
top: 40px;
right: 0;
}

@media (max-width: 767px) {
.pub-vertical {
display: none;
}
}

.portail {
margin-bottom: 20px;
}

.portail__welcome {
font-size: 24px;
text-align: center;
line-height: 33px;
letter-spacing: -0.6px;
margin-top: 40px;
margin-bottom: 80px;
}

.portail__welcome span {
display: block;
font-weight: bold;
}

.portail__title {
font-size: 35px;
color: #655d8c;
line-height: 30px;
margin-bottom: 25px;
position: relative;
}

.portail__title span {
display: block;
font-size: 40px;
font-weight: bold;
}

.portail__title svg {
position: absolute;
}

.portail__describe {
font-size: 18px;
}

.portail__item {
margin-bottom: 50px;
}

.portail__title--classic svg {
top: -80px;
right: 40px;
}

.portail__title--modern svg {
top: -30px;
right: 60px;
}

.portail__title--haikus svg {
top: -60px;
right: 30px;
}

.portail__link {
display: block;
background-color: #ffbe22;
border-radius: 5px;
text-align: center;
font-weight: bold;
color: #655d8c;
font-size: 22px;
border: 2px solid #ffbe22;
padding: 10px 0;
transition: all 0.3s ease;
margin-top: 20px;
}

.portail__link:hover {
text-decoration: none;
background-color: #ffffff;
}

.portail .col-md-4 {
padding-left: 30px;
padding-right: 30px;
}

.portail .row {
margin-left: -30px;
margin-right: -30px;
}

@media (max-width: 1200px) {
.portail__title svg {
right: 0px;
}
}

@media (max-width: 991px) and (min-width: 600px) {
.portail__title {
margin-bottom: 50px;
}

.portail__title span {
display: inline-block;
}

.portail__title svg {
position: static;
}

.portail__title--modern svg {
margin-left: 40px;
}

.portail__title--haikus svg {
margin-left: 40px;
}

.portail__welcome {
margin-bottom: 15px;
}
}

@media (max-width: 768px) {
.portail__title--haikus svg {
top: -40px;
}

.portail__welcome {
margin-bottom: 80px;
margin-top: 20px;
}
}

.breadcrumb {
background-color: transparent;
padding-left: 0;
padding-right: 0;
margin-bottom: 15px;
}

.breadcrumb a {
color: #333333;
transition: all 0.3s ease;
font-size: 18px;
}

.breadcrumb a:hover {
text-decoration: none;
color: #756fa5;
}

.breadcrumb > li + li:before {
color: #333333;
content: ">";
font-weight: normal;
}

.breadcrumb > .active {
color: #756fa5;
font-weight: 600;
font-size: 18px;
}

.social-block {
display: flex;
align-items: flex-start;
}

.social-block__links {
display: none;
vertical-align: middle;
}

.social-block__links a {
display: inline-block;
vertical-align: bottom;
margin-left: 10px;
margin-righgt: 10px;
}

.social-block__links svg {
fill: #ffbe22;
transition: all 0.3s ease;
}

.social-block__links a:hover svg {
fill: #756fa5;
}

.social-btn__share {
background-color: transparent;
padding: 0;
border: none;
margin-right: 5px;
display: flex;
flex-direction: column;
}

.social-btn__share span {
font-size: 11px;
}

.social-btn__share:focus {
border: none;
outline: none;
}

.social-btn__share svg {
transition: all 0.3s ease;
fill: #756fa5;
}

.social-btn__share:hover svg {
fill: #ffbe22;
}

.social-btn__caret {
background-color: transparent;
border: none;
transition: all 0.3s ease;
margin-left: 5px;
}

.social-btn__caret:focus {
border: none;
outline: none;
}

.social-btn__caret svg {
transition: all 0.3s ease;
fill: #756fa5;
}

.social-btn__caret:hover svg {
fill: #ffbe22;
}

.social-btn__caret--closed {
transform: rotate(180deg);
}

.user-action {
display: flex;
align-items: flex-start;
justify-content: flex-end;
}

.user-action__btn {
background-color: transparent;
padding: 0;
margin: 0 10px;
width: 47px;
display: flex;
border: none;
flex-direction: column;
align-items: center;
outline: none;
}

.user-action__btn:hover svg {
fill: #ffbe22;
}

.user-action__btn:first-child {
margin-left: 0;
}

.user-action__btn:last-child {
margin-right: 0;
}

.user-action__icon {
height: 50px;
display: flex;
align-items: flex-end;
}

.user-action__icon svg {
fill: #756fa5;
transition: all 0.3s ease;
}

.user-action__text {
margin-top: 8px;
text-align: center;
font-size: 11px;
line-height: 13px;
}

.user-action__btn--like svg {
fill: #ffffff;
transition: all 0.3s ease;
}

.popover.bottom {
padding: 0;
max-width: initial;
width: 400px;
left: 0 !important;
right: 0 !important;
box-shadow: none;
}

.popover.bottom.ecrire .arrow {
left: 38% !important;
}

.popover.bottom.signaler .arrow {
left: 71.5% !important;
}

.popover.bottom .arrow:after {
border-bottom-color: #9992bc;
}

.popover.bottom .popover-title {
background-color: #9992bc;
color: #ffffff;
font-size: 18px;
text-transform: uppercase;
padding: 10px 30px;
}

.popover.bottom .popover-title span {
float: right;
cursor: pointer;
font-size: 26px;
margin-top: -5px;
}

.popover.bottom .popover-content {
padding: 20px 30px;
background-color: #ececec;
}

.popover.bottom .popover-content p {
color: #6a5077;
}

.popover.bottom .popover-content ul {
list-style-type: none;
padding-left: 0;
}

.popover.bottom .popover-content ul li a {
display: inline-block;
color: #000000;
padding: 5px 10px;
font-size: 16px;
border: 1px solid transparent;
text-decoration: none;
}

.popover.bottom .popover-content ul li a:before {
content: "-";
display: inline-block;
margin-right: 5px;
}

.popover.bottom .popover-content ul li a:after {
content: "➧";
display: none;
margin-left: 10px;
transform: rotate(90deg);
}

.popover.bottom .popover-content ul li a:hover, .popover.bottom .popover-content ul li a .active {
background-color: #ffffff;
border-color: #999;
border-radius: 5px;
}

.popover.bottom .popover-content ul li a:hover:after, .popover.bottom .popover-content ul li a .active:after {
display: inline-block;
}

.popover.bottom .popover-content div > label {
display: block;
color: #6a5077;
font-weight: normal;
font-size: 16px;
}

.popover.bottom .popover-content div > input[type="text"], .popover.bottom .popover-content div > input[type="mail"], .popover.bottom .popover-content div > textarea {
width: 100%;
margin-bottom: 20px;
border: none;
border-radius: 5px;
}

.popover.bottom .popover-content div > input[type="text"], .popover.bottom .popover-content div > input[type="mail"] {
height: 30px;
}

.popover.bottom .popover-content div > textarea {
height: 100px;
resize: none;
}

.popover.bottom .popover-content div > p {
margin-bottom: 10px;
font-size: 16px;
}

.popover.bottom .popover-content div > p strong {
padding-left: 5px;
}

.popover.bottom .popover-content div > p + p {
margin-bottom: 30px;
}

.popover.bottom .popover-content div > input[type="submit"],
#send-signal{
width: 50%;
background-color: #9992bc;
color: #ffffff;
font-size: 20px;
border: none;
padding: 5px 10px;
border-radius: 5px;
}

@media (max-width: 991px) {
.user-action {
justify-content: flex-start;
}
}

.home-intro {
margin-left: -55px;
margin-right: -55px;
}

.home-intro > .col-md-6 {
padding-left: 55px;
padding-right: 55px;
}

.home-intro__welcome {
position: relative;
margin-top: 40px;
}

.home-intro__welcome::after {
position: absolute;
content: '';
width: 2px;
background-color: #b2a7b9;
top: 0;
bottom: 0;
right: -45px;
}

.home-intro__title {
font-size: 45px;
font-weight: normal;
color: #665073;
margin-bottom: 10px;
}

.home-intro__text {
font-size: 24px;
line-height: 34px;
position: relative;
padding-bottom: 60px;
margin-bottom: 60px;
}

.home-intro__text i {
font-size: 223px;
color: #ffbe22;
font-style: normal;
position: relative;
bottom: -100px;
line-height: 0;
}

.home-intro__text i:last-child {
position: absolute;
right: -15px;
bottom: 10px;
}

.home-intro__text::after {
content: "#";
opacity: 0;
font-size: 40px;
margin-left: 20px;
line-height: 0;
}

@media (max-width: 1199px) {
.home-intro {
margin-left: -20px;
margin-right: -20px;
}

.home-intro > .col-md-6 {
padding-left: 20px;
padding-right: 20px;
}

.home-intro__text {
font-size: 22px;
}

.home-intro__welcome::after {
right: -20px;
}
}

@media (max-width: 991px) {
.home-intro__title {
font-size: 40px;
}

.home-intro__text {
font-size: 20px;
padding-bottom: 15px;
margin-bottom: 15px;
}

.home-intro__text i {
font-size: 150px;
bottom: -60px;
}

.home-intro__text i:last-child {
bottom: -20px;
}

.home-intro__welcome {
padding-right: 0;
}

.home-intro__welcome::after {
display: none;
}
}

.search-form {
margin-top: 40px;
margin-bottom: 60px;
}

.search-form .form-control {
font-size: 19px;
height: auto;
text-align: left;
color: #333333;
border: 1px solid #cccccc;
}

.search-form--small {
margin: 0;
display: flex;
justify-content: space-between;
align-items: flex-end;
}

.search-form--small .form-group {
flex-grow: 1;
margin-right: 10px;
}

.search-form--small .search-form__title {
margin-right: 10px;
margin-bottom: 22px;
}

.search-form--small .search-form__pays {
min-width: 170px;
}

.search-form__title {
font-size: 30px;
font-weight: normal;
margin-top: 30px;
margin-bottom: 30px;
}

label.search-form__label {
font-size: 20px;
font-weight: normal;
color: #665073;
margin-bottom: 10px;
}

.search-form__pays {
position: relative;
}

.search-form__pays button {
position: relative;
padding-right: 35px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 5px;
}

.search-form__pays button svg {
position: absolute;
left: 5px;
top: 50%;
margin-top: -11px;
}

.search-form__pays button::after {
position: absolute;
content: "❮";
width: 10px;
top: 50%;
margin-top: -5px;
right: 30px;
height: 9px;
color: #333333;
transform: rotate(-90deg);
}

.search-form__list {
display: none;
list-style: none;
padding: 0;
border: 1px solid #cccccc;
border-radius: 4px;
position: absolute;
left: 0;
right: 0;
background-color: #ffffff;
z-index: 10;
}

.search-form__list li {
padding: 10px 15px;
cursor: pointer;
transition: all 0.3s ease;
}

.search-form__list li:hover {
background-color: #f0f0f0;
}

.search-form__list li svg {
display: inline-block;
vertical-align: middle;
margin-right: 10px;
}

.search-form__btn {
margin-top: 40px;
background-color: #655d8c;
color: #ffffff;
transition: all 0.3s ease;
font-size: 24px;
width: 100%;
padding: 12px;
font-family: 'Source Sans Pro', 'Arial', sans-serif;
font-weight: normal;
letter-spacing: -0.6px;
border: 3px solid #655d8c;
}

.search-form__btn svg {
fill: #ffffff;
transition: all 0.3s ease;
display: inline-block;
vertical-align: middle;
position: relative;
right: -20px;
}

.search-form__btn:hover {
background-color: #ffffff;
color: #655d8c;
}

.search-form__btn:hover svg {
fill: #655d8c;
}

.search-form__btn--small {
margin-top: 0;
width: auto;
height: 39px;
padding: 0 7px;
margin-bottom: 15px;
}

.search-form__btn--small svg {
right: auto;
bottom: 2px;
width: 17px;
height: 17px;
}

@media (max-width: 1199px) {
.search-form__btn {
font-size: 20px;
}
}

@media (max-width: 991px) {
.search-form {
padding-left: 0;
}
}

@media (max-width: 700px) {
.search-form--small {
flex-wrap: wrap;
}

.search-form--small .search-form__title {
width: 100%;
}
}

@media (max-width: 520px) {
.search-form--small {
display: block;
}

.search-form--small .form-group {
margin-right: 0;
}

.search-form__btn--small {
width: 100%;
margin-top: 20px;
}
}

.author-list__content {
position: relative;
min-height: 680px;
padding-top: 40px;
padding-bottom: 40px;
}

.author-list__title {
margin-top: 25px;
font-size: 45px;
color: #665073;
}

.author-list__header {
border-bottom: 1px solid #d1d1d1;
padding-bottom: 15px;
}

.author-list__nav {
margin-top: 40px;
text-align: center;
}

.author-list__menu {
list-style: none;
display: inline-block;
padding: 0;
margin: 0;
text-align: left;
}

.author-list__menu li {
display: inline-block;
vertical-align: bottom;
margin: 6px 3px;
}

.author-list__menu a {
color: #999999;
font-size: 35px;
font-weight: 400;
transition: all 0.3s ease;
border-bottom: 2px solid #ffffff;
}

.author-list__menu a:hover {
text-decoration: none;
color: #655d8c;
border-bottom: 2px solid #655d8c;
}

.author-list__menu a.author-list__active {
color: #655d8c;
}

.author-list__letter {
color: #7a7a7a;
font-size: 72px;
line-height: 50px;
padding: 0 30px;
margin-bottom: 25px;
}

.author-list__items {
list-style: none;
padding: 0;
margin: 0;
}

.author-list__items li {
position: relative;
padding-left: 45px;
margin-bottom: 10px;
}

.author-list__items svg {
position: absolute;
left: 0;
top: 50%;
margin-top: -11px;
}

.author-list__link {
color: #666666;
font-size: 19px;
transition: all 0.3s ease;
}

.author-list__link span {
font-weight: 600;
}

.author-list__link:hover {
text-decoration: none;
color: #655d8c;
}

@media (max-width: 991px) {
.author-list__letter {
padding: 0;
}
}

@media (max-width: 767px) {
.author-list__content {
min-height: auto;
}
}

.poem {
margin-bottom: 80px;
margin-left: 11%;
position: relative;
padding-right: 140px;
}

.poem__content {
font-size: 18px;
line-height: 32px;
padding-left: 75px;
}

.poem__content p {
margin: 20px 0;
}

.poem__title {
font-weight: normal;
font-size: 45px;
color: #665073;
margin-bottom: 45px;
padding-left: 75px;
}

.poem__author {
padding-left: 75px;
position: relative;
}

.poem__author a {
color: #666666;
font-weight: bold;
font-size: 30px;
letter-spacing: -0.8px;
transition: all 0.3s ease;
}

.poem__author a:hover {
text-decoration: none;
color: #655d8c;
}

.poem__author-note {
display: block;
color: #666666;
font-size: 24px;
margin-top: 10px;
}

.poem__links {
margin-left: 70px;
border-top: 3px solid #b2a7b9;
margin-top: 40px;
padding-top: 30px;
}

.poem__links-title {
font-size: 30px;
font-weight: normal;
color: #655d8c;
}

.poem__links-items {
list-style: none;
padding: 0;
}

.poem__links-items li {
margin: 5px 0;
}

.poem__links-items a {
color: #333333;
display: inline-block;
font-size: 16px;
transition: all 0.3s ease;
padding-right: 50px;
position: relative;
}

.poem__links-items a svg {
position: absolute;
right: 0;
top: 50%;
margin-top: -10px;
fill: #999999;
transition: all 0.3s ease;
}

.poem__links-items a:hover {
color: #756fa5;
text-decoration: none;
}

.poem__links-items a:hover svg {
fill: #756fa5;
}

@media (max-width: 767px) {
.poem__links {
margin-left: 50px;
}

.poem {
margin-left: 0;
padding-right: 0;
}

.poem__author {
padding-left: 55px;
}

.poem__content {
padding-left: 55px;
}

.poem__title {
font-size: 35px;
margin-bottom: 25px;
padding-left: 55px;
}
}

@media (max-width: 500px) {
.poem__content {
padding-left: 0;
}

.poem__author {
padding-left: 0;
margin-top: 70px;
}

.poem__title {
padding-left: 0;
}

.poem__links {
margin-left: 0;
}
}

.flag {
position: relative;
padding-left: 45px;
}

.flag::before {
position: absolute;
left: 0;
top: 50%;
margin-top: -11px;
content: '';
background-image: url("../images/sprites/flag-sprite.svg");
background-repeat: no-repeat;
width: 33px;
height: 22px;
}

.flag--big {
padding-left: 75px;
}

.flag--big::before {
transform: scale(1.3);
top: 5px;
margin-top: 0;
}

.flag--england::before {
background-position: 0 -88px;
}

.flag--austria::before {
background-position: 0 0;
}

.flag--belgium::before {
background-position: 0 -22px;
}

.flag--ecosse::before {
background-position: 0 -66px;
}

.flag--france::before {
background-position: 0 -110px;
}

.flag--francophone::before {
background-position: 0 -132px;
}

.flag--haiti::before {
background-position: 0 -154px;
}

.flag--poland::before {
background-position: 0 -176px;
}

.flag--quebec::before {
background-position: 0 -198px;
}

.flag--russie::before {
background-position: 0 -220px;
}

.flag--swiss::before {
background-position: 0 -242px;
}

.flag--united-state::before {
background-position: 0 -264px;
}

.flag--canada::before {
background-position: 0 -44px;
}

@media (max-width: 767px) {
.flag--big {
padding-left: 55px;
}
}

@media (max-width: 500px) {
.flag--big {
padding-left: 0;
}

.flag--big::before {
top: -30px;
left: 6px;
}
}

.main-footer {
background-color: #f0f0f0;
color: #999999;
text-align: center;
padding-top: 50px;
padding-bottom: 80px;
}

.main-footer a {
color: #999999;
transition: all 0.3s ease;
}

.main-footer a:hover, .main-footer a:focus {
text-decoration: none;
color: #333333;
}

.main-footer__links {
margin-bottom: 5px;
}

.main-footer__links a {
font-size: 16px;
display: inline-block;
vertical-align: middle;
margin: 0 5px;
position: relative;
}

.main-footer__links a::after {
position: absolute;
content: '';
width: 5px;
height: 1px;
background-color: #999999;
top: 50%;
right: -10px;
}

.main-footer__links a:last-child::after {
display: none;
}

.main-footer__copyright {
font-size: 14px;
}

@media (max-width: 767px) {
.main-footer {
padding-top: 20px;
padding-bottom: 20px;
}
}

.account h3 {
font-size: 48px;
color: #6a5077;
margin-bottom: 25px;
}

.account h4 {
font-size: 28px;
color: #000000;
padding-bottom: 15px;
margin-bottom: 20px;
border-bottom: 1px solid #ccc;
}

.account form label {
display: block;
color: #6a5077;
font-weight: normal;
font-size: 20px;
margin-bottom: 10px;
}

.account form input[type="text"],
.account form input[type="password"],
.account form input[type="mail"],
.account form button {
width: 100%;
margin-bottom: 25px;
border-radius: 5px;
border: 1px solid #ccc;
outline: none;
height: 38px;
font-size: 18px;
}

.account form input[type="text"],
.account form input[type="password"],
.account form input[type="mail"] {
padding: 5px 20px;
color: #000000;
}

.account form button {
text-align: left;
}

.account form textarea {
width: 100%;
margin-bottom: 25px;
border-radius: 5px;
border: 1px solid #ccc;
height: 600px;
resize: vertical;
padding: 10px 20px;
outline: none;
}

.account form .valid-form {
background-color: #6a5077;
width: 100%;
border-radius: 5px;
padding: 20px 10px;
margin-bottom: 50px;
font-size: 24px;
color: #ffffff;
border: 1px solid #6a5077;
line-height: 29px;
font-weight: normal;
}

.account ul.reglements {
margin-left: 20px;
padding-left: 0;
margin-bottom: 25px;
}

.account ul.reglements > li {
float: left;
width: 50%;
color: #666666;
font-size: 20px;
margin-bottom: 10px;
}

.account ul.reglements > li ul {
list-style: none;
}

.account ul.reglements > li ul li {
padding-top: 10px;
}

.account ul.reglements > li ul li:before {
content: "-";
display: inline-block;
padding-right: 5px;
}

.account ul.reglements:after {
content: "";
display: block;
clear: both;
}

.account table.tab-poems {
width: 100%;
margin-bottom: 50px;
}

.account table.tab-poems tr th {
color: #999;
text-transform: uppercase;
text-align: center;
font-size: 14px;
line-height: 16px;
padding: 10px 20px;
border-bottom: 1px solid #f0f0f0;
}

.account table.tab-poems tr th.point-poem {
width: 20px;
}

.account table.tab-poems tr th.edit-poem {
width: 120px;
}

.account table.tab-poems tr th.publish-poem {
width: 140px;
}

.account table.tab-poems tr th.status-poem, 
.account table.tab-poems tr th.creationdate-poem {
width: 240px;
text-align: left;
}


.account table.tab-poems tr td.point-poem {
    width: 1px;
}

.account table.tab-poems tr th.comment-poem {
    text-align: center;
}
.account table.tab-poems tr td.title-poem {
    width: 250px;
}


.account table.tab-poems tr td {
padding: 5px 20px;
border-bottom: 1px solid #f0f0f0;
}

.account table.tab-poems tr td a {
color: inherit;
}

.account table.tab-poems tr td.point-poem span {
display: inline-block;
border-radius: 50%;
width: 10px;
height: 10px;
background-color: #999;
}

.account table.tab-poems tr td.edit-poem {
text-align: center;
}

.account table.tab-poems tr td.edit-poem .glyphicon {
color: #ececec;
font-size: 22px;
}

.account table.tab-poems tr td.edit-poem a > .glyphicon {
color: #999;
}

.account table.tab-poems tr td.publish-poem {
text-align: center;
}

.account table.tab-poems tr td.publish-poem input[type="checkbox"] {
position: absolute;
left: -9999px;
}

.account table.tab-poems tr td.publish-poem input[type="checkbox"] + label {
position: relative;
cursor: pointer;
display: inline-block;
vertical-align: top;
width: 65px;
height: 30px;
margin-bottom: 0;
}

.account table.tab-poems tr td.publish-poem input[type="checkbox"] + label:before, .account table.tab-poems tr td.publish-poem input[type="checkbox"] + label:after {
content: '';
position: absolute;
}

.account table.tab-poems tr td.publish-poem input[type="checkbox"]:checked + label:before, .account table.tab-poems tr td.publish-poem input[type="checkbox"]:not(:checked) + label:before {
left: 0;
top: 0;
width: 65px;
height: 30px;
background-color: #999;
border-radius: 15px;
-webkit-transition: background-color .2s;
-moz-transition: background-color .2s;
-ms-transition: background-color .2s;
transition: background-color .2s;
}

.account table.tab-poems tr td.publish-poem input[type="checkbox"]:checked + label:after, .account table.tab-poems tr td.publish-poem input[type="checkbox"]:not(:checked) + label:after {
left: 3px;
top: 3px;
width: 24px;
height: 24px;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
transition: all .2s;
border-radius: 50%;
background-color: #ffffff;
}

.account table.tab-poems tr td.publish-poem input[type="checkbox"]:not(:disabled):checked + label:before {
background-color: #9acd66;
}

.account table.tab-poems tr td.publish-poem input[type="checkbox"]:not(:disabled):checked + label:after {
left: 38px;
}

.account table.tab-poems tr td.publish-poem input[type="checkbox"]:disabled:not(:checked) + label:before {
background-color: #ececec;
}

.account table.tab-poems tr td.status-poem {
font-size: 14px;
line-height: 16px;
}

.account table.tab-poems tr td.delete-poem {
text-align: center;
font-size: 24px;
}

.account table.tab-poems tr td.delete-poem a {
color: #999;
text-decoration: none;
}

.account table.tab-poems tr td.pardonner-poem {
text-align: center;
font-size: 24px;
}

.account table.tab-poems tr td.pardonner-poem a {
color: #999;
text-decoration: none;
}

.account table.tab-poems tr.visible td.point-poem span {
background-color: #9acd66;
}

.account table.tab-poems tr.visible td.status-poem {
color: #9acd66;
}

.account table.tab-poems tr.wait-modification td.point-poem span {
background-color: #ff9a2f;
}

.account table.tab-poems tr.wait-modification td.status-poem {
color: #ff9a2f;
}

.account table.tab-poems tr.wait-validation td.point-poem span {
background-color: #cd002f;
}

.account table.tab-poems tr.wait-validation td.status-poem {
color: #cd002f;
}

.account nav.poems-pagination {
margin-bottom: 75px;
text-align: center;
}

.account nav.poems-pagination .pagination {
margin: 0;
}

.account nav.poems-pagination .pagination > li > a, .account nav.poems-pagination .pagination > li > span {
color: #999;
border: none;
background-color: transparent;
}

.account nav.poems-pagination .pagination > li > a:hover, .account nav.poems-pagination .pagination > li > a:focus, .account nav.poems-pagination .pagination > li > span:hover, .account nav.poems-pagination .pagination > li > span:focus {
background-color: transparent;
}

.account ul.author-list__items {
margin-bottom: 50px;
}

.account-header .main-menu__nav .user-account {
padding: 21px 15px;
font-size: 16px;
}

.account-header .main-menu__nav .user-account strong {
position: relative;
color: #ffffff;
padding: 0 10px;
}

.account-header .main-menu__nav .user-account strong:after {
position: absolute;
content: '';
width: 2px;
right: -3px;
top: 6px;
bottom: 6px;
background-color: #deb5e8;
}

.account-header .account-page-title {
background-color: #655d8c;
}

.account-header .account-page-title h1 {
text-transform: uppercase;
color: #ffffff;
font-size: 80px;
line-height: 70px;
font-weight: bold;
letter-spacing: 2px;
max-width: 1280px;
margin: 0 auto;
padding: 30px 0px;
}

.account-menu {
background: #f0f0f0;
}

.account-menu ul {
text-align: center;
}

.account-menu ul li {
display: inline-block;
padding: 0 30px;
}

.account-menu ul li a, .account-menu ul li span {
display: inline-block;
vertical-align: top;
font-size: 30px;
padding: 40px 0 30px;
font-weight: bold;
}

.account-menu ul li span {
position: relative;
color: #6a5077;
}

.account-menu ul li span:after {
content: "";
position: absolute;
left: calc(50% - 25px);
bottom: -3px;
width: 50px;
height: 3px;
background-color: #ffbe22;
}

.account-menu ul li a {
color: #999;
text-decoration: none;
}

.account-menu ul li a:hover {
position: relative;
color: #6a5077;
}

.account-menu ul li a:hover:after {
content: "";
position: absolute;
left: calc(50% - 25px);
bottom: -3px;
width: 50px;
height: 3px;
background-color: #ffbe22;
}

/*# sourceMappingURL=app.css.map*/

button.valid-form {
height: unset !important;
text-align: center!important;
}

section.poem.large {
margin-left: 0px !important;
}

.costum_text {
text-align: center;
}

/**************** Boutton Publish-now *****************/
.buton-switch {
position: relative;
display: inline-block;
/*width: 60px;
height: 34px;*/
width: 60px;
height: 30px;
}
.buton-switch input {
opacity: 0;
width: 0;
height: 0;
}
.buton-slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .2s;
transition: .2s;
}
.buton-slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 2px;
background-color: white;
-webkit-transition: .2s;
transition: .2s;
}
input:checked + .buton-slider {
background-color: #9acd66;
}
input:focus + .buton-slider {
box-shadow: 0 0 1px #2196F3;
}
input:checked + .buton-slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}
/*** Rounded sliders ***/
.buton-slider.buton-slider-round {
border-radius: 34px;
}
.buton-slider.buton-slider-round:before {
border-radius: 50%;
}

/* Liste poemes*/
/* En attente de modération*/
#account-user-list-poems,
#account-admin-list-poems,
#waiting_moderation {
margin-left: 100px;
margin-right: 100px;
}

/*Liste utilisateur*/
.button-visualize-user {
    color: #655d8c;
    cursor: pointer;
    margin-right: 10px;
}
.button-no-visualize-user {
    color: #655d8c;
    cursor: not-allowed;
    margin-right: 10px;
}
.button-delete-user {
    color: #ff0000;
    cursor: pointer;
}

.disable-trash {
    color: lightgrey;
    pointer-events: none;
}

.wrapper-trash {
    cursor: not-allowed;
}