body {
  background: #f2f2f2;
}
main {
  margin-bottom: 50px;
  margin-top: 240px;
}

@media (max-width: 1000px) {
  main {
    margin-top: 312px;
  }
}

@media (max-width: 767px) {
  main {
    margin-top: 285px;
  }
}

header {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
a:focus,
select:focus,
button:focus,
input:focus,
textarea:focus {
  outline: 0;
}

@font-face {
  font-family: "CentraNo1-Black";
  src: url(../../admin_client/new/fonts/CentraNo1-Black.eot);
  src: url(../../admin_client/new/fonts/CentraNo1-Black.woff) format("woff"), url(../../admin_client/new/fonts/CentraNo1-Black.woff2) format("woff2");
  font-weight: 400;
}
@font-face {
  font-family: "CentraNo1-Book";
  src: url(../../admin_client/new/fonts/CentraNo1-Book.eot);
  src: url(../../admin_client/new/fonts/CentraNo1-Book.woff) format("woff"), url(../../admin_client/new/fonts/CentraNo1-Book.woff2) format("woff2");
  font-weight: 400;
}
@font-face {
  font-family: "CentraNo1-Extrabold";
  src: url(../../admin_client/new/fonts/CentraNo1-Extrabold.eot);
  src: url(../../admin_client/new/fonts/CentraNo1-Extrabold.woff) format("woff"), url(../../admin_client/new/fonts/CentraNo1-Extrabold.woff2) format("woff2");
  font-weight: 400;
}

button[data-action],
button.comment-delete,
button.comment-submit,
.reset {
  background: none;
  color: inherit;
  border: none;
  padding: 0;
  font: inherit;
  outline: inherit;
  background-size: contain;
  width: 32px;
  height: 32px;
}
.reset {
  width: unset;
  height: unset;
}
* {
  color: #707070;
  font-family: "CentraNo1-Book";
}
p,
span {
  font-size: 14px;
}

.btn.disabled,
.btn:disabled {
  opacity: 1;
}
h1 {
  font-size: 25px;
  line-height: 32px;
}
.momentjs {
  text-transform: capitalize;
}
.btn {
  padding: 5px 16px;
  border-radius: 64px;
  border: none;
  font-family: "CentraNo1-Extrabold";
}
.text-primary {
  color: #0953fb !important;
}

.text-secondary {
  color: #fc623d !important;
}

.bold {
  font-family: "CentraNo1-Extrabold";
}
.bg-pink {
  background: #ffad9f;
}

.bg-danger,
.btn-danger {
  background-color: #d10309 !important;
  color: white !important;
}
.btn-outline-danger {
  border-color: #d10309 !important;
  border: 2px solid;
  color: #d10309 !important;
}
.btn-outline-danger:hover {
  background-color: #d10309 !important;
  color: white !important;
}

.bg-primary,
.btn-primary {
  background-color: #0953fb !important;
  color: white !important;
}
.btn-outline-primary {
  border-color: #0953fb !important;
  border: 2px solid;
  color: #0953fb !important;
}
.btn-outline-primary:hover {
  background-color: #0953fb !important;
  color: white !important;
}
.bg-grey,
.btn-grey {
  background-color: #dedede !important;
  color: white !important;
}
.btn-outline-grey {
  border-color: #dedede !important;
  border: 2px solid;
  color: #dedede !important;
}
.btn-outline-grey:hover {
  background-color: #dedede !important;
  color: white !important;
}
.bg-secondary,
.btn-secondary {
  background-color: #fc623d !important;
  color: white !important;
}
.btn-outline-secondary {
  border-color: #fc623d !important;
  border: 2px solid;
  color: #fc623d !important;
}
.btn-outline-secondary:hover {
  background-color: #fc623d !important;
  color: white !important;
}
.text-sm {
  font-size: 12px;
}

.dropdown-menu {
  border-color: #d1d1d1;
  margin-top: 15px;
}
.dropdown-item {
  color: #707070;
  margin-top: 5px;
  margin-bottom: 5px;
}
.dropdown-item img {
  width: 32px;
  height: 32px;
  margin-right: 8px;
}

.parts {
  display: none;
}

.event-title {
  font-weight: 900;
  font-size: 20px;
  line-height: 26px;
}

.input-half {
  width: 45% !important;
  display: inline-block;
}
.filter-button {
  width: 82px;
  height: 32px;
  background-image: url("/assets/gallery/images/filter-active.svg");
}
.filter-button.collapsed {
  background-image: url("/assets/gallery/images/filter.svg");
}

.date-wrapper hr {
  margin-top: 5px;
}

.shares {
  height: 39px;
}
.h30 {
  height: 30px;
}

.picture img {
  width: 100%;
  position: relative;
}
.count-action {
  line-height: 32px;
  vertical-align: top;
  font-size: 18px;
  padding-right: 12px;
}
.picture-wrapper[data-lock="1"] .picture::after {
  position: absolute;
  content: "Photo masquée";
  /*background-color: rgba(0, 0, 0, 0.5);*/
  text-align: center;
  font-family: "CentraNo1-Extrabold";
  color: white;
  width: calc(100% - 30px);
  height: 100%;
  padding-top: 150px;
  left: 15px;
  top: 0;
}
.picture-wrapper[data-lock="1"] .picture a::after {
  position: absolute;
  content: "Cette photo n'apparaitra pas dans la galerie de vos invités.";
  background-color: rgba(0, 0, 0, 0.2);
  text-align: center;
  color: white;
  width: calc(100% - 30px);
  height: 100%;
  padding-left: 50px;
  padding-right: 50px;
  padding-top: 200px;
  left: 15px;
  top: 0;
}
.picture-wrapper[data-delete="1"] {
  display: none;
}
.picture-wrapper.loading button,
.picture-wrapper.loading .shares span {
  display: none;
}

button.s24 {
  width: 24px;
  height: 24px;
}
button.comment-delete {
  background-image: url("/assets/gallery/images/close.svg");
}
button.comment-delete:hover {
  background-image: url("/assets/gallery/images/close-active.svg");
}
button.comment-submit {
  background-image: url("/assets/gallery/images/submit.svg");
  right: 15px;
}
button.comment-submit:hover {
  background-image: url("/assets/gallery/images/submit-active.svg");
}
button[data-action="lock"] {
  background-image: url("/assets/gallery/images/lock.svg");
}
.picture-wrapper[data-lock="1"] button[data-action="lock"] {
  background-image: url("/assets/gallery/images/lock-active.svg");
}
button[data-action="like"] {
  background-image: url("/assets/gallery/images/like.svg");
}

.picture-wrapper[data-like="1"] button[data-action="like"] {
  background-image: url("/assets/gallery/images/like-active.svg");
}
button[data-action="delete"] {
  background-image: url("/assets/gallery/images/delete.svg");
}

.picture-wrapper[data-delete="1"] button[data-action="delete"] {
  background-image: url("/assets/gallery/images/delete-active.svg");
}
button[data-action="comment"] {
  background-image: url("/assets/gallery/images/comment.svg");
}
.picture-wrapper[data-comment="1"] button[data-action="comment"] {
  background-image: url("/assets/gallery/images/comment-active.svg");
}
button[data-action="share"] {
  background-image: url("/assets/gallery/images/share.svg");
}
button[data-action="download"] {
  background-image: url("/assets/gallery/images/download.svg");
}

.picture-wrapper .sharing button[data-action="share"] {
  background-image: url("/assets/gallery/images/share-active.svg");
}

.comment-form input,
.comment-form textarea {
  background: none;
  border: 0;
  color: black;
  font-size: 14px;
}
.comment {
  width: 100%;
}
.comment .author {
  color: black;
  padding-right: 8px;
}

.smile-bottom {
  position: relative;
  left: 50%;
  width: 50px;
  transform: translate(-50%, 50%);
  z-index: 1;
}

.scroll-top {
  position: fixed;
  bottom: 3rem;
  right: 3rem;
  width: 56px;
  height: 56px;
  background-image: url("/assets/gallery/images/scroll-top.svg");
  z-index: 999;
}

.conversion__wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px 5px 0;
  border-radius: 20px;
}

