@import url("https://fonts.googleapis.com/css?family=Roboto:400,300,200,500,700");
@import url("/includes/script/plugin/bootstrap/css/bootstrap.min.css");
@import url("/includes/css/plugin/magnific-popup.css");
        

.photogallery {
    padding:0px;
    margin:0px;
}
.photogallery .galleryimage {
    width:calc(100%);
}

.photogallery .item {
    position: relative;
    display:inline-block;
    width:calc(16.6667%);
}

.photogallery .item .title {
    position: absolute;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) , rgba(0, 0, 0, 0.5));
    color: white;
    padding: 15px;
    text-align: center;
    width: 100%;
    font-family: 'roboto';
    font-weight: 300;
}

.popup-view {
    position:fixed;
    left:50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background-color: transparent;
    padding: 0px;
    border: 1px solid #555555;
    z-index: 1;
}

.popup-view #sketchfab-container {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    visibility: hidden;
}

.popup-view .loading-view {
    position: fixed;
    z-index: -1;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}

.popup-view #image-container img {
    max-height: calc(90vh);
    max-width: calc(90vw);
}

.popup-view .text-panel {
    position: absolute;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) , rgba(0, 0, 0, 0.5));
    padding: 15px;
    text-align: left;
    width: 100%;
    
}

.popup-view .text-panel .title {
    font-size: 16px;
    font-weight: 400;
    color: white;
    padding-bottom: 10px;

}
.popup-view .text-panel .description {
    font-family: 'roboto';
    font-weight: 300;
    font-size: 14px;
    color: white;
}

@media screen and (max-width: 1440px) {
    .photogallery .item { 
        width:calc(20%);
    }
}

@media screen and (max-width: 1000px) {
    .photogallery .item { 
        width:calc(25%);
    }
}

@media screen and (max-width: 768px) {
    .photogallery .item { 
        width:calc(33.333%);
    }
}

@media screen and (max-width: 480px) {
    .photogallery .item { 
        width:calc(50%);
    }
}

.mfp-title {
   font-style: normal;
   font-family: "Roboto";
   font-size: 16px;
   padding-top: 3px;
}
.mfp-close {
    color:#ccc !important;
}
