@import "font-awesome.min.css";

html,body{
   height:100%;
   overflow: hidden;

}
body{

    background-color: #C0C0C0;
    background-image:none;
    margin:0px;
    padding:0;
    font-family: "Titillium Web",sans-serif;
}

.simplemodal-overlay{background-color: gray}
#simplemodal-container a.modalCloseImg {
    background:url(../images/x.png) no-repeat; /* adjust url as required */
    width:25px;
    height:29px;
    display:inline;
    z-index:3200;
    position:absolute;
    top:-15px;
    right:-18px;
    cursor:pointer;
}

.simplemodal-container {
    /*  background-color: #FFFFFF;*/
}


.visible-xs{display: none}
@media (max-width: 767px) {
    .hidden-xs {
        display: none !important;
    }
    .visible-xs{
        display: block;
    }
}

visible-sm{display: none}
@media (max-width: 992px) {
    .hidden-sm {
        display: none !important;
    }
    .visible-sm{
        display: block;
    }
}

/*.modaldlg{
    display:none;
    border:2px solid gray;
    padding:6px;
    background-color:white;
}
*/
#extradlg_video{background-color:black}
#extradlg_audio{background-color:black}
.viewerapp {position:relative}
.viewerapp *{box-sizing:border-box}
.viewerapp .bottompagesbar{
    position:absolute;
    bottom:40px;
    padding:5px;
    width:100%;
    left:0px;
    background-image:url(../images/emagazine/bg_bottompagesbar.png);
    z-index:999;

}

#maxdeviceserror{
    text-align:center;
    font-weight: bold;
    color:white;
    font-size:24px;
    margin:20px auto;
    border:1px solid gray;
    width:80%;
    background-color: lightgrey;
    color:black;
    padding:20px;
    margin-top:100px;
    border-radius: 10px;
    color:red;
}

.viewerapp .shadow{display:none}
.viewerapp .overlayicon{
    width:6%;position:absolute;display:block;padding:2px;
    z-index:auto;
    transform-style: preserve-3d;
}
.viewerapp .overlayicon img{width:100%}
.viewerapp .overlayicon:hover{background-color:#DBD7D9}
.viewerapp .overlaypopup{text-align:left}

.viewerapp .topbar{
    position:absolute;
    z-index:9999;
    border-bottom:1px solid white;
    top:0px;
    left:0px;
    width:100%;
    height:30px;
    padding:4px;
    background-color:#313131;

}

.viewerapp .toolbarButton{
    margin-right:10px;
    display:inline-block;
    padding:1px 2px;
    color:white;
    padding:2px;
    line-height: 20px;
    font-size:18px;

}

.viewerapp .zoom-line{
    display:inline-block;
    border-top:5px solid white;
    height:5px;
    width: 5px;

}



.viewerapp .toolbarButton.active {
    /* background-color: gray;*/
    color:#ed1d24;
}

.viewerapp .toolbarButton img {
    height: 20px;
}


.viewerapp .toolbarButton:hover{
    background-color: #545454;
}
.theme_green .toolbarButton:hover{
    background-color: #003958;
}
.theme_blue .toolbarButton:hover{
    background-color: #003958;
}

.viewerapp .zoomto-icon{
    display: inline-block;
    width:20px;
    height: 20px;
    font-size:10px;
    border-radius: 10px;
    text-align: center;
    line-height: 20px;
    background-color: white;
    color:black;
    text-decoration: none;
    margin-right: 0px;

}
.viewerapp .zoomto-icon.active{
    background-color:#ed1d24;
    color:white;
}

#flipbook .page-wrapper{
    -webkit-perspective:2000px;
    -moz-perspective: 2000px;
    -ms-perspective: 2000px;
    perspective: 2000px;
}

#flipbook .page{
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.2);
    -ms-box-shadow:0 0 20px rgba(0,0,0,0.2);
    -o-box-shadow:0 0 20px rgba(0,0,0,0.2);
    box-shadow:0 0 20px rgba(0,0,0,0.2);

    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;

}

#flipbook .even .gradient{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;

    background:-webkit-gradient(linear, left top, right top, color-stop(0.95, rgba(0,0,0,0)), color-stop(1, rgba(0,0,0,0.2)));
    background-image:-webkit-linear-gradient(left, rgba(0,0,0,0) 95%, rgba(0,0,0,0.2) 100%);
    background-image:-moz-linear-gradient(left, rgba(0,0,0,0) 95%, rgba(0,0,0,0.2) 100%);
    background-image:-ms-linear-gradient(left, rgba(0,0,0,0) 95%, rgba(0,0,0,0.2) 100%);
    background-image:-o-linear-gradient(left, rgba(0,0,0,0) 95%, rgba(0,0,0,0.2) 100%);
    background-image:linear-gradient(left, rgba(0,0,0,0) 95%, rgba(0,0,0,0.2) 100%);
}

