.tg-img-wrapper, .tg-overlay, .tg-placeHolder, .tg-placeHolder div, .thumb-grid .thumbWrapper, .thumb-grid img{-webkit-backface-visibility: hidden;}
.tg-container, .tg-img-wrapper{overflow: hidden; max-width: 100%; max-height: 100% !important;}
.tg-close, .thumb-grid .thumbWrapper{background-color: rgba(0, 0, 0, .2); cursor: pointer;}
.tg-container *{box-sizing: border-box;}
.tg-container{position: relative; margin: 0 auto; min-height: 150px; max-height: 75%;}
.thumb-grid{position: absolute; bottom: 0 !important; padding: 0 !important; width: 100%; margin: 0 auto; list-style: none; font-size: 0; text-align: center; white-space: nowrap; bottom: 0; line-height: 0; border: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.thumb-grid img{opacity: 0; border: none;}
.thumb-grid.active img{opacity: 1; border: none;}
.thumb-grid .thumbWrapper{cursor: pointer; position: relative; margin: 0; overflow: hidden; display: inline-block !important; backface-visibility: hidden;}
.inline-full-box:hover:after, .thumb-grid:not(.full-inline) .thumbWrapper:hover:after{font-family: thumbgrid; content: '\e804'; position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: auto; font-size: 18px; width: 44px; height: 44px; border-radius: 100%; display: block; line-height: 44px; text-align: center; z-index: 1; color: #fff; font-style: normal; font-weight: 100; background-color: rgba(0, 0, 0, .5); border: none;}
.tg-close:after, .tg-next:after, .tg-prev:after{font-family: thumbgrid; font-size: 38px;}
.inline-full-box:hover:after{left: auto; top: 10px; bottom: auto; right: 10px; margin: inherit;}
.thumb-grid .thumbWrapper .thumb_box{width: 100%; height: auto; transition: All 1s ease; -webkit-transition: All .3s ease; -moz-transition: All .3s ease;}
.thumb-grid li{margin-top: 0 !important; border: 1px solid rgba(0,0,0,0.03); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.thumb-grid li:nth-of-type(2n+0){margin: 0 7px !important;}
.thumb-grid li .thumb_box{transform: rotate(0) scale(1) skew(0) translate(0); -webkit-backface-visibility: hidden; opacity: .9;}
.thumb-grid li:hover .thumb_box{transform: rotate(0) scale(1.1) skew(0) translate(0); -webkit-backface-visibility: hidden; opacity: 1;}
.inline-full-img, .inline-full-img:hover{-webkit-backface-visibility: hidden; opacity: 1;}
.inline-full-box{overflow: hidden; border-bottom: 1px solid rgba(0,0,0,0.15) !important;}
.inline-full-img{transform: rotate(0) scale(1) skew(0) translate(0); transition: all .3s;}
.inline-full-img:hover{transform: rotate(0) scale(1.05) skew(0) translate(0);}
div.thumbGridNav{margin-top: 0; margin-bottom: 0; text-align: center; height: 30px !important;}
div.thumbGridNav a{display: inline-block; margin: 8px 6px 3px 6px; width: 15px; height: 15px; border-radius: 50%; opacity: .3; -webkit-transition: all .5s; transition: all .5s; overflow: hidden; text-indent: -1000px; cursor: pointer; color: #000; border: 1px solid #000;}
div.thumbGridNav a:hover{opacity: .5; background: #000;}
div.thumbGridNav a.sel{opacity: 1; background: #000;}
div.thumbGridNav.waiting a.sel{opacity: .4; border: 0;}
div.thumbGridNav.waiting a:not(.sel){opacity: .1; cursor: default;}
.tg-icon{font-style: normal !important;}
.tg-overlay{transition: All 2s ease; -webkit-transition: All .3s ease; -moz-transition: All .3s ease; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999999;}
.tg-next, .tg-prev{width: 40px; height: 40px; background-color: rgba(0, 0, 0, .2); cursor: pointer;}
.tg-close, .tg-next{position: absolute; -webkit-transition: all .4s; transition: all .4s; text-align: right;}
.tg-close{-webkit-transition: all .4s; transition: all .4s; top: 10px; right: 10px; width: 38px; height: 37px; color: rgba(255, 255, 255, 1); background-color: rgba(0, 0, 0, .2); border-radius: 3px; padding: 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; cursor: pointer;}
.tg-next{transition: all .4s; right: 5px;}
.tg-next, .tg-prev{-webkit-transition: all .4s; position: absolute; top: 0; bottom: 0; margin: auto; border-radius: 100%; color: rgba(255, 255, 255, .6);}
.tg-next.disabled, .tg-prev.disabled{opacity: .4 !important;}
.tg-prev{transition: all .4s; left: 5px; text-align: left;}
.tg-img-wrapper, .tg-spinner{top: 0; height: 100%; margin-left: 0; position: absolute; width: 100%;}
.tg-close:after{content: '\e80c'; font-weight: 300; cursor: pointer; line-height: 1; padding: 0 !important; text-align: left !important; top: .125em !important; margin-right: .4em !important;}
.tg-next:after, .tg-prev:after{line-height: 42px; font-weight: 300;}
.tg-next:after{content: '\e80d'; padding-right: 0; top: .125em !important; margin-right: .4em !important;}
.tg-prev:after{content: '\e80e'; padding-left: 0; top: .125em !important; margin-right: .4em !important;}
.tg-next:hover, .tg-prev:hover{background-color: rgba(255, 255, 255, 1); color: rgba(0, 0, 0, 1);}
.tg-close:hover{color: rgba(255, 255, 255, 1); background: rgba(255, 0, 0, 0.8);}
.tg-spinner{right: 0; margin-top: 0; background: 0;}
.tg-img-wrapper{left: 0;}
.tg-img-wrapper label{display: block; position: absolute; bottom: 0; left: 0; background: rgba(0, 0, 0, .6); width: 100%; padding: 10px;}
.tg-img-wrapper label .ss-img-index{display: inline-block; color: rgba(255, 255, 255, .5); padding: 0 10px 5px 0; font-weight: 300;}
.tg-img-caption{color: #fff;}
.tg-captionBox{position: absolute; z-index: 1000; width: 100%; max-height: 80px; bottom: 0; color: #fff; font-size: 14px; text-align: left; padding: 10px; background: rgba(0, 0, 0, .5);}

@media (max-width:1024px){
    .tg-container{width: 100%;}
    .thumb-grid li{margin: 4px; height: 200px; width: 49%;}
    div.thumbGridNav{margin-top: 20px; text-align: center;}
    .thumb-grid .thumbWrapper:hover:after{content: ''; background-color: transparent;}
    .tg-next, .tg-next:hover, .tg-prev, .tg-prev:hover{background-color: rgba(255, 255, 255, 0); color: rgba(255, 255, 255, 1);}
}

@media (max-width:480px){
    div.thumbGridNav a{margin: 0 8px; width: 10px; height: 10px; border-radius: 100%;}
    .thumb-grid .tg-next, .thumb-grid .tg-prev{visibility: hidden;}
}

.tg-placeHolder{box-shadow: 0 0 5px rgba(0, 0, 0, .6); background: rgba(0,0,0,0.5);}
.tg-overlay{background: linear-gradient(135deg, rgba(0, 0, 0, .78) 0, rgba(23, 23, 23, .6) 100%);}
/*.thumb-grid .thumbWrapper{width: 100%; height: 400px;}*/