
/*!
 * Flipbook_CPS v1.0.3
 * Copyright (c) 2025 James Lamb / Compass Partnership International
 *
 * This software is proprietary and requires a commercial license for any use.
 * Unauthorized use, reproduction, or distribution is strictly prohibited.
 * To obtain a license, please contact: discovery@compasspartnership.com
 *
 * All rights reserved.
 */


 #book {
    position: relative;
    width: 400px;
    perspective: 2750px;
    transition: margin-left 0.5s ease; /* Smooth transition */
}

.cps-thumbnail-bar{
    max-width:400px;
}
.cps-thumbnail-bar-inner{
    transition:0.4s ease-in-out;
    
}

body{
    padding:0;
    margin:0;
}

.highlight-thumbnail{
    
    box-shadow: -1px 1px 4px 0px rgba(0,0,0,0.6);
    -webkit-box-shadow: -1px 1px 4px 0px rgba(0,0,0,0.6);
    -moz-box-shadow: -1px 1px 4px 0px rgba(0,0,0,0.6);

}

.cpsfb-button{
    transition:0.2s;
}

#cover-page{

    background: 
    linear-gradient(to bottom right, rgba(255, 255, 255, 0.015) 50%, rgba(0, 0, 0, 0.04) 50%), /* Diagonal split */
    linear-gradient(to top right, rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.25) 100%),
    url('pages/1.jpg');
    background-size: cover; /* Ensures the gradient covers the rectangle */
    background-position: center; /* Centers the gradient */
    
}

.notflipped{
    border-right:none !important;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}


.inner-page{
    border-right:1px solid #aaa !important;
}

.cps-slider-arrow{
    cursor:pointer;
    transition:0.3s;
}

.iframevideo{
    height:100%;
}

.slider-active-arrow{
   /* filter: invert(58%) sepia(21%) saturate(2140%) hue-rotate(11deg) brightness(103%) contrast(90%);*/
   filter: brightness(0) saturate(100%) invert(62%) sepia(71%) saturate(1048%) hue-rotate(6deg) brightness(93%) contrast(90%);
}

.iframevideo-overlay-inner{
    height:100%;
}

.cps-overlay-abs{
        height:100%; 
        width:100%; 
        position:absolute;
        display:none;
        z-index:500;
        overflow:hidden;
        background:rgba(255,255,255,0.85);
}

.cps-media{
    position:absolute;
    display:none;
}
.turning{
    z-index:2000 !important;
}

.close-button-outer{
    display:flex;
    justify-content: center;
    position:absolute;
    z-index:1000;
    width:100%;

}

.close-button{
    background:#222;
    font-family: Arial, Helvetica, sans-serif;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    color:#eee;
    padding:2px;
    padding-left:8px;
    padding-right:8px;
    font-size:16px;
    cursor:pointer;
    transition: 0.2s;
    right:0px;
    width:unset !important;
    top:0px;

}

.cpsfb-absolute{
    display:flex;
    justify-content: center;
    position: absolute;
    cursor:pointer;
}

.cpsfb-photo{
    border:1px solid #999;
    border-radius:2px;
    padding:4px;
    background:rgba(255,255,255,1);
    transition:0.2s;
    box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.4);
}

.cpsfb-button-shortcut{
   
    transition:0.2s ease-in-out;
    border:0px;
}

.cpsfb-button-shortcut-section1{
    background:rgba(0,38,62,0) !important;
}

.cpsfb-button-shortcut-section1:hover{
    background:rgba(0,38,62,0.25) !important;
}

.highlighted-button-section1{
    background:rgba(0,38,62,0.25) !important;
}

.cpsfb-button-shortcut-section2{
    background:rgba(26,136,146,0) !important;
}

.cpsfb-button-shortcut-section2:hover{
    background:rgba(26,136,146,0.25) !important;
}

.highlighted-button-section1{
    background:rgba(26,136,146,0.25) !important;
}

.cpsfb-photo:hover{
   
    background:rgba(235,235,235,1);
    
}

.close-button:hover{
    background:#555;
}

.cps-zoom-pointer{
    cursor:alias;
}

.cps-zoom-pointer-click{
    cursor:zoom-in;
}

.fliphide{
    display:none;
}

.buttonnext{
    transition:0.2s;
}

.buttonnext:hover{
    background:rgba(220,220,220,1);
}

