


/****Fonts****/
@font-face {
    font-family: "Rama Gothic";
    font-weight: bold;
    font-style: normal;
    src: url("/custom_assets/css/fonts/1204/rama-gothic-1749559709.ttf") format('truetype');
}

@font-face {
    font-family: "Rama Gothic Echo";
    font-weight: bold;
    font-style: normal;
    src: url("/custom_assets/css/fonts/1204/rama-gothic-echo-1749559596.ttf") format('truetype');
}

@font-face {
    font-family: 'Rama Gothic E Heavy', sans-serif;
    font-weight: bold;
    font-style: normal;
    src: url("/custom_assets/css/fonts/1204/rama-gothic-e-heavy-1754041560.ttf") format('truetype');
}

@font-face {
    font-family: "Roboto";
    font-weight: 400;
    font-style: normal;
    src: url("/custom_assets/css/fonts/1204/roboto-1749567147.ttf") format('truetype');
}

/* B2C special myshop */
html.theme-enkel:not(.html-page-group-b2b),
body.page-group-ecard,
body.page-group-exception,
body.page-group-burn {
    background-image: linear-gradient(white, white);
}

body.page-group-ecard div.body,
body.page-group-exception div.body,
body.page-group-burn div.body {
    background-color: #fff;
}

body.page-group-ecard header {
    box-shadow: 0px;
}

body.page-group-ecard footer {
    box-shadow: 0px -2px 3px 0px #aaa;
}

.block-containers .block-container:first-child .container {
    padding-top: 30px;
    background-color: #fff;
}

.block-containers .specific-to-card-type .block-container:first-child .container,
.block-containers .block-container.gts-container .container {
    padding-top: 0px;
}

/* B2B special myshop */

body.page-group-b2b {
    background-image: linear-gradient(white, black);
}

body.page-group-b2b .global {
    background-color: transparent;
}

body.page-group-b2b .ecard-default h3 {
    margin: 30px 0px 40px 0px;
    padding: 6px 40px 10px 40px;
    background-color: #52A2D5;
    color: #fff;
}

body.page-group-b2b .form-control {
    border: 1px solid #52A2D5;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) inset;
}

body.page-group-b2b .b2b-homepage-ecard-type {
    background-color: #fff;
}

body.page-group-b2b a {
    color: #52A2D5;
    text-decoration: none;
}

body.page-group-b2b a {
    color: #337ab7;
    text-decoration: underline;
}


/****** Ajout Linda 14/12/23 *********/
html, body {
  font: 400 16px/26px "Roboto", sans-serif;
  color: #122053;
  background-color: #ffffff;
}

.body {
  padding: 40px 0px 0px 0px;
}

.container {
  padding-right: 15px;
  padding-left: 15px;
}

h4 {
  font-size: 17px;
}

/***Header***/

header .header-logo img{
   max-width: 350px !important; 
   padding-top: 50px;
}

header, header .header-logo a, .header-logo-block {
  min-height: auto;
}

.header-title {
  border-top: 1px solid #D9D9D9;
  max-width: 1168px;
  margin: 21px auto 0;
}

.container.top{
    padding-top:50px;
    text-align:center;
    width: 100%;
    max-width: 870px;
}

.header-text-back{
    font-family: 'Rama Gothic', sans-serif;
    font-weight: 700;
    margin-bottom: 35px;
}

.header-text-back, .header-text-back .echo-font{
  text-transform: uppercase;
  color: #122053;
  font-size: 50px;
  line-height: 43px;
}

.header-text-back .echo-font{
  font-family: 'Rama Gothic Echo', sans-serif;
  font-weight: 900;
  display: block;
}

header .header-title{
  padding: 0px;
}

/***Titles***/
.block-title h3 {
  background-color: transparent;
  text-align: center;
  font-weight: 700;
  padding: 10px 0px 10px 0px;
  color: #122053;
  font-family: 'Rama Gothic E Heavy', sans-serif;
  font-size: 27px;
  font-style: normal;
  line-height: 49px; /* 181.481% */
  text-transform: uppercase;
}

