@font-face {
    font-family: 'crimsontext-roman';
    src: url('../Fonts/Fonts/Crimson Text/CrimsonText-Roman.ttf') format('truetype');
}
@font-face {
    font-family: 'apollon-regular';
    src: url('../Fonts/Fonts/Apollon/Apollon-Regular.otf') format('opentype');
}
@font-face {
    font-family: 'graphik-regular';
    src: url('../Fonts/Fonts/Graphik/Graphik-Regular.otf') format('opentype');
}
.blockHidden {
    display: none;
}
.mapTitre {
    max-width: 926px;
    margin: 60px auto 50px;
    padding-top: 40px;
}
@media (max-width:700px) {
    .mapTitre {
        margin: 30px auto 30px;
        padding-top: 20px;
    }
}
.mapContent {
    background-color: #f1efea;
    position: relative;
}
.mapSeaDragon {
    height:100%;
}
.mapTitre,
.mapContent {
    width: 100%;
}
    .mapTitre .title,
    .mapSeaDragon {
        padding: 0 20px;
    }
.overlayPin {
    text-align: center;
}
.pin {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    background-image: url('../images/pin1.svg');
}
.overlayPinShort {
    background-image: url('../images/pin.svg');
    background-size: 16px;
    background-position:center;
    background-repeat: no-repeat;
    z-index:1;
}
.overlayTitre {
    text-transform: uppercase;
    background-color: #fff;
    border: 1px solid #fff;
    text-align: center;
    white-space:nowrap;
    padding:0 5px;
    z-index: 2;
    font-size: 13px;
    font-family: crimsontext-roman;
    color: #000;
}
.overlayTitre:hover {
    border:1px solid #000;
    cursor:pointer;
}
.mapDetails {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: #9999997a;
    z-index: 3;
}
.detailsPoint {
    background: #fff;
    border: 1px solid #000;
    z-index: 3;
    position: absolute;
    width: calc(100% - 80px);
    max-width: 926px;
    height: calc(100% - 60px);
    top: 30px;
    left: 50%;
    transform: translate(-50%, 0);
    overflow: hidden;
    padding: 0 10px 0 30px;
}
.detailsPoint_images::-webkit-scrollbar {
    background-color: #fff;
    width: 4px;
    height: 4px;
}
.detailsPoint_images::-webkit-scrollbar-thumb {
    background: rgb(108 110 113 / 70%);
    width: 4px;
    height: 4px;
    border-radius: 7px;
}
.detailsPoint_images {
    scrollbar-color: #fff rgb(108 110 113 / 70%);
    scrollbar-width: thin;
}
.detailsPoint_btClose {
    width: 100%;
    padding-top: 10px;
    float: left;
    overflow: hidden;
}
    .detailsPoint_btClose a {
        width: 30px;
        height: 30px;
        float: right;
        background-image: url(../images/bt_close.svg);
        background-size: 30px;
    }
.detailsPoint_conteneur {
    float: left;
}
.detailsPoint_content {
    float: left;
}
.detailsPoint_text {
    padding-bottom: 40px;
    font-size: 14px;
    font-family: graphik-regular;
    color: #000;
}
.detailsPoint_titre {
    padding-bottom: 30px;
    width: 100%;
    float: left;
    font-family: apollon-regular;
    font-size: 18px;
    color: #000;
}
.detailsPoint_images {
    overflow: hidden;
    overflow-y: auto;
    height: 100%;
}
.detailsPoint_image {
    padding-bottom: 20px;
}
.detailsPoint_img {
    width: 60%;
    padding-bottom:5px;
}
.detailsPoint_copyright {
    font-size: 14px;
    font-family: crimsontext-roman;
    color: #000;
}
.seadragonZoomInButton,
.seadragonZoomOutButton,
.seadragonZoomInButton img,
.seadragonZoomOutButton img {
    width: 48px;
    height: 48px;
    max-width: 48px;
}
.seadragonZoomInButton {
    bottom: 64px !important;
}
/*img HD*/
.mapImg{
    position:fixed;
    width:100%;
    height:100%;
    left:0;
    top:0;
    background:rgb(0 0 0 / 70%);
    z-index:200;
}
.mapImg_btClose {
    width: 100%;
    position: absolute;
    z-index: 10;
}
    .mapImg_btClose a {
        width: 30px;
        height: 30px;
        float: right;
        background-image: url(../images/bt_close.svg);
        background-size: 30px;
        margin-right:20px;
        margin-top:10px;
    }
.mapImgSeaDragon {
    width: calc(100% - 20px);
    float: left;
    margin-left: 10px;
    height: calc(100vh - 20px);
    margin-top: 10px;
}
.mapImgZoomInBt,
.mapImgZoomOutBt,
.mapImgZoomInBt img,
.mapImgZoomOutBt img {
    width: 48px;
    height: 48px;
    max-width: 48px;
}
.mapImgZoomInBt {
    bottom: 64px !important;
}
@media (max-width:500px) {
    .detailsPoint_conteneur {
        overflow: hidden;
        overflow-y: auto;
        padding-right: 20px;
        height: calc(100% - 80px);
    }
        .detailsPoint_conteneur::-webkit-scrollbar {
            background-color: #fff;
            width: 4px;
            height: 4px;
        }
        .detailsPoint_conteneur::-webkit-scrollbar-thumb {
            background: rgb(108 110 113 / 70%);
            width: 4px;
            height: 4px;
            border-radius: 7px;
        }
    .detailsPoint_conteneur {
        scrollbar-color: #fff rgb(108 110 113 / 70%);
        scrollbar-width: thin;
    }
    .detailsPoint {
        padding: 0 10px 0 30px;
    }
    .detailsPoint_btClose {
        padding-bottom: 20px;
    }
    .detailsPoint_images {
        overflow: visible;
        overflow-y: visible;
    }
    .detailsPoint_img {
        width: 100%;
    }
    .detailsPoint_btClose a{
        background-image: url(../images/bt_close1.svg);
    }

    .seadragonZoomInButton,
    .seadragonZoomOutButton,
    .seadragonZoomInButton img,
    .seadragonZoomOutButton img {
        width: 40px;
        height: 40px;
        max-width: 40px;
    }
    .seadragonZoomInButton {
        bottom: 60px !important;
    }

    .mapImgZoomInBt,
    .mapImgZoomOutBt,
    .mapImgZoomInBt img,
    .mapImgZoomOutBt img {
        width: 40px;
        height: 40px;
        max-width: 40px;
    }

    .mapImgZoomInBt {
        bottom: 60px !important;
    }
}