.page {
    position: absolute;
    width: calc(100% - 1px);
    height: 100%;
    transform-style: preserve-3d;
    transform-origin: left;
    
    transition: transform 0.6s ease;
}

.page-inner {
    overflow:hidden;
    position: relative;
    width: 100%;
    height: 100%;
}

.page .front, .page .back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    background: white;
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding: 0px;
}

.cpsfb-slider-button{
    transition:0.2s;
}

.cpsfb-slider-button:hover{
    transform: scale(1.05);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);

}

.cps-page-overflow{
    background:#fff;
    transition: 0.6s;
}

.overflow-fade-in{
    opacity:1;
}

.cps-overlay-inner{
    display:flex;
   
    justify-content: center;
    align-items: center;

}

.cps-overlay{
    
    background:rgba(0,0,0,0.4);
    height:100vh;
    width:100vw;
    display:none;
    
    position: fixed;
    overflow-y: auto;
    overflow-x: auto;
    z-index:5000;
    

}

.slider-selected{
    background:#d29e0d !important;
}

button {
        background:#00263e;
        color:#eee;
        padding:2px;
        position: absolute;
        justify-content:center;
        display:flex;
        border-radius:5px;
        cursor: pointer;
        transition: 0.2s;
        border:1px solid #777;
}

.cps-img{


    height: auto;
  


}


button:hover {
    background:#1a8892;
}

.page .content {
}

.page .back {
    transform: rotateY(180deg);
   
}

.page.flipped {
    transform: rotateY(-180deg);
    
}

.flipped{
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    transform-origin: left center;
}

.thumb-cotainer{
    margin-right:2px;
    margin-left:2px;
    border:1px solid #ccc;
    display:flex;
    margin:5px;
    cursor:pointer;
    transition:0.2s;
}

.thumb-cotainer:hover{
    transform:scale(1.04);
   
}

.original{
    display:none;
}

.book-container{
    display:flex;
    height:calc(100% - 20px);
    padding:10px;
    justify-content: center;
    align-items: center;
    overflow:hidden !important;
}

#book .page-inner video{
    position:absolute;
}

#book .page-inner .iframevideo{
    position:absolute;
}

#book .page-inner audio{
    position:absolute;
}

.hidden-media{
    opacity: 0; 
    height:100%;
    transition: opacity 1.8s;
}

.page.curl-corner {
        transform: rotateY(-15deg); /* Apply rotation effect */
        cursor:pointer;
}

.page.rev-curl-corner {
        transform:   scale3d(0.90,1,1) rotateY(-165deg); /* Apply rotation effect */
       ;
        transform-origin: left center;
        cursor:pointer;

}

.book-container{
    flex-direction:column;
    overflow: visible;
}


.cps-page-overflow-options-icon{
    cursor:pointer;
    color:#fff;
    font-weight:bold;
    font-size:3.2em;
    padding:10px;
    padding-left:15px;
    margin-left:15px;
    padding-right:15px;
    margin-right:15px;
}

.buttonnext {
   
    z-index:3500;
    position:absolute;
    width:50px;
    height:50px;
    border:1px solid #bbb !important;
    display:flex;
    background: #eee;
    justify-content: center;
    align-items: center;
    border-radius:3px;
    cursor:pointer;
    font-size:20px; 
    font-weight:bold !important;
    border:0px;
    
}

#prev{
    left:-55px;

}
#next{
    right:-55px;
}

.page img{
    width:100%;
}

.book-container{
    position:relative;
}

.book-viewport{
    position:relative;
}

.cps-page-overflow-options{
    position:fixed;
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    min-height:50px;
    max-height:120px;
    bottom:0;
    background:rgba(0,0,0,0.75);
    z-index:6500;
}

.cps-page-overflow-options-pad{
   
    width:100%;
    min-height:50px;
    max-height:120px;
   
}


    .cps-overlay{

        width:100% !important;

    }

    .cps-overlay-inner{
        width:100% !important;
    }

    .cps-page-overflow{
        width:100% !important;
        
    }

    .cps-page-overflow img{
        width:100% !important;
        
    }


@media (max-width: 1200px) {

            
        #prev{
            left:4px;

        }
        #next{
            right:4px;
        }

        .buttonnext{
            width:35px;
            border-radius:50%;
            height:35px;
            border:0px !important;
            background:rgba(150,150,150,0.32);
        }

        .book-container{
         
        }


}
