/* outil drag and drop */

.sortable-parent {
    position:relative;
    border:1px solid #999;
    padding:3px;
    margin:0;
    overflow:hidden;
    overflow-x:scroll;
    box-sizing:content-box;
}

#montage {
    height:300px;
    margin-bottom:1em;
    padding:10px;
    
}
#reservoir {
    height:160px;
}

.sortable-parent ol{
    display:flex;
    height:100%;
    width:10000px;
    padding:2px;

}
.sortable-parent li {
    list-style-type: none;
    height:100%;
    border:1px solid #000;
    border-radius:5px;
    margin-right:3px;
}
.sortable-parent .bloc-info {
    top:20px;
    margin-left:6px;
}

.sortable-parent li.sortable-hover {
    border:2px solid blue;

}
.sortable-parent li.sortable-placeholder {
    border:2px solid #333;
    border-radius:5px;
    background:#666 url(imgs/arrow-down-circle-fill.svg) center center no-repeat;
}

#montage li:nth-child(2n+0) {
    border:2px solid #666;
    border-right:0;
    margin-right:0;
    border-radius: 5px 0 0 5px;
}
#montage li:nth-child(2n+1) {
    border:2px solid #666;
    border-left:0;
    margin-right:10px;
    border-radius: 0 5px 5px 0;
}
#montage li:nth-child(1), #montage li:last-child {
    border:2px solid #666;
    border-radius: 5px;
}

.sortable-parent li.sortable-placeholder img {
    opacity:0;
}
.sortable-parent li.sortable-dragging {
    border:2px solid red;
    border-radius:5px;
}
.sortable-parent img {
    height:100%;
    width:auto:
}
.sortable-placeholder {
    border:3px solid red;
}
.blank-page {

}


#tools {
    padding:10px 20px;
    display:flex;
    justify-content: space-between;
}

#tools select {
    background-color:#eee;
    color:#666;
    padding:6px 8px;
    border-radius: 4px;
    border:0;
}

.blur-it .ico-ready{
    display:none;
}
#controller .ico-wait {
    display:none;
}
#controller.blur-it .ico-wait{
    display:block;
    animation: tourne 4s linear infinite;
transform-origin: center 53px;
}
@keyframes tourne {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}