.introduction-subtitle {
  font-family: 'roboto', sans-serif;
  font-size: 20px;
  font-weight: 400;
}

.block-title h3 .h3-subtitle{
  display: block;
  font-family: roboto, sans-serif;
  text-transform: none;
  font-size: 16px;
  font-weight: 400;
  text-align: left;
  line-height: 26px;
  padding-top: 20px;
}

.divider {
  display: flex;
  align-items: center;
  margin-bottom: 27px;
}

.divider::before {
  content: '';
  flex-grow: 1;
  height: 1px;
  background: rgba(217, 217, 217, 0.60);;
}

.divider::before {
  margin-right: 15px;
}

.divider::after {
  margin-left: 15px;
}

.block-container .block-body {
  margin: 0px 37px;
  padding: 30px 0;
}

/***Caroussel***/
.gallery-container .carousel-text-block {
  width: 31%;
}

.gallery-container .carousel-visuals-block {
  float: left;
  width: 66%;
  margin: 0 auto;
  margin-left: 30px;
  padding: 0px;
}

.gallery-container .visual.active {
  background-color: transparent;
  border: 2px solid #FF6E4C;
  border-radius:8px;
}

.gallery-container .visual {
  padding: 7px 6px;
}

.slick-slide {
  padding: 0 5px;
}

.slick-dots {
  bottom: -35px;
}

.block-body.gallery-body {
  padding: 30px 0 40px 0;
}

.gallery-container .slick-dots li.slick-active button, .gallery-container .slick-dots li button{
    background-image:none;
}

.gallery-container .slick-dots li {
  width: 5px;
}

.gallery-container .slick-dots li.slick-active button {
  background: #94EAFF;
}

.gallery-container .slick-dots li button{
  border-radius: 50px;
  background: #c2c2c2;
  height: 8px;
  width: 8px;
}

.gallery-container .slick-prev{
  left: -35px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="18" viewBox="0 0 10 18" fill="none"><path d="M8.11158 1.91747L1.91455 8.89172L8.11158 15.866" stroke="%23122053" stroke-width="3.33333" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat top center transparent;
}

.gallery-container .slick-next{
  right: -35px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="18" viewBox="0 0 10 18" fill="none"><path d="M1.80297 16.0242L8 9.04993L1.80297 2.07568" stroke="%23122053" stroke-width="3.33333" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat top center transparent;
}

.btn-custom{
    background-color: #122053;
    border-color: #122053;
    color: #fff;
    border-radius: 50px;
    text-transform: uppercase;
}

.btn-custom:hover {
  background-color: #FF6E4C;
  border-color: #FF6E4C;
  transition: 0.2s ease 0.2s;
}

/***Message***/

.beneficiary-container .beneficiary-infos {
  padding-left: 0px;
}

.gift-card-app .form-control {
  border: 1px solid #D9D9D9;
  box-shadow: none;
  border-radius: 8px;
  height: 45px;
  padding-left: 20px;
}

.gift-card-app .form-control,.gift-card-app .form-control::placeholder, .amount-container .free-amount input.form-control{
  font-size: 16px;
  font-weight: 400;
}

.guide h4, .dispatch-container .send-type-block label{
   font-size: 16px;
  font-weight: 700;
}

.gift-card-app .form-control,.gift-card-app .form-control::placeholder, .dispatch-container .send-type-block label{
   color: #8F8F99;
   text-align: left;
}

.beneficiary-container .beneficiary-infos .beneficiary-field {
  padding: 0px 0px 18px 0px;
}

.beneficiary-container .beneficiary-infos .message {
  min-height: 185px;
}

.beneficiary-field.beneficiary-message-block textarea {
  padding-top: 15px;
  resize: none;
}

.block-container.beneficiary-container .block-body {
  padding: 30px 0px;
}

