#shadowbox {
    display: none;
    background: rgba(95, 95, 95, .5);
    z-index: 100;
    position: fixed;
    padding: 0;
    margin: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.portfolioClip {
    clip-path: inset(50% 50% 50% 50%);
    max-width: 200px;
    height: auto;
    overflow: hidden;
    -webkit-animation: shrink 1s;
    animation: shrink 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    position: relative;
    z-index: 5;
    height: 200px;
    top: -210px;
    margin-bottom: -200px;
    font-family: 'Lato', sans-serif;
    background: #fff;padding:5px;
}

.thumbPic:hover+.portfolioClip,
.portfolioClip:hover {
    -webkit-animation: grow 1s;
    animation: grow 1s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}
/* LargeImages */
.fullimagebox{
    display: none;
    z-index:110;
    background:#fff;
    width:100%;
    height: 100%;
    position:fixed;
    left: 0;
    top: 0;
    overflow: auto;
}
.fullimage {text-align: center;padding:15px;}
.fullimage img{width:90%;height:auto;}
@keyframes grow {
    0% {
        clip-path: inset(50% 50% 50% 50%);
    }
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes shrink {
    0% {
        clip-path: inset(0 0 0 0);
    }
    100% {
        clip-path: inset(50% 50% 50% 50%);
    }
}
.show {display: block !important;}
.close {
    float: right;
    border: 1px solid #000;
}

.close a {
    width: 50px;
    height: 50px;
}

.shaded {
    box-shadow: 0px 1px 1px #333;
}

.thumbBox {
    max-width: 200px;
    float: left;
    margin: 10px;
    cursor: pointer;
}

.thumbPic {
    position: relative;
    z-index: 1;
    max-width: 200px;
    cursor: pointer;
}
.galleryBox{
    margin:0px auto;
    width:660px;
}
@media screen and (max-width:1280px){
    .galleryBox{ width:440px;}
}
@media screen and (max-width:980px){
    .galleryBox{ width:580px;}
    .portfolioClip {max-width: 260px;height: 260px;top: -260px;margin-bottom: -260px;}
    .thumbPic, .thumbBox {max-width: 260px;}
}
@media screen and (max-width:900px){
    .galleryBox{ width:450px;}
    .portfolioClip {max-width: 200px;height: 200px;top: -210px;margin-bottom: -200px;}
    .thumbPic, .thumbBox {max-width: 200px;}
}
@media screen and (max-width:710px){
    .galleryBox{ width:364px;}
    .portfolioClip {max-width: 150px;height: 150px;top: -160px;margin-bottom: -150px;}
    .thumbPic, .thumbBox {max-width: 150px;}
}
@media screen and (max-width:450px){
    .galleryBox{ width:290px;}
    .portfolioClip {max-width: 260px;height: 260px;top: -260px;margin-bottom: -260px;}
    .thumbPic, .thumbBox {max-width: 260px;}
}