.conversion__img:first-child {
  position: relative;
  width: 196px;
  height: 207px;
}

.conversion__img:first-child:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  transform: translateX(-50%);
  background: url(https://s3-eu-west-1.amazonaws.com/sj-web-uploads/preprod/upload-wp-588990429795.png) no-repeat;
  background-position: 50%;
  width: 58px;
  height: 83px;
}

.conversion__img img {
  width: 100%;
  height: 100%;
}

.conversion__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  margin: 18px 0 27px;
  padding: 0 5px;
  /*max-width: 435px;*/
  text-align: center;
}

.conversion__content h4 {
  position: relative;
}

.conversion__content h4:before {
  content: "";
  position: absolute;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
  background: url(https://s3-eu-west-1.amazonaws.com/sj-web-uploads/preprod/upload-wp-606312894191.png) no-repeat;
  background-position: 50%;
  width: 200px;
  height: 20px;
}

.conversion__content p {
  margin-top: 10px;
  font-family: CentraNo1-Extrabold;
}

.conversion__content a {
  padding: 14px 16px 11px;
  transition: background 0.2s;
}

.conversion__content a:hover {
  background: #3b76fc;
}
.no-desktop {
  display: none;
}

.download-zip {
  padding-right: 36px;
}
.download-zip:after {
  content: url(/assets/gallery/images/download-white.svg);
  width: 14px;
  height: 18px;
  margin-left: 4px;
  position: absolute;
  margin-top: -2px;
}
#share-button {
  padding-right: 36px;
}
#share-button:after {
  content: url(/assets/gallery/images/share-blue.svg);
  width: 14px;
  height: 18px;
  margin-left: 4px;
  position: absolute;
  margin-top: -1px;
}
#share-button:hover:after {
	content: url(/assets/gallery/images/share-white.svg);
    width: 14px;
    height: 18px;
    margin-left: 4px;
    position: absolute;
    margin-top: -1px;
}
.wallpaper {
	background:white;
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	z-index:1000;
}
.wallpaper img {
	max-height:40vh;
	max-width:100%;
}
.wallpaper .row {
    height: 50vh;
}
.wallpaper .col-md-3 {
	display: flex;
    align-items: center;
    justify-content: center;
}
.close-wallpaper-wrapper {
	position: fixed;
	top:0;
	right:0;
	z-index:1001;
}
.close-wallpaper-wrapper button {
	margin:10px;

	opacity:0;
}
.close-wallpaper-wrapper:hover button {
	opacity:1;
}
@media (max-width:768px) {
	.no-desktop {
		display:unset;
	}
	.header-cta {
		display: none;
	}
	.no-mobile {
		display:none;
	}
	.scroll-top {
		right:15px;
		bottom:15px;
	}
}
@media (min-width:1064px) {
	.conversion__wrapper {
		flex-direction: row;
		justify-content: space-between;
		padding: 10px 12px 0 34px
	}
}
.conversion__img:last-child {
	width: 199px;
	height: 170px
}