.beneficiary-container .beneficiary-infos .textarea-feedback{
    top: 5px;
    right: 0px;
}

/***Choix mode d'envoi****/

div.guide > p::before, div.guide > ul > li, div.guide > ul > li::before{
  width: 0px;
  display:none;
}

.block-body .guide p {
  padding-right: 10px;
  font-size: 16px;
  line-height: 26px;
  background: none;
}

.block-title.dispatch-title.dispatch-standard-title .h3-subtitle {
  padding: 0px 50px;
}

.dispatch-container .send-type-block {
  padding: 8px 12px 8px 12px;
  border: 1px solid #EBE9E9;
  background-color: #EBE9E9;
  width: 50%;
  text-align: center;
}

.send-type-block.send-type-email-block {
  border-top-left-radius: 8px;
}

.send-type-block.send-type-hand-block{
    border-top-right-radius: 8px;
}

.dispatch-container .send-type-block{
  color: #18295f;
}

.dispatch-container .dispatch-method-choice-content-block {
  border: 1px solid transparent;
  border-top: 1px solid transparent;
  padding: 42px 36px;
  background: #E0F7FF;
  border-radius: 0 0 8px 8px;
}

.dispatch-method-choice-content-block.dispatch-method-choice-email-content-block input {
  border-color: transparent;
}

.send-date-block input {
  background: #fff !important;
  border-color: transparent !important;
}

.dispatch-container .send-type-block.send-type-hand-block {
  margin-left: 0px;
}

.dispatch-container .send-type-block-active label {
  color: #122053;
}

.dispatch-container .send-type-block.send-type-block-active {
  border: 1px solid #E0F7FF;
  background-color: #E0F7FF;
}

.btn-custom-radio label span.radiobox-icon{
  width: 18px;
  height: 18px;
  background-image: none;
  border-radius: 3px;
  border: 1px solid #122053;
}

.btn-custom-radio input[type="radio"]:checked + label span.radiobox-icon {
  background: #FF6E4C;
  border-color: #FF6E4C;;
}

div.guide h4:first-child {
  margin-top: 0px;
}

.btn-custom-radio label span.radiobox-label{
  min-height: 32px;
  vertical-align: center;
}

.dispatch-container .dispatch-send-date-type-block {
  width: 70%;
}

.dispatch-container .dispatch-send-date-block {
  width: 30%;
}

/***Amount***/
.amount-container .amount-guide-block {
  width: 0%;
}

.block-body.amount-body, .block-body.edit-amount-body {
  padding: 30px 50px;
}

.amount-container .free-amount-block {
  width: 20%;
  padding-left: 0px;
}

.amount-container .free-amount {
  width: 150px;
  height: 45px;
  border: 1px solid transparent;
  background: #F2F2F2;
  border-radius: 8px;
}

.free-amount input {
  text-align: left;
}

.amount-container .currency-amount {
  width: 25px;
  line-height: 47px;
  padding: 0px 5px 0px 10px;
}

.amount-container .fixed-amount-block {
  width: 80%;
}

.amount-container .fixed-amount {
  height: 47px;
  margin: 0px 14px 16px 14px;
  padding: 5px 0 5px 0;
  border: 1px solid #D9D9D9;
  border-radius: 8px;
  background-color: transparent;
  color: #122053;
  text-align: center;
  width: 100%;
  max-width: 122px;
  font-weight: 400;
}

.amount-container .fixed-amount.active {
  background-color: #fff;
  border: 2px solid #FF6E4C;
  color: #122053;
  font-weight: 700;
}

/*****Infos******/

.organizer-fields-block .organizer-infos-field, .participant-fields-block .participant-infos-field {
  width: 98%;
}

.block-tip-send-date .tip {
  text-align: justify;
}

/***Payment****/
.payment-submit-methods-block p {
  text-align: center;
}

.custom-checkbox label span.checkbox-label, .payment-submit-methods-block p {
  font-size: 16px;
  font-weight: 400;
}

