/*
 Theme Name:  Duluth Houses
 Description:  Child Theme for Duluth Houses
 Author:       Nalu Web Design
 Author URI:   https://nalu.ca
 Template:     Divi
 Version:      1.0.0
*/

/*****Add any custom CSS below this line*****/

/* Nalu_Gallery style */ 
/* NG_ denotes the popup / full screen gallery */
/* NGF_ denotes the mini-gallery / collage on the listings page */
    #ng_container {
        vertical-align: top;
        position: fixed;
        top: 50px;
        left: 50px;
        right: 50px;
        bottom: 50px;
        display: none;
        background-color: #FFFFFF;
        border-radius: 16px;
        z-index: 10001;
    }
    #ng_background
    {
        display: none;
        
        position: fixed;
        top: 0px;
        left: 0px;
        right: 0px;
        bottom: 0px;
        background-color: rgba(0,0,0,0.8);
        z-index: 10000;
    }
    #ng_top {
           position: relative;
        display: block;
        width: 100%;
        height: 40px;
        text-align: right;
        font-size: 30px;
        padding: 5px;
        padding-right: 20px;
    }
    #ng_left
    {
        position: relative;
        display: inline-block;
        width: 30%;
        overflow-y: auto;
        height: calc( 100% - 50px );
        background-color: #F0F0F0;
        padding: 10px;
    }
    #ng_right
    {
        position: relative;
        background-color: #FFFFFF;
        display: inline-block;
        width: 68%;      
        height: calc( 100% - 50px );
        overflow-y: auto;
        padding: 10px;
    }
    .ng_thumb
    {
        display: inline-block;
        width: calc( 50% - 10px );
        margin: 5px;
    }
    .ng_main
    {
        display: block;
        width: calc( 100% - 10px );
        margin: 5px;        
    }
    
    #ngf_container {
        display: block;
        position: relative;
        width: 100%;
        height: 40vh;
        cursor: pointer;
    }
    .ngf_table, .ngf_table tr, .ngf_table td, .ngf_table div {
        padding: 0px !important;
        margin: 0px;
        border-top: 0px !important;
    }
    .ngf_image {
        position: relative;
        display: block;
        
        background-size: cover;
        background-position: center center;
        background-repeat: none;
        width: 100%;
        height: 100%;
    } 
    
    @media only screen and (max-width: 1024px) {
        #ng_left { display: none; }
        #ng_right { width: 100%; }
        
        /* flush to borders on mobile */
       #ng_container {
            vertical-align: top;
            position: fixed;
            top: 0px;
            left: 0px;
            right: 0px;
            bottom: 0px;
            display: none;
            background-color: #FFFFFF;
            border-radius: 0px;
            z-index: 10001;
            
        }        
         #ng_right
		{
			position: relative;
			background-color: #FFFFFF;
			display: inline-block;
			width: 100%;      
			height: calc( 100% - 50px );
			overflow-y: auto;
			padding: 1px;
		}
        #ngf_container {
            height: 25vh;
            
        }
    }