.bp_container .bp_listContainer{position:absolute;top:0;right:0;bottom:0;left:0;overflow-y:auto;}
.bp_container .bp_placeholders, .bp_container .bp_pages{position:absolute;width:100%;}

.bp_container .placeholder, .bp_container .page{display:inline-block;margin:30px 0 0 15px;text-align:center;line-height:1.1em;vertical-align:top;}
.bp_container .placeholder:last-child, .bp_container .page:last-child{margin-bottom:15px;}
.bp_container .placeholder .picture, .bp_container .page  .picture{position:relative;}
.bp_container .placeholder .picture .overlay, .bp_container .page .picture .overlay{position:absolute;top:0;left:0;bottom:0;right:0;}
.bp_container .placeholder .picture .addImage, .bp_container .page .picture .addImage{position:absolute;top:30%;left:0;right:0;display:none;text-align:center;cursor:pointer;transition:color 0.2s, opacity 0.2s;}
.bp_container .placeholder .picture .addImage i.far, .bp_container .page .picture .addImage i.far{font-size:2em;}
.bp_container .placeholder .name, .bp_container .page .name{display:inline-block;width:100%;height:2.2em;margin-top:5px;box-sizing:border-box;text-align:center;transition:0.2s;}

.bp_container .doublePage .placeholder, .bp_container .doublePage .page{width:calc((100% - (15px * 4)) / 3);}
.bp_container .doublePage .placeholder.singleCover, .bp_container .doublePage .page.singleCover{margin-left:calc((100% - ((100% - (15px * 4)) / 3)) / 2);margin-right:calc((100% - ((100% - (15px * 4)) / 3)) / 2);}
.bp_container .doublePage .placeholder.leftCover, .bp_container .doublePage .page.leftCover{margin-left:calc(15px + ((100% - 15px) / 6));text-align:right;}
.bp_container .doublePage .placeholder.rightCover, .bp_container .doublePage .page.rightCover{margin-right:calc(15px + ((100% - 15px) / 6));text-align:left;}
.bp_container .doublePage .placeholder:not(.leftCover):not(.rightCover):not(.external) .overlay, .bp_container .doublePage .page:not(.leftCover):not(.rightCover):not(.external) .overlay{background:linear-gradient(to right, transparent 0%, transparent calc(50% - 1px), rgba(43,43,43,0.5) 50%, transparent calc(50% + 1px), transparent 100%);}

.bp_container .spiralPage .placeholder, .bp_container .spiralPage .page{width:calc((100% - (15px * 7) + (11px * 3)) / 6);}
.bp_container .spiralPage .placeholder.leftPage, .bp_container .spiralPage .page.leftPage{text-align:right;}
.bp_container .spiralPage .placeholder.rightPage, .bp_container .spiralPage .page.rightPage{margin-left:4px;text-align:left;}
.bp_container .spiralPage .placeholder.leftPage .overlay, .bp_container .spiralPage .page.leftPage .overlay{ right:-7px; left:auto; width:10px;}
.bp_container .spiralPage .placeholder.rightPage .overlay, .bp_container .spiralPage .page.rightPage .overlay{ left:-7px; right:auto; width:10px;}
.bp_container .spiralPage.hasBlockedPages .page.firstPage{margin-left:calc((100% - (15px * 7) + (11px * 3)) / 6 + 15px + 4px);}
.bp_container .spiralPage.hideBlocked .placeholder.blockedPage{visibility:hidden;}
.bp_container .spiralPage.covered .placeholder.leftCover, .bp_container .spiralPage.covered .page.leftCover{margin-left:calc(7.5px + ((100% - 15px) / 3));text-align:right;}
.bp_container .spiralPage.covered .placeholder.rightCover, .bp_container .spiralPage.covered .page.rightCover{margin-right:calc(7.5px + ((100% - 15px) / 3));text-align:left;}

