#process{padding-bottom:100px;padding-top:40px}.process-flow>li{text-align:center;margin:0 auto;max-width:256px;opacity:.2;-webkit-transition:opacity .7s ease-out 0s;-moz-transition:opacity .7s ease-out 0s;-ms-transition:opacity .7s ease-out 0s;-o-transition:opacity .7s ease-out 0s;transition:opacity .7s ease-out 0s}.process-flow>li.active{opacity:1}.process-flow>li p{margin-bottom:0;font-size:10px;opacity:0;-moz-transition:all 300ms ease-out;-o-transition:all 300ms ease-out;-webkit-transition:all 300ms ease-out;transition:all 300ms ease-out}.process-flow>li p.active{opacity:1}.process-flow>li.left p{position:absolute;top:0;right:80%;width:66%;text-align:right}.process-flow>li.right p{position:absolute;top:0;left:80%;width:66%;text-align:right}.process-flow>li p>span{display:block}.process-flow>li p label.label{font-size:12px;display:inline-block;color:#555;font-weight:600;margin:6px 0 0;padding:0 5px;float:left}.process-flow>li p label.value{font-size:14px;font-weight:400;display:inline-block;color:#555;margin:0}.process-node{background:none repeat scroll 0 0 rgba(254,142,34,0);-moz-border-radius:100%;border-radius:100%;-webkit-border-radius:100%;height:100px;margin:auto;position:relative;-webkit-transition:background .6s ease-out 0s;-ms-transition:background .6s ease-out 0s;-moz-transition:background .6s ease-out 0s;-o-transition:background .6s ease-out 0s;transition:background .6s ease-out 0s;width:100px;text-align:center}.process-flow>li.left .process-node.active:before{opacity:0;-moz-transition:all 300ms ease-out;-o-transition:all 300ms ease-out;-webkit-transition:all 300ms ease-out;transition:all 300ms ease-out}.process-flow>li.right .process-node.active:before{opacity:0;-moz-transition:all 300ms ease-out;-o-transition:all 300ms ease-out;-webkit-transition:all 300ms ease-out;transition:all 300ms ease-out}.process-flow>li.left .process-node.arrow.active:before{right:98%;top:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-color:rgba(5,148,114,0);border-right-color:#059472;border-width:10px;margin-top:-10px;opacity:1}.process-flow>li.right .process-node.arrow.active:before{left:98%;top:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-color:rgba(5,148,114,0);border-left-color:#059472;border-width:10px;margin-top:-10px;opacity:1}.process-node i{font-size:30px;color:#fff;opacity:1;position:relative;top:35px;-webkit-transition:opacity .6s ease-out 0s;-moz-transition:opacity .6s ease-out 0s;-ms-transition:opacity .6s ease-out 0s;-o-transition:opacity .6s ease-out 0s;transition:opacity .6s ease-out 0s}.process-node label.label{font-size:12px;display:block;position:relative;top:32px;font-weight:normal}.process-node label.value{font-size:20px;display:block;position:relative;top:24px;font-weight:normal;color:#fff}.process-node i:last-child{opacity:0}.process-node.active{background:none repeat scroll 0 0 #059472;cursor:pointer}.process-node.active label{cursor:pointer}.process-node.active i:first-child{opacity:0}.process-node.active i:last-child{opacity:1}.line{background:none repeat scroll 0 0 rgba(255,255,255,.1);height:7em;margin:auto;width:4px}.line.active .progress{height:7em}.progress{background:none repeat scroll 0 0 #3b8ea5;height:0;-webkit-transition:height 1.2s ease-out 0s;-moz-transition:height 1.2s ease-out 0s;-ms-transition:height 1.2s ease-out 0s;-o-transition:height 1.2s ease-out 0s;transition:height 1.2s ease-out 0s;width:80%}@media(min-width:768px){.project-description{text-align:center}.portfolio-items article{width:49.4%}.process-flow{max-width:750px;padding:0;margin:0 auto}.process-flow>li{clear:right;float:left;height:120px;margin:0;position:relative;width:256px}.process-flow>li .line{height:400px;position:absolute;right:-48%;top:-6.7em;-moz-transform:rotate(-75deg);-webkit-transform:rotate(-75deg);-o-transform:rotate(-75deg);-ms-transform:rotate(-75deg);transform:rotate(-75deg)}.process-flow>li .line.active .progress{height:400px}.process-flow>li:nth-child(2n){clear:left;float:right}.process-flow>li:nth-child(2n) .line{left:-242%;-moz-transform:rotate(75deg);-webkit-transform:rotate(75deg);-o-transform:rotate(75deg);-ms-transform:rotate(75deg);transform:rotate(75deg)}}.user-age{font-size:12px;font-weight:normal;padding-right:5px}@media(max-width:768px){.process-flow>li.right p,.process-flow>li.left p{position:static;top:0;right:80%;width:inherit;text-align:center;margin-top:-10px;margin-bottom:5px}}