.work-nav{text-align:center;margin:-60px 0 60px 0}.work-nav a{display:inline-block;position:relative;margin:0 10px}.work-nav .tw{position:absolute;top:0;left:0;width:100%;white-space:nowrap;opacity:0;font-size:.875em}.work-nav .en,.work-nav .tw{-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.work-nav a:hover .en{opacity:0}.work-nav a:hover .tw{opacity:1}.work-nav a.active{color:#FFF}.work-nav a.active:after{content:"";margin-top:5px;height:4px;background:#1a1a1a;display:block}.work-item{position:relative;padding:0 45% 0 20%;margin-bottom:10%}.work-item:nth-child(even){padding:0 20% 0 45%}.work-item:last-child{margin-bottom:0}.work-line{position:absolute;top:50%;left:0;width:0%;height:1px;background:#333;-moz-transition:width 1s;-o-transition:width 1s;-webkit-transition:width 1s;transition:width 1s}.show .work-line{width:100%}.work-img{position:relative;z-index:1;overflow:hidden}.work-img:after{content:"";position:absolute;bottom:0;width:100%;height:100%;background:#222;-moz-transition:height .6s;-o-transition:height .6s;-webkit-transition:height .6s;transition:height .6s}.show .work-img:after{height:0}.work-img img{width:100%;-moz-transition:-moz-transform 1s;-o-transition:-o-transform 1s;-webkit-transition:-webkit-transform 1s;transition:transform 1s}.work-item a:hover .work-img img{-moz-transform:scale(1.2);-ms-transform:scale(1.2);-webkit-transform:scale(1.2);transform:scale(1.2)}.work-info{position:absolute;left:55%;top:60%;margin:0 50px}.work-item:nth-child(even) .work-info{right:55%;left:auto;text-align:right}.work-name{color:#FFF;font-size:1.25em;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.show .work-name{opacity:1}.work-bar{width:0px;height:4px;margin:10px 0;background:#1a1a1a;-moz-transition:width .6s;-o-transition:width .6s;-webkit-transition:width .6s;transition:width .6s}.show .work-bar{width:200px}.work-sort{position:absolute;right:20%;bottom:50%;font-size:1.25em;color:#404040;-moz-transform:translateX(10%);-ms-transform:translateX(10%);-webkit-transform:translateX(10%);transform:translateX(10%);opacity:0;-moz-transition:-moz-transform .6s,opacity .6s;-o-transition:-o-transform .6s,opacity .6s;-webkit-transition:-webkit-transform .6s,opacity .6s;transition:transform .6s,opacity .6s}.show .work-sort{opacity:1;-moz-transform:translateX(0%);-ms-transform:translateX(0%);-webkit-transform:translateX(0%);transform:translateX(0%)}.work-item:nth-child(even) .work-sort{left:20%;-moz-transform:translateX(-10%);-ms-transform:translateX(-10%);-webkit-transform:translateX(-10%);transform:translateX(-10%)}.work-item:nth-child(even).show .work-sort{-moz-transform:translateX(0%);-ms-transform:translateX(0%);-webkit-transform:translateX(0%);transform:translateX(0%)}.work-more{font-size:.75em;clear:both;opacity:0;-moz-transform:translateY(-20px);-ms-transform:translateY(-20px);-webkit-transform:translateY(-20px);transform:translateY(-20px);-moz-transition:-moz-transform .6s,opacity .6s;-o-transition:-o-transform .6s,opacity .6s;-webkit-transition:-webkit-transform .6s,opacity .6s;transition:transform .6s,opacity .6s}.work-item a:hover .work-more{opacity:1;-moz-transform:translateY(0px);-ms-transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px)}@media screen and (max-width: 1100px){.work-nav a.active{color:#000}.work-nav a.active:after{background:#ddd}.work-item{padding:0 55% 0 10%}.work-item:nth-child(even){padding:0 10% 0 55%}.work-line{background:#eee}.work-img:after{background:#FFF}.work-name{color:#000}.work-bar{background:#ddd}.work-sort{right:10%;color:#ddd}.work-item:nth-child(even) .work-sort{left:10%}.work-info{left:45%}.work-item:nth-child(even) .work-info{right:45%}.work-name{font-size:1em}}@media screen and (max-width: 800px){.work-list{max-width:600px;margin:auto}.work-item{padding:0 20px}.work-item:after{content:"";display:block;clear:both}.work-item:nth-child(even){padding:0 20px}.work-info{position:static;margin:0}.work-line{position:static;margin:10px 0}.work-item:nth-child(even) .work-bar{float:right}.work-sort{display:none}.show .work-more{opacity:1;-moz-transform:translateY(0px);-ms-transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px)}}@media screen and (max-width: 640px){.work-nav{margin-top:-20px;margin-bottom:20px}.work-nav a{display:block;margin:10px 20px}.work-nav a.active:after{height:1px}}