/*
    @media (orientation: landscape) {
        .slidingImageGallerycontainer {
            height:17.5vw;
        }
    }
    
    @media (orientation: portrait) {
        .slidingImageGallerycontainer {
            height:25vh;
        }
    }
*/

#imageCounter{
    display:flex;
    justify-content:center;
    width:100vw;
    background-color:transparent;
    padding:calc(var(--textBaseSize) * (50/100));
    font-size: calc(var(--textBaseSize) * (50/100));
    margin:0;
}

.imageBrowser_Outer
{
    display:flex;
    justify-content:center;
    width:100vw;
    height:100%;
    background-color:transparent;
    padding:0;
    margin:0;
}

.imageBrowser_side
{
    width:100%;
    height:100%;
    overflow:hidden;
    opacity: 0.3;
}
.imageBrowser_center
{
    height:100%;
}

.imageBrowser_slider img{
    height:100%;
    position: relative;
    float: left;
    padding:0;
    margin:0;
    overflow:hidden;
}
.imageBrowser_right{
    position: relative;
    float: left;
    padding:0;
    margin:0;
    overflow:hidden;
    height:100%;
}
.imageBrowser_left{
    position: relative;
    float: right;
    padding:0;
    margin:0;
    overflow:hidden;
    height:100%;
}
.imageBrowser_left>img{
    float:right;
}
.imageBrowser_nvgt{
	position:absolute;
	top: 0;
	height: 100%;
	width: 3vw;
	opacity: 0.3;
	padding:0;
	margin:0;
	color:white;
	font-size:3vw;
	display:flex;
	align-items:center;
	justify-content:center;
}
.imageBrowser_nvgt:hover{
	opacity: 0.6;
	cursor: pointer;
}
#imageBrowser_prev{
	background: #000; /*url('https://dl.dropboxusercontent.com/u/65639888/image/prev.png') no-repeat center;*/
	left: 0px;
}
#imageBrowser_next{
	background: #000; /*url('https://dl.dropboxusercontent.com/u/65639888/image/next.png') no-repeat center;*/
	right: 0px;
}



@media screen and (min-width: 1001px) {
     .slidingImageBrowsercontainer{
        position:relative;
        width:100%;
        height:90vh;
        padding:0;
        margin:0;
    }
}


 /* ---- grid ---- */
.ImageGalleryPreviewContainer {
    width: 100%;
    box-sizing: border-box;
}

/* ---- .grid-item ---- */
.ImageGalleryPreview_Cell {
    box-sizing: border-box;
    width: 24%;
    padding:0.1%;
    margin-bottom: 1%;
    margin-right: 0.5%;
    margin-left:0.5%;
    img{
        width:100%;
    }
}



/*phone horazontal*/
@media (orientation: landscape) and (max-width: 1000px) {
    .mobile-topnav {
        display:none;
    }
     .slidingImageBrowsercontainer{
        position:relative;
        width:100%;
        height:90vh;
        padding:0;
        margin:0;
    }
}






:root {
    --mobile-vertical-max-height:   70; /*presentage used by js*/
    --mobile-vertical-height:       0vh;
    --mobile-vertical-width:       100vw;
}


 



/*phone vertical*/
@media (orientation: portrait) and (max-width: 1000px) {
    .ImageGalleryPreview_Cell {
        box-sizing: border-box;
        width: 95%;
        padding:0.1%;
        margin-bottom: 1%;
        margin-right: 2.5%;
        margin-left:2.5%;
        img{
            width:100%;
        }
    }
    .slidingImageBrowsercontainer{
        position:relative;
        width: 100vw;
        height: var(--mobile-vertical-height);
        padding:0;
        margin:0;
    }
    .imageBrowser_Outer
    {
        display:flex;
        justify-content:center;
        width: 100vw;
        height: var(--mobile-vertical-height);
        background-color:black;
        padding:0;
        margin:0;
    }
    .imageBrowser_right{
        display:none;
    }
    .imageBrowser_left{
        display:none;
    }
    
    .imageBrowser_nvgt{
        width:10vw;
    }
    
    .imageBrowser_slider img{
        width: var(--mobile-vertical-width);
        height:auto;
        /*max-height:60vh;*/
        position: relative;
        float: left;
        padding:0;
        margin:0;
        overflow:hidden;
    }
}