.bp_container .singlePage .placeholder, .bp_container .singlePage .page{width:calc((100% - (15px * 4)) / 6);}
.bp_container .singlePage .placeholder.leftPage, .bp_container .singlePage .page.leftPage{text-align:right;}
.bp_container .singlePage .placeholder.leftPage .picture .overlay, .bp_container .singlePage .page.leftPage .picture .overlay{background:linear-gradient(to left, rgba(43,43,43,0.9) 0%, rgba(43,43,43,0.3) 0.5%, transparent 10%, transparent 100%);}
.bp_container .singlePage .placeholder.rightPage, .bp_container .singlePage .page.rightPage{margin-left:0;text-align:left;}
.bp_container .singlePage .placeholder.rightPage .picture .overlay, .bp_container .singlePage .page.rightPage .picture .overlay{background:linear-gradient(to right, rgba(43,43,43,0.9) 0%, rgba(43,43,43,0.3) 0.5%, transparent 10%, transparent 100%);}
.bp_container .singlePage .placeholder.singleCover, .bp_container .singlePage .page.singleCover{margin-left:calc((100% - ((100% - (15px * 4)) / 6)) / 2);margin-right:calc((100% - ((100% - (15px * 4)) / 6)) / 2);}
.bp_container .singlePage .placeholder.leftCover, .bp_container .singlePage .page.leftCover{margin-left:calc(7.5px + ((100% - 15px) / 3));text-align:right;}
.bp_container .singlePage .placeholder.rightCover, .bp_container .singlePage .page.rightCover{margin-right:calc(7.5px + ((100% - 15px) / 3));text-align:left;}
.bp_container .singlePage.hasBlockedPages .page.firstPage{margin-left:calc((100% - (15px * 4)) / 6 + 15px);}
.bp_container .singlePage.hideBlocked .placeholder.blockedPage{visibility:hidden;}
.bp_container .singlePage.hideBlocked .placeholder.leftPage.lastPage .picture .overlay, .bp_container .singlePage.hideBlocked .page.leftPage.lastPage .picture .overlay{background:linear-gradient(to left, silver 0%, silver 3%, transparent 3%, transparent 100%);margin-right:-2%;}
.bp_container .singlePage.hideBlocked .placeholder.rightPage.firstPage .picture .overlay, .bp_container .singlePage.hideBlocked .page.rightPage.firstPage .picture .overlay{background:linear-gradient(to right, silver 0%, silver 3%, transparent 3%, transparent 100%);margin-left:-2%;}

