/*.animatedParent {
    overflow:hidden
}*/
.grid-sizer,
.album-item {
    width: calc(100%/5);
    aspect-ratio: 16/9;
}
.album-item{float:left;padding:0px;}
.grid-item--width2 {
    width: calc(100%/5);
    aspect-ratio: 9.79/11;
}

#album_container{margin-bottom:10px;    z-index: 5;}
.text-note{margin-bottom:30px;}
#album_container .album-item{position:relative;text-align:center;}
#album_container .album-item .bg{background:#ccc;background-size:cover;position:absolute;background-position:center center;left:0px;top:0px;right:0px;bottom:0px;background-repeat:no-repeat;}
#album_container .album-item .item-hover{background:rgba(0,0,0,0.5) url('../images/icon-zoom.png') no-repeat center center;position:absolute;width:100%;height:100%;top:0px;left:0px;border:solid 0px #ebebeb;opacity:0;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;-o-transition:all .4s ease;transition:all .4s ease;}
#album_container .album-item:hover .item-hover{opacity:1;}
/*#album_container .album-item .item-hover .title{display:none;}*/
.div-hidden {
    background: #000;
    position: absolute;
    left: 15px;
    bottom: 0;
}
#templates {
    display: none;
}
.lg-preview-descr{padding-top:30px}
#album_container .album-item:hover .title {
    position: relative;
    width: 100%;
    display: block;
    /* min-height: 61px; */
    bottom: 0;
    left: 0px;
    padding: 0;
    text-align: left;
    /*font-family: 'SF-Bold';*/
    font-size: 19px;
    text-transform: uppercase;
    color: #fff;
    z-index: 2;
    font-weight: 700;
}
#album_container .album-item.grid-item--width2:hover .title {
    font-size: 24px;
}

#album_container .album-item:hover p{
     position: absolute;
     width: 100%;
     min-height: 61px;
     bottom: 0;
     left: 0px;
     padding: 15px;
     text-align: left;
     /*font-family: 'SF-Regular';*/
     font-size: 16px;
     color: #fff;
     z-index: 2;
}

/*
#album_container .album-item .item-hover {
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    top: 2px;
    left: 2px;
}

#album_container .album-item .bg {
    inset: 2px;
}
    */

@media screen and (min-width:992px){
    #album_container .album-item .item-hover{background:rgba(0,0,0,0.5) url('../images/icon-zoom.png') no-repeat center center;position:absolute;width: calc(100% - 6px);height: calc(100% - 6px);top: 3px;left: 3px;border:solid 0px #ebebeb;opacity:0;-webkit-transition:all .4s ease;-moz-transition:all .4s ease;-o-transition:all .4s ease;transition:all .4s ease;}
    #album_container .album-item .bg{left:3px;top:3px;right:3px;bottom:3px;}

}
@media screen and (min-width:992px) and (max-width:1199px){
   
    .page-banner .banner-title{font-size:32px;}
    .page-banner .banner-description{font-size:16px;}
}
@media screen and (max-width:991px){
    .grid-sizer, .album-item{width:calc(100%/2)}

}
@media screen and (max-width:767px){
   

    .btn-360{right:15px;bottom:auto;top:170px;}
    .btn-360 img{max-width:80px;}
    .btn-video{right:15px;top:250px;}
    .btn-video img{max-width:80px;}
    .img-mat-bang-tang{margin:0px auto 15px;}
    .page-category li a{font-size:25px;padding:10px 10px 8px;}
}
@media screen and (max-width:640px){
    #album_container .album-item:hover .title,#album_container .album-item.grid-item--width2:hover .title{font-size:12px}
 
    .page-banner .banner-title{font-size:28px;}
    .page-banner .banner-description{font-size:16px;}
    .page-category-2 li{padding:15px 5px;}
    .page-category-2 li a{font-size:20px;max-width:130px;padding-bottom:0px;}
    .page-category-2 li:after{background-size:30px;height:70px;width:20px;background-size:100%;top:0px;right:-10px;}
    .page-category-2 li.active{background:transparent;}
    .page-category-2 li.active a{background:transparent;}
    .btn-360{right:40px;bottom:auto;top:70px;}
    .btn-360 img{max-width:80px;}
    .btn-video{right:40px;top:145px;}
    .form-rate-filter,
    #rateContent .total,
    #rateContent table th{font-size:17px;}
    #rateContent table tr td{font-size:14px;}
    .form-rate-filter .textbox.datepicker{max-width:100px;}
}