#flipbook .odd .gradient{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;

    background:-webkit-gradient(linear, right top, left top, color-stop(0.95, rgba(0,0,0,0)), color-stop(1, rgba(0,0,0,0.15)));
    background-image:-webkit-linear-gradient(right, rgba(0,0,0,0) 95%, rgba(0,0,0,0.15) 100%);
    background-image:-moz-linear-gradient(right, rgba(0,0,0,0) 95%, rgba(0,0,0,0.15) 100%);
    background-image:-ms-linear-gradient(right, rgba(0,0,0,0) 95%, rgba(0,0,0,0.15) 100%);
    background-image:-o-linear-gradient(right, rgba(0,0,0,0) 95%, rgba(0,0,0,0.15) 100%);
    background-image:linear-gradient(right, rgba(0,0,0,0) 95%, rgba(0,0,0,0.15) 100%);
}

#zoom-viewport .zoom-in .even .gradient,
#zoom-viewport .zoom-in .odd .gradient{

   /* display:none;*/

}

#flipbook .next-button{
    border-radius: 0 15px 15px 0;
    right: -22px;
}

#flipbook .prev-button{
    border-radius: 15px 0 0 15px;
    left: -22px;
}

#flipbook .next-button,#flipbook .prev-button{
    height: 100px;
    position: absolute;
    top: 0;
    width: 22px;
    background-color: rgba(255,255,255,0.1);
}

#flipbook .next-button:hover,#flipbook .prev-button:hover{
    background-color: rgba(255,255,255,0.2);
}



#flipbook .next-button:hover{
    background-image: url("../images/emagazine/prevnextarrows.png");
    background-position: -38px 47%;
    background-repeat: no-repeat;
}

#flipbook .prev-button:hover{
    background-image: url("../images/emagazine/prevnextarrows.png");
    background-position: -4px 47%;
    background-repeat: no-repeat;
}

.viewerapp .zoom-icon{
    /*position:absolute;
    z-index:1000;
    top:20px;
    right:10px;

    */
    width:22px;
    height:22px;
    background-image:url(../images/emagazine/zoom-icons.png);
    background-size:88px 22px;
}

.viewerapp .zoom-icon-in{
    background-position:0 0;
    cursor: pointer;
}

.viewerapp .zoom-icon-in.zoom-icon-in-hover{
    background-position:-22px 0;
    cursor: pointer;
}

.viewerapp .zoom-icon-out{
    background-position:-44px 0;
}

.viewerapp .zoom-icon-out.zoom-icon-out-hover{
    background-position:-66px 0;
    cursor: pointer;
}

.viewerapp .bottom-banner{
    position:absolute;
    bottom:0px;
    left:0px;
    width:100%;
    text-align:center;
    height:100px;
/*    border:1px solid white;*/

}

.viewerapp .page > img{
    height:100%;
    max-width:100%;
}

#copertine {
    overflow: hidden;

    height:100%;
    perspective:1000px;
    -webkit-perspective:1000px;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;



}

#copertine img{
    /*height:150px;*/
    box-shadow: 2px 2px 2px #888888;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;


    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
    -moz-backface-visibility:hidden;
    -ms-backface-visibility:hidden;

}

#copertine > div{
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;

    position:relative;
    perspective:1000px;
    -webkit-perspective:1000px;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
}

.copertine_slider_item{
    /*padding:4px;*/
    margin:5px;

}
.copertine_slider_item a{display:block;border:4px solid #333;outline:0;}

.copertine_slider_item img{
    display:block;float:left;
    height:110px;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
/*.slick-center .copertine_slider_item img{height:140px;position:relative;top:-15px}*/
.copertine_slider_item.viewer-current a{border:4px solid yellow;}



.miniature_item{display:block;margin-bottom:10px;text-align:center;line-height: 0;}
.miniature_item a{text-decoration:none}
.miniature_item img{width:80px}
.miniature_item.active img{border:2px solid gray}

.animate-show {
    /* line-height: 20px;
     opacity: 1;
     padding: 10px;
     border: 1px solid black;
     background: white;
     */
    left: 0
}

.animate-show.ng-hide-add, .animate-show.ng-hide-remove {
    transition: all linear 0.5s;
}

.animate-show.ng-hide {
    line-height: 0;
    opacity: 0;
    padding: 0 10px;
    left: -100%
}

.fullscreen_infotext{
    color:black;
    box-sizing: border-box;
    background-color:white;
    font-size:15pt;
    height:100%;
    overflow: auto;
    padding:1em;
    line-height: 120%;
    white-space: pre-wrap;

}

.viewerapp .bottomBar{
    background-color: rgba(0,0,0,0.2);
    border-top:1px solid #7b7b7b;
    padding:4px;
    color:white;
}
#bottomBarWrapper{
    max-width: 800px;
    margin:0px auto;
    display: flex;
    flex-direction: row;
}

/* background pagina mentre viene girata */
.page.p-temporal{
    background-color: white;
}