#vue360
{
    display: none;
    position: absolute;
	overflow: hidden;
    top: 0px;
    left: 0px;
    width: 100%;
    height:100%;
    background: linear-gradient(0deg, #171b13 0%, #07090800 100%), #0c0e0b;
    opacity:0;
    z-index: 998;
	cursor: grab;
}
.fondmarin {
	background: linear-gradient(0deg, rgba(21, 62, 92, 1) 0%, rgba(28, 154, 201, .55) 100%) !important;
}
.fondriver {
	background: linear-gradient(0deg, rgba(35, 45, 30, 1) 0%, rgba(155, 194, 76, .5) 100%) !important;
}
.fond360 {
	background: linear-gradient(0deg, #171b13 0%, #090b08 100%);
}
.threesixty .threesixty_images {
    list-style: none;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
.threesixty .threesixty_images img {
	position: absolute;
    top: 0px;
	left: 0px;
    width: 1024px;
}
.threesixty .threesixty_images img.previous-image {
	opacity:0;
}
.threesixty .threesixty_images img.current-image {
    visibility: visible;
	opacity:1;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
#close360 {
    display: none;
    position: absolute;
	right: 21px;
    top: 21px;
    width: 34px;
    height: 34px;
    z-index: 999;
    opacity: 0;
	padding: 0;
	cursor: pointer;
}
#play360 {
    display: none;
    position: absolute;
	right: 77px;
    top: 21px;
    width: 34px;
    height: 34px;
    z-index: 999;
    opacity: 0;
	padding: 0;
	cursor: pointer;
}
#back360 {
	display: none;
	position: absolute;
    left: 21px;
    top: 21px;
    width: 34px;
    height: 34px;
    z-index: 999;
    opacity: 0;
    padding: 0;
    cursor: pointer;
}
.threesixty .spinner, .spinnerblack {
    position:fixed;
    display: none;
    opacity:0;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: 28px;
    width: 28px;
    animation: rotate 0.8s infinite linear;
    border-radius: 50%;
}
.threesixty .spinner {
	border: 4px solid var(--gold, #e7b14e);
	border-right-color: transparent;
}
.spinnerblack {
	border: 4px solid var(--gold, #e7b14e);
	border-right-color: transparent;
}
@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}
#legende360, #legendeanecdote {
	z-index: 999;
    position: absolute;
    width: 100%;
    bottom: 3rem;
    text-align: center;
}