/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 27 Dec, 2020, 1:07:15 PM
    Author     : Jawahar
*/

.sidebar-image-bar-container{
    /*padding-left:20px;
    padding-right:20px;*/
    margin:0px auto;
    text-align: center;

}

.image-item-container{
    /*width: 100%;
    height:auto;*/
    padding:4px;    
    margin:0px auto;
    margin-bottom: 10px;
    width:300px;
    height:400px;
    overflow:hidden;    
    
}

@media (min-width:1024px){
    .image-item-container{        
        padding:4px;    
        margin-bottom: 10px;
        width:125px;
        height:150px;
        overflow:hidden;    
    }    
}

@media (min-width:1280px){
    .image-item-container{        
        padding:4px;    
        margin-bottom: 10px;
        width:170px;
        height:230px;
        overflow:hidden;    
    }    
}

@media (min-width:1366px){
    .image-item-container{        
        padding:4px;    
        margin-bottom: 10px;
        width:175px;
        height:225px;
        overflow:hidden;    
    }    
}

@media (min-width:1466px){
    .image-item-container{        
        padding:4px;    
        margin-bottom: 10px;
        width:175px;
        height:225px;
        overflow:hidden;    
    }    
}

@media (min-width:1566px){
    .image-item-container{        
        padding:4px;    
        margin-bottom: 10px;
        width:200px;
        height:250px;
        overflow:hidden;    
    }    
}

@media (min-width:1666px){
    .image-item-container{        
        padding:4px;    
        margin-bottom: 10px;
        width:225px;
        height:275px;
        overflow:hidden;    
    }    
}

@media (min-width:1766px){
    .image-item-container{        
        padding:4px;    
        margin-bottom: 10px;
        width:250px;
        height:300px;
        overflow:hidden;    
    }    
}

@media (min-width:1920px){
    .image-item-container{        
        padding:4px;    
        margin-bottom: 10px;
        width:300px;
        height:400px;
        overflow:hidden;    
    }    
}

.image-container-div{
    overflow: hidden;    
    width:100%;            
}

.side-bar-image{
    cursor:pointer;
    -webkit-transition: -webkit-transform 0.4s;
    transition: transform 0.4s;
}

.side-bar-image:hover{
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);

    -webkit-transition: transform 1.05s ease-in-out;
    -moz-transition:transform 1.05s ease-in-out;
    -ms-transition:transform 1.05s ease-in-out;
}