/* 
	root element for the scrollable. 
	when scrolling occurs this element stays still. 
*/
.photolist{height:490px}
.scroll{position:relative;overflow:hidden;height:100%;width:100%}
.scroll .items{width:20000em;position:absolute;clear:both}
.scroll .itcol{position:relative;float:left;height:100%;width:204px;padding:0;margin:0 10px 0 0;display:block}
.scroll .itrow{position:relative;float:left;margin:0 0 10px 0;padding:4px;display:block}
.scroll .itrow .linkbox{position:absolute;top:0;left:0;width:100%;height:100%;display:block;border:1px solid #bfbfbf}
.scroll .itrow:hover .linkbox{border:1px solid #4c4741}
.scroll .itrow .minfo{position:absolute;bottom:0;left:0;height:30px;width:100%;line-height:30px;font-size:12px;background-color:rgba(77,71,65,.8);display:block}
.scroll .itrow .minfo b{padding:0 8px;font-weight:300;color:#ccc}
.scroll .itrow:hover .minfo{background-color:rgba(77,71,65,1)}
.scroll .itrow:hover .minfo b{color:#fff}
.scroll .itrow .dwnbox{position:absolute;bottom:4px;right:4px;width:30px;height:30px;overflow:hidden;background-image:url(../images/bg-arrow.png);background-color:rgba(23,23,23,.5);-moz-opacity:.7;-khtml-opacity:.7;opacity:.7;display:block}
.scroll .itrow .dwnbox:hover{background-color:rgba(23,23,23,.8);-moz-opacity:1;-khtml-opacity:1;opacity:1}
.scroll .mpic{position:relative;display:block}

/* prev, next, prevPage and nextPage buttons */
#photocon a.next,#photocon a.prev{position:absolute;top:120px;width:50px;height:490px;background-repeat:no-repeat;background-position:center center;background-size:60px 60px;cursor:pointer;display:block;z-index:2000}
#photocon a.prev{left:0;background-image:url(../images/bt-left-1.png)}
#photocon a.next{right:0;background-image:url(../images/bt-right-1.png)}
#photocon a.prev:hover{background-image:url(../images/bt-left-0.png)}
#photocon a.next:hover{background-image:url(../images/bt-right-0.png)}
#photocon a.disabled{visibility:hidden!important}

#popup{position:fixed;top:-120%;left:0;background:#fff url(../images/loading.gif) center center no-repeat;width:100%;height:100%;display:block;z-index:9000}
#popup.popshow{top:0}
#wrap{position:absolute;top:0;left:0;width:100%;height:100%}
#desc{position:absolute;bottom:0;left:0;width:100%;padding:15px 0;color:#fff;background-color:rgba(77,71,65,.8);overflow:hidden;text-align:center}
#popup a.close{position:absolute;top:10px;right:10px;width:49px;height:49px;cursor:pointer;background-image:url(../images/bt-close-2.png)}
#popup a.close:hover{background-color:rgba(255,255,255,.4)}
#popup a.nextItm,#popup a.prevItm{position:absolute;width:50px;height:50%;background-repeat:no-repeat;background-position:center center;background-size:60px 60px;cursor:pointer;display:block;z-index:2000}
#popup a.prevItm{left:0;background-image:url(../images/bt-left-0.png)}
#popup a.nextItm{right:0;background-image:url(../images/bt-right-0.png)}
#popup a.prevItm:hover{background-image:url(../images/bt-left-1.png)}
#popup a.nextItm:hover{background-image:url(../images/bt-right-1.png)}
#popup a.nextItm:hover,#popup a.prevItm:hover{background-color:rgba(0,0,0,.4)}
#popup a.disabled{visibility:hidden!important}
#popup a.nextItm,#popup a.prevItm{top:25%;width:50px}
.icpin{width:20px;height:20px;display:block;float:right;margin-right:20px;background-image:url(../images/pinterest.png)}

/* background */
#wrap,#popup a.close,.scroll .itrow .dwnbox
{background-repeat:no-repeat;background-position:center center;-webkit-background-size:contain;-moz-background-size:contain;-o-background-size:contain;background-size:contain}
.scroll .mpic,.icpin
{background-repeat:no-repeat;background-position:center center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}

@media (max-width:768px){
#slidenav,#slideshd,.panes,a.backward,a.forward,#photocon a.next,#photocon a.prev{display:none}
#photocon,.scroll{height:auto}
.scroll .items{width:100%;height:auto;position:relative}
.scroll .itcol{width:100%;margin:0}
.scroll .itrow{width:33.33%;margin:0;padding:1px}
.scroll .itrow .linkbox{border:1px solid #fff}
.scroll .itrow .linkbox:hover{border:1px solid #fff;background-color:rgba(255,255,255,.4)}
.scroll .itrow .minfo{overflow:hidden}
.scroll .itrow .dwnbox{bottom:1px;right:1px}
}

@media (max-width:640px){
.scroll .itrow{padding:0}
.scroll .itrow .minfo,.scroll .itrow .dwnbox{display:none}
}

/* transition */
.scroll .itrow .linkbox,scroll .itrow:hover .linkbox,
.scroll .itrow .minfo,.scroll .itrow:hover .minfo,
.scroll .itrow .minfo b,.scroll .itrow:hover .minfo b,
.scroll .itrow .dwnbox,.scroll .itrow .dwnbox:hover,
#photocon a.prev, #photocon a.next,
#photocon a.prev:hover, #photocon a.next:hover,
#popup,#popup.popshow,
#popup a.close,#popup a.close:hover,
#popup a.prevItm, #popup a.nextItm,
#popup a.prevItm:hover,#popup a.nextItm:hover
{-o-transition:all .3s;-ms-transition:all .3s;-moz-transition:all .3s;-webkit-transition:all .3s;transition:all .3s}