.bp_container .placeholder .picture{display:inline-block;background:#f6f6f6;box-shadow:1px 1px 3px rgba(43,43,43,0.7);}
.bp_container .placeholder:not(.blockedPage) .picture{opacity:0.4;}
.bp_container .placeholder.external .picture{opacity:0;}

.bp_container .ui-sortable .page:not(.external) .picture{cursor:move;}
.bp_container .ui-sortable .page.ui-sortable-helper .picture{box-shadow:0 0 10px rgba(43,43,43,0.3);}
.bp_container .page .picture{display:inline-block;background:#F1F1F1;background-repeat:no-repeat;background-position:center center;background-size:cover;transition:background 0.2s;}
.bp_container .page .picture .removeButton{display:inline-block;position:absolute;font-size:1.2em;width:1.2em;line-height:1.2em;top:5px;right:5px;cursor:pointer;color:var(--standard-text-color);background-color:#FFF;border-radius:3px;text-align:center;box-shadow:1px 1px 2px var(--standard-text-color);opacity:0.4;transition:0.2s;}
.bp_container .page .picture:hover .removeButton{opacity:1;}
.bp_container .page .picture:hover .removeButton:hover{background-color:var(--primary-color);color:var(--inverted-text-color);}
.bp_container .page.empty .picture .addImage{display:inline-block;}
.bp_container .page.empty.highlight .picture .addImage{color:var(--error-color);}
.bp_container .page .picture .propWarningIcon{display:none;position:absolute;font-size:1em;padding:5px;top:-5px;left:-5px;cursor:help;color:#FFF;background-color:var(--error-color);border-radius:50%;box-shadow:1px 1px 2px rgba(43,43,43,0.6)}
.bp_container .page.propWarning .picture .propWarningIcon{display:inline-block;}
.bp_container .page.propWarning .picture{border:1px solid var(--error-color);margin:-1px;border-radius:3px;}
.bp_container .page.propWarning .picture:not(.ui-sortable-helper):hover .removeButton{color:var(--error-color);opacity:1;}
.bp_container .page.propWarning .picture:not(.ui-sortable-helper):hover .removeButton:hover{background-color:var(--error-color);color:#FFF;}
.bp_container .page .name{opacity:0;}

.bp_container .page.external{cursor:pointer;}
.bp_container .page.external .picture{background-color:transparent;}
.bp_container .page.external .picture .addImage{display:inline-block;left:calc(100% - 32px);top:20%;right:inherit;text-align:left;white-space:nowrap;opacity:0.5;cursor:pointer;}
.bp_container .page.external .picture.notWedding .addImage{left:calc(100% + 5px);}
.bp_container .page.external:hover .picture .addImage{opacity:1;}
.bp_container .page.external .picture .addImage i.far{float:left;margin-right:10px;}
.bp_container .page.external.empty .picture{border-color:var(--error-color);border-style:solid;border-width:0 0 3px;margin:0 0 -3px;}
.bp_container .page.external.empty .picture .addImage{color:var(--error-color);opacity:1;}

.bp_container .littleWidth.doublePage .placeholder, .bp_container .littleWidth.doublePage .page{width:calc((100% - (15px * 3)) / 2);}
.bp_container .littleWidth.doublePage .placeholder.singleCover, .bp_container .littleWidth.doublePage .page.singleCover{margin-left:calc((100% - ((100% - (15px * 3)) / 2)) / 2);margin-right:calc((100% - ((100% - (15px * 3)) / 2)) / 2);}
.bp_container .littleWidth.doublePage .placeholder.leftCover, .bp_container .littleWidth.doublePage .page.leftCover{margin-left:15px;}
.bp_container .littleWidth.doublePage .placeholder.rightCover, .bp_container .littleWidth.doublePage .page.rightCover{margin-right:15px;}
.bp_container .littleWidth.spiralPage .placeholder, .bp_container .littleWidth.spiralPage .page{width:calc((100% - (15px * 5) + (11px * 2)) / 4);}
.bp_container .littleWidth.spiralPage.hasBlockedPages .page.firstPage{margin-left:calc((100% - (15px * 5) + (11px * 2)) / 4 + 15px + 4px);}
.bp_container .littleWidth.spiralPage.covered .placeholder.leftCover, .bp_container .littleWidth.spiralPage.covered .page.leftCover{margin-left:calc((100% - ((100% - (15px * 3)) / 4)) / 3);}
.bp_container .littleWidth.spiralPage.covered .placeholder.rightCover, .bp_container .littleWidth.spiralPage.covered .page.rightCover{margin-right:calc((100% - ((100% - (15px * 3)) / 4)) / 3);}
.bp_container .littleWidth.singlePage .placeholder, .bp_container .littleWidth.singlePage .page{width:calc((100% - (15px * 3)) / 4);}
.bp_container .littleWidth.singlePage .placeholder.singleCover, .bp_container .littleWidth.singlePage .page.singleCover{margin-left:calc((100% - ((100% - (15px * 3)) / 4)) / 2);margin-right:calc((100% - ((100% - (15px * 3)) / 4)) / 2);}
.bp_container .littleWidth.singlePage .placeholder.leftCover, .bp_container .littleWidth.singlePage .page.leftCover{margin-left:calc((100% - ((100% - (15px * 3)) / 4)) / 3);}
.bp_container .littleWidth.singlePage .placeholder.rightCover, .bp_container .littleWidth.singlePage .page.rightCover{margin-right:calc((100% - ((100% - (15px * 3)) / 4)) / 3);}
.bp_container .littleWidth.singlePage.hasBlockedPages .page.firstPage{margin-left:calc((100% - (15px * 3)) / 4 + 15px);}

.bp_container .doubleLittle.spiralPage .placeholder, .bp_container .doubleLittle.spiralPage .page{width:calc((100% - (15px * 3) + 11px) / 2);}
.bp_container .doubleLittle.spiralPage.hasBlockedPages .page.firstPage{margin-left:calc((100% - (15px * 3) + 11px) / 2 + 15px + 4px);}
.bp_container .doubleLittle.spiralPage.covered .placeholder.leftCover, .bp_container .doubleLittle.spiralPage.covered .page.leftCover{margin-left:7.5px;}
.bp_container .doubleLittle.spiralPage.covered .placeholder.rightCover, .bp_container .doubleLittle.spiralPage.covered .page.rightCover{margin-right:7.5px;}
.bp_container .doubleLittle.singlePage .placeholder, .bp_container .doubleLittle.singlePage .page{width:calc((100% - (15px * 2)) / 2);}
.bp_container .doubleLittle.singlePage .placeholder.singleCover, .bp_container .doubleLittle.singlePage .page.singleCover{margin-left:calc((100% - ((100% - (15px * 2)) / 2)) / 2);margin-right:calc((100% - ((100% - (15px * 2)) / 2)) / 2);}
.bp_container .doubleLittle.singlePage .placeholder.leftCover, .bp_container .doubleLittle.singlePage .page.leftCover{margin-left:7.5px;}
.bp_container .doubleLittle.singlePage .placeholder.rightCover, .bp_container .doubleLittle.singlePage .page.rightCover{margin-right:7.5px;}
.bp_container .doubleLittle.singlePage.hasBlockedPages .page.firstPage{margin-left:calc((100% - (15px * 2)) / 2 + 15px);}

.bp_container .bp_listContainer.externalPage > div{display:flex;flex-flow:row wrap;height:100%;justify-content:space-evenly;align-items:start;align-content:center;}
.bp_container .bp_listContainer.externalPage .placeholder, .bp_container .bp_listContainer.externalPage .page{min-width:250px;}
.bp_container .bp_listContainer.externalPage .doublePage .placeholder, .bp_container .bp_listContainer.externalPage .doublePage .page{width:calc((100% - (15px * 3)) / 2);}
.bp_container .bp_listContainer.externalPage .doublePage .placeholder.singleCover, .bp_container .bp_listContainer.externalPage .doublePage .page.singleCover{margin-left:0;margin-right:0;}
.bp_container .bp_listContainer.externalPage .page.external:not(.empty) .picture .addImage{display:none;}
.bp_container .bp_listContainer.externalPage .page .picture{transition:transform 0.25s;}
.bp_container .bp_listContainer.externalPage .page.external:not(.empty):hover .picture{transform:scale(1.1);}
.bp_container .bp_listContainer.externalPage .panelFloatingPlaceholder{flex:0 0 100%}