.custom-checkbox label span.checkbox-label, .checkbox-label.checkbox-cgv-label a, .xs-exclude-inline, .xs-only-inline {
  color: #122053;
}

.xs-exclude-inline {
  font-weight: 700;
}

.payment-submit-methods-block p, .custom-checkbox.cgv-field-block {
  padding-top: 10px;
}

ul.mpsp-payment-means-list {
  margin-top: 20px;
}

.block-body.payment-body {
  padding-bottom: 0px;
}

/****Code promo ***/
.calculation-block .discount-label-block {
  width: 100%;
}

.calculation-block .calculation-add-discount-block {
  padding: 0px;
  /*display: flex;
  flex-direction: column;*/
}

.discount-label-block div.guide {
  padding: 0px 0px 0px 0px;
}

.calculation-block .discount-input-block {
  padding-left: 0px;
  padding-right: 0px;
}

.calculation-block .discount-label-block .discount-title, .calculation-block .discount-refresh-block {
  text-align: left;
}

.calculation-block .discount-input-block , .calculation-block .discount-refresh-block{
    width: 40%;
}

.btn-custom-discount-code {
  color: #fff;
  background-color: #122053;
  border-radius: 50px !important;
  height: 47px;
  text-transform: uppercase;
  line-height: 1.1;
}

.btn-custom-discount-code:hover{
  background-color: #FF6E4C;
  border: 1px solid #FF6E4C;
  transition: 0.1s ease 0.2s;
color: #fff;
}

.calculation-block .total-summary-block {
  float: right;
  display: flex;
  flex-direction: column-reverse;
}

.summary-row.discount-binder {
  font-weight: 700;
  color: #3ACCB3;
  font-size: 0.8em;
}

.discount-binder_icon-validation {
  background: url('data:image/svg+xml,<svg width="18" height="18" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="12.5" cy="12.5" r="12.5" fill="%233ACCB3"/><path d="M17.1407 11.4502L12.3448 16.1154C12.2893 16.1694 12.2234 16.2122 12.1509 16.2414C12.0784 16.2706 12.0006 16.2857 11.9221 16.2857C11.8437 16.2857 11.7659 16.2706 11.6934 16.2414C11.6209 16.2122 11.555 16.1694 11.4995 16.1154L8.82461 13.4994C8.71274 13.3904 8.6499 13.2426 8.6499 13.0886C8.6499 12.9346 8.71274 12.7869 8.82461 12.6779L9.72098 11.8059C9.83267 11.6972 9.98404 11.636 10.142 11.6356C10.3 11.6351 10.4517 11.6956 10.5639 11.8037L11.9324 13.0852L11.9365 13.0892L15.3999 9.76938C15.5119 9.66089 15.6635 9.59998 15.8216 9.59998C15.9796 9.59998 16.1312 9.66089 16.2432 9.76938L17.1396 10.6254C17.1956 10.6794 17.24 10.7436 17.2704 10.8143C17.3008 10.885 17.3165 10.9609 17.3166 11.0376C17.3167 11.1142 17.3012 11.1901 17.271 11.2609C17.2408 11.3318 17.1966 11.3961 17.1407 11.4502Z" fill="white"/></svg>') no-repeat bottom center;
  width: 18px;
  height: 18px;
  display: inline-block;
  top: 4px;
  position: relative;
  margin-right: 2px;
}

.calculation-block .discount-binder-amount, .calculation-block .discount-binder-code {
  display: block;
  padding-right: 0px;
  color: #122053;
  font-weight: 400;
  line-height: 1.2;
}

.discount-binder-amount::before {
  content: 'Vous avez économisé ';
}

.discount-binder-amount:lang(en)::before {
  content: 'You saved';
}

.summary-row.shipping-binder h5 {
  margin-top: 0px;
}

.calculation-block {
  padding: 30px 100px 50px 100px;
}