.header-cta{
  white-space: nowrap;
}
@media (max-width: 768px) {
  .no-desktop {
    display: unset;
  }
  .header-cta {
    display: none;
  }
  .no-mobile {
    display: none;
  }
  .scroll-top {
    right: 15px;
    bottom: 15px;
  }
}
@media (min-width: 1064px) {
  .conversion__wrapper {
    flex-direction: row;
    justify-content: space-between;
    padding: 10px 12px 0 34px;
  }
}
.conversion__img:last-child {
  width: 199px;
  height: 170px;
}

@media (min-width: 1410px) {
  .conversion__img:last-child {
    width: 221px;
    height: 188px;
    align-self: flex-end;
  }
}

.gallery-banner {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #e6eeff;
  padding: 12px 16px;
  font-size: 16px;
}

@media (max-width: 1000px) {
  .gallery-banner {
    display: flex;
    flex-direction: column;
  }
}

.gallery-banner-main {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  grid-column: 2 / span 1;
}

@media (max-width: 1000px) {
  .gallery-banner-main {
    flex-direction: column;
  }
}

.gallery-banner-text,
.gallery-banner-text span {
  font-size: 16px;
  line-height: 150%;
  font-family: "CentraNo1-Extrabold";
  margin: 0;
  text-align: center;
}

.gallery-banner-code {
  display: flex;
  gap: 8px;
  padding: 4px;
  background: #ceddfe;
  border-radius: 5px;
  transition: 0.3s;
}

.gallery-banner-code p {
  margin: 0;
  transition: inherit;
}

.gallery-banner-code button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background: unset;
  border: none;
  padding: 0;
  transition: inherit;
}

.gallery-banner-code.copied p {
  color: #0953fb;
  transform: scale(0.9);
}

.gallery-banner-code.copied button {
  transform: scale(1.3);
}

.use-code {
  grid-column: 3 / span 1;
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #0953fb;
  padding: 4px 8px;
  white-space: nowrap;
}

.use-code img {
  width: 16px;
}

@media (max-width: 1000px) {
  .use-code {
    margin-top: 8px;
  }
}