/***Page de confirmation****/
.page-name-ecardConfirm .block-title h3, .page-name-participationConfirm .block-title h3, .paragraph a {
  color: #122053;
}

.no-js.html-page-name-ecardConfirm.html-page-group-ecard.theme-enkel .body, .no-js.html-page-name-ecardEdit.html-page-group-ecard.theme-enkel .body,
.gift-card-app.page-group-burn.page-name-burnPaymentLogin .body, .gift-card-app.page-group-burn.page-name-burnPaymentCheck .body {
  padding-top: 0px;
}

.block-body.confirm-body.confirm-return-body, .block-body.confirm-body.confirm-visual-overview-body {
  padding: 0px;
}

.ecard-overview img {
  width: 100%;
  max-width: 600px;
}

.paragraph a {
  text-decoration: underline;
}

.html-page-name-ecardConfirm .block-container .block-body {
  padding: 0 0 20px 0;
}
/***** Consultation solde *****/
.gift-card-app.page-group-ecard.page-name-balanceConsult .body {
  padding-top: 0px;
}

.page-name-balanceConsult .btn-custom {
  width: 100%;
    border-radius: 50px;
    margin-top: 20px;
    font-weight:700;
}

.btn{
  padding: 14px 25px;
  font-size: 16px;
  border-radius:50px;
}

.consult-container .consult-balance-block {
  margin: 0px auto 35px auto;
  padding-bottom: 35px;
}

.consult-container .code-pin-container label, .burn-login-container .code-pin-container label {
  padding: 0px;
  margin: 12px 0px;
}

/*debit carte*/
.row.code-pin-container .col-sm-6 {
  padding-left: 0px;
}

/***Cagnotte**/
.amount-guide-block .guide {
  display: none;
}

.edit-summary-description-block h4 span.strong {
  font-size: 20px;
}

.participant-fields-block .participant-fields-row {
  padding-bottom: 30px;
}

.page-name-participationConfirm .body {
  padding: 0px;
}


/*****Debit****/
.page-name-burnPaymentCheck .btn-custom {
  width: 33%;
  margin-top: 20px;
}

.form-ecard-number-connect .code-pin-container .form-group {
  padding: 0px;
}

.extra-amount-row .col-sm-1.col-xs-4 {
  padding-top: 15px;
}

/***Footer**/
body.page-group-ecard footer {
  box-shadow: 0px -2px 3px 0px transparent ;
}

footer {
  padding: 0px 0px 10px 0px;
  min-height: 80px;
  text-align: center;
  background-color: white;
  font-size:13px;
}

footer p, a.footer-link{
  color: #122053;
}

/*****CGV*****/
.gts-container h3 {
  padding: 0px 0px 10px;
  background-color: #fff;
  color: #122053;
  font-weight: 700;
}

/****Responsive****/
@media (min-width: 1200px) {
  .container {
    width: 1168px;
  }
}

@media screen and (max-width: 1199px) {
    .gallery-container .carousel-text-block {
         width: 29%;
    }

    .amount-container .free-amount-block {
        width: 25%;
    }

    .amount-container .fixed-amount-block {
        width: 75%;
    }
}

@media screen and (max-width: 1199px) and (min-width: 992px) {
.amount-container .fixed-amount {
  width: 79px;
}
}

@media screen and (max-width: 991px) and (min-width: 768px) {
    .container, .gallery-container .carousel-text-block, .gallery-container .carousel-visuals-block {
    width: 100%;
  }

  .gallery-container .carousel-visuals-block{
    margin-left:0px;
  }

.beneficiary-container .beneficiary-infos {
  width: 35%;
  padding-left: 0px;
  float: left;
}

.beneficiary-container .ecard-overview-block {
  width: 65%;
  float: left;
  padding-left: 25px;
}

.block-body.amount-body {
  padding: 30px 20px 30px 20px;
}

.amount-container .free-amount {
  width: 138px;
}

.amount-container .currency-amount {
  width: 15px;
}

.amount-container .fixed-amount {
    width: 44% !important;
}

.amount-container .fixed-amount {
  height: 50px;
  margin: 0px 10px 16px 10px;
}
}

@media screen and (max-width: 767px) {

.slick-slide, .block-body.payment-body {
  padding: 0px;
}

body.page-group-ecard header {
  padding-left: 15px;
  padding-right: 15px;
}

.beneficiary-container .beneficiary-infos, .beneficiary-container .ecard-overview-block, .dispatch-container .send-type-block, 
.amount-container .free-amount-block, .amount-container .fixed-amount-block, .custom-checkbox label span.checkbox-label, .edit-summary-container .edit-summary-description-block,
.edit-summary-container .edit-summary-visual-block, .organizer-fields-block .organizer-infos-field, .participant-fields-block .participant-infos-field,
.page-name-burnPaymentCheck .btn-custom, .gallery-container .carousel-text-block {
  width: 100%;
}

.gallery-container .carousel-visuals-block {
  width: 90%;
}

.dispatch-method-choice {
  display: flex;
}

.send-type-block.send-type-email-block, .send-type-block.send-type-hand-block {
    width:50%;
}

.dispatch-container .send-type-block label{
    text-align: center;
}

.send-type-block.send-type-hand-block {
  border-top-right-radius: 8px;
}

.block-body.dispatch-body.dispatch-standard-body, .page-name-ecardEdit .block-body, .block-body.amount-body, .block-body.edit-amount-body  {
  padding: 30px 0px;
}

.amount-container .free-amount-block {
  padding: 0px 10px 10px 10px;
}

.btn-custom-radio label span.radiobox-label, .btn-custom-radio label span.radiobox-label {
    max-width: inherit;
}

.amount-container .fixed-amount {
   width: 40% !important;
}

.edit-summary-container .edit-summary-visual-block {
  padding: 0px;
}

.custom-checkbox.cgv-field-block label {
  width: 54%;
}

.dispatch-container .send-type-block.send-type-block-active {
  background-image: none;
}

.dispatch-container .dispatch-send-date-block , .dispatch-container .dispatch-send-date-type-block, .ecard-overview img  {
  width: 100%;
}

.block-title.dispatch-title.dispatch-standard-title .h3-subtitle {
  padding: 0px;
}

.container.top, .block-containers .block-container:first-child .container, .block-containers .block-container:first-child .container {
  padding-top: 30px;
}

footer p a {
  display: block;
  padding: 0px 12px 10px 12px;
}

.page-name-gts .body {
  padding-top: 0px;
}

/****Code promo***/
 .calculation-row {
    display: flex;
    flex-direction: column-reverse;
  }

.calculation-block .discount-label-block .discount-title {
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    padding-top: 0px;
  }

  .calculation-block {
  padding: 10px 0 50px 0;
}
}

@media screen and (max-width:480px){
     .gallery-container .carousel-visuals-block {
        width: 100%;
    }

    .gallery-container .carousel-visuals-block {
        padding: 0px 40px;
        margin-left: 0px;
    }

    .container.top {
        padding-top: 45px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .block-title h3{
        line-height: 30px;
    }

    .block-container .block-body, .block-container .block-title {
        margin: 0px 15px;
    }

    .amount-container .free-amount {
        width: 80%;
        /*max-width: 364px;*/
        float: left;
        margin-left: 5px;
    }

    .amount-container .fixed-amount {
    max-width: 40%;
  }

  /***Code Promo***/
    .calculation-block .discount-input-block{
      width: 50%;
    }

    .calculation-block .discount-refresh-block {
      width: 40%;
    }
}

@media screen and (max-width: 349px) {
.amount-container .fixed-amount {
   width: 39% !important;
}
}

@media screen and (max-width: 403px) {
 .custom-checkbox.cgv-field-block label {
    width: 56%;
  }
}

@media screen and (max-width: 390px) {
 .custom-checkbox.cgv-field-block label {
    width: 65%;